diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md
index 63f79fa10..93e104db8 100644
--- a/.github/CONTRIBUTING.md
+++ b/.github/CONTRIBUTING.md
@@ -1,48 +1,12 @@
 # Contributing
 
-## Requirements
-
-Before getting started, ensure your system has access to the following tools:
-
-- [Node.js](https://nodejs.org/)
-- [Rustup](https://rustup.rs/)
-- [pnpm](https://pnpm.io/)
-
-## Getting started
-
-```sh
-# Install dependencies
-pnpm install
-
-# Install Rust toolchain and WASM targets
-rustup default stable
-rustup target add wasm32-wasip1-threads
-
-# Build the project
-pnpm build
-```
-
-## Development workflow
-
-During development, you can run tests in watch mode:
-
-```sh
-pnpm tdd
-```
-
-The `playgrounds` directory contains example projects you can use to test your changes. To start the Vite playground, use:
-
-```sh
-pnpm build && pnpm vite
-```
-
 ## Bug fixes
 
 If you've found a bug in Tailwind that you'd like to fix, [submit a pull request](https://github.com/tailwindlabs/tailwindcss/pulls) with your changes. Include a helpful description of the problem and how your changes address it, and provide tests so we can verify the fix works as expected.
 
 ## New features
 
-If there's a new feature you'd like to see added to Tailwind, [share your idea with us](https://github.com/tailwindlabs/tailwindcss/discussions/new?category=ideas) in our discussion forum to get it on our radar as something to consider for a future release before starting work on it.
+If there's a new feature you'd like to see added to Tailwind, [share your idea with us](https://github.com/tailwindlabs/tailwindcss/discussions/new?category=ideas) in our discussion forum to get it on our radar as something to consider for a future release.
 
 **Please note that we don't often accept pull requests for new features.** Adding a new feature to Tailwind requires us to think through the entire problem ourselves to make sure we agree with the proposed API, which means the feature needs to be high on our own priority list for us to be able to give it the attention it needs.
 
@@ -50,7 +14,7 @@ If you open a pull request for a new feature, we're likely to close it not becau
 
 ## Coding standards
 
-Our code formatting rules are defined in the `"prettier"` section of [package.json](https://github.com/tailwindlabs/tailwindcss/blob/main/package.json). You can check your code against these standards by running:
+Our code formatting rules are defined in the `"prettier"` section of [package.json](https://github.com/tailwindcss/tailwindcss/blob/main/package.json). You can check your code against these standards by running:
 
 ```sh
 pnpm run lint
@@ -64,40 +28,10 @@ pnpm run format
 
 ## Running tests
 
-You can run the TypeScript and Rust test suites using the following command:
+You can run the test suite using the following commands:
 
 ```sh
-pnpm test
+pnpm build && pnpm test
 ```
 
-To run the integration tests, use:
-
-```sh
-pnpm build && pnpm test:integrations
-```
-
-Additionally, some features require testing in browsers (i.e. to ensure CSS variable resolution works as expected). These can be run via:
-
-```sh
-pnpm build && pnpm test:ui
-```
-
-Please ensure that all tests are passing when submitting a pull request. If you're adding new features to Tailwind CSS, always include tests.
-
-After a successful build, you can also use the npm package tarballs created inside the `dist/` folder to install your build in other local projects.
-
-## Pull request process
-
-When submitting a pull request:
-
-- Ensure the pull request title and description explain the changes you made and why you made them.
-- Include a test plan section that outlines how you tested your contributions. We do not accept contributions without tests.
-- Ensure all tests pass. You can add the tag `[ci-all]` in your pull request description to run the test suites across all platforms.
-
-When a pull request is created, Tailwind CSS maintainers will be notified automatically.
-
-## Communication
-
-- **GitHub discussions**: For feature ideas and general questions
-- **GitHub issues**: For bug reports
-- **GitHub pull requests**: For code contributions
+Please ensure that the tests are passing when submitting a pull request. If you're adding new features to Tailwind, please include tests.
diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml
deleted file mode 100644
index 848c851b1..000000000
--- a/.github/FUNDING.yml
+++ /dev/null
@@ -1 +0,0 @@
-custom: ['https://tailwindcss.com/sponsor']
diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index aa0793aa3..ce7fafb97 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -4,26 +4,8 @@
 
 **Please ask first before starting work on any significant new features.**
 
-It's never a fun experience to have your pull request declined after investing a lot of time and effort into a new feature. To avoid this from happening, we request that contributors create a discussion to first discuss any significant new features.
+It's never a fun experience to have your pull request declined after investing a lot of time and effort into a new feature. To avoid this from happening, we request that contributors create an issue to first discuss any significant new features. This includes things like adding new utilities, creating new at-rules, or adding new component examples to the documentation.
 
-For more info, check out the contributing guide:
-
-https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md
-
--->
-
-## Summary
-
-<!--
-
-Provide a summary of the issue and the changes you're making. How does your change solve the problem?
-
--->
-
-## Test plan
-
-<!--
-
-Explain how you tested your changes. Include the exact commands that you used to verify the change works and include screenshots/screen recordings of the update behavior in the browser if applicable.
+https://github.com/tailwindcss/tailwindcss/blob/master/.github/CONTRIBUTING.md
 
 -->
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 5ae59e80f..e3844c305 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -8,18 +8,12 @@ on:
 permissions:
   contents: read
 
-env:
-  NODE_VERSION: 24
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
 jobs:
   tests:
     strategy:
       fail-fast: false
       matrix:
+        node-version: [20]
         runner:
           - name: Windows
             os: windows-latest
@@ -27,19 +21,17 @@ jobs:
           - name: Linux
             os: namespace-profile-default
 
-          # Playwright 1.62+ dropped WebKit support for macOS 14, and hangs
-          # instead of failing when launching WebKit on a macos-14 runner.
           - name: macOS
-            os: macos-15
+            os: macos-14
 
         # Exclude windows and macos from being built on feature branches
-        run-all:
-          - ${{ github.ref == 'refs/heads/main' || contains(github.event.pull_request.body, '[ci-all]') || github.event.pull_request.user.login == 'depfu[bot]' }}
+        on-main-branch:
+          - ${{ github.ref == 'refs/heads/main' }}
         exclude:
-          - run-all: false
+          - on-main-branch: false
             runner:
               name: Windows
-          - run-all: false
+          - on-main-branch: false
             runner:
               name: macOS
 
@@ -49,21 +41,21 @@ jobs:
     name: ${{ matrix.runner.name }}
 
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
-      - uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
 
-      - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
         with:
-          node-version: ${{ env.NODE_VERSION }}
+          node-version: ${{ matrix.node-version }}
+          cache: 'pnpm'
 
       # Cargo already skips downloading dependencies if they already exist
       - name: Cache cargo
-        uses: actions/cache@27d5ce7f107fe9357f9df03efb73ab90386fccae # v5
+        uses: actions/cache@v4
         with:
           path: |
+            ~/.cargo/bin/
             ~/.cargo/registry/index/
             ~/.cargo/registry/cache/
             ~/.cargo/git/db/
@@ -72,25 +64,17 @@ jobs:
 
       # Cache the `oxide` Rust build
       - name: Cache oxide build
-        uses: actions/cache@27d5ce7f107fe9357f9df03efb73ab90386fccae # v5
+        uses: actions/cache@v4
         with:
           path: |
+            ./target/
             ./crates/node/*.node
-            ./crates/node/*.wasm
-            ./crates/node/index.d.ts
             ./crates/node/index.js
-            ./crates/node/browser.js
-            ./crates/node/tailwindcss-oxide.wasi-browser.js
-            ./crates/node/tailwindcss-oxide.wasi.cjs
-            ./crates/node/wasi-worker-browser.mjs
-            ./crates/node/wasi-worker.mjs
+            ./crates/node/index.d.ts
           key: ${{ runner.os }}-oxide-${{ hashFiles('./crates/**/*') }}
 
-      - name: Setup WASM target
-        run: rustup target add wasm32-wasip1-threads
-
       - name: Install dependencies
-        run: pnpm install --frozen-lockfile
+        run: pnpm install
 
       - name: Build
         run: pnpm run build
@@ -112,13 +96,9 @@ jobs:
       - name: Run Playwright tests
         run: npm run test:ui
 
-  notify:
-    if: ${{ always() && github.ref == 'refs/heads/main' && needs.tests.result == 'failure' }}
-    needs: tests
-    runs-on: ubuntu-latest
-    steps:
       - name: Notify Discord
-        uses: discord-actions/message@5c7149c81a83146e5d01f142be1bf87a61831c4d # v2
+        if: failure() && github.ref == 'refs/heads/main'
+        uses: discord-actions/message@v2
         with:
           webhookUrl: ${{ secrets.DISCORD_WEBHOOK_URL }}
-          message: 'The [most recent ${{ github.workflow }} workflow](<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}>) on the `main` branch has failed.'
+          message: 'The [most recent build](<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}>) on the `main` branch has failed.'
diff --git a/.github/workflows/integration-tests.yml b/.github/workflows/integration-tests.yml
index 457c38424..55fac5cb1 100644
--- a/.github/workflows/integration-tests.yml
+++ b/.github/workflows/integration-tests.yml
@@ -8,18 +8,13 @@ on:
 permissions:
   contents: read
 
-env:
-  NODE_VERSION: 24
-
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
 jobs:
   tests:
     strategy:
       fail-fast: false
       matrix:
+        node-version: [20]
+
         runner:
           - name: Windows
             os: windows-latest
@@ -35,17 +30,16 @@ jobs:
           - vite
           - cli
           - postcss
-          - oxide
-          - webpack
+          - workers
 
         # Exclude windows and macos from being built on feature branches
-        run-all:
-          - ${{ github.ref == 'refs/heads/main' || contains(github.event.pull_request.body, '[ci-all]') }}
+        on-main-branch:
+          - ${{ github.ref == 'refs/heads/main' }}
         exclude:
-          - run-all: false
+          - on-main-branch: false
             runner:
               name: Windows
-          - run-all: false
+          - on-main-branch: false
             runner:
               name: macOS
 
@@ -55,25 +49,21 @@ jobs:
     name: ${{ matrix.runner.name }} /  ${{ matrix.integration }}
 
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
-      - uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
 
-      - run: |
-          git config --global user.name "github-actions[bot]"
-          git config --global user.email "41898282+github-actions[bot]@users.noreply.github.com"
-
-      - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v4
         with:
-          node-version: ${{ env.NODE_VERSION }}
+          node-version: ${{ matrix.node-version }}
+          cache: 'pnpm'
 
       # Cargo already skips downloading dependencies if they already exist
       - name: Cache cargo
-        uses: actions/cache@27d5ce7f107fe9357f9df03efb73ab90386fccae # v5
+        uses: actions/cache@v4
         with:
           path: |
+            ~/.cargo/bin/
             ~/.cargo/registry/index/
             ~/.cargo/registry/cache/
             ~/.cargo/git/db/
@@ -82,23 +72,15 @@ jobs:
 
       # Cache the `oxide` Rust build
       - name: Cache oxide build
-        uses: actions/cache@27d5ce7f107fe9357f9df03efb73ab90386fccae # v5
+        uses: actions/cache@v4
         with:
           path: |
+            ./target/
             ./crates/node/*.node
-            ./crates/node/*.wasm
-            ./crates/node/index.d.ts
             ./crates/node/index.js
-            ./crates/node/browser.js
-            ./crates/node/tailwindcss-oxide.wasi-browser.js
-            ./crates/node/tailwindcss-oxide.wasi.cjs
-            ./crates/node/wasi-worker-browser.mjs
-            ./crates/node/wasi-worker.mjs
+            ./crates/node/index.d.ts
           key: ${{ runner.os }}-oxide-${{ hashFiles('./crates/**/*') }}
 
-      - name: Setup WASM target
-        run: rustup target add wasm32-wasip1-threads
-
       - name: Install dependencies
         run: pnpm install
 
@@ -113,13 +95,9 @@ jobs:
         env:
           GITHUB_WORKSPACE: ${{ github.workspace }}
 
-  notify:
-    if: ${{ always() && github.ref == 'refs/heads/main' && needs.tests.result == 'failure' }}
-    needs: tests
-    runs-on: ubuntu-latest
-    steps:
       - name: Notify Discord
-        uses: discord-actions/message@5c7149c81a83146e5d01f142be1bf87a61831c4d # v2
+        if: failure() && github.ref == 'refs/heads/main'
+        uses: discord-actions/message@v2
         with:
           webhookUrl: ${{ secrets.DISCORD_WEBHOOK_URL }}
-          message: 'The [most recent ${{ github.workflow }} workflow](<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}>) on the `main` branch has failed.'
+          message: 'The [most recent build](<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}>) on the `main` branch has failed.'
diff --git a/.github/workflows/prepare-release.yml b/.github/workflows/prepare-release.yml
index 24e829afd..ce0ad15aa 100644
--- a/.github/workflows/prepare-release.yml
+++ b/.github/workflows/prepare-release.yml
@@ -2,29 +2,18 @@ name: Prepare Release
 
 on:
   workflow_dispatch:
-    inputs:
-      dry_run:
-        description: Skip creating the draft GitHub release
-        required: false
-        default: true
-        type: boolean
   push:
     tags:
       - 'v*'
 
 env:
   APP_NAME: tailwindcss-oxide
-  NODE_VERSION: 24
-  PNPM_VERSION: '11.9.0'
+  NODE_VERSION: 20
   OXIDE_LOCATION: ./crates/node
 
 permissions:
   contents: read
 
-concurrency:
-  group: ${{ github.workflow }}-${{ github.ref }}
-  cancel-in-progress: true
-
 jobs:
   build:
     strategy:
@@ -54,97 +43,96 @@ jobs:
           - os: ubuntu-latest
             target: x86_64-unknown-linux-gnu
             strip: strip
-            build-flags: --use-napi-cross
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian
           - os: ubuntu-latest
             target: aarch64-unknown-linux-gnu
-            strip: aarch64-linux-gnu-strip
-            build-flags: --use-napi-cross
+            strip: llvm-strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian-aarch64
           - os: ubuntu-latest
             target: armv7-unknown-linux-gnueabihf
-            strip: arm-linux-gnueabihf-strip
-            build-flags: --use-napi-cross
+            strip: llvm-strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian-zig
           - os: ubuntu-latest
             target: aarch64-unknown-linux-musl
-            strip-zig: true
-            build-flags: -x
+            strip: aarch64-linux-musl-strip
+            download: true
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine
           - os: ubuntu-latest
             target: x86_64-unknown-linux-musl
             strip: strip
-            build-flags: -x
+            download: true
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine
 
-    name: Build ${{ matrix.target }} (oxide)
+    name: Build ${{ matrix.target }} (OXIDE)
     runs-on: ${{ matrix.os }}
+    container: ${{ matrix.container }}
     timeout-minutes: 15
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
-      - uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
-        with:
-          version: ${{ env.PNPM_VERSION }}
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
 
       - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
-          package-manager-cache: false
+          cache: 'pnpm'
 
-      - name: Install gcc-arm-linux-gnueabihf
-        if: ${{ matrix.target == 'armv7-unknown-linux-gnueabihf' }}
-        run: |
-          sudo apt-get update
-          sudo apt-get install gcc-arm-linux-gnueabihf g++-arm-linux-gnueabihf -y
-
-      - name: Install binutils-aarch64-linux-gnu
-        if: ${{ matrix.target == 'aarch64-unknown-linux-gnu' }}
-        run: |
-          sudo apt-get update
-          sudo apt-get install binutils-aarch64-linux-gnu -y
-
-      - uses: mlugg/setup-zig@d1434d08867e3ee9daa34448df10607b98908d29 # v2
-        if: ${{ contains(matrix.target, 'musl') }}
+      # Cargo already skips downloading dependencies if they already exist
+      - name: Cache cargo
+        uses: actions/cache@v4
         with:
-          version: 0.14.1
-          use-cache: false
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
 
-      - name: Install cargo-zigbuild
-        uses: taiki-e/install-action@65851e10cd6c377f11a60e600abc07cb08643468 # v2
-        if: ${{ contains(matrix.target, 'musl') }}
-        env:
-          GITHUB_TOKEN: ${{ github.token }}
+      # Cache the `oxide` Rust build
+      - name: Cache oxide build
+        uses: actions/cache@v4
         with:
-          tool: cargo-zigbuild
+          path: |
+            ./oxide/target/
+            ./crates/node/*.node
+            ./crates/node/index.js
+            ./crates/node/index.d.ts
+          key: ${{ runner.os }}-${{ matrix.target }}-oxide-${{ hashFiles('./crates/**/*') }}
+
+      - name: Install Node.JS
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+
+      - name: Install Rust (Stable)
+        if: ${{ matrix.download }}
+        run: |
+          rustup default stable
 
       - name: Setup rust target
         run: rustup target add ${{ matrix.target }}
 
       - name: Install dependencies
-        run: pnpm install --ignore-scripts --frozen-lockfile --filter=!./playgrounds/*
+        run: pnpm install --ignore-scripts --filter=!./playgrounds/*
 
       - name: Build release
-        run: pnpm run --filter ${{ env.OXIDE_LOCATION }} build:platform --target=${{ matrix.target }} ${{ matrix.build-flags }}
+        run: pnpm run --filter ${{ env.OXIDE_LOCATION }} build
         env:
           RUST_TARGET: ${{ matrix.target }}
           JEMALLOC_SYS_WITH_LG_PAGE: ${{ matrix.page-size }}
 
       - name: Strip debug symbols # https://github.com/rust-lang/rust/issues/46034
-        if: ${{ matrix.strip || matrix.strip-zig }}
-        env:
-          STRIP_COMMAND: ${{ matrix.strip }}
-          STRIP_ZIG: ${{ matrix.strip-zig }}
-        run: |
-          if [ "$STRIP_ZIG" = "true" ]; then
-            for file in ${{ env.OXIDE_LOCATION }}/*.node; do
-              zig objcopy --strip-all "$file" "$file.stripped"
-              mv "$file.stripped" "$file"
-            done
-            exit 0
-          fi
-
-          eval "$STRIP_COMMAND ${{ env.OXIDE_LOCATION }}/*.node"
+        if: ${{ matrix.strip }}
+        run: ${{ matrix.strip }} ${{ env.OXIDE_LOCATION }}/*.node
 
       - name: Upload artifacts
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
+        uses: actions/upload-artifact@v4
         with:
           name: bindings-${{ matrix.target }}
           path: ${{ env.OXIDE_LOCATION }}/*.node
@@ -154,11 +142,9 @@ jobs:
     runs-on: ubuntu-latest
     timeout-minutes: 15
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
+      - uses: actions/checkout@v4
       - name: Build FreeBSD
-        uses: cross-platform-actions/action@cdc9ee69ef84a5f2e59c9058335d9c57bcb4ac86 # v0.25.0
+        uses: cross-platform-actions/action@v0.25.0
         env:
           DEBUG: napi:*
           RUSTUP_HOME: /usr/local/rustup
@@ -174,23 +160,23 @@ jobs:
           shell: bash
           run: |
             sudo pkg install -y -f curl node libnghttp2 npm
-            sudo npm install -g pnpm@${{ env.PNPM_VERSION }} --unsafe-perm=true
+            sudo npm install -g pnpm@9.6.0 --unsafe-perm=true
             curl -sSf https://static.rust-lang.org/rustup/archive/1.27.1/x86_64-unknown-freebsd/rustup-init --output rustup-init
             chmod +x rustup-init
             ./rustup-init -y --profile minimal
             source "$HOME/.cargo/env"
-            pnpm install --ignore-scripts --frozen-lockfile --filter=!./playgrounds/* || true
+            pnpm install --ignore-scripts --filter=!./playgrounds/* || true
             echo "~~~~ rustc --version ~~~~"
             rustc --version
             echo "~~~~ node -v ~~~~"
             node -v
             echo "~~~~ pnpm --version ~~~~"
             pnpm --version
-            pnpm run --filter ${{ env.OXIDE_LOCATION }} build:platform
+            pnpm run --filter ${{ env.OXIDE_LOCATION }} build
             strip -x ${{ env.OXIDE_LOCATION }}/*.node
             ls -la ${{ env.OXIDE_LOCATION }}
       - name: Upload artifacts
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
+        uses: actions/upload-artifact@v4
         with:
           name: bindings-x86_64-unknown-freebsd
           path: ${{ env.OXIDE_LOCATION }}/*.node
@@ -201,17 +187,18 @@ jobs:
     name: Build and release Tailwind CSS
 
     permissions:
-      contents: write # Required for creating releases
+      contents: write # for softprops/action-gh-release to create GitHub release
+      # https://docs.npmjs.com/generating-provenance-statements#publishing-packages-with-provenance-via-github-actions
+      id-token: write
 
     needs:
       - build
       - build-freebsd
 
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
+      - uses: actions/checkout@v4
         with:
           fetch-depth: 20
-          persist-credentials: false
 
       - run: git fetch --tags -f
 
@@ -220,25 +207,43 @@ jobs:
         run: |
           echo "TAG_NAME=$(git describe --tags --abbrev=0)" >> $GITHUB_ENV
 
-      - uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
-        with:
-          version: ${{ env.PNPM_VERSION }}
+      - uses: pnpm/action-setup@v4
 
       - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
           registry-url: 'https://registry.npmjs.org'
-          package-manager-cache: false
 
-      - name: Setup WASM target
-        run: rustup target add wasm32-wasip1-threads
+      # Cargo already skips downloading dependencies if they already exist
+      - name: Cache cargo
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
+
+      # Cache the `oxide` Rust build
+      - name: Cache oxide build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ./oxide/target/
+            ./crates/node/*.node
+            ./crates/node/index.js
+            ./crates/node/index.d.ts
+          key: ${{ runner.os }}-${{ matrix.target }}-oxide-${{ hashFiles('./crates/**/*') }}
 
       - name: Install dependencies
-        run: pnpm --filter=!./playgrounds/* install --frozen-lockfile
+        run: pnpm --filter=!./playgrounds/* install
 
       - name: Download artifacts
-        uses: actions/download-artifact@37930b1c2abaa49bbe596cd826c3c89aef350131 # v7
+        uses: actions/download-artifact@v4
         with:
           path: ${{ env.OXIDE_LOCATION }}
 
@@ -276,32 +281,25 @@ jobs:
           echo "$RELEASE_NOTES" >> $GITHUB_ENV
           echo "EOF" >> $GITHUB_ENV
 
-      - name: Upload standalone artifacts
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
+      - name: Upload Standalone Artifacts
+        uses: actions/upload-artifact@v4
         with:
           name: tailwindcss-standalone
           path: packages/@tailwindcss-standalone/dist/
 
-      - name: Upload npm package tarballs
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
-        with:
-          name: npm-package-tarballs
-          path: dist/*.tgz
-
       - name: Prepare GitHub Release
-        if: ${{ !inputs.dry_run }}
-        env:
-          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        run: |
-          gh release create "${TAG_NAME}" \
-              --draft \
-              --title "${TAG_NAME}" \
-              --notes "${RELEASE_NOTES}" \
-              packages/@tailwindcss-standalone/dist/sha256sums.txt \
-              packages/@tailwindcss-standalone/dist/tailwindcss-linux-arm64 \
-              packages/@tailwindcss-standalone/dist/tailwindcss-linux-arm64-musl \
-              packages/@tailwindcss-standalone/dist/tailwindcss-linux-x64 \
-              packages/@tailwindcss-standalone/dist/tailwindcss-linux-x64-musl \
-              packages/@tailwindcss-standalone/dist/tailwindcss-macos-arm64 \
-              packages/@tailwindcss-standalone/dist/tailwindcss-macos-x64 \
-              packages/@tailwindcss-standalone/dist/tailwindcss-windows-x64.exe
+        uses: softprops/action-gh-release@v2
+        with:
+          draft: true
+          tag_name: ${{ env.TAG_NAME }}
+          body: |
+            ${{ env.RELEASE_NOTES }}
+          files: |
+            packages/@tailwindcss-standalone/dist/sha256sums.txt
+            packages/@tailwindcss-standalone/dist/tailwindcss-linux-arm64
+            packages/@tailwindcss-standalone/dist/tailwindcss-linux-arm64-musl
+            packages/@tailwindcss-standalone/dist/tailwindcss-linux-x64
+            packages/@tailwindcss-standalone/dist/tailwindcss-linux-x64-musl
+            packages/@tailwindcss-standalone/dist/tailwindcss-macos-arm64
+            packages/@tailwindcss-standalone/dist/tailwindcss-macos-x64
+            packages/@tailwindcss-standalone/dist/tailwindcss-windows-x64.exe
diff --git a/.github/workflows/release-insiders.yml b/.github/workflows/release-insiders.yml
new file mode 100644
index 000000000..5ad182607
--- /dev/null
+++ b/.github/workflows/release-insiders.yml
@@ -0,0 +1,290 @@
+name: Release Insiders
+
+on:
+  push:
+    branches: [main]
+
+permissions:
+  contents: read
+
+env:
+  APP_NAME: tailwindcss-oxide
+  NODE_VERSION: 20
+  OXIDE_LOCATION: ./crates/node
+  RELEASE_CHANNEL: insiders
+
+jobs:
+  build:
+    strategy:
+      matrix:
+        include:
+          # Windows
+          - os: windows-latest
+            target: x86_64-pc-windows-msvc
+          - os: windows-latest
+            target: aarch64-pc-windows-msvc
+          # macOS
+          - os: macos-latest
+            target: x86_64-apple-darwin
+            strip: strip -x # Must use -x on macOS. This produces larger results on linux.
+          - os: macos-latest
+            target: aarch64-apple-darwin
+            page-size: 14
+            strip: strip -x # Must use -x on macOS. This produces larger results on linux.
+          # Android
+          - os: ubuntu-latest
+            target: aarch64-linux-android
+            strip: ${ANDROID_NDK_LATEST_HOME}/toolchains/llvm/prebuilt/linux-x86_64/bin/llvm-strip
+          - os: ubuntu-latest
+            target: armv7-linux-androideabi
+            strip: ${ANDROID_NDK_LATEST_HOME}/toolchains/llvm/prebuilt/linux-x86_64/bin/llvm-strip
+          # Linux
+          - os: ubuntu-latest
+            target: x86_64-unknown-linux-gnu
+            strip: strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian
+          - os: ubuntu-latest
+            target: aarch64-unknown-linux-gnu
+            strip: llvm-strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian-aarch64
+          - os: ubuntu-latest
+            target: armv7-unknown-linux-gnueabihf
+            strip: llvm-strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian-zig
+          - os: ubuntu-latest
+            target: aarch64-unknown-linux-musl
+            strip: aarch64-linux-musl-strip
+            download: true
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine
+          - os: ubuntu-latest
+            target: x86_64-unknown-linux-musl
+            strip: strip
+            download: true
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine
+
+    name: Build ${{ matrix.target }} (OXIDE)
+    runs-on: ${{ matrix.os }}
+    container: ${{ matrix.container }}
+    timeout-minutes: 15
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+
+      - name: Use Node.js ${{ env.NODE_VERSION }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+
+      # Cargo already skips downloading dependencies if they already exist
+      - name: Cache cargo
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
+
+      # Cache the `oxide` Rust build
+      - name: Cache oxide build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ./oxide/target/
+            ./crates/node/*.node
+            ./crates/node/index.js
+            ./crates/node/index.d.ts
+          key: ${{ runner.os }}-${{ matrix.target }}-oxide-${{ hashFiles('./crates/**/*') }}
+
+      - name: Install Node.JS
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+
+      - name: Install Rust (Stable)
+        if: ${{ matrix.download }}
+        run: |
+          rustup default stable
+
+      - name: Setup rust target
+        run: rustup target add ${{ matrix.target }}
+
+      - name: Install dependencies
+        run: pnpm install --ignore-scripts --filter=!./playgrounds/*
+
+      - name: Build release
+        run: pnpm run --filter ${{ env.OXIDE_LOCATION }} build
+        env:
+          RUST_TARGET: ${{ matrix.target }}
+          JEMALLOC_SYS_WITH_LG_PAGE: ${{ matrix.page-size }}
+
+      - name: Strip debug symbols # https://github.com/rust-lang/rust/issues/46034
+        if: ${{ matrix.strip }}
+        run: ${{ matrix.strip }} ${{ env.OXIDE_LOCATION }}/*.node
+
+      - name: Upload artifacts
+        uses: actions/upload-artifact@v4
+        with:
+          name: bindings-${{ matrix.target }}
+          path: ${{ env.OXIDE_LOCATION }}/*.node
+
+  build-freebsd:
+    name: Build x86_64-unknown-freebsd (OXIDE)
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    steps:
+      - uses: actions/checkout@v4
+      - name: Build FreeBSD
+        uses: cross-platform-actions/action@v0.25.0
+        env:
+          DEBUG: napi:*
+          RUSTUP_HOME: /usr/local/rustup
+          CARGO_HOME: /usr/local/cargo
+          RUSTUP_IO_THREADS: 1
+          RUST_TARGET: x86_64-unknown-freebsd
+        with:
+          operating_system: freebsd
+          version: '14.0'
+          memory: 13G
+          cpu_count: 3
+          environment_variables: 'DEBUG RUSTUP_IO_THREADS'
+          shell: bash
+          run: |
+            sudo pkg install -y -f curl node libnghttp2 npm
+            sudo npm install -g pnpm@9.6.0 --unsafe-perm=true
+            curl -sSf https://static.rust-lang.org/rustup/archive/1.27.1/x86_64-unknown-freebsd/rustup-init --output rustup-init
+            chmod +x rustup-init
+            ./rustup-init -y --profile minimal
+            source "$HOME/.cargo/env"
+            echo "~~~~ rustc --version ~~~~"
+            rustc --version
+            echo "~~~~ node -v ~~~~"
+            node -v
+            echo "~~~~ pnpm --version ~~~~"
+            pnpm --version
+            pnpm install --ignore-scripts --filter=!./playgrounds/* || true
+            pnpm run --filter ${{ env.OXIDE_LOCATION }} build
+            strip -x ${{ env.OXIDE_LOCATION }}/*.node
+            ls -la ${{ env.OXIDE_LOCATION }}
+      - name: Upload artifacts
+        uses: actions/upload-artifact@v4
+        with:
+          name: bindings-x86_64-unknown-freebsd
+          path: ${{ env.OXIDE_LOCATION }}/*.node
+
+  release:
+    runs-on: macos-14
+    timeout-minutes: 15
+    name: Build and release Tailwind CSS insiders
+
+    permissions:
+      contents: write # for softprops/action-gh-release to create GitHub release
+      # https://docs.npmjs.com/generating-provenance-statements#publishing-packages-with-provenance-via-github-actions
+      id-token: write
+
+    needs:
+      - build
+      - build-freebsd
+
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 20
+
+      - name: Resolve version
+        id: vars
+        run: |
+          echo "SHA_SHORT=$(git rev-parse --short HEAD)" >> $GITHUB_ENV
+
+      - uses: pnpm/action-setup@v4
+
+      - name: Use Node.js ${{ env.NODE_VERSION }}
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
+          registry-url: 'https://registry.npmjs.org'
+
+      # Cargo already skips downloading dependencies if they already exist
+      - name: Cache cargo
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
+
+      # Cache the `oxide` Rust build
+      - name: Cache oxide build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ./oxide/target/
+            ./crates/node/*.node
+            ./crates/node/index.js
+            ./crates/node/index.d.ts
+          key: ${{ runner.os }}-${{ matrix.target }}-oxide-${{ hashFiles('./crates/**/*') }}
+
+      - name: Install dependencies
+        run: pnpm --filter=!./playgrounds/* install
+
+      - name: Download artifacts
+        uses: actions/download-artifact@v4
+        with:
+          path: ${{ env.OXIDE_LOCATION }}
+
+      - name: Move artifacts
+        run: |
+          cd ${{ env.OXIDE_LOCATION }}
+          cp bindings-x86_64-pc-windows-msvc/* ./npm/win32-x64-msvc/
+          cp bindings-aarch64-pc-windows-msvc/* ./npm/win32-arm64-msvc/
+          cp bindings-x86_64-apple-darwin/* ./npm/darwin-x64/
+          cp bindings-aarch64-apple-darwin/* ./npm/darwin-arm64/
+          cp bindings-aarch64-linux-android/* ./npm/android-arm64/
+          cp bindings-armv7-linux-androideabi/* ./npm/android-arm-eabi/
+          cp bindings-aarch64-unknown-linux-gnu/* ./npm/linux-arm64-gnu/
+          cp bindings-aarch64-unknown-linux-musl/* ./npm/linux-arm64-musl/
+          cp bindings-armv7-unknown-linux-gnueabihf/* ./npm/linux-arm-gnueabihf/
+          cp bindings-x86_64-unknown-linux-gnu/* ./npm/linux-x64-gnu/
+          cp bindings-x86_64-unknown-linux-musl/* ./npm/linux-x64-musl/
+          cp bindings-x86_64-unknown-freebsd/* ./npm/freebsd-x64/
+
+      - name: 'Version based on commit: 0.0.0-${{ env.RELEASE_CHANNEL }}.${{ env.SHA_SHORT }}'
+        run: pnpm run version-packages 0.0.0-${{ env.RELEASE_CHANNEL }}.${{ env.SHA_SHORT }}
+
+      - name: Build Tailwind CSS
+        run: pnpm run build
+
+      - name: Run pre-publish optimizations scripts
+        run: node ./scripts/pre-publish-optimizations.mjs
+
+      - name: Lock pre-release versions
+        run: node ./scripts/lock-pre-release-versions.mjs
+
+      - name: Publish
+        run: pnpm --recursive publish --tag ${{ env.RELEASE_CHANNEL }} --no-git-checks
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+      - name: Trigger Tailwind Play update
+        uses: actions/github-script@v7
+        with:
+          github-token: ${{ secrets.TAILWIND_PLAY_TOKEN }}
+          script: |
+            await github.rest.actions.createWorkflowDispatch({
+              owner: 'tailwindlabs',
+              repo: 'play.tailwindcss.com',
+              ref: 'master',
+              workflow_id: 'upgrade-tailwindcss.yml'
+            })
diff --git a/.github/workflows/release.yml b/.github/workflows/release.yml
index 2c957d3af..a936e25e3 100644
--- a/.github/workflows/release.yml
+++ b/.github/workflows/release.yml
@@ -1,34 +1,18 @@
 name: Release
 
 on:
-  push:
-    branches: [main]
   release:
     types: [published]
   workflow_dispatch:
-    inputs:
-      channel:
-        description: Release channel to publish
-        required: true
-        default: insiders
-        type: choice
-        options:
-          - insiders
-          - release
 
 permissions:
   contents: read
 
 env:
   APP_NAME: tailwindcss-oxide
-  NODE_VERSION: 24
-  PNPM_VERSION: '11.9.0'
+  NODE_VERSION: 20
   OXIDE_LOCATION: ./crates/node
 
-concurrency:
-  group: ${{ github.workflow }}-${{ github.event_name }}-${{ github.ref }}
-  cancel-in-progress: true
-
 jobs:
   build:
     strategy:
@@ -58,97 +42,96 @@ jobs:
           - os: ubuntu-latest
             target: x86_64-unknown-linux-gnu
             strip: strip
-            build-flags: --use-napi-cross
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian
           - os: ubuntu-latest
             target: aarch64-unknown-linux-gnu
-            strip: aarch64-linux-gnu-strip
-            build-flags: --use-napi-cross
+            strip: llvm-strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian-aarch64
           - os: ubuntu-latest
             target: armv7-unknown-linux-gnueabihf
-            strip: arm-linux-gnueabihf-strip
-            build-flags: --use-napi-cross
+            strip: llvm-strip
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-debian-zig
           - os: ubuntu-latest
             target: aarch64-unknown-linux-musl
-            strip-zig: true
-            build-flags: -x
+            strip: aarch64-linux-musl-strip
+            download: true
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine
           - os: ubuntu-latest
             target: x86_64-unknown-linux-musl
             strip: strip
-            build-flags: -x
+            download: true
+            container:
+              image: ghcr.io/napi-rs/napi-rs/nodejs-rust:lts-alpine
 
-    name: Build ${{ matrix.target }} (oxide)
+    name: Build ${{ matrix.target }} (OXIDE)
     runs-on: ${{ matrix.os }}
+    container: ${{ matrix.container }}
     timeout-minutes: 15
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
-      - uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
-        with:
-          version: ${{ env.PNPM_VERSION }}
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
 
       - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
-          package-manager-cache: false
+          cache: 'pnpm'
 
-      - name: Install gcc-arm-linux-gnueabihf
-        if: ${{ matrix.target == 'armv7-unknown-linux-gnueabihf' }}
-        run: |
-          sudo apt-get update
-          sudo apt-get install gcc-arm-linux-gnueabihf g++-arm-linux-gnueabihf -y
-
-      - name: Install binutils-aarch64-linux-gnu
-        if: ${{ matrix.target == 'aarch64-unknown-linux-gnu' }}
-        run: |
-          sudo apt-get update
-          sudo apt-get install binutils-aarch64-linux-gnu -y
-
-      - uses: mlugg/setup-zig@d1434d08867e3ee9daa34448df10607b98908d29 # v2
-        if: ${{ contains(matrix.target, 'musl') }}
+      # Cargo already skips downloading dependencies if they already exist
+      - name: Cache cargo
+        uses: actions/cache@v4
         with:
-          version: 0.14.1
-          use-cache: false
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
 
-      - name: Install cargo-zigbuild
-        uses: taiki-e/install-action@65851e10cd6c377f11a60e600abc07cb08643468 # v2
-        if: ${{ contains(matrix.target, 'musl') }}
-        env:
-          GITHUB_TOKEN: ${{ github.token }}
+      # Cache the `oxide` Rust build
+      - name: Cache oxide build
+        uses: actions/cache@v4
         with:
-          tool: cargo-zigbuild
+          path: |
+            ./oxide/target/
+            ./crates/node/*.node
+            ./crates/node/index.js
+            ./crates/node/index.d.ts
+          key: ${{ runner.os }}-${{ matrix.target }}-oxide-${{ hashFiles('./crates/**/*') }}
+
+      - name: Install Node.JS
+        uses: actions/setup-node@v4
+        with:
+          node-version: ${{ env.NODE_VERSION }}
+
+      - name: Install Rust (Stable)
+        if: ${{ matrix.download }}
+        run: |
+          rustup default stable
 
       - name: Setup rust target
         run: rustup target add ${{ matrix.target }}
 
       - name: Install dependencies
-        run: pnpm install --ignore-scripts --frozen-lockfile --filter=!./playgrounds/*
+        run: pnpm install --ignore-scripts --filter=!./playgrounds/*
 
       - name: Build release
-        run: pnpm run --filter ${{ env.OXIDE_LOCATION }} build:platform --target=${{ matrix.target }} ${{ matrix.build-flags }}
+        run: pnpm run --filter ${{ env.OXIDE_LOCATION }} build
         env:
           RUST_TARGET: ${{ matrix.target }}
           JEMALLOC_SYS_WITH_LG_PAGE: ${{ matrix.page-size }}
 
       - name: Strip debug symbols # https://github.com/rust-lang/rust/issues/46034
-        if: ${{ matrix.strip || matrix.strip-zig }}
-        env:
-          STRIP_COMMAND: ${{ matrix.strip }}
-          STRIP_ZIG: ${{ matrix.strip-zig }}
-        run: |
-          if [ "$STRIP_ZIG" = "true" ]; then
-            for file in ${{ env.OXIDE_LOCATION }}/*.node; do
-              zig objcopy --strip-all "$file" "$file.stripped"
-              mv "$file.stripped" "$file"
-            done
-            exit 0
-          fi
-
-          eval "$STRIP_COMMAND ${{ env.OXIDE_LOCATION }}/*.node"
+        if: ${{ matrix.strip }}
+        run: ${{ matrix.strip }} ${{ env.OXIDE_LOCATION }}/*.node
 
       - name: Upload artifacts
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
+        uses: actions/upload-artifact@v4
         with:
           name: bindings-${{ matrix.target }}
           path: ${{ env.OXIDE_LOCATION }}/*.node
@@ -158,11 +141,9 @@ jobs:
     runs-on: ubuntu-latest
     timeout-minutes: 15
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
+      - uses: actions/checkout@v4
       - name: Build FreeBSD
-        uses: cross-platform-actions/action@cdc9ee69ef84a5f2e59c9058335d9c57bcb4ac86 # v0.25.0
+        uses: cross-platform-actions/action@v0.25.0
         env:
           DEBUG: napi:*
           RUSTUP_HOME: /usr/local/rustup
@@ -178,7 +159,7 @@ jobs:
           shell: bash
           run: |
             sudo pkg install -y -f curl node libnghttp2 npm
-            sudo npm install -g pnpm@${{ env.PNPM_VERSION }} --unsafe-perm=true
+            sudo npm install -g pnpm@9.6.0 --unsafe-perm=true
             curl -sSf https://static.rust-lang.org/rustup/archive/1.27.1/x86_64-unknown-freebsd/rustup-init --output rustup-init
             chmod +x rustup-init
             ./rustup-init -y --profile minimal
@@ -189,12 +170,12 @@ jobs:
             node -v
             echo "~~~~ pnpm --version ~~~~"
             pnpm --version
-            pnpm install --ignore-scripts --frozen-lockfile --filter=!./playgrounds/* || true
-            pnpm run --filter ${{ env.OXIDE_LOCATION }} build:platform
+            pnpm install --ignore-scripts --filter=!./playgrounds/* || true
+            pnpm run --filter ${{ env.OXIDE_LOCATION }} build
             strip -x ${{ env.OXIDE_LOCATION }}/*.node
             ls -la ${{ env.OXIDE_LOCATION }}
       - name: Upload artifacts
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
+        uses: actions/upload-artifact@v4
         with:
           name: bindings-x86_64-unknown-freebsd
           path: ${{ env.OXIDE_LOCATION }}/*.node
@@ -202,10 +183,10 @@ jobs:
   release:
     runs-on: macos-14
     timeout-minutes: 15
-    name: Build and publish Tailwind CSS
+    name: Build and release Tailwind CSS
 
     permissions:
-      contents: read
+      contents: write # for softprops/action-gh-release to create GitHub release
       # https://docs.npmjs.com/generating-provenance-statements#publishing-packages-with-provenance-via-github-actions
       id-token: write
 
@@ -214,51 +195,47 @@ jobs:
       - build-freebsd
 
     steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
+      - uses: actions/checkout@v4
         with:
           fetch-depth: 20
-          persist-credentials: false
 
-      - uses: pnpm/action-setup@0ebf47130e4866e96fce0953f49152a61190b271 # v6.0.9
-        with:
-          version: ${{ env.PNPM_VERSION }}
+      - uses: pnpm/action-setup@v4
 
       - name: Use Node.js ${{ env.NODE_VERSION }}
-        uses: actions/setup-node@48b55a011bda9f5d6aeb4c2d9c7362e8dae4041e # v6
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ env.NODE_VERSION }}
+          cache: 'pnpm'
           registry-url: 'https://registry.npmjs.org'
-          package-manager-cache: false
 
-      # npm trusted publishing validates the caller workflow filename, so all npm publishes live here.
-      # This workflow rebuilds the publish artifacts instead of depending on prepare-release.yml.
-      - name: Resolve release metadata
-        env:
-          INPUT_CHANNEL: ${{ github.event.inputs.channel || '' }}
-        run: |
-          if [[ "${{ github.event_name }}" == "release" || "$INPUT_CHANNEL" == "release" ]]; then
-            release_channel=$(node ./scripts/release-channel.js)
+      # Cargo already skips downloading dependencies if they already exist
+      - name: Cache cargo
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/bin/
+            ~/.cargo/registry/index/
+            ~/.cargo/registry/cache/
+            ~/.cargo/git/db/
+            target/
+          key: ${{ runner.os }}-${{ matrix.target }}-cargo-${{ hashFiles('**/Cargo.lock') }}
 
-            echo "RELEASE_KIND=release" >> $GITHUB_ENV
-            echo "RELEASE_CHANNEL=$release_channel" >> $GITHUB_ENV
-            echo "FEATURES_ENV=stable" >> $GITHUB_ENV
-          else
-            sha_short=$(git rev-parse --short HEAD)
-
-            echo "RELEASE_KIND=insiders" >> $GITHUB_ENV
-            echo "RELEASE_CHANNEL=insiders" >> $GITHUB_ENV
-            echo "SHA_SHORT=$sha_short" >> $GITHUB_ENV
-            echo "INSIDERS_VERSION=0.0.0-insiders.$sha_short" >> $GITHUB_ENV
-          fi
-
-      - name: Setup WASM target
-        run: rustup target add wasm32-wasip1-threads
+      # Cache the `oxide` Rust build
+      - name: Cache oxide build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ./oxide/target/
+            ./crates/node/*.node
+            ./crates/node/index.js
+            ./crates/node/index.d.ts
+          key: ${{ runner.os }}-${{ matrix.target }}-oxide-${{ hashFiles('./crates/**/*') }}
 
       - name: Install dependencies
-        run: pnpm --filter=!./playgrounds/* install --frozen-lockfile
+        run: pnpm --filter=!./playgrounds/* install
 
       - name: Download artifacts
-        uses: actions/download-artifact@37930b1c2abaa49bbe596cd826c3c89aef350131 # v7
+        uses: actions/download-artifact@v4
         with:
           path: ${{ env.OXIDE_LOCATION }}
 
@@ -278,19 +255,10 @@ jobs:
           cp bindings-x86_64-unknown-linux-musl/* ./npm/linux-x64-musl/
           cp bindings-x86_64-unknown-freebsd/* ./npm/freebsd-x64/
 
-      - name: 'Version based on commit: ${{ env.INSIDERS_VERSION }}'
-        if: env.RELEASE_KIND == 'insiders'
-        run: pnpm run version-packages ${INSIDERS_VERSION}
-
       - name: Build Tailwind CSS
-        if: env.RELEASE_KIND == 'insiders'
-        run: pnpm run build
-
-      - name: Build Tailwind CSS
-        if: env.RELEASE_KIND == 'release'
         run: pnpm run build
         env:
-          FEATURES_ENV: ${{ env.FEATURES_ENV }}
+          FEATURES_ENV: stable
 
       - name: Run pre-publish optimizations scripts
         run: node ./scripts/pre-publish-optimizations.mjs
@@ -298,61 +266,25 @@ jobs:
       - name: Lock pre-release versions
         run: node ./scripts/lock-pre-release-versions.mjs
 
-      - name: Upload npm package tarballs
-        uses: actions/upload-artifact@b7c566a772e6b6bfb58ed0dc250532a479d7789f # v6
-        with:
-          name: npm-package-tarballs
-          path: dist/*.tgz
+      - name: Calculate environment variables
+        run: |
+          echo "RELEASE_CHANNEL=$(node ./scripts/release-channel.js)" >> $GITHUB_ENV
+          echo "TAILWINDCSS_VERSION=$(node -e 'console.log(require(`./packages/tailwindcss/package.json`).version);')" >> $GITHUB_ENV
 
       - name: Publish
-        run: |
-          pnpm --recursive --filter="!@tailwindcss/oxide-wasm32-wasi" publish --tag ${RELEASE_CHANNEL} --no-git-checks
-          # The wasm package needs a special npm config that isn't read when pnpm --recursive is used
-          pushd crates/node/npm/wasm32-wasi; pnpm publish --tag ${RELEASE_CHANNEL} --no-git-checks --config.node-linker=hoisted; popd;
+        run: pnpm --recursive publish --tag ${{ env.RELEASE_CHANNEL }} --no-git-checks
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
       - name: Trigger Tailwind Play update
-        uses: actions/github-script@ed597411d8f924073f98dfc5c65a23a2325f34cd # v8
+        if: env.RELEASE_CHANNEL == 'latest'
+        uses: actions/github-script@v7
         with:
           github-token: ${{ secrets.TAILWIND_PLAY_TOKEN }}
           script: |
             await github.rest.actions.createWorkflowDispatch({
               owner: 'tailwindlabs',
-              repo: 'upgrades',
-              ref: 'main',
+              repo: 'play.tailwindcss.com',
+              ref: 'master',
               workflow_id: 'upgrade-tailwindcss.yml'
             })
-
-  notify:
-    if: ${{ always() && (needs.build.result == 'failure' || needs.build-freebsd.result == 'failure' || needs.release.result == 'failure') }}
-    needs:
-      - build
-      - build-freebsd
-      - release
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-        with:
-          persist-credentials: false
-
-      - name: Resolve release label
-        id: release
-        env:
-          INPUT_CHANNEL: ${{ github.event.inputs.channel || '' }}
-          RELEASE_TAG: ${{ github.event.release.tag_name || '' }}
-        run: |
-          if [[ "${{ github.event_name }}" == "release" ]]; then
-            tag_name="${RELEASE_TAG:-${GITHUB_REF_NAME}}"
-            echo "label=release ${tag_name}" >> $GITHUB_OUTPUT
-          elif [[ "$INPUT_CHANNEL" == "release" ]]; then
-            version=$(node -p "require('./packages/tailwindcss/package.json').version")
-            echo "label=release v${version}" >> $GITHUB_OUTPUT
-          else
-            sha_short=$(git rev-parse --short HEAD)
-            echo "label=insiders release 0.0.0-insiders.${sha_short}" >> $GITHUB_OUTPUT
-          fi
-
-      - name: Notify Discord
-        uses: discord-actions/message@5c7149c81a83146e5d01f142be1bf87a61831c4d # v2
-        with:
-          webhookUrl: ${{ secrets.DISCORD_WEBHOOK_URL }}
-          message: 'The [most recent ${{ github.workflow }} workflow](<${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}>) for `${{ steps.release.outputs.label }}` has failed.'
diff --git a/.gitignore b/.gitignore
index bbac7d227..9d75bba27 100644
--- a/.gitignore
+++ b/.gitignore
@@ -7,4 +7,4 @@ playwright-report/
 blob-report/
 playwright/.cache/
 target/
-.debug/
+.debug
diff --git a/.npmrc b/.npmrc
new file mode 100644
index 000000000..ded82e2f6
--- /dev/null
+++ b/.npmrc
@@ -0,0 +1 @@
+auto-install-peers = true
diff --git a/.prettierignore b/.prettierignore
index 4f50b932f..3de4530dd 100644
--- a/.prettierignore
+++ b/.prettierignore
@@ -4,6 +4,5 @@ pnpm-lock.yaml
 target/
 crates/node/index.d.ts
 crates/node/index.js
-crates/ignore/
 .next
 .fingerprint
diff --git a/CHANGELOG.md b/CHANGELOG.md
index e5e6f6f89..f97dc1f72 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -9,580 +9,28 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Added
 
-- Add `@tailwindcss/turbopack` package to run Tailwind CSS with Next.js ([20367](https://github.com/tailwindlabs/tailwindcss/pull/20367))
-
-### Fixed
-
-- Ensure watch mode detects changes to symlinked `@source` files whose real paths aren't otherwise scanned ([#20356](https://github.com/tailwindlabs/tailwindcss/pull/20356))
-- Ensure custom variants using `@scope` wrap the generated utilities instead of nesting inside them ([#20369](https://github.com/tailwindlabs/tailwindcss/pull/20369))
-- Fix flattening of `@scope` at-rules ([#20369](https://github.com/tailwindlabs/tailwindcss/pull/20369))
-- Fix standalone declarations in `@scope`, wrap them in `:where(:scope)` ([#20369](https://github.com/tailwindlabs/tailwindcss/pull/20369))
-- Always emit a space for empty fallback values in CSS variables (e.g. `var(--tw-blur,)` → `var(--tw-blur, )`) ([#20373](https://github.com/tailwindlabs/tailwindcss/pull/20373))
-- Canonicalization: convert arbitrary breakpoint and container query variants to named equivalents (e.g. `max-[64rem]` → `max-lg`) ([#20380](https://github.com/tailwindlabs/tailwindcss/pull/20380))
-- Prevent `@tailwindcss/vite` from crashing on every edit under Vite's experimental `bundledDev` mode ([#20379](https://github.com/tailwindlabs/tailwindcss/pull/20379))
-- Ensure `@tailwindcss/oxide` falls back to WASM on platforms without native bindings ([#20383](https://github.com/tailwindlabs/tailwindcss/pull/20383))
-- Detect classes in Ruby percent literals using angle brackets or custom delimiters (e.g. `%w<flex>`, `%w|flex|`), including in Slim and Haml templates ([#20387](https://github.com/tailwindlabs/tailwindcss/pull/20387))
-- Preserve whitespace in `--default(…)` values in custom functional utilities (e.g. `--default(box alphabetic)` no longer becomes `boxalphabetic`) ([#20392](https://github.com/tailwindlabs/tailwindcss/pull/20392))
-- Don't scan gitignored directories (e.g. `node_modules` and `.git`) when the project uses a safelist-style `.gitignore` (e.g. `/*` followed by `!/…` negations) ([#20397](https://github.com/tailwindlabs/tailwindcss/pull/20397))
-- Ensure root `theme('…')` namespace lookups in JavaScript plugins and config files return the full namespace object instead of the value of its `DEFAULT` key ([#20399](https://github.com/tailwindlabs/tailwindcss/pull/20399))
-- Skip ignored directories entirely when computing watch globs (`scanner.globs`), instead of walking their full contents on every rebuild ([#20408](https://github.com/tailwindlabs/tailwindcss/pull/20408))
-- Oxide: drop invalid UTF-8 candidates ([#20389](https://github.com/tailwindlabs/tailwindcss/pull/20389))
-- `@tailwindcss/vite` no longer forces a full page reload for external files (e.g.: `.php` files) ([#20414](https://github.com/tailwindlabs/tailwindcss/issues/20414))
-- Canonicalization: don't merge utilities that reference different theme variables set to CSS-wide keywords like `unset` ([#20417](https://github.com/tailwindlabs/tailwindcss/pull/20417))
-- Don't generate utilities when a modifier is used that would otherwise be silently ignored (e.g. `rounded-sm/[5]`, `shadow-sm/foo`, `stroke-2/50`) ([#20419](https://github.com/tailwindlabs/tailwindcss/pull/20419))
-- Only normalize top-level `and`, `or`, and `not` keywords in `supports-[…]` variants (e.g. `selector(a: not (.foo))` → `selector(a:not(.foo))`) ([#20420](https://github.com/tailwindlabs/tailwindcss/pull/20420))
-- Don't warn about Angular's `::ng-deep` and `:host-context()` when optimizing CSS ([#20434](https://github.com/tailwindlabs/tailwindcss/pull/20434))
-- Don't generate CSS for candidates containing an empty additional modifier (e.g. `bg-red-500/50/` and `group-hover/foo//bar:flex`) ([#20466](https://github.com/tailwindlabs/tailwindcss/pull/20466))
-- Sort `min-*`, `max-*`, and container query variants with decimal values numerically (e.g. `min-[40.25rem]` before `min-[40.5rem]`) ([#20512](https://github.com/tailwindlabs/tailwindcss/pull/20512))
-- Ensure CSS comments ending with `\*/` are closed correctly instead of swallowing the CSS that follows (e.g. `/* C:\temp\*/`) ([#20508](https://github.com/tailwindlabs/tailwindcss/pull/20508))
-- Improve style invalidation performance of `group-*` and `peer-*` variants ([#20513](https://github.com/tailwindlabs/tailwindcss/pull/20513))
-
-## [4.3.3] - 2026-07-16
-
-### Fixed
-
-- Support `--watch --poll[=ms]` in `@tailwindcss/cli` when filesystem events are unreliable or unavailable ([#20297](https://github.com/tailwindlabs/tailwindcss/pull/20297))
-- Canonicalization: match arbitrary hex colors against theme colors case-insensitively (e.g. `bg-[#fff]` and `bg-[#FFF]` → `bg-white`) ([#20298](https://github.com/tailwindlabs/tailwindcss/pull/20298))
-- Prevent Preflight from overriding Firefox's native `iframe:focus-visible` outline styles ([#20292](https://github.com/tailwindlabs/tailwindcss/pull/20292))
-- Ensure `theme('colors.foo')` in JS plugins resolves correctly when both `--color-foo` and `--color-foo-bar` exist ([#20299](https://github.com/tailwindlabs/tailwindcss/pull/20299))
-- Ensure fractional opacity modifiers work with named shadow sizes like `shadow-sm/12.5`, `text-shadow-sm/12.5`, `drop-shadow-sm/12.5`, and `inset-shadow-sm/12.5` ([#20302](https://github.com/tailwindlabs/tailwindcss/pull/20302))
-- Parse selectors like `[data-foo]div` as two selectors instead of one ([#20303](https://github.com/tailwindlabs/tailwindcss/pull/20303))
-- Ensure `@tailwindcss/postcss` rebuilds when a preprocessor like Sass changes the input CSS without changing the input file on disk ([#20310](https://github.com/tailwindlabs/tailwindcss/pull/20310))
-- Ensure CSS nesting is handled even when Lightning CSS isn't run, such as in `@tailwindcss/browser` and Tailwind Play ([#20124](https://github.com/tailwindlabs/tailwindcss/pull/20124))
-- Prevent achromatic theme colors from shifting hue when mixed in polar color spaces like `oklch` ([#20314](https://github.com/tailwindlabs/tailwindcss/pull/20314))
-- Ensure `--spacing(0)` is optimized to `0px` instead of `0` so it remains a `<length>` when used in `calc(…)` ([#20319](https://github.com/tailwindlabs/tailwindcss/pull/20319))
-- Load `@parcel/watcher` only when needed in `@tailwindcss/cli --watch` mode, so one-off builds and `--watch --poll` work when `@parcel/watcher` can't be loaded ([#20325](https://github.com/tailwindlabs/tailwindcss/pull/20325))
-- Use explicit platform fonts instead of `system-ui` and `ui-sans-serif` so CJK text respects the page's `lang` attribute on Windows ([#20318](https://github.com/tailwindlabs/tailwindcss/pull/20318))
-- Prevent `@tailwindcss/upgrade` from rewriting ignored files when run from a subdirectory ([#20329](https://github.com/tailwindlabs/tailwindcss/pull/20329))
-- Ensure earlier `@source` rules pointing to nested files are scanned when later `@source` rules point to files in parent folders ([#20335](https://github.com/tailwindlabs/tailwindcss/pull/20335))
-- Prevent `@tailwindcss/vite` from triggering full page reloads when scanned files are processed by Vite but haven't been loaded as modules yet ([#20336](https://github.com/tailwindlabs/tailwindcss/pull/20336))
-
-## [4.3.2] - 2026-06-26
-
-### Fixed
-
-- Support bare spacing values for `auto-rows-*` and `auto-cols-*` utilities (e.g. `auto-rows-12` and `auto-cols-16`) ([#20229](https://github.com/tailwindlabs/tailwindcss/pull/20229))
-- Prevent `@tailwindcss/cli` in `--watch` mode from crashing on Windows when `@source` points to a directory that doesn't exist ([#20242](https://github.com/tailwindlabs/tailwindcss/pull/20242))
-- Prevent `@tailwindcss/vite` from crashing in Deno v2.8.x when `context.parentURL` is not a valid URL ([#20245](https://github.com/tailwindlabs/tailwindcss/pull/20245))
-- Ensure `@tailwindcss/cli` in `--watch` mode rebuilds when the input CSS file changes in an ignored directory ([#20246](https://github.com/tailwindlabs/tailwindcss/pull/20246))
-- Allow `@variant` rules used in `addBase(…)` to use custom variants defined later ([#20247](https://github.com/tailwindlabs/tailwindcss/pull/20247))
-- Prevent `@tailwindcss/vite` from crashing during HMR when scanned files or directories are deleted ([#20259](https://github.com/tailwindlabs/tailwindcss/pull/20259))
-- Generate `font-size` instead of `color` declarations for `text-[--spacing(…)]` ([#20260](https://github.com/tailwindlabs/tailwindcss/pull/20260))
-- Prevent `@source` patterns from scanning unrelated sibling files and folders ([#20263](https://github.com/tailwindlabs/tailwindcss/pull/20263))
-- Extract class candidates adjacent to Template Toolkit delimiters like `%]…[%` in `.tt`, `.tt2`, and `.tx` files ([#20269](https://github.com/tailwindlabs/tailwindcss/pull/20269))
-- Extract class candidates from conditional Maud syntax like `p.text-black[condition]` ([#20269](https://github.com/tailwindlabs/tailwindcss/pull/20269))
-- Prevent `@position-try` rules from triggering unknown at-rule warnings when optimizing CSS ([#20277](https://github.com/tailwindlabs/tailwindcss/pull/20277))
-- Support class suggestions for named opacity modifiers from `--opacity` theme values ([#20287](https://github.com/tailwindlabs/tailwindcss/pull/20287))
-- Prevent type errors in `@tailwindcss/postcss` when used with newer PostCSS patch releases ([#20289](https://github.com/tailwindlabs/tailwindcss/pull/20289))
-
-## [4.3.1] - 2026-06-12
-
-### Added
-
-- Add `--silent` option to suppress output in `@tailwindcss/cli` ([#20100](https://github.com/tailwindlabs/tailwindcss/pull/20100))
-
-### Fixed
-
-- Remove deprecation warnings by using `Module#registerHooks` instead of `Module#register` on Node 26+ ([#20028](https://github.com/tailwindlabs/tailwindcss/pull/20028))
-- Canonicalization: don't crash when plugin utilities throw for unsupported values ([#20052](https://github.com/tailwindlabs/tailwindcss/pull/20052))
-- Allow `@apply` to be used with CSS mixins ([#19427](https://github.com/tailwindlabs/tailwindcss/pull/19427))
-- Ensure `not-*` correctly negates `@container` queries, including `style(…)` queries ([#20059](https://github.com/tailwindlabs/tailwindcss/pull/20059))
-- Ensure `drop-shadow-*` color utilities work with custom shadow values containing `calc(…)` ([#20080](https://github.com/tailwindlabs/tailwindcss/pull/20080))
-- Fix 'Sourcemap is likely to be incorrect' warnings when using `@tailwindcss/vite` ([#20103](https://github.com/tailwindlabs/tailwindcss/pull/20103))
-- Ensure `@tailwindcss/webpack` can be installed in Rspack projects without requiring `webpack` as a peer dependency ([#20027](https://github.com/tailwindlabs/tailwindcss/pull/20027))
-- Canonicalization: don't suggest invalid `calc(…)` expressions (e.g. `px-[calc(1rem+0px)]` → `px-[calc(1rem+0)]`) ([#20127](https://github.com/tailwindlabs/tailwindcss/pull/20127))
-- Canonicalization: avoid suggesting large spacing-scale values for arbitrary lengths (e.g. `left-[99999px]` → `left-[99999px]`, not `left-24999.75`) ([#20130](https://github.com/tailwindlabs/tailwindcss/pull/20130))
-- Ensure `@tailwindcss/cli` in `--watch` mode recovers when a tracked dependency is deleted and restored ([#20137](https://github.com/tailwindlabs/tailwindcss/pull/20137))
-- Ensure standalone `@tailwindcss/cli` binaries are ignored when scanning for class candidates ([#20139](https://github.com/tailwindlabs/tailwindcss/pull/20139))
-- Ensure class candidates are extracted from Twig `addClass(…)` and `removeClass(…)` calls ([#20198](https://github.com/tailwindlabs/tailwindcss/pull/20198))
-- Don't crash in the Ruby or Vue preprocessors when scanning files containing invalid UTF-8 bytes ([#19588](https://github.com/tailwindlabs/tailwindcss/pull/19588))
-- Allow `@variant` to be used inside `addBase` ([#19480](https://github.com/tailwindlabs/tailwindcss/pull/19480))
-- Ensure `@source` globs with symlinks are preserved ([#20203](https://github.com/tailwindlabs/tailwindcss/pull/20203))
-- Ensure later `@source` rules can re-include files excluded by earlier `@source not` rules ([#20203](https://github.com/tailwindlabs/tailwindcss/pull/20203))
-- Upgrade: don't migrate empty class rules to invalid `@utility` rules ([#20205](https://github.com/tailwindlabs/tailwindcss/pull/20205))
-- Ensure transitions between `inset-shadow-none` and other inset shadows work correctly ([#20208](https://github.com/tailwindlabs/tailwindcss/pull/20208))
-- Ensure explicitly referenced `@source` directories are scanned even when ignored by git ([#20214](https://github.com/tailwindlabs/tailwindcss/pull/20214))
-- Ensure `@source` globs ending in `**/*` preserve dynamic path segments to avoid scanning too many files ([#20217](https://github.com/tailwindlabs/tailwindcss/pull/20217))
-- Canonicalization: don't fold `calc(…)` divisions when the result would require high precision (e.g. `w-[calc(100%/3.5)]` → `w-[calc(100%/3.5)]`, not `w-[28.571428571428573%]`) ([#20221](https://github.com/tailwindlabs/tailwindcss/pull/20221))
-- Serve ESM type declarations to ESM importers of `@tailwindcss/postcss` ([#20228](https://github.com/tailwindlabs/tailwindcss/pull/20228))
-
-### Changed
-
-- Generate `0` instead of `calc(var(--spacing) * 0)` for spacing utilities like `m-0` and `left-0` ([#20196](https://github.com/tailwindlabs/tailwindcss/pull/20196))
-- Generate `var(--spacing)` instead of `calc(var(--spacing) * 1)` for spacing utilities like `m-1` and `left-1` ([#20196](https://github.com/tailwindlabs/tailwindcss/pull/20196))
-
-## [4.3.0] - 2026-05-08
-
-### Added
-
-- Add `@container-size` utility ([#18901](https://github.com/tailwindlabs/tailwindcss/pull/18901))
-- Add `scrollbar-{auto,thin,none}` utilities for `scrollbar-width`, and `scrollbar-thumb-*` / `scrollbar-track-*` color utilities for `scrollbar-color` ([#19981](https://github.com/tailwindlabs/tailwindcss/pull/19981), [#20019](https://github.com/tailwindlabs/tailwindcss/pull/20019))
-- Add `scrollbar-gutter-*` utilities ([#20018](https://github.com/tailwindlabs/tailwindcss/pull/20018))
-- Add `zoom-*` utilities ([#20020](https://github.com/tailwindlabs/tailwindcss/pull/20020))
-- Add `tab-*` utilities ([#20022](https://github.com/tailwindlabs/tailwindcss/pull/20022))
-- Allow using `@variant` with stacked variants (e.g. `@variant hover:focus { … }`) ([#19996](https://github.com/tailwindlabs/tailwindcss/pull/19996))
-- Allow using `@variant` with compound variants (e.g. `@variant hover, focus { … }`) ([#19996](https://github.com/tailwindlabs/tailwindcss/pull/19996))
-- Support `--default(…)` in `--value(…)` and `--modifier(…)` for functional `@utility` definitions ([#19989](https://github.com/tailwindlabs/tailwindcss/pull/19989))
-
-### Fixed
-
-- Ensure `@plugin` resolves package JavaScript entries instead of browser CSS entries when using `@tailwindcss/vite` ([#19949](https://github.com/tailwindlabs/tailwindcss/pull/19949))
-- Fix relative `@import` and `@plugin` paths resolving from the wrong directory when using `@tailwindcss/vite` ([#19965](https://github.com/tailwindlabs/tailwindcss/pull/19965))
-- Ensure CSS files containing `@variant` are processed by `@tailwindcss/vite` ([#19966](https://github.com/tailwindlabs/tailwindcss/pull/19966))
-- Resolve imports relative to `base` when `result.opts.from` is not provided when using `@tailwindcss/postcss` ([#19980](https://github.com/tailwindlabs/tailwindcss/pull/19980))
-- Canonicalization: preserve significant `_` whitespace in arbitrary values ([#19986](https://github.com/tailwindlabs/tailwindcss/pull/19986))
-- Canonicalization: add parentheses when removing whitespace from arbitrary values would hurt readability (e.g. `w-[calc(100%---spacing(60))]` → `w-[calc(100%-(--spacing(60)))]`) ([#19986](https://github.com/tailwindlabs/tailwindcss/pull/19986))
-- Canonicalization: preserve the original unit in arbitrary values instead of normalizing to base units (e.g. `-mt-[20in]` → `mt-[-20in]`, not `mt-[-1920px]`) ([#19988](https://github.com/tailwindlabs/tailwindcss/pull/19988))
-- Canonicalization: migrate arbitrary `:has()` variants from `[&:has(…)]` to `has-[…]` ([#19991](https://github.com/tailwindlabs/tailwindcss/pull/19991))
-- Upgrade: don’t migrate inline `style` attributes (e.g. `style="flex-grow: 1"` → `style="flex-grow: 1"`, not `style="grow: 1"`) ([#19918](https://github.com/tailwindlabs/tailwindcss/pull/19918))
-- Allow multiple `@utility` definitions with the same name but different value types ([#19777](https://github.com/tailwindlabs/tailwindcss/pull/19777))
-- Export missing `PluginWithConfig` type from `tailwindcss/plugin` to fix errors when inferring plugin config types ([#19707](https://github.com/tailwindlabs/tailwindcss/pull/19707))
-- Ensure `start` and `end` legacy utilities without values do not generate CSS ([#20003](https://github.com/tailwindlabs/tailwindcss/pull/20003))
-- Ensure `--value(…)` is required in functional `@utility` definitions ([#20005](https://github.com/tailwindlabs/tailwindcss/pull/20005))
-- Canonicalization: preserve required whitespace around operators in negated arbitrary values (e.g. `-left-[(var(--a)+var(--b))]`) ([#20011](https://github.com/tailwindlabs/tailwindcss/pull/20011))
-
-## [4.2.4] - 2026-04-21
-
-### Fixed
-
-- Ensure imports in `@import` and `@plugin` still resolve correctly when using Vite aliases in `@tailwindcss/vite` ([#19947](https://github.com/tailwindlabs/tailwindcss/pull/19947))
-
-## [4.2.3] - 2026-04-20
-
-### Fixed
-
-- Canonicalization: improve canonicalization for `tracking-*` utilities by preferring non-negative utilities (e.g. `-tracking-tighter` → `tracking-wider`) ([#19827](https://github.com/tailwindlabs/tailwindcss/pull/19827))
-- Fix crash due to invalid characters in candidate (exceeding valid unicode code point range) ([#19829](https://github.com/tailwindlabs/tailwindcss/pull/19829))
-- Ensure query params in imports are considered unique resources when using `@tailwindcss/webpack` ([#19723](https://github.com/tailwindlabs/tailwindcss/pull/19723))
-- Canonicalization: collapse arbitrary values into shorthand utilities (e.g. `px-[1.2rem] py-[1.2rem]` → `p-[1.2rem]`) ([#19837](https://github.com/tailwindlabs/tailwindcss/pull/19837))
-- Canonicalization: collapse `border-{t,b}-*` into `border-y-*`, `border-{l,r}-*` into `border-x-*`, and `border-{t,r,b,l}-*` into `border-*` ([#19842](https://github.com/tailwindlabs/tailwindcss/pull/19842))
-- Canonicalization: collapse `scroll-m{t,b}-*` into `scroll-my-*`, `scroll-m{l,r}-*` into `scroll-mx-*`, and `scroll-m{t,r,b,l}-*` into `scroll-m-*` ([#19842](https://github.com/tailwindlabs/tailwindcss/pull/19842))
-- Canonicalization: collapse `scroll-p{t,b}-*` into `scroll-py-*`, `scroll-p{l,r}-*` into `scroll-px-*`, and `scroll-p{t,r,b,l}-*` into `scroll-p-*` ([#19842](https://github.com/tailwindlabs/tailwindcss/pull/19842))
-- Canonicalization: collapse `overflow-{x,y}-*` into `overflow-*` ([#19842](https://github.com/tailwindlabs/tailwindcss/pull/19842))
-- Canonicalization: collapse `overscroll-{x,y}-*` into `overscroll-*` ([#19842](https://github.com/tailwindlabs/tailwindcss/pull/19842))
-- Read from `--placeholder-color` instead of `--background-color` for `placeholder-*` utilities ([#19843](https://github.com/tailwindlabs/tailwindcss/pull/19843))
-- Upgrade: ensure files are not emptied out when killing the upgrade process while it's running ([#19846](https://github.com/tailwindlabs/tailwindcss/pull/19846))
-- Upgrade: use `config.content` when migrating from Tailwind CSS v3 to Tailwind CSS v4 ([#19846](https://github.com/tailwindlabs/tailwindcss/pull/19846))
-- Upgrade: never migrate files that are ignored by git ([#19846](https://github.com/tailwindlabs/tailwindcss/pull/19846))
-- Add `.env` and `.env.*` to default ignored content files ([#19846](https://github.com/tailwindlabs/tailwindcss/pull/19846))
-- Canonicalization: migrate `overflow-ellipsis` into `text-ellipsis` ([#19849](https://github.com/tailwindlabs/tailwindcss/pull/19849))
-- Canonicalization: migrate `start-full` → `inset-s-full`, `start-auto` → `inset-s-auto`, `start-px` → `inset-s-px`, and `start-<number>` → `inset-s-<number>` as well as negative versions ([#19849](https://github.com/tailwindlabs/tailwindcss/pull/19849))
-- Canonicalization: migrate `end-full` → `inset-e-full`, `end-auto` → `inset-e-auto`, `end-px` → `inset-e-px`, and `end-<number>` → `inset-e-<number>` as well as negative versions ([#19849](https://github.com/tailwindlabs/tailwindcss/pull/19849))
-- Canonicalization: move the `-` sign inside the arbitrary value `-left-[9rem]` → `left-[-9rem]` ([#19858](https://github.com/tailwindlabs/tailwindcss/pull/19858))
-- Canonicalization: move the `-` sign outside the arbitrary value `ml-[calc(-1*var(--width))]` → `-ml-(--width)` ([#19858](https://github.com/tailwindlabs/tailwindcss/pull/19858))
-- Improve performance when scanning JSONL / NDJSON files ([#19862](https://github.com/tailwindlabs/tailwindcss/pull/19862))
-- Support `NODE_PATH` environment variable in standalone CLI ([#19617](https://github.com/tailwindlabs/tailwindcss/pull/19617))
-
-## [4.2.2] - 2026-03-18
-
-### Fixed
-
-- Don't crash when candidates contain prototype properties like `row-constructor` ([#19725](https://github.com/tailwindlabs/tailwindcss/pull/19725))
-- Canonicalize `calc(var(--spacing)*…)` expressions into `--spacing(…)` ([#19769](https://github.com/tailwindlabs/tailwindcss/pull/19769))
-- Fix crash in canonicalization step when handling utilities containing `@property` at-rules (e.g. `shadow-sm border`) ([#19727](https://github.com/tailwindlabs/tailwindcss/pull/19727))
-- Skip full reload for server only modules scanned by client CSS when using `@tailwindcss/vite` ([#19745](https://github.com/tailwindlabs/tailwindcss/pull/19745))
-- Add support for Vite 8 in `@tailwindcss/vite` ([#19790](https://github.com/tailwindlabs/tailwindcss/pull/19790))
-- Improve canonicalization for bare values exceeding default spacing scale suggestions (e.g. `w-1234 h-1234` → `size-1234`) ([#19809](https://github.com/tailwindlabs/tailwindcss/pull/19809))
-- Fix canonicalization resulting in empty list (e.g. `w-5 h-5 size-5` → `''` instead of `size-5`) ([#19812](https://github.com/tailwindlabs/tailwindcss/pull/19812))
-- Resolve tsconfig paths to allow for `@import '@/path/to/file';` when using `@tailwindcss/vite` ([#19803](https://github.com/tailwindlabs/tailwindcss/pull/19803))
-
-## [4.2.1] - 2026-02-23
-
-### Fixed
-
-- Allow trailing dash in functional utility names for backwards compatibility ([#19696](https://github.com/tailwindlabs/tailwindcss/pull/19696))
-- Properly detect classes containing `.` characters within curly braces in MDX files ([#19711](https://github.com/tailwindlabs/tailwindcss/pull/19711))
-
-## [4.2.0] - 2026-02-18
-
-### Added
-
-- Add mauve, olive, mist, and taupe color palettes to the default theme ([#19627](https://github.com/tailwindlabs/tailwindcss/pull/19627))
-- Add `@tailwindcss/webpack` package to run Tailwind CSS as a webpack plugin ([#19610](https://github.com/tailwindlabs/tailwindcss/pull/19610))
-- Add `pbs-*` and `pbe-*` utilities for `padding-block-start` and `padding-block-end` ([#19601](https://github.com/tailwindlabs/tailwindcss/pull/19601))
-- Add `mbs-*` and `mbe-*` utilities for `margin-block-start` and `margin-block-end` ([#19601](https://github.com/tailwindlabs/tailwindcss/pull/19601))
-- Add `scroll-pbs-*` and `scroll-pbe-*` utilities for `scroll-padding-block-start` and `scroll-padding-block-end` ([#19601](https://github.com/tailwindlabs/tailwindcss/pull/19601))
-- Add `scroll-mbs-*` and `scroll-mbe-*` utilities for `scroll-margin-block-start` and `scroll-margin-block-end` ([#19601](https://github.com/tailwindlabs/tailwindcss/pull/19601))
-- Add `border-bs-*` and `border-be-*` utilities for `border-block-start` and `border-block-end` ([#19601](https://github.com/tailwindlabs/tailwindcss/pull/19601))
-- Add `inline-*`, `min-inline-*`, `max-inline-*` utilities for `inline-size`, `min-inline-size`, and `max-inline-size` ([#19612](https://github.com/tailwindlabs/tailwindcss/pull/19612))
-- Add `block-*`, `min-block-*`, `max-block-*` utilities for `block-size`, `min-block-size`, and `max-block-size` ([#19612](https://github.com/tailwindlabs/tailwindcss/pull/19612))
-- Add `inset-s-*`, `inset-e-*`, `inset-bs-*`, `inset-be-*` utilities for `inset-inline-start`, `inset-inline-end`, `inset-block-start`, and `inset-block-end` ([#19613](https://github.com/tailwindlabs/tailwindcss/pull/19613))
-- Add `font-features-*` utility for `font-feature-settings` ([#19623](https://github.com/tailwindlabs/tailwindcss/pull/19623))
-
-### Fixed
-
-- Prevent double `@supports` wrapper for `color-mix` values ([#19450](https://github.com/tailwindlabs/tailwindcss/pull/19450))
-- Allow whitespace around `@source inline()` argument ([#19461](https://github.com/tailwindlabs/tailwindcss/pull/19461))
-- Emit comment when source maps are saved to files when using `@tailwindcss/cli` ([#19447](https://github.com/tailwindlabs/tailwindcss/pull/19447))
-- Detect utilities containing capital letters followed by numbers ([#19465](https://github.com/tailwindlabs/tailwindcss/pull/19465))
-- Fix class extraction for Rails' strict locals ([#19525](https://github.com/tailwindlabs/tailwindcss/pull/19525))
-- Align `@utility` name validation with Oxide scanner rules ([#19524](https://github.com/tailwindlabs/tailwindcss/pull/19524))
-- Fix infinite loop when using `@variant` inside `@custom-variant` ([#19633](https://github.com/tailwindlabs/tailwindcss/pull/19633))
-- Allow multiples of `.25` in `aspect-*` fractions (e.g. `aspect-8.5/11`) ([#19688](https://github.com/tailwindlabs/tailwindcss/pull/19688))
-- Ensure changes to external files listed via `@source` trigger a full page reload when using `@tailwindcss/vite` ([#19670](https://github.com/tailwindlabs/tailwindcss/pull/19670))
-- Improve performance of Oxide scanner in bigger projects by reducing file system walks ([#19632](https://github.com/tailwindlabs/tailwindcss/pull/19632))
-- Ensure import aliases in Astro v5 work without crashing when using `@tailwindcss/vite` ([#19677](https://github.com/tailwindlabs/tailwindcss/issues/19677))
-- Allow escape characters in `@utility` names to improve support with formatters such as Biome ([#19626](https://github.com/tailwindlabs/tailwindcss/pull/19626))
-- Fix incorrect canonicalization results when canonicalizing multiple times ([#19675](https://github.com/tailwindlabs/tailwindcss/pull/19675))
-- Add `.jj` to default ignored content directories ([#19687](https://github.com/tailwindlabs/tailwindcss/pull/19687))
-
-### Deprecated
-
-- Deprecate `start-*` and `end-*` utilities in favor of `inset-s-*` and `inset-e-*` utilities ([#19613](https://github.com/tailwindlabs/tailwindcss/pull/19613))
-
-## [4.1.18] - 2025-12-11
-
-### Fixed
-
-- Ensure validation of `source(…)` happens relative to the file it is in ([#19274](https://github.com/tailwindlabs/tailwindcss/pull/19274))
-- Include filename and line numbers in CSS parse errors ([#19282](https://github.com/tailwindlabs/tailwindcss/pull/19282))
-- Skip comments in Ruby files when checking for class names ([#19243](https://github.com/tailwindlabs/tailwindcss/pull/19243))
-- Skip over arbitrary property utilities with a top-level `!` in the value ([#19243](https://github.com/tailwindlabs/tailwindcss/pull/19243))
-- Support environment API in `@tailwindcss/vite` ([#18970](https://github.com/tailwindlabs/tailwindcss/pull/18970))
-- Preserve case of theme keys from JS configs and plugins ([#19337](https://github.com/tailwindlabs/tailwindcss/pull/19337))
-- Write source maps correctly on the CLI when using `--watch` ([#19373](https://github.com/tailwindlabs/tailwindcss/pull/19373))
-- Handle special defaults (like `ringColor.DEFAULT`) in JS configs ([#19348](https://github.com/tailwindlabs/tailwindcss/pull/19348))
-- Improve backwards compatibility for `content` theme key from JS configs ([#19381](https://github.com/tailwindlabs/tailwindcss/pull/19381))
-- Upgrade: Handle `future` and `experimental` config keys ([#19344](https://github.com/tailwindlabs/tailwindcss/pull/19344))
-- Try to canonicalize any arbitrary utility to a bare value ([#19379](https://github.com/tailwindlabs/tailwindcss/pull/19379))
-- Validate candidates similarly to Oxide ([#19397](https://github.com/tailwindlabs/tailwindcss/pull/19397))
-- Canonicalization: combine `text-*` and `leading-*` classes ([#19396](https://github.com/tailwindlabs/tailwindcss/pull/19396))
-- Correctly handle duplicate CLI arguments ([#19416](https://github.com/tailwindlabs/tailwindcss/pull/19416))
-- Don’t emit color-mix fallback rules inside `@keyframes` ([#19419](https://github.com/tailwindlabs/tailwindcss/pull/19419))
-- CLI: Don't hang when output is `/dev/stdout` ([#19421](https://github.com/tailwindlabs/tailwindcss/pull/19421))
-
-## [3.4.19] - 2025-12-10
-
-### Fixed
-
-- Don’t break `sibling-*()` functions when used inside `calc(…)` ([#19335](https://github.com/tailwindlabs/tailwindcss/pull/19335))
-
-## [4.1.17] - 2025-11-06
-
-### Fixed
-
-- Substitute `@variant` inside legacy JS APIs ([#19263](https://github.com/tailwindlabs/tailwindcss/pull/19263))
-- Prevent occasional crash on Windows when loaded into a worker thread ([#19242](https://github.com/tailwindlabs/tailwindcss/pull/19242))
-
-## [4.1.16] - 2025-10-23
-
-### Fixed
-
-- Discard candidates with an empty data type ([#19172](https://github.com/tailwindlabs/tailwindcss/pull/19172))
-- Fix canonicalization of arbitrary variants with attribute selectors ([#19176](https://github.com/tailwindlabs/tailwindcss/pull/19176))
-- Fix invalid colors due to nested `&` ([#19184](https://github.com/tailwindlabs/tailwindcss/pull/19184))
-- Improve canonicalization for `& > :pseudo` and `& :pseudo` arbitrary variants ([#19178](https://github.com/tailwindlabs/tailwindcss/pull/19178))
-
-## [4.1.15] - 2025-10-20
-
-### Fixed
-
-- Fix Safari devtools rendering issue due to `color-mix` fallback ([#19069](https://github.com/tailwindlabs/tailwindcss/pull/19069))
-- Suppress Lightning CSS warnings about `:deep`, `:slotted`, and `:global` ([#19094](https://github.com/tailwindlabs/tailwindcss/pull/19094))
-- Fix resolving theme keys when starting with the name of another theme key in JS configs and plugins ([#19097](https://github.com/tailwindlabs/tailwindcss/pull/19097))
-- Allow named groups in combination with `not-*`, `has-*`, and `in-*` ([#19100](https://github.com/tailwindlabs/tailwindcss/pull/19100))
-- Prevent important utilities from affecting other utilities ([#19110](https://github.com/tailwindlabs/tailwindcss/pull/19110))
-- Don’t index into strings with the `theme(…)` function ([#19111](https://github.com/tailwindlabs/tailwindcss/pull/19111))
-- Fix parsing issue when `\t` is used in at-rules ([#19130](https://github.com/tailwindlabs/tailwindcss/pull/19130))
-- Upgrade: Canonicalize utilities containing `0` values ([#19095](https://github.com/tailwindlabs/tailwindcss/pull/19095))
-- Upgrade: Migrate deprecated `break-words` to `wrap-break-word` ([#19157](https://github.com/tailwindlabs/tailwindcss/pull/19157))
-
-### Changed
-
-- Remove the `postinstall` script from oxide ([#19149])(https://github.com/tailwindlabs/tailwindcss/pull/19149)
-
-## [4.1.14] - 2025-10-01
-
-### Fixed
-
-- Handle `'` syntax in ClojureScript when extracting classes ([#18888](https://github.com/tailwindlabs/tailwindcss/pull/18888))
-- Handle `@variant` inside `@custom-variant` ([#18885](https://github.com/tailwindlabs/tailwindcss/pull/18885))
-- Merge suggestions when using `@utility` ([#18900](https://github.com/tailwindlabs/tailwindcss/pull/18900))
-- Ensure that file system watchers created when using the CLI are always cleaned up ([#18905](https://github.com/tailwindlabs/tailwindcss/pull/18905))
-- Do not generate `grid-column` utilities when configuring `grid-column-start` or `grid-column-end` ([#18907](https://github.com/tailwindlabs/tailwindcss/pull/18907))
-- Do not generate `grid-row` utilities when configuring `grid-row-start` or `grid-row-end` ([#18907](https://github.com/tailwindlabs/tailwindcss/pull/18907))
-- Prevent duplicate CSS when overwriting a static utility with a theme key ([#18056](https://github.com/tailwindlabs/tailwindcss/pull/18056))
-- Show Lightning CSS warnings (if any) when optimizing/minifying ([#18918](https://github.com/tailwindlabs/tailwindcss/pull/18918))
-- Use `default` export condition for `@tailwindcss/vite` ([#18948](https://github.com/tailwindlabs/tailwindcss/pull/18948))
-- Re-throw errors from PostCSS nodes ([#18373](https://github.com/tailwindlabs/tailwindcss/pull/18373))
-- Detect classes in markdown inline directives ([#18967](https://github.com/tailwindlabs/tailwindcss/pull/18967))
-- Ensure files with only `@theme` produce no output when built ([#18979](https://github.com/tailwindlabs/tailwindcss/pull/18979))
-- Support Maud templates when extracting classes ([#18988](https://github.com/tailwindlabs/tailwindcss/pull/18988))
-- Upgrade: Do not migrate `variant = 'outline'` during upgrades ([#18922](https://github.com/tailwindlabs/tailwindcss/pull/18922))
-- Upgrade: Show version mismatch (if any) when running upgrade tool ([#19028](https://github.com/tailwindlabs/tailwindcss/pull/19028))
-- Upgrade: Ensure first class inside `className` is migrated ([#19031](https://github.com/tailwindlabs/tailwindcss/pull/19031))
-- Upgrade: Migrate classes inside `*ClassName` and `*Class` attributes ([#19031](https://github.com/tailwindlabs/tailwindcss/pull/19031))
-
-## [3.4.18] - 2025-10-01
-
-### Fixed
-
-- Improve support for raw `supports-[…]` queries in arbitrary values ([#13605](https://github.com/tailwindlabs/tailwindcss/pull/13605))
-- Fix `require.cache` error when loaded through a TypeScript file in Node 22.18+ ([#18665](https://github.com/tailwindlabs/tailwindcss/pull/18665))
-- Support `import.meta.resolve(…)` in configs for new enough Node.js versions ([#18938](https://github.com/tailwindlabs/tailwindcss/pull/18938))
-- Allow using newer versions of `postcss-load-config` for better ESM and TypeScript PostCSS config support with the CLI ([#18938](https://github.com/tailwindlabs/tailwindcss/pull/18938))
-- Remove irrelevant utility rules when matching important classes ([#19030](https://github.com/tailwindlabs/tailwindcss/pull/19030))
-
-## [4.1.13] - 2025-09-03
-
-### Changed
-
-- Drop warning from browser build ([#18731](https://github.com/tailwindlabs/tailwindcss/issues/18731))
-- Drop exact duplicate declarations when emitting CSS ([#18809](https://github.com/tailwindlabs/tailwindcss/issues/18809))
-
-### Fixed
-
-- Don't transition `visibility` when using `transition` ([#18795](https://github.com/tailwindlabs/tailwindcss/pull/18795))
-- Discard matched variants with unknown named values ([#18799](https://github.com/tailwindlabs/tailwindcss/pull/18799))
-- Discard matched variants with non-string values ([#18799](https://github.com/tailwindlabs/tailwindcss/pull/18799))
-- Show suggestions for known `matchVariant` values ([#18798](https://github.com/tailwindlabs/tailwindcss/pull/18798))
-- Replace deprecated `clip` with `clip-path` in `sr-only` ([#18769](https://github.com/tailwindlabs/tailwindcss/pull/18769))
-- Hide internal fields from completions in `matchUtilities` ([#18820](https://github.com/tailwindlabs/tailwindcss/pull/18820))
-- Ignore `.vercel` folders by default (can be overridden by `@source …` rules) ([#18855](https://github.com/tailwindlabs/tailwindcss/pull/18855))
-- Consider variants starting with `@-` to be invalid (e.g. `@-2xl:flex`) ([#18869](https://github.com/tailwindlabs/tailwindcss/pull/18869))
-- Do not allow custom variants to start or end with a `-` or `_` ([#18867](https://github.com/tailwindlabs/tailwindcss/pull/18867), [#18872](https://github.com/tailwindlabs/tailwindcss/pull/18872))
-- Upgrade: Migrate `aria` theme keys to `@custom-variant` ([#18815](https://github.com/tailwindlabs/tailwindcss/pull/18815))
-- Upgrade: Migrate `data` theme keys to `@custom-variant` ([#18816](https://github.com/tailwindlabs/tailwindcss/pull/18816))
-- Upgrade: Migrate `supports` theme keys to `@custom-variant` ([#18817](https://github.com/tailwindlabs/tailwindcss/pull/18817))
-
-## [4.1.12] - 2025-08-13
-
-### Fixed
-
-- Don't consider the global important state in `@apply` ([#18404](https://github.com/tailwindlabs/tailwindcss/pull/18404))
-- Add missing suggestions for `flex-<number>` utilities ([#18642](https://github.com/tailwindlabs/tailwindcss/pull/18642))
-- Fix trailing `)` from interfering with extraction in Clojure keywords ([#18345](https://github.com/tailwindlabs/tailwindcss/pull/18345))
-- Detect classes inside Elixir charlist, word list, and string sigils ([#18432](https://github.com/tailwindlabs/tailwindcss/pull/18432))
-- Track source locations through `@plugin` and `@config` ([#18345](https://github.com/tailwindlabs/tailwindcss/pull/18345))
-- Allow boolean values of `process.env.DEBUG` in `@tailwindcss/node` ([#18485](https://github.com/tailwindlabs/tailwindcss/pull/18485))
-- Ignore consecutive semicolons in the CSS parser ([#18532](https://github.com/tailwindlabs/tailwindcss/pull/18532))
-- Center the dropdown icon added to an input with a paired datalist by default ([#18511](https://github.com/tailwindlabs/tailwindcss/pull/18511))
-- Extract candidates in Slang templates ([#18565](https://github.com/tailwindlabs/tailwindcss/pull/18565))
-- Improve error messages when encountering invalid functional utility names ([#18568](https://github.com/tailwindlabs/tailwindcss/pull/18568))
-- Discard CSS AST objects with `false` or `undefined` properties ([#18571](https://github.com/tailwindlabs/tailwindcss/pull/18571))
-- Allow users to disable URL rebasing in `@tailwindcss/postcss` via `transformAssetUrls: false` ([#18321](https://github.com/tailwindlabs/tailwindcss/pull/18321))
-- Fix false-positive migrations in `addEventListener` and JavaScript variable names ([#18718](https://github.com/tailwindlabs/tailwindcss/pull/18718))
-- Fix Standalone CLI showing default Bun help when run via symlink on Windows ([#18723](https://github.com/tailwindlabs/tailwindcss/pull/18723))
-- Read from `--border-color-*` theme keys in `divide-*` utilities for backwards compatibility ([#18704](https://github.com/tailwindlabs/tailwindcss/pull/18704/))
-- Don't scan `.hdr` and `.exr` files for classes by default ([#18734](https://github.com/tailwindlabs/tailwindcss/pull/18734))
-
-## [4.1.11] - 2025-06-26
-
-### Fixed
-
-- Add heuristic to skip candidate migrations inside `emit(…)` ([#18330](https://github.com/tailwindlabs/tailwindcss/pull/18330))
-- Extract candidates with variants in Clojure/ClojureScript keywords ([#18338](https://github.com/tailwindlabs/tailwindcss/pull/18338))
-- Document `--watch=always` in the CLI's usage ([#18337](https://github.com/tailwindlabs/tailwindcss/pull/18337))
-- Add support for Vite 7 to `@tailwindcss/vite` ([#18384](https://github.com/tailwindlabs/tailwindcss/pull/18384))
-
-## [4.1.10] - 2025-06-11
-
-### Fixed
-
-- Fix incorrectly generated CSS when using percentages in arbitrary values with calc (e.g. `w-[calc(100%-var(--offset))]`) ([#18289](https://github.com/tailwindlabs/tailwindcss/pull/18289))
-
-## [4.1.9] - 2025-06-11
-
-### Fixed
-
-- Correctly parse custom properties with strings containing semicolons ([#18251](https://github.com/tailwindlabs/tailwindcss/pull/18251))
-- Upgrade: Migrate arbitrary modifiers without percentage signs to bare values (e.g. `/[0.16]` → `/16`) ([#18184](https://github.com/tailwindlabs/tailwindcss/pull/18184))
-- Upgrade: Migrate CSS variable shorthands where fallback value contains function call ([#18184](https://github.com/tailwindlabs/tailwindcss/pull/18184))
-- Upgrade: Migrate negative arbitrary values to negative bare values (e.g. `mb-[-32rem]` → `-mb-128`) ([#18212](https://github.com/tailwindlabs/tailwindcss/pull/18212))
-- Upgrade: Do not migrate `blur` in `wire:model.blur` ([#18216](https://github.com/tailwindlabs/tailwindcss/pull/18216))
-- Don't add spaces around CSS dashed idents when formatting math expressions ([#18220](https://github.com/tailwindlabs/tailwindcss/pull/18220))
-
-## [4.1.8] - 2025-05-27
-
-### Added
-
-- Improve error messages when `@apply` fails ([#18059](https://github.com/tailwindlabs/tailwindcss/pull/18059))
-
-### Fixed
-
-- Upgrade: Do not migrate declarations that look like candidates in `<style>` blocks ([#18057](https://github.com/tailwindlabs/tailwindcss/pull/18057), [18068](https://github.com/tailwindlabs/tailwindcss/pull/18068))
-- Upgrade: Don't error when looking for `tailwindcss` in pnpm monorepos ([#18065](https://github.com/tailwindlabs/tailwindcss/pull/18065))
-- Upgrade: Don't error when updating dependencies in pnpm monorepos ([#18065](https://github.com/tailwindlabs/tailwindcss/pull/18065))
-- Upgrade: Migrate deprecated `order-none` to `order-0` ([#18126](https://github.com/tailwindlabs/tailwindcss/pull/18126))
-- Support Leptos `class:` attributes when extracting classes ([#18093](https://github.com/tailwindlabs/tailwindcss/pull/18093))
-- Fix "Cannot read properties of undefined" crash on malformed arbitrary value ([#18133](https://github.com/tailwindlabs/tailwindcss/pull/18133))
-- Upgrade: Migrate `-mt-[0px]` to `mt-[0px]` instead of the other way around ([#18154](https://github.com/tailwindlabs/tailwindcss/pull/18154))
-- Fix Haml pre-processing crash when there is no `\n` at the end of the file ([#18155](https://github.com/tailwindlabs/tailwindcss/pull/18155))
-- Ignore `.pnpm-store` folders by default (can be overridden by `@source …` rules) ([#18163](https://github.com/tailwindlabs/tailwindcss/pull/18163))
-- Fix PostCSS crash when calling `toJSON()` ([#18083](https://github.com/tailwindlabs/tailwindcss/pull/18083))
-
-## [4.1.7] - 2025-05-15
-
-### Added
-
-- Upgrade: Migrate bare values to named values ([#18000](https://github.com/tailwindlabs/tailwindcss/pull/18000))
-- Upgrade: Added cache to improve template migration performance ([#18025](https://github.com/tailwindlabs/tailwindcss/pull/18025))
-
-### Fixed
-
-- Allow `_` before numbers during candidate extraction ([#17961](https://github.com/tailwindlabs/tailwindcss/pull/17961))
-- Prevent duplicate suggestions when using `@theme` and `@utility` together ([#17675](https://github.com/tailwindlabs/tailwindcss/pull/17675))
-- Ensure that media queries within `::before` and `::after` pseudo selectors create valid CSS rules in production builds ([#17979](https://github.com/tailwindlabs/tailwindcss/pull/17979))
-- Ensure that the standalone CLI does not leave temporary files behind ([#17981](https://github.com/tailwindlabs/tailwindcss/pull/17981))
-- Ensure `-rotate-*` utilities properly negate arbitrary values ([#18014](https://github.com/tailwindlabs/tailwindcss/pull/18014))
-- Ignore custom variants using `:merge(…)` selectors in legacy JS plugins ([#18020](https://github.com/tailwindlabs/tailwindcss/pull/18020))
-- Ensure classes containing `.` are properly extracted from Clojure files ([#18038](https://github.com/tailwindlabs/tailwindcss/pull/18038))
-- Upgrade: Fix error when using `@import … source(…)` ([#17963](https://github.com/tailwindlabs/tailwindcss/pull/17963))
-- Upgrade: Change casing of utilities with named values to kebab-case to match updated theme variables ([#18017](https://github.com/tailwindlabs/tailwindcss/pull/18017))
-- Upgrade: Don't migrate strings that match utility names in Vue attribute bindings other than `class` ([#18025](https://github.com/tailwindlabs/tailwindcss/pull/18025))
-
-## [4.1.6] - 2025-05-09
-
-### Added
-
-- Upgrade: Automatically convert arbitrary values to named values when possible (e.g. `h-[1lh]` to `h-lh`) ([#17831](https://github.com/tailwindlabs/tailwindcss/pull/17831), [#17854](https://github.com/tailwindlabs/tailwindcss/pull/17854))
-- Upgrade: Update dependencies in parallel for improved performance ([#17898](https://github.com/tailwindlabs/tailwindcss/pull/17898))
-- Add detailed logging about `@source` directives, discovered files and scanned files when using `DEBUG=*` ([#17906](https://github.com/tailwindlabs/tailwindcss/pull/17906), [#17952](https://github.com/tailwindlabs/tailwindcss/pull/17952))
-- Add support for generating source maps in development ([#17775](https://github.com/tailwindlabs/tailwindcss/pull/17775))
-
-### Fixed
-
-- Ensure negative arbitrary `scale` values generate negative values ([#17831](https://github.com/tailwindlabs/tailwindcss/pull/17831))
-- Fix HAML extraction with embedded Ruby ([#17846](https://github.com/tailwindlabs/tailwindcss/pull/17846))
-- Don't scan files for utilities when using `@reference` ([#17836](https://github.com/tailwindlabs/tailwindcss/pull/17836))
-- Fix incorrectly replacing `_` with ` ` in arbitrary modifier shorthand `bg-red-500/(--my_opacity)` ([#17889](https://github.com/tailwindlabs/tailwindcss/pull/17889))
-- Don't scan `.log` files for classes by default ([#17906](https://github.com/tailwindlabs/tailwindcss/pull/17906))
-- Ensure that custom utilities applying other custom utilities don't swallow nested `@apply` rules ([#17925](https://github.com/tailwindlabs/tailwindcss/pull/17925))
-- Download platform specific package if `optionalDependencies` are skipped ([#17929](https://github.com/tailwindlabs/tailwindcss/pull/17929))
-
-## [4.1.5] - 2025-04-30
-
-### Added
-
-- Support using `@tailwindcss/upgrade` to upgrade between versions of v4.\* ([#17717](https://github.com/tailwindlabs/tailwindcss/pull/17717))
-- Add `h-lh` / `min-h-lh` / `max-h-lh` utilities ([#17790](https://github.com/tailwindlabs/tailwindcss/pull/17790))
-- Transition `display`, `visibility`, `content-visibility`, `overlay`, and `pointer-events` when using `transition` to simplify `@starting-style` usage ([#17812](https://github.com/tailwindlabs/tailwindcss/pull/17812))
-
-### Fixed
-
-- Don't scan `.geojson` or `.db` files for classes by default ([#17700](https://github.com/tailwindlabs/tailwindcss/pull/17700), [#17711](https://github.com/tailwindlabs/tailwindcss/pull/17711))
-- Hide default shadow suggestions when missing default shadow theme keys ([#17743](https://github.com/tailwindlabs/tailwindcss/pull/17743))
-- Replace `_` with `.` in theme suggestions for `@utility` if surrounded by digits ([#17733](https://github.com/tailwindlabs/tailwindcss/pull/17733))
-- Skip `color-mix(…)` when opacity is `100%` ([#17815](https://github.com/tailwindlabs/tailwindcss/pull/17815))
-- PostCSS: Ensure that errors in imported stylesheets are recoverable ([#17754](https://github.com/tailwindlabs/tailwindcss/pull/17754))
-- Upgrade: Bump all Tailwind CSS related dependencies during upgrade ([#17763](https://github.com/tailwindlabs/tailwindcss/pull/17763))
-- Upgrade: Don't add `-` to variants starting with `@` ([#17814](https://github.com/tailwindlabs/tailwindcss/pull/17814))
-- Upgrade: Don't format stylesheets that didn't change when upgrading ([#17824](https://github.com/tailwindlabs/tailwindcss/pull/17824))
-
-### Changed
-
-- Ignore `.hg`, `.svn`, `.venv`, `venv`, `.yarn`, `.next`, `.turbo`, `.parcel-cache`, `__pycache__`, and `.svelte-kit` folders by default (can be overridden by `@source …` rules) ([#17892](https://github.com/tailwindlabs/tailwindcss/pull/17892))
-- `@source` rules that point inside `.hg`, `.svn`, `.venv`, `venv`, `.yarn`, `.next`, `.turbo`, `.parcel-cache`, `__pycache__`, and `.svelte-kit` folders no longer consider your `.gitignore` rules ([#17892](https://github.com/tailwindlabs/tailwindcss/pull/17892))
-
-## [4.1.4] - 2025-04-14
-
-### Added
-
-- Add experimental `@tailwindcss/oxide-wasm32-wasi` target for running Tailwind in browser environments like StackBlitz ([#17558](https://github.com/tailwindlabs/tailwindcss/pull/17558))
-
-### Fixed
-
-- Ensure `color-mix(…)` polyfills do not cause used CSS variables to be removed ([#17555](https://github.com/tailwindlabs/tailwindcss/pull/17555))
-- Ensure `color-mix(…)` polyfills create fallbacks for theme variables that reference other theme variables ([#17562](https://github.com/tailwindlabs/tailwindcss/pull/17562))
-- Fix brace expansion in declining ranges like `{10..0..5}` and `{0..10..-5}` ([#17591](https://github.com/tailwindlabs/tailwindcss/pull/17591))
-- Work around a Chrome rendering bug when using the `skew-*` utilities ([#17627](https://github.com/tailwindlabs/tailwindcss/pull/17627))
-- Ensure container query variant names can contain hyphens ([#17628](https://github.com/tailwindlabs/tailwindcss/pull/17628))
-- Ensure `shadow-inherit`, `inset-shadow-inherit`, `drop-shadow-inherit`, and `text-shadow-inherit` inherit the shadow color ([#17647](https://github.com/tailwindlabs/tailwindcss/pull/17647))
-- Ensure compatibility with array tuples used in `fontSize` JS theme keys ([#17630](https://github.com/tailwindlabs/tailwindcss/pull/17630))
-- Ensure folders with binary file extensions in their names are scanned for utilities ([#17595](https://github.com/tailwindlabs/tailwindcss/pull/17595))
-- Upgrade: Convert `fontSize` array tuple syntax to CSS theme variables ([#17630](https://github.com/tailwindlabs/tailwindcss/pull/17630))
-
-## [4.1.3] - 2025-04-04
-
-### Fixed
-
-- Show warning when using unsupported bare value data type in `--value(…)` ([#17464](https://github.com/tailwindlabs/tailwindcss/pull/17464))
-- PostCSS: Ensure changes to the input CSS file don't generate stale output when using Turbopack ([#17554](https://github.com/tailwindlabs/tailwindcss/pull/17554))
-- Ensure classes are detected in Ruby's `%w` syntax in Slim templates ([#17557](https://github.com/tailwindlabs/tailwindcss/pull/17557))
-
-## [4.1.2] - 2025-04-03
-
-### Fixed
-
-- Don't rely on the presence of `@layer base` to polyfill `@property` ([#17506](https://github.com/tailwindlabs/tailwindcss/pull/17506))
-- Support setting multiple inset shadows as arbitrary values ([#17523](https://github.com/tailwindlabs/tailwindcss/pull/17523))
-- Fix `drop-shadow-*` utilities that are defined with multiple shadows ([#17515](https://github.com/tailwindlabs/tailwindcss/pull/17515))
-- PostCSS: Fix race condition when two changes are queued concurrently ([#17514](https://github.com/tailwindlabs/tailwindcss/pull/17514))
-- PostCSS: Ensure files containing `@tailwind utilities` are processed ([#17514](https://github.com/tailwindlabs/tailwindcss/pull/17514))
-- Ensure the `color-mix(…)` polyfill creates fallbacks even when using colors that cannot be statically analyzed ([#17513](https://github.com/tailwindlabs/tailwindcss/pull/17513))
-- Fix slow incremental builds with `@tailwindcss/vite` and `@tailwindcss/postscss` (especially on Windows) ([#17511](https://github.com/tailwindlabs/tailwindcss/pull/17511))
-- Vite: Fix missing CSS file in Qwik setups ([#17533](https://github.com/tailwindlabs/tailwindcss/pull/17533))
-
-## [4.1.1] - 2025-04-02
-
-### Fixed
-
-- Disable padding in `@source inline(…)` brace expansion ([#17491](https://github.com/tailwindlabs/tailwindcss/pull/17491))
-- Inject polyfills after `@import` and body-less `@layer` ([#17493](https://github.com/tailwindlabs/tailwindcss/pull/17493))
-- Ensure `@tailwindcss/cli` does not contain an import for `jiti` ([#17502](https://github.com/tailwindlabs/tailwindcss/pull/17502))
-
-## [4.1.0] - 2025-04-01
-
-### Added
-
-- Add `details-content` variant ([#15319](https://github.com/tailwindlabs/tailwindcss/pull/15319))
-- Add `inverted-colors` variant ([#11693](https://github.com/tailwindlabs/tailwindcss/pull/11693))
-- Add `noscript` variant ([#11929](https://github.com/tailwindlabs/tailwindcss/pull/11929), [#17431](https://github.com/tailwindlabs/tailwindcss/pull/17431))
-- Add `items-baseline-last` and `self-baseline-last` utilities ([#13888](https://github.com/tailwindlabs/tailwindcss/pull/13888), [#17476](https://github.com/tailwindlabs/tailwindcss/pull/17476))
-- Add `pointer-none`, `pointer-coarse`, and `pointer-fine` variants ([#16946](https://github.com/tailwindlabs/tailwindcss/pull/16946))
-- Add `any-pointer-none`, `any-pointer-coarse`, and `any-pointer-fine` variants ([#16941](https://github.com/tailwindlabs/tailwindcss/pull/16941))
-- Add safe alignment utilities ([#14607](https://github.com/tailwindlabs/tailwindcss/pull/14607))
-- Add `user-valid` and `user-invalid` variants ([#12370](https://github.com/tailwindlabs/tailwindcss/pull/12370))
-- Add `wrap-anywhere`, `wrap-break-word`, and `wrap-normal` utilities ([#12128](https://github.com/tailwindlabs/tailwindcss/pull/12128))
-- Add `@source inline(…)` and `@source not inline(…)` ([#17147](https://github.com/tailwindlabs/tailwindcss/pull/17147))
-- Add `@source not "…"` ([#17255](https://github.com/tailwindlabs/tailwindcss/pull/17255))
-- Add `text-shadow-*` utilities ([#17389](https://github.com/tailwindlabs/tailwindcss/pull/17389))
-- Add `mask-*` utilities ([#17134](https://github.com/tailwindlabs/tailwindcss/pull/17134))
-- Add `bg-{position,size}-*` utilities for arbitrary values ([#17432](https://github.com/tailwindlabs/tailwindcss/pull/17432))
-- Add `shadow-*/<alpha>`, `inset-shadow-*/<alpha>`, `drop-shadow-*/<alpha>`, and `text-shadow-*/<alpha>` utilities to control shadow opacity ([#17398](https://github.com/tailwindlabs/tailwindcss/pull/17398), [#17434](https://github.com/tailwindlabs/tailwindcss/pull/17434))
-- Add `drop-shadow-<color>` utilities ([#17434](https://github.com/tailwindlabs/tailwindcss/pull/17434))
-- Improve compatibility with older versions of Safari and Firefox ([#17435](https://github.com/tailwindlabs/tailwindcss/pull/17435))
-
-### Fixed
-
-- Follow symlinks when resolving `@source` directives ([#17391](https://github.com/tailwindlabs/tailwindcss/pull/17391))
-- Don't scan ignored files for classes when changing an ignored file triggers a rebuild using `@tailwindcss/cli` ([#17255](https://github.com/tailwindlabs/tailwindcss/pull/17255))
-- Support negated `content` rules in legacy JavaScript configuration ([#17255](https://github.com/tailwindlabs/tailwindcss/pull/17255))
-- Interpret syntax like `@("@")md:…` as `@md:…` in Razor files ([#17427](https://github.com/tailwindlabs/tailwindcss/pull/17427))
-- Disallow top-level braces, top-level semicolons, and unbalanced parentheses and brackets in arbitrary values ([#17361](https://github.com/tailwindlabs/tailwindcss/pull/17361))
-- Ensure the `--theme(…)` function still resolves to the CSS variables when using legacy JS plugins ([#17458](https://github.com/tailwindlabs/tailwindcss/pull/17458))
-- Detect used theme variables in CSS module files ([#17433](https://github.com/tailwindlabs/tailwindcss/pull/17433), [#17467](https://github.com/tailwindlabs/tailwindcss/pull/17467))
-
-### Changed
-
-- Ignore `node_modules` by default (can be overridden by `@source …` rules) ([#17255](https://github.com/tailwindlabs/tailwindcss/pull/17255))
-- `@source` rules that include file extensions or point inside `node_modules/` folders no longer consider your `.gitignore` rules ([#17255](https://github.com/tailwindlabs/tailwindcss/pull/17255))
-- Deprecate `bg-{left,right}-{top,bottom}` in favor of `bg-{top,bottom}-{left,right}` utilities ([#17378](https://github.com/tailwindlabs/tailwindcss/pull/17378))
-- Deprecate `object-{left,right}-{top,bottom}` in favor of `object-{top,bottom}-{left,right}` utilities ([#17437](https://github.com/tailwindlabs/tailwindcss/pull/17437))
-
-## [4.0.17] - 2025-03-26
-
-### Fixed
-
-- Fix an issue causing the CLI to hang when processing Ruby files ([#17383](https://github.com/tailwindlabs/tailwindcss/pull/17383))
-
-## [4.0.16] - 2025-03-25
-
-### Added
-
+- _Experimental_: Add `details-content` variant ([#15319](https://github.com/tailwindlabs/tailwindcss/pull/15319))
+- _Experimental_: Add `inverted-colors` variant ([#11693](https://github.com/tailwindlabs/tailwindcss/pull/11693))
+- _Experimental_: Add `scripting`, `scripting-none`, and `scripting-initial` variants ([#11929](https://github.com/tailwindlabs/tailwindcss/pull/11929))
+- _Experimental_: Add `items-baseline-last` utility ([#12128](https://github.com/tailwindlabs/tailwindcss/pull/12128))
+- _Experimental_: Add `pointer-none`, `pointer-coarse`, and `pointer-fine` variant ([#16946](https://github.com/tailwindlabs/tailwindcss/pull/16946))
+- _Experimental_: Add `any-pointer-none`, `any-pointer-coarse`, and `any-pointer-fine` variants ([#16941](https://github.com/tailwindlabs/tailwindcss/pull/16941))
+- _Experimental_: Add safe alignment utilities ([#14607](https://github.com/tailwindlabs/tailwindcss/pull/14607))
+- _Experimental_: Add `user-valid` and `user-invalid` variants ([#12370](https://github.com/tailwindlabs/tailwindcss/pull/12370))
+- _Experimental_: Add `wrap-anywhere`, `wrap-break-word`, and `wrap-normal` utilities ([#12128](https://github.com/tailwindlabs/tailwindcss/pull/12128))
+- _Experimental_: Add `@source inline(…)` ([#17147](https://github.com/tailwindlabs/tailwindcss/pull/17147))
 - Add support for literal values in `--value('…')` and `--modifier('…')` ([#17304](https://github.com/tailwindlabs/tailwindcss/pull/17304))
+- Add suggestions when `--spacing(--value(integer, number))` is used ([#17308](https://github.com/tailwindlabs/tailwindcss/pull/17308))
 
 ### Fixed
 
 - Fix class extraction followed by `(` in Pug ([#17320](https://github.com/tailwindlabs/tailwindcss/pull/17320))
-- Ensure `@keyframes` for theme animations are emitted if they are referenced following a comma ([#17352](https://github.com/tailwindlabs/tailwindcss/pull/17352))
-- Vite: Ensure that updates to an imported CSS file are properly propagated after updating source files ([#17347](https://github.com/tailwindlabs/tailwindcss/pull/17347))
+- Ensure `@keyframes` for theme animations are emitted if they are referenced following a comma
+- Vite: Ensure that updates to an imported CSS file are properly propagated after updating templates ([#17347](https://github.com/tailwindlabs/tailwindcss/pull/17347))
 - Pre process `Slim` templates embedded in Ruby files ([#17336](https://github.com/tailwindlabs/tailwindcss/pull/17336))
 - Error when input and output files resolve to the same file when using the CLI ([#17311](https://github.com/tailwindlabs/tailwindcss/pull/17311))
-- Add missing suggestions when `--spacing(--value(integer, number))` is used ([#17308](https://github.com/tailwindlabs/tailwindcss/pull/17308))
-- Add `::-webkit-details-marker` pseudo to `marker` variant ([#17362](https://github.com/tailwindlabs/tailwindcss/pull/17362))
 
-## [4.0.15] - 2025-03-20
+### [4.0.15] - 2025-03-20
 
 ### Fixed
 
@@ -4026,7 +3474,7 @@ No release notes
 
 - Lists now have no margins by default
 - `.pin` no longer sets width and height to 100%
-- SVG `fill` no longer defaults to currentcolor
+- SVG `fill` no longer defaults to currentColor
 
 ## [0.2.2] - 2017-11-19
 
@@ -4123,39 +3571,7 @@ No release notes
 
 - Everything!
 
-[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v4.3.3...HEAD
-[4.3.3]: https://github.com/tailwindlabs/tailwindcss/compare/v4.3.2...v4.3.3
-[4.3.2]: https://github.com/tailwindlabs/tailwindcss/compare/v4.3.1...v4.3.2
-[4.3.1]: https://github.com/tailwindlabs/tailwindcss/compare/v4.3.0...v4.3.1
-[4.3.0]: https://github.com/tailwindlabs/tailwindcss/compare/v4.2.4...v4.3.0
-[4.2.4]: https://github.com/tailwindlabs/tailwindcss/compare/v4.2.3...v4.2.4
-[4.2.3]: https://github.com/tailwindlabs/tailwindcss/compare/v4.2.2...v4.2.3
-[4.2.2]: https://github.com/tailwindlabs/tailwindcss/compare/v4.2.1...v4.2.2
-[4.2.1]: https://github.com/tailwindlabs/tailwindcss/compare/v4.2.0...v4.2.1
-[4.2.0]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.18...v4.2.0
-[4.1.18]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.17...v4.1.18
-[3.4.19]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.18...v3.4.19
-[4.1.17]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.16...v4.1.17
-[4.1.16]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.15...v4.1.16
-[4.1.15]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.14...v4.1.15
-[4.1.14]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.13...v4.1.14
-[3.4.18]: https://github.com/tailwindlabs/tailwindcss/compare/v3.4.17...v3.4.18
-[4.1.13]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.12...v4.1.13
-[4.1.12]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.11...v4.1.12
-[4.1.11]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.10...v4.1.11
-[4.1.10]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.9...v4.1.10
-[4.1.9]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.8...v4.1.9
-[4.1.8]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.7...v4.1.8
-[4.1.7]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.6...v4.1.7
-[4.1.6]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.5...v4.1.6
-[4.1.5]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.4...v4.1.5
-[4.1.4]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.3...v4.1.4
-[4.1.3]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.2...v4.1.3
-[4.1.2]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.1...v4.1.2
-[4.1.1]: https://github.com/tailwindlabs/tailwindcss/compare/v4.1.0...v4.1.1
-[4.1.0]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.17...v4.1.0
-[4.0.17]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.16...v4.0.17
-[4.0.16]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.15...v4.0.16
+[unreleased]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.15...HEAD
 [4.0.15]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.14...v4.0.15
 [4.0.14]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.13...v4.0.14
 [4.0.13]: https://github.com/tailwindlabs/tailwindcss/compare/v4.0.12...v4.0.13
diff --git a/Cargo.lock b/Cargo.lock
index 73fd9e995..31b5529a6 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -27,6 +27,21 @@ dependencies = [
  "nom",
 ]
 
+[[package]]
+name = "bit-set"
+version = "0.8.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "08807e080ed7f9d5433fa9b275196cfc35414f66a0c79d864dc51a0d825231a3"
+dependencies = [
+ "bit-vec",
+]
+
+[[package]]
+name = "bit-vec"
+version = "0.8.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "5e764a1d40d510daf35e07be9eb06e75770908c27d411ee6c92109c9840eaaf7"
+
 [[package]]
 name = "bitflags"
 version = "2.6.0"
@@ -40,7 +55,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "531a9155a481e2ee699d4f98f43c0ca4ff8ee1bfd55c31e9e98fb29d2b176fe0"
 dependencies = [
  "memchr",
- "regex-automata 0.4.18",
+ "regex-automata 0.4.8",
  "serde",
 ]
 
@@ -59,31 +74,33 @@ dependencies = [
  "syn",
 ]
 
-[[package]]
-name = "console"
-version = "0.16.4"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4fe5f465a4f6fee88fad41b85d990f84c835335e85b5d9e6e63e0d06d28cba7c"
-dependencies = [
- "encode_unicode",
- "libc",
- "windows-sys 0.61.2",
-]
-
 [[package]]
 name = "convert_case"
-version = "0.11.0"
+version = "0.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "affbf0190ed2caf063e3def54ff444b449371d55c58e513a95ab98eca50adb49"
+checksum = "ec182b0ca2f35d8fc196cf3404988fd8b8c739a4d270ff118a398feb0cbec1ca"
 dependencies = [
  "unicode-segmentation",
 ]
 
 [[package]]
-name = "crossbeam-channel"
-version = "0.5.15"
+name = "crossbeam"
+version = "0.8.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "82b8f8f868b36967f9606790d1903570de9ceaf870a7bf9fbbd3016d636a2cb2"
+checksum = "1137cd7e7fc0fb5d3c5a8678be38ec56e819125d8d7907411fe24ccb943faca8"
+dependencies = [
+ "crossbeam-channel",
+ "crossbeam-deque",
+ "crossbeam-epoch",
+ "crossbeam-queue",
+ "crossbeam-utils",
+]
+
+[[package]]
+name = "crossbeam-channel"
+version = "0.5.13"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "33480d6946193aa8033910124896ca395333cae7e2d1113d1fef6c3272217df2"
 dependencies = [
  "crossbeam-utils",
 ]
@@ -107,6 +124,15 @@ dependencies = [
  "crossbeam-utils",
 ]
 
+[[package]]
+name = "crossbeam-queue"
+version = "0.3.11"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "df0346b5d5e76ac2fe4e327c5fd1118d6be7c51dfb18f9b7922923f287471e35"
+dependencies = [
+ "crossbeam-utils",
+]
+
 [[package]]
 name = "crossbeam-utils"
 version = "0.8.20"
@@ -115,15 +141,13 @@ checksum = "22ec99545bb0ed0ea7bb9b8e1e9122ea386ff8a48c0922e43f36d45ab09e0e80"
 
 [[package]]
 name = "ctor"
-version = "1.0.12"
+version = "0.2.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2d83cb7e7a873830708d6b02a78cd36a592c6fa14bf267b68725103b85c0d77f"
-
-[[package]]
-name = "diff"
-version = "0.1.13"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "56254986775e3233ffa9c4d7d3faaf6d36a2c09d30b20687e9f88bc8bafc16c8"
+checksum = "990a40740adf249724a6000c0fc4bd574712f50bb17c2d6f6cec837ae2f0ee75"
+dependencies = [
+ "quote",
+ "syn",
+]
 
 [[package]]
 name = "dunce"
@@ -137,12 +161,6 @@ version = "1.8.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "7fcaabb2fef8c910e7f4c7ce9f67a1283a1715879a7c230ca9d6d1ae31f16d91"
 
-[[package]]
-name = "encode_unicode"
-version = "1.0.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "34aa73646ffb006b8f5147f3dc182bd4bcb190227ce861fc4a4844bf8e3cb2c0"
-
 [[package]]
 name = "errno"
 version = "0.3.9"
@@ -153,6 +171,17 @@ dependencies = [
  "windows-sys 0.52.0",
 ]
 
+[[package]]
+name = "fancy-regex"
+version = "0.14.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "6e24cb5a94bcae1e5408b0effca5cd7172ea3c5755049c5f3af4cd283a165298"
+dependencies = [
+ "bit-set",
+ "regex-automata 0.4.8",
+ "regex-syntax 0.8.5",
+]
+
 [[package]]
 name = "fast-glob"
 version = "0.4.3"
@@ -168,104 +197,16 @@ version = "2.1.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e8c02a5121d4ea3eb16a80748c74f5549a5665e4c21333c6098f283870fbdea6"
 
-[[package]]
-name = "futures"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8b147ee9d1f6d097cef9ce628cd2ee62288d963e16fb287bd9286455b241382d"
-dependencies = [
- "futures-channel",
- "futures-core",
- "futures-executor",
- "futures-io",
- "futures-sink",
- "futures-task",
- "futures-util",
-]
-
-[[package]]
-name = "futures-channel"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "07bbe89c50d7a535e539b8c17bc0b49bdb77747034daa8087407d655f3f7cc1d"
-dependencies = [
- "futures-core",
- "futures-sink",
-]
-
-[[package]]
-name = "futures-core"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7e3450815272ef58cec6d564423f6e755e25379b217b0bc688e295ba24df6b1d"
-
-[[package]]
-name = "futures-executor"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "baf29c38818342a3b26b5b923639e7b1f4a61fc5e76102d4b1981c6dc7a7579d"
-dependencies = [
- "futures-core",
- "futures-task",
- "futures-util",
-]
-
-[[package]]
-name = "futures-io"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cecba35d7ad927e23624b22ad55235f2239cfa44fd10428eecbeba6d6a717718"
-
-[[package]]
-name = "futures-macro"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "e835b70203e41293343137df5c0664546da5745f82ec9b84d40be8336958447b"
-dependencies = [
- "proc-macro2",
- "quote",
- "syn",
-]
-
-[[package]]
-name = "futures-sink"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c39754e157331b013978ec91992bde1ac089843443c49cbc7f46150b0fad0893"
-
-[[package]]
-name = "futures-task"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "037711b3d59c33004d3856fbdc83b99d4ff37a24768fa1be9ce3538a1cde4393"
-
-[[package]]
-name = "futures-util"
-version = "0.3.32"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "389ca41296e6190b48053de0321d02a77f32f8a5d2461dd38762c0593805c6d6"
-dependencies = [
- "futures-channel",
- "futures-core",
- "futures-io",
- "futures-macro",
- "futures-sink",
- "futures-task",
- "memchr",
- "pin-project-lite",
- "slab",
-]
-
 [[package]]
 name = "globset"
-version = "0.4.20"
+version = "0.4.15"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "07c34a9410465b45bd9787443bc7370f37735bad04b0f0cd57ff1a3186c98988"
+checksum = "15f1ce686646e7f1e19bf7d5533fe443a45dbfb990e00629110797578b42fb19"
 dependencies = [
  "aho-corasick",
  "bstr",
  "log",
- "regex-automata 0.4.18",
+ "regex-automata 0.4.8",
  "regex-syntax 0.8.5",
 ]
 
@@ -276,7 +217,7 @@ source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0bf760ebf69878d9fd8f110c89703d90ce35095324d1f1edcb595c63945ee757"
 dependencies = [
  "bitflags",
- "ignore 0.4.23",
+ "ignore",
  "walkdir",
 ]
 
@@ -290,41 +231,12 @@ dependencies = [
  "globset",
  "log",
  "memchr",
- "regex-automata 0.4.18",
+ "regex-automata 0.4.8",
  "same-file",
  "walkdir",
  "winapi-util",
 ]
 
-[[package]]
-name = "ignore"
-version = "0.4.33"
-dependencies = [
- "bstr",
- "crossbeam-channel",
- "crossbeam-deque",
- "dunce",
- "globset",
- "log",
- "memchr",
- "regex-automata 0.4.18",
- "same-file",
- "walkdir",
- "winapi-util",
-]
-
-[[package]]
-name = "insta"
-version = "1.48.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "86f0f8fee8c926415c58d6ae43a08523a26faccb2323f5e6b644fe7dd4ef6b82"
-dependencies = [
- "console",
- "once_cell",
- "similar",
- "tempfile",
-]
-
 [[package]]
 name = "itertools"
 version = "0.11.0"
@@ -348,12 +260,12 @@ checksum = "561d97a539a36e26a9a5fad1ea11a3039a67714694aaa379433e580854bc3dc5"
 
 [[package]]
 name = "libloading"
-version = "0.9.0"
+version = "0.8.5"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "754ca22de805bb5744484a5b151a9e1a8e837d5dc232c2d7d8c2e3492edc8b60"
+checksum = "4979f22fdb869068da03c9f7528f8297c6fd2606bc3a4affe42e6a823fdb8da4"
 dependencies = [
  "cfg-if",
- "windows-link",
+ "windows-targets",
 ]
 
 [[package]]
@@ -391,33 +303,31 @@ checksum = "68354c5c6bd36d73ff3feceb05efa59b6acb7626617f4962be322a825e61f79a"
 
 [[package]]
 name = "napi"
-version = "3.11.0"
+version = "2.16.16"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "de33522036981030a75c231829566bc63414e08101a6f5ff4ac6cef19c8e0941"
+checksum = "839ae2ee5e62c6348669c50098b187c08115bd3cced658c9c0bf945fca0fec83"
 dependencies = [
  "bitflags",
  "ctor",
- "futures",
- "napi-build",
+ "napi-derive",
  "napi-sys",
- "nohash-hasher",
- "rustc-hash",
+ "once_cell",
 ]
 
 [[package]]
 name = "napi-build"
-version = "2.3.2"
+version = "2.1.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c9c366d2c8c60b86fa632df75f745509b52f9128f91a6bad4c796e44abb505e1"
+checksum = "db836caddef23662b94e16bf1f26c40eceb09d6aee5d5b06a7ac199320b69b19"
 
 [[package]]
 name = "napi-derive"
-version = "3.6.0"
+version = "2.16.13"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "a49c513341a61a16a10af6efcce46b30d0822ba2d4fb197d24d33dfc199c78d5"
+checksum = "7cbe2585d8ac223f7d34f13701434b9d5f4eb9c332cccce8dee57ea18ab8ab0c"
 dependencies = [
+ "cfg-if",
  "convert_case",
- "ctor",
  "napi-derive-backend",
  "proc-macro2",
  "quote",
@@ -426,32 +336,28 @@ dependencies = [
 
 [[package]]
 name = "napi-derive-backend"
-version = "6.1.1"
+version = "1.0.75"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "d60b5d773ad46c698c8cc2cd9fde0b283d39cbb7f71c04bee633c7bdba4423bd"
+checksum = "1639aaa9eeb76e91c6ae66da8ce3e89e921cd3885e99ec85f4abacae72fc91bf"
 dependencies = [
  "convert_case",
+ "once_cell",
  "proc-macro2",
  "quote",
+ "regex",
  "semver",
  "syn",
 ]
 
 [[package]]
 name = "napi-sys"
-version = "3.3.0"
+version = "2.4.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "85fbf1fa9f1babfe396d74bbbf52b3643770243e8f5b0b46715d4caf7f0dfc9a"
+checksum = "427802e8ec3a734331fec1035594a210ce1ff4dc5bc1950530920ab717964ea3"
 dependencies = [
  "libloading",
 ]
 
-[[package]]
-name = "nohash-hasher"
-version = "0.2.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2bf50223579dc7cdcfb3bfcacf7069ff68243f8c363f62ffa99cf000a6b9c451"
-
 [[package]]
 name = "nom"
 version = "7.1.3"
@@ -474,9 +380,9 @@ dependencies = [
 
 [[package]]
 name = "once_cell"
-version = "1.21.4"
+version = "1.19.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9f7c3e4beb33f85d45ae3e3a1792185706c8e16d043238c593331cc7cd313b50"
+checksum = "3fdb12b2476b595f9358c5161aa467c2438859caa136dec86c26fdd2efe17b92"
 
 [[package]]
 name = "overload"
@@ -490,16 +396,6 @@ version = "0.2.9"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "e0a7ae3ac2f1173085d398531c705756c94a4c56843785df85a60c1a0afac116"
 
-[[package]]
-name = "pretty_assertions"
-version = "1.4.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "3ae130e2f271fbc2ac3a40fb1d07180839cdbbe443c7a27e1e3c13c5cac0116d"
-dependencies = [
- "diff",
- "yansi",
-]
-
 [[package]]
 name = "proc-macro2"
 version = "1.0.86"
@@ -511,18 +407,18 @@ dependencies = [
 
 [[package]]
 name = "quote"
-version = "1.0.45"
+version = "1.0.28"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "41f2619966050689382d2b44f664f4bc593e129785a36d6ee376ddf37259b924"
+checksum = "1b9ab9c7eadfd8df19006f1cf1a4aed13540ed5cbc047010ece5826e10825488"
 dependencies = [
  "proc-macro2",
 ]
 
 [[package]]
 name = "rayon"
-version = "1.12.0"
+version = "1.10.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "fb39b166781f92d482534ef4b4b1b2568f42613b53e5b6c160e24cfbfa30926d"
+checksum = "b418a60154510ca1a002a752ca9714984e21e4241e804d32555251faf8b78ffa"
 dependencies = [
  "either",
  "rayon-core",
@@ -530,9 +426,9 @@ dependencies = [
 
 [[package]]
 name = "rayon-core"
-version = "1.13.0"
+version = "1.12.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "22e18b0f0062d30d4230b2e85ff77fdfe4326feb054b9783a3460d8435c8ab91"
+checksum = "1465873a3dfdaa8ae7cb14b4383657caab0b3e8a0aa9ae8e04b044854c8dfce2"
 dependencies = [
  "crossbeam-deque",
  "crossbeam-utils",
@@ -546,7 +442,7 @@ checksum = "b544ef1b4eac5dc2db33ea63606ae9ffcfac26c1416a2806ae0bf5f56b201191"
 dependencies = [
  "aho-corasick",
  "memchr",
- "regex-automata 0.4.18",
+ "regex-automata 0.4.8",
  "regex-syntax 0.8.5",
 ]
 
@@ -561,9 +457,9 @@ dependencies = [
 
 [[package]]
 name = "regex-automata"
-version = "0.4.18"
+version = "0.4.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ad8553b9b26413251cbf30e620595c7a41b3887f03da04579c0e6b0d6a06b4b2"
+checksum = "368758f23274712b504848e9d5a6f010445cc8b87a7cdb4d7cbee666c1288da3"
 dependencies = [
  "aho-corasick",
  "memchr",
@@ -631,18 +527,6 @@ dependencies = [
  "lazy_static",
 ]
 
-[[package]]
-name = "similar"
-version = "2.7.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "bbbb5d9659141646ae647b42fe094daf6c6192d1620870b449d9557f748b2daa"
-
-[[package]]
-name = "slab"
-version = "0.4.12"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0c790de23124f9ab44544d7ac05d60440adc586479ce501c1d6d7da3cd8c9cf5"
-
 [[package]]
 name = "smallvec"
 version = "1.10.0"
@@ -651,9 +535,9 @@ checksum = "a507befe795404456341dfab10cef66ead4c041f62b8b11bbb92bffe5d0953e0"
 
 [[package]]
 name = "syn"
-version = "2.0.87"
+version = "2.0.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "25aa4ce346d03a6dcd68dd8b4010bcb74e54e62c90c573f394c46eae99aba32d"
+checksum = "32d41677bcbe24c20c52e7c70b0d8db04134c5d1066bf98662e2871ad200ea3e"
 dependencies = [
  "proc-macro2",
  "quote",
@@ -678,20 +562,19 @@ dependencies = [
  "bexpand",
  "bstr",
  "classification-macros",
+ "crossbeam",
  "dunce",
+ "fancy-regex",
  "fast-glob",
  "globwalk",
- "ignore 0.4.33",
- "insta",
+ "ignore",
  "log",
- "pretty_assertions",
  "rayon",
  "regex",
  "rustc-hash",
  "tempfile",
  "tracing",
  "tracing-subscriber",
- "unicode-width",
  "walkdir",
 ]
 
@@ -791,12 +674,6 @@ version = "1.10.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "1dd624098567895118886609431a7c3b8f516e41d30e0643f03d94592a147e36"
 
-[[package]]
-name = "unicode-width"
-version = "0.2.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1fc81956842c57dac11422a97c3b8195a1ff727f06e85c84ed2e8aa277c9a0fd"
-
 [[package]]
 name = "valuable"
 version = "0.1.0"
@@ -844,12 +721,6 @@ version = "0.4.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f"
 
-[[package]]
-name = "windows-link"
-version = "0.2.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f0805222e57f7521d6a62e36fa9163bc891acd422f971defe97d64e70d0a4fe5"
-
 [[package]]
 name = "windows-sys"
 version = "0.52.0"
@@ -868,15 +739,6 @@ dependencies = [
  "windows-targets",
 ]
 
-[[package]]
-name = "windows-sys"
-version = "0.61.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "ae137229bcbd6cdf0f7b80a31df61766145077ddf49416a728b02cb3921ff3fc"
-dependencies = [
- "windows-link",
-]
-
 [[package]]
 name = "windows-targets"
 version = "0.52.6"
@@ -940,9 +802,3 @@ name = "windows_x86_64_msvc"
 version = "0.52.6"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "589f6da84c646204747d1270a2a5661ea66ed1cced2631d546fdfb155959f9ec"
-
-[[package]]
-name = "yansi"
-version = "1.0.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cfe53a6657fd280eaa890a3bc59152892ffa3e30101319d168b781ed6529b049"
diff --git a/README.md b/README.md
index 5f532607d..95ec9d87d 100644
--- a/README.md
+++ b/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,10 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/crates/ignore/COPYING b/crates/ignore/COPYING
deleted file mode 100644
index bb9c20a09..000000000
--- a/crates/ignore/COPYING
+++ /dev/null
@@ -1,3 +0,0 @@
-This project is dual-licensed under the Unlicense and MIT licenses.
-
-You may use this code under the terms of either license.
diff --git a/crates/ignore/Cargo.toml b/crates/ignore/Cargo.toml
deleted file mode 100644
index d0af38ba9..000000000
--- a/crates/ignore/Cargo.toml
+++ /dev/null
@@ -1,50 +0,0 @@
-[package]
-name = "ignore"
-version = "0.4.33"  #:version
-authors = ["Andrew Gallant <jamslam@gmail.com>"]
-description = """
-A fast library for efficiently matching ignore files such as `.gitignore`
-against file paths.
-"""
-documentation = "https://docs.rs/ignore"
-homepage = "https://github.com/BurntSushi/ripgrep/tree/master/crates/ignore"
-repository = "https://github.com/BurntSushi/ripgrep/tree/master/crates/ignore"
-readme = "README.md"
-keywords = ["glob", "ignore", "gitignore", "pattern", "file"]
-license = "Unlicense OR MIT"
-# CHANGED: Use an explicit edition instead of `edition.workspace = true` since this crate is
-# vendored into the Tailwind CSS workspace.
-edition = "2024"
-rust-version = "1.88"
-
-[lib]
-name = "ignore"
-bench = false
-
-[dependencies]
-crossbeam-deque = "0.8.3"
-# CHANGED: Use the published globset crate instead of a path dependency.
-globset = "0.4.20"
-log = "0.4.20"
-memchr = "2.6.3"
-same-file = "1.0.6"
-walkdir = "2.4.0"
-# CHANGED: Added `dunce` to canonicalize paths without UNC prefixes on Windows.
-dunce = "1.0.5"
-
-[dependencies.regex-automata]
-version = "0.4.18"
-default-features = false
-features = ["std", "perf", "syntax", "meta", "nfa", "hybrid", "dfa-onepass"]
-
-[target.'cfg(windows)'.dependencies.winapi-util]
-version = "0.1.2"
-
-[dev-dependencies]
-bstr = { version = "1.6.2", default-features = false, features = ["std"] }
-crossbeam-channel = "0.5.15"
-
-[features]
-# DEPRECATED. It is a no-op. SIMD is done automatically through runtime
-# dispatch.
-simd-accel = []
diff --git a/crates/ignore/LICENSE-MIT b/crates/ignore/LICENSE-MIT
deleted file mode 100644
index 3b0a5dc09..000000000
--- a/crates/ignore/LICENSE-MIT
+++ /dev/null
@@ -1,21 +0,0 @@
-The MIT License (MIT)
-
-Copyright (c) 2015 Andrew Gallant
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.
diff --git a/crates/ignore/README.md b/crates/ignore/README.md
deleted file mode 100644
index 72258e6b5..000000000
--- a/crates/ignore/README.md
+++ /dev/null
@@ -1,59 +0,0 @@
-ignore
-======
-The ignore crate provides a fast recursive directory iterator that respects
-various filters such as globs, file types and `.gitignore` files. This crate
-also provides lower level direct access to gitignore and file type matchers.
-
-[![Build status](https://github.com/BurntSushi/ripgrep/workflows/ci/badge.svg)](https://github.com/BurntSushi/ripgrep/actions)
-[![](https://img.shields.io/crates/v/ignore.svg)](https://crates.io/crates/ignore)
-
-Dual-licensed under MIT or the [UNLICENSE](https://unlicense.org/).
-
-### Documentation
-
-[https://docs.rs/ignore](https://docs.rs/ignore)
-
-### Usage
-
-Add this to your `Cargo.toml`:
-
-```toml
-[dependencies]
-ignore = "0.4"
-```
-
-### Example
-
-This example shows the most basic usage of this crate. This code will
-recursively traverse the current directory while automatically filtering out
-files and directories according to ignore globs found in files like
-`.ignore` and `.gitignore`:
-
-
-```rust,no_run
-use ignore::Walk;
-
-for result in Walk::new("./") {
-    // Each item yielded by the iterator is either a directory entry or an
-    // error, so either print the path or the error.
-    match result {
-        Ok(entry) => println!("{}", entry.path().display()),
-        Err(err) => println!("ERROR: {}", err),
-    }
-}
-```
-
-### Example: advanced
-
-By default, the recursive directory iterator will ignore hidden files and
-directories. This can be disabled by building the iterator with `WalkBuilder`:
-
-```rust,no_run
-use ignore::WalkBuilder;
-
-for result in WalkBuilder::new("./").hidden(false).build() {
-    println!("{:?}", result);
-}
-```
-
-See the documentation for `WalkBuilder` for many other options.
diff --git a/crates/ignore/UNLICENSE b/crates/ignore/UNLICENSE
deleted file mode 100644
index 68a49daad..000000000
--- a/crates/ignore/UNLICENSE
+++ /dev/null
@@ -1,24 +0,0 @@
-This is free and unencumbered software released into the public domain.
-
-Anyone is free to copy, modify, publish, use, compile, sell, or
-distribute this software, either in source code form or as a compiled
-binary, for any purpose, commercial or non-commercial, and by any
-means.
-
-In jurisdictions that recognize copyright laws, the author or authors
-of this software dedicate any and all copyright interest in the
-software to the public domain. We make this dedication for the benefit
-of the public at large and to the detriment of our heirs and
-successors. We intend this dedication to be an overt act of
-relinquishment in perpetuity of all present and future rights to this
-software under copyright law.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
-EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
-MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
-IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
-OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
-ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
-OTHER DEALINGS IN THE SOFTWARE.
-
-For more information, please refer to <http://unlicense.org/>
diff --git a/crates/ignore/examples/walk.rs b/crates/ignore/examples/walk.rs
deleted file mode 100644
index c61d0515e..000000000
--- a/crates/ignore/examples/walk.rs
+++ /dev/null
@@ -1,64 +0,0 @@
-use std::{env, io::Write, path::Path};
-
-use {bstr::ByteVec, ignore::WalkBuilder, walkdir::WalkDir};
-
-fn main() {
-    let mut path = env::args().nth(1).unwrap();
-    let mut parallel = false;
-    let mut simple = false;
-    let (tx, rx) = crossbeam_channel::bounded::<DirEntry>(100);
-    if path == "parallel" {
-        path = env::args().nth(2).unwrap();
-        parallel = true;
-    } else if path == "walkdir" {
-        path = env::args().nth(2).unwrap();
-        simple = true;
-    }
-
-    let stdout_thread = std::thread::spawn(move || {
-        let mut stdout = std::io::BufWriter::new(std::io::stdout());
-        for dent in rx {
-            stdout.write_all(&Vec::from_path_lossy(dent.path())).unwrap();
-            stdout.write_all(b"\n").unwrap();
-        }
-    });
-
-    if parallel {
-        let walker = WalkBuilder::new(path).threads(6).build_parallel();
-        walker.run(|| {
-            let tx = tx.clone();
-            Box::new(move |result| {
-                use ignore::WalkState::*;
-
-                tx.send(DirEntry::Y(result.unwrap())).unwrap();
-                Continue
-            })
-        });
-    } else if simple {
-        let walker = WalkDir::new(path);
-        for result in walker {
-            tx.send(DirEntry::X(result.unwrap())).unwrap();
-        }
-    } else {
-        let walker = WalkBuilder::new(path).build();
-        for result in walker {
-            tx.send(DirEntry::Y(result.unwrap())).unwrap();
-        }
-    }
-    drop(tx);
-    stdout_thread.join().unwrap();
-}
-
-enum DirEntry {
-    X(walkdir::DirEntry),
-    Y(ignore::DirEntry),
-}
-
-impl DirEntry {
-    fn path(&self) -> &Path {
-        match *self {
-            DirEntry::X(ref x) => x.path(),
-            DirEntry::Y(ref y) => y.path(),
-        }
-    }
-}
diff --git a/crates/ignore/src/default_types.rs b/crates/ignore/src/default_types.rs
deleted file mode 100644
index 6b5bba0f0..000000000
--- a/crates/ignore/src/default_types.rs
+++ /dev/null
@@ -1,378 +0,0 @@
-/// This list represents the default file types that ripgrep ships with. In
-/// general, any file format is fair game, although it should generally be
-/// limited to reasonably popular open formats. For other cases, you can add
-/// types to each invocation of ripgrep with the '--type-add' flag.
-///
-/// If you would like to add or improve this list, please file a PR:
-/// <https://github.com/BurntSushi/ripgrep>.
-///
-/// Please try to keep this list sorted lexicographically and wrapped to 79
-/// columns (inclusive).
-#[rustfmt::skip]
-pub(crate) const DEFAULT_TYPES: &[(&[&str], &[&str])] = &[
-    (&["ada"], &["*.adb", "*.ads"]),
-    (&["agda"], &["*.agda", "*.lagda"]),
-    (&["aidl"], &["*.aidl"]),
-    (&["alire"], &["alire.toml"]),
-    (&["amake"], &["*.mk", "*.bp"]),
-    (&["asciidoc"], &["*.adoc", "*.asc", "*.asciidoc"]),
-    (&["asm"], &["*.asm", "*.s", "*.S"]),
-    (&["asp"], &[
-        "*.aspx", "*.aspx.cs", "*.aspx.vb", "*.ascx", "*.ascx.cs",
-        "*.ascx.vb", "*.asp"
-    ]),
-    (&["ats"], &["*.ats", "*.dats", "*.sats", "*.hats"]),
-    (&["avro"], &["*.avdl", "*.avpr", "*.avsc"]),
-    (&["awk"], &["*.awk"]),
-    (&["bat", "batch"], &["*.bat"]),
-    (&["bazel"], &[
-        "*.bazel", "*.bzl", "*.BUILD", "*.bazelrc", "BUILD", "MODULE.bazel",
-        "WORKSPACE", "WORKSPACE.bazel", "WORKSPACE.bzlmod",
-    ]),
-    (&["bitbake"], &["*.bb", "*.bbappend", "*.bbclass", "*.conf", "*.inc"]),
-    (&["boxlang"], &["*.bx", "*.bxm", "*.bxs"]),
-    (&["brotli"], &["*.br"]),
-    (&["buildstream"], &["*.bst"]),
-    (&["bzip2"], &["*.bz2", "*.tbz2"]),
-    (&["c"], &["*.[chH]", "*.[chH].in", "*.cats"]),
-    (&["cabal"], &["*.cabal"]),
-    (&["candid"], &["*.did"]),
-    (&["carp"], &["*.carp"]),
-    (&["cbor"], &["*.cbor"]),
-    (&["ceylon"], &["*.ceylon"]),
-    (&["cfml"], &["*.cfc", "*.cfm"]),
-    (&["clojure"], &["*.clj", "*.cljc", "*.cljs", "*.cljx"]),
-    (&["cmake"], &["*.cmake", "CMakeLists.txt"]),
-    (&["cmd"], &["*.bat", "*.cmd"]),
-    (&["cml"], &["*.cml"]),
-    (&["coffeescript"], &["*.coffee"]),
-    (&["config"], &["*.cfg", "*.conf", "*.config", "*.ini"]),
-    (&["container"], &["*Containerfile*", "*Dockerfile*"]),
-    (&["coq"], &["*.v"]),
-    (&["cpp"], &[
-        "*.[ChH]", "*.cc", "*.[ch]pp", "*.[ch]xx", "*.hh",  "*.inl",
-        "*.[ChH].in", "*.cc.in", "*.[ch]pp.in", "*.[ch]xx.in", "*.hh.in",
-    ]),
-    (&["creole"], &["*.creole"]),
-    (&["crystal"], &["Projectfile", "*.cr", "*.ecr", "shard.yml"]),
-    (&["cs"], &["*.cs"]),
-    (&["csharp"], &["*.cs"]),
-    (&["cshtml"], &["*.cshtml"]),
-    (&["csproj"], &["*.csproj"]),
-    (&["css"], &["*.css", "*.scss"]),
-    (&["csv"], &["*.csv"]),
-    (&["cuda"], &["*.cu", "*.cuh"]),
-    (&["cython"], &["*.pyx", "*.pxi", "*.pxd"]),
-    (&["d"], &["*.d"]),
-    (&["dart"], &["*.dart"]),
-    (&["devicetree"], &["*.dts", "*.dtsi", "*.dtso"]),
-    (&["dhall"], &["*.dhall"]),
-    (&["diff"], &["*.patch", "*.diff"]),
-    (&["dita"], &["*.dita", "*.ditamap", "*.ditaval"]),
-    (&["docker"], &["*Dockerfile*"]),
-    (&["dockercompose"], &["docker-compose.yml", "docker-compose.*.yml"]),
-    (&["dts"], &["*.dts", "*.dtsi"]),
-    (&["dvc"], &["Dvcfile", "*.dvc"]),
-    (&["ebuild"], &["*.ebuild", "*.eclass"]),
-    (&["edn"], &["*.edn"]),
-    (&["elisp"], &["*.el"]),
-    (&["elixir"], &["*.ex", "*.eex", "*.exs", "*.heex", "*.leex", "*.livemd"]),
-    (&["elm"], &["*.elm"]),
-    (&["erb"], &["*.erb"]),
-    (&["erlang"], &["*.erl", "*.hrl"]),
-    (&["fennel"], &["*.fnl"]),
-    (&["fidl"], &["*.fidl"]),
-    (&["fish"], &["*.fish"]),
-    (&["flatbuffers"], &["*.fbs"]),
-    (&["fortran"], &[
-        "*.f", "*.F", "*.f77", "*.F77", "*.pfo",
-        "*.f90", "*.F90", "*.f95", "*.F95",
-    ]),
-    (&["fsharp"], &["*.fs", "*.fsx", "*.fsi"]),
-    (&["fut"], &["*.fut"]),
-    (&["gap"], &["*.g", "*.gap", "*.gi", "*.gd", "*.tst"]),
-    (&["gdscript"], &["*.gd"]),
-    (&["gleam"], &["*.gleam"]),
-    (&["gn"], &["*.gn", "*.gni"]),
-    (&["go"], &["*.go"]),
-    (&["gprbuild"], &["*.gpr"]),
-    (&["gradle"], &[
-        "*.gradle", "*.gradle.kts", "gradle.properties", "gradle-wrapper.*",
-        "gradlew", "gradlew.bat",
-    ]),
-    (&["graphql"], &["*.graphql", "*.graphqls"]),
-    (&["groovy"], &["*.groovy", "*.gradle"]),
-    (&["gzip"], &["*.gz", "*.tgz"]),
-    (&["h"], &["*.h", "*.hh", "*.hpp"]),
-    (&["haml"], &["*.haml"]),
-    (&["hare"], &["*.ha"]),
-    (&["haskell"], &["*.hs", "*.lhs", "*.cpphs", "*.c2hs", "*.hsc"]),
-    (&["hbs"], &["*.hbs"]),
-    (&["hs"], &["*.hs", "*.lhs"]),
-    (&["html"], &["*.htm", "*.html", "*.ejs"]),
-    (&["hurl"], &["*.hurl"]),
-    (&["hy"], &["*.hy"]),
-    (&["idris"], &["*.idr", "*.lidr"]),
-    (&["janet"], &["*.janet"]),
-    (&["java"], &["*.java", "*.jsp", "*.jspx", "*.properties"]),
-    (&["jinja"], &["*.j2", "*.jinja", "*.jinja2"]),
-    (&["jl"], &["*.jl"]),
-    (&["js"], &["*.js", "*.jsx", "*.vue", "*.cjs", "*.mjs"]),
-    (&["json"], &["*.json", "composer.lock", "*.sarif"]),
-    (&["jsonl"], &["*.jsonl"]),
-    (&["julia"], &["*.jl"]),
-    (&["jupyter"], &["*.ipynb", "*.jpynb"]),
-    (&["k"], &["*.k"]),
-    (&["kconfig"], &["Kconfig", "Kconfig.*"]),
-    (&["kotlin"], &["*.kt", "*.kts"]),
-    (&["lean"], &["*.lean"]),
-    (&["less"], &["*.less"]),
-    (&["license"], &[
-        // General
-        "COPYING", "COPYING[.-]*",
-        "COPYRIGHT", "COPYRIGHT[.-]*",
-        "EULA", "EULA[.-]*",
-        "licen[cs]e", "licen[cs]e.*",
-        "LICEN[CS]E", "LICEN[CS]E[.-]*", "*[.-]LICEN[CS]E*",
-        "NOTICE", "NOTICE[.-]*",
-        "PATENTS", "PATENTS[.-]*",
-        "UNLICEN[CS]E", "UNLICEN[CS]E[.-]*",
-        // GPL (gpl.txt, etc.)
-        "agpl[.-]*",
-        "gpl[.-]*",
-        "lgpl[.-]*",
-        // Other license-specific (APACHE-2.0.txt, etc.)
-        "AGPL-*[0-9]*",
-        "APACHE-*[0-9]*",
-        "BSD-*[0-9]*",
-        "CC-BY-*",
-        "GFDL-*[0-9]*",
-        "GNU-*[0-9]*",
-        "GPL-*[0-9]*",
-        "LGPL-*[0-9]*",
-        "MIT-*[0-9]*",
-        "MPL-*[0-9]*",
-        "OFL-*[0-9]*",
-    ]),
-    (&["lilypond"], &["*.ly", "*.ily"]),
-    (&["lisp"], &["*.el", "*.jl", "*.lisp", "*.lsp", "*.sc", "*.scm"]),
-    (&["llvm"], &["*.ll"]),
-    (&["lock"], &["*.lock", "package-lock.json"]),
-    (&["log"], &["*.log"]),
-    (&["lua"], &["*.lua"]),
-    (&["lz4"], &["*.lz4"]),
-    (&["lzma"], &["*.lzma"]),
-    (&["m4"], &["*.ac", "*.m4"]),
-    (&["make"], &[
-        "[Gg][Nn][Uu]makefile", "[Mm]akefile",
-        "[Gg][Nn][Uu]makefile.am", "[Mm]akefile.am",
-        "[Gg][Nn][Uu]makefile.in", "[Mm]akefile.in",
-        "Makefile.*",
-        "*.mk", "*.mak"
-    ]),
-    (&["mako"], &["*.mako", "*.mao"]),
-    (&["man"], &["*.[0-9lnpx]", "*.[0-9][cEFMmpSx]"]),
-    (&["markdown", "md"], &[
-        "*.markdown",
-        "*.md",
-        "*.mdown",
-        "*.mdwn",
-        "*.mkd",
-        "*.mkdn",
-        "*.mdx",
-    ]),
-    (&["matlab"], &["*.m"]),
-    (&["meson"], &["meson.build", "meson_options.txt", "meson.options"]),
-    (&["minified"], &["*.min.html", "*.min.css", "*.min.js"]),
-    (&["mint"], &["*.mint"]),
-    (&["mk"], &["mkfile"]),
-    (&["ml"], &["*.ml"]),
-    (&["mojo"], &["*.mojo"]),
-    (&["motoko"], &["*.mo"]),
-    (&["msbuild"], &[
-        "*.csproj", "*.fsproj", "*.vcxproj", "*.proj", "*.props", "*.targets",
-        "*.sln", "*.slnf"
-    ]),
-    (&["nim"], &["*.nim", "*.nimf", "*.nimble", "*.nims"]),
-    (&["nix"], &["*.nix"]),
-    (&["objc"], &["*.h", "*.m"]),
-    (&["objcpp"], &["*.h", "*.mm"]),
-    (&["ocaml"], &["*.ml", "*.mli", "*.mll", "*.mly"]),
-    (&["org"], &["*.org", "*.org_archive"]),
-    (&["pants"], &["BUILD"]),
-    (&["pascal"], &["*.pas", "*.dpr", "*.lpr", "*.pp", "*.inc"]),
-    (&["pdf"], &["*.pdf"]),
-    (&["perl"], &["*.perl", "*.pl", "*.PL", "*.plh", "*.plx", "*.pm", "*.t"]),
-    (&["php"], &[
-        // note that PHP 6 doesn't exist
-        // See: https://wiki.php.net/rfc/php6
-        "*.php", "*.php3", "*.php4", "*.php5", "*.php7", "*.php8",
-        "*.pht", "*.phtml"
-    ]),
-    (&["pkgbuild"], &["PKGBUILD"]),
-    (&["po"], &["*.po"]),
-    (&["pod"], &["*.pod"]),
-    (&["postscript"], &["*.eps", "*.ps"]),
-    (&["prolog"], &["*.pl", "*.pro", "*.prolog", "*.P"]),
-    (&["proto", "protobuf"], &["*.proto"]),
-    (&["ps"], &["*.cdxml", "*.ps1", "*.ps1xml", "*.psd1", "*.psm1"]),
-    (&["puppet"], &["*.epp", "*.erb", "*.pp", "*.rb"]),
-    (&["purs"], &["*.purs"]),
-    (&["py", "python"], &["*.py", "*.pyi"]),
-    (&["qmake"], &["*.pro", "*.pri", "*.prf"]),
-    (&["qml"], &["*.qml"]),
-    (&["qrc"], &["*.qrc"]),
-    (&["qui"], &["*.ui"]),
-    (&["r"], &["*.R", "*.r", "*.Rmd", "*.rmd", "*.Rnw", "*.rnw"]),
-    (&["racket"], &["*.rkt"]),
-    (&["raku"], &[
-        "*.raku", "*.rakumod", "*.rakudoc", "*.rakutest",
-        "*.p6", "*.pl6", "*.pm6"
-    ]),
-    (&["rdoc"], &["*.rdoc"]),
-    (&["readme"], &["README*", "*README"]),
-    (&["reasonml"], &["*.re", "*.rei"]),
-    (&["red"], &["*.r", "*.red", "*.reds"]),
-    (&["rescript"], &["*.res", "*.resi"]),
-    (&["robot"], &["*.robot"]),
-    (&["rocq"], &["*.v"]),
-    (&["rst"], &["*.rst"]),
-    (&["ruby"], &[
-        // Idiomatic files
-        "config.ru", "Gemfile", ".irbrc", "Rakefile",
-        // Extensions
-        "*.gemspec", "*.rb", "*.rbw", "*.rake"
-    ]),
-    (&["rust"], &["*.rs"]),
-    (&["sass"], &["*.sass", "*.scss"]),
-    (&["scala"], &["*.scala", "*.sbt"]),
-    (&["scdoc"], &["*.scd", "*.scdoc"]),
-    (&["seed7"], &["*.sd7", "*.s7i"]),
-    (&["sh"], &[
-        // Portable/misc. init files
-        ".env", ".login", ".logout", ".profile", "profile",
-        // bash-specific init files
-        ".bash_login", "bash_login",
-        ".bash_logout", "bash_logout",
-        ".bash_profile", "bash_profile",
-        ".bashrc", "bashrc", "*.bashrc",
-        // csh-specific init files
-        ".cshrc", "*.cshrc",
-        // ksh-specific init files
-        ".kshrc", "*.kshrc",
-        // tcsh-specific init files
-        ".tcshrc",
-        // zsh-specific init files
-        ".zshenv", "zshenv",
-        ".zlogin", "zlogin",
-        ".zlogout", "zlogout",
-        ".zprofile", "zprofile",
-        ".zshrc", "zshrc",
-        // Extensions
-        "*.bash", "*.csh", "*.env", "*.ksh", "*.sh", "*.tcsh", "*.zsh",
-    ]),
-    (&["slim"], &["*.skim", "*.slim", "*.slime"]),
-    (&["smarty"], &["*.tpl"]),
-    (&["sml"], &["*.sml", "*.sig"]),
-    (&["solidity"], &["*.sol"]),
-    (&["soy"], &["*.soy"]),
-    (&["spark"], &["*.spark"]),
-    (&["spec"], &["*.spec"]),
-    (&["sql"], &["*.sql", "*.psql"]),
-    (&["ssa"], &["*.ssa"]),
-    (&["stylus"], &["*.styl"]),
-    (&["sv"], &["*.v", "*.vg", "*.sv", "*.svh", "*.h"]),
-    (&["svelte"], &["*.svelte", "*.svelte.ts"]),
-    (&["svg"], &["*.svg"]),
-    (&["swift"], &["*.swift"]),
-    (&["swig"], &["*.def", "*.i"]),
-    (&["systemd"], &[
-        "*.automount", "*.conf", "*.device", "*.link", "*.mount", "*.path",
-        "*.scope", "*.service", "*.slice", "*.socket", "*.swap", "*.target",
-        "*.timer",
-    ]),
-    (&["taskpaper"], &["*.taskpaper"]),
-    (&["tcl"], &["*.tcl"]),
-    (&["tex"], &["*.tex", "*.ltx", "*.cls", "*.sty", "*.bib", "*.dtx", "*.ins"]),
-    (&["texinfo"], &["*.texi"]),
-    (&["textile"], &["*.textile"]),
-    (&["tf"], &[
-        "*.tf", "*.tf.json", "*.tfvars", "*.tfvars.json",
-        "*.terraformrc", "terraform.rc", "*.tfrc", "*.terraform.lock.hcl",
-    ]),
-    (&["thrift"], &["*.thrift"]),
-    (&["toml"], &["*.toml", "Cargo.lock"]),
-    (&["ts", "typescript"], &["*.ts", "*.tsx", "*.cts", "*.mts"]),
-    (&["twig"], &["*.twig"]),
-    (&["txt"], &["*.txt"]),
-    (&["typoscript"], &["*.typoscript", "*.ts"]),
-    (&["typst"], &["*.typ"]),
-    (&["usd"], &["*.usd", "*.usda", "*.usdc"]),
-    (&["v"], &["*.v", "*.vsh"]),
-    (&["vala"], &["*.vala"]),
-    (&["vb"], &["*.vb"]),
-    (&["vcl"], &["*.vcl"]),
-    (&["verilog"], &["*.v", "*.vh", "*.sv", "*.svh"]),
-    (&["vhdl"], &["*.vhd", "*.vhdl"]),
-    (&["vim"], &[
-        "*.vim", ".vimrc", ".gvimrc", "vimrc", "gvimrc", "_vimrc", "_gvimrc",
-    ]),
-    (&["vimscript"], &[
-        "*.vim", ".vimrc", ".gvimrc", "vimrc", "gvimrc", "_vimrc", "_gvimrc",
-    ]),
-    (&["vue"], &["*.vue"]),
-    (&["webidl"], &["*.idl", "*.webidl", "*.widl"]),
-    (&["wgsl"], &["*.wgsl"]),
-    (&["wiki"], &["*.mediawiki", "*.wiki"]),
-    (&["xml"], &[
-        "*.xml", "*.xml.dist", "*.dtd", "*.xsl", "*.xslt", "*.xsd", "*.xjb",
-        "*.rng", "*.sch", "*.xhtml",
-    ]),
-    (&["xz"], &["*.xz", "*.txz"]),
-    (&["yacc"], &["*.y"]),
-    (&["yaml"], &["*.yaml", "*.yml"]),
-    (&["yang"], &["*.yang"]),
-    (&["z"], &["*.Z"]),
-    (&["zig"], &["*.zig"]),
-    (&["zsh"], &[
-        ".zshenv", "zshenv",
-        ".zlogin", "zlogin",
-        ".zlogout", "zlogout",
-        ".zprofile", "zprofile",
-        ".zshrc", "zshrc",
-        "*.zsh",
-    ]),
-    (&["zstd"], &["*.zst", "*.zstd"]),
-];
-
-#[cfg(test)]
-mod tests {
-    use super::DEFAULT_TYPES;
-
-    #[test]
-    fn default_types_are_sorted() {
-        let mut names = DEFAULT_TYPES.iter().map(|(aliases, _)| aliases[0]);
-        let Some(mut previous_name) = names.next() else {
-            return;
-        };
-        for name in names {
-            assert!(
-                name > previous_name,
-                r#""{}" should be sorted before "{}" in `DEFAULT_TYPES`"#,
-                name,
-                previous_name
-            );
-            previous_name = name;
-        }
-    }
-
-    #[test]
-    fn default_types_aliases_are_sorted() {
-        for (aliases, _) in DEFAULT_TYPES.iter() {
-            assert!(
-                aliases.is_sorted(),
-                "this alias list is not sorted: {aliases:?}",
-            );
-        }
-    }
-}
diff --git a/crates/ignore/src/dir.rs b/crates/ignore/src/dir.rs
deleted file mode 100644
index 6bee724c8..000000000
--- a/crates/ignore/src/dir.rs
+++ /dev/null
@@ -1,1648 +0,0 @@
-// This module provides a data structure, `Ignore`, that connects "directory
-// traversal" with "ignore matchers." Specifically, it knows about gitignore
-// semantics and precedence, and is organized based on directory hierarchy.
-// Namely, every matcher logically corresponds to ignore rules from a single
-// directory, and points to the matcher for its corresponding parent directory.
-// In this sense, `Ignore` is a *persistent* data structure.
-//
-// This design was specifically chosen to make it possible to use this data
-// structure in a parallel directory iterator.
-//
-// My initial intention was to expose this module as part of this crate's
-// public API, but I think the data structure's public API is too complicated
-// with non-obvious failure modes. Alas, such things haven't been documented
-// well.
-
-use std::{
-    collections::HashMap,
-    ffi::{OsStr, OsString},
-    fs::{self, File, FileType},
-    io::{self, BufRead},
-    path::{Path, PathBuf},
-    sync::{Arc, RwLock, Weak},
-};
-
-use crate::{
-    gitignore::{self, Gitignore, GitignoreBuilder},
-    overrides::{self, Override},
-    pathutil::{is_hidden_entry, strip_prefix},
-    types::{self, Types},
-    walk::DirEntry,
-    {Error, Match, PartialErrorBuilder},
-};
-
-/// IgnoreMatch represents information about where a match came from when using
-/// the `Ignore` matcher.
-#[derive(Clone, Debug)]
-#[allow(dead_code)]
-pub(crate) struct IgnoreMatch<'a>(IgnoreMatchInner<'a>);
-
-/// IgnoreMatchInner describes precisely where the match information came from.
-/// This is private to allow expansion to more matchers in the future.
-#[derive(Clone, Debug)]
-#[allow(dead_code)]
-enum IgnoreMatchInner<'a> {
-    Override(overrides::Glob<'a>),
-    Gitignore(&'a gitignore::Glob),
-    Types(types::Glob<'a>),
-    Hidden,
-}
-
-impl<'a> IgnoreMatch<'a> {
-    fn overrides(x: overrides::Glob<'a>) -> IgnoreMatch<'a> {
-        IgnoreMatch(IgnoreMatchInner::Override(x))
-    }
-
-    fn gitignore(x: &'a gitignore::Glob) -> IgnoreMatch<'a> {
-        IgnoreMatch(IgnoreMatchInner::Gitignore(x))
-    }
-
-    fn types(x: types::Glob<'a>) -> IgnoreMatch<'a> {
-        IgnoreMatch(IgnoreMatchInner::Types(x))
-    }
-
-    fn hidden() -> IgnoreMatch<'static> {
-        IgnoreMatch(IgnoreMatchInner::Hidden)
-    }
-}
-
-/// Options for the ignore matcher, shared between the matcher itself and the
-/// builder.
-#[derive(Clone, Copy, Debug)]
-struct IgnoreOptions {
-    /// Whether to ignore hidden file paths or not.
-    hidden: bool,
-    /// Whether to read .ignore files.
-    ignore: bool,
-    /// Whether to respect any ignore files in parent directories.
-    parents: bool,
-    /// Whether to read git's global gitignore file.
-    git_global: bool,
-    /// Whether to read .gitignore files.
-    git_ignore: bool,
-    /// Whether to read .git/info/exclude files.
-    git_exclude: bool,
-    /// Whether to ignore files case insensitively
-    ignore_case_insensitive: bool,
-    /// Whether a git repository must be present in order to apply any
-    /// git-related ignore rules.
-    require_git: bool,
-}
-
-/// Ignore is a matcher useful for recursively walking one or more directories.
-#[derive(Clone, Debug)]
-pub(crate) struct Ignore {
-    inner: Arc<IgnoreInner>,
-    // Parent matchers are cached independently of the path being walked, but
-    // matching them still needs the canonicalized path originally passed to
-    // `add_parents`. For example, when walking `/tmp/project/src`, parent
-    // matchers use `/tmp/project/src` to rewrite `/tmp/project/src/foo.py`
-    // before matching it against ignore files from `/tmp/project` and its
-    // ancestors.
-    //
-    // For ripgrep itself, this means that `rg pat src tests` must rewrite
-    // `src/foo` relative to `.../src`, and not whatever root was prepared
-    // first.
-    //
-    // See: https://github.com/BurntSushi/ripgrep/pull/3420
-    // See: https://github.com/BurntSushi/ripgrep/issues/3376
-    // See: https://github.com/BurntSushi/ripgrep/issues/3419
-    // See: https://github.com/BurntSushi/ripgrep/issues/3320
-    absolute_base: Option<Arc<PathBuf>>,
-}
-
-#[derive(Clone, Debug)]
-struct IgnoreInner {
-    /// A map of all existing directories that have already been
-    /// compiled into matchers.
-    ///
-    /// Note that this is never used during matching, only when adding new
-    /// parent directory matchers. This avoids needing to rebuild glob sets for
-    /// parent directories if many paths are being searched.
-    compiled: Arc<RwLock<HashMap<OsString, Weak<IgnoreInner>>>>,
-    /// The path to the directory that this matcher was built from.
-    dir: PathBuf,
-    /// An override matcher (default is empty).
-    overrides: Arc<Override>,
-    /// A file type matcher.
-    types: Arc<Types>,
-    /// The parent directory to match next.
-    ///
-    /// If this is the root directory or there are otherwise no more
-    /// directories to match, then `parent` is `None`.
-    parent: Option<Arc<IgnoreInner>>,
-    /// Whether this is an absolute parent matcher, as added by add_parent.
-    is_absolute_parent: bool,
-    /// The directory that gitignores should be interpreted relative to.
-    ///
-    /// Usually this is the directory containing the gitignore file. But in
-    /// some cases, like for global gitignores or for gitignores specified
-    /// explicitly, this should generally be set to the current working
-    /// directory. This is only used for global gitignores or "explicit"
-    /// gitignores.
-    ///
-    /// When `None`, this means the CWD could not be determined or is unknown.
-    /// In this case, global gitignore files are ignored because they otherwise
-    /// cannot be matched correctly.
-    global_gitignores_relative_to: Option<PathBuf>,
-    /// Explicit global ignore matchers specified by the caller.
-    explicit_ignores: Arc<Vec<Gitignore>>,
-    /// Ignore files used in addition to `.ignore`
-    custom_ignore_filenames: Arc<Vec<OsString>>,
-    /// The matcher for custom ignore files
-    custom_ignore_matcher: Gitignore,
-    /// The matcher for .ignore files.
-    ignore_matcher: Gitignore,
-    /// A global gitignore matcher, usually from $XDG_CONFIG_HOME/git/ignore.
-    git_global_matcher: Arc<Gitignore>,
-    /// The matcher for .gitignore files.
-    git_ignore_matcher: Gitignore,
-    /// Special matcher for `.git/info/exclude` files.
-    git_exclude_matcher: Gitignore,
-    /// Whether this directory contains a .git sub-directory.
-    has_git: bool,
-    /// Ignore config.
-    opts: IgnoreOptions,
-}
-
-impl Ignore {
-    /// Return the directory path of this matcher.
-    #[cfg(test)]
-    pub(crate) fn path(&self) -> &Path {
-        &self.inner.dir
-    }
-
-    /// Return true if this matcher has no parent.
-    pub(crate) fn is_root(&self) -> bool {
-        self.inner.parent.is_none()
-    }
-
-    /// Return this matcher's parent, if one exists.
-    pub(crate) fn parent(&self) -> Option<Ignore> {
-        self.inner.parent.as_ref().map(|parent| Ignore {
-            inner: parent.clone(),
-            absolute_base: self.absolute_base.clone(),
-        })
-    }
-
-    /// Create a new `Ignore` matcher with the parent directories of `dir`.
-    ///
-    /// Note that this can only be called on an `Ignore` matcher with no
-    /// parents (i.e., `is_root` returns `true`). This will panic otherwise.
-    pub(crate) fn add_parents<P: AsRef<Path>>(
-        &self,
-        path: P,
-    ) -> (Ignore, Option<Error>) {
-        if !self.inner.opts.parents
-            && !self.inner.opts.git_ignore
-            && !self.inner.opts.git_exclude
-            && !self.inner.opts.git_global
-        {
-            // If we never need info from parent directories, then don't do
-            // anything.
-            return (self.clone(), None);
-        }
-        if !self.is_root() {
-            panic!("Ignore::add_parents called on non-root matcher");
-        }
-        // CHANGED: Use `dunce::canonicalize` as we use it everywhere else.
-        let absolute_base = match dunce::canonicalize(path.as_ref()) {
-            Ok(path) => Arc::new(path),
-            Err(_) => {
-                // There's not much we can do here, so just return our
-                // existing matcher. We drop the error to be consistent
-                // with our general pattern of ignoring I/O errors when
-                // processing ignore files.
-                return (self.clone(), None);
-            }
-        };
-        // List of parents, from child to root.
-        let mut parents = vec![];
-        let mut path = &**absolute_base;
-        while let Some(parent) = path.parent() {
-            parents.push(parent);
-            path = parent;
-        }
-        let mut errs = PartialErrorBuilder::default();
-        let mut ig = self.clone();
-        for parent in parents.into_iter().rev() {
-            let mut compiled = self.inner.compiled.write().unwrap();
-            if let Some(weak) = compiled.get(parent.as_os_str()) {
-                if let Some(prebuilt) = weak.upgrade() {
-                    ig = Ignore {
-                        inner: prebuilt,
-                        absolute_base: Some(absolute_base.clone()),
-                    };
-                    continue;
-                }
-            }
-            let (mut igtmp, err) = ig.add_child_path(parent);
-            errs.maybe_push(err);
-            igtmp.is_absolute_parent = true;
-            igtmp.has_git =
-                if self.inner.opts.require_git && self.inner.opts.git_ignore {
-                    parent.join(".git").exists() || parent.join(".jj").exists()
-                } else {
-                    false
-                };
-            let ig_arc = Arc::new(igtmp);
-            ig = Ignore {
-                inner: ig_arc.clone(),
-                absolute_base: Some(absolute_base.clone()),
-            };
-            compiled.insert(
-                parent.as_os_str().to_os_string(),
-                Arc::downgrade(&ig_arc),
-            );
-        }
-        (ig, errs.into_error_option())
-    }
-
-    /// Create a new `Ignore` matcher for the given child directory.
-    ///
-    /// Since building the matcher may require reading from multiple
-    /// files, it's possible that this method partially succeeds. Therefore,
-    /// a matcher is always returned (which may match nothing) and an error is
-    /// returned if it exists.
-    ///
-    /// Note that all I/O errors are completely ignored.
-    pub(crate) fn add_child<P: AsRef<Path>>(
-        &self,
-        dir: P,
-    ) -> (Ignore, Option<Error>) {
-        let (ig, err) = self.add_child_path(dir.as_ref());
-        (
-            Ignore {
-                inner: Arc::new(ig),
-                absolute_base: self.absolute_base.clone(),
-            },
-            err,
-        )
-    }
-
-    /// Like add_child, but uses successful read_dir entries to reduce
-    /// probing when discovering ignore files.
-    pub(crate) fn add_child_with_entries<P: AsRef<Path>>(
-        &self,
-        dir: P,
-        entries: &[fs::DirEntry],
-    ) -> (Ignore, Option<Error>) {
-        let files = self.collect_ignore_files(entries);
-        let (ig, err) = self.add_child_path_with_found_ignore_files(
-            dir.as_ref(),
-            Some(&files),
-        );
-        (
-            Ignore {
-                inner: Arc::new(ig),
-                absolute_base: self.absolute_base.clone(),
-            },
-            err,
-        )
-    }
-
-    /// Like add_child, but takes a full path and returns an IgnoreInner.
-    fn add_child_path(&self, dir: &Path) -> (IgnoreInner, Option<Error>) {
-        self.add_child_path_with_found_ignore_files(dir, None)
-    }
-
-    fn collect_ignore_files(
-        &self,
-        entries: &[fs::DirEntry],
-    ) -> IgnoreFilesFound {
-        let custom_ignore_filenames = &self.inner.custom_ignore_filenames;
-        let mut files = IgnoreFilesFound {
-            has_ignore: false,
-            has_git_ignore: false,
-            has_git_dir: false,
-            has_jj_dir: false,
-            custom_ignore_files: vec![false; custom_ignore_filenames.len()],
-        };
-        for entry in entries {
-            let file_name = entry.file_name();
-            if file_name == OsStr::new(".ignore") {
-                files.has_ignore = true;
-            } else if file_name == OsStr::new(".gitignore") {
-                files.has_git_ignore = true;
-            } else if file_name == OsStr::new(".git") {
-                files.has_git_dir = true;
-            } else if file_name == OsStr::new(".jj") {
-                files.has_jj_dir = true;
-            }
-            for (i, name) in custom_ignore_filenames.iter().enumerate() {
-                if file_name == name.as_os_str() {
-                    files.custom_ignore_files[i] = true;
-                }
-            }
-        }
-        files
-    }
-
-    fn add_child_path_with_found_ignore_files(
-        &self,
-        dir: &Path,
-        ignore_files_list: Option<&IgnoreFilesFound>,
-    ) -> (IgnoreInner, Option<Error>) {
-        let check_vcs_dir = self.inner.opts.require_git
-            && (self.inner.opts.git_ignore || self.inner.opts.git_exclude);
-        let git_type = if check_vcs_dir
-            && ignore_files_list.is_none_or(|i| i.has_git_dir)
-        {
-            dir.join(".git").metadata().ok().map(|md| md.file_type())
-        } else {
-            None
-        };
-        let has_jj = check_vcs_dir
-            && ignore_files_list.is_none_or(|i| i.has_jj_dir)
-            && dir.join(".jj").exists();
-        let has_git = check_vcs_dir && (git_type.is_some() || has_jj);
-
-        let mut errs = PartialErrorBuilder::default();
-        let custom_ig_matcher = if self
-            .inner
-            .custom_ignore_filenames
-            .is_empty()
-        {
-            Gitignore::empty()
-        } else {
-            let custom_ignore_names: Vec<&OsString> = match ignore_files_list {
-                None => self.inner.custom_ignore_filenames.iter().collect(),
-                Some(m) => self
-                    .inner
-                    .custom_ignore_filenames
-                    .iter()
-                    .zip(m.custom_ignore_files.iter())
-                    .filter(|&(_, &matched)| matched)
-                    .map(|(name, _)| name)
-                    .collect(),
-            };
-            if custom_ignore_names.is_empty() {
-                Gitignore::empty()
-            } else {
-                let (m, err) = create_gitignore(
-                    &dir,
-                    &dir,
-                    &custom_ignore_names,
-                    self.inner.opts.ignore_case_insensitive,
-                );
-                errs.maybe_push(err);
-                m
-            }
-        };
-        let ig_matcher = if !self.inner.opts.ignore
-            || !ignore_files_list.is_none_or(|i| i.has_ignore)
-        {
-            Gitignore::empty()
-        } else {
-            let (m, err) = create_gitignore(
-                &dir,
-                &dir,
-                &[".ignore"],
-                self.inner.opts.ignore_case_insensitive,
-            );
-            errs.maybe_push(err);
-            m
-        };
-        let gi_matcher = if !self.inner.opts.git_ignore
-            || !ignore_files_list.is_none_or(|i| i.has_git_ignore)
-        {
-            Gitignore::empty()
-        } else {
-            let (m, err) = create_gitignore(
-                &dir,
-                &dir,
-                &[".gitignore"],
-                self.inner.opts.ignore_case_insensitive,
-            );
-            errs.maybe_push(err);
-            m
-        };
-
-        let gi_exclude_matcher = if !self.inner.opts.git_exclude
-            || !ignore_files_list.is_none_or(|i| i.has_git_dir)
-        {
-            Gitignore::empty()
-        } else {
-            match resolve_git_commondir(dir, git_type) {
-                Ok(git_dir) => {
-                    let (m, err) = create_gitignore(
-                        &dir,
-                        &git_dir,
-                        &["info/exclude"],
-                        self.inner.opts.ignore_case_insensitive,
-                    );
-                    errs.maybe_push(err);
-                    m
-                }
-                Err(err) => {
-                    errs.maybe_push(err);
-                    Gitignore::empty()
-                }
-            }
-        };
-        let ig = IgnoreInner {
-            compiled: self.inner.compiled.clone(),
-            dir: dir.to_path_buf(),
-            overrides: self.inner.overrides.clone(),
-            types: self.inner.types.clone(),
-            parent: Some(self.inner.clone()),
-            is_absolute_parent: false,
-            global_gitignores_relative_to: self
-                .inner
-                .global_gitignores_relative_to
-                .clone(),
-            explicit_ignores: self.inner.explicit_ignores.clone(),
-            custom_ignore_filenames: self
-                .inner
-                .custom_ignore_filenames
-                .clone(),
-            custom_ignore_matcher: custom_ig_matcher,
-            ignore_matcher: ig_matcher,
-            git_global_matcher: self.inner.git_global_matcher.clone(),
-            git_ignore_matcher: gi_matcher,
-            git_exclude_matcher: gi_exclude_matcher,
-            has_git,
-            opts: self.inner.opts,
-        };
-        (ig, errs.into_error_option())
-    }
-
-    /// Returns true if at least one type of ignore rule should be matched.
-    fn has_any_ignore_rules(&self) -> bool {
-        let opts = self.inner.opts;
-        let has_custom_ignore_files =
-            !self.inner.custom_ignore_filenames.is_empty();
-        let has_explicit_ignores = !self.inner.explicit_ignores.is_empty();
-
-        opts.ignore
-            || opts.git_global
-            || opts.git_ignore
-            || opts.git_exclude
-            || has_custom_ignore_files
-            || has_explicit_ignores
-    }
-
-    /// Like `matched`, but works with a directory entry instead.
-    pub(crate) fn matched_dir_entry<'a>(
-        &'a self,
-        dent: &DirEntry,
-    ) -> Match<IgnoreMatch<'a>> {
-        let m = self.matched(dent.path(), dent.is_dir());
-        if m.is_none() && self.inner.opts.hidden && is_hidden_entry(dent) {
-            return Match::Ignore(IgnoreMatch::hidden());
-        }
-        m
-    }
-
-    /// Returns a match indicating whether the given file path should be
-    /// ignored or not.
-    ///
-    /// The match contains information about its origin.
-    pub(crate) fn matched<'a, P: AsRef<Path>>(
-        &'a self,
-        path: P,
-        is_dir: bool,
-    ) -> Match<IgnoreMatch<'a>> {
-        // We need to be careful with our path. If it has a leading ./, then
-        // strip it because it causes nothing but trouble.
-        let mut path = path.as_ref();
-        if let Some(p) = strip_prefix("./", path) {
-            path = p;
-        }
-        // Match against the override patterns. If an override matches
-        // regardless of whether it's whitelist/ignore, then we quit and
-        // return that result immediately. Overrides have the highest
-        // precedence.
-        if !self.inner.overrides.is_empty() {
-            let mat = self
-                .inner
-                .overrides
-                .matched(path, is_dir)
-                .map(IgnoreMatch::overrides);
-            if !mat.is_none() {
-                return mat;
-            }
-        }
-        let mut whitelisted = Match::None;
-        if self.has_any_ignore_rules() {
-            let mat = self.matched_ignore(path, is_dir);
-            if mat.is_ignore() {
-                return mat;
-            } else if mat.is_whitelist() {
-                whitelisted = mat;
-            }
-        }
-        if !self.inner.types.is_empty() {
-            let mat =
-                self.inner.types.matched(path, is_dir).map(IgnoreMatch::types);
-            if mat.is_ignore() {
-                return mat;
-            } else if mat.is_whitelist() {
-                whitelisted = mat;
-            }
-        }
-        whitelisted
-    }
-
-    /// Performs matching only on the ignore files for this directory and
-    /// all parent directories.
-    pub(crate) fn matched_ignore<'a>(
-        &'a self,
-        path: &Path,
-        is_dir: bool,
-    ) -> Match<IgnoreMatch<'a>> {
-        let (
-            mut m_custom_ignore,
-            mut m_ignore,
-            mut m_gi,
-            mut m_gi_exclude,
-            mut m_explicit,
-        ) = (Match::None, Match::None, Match::None, Match::None, Match::None);
-        let any_git = !self.inner.opts.require_git
-            || self.parents().any(|ig| ig.inner.has_git);
-        let mut saw_git = false;
-        for ig in self.parents().take_while(|ig| !ig.inner.is_absolute_parent)
-        {
-            if m_custom_ignore.is_none() {
-                m_custom_ignore = ig
-                    .inner
-                    .custom_ignore_matcher
-                    .matched(path, is_dir)
-                    .map(IgnoreMatch::gitignore);
-            }
-            if m_ignore.is_none() {
-                m_ignore = ig
-                    .inner
-                    .ignore_matcher
-                    .matched(path, is_dir)
-                    .map(IgnoreMatch::gitignore);
-            }
-            if any_git && !saw_git && m_gi.is_none() {
-                m_gi = ig
-                    .inner
-                    .git_ignore_matcher
-                    .matched(path, is_dir)
-                    .map(IgnoreMatch::gitignore);
-            }
-            if any_git && !saw_git && m_gi_exclude.is_none() {
-                m_gi_exclude = ig
-                    .inner
-                    .git_exclude_matcher
-                    .matched(path, is_dir)
-                    .map(IgnoreMatch::gitignore);
-            }
-            saw_git = saw_git || ig.inner.has_git;
-        }
-        if self.inner.opts.parents {
-            if let Some(abs_parent_path) = self.absolute_base() {
-                // What we want to do here is take the absolute base path of
-                // this directory and join it with the path we're searching.
-                // The main issue we want to avoid is accidentally duplicating
-                // directory components, so we try to strip any common prefix
-                // off of `path`. Overall, this seems a little ham-fisted, but
-                // it does fix a nasty bug. It should do fine until we overhaul
-                // this crate.
-                let path = abs_parent_path.join(
-                    self.parents()
-                        .take_while(|ig| !ig.inner.is_absolute_parent)
-                        .last()
-                        .map_or(path, |ig| {
-                            // This is a weird special case when ripgrep users
-                            // search with just a `.`, as some tools do
-                            // automatically (like consult). In this case, if
-                            // we don't bail out now, the code below will strip
-                            // a leading `.` from `path`, which might mangle
-                            // a hidden file name!
-                            if ig.inner.dir.as_path() == Path::new(".") {
-                                return path;
-                            }
-                            let without_dot_slash = strip_if_is_prefix(
-                                "./",
-                                ig.inner.dir.as_path(),
-                            );
-                            let relative_base =
-                                strip_if_is_prefix(without_dot_slash, path);
-                            strip_if_is_prefix("/", relative_base)
-                        }),
-                );
-
-                for ig in self
-                    .parents()
-                    .skip_while(|ig| !ig.inner.is_absolute_parent)
-                {
-                    if m_custom_ignore.is_none() {
-                        m_custom_ignore = ig
-                            .inner
-                            .custom_ignore_matcher
-                            .matched(&path, is_dir)
-                            .map(IgnoreMatch::gitignore);
-                    }
-                    if m_ignore.is_none() {
-                        m_ignore = ig
-                            .inner
-                            .ignore_matcher
-                            .matched(&path, is_dir)
-                            .map(IgnoreMatch::gitignore);
-                    }
-                    if any_git && !saw_git && m_gi.is_none() {
-                        m_gi = ig
-                            .inner
-                            .git_ignore_matcher
-                            .matched(&path, is_dir)
-                            .map(IgnoreMatch::gitignore);
-                    }
-                    if any_git && !saw_git && m_gi_exclude.is_none() {
-                        m_gi_exclude = ig
-                            .inner
-                            .git_exclude_matcher
-                            .matched(&path, is_dir)
-                            .map(IgnoreMatch::gitignore);
-                    }
-                    saw_git = saw_git || ig.inner.has_git;
-                }
-            }
-        }
-        for gi in self.inner.explicit_ignores.iter().rev() {
-            if !m_explicit.is_none() {
-                break;
-            }
-            // CHANGED: We need to make sure that the explicit gitignore rules
-            // apply to the path
-            //
-            //     path      = Is the current file/folder we are traversing
-            //     gi.path() = Is the path of the custom gitignore file
-            //
-            // E.g.: If we have a custom rule for `/src/utils` with `**/*`, and
-            //       we are looking at just `/src`, then the `**/*` rules do
-            //       not apply to this folder, so we can ignore the current
-            //       custom gitignore file.
-            if !path.starts_with(gi.path()) {
-                continue;
-            }
-            m_explicit = gi.matched(&path, is_dir).map(IgnoreMatch::gitignore);
-        }
-        let m_global = if any_git {
-            self.inner
-                .git_global_matcher
-                .matched(&path, is_dir)
-                .map(IgnoreMatch::gitignore)
-        } else {
-            Match::None
-        };
-
-        // CHANGED: We added logic to configure an order in which the ignore
-        // files are respected. Explicitly added ignores (via
-        // `WalkBuilder::add_gitignore`) take precedence over all ignore files
-        // found on disk, and the first source with a definitive answer wins.
-        let order = [
-            // Manually added ignores
-            m_explicit,
-            // .custom-ignore
-            m_custom_ignore,
-            // .ignore
-            m_ignore,
-            // .gitignore
-            m_gi,
-            // .git/info/exclude
-            m_gi_exclude,
-            // Global gitignore
-            m_global,
-        ];
-        for check in order.into_iter() {
-            if !check.is_none() {
-                return check;
-            }
-        }
-        Match::None
-    }
-
-    /// Returns an iterator over parent ignore matchers, including this one.
-    pub(crate) fn parents(&self) -> Parents<'_> {
-        Parents(Some(IgnoreRef { inner: &self.inner }))
-    }
-
-    /// Returns the first absolute path of the first absolute parent, if
-    /// one exists.
-    fn absolute_base(&self) -> Option<&Path> {
-        self.absolute_base.as_ref().map(|p| &***p)
-    }
-}
-
-/// State for tracking what kinds of files ripgrep is interested in for a
-/// given directory.
-///
-/// This is computed over the entire set of files in a directory instead of
-/// trying to stat each file individually. If a file is present, it's only then
-/// that we stat it for more information, instead of relying on the stat to
-/// determine its existence.
-#[derive(Debug)]
-struct IgnoreFilesFound {
-    has_ignore: bool,
-    has_git_ignore: bool,
-    has_git_dir: bool,
-    has_jj_dir: bool,
-    custom_ignore_files: Vec<bool>,
-}
-
-#[derive(Clone, Copy)]
-pub(crate) struct IgnoreRef<'a> {
-    inner: &'a IgnoreInner,
-}
-
-impl IgnoreRef<'_> {
-    pub(crate) fn path(&self) -> &Path {
-        &self.inner.dir
-    }
-
-    pub(crate) fn is_absolute_parent(&self) -> bool {
-        self.inner.is_absolute_parent
-    }
-}
-
-/// An iterator over all parents of an ignore matcher, including itself.
-pub(crate) struct Parents<'a>(Option<IgnoreRef<'a>>);
-
-impl<'a> Iterator for Parents<'a> {
-    type Item = IgnoreRef<'a>;
-
-    fn next(&mut self) -> Option<IgnoreRef<'a>> {
-        match self.0.take() {
-            None => None,
-            Some(ig) => {
-                self.0 = ig
-                    .inner
-                    .parent
-                    .as_deref()
-                    .map(|inner| IgnoreRef { inner });
-                Some(ig)
-            }
-        }
-    }
-}
-
-/// A builder for creating an Ignore matcher.
-#[derive(Clone, Debug)]
-pub(crate) struct IgnoreBuilder {
-    /// The root directory path for this ignore matcher.
-    dir: PathBuf,
-    /// An override matcher (default is empty).
-    overrides: Arc<Override>,
-    /// A type matcher (default is empty).
-    types: Arc<Types>,
-    /// Explicit global ignore matchers.
-    explicit_ignores: Vec<Gitignore>,
-    /// Ignore files in addition to .ignore.
-    custom_ignore_filenames: Vec<OsString>,
-    /// The directory that gitignores should be interpreted relative to.
-    ///
-    /// Usually this is the directory containing the gitignore file. But in
-    /// some cases, like for global gitignores or for gitignores specified
-    /// explicitly, this should generally be set to the current working
-    /// directory. This is only used for global gitignores or "explicit"
-    /// gitignores.
-    ///
-    /// When `None`, global gitignores are ignored.
-    global_gitignores_relative_to: Option<PathBuf>,
-    /// Ignore config.
-    opts: IgnoreOptions,
-}
-
-impl IgnoreBuilder {
-    /// Create a new builder for an `Ignore` matcher.
-    ///
-    /// It is likely a bug to use this without also calling `current_dir()`
-    /// outside of tests. This isn't made mandatory because this is an internal
-    /// abstraction and it's annoying to update tests.
-    pub(crate) fn new() -> IgnoreBuilder {
-        IgnoreBuilder {
-            dir: Path::new("").to_path_buf(),
-            overrides: Arc::new(Override::empty()),
-            types: Arc::new(Types::empty()),
-            explicit_ignores: vec![],
-            custom_ignore_filenames: vec![],
-            global_gitignores_relative_to: None,
-            opts: IgnoreOptions {
-                hidden: true,
-                ignore: true,
-                parents: true,
-                git_global: true,
-                git_ignore: true,
-                git_exclude: true,
-                ignore_case_insensitive: false,
-                require_git: true,
-            },
-        }
-    }
-
-    /// Builds a new `Ignore` matcher.
-    ///
-    /// The matcher returned won't match anything until ignore rules from
-    /// directories are added to it.
-    pub(crate) fn build(&self) -> Ignore {
-        self.build_with_cwd(None)
-    }
-
-    /// Builds a new `Ignore` matcher using the given CWD directory.
-    ///
-    /// The matcher returned won't match anything until ignore rules from
-    /// directories are added to it.
-    pub(crate) fn build_with_cwd(&self, cwd: Option<PathBuf>) -> Ignore {
-        let global_gitignores_relative_to =
-            cwd.or_else(|| self.global_gitignores_relative_to.clone());
-        let git_global_matcher = if !self.opts.git_global {
-            Gitignore::empty()
-        } else if let Some(ref cwd) = global_gitignores_relative_to {
-            let mut builder = GitignoreBuilder::new(cwd);
-            builder
-                .case_insensitive(self.opts.ignore_case_insensitive)
-                .unwrap();
-            let (gi, err) = builder.build_global();
-            if let Some(err) = err {
-                log::debug!("{}", err);
-            }
-            gi
-        } else {
-            log::debug!(
-                "ignoring global gitignore file because CWD is not known"
-            );
-            Gitignore::empty()
-        };
-
-        Ignore {
-            inner: Arc::new(IgnoreInner {
-                compiled: Arc::new(RwLock::new(HashMap::new())),
-                dir: self.dir.clone(),
-                overrides: self.overrides.clone(),
-                types: self.types.clone(),
-                parent: None,
-                is_absolute_parent: true,
-                global_gitignores_relative_to,
-                explicit_ignores: Arc::new(self.explicit_ignores.clone()),
-                custom_ignore_filenames: Arc::new(
-                    self.custom_ignore_filenames.clone(),
-                ),
-                custom_ignore_matcher: Gitignore::empty(),
-                ignore_matcher: Gitignore::empty(),
-                git_global_matcher: Arc::new(git_global_matcher),
-                git_ignore_matcher: Gitignore::empty(),
-                git_exclude_matcher: Gitignore::empty(),
-                has_git: false,
-                opts: self.opts,
-            }),
-            absolute_base: None,
-        }
-    }
-
-    /// Set the current directory used for matching global gitignores.
-    pub(crate) fn current_dir(
-        &mut self,
-        cwd: impl Into<PathBuf>,
-    ) -> &mut IgnoreBuilder {
-        self.global_gitignores_relative_to = Some(cwd.into());
-        self
-    }
-
-    /// Add an override matcher.
-    ///
-    /// By default, no override matcher is used.
-    ///
-    /// This overrides any previous setting.
-    pub(crate) fn overrides(
-        &mut self,
-        overrides: Override,
-    ) -> &mut IgnoreBuilder {
-        self.overrides = Arc::new(overrides);
-        self
-    }
-
-    /// Add a file type matcher.
-    ///
-    /// By default, no file type matcher is used.
-    ///
-    /// This overrides any previous setting.
-    pub(crate) fn types(&mut self, types: Types) -> &mut IgnoreBuilder {
-        self.types = Arc::new(types);
-        self
-    }
-
-    /// Adds a new global ignore matcher from the ignore file path given.
-    pub(crate) fn add_ignore(&mut self, ig: Gitignore) -> &mut IgnoreBuilder {
-        self.explicit_ignores.push(ig);
-        self
-    }
-
-    /// Add a custom ignore file name
-    ///
-    /// These ignore files have higher precedence than all other ignore files.
-    ///
-    /// When specifying multiple names, earlier names have lower precedence than
-    /// later names.
-    pub(crate) fn add_custom_ignore_filename<S: AsRef<OsStr>>(
-        &mut self,
-        file_name: S,
-    ) -> &mut IgnoreBuilder {
-        self.custom_ignore_filenames.push(file_name.as_ref().to_os_string());
-        self
-    }
-
-    /// Enables ignoring hidden files.
-    ///
-    /// This is enabled by default.
-    pub(crate) fn hidden(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.hidden = yes;
-        self
-    }
-
-    /// Whether ignoring hidden files is enabled or not.
-    pub(crate) fn is_hidden(&self) -> bool {
-        self.opts.hidden
-    }
-
-    /// Enables reading `.ignore` files.
-    ///
-    /// `.ignore` files have the same semantics as `gitignore` files and are
-    /// supported by search tools such as ripgrep and The Silver Searcher.
-    ///
-    /// This is enabled by default.
-    pub(crate) fn ignore(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.ignore = yes;
-        self
-    }
-
-    /// Enables reading ignore files from parent directories.
-    ///
-    /// If this is enabled, then .gitignore files in parent directories of each
-    /// file path given are respected. Otherwise, they are ignored.
-    ///
-    /// This is enabled by default.
-    pub(crate) fn parents(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.parents = yes;
-        self
-    }
-
-    /// Add a global gitignore matcher.
-    ///
-    /// Its precedence is lower than both normal `.gitignore` files and
-    /// `.git/info/exclude` files.
-    ///
-    /// This overwrites any previous global gitignore setting.
-    ///
-    /// This is enabled by default.
-    pub(crate) fn git_global(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.git_global = yes;
-        self
-    }
-
-    /// Enables reading `.gitignore` files.
-    ///
-    /// `.gitignore` files have match semantics as described in the `gitignore`
-    /// man page.
-    ///
-    /// This is enabled by default.
-    pub(crate) fn git_ignore(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.git_ignore = yes;
-        self
-    }
-
-    /// Enables reading `.git/info/exclude` files.
-    ///
-    /// `.git/info/exclude` files have match semantics as described in the
-    /// `gitignore` man page.
-    ///
-    /// This is enabled by default.
-    pub(crate) fn git_exclude(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.git_exclude = yes;
-        self
-    }
-
-    /// Whether a git repository is required to apply git-related ignore
-    /// rules (global rules, .gitignore and local exclude rules).
-    ///
-    /// When disabled, git-related ignore rules are applied even when searching
-    /// outside a git repository.
-    pub(crate) fn require_git(&mut self, yes: bool) -> &mut IgnoreBuilder {
-        self.opts.require_git = yes;
-        self
-    }
-
-    /// Process ignore files case insensitively
-    ///
-    /// This is disabled by default.
-    pub(crate) fn ignore_case_insensitive(
-        &mut self,
-        yes: bool,
-    ) -> &mut IgnoreBuilder {
-        self.opts.ignore_case_insensitive = yes;
-        self
-    }
-}
-
-/// Creates a new gitignore matcher for the directory given.
-///
-/// The matcher is meant to match files below `dir`.
-/// Ignore globs are extracted from each of the file names relative to
-/// `dir_for_ignorefile` in the order given (earlier names have lower
-/// precedence than later names).
-///
-/// I/O errors are ignored.
-pub(crate) fn create_gitignore<T: AsRef<OsStr>>(
-    dir: &Path,
-    dir_for_ignorefile: &Path,
-    names: &[T],
-    case_insensitive: bool,
-) -> (Gitignore, Option<Error>) {
-    let mut builder = GitignoreBuilder::new(dir);
-    let mut errs = PartialErrorBuilder::default();
-    builder.case_insensitive(case_insensitive).unwrap();
-    for name in names {
-        let gipath = dir_for_ignorefile.join(name.as_ref());
-        // This check is not necessary, but is added for performance. Namely,
-        // a simple stat call checking for existence can often be just a bit
-        // quicker than actually trying to open a file. Since the number of
-        // directories without ignore files likely greatly exceeds the number
-        // with ignore files, this check generally makes sense.
-        //
-        // However, until demonstrated otherwise, we speculatively do not do
-        // this on Windows since Windows is notorious for having slow file
-        // system operations. Namely, it's not clear whether this analysis
-        // makes sense on Windows.
-        //
-        // For more details: https://github.com/BurntSushi/ripgrep/pull/1381
-        if cfg!(windows) || gipath.exists() {
-            errs.maybe_push_ignore_io(builder.add(gipath));
-        }
-    }
-    let gi = match builder.build() {
-        Ok(gi) => gi,
-        Err(err) => {
-            errs.push(err);
-            GitignoreBuilder::new(dir).build().unwrap()
-        }
-    };
-    (gi, errs.into_error_option())
-}
-
-/// Find the GIT_COMMON_DIR for the given git worktree.
-///
-/// This is the directory that may contain a private ignore file
-/// "info/exclude". Unlike git, this function does *not* read environment
-/// variables GIT_DIR and GIT_COMMON_DIR, because it is not clear how to use
-/// them when multiple repositories are searched.
-///
-/// Some I/O errors are ignored.
-fn resolve_git_commondir(
-    dir: &Path,
-    git_type: Option<FileType>,
-) -> Result<PathBuf, Option<Error>> {
-    let git_dir_path = || dir.join(".git");
-    let git_dir = git_dir_path();
-    if !git_type.map_or(false, |ft| ft.is_file()) {
-        return Ok(git_dir);
-    }
-    let file = match File::open(git_dir) {
-        Ok(file) => io::BufReader::new(file),
-        Err(err) => {
-            return Err(Some(Error::Io(err).with_path(git_dir_path())));
-        }
-    };
-    let dot_git_line = match file.lines().next() {
-        Some(Ok(line)) => line,
-        Some(Err(err)) => {
-            return Err(Some(Error::Io(err).with_path(git_dir_path())));
-        }
-        None => return Err(None),
-    };
-    if !dot_git_line.starts_with("gitdir: ") {
-        return Err(None);
-    }
-    let real_git_dir = PathBuf::from(&dot_git_line["gitdir: ".len()..]);
-    let git_commondir_file = || real_git_dir.join("commondir");
-    let file = match File::open(git_commondir_file()) {
-        Ok(file) => io::BufReader::new(file),
-        Err(_) => return Err(None),
-    };
-    let commondir_line = match file.lines().next() {
-        Some(Ok(line)) => line,
-        Some(Err(err)) => {
-            return Err(Some(Error::Io(err).with_path(git_commondir_file())));
-        }
-        None => return Err(None),
-    };
-    let commondir_abs = if commondir_line.starts_with(".") {
-        real_git_dir.join(commondir_line) // relative commondir
-    } else {
-        PathBuf::from(commondir_line)
-    };
-    Ok(commondir_abs)
-}
-
-/// Strips `prefix` from `path` if it's a prefix, otherwise returns `path`
-/// unchanged.
-fn strip_if_is_prefix<'a, P: AsRef<Path> + ?Sized>(
-    prefix: &'a P,
-    path: &'a Path,
-) -> &'a Path {
-    strip_prefix(prefix, path).map_or(path, |p| p)
-}
-
-#[cfg(test)]
-mod tests {
-    use std::{io::Write, path::Path, sync::Arc};
-
-    use crate::{
-        Error, dir::IgnoreBuilder, gitignore::Gitignore, tests::TempDir,
-    };
-
-    fn wfile<P: AsRef<Path>>(path: P, contents: &str) {
-        let mut file = std::fs::File::create(path).unwrap();
-        file.write_all(contents.as_bytes()).unwrap();
-    }
-
-    fn mkdirp<P: AsRef<Path>>(path: P) {
-        std::fs::create_dir_all(path).unwrap();
-    }
-
-    fn partial(err: Error) -> Vec<Error> {
-        match err {
-            Error::Partial(errs) => errs,
-            _ => panic!("expected partial error but got {:?}", err),
-        }
-    }
-
-    fn tmpdir() -> TempDir {
-        TempDir::new().unwrap()
-    }
-
-    #[test]
-    fn explicit_ignore() {
-        let td = tmpdir();
-        wfile(td.path().join("not-an-ignore"), "foo\n!bar");
-
-        let (gi, err) = Gitignore::new(td.path().join("not-an-ignore"));
-        assert!(err.is_none());
-        let (ig, err) =
-            IgnoreBuilder::new().add_ignore(gi).build().add_child(td.path());
-        assert!(err.is_none());
-        // CHANGED: Explicit ignores only apply to paths inside the directory
-        // of the ignore file, so we have to match against full paths.
-        assert!(ig.matched(td.path().join("foo"), false).is_ignore());
-        assert!(ig.matched(td.path().join("bar"), false).is_whitelist());
-        assert!(ig.matched(td.path().join("baz"), false).is_none());
-        assert!(ig.matched("/foo", false).is_none());
-    }
-
-    #[test]
-    fn git_exclude() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git/info"));
-        wfile(td.path().join(".git/info/exclude"), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_ignore());
-        assert!(ig.matched("bar", false).is_whitelist());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    #[test]
-    fn gitignore() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        wfile(td.path().join(".gitignore"), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_ignore());
-        assert!(ig.matched("bar", false).is_whitelist());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    #[test]
-    fn gitignore_with_jj() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".jj"));
-        wfile(td.path().join(".gitignore"), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_ignore());
-        assert!(ig.matched("bar", false).is_whitelist());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    #[test]
-    fn gitignore_no_git() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_none());
-        assert!(ig.matched("bar", false).is_none());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    #[test]
-    fn gitignore_allowed_no_git() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new()
-            .require_git(false)
-            .build()
-            .add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_ignore());
-        assert!(ig.matched("bar", false).is_whitelist());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    #[test]
-    fn ignore() {
-        let td = tmpdir();
-        wfile(td.path().join(".ignore"), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_ignore());
-        assert!(ig.matched("bar", false).is_whitelist());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    #[test]
-    fn custom_ignore() {
-        let td = tmpdir();
-        let custom_ignore = ".customignore";
-        wfile(td.path().join(custom_ignore), "foo\n!bar");
-
-        let (ig, err) = IgnoreBuilder::new()
-            .add_custom_ignore_filename(custom_ignore)
-            .build()
-            .add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_ignore());
-        assert!(ig.matched("bar", false).is_whitelist());
-        assert!(ig.matched("baz", false).is_none());
-    }
-
-    // Tests that a custom ignore file will override an .ignore.
-    #[test]
-    fn custom_ignore_over_ignore() {
-        let td = tmpdir();
-        let custom_ignore = ".customignore";
-        wfile(td.path().join(".ignore"), "foo");
-        wfile(td.path().join(custom_ignore), "!foo");
-
-        let (ig, err) = IgnoreBuilder::new()
-            .add_custom_ignore_filename(custom_ignore)
-            .build()
-            .add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_whitelist());
-    }
-
-    // Tests that earlier custom ignore files have lower precedence than later.
-    #[test]
-    fn custom_ignore_precedence() {
-        let td = tmpdir();
-        let custom_ignore1 = ".customignore1";
-        let custom_ignore2 = ".customignore2";
-        wfile(td.path().join(custom_ignore1), "foo");
-        wfile(td.path().join(custom_ignore2), "!foo");
-
-        let (ig, err) = IgnoreBuilder::new()
-            .add_custom_ignore_filename(custom_ignore1)
-            .add_custom_ignore_filename(custom_ignore2)
-            .build()
-            .add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_whitelist());
-    }
-
-    // Tests that an .ignore will override a .gitignore.
-    #[test]
-    fn ignore_over_gitignore() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "foo");
-        wfile(td.path().join(".ignore"), "!foo");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("foo", false).is_whitelist());
-    }
-
-    // Tests that exclude has lower precedent than both .ignore and .gitignore.
-    #[test]
-    fn exclude_lowest() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "!foo");
-        wfile(td.path().join(".ignore"), "!bar");
-        mkdirp(td.path().join(".git/info"));
-        wfile(td.path().join(".git/info/exclude"), "foo\nbar\nbaz");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-        assert!(ig.matched("baz", false).is_ignore());
-        assert!(ig.matched("foo", false).is_whitelist());
-        assert!(ig.matched("bar", false).is_whitelist());
-    }
-
-    #[test]
-    fn errored() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "{foo");
-
-        let (_, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_some());
-    }
-
-    #[test]
-    fn errored_both() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "{foo");
-        wfile(td.path().join(".ignore"), "{bar");
-
-        let (_, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert_eq!(2, partial(err.expect("an error")).len());
-    }
-
-    #[test]
-    fn errored_partial() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        wfile(td.path().join(".gitignore"), "{foo\nbar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_some());
-        assert!(ig.matched("bar", false).is_ignore());
-    }
-
-    #[test]
-    fn errored_partial_and_ignore() {
-        let td = tmpdir();
-        wfile(td.path().join(".gitignore"), "{foo\nbar");
-        wfile(td.path().join(".ignore"), "!bar");
-
-        let (ig, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_some());
-        assert!(ig.matched("bar", false).is_whitelist());
-    }
-
-    #[test]
-    fn not_present_empty() {
-        let td = tmpdir();
-
-        let (_, err) = IgnoreBuilder::new().build().add_child(td.path());
-        assert!(err.is_none());
-    }
-
-    #[test]
-    fn stops_at_git_dir() {
-        // This tests that .gitignore files beyond a .git barrier aren't
-        // matched, but .ignore files are.
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("foo/.git"));
-        wfile(td.path().join(".gitignore"), "foo");
-        wfile(td.path().join(".ignore"), "bar");
-
-        let ig0 = IgnoreBuilder::new().build();
-        let (ig1, err) = ig0.add_child(td.path());
-        assert!(err.is_none());
-        let (ig2, err) = ig1.add_child(ig1.path().join("foo"));
-        assert!(err.is_none());
-
-        assert!(ig1.matched("foo", false).is_ignore());
-        assert!(ig2.matched("foo", false).is_none());
-
-        assert!(ig1.matched("bar", false).is_ignore());
-        assert!(ig2.matched("bar", false).is_ignore());
-    }
-
-    #[test]
-    fn absolute_parent() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("foo"));
-        wfile(td.path().join(".gitignore"), "bar");
-
-        // First, check that the parent gitignore file isn't detected if the
-        // parent isn't added. This establishes a baseline.
-        let ig0 = IgnoreBuilder::new().build();
-        let (ig1, err) = ig0.add_child(td.path().join("foo"));
-        assert!(err.is_none());
-        assert!(ig1.matched("bar", false).is_none());
-
-        // Second, check that adding a parent directory actually works.
-        let ig0 = IgnoreBuilder::new().build();
-        let (ig1, err) = ig0.add_parents(td.path().join("foo"));
-        assert!(err.is_none());
-        let (ig2, err) = ig1.add_child(td.path().join("foo"));
-        assert!(err.is_none());
-        assert!(ig2.matched("bar", false).is_ignore());
-    }
-
-    #[test]
-    fn absolute_parent_anchored() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("src/llvm"));
-        wfile(td.path().join(".gitignore"), "/llvm/\nfoo");
-
-        let ig0 = IgnoreBuilder::new().build();
-        let (ig1, err) = ig0.add_parents(td.path().join("src"));
-        assert!(err.is_none());
-        let (ig2, err) = ig1.add_child("src");
-        assert!(err.is_none());
-
-        assert!(ig1.matched("llvm", true).is_none());
-        assert!(ig2.matched("llvm", true).is_none());
-        assert!(ig2.matched("src/llvm", true).is_none());
-        assert!(ig2.matched("foo", false).is_ignore());
-        assert!(ig2.matched("src/foo", false).is_ignore());
-    }
-
-    #[test]
-    fn absolute_parent_matchers_are_cached_across_roots() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("src/build"));
-        mkdirp(td.path().join("tests/build"));
-        wfile(td.path().join(".gitignore"), "tests/**/build/\n");
-
-        let ig0 = IgnoreBuilder::new().build();
-        let (src_parents, err) = ig0.add_parents(td.path().join("src"));
-        assert!(err.is_none());
-        let (src, err) = src_parents.add_child(td.path().join("src"));
-        assert!(err.is_none());
-        let (tests_parents, err) = ig0.add_parents(td.path().join("tests"));
-        assert!(err.is_none());
-        let (tests, err) = tests_parents.add_child(td.path().join("tests"));
-        assert!(err.is_none());
-
-        assert!(Arc::ptr_eq(&src_parents.inner, &tests_parents.inner));
-        assert!(src.matched("build", true).is_none());
-        assert!(tests.matched("build", true).is_ignore());
-    }
-
-    /// Parent matchers are shared across search roots, but path rewriting for
-    /// absolute parents must use each root's own base path. Otherwise a rule
-    /// like `src/invalid` is matched against the wrong absolute path when
-    /// `src` is searched before a sibling root (e.g. `tests`).
-    ///
-    /// Paths passed to `matched` use the same relative layout as `Walk` when
-    /// roots are given as relative directory names.
-    ///
-    /// Regression for: https://github.com/BurntSushi/ripgrep/issues/3376
-    /// and https://github.com/BurntSushi/ripgrep/issues/3419
-    #[test]
-    fn multi_root_gitignore_order_independent() {
-        let td = tmpdir();
-        let cwd = std::env::current_dir().unwrap();
-        // Use paths relative to CWD like the CLI walk does for `rg pat src tests`.
-        let root = td.path().strip_prefix(&cwd).unwrap_or(td.path());
-        let src_root = root.join("src");
-        let tests_root = root.join("tests");
-
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("src"));
-        mkdirp(td.path().join("tests"));
-        wfile(td.path().join(".gitignore"), "src/invalid\n");
-        wfile(td.path().join("src/invalid"), "x");
-        wfile(td.path().join("src/valid"), "x");
-        wfile(td.path().join("tests/valid"), "x");
-
-        let ig0 = IgnoreBuilder::new().build();
-
-        // Historically buggy order: search `src` first, then `tests`.
-        let (src_parents, err) = ig0.add_parents(&src_root);
-        assert!(err.is_none());
-        let (src, err) = src_parents.add_child(&src_root);
-        assert!(err.is_none());
-        let (tests_parents, err) = ig0.add_parents(&tests_root);
-        assert!(err.is_none());
-        let (tests, err) = tests_parents.add_child(&tests_root);
-        assert!(err.is_none());
-
-        assert!(Arc::ptr_eq(&src_parents.inner, &tests_parents.inner));
-        // Each root must carry its own absolute_base even though inners are shared.
-        assert_ne!(
-            src.absolute_base.as_ref().unwrap().as_path(),
-            tests.absolute_base.as_ref().unwrap().as_path()
-        );
-        assert!(
-            src.matched(src_root.join("invalid"), false).is_ignore(),
-            "parent .gitignore must apply for the src root even when \
-             another root was prepared in the same process"
-        );
-        assert!(src.matched(src_root.join("valid"), false).is_none());
-        assert!(tests.matched(tests_root.join("valid"), false).is_none());
-
-        // Reverse order should behave the same way.
-        let ig0 = IgnoreBuilder::new().build();
-        let (tests_parents, err) = ig0.add_parents(&tests_root);
-        assert!(err.is_none());
-        let (tests, err) = tests_parents.add_child(&tests_root);
-        assert!(err.is_none());
-        let (src_parents, err) = ig0.add_parents(&src_root);
-        assert!(err.is_none());
-        let (src, err) = src_parents.add_child(&src_root);
-        assert!(err.is_none());
-
-        assert!(src.matched(src_root.join("invalid"), false).is_ignore());
-        assert!(src.matched(src_root.join("valid"), false).is_none());
-        assert!(tests.matched(tests_root.join("valid"), false).is_none());
-    }
-
-    /// Same multi-root / order issue for non-git ignore files (e.g. `.rgignore`
-    /// via custom ignore names).
-    ///
-    /// Regression for: https://github.com/BurntSushi/ripgrep/issues/3320
-    #[test]
-    fn multi_root_custom_ignore_order_independent() {
-        let td = tmpdir();
-        let cwd = std::env::current_dir().unwrap();
-        let root = td.path().strip_prefix(&cwd).unwrap_or(td.path());
-        let alpha_root = root.join("alpha");
-        let beta_root = root.join("beta");
-
-        mkdirp(td.path().join("alpha"));
-        mkdirp(td.path().join("beta"));
-        wfile(td.path().join(".rgignore"), "beta/**/*.svg\n");
-        wfile(td.path().join("alpha/a.txt"), "x");
-        wfile(td.path().join("beta/x.svg"), "x");
-
-        let ig0 = IgnoreBuilder::new()
-            .add_custom_ignore_filename(".rgignore")
-            .ignore(false)
-            .git_ignore(false)
-            .git_global(false)
-            .git_exclude(false)
-            .build();
-
-        let (alpha_parents, err) = ig0.add_parents(&alpha_root);
-        assert!(err.is_none());
-        let (alpha, err) = alpha_parents.add_child(&alpha_root);
-        assert!(err.is_none());
-        let (beta_parents, err) = ig0.add_parents(&beta_root);
-        assert!(err.is_none());
-        let (beta, err) = beta_parents.add_child(&beta_root);
-        assert!(err.is_none());
-
-        assert_ne!(
-            alpha.absolute_base.as_ref().unwrap().as_path(),
-            beta.absolute_base.as_ref().unwrap().as_path()
-        );
-        assert!(alpha.matched(alpha_root.join("a.txt"), false).is_none());
-        assert!(
-            beta.matched(beta_root.join("x.svg"), false).is_ignore(),
-            "parent .rgignore must apply for the beta root regardless of \
-             which root was set up first"
-        );
-    }
-
-    #[test]
-    fn git_info_exclude_in_linked_worktree() {
-        let td = tmpdir();
-        let git_dir = td.path().join(".git");
-        mkdirp(git_dir.join("info"));
-        wfile(git_dir.join("info/exclude"), "ignore_me");
-        mkdirp(git_dir.join("worktrees/linked-worktree"));
-        let commondir_path =
-            || git_dir.join("worktrees/linked-worktree/commondir");
-        mkdirp(td.path().join("linked-worktree"));
-        let worktree_git_dir_abs = format!(
-            "gitdir: {}",
-            git_dir.join("worktrees/linked-worktree").to_str().unwrap(),
-        );
-        wfile(td.path().join("linked-worktree/.git"), &worktree_git_dir_abs);
-
-        // relative commondir
-        wfile(commondir_path(), "../..");
-        let ib = IgnoreBuilder::new().build();
-        let (ignore, err) = ib.add_child(td.path().join("linked-worktree"));
-        assert!(err.is_none());
-        assert!(ignore.matched("ignore_me", false).is_ignore());
-
-        // absolute commondir
-        wfile(commondir_path(), git_dir.to_str().unwrap());
-        let (ignore, err) = ib.add_child(td.path().join("linked-worktree"));
-        assert!(err.is_none());
-        assert!(ignore.matched("ignore_me", false).is_ignore());
-
-        // missing commondir file
-        assert!(std::fs::remove_file(commondir_path()).is_ok());
-        let (_, err) = ib.add_child(td.path().join("linked-worktree"));
-        // We squash the error in this case, because it occurs in repositories
-        // that are not linked worktrees but have submodules.
-        assert!(err.is_none());
-
-        wfile(td.path().join("linked-worktree/.git"), "garbage");
-        let (_, err) = ib.add_child(td.path().join("linked-worktree"));
-        assert!(err.is_none());
-
-        wfile(td.path().join("linked-worktree/.git"), "gitdir: garbage");
-        let (_, err) = ib.add_child(td.path().join("linked-worktree"));
-        assert!(err.is_none());
-    }
-}
diff --git a/crates/ignore/src/gitignore.rs b/crates/ignore/src/gitignore.rs
deleted file mode 100644
index 8824139b5..000000000
--- a/crates/ignore/src/gitignore.rs
+++ /dev/null
@@ -1,913 +0,0 @@
-/*!
-The gitignore module provides a way to match globs from a gitignore file
-against file paths.
-
-Note that this module implements the specification as described in the
-`gitignore` man page from scratch. That is, this module does *not* shell out to
-the `git` command line tool.
-*/
-
-use std::{
-    fs::File,
-    io::{BufRead, BufReader, Read},
-    path::{Path, PathBuf},
-    sync::Arc,
-};
-
-use {
-    globset::{Candidate, GlobBuilder, GlobSet, GlobSetBuilder},
-    regex_automata::util::pool::Pool,
-};
-
-use crate::{
-    Error, Match, PartialErrorBuilder,
-    pathutil::{is_file_name, strip_prefix},
-};
-
-/// Glob represents a single glob in a gitignore file.
-///
-/// This is used to report information about the highest precedent glob that
-/// matched in one or more gitignore files.
-#[derive(Clone, Debug)]
-pub struct Glob {
-    /// The file path that this glob was extracted from.
-    from: Option<PathBuf>,
-    /// The original glob string.
-    original: String,
-    /// The actual glob string used to convert to a regex.
-    actual: String,
-    /// Whether this is a whitelisted glob or not.
-    is_whitelist: bool,
-    /// Whether this glob should only match directories or not.
-    is_only_dir: bool,
-}
-
-impl Glob {
-    /// Returns the file path that defined this glob.
-    pub fn from(&self) -> Option<&Path> {
-        self.from.as_ref().map(|p| &**p)
-    }
-
-    /// The original glob as it was defined in a gitignore file.
-    pub fn original(&self) -> &str {
-        &self.original
-    }
-
-    /// The actual glob that was compiled to respect gitignore
-    /// semantics.
-    pub fn actual(&self) -> &str {
-        &self.actual
-    }
-
-    /// Whether this was a whitelisted glob or not.
-    pub fn is_whitelist(&self) -> bool {
-        self.is_whitelist
-    }
-
-    /// Whether this glob must match a directory or not.
-    pub fn is_only_dir(&self) -> bool {
-        self.is_only_dir
-    }
-
-    /// Returns true if and only if this glob has a `**/` prefix.
-    fn has_doublestar_prefix(&self) -> bool {
-        self.actual.starts_with("**/") || self.actual == "**"
-    }
-}
-
-/// Gitignore is a matcher for the globs in one or more gitignore files
-/// in the same directory.
-#[derive(Clone, Debug)]
-pub struct Gitignore {
-    set: GlobSet,
-    root: PathBuf,
-    globs: Vec<Glob>,
-    num_ignores: u64,
-    num_whitelists: u64,
-    matches: Option<Arc<Pool<Vec<usize>>>>,
-    // CHANGED: Add a flag to have Gitignore rules that apply only to files.
-    only_on_files: bool,
-}
-
-impl Gitignore {
-    /// Creates a new gitignore matcher from the gitignore file path given.
-    ///
-    /// If it's desirable to include multiple gitignore files in a single
-    /// matcher, or read gitignore globs from a different source, then
-    /// use `GitignoreBuilder`.
-    ///
-    /// This always returns a valid matcher, even if it's empty. In particular,
-    /// a Gitignore file can be partially valid, e.g., when one glob is invalid
-    /// but the rest aren't.
-    ///
-    /// Note that I/O errors are ignored. For more granular control over
-    /// errors, use `GitignoreBuilder`.
-    pub fn new<P: AsRef<Path>>(
-        gitignore_path: P,
-    ) -> (Gitignore, Option<Error>) {
-        let path = gitignore_path.as_ref();
-        let parent = path.parent().unwrap_or(Path::new("/"));
-        let mut builder = GitignoreBuilder::new(parent);
-        let mut errs = PartialErrorBuilder::default();
-        errs.maybe_push_ignore_io(builder.add(path));
-        match builder.build() {
-            Ok(gi) => (gi, errs.into_error_option()),
-            Err(err) => {
-                errs.push(err);
-                (Gitignore::empty(), errs.into_error_option())
-            }
-        }
-    }
-
-    /// Creates a new gitignore matcher from the global ignore file, if one
-    /// exists.
-    ///
-    /// The global config file path is specified by git's `core.excludesFile`
-    /// config option.
-    ///
-    /// # Behavior
-    ///
-    /// This routine does its best to discover any global git exclude files.
-    /// This will try to parse out the `excludesFile` config option in your
-    /// global git configuration, if necessary.
-    ///
-    /// The specific things this routine tries (which are subject to change
-    /// based on how git behaves) are:
-    ///
-    ///
-    ///
-    /// Git's config file location is `$HOME/.gitconfig`. If `$HOME/.gitconfig`
-    /// does not exist or does not specify `core.excludesFile`, then
-    /// `$XDG_CONFIG_HOME/git/ignore` is read. If `$XDG_CONFIG_HOME` is not
-    /// set or is empty, then `$HOME/.config/git/ignore` is used instead.
-    pub fn global() -> (Gitignore, Option<Error>) {
-        match std::env::current_dir() {
-            Ok(cwd) => GitignoreBuilder::new(cwd).build_global(),
-            Err(err) => (Gitignore::empty(), Some(err.into())),
-        }
-    }
-
-    /// Creates a new empty gitignore matcher that never matches anything.
-    ///
-    /// Its path is empty.
-    pub fn empty() -> Gitignore {
-        Gitignore {
-            set: GlobSet::empty(),
-            root: PathBuf::from(""),
-            globs: vec![],
-            num_ignores: 0,
-            num_whitelists: 0,
-            matches: None,
-            // CHANGED: Add a flag to have Gitignore rules that apply only to
-            // files.
-            only_on_files: false,
-        }
-    }
-
-    /// Returns the directory containing this gitignore matcher.
-    ///
-    /// All matches are done relative to this path.
-    pub fn path(&self) -> &Path {
-        &*self.root
-    }
-
-    /// Returns true if and only if this gitignore has zero globs, and
-    /// therefore never matches any file path.
-    pub fn is_empty(&self) -> bool {
-        self.set.is_empty()
-    }
-
-    /// Returns the total number of globs, which should be equivalent to
-    /// `num_ignores + num_whitelists`.
-    pub fn len(&self) -> usize {
-        self.set.len()
-    }
-
-    /// Returns the total number of ignore globs.
-    pub fn num_ignores(&self) -> u64 {
-        self.num_ignores
-    }
-
-    /// Returns the total number of whitelisted globs.
-    pub fn num_whitelists(&self) -> u64 {
-        self.num_whitelists
-    }
-
-    /// Returns whether the given path (file or directory) matched a pattern in
-    /// this gitignore matcher.
-    ///
-    /// `is_dir` should be true if the path refers to a directory and false
-    /// otherwise.
-    ///
-    /// The given path is matched relative to the path given when building
-    /// the matcher. Specifically, before matching `path`, its prefix (as
-    /// determined by a common suffix of the directory containing this
-    /// gitignore) is stripped. If there is no common suffix/prefix overlap,
-    /// then `path` is assumed to be relative to this matcher.
-    pub fn matched<P: AsRef<Path>>(
-        &self,
-        path: P,
-        is_dir: bool,
-    ) -> Match<&Glob> {
-        if self.is_empty() {
-            return Match::None;
-        }
-        self.matched_stripped(self.strip(path.as_ref()), is_dir)
-    }
-
-    /// Returns whether the given path (file or directory, and expected to be
-    /// under the root) or any of its parent directories (up to the root)
-    /// matched a pattern in this gitignore matcher.
-    ///
-    /// NOTE: This method is more expensive than walking the directory hierarchy
-    /// top-to-bottom and matching the entries. But, is easier to use in cases
-    /// when a list of paths are available without a hierarchy.
-    ///
-    /// `is_dir` should be true if the path refers to a directory and false
-    /// otherwise.
-    ///
-    /// The given path is matched relative to the path given when building
-    /// the matcher. Specifically, before matching `path`, its prefix (as
-    /// determined by a common suffix of the directory containing this
-    /// gitignore) is stripped. If there is no common suffix/prefix overlap,
-    /// then `path` is assumed to be relative to this matcher.
-    ///
-    /// # Panics
-    ///
-    /// This method panics if the given file path is not under the root path
-    /// of this matcher.
-    pub fn matched_path_or_any_parents<P: AsRef<Path>>(
-        &self,
-        path: P,
-        is_dir: bool,
-    ) -> Match<&Glob> {
-        if self.is_empty() {
-            return Match::None;
-        }
-        let mut path = self.strip(path.as_ref());
-        assert!(!path.has_root(), "path is expected to be under the root");
-
-        match self.matched_stripped(path, is_dir) {
-            Match::None => (), // walk up
-            a_match => return a_match,
-        }
-        while let Some(parent) = path.parent() {
-            match self.matched_stripped(parent, /* is_dir */ true) {
-                Match::None => path = parent, // walk up
-                a_match => return a_match,
-            }
-        }
-        Match::None
-    }
-
-    /// Like matched, but takes a path that has already been stripped.
-    fn matched_stripped<P: AsRef<Path>>(
-        &self,
-        path: P,
-        is_dir: bool,
-    ) -> Match<&Glob> {
-        if self.is_empty() {
-            return Match::None;
-        }
-        // CHANGED: Rules marked as only_on_files can not match against
-        // directories.
-        if self.only_on_files && is_dir {
-            return Match::None;
-        }
-        let path = path.as_ref();
-        let mut matches = self.matches.as_ref().unwrap().get();
-        let candidate = Candidate::new(path);
-        self.set.matches_candidate_into(&candidate, &mut *matches);
-        for &i in matches.iter().rev() {
-            let glob = &self.globs[i];
-            if !glob.is_only_dir() || is_dir {
-                return if glob.is_whitelist() {
-                    Match::Whitelist(glob)
-                } else {
-                    Match::Ignore(glob)
-                };
-            }
-        }
-        Match::None
-    }
-
-    /// Strips the given path such that it's suitable for matching with this
-    /// gitignore matcher.
-    fn strip<'a, P: 'a + AsRef<Path> + ?Sized>(
-        &'a self,
-        path: &'a P,
-    ) -> &'a Path {
-        let mut path = path.as_ref();
-        // A leading ./ is completely superfluous. We also strip it from
-        // our gitignore root path, so we need to strip it from our candidate
-        // path too.
-        if let Some(p) = strip_prefix("./", path) {
-            path = p;
-        }
-        // Strip any common prefix between the candidate path and the root
-        // of the gitignore, to make sure we get relative matching right.
-        // BUT, a file name might not have any directory components to it,
-        // in which case, we don't want to accidentally strip any part of the
-        // file name.
-        //
-        // As an additional special case, if the root is just `.`, then we
-        // shouldn't try to strip anything, e.g., when path begins with a `.`.
-        if self.root != Path::new(".") && !is_file_name(path) {
-            if let Some(p) = strip_prefix(&self.root, path) {
-                path = p;
-                // If we're left with a leading slash, get rid of it.
-                if let Some(p) = strip_prefix("/", path) {
-                    path = p;
-                }
-            }
-        }
-        path
-    }
-}
-
-/// Builds a matcher for a single set of globs from a .gitignore file.
-#[derive(Clone, Debug)]
-pub struct GitignoreBuilder {
-    builder: GlobSetBuilder,
-    root: PathBuf,
-    globs: Vec<Glob>,
-    case_insensitive: bool,
-    allow_unclosed_class: bool,
-    // CHANGED: Add a flag to have Gitignore rules that apply only to files.
-    only_on_files: bool,
-}
-
-impl GitignoreBuilder {
-    /// Create a new builder for a gitignore file.
-    ///
-    /// The path given should be the path at which the globs for this gitignore
-    /// file should be matched. Note that paths are always matched relative
-    /// to the root path given here. Generally, the root path should correspond
-    /// to the *directory* containing a `.gitignore` file.
-    pub fn new<P: AsRef<Path>>(root: P) -> GitignoreBuilder {
-        let root = root.as_ref();
-        GitignoreBuilder {
-            builder: GlobSetBuilder::new(),
-            root: strip_prefix("./", root).unwrap_or(root).to_path_buf(),
-            globs: vec![],
-            case_insensitive: false,
-            allow_unclosed_class: true,
-            // CHANGED: Add a flag to have Gitignore rules that apply only to
-            // files.
-            only_on_files: false,
-        }
-    }
-
-    /// Builds a new matcher from the globs added so far.
-    ///
-    /// Once a matcher is built, no new globs can be added to it.
-    pub fn build(&self) -> Result<Gitignore, Error> {
-        let nignore = self.globs.iter().filter(|g| !g.is_whitelist()).count();
-        let nwhite = self.globs.iter().filter(|g| g.is_whitelist()).count();
-        let set = self
-            .builder
-            .build()
-            .map_err(|err| Error::Glob { glob: None, err: err.to_string() })?;
-        Ok(Gitignore {
-            set,
-            root: self.root.clone(),
-            globs: self.globs.clone(),
-            num_ignores: nignore as u64,
-            num_whitelists: nwhite as u64,
-            matches: Some(Arc::new(
-                Pool::with_available_parallelism_capacity(|| vec![]),
-            )),
-            // CHANGED: Add a flag to have Gitignore rules that apply only to
-            // files.
-            only_on_files: self.only_on_files,
-        })
-    }
-
-    /// Build a global gitignore matcher using the configuration in this
-    /// builder.
-    ///
-    /// This consumes ownership of the builder unlike `build` because it
-    /// must mutate the builder to add the global gitignore globs.
-    ///
-    /// Note that this ignores the path given to this builder's constructor
-    /// and instead derives the path automatically from git's global
-    /// configuration.
-    pub fn build_global(mut self) -> (Gitignore, Option<Error>) {
-        match gitconfig_excludes_path() {
-            None => (Gitignore::empty(), None),
-            Some(path) => {
-                if !path.is_file() {
-                    (Gitignore::empty(), None)
-                } else {
-                    let mut errs = PartialErrorBuilder::default();
-                    errs.maybe_push_ignore_io(self.add(path));
-                    match self.build() {
-                        Ok(gi) => (gi, errs.into_error_option()),
-                        Err(err) => {
-                            errs.push(err);
-                            (Gitignore::empty(), errs.into_error_option())
-                        }
-                    }
-                }
-            }
-        }
-    }
-
-    /// Add each glob from the file path given.
-    ///
-    /// The file given should be formatted as a `gitignore` file.
-    ///
-    /// Note that partial errors can be returned. For example, if there was
-    /// a problem adding one glob, an error for that will be returned, but
-    /// all other valid globs will still be added.
-    pub fn add<P: AsRef<Path>>(&mut self, path: P) -> Option<Error> {
-        let path = path.as_ref();
-        let file = match File::open(path) {
-            Err(err) => return Some(Error::Io(err).with_path(path)),
-            Ok(file) => file,
-        };
-        log::debug!("opened gitignore file: {}", path.display());
-        let rdr = BufReader::new(file);
-        let mut errs = PartialErrorBuilder::default();
-        for (i, line) in rdr.lines().enumerate() {
-            let lineno = (i + 1) as u64;
-            let line = match line {
-                Ok(line) => line,
-                Err(err) => {
-                    errs.push(Error::Io(err).tagged(path, lineno));
-                    break;
-                }
-            };
-
-            // Match Git's handling of .gitignore files that begin with the Unicode BOM
-            const UTF8_BOM: &str = "\u{feff}";
-            let line =
-                if i == 0 { line.trim_start_matches(UTF8_BOM) } else { &line };
-
-            if let Err(err) = self.add_line(Some(path.to_path_buf()), &line) {
-                errs.push(err.tagged(path, lineno));
-            }
-        }
-        errs.into_error_option()
-    }
-
-    /// Add each glob line from the string given.
-    ///
-    /// If this string came from a particular `gitignore` file, then its path
-    /// should be provided here.
-    ///
-    /// The string given should be formatted as a `gitignore` file.
-    #[cfg(test)]
-    fn add_str(
-        &mut self,
-        from: Option<PathBuf>,
-        gitignore: &str,
-    ) -> Result<&mut GitignoreBuilder, Error> {
-        for line in gitignore.lines() {
-            self.add_line(from.clone(), line)?;
-        }
-        Ok(self)
-    }
-
-    /// Add a line from a gitignore file to this builder.
-    ///
-    /// If this line came from a particular `gitignore` file, then its path
-    /// should be provided here.
-    ///
-    /// If the line could not be parsed as a glob, then an error is returned.
-    pub fn add_line(
-        &mut self,
-        from: Option<PathBuf>,
-        mut line: &str,
-    ) -> Result<&mut GitignoreBuilder, Error> {
-        #![allow(deprecated)]
-
-        if line.starts_with("#") {
-            return Ok(self);
-        }
-        if !line.ends_with("\\ ") {
-            line = line.trim_right();
-        }
-        if line.is_empty() {
-            return Ok(self);
-        }
-        let mut glob = Glob {
-            from,
-            original: line.to_string(),
-            actual: String::new(),
-            is_whitelist: false,
-            is_only_dir: false,
-        };
-        let mut is_absolute = false;
-        if line.starts_with("\\!") || line.starts_with("\\#") {
-            line = &line[1..];
-            is_absolute = line.chars().nth(0) == Some('/');
-        } else {
-            if line.starts_with("!") {
-                glob.is_whitelist = true;
-                line = &line[1..];
-            }
-            if line.starts_with("/") {
-                // `man gitignore` says that if a glob starts with a slash,
-                // then the glob can only match the beginning of a path
-                // (relative to the location of gitignore). We achieve this by
-                // simply banning wildcards from matching /.
-                line = &line[1..];
-                is_absolute = true;
-            }
-        }
-        // If it ends with a slash, then this should only match directories,
-        // but the slash should otherwise not be used while globbing.
-        if line.as_bytes().last() == Some(&b'/') {
-            glob.is_only_dir = true;
-            line = &line[..line.len() - 1];
-            // If the slash was escaped, then remove the escape.
-            // See: https://github.com/BurntSushi/ripgrep/issues/2236
-            if line.as_bytes().last() == Some(&b'\\') {
-                line = &line[..line.len() - 1];
-            }
-        }
-        glob.actual = line.to_string();
-        // If there is a literal slash, then this is a glob that must match the
-        // entire path name. Otherwise, we should let it match anywhere, so use
-        // a **/ prefix.
-        if !is_absolute && !line.chars().any(|c| c == '/') {
-            // ... but only if we don't already have a **/ prefix.
-            if !glob.has_doublestar_prefix() {
-                glob.actual = format!("**/{}", glob.actual);
-            }
-        }
-        // If the glob ends with `/**`, then we should only match everything
-        // inside a directory, but not the directory itself. Standard globs
-        // will match the directory. So we add `/*` to force the issue.
-        if glob.actual.ends_with("/**") {
-            glob.actual = format!("{}/*", glob.actual);
-        }
-        let parsed = GlobBuilder::new(&glob.actual)
-            .literal_separator(true)
-            .case_insensitive(self.case_insensitive)
-            .backslash_escape(true)
-            .allow_unclosed_class(self.allow_unclosed_class)
-            .build()
-            .map_err(|err| Error::Glob {
-                glob: Some(glob.original.clone()),
-                err: err.kind().to_string(),
-            })?;
-        self.builder.add(parsed);
-        self.globs.push(glob);
-        Ok(self)
-    }
-
-    /// Toggle whether the globs should be matched case insensitively or not.
-    ///
-    /// When this option is changed, only globs added after the change will be
-    /// affected.
-    ///
-    /// This is disabled by default.
-    pub fn case_insensitive(
-        &mut self,
-        yes: bool,
-    ) -> Result<&mut GitignoreBuilder, Error> {
-        // TODO: This should not return a `Result`. Fix this in the next semver
-        // release.
-        self.case_insensitive = yes;
-        Ok(self)
-    }
-
-    /// Toggle whether unclosed character classes are allowed. When allowed,
-    /// a `[` without a matching `]` is treated literally instead of resulting
-    /// in a parse error.
-    ///
-    /// For example, if this is set then the glob `[abc` will be treated as the
-    /// literal string `[abc` instead of returning an error.
-    ///
-    /// By default, this is true in order to match established `gitignore`
-    /// semantics. Generally speaking, enabling this leads to worse failure
-    /// modes since the glob parser becomes more permissive. You might want to
-    /// enable this when compatibility (e.g., with POSIX glob implementations)
-    /// is more important than good error messages.
-    pub fn allow_unclosed_class(
-        &mut self,
-        yes: bool,
-    ) -> &mut GitignoreBuilder {
-        self.allow_unclosed_class = yes;
-        self
-    }
-
-    /// CHANGED: Add a flag to have Gitignore rules that apply only to files.
-    ///
-    /// If this is set, then the globs will only be matched against file paths.
-    /// This will ensure that ignore rules like `*.pages` will _only_ ignore
-    /// files ending in `.pages` and not folders ending in `.pages`.
-    pub fn only_on_files(&mut self, yes: bool) -> &mut GitignoreBuilder {
-        self.only_on_files = yes;
-        self
-    }
-}
-
-/// Return the file path of the current environment's global gitignore file.
-///
-/// Note that the file path returned may not exist.
-pub fn gitconfig_excludes_path() -> Option<PathBuf> {
-    // When GIT_CONFIG_GLOBAL is set, it replaces both $HOME/.gitconfig and
-    // $XDG_CONFIG_HOME/git/config (per git 2.32+). Otherwise, git supports
-    // $HOME/.gitconfig and $XDG_CONFIG_HOME/git/config simultaneously, where
-    // $HOME/.gitconfig takes precedent.
-    gitconfig_global_env_contents()
-        .and_then(|x| parse_excludes_file(&x))
-        .or_else(|| {
-            gitconfig_home_contents().and_then(|x| parse_excludes_file(&x))
-        })
-        .or_else(|| {
-            gitconfig_xdg_contents().and_then(|x| parse_excludes_file(&x))
-        })
-        // System-level config has the lowest priority for core.excludesFile.
-        // GIT_CONFIG_SYSTEM overrides the default /etc/gitconfig path.
-        .or_else(|| {
-            gitconfig_system_contents().and_then(|x| parse_excludes_file(&x))
-        })
-        .or_else(excludes_file_default)
-}
-
-/// Returns the file contents of git's global config file from the path
-/// specified by the `GIT_CONFIG_GLOBAL` environment variable.
-fn gitconfig_global_env_contents() -> Option<Vec<u8>> {
-    let path = std::env::var_os("GIT_CONFIG_GLOBAL").map(PathBuf::from)?;
-    if path.as_os_str().is_empty() {
-        return None;
-    }
-    let mut file = BufReader::new(File::open(path).ok()?);
-    let mut contents = vec![];
-    file.read_to_end(&mut contents).ok().map(|_| contents)
-}
-
-/// Returns the file contents of git's system-level config file.
-///
-/// Checks `GIT_CONFIG_SYSTEM` first, then falls back to `/etc/gitconfig`.
-fn gitconfig_system_contents() -> Option<Vec<u8>> {
-    let path = std::env::var_os("GIT_CONFIG_SYSTEM")
-        .map(PathBuf::from)
-        .filter(|x| !x.as_os_str().is_empty())
-        .unwrap_or_else(|| PathBuf::from("/etc/gitconfig"));
-    let mut file = BufReader::new(File::open(path).ok()?);
-    let mut contents = vec![];
-    file.read_to_end(&mut contents).ok().map(|_| contents)
-}
-
-/// Returns the file contents of git's global config file, if one exists, in
-/// the user's home directory.
-fn gitconfig_home_contents() -> Option<Vec<u8>> {
-    let home = home_dir()?;
-    let mut file = BufReader::new(File::open(home.join(".gitconfig")).ok()?);
-    let mut contents = vec![];
-    file.read_to_end(&mut contents).ok().map(|_| contents)
-}
-
-/// Returns the file contents of git's global config file, if one exists, in
-/// the user's XDG_CONFIG_HOME directory.
-fn gitconfig_xdg_contents() -> Option<Vec<u8>> {
-    let path = std::env::var_os("XDG_CONFIG_HOME")
-        .map(PathBuf::from)
-        .filter(|x| !x.as_os_str().is_empty())
-        .or_else(|| home_dir().map(|p| p.join(".config")))
-        .map(|x| x.join("git/config"))?;
-    let mut file = BufReader::new(File::open(path).ok()?);
-    let mut contents = vec![];
-    file.read_to_end(&mut contents).ok().map(|_| contents)
-}
-
-/// Returns the default file path for a global .gitignore file.
-///
-/// Specifically, this respects XDG_CONFIG_HOME.
-fn excludes_file_default() -> Option<PathBuf> {
-    std::env::var_os("XDG_CONFIG_HOME")
-        .map(PathBuf::from)
-        .filter(|x| !x.as_os_str().is_empty())
-        .or_else(|| home_dir().map(|p| p.join(".config")))
-        .map(|x| x.join("git/ignore"))
-}
-
-/// Extract git's `core.excludesfile` config setting from the raw file contents
-/// given.
-fn parse_excludes_file(data: &[u8]) -> Option<PathBuf> {
-    use std::sync::OnceLock;
-
-    use regex_automata::{meta::Regex, util::syntax};
-
-    // N.B. This is the lazy approach, and isn't technically correct, but
-    // probably works in more circumstances. I guess we would ideally have
-    // a full INI parser. Yuck.
-    static RE: OnceLock<Regex> = OnceLock::new();
-    let re = RE.get_or_init(|| {
-        Regex::builder()
-            .configure(Regex::config().utf8_empty(false))
-            .syntax(syntax::Config::new().utf8(false))
-            .build(r#"(?im-u)^\s*excludesfile\s*=\s*"?\s*(\S+?)\s*"?\s*$"#)
-            .unwrap()
-    });
-    // We don't care about amortizing allocs here I think. This should only
-    // be called ~once per traversal or so? (Although it's not guaranteed...)
-    let mut caps = re.create_captures();
-    re.captures(data, &mut caps);
-    let span = caps.get_group(1)?;
-    let candidate = &data[span];
-    std::str::from_utf8(candidate).ok().map(|s| PathBuf::from(expand_tilde(s)))
-}
-
-/// Expands ~ in file paths to the value of $HOME.
-fn expand_tilde(path: &str) -> String {
-    let home = match home_dir() {
-        None => return path.to_string(),
-        Some(home) => home.to_string_lossy().into_owned(),
-    };
-    path.replace("~", &home)
-}
-
-/// Returns the location of the user's home directory.
-fn home_dir() -> Option<PathBuf> {
-    // We're fine with using std::env::home_dir for now. Its bugs are, IMO,
-    // pretty minor corner cases.
-    #![allow(deprecated)]
-    std::env::home_dir()
-}
-
-#[cfg(test)]
-mod tests {
-    use std::path::Path;
-
-    use super::{Gitignore, GitignoreBuilder};
-
-    fn gi_from_str<P: AsRef<Path>>(root: P, s: &str) -> Gitignore {
-        let mut builder = GitignoreBuilder::new(root);
-        builder.add_str(None, s).unwrap();
-        builder.build().unwrap()
-    }
-
-    macro_rules! ignored {
-        ($name:ident, $root:expr, $gi:expr, $path:expr) => {
-            ignored!($name, $root, $gi, $path, false);
-        };
-        ($name:ident, $root:expr, $gi:expr, $path:expr, $is_dir:expr) => {
-            #[test]
-            fn $name() {
-                let gi = gi_from_str($root, $gi);
-                assert!(gi.matched($path, $is_dir).is_ignore());
-            }
-        };
-    }
-
-    macro_rules! not_ignored {
-        ($name:ident, $root:expr, $gi:expr, $path:expr) => {
-            not_ignored!($name, $root, $gi, $path, false);
-        };
-        ($name:ident, $root:expr, $gi:expr, $path:expr, $is_dir:expr) => {
-            #[test]
-            fn $name() {
-                let gi = gi_from_str($root, $gi);
-                assert!(!gi.matched($path, $is_dir).is_ignore());
-            }
-        };
-    }
-
-    const ROOT: &'static str = "/home/foobar/rust/rg";
-
-    ignored!(ig1, ROOT, "months", "months");
-    ignored!(ig2, ROOT, "*.lock", "Cargo.lock");
-    ignored!(ig3, ROOT, "*.rs", "src/main.rs");
-    ignored!(ig4, ROOT, "src/*.rs", "src/main.rs");
-    ignored!(ig5, ROOT, "/*.c", "cat-file.c");
-    ignored!(ig6, ROOT, "/src/*.rs", "src/main.rs");
-    ignored!(ig7, ROOT, "!src/main.rs\n*.rs", "src/main.rs");
-    ignored!(ig8, ROOT, "foo/", "foo", true);
-    ignored!(ig9, ROOT, "**/foo", "foo");
-    ignored!(ig10, ROOT, "**/foo", "src/foo");
-    ignored!(ig11, ROOT, "**/foo/**", "src/foo/bar");
-    ignored!(ig12, ROOT, "**/foo/**", "wat/src/foo/bar/baz");
-    ignored!(ig13, ROOT, "**/foo/bar", "foo/bar");
-    ignored!(ig14, ROOT, "**/foo/bar", "src/foo/bar");
-    ignored!(ig15, ROOT, "abc/**", "abc/x");
-    ignored!(ig16, ROOT, "abc/**", "abc/x/y");
-    ignored!(ig17, ROOT, "abc/**", "abc/x/y/z");
-    ignored!(ig18, ROOT, "a/**/b", "a/b");
-    ignored!(ig19, ROOT, "a/**/b", "a/x/b");
-    ignored!(ig20, ROOT, "a/**/b", "a/x/y/b");
-    ignored!(ig21, ROOT, r"\!xy", "!xy");
-    ignored!(ig22, ROOT, r"\#foo", "#foo");
-    ignored!(ig23, ROOT, "foo", "./foo");
-    ignored!(ig24, ROOT, "target", "grep/target");
-    ignored!(ig25, ROOT, "Cargo.lock", "./tabwriter-bin/Cargo.lock");
-    ignored!(ig26, ROOT, "/foo/bar/baz", "./foo/bar/baz");
-    ignored!(ig27, ROOT, "foo/", "xyz/foo", true);
-    ignored!(ig28, "./src", "/llvm/", "./src/llvm", true);
-    ignored!(ig29, ROOT, "node_modules/ ", "node_modules", true);
-    ignored!(ig30, ROOT, "**/", "foo/bar", true);
-    ignored!(ig31, ROOT, "path1/*", "path1/foo");
-    ignored!(ig32, ROOT, ".a/b", ".a/b");
-    ignored!(ig33, "./", ".a/b", ".a/b");
-    ignored!(ig34, ".", ".a/b", ".a/b");
-    ignored!(ig35, "./.", ".a/b", ".a/b");
-    ignored!(ig36, "././", ".a/b", ".a/b");
-    ignored!(ig37, "././.", ".a/b", ".a/b");
-    ignored!(ig38, ROOT, "\\[", "[");
-    ignored!(ig39, ROOT, "\\?", "?");
-    ignored!(ig40, ROOT, "\\*", "*");
-    ignored!(ig41, ROOT, "\\a", "a");
-    ignored!(ig42, ROOT, "s*.rs", "sfoo.rs");
-    ignored!(ig43, ROOT, "**", "foo.rs");
-    ignored!(ig44, ROOT, "**/**/*", "a/foo.rs");
-
-    not_ignored!(ignot1, ROOT, "amonths", "months");
-    not_ignored!(ignot2, ROOT, "monthsa", "months");
-    not_ignored!(ignot3, ROOT, "/src/*.rs", "src/grep/src/main.rs");
-    not_ignored!(ignot4, ROOT, "/*.c", "mozilla-sha1/sha1.c");
-    not_ignored!(ignot5, ROOT, "/src/*.rs", "src/grep/src/main.rs");
-    not_ignored!(ignot6, ROOT, "*.rs\n!src/main.rs", "src/main.rs");
-    not_ignored!(ignot7, ROOT, "foo/", "foo", false);
-    not_ignored!(ignot8, ROOT, "**/foo/**", "wat/src/afoo/bar/baz");
-    not_ignored!(ignot9, ROOT, "**/foo/**", "wat/src/fooa/bar/baz");
-    not_ignored!(ignot10, ROOT, "**/foo/bar", "foo/src/bar");
-    not_ignored!(ignot11, ROOT, "#foo", "#foo");
-    not_ignored!(ignot12, ROOT, "\n\n\n", "foo");
-    not_ignored!(ignot13, ROOT, "foo/**", "foo", true);
-    not_ignored!(
-        ignot14,
-        "./third_party/protobuf",
-        "m4/ltoptions.m4",
-        "./third_party/protobuf/csharp/src/packages/repositories.config"
-    );
-    not_ignored!(ignot15, ROOT, "!/bar", "foo/bar");
-    not_ignored!(ignot16, ROOT, "*\n!**/", "foo", true);
-    not_ignored!(ignot17, ROOT, "src/*.rs", "src/grep/src/main.rs");
-    not_ignored!(ignot18, ROOT, "path1/*", "path2/path1/foo");
-    not_ignored!(ignot19, ROOT, "s*.rs", "src/foo.rs");
-
-    fn bytes(s: &str) -> Vec<u8> {
-        s.to_string().into_bytes()
-    }
-
-    fn path_string<P: AsRef<Path>>(path: P) -> String {
-        path.as_ref().to_str().unwrap().to_string()
-    }
-
-    #[test]
-    fn parse_excludes_file1() {
-        let data = bytes("[core]\nexcludesFile = /foo/bar");
-        let got = super::parse_excludes_file(&data).unwrap();
-        assert_eq!(path_string(got), "/foo/bar");
-    }
-
-    #[test]
-    fn parse_excludes_file2() {
-        let data = bytes("[core]\nexcludesFile = ~/foo/bar");
-        let got = super::parse_excludes_file(&data).unwrap();
-        assert_eq!(path_string(got), super::expand_tilde("~/foo/bar"));
-    }
-
-    #[test]
-    fn parse_excludes_file3() {
-        let data = bytes("[core]\nexcludeFile = /foo/bar");
-        assert!(super::parse_excludes_file(&data).is_none());
-    }
-
-    #[test]
-    fn parse_excludes_file4() {
-        let data = bytes("[core]\nexcludesFile = \"~/foo/bar\"");
-        let got = super::parse_excludes_file(&data);
-        assert_eq!(
-            path_string(got.unwrap()),
-            super::expand_tilde("~/foo/bar")
-        );
-    }
-
-    #[test]
-    fn parse_excludes_file5() {
-        let data = bytes("[core]\nexcludesFile = \" \"~/foo/bar \" \"");
-        assert!(super::parse_excludes_file(&data).is_none());
-    }
-
-    // See: https://github.com/BurntSushi/ripgrep/issues/106
-    #[test]
-    fn regression_106() {
-        gi_from_str("/", " ");
-    }
-
-    #[test]
-    fn case_insensitive() {
-        let gi = GitignoreBuilder::new(ROOT)
-            .case_insensitive(true)
-            .unwrap()
-            .add_str(None, "*.html")
-            .unwrap()
-            .build()
-            .unwrap();
-        assert!(gi.matched("foo.html", false).is_ignore());
-        assert!(gi.matched("foo.HTML", false).is_ignore());
-        assert!(!gi.matched("foo.htm", false).is_ignore());
-        assert!(!gi.matched("foo.HTM", false).is_ignore());
-    }
-
-    ignored!(cs1, ROOT, "*.html", "foo.html");
-    not_ignored!(cs2, ROOT, "*.html", "foo.HTML");
-    not_ignored!(cs3, ROOT, "*.html", "foo.htm");
-    not_ignored!(cs4, ROOT, "*.html", "foo.HTM");
-}
diff --git a/crates/ignore/src/incremental.rs b/crates/ignore/src/incremental.rs
deleted file mode 100644
index 5030b0d00..000000000
--- a/crates/ignore/src/incremental.rs
+++ /dev/null
@@ -1,1286 +0,0 @@
-use std::{
-    collections::HashMap,
-    path::{Path, PathBuf},
-    sync::OnceLock,
-};
-
-use crate::{
-    Error, Match, PartialErrorBuilder, dir::Ignore, pathutil::is_hidden_path,
-};
-
-/// A cached matcher for checking paths against hierarchical ignore files.
-///
-/// An `IncrementalIgnore` is built from a [`crate::WalkBuilder`]. Unlike a
-/// recursive walk, it can check individual paths while still respecting the
-/// ignore files in every relevant parent directory. Matchers for directories
-/// are compiled on first use and then retained for later queries.
-/// Each matcher corresponds to exactly one root configured on the builder,
-/// and paths passed to it are interpreted relative to that root.
-/// A matcher for the special `-` root representing standard input is inert
-/// and always returns a non-match.
-///
-/// The matcher checks path-based filters in the same precedence order as
-/// a traversal. This includes glob overrides, `.ignore`, `.gitignore`,
-/// `.git/info/exclude`, global and explicitly added ignore files, custom
-/// ignore file names and file type selections. It does not apply filters that
-/// require a directory entry or other traversal state, such as custom entry
-/// predicates. Hidden-file detection, minimum and maximum depth limits and the
-/// maximum file size are applied.
-///
-/// A matcher is a snapshot at directory granularity. Once the ignore files in
-/// a directory have been loaded, edits to those files are not observed. Build
-/// a new matcher to reload them.
-///
-/// # Warning
-///
-/// The incremental path checking here necessarily needs to do a lot more work
-/// per path matched. Callers should _not_ use this to run directory traversal.
-/// This is intended to avoid the work of re-traversing an entire directory
-/// tree when only a few changes are detected. (For example, in response to
-/// file additions or deletions.)
-///
-/// # Example
-///
-/// ```rust,no_run
-/// use ignore::WalkBuilder;
-///
-/// let mut builder = WalkBuilder::new(".");
-/// builder.add_custom_ignore_filename(".rgignore");
-/// let mut matchers = builder.build_matchers();
-/// let matcher = &mut matchers[0];
-///
-/// if matcher.matched("src/generated.rs", false).is_ignore() {
-///     println!("ignored");
-/// }
-/// ```
-#[derive(Clone, Debug)]
-pub struct IncrementalIgnore {
-    /// The root exactly as it was given to `WalkBuilder`.
-    root: PathBuf,
-    /// The normalized root used only by the opt-in normalization routine.
-    normalized_root: OnceLock<Option<PathBuf>>,
-    /// The matcher for the configured root directory, loaded on first use.
-    ignore: RootIgnore,
-    /// Directory paths relative to `root`, excluding the root itself.
-    dirs: HashMap<PathBuf, CachedDir>,
-    /// Options for additional filtering beyond gitignore.
-    options: IncrementalIgnoreOptions,
-}
-
-/// The options for a matcher, mostly meant to duplicate as much as we can from
-/// `WalkParallel`.
-#[derive(Clone, Debug)]
-pub(crate) struct IncrementalIgnoreOptions {
-    pub(crate) min_depth: Option<usize>,
-    pub(crate) max_depth: Option<usize>,
-    pub(crate) max_filesize: Option<u64>,
-    pub(crate) hidden: bool,
-    pub(crate) follow_links: bool,
-}
-
-#[derive(Clone, Debug)]
-enum RootIgnore {
-    Unloaded(Ignore),
-    Loaded(Ignore),
-    NotDirectory,
-    Stdin,
-}
-
-/// Cached traversal state for a directory relative to the configured root.
-///
-/// The presence of an entry means that the directory and every ancestor
-/// between it and the root have already been checked.
-#[derive(Clone, Debug)]
-enum CachedDir {
-    /// The directory may be descended into. The matcher includes the ignore
-    /// rules loaded through this directory and is therefore the matcher to use
-    /// for its children.
-    Allowed(Ignore),
-    /// The directory may not be descended into because it was ignored by a
-    /// path rule or hidden-file filtering. Every descendant is consequently
-    /// ignored, and ignore files inside this directory are not loaded.
-    Ignored,
-}
-
-impl IncrementalIgnore {
-    pub(crate) fn new(
-        root: PathBuf,
-        ignore: Ignore,
-        options: IncrementalIgnoreOptions,
-    ) -> IncrementalIgnore {
-        // File traversal special cases `-` to search stdin, so we recognize
-        // it here for completeness too. In particular, we really want
-        // `WalkBuilder::build_matchers` to return a matcher for every root,
-        // even when it's a simple file (handled automatically) or when it's
-        // stdin (necessarily special cased).
-        //
-        // If callers need to search a file or directory named `-`, then they
-        // can use `./-`. As is the case for file traversal too.
-        let ignore = if root == Path::new("-") {
-            RootIgnore::Stdin
-        } else {
-            RootIgnore::Unloaded(ignore)
-        };
-        IncrementalIgnore {
-            root,
-            normalized_root: OnceLock::new(),
-            ignore,
-            dirs: HashMap::new(),
-            options,
-        }
-    }
-
-    /// Return the root that paths matched by this matcher are relative to.
-    pub fn root(&self) -> &Path {
-        &self.root
-    }
-
-    /// Normalize `path` and return it relative to this matcher's root.
-    ///
-    /// This returns `None` when `path` cannot be made absolute or
-    /// when it is known to be outside this matcher's root. Unlike
-    /// [`IncrementalIgnore::matched`], this performs absolute path conversion,
-    /// lexical normalization and allocation. It is intended as an opt-in
-    /// convenience for callers that do not already have root-relative paths.
-    ///
-    /// Note that `.` is interpreted relative to the process level current
-    /// working directory. It is _not_ interpreted relative to the root of
-    /// this matcher.
-    ///
-    /// Note also that this may reject paths that only differ in casing. For
-    /// example, if the root path for this matcher is `/FOO` but the provided
-    /// path is `/foo/bar`, then this may return `None`. Callers must ensure
-    /// casing is consistent between the path provided and the root path for
-    /// this matcher.
-    pub fn normalize<P: AsRef<Path>>(&self, path: P) -> Option<PathBuf> {
-        if matches!(self.ignore, RootIgnore::Stdin) {
-            return None;
-        }
-        let path = normalize_absolute(path.as_ref())?;
-        let root = self
-            .normalized_root
-            .get_or_init(|| normalize_absolute(&self.root))
-            .as_ref()?;
-        path.strip_prefix(root).ok().map(Path::to_path_buf)
-    }
-
-    /// Match a root-relative path against ignore files in its directory and
-    /// all relevant parent directories.
-    ///
-    /// `is_dir` should be true when `path` should be matched as a directory.
-    ///
-    /// For the return value, use [`IncrementalMatch::is_ignore`],
-    /// [`IncrementalMatch::is_whitelist`] or [`IncrementalMatch::is_none`] to
-    /// inspect it.
-    ///
-    /// Matchers for previously unseen directories are loaded and cached during
-    /// this call. Errors encountered while loading ignore files are logged. To
-    /// receive those errors, use [`IncrementalIgnore::matched_with_errors`].
-    ///
-    /// `path` must be relative to this matcher's root and must not contain a
-    /// parent directory (`..`) component. Behavior is unspecified when these
-    /// preconditions are violated. Callers with an absolute path or with a
-    /// path containing `.` or `..` may use [`IncrementalIgnore::normalize`]
-    /// to get a path satisfying these preconditions. In all cases, a relative
-    /// path is *assumed* to be relative to the root of this ignore matcher.
-    ///
-    /// In general, it is intended that callers doing recursive directory
-    /// traversal on the root of this matcher may provide relative paths to
-    /// this routine *without* calling [`IncrementalIgnore::normalize`].
-    ///
-    /// The empty path represents the explicitly configured root and also
-    /// returns non-match, consistent with recursive traversal where a root is
-    /// always treated as being at depth zero.
-    pub fn matched<P: AsRef<Path>>(
-        &mut self,
-        path: P,
-        is_dir: bool,
-    ) -> IncrementalMatch {
-        let (matched, err) = self.matched_with_errors(path, is_dir);
-        if let Some(err) = err {
-            log::debug!("error while loading ignore files: {err}");
-        }
-        matched
-    }
-
-    /// Match a root-relative path and return errors encountered while loading
-    /// ignore files.
-    ///
-    /// This is equivalent to [`IncrementalIgnore::matched`], except that
-    /// it returns any errors from newly loaded ignore files. Loading can
-    /// partially succeed, so valid rules are always applied to the returned
-    /// match even when an error is present.
-    pub fn matched_with_errors<P: AsRef<Path>>(
-        &mut self,
-        path: P,
-        is_dir: bool,
-    ) -> (IncrementalMatch, Option<Error>) {
-        let mut errs = PartialErrorBuilder::default();
-        let matched =
-            self.matched_with_errors_impl(path.as_ref(), is_dir, &mut errs);
-        (matched, errs.into_error_option())
-    }
-
-    fn matched_with_errors_impl(
-        &mut self,
-        relative: &Path,
-        is_dir: bool,
-        errs: &mut PartialErrorBuilder,
-    ) -> IncrementalMatch {
-        // We short-circuit here when our matcher corresponds to `Stdin` in
-        // order to always return a non-match. This is somewhat redundant with
-        // `root_ignore()` which does this too, but we do it here so that it
-        // always happens, e.g., before depth filtering.
-        if relative.is_absolute() || matches!(self.ignore, RootIgnore::Stdin) {
-            return IncrementalMatch::none(is_dir);
-        }
-
-        let (mut satisfies_min, mut edge_max) = (true, false);
-        if self.options.min_depth.is_some() || self.options.max_depth.is_some()
-        {
-            let depth = relative
-                .components()
-                .filter_map(|component| match component {
-                    std::path::Component::CurDir => None,
-                    component => Some(component),
-                })
-                .count();
-            satisfies_min =
-                self.options.min_depth.is_none_or(|min| depth >= min);
-            let satisfies_max =
-                self.options.max_depth.is_none_or(|max| depth <= max);
-            edge_max = self.options.max_depth.is_some_and(|max| depth == max);
-            // When we have a file that isn't past our min depth, we can give
-            // up right away.
-            if !is_dir && !satisfies_min {
-                return IncrementalMatch::ignore().not_within_depth();
-            }
-            // Same for *anything* that exceeds our max depth.
-            if !satisfies_max {
-                return IncrementalMatch::ignore().not_within_depth();
-            }
-        }
-
-        // When the path is invalid in some way, we bail out early to avoid
-        // potentially doing a stat call below.
-        let (mut mat, valid) = self
-            .matched_with_errors_ignore(relative, is_dir, errs)
-            .map(|mat| (mat, true))
-            .unwrap_or_else(|| (IncrementalMatch::none(is_dir), false));
-
-        if !is_dir
-            && !mat.is_ignore()
-            && valid
-            && let Some(max_filesize) = self.options.max_filesize
-        {
-            let path = self.root().join(relative);
-            let result = if self.options.follow_links {
-                path.metadata()
-            } else {
-                path.symlink_metadata()
-            };
-            match result {
-                Ok(md) if md.len() > max_filesize => {
-                    return IncrementalMatch::ignore();
-                }
-                Ok(_) => {}
-                Err(err) => {
-                    // Record the error but otherwise fall through
-                    let err = Error::from(err);
-                    errs.push(err.with_path(path));
-                }
-            }
-        }
-
-        // We still need to tag our `mat` if it doesn't pass the depth filter,
-        // or if it's a directory on the edge of a depth filter. This can only
-        // happen when the path is reported as a directory. Otherwise regular
-        // files are always handled above.
-        if is_dir {
-            if !satisfies_min {
-                mat = mat.not_within_depth();
-            }
-            if edge_max {
-                mat = mat.no_descent();
-            }
-        }
-        mat
-    }
-
-    fn matched_with_errors_ignore(
-        &mut self,
-        relative: &Path,
-        is_dir: bool,
-        errs: &mut PartialErrorBuilder,
-    ) -> Option<IncrementalMatch> {
-        let mut components = relative
-            .components()
-            .filter_map(|component| match component {
-                std::path::Component::CurDir => None,
-                component => Some(component),
-            })
-            .peekable();
-        components.peek()?;
-
-        // If the exact parent is cached, then all of its ancestors have
-        // already been checked. An allowed cache entry is the matcher to use
-        // for children of that directory, while an ignored cache entry is
-        // terminal for every descendant. In the usual case, this avoids both
-        // walking every component and allocating a relative directory path.
-        //
-        // Only try the fast path when the final component is a normal path
-        // component. Invalid paths are handled by the component walk below.
-        let has_normal_final_component =
-            relative.components().next_back().is_some_and(|component| {
-                matches!(component, std::path::Component::Normal(_))
-            });
-        if has_normal_final_component && let Some(parent) = relative.parent() {
-            match self.dirs.get(parent) {
-                Some(CachedDir::Allowed(ignore)) => {
-                    return Some(self.match_path(ignore, relative, is_dir));
-                }
-                Some(CachedDir::Ignored) => {
-                    return Some(IncrementalMatch::ignore());
-                }
-                None => {}
-            }
-        }
-
-        let mut ignore = self.root_ignore(errs)?;
-        let mut dir = PathBuf::new();
-        while let Some(component) = components.next() {
-            match component {
-                std::path::Component::ParentDir
-                | std::path::Component::RootDir
-                | std::path::Component::Prefix(_) => {
-                    return None;
-                }
-                std::path::Component::CurDir => continue,
-                std::path::Component::Normal(_) => {}
-            }
-            if components.peek().is_none() {
-                break;
-            }
-            dir.push(component.as_os_str());
-            match self.dirs.get(&dir) {
-                Some(CachedDir::Allowed(cached)) => {
-                    ignore = cached.clone();
-                    continue;
-                }
-                Some(CachedDir::Ignored) => {
-                    return Some(IncrementalMatch::ignore());
-                }
-                None => {}
-            }
-
-            let path = self.root.join(&dir);
-            let mat = ignore.matched(&path, true);
-            let is_hidden =
-                self.options.hidden && mat.is_none() && is_hidden_path(&path);
-            if mat.is_ignore() || is_hidden {
-                self.dirs.insert(dir.clone(), CachedDir::Ignored);
-                return Some(IncrementalMatch::ignore());
-            }
-            let (child, err) = ignore.add_child(&path);
-            errs.maybe_push(err);
-            self.dirs.insert(dir.clone(), CachedDir::Allowed(child.clone()));
-            ignore = child;
-        }
-
-        Some(self.match_path(&ignore, relative, is_dir))
-    }
-
-    fn match_path(
-        &self,
-        ignore: &Ignore,
-        relative: &Path,
-        is_dir: bool,
-    ) -> IncrementalMatch {
-        let path = self.root.join(relative);
-        let mut mat = IncrementalMatch::from_match(
-            ignore.matched(&path, is_dir).map(|_| ()),
-            is_dir,
-        );
-        // Whether a file is hidden or not has low precedence in filtering. We
-        // only check it if we haven't matched anything above. This permits
-        // callers to whitelist hidden files or directories.
-        if self.options.hidden && mat.is_none() && is_hidden_path(&path) {
-            mat = IncrementalMatch::ignore();
-        }
-        mat
-    }
-
-    fn root_ignore(
-        &mut self,
-        errs: &mut PartialErrorBuilder,
-    ) -> Option<Ignore> {
-        let ignore = match self.ignore {
-            RootIgnore::Unloaded(ref ignore) => ignore.clone(),
-            RootIgnore::Loaded(ref ignore) => return Some(ignore.clone()),
-            RootIgnore::NotDirectory | RootIgnore::Stdin => return None,
-        };
-        if !self.root.is_dir() {
-            self.ignore = RootIgnore::NotDirectory;
-            return None;
-        }
-
-        let (parents, err) = ignore.add_parents(&self.root);
-        errs.maybe_push(err);
-        let (root, err) = parents.add_child(&self.root);
-        errs.maybe_push(err);
-        self.ignore = RootIgnore::Loaded(root.clone());
-        Some(root)
-    }
-}
-
-/// The result of an incremental match.
-///
-/// This is similar to [`Match`] in that it reports whether a file path should
-/// be ignored, whitelisted or didn't match anything at all. It also has extra
-/// data, such as whether a directory matched but should not be descended into.
-///
-/// Generally speaking, callers that only care about specific files can stick
-/// to the `is_none()`, `is_ignore()` or `is_whitelist()` predicates. Directory
-/// entries are more complicated because we sometimes want to yield directories
-/// to descend into, but not actually visit (e.g., for the minimum depth
-/// filter). Or, we may want to yield a directory to visit but not descend into
-/// (e.g., for the maximum depth filter).
-#[derive(Clone, Debug)]
-pub struct IncrementalMatch {
-    mat: Match<()>,
-    should_descend: bool,
-    is_within_depth: bool,
-}
-
-impl IncrementalMatch {
-    fn none(is_dir: bool) -> IncrementalMatch {
-        IncrementalMatch {
-            mat: Match::None,
-            should_descend: is_dir,
-            is_within_depth: true,
-        }
-    }
-
-    fn ignore() -> IncrementalMatch {
-        IncrementalMatch {
-            mat: Match::Ignore(()),
-            should_descend: false,
-            is_within_depth: true,
-        }
-    }
-
-    fn from_match(mat: Match<()>, is_dir: bool) -> IncrementalMatch {
-        let should_descend = is_dir && !mat.is_ignore();
-        IncrementalMatch { mat, should_descend, is_within_depth: true }
-    }
-
-    fn no_descent(self) -> IncrementalMatch {
-        IncrementalMatch { should_descend: false, ..self }
-    }
-
-    fn not_within_depth(self) -> IncrementalMatch {
-        IncrementalMatch { is_within_depth: false, ..self }
-    }
-
-    /// Returns true if the match result didn't match anything.
-    pub fn is_none(&self) -> bool {
-        self.mat.is_none()
-    }
-
-    /// Returns true if the match result implies the path should be ignored.
-    pub fn is_ignore(&self) -> bool {
-        self.mat.is_ignore()
-    }
-
-    /// Returns true if the match result implies the path should be
-    /// whitelisted.
-    pub fn is_whitelist(&self) -> bool {
-        self.mat.is_whitelist()
-    }
-
-    /// Returns true only when this match corresponds to a directory *and*
-    /// whether the caller should look inside this directory for additional
-    /// results.
-    ///
-    /// It is possible for a match to report `false` for
-    /// [`IncrementalMatch::is_ignore`] _and_ `false` for
-    /// [`IncrementalMatch::should_descend`]. This can occur, for example, when
-    /// a maximum depth setting allows a directory through, but where none of
-    /// its children entries should be visited.
-    ///
-    /// This is always `false` for a file path that does *not* correspond to a
-    /// directory.
-    pub fn should_descend(&self) -> bool {
-        self.should_descend
-    }
-
-    /// Returns true only when this result corresponds to an entry that is
-    /// within the depth filter.
-    ///
-    /// This is `false` when a path corresponds to a directory and is less than
-    /// the minimum depth. In this case, callers should continue looking inside
-    /// that directory.
-    ///
-    /// This is always `true` for a match corresponding to a file path that
-    /// isn't a directory.
-    pub fn is_within_depth(&self) -> bool {
-        self.is_within_depth
-    }
-
-    /// Inverts the match so that `Ignore` becomes `Whitelist` and
-    /// `Whitelist` becomes `Ignore`. A non-match remains the same.
-    pub fn invert(self) -> IncrementalMatch {
-        IncrementalMatch { mat: self.mat.invert(), ..self }
-    }
-}
-
-/// Return a lexically normalized absolute representation of `path`.
-///
-/// This collapses `.` and `..`, but intentionally does not canonicalize or
-/// resolve symlinks. Ignore rules apply to the lexical path, and resolving a
-/// symlink below a root could move the result outside of that root.
-fn normalize_absolute(path: &Path) -> Option<PathBuf> {
-    let absolute = std::path::absolute(path).ok()?;
-    let mut normalized = PathBuf::new();
-    for component in absolute.components() {
-        match component {
-            std::path::Component::CurDir => {}
-            std::path::Component::ParentDir => {
-                normalized.pop();
-            }
-            _ => normalized.push(component.as_os_str()),
-        }
-    }
-    Some(normalized)
-}
-
-#[cfg(test)]
-mod tests {
-    use std::{
-        fs::{self, File},
-        io::Write,
-        path::{Path, PathBuf},
-    };
-
-    use crate::{
-        IncrementalIgnore, IncrementalMatch, WalkBuilder,
-        overrides::OverrideBuilder, tests::TempDir, types::TypesBuilder,
-    };
-
-    use super::CachedDir;
-
-    fn wfile<P: AsRef<Path>>(path: P, contents: &str) {
-        let mut file = File::create(path).unwrap();
-        file.write_all(contents.as_bytes()).unwrap();
-    }
-
-    fn mkdirp<P: AsRef<Path>>(path: P) {
-        fs::create_dir_all(path).unwrap();
-    }
-
-    fn tmpdir() -> TempDir {
-        TempDir::new().unwrap()
-    }
-
-    fn builder<P: AsRef<Path>>(path: P) -> WalkBuilder {
-        let mut builder = WalkBuilder::new(path);
-        builder.git_global(false);
-        builder
-    }
-
-    fn one_matcher(builder: &WalkBuilder) -> IncrementalIgnore {
-        let mut matchers = builder.build_matchers();
-        assert_eq!(matchers.len(), 1);
-        matchers.pop().unwrap()
-    }
-
-    fn builders<I: IntoIterator<Item = P>, P: AsRef<Path>>(
-        paths: I,
-    ) -> WalkBuilder {
-        let mut builder = WalkBuilder::from_iter(paths);
-        builder.git_global(false);
-        builder
-    }
-
-    fn matchers(builder: &WalkBuilder) -> Vec<IncrementalIgnore> {
-        builder.build_matchers()
-    }
-
-    fn matchedf<P: AsRef<Path>>(
-        matcher: &mut IncrementalIgnore,
-        path: P,
-    ) -> IncrementalMatch {
-        let (matched, err) = matcher.matched_with_errors(path, false);
-        assert!(err.is_none(), "unexpected matcher error: {err:?}");
-        matched
-    }
-
-    fn matchedd<P: AsRef<Path>>(
-        matcher: &mut IncrementalIgnore,
-        path: P,
-    ) -> IncrementalMatch {
-        let (matched, err) = matcher.matched_with_errors(path, true);
-        assert!(err.is_none(), "unexpected matcher error: {err:?}");
-        matched
-    }
-
-    // Test that multiple parent ignore files, when nested, are respected.
-    #[test]
-    fn nested_parent_gitignores() {
-        let td = tmpdir();
-        let root = td.path().join("project/work");
-        mkdirp(td.path().join(".git"));
-        mkdirp(root.join("src"));
-        wfile(td.path().join(".gitignore"), "*.tmp\n");
-        wfile(td.path().join("project/.gitignore"), "!keep.tmp\nnested.log\n");
-
-        let mut m = one_matcher(&builder(&root));
-        assert_eq!(m.root(), root);
-        assert!(matchedf(&mut m, "src/drop.tmp").is_ignore());
-        assert!(matchedf(&mut m, "src/keep.tmp").is_whitelist());
-        assert!(matchedf(&mut m, "src/nested.log").is_ignore());
-        assert!(matchedf(&mut m, "src/ok.rs").is_none());
-    }
-
-    // Test that an anchored rule in a child directory is matched relative to
-    // that directory, not relative to the configured root.
-    #[test]
-    fn anchored_child_rule_uses_child_root() {
-        let td = tmpdir();
-        let root = td.path().join("root");
-        mkdirp(root.join("a"));
-        wfile(root.join("a/.ignore"), "/foo\n");
-
-        let mut m = one_matcher(&builder(&root));
-        assert!(matchedf(&mut m, "a/foo").is_ignore());
-        assert!(matchedf(&mut m, "a/b/foo").is_none());
-    }
-
-    // Test that a leading `./` impacts how the rules are matched.
-    #[cfg(not(windows))]
-    #[test]
-    fn leading_dot_slash_impacts_matching() {
-        let td = tmpdir();
-        let root = td.path().join("root");
-        mkdirp(root.join("a"));
-        wfile(root.join(".ignore"), "/foo\n");
-        wfile(root.join("a/.ignore"), "/foo\n");
-
-        let mut m = one_matcher(&builder(&root));
-        assert!(matchedf(&mut m, "foo").is_ignore());
-        assert!(matchedf(&mut m, "./foo").is_none());
-        assert!(matchedf(&mut m, "a/allowed").is_none());
-        assert!(matchedf(&mut m, "a/foo").is_ignore());
-        assert!(matchedf(&mut m, "./a/foo").is_none());
-    }
-
-    // Test that custom ignore files are respected.
-    #[test]
-    fn parent_ignore_and_custom_ignore() {
-        let td = tmpdir();
-        let root = td.path().join("project/work");
-        mkdirp(root.join("src"));
-        wfile(td.path().join(".ignore"), "*.cache\n");
-        wfile(td.path().join(".rgignore"), "*.svg\n");
-        wfile(td.path().join("project/.ignore"), "!keep.cache\n");
-        wfile(td.path().join("project/.rgignore"), "!keep.svg\n");
-
-        let mut builder = builder(&root);
-        builder.add_custom_ignore_filename(".rgignore");
-        let mut m = one_matcher(&builder);
-        assert!(matchedf(&mut m, "src/drop.cache").is_ignore());
-        assert!(matchedf(&mut m, "src/keep.cache").is_whitelist());
-        assert!(matchedf(&mut m, "src/drop.svg").is_ignore());
-        assert!(matchedf(&mut m, "src/keep.svg").is_whitelist());
-    }
-
-    // Test that glob overrides take precedence over ignore files.
-    #[test]
-    fn glob_overrides_are_applied() {
-        let td = tmpdir();
-        wfile(td.path().join(".ignore"), "keep.rs\n!drop.rs\n");
-
-        let mut overrides = OverrideBuilder::new(td.path());
-        overrides.add("keep.rs").unwrap();
-        overrides.add("!drop.rs").unwrap();
-        let mut b = builder(td.path());
-        b.overrides(overrides.build().unwrap());
-        let mut m = one_matcher(&b);
-
-        assert!(matchedf(&mut m, "keep.rs").is_whitelist());
-        assert!(matchedf(&mut m, "drop.rs").is_ignore());
-    }
-
-    // Test that an override-ignored directory prevents matching rules below
-    // it, just as it prevents a traversal from descending into the directory.
-    #[test]
-    fn glob_overrides_apply_to_ancestors() {
-        let td = tmpdir();
-        mkdirp(td.path().join("blocked"));
-        wfile(td.path().join("blocked/.ignore"), "!keep.rs\n");
-
-        let mut overrides = OverrideBuilder::new(td.path());
-        overrides.add("!blocked/").unwrap();
-        let mut b = builder(td.path());
-        b.overrides(overrides.build().unwrap());
-        let mut m = one_matcher(&b);
-
-        assert!(matchedf(&mut m, "blocked/keep.rs").is_ignore());
-    }
-
-    // Test that file type selections are applied to files, but not
-    // directories.
-    #[test]
-    fn file_types_are_applied() {
-        let td = tmpdir();
-        mkdirp(td.path().join("src"));
-
-        let mut types = TypesBuilder::new();
-        types.add("rust", "*.rs").unwrap();
-        types.select("rust");
-        let mut b = builder(td.path());
-        b.types(types.build().unwrap());
-        let mut m = one_matcher(&b);
-
-        assert!(matchedd(&mut m, "src").is_none());
-        assert!(matchedf(&mut m, "src/lib.rs").is_whitelist());
-        assert!(matchedf(&mut m, "README.md").is_ignore());
-    }
-
-    #[test]
-    fn directly_ignored_directory_is_not_descended() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("blocked"));
-        wfile(td.path().join(".gitignore"), "blocked/\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        let dir = matchedd(&mut m, "blocked");
-        assert!(dir.is_ignore());
-        assert!(!dir.should_descend());
-    }
-
-    // Test that when a directory is ignored, anything below it always ignored
-    // even when there are explicit whitelist rules. This matches directory
-    // traversal semantics.
-    #[test]
-    fn ignored_ancestor_wins() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("blocked"));
-        mkdirp(td.path().join("open"));
-        // This is the key line: since the entire `blocked` directory is
-        // ignored, a proper file traversal won't ever descend into it. So
-        // `blocked/keep.rs` should be ignored even if there are ignore rules
-        // "beneath" it that whitelist it.
-        wfile(td.path().join(".gitignore"), "blocked/\n!blocked/keep.rs\n");
-        wfile(td.path().join("blocked/.gitignore"), "!keep.rs\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, "blocked/keep.rs").is_ignore());
-        assert!(matchedf(&mut m, "blocked/other.rs").is_ignore());
-        assert!(matchedf(&mut m, "open/keep.rs").is_none());
-    }
-
-    // Test that we respect git boundaries. And that we don't respect git
-    // boundaries when not configured to do so.
-    #[test]
-    fn respects_git_repository_boundaries() {
-        let td = tmpdir();
-        let root = td.path().join("repo/src");
-        mkdirp(td.path().join("repo/.git"));
-        mkdirp(&root);
-        wfile(td.path().join(".gitignore"), "outside-rule\n");
-        wfile(td.path().join(".ignore"), "tool-rule\n");
-        wfile(td.path().join("repo/.gitignore"), "inside-rule\n");
-
-        let mut m = one_matcher(&builder(&root));
-        assert!(matchedf(&mut m, "inside-rule").is_ignore());
-        assert!(matchedf(&mut m, "outside-rule").is_none());
-        assert!(matchedf(&mut m, "tool-rule").is_ignore());
-
-        let mut no_git_required = builder(&root);
-        no_git_required.require_git(false);
-        let mut m = one_matcher(&no_git_required);
-        assert!(matchedf(&mut m, "outside-rule").is_ignore());
-    }
-
-    // Test that when a gitignore matcher in a parent directory is created, we
-    // reuse that matcher from memory even if it's changed on disk.
-    #[test]
-    fn compiled_matchers_are_reused() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a"));
-        wfile(td.path().join("a/.ignore"), "*.tmp\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, "a/first.tmp").is_ignore());
-
-        // Below demonstrates that this new ignore file contents
-        // aren't actually picked up because it was already loaded.
-        wfile(td.path().join("a/.ignore"), "!*.tmp\n*.rs\n");
-        assert!(matchedf(&mut m, "a/first.tmp").is_ignore());
-        assert!(matchedf(&mut m, "a/second.tmp").is_ignore());
-        assert!(matchedf(&mut m, "a/keep.rs").is_none());
-        // To get the new ignore file, we need to rebuild the matcher.
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, "a/first.tmp").is_whitelist());
-        assert!(matchedf(&mut m, "a/second.tmp").is_whitelist());
-        assert!(matchedf(&mut m, "a/keep.rs").is_ignore());
-    }
-
-    #[test]
-    fn cached_allowed_parent_matches_children() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b"));
-        wfile(td.path().join("a/b/.ignore"), "ignored\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, "a/b/allowed").is_none());
-        assert!(matches!(
-            m.dirs.get(Path::new("a/b")),
-            Some(CachedDir::Allowed(_))
-        ));
-        assert!(matchedf(&mut m, "a/b/ignored").is_ignore());
-    }
-
-    #[test]
-    fn cached_ignored_parent_matches_children() {
-        let td = tmpdir();
-        mkdirp(td.path().join("blocked"));
-        wfile(td.path().join(".ignore"), "blocked/\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, "blocked/first").is_ignore());
-        assert!(matches!(
-            m.dirs.get(Path::new("blocked")),
-            Some(CachedDir::Ignored)
-        ));
-        assert!(matchedf(&mut m, "blocked/second").is_ignore());
-    }
-
-    #[test]
-    fn cached_parent_matcher_is_used_for_directory() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b"));
-        wfile(td.path().join("a/b/.ignore"), "**\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, "a/b/file").is_ignore());
-        assert!(matches!(
-            m.dirs.get(Path::new("a/b")),
-            Some(CachedDir::Allowed(_))
-        ));
-        let dir = matchedd(&mut m, "a/b");
-        assert!(dir.is_none());
-        assert!(dir.should_descend());
-    }
-
-    // Like `compiled_matchers_are_reused`, but with multiple roots.
-    #[test]
-    fn compiled_multi_matchers_are_reused() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c"));
-
-        wfile(td.path().join("a/.ignore"), "*.tmp\n");
-        let mut mats = matchers(&builders([
-            td.path().join("a/b"),
-            td.path().join("a/b/c"),
-        ]));
-        assert!(matchedf(&mut mats[0], "first.tmp").is_ignore());
-        assert!(matchedf(&mut mats[0], "c/first.tmp").is_ignore());
-
-        // Even though we haven't used the second matcher, it should still
-        // reuse the `a/.ignore` above. If it didn't, then `a/b/c/first.tmp`
-        // below would be whitelisted.
-        wfile(td.path().join("a/.ignore"), "!*.tmp\n");
-        assert!(matchedf(&mut mats[1], "first.tmp").is_ignore());
-    }
-
-    #[test]
-    fn compiled_multi_child_matchers_are_not_reused() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c/d/e"));
-
-        wfile(td.path().join("a/b/c/d/e/.ignore"), "*.tmp\n");
-        let mut mats = matchers(&builders([
-            td.path().join("a/b"),
-            td.path().join("a/b/c"),
-        ]));
-        // Some sanity checking first.
-        assert!(matchedf(&mut mats[0], "c/first.tmp").is_none());
-        assert!(matchedf(&mut mats[0], "c/d/first.tmp").is_none());
-        assert!(matchedf(&mut mats[0], "c/d/e/first.tmp").is_ignore());
-
-        // Now write a new ignore file at the same location as above
-        // and check that the other matcher still uses the "stale" data.
-        wfile(td.path().join("a/b/c/d/e/.ignore"), "!*.tmp\n");
-        assert!(matchedf(&mut mats[1], "first.tmp").is_none());
-        assert!(matchedf(&mut mats[1], "d/first.tmp").is_none());
-        // This is the punch line: because we didn't load `mats[1]` before
-        // changing the ignore file, it loads it here and thus this path gets
-        // whitelisted.
-        assert!(matchedf(&mut mats[1], "d/e/first.tmp").is_whitelist());
-        // ... but `mats[0]` still uses the stale gitignore matcher cached in
-        // memory!
-        assert!(matchedf(&mut mats[0], "c/d/e/first.tmp").is_ignore());
-
-        // If we rebuilder the matcher... then we force reloading and they're
-        // now consistent with one another.
-        let mut mats = matchers(&builders([
-            td.path().join("a/b"),
-            td.path().join("a/b/c"),
-        ]));
-        assert!(matchedf(&mut mats[0], "c/d/e/first.tmp").is_whitelist());
-        assert!(matchedf(&mut mats[1], "d/e/first.tmp").is_whitelist());
-    }
-
-    // Tests that even when there is an error with a glob pattern, we still
-    // respect other glob patterns that are valid.
-    #[test]
-    fn partial_errors_keep_valid_rules() {
-        let td = tmpdir();
-        let root = td.path().join("work");
-        mkdirp(&root);
-        wfile(td.path().join(".ignore"), "{bad\n*.tmp\n");
-
-        let mut builder = builder(&root);
-        builder.git_ignore(false).git_exclude(false);
-        let mut m = one_matcher(&builder);
-        let (matched, err) = m.matched_with_errors("drop.tmp", false);
-        assert!(err.is_some());
-        assert!(matched.is_ignore());
-    }
-
-    // Tests that parent rules are not respected if the matcher is configured
-    // not to do so.
-    #[test]
-    fn parent_loading_can_be_disabled() {
-        let td = tmpdir();
-        let root = td.path().join("work");
-        mkdirp(&root);
-        wfile(td.path().join(".ignore"), "parent-rule\n");
-        wfile(root.join(".ignore"), "root-rule\n");
-
-        let mut b = builder(&root);
-        b.parents(false);
-        let mut m = one_matcher(&b);
-        assert!(matchedf(&mut m, "parent-rule").is_none());
-        assert!(matchedf(&mut m, "root-rule").is_ignore());
-
-        // Sanity check that without `parents(false)`, the parent rule is
-        // respected.
-        let mut m = one_matcher(&builder(&root));
-        assert!(matchedf(&mut m, "parent-rule").is_ignore());
-        assert!(matchedf(&mut m, "root-rule").is_ignore());
-    }
-
-    // Tests that we can normalize a file path that isn't already in "normal"
-    // relative form, and then use that to match on ignore files.
-    #[test]
-    fn paths_are_relative_to_the_root() {
-        let td = tmpdir();
-        let root = td.path().join("root");
-        let outside = td.path().join("outside");
-        mkdirp(&root);
-        mkdirp(&outside);
-        wfile(root.join(".ignore"), "file\n");
-
-        let mut m = one_matcher(&builder(&root));
-        assert!(matchedd(&mut m, "").is_none());
-        assert!(matchedd(&mut m, ".").is_none());
-        assert!(matchedf(&mut m, "file").is_ignore());
-        // Doesn't work because it isn't relative to the root. It's absolute.
-        assert!(matchedf(&mut m, root.join("file")).is_none());
-        // Also doesn't work because while it's relative, it contains `..`.
-        assert!(matchedf(&mut m, "dir/../file").is_none());
-
-        let norm = m.normalize(root.join("dir/../file")).unwrap();
-        assert_eq!(norm, Path::new("file"));
-        assert!(matchedf(&mut m, "file").is_ignore());
-
-        // Doesn't normalize because its an absolute path outside of our root.
-        assert_eq!(m.normalize(outside.join("file")), None);
-    }
-
-    // Tests that two matchers in two different directories correctly interpret
-    // the same parent gitignore file.
-    #[test]
-    fn multiple_roots_keep_their_own_context() {
-        let td = tmpdir();
-        let root_a = td.path().join("a");
-        let root_b = td.path().join("b");
-        mkdirp(td.path().join(".git"));
-        mkdirp(&root_a);
-        mkdirp(&root_b);
-        wfile(td.path().join(".gitignore"), "/a/*.tmp\n/b/*.log\n");
-
-        let mut builder =
-            builders([root_a.as_path(), Path::new("-"), root_b.as_path()]);
-        builder.git_global(false);
-        let mut ms = matchers(&builder);
-        assert_eq!(ms.len(), 3);
-        assert_eq!(ms[0].root(), root_a);
-        assert_eq!(ms[1].root(), Path::new("-"));
-        assert_eq!(ms[2].root(), root_b);
-        assert!(matchedf(&mut ms[0], "drop.tmp").is_ignore());
-        assert!(matchedf(&mut ms[0], "keep.log").is_none());
-        assert!(matchedf(&mut ms[1], "anything").is_none());
-        assert_eq!(ms[1].normalize("anything"), None);
-        assert!(matchedf(&mut ms[2], "keep.tmp").is_none());
-        assert!(matchedf(&mut ms[2], "drop.log").is_ignore());
-    }
-
-    // Tests that only the exact `-` root represents standard input.
-    #[test]
-    fn dot_dash_root_is_not_stdin() {
-        let m = one_matcher(&builder("./-"));
-        assert_eq!(m.root(), Path::new("./-"));
-        assert_eq!(m.normalize("./-/file"), Some(PathBuf::from("file")));
-    }
-
-    #[test]
-    fn stdin_is_inert_with_depth_limits() {
-        let mut b = builder("-");
-        b.min_depth(Some(2));
-        let mut m = one_matcher(&b);
-        let mat = matchedf(&mut m, "file");
-        assert!(mat.is_none());
-        assert!(mat.is_within_depth());
-
-        let mut b = builder("-");
-        b.max_depth(Some(0));
-        let mut m = one_matcher(&b);
-        let mat = matchedd(&mut m, "dir");
-        assert!(mat.is_none());
-        assert!(mat.is_within_depth());
-        assert!(mat.should_descend());
-    }
-
-    // Tests that ignore matching works lexically, and doesn't accidentally
-    // resolve symbolic links.
-    #[cfg(unix)]
-    #[test]
-    fn symlink_path_stays_under_lexical_root() {
-        use std::os::unix::fs::symlink;
-
-        let td = tmpdir();
-        let root = td.path().join("root");
-        let outside = td.path().join("outside");
-        mkdirp(&root);
-        mkdirp(&outside);
-        wfile(root.join(".ignore"), "link\n");
-        wfile(outside.join("target"), "");
-        symlink(outside.join("target"), root.join("link")).unwrap();
-
-        let mut m = one_matcher(&builder(&root));
-        assert!(matchedf(&mut m, "link").is_ignore());
-    }
-
-    #[test]
-    fn depth_limits() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c/d"));
-
-        let mut b = builder(td.path());
-        b.min_depth(Some(2)).max_depth(Some(3));
-        let mut m = one_matcher(&b);
-
-        let dir = matchedd(&mut m, "a");
-        assert!(!dir.is_within_depth());
-        assert!(dir.should_descend());
-        assert!(matchedf(&mut m, "file").is_ignore());
-
-        let dir = matchedd(&mut m, "a/b");
-        assert!(dir.is_within_depth());
-        assert!(dir.should_descend());
-        assert!(!matchedf(&mut m, "a/file").is_ignore());
-
-        let dir = matchedd(&mut m, "a/b/c");
-        assert!(dir.is_within_depth());
-        assert!(!dir.should_descend());
-        assert!(!matchedf(&mut m, "a/b/file").is_ignore());
-        assert!(matchedf(&mut m, "a/b/c/file").is_ignore());
-
-        let dir = matchedd(&mut m, "a/b/c/d");
-        assert!(dir.is_ignore());
-        assert!(!dir.is_within_depth());
-        assert!(!dir.should_descend());
-        assert!(matchedf(&mut m, "a/b/c/d/file").is_ignore());
-    }
-
-    #[test]
-    fn depth_limits_apply_to_root() {
-        let td = tmpdir();
-
-        let mut b = builder(td.path());
-        b.min_depth(Some(1));
-        let mut m = one_matcher(&b);
-        for path in ["", "."] {
-            let root = matchedd(&mut m, path);
-            assert!(root.is_none());
-            assert!(!root.is_within_depth());
-            assert!(root.should_descend());
-        }
-
-        let mut b = builder(td.path());
-        b.max_depth(Some(0));
-        let mut m = one_matcher(&b);
-        for path in ["", "."] {
-            let root = matchedd(&mut m, path);
-            assert!(root.is_none());
-            assert!(root.is_within_depth());
-            assert!(!root.should_descend());
-        }
-    }
-
-    #[test]
-    fn max_filesize() {
-        let td = tmpdir();
-        mkdirp(td.path().join("dir"));
-        wfile(td.path().join("empty"), "");
-        wfile(td.path().join("at-limit"), "12345");
-        wfile(td.path().join("over-limit"), "123456");
-
-        let mut b = builder(td.path());
-        b.max_filesize(Some(5));
-        let mut m = one_matcher(&b);
-
-        assert!(matchedf(&mut m, "empty").is_none());
-        assert!(matchedf(&mut m, "at-limit").is_none());
-        assert!(matchedf(&mut m, "over-limit").is_ignore());
-
-        let dir = matchedd(&mut m, "dir");
-        assert!(dir.is_none());
-        assert!(dir.should_descend());
-    }
-
-    #[test]
-    fn max_filesize_does_not_stat_ignored_file() {
-        let td = tmpdir();
-        wfile(td.path().join(".ignore"), "ignored\n");
-
-        let mut b = builder(td.path());
-        b.max_filesize(Some(0));
-        let mut m = one_matcher(&b);
-        let (mat, err) = m.matched_with_errors("ignored", false);
-        assert!(mat.is_ignore());
-        assert!(err.is_none(), "ignored missing file was statted: {err:?}");
-    }
-
-    #[cfg(unix)]
-    #[test]
-    fn max_filesize_respects_follow_links() {
-        use std::os::unix::fs::symlink;
-
-        let td = tmpdir();
-        wfile(
-            td.path().join("target"),
-            "target contents are much longer than the size limit",
-        );
-        symlink("target", td.path().join("link")).unwrap();
-
-        let mut b = builder(td.path());
-        b.max_filesize(Some(10));
-        let mut m = one_matcher(&b);
-        assert!(matchedf(&mut m, "link").is_none());
-
-        b.follow_links(true);
-        let mut m = one_matcher(&b);
-        assert!(matchedf(&mut m, "link").is_ignore());
-    }
-
-    #[test]
-    fn hidden_files_and_directories() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".hidden-dir"));
-        mkdirp(td.path().join("visible-dir"));
-        wfile(td.path().join(".hidden-file"), "");
-        wfile(td.path().join("visible-file"), "");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, ".hidden-file").is_ignore());
-        let dir = matchedd(&mut m, ".hidden-dir");
-        assert!(dir.is_ignore());
-        assert!(!dir.should_descend());
-        assert!(matchedf(&mut m, "visible-file").is_none());
-        let dir = matchedd(&mut m, "visible-dir");
-        assert!(dir.is_none());
-        assert!(dir.should_descend());
-
-        let mut b = builder(td.path());
-        b.hidden(false);
-        let mut m = one_matcher(&b);
-        assert!(matchedf(&mut m, ".hidden-file").is_none());
-        let dir = matchedd(&mut m, ".hidden-dir");
-        assert!(dir.is_none());
-        assert!(dir.should_descend());
-    }
-
-    #[test]
-    fn gitignore_whitelist_overrides_hidden_filter() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join(".hidden-dir"));
-        wfile(td.path().join(".hidden-file"), "");
-        wfile(td.path().join(".gitignore"), "!.hidden-file\n!.hidden-dir/\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, ".hidden-file").is_whitelist());
-        let dir = matchedd(&mut m, ".hidden-dir");
-        assert!(dir.is_whitelist());
-        assert!(dir.should_descend());
-    }
-
-    #[test]
-    fn descendants_of_hidden_directories_are_ignored() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join(".hidden/nested"));
-        mkdirp(td.path().join("visible/.hidden"));
-        wfile(td.path().join(".hidden/file"), "");
-        wfile(td.path().join(".hidden/nested/file"), "");
-        wfile(td.path().join("visible/.hidden/file"), "");
-        wfile(td.path().join(".hidden/.gitignore"), "!file\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        assert!(matchedf(&mut m, ".hidden/file").is_ignore());
-        assert!(matchedf(&mut m, ".hidden/nested/file").is_ignore());
-        assert!(matchedf(&mut m, "visible/.hidden/file").is_ignore());
-    }
-
-    #[test]
-    fn whitelisted_hidden_directory_allows_descendants() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join(".hidden"));
-        wfile(td.path().join(".hidden/file"), "");
-        wfile(td.path().join(".gitignore"), "!.hidden/\n");
-
-        let mut m = one_matcher(&builder(td.path()));
-        let dir = matchedd(&mut m, ".hidden");
-        assert!(dir.is_whitelist());
-        assert!(dir.should_descend());
-        assert!(matchedf(&mut m, ".hidden/file").is_none());
-    }
-
-    #[test]
-    fn hidden_directories_outside_depth_limits() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/.hidden"));
-
-        let mut b = builder(td.path());
-        b.min_depth(Some(3));
-        let mut m = one_matcher(&b);
-        let dir = matchedd(&mut m, "a/.hidden");
-        assert!(dir.is_ignore());
-        assert!(!dir.is_within_depth());
-
-        let mut b = builder(td.path());
-        b.max_depth(Some(1));
-        let mut m = one_matcher(&b);
-        let dir = matchedd(&mut m, "a/.hidden");
-        assert!(dir.is_ignore());
-        assert!(!dir.is_within_depth());
-    }
-}
diff --git a/crates/ignore/src/lib.rs b/crates/ignore/src/lib.rs
deleted file mode 100644
index b9c9a3ece..000000000
--- a/crates/ignore/src/lib.rs
+++ /dev/null
@@ -1,549 +0,0 @@
-/*!
-The ignore crate provides a fast recursive directory iterator that respects
-various filters such as globs, file types and `.gitignore` files. The precise
-matching rules and precedence is explained in the documentation for
-`WalkBuilder`.
-
-Secondarily, this crate exposes gitignore and file type matchers for use cases
-that demand more fine-grained control.
-
-# Example
-
-This example shows the most basic usage of this crate. This code will
-recursively traverse the current directory while automatically filtering out
-files and directories according to ignore globs found in files like
-`.ignore` and `.gitignore`:
-
-
-```rust,no_run
-use ignore::Walk;
-
-for result in Walk::new("./") {
-    // Each item yielded by the iterator is either a directory entry or an
-    // error, so either print the path or the error.
-    match result {
-        Ok(entry) => println!("{}", entry.path().display()),
-        Err(err) => println!("ERROR: {}", err),
-    }
-}
-```
-
-# Example: advanced
-
-By default, the recursive directory iterator will ignore hidden files and
-directories. This can be disabled by building the iterator with `WalkBuilder`:
-
-```rust,no_run
-use ignore::WalkBuilder;
-
-for result in WalkBuilder::new("./").hidden(false).build() {
-    println!("{:?}", result);
-}
-```
-
-See the documentation for `WalkBuilder` for many other options.
-*/
-
-#![deny(missing_docs)]
-
-use std::path::{Path, PathBuf};
-
-pub use crate::incremental::{IncrementalIgnore, IncrementalMatch};
-pub use crate::walk::{
-    DirEntry, ParallelVisitor, ParallelVisitorBuilder, Walk, WalkBuilder,
-    WalkParallel, WalkState,
-};
-
-mod default_types;
-mod dir;
-pub mod gitignore;
-mod incremental;
-pub mod overrides;
-mod pathutil;
-pub mod types;
-mod walk;
-
-/// Represents an error that can occur when parsing a gitignore file.
-#[derive(Debug)]
-pub enum Error {
-    /// A collection of "soft" errors. These occur when adding an ignore
-    /// file partially succeeded.
-    Partial(Vec<Error>),
-    /// An error associated with a specific line number.
-    WithLineNumber {
-        /// The line number.
-        line: u64,
-        /// The underlying error.
-        err: Box<Error>,
-    },
-    /// An error associated with a particular file path.
-    WithPath {
-        /// The file path.
-        path: PathBuf,
-        /// The underlying error.
-        err: Box<Error>,
-    },
-    /// An error associated with a particular directory depth when recursively
-    /// walking a directory.
-    WithDepth {
-        /// The directory depth.
-        depth: usize,
-        /// The underlying error.
-        err: Box<Error>,
-    },
-    /// An error that occurs when a file loop is detected when traversing
-    /// symbolic links.
-    Loop {
-        /// The ancestor file path in the loop.
-        ancestor: PathBuf,
-        /// The child file path in the loop.
-        child: PathBuf,
-    },
-    /// An error that occurs when doing I/O, such as reading an ignore file.
-    Io(std::io::Error),
-    /// An error that occurs when trying to parse a glob.
-    Glob {
-        /// The original glob that caused this error. This glob, when
-        /// available, always corresponds to the glob provided by an end user.
-        /// e.g., It is the glob as written in a `.gitignore` file.
-        ///
-        /// (This glob may be distinct from the glob that is actually
-        /// compiled, after accounting for `gitignore` semantics.)
-        glob: Option<String>,
-        /// The underlying glob error as a string.
-        err: String,
-    },
-    /// A type selection for a file type that is not defined.
-    UnrecognizedFileType(String),
-    /// A user specified file type definition could not be parsed.
-    InvalidDefinition,
-}
-
-impl Clone for Error {
-    fn clone(&self) -> Error {
-        match *self {
-            Error::Partial(ref errs) => Error::Partial(errs.clone()),
-            Error::WithLineNumber { line, ref err } => {
-                Error::WithLineNumber { line, err: err.clone() }
-            }
-            Error::WithPath { ref path, ref err } => {
-                Error::WithPath { path: path.clone(), err: err.clone() }
-            }
-            Error::WithDepth { depth, ref err } => {
-                Error::WithDepth { depth, err: err.clone() }
-            }
-            Error::Loop { ref ancestor, ref child } => Error::Loop {
-                ancestor: ancestor.clone(),
-                child: child.clone(),
-            },
-            Error::Io(ref err) => match err.raw_os_error() {
-                Some(e) => Error::Io(std::io::Error::from_raw_os_error(e)),
-                None => {
-                    Error::Io(std::io::Error::new(err.kind(), err.to_string()))
-                }
-            },
-            Error::Glob { ref glob, ref err } => {
-                Error::Glob { glob: glob.clone(), err: err.clone() }
-            }
-            Error::UnrecognizedFileType(ref err) => {
-                Error::UnrecognizedFileType(err.clone())
-            }
-            Error::InvalidDefinition => Error::InvalidDefinition,
-        }
-    }
-}
-
-impl Error {
-    /// Returns true if this is a partial error.
-    ///
-    /// A partial error occurs when only some operations failed while others
-    /// may have succeeded. For example, an ignore file may contain an invalid
-    /// glob among otherwise valid globs.
-    pub fn is_partial(&self) -> bool {
-        match *self {
-            Error::Partial(_) => true,
-            Error::WithLineNumber { ref err, .. } => err.is_partial(),
-            Error::WithPath { ref err, .. } => err.is_partial(),
-            Error::WithDepth { ref err, .. } => err.is_partial(),
-            _ => false,
-        }
-    }
-
-    /// Returns true if this error is exclusively an I/O error.
-    pub fn is_io(&self) -> bool {
-        match *self {
-            Error::Partial(ref errs) => errs.len() == 1 && errs[0].is_io(),
-            Error::WithLineNumber { ref err, .. } => err.is_io(),
-            Error::WithPath { ref err, .. } => err.is_io(),
-            Error::WithDepth { ref err, .. } => err.is_io(),
-            Error::Loop { .. } => false,
-            Error::Io(_) => true,
-            Error::Glob { .. } => false,
-            Error::UnrecognizedFileType(_) => false,
-            Error::InvalidDefinition => false,
-        }
-    }
-
-    /// Inspect the original [`std::io::Error`] if there is one.
-    ///
-    /// [`None`] is returned if the [`Error`] doesn't correspond to an
-    /// [`std::io::Error`]. This might happen, for example, when the error was
-    /// produced because a cycle was found in the directory tree while
-    /// following symbolic links.
-    ///
-    /// This method returns a borrowed value that is bound to the lifetime of the [`Error`]. To
-    /// obtain an owned value, the [`into_io_error`] can be used instead.
-    ///
-    /// > This is the original [`std::io::Error`] and is _not_ the same as
-    /// > [`impl From<Error> for std::io::Error`][impl] which contains
-    /// > additional context about the error.
-    ///
-    /// [`None`]: https://doc.rust-lang.org/stable/std/option/enum.Option.html#variant.None
-    /// [`std::io::Error`]: https://doc.rust-lang.org/stable/std/io/struct.Error.html
-    /// [`From`]: https://doc.rust-lang.org/stable/std/convert/trait.From.html
-    /// [`Error`]: struct.Error.html
-    /// [`into_io_error`]: struct.Error.html#method.into_io_error
-    /// [impl]: struct.Error.html#impl-From%3CError%3E
-    pub fn io_error(&self) -> Option<&std::io::Error> {
-        match *self {
-            Error::Partial(ref errs) => {
-                if errs.len() == 1 {
-                    errs[0].io_error()
-                } else {
-                    None
-                }
-            }
-            Error::WithLineNumber { ref err, .. } => err.io_error(),
-            Error::WithPath { ref err, .. } => err.io_error(),
-            Error::WithDepth { ref err, .. } => err.io_error(),
-            Error::Loop { .. } => None,
-            Error::Io(ref err) => Some(err),
-            Error::Glob { .. } => None,
-            Error::UnrecognizedFileType(_) => None,
-            Error::InvalidDefinition => None,
-        }
-    }
-
-    /// Similar to [`io_error`] except consumes self to convert to the original
-    /// [`std::io::Error`] if one exists.
-    ///
-    /// [`io_error`]: struct.Error.html#method.io_error
-    /// [`std::io::Error`]: https://doc.rust-lang.org/stable/std/io/struct.Error.html
-    pub fn into_io_error(self) -> Option<std::io::Error> {
-        match self {
-            Error::Partial(mut errs) => {
-                if errs.len() == 1 {
-                    errs.remove(0).into_io_error()
-                } else {
-                    None
-                }
-            }
-            Error::WithLineNumber { err, .. } => err.into_io_error(),
-            Error::WithPath { err, .. } => err.into_io_error(),
-            Error::WithDepth { err, .. } => err.into_io_error(),
-            Error::Loop { .. } => None,
-            Error::Io(err) => Some(err),
-            Error::Glob { .. } => None,
-            Error::UnrecognizedFileType(_) => None,
-            Error::InvalidDefinition => None,
-        }
-    }
-
-    /// Returns a depth associated with recursively walking a directory (if
-    /// this error was generated from a recursive directory iterator).
-    pub fn depth(&self) -> Option<usize> {
-        match *self {
-            Error::WithPath { ref err, .. } => err.depth(),
-            Error::WithDepth { depth, .. } => Some(depth),
-            _ => None,
-        }
-    }
-
-    /// Turn an error into a tagged error with the given file path.
-    fn with_path<P: AsRef<Path>>(self, path: P) -> Error {
-        Error::WithPath {
-            path: path.as_ref().to_path_buf(),
-            err: Box::new(self),
-        }
-    }
-
-    /// Turn an error into a tagged error with the given depth.
-    fn with_depth(self, depth: usize) -> Error {
-        Error::WithDepth { depth, err: Box::new(self) }
-    }
-
-    /// Turn an error into a tagged error with the given file path and line
-    /// number. If path is empty, then it is omitted from the error.
-    fn tagged<P: AsRef<Path>>(self, path: P, lineno: u64) -> Error {
-        let errline =
-            Error::WithLineNumber { line: lineno, err: Box::new(self) };
-        if path.as_ref().as_os_str().is_empty() {
-            return errline;
-        }
-        errline.with_path(path)
-    }
-
-    /// Build an error from a walkdir error.
-    fn from_walkdir(err: walkdir::Error) -> Error {
-        let depth = err.depth();
-        if let (Some(anc), Some(child)) = (err.loop_ancestor(), err.path()) {
-            return Error::WithDepth {
-                depth,
-                err: Box::new(Error::Loop {
-                    ancestor: anc.to_path_buf(),
-                    child: child.to_path_buf(),
-                }),
-            };
-        }
-        let path = err.path().map(|p| p.to_path_buf());
-        let mut ig_err = Error::WithDepth {
-            depth,
-            err: Box::new(Error::Io(std::io::Error::from(err))),
-        };
-        if let Some(path) = path {
-            ig_err = Error::WithPath { path, err: Box::new(ig_err) };
-        }
-        ig_err
-    }
-}
-
-impl std::error::Error for Error {
-    #[allow(deprecated)]
-    fn description(&self) -> &str {
-        match *self {
-            Error::Partial(_) => "partial error",
-            Error::WithLineNumber { ref err, .. } => err.description(),
-            Error::WithPath { ref err, .. } => err.description(),
-            Error::WithDepth { ref err, .. } => err.description(),
-            Error::Loop { .. } => "file system loop found",
-            Error::Io(ref err) => err.description(),
-            Error::Glob { ref err, .. } => err,
-            Error::UnrecognizedFileType(_) => "unrecognized file type",
-            Error::InvalidDefinition => "invalid definition",
-        }
-    }
-}
-
-impl std::fmt::Display for Error {
-    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
-        match *self {
-            Error::Partial(ref errs) => {
-                let msgs: Vec<String> =
-                    errs.iter().map(|err| err.to_string()).collect();
-                write!(f, "{}", msgs.join("\n"))
-            }
-            Error::WithLineNumber { line, ref err } => {
-                write!(f, "line {}: {}", line, err)
-            }
-            Error::WithPath { ref path, ref err } => {
-                write!(f, "{}: {}", path.display(), err)
-            }
-            Error::WithDepth { ref err, .. } => err.fmt(f),
-            Error::Loop { ref ancestor, ref child } => write!(
-                f,
-                "File system loop found: \
-                           {} points to an ancestor {}",
-                child.display(),
-                ancestor.display()
-            ),
-            Error::Io(ref err) => err.fmt(f),
-            Error::Glob { glob: None, ref err } => write!(f, "{}", err),
-            Error::Glob { glob: Some(ref glob), ref err } => {
-                write!(f, "error parsing glob '{}': {}", glob, err)
-            }
-            Error::UnrecognizedFileType(ref ty) => {
-                write!(f, "unrecognized file type: {}", ty)
-            }
-            Error::InvalidDefinition => write!(
-                f,
-                "invalid definition (format is type:glob, e.g., \
-                           html:*.html)"
-            ),
-        }
-    }
-}
-
-impl From<std::io::Error> for Error {
-    fn from(err: std::io::Error) -> Error {
-        Error::Io(err)
-    }
-}
-
-#[derive(Debug, Default)]
-struct PartialErrorBuilder(Vec<Error>);
-
-impl PartialErrorBuilder {
-    fn push(&mut self, err: Error) {
-        self.0.push(err);
-    }
-
-    fn push_ignore_io(&mut self, err: Error) {
-        if !err.is_io() {
-            self.push(err);
-        }
-    }
-
-    fn maybe_push(&mut self, err: Option<Error>) {
-        if let Some(err) = err {
-            self.push(err);
-        }
-    }
-
-    fn maybe_push_ignore_io(&mut self, err: Option<Error>) {
-        if let Some(err) = err {
-            self.push_ignore_io(err);
-        }
-    }
-
-    fn into_error_option(mut self) -> Option<Error> {
-        if self.0.is_empty() {
-            None
-        } else if self.0.len() == 1 {
-            Some(self.0.pop().unwrap())
-        } else {
-            Some(Error::Partial(self.0))
-        }
-    }
-}
-
-/// The result of a glob match.
-///
-/// The type parameter `T` typically refers to a type that provides more
-/// information about a particular match. For example, it might identify
-/// the specific gitignore file and the specific glob pattern that caused
-/// the match.
-#[derive(Clone, Debug)]
-pub enum Match<T> {
-    /// The path didn't match any glob.
-    None,
-    /// The highest precedent glob matched indicates the path should be
-    /// ignored.
-    Ignore(T),
-    /// The highest precedent glob matched indicates the path should be
-    /// whitelisted.
-    Whitelist(T),
-}
-
-impl<T> Match<T> {
-    /// Returns true if the match result didn't match any globs.
-    pub fn is_none(&self) -> bool {
-        match *self {
-            Match::None => true,
-            Match::Ignore(_) | Match::Whitelist(_) => false,
-        }
-    }
-
-    /// Returns true if the match result implies the path should be ignored.
-    pub fn is_ignore(&self) -> bool {
-        match *self {
-            Match::Ignore(_) => true,
-            Match::None | Match::Whitelist(_) => false,
-        }
-    }
-
-    /// Returns true if the match result implies the path should be
-    /// whitelisted.
-    pub fn is_whitelist(&self) -> bool {
-        match *self {
-            Match::Whitelist(_) => true,
-            Match::None | Match::Ignore(_) => false,
-        }
-    }
-
-    /// Inverts the match so that `Ignore` becomes `Whitelist` and
-    /// `Whitelist` becomes `Ignore`. A non-match remains the same.
-    pub fn invert(self) -> Match<T> {
-        match self {
-            Match::None => Match::None,
-            Match::Ignore(t) => Match::Whitelist(t),
-            Match::Whitelist(t) => Match::Ignore(t),
-        }
-    }
-
-    /// Return the value inside this match if it exists.
-    pub fn inner(&self) -> Option<&T> {
-        match *self {
-            Match::None => None,
-            Match::Ignore(ref t) => Some(t),
-            Match::Whitelist(ref t) => Some(t),
-        }
-    }
-
-    /// Apply the given function to the value inside this match.
-    ///
-    /// If the match has no value, then return the match unchanged.
-    pub fn map<U, F: FnOnce(T) -> U>(self, f: F) -> Match<U> {
-        match self {
-            Match::None => Match::None,
-            Match::Ignore(t) => Match::Ignore(f(t)),
-            Match::Whitelist(t) => Match::Whitelist(f(t)),
-        }
-    }
-
-    /// Return the match if it is not none. Otherwise, return other.
-    pub fn or(self, other: Self) -> Self {
-        if self.is_none() { other } else { self }
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use std::{
-        env, fs,
-        path::{Path, PathBuf},
-    };
-
-    /// A convenient result type alias.
-    pub(crate) type Result<T> =
-        std::result::Result<T, Box<dyn std::error::Error + Send + Sync>>;
-
-    macro_rules! err {
-        ($($tt:tt)*) => {
-            Box::<dyn std::error::Error + Send + Sync>::from(format!($($tt)*))
-        }
-    }
-
-    /// A simple wrapper for creating a temporary directory that is
-    /// automatically deleted when it's dropped.
-    ///
-    /// We use this in lieu of tempfile because tempfile brings in too many
-    /// dependencies.
-    #[derive(Debug)]
-    pub struct TempDir(PathBuf);
-
-    impl Drop for TempDir {
-        fn drop(&mut self) {
-            fs::remove_dir_all(&self.0).unwrap();
-        }
-    }
-
-    impl TempDir {
-        /// Create a new empty temporary directory under the system's configured
-        /// temporary directory.
-        pub fn new() -> Result<TempDir> {
-            use std::sync::atomic::{AtomicUsize, Ordering};
-
-            static TRIES: usize = 100;
-            static COUNTER: AtomicUsize = AtomicUsize::new(0);
-
-            let tmpdir = env::temp_dir();
-            for _ in 0..TRIES {
-                let count = COUNTER.fetch_add(1, Ordering::Relaxed);
-                let path = tmpdir.join("rust-ignore").join(count.to_string());
-                if path.is_dir() {
-                    continue;
-                }
-                fs::create_dir_all(&path).map_err(|e| {
-                    err!("failed to create {}: {}", path.display(), e)
-                })?;
-                return Ok(TempDir(path));
-            }
-            Err(err!("failed to create temp dir after {} tries", TRIES))
-        }
-
-        /// Return the underlying path to this temporary directory.
-        pub fn path(&self) -> &Path {
-            &self.0
-        }
-    }
-}
diff --git a/crates/ignore/src/overrides.rs b/crates/ignore/src/overrides.rs
deleted file mode 100644
index 005cae8f2..000000000
--- a/crates/ignore/src/overrides.rs
+++ /dev/null
@@ -1,293 +0,0 @@
-/*!
-The overrides module provides a way to specify a set of override globs.
-
-This provides functionality similar to `--include` or `--exclude` in command
-line tools.
-*/
-
-use std::path::Path;
-
-use crate::{
-    Error, Match,
-    gitignore::{self, Gitignore, GitignoreBuilder},
-};
-
-/// Glob represents a single glob in an override matcher.
-///
-/// This is used to report information about the highest precedent glob
-/// that matched.
-///
-/// Note that not all matches necessarily correspond to a specific glob. For
-/// example, if there are one or more whitelist globs and a file path doesn't
-/// match any glob in the set, then the file path is considered to be ignored.
-///
-/// The lifetime `'a` refers to the lifetime of the matcher that produced
-/// this glob.
-#[derive(Clone, Debug)]
-#[allow(dead_code)]
-pub struct Glob<'a>(GlobInner<'a>);
-
-#[derive(Clone, Debug)]
-#[allow(dead_code)]
-enum GlobInner<'a> {
-    /// No glob matched, but the file path should still be ignored.
-    UnmatchedIgnore,
-    /// A glob matched.
-    Matched(&'a gitignore::Glob),
-}
-
-impl<'a> Glob<'a> {
-    fn unmatched() -> Glob<'a> {
-        Glob(GlobInner::UnmatchedIgnore)
-    }
-}
-
-/// Manages a set of overrides provided explicitly by the end user.
-#[derive(Clone, Debug)]
-pub struct Override(Gitignore);
-
-impl Override {
-    /// Returns an empty matcher that never matches any file path.
-    pub fn empty() -> Override {
-        Override(Gitignore::empty())
-    }
-
-    /// Returns the directory of this override set.
-    ///
-    /// All matches are done relative to this path.
-    pub fn path(&self) -> &Path {
-        self.0.path()
-    }
-
-    /// Returns true if and only if this matcher is empty.
-    ///
-    /// When a matcher is empty, it will never match any file path.
-    pub fn is_empty(&self) -> bool {
-        self.0.is_empty()
-    }
-
-    /// Returns the total number of ignore globs.
-    pub fn num_ignores(&self) -> u64 {
-        self.0.num_whitelists()
-    }
-
-    /// Returns the total number of whitelisted globs.
-    pub fn num_whitelists(&self) -> u64 {
-        self.0.num_ignores()
-    }
-
-    /// Returns whether the given file path matched a pattern in this override
-    /// matcher.
-    ///
-    /// `is_dir` should be true if the path refers to a directory and false
-    /// otherwise.
-    ///
-    /// If there are no overrides, then this always returns `Match::None`.
-    ///
-    /// If there is at least one whitelist override and `is_dir` is false, then
-    /// this never returns `Match::None`, since non-matches are interpreted as
-    /// ignored.
-    ///
-    /// The given path is matched to the globs relative to the path given
-    /// when building the override matcher. Specifically, before matching
-    /// `path`, its prefix (as determined by a common suffix of the directory
-    /// given) is stripped. If there is no common suffix/prefix overlap, then
-    /// `path` is assumed to reside in the same directory as the root path for
-    /// this set of overrides.
-    pub fn matched<'a, P: AsRef<Path>>(
-        &'a self,
-        path: P,
-        is_dir: bool,
-    ) -> Match<Glob<'a>> {
-        if self.is_empty() {
-            return Match::None;
-        }
-        let mat = self.0.matched(path, is_dir).invert();
-        if mat.is_none() && self.num_whitelists() > 0 && !is_dir {
-            return Match::Ignore(Glob::unmatched());
-        }
-        mat.map(move |giglob| Glob(GlobInner::Matched(giglob)))
-    }
-}
-
-/// Builds a matcher for a set of glob overrides.
-#[derive(Clone, Debug)]
-pub struct OverrideBuilder {
-    builder: GitignoreBuilder,
-}
-
-impl OverrideBuilder {
-    /// Create a new override builder.
-    ///
-    /// Matching is done relative to the directory path provided.
-    pub fn new<P: AsRef<Path>>(path: P) -> OverrideBuilder {
-        let mut builder = GitignoreBuilder::new(path);
-        builder.allow_unclosed_class(false);
-        OverrideBuilder { builder }
-    }
-
-    /// Builds a new override matcher from the globs added so far.
-    ///
-    /// Once a matcher is built, no new globs can be added to it.
-    pub fn build(&self) -> Result<Override, Error> {
-        Ok(Override(self.builder.build()?))
-    }
-
-    /// Add a glob to the set of overrides.
-    ///
-    /// Globs provided here have precisely the same semantics as a single
-    /// line in a `gitignore` file, where the meaning of `!` is inverted:
-    /// namely, `!` at the beginning of a glob will ignore a file. Without `!`,
-    /// all matches of the glob provided are treated as whitelist matches.
-    pub fn add(&mut self, glob: &str) -> Result<&mut OverrideBuilder, Error> {
-        self.builder.add_line(None, glob)?;
-        Ok(self)
-    }
-
-    /// Toggle whether the globs should be matched case insensitively or not.
-    ///
-    /// When this option is changed, only globs added after the change will be
-    /// affected.
-    ///
-    /// This is disabled by default.
-    pub fn case_insensitive(
-        &mut self,
-        yes: bool,
-    ) -> Result<&mut OverrideBuilder, Error> {
-        // TODO: This should not return a `Result`. Fix this in the next semver
-        // release.
-        self.builder.case_insensitive(yes)?;
-        Ok(self)
-    }
-
-    /// Toggle whether unclosed character classes are allowed. When allowed,
-    /// a `[` without a matching `]` is treated literally instead of resulting
-    /// in a parse error.
-    ///
-    /// For example, if this is set then the glob `[abc` will be treated as the
-    /// literal string `[abc` instead of returning an error.
-    ///
-    /// By default, this is false. Generally speaking, enabling this leads to
-    /// worse failure modes since the glob parser becomes more permissive. You
-    /// might want to enable this when compatibility (e.g., with POSIX glob
-    /// implementations) is more important than good error messages.
-    ///
-    /// This default is different from the default for [`Gitignore`]. Namely,
-    /// [`Gitignore`] is intended to match git's behavior as-is. But this
-    /// abstraction for "override" globs does not necessarily conform to any
-    /// other known specification and instead prioritizes better error
-    /// messages.
-    pub fn allow_unclosed_class(&mut self, yes: bool) -> &mut OverrideBuilder {
-        self.builder.allow_unclosed_class(yes);
-        self
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::{Override, OverrideBuilder};
-
-    const ROOT: &'static str = "/home/andrew/foo";
-
-    fn ov(globs: &[&str]) -> Override {
-        let mut builder = OverrideBuilder::new(ROOT);
-        for glob in globs {
-            builder.add(glob).unwrap();
-        }
-        builder.build().unwrap()
-    }
-
-    #[test]
-    fn empty() {
-        let ov = ov(&[]);
-        assert!(ov.matched("a.foo", false).is_none());
-        assert!(ov.matched("a", false).is_none());
-        assert!(ov.matched("", false).is_none());
-    }
-
-    #[test]
-    fn simple() {
-        let ov = ov(&["*.foo", "!*.bar"]);
-        assert!(ov.matched("a.foo", false).is_whitelist());
-        assert!(ov.matched("a.foo", true).is_whitelist());
-        assert!(ov.matched("a.rs", false).is_ignore());
-        assert!(ov.matched("a.rs", true).is_none());
-        assert!(ov.matched("a.bar", false).is_ignore());
-        assert!(ov.matched("a.bar", true).is_ignore());
-    }
-
-    #[test]
-    fn only_ignores() {
-        let ov = ov(&["!*.bar"]);
-        assert!(ov.matched("a.rs", false).is_none());
-        assert!(ov.matched("a.rs", true).is_none());
-        assert!(ov.matched("a.bar", false).is_ignore());
-        assert!(ov.matched("a.bar", true).is_ignore());
-    }
-
-    #[test]
-    fn precedence() {
-        let ov = ov(&["*.foo", "!*.bar.foo"]);
-        assert!(ov.matched("a.foo", false).is_whitelist());
-        assert!(ov.matched("a.baz", false).is_ignore());
-        assert!(ov.matched("a.bar.foo", false).is_ignore());
-    }
-
-    #[test]
-    fn gitignore() {
-        let ov = ov(&["/foo", "bar/*.rs", "baz/**"]);
-        assert!(ov.matched("bar/lib.rs", false).is_whitelist());
-        assert!(ov.matched("bar/wat/lib.rs", false).is_ignore());
-        assert!(ov.matched("wat/bar/lib.rs", false).is_ignore());
-        assert!(ov.matched("foo", false).is_whitelist());
-        assert!(ov.matched("wat/foo", false).is_ignore());
-        assert!(ov.matched("baz", false).is_ignore());
-        assert!(ov.matched("baz/a", false).is_whitelist());
-        assert!(ov.matched("baz/a/b", false).is_whitelist());
-    }
-
-    #[test]
-    fn allow_directories() {
-        // This tests that directories are NOT ignored when they are unmatched.
-        let ov = ov(&["*.rs"]);
-        assert!(ov.matched("foo.rs", false).is_whitelist());
-        assert!(ov.matched("foo.c", false).is_ignore());
-        assert!(ov.matched("foo", false).is_ignore());
-        assert!(ov.matched("foo", true).is_none());
-        assert!(ov.matched("src/foo.rs", false).is_whitelist());
-        assert!(ov.matched("src/foo.c", false).is_ignore());
-        assert!(ov.matched("src/foo", false).is_ignore());
-        assert!(ov.matched("src/foo", true).is_none());
-    }
-
-    #[test]
-    fn absolute_path() {
-        let ov = ov(&["!/bar"]);
-        assert!(ov.matched("./foo/bar", false).is_none());
-    }
-
-    #[test]
-    fn case_insensitive() {
-        let ov = OverrideBuilder::new(ROOT)
-            .case_insensitive(true)
-            .unwrap()
-            .add("*.html")
-            .unwrap()
-            .build()
-            .unwrap();
-        assert!(ov.matched("foo.html", false).is_whitelist());
-        assert!(ov.matched("foo.HTML", false).is_whitelist());
-        assert!(ov.matched("foo.htm", false).is_ignore());
-        assert!(ov.matched("foo.HTM", false).is_ignore());
-    }
-
-    #[test]
-    fn default_case_sensitive() {
-        let ov =
-            OverrideBuilder::new(ROOT).add("*.html").unwrap().build().unwrap();
-        assert!(ov.matched("foo.html", false).is_whitelist());
-        assert!(ov.matched("foo.HTML", false).is_ignore());
-        assert!(ov.matched("foo.htm", false).is_ignore());
-        assert!(ov.matched("foo.HTM", false).is_ignore());
-    }
-}
diff --git a/crates/ignore/src/pathutil.rs b/crates/ignore/src/pathutil.rs
deleted file mode 100644
index 5de8c106c..000000000
--- a/crates/ignore/src/pathutil.rs
+++ /dev/null
@@ -1,171 +0,0 @@
-use std::{ffi::OsStr, path::Path};
-
-use crate::walk::DirEntry;
-
-/// Returns true if and only if this path is considered to be hidden.
-///
-/// # Platform behavior
-///
-/// ## Windows
-///
-/// This returns true if one of the following is true:
-///
-/// * The base name of the path starts with a `.`.
-/// * The file attributes have the `HIDDEN` property set.
-///
-/// ## All other platforms
-///
-/// This only returns true if the base name of the path starts with a `.`.
-pub(crate) fn is_hidden_path(dent: &Path) -> bool {
-    #[cfg(not(windows))]
-    fn imp(path: &Path) -> bool {
-        is_hidden_path_only(path)
-    }
-
-    #[cfg(windows)]
-    fn imp(path: &Path) -> bool {
-        use std::os::windows::fs::MetadataExt;
-        use winapi_util::file;
-
-        if let Ok(md) = path.metadata() {
-            if file::is_hidden(md.file_attributes() as u64) {
-                return true;
-            }
-        }
-        is_hidden_path_only(path)
-    }
-
-    imp(dent)
-}
-
-/// Returns true if and only if this directory entry is considered to be
-/// hidden.
-///
-/// # Platform behavior
-///
-/// ## Windows
-///
-/// This returns true if one of the following is true:
-///
-/// * The base name of the path starts with a `.`.
-/// * The file attributes have the `HIDDEN` property set.
-///
-/// ## All other platforms
-///
-/// This only returns true if the base name of the path starts with a `.`.
-pub(crate) fn is_hidden_entry(dent: &DirEntry) -> bool {
-    #[cfg(not(windows))]
-    fn imp(dent: &DirEntry) -> bool {
-        is_hidden_path_only(dent.path())
-    }
-
-    #[cfg(windows)]
-    fn imp(dent: &DirEntry) -> bool {
-        use std::os::windows::fs::MetadataExt;
-        use winapi_util::file;
-
-        // This looks like we're doing an extra stat call, but on Windows, the
-        // directory traverser reuses the metadata retrieved from each directory
-        // entry and stores it on the DirEntry itself. So this is "free."
-        if let Ok(md) = dent.metadata() {
-            if file::is_hidden(md.file_attributes() as u64) {
-                return true;
-            }
-        }
-        is_hidden_path_only(dent.path())
-    }
-
-    imp(dent)
-}
-
-/// Returns true if and only if this path is considered to be hidden from only
-/// the path itself.
-///
-/// This has the same behavior on all platforms.
-fn is_hidden_path_only(path: &Path) -> bool {
-    if let Some(name) = file_name(path) {
-        name.as_encoded_bytes().starts_with(b".")
-    } else {
-        false
-    }
-}
-
-/// Strip `prefix` from the `path` and return the remainder.
-///
-/// If `path` doesn't have a prefix `prefix`, then return `None`.
-pub(crate) fn strip_prefix<'a, P: AsRef<Path> + ?Sized>(
-    prefix: &'a P,
-    path: &'a Path,
-) -> Option<&'a Path> {
-    #[cfg(unix)]
-    fn imp<'a>(prefix: &'a Path, path: &'a Path) -> Option<&'a Path> {
-        use std::os::unix::ffi::OsStrExt;
-
-        let prefix = prefix.as_os_str().as_bytes();
-        let path = path.as_os_str().as_bytes();
-        if prefix.len() > path.len() || prefix != &path[0..prefix.len()] {
-            None
-        } else {
-            Some(&Path::new(OsStr::from_bytes(&path[prefix.len()..])))
-        }
-    }
-
-    #[cfg(not(unix))]
-    fn imp<'a>(prefix: &'a Path, path: &'a Path) -> Option<&'a Path> {
-        path.strip_prefix(prefix).ok()
-    }
-
-    imp(prefix.as_ref(), path)
-}
-
-/// Returns true if this file path is just a file name. i.e., Its parent is
-/// the empty string.
-pub(crate) fn is_file_name<P: AsRef<Path>>(path: P) -> bool {
-    #[cfg(unix)]
-    {
-        memchr::memchr(b'/', path.as_ref().as_os_str().as_encoded_bytes())
-            .is_none()
-    }
-    #[cfg(not(unix))]
-    {
-        path.as_ref()
-            .parent()
-            .map(|p| p.as_os_str().is_empty())
-            .unwrap_or(false)
-    }
-}
-
-/// The final component of the path, if it is a normal file.
-///
-/// If the path terminates in `.`, `..`, or consists solely of a root of
-/// prefix, this will return `None`.
-pub(crate) fn file_name<'a, P: AsRef<Path> + ?Sized>(
-    path: &'a P,
-) -> Option<&'a OsStr> {
-    #[cfg(unix)]
-    fn imp(path: &Path) -> Option<&OsStr> {
-        use std::os::unix::ffi::OsStrExt;
-
-        use memchr::memrchr;
-
-        let path = path.as_os_str().as_bytes();
-        if path.is_empty() {
-            return None;
-        } else if path.len() == 1 && path[0] == b'.' {
-            return None;
-        } else if path.last() == Some(&b'.') {
-            return None;
-        } else if path.len() >= 2 && &path[path.len() - 2..] == &b".."[..] {
-            return None;
-        }
-        let last_slash = memrchr(b'/', path).map(|i| i + 1).unwrap_or(0);
-        Some(OsStr::from_bytes(&path[last_slash..]))
-    }
-
-    #[cfg(not(unix))]
-    fn imp(path: &Path) -> Option<&OsStr> {
-        path.file_name()
-    }
-
-    imp(path.as_ref())
-}
diff --git a/crates/ignore/src/types.rs b/crates/ignore/src/types.rs
deleted file mode 100644
index 313cf5c0e..000000000
--- a/crates/ignore/src/types.rs
+++ /dev/null
@@ -1,588 +0,0 @@
-/*!
-The types module provides a way of associating globs on file names to file
-types.
-
-This can be used to match specific types of files. For example, among
-the default file types provided, the Rust file type is defined to be `*.rs`
-with name `rust`. Similarly, the C file type is defined to be `*.{c,h}` with
-name `c`.
-
-Note that the set of default types may change over time.
-
-# Example
-
-This shows how to create and use a simple file type matcher using the default
-file types defined in this crate.
-
-```
-use ignore::types::TypesBuilder;
-
-let mut builder = TypesBuilder::new();
-builder.add_defaults();
-builder.select("rust");
-let matcher = builder.build().unwrap();
-
-assert!(matcher.matched("foo.rs", false).is_whitelist());
-assert!(matcher.matched("foo.c", false).is_ignore());
-```
-
-# Example: negation
-
-This is like the previous example, but shows how negating a file type works.
-That is, this will let us match file paths that *don't* correspond to a
-particular file type.
-
-```
-use ignore::types::TypesBuilder;
-
-let mut builder = TypesBuilder::new();
-builder.add_defaults();
-builder.negate("c");
-let matcher = builder.build().unwrap();
-
-assert!(matcher.matched("foo.rs", false).is_none());
-assert!(matcher.matched("foo.c", false).is_ignore());
-```
-
-# Example: custom file type definitions
-
-This shows how to extend this library default file type definitions with
-your own.
-
-```
-use ignore::types::TypesBuilder;
-
-let mut builder = TypesBuilder::new();
-builder.add_defaults();
-builder.add("foo", "*.foo");
-// Another way of adding a file type definition.
-// This is useful when accepting input from an end user.
-builder.add_def("bar:*.bar");
-// Note: we only select `foo`, not `bar`.
-builder.select("foo");
-let matcher = builder.build().unwrap();
-
-assert!(matcher.matched("x.foo", false).is_whitelist());
-// This is ignored because we only selected the `foo` file type.
-assert!(matcher.matched("x.bar", false).is_ignore());
-```
-
-We can also add file type definitions based on other definitions.
-
-```
-use ignore::types::TypesBuilder;
-
-let mut builder = TypesBuilder::new();
-builder.add_defaults();
-builder.add("foo", "*.foo");
-builder.add_def("bar:include:foo,cpp");
-builder.select("bar");
-let matcher = builder.build().unwrap();
-
-assert!(matcher.matched("x.foo", false).is_whitelist());
-assert!(matcher.matched("y.cpp", false).is_whitelist());
-```
-*/
-
-use std::{collections::HashMap, path::Path, sync::Arc};
-
-use {
-    globset::{GlobBuilder, GlobSet, GlobSetBuilder},
-    regex_automata::util::pool::Pool,
-};
-
-use crate::{Error, Match, default_types::DEFAULT_TYPES, pathutil::file_name};
-
-/// Glob represents a single glob in a set of file type definitions.
-///
-/// There may be more than one glob for a particular file type.
-///
-/// This is used to report information about the highest precedent glob
-/// that matched.
-///
-/// Note that not all matches necessarily correspond to a specific glob.
-/// For example, if there are one or more selections and a file path doesn't
-/// match any of those selections, then the file path is considered to be
-/// ignored.
-///
-/// The lifetime `'a` refers to the lifetime of the underlying file type
-/// definition, which corresponds to the lifetime of the file type matcher.
-#[derive(Clone, Debug)]
-pub struct Glob<'a>(GlobInner<'a>);
-
-#[derive(Clone, Debug)]
-enum GlobInner<'a> {
-    /// No glob matched, but the file path should still be ignored.
-    UnmatchedIgnore,
-    /// A glob matched.
-    Matched {
-        /// The file type definition which provided the glob.
-        def: &'a FileTypeDef,
-    },
-}
-
-impl<'a> Glob<'a> {
-    fn unmatched() -> Glob<'a> {
-        Glob(GlobInner::UnmatchedIgnore)
-    }
-
-    /// Return the file type definition that matched, if one exists. A file type
-    /// definition always exists when a specific definition matches a file
-    /// path.
-    pub fn file_type_def(&self) -> Option<&FileTypeDef> {
-        match self {
-            Glob(GlobInner::UnmatchedIgnore) => None,
-            Glob(GlobInner::Matched { def, .. }) => Some(def),
-        }
-    }
-}
-
-/// A single file type definition.
-///
-/// File type definitions can be retrieved in aggregate from a file type
-/// matcher. File type definitions are also reported when its responsible
-/// for a match.
-#[derive(Clone, Debug, Eq, PartialEq)]
-pub struct FileTypeDef {
-    name: String,
-    globs: Vec<String>,
-}
-
-impl FileTypeDef {
-    /// Return the name of this file type.
-    pub fn name(&self) -> &str {
-        &self.name
-    }
-
-    /// Return the globs used to recognize this file type.
-    pub fn globs(&self) -> &[String] {
-        &self.globs
-    }
-}
-
-/// Types is a file type matcher.
-#[derive(Clone, Debug)]
-pub struct Types {
-    /// All of the file type definitions, sorted lexicographically by name.
-    defs: Vec<FileTypeDef>,
-    /// All of the selections made by the user.
-    selections: Vec<Selection<FileTypeDef>>,
-    /// Whether there is at least one Selection::Select in our selections.
-    /// When this is true, a Match::None is converted to Match::Ignore.
-    has_selected: bool,
-    /// A mapping from glob index in the set to two indices. The first is an
-    /// index into `selections` and the second is an index into the
-    /// corresponding file type definition's list of globs.
-    glob_to_selection: Vec<(usize, usize)>,
-    /// The set of all glob selections, used for actual matching.
-    set: GlobSet,
-    /// Temporary storage for globs that match.
-    matches: Arc<Pool<Vec<usize>>>,
-}
-
-/// Indicates the type of a selection for a particular file type.
-#[derive(Clone, Debug)]
-enum Selection<T> {
-    Select(String, T),
-    Negate(String, T),
-}
-
-impl<T> Selection<T> {
-    fn is_negated(&self) -> bool {
-        match *self {
-            Selection::Select(..) => false,
-            Selection::Negate(..) => true,
-        }
-    }
-
-    fn name(&self) -> &str {
-        match *self {
-            Selection::Select(ref name, _) => name,
-            Selection::Negate(ref name, _) => name,
-        }
-    }
-
-    fn map<U, F: FnOnce(T) -> U>(self, f: F) -> Selection<U> {
-        match self {
-            Selection::Select(name, inner) => {
-                Selection::Select(name, f(inner))
-            }
-            Selection::Negate(name, inner) => {
-                Selection::Negate(name, f(inner))
-            }
-        }
-    }
-
-    fn inner(&self) -> &T {
-        match *self {
-            Selection::Select(_, ref inner) => inner,
-            Selection::Negate(_, ref inner) => inner,
-        }
-    }
-}
-
-impl Types {
-    /// Creates a new file type matcher that never matches any path and
-    /// contains no file type definitions.
-    pub fn empty() -> Types {
-        Types {
-            defs: vec![],
-            selections: vec![],
-            has_selected: false,
-            glob_to_selection: vec![],
-            set: GlobSetBuilder::new().build().unwrap(),
-            matches: Arc::new(Pool::with_available_parallelism_capacity(
-                || vec![],
-            )),
-        }
-    }
-
-    /// Returns true if and only if this matcher has zero selections.
-    pub fn is_empty(&self) -> bool {
-        self.selections.is_empty()
-    }
-
-    /// Returns the number of selections used in this matcher.
-    pub fn len(&self) -> usize {
-        self.selections.len()
-    }
-
-    /// Return the set of current file type definitions.
-    ///
-    /// Definitions and globs are sorted.
-    pub fn definitions(&self) -> &[FileTypeDef] {
-        &self.defs
-    }
-
-    /// Returns a match for the given path against this file type matcher.
-    ///
-    /// The path is considered whitelisted if it matches a selected file type.
-    /// The path is considered ignored if it matches a negated file type.
-    /// If at least one file type is selected and `path` doesn't match, then
-    /// the path is also considered ignored.
-    pub fn matched<'a, P: AsRef<Path>>(
-        &'a self,
-        path: P,
-        is_dir: bool,
-    ) -> Match<Glob<'a>> {
-        // File types don't apply to directories, and we can't do anything
-        // if our glob set is empty.
-        if is_dir || self.set.is_empty() {
-            return Match::None;
-        }
-        // We only want to match against the file name, so extract it.
-        // If one doesn't exist, then we can't match it.
-        let name = match file_name(path.as_ref()) {
-            Some(name) => name,
-            None if self.has_selected => {
-                return Match::Ignore(Glob::unmatched());
-            }
-            None => {
-                return Match::None;
-            }
-        };
-        let mut matches = self.matches.get();
-        self.set.matches_into(name, &mut *matches);
-        // The highest precedent match is the last one.
-        if let Some(&i) = matches.last() {
-            let (isel, _) = self.glob_to_selection[i];
-            let sel = &self.selections[isel];
-            let glob = Glob(GlobInner::Matched { def: sel.inner() });
-            return if sel.is_negated() {
-                Match::Ignore(glob)
-            } else {
-                Match::Whitelist(glob)
-            };
-        }
-        if self.has_selected {
-            Match::Ignore(Glob::unmatched())
-        } else {
-            Match::None
-        }
-    }
-}
-
-/// TypesBuilder builds a type matcher from a set of file type definitions and
-/// a set of file type selections.
-pub struct TypesBuilder {
-    types: HashMap<String, FileTypeDef>,
-    selections: Vec<Selection<()>>,
-}
-
-impl TypesBuilder {
-    /// Create a new builder for a file type matcher.
-    ///
-    /// The builder contains *no* type definitions to start with. A set
-    /// of default type definitions can be added with `add_defaults`, and
-    /// additional type definitions can be added with `select` and `negate`.
-    pub fn new() -> TypesBuilder {
-        TypesBuilder { types: HashMap::new(), selections: vec![] }
-    }
-
-    /// Build the current set of file type definitions *and* selections into
-    /// a file type matcher.
-    pub fn build(&self) -> Result<Types, Error> {
-        let defs = self.definitions();
-        let has_selected = self.selections.iter().any(|s| !s.is_negated());
-
-        let mut selections = vec![];
-        let mut glob_to_selection = vec![];
-        let mut build_set = GlobSetBuilder::new();
-        for (isel, selection) in self.selections.iter().enumerate() {
-            let def = match self.types.get(selection.name()) {
-                Some(def) => def.clone(),
-                None => {
-                    let name = selection.name().to_string();
-                    return Err(Error::UnrecognizedFileType(name));
-                }
-            };
-            for (iglob, glob) in def.globs.iter().enumerate() {
-                build_set.add(
-                    GlobBuilder::new(glob)
-                        .literal_separator(true)
-                        .build()
-                        .map_err(|err| Error::Glob {
-                            glob: Some(glob.to_string()),
-                            err: err.kind().to_string(),
-                        })?,
-                );
-                glob_to_selection.push((isel, iglob));
-            }
-            selections.push(selection.clone().map(move |_| def));
-        }
-        let set = build_set
-            .build()
-            .map_err(|err| Error::Glob { glob: None, err: err.to_string() })?;
-        Ok(Types {
-            defs,
-            selections,
-            has_selected,
-            glob_to_selection,
-            set,
-            matches: Arc::new(Pool::with_available_parallelism_capacity(
-                || vec![],
-            )),
-        })
-    }
-
-    /// Return the set of current file type definitions.
-    ///
-    /// Definitions and globs are sorted.
-    pub fn definitions(&self) -> Vec<FileTypeDef> {
-        let mut defs = vec![];
-        for def in self.types.values() {
-            let mut def = def.clone();
-            def.globs.sort();
-            defs.push(def);
-        }
-        defs.sort_by(|def1, def2| def1.name().cmp(def2.name()));
-        defs
-    }
-
-    /// Select the file type given by `name`.
-    ///
-    /// If `name` is `all`, then all file types currently defined are selected.
-    pub fn select(&mut self, name: &str) -> &mut TypesBuilder {
-        if name == "all" {
-            for name in self.types.keys() {
-                self.selections.push(Selection::Select(name.to_string(), ()));
-            }
-        } else {
-            self.selections.push(Selection::Select(name.to_string(), ()));
-        }
-        self
-    }
-
-    /// Ignore the file type given by `name`.
-    ///
-    /// If `name` is `all`, then all file types currently defined are negated.
-    pub fn negate(&mut self, name: &str) -> &mut TypesBuilder {
-        if name == "all" {
-            for name in self.types.keys() {
-                self.selections.push(Selection::Negate(name.to_string(), ()));
-            }
-        } else {
-            self.selections.push(Selection::Negate(name.to_string(), ()));
-        }
-        self
-    }
-
-    /// Clear any file type definitions for the type name given.
-    pub fn clear(&mut self, name: &str) -> &mut TypesBuilder {
-        self.types.remove(name);
-        self
-    }
-
-    /// Add a new file type definition. `name` can be arbitrary and `pat`
-    /// should be a glob recognizing file paths belonging to the `name` type.
-    ///
-    /// If `name` is `all` or otherwise contains any character that is not a
-    /// Unicode letter or number, then an error is returned.
-    pub fn add(&mut self, name: &str, glob: &str) -> Result<(), Error> {
-        if name == "all" || !name.chars().all(|c| c.is_alphanumeric()) {
-            return Err(Error::InvalidDefinition);
-        }
-        let (key, glob) = (name.to_string(), glob.to_string());
-        self.types
-            .entry(key)
-            .or_insert_with(|| FileTypeDef {
-                name: name.to_string(),
-                globs: vec![],
-            })
-            .globs
-            .push(glob);
-        Ok(())
-    }
-
-    /// Add a new file type definition specified in string form. There are two
-    /// valid formats:
-    /// 1. `{name}:{glob}`.  This defines a 'root' definition that associates the
-    ///     given name with the given glob.
-    /// 2. `{name}:include:{comma-separated list of already defined names}.
-    ///     This defines an 'include' definition that associates the given name
-    ///     with the definitions of the given existing types.
-    /// Names may not include any characters that are not
-    /// Unicode letters or numbers.
-    pub fn add_def(&mut self, def: &str) -> Result<(), Error> {
-        let parts: Vec<&str> = def.split(':').collect();
-        match parts.len() {
-            2 => {
-                let name = parts[0];
-                let glob = parts[1];
-                if name.is_empty() || glob.is_empty() {
-                    return Err(Error::InvalidDefinition);
-                }
-                self.add(name, glob)
-            }
-            3 => {
-                let name = parts[0];
-                let types_string = parts[2];
-                if name.is_empty()
-                    || parts[1] != "include"
-                    || types_string.is_empty()
-                {
-                    return Err(Error::InvalidDefinition);
-                }
-                let types = types_string.split(',');
-                // Check ahead of time to ensure that all types specified are
-                // present and fail fast if not.
-                if types.clone().any(|t| !self.types.contains_key(t)) {
-                    return Err(Error::InvalidDefinition);
-                }
-                for type_name in types {
-                    let globs =
-                        self.types.get(type_name).unwrap().globs.clone();
-                    for glob in globs {
-                        self.add(name, &glob)?;
-                    }
-                }
-                Ok(())
-            }
-            _ => Err(Error::InvalidDefinition),
-        }
-    }
-
-    /// Add a set of default file type definitions.
-    pub fn add_defaults(&mut self) -> &mut TypesBuilder {
-        static MSG: &'static str = "adding a default type should never fail";
-        for &(names, exts) in DEFAULT_TYPES {
-            for name in names {
-                for ext in exts {
-                    self.add(name, ext).expect(MSG);
-                }
-            }
-        }
-        self
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::TypesBuilder;
-
-    macro_rules! matched {
-        ($name:ident, $types:expr, $sel:expr, $selnot:expr,
-         $path:expr) => {
-            matched!($name, $types, $sel, $selnot, $path, true);
-        };
-        (not, $name:ident, $types:expr, $sel:expr, $selnot:expr,
-         $path:expr) => {
-            matched!($name, $types, $sel, $selnot, $path, false);
-        };
-        ($name:ident, $types:expr, $sel:expr, $selnot:expr,
-         $path:expr, $matched:expr) => {
-            #[test]
-            fn $name() {
-                let mut btypes = TypesBuilder::new();
-                for tydef in $types {
-                    btypes.add_def(tydef).unwrap();
-                }
-                for sel in $sel {
-                    btypes.select(sel);
-                }
-                for selnot in $selnot {
-                    btypes.negate(selnot);
-                }
-                let types = btypes.build().unwrap();
-                let mat = types.matched($path, false);
-                assert_eq!($matched, !mat.is_ignore());
-            }
-        };
-    }
-
-    fn types() -> Vec<&'static str> {
-        vec![
-            "html:*.html",
-            "html:*.htm",
-            "rust:*.rs",
-            "js:*.js",
-            "py:*.py",
-            "python:*.py",
-            "foo:*.{rs,foo}",
-            "combo:include:html,rust",
-        ]
-    }
-
-    matched!(match1, types(), vec!["rust"], vec![], "lib.rs");
-    matched!(match2, types(), vec!["html"], vec![], "index.html");
-    matched!(match3, types(), vec!["html"], vec![], "index.htm");
-    matched!(match4, types(), vec!["html", "rust"], vec![], "main.rs");
-    matched!(match5, types(), vec![], vec![], "index.html");
-    matched!(match6, types(), vec![], vec!["rust"], "index.html");
-    matched!(match7, types(), vec!["foo"], vec!["rust"], "main.foo");
-    matched!(match8, types(), vec!["combo"], vec![], "index.html");
-    matched!(match9, types(), vec!["combo"], vec![], "lib.rs");
-    matched!(match10, types(), vec!["py"], vec![], "main.py");
-    matched!(match11, types(), vec!["python"], vec![], "main.py");
-
-    matched!(not, matchnot1, types(), vec!["rust"], vec![], "index.html");
-    matched!(not, matchnot2, types(), vec![], vec!["rust"], "main.rs");
-    matched!(not, matchnot3, types(), vec!["foo"], vec!["rust"], "main.rs");
-    matched!(not, matchnot4, types(), vec!["rust"], vec!["foo"], "main.rs");
-    matched!(not, matchnot5, types(), vec!["rust"], vec!["foo"], "main.foo");
-    matched!(not, matchnot6, types(), vec!["combo"], vec![], "leftpad.js");
-    matched!(not, matchnot7, types(), vec!["py"], vec![], "index.html");
-    matched!(not, matchnot8, types(), vec!["python"], vec![], "doc.md");
-
-    #[test]
-    fn test_invalid_defs() {
-        let mut btypes = TypesBuilder::new();
-        for tydef in types() {
-            btypes.add_def(tydef).unwrap();
-        }
-        // Preserve the original definitions for later comparison.
-        let original_defs = btypes.definitions();
-        let bad_defs = vec![
-            // Reference to type that does not exist
-            "combo:include:html,qwerty",
-            // Bad format
-            "combo:foobar:html,rust",
-            "",
-        ];
-        for def in bad_defs {
-            assert!(btypes.add_def(def).is_err());
-            // Ensure that nothing changed, even if some of the includes were valid.
-            assert_eq!(btypes.definitions(), original_defs);
-        }
-    }
-}
diff --git a/crates/ignore/src/walk.rs b/crates/ignore/src/walk.rs
deleted file mode 100644
index 2dff78852..000000000
--- a/crates/ignore/src/walk.rs
+++ /dev/null
@@ -1,2757 +0,0 @@
-use std::{
-    cmp::Ordering,
-    ffi::OsStr,
-    fs::{self, FileType, Metadata},
-    io,
-    path::{Path, PathBuf},
-    sync::atomic::{AtomicBool, AtomicUsize, Ordering as AtomicOrdering},
-    sync::{Arc, OnceLock},
-};
-
-use {
-    crossbeam_deque::{Stealer, Worker as Deque},
-    same_file::Handle,
-    walkdir::WalkDir,
-};
-
-use crate::{
-    Error, PartialErrorBuilder,
-    dir::{Ignore, IgnoreBuilder},
-    // CHANGED: Also import `Gitignore` for `WalkBuilder::add_gitignore`.
-    gitignore::{Gitignore, GitignoreBuilder},
-    incremental::{IncrementalIgnore, IncrementalIgnoreOptions},
-    overrides::Override,
-    types::Types,
-};
-
-/// A directory entry with a possible error attached.
-///
-/// The error typically refers to a problem parsing ignore files in a
-/// particular directory.
-#[derive(Clone, Debug)]
-pub struct DirEntry {
-    dent: DirEntryInner,
-    err: Option<Error>,
-}
-
-impl DirEntry {
-    /// The full path that this entry represents.
-    pub fn path(&self) -> &Path {
-        self.dent.path()
-    }
-
-    /// The full path that this entry represents.
-    /// Analogous to [`DirEntry::path`], but moves ownership of the path.
-    pub fn into_path(self) -> PathBuf {
-        self.dent.into_path()
-    }
-
-    /// Whether this entry corresponds to a symbolic link or not.
-    pub fn path_is_symlink(&self) -> bool {
-        self.dent.path_is_symlink()
-    }
-
-    /// Returns true if and only if this entry corresponds to stdin.
-    ///
-    /// i.e., The entry has depth 0 and its file name is `-`.
-    pub fn is_stdin(&self) -> bool {
-        self.dent.is_stdin()
-    }
-
-    /// Return the metadata for the file that this entry points to.
-    pub fn metadata(&self) -> Result<Metadata, Error> {
-        self.dent.metadata()
-    }
-
-    /// Return the file type for the file that this entry points to.
-    ///
-    /// This entry doesn't have a file type if it corresponds to stdin.
-    pub fn file_type(&self) -> Option<FileType> {
-        self.dent.file_type()
-    }
-
-    /// Return the file name of this entry.
-    ///
-    /// If this entry has no file name (e.g., `/`), then the full path is
-    /// returned.
-    pub fn file_name(&self) -> &OsStr {
-        self.dent.file_name()
-    }
-
-    /// Returns the depth at which this entry was created relative to the root.
-    pub fn depth(&self) -> usize {
-        self.dent.depth()
-    }
-
-    /// Returns the underlying inode number if one exists.
-    ///
-    /// If this entry doesn't have an inode number, then `None` is returned.
-    #[cfg(unix)]
-    pub fn ino(&self) -> Option<u64> {
-        self.dent.ino()
-    }
-
-    /// Returns an error, if one exists, associated with processing this entry.
-    ///
-    /// An example of an error is one that occurred while parsing an ignore
-    /// file. Errors related to traversing a directory tree itself are reported
-    /// as part of yielding the directory entry, and not with this method.
-    pub fn error(&self) -> Option<&Error> {
-        self.err.as_ref()
-    }
-
-    /// Returns true if and only if this entry points to a directory.
-    pub(crate) fn is_dir(&self) -> bool {
-        self.dent.is_dir()
-    }
-
-    fn new_stdin() -> DirEntry {
-        DirEntry { dent: DirEntryInner::Stdin, err: None }
-    }
-
-    fn new_walkdir(dent: walkdir::DirEntry, err: Option<Error>) -> DirEntry {
-        DirEntry { dent: DirEntryInner::Walkdir(dent), err }
-    }
-
-    fn new_raw(dent: DirEntryRaw, err: Option<Error>) -> DirEntry {
-        DirEntry { dent: DirEntryInner::Raw(dent), err }
-    }
-}
-
-/// DirEntryInner is the implementation of DirEntry.
-///
-/// It specifically represents three distinct sources of directory entries:
-///
-/// 1. From the walkdir crate.
-/// 2. Special entries that represent things like stdin.
-/// 3. From a path.
-///
-/// Specifically, (3) has to essentially re-create the DirEntry implementation
-/// from WalkDir.
-#[derive(Clone, Debug)]
-enum DirEntryInner {
-    Stdin,
-    Walkdir(walkdir::DirEntry),
-    Raw(DirEntryRaw),
-}
-
-impl DirEntryInner {
-    fn path(&self) -> &Path {
-        use self::DirEntryInner::*;
-        match *self {
-            Stdin => Path::new("<stdin>"),
-            Walkdir(ref x) => x.path(),
-            Raw(ref x) => x.path(),
-        }
-    }
-
-    fn into_path(self) -> PathBuf {
-        use self::DirEntryInner::*;
-        match self {
-            Stdin => PathBuf::from("<stdin>"),
-            Walkdir(x) => x.into_path(),
-            Raw(x) => x.into_path(),
-        }
-    }
-
-    fn path_is_symlink(&self) -> bool {
-        use self::DirEntryInner::*;
-        match *self {
-            Stdin => false,
-            Walkdir(ref x) => x.path_is_symlink(),
-            Raw(ref x) => x.path_is_symlink(),
-        }
-    }
-
-    fn is_stdin(&self) -> bool {
-        match *self {
-            DirEntryInner::Stdin => true,
-            _ => false,
-        }
-    }
-
-    fn metadata(&self) -> Result<Metadata, Error> {
-        use self::DirEntryInner::*;
-        match *self {
-            Stdin => {
-                let err = Error::Io(io::Error::new(
-                    io::ErrorKind::Other,
-                    "<stdin> has no metadata",
-                ));
-                Err(err.with_path("<stdin>"))
-            }
-            Walkdir(ref x) => x.metadata().map_err(|err| {
-                Error::Io(io::Error::from(err))
-                    .with_depth(x.depth())
-                    .with_path(x.path())
-            }),
-            Raw(ref x) => x.metadata(),
-        }
-    }
-
-    fn file_type(&self) -> Option<FileType> {
-        use self::DirEntryInner::*;
-        match *self {
-            Stdin => None,
-            Walkdir(ref x) => Some(x.file_type()),
-            Raw(ref x) => Some(x.file_type()),
-        }
-    }
-
-    fn file_name(&self) -> &OsStr {
-        use self::DirEntryInner::*;
-        match *self {
-            Stdin => OsStr::new("<stdin>"),
-            Walkdir(ref x) => x.file_name(),
-            Raw(ref x) => x.file_name(),
-        }
-    }
-
-    fn depth(&self) -> usize {
-        use self::DirEntryInner::*;
-        match *self {
-            Stdin => 0,
-            Walkdir(ref x) => x.depth(),
-            Raw(ref x) => x.depth(),
-        }
-    }
-
-    #[cfg(unix)]
-    fn ino(&self) -> Option<u64> {
-        use self::DirEntryInner::*;
-        use walkdir::DirEntryExt;
-        match *self {
-            Stdin => None,
-            Walkdir(ref x) => Some(x.ino()),
-            Raw(ref x) => Some(x.ino()),
-        }
-    }
-
-    /// Returns true if and only if this entry points to a directory.
-    fn is_dir(&self) -> bool {
-        self.file_type().map(|ft| ft.is_dir()).unwrap_or(false)
-    }
-}
-
-/// DirEntryRaw is essentially copied from the walkdir crate so that we can
-/// build `DirEntry`s from whole cloth in the parallel iterator.
-#[derive(Clone)]
-struct DirEntryRaw {
-    /// The path as reported by the `fs::ReadDir` iterator (even if it's a
-    /// symbolic link).
-    path: PathBuf,
-    /// The file type. Necessary for recursive iteration, so store it.
-    ty: FileType,
-    /// Is set when this entry was created from a symbolic link and the user
-    /// expects the iterator to follow symbolic links.
-    follow_link: bool,
-    /// The depth at which this entry was generated relative to the root.
-    depth: usize,
-    /// The underlying inode number (Unix only).
-    #[cfg(unix)]
-    ino: u64,
-    /// The underlying metadata (Windows only). We store this on Windows
-    /// because this comes for free while reading a directory.
-    #[cfg(windows)]
-    metadata: fs::Metadata,
-}
-
-impl std::fmt::Debug for DirEntryRaw {
-    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
-        // Leaving out FileType because it doesn't have a debug impl
-        // in Rust 1.9. We could add it if we really wanted to by manually
-        // querying each possibly file type. Meh. ---AG
-        f.debug_struct("DirEntryRaw")
-            .field("path", &self.path)
-            .field("follow_link", &self.follow_link)
-            .field("depth", &self.depth)
-            .finish()
-    }
-}
-
-impl DirEntryRaw {
-    fn path(&self) -> &Path {
-        &self.path
-    }
-
-    fn into_path(self) -> PathBuf {
-        self.path
-    }
-
-    fn path_is_symlink(&self) -> bool {
-        self.ty.is_symlink() || self.follow_link
-    }
-
-    fn metadata(&self) -> Result<Metadata, Error> {
-        self.metadata_internal()
-    }
-
-    #[cfg(windows)]
-    fn metadata_internal(&self) -> Result<fs::Metadata, Error> {
-        if self.follow_link {
-            fs::metadata(&self.path)
-        } else {
-            Ok(self.metadata.clone())
-        }
-        .map_err(|err| Error::Io(io::Error::from(err)).with_path(&self.path))
-    }
-
-    #[cfg(not(windows))]
-    fn metadata_internal(&self) -> Result<fs::Metadata, Error> {
-        if self.follow_link {
-            fs::metadata(&self.path)
-        } else {
-            fs::symlink_metadata(&self.path)
-        }
-        .map_err(|err| {
-            Error::Io(err).with_depth(self.depth).with_path(&self.path)
-        })
-    }
-
-    fn file_type(&self) -> FileType {
-        self.ty
-    }
-
-    fn file_name(&self) -> &OsStr {
-        self.path.file_name().unwrap_or_else(|| self.path.as_os_str())
-    }
-
-    fn depth(&self) -> usize {
-        self.depth
-    }
-
-    #[cfg(unix)]
-    fn ino(&self) -> u64 {
-        self.ino
-    }
-
-    fn from_entry(
-        depth: usize,
-        ent: &fs::DirEntry,
-    ) -> Result<DirEntryRaw, Error> {
-        let ty = ent.file_type().map_err(|err| {
-            let err = Error::Io(err).with_depth(depth).with_path(ent.path());
-            Error::WithDepth { depth, err: Box::new(err) }
-        })?;
-        DirEntryRaw::from_entry_os(depth, ent, ty)
-    }
-
-    #[cfg(windows)]
-    fn from_entry_os(
-        depth: usize,
-        ent: &fs::DirEntry,
-        ty: fs::FileType,
-    ) -> Result<DirEntryRaw, Error> {
-        let md = ent.metadata().map_err(|err| {
-            let err = Error::Io(err).with_depth(depth).with_path(ent.path());
-            Error::WithDepth { depth, err: Box::new(err) }
-        })?;
-        Ok(DirEntryRaw {
-            path: ent.path(),
-            ty,
-            follow_link: false,
-            depth,
-            metadata: md,
-        })
-    }
-
-    #[cfg(unix)]
-    fn from_entry_os(
-        depth: usize,
-        ent: &fs::DirEntry,
-        ty: fs::FileType,
-    ) -> Result<DirEntryRaw, Error> {
-        use std::os::unix::fs::DirEntryExt;
-
-        Ok(DirEntryRaw {
-            path: ent.path(),
-            ty,
-            follow_link: false,
-            depth,
-            ino: ent.ino(),
-        })
-    }
-
-    // Placeholder implementation to allow compiling on non-standard platforms
-    // (e.g. wasm32).
-    #[cfg(not(any(windows, unix)))]
-    fn from_entry_os(
-        depth: usize,
-        ent: &fs::DirEntry,
-        ty: fs::FileType,
-    ) -> Result<DirEntryRaw, Error> {
-        Err(Error::Io(io::Error::new(
-            io::ErrorKind::Other,
-            "unsupported platform",
-        )))
-    }
-
-    #[cfg(windows)]
-    fn from_path(
-        depth: usize,
-        pb: PathBuf,
-        link: bool,
-    ) -> Result<DirEntryRaw, Error> {
-        let md = fs::metadata(&pb)
-            .map_err(|err| Error::Io(err).with_depth(depth).with_path(&pb))?;
-        Ok(DirEntryRaw {
-            path: pb,
-            ty: md.file_type(),
-            follow_link: link,
-            depth,
-            metadata: md,
-        })
-    }
-
-    #[cfg(unix)]
-    fn from_path(
-        depth: usize,
-        pb: PathBuf,
-        link: bool,
-    ) -> Result<DirEntryRaw, Error> {
-        use std::os::unix::fs::MetadataExt;
-
-        let md = fs::metadata(&pb)
-            .map_err(|err| Error::Io(err).with_depth(depth).with_path(&pb))?;
-        Ok(DirEntryRaw {
-            path: pb,
-            ty: md.file_type(),
-            follow_link: link,
-            depth,
-            ino: md.ino(),
-        })
-    }
-
-    // Placeholder implementation to allow compiling on non-standard platforms
-    // (e.g. wasm32).
-    #[cfg(not(any(windows, unix)))]
-    fn from_path(
-        depth: usize,
-        pb: PathBuf,
-        link: bool,
-    ) -> Result<DirEntryRaw, Error> {
-        Err(Error::Io(io::Error::new(
-            io::ErrorKind::Other,
-            "unsupported platform",
-        )))
-    }
-}
-
-/// WalkBuilder builds a recursive directory iterator.
-///
-/// The builder supports a large number of configurable options. This includes
-/// specific glob overrides, file type matching, toggling whether hidden
-/// files are ignored or not, and of course, support for respecting gitignore
-/// files.
-///
-/// By default, all ignore files found are respected. This includes `.ignore`,
-/// `.gitignore`, `.git/info/exclude` and even your global gitignore
-/// globs, usually found in `$XDG_CONFIG_HOME/git/ignore`.
-///
-/// Some standard recursive directory options are also supported, such as
-/// limiting the recursive depth or whether to follow symbolic links (disabled
-/// by default).
-///
-/// # Ignore rules
-///
-/// There are many rules that influence whether a particular file or directory
-/// is skipped by this iterator. Those rules are documented here. Note that
-/// the rules assume a default configuration.
-///
-/// * First, glob overrides are checked. If a path matches a glob override,
-/// then matching stops. The path is then only skipped if the glob that matched
-/// the path is an ignore glob. (An override glob is a whitelist glob unless it
-/// starts with a `!`, in which case it is an ignore glob.)
-/// * Second, ignore files are checked. Ignore files currently only come from
-/// git ignore files (`.gitignore`, `.git/info/exclude` and the configured
-/// global gitignore file), plain `.ignore` files, which have the same format
-/// as gitignore files, or explicitly added ignore files. The precedence order
-/// is: `.ignore`, `.gitignore`, `.git/info/exclude`, global gitignore and
-/// finally explicitly added ignore files. Note that precedence between
-/// different types of ignore files is not impacted by the directory hierarchy;
-/// any `.ignore` file overrides all `.gitignore` files. Within each precedence
-/// level, more nested ignore files have a higher precedence than less nested
-/// ignore files.
-/// * Third, if the previous step yields an ignore match, then all matching
-/// is stopped and the path is skipped. If it yields a whitelist match, then
-/// matching continues. A whitelist match can be overridden by a later matcher.
-/// * Fourth, unless the path is a directory, the file type matcher is run on
-/// the path. As above, if it yields an ignore match, then all matching is
-/// stopped and the path is skipped. If it yields a whitelist match, then
-/// matching continues.
-/// * Fifth, if the path hasn't been whitelisted and it is hidden, then the
-/// path is skipped.
-/// * Sixth, unless the path is a directory, the size of the file is compared
-/// against the max filesize limit. If it exceeds the limit, it is skipped.
-/// * Seventh, if the path has made it this far then it is yielded in the
-/// iterator.
-#[derive(Clone)]
-pub struct WalkBuilder {
-    paths: Vec<PathBuf>,
-    ig_builder: IgnoreBuilder,
-    max_depth: Option<usize>,
-    min_depth: Option<usize>,
-    max_filesize: Option<u64>,
-    follow_links: bool,
-    same_file_system: bool,
-    sorter: Option<Sorter>,
-    threads: usize,
-    skip: Option<Arc<Handle>>,
-    filter: Option<Filter>,
-    /// The directory that gitignores should be interpreted relative to.
-    ///
-    /// Usually this is the directory containing the gitignore file. But in
-    /// some cases, like for global gitignores or for gitignores specified
-    /// explicitly, this should generally be set to the current working
-    /// directory. This is only used for global gitignores or "explicit"
-    /// gitignores.
-    ///
-    /// When `None`, the CWD is fetched from `std::env::current_dir()`. If
-    /// that fails, then global gitignores are ignored (an error is logged).
-    global_gitignores_relative_to:
-        OnceLock<Result<PathBuf, Arc<std::io::Error>>>,
-}
-
-#[derive(Clone)]
-enum Sorter {
-    ByName(Arc<dyn Fn(&OsStr, &OsStr) -> Ordering + Send + Sync + 'static>),
-    ByPath(Arc<dyn Fn(&Path, &Path) -> Ordering + Send + Sync + 'static>),
-}
-
-#[derive(Clone)]
-struct Filter(Arc<dyn Fn(&DirEntry) -> bool + Send + Sync + 'static>);
-
-impl std::fmt::Debug for WalkBuilder {
-    fn fmt(&self, f: &mut std::fmt::Formatter<'_>) -> std::fmt::Result {
-        f.debug_struct("WalkBuilder")
-            .field("paths", &self.paths)
-            .field("ig_builder", &self.ig_builder)
-            .field("max_depth", &self.max_depth)
-            .field("min_depth", &self.min_depth)
-            .field("max_filesize", &self.max_filesize)
-            .field("follow_links", &self.follow_links)
-            .field("same_file_system", &self.same_file_system)
-            .field("sorter", &"<...>")
-            .field("threads", &self.threads)
-            .field("skip", &self.skip)
-            .field("filter", &"<...>")
-            .field(
-                "global_gitignores_relative_to",
-                &self.global_gitignores_relative_to,
-            )
-            .finish()
-    }
-}
-
-impl WalkBuilder {
-    /// Create a new builder for a recursive directory iterator for the
-    /// directory given.
-    ///
-    /// Note that if you want to traverse multiple different directories, it
-    /// is better to call `add` on this builder than to create multiple
-    /// `Walk` values.
-    pub fn new<P: AsRef<Path>>(path: P) -> WalkBuilder {
-        WalkBuilder::from_iter([path])
-    }
-
-    /// Create an empty builder to which paths can be added.
-    ///
-    /// Note that if you call `build` on this instance before calling `add`
-    /// on it, it will return exactly zero items during iteration.
-    pub fn empty() -> WalkBuilder {
-        WalkBuilder {
-            paths: vec![],
-            ig_builder: IgnoreBuilder::new(),
-            max_depth: None,
-            min_depth: None,
-            max_filesize: None,
-            follow_links: false,
-            same_file_system: false,
-            sorter: None,
-            threads: 0,
-            skip: None,
-            filter: None,
-            global_gitignores_relative_to: OnceLock::new(),
-        }
-    }
-
-    /// Create a new builder for a recursive directory iterator from the
-    /// sequence of paths.
-    ///
-    /// Note that if the iterator is empty, this is the same as
-    /// `WalkBuilder::empty`.
-    pub fn from_iter<P: AsRef<Path>, I: IntoIterator<Item = P>>(
-        paths: I,
-    ) -> WalkBuilder {
-        let mut builder = WalkBuilder::empty();
-        for path in paths.into_iter() {
-            builder.add(path);
-        }
-        builder
-    }
-
-    /// Build a new `Walk` iterator.
-    pub fn build(&self) -> Walk {
-        let follow_links = self.follow_links;
-        let max_depth = self.max_depth;
-        let min_depth = self.min_depth;
-        let sorter = self.sorter.clone();
-        let its = self
-            .paths
-            .iter()
-            .map(move |p| {
-                if p == Path::new("-") {
-                    (p.to_path_buf(), None)
-                } else {
-                    let mut wd = WalkDir::new(p);
-                    wd = wd.follow_links(follow_links || p.is_file());
-                    wd = wd.same_file_system(self.same_file_system);
-                    if let Some(max_depth) = max_depth {
-                        wd = wd.max_depth(max_depth);
-                    }
-                    if let Some(min_depth) = min_depth {
-                        wd = wd.min_depth(min_depth);
-                    }
-                    if let Some(ref sorter) = sorter {
-                        match sorter.clone() {
-                            Sorter::ByName(cmp) => {
-                                wd = wd.sort_by(move |a, b| {
-                                    cmp(a.file_name(), b.file_name())
-                                });
-                            }
-                            Sorter::ByPath(cmp) => {
-                                wd = wd.sort_by(move |a, b| {
-                                    cmp(a.path(), b.path())
-                                });
-                            }
-                        }
-                    }
-                    (p.to_path_buf(), Some(WalkEventIter::from(wd)))
-                }
-            })
-            .collect::<Vec<_>>()
-            .into_iter();
-        let ig_root = self.build_ignore();
-        Walk {
-            its,
-            it: None,
-            ig_root: ig_root.clone(),
-            ig: ig_root.clone(),
-            max_depth: self.max_depth,
-            max_filesize: self.max_filesize,
-            skip: self.skip.clone(),
-            filter: self.filter.clone(),
-        }
-    }
-
-    /// Build matchers for checking paths against ignore files without
-    /// recursively walking the configured roots.
-    ///
-    /// The returned matchers use the path-based filtering configuration
-    /// on this builder, including glob overrides, file type selections,
-    /// parent ignore files, `.ignore`, `.gitignore`, global Git
-    /// ignore files, explicitly added ignore files and custom ignore
-    /// file names. For example, ripgrep configures `.rgignore` via
-    /// [`WalkBuilder::add_custom_ignore_filename`]. Minimum and maximum depth
-    /// limits, maximum file size and hidden-file filtering are also applied.
-    /// Other options that only control traversal or require a directory entry,
-    /// such as custom entry predicates, are not applied.
-    ///
-    /// One matcher is returned for each configured path, in the same order as
-    /// the paths were added to this builder. Each matcher accepts paths
-    /// relative to its own [`IncrementalIgnore::root`]. The matcher for the
-    /// special `-` path representing standard input always returns a non-match
-    /// for all inputs.
-    ///
-    /// Ignore matchers are loaded lazily and cached by directory.
-    /// Thus, the first query may read ignore files from the root and
-    /// its parents, while later queries reuse the compiled matchers.
-    /// Errors encountered while loading ignore files are returned by
-    /// [`IncrementalIgnore::matched_with_errors`]. Once an ignore file has
-    /// been loaded, changes to it are not observed. Build new matchers to
-    /// reload changed ignore files.
-    ///
-    /// Matchers built together share the builder's base ignore configuration
-    /// and compiled parent matchers.
-    pub fn build_matchers(&self) -> Vec<IncrementalIgnore> {
-        let ignore = self.build_ignore();
-        let options = IncrementalIgnoreOptions {
-            min_depth: self.min_depth,
-            max_depth: self.max_depth,
-            max_filesize: self.max_filesize,
-            hidden: self.ig_builder.is_hidden(),
-            follow_links: self.follow_links,
-        };
-        self.paths
-            .iter()
-            .map(move |path| {
-                IncrementalIgnore::new(
-                    path.clone(),
-                    ignore.clone(),
-                    options.clone(),
-                )
-            })
-            .collect()
-    }
-
-    /// Build a new `WalkParallel` iterator.
-    ///
-    /// Note that this *doesn't* return something that implements `Iterator`.
-    /// Instead, the returned value must be run with a closure. e.g.,
-    /// `builder.build_parallel().run(|| |path| { println!("{path:?}"); WalkState::Continue })`.
-    pub fn build_parallel(&self) -> WalkParallel {
-        let ig_root = self.build_ignore();
-        WalkParallel {
-            paths: self.paths.clone().into_iter(),
-            ig_root,
-            max_depth: self.max_depth,
-            min_depth: self.min_depth,
-            max_filesize: self.max_filesize,
-            follow_links: self.follow_links,
-            same_file_system: self.same_file_system,
-            threads: self.threads,
-            skip: self.skip.clone(),
-            filter: self.filter.clone(),
-        }
-    }
-
-    /// Add a file path to the iterator.
-    ///
-    /// Each additional file path added is traversed recursively. This should
-    /// be preferred over building multiple `Walk` iterators since this
-    /// enables reusing resources across iteration.
-    pub fn add<P: AsRef<Path>>(&mut self, path: P) -> &mut WalkBuilder {
-        self.paths.push(path.as_ref().to_path_buf());
-        self
-    }
-
-    /// The maximum depth to recurse.
-    ///
-    /// The default, `None`, imposes no depth restriction.
-    pub fn max_depth(&mut self, depth: Option<usize>) -> &mut WalkBuilder {
-        self.max_depth = depth;
-        if self.min_depth.is_some()
-            && self.max_depth.is_some()
-            && self.max_depth < self.min_depth
-        {
-            self.max_depth = self.min_depth;
-        }
-        self
-    }
-
-    /// The minimum depth to recurse.
-    ///
-    /// The default, `None`, imposes no minimum depth restriction.
-    pub fn min_depth(&mut self, depth: Option<usize>) -> &mut WalkBuilder {
-        self.min_depth = depth;
-        if self.max_depth.is_some()
-            && self.min_depth.is_some()
-            && self.min_depth > self.max_depth
-        {
-            self.min_depth = self.max_depth;
-        }
-        self
-    }
-
-    /// Whether to follow symbolic links or not.
-    pub fn follow_links(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.follow_links = yes;
-        self
-    }
-
-    /// Whether to ignore files above the specified limit.
-    pub fn max_filesize(&mut self, filesize: Option<u64>) -> &mut WalkBuilder {
-        self.max_filesize = filesize;
-        self
-    }
-
-    /// The number of threads to use for traversal.
-    ///
-    /// Note that this only has an effect when using `build_parallel`.
-    ///
-    /// The default setting is `0`, which chooses the number of threads
-    /// automatically using heuristics.
-    pub fn threads(&mut self, n: usize) -> &mut WalkBuilder {
-        self.threads = n;
-        self
-    }
-
-    /// Add a global ignore file to the matcher.
-    ///
-    /// This has lower precedence than all other sources of ignore rules.
-    ///
-    /// # Errors
-    ///
-    /// If there was a problem adding the ignore file, then an error is
-    /// returned. Note that the error may indicate *partial* failure. For
-    /// example, if an ignore file contains an invalid glob, all other globs
-    /// are still applied.
-    ///
-    /// An error will also occur if this walker could not get the current
-    /// working directory (and `WalkBuilder::current_dir` isn't set).
-    pub fn add_ignore<P: AsRef<Path>>(&mut self, path: P) -> Option<Error> {
-        // CHANGED: Root the ignore file at `""` instead of the current working
-        // directory. Explicit ignores are scoped to the directory of the
-        // ignore file (see `matched_ignore`), and a root of `""` makes the
-        // rules apply to every walked path regardless of the walk root. This
-        // also avoids depending on the current working directory entirely.
-        //
-        // let path = path.as_ref();
-        // let Some(cwd) = self.get_or_set_current_dir() else {
-        //     let err = std::io::Error::other(format!(
-        //         "CWD is not known, ignoring global gitignore {}",
-        //         path.display()
-        //     ));
-        //     return Some(err.into());
-        // };
-        // let mut builder = GitignoreBuilder::new(cwd);
-        let mut builder = GitignoreBuilder::new("");
-        let mut errs = PartialErrorBuilder::default();
-        errs.maybe_push(builder.add(path));
-        match builder.build() {
-            Ok(gi) => {
-                self.ig_builder.add_ignore(gi);
-            }
-            Err(err) => {
-                errs.push(err);
-            }
-        }
-        errs.into_error_option()
-    }
-
-    /// CHANGED: Add a prebuilt Gitignore to the builder.
-    ///
-    /// Like the ignore file added via `add_ignore`, these rules are matched
-    /// against the full path of each walked entry, scoped to the `Gitignore`'s
-    /// root path.
-    pub fn add_gitignore(&mut self, gi: Gitignore) {
-        self.ig_builder.add_ignore(gi);
-    }
-
-    /// Add a custom ignore file name
-    ///
-    /// These ignore files have higher precedence than all other ignore files.
-    ///
-    /// When specifying multiple names, earlier names have lower precedence than
-    /// later names.
-    pub fn add_custom_ignore_filename<S: AsRef<OsStr>>(
-        &mut self,
-        file_name: S,
-    ) -> &mut WalkBuilder {
-        self.ig_builder.add_custom_ignore_filename(file_name);
-        self
-    }
-
-    /// Add an override matcher.
-    ///
-    /// By default, no override matcher is used.
-    ///
-    /// This overrides any previous setting.
-    pub fn overrides(&mut self, overrides: Override) -> &mut WalkBuilder {
-        self.ig_builder.overrides(overrides);
-        self
-    }
-
-    /// Add a file type matcher.
-    ///
-    /// By default, no file type matcher is used.
-    ///
-    /// This overrides any previous setting.
-    pub fn types(&mut self, types: Types) -> &mut WalkBuilder {
-        self.ig_builder.types(types);
-        self
-    }
-
-    /// Enables all the standard ignore filters.
-    ///
-    /// This toggles, as a group, all the filters that are enabled by default:
-    ///
-    /// - [hidden()](#method.hidden)
-    /// - [parents()](#method.parents)
-    /// - [ignore()](#method.ignore)
-    /// - [git_ignore()](#method.git_ignore)
-    /// - [git_global()](#method.git_global)
-    /// - [git_exclude()](#method.git_exclude)
-    ///
-    /// They may still be toggled individually after calling this function.
-    ///
-    /// This is (by definition) enabled by default.
-    pub fn standard_filters(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.hidden(yes)
-            .parents(yes)
-            .ignore(yes)
-            .git_ignore(yes)
-            .git_global(yes)
-            .git_exclude(yes)
-    }
-
-    /// Enables ignoring hidden files.
-    ///
-    /// This is enabled by default.
-    pub fn hidden(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.hidden(yes);
-        self
-    }
-
-    /// Enables reading ignore files from parent directories.
-    ///
-    /// If this is enabled, then .gitignore files in parent directories of each
-    /// file path given are respected. Otherwise, they are ignored.
-    ///
-    /// This is enabled by default.
-    pub fn parents(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.parents(yes);
-        self
-    }
-
-    /// Enables reading `.ignore` files.
-    ///
-    /// `.ignore` files have the same semantics as `gitignore` files and are
-    /// supported by search tools such as ripgrep and The Silver Searcher.
-    ///
-    /// This is enabled by default.
-    pub fn ignore(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.ignore(yes);
-        self
-    }
-
-    /// Enables reading a global gitignore file, whose path is specified in
-    /// git's `core.excludesFile` config option.
-    ///
-    /// Git's config file location is `$HOME/.gitconfig`. If `$HOME/.gitconfig`
-    /// does not exist or does not specify `core.excludesFile`, then
-    /// `$XDG_CONFIG_HOME/git/ignore` is read. If `$XDG_CONFIG_HOME` is not
-    /// set or is empty, then `$HOME/.config/git/ignore` is used instead.
-    ///
-    /// This is enabled by default.
-    pub fn git_global(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.git_global(yes);
-        self
-    }
-
-    /// Enables reading `.gitignore` files.
-    ///
-    /// `.gitignore` files have match semantics as described in the `gitignore`
-    /// man page.
-    ///
-    /// This is enabled by default.
-    pub fn git_ignore(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.git_ignore(yes);
-        self
-    }
-
-    /// Enables reading `.git/info/exclude` files.
-    ///
-    /// `.git/info/exclude` files have match semantics as described in the
-    /// `gitignore` man page.
-    ///
-    /// This is enabled by default.
-    pub fn git_exclude(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.git_exclude(yes);
-        self
-    }
-
-    /// Whether a git repository is required to apply git-related ignore
-    /// rules (global rules, .gitignore and local exclude rules).
-    ///
-    /// When disabled, git-related ignore rules are applied even when searching
-    /// outside a git repository.
-    ///
-    /// In particular, if this is `false` then `.gitignore` files will be read
-    /// from parent directories above the git root directory containing `.git`,
-    /// which is different from the git behavior.
-    pub fn require_git(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.require_git(yes);
-        self
-    }
-
-    /// Process ignore files case insensitively
-    ///
-    /// This is disabled by default.
-    pub fn ignore_case_insensitive(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.ig_builder.ignore_case_insensitive(yes);
-        self
-    }
-
-    /// Set a function for sorting directory entries by their path.
-    ///
-    /// If a compare function is set, the resulting iterator will return all
-    /// paths in sorted order. The compare function will be called to compare
-    /// entries from the same directory.
-    ///
-    /// This is like `sort_by_file_name`, except the comparator accepts
-    /// a `&Path` instead of the base file name, which permits it to sort by
-    /// more criteria.
-    ///
-    /// This method will override any previous sorter set by this method or
-    /// by `sort_by_file_name`.
-    ///
-    /// Note that this is not used in the parallel iterator.
-    pub fn sort_by_file_path<F>(&mut self, cmp: F) -> &mut WalkBuilder
-    where
-        F: Fn(&Path, &Path) -> Ordering + Send + Sync + 'static,
-    {
-        self.sorter = Some(Sorter::ByPath(Arc::new(cmp)));
-        self
-    }
-
-    /// Set a function for sorting directory entries by file name.
-    ///
-    /// If a compare function is set, the resulting iterator will return all
-    /// paths in sorted order. The compare function will be called to compare
-    /// names from entries from the same directory using only the name of the
-    /// entry.
-    ///
-    /// This method will override any previous sorter set by this method or
-    /// by `sort_by_file_path`.
-    ///
-    /// Note that this is not used in the parallel iterator.
-    pub fn sort_by_file_name<F>(&mut self, cmp: F) -> &mut WalkBuilder
-    where
-        F: Fn(&OsStr, &OsStr) -> Ordering + Send + Sync + 'static,
-    {
-        self.sorter = Some(Sorter::ByName(Arc::new(cmp)));
-        self
-    }
-
-    /// Do not cross file system boundaries.
-    ///
-    /// When this option is enabled, directory traversal will not descend into
-    /// directories that are on a different file system from the root path.
-    ///
-    /// Currently, this option is only supported on Unix and Windows. If this
-    /// option is used on an unsupported platform, then directory traversal
-    /// will immediately return an error and will not yield any entries.
-    pub fn same_file_system(&mut self, yes: bool) -> &mut WalkBuilder {
-        self.same_file_system = yes;
-        self
-    }
-
-    /// Do not yield directory entries that are believed to correspond to
-    /// stdout.
-    ///
-    /// This is useful when a command is invoked via shell redirection to a
-    /// file that is also being read. For example, `grep -r foo ./ > results`
-    /// might end up trying to search `results` even though it is also writing
-    /// to it, which could cause an unbounded feedback loop. Setting this
-    /// option prevents this from happening by skipping over the `results`
-    /// file.
-    ///
-    /// This is disabled by default.
-    pub fn skip_stdout(&mut self, yes: bool) -> &mut WalkBuilder {
-        if yes {
-            self.skip = stdout_handle().map(Arc::new);
-        } else {
-            self.skip = None;
-        }
-        self
-    }
-
-    /// Yields only entries which satisfy the given predicate and skips
-    /// descending into directories that do not satisfy the given predicate.
-    ///
-    /// The predicate is applied to all entries. If the predicate is
-    /// true, iteration carries on as normal. If the predicate is false, the
-    /// entry is ignored and if it is a directory, it is not descended into.
-    ///
-    /// Note that the errors for reading entries that may not satisfy the
-    /// predicate will still be yielded.
-    ///
-    /// Note also that only one filter predicate can be applied to a
-    /// `WalkBuilder`. Calling this subsequent times overrides previous filter
-    /// predicates.
-    pub fn filter_entry<P>(&mut self, filter: P) -> &mut WalkBuilder
-    where
-        P: Fn(&DirEntry) -> bool + Send + Sync + 'static,
-    {
-        self.filter = Some(Filter(Arc::new(filter)));
-        self
-    }
-
-    /// Set the current working directory used for matching global gitignores.
-    ///
-    /// If this is not set, then this walker will attempt to discover the
-    /// correct path from the environment's current working directory. If
-    /// that fails, then global gitignore files will be ignored.
-    ///
-    /// Global gitignore files come from things like a user's git configuration
-    /// or from gitignore files added via [`WalkBuilder::add_ignore`].
-    pub fn current_dir(
-        &mut self,
-        cwd: impl Into<PathBuf>,
-    ) -> &mut WalkBuilder {
-        let cwd = cwd.into();
-        self.ig_builder.current_dir(cwd.clone());
-        if let Err(cwd) = self.global_gitignores_relative_to.set(Ok(cwd)) {
-            // OK because `Err` from `set` implies a value exists.
-            *self.global_gitignores_relative_to.get_mut().unwrap() = cwd;
-        }
-        self
-    }
-
-    /// Gets the currently configured CWD on this walk builder.
-    ///
-    /// This is "lazy." That is, we only ask for the CWD from the environment
-    /// if `WalkBuilder::current_dir` hasn't been called yet. And we ensure
-    /// that we only do it once.
-    fn get_or_set_current_dir(&self) -> Option<&Path> {
-        let result = self.global_gitignores_relative_to.get_or_init(|| {
-            let result = std::env::current_dir().map_err(Arc::new);
-            match result {
-                Ok(ref path) => {
-                    log::trace!(
-                        "automatically discovered CWD: {}",
-                        path.display()
-                    );
-                }
-                Err(ref err) => {
-                    log::debug!(
-                        "failed to find CWD \
-                         (global gitignores will be ignored): \
-                         {err}"
-                    );
-                }
-            }
-            result
-        });
-        result.as_ref().ok().map(|path| &**path)
-    }
-
-    /// Build the root ignore matcher shared by all consumers of this builder.
-    fn build_ignore(&self) -> Ignore {
-        self.get_or_set_current_dir()
-            .map(|cwd| self.ig_builder.build_with_cwd(Some(cwd.to_path_buf())))
-            .unwrap_or_else(|| self.ig_builder.build())
-    }
-}
-
-/// Walk is a recursive directory iterator over file paths in one or more
-/// directories.
-///
-/// Only file and directory paths matching the rules are returned. By default,
-/// ignore files like `.gitignore` are respected. The precise matching rules
-/// and precedence is explained in the documentation for `WalkBuilder`.
-pub struct Walk {
-    its: std::vec::IntoIter<(PathBuf, Option<WalkEventIter>)>,
-    it: Option<WalkEventIter>,
-    ig_root: Ignore,
-    ig: Ignore,
-    max_depth: Option<usize>,
-    max_filesize: Option<u64>,
-    skip: Option<Arc<Handle>>,
-    filter: Option<Filter>,
-}
-
-impl Walk {
-    /// Creates a new recursive directory iterator for the file path given.
-    ///
-    /// Note that this uses default settings, which include respecting
-    /// `.gitignore` files. To configure the iterator, use `WalkBuilder`
-    /// instead.
-    pub fn new<P: AsRef<Path>>(path: P) -> Walk {
-        WalkBuilder::new(path).build()
-    }
-
-    /// Create a new recursive directory iterator from the sequence of paths
-    /// given.
-    ///
-    /// Note that if the provided iterator is empty, then `Walk` is guaranteed
-    /// to yield zero entries.
-    pub fn from_iter<P: AsRef<Path>, I: IntoIterator<Item = P>>(
-        paths: I,
-    ) -> Walk {
-        WalkBuilder::from_iter(paths).build()
-    }
-
-    fn skip_entry(&self, ent: &DirEntry) -> Result<bool, Error> {
-        if ent.depth() == 0 {
-            return Ok(false);
-        }
-        // We ensure that trivial skipping is done before any other potentially
-        // expensive operations (stat, filesystem other) are done. This seems
-        // like an obvious optimization but becomes critical when filesystem
-        // operations even as simple as stat can result in significant
-        // overheads; an example of this was a bespoke filesystem layer in
-        // Windows that hosted files remotely and would download them on-demand
-        // when particular filesystem operations occurred. Users of this system
-        // who ensured correct file-type filters were being used could still
-        // get unnecessary file access resulting in large downloads.
-        if should_skip_entry(&self.ig, ent) {
-            return Ok(true);
-        }
-        if let Some(ref stdout) = self.skip {
-            if path_equals(ent, stdout)? {
-                return Ok(true);
-            }
-        }
-        if self.max_filesize.is_some() && !ent.is_dir() {
-            return Ok(skip_filesize(
-                self.max_filesize.unwrap(),
-                ent.path(),
-                &ent.metadata().ok(),
-            ));
-        }
-        if let Some(Filter(filter)) = &self.filter {
-            if !filter(ent) {
-                return Ok(true);
-            }
-        }
-        Ok(false)
-    }
-}
-
-impl Iterator for Walk {
-    type Item = Result<DirEntry, Error>;
-
-    #[inline(always)]
-    fn next(&mut self) -> Option<Result<DirEntry, Error>> {
-        loop {
-            let ev = match self.it.as_mut().and_then(|it| it.next()) {
-                Some(ev) => ev,
-                None => {
-                    match self.its.next() {
-                        None => return None,
-                        Some((_, None)) => {
-                            return Some(Ok(DirEntry::new_stdin()));
-                        }
-                        Some((path, Some(it))) => {
-                            self.it = Some(it);
-                            if path.is_dir() {
-                                let (ig, err) = self.ig_root.add_parents(path);
-                                self.ig = ig;
-                                if let Some(err) = err {
-                                    return Some(Err(err));
-                                }
-                            } else {
-                                self.ig = self.ig_root.clone();
-                            }
-                        }
-                    }
-                    continue;
-                }
-            };
-            match ev {
-                Err(err) => {
-                    return Some(Err(Error::from_walkdir(err)));
-                }
-                Ok(WalkEvent::Exit) => {
-                    self.ig = self.ig.parent().unwrap();
-                }
-                Ok(WalkEvent::Dir(ent)) => {
-                    let mut ent = DirEntry::new_walkdir(ent, None);
-                    let should_skip = match self.skip_entry(&ent) {
-                        Err(err) => return Some(Err(err)),
-                        Ok(should_skip) => should_skip,
-                    };
-                    if should_skip {
-                        self.it.as_mut().unwrap().it.skip_current_dir();
-                        // Still need to push this on the stack because
-                        // we'll get a WalkEvent::Exit event for this dir.
-                        // Its ignore files cannot apply to any visited entry.
-                        let (igtmp, _) =
-                            self.ig.add_child_with_entries(ent.path(), &[]);
-                        self.ig = igtmp;
-                        continue;
-                    }
-                    let (igtmp, err) = if self.max_depth == Some(ent.depth()) {
-                        self.ig.add_child_with_entries(ent.path(), &[])
-                    } else {
-                        self.ig.add_child(ent.path())
-                    };
-                    self.ig = igtmp;
-                    ent.err = err;
-                    return Some(Ok(ent));
-                }
-                Ok(WalkEvent::File(ent)) => {
-                    let ent = DirEntry::new_walkdir(ent, None);
-                    let should_skip = match self.skip_entry(&ent) {
-                        Err(err) => return Some(Err(err)),
-                        Ok(should_skip) => should_skip,
-                    };
-                    if should_skip {
-                        continue;
-                    }
-                    return Some(Ok(ent));
-                }
-            }
-        }
-    }
-}
-
-impl std::iter::FusedIterator for Walk {}
-
-/// WalkEventIter transforms a WalkDir iterator into an iterator that more
-/// accurately describes the directory tree. Namely, it emits events that are
-/// one of three types: directory, file or "exit." An "exit" event means that
-/// the entire contents of a directory have been enumerated.
-struct WalkEventIter {
-    depth: usize,
-    it: walkdir::IntoIter,
-    next: Option<Result<walkdir::DirEntry, walkdir::Error>>,
-}
-
-#[derive(Debug)]
-enum WalkEvent {
-    Dir(walkdir::DirEntry),
-    File(walkdir::DirEntry),
-    Exit,
-}
-
-impl From<WalkDir> for WalkEventIter {
-    fn from(it: WalkDir) -> WalkEventIter {
-        WalkEventIter { depth: 0, it: it.into_iter(), next: None }
-    }
-}
-
-impl Iterator for WalkEventIter {
-    type Item = walkdir::Result<WalkEvent>;
-
-    #[inline(always)]
-    fn next(&mut self) -> Option<walkdir::Result<WalkEvent>> {
-        let dent = self.next.take().or_else(|| self.it.next());
-        let depth = match dent {
-            None => 0,
-            Some(Ok(ref dent)) => dent.depth(),
-            Some(Err(ref err)) => err.depth(),
-        };
-        if depth < self.depth {
-            self.depth -= 1;
-            self.next = dent;
-            return Some(Ok(WalkEvent::Exit));
-        }
-        self.depth = depth;
-        match dent {
-            None => None,
-            Some(Err(err)) => Some(Err(err)),
-            Some(Ok(dent)) => {
-                if walkdir_is_dir(&dent) {
-                    self.depth += 1;
-                    Some(Ok(WalkEvent::Dir(dent)))
-                } else {
-                    Some(Ok(WalkEvent::File(dent)))
-                }
-            }
-        }
-    }
-}
-
-/// WalkState is used in the parallel recursive directory iterator to indicate
-/// whether walking should continue as normal, skip descending into a
-/// particular directory or quit the walk entirely.
-#[derive(Clone, Copy, Debug, Eq, PartialEq)]
-pub enum WalkState {
-    /// Continue walking as normal.
-    Continue,
-    /// If the directory entry given is a directory, don't descend into it.
-    /// In all other cases, this has no effect.
-    Skip,
-    /// Quit the entire iterator as soon as possible.
-    ///
-    /// Note that this is an inherently asynchronous action. It is possible
-    /// for more entries to be yielded even after instructing the iterator
-    /// to quit.
-    Quit,
-}
-
-impl WalkState {
-    fn is_continue(&self) -> bool {
-        *self == WalkState::Continue
-    }
-
-    fn is_quit(&self) -> bool {
-        *self == WalkState::Quit
-    }
-}
-
-/// A builder for constructing a visitor when using [`WalkParallel::visit`].
-/// The builder will be called for each thread started by `WalkParallel`. The
-/// visitor returned from each builder is then called for every directory
-/// entry.
-pub trait ParallelVisitorBuilder<'s> {
-    /// Create per-thread `ParallelVisitor`s for `WalkParallel`.
-    fn build(&mut self) -> Box<dyn ParallelVisitor + 's>;
-}
-
-impl<'a, 's, P: ParallelVisitorBuilder<'s>> ParallelVisitorBuilder<'s>
-    for &'a mut P
-{
-    fn build(&mut self) -> Box<dyn ParallelVisitor + 's> {
-        (**self).build()
-    }
-}
-
-/// Receives files and directories for the current thread.
-///
-/// Setup for the traversal can be implemented as part of
-/// [`ParallelVisitorBuilder::build`]. Teardown when traversal finishes can be
-/// implemented by implementing the `Drop` trait on your traversal type.
-pub trait ParallelVisitor: Send {
-    /// Receives files and directories for the current thread. This is called
-    /// once for every directory entry visited by traversal.
-    fn visit(&mut self, entry: Result<DirEntry, Error>) -> WalkState;
-}
-
-struct FnBuilder<F> {
-    builder: F,
-}
-
-impl<'s, F: FnMut() -> FnVisitor<'s>> ParallelVisitorBuilder<'s>
-    for FnBuilder<F>
-{
-    fn build(&mut self) -> Box<dyn ParallelVisitor + 's> {
-        let visitor = (self.builder)();
-        Box::new(FnVisitorImp { visitor })
-    }
-}
-
-type FnVisitor<'s> =
-    Box<dyn FnMut(Result<DirEntry, Error>) -> WalkState + Send + 's>;
-
-struct FnVisitorImp<'s> {
-    visitor: FnVisitor<'s>,
-}
-
-impl<'s> ParallelVisitor for FnVisitorImp<'s> {
-    fn visit(&mut self, entry: Result<DirEntry, Error>) -> WalkState {
-        (self.visitor)(entry)
-    }
-}
-
-/// WalkParallel is a parallel recursive directory iterator over files paths
-/// in one or more directories.
-///
-/// Only file and directory paths matching the rules are returned. By default,
-/// ignore files like `.gitignore` are respected. The precise matching rules
-/// and precedence is explained in the documentation for `WalkBuilder`.
-///
-/// Unlike `Walk`, this uses multiple threads for traversing a directory.
-pub struct WalkParallel {
-    paths: std::vec::IntoIter<PathBuf>,
-    ig_root: Ignore,
-    max_filesize: Option<u64>,
-    max_depth: Option<usize>,
-    min_depth: Option<usize>,
-    follow_links: bool,
-    same_file_system: bool,
-    threads: usize,
-    skip: Option<Arc<Handle>>,
-    filter: Option<Filter>,
-}
-
-impl WalkParallel {
-    /// Execute the parallel recursive directory iterator. `mkf` is called
-    /// for each thread used for iteration. The function produced by `mkf`
-    /// is then in turn called for each visited file path.
-    pub fn run<'s, F>(self, mkf: F)
-    where
-        F: FnMut() -> FnVisitor<'s>,
-    {
-        self.visit(&mut FnBuilder { builder: mkf })
-    }
-
-    /// Execute the parallel recursive directory iterator using a custom
-    /// visitor.
-    ///
-    /// The builder given is used to construct a visitor for every thread
-    /// used by this traversal. The visitor returned from each builder is then
-    /// called for every directory entry seen by that thread.
-    ///
-    /// Typically, creating a custom visitor is useful if you need to perform
-    /// some kind of cleanup once traversal is finished. This can be achieved
-    /// by implementing `Drop` for your builder (or for your visitor, if you
-    /// want to execute cleanup for every thread that is launched).
-    ///
-    /// For example, each visitor might build up a data structure of results
-    /// corresponding to the directory entries seen for each thread. Since each
-    /// visitor runs on only one thread, this build-up can be done without
-    /// synchronization. Then, once traversal is complete, all of the results
-    /// can be merged together into a single data structure.
-    pub fn visit(mut self, builder: &mut dyn ParallelVisitorBuilder<'_>) {
-        let threads = self.threads();
-        let mut stack = vec![];
-        {
-            let mut visitor = builder.build();
-            let mut paths = Vec::new().into_iter();
-            std::mem::swap(&mut paths, &mut self.paths);
-            // Send the initial set of root paths to the pool of workers. Note
-            // that we only send directories. For files, we send to them the
-            // callback directly.
-            for path in paths {
-                let (dent, root_device) = if path == Path::new("-") {
-                    (DirEntry::new_stdin(), None)
-                } else {
-                    let root_device = if !self.same_file_system {
-                        None
-                    } else {
-                        match device_num(&path) {
-                            Ok(root_device) => Some(root_device),
-                            Err(err) => {
-                                let err = Error::Io(err).with_path(path);
-                                if visitor.visit(Err(err)).is_quit() {
-                                    return;
-                                }
-                                continue;
-                            }
-                        }
-                    };
-                    match DirEntryRaw::from_path(0, path, false) {
-                        Ok(dent) => {
-                            (DirEntry::new_raw(dent, None), root_device)
-                        }
-                        Err(err) => {
-                            if visitor.visit(Err(err)).is_quit() {
-                                return;
-                            }
-                            continue;
-                        }
-                    }
-                };
-                stack.push(Message::Work(Work {
-                    dent,
-                    ignore: self.ig_root.clone(),
-                    root_device,
-                }));
-            }
-            // ... but there's no need to start workers if we don't need them.
-            if stack.is_empty() {
-                return;
-            }
-        }
-        // Create the workers and then wait for them to finish.
-        let quit_now = Arc::new(AtomicBool::new(false));
-        let active_workers = Arc::new(AtomicUsize::new(threads));
-        let stacks = Stack::new_for_each_thread(threads, stack);
-        // Collect all of the workers first. In the case that
-        // `builder.build()` panics, we want that to happen and
-        // propagate before we actually start to run any of the
-        // workers.
-        let workers: Vec<_> = stacks
-            .into_iter()
-            .map(|stack| Worker {
-                visitor: builder.build(),
-                stack,
-                quit_now: quit_now.clone(),
-                active_workers: active_workers.clone(),
-                max_depth: self.max_depth,
-                min_depth: self.min_depth,
-                max_filesize: self.max_filesize,
-                follow_links: self.follow_links,
-                skip: self.skip.clone(),
-                filter: self.filter.clone(),
-            })
-            .collect();
-        std::thread::scope(|s| {
-            let handles: Vec<_> = workers
-                .into_iter()
-                .map(|worker| s.spawn(|| worker.run()))
-                .collect();
-            for handle in handles {
-                handle.join().unwrap();
-            }
-        });
-    }
-
-    fn threads(&self) -> usize {
-        if self.threads == 0 {
-            std::thread::available_parallelism().map_or(1, |n| n.get()).min(12)
-        } else {
-            self.threads
-        }
-    }
-}
-
-/// Message is the set of instructions that a worker knows how to process.
-enum Message {
-    /// A work item corresponds to a directory that should be descended into.
-    /// Work items for entries that should be skipped or ignored should not
-    /// be produced.
-    Work(Work),
-    /// This instruction indicates that the worker should quit.
-    Quit,
-}
-
-/// A unit of work for each worker to process.
-///
-/// Each unit of work corresponds to a directory that should be descended
-/// into.
-struct Work {
-    /// The directory entry.
-    dent: DirEntry,
-    /// Any ignore matchers that have been built for this directory's parents.
-    ignore: Ignore,
-    /// The root device number. When present, only files with the same device
-    /// number should be considered.
-    root_device: Option<u64>,
-}
-
-#[derive(Default)]
-struct ReadDirResult {
-    entries: Vec<fs::DirEntry>,
-    errors: Vec<Error>,
-}
-
-impl Work {
-    /// Returns true if and only if this work item is a directory.
-    fn is_dir(&self) -> bool {
-        self.dent.is_dir()
-    }
-
-    /// Returns true if and only if this work item is a symlink.
-    fn is_symlink(&self) -> bool {
-        self.dent.file_type().map_or(false, |ft| ft.is_symlink())
-    }
-
-    /// Adds ignore rules for parent directories.
-    ///
-    /// Note that this only applies to entries at depth 0. On all other
-    /// entries, this is a no-op.
-    fn add_parents(&mut self) -> Option<Error> {
-        if self.dent.depth() > 0 {
-            return None;
-        }
-        // At depth 0, the path of this entry is a root path, so we can
-        // use it directly to add parent ignore rules.
-        let (ig, err) = self.ignore.add_parents(self.dent.path());
-        self.ignore = ig;
-        err
-    }
-
-    /// Adds ignore rules for this directory without reading its contents.
-    fn add_ignore(&mut self) {
-        let (ig, err) = self.ignore.add_child(self.dent.path());
-        self.ignore = ig;
-        self.dent.err = err;
-    }
-
-    /// Reads the directory contents of this work item and adds ignore
-    /// rules for this directory.
-    ///
-    /// If there was a problem with reading the directory contents, then
-    /// an error is returned. If there was a problem reading the ignore
-    /// rules for this directory, then the error is attached to this
-    /// work item's directory entry.
-    fn read_dir(&mut self) -> Result<ReadDirResult, Error> {
-        let readdir = match fs::read_dir(self.dent.path()) {
-            Ok(readdir) => readdir,
-            Err(err) => {
-                let err = Error::from(err)
-                    .with_path(self.dent.path())
-                    .with_depth(self.dent.depth());
-                return Err(err);
-            }
-        };
-        // Actually descend into the directory and read its contents
-        let mut result = ReadDirResult::default();
-        for entry in readdir {
-            match entry {
-                Ok(entry) => result.entries.push(entry),
-                Err(err) => result.errors.push(
-                    Error::from(err)
-                        .with_path(self.dent.path())
-                        .with_depth(self.dent.depth() + 1),
-                ),
-            }
-        }
-        let (ig, err) = self
-            .ignore
-            .add_child_with_entries(self.dent.path(), &result.entries);
-        self.ignore = ig;
-        self.dent.err = err;
-        Ok(result)
-    }
-}
-
-/// A work-stealing stack.
-#[derive(Debug)]
-struct Stack {
-    /// This thread's index.
-    index: usize,
-    /// The thread-local stack.
-    deque: Deque<Message>,
-    /// The work stealers.
-    stealers: Arc<[Stealer<Message>]>,
-}
-
-impl Stack {
-    /// Create a work-stealing stack for each thread. The given messages
-    /// correspond to the initial paths to start the search at. They will
-    /// be distributed automatically to each stack in a round-robin fashion.
-    fn new_for_each_thread(threads: usize, init: Vec<Message>) -> Vec<Stack> {
-        // Using new_lifo() ensures each worker operates depth-first, not
-        // breadth-first. We do depth-first because a breadth first traversal
-        // on wide directories with a lot of gitignores is disastrous (for
-        // example, searching a directory tree containing all of crates.io).
-        let deques: Vec<Deque<Message>> =
-            std::iter::repeat_with(Deque::new_lifo).take(threads).collect();
-        let stealers = Arc::<[Stealer<Message>]>::from(
-            deques.iter().map(Deque::stealer).collect::<Vec<_>>(),
-        );
-        let stacks: Vec<Stack> = deques
-            .into_iter()
-            .enumerate()
-            .map(|(index, deque)| Stack {
-                index,
-                deque,
-                stealers: stealers.clone(),
-            })
-            .collect();
-        // Distribute the initial messages, reverse the order to cancel out
-        // the other reversal caused by the inherent LIFO processing of the
-        // per-thread stacks which are filled here.
-        init.into_iter()
-            .rev()
-            .zip(stacks.iter().cycle())
-            .for_each(|(m, s)| s.push(m));
-        stacks
-    }
-
-    /// Push a message.
-    fn push(&self, msg: Message) {
-        self.deque.push(msg);
-    }
-
-    /// Pop a message.
-    fn pop(&self) -> Option<Message> {
-        self.deque.pop().or_else(|| self.steal())
-    }
-
-    /// Steal a message from another queue.
-    fn steal(&self) -> Option<Message> {
-        // For fairness, try to steal from index + 1, index + 2, ... len - 1,
-        // then wrap around to 0, 1, ... index - 1.
-        let (left, right) = self.stealers.split_at(self.index);
-        // Don't steal from ourselves
-        let right = &right[1..];
-
-        right
-            .iter()
-            .chain(left.iter())
-            .map(|s| s.steal_batch_and_pop(&self.deque))
-            .find_map(|s| s.success())
-    }
-}
-
-/// A worker is responsible for descending into directories, updating the
-/// ignore matchers, producing new work and invoking the caller's callback.
-///
-/// Note that a worker is *both* a producer and a consumer.
-struct Worker<'s> {
-    /// The caller's callback.
-    visitor: Box<dyn ParallelVisitor + 's>,
-    /// A work-stealing stack of work to do.
-    ///
-    /// We use a stack instead of a channel because a stack lets us visit
-    /// directories in depth first order. This can substantially reduce peak
-    /// memory usage by keeping both the number of file paths and gitignore
-    /// matchers in memory lower.
-    stack: Stack,
-    /// Whether all workers should terminate at the next opportunity. Note
-    /// that we need this because we don't want other `Work` to be done after
-    /// we quit. We wouldn't need this if have a priority channel.
-    quit_now: Arc<AtomicBool>,
-    /// The number of currently active workers.
-    active_workers: Arc<AtomicUsize>,
-    /// The maximum depth of directories to descend. A value of `0` means no
-    /// descension at all.
-    max_depth: Option<usize>,
-    /// The minimum depth of directories to descend.
-    min_depth: Option<usize>,
-    /// The maximum size a searched file can be (in bytes). If a file exceeds
-    /// this size it will be skipped.
-    max_filesize: Option<u64>,
-    /// Whether to follow symbolic links or not. When this is enabled, loop
-    /// detection is performed.
-    follow_links: bool,
-    /// A file handle to skip, currently is either `None` or stdout, if it's
-    /// a file and it has been requested to skip files identical to stdout.
-    skip: Option<Arc<Handle>>,
-    /// A predicate applied to dir entries. If true, the entry and all
-    /// children will be skipped.
-    filter: Option<Filter>,
-}
-
-impl<'s> Worker<'s> {
-    /// Runs this worker until there is no more work left to do.
-    ///
-    /// The worker will call the caller's callback for all entries that aren't
-    /// skipped by the ignore matcher.
-    fn run(mut self) {
-        while let Some(work) = self.get_work() {
-            if let WalkState::Quit = self.run_one(work) {
-                self.quit_now();
-            }
-        }
-    }
-
-    fn run_one(&mut self, mut work: Work) -> WalkState {
-        let should_visit = self
-            .min_depth
-            .map(|min_depth| work.dent.depth() >= min_depth)
-            .unwrap_or(true);
-
-        // If the work is not a directory, then we can just execute the
-        // caller's callback immediately and move on.
-        if work.is_symlink() || !work.is_dir() {
-            return if should_visit {
-                self.visitor.visit(Ok(work.dent))
-            } else {
-                WalkState::Continue
-            };
-        }
-        if let Some(err) = work.add_parents() {
-            let state = self.visitor.visit(Err(err));
-            if state.is_quit() {
-                return state;
-            }
-        }
-
-        let descend = if let Some(root_device) = work.root_device {
-            match is_same_file_system(root_device, work.dent.path()) {
-                Ok(true) => true,
-                Ok(false) => false,
-                Err(err) => {
-                    let state = self.visitor.visit(Err(err));
-                    if state.is_quit() {
-                        return state;
-                    }
-                    false
-                }
-            }
-        } else {
-            true
-        };
-
-        // Try to read the directory first before we transfer ownership
-        // to the provided closure. Do not unwrap it immediately, though,
-        // as we may receive an `Err` value e.g. in the case when we do not
-        // have sufficient read permissions to list the directory.
-        // In that case we still want to provide the closure with a valid
-        // entry before passing the error value.
-        let depth = work.dent.depth();
-        let readdir = if descend && self.max_depth.is_none_or(|m| depth < m) {
-            Some(work.read_dir())
-        } else {
-            work.add_ignore();
-            None
-        };
-        if should_visit {
-            let state = self.visitor.visit(Ok(work.dent));
-            if !state.is_continue() {
-                return state;
-            }
-        }
-        if !descend {
-            return WalkState::Skip;
-        }
-
-        let readdir = match readdir {
-            Some(readdir) => readdir,
-            None => return WalkState::Skip,
-        };
-        let readdir = match readdir {
-            Ok(readdir) => readdir,
-            Err(err) => {
-                return self.visitor.visit(Err(err));
-            }
-        };
-
-        for result in readdir.entries {
-            let state = self.generate_work(
-                &work.ignore,
-                depth + 1,
-                work.root_device,
-                result,
-            );
-            if state.is_quit() {
-                return state;
-            }
-        }
-        for err in readdir.errors {
-            let state = self.visitor.visit(Err(err));
-            if state.is_quit() {
-                return state;
-            }
-        }
-        WalkState::Continue
-    }
-
-    /// Decides whether to submit the given directory entry as a file to
-    /// search.
-    ///
-    /// If the entry is a path that should be ignored, then this is a no-op.
-    /// Otherwise, the entry is pushed on to the queue. (The actual execution
-    /// of the callback happens in `run_one`.)
-    ///
-    /// If an error occurs while reading the entry, then it is sent to the
-    /// caller's callback.
-    ///
-    /// `ig` is the `Ignore` matcher for the parent directory. `depth` should
-    /// be the depth of this entry. `result` should be the item yielded by
-    /// a directory iterator.
-    fn generate_work(
-        &mut self,
-        ig: &Ignore,
-        depth: usize,
-        root_device: Option<u64>,
-        fs_dent: fs::DirEntry,
-    ) -> WalkState {
-        let mut dent = match DirEntryRaw::from_entry(depth, &fs_dent) {
-            Ok(dent) => DirEntry::new_raw(dent, None),
-            Err(err) => {
-                return self.visitor.visit(Err(err));
-            }
-        };
-        let is_symlink = dent.file_type().map_or(false, |ft| ft.is_symlink());
-        if self.follow_links && is_symlink {
-            let path = dent.path().to_path_buf();
-            dent = match DirEntryRaw::from_path(depth, path, true) {
-                Ok(dent) => DirEntry::new_raw(dent, None),
-                Err(err) => {
-                    return self.visitor.visit(Err(err));
-                }
-            };
-            if dent.is_dir() {
-                if let Err(err) = check_symlink_loop(ig, dent.path(), depth) {
-                    return self.visitor.visit(Err(err));
-                }
-            }
-        }
-        // N.B. See analogous call in the single-threaded implementation about
-        // why it's important for this to come before the checks below.
-        if should_skip_entry(ig, &dent) {
-            return WalkState::Continue;
-        }
-        if let Some(ref stdout) = self.skip {
-            let is_stdout = match path_equals(&dent, stdout) {
-                Ok(is_stdout) => is_stdout,
-                Err(err) => return self.visitor.visit(Err(err)),
-            };
-            if is_stdout {
-                return WalkState::Continue;
-            }
-        }
-        let should_skip_filesize =
-            if self.max_filesize.is_some() && !dent.is_dir() {
-                skip_filesize(
-                    self.max_filesize.unwrap(),
-                    dent.path(),
-                    &dent.metadata().ok(),
-                )
-            } else {
-                false
-            };
-        let should_skip_filtered =
-            if let Some(Filter(predicate)) = &self.filter {
-                !predicate(&dent)
-            } else {
-                false
-            };
-        if !should_skip_filesize && !should_skip_filtered {
-            self.send(Work { dent, ignore: ig.clone(), root_device });
-        }
-        WalkState::Continue
-    }
-
-    /// Returns the next directory to descend into.
-    ///
-    /// If all work has been exhausted, then this returns None. The worker
-    /// should then subsequently quit.
-    fn get_work(&mut self) -> Option<Work> {
-        let mut value = self.recv();
-        loop {
-            // Simulate a priority channel: If quit_now flag is set, we can
-            // receive only quit messages.
-            if self.is_quit_now() {
-                value = Some(Message::Quit)
-            }
-            match value {
-                Some(Message::Work(work)) => {
-                    return Some(work);
-                }
-                Some(Message::Quit) => {
-                    // Repeat quit message to wake up sleeping threads, if
-                    // any. The domino effect will ensure that every thread
-                    // will quit.
-                    self.send_quit();
-                    return None;
-                }
-                None => {
-                    if self.deactivate_worker() == 0 {
-                        // If deactivate_worker() returns 0, every worker thread
-                        // is currently within the critical section between the
-                        // acquire in deactivate_worker() and the release in
-                        // activate_worker() below.  For this to happen, every
-                        // worker's local deque must be simultaneously empty,
-                        // meaning there is no more work left at all.
-                        self.send_quit();
-                        return None;
-                    }
-                    // Wait for next `Work` or `Quit` message.
-                    loop {
-                        if self.is_quit_now() {
-                            return None;
-                        }
-                        if let Some(v) = self.recv() {
-                            self.activate_worker();
-                            value = Some(v);
-                            break;
-                        }
-                        // Our stack isn't blocking. Instead of burning the
-                        // CPU waiting, we let the thread sleep for a bit. In
-                        // general, this tends to only occur once the search is
-                        // approaching termination.
-                        let dur = std::time::Duration::from_millis(1);
-                        std::thread::sleep(dur);
-                    }
-                }
-            }
-        }
-    }
-
-    /// Indicates that all workers should quit immediately.
-    fn quit_now(&self) {
-        self.quit_now.store(true, AtomicOrdering::SeqCst);
-    }
-
-    /// Returns true if this worker should quit immediately.
-    fn is_quit_now(&self) -> bool {
-        self.quit_now.load(AtomicOrdering::SeqCst)
-    }
-
-    /// Send work.
-    fn send(&self, work: Work) {
-        self.stack.push(Message::Work(work));
-    }
-
-    /// Send a quit message.
-    fn send_quit(&self) {
-        self.stack.push(Message::Quit);
-    }
-
-    /// Receive work.
-    fn recv(&self) -> Option<Message> {
-        self.stack.pop()
-    }
-
-    /// Deactivates a worker and returns the number of currently active workers.
-    fn deactivate_worker(&self) -> usize {
-        self.active_workers.fetch_sub(1, AtomicOrdering::Acquire) - 1
-    }
-
-    /// Reactivates a worker.
-    fn activate_worker(&self) {
-        self.active_workers.fetch_add(1, AtomicOrdering::Release);
-    }
-}
-
-impl<'s> Drop for Worker<'s> {
-    fn drop(&mut self) {
-        if std::thread::panicking() {
-            self.quit_now();
-        }
-    }
-}
-
-fn check_symlink_loop(
-    ig_parent: &Ignore,
-    child_path: &Path,
-    child_depth: usize,
-) -> Result<(), Error> {
-    let hchild = Handle::from_path(child_path).map_err(|err| {
-        Error::from(err).with_path(child_path).with_depth(child_depth)
-    })?;
-    for ig in ig_parent.parents().take_while(|ig| !ig.is_absolute_parent()) {
-        let h = Handle::from_path(ig.path()).map_err(|err| {
-            Error::from(err).with_path(child_path).with_depth(child_depth)
-        })?;
-        if hchild == h {
-            return Err(Error::Loop {
-                ancestor: ig.path().to_path_buf(),
-                child: child_path.to_path_buf(),
-            }
-            .with_depth(child_depth));
-        }
-    }
-    Ok(())
-}
-
-// Before calling this function, make sure that you ensure that is really
-// necessary as the arguments imply a file stat.
-fn skip_filesize(
-    max_filesize: u64,
-    path: &Path,
-    ent: &Option<Metadata>,
-) -> bool {
-    let filesize = match *ent {
-        Some(ref md) => Some(md.len()),
-        None => None,
-    };
-
-    if let Some(fs) = filesize {
-        if fs > max_filesize {
-            log::debug!("ignoring {}: {} bytes", path.display(), fs);
-            true
-        } else {
-            false
-        }
-    } else {
-        false
-    }
-}
-
-fn should_skip_entry(ig: &Ignore, dent: &DirEntry) -> bool {
-    let m = ig.matched_dir_entry(dent);
-    if m.is_ignore() {
-        log::debug!("ignoring {}: {:?}", dent.path().display(), m);
-        true
-    } else if m.is_whitelist() {
-        log::debug!("whitelisting {}: {:?}", dent.path().display(), m);
-        false
-    } else {
-        false
-    }
-}
-
-/// Returns a handle to stdout for filtering search.
-///
-/// A handle is returned if and only if stdout is being redirected to a file.
-/// The handle returned corresponds to that file.
-///
-/// This can be used to ensure that we do not attempt to search a file that we
-/// may also be writing to.
-fn stdout_handle() -> Option<Handle> {
-    let h = match Handle::stdout() {
-        Err(_) => return None,
-        Ok(h) => h,
-    };
-    let md = match h.as_file().metadata() {
-        Err(_) => return None,
-        Ok(md) => md,
-    };
-    if !md.is_file() {
-        return None;
-    }
-    Some(h)
-}
-
-/// Returns true if and only if the given directory entry is believed to be
-/// equivalent to the given handle. If there was a problem querying the path
-/// for information to determine equality, then that error is returned.
-fn path_equals(dent: &DirEntry, handle: &Handle) -> Result<bool, Error> {
-    #[cfg(unix)]
-    fn never_equal(dent: &DirEntry, handle: &Handle) -> bool {
-        dent.ino() != Some(handle.ino())
-    }
-
-    #[cfg(not(unix))]
-    fn never_equal(_: &DirEntry, _: &Handle) -> bool {
-        false
-    }
-
-    // If we know for sure that these two things aren't equal, then avoid
-    // the costly extra stat call to determine equality.
-    if dent.is_stdin() || never_equal(dent, handle) {
-        return Ok(false);
-    }
-    Handle::from_path(dent.path()).map(|h| &h == handle).map_err(|err| {
-        Error::Io(err).with_depth(dent.depth()).with_path(dent.path())
-    })
-}
-
-/// Returns true if the given walkdir entry corresponds to a directory.
-///
-/// This is normally just `dent.file_type().is_dir()`, but when we aren't
-/// following symlinks, the root directory entry may be a symlink to a
-/// directory that we *do* follow---by virtue of it being specified by the user
-/// explicitly. In that case, we need to follow the symlink and query whether
-/// it's a directory or not. But we only do this for root entries to avoid an
-/// additional stat check in most cases.
-fn walkdir_is_dir(dent: &walkdir::DirEntry) -> bool {
-    if dent.file_type().is_dir() {
-        return true;
-    }
-    if !dent.file_type().is_symlink() || dent.depth() > 0 {
-        return false;
-    }
-    dent.path().metadata().ok().map_or(false, |md| md.file_type().is_dir())
-}
-
-/// Returns true if and only if the given path is on the same device as the
-/// given root device.
-fn is_same_file_system(root_device: u64, path: &Path) -> Result<bool, Error> {
-    let dent_device =
-        device_num(path).map_err(|err| Error::Io(err).with_path(path))?;
-    Ok(root_device == dent_device)
-}
-
-#[cfg(unix)]
-fn device_num<P: AsRef<Path>>(path: P) -> io::Result<u64> {
-    use std::os::unix::fs::MetadataExt;
-
-    path.as_ref().metadata().map(|md| md.dev())
-}
-
-#[cfg(windows)]
-fn device_num<P: AsRef<Path>>(path: P) -> io::Result<u64> {
-    use winapi_util::{Handle, file};
-
-    let h = Handle::from_path_any(path)?;
-    file::information(h).map(|info| info.volume_serial_number())
-}
-
-#[cfg(not(any(unix, windows)))]
-fn device_num<P: AsRef<Path>>(_: P) -> io::Result<u64> {
-    Err(io::Error::new(
-        io::ErrorKind::Other,
-        "walkdir: same_file_system option not supported on this platform",
-    ))
-}
-
-#[cfg(test)]
-mod tests {
-    use std::ffi::OsStr;
-    use std::fs::{self, File};
-    use std::io::Write;
-    use std::path::Path;
-    use std::sync::{Arc, Mutex};
-
-    use super::{DirEntry, WalkBuilder, WalkState};
-    use crate::tests::TempDir;
-
-    fn wfile<P: AsRef<Path>>(path: P, contents: &str) {
-        let mut file = File::create(path).unwrap();
-        file.write_all(contents.as_bytes()).unwrap();
-    }
-
-    fn wfile_size<P: AsRef<Path>>(path: P, size: u64) {
-        let file = File::create(path).unwrap();
-        file.set_len(size).unwrap();
-    }
-
-    #[cfg(unix)]
-    fn symlink<P: AsRef<Path>, Q: AsRef<Path>>(src: P, dst: Q) {
-        use std::os::unix::fs::symlink;
-        symlink(src, dst).unwrap();
-    }
-
-    fn mkdirp<P: AsRef<Path>>(path: P) {
-        fs::create_dir_all(path).unwrap();
-    }
-
-    fn normal_path(unix: &str) -> String {
-        if cfg!(windows) { unix.replace("\\", "/") } else { unix.to_string() }
-    }
-
-    fn walk_collect(prefix: &Path, builder: &WalkBuilder) -> Vec<String> {
-        let mut paths = vec![];
-        for result in builder.build() {
-            let dent = match result {
-                Err(_) => continue,
-                Ok(dent) => dent,
-            };
-            let path = dent.path().strip_prefix(prefix).unwrap();
-            if path.as_os_str().is_empty() {
-                continue;
-            }
-            paths.push(normal_path(path.to_str().unwrap()));
-        }
-        paths.sort();
-        paths
-    }
-
-    fn walk_collect_parallel(
-        prefix: &Path,
-        builder: &WalkBuilder,
-    ) -> Vec<String> {
-        let mut paths = vec![];
-        for dent in walk_collect_entries_parallel(builder) {
-            let path = dent.path().strip_prefix(prefix).unwrap();
-            if path.as_os_str().is_empty() {
-                continue;
-            }
-            paths.push(normal_path(path.to_str().unwrap()));
-        }
-        paths.sort();
-        paths
-    }
-
-    fn walk_collect_entries_parallel(builder: &WalkBuilder) -> Vec<DirEntry> {
-        let dents = Arc::new(Mutex::new(vec![]));
-        builder.build_parallel().run(|| {
-            let dents = dents.clone();
-            Box::new(move |result| {
-                if let Ok(dent) = result {
-                    dents.lock().unwrap().push(dent);
-                }
-                WalkState::Continue
-            })
-        });
-
-        let dents = dents.lock().unwrap();
-        dents.to_vec()
-    }
-
-    fn mkpaths(paths: &[&str]) -> Vec<String> {
-        let mut paths: Vec<_> = paths.iter().map(|s| s.to_string()).collect();
-        paths.sort();
-        paths
-    }
-
-    fn tmpdir() -> TempDir {
-        TempDir::new().unwrap()
-    }
-
-    fn assert_paths(prefix: &Path, builder: &WalkBuilder, expected: &[&str]) {
-        let got = walk_collect(prefix, builder);
-        assert_eq!(got, mkpaths(expected), "single threaded");
-        let got = walk_collect_parallel(prefix, builder);
-        assert_eq!(got, mkpaths(expected), "parallel");
-    }
-
-    #[test]
-    fn no_ignores() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c"));
-        mkdirp(td.path().join("x/y"));
-        wfile(td.path().join("a/b/foo"), "");
-        wfile(td.path().join("x/y/foo"), "");
-
-        assert_paths(
-            td.path(),
-            &WalkBuilder::new(td.path()),
-            &["x", "x/y", "x/y/foo", "a", "a/b", "a/b/foo", "a/b/c"],
-        );
-    }
-
-    #[test]
-    fn custom_ignore() {
-        let td = tmpdir();
-        let custom_ignore = ".customignore";
-        mkdirp(td.path().join("a"));
-        wfile(td.path().join(custom_ignore), "foo");
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("bar"), "");
-        wfile(td.path().join("a/bar"), "");
-
-        let mut builder = WalkBuilder::new(td.path());
-        builder.add_custom_ignore_filename(&custom_ignore);
-        assert_paths(td.path(), &builder, &["bar", "a", "a/bar"]);
-    }
-
-    #[test]
-    fn custom_ignore_exclusive_use() {
-        let td = tmpdir();
-        let custom_ignore = ".customignore";
-        mkdirp(td.path().join("a"));
-        wfile(td.path().join(custom_ignore), "foo");
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("bar"), "");
-        wfile(td.path().join("a/bar"), "");
-
-        let mut builder = WalkBuilder::new(td.path());
-        builder.ignore(false);
-        builder.git_ignore(false);
-        builder.git_global(false);
-        builder.git_exclude(false);
-        builder.add_custom_ignore_filename(&custom_ignore);
-        assert_paths(td.path(), &builder, &["bar", "a", "a/bar"]);
-    }
-
-    #[test]
-    fn gitignore() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("a"));
-        wfile(td.path().join(".gitignore"), "foo");
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("bar"), "");
-        wfile(td.path().join("a/bar"), "");
-
-        assert_paths(
-            td.path(),
-            &WalkBuilder::new(td.path()),
-            &["bar", "a", "a/bar"],
-        );
-    }
-
-    #[test]
-    fn explicit_ignore() {
-        let td = tmpdir();
-        let igpath = td.path().join(".not-an-ignore");
-        mkdirp(td.path().join("a"));
-        wfile(&igpath, "foo");
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("bar"), "");
-        wfile(td.path().join("a/bar"), "");
-
-        let mut builder = WalkBuilder::new(td.path());
-        assert!(builder.add_ignore(&igpath).is_none());
-        assert_paths(td.path(), &builder, &["bar", "a", "a/bar"]);
-    }
-
-    #[test]
-    fn explicit_ignore_exclusive_use() {
-        let td = tmpdir();
-        let igpath = td.path().join(".not-an-ignore");
-        mkdirp(td.path().join("a"));
-        wfile(&igpath, "foo");
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("bar"), "");
-        wfile(td.path().join("a/bar"), "");
-
-        let mut builder = WalkBuilder::new(td.path());
-        builder.standard_filters(false);
-        assert!(builder.add_ignore(&igpath).is_none());
-        assert_paths(
-            td.path(),
-            &builder,
-            &[".not-an-ignore", "bar", "a", "a/bar"],
-        );
-    }
-
-    #[test]
-    fn gitignore_parent() {
-        let td = tmpdir();
-        mkdirp(td.path().join(".git"));
-        mkdirp(td.path().join("a"));
-        wfile(td.path().join(".gitignore"), "foo");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("a/bar"), "");
-
-        let root = td.path().join("a");
-        assert_paths(&root, &WalkBuilder::new(&root), &["bar"]);
-    }
-
-    #[test]
-    fn max_depth() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c"));
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("a/b/foo"), "");
-        wfile(td.path().join("a/b/c/foo"), "");
-
-        let mut builder = WalkBuilder::new(td.path());
-        assert_paths(
-            td.path(),
-            &builder,
-            &["a", "a/b", "a/b/c", "foo", "a/foo", "a/b/foo", "a/b/c/foo"],
-        );
-        assert_paths(td.path(), builder.max_depth(Some(0)), &[]);
-        assert_paths(td.path(), builder.max_depth(Some(1)), &["a", "foo"]);
-        assert_paths(
-            td.path(),
-            builder.max_depth(Some(2)),
-            &["a", "a/b", "foo", "a/foo"],
-        );
-    }
-
-    #[test]
-    fn max_depth_does_not_load_unreachable_ignore_files() {
-        let td = tmpdir();
-        let leaf = td.path().join("leaf");
-        mkdirp(&leaf);
-        wfile(leaf.join(".ignore"), "{invalid\n");
-
-        let mut builder = WalkBuilder::new(td.path());
-        builder.max_depth(Some(1));
-        let entry = builder
-            .build()
-            .find_map(|result| {
-                let entry = result.unwrap();
-                (entry.path() == leaf).then_some(entry)
-            })
-            .unwrap();
-
-        assert!(entry.error().is_none());
-        assert_paths(td.path(), &builder, &["leaf"]);
-    }
-
-    #[test]
-    fn min_depth() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c"));
-        wfile(td.path().join("foo"), "");
-        wfile(td.path().join("a/foo"), "");
-        wfile(td.path().join("a/b/foo"), "");
-        wfile(td.path().join("a/b/c/foo"), "");
-
-        let builder = WalkBuilder::new(td.path());
-        assert_paths(
-            td.path(),
-            &builder,
-            &["a", "a/b", "a/b/c", "foo", "a/foo", "a/b/foo", "a/b/c/foo"],
-        );
-        let mut builder = WalkBuilder::new(td.path());
-        assert_paths(
-            td.path(),
-            &builder.min_depth(Some(0)),
-            &["a", "a/b", "a/b/c", "foo", "a/foo", "a/b/foo", "a/b/c/foo"],
-        );
-        assert_paths(
-            td.path(),
-            &builder.min_depth(Some(1)),
-            &["a", "a/b", "a/b/c", "foo", "a/foo", "a/b/foo", "a/b/c/foo"],
-        );
-        assert_paths(
-            td.path(),
-            builder.min_depth(Some(2)),
-            &["a/b", "a/b/c", "a/b/c/foo", "a/b/foo", "a/foo"],
-        );
-        assert_paths(
-            td.path(),
-            builder.min_depth(Some(3)),
-            &["a/b/c", "a/b/c/foo", "a/b/foo"],
-        );
-        assert_paths(td.path(), builder.min_depth(Some(10)), &[]);
-
-        assert_paths(
-            td.path(),
-            builder.min_depth(Some(2)).max_depth(Some(1)),
-            &["a/b", "a/foo"],
-        );
-    }
-
-    #[test]
-    fn max_filesize() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b"));
-        wfile_size(td.path().join("foo"), 0);
-        wfile_size(td.path().join("bar"), 400);
-        wfile_size(td.path().join("baz"), 600);
-        wfile_size(td.path().join("a/foo"), 600);
-        wfile_size(td.path().join("a/bar"), 500);
-        wfile_size(td.path().join("a/baz"), 200);
-
-        let mut builder = WalkBuilder::new(td.path());
-        assert_paths(
-            td.path(),
-            &builder,
-            &["a", "a/b", "foo", "bar", "baz", "a/foo", "a/bar", "a/baz"],
-        );
-        assert_paths(
-            td.path(),
-            builder.max_filesize(Some(0)),
-            &["a", "a/b", "foo"],
-        );
-        assert_paths(
-            td.path(),
-            builder.max_filesize(Some(500)),
-            &["a", "a/b", "foo", "bar", "a/bar", "a/baz"],
-        );
-        assert_paths(
-            td.path(),
-            builder.max_filesize(Some(50000)),
-            &["a", "a/b", "foo", "bar", "baz", "a/foo", "a/bar", "a/baz"],
-        );
-    }
-
-    #[cfg(unix)] // because symlinks on windows are weird
-    #[test]
-    fn symlinks() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b"));
-        symlink(td.path().join("a/b"), td.path().join("z"));
-        wfile(td.path().join("a/b/foo"), "");
-
-        let mut builder = WalkBuilder::new(td.path());
-        assert_paths(td.path(), &builder, &["a", "a/b", "a/b/foo", "z"]);
-        assert_paths(
-            td.path(),
-            &builder.follow_links(true),
-            &["a", "a/b", "a/b/foo", "z", "z/foo"],
-        );
-    }
-
-    #[cfg(unix)] // because symlinks on windows are weird
-    #[test]
-    fn first_path_not_symlink() {
-        let td = tmpdir();
-        mkdirp(td.path().join("foo"));
-
-        let dents = WalkBuilder::new(td.path().join("foo"))
-            .build()
-            .into_iter()
-            .collect::<Result<Vec<_>, _>>()
-            .unwrap();
-        assert_eq!(1, dents.len());
-        assert!(!dents[0].path_is_symlink());
-
-        let dents = walk_collect_entries_parallel(&WalkBuilder::new(
-            td.path().join("foo"),
-        ));
-        assert_eq!(1, dents.len());
-        assert!(!dents[0].path_is_symlink());
-    }
-
-    #[cfg(unix)] // because symlinks on windows are weird
-    #[test]
-    fn symlink_loop() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b"));
-        symlink(td.path().join("a"), td.path().join("a/b/c"));
-
-        let mut builder = WalkBuilder::new(td.path());
-        assert_paths(td.path(), &builder, &["a", "a/b", "a/b/c"]);
-        assert_paths(td.path(), &builder.follow_links(true), &["a", "a/b"]);
-    }
-
-    // It's a little tricky to test the 'same_file_system' option since
-    // we need an environment with more than one file system. We adopt a
-    // heuristic where /sys is typically a distinct volume on Linux and roll
-    // with that.
-    #[test]
-    #[cfg(target_os = "linux")]
-    fn same_file_system() {
-        use super::device_num;
-
-        // If for some reason /sys doesn't exist or isn't a directory, just
-        // skip this test.
-        if !Path::new("/sys").is_dir() {
-            return;
-        }
-
-        // If our test directory actually isn't a different volume from /sys,
-        // then this test is meaningless and we shouldn't run it.
-        let td = tmpdir();
-        if device_num(td.path()).unwrap() == device_num("/sys").unwrap() {
-            return;
-        }
-
-        mkdirp(td.path().join("same_file"));
-        symlink("/sys", td.path().join("same_file").join("alink"));
-
-        // Create a symlink to sys and enable following symlinks. If the
-        // same_file_system option doesn't work, then this probably will hit a
-        // permission error. Otherwise, it should just skip over the symlink
-        // completely.
-        let mut builder = WalkBuilder::new(td.path());
-        builder.follow_links(true).same_file_system(true);
-        assert_paths(td.path(), &builder, &["same_file", "same_file/alink"]);
-    }
-
-    #[cfg(target_os = "linux")]
-    #[test]
-    fn no_read_permissions() {
-        let dir_path = Path::new("/root");
-
-        // There's no /etc/sudoers.d, skip the test.
-        if !dir_path.is_dir() {
-            return;
-        }
-        // We're the root, so the test won't check what we want it to.
-        if fs::read_dir(&dir_path).is_ok() {
-            return;
-        }
-
-        // Check that we can't descend but get an entry for the parent dir.
-        let builder = WalkBuilder::new(&dir_path);
-        assert_paths(dir_path.parent().unwrap(), &builder, &["root"]);
-    }
-
-    #[test]
-    fn filter() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c"));
-        mkdirp(td.path().join("x/y"));
-        wfile(td.path().join("a/b/foo"), "");
-        wfile(td.path().join("x/y/foo"), "");
-
-        assert_paths(
-            td.path(),
-            &WalkBuilder::new(td.path()),
-            &["x", "x/y", "x/y/foo", "a", "a/b", "a/b/foo", "a/b/c"],
-        );
-
-        assert_paths(
-            td.path(),
-            &WalkBuilder::new(td.path())
-                .filter_entry(|entry| entry.file_name() != OsStr::new("a")),
-            &["x", "x/y", "x/y/foo"],
-        );
-    }
-
-    #[test]
-    fn empty() {
-        let td = tmpdir();
-        assert_paths(td.path(), &WalkBuilder::empty(), &[]);
-
-        let empty_paths: Vec<&OsStr> = Vec::new();
-        assert_paths(td.path(), &WalkBuilder::from_iter(empty_paths), &[]);
-    }
-
-    #[test]
-    fn from_iter() {
-        let td = tmpdir();
-        mkdirp(td.path().join("a/b/c"));
-        mkdirp(td.path().join("d/e/f"));
-        mkdirp(td.path().join("x/y"));
-        wfile(td.path().join("a/b/foo"), "");
-        wfile(td.path().join("d/e/f/foo"), "");
-        wfile(td.path().join("x/y/foo"), "");
-
-        let paths = vec![
-            td.path().join("a"),
-            td.path().join("d"),
-            td.path().join("x"),
-        ];
-
-        assert_paths(
-            td.path(),
-            &WalkBuilder::from_iter(paths),
-            &[
-                "x",
-                "x/y",
-                "x/y/foo",
-                "d",
-                "d/e",
-                "d/e/f",
-                "d/e/f/foo",
-                "a",
-                "a/b",
-                "a/b/foo",
-                "a/b/c",
-            ],
-        );
-    }
-
-    // This should always panic and never hang.
-    //
-    // Ref: https://github.com/BurntSushi/ripgrep/issues/3009
-    #[test]
-    #[should_panic]
-    fn panic_in_parallel() {
-        let td = tmpdir();
-        wfile(td.path().join("foo.txt"), "");
-
-        WalkBuilder::new(td.path())
-            .threads(40)
-            .build_parallel()
-            .run(|| Box::new(|_| panic!("oops!")));
-    }
-
-    // This should always panic and never hang. The first call to the visitor
-    // builder is used while processing the root paths. Previously, a panic on
-    // the third call occurred after the first worker had already been spawned,
-    // leaving it waiting indefinitely for workers that were never created.
-    #[test]
-    #[should_panic(expected = "builder panic")]
-    fn panic_in_parallel_builder() {
-        let td = tmpdir();
-        wfile(td.path().join("foo.txt"), "");
-
-        let mut builds = 0;
-        WalkBuilder::new(td.path()).threads(2).build_parallel().run(|| {
-            builds += 1;
-            if builds == 3 {
-                panic!("builder panic");
-            }
-            Box::new(|_| WalkState::Continue)
-        });
-    }
-}
diff --git a/crates/ignore/tests/gitignore_matched_path_or_any_parents_tests.gitignore b/crates/ignore/tests/gitignore_matched_path_or_any_parents_tests.gitignore
deleted file mode 100644
index ac09e12f7..000000000
--- a/crates/ignore/tests/gitignore_matched_path_or_any_parents_tests.gitignore
+++ /dev/null
@@ -1,216 +0,0 @@
-# Based on https://github.com/behnam/gitignore-test/blob/master/.gitignore
-
-### file in root
-
-# MATCH /file_root_1
-file_root_00
-
-# NO_MATCH
-file_root_01/
-
-# NO_MATCH
-file_root_02/*
-
-# NO_MATCH
-file_root_03/**
-
-
-# MATCH /file_root_10
-/file_root_10
-
-# NO_MATCH
-/file_root_11/
-
-# NO_MATCH
-/file_root_12/*
-
-# NO_MATCH
-/file_root_13/**
-
-
-# NO_MATCH
-*/file_root_20
-
-# NO_MATCH
-*/file_root_21/
-
-# NO_MATCH
-*/file_root_22/*
-
-# NO_MATCH
-*/file_root_23/**
-
-
-# MATCH /file_root_30
-**/file_root_30
-
-# NO_MATCH
-**/file_root_31/
-
-# NO_MATCH
-**/file_root_32/*
-
-# NO_MATCH
-**/file_root_33/**
-
-
-### file in sub-dir
-
-# MATCH /parent_dir/file_deep_1
-file_deep_00
-
-# NO_MATCH
-file_deep_01/
-
-# NO_MATCH
-file_deep_02/*
-
-# NO_MATCH
-file_deep_03/**
-
-
-# NO_MATCH
-/file_deep_10
-
-# NO_MATCH
-/file_deep_11/
-
-# NO_MATCH
-/file_deep_12/*
-
-# NO_MATCH
-/file_deep_13/**
-
-
-# MATCH /parent_dir/file_deep_20
-*/file_deep_20
-
-# NO_MATCH
-*/file_deep_21/
-
-# NO_MATCH
-*/file_deep_22/*
-
-# NO_MATCH
-*/file_deep_23/**
-
-
-# MATCH /parent_dir/file_deep_30
-**/file_deep_30
-
-# NO_MATCH
-**/file_deep_31/
-
-# NO_MATCH
-**/file_deep_32/*
-
-# NO_MATCH
-**/file_deep_33/**
-
-
-### dir in root
-
-# MATCH /dir_root_00
-dir_root_00
-
-# MATCH /dir_root_01
-dir_root_01/
-
-# MATCH /dir_root_02
-dir_root_02/*
-
-# MATCH /dir_root_03
-dir_root_03/**
-
-
-# MATCH /dir_root_10
-/dir_root_10
-
-# MATCH /dir_root_11
-/dir_root_11/
-
-# MATCH /dir_root_12
-/dir_root_12/*
-
-# MATCH /dir_root_13
-/dir_root_13/**
-
-
-# NO_MATCH
-*/dir_root_20
-
-# NO_MATCH
-*/dir_root_21/
-
-# NO_MATCH
-*/dir_root_22/*
-
-# NO_MATCH
-*/dir_root_23/**
-
-
-# MATCH /dir_root_30
-**/dir_root_30
-
-# MATCH /dir_root_31
-**/dir_root_31/
-
-# MATCH /dir_root_32
-**/dir_root_32/*
-
-# MATCH /dir_root_33
-**/dir_root_33/**
-
-
-### dir in sub-dir
-
-# MATCH /parent_dir/dir_deep_00
-dir_deep_00
-
-# MATCH /parent_dir/dir_deep_01
-dir_deep_01/
-
-# NO_MATCH
-dir_deep_02/*
-
-# NO_MATCH
-dir_deep_03/**
-
-
-# NO_MATCH
-/dir_deep_10
-
-# NO_MATCH
-/dir_deep_11/
-
-# NO_MATCH
-/dir_deep_12/*
-
-# NO_MATCH
-/dir_deep_13/**
-
-
-# MATCH /parent_dir/dir_deep_20
-*/dir_deep_20
-
-# MATCH /parent_dir/dir_deep_21
-*/dir_deep_21/
-
-# MATCH /parent_dir/dir_deep_22
-*/dir_deep_22/*
-
-# MATCH /parent_dir/dir_deep_23
-*/dir_deep_23/**
-
-
-# MATCH /parent_dir/dir_deep_30
-**/dir_deep_30
-
-# MATCH /parent_dir/dir_deep_31
-**/dir_deep_31/
-
-# MATCH /parent_dir/dir_deep_32
-**/dir_deep_32/*
-
-# MATCH /parent_dir/dir_deep_33
-**/dir_deep_33/**
diff --git a/crates/ignore/tests/gitignore_matched_path_or_any_parents_tests.rs b/crates/ignore/tests/gitignore_matched_path_or_any_parents_tests.rs
deleted file mode 100644
index ecb7b47e3..000000000
--- a/crates/ignore/tests/gitignore_matched_path_or_any_parents_tests.rs
+++ /dev/null
@@ -1,318 +0,0 @@
-use std::path::Path;
-
-use ignore::gitignore::{Gitignore, GitignoreBuilder};
-
-const IGNORE_FILE: &'static str =
-    "tests/gitignore_matched_path_or_any_parents_tests.gitignore";
-
-fn get_gitignore() -> Gitignore {
-    let mut builder = GitignoreBuilder::new("ROOT");
-    let error = builder.add(IGNORE_FILE);
-    assert!(error.is_none(), "failed to open gitignore file");
-    builder.build().unwrap()
-}
-
-#[test]
-#[should_panic(expected = "path is expected to be under the root")]
-fn test_path_should_be_under_root() {
-    let gitignore = get_gitignore();
-    let path = "/tmp/some_file";
-    gitignore.matched_path_or_any_parents(Path::new(path), false);
-    assert!(false);
-}
-
-#[test]
-fn test_files_in_root() {
-    let gitignore = get_gitignore();
-    let m = |path: &str| {
-        gitignore.matched_path_or_any_parents(Path::new(path), false)
-    };
-
-    // 0x
-    assert!(m("ROOT/file_root_00").is_ignore());
-    assert!(m("ROOT/file_root_01").is_none());
-    assert!(m("ROOT/file_root_02").is_none());
-    assert!(m("ROOT/file_root_03").is_none());
-
-    // 1x
-    assert!(m("ROOT/file_root_10").is_ignore());
-    assert!(m("ROOT/file_root_11").is_none());
-    assert!(m("ROOT/file_root_12").is_none());
-    assert!(m("ROOT/file_root_13").is_none());
-
-    // 2x
-    assert!(m("ROOT/file_root_20").is_none());
-    assert!(m("ROOT/file_root_21").is_none());
-    assert!(m("ROOT/file_root_22").is_none());
-    assert!(m("ROOT/file_root_23").is_none());
-
-    // 3x
-    assert!(m("ROOT/file_root_30").is_ignore());
-    assert!(m("ROOT/file_root_31").is_none());
-    assert!(m("ROOT/file_root_32").is_none());
-    assert!(m("ROOT/file_root_33").is_none());
-}
-
-#[test]
-fn test_files_in_deep() {
-    let gitignore = get_gitignore();
-    let m = |path: &str| {
-        gitignore.matched_path_or_any_parents(Path::new(path), false)
-    };
-
-    // 0x
-    assert!(m("ROOT/parent_dir/file_deep_00").is_ignore());
-    assert!(m("ROOT/parent_dir/file_deep_01").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_02").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_03").is_none());
-
-    // 1x
-    assert!(m("ROOT/parent_dir/file_deep_10").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_11").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_12").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_13").is_none());
-
-    // 2x
-    assert!(m("ROOT/parent_dir/file_deep_20").is_ignore());
-    assert!(m("ROOT/parent_dir/file_deep_21").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_22").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_23").is_none());
-
-    // 3x
-    assert!(m("ROOT/parent_dir/file_deep_30").is_ignore());
-    assert!(m("ROOT/parent_dir/file_deep_31").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_32").is_none());
-    assert!(m("ROOT/parent_dir/file_deep_33").is_none());
-}
-
-#[test]
-fn test_dirs_in_root() {
-    let gitignore = get_gitignore();
-    let m = |path: &str, is_dir: bool| {
-        gitignore.matched_path_or_any_parents(Path::new(path), is_dir)
-    };
-
-    // 00
-    assert!(m("ROOT/dir_root_00", true).is_ignore());
-    assert!(m("ROOT/dir_root_00/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_00/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_00/child_dir/file", false).is_ignore());
-
-    // 01
-    assert!(m("ROOT/dir_root_01", true).is_ignore());
-    assert!(m("ROOT/dir_root_01/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_01/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_01/child_dir/file", false).is_ignore());
-
-    // 02
-    assert!(m("ROOT/dir_root_02", true).is_none()); // dir itself doesn't match
-    assert!(m("ROOT/dir_root_02/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_02/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_02/child_dir/file", false).is_ignore());
-
-    // 03
-    assert!(m("ROOT/dir_root_03", true).is_none()); // dir itself doesn't match
-    assert!(m("ROOT/dir_root_03/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_03/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_03/child_dir/file", false).is_ignore());
-
-    // 10
-    assert!(m("ROOT/dir_root_10", true).is_ignore());
-    assert!(m("ROOT/dir_root_10/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_10/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_10/child_dir/file", false).is_ignore());
-
-    // 11
-    assert!(m("ROOT/dir_root_11", true).is_ignore());
-    assert!(m("ROOT/dir_root_11/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_11/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_11/child_dir/file", false).is_ignore());
-
-    // 12
-    assert!(m("ROOT/dir_root_12", true).is_none()); // dir itself doesn't match
-    assert!(m("ROOT/dir_root_12/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_12/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_12/child_dir/file", false).is_ignore());
-
-    // 13
-    assert!(m("ROOT/dir_root_13", true).is_none());
-    assert!(m("ROOT/dir_root_13/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_13/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_13/child_dir/file", false).is_ignore());
-
-    // 20
-    assert!(m("ROOT/dir_root_20", true).is_none());
-    assert!(m("ROOT/dir_root_20/file", false).is_none());
-    assert!(m("ROOT/dir_root_20/child_dir", true).is_none());
-    assert!(m("ROOT/dir_root_20/child_dir/file", false).is_none());
-
-    // 21
-    assert!(m("ROOT/dir_root_21", true).is_none());
-    assert!(m("ROOT/dir_root_21/file", false).is_none());
-    assert!(m("ROOT/dir_root_21/child_dir", true).is_none());
-    assert!(m("ROOT/dir_root_21/child_dir/file", false).is_none());
-
-    // 22
-    assert!(m("ROOT/dir_root_22", true).is_none());
-    assert!(m("ROOT/dir_root_22/file", false).is_none());
-    assert!(m("ROOT/dir_root_22/child_dir", true).is_none());
-    assert!(m("ROOT/dir_root_22/child_dir/file", false).is_none());
-
-    // 23
-    assert!(m("ROOT/dir_root_23", true).is_none());
-    assert!(m("ROOT/dir_root_23/file", false).is_none());
-    assert!(m("ROOT/dir_root_23/child_dir", true).is_none());
-    assert!(m("ROOT/dir_root_23/child_dir/file", false).is_none());
-
-    // 30
-    assert!(m("ROOT/dir_root_30", true).is_ignore());
-    assert!(m("ROOT/dir_root_30/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_30/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_30/child_dir/file", false).is_ignore());
-
-    // 31
-    assert!(m("ROOT/dir_root_31", true).is_ignore());
-    assert!(m("ROOT/dir_root_31/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_31/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_31/child_dir/file", false).is_ignore());
-
-    // 32
-    assert!(m("ROOT/dir_root_32", true).is_none()); // dir itself doesn't match
-    assert!(m("ROOT/dir_root_32/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_32/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_32/child_dir/file", false).is_ignore());
-
-    // 33
-    assert!(m("ROOT/dir_root_33", true).is_none()); // dir itself doesn't match
-    assert!(m("ROOT/dir_root_33/file", false).is_ignore());
-    assert!(m("ROOT/dir_root_33/child_dir", true).is_ignore());
-    assert!(m("ROOT/dir_root_33/child_dir/file", false).is_ignore());
-}
-
-#[test]
-fn test_dirs_in_deep() {
-    let gitignore = get_gitignore();
-    let m = |path: &str, is_dir: bool| {
-        gitignore.matched_path_or_any_parents(Path::new(path), is_dir)
-    };
-
-    // 00
-    assert!(m("ROOT/parent_dir/dir_deep_00", true).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_00/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_00/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_00/child_dir/file", false).is_ignore()
-    );
-
-    // 01
-    assert!(m("ROOT/parent_dir/dir_deep_01", true).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_01/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_01/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_01/child_dir/file", false).is_ignore()
-    );
-
-    // 02
-    assert!(m("ROOT/parent_dir/dir_deep_02", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_02/file", false).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_02/child_dir", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_02/child_dir/file", false).is_none());
-
-    // 03
-    assert!(m("ROOT/parent_dir/dir_deep_03", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_03/file", false).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_03/child_dir", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_03/child_dir/file", false).is_none());
-
-    // 10
-    assert!(m("ROOT/parent_dir/dir_deep_10", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_10/file", false).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_10/child_dir", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_10/child_dir/file", false).is_none());
-
-    // 11
-    assert!(m("ROOT/parent_dir/dir_deep_11", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_11/file", false).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_11/child_dir", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_11/child_dir/file", false).is_none());
-
-    // 12
-    assert!(m("ROOT/parent_dir/dir_deep_12", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_12/file", false).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_12/child_dir", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_12/child_dir/file", false).is_none());
-
-    // 13
-    assert!(m("ROOT/parent_dir/dir_deep_13", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_13/file", false).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_13/child_dir", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_13/child_dir/file", false).is_none());
-
-    // 20
-    assert!(m("ROOT/parent_dir/dir_deep_20", true).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_20/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_20/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_20/child_dir/file", false).is_ignore()
-    );
-
-    // 21
-    assert!(m("ROOT/parent_dir/dir_deep_21", true).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_21/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_21/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_21/child_dir/file", false).is_ignore()
-    );
-
-    // 22
-    // dir itself doesn't match
-    assert!(m("ROOT/parent_dir/dir_deep_22", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_22/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_22/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_22/child_dir/file", false).is_ignore()
-    );
-
-    // 23
-    // dir itself doesn't match
-    assert!(m("ROOT/parent_dir/dir_deep_23", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_23/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_23/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_23/child_dir/file", false).is_ignore()
-    );
-
-    // 30
-    assert!(m("ROOT/parent_dir/dir_deep_30", true).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_30/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_30/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_30/child_dir/file", false).is_ignore()
-    );
-
-    // 31
-    assert!(m("ROOT/parent_dir/dir_deep_31", true).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_31/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_31/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_31/child_dir/file", false).is_ignore()
-    );
-
-    // 32
-    // dir itself doesn't match
-    assert!(m("ROOT/parent_dir/dir_deep_32", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_32/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_32/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_32/child_dir/file", false).is_ignore()
-    );
-
-    // 33
-    // dir itself doesn't match
-    assert!(m("ROOT/parent_dir/dir_deep_33", true).is_none());
-    assert!(m("ROOT/parent_dir/dir_deep_33/file", false).is_ignore());
-    assert!(m("ROOT/parent_dir/dir_deep_33/child_dir", true).is_ignore());
-    assert!(
-        m("ROOT/parent_dir/dir_deep_33/child_dir/file", false).is_ignore()
-    );
-}
diff --git a/crates/ignore/tests/gitignore_skip_bom.gitignore b/crates/ignore/tests/gitignore_skip_bom.gitignore
deleted file mode 100644
index a78c13a9b..000000000
--- a/crates/ignore/tests/gitignore_skip_bom.gitignore
+++ /dev/null
@@ -1,2 +0,0 @@
-ignore/this/path
-# This file begins with a BOM (U+FEFF)
diff --git a/crates/ignore/tests/gitignore_skip_bom.rs b/crates/ignore/tests/gitignore_skip_bom.rs
deleted file mode 100644
index 14d533d63..000000000
--- a/crates/ignore/tests/gitignore_skip_bom.rs
+++ /dev/null
@@ -1,17 +0,0 @@
-use ignore::gitignore::GitignoreBuilder;
-
-const IGNORE_FILE: &'static str = "tests/gitignore_skip_bom.gitignore";
-
-/// Skip a Byte-Order Mark (BOM) at the beginning of the file, matching Git's
-/// behavior.
-///
-/// Ref: <https://github.com/BurntSushi/ripgrep/issues/2177>
-#[test]
-fn gitignore_skip_bom() {
-    let mut builder = GitignoreBuilder::new("ROOT");
-    let error = builder.add(IGNORE_FILE);
-    assert!(error.is_none(), "failed to open gitignore file");
-    let g = builder.build().unwrap();
-
-    assert!(g.matched("ignore/this/path", false).is_ignore());
-}
diff --git a/crates/node/.gitignore b/crates/node/.gitignore
index c3f2ec696..2cb3cf980 100644
--- a/crates/node/.gitignore
+++ b/crates/node/.gitignore
@@ -121,7 +121,7 @@ dist
 .AppleDouble
 .LSOverride
 
-# Icon must end with two
+# Icon must end with two 
 Icon
 
 
@@ -194,14 +194,8 @@ Cargo.lock
 !.yarn/sdks
 !.yarn/versions
 
-# Generated
 *.node
-*.wasm
+
+# Generated
 index.d.ts
 index.js
-browser.js
-tailwindcss-oxide.wasi-browser.js
-tailwindcss-oxide.wasi.cjs
-tailwindcss-oxide.wasi.d.cts
-wasi-worker-browser.mjs
-wasi-worker.mjs
diff --git a/crates/node/Cargo.toml b/crates/node/Cargo.toml
index a3df7b813..2222c643f 100644
--- a/crates/node/Cargo.toml
+++ b/crates/node/Cargo.toml
@@ -8,10 +8,10 @@ crate-type = ["cdylib"]
 
 [dependencies]
 # Default enable napi4 feature, see https://nodejs.org/api/n-api.html#node-api-version-matrix
-napi = { version = "3.11.0", default-features = false, features = ["napi4"] }
-napi-derive = "3.6.0"
+napi = { version = "2.16.16", default-features = false, features = ["napi4"] }
+napi-derive = "2.16.13"
 tailwindcss-oxide = { path = "../oxide" }
-rayon = "1.12.0"
+rayon = "1.10.0"
 
 [build-dependencies]
-napi-build = "2.3.2"
+napi-build = "2.1.4"
diff --git a/crates/node/npm/android-arm-eabi/package.json b/crates/node/npm/android-arm-eabi/package.json
index d46ceb237..bf0158fb9 100644
--- a/crates/node/npm/android-arm-eabi/package.json
+++ b/crates/node/npm/android-arm-eabi/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-android-arm-eabi",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/android-arm64/package.json b/crates/node/npm/android-arm64/package.json
index e6e9d577d..c1c5fb916 100644
--- a/crates/node/npm/android-arm64/package.json
+++ b/crates/node/npm/android-arm64/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-android-arm64",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/darwin-arm64/package.json b/crates/node/npm/darwin-arm64/package.json
index 1cb737c2e..a18d0459f 100644
--- a/crates/node/npm/darwin-arm64/package.json
+++ b/crates/node/npm/darwin-arm64/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-darwin-arm64",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/darwin-x64/package.json b/crates/node/npm/darwin-x64/package.json
index ffd75e54b..72c222520 100644
--- a/crates/node/npm/darwin-x64/package.json
+++ b/crates/node/npm/darwin-x64/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-darwin-x64",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/freebsd-x64/package.json b/crates/node/npm/freebsd-x64/package.json
index e248f39d1..dca78de0d 100644
--- a/crates/node/npm/freebsd-x64/package.json
+++ b/crates/node/npm/freebsd-x64/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-freebsd-x64",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/linux-arm-gnueabihf/package.json b/crates/node/npm/linux-arm-gnueabihf/package.json
index 50d2aef73..ecd40dd2e 100644
--- a/crates/node/npm/linux-arm-gnueabihf/package.json
+++ b/crates/node/npm/linux-arm-gnueabihf/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-linux-arm-gnueabihf",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/linux-arm64-gnu/package.json b/crates/node/npm/linux-arm64-gnu/package.json
index 5875213f8..c00470892 100644
--- a/crates/node/npm/linux-arm64-gnu/package.json
+++ b/crates/node/npm/linux-arm64-gnu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-linux-arm64-gnu",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,7 +22,7 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   },
   "libc": [
     "glibc"
diff --git a/crates/node/npm/linux-arm64-musl/package.json b/crates/node/npm/linux-arm64-musl/package.json
index 9da37f3fd..041261a28 100644
--- a/crates/node/npm/linux-arm64-musl/package.json
+++ b/crates/node/npm/linux-arm64-musl/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-linux-arm64-musl",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,7 +22,7 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   },
   "libc": [
     "musl"
diff --git a/crates/node/npm/linux-x64-gnu/package.json b/crates/node/npm/linux-x64-gnu/package.json
index d409743fa..29bd441e4 100644
--- a/crates/node/npm/linux-x64-gnu/package.json
+++ b/crates/node/npm/linux-x64-gnu/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-linux-x64-gnu",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,7 +22,7 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   },
   "libc": [
     "glibc"
diff --git a/crates/node/npm/linux-x64-musl/package.json b/crates/node/npm/linux-x64-musl/package.json
index 5b404fd70..7ef6ab67d 100644
--- a/crates/node/npm/linux-x64-musl/package.json
+++ b/crates/node/npm/linux-x64-musl/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-linux-x64-musl",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,7 +22,7 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   },
   "libc": [
     "musl"
diff --git a/crates/node/npm/wasm32-wasi/.gitignore b/crates/node/npm/wasm32-wasi/.gitignore
deleted file mode 100644
index c2658d7d1..000000000
--- a/crates/node/npm/wasm32-wasi/.gitignore
+++ /dev/null
@@ -1 +0,0 @@
-node_modules/
diff --git a/crates/node/npm/wasm32-wasi/README.md b/crates/node/npm/wasm32-wasi/README.md
deleted file mode 100644
index 2a5368149..000000000
--- a/crates/node/npm/wasm32-wasi/README.md
+++ /dev/null
@@ -1,3 +0,0 @@
-# `@tailwindcss/oxide-wasm32-wasi`
-
-This is the **wasm32-wasip1-threads** build of `@tailwindcss/oxide`
diff --git a/crates/node/npm/wasm32-wasi/package.json b/crates/node/npm/wasm32-wasi/package.json
deleted file mode 100644
index cee9fb05a..000000000
--- a/crates/node/npm/wasm32-wasi/package.json
+++ /dev/null
@@ -1,42 +0,0 @@
-{
-  "name": "@tailwindcss/oxide-wasm32-wasi",
-  "version": "4.3.3",
-  "main": "tailwindcss-oxide.wasi.cjs",
-  "files": [
-    "tailwindcss-oxide.wasm32-wasi.wasm",
-    "tailwindcss-oxide.wasi.cjs",
-    "tailwindcss-oxide.wasi-browser.js",
-    "wasi-worker.mjs",
-    "wasi-worker-browser.mjs"
-  ],
-  "license": "MIT",
-  "engines": {
-    "node": "^20.19.0 || ^22.13.0 || >=23.5.0"
-  },
-  "publishConfig": {
-    "provenance": true,
-    "access": "public"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
-    "directory": "crates/node"
-  },
-  "browser": "tailwindcss-oxide.wasi-browser.js",
-  "dependencies": {
-    "@napi-rs/wasm-runtime": "^1.2.2",
-    "@emnapi/core": "^1.11.3",
-    "@emnapi/runtime": "^1.11.3",
-    "@tybys/wasm-util": "^0.10.3",
-    "@emnapi/wasi-threads": "^1.2.3",
-    "tslib": "^2.8.1"
-  },
-  "bundledDependencies": [
-    "@napi-rs/wasm-runtime",
-    "@emnapi/core",
-    "@emnapi/runtime",
-    "@tybys/wasm-util",
-    "@emnapi/wasi-threads",
-    "tslib"
-  ]
-}
diff --git a/crates/node/npm/win32-arm64-msvc/package.json b/crates/node/npm/win32-arm64-msvc/package.json
index 991727a32..1dc6e3911 100644
--- a/crates/node/npm/win32-arm64-msvc/package.json
+++ b/crates/node/npm/win32-arm64-msvc/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-win32-arm64-msvc",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/npm/win32-x64-msvc/package.json b/crates/node/npm/win32-x64-msvc/package.json
index 82d75c300..27cb72893 100644
--- a/crates/node/npm/win32-x64-msvc/package.json
+++ b/crates/node/npm/win32-x64-msvc/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide-win32-x64-msvc",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -22,6 +22,6 @@
   },
   "license": "MIT",
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   }
 }
diff --git a/crates/node/package.json b/crates/node/package.json
index be09427fb..19efdddb7 100644
--- a/crates/node/package.json
+++ b/crates/node/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/oxide",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/tailwindlabs/tailwindcss.git",
@@ -9,38 +9,28 @@
   "main": "index.js",
   "types": "index.d.ts",
   "napi": {
-    "binaryName": "tailwindcss-oxide",
-    "packageName": "@tailwindcss/oxide",
-    "targets": [
-      "armv7-linux-androideabi",
-      "aarch64-linux-android",
-      "aarch64-apple-darwin",
-      "aarch64-unknown-linux-gnu",
-      "aarch64-unknown-linux-musl",
-      "armv7-unknown-linux-gnueabihf",
-      "x86_64-unknown-linux-musl",
-      "x86_64-unknown-freebsd",
-      "i686-pc-windows-msvc",
-      "aarch64-pc-windows-msvc",
-      "wasm32-wasip1-threads"
-    ],
-    "wasm": {
-      "initialMemory": 16384,
-      "browser": {
-        "fs": true
-      }
+    "name": "tailwindcss-oxide",
+    "triples": {
+      "additional": [
+        "armv7-linux-androideabi",
+        "aarch64-linux-android",
+        "aarch64-apple-darwin",
+        "aarch64-unknown-linux-gnu",
+        "aarch64-unknown-linux-musl",
+        "armv7-unknown-linux-gnueabihf",
+        "x86_64-unknown-linux-musl",
+        "x86_64-unknown-freebsd",
+        "i686-pc-windows-msvc",
+        "aarch64-pc-windows-msvc"
+      ]
     }
   },
   "license": "MIT",
   "devDependencies": {
-    "@emnapi/core": "1.11.3",
-    "@emnapi/runtime": "1.11.3",
-    "@napi-rs/cli": "3.7.4",
-    "@napi-rs/wasm-runtime": "^1.2.2",
-    "emnapi": "1.11.3"
+    "@napi-rs/cli": "^2.18.4"
   },
   "engines": {
-    "node": ">= 20"
+    "node": ">= 10"
   },
   "files": [
     "index.js",
@@ -51,13 +41,10 @@
     "access": "public"
   },
   "scripts": {
-    "build": "pnpm run build:platform && pnpm run build:wasm",
-    "build:platform": "napi build --platform --release",
-    "postbuild:platform": "node ./scripts/move-artifacts.mjs",
-    "build:wasm": "napi build --release --target wasm32-wasip1-threads",
-    "postbuild:wasm": "node ./scripts/move-artifacts.mjs",
+    "artifacts": "napi artifacts",
+    "build": "napi build --platform --release --no-const-enum",
     "dev": "cargo watch --quiet --shell 'npm run build'",
-    "build:debug": "napi build --platform",
+    "build:debug": "napi build --platform --no-const-enum",
     "version": "napi version"
   },
   "optionalDependencies": {
@@ -70,8 +57,7 @@
     "@tailwindcss/oxide-linux-arm64-musl": "workspace:*",
     "@tailwindcss/oxide-linux-x64-gnu": "workspace:*",
     "@tailwindcss/oxide-linux-x64-musl": "workspace:*",
-    "@tailwindcss/oxide-wasm32-wasi": "workspace:*",
-    "@tailwindcss/oxide-win32-arm64-msvc": "workspace:*",
-    "@tailwindcss/oxide-win32-x64-msvc": "workspace:*"
+    "@tailwindcss/oxide-win32-x64-msvc": "workspace:*",
+    "@tailwindcss/oxide-win32-arm64-msvc": "workspace:*"
   }
 }
diff --git a/crates/node/scripts/move-artifacts.mjs b/crates/node/scripts/move-artifacts.mjs
deleted file mode 100644
index faf4728ef..000000000
--- a/crates/node/scripts/move-artifacts.mjs
+++ /dev/null
@@ -1,37 +0,0 @@
-import fs from 'node:fs/promises'
-import path from 'node:path'
-import url from 'node:url'
-
-const __dirname = path.dirname(url.fileURLToPath(import.meta.url))
-let root = path.resolve(__dirname, '..')
-const tailwindcssOxideRoot = path.join(root)
-
-// Move napi artifacts into sub packages
-for (let file of await fs.readdir(tailwindcssOxideRoot)) {
-  if (file.startsWith('tailwindcss-oxide.') && file.endsWith('.node')) {
-    let target = file.split('.')[1]
-    await fs.cp(
-      path.join(tailwindcssOxideRoot, file),
-      path.join(tailwindcssOxideRoot, 'npm', target, file),
-    )
-    console.log(`Moved ${file} to npm/${target}`)
-  }
-}
-
-// Move napi wasm artifacts into sub package
-let wasmArtifacts = {
-  'tailwindcss-oxide.debug.wasm': 'tailwindcss-oxide.wasm32-wasi.debug.wasm',
-  'tailwindcss-oxide.wasm': 'tailwindcss-oxide.wasm32-wasi.wasm',
-  'tailwindcss-oxide.wasi-browser.js': 'tailwindcss-oxide.wasi-browser.js',
-  'tailwindcss-oxide.wasi.cjs': 'tailwindcss-oxide.wasi.cjs',
-  'wasi-worker-browser.mjs': 'wasi-worker-browser.mjs',
-  'wasi-worker.mjs': 'wasi-worker.mjs',
-}
-for (let file of await fs.readdir(tailwindcssOxideRoot)) {
-  if (!wasmArtifacts[file]) continue
-  await fs.cp(
-    path.join(tailwindcssOxideRoot, file),
-    path.join(tailwindcssOxideRoot, 'npm', 'wasm32-wasi', wasmArtifacts[file]),
-  )
-  console.log(`Moved ${file} to npm/wasm32-wasi`)
-}
diff --git a/crates/node/src/lib.rs b/crates/node/src/lib.rs
index fb32a818c..5811698c3 100644
--- a/crates/node/src/lib.rs
+++ b/crates/node/src/lib.rs
@@ -28,27 +28,20 @@ pub struct GlobEntry {
   pub pattern: String,
 }
 
-#[derive(Debug, Clone)]
-#[napi(object)]
-pub struct SourceEntry {
-  /// Base path of the glob
-  pub base: String,
-
-  /// Glob pattern
-  pub pattern: String,
-
-  /// Negated flag
-  pub negated: bool,
-}
-
-impl From<ChangedContent> for tailwindcss_oxide::ChangedContent {
+impl From<ChangedContent> for tailwindcss_oxide::ChangedContent<'_> {
   fn from(changed_content: ChangedContent) -> Self {
     if let Some(file) = changed_content.file {
-      return tailwindcss_oxide::ChangedContent::File(file.into(), changed_content.extension);
+      return tailwindcss_oxide::ChangedContent::File(
+        file.into(),
+        changed_content.extension.into(),
+      );
     }
 
     if let Some(contents) = changed_content.content {
-      return tailwindcss_oxide::ChangedContent::Content(contents, changed_content.extension);
+      return tailwindcss_oxide::ChangedContent::Content(
+        contents,
+        changed_content.extension.into(),
+      );
     }
 
     unreachable!()
@@ -73,23 +66,13 @@ impl From<tailwindcss_oxide::GlobEntry> for GlobEntry {
   }
 }
 
-impl From<SourceEntry> for tailwindcss_oxide::PublicSourceEntry {
-  fn from(source: SourceEntry) -> Self {
-    Self {
-      base: source.base,
-      pattern: source.pattern,
-      negated: source.negated,
-    }
-  }
-}
-
 // ---
 
 #[derive(Debug, Clone)]
 #[napi(object)]
 pub struct ScannerOptions {
   /// Glob sources
-  pub sources: Option<Vec<SourceEntry>>,
+  pub sources: Option<Vec<GlobEntry>>,
 }
 
 #[derive(Debug, Clone)]
@@ -113,10 +96,11 @@ impl Scanner {
   #[napi(constructor)]
   pub fn new(opts: ScannerOptions) -> Self {
     Self {
-      scanner: tailwindcss_oxide::Scanner::new(match opts.sources {
-        Some(sources) => sources.into_iter().map(Into::into).collect(),
-        None => vec![],
-      }),
+      scanner: tailwindcss_oxide::Scanner::new(
+        opts
+          .sources
+          .map(|x| x.into_iter().map(Into::into).collect()),
+      ),
     }
   }
 
@@ -165,11 +149,6 @@ impl Scanner {
     self.scanner.get_files()
   }
 
-  #[napi(getter)]
-  pub fn scanned_files(&self) -> Vec<String> {
-    self.scanner.get_scanned_files()
-  }
-
   #[napi(getter)]
   pub fn globs(&mut self) -> Vec<GlobEntry> {
     self
@@ -179,14 +158,4 @@ impl Scanner {
       .map(Into::into)
       .collect()
   }
-
-  #[napi(getter)]
-  pub fn normalized_sources(&mut self) -> Vec<GlobEntry> {
-    self
-      .scanner
-      .get_normalized_sources()
-      .into_iter()
-      .map(Into::into)
-      .collect()
-  }
 }
diff --git a/crates/oxide/Cargo.toml b/crates/oxide/Cargo.toml
index f8a5f6137..f3b67d8d7 100644
--- a/crates/oxide/Cargo.toml
+++ b/crates/oxide/Cargo.toml
@@ -9,18 +9,18 @@ globwalk = "0.9.1"
 log = "0.4.22"
 rayon = "1.10.0"
 fxhash = { package = "rustc-hash", version = "2.1.1" }
+crossbeam = "0.8.4"
 tracing = { version = "0.1.40", features = [] }
 tracing-subscriber = { version = "0.3.18", features = ["env-filter"] }
 walkdir = "2.5.0"
+ignore = "0.4.23"
 dunce = "1.0.5"
 bexpand = "1.2.0"
 fast-glob = "0.4.3"
 classification-macros = { path = "../classification-macros" }
-ignore = { path = "../ignore" }
 regex = "1.11.1"
+fancy-regex = "0.14.0"
 
 [dev-dependencies]
-insta = "1.48.0"
 tempfile = "3.13.0"
-pretty_assertions = "1.4.1"
-unicode-width = "0.2.0"
+
diff --git a/crates/oxide/src/cursor.rs b/crates/oxide/src/cursor.rs
index 71cdccdf6..ebda110a2 100644
--- a/crates/oxide/src/cursor.rs
+++ b/crates/oxide/src/cursor.rs
@@ -1,49 +1,44 @@
 use std::{ascii::escape_default, fmt::Display};
 
-#[derive(Debug, Clone, Copy)]
+#[derive(Debug, Clone)]
 pub struct Cursor<'a> {
     // The input we're scanning
     pub input: &'a [u8],
 
     // The location of the cursor in the input
     pub pos: usize,
+
+    /// Is the cursor at the start of the input
+    pub at_start: bool,
+
+    /// Is the cursor at the end of the input
+    pub at_end: bool,
+
+    /// The previously consumed character
+    /// If `at_start` is true, this will be NUL
+    pub prev: u8,
+
+    /// The current character
+    pub curr: u8,
+
+    /// The upcoming character (if any)
+    /// If `at_end` is true, this will be NUL
+    pub next: u8,
 }
 
 impl<'a> Cursor<'a> {
-    #[inline(always)]
     pub fn new(input: &'a [u8]) -> Self {
-        Self { input, pos: 0 }
-    }
-
-    /// The current byte at `pos`, or 0x00 if past the end.
-    #[inline(always)]
-    pub fn curr(&self) -> u8 {
-        if self.pos < self.input.len() {
-            unsafe { *self.input.get_unchecked(self.pos) }
-        } else {
-            0x00
-        }
-    }
-
-    /// The next byte at `pos + 1`, or 0x00 if past the end.
-    #[inline(always)]
-    pub fn next(&self) -> u8 {
-        let next_pos = self.pos + 1;
-        if next_pos < self.input.len() {
-            unsafe { *self.input.get_unchecked(next_pos) }
-        } else {
-            0x00
-        }
-    }
-
-    /// The previous byte at `pos - 1`, or 0x00 if at the start.
-    #[inline(always)]
-    pub fn prev(&self) -> u8 {
-        if self.pos > 0 {
-            unsafe { *self.input.get_unchecked(self.pos - 1) }
-        } else {
-            0x00
-        }
+        let mut cursor = Self {
+            input,
+            pos: 0,
+            at_start: true,
+            at_end: false,
+            prev: 0x00,
+            curr: 0x00,
+            next: 0x00,
+        };
+        cursor.move_to(0);
+        cursor
     }
 
     pub fn advance_by(&mut self, amount: usize) {
@@ -53,15 +48,38 @@ impl<'a> Cursor<'a> {
     #[inline(always)]
     pub fn advance(&mut self) {
         self.pos += 1;
+
+        self.prev = self.curr;
+        self.curr = self.next;
+        self.next = *self
+            .input
+            .get(self.pos.saturating_add(1))
+            .unwrap_or(&0x00u8);
     }
 
     #[inline(always)]
     pub fn advance_twice(&mut self) {
         self.pos += 2;
+
+        self.prev = self.next;
+        self.curr = *self.input.get(self.pos).unwrap_or(&0x00u8);
+        self.next = *self
+            .input
+            .get(self.pos.saturating_add(1))
+            .unwrap_or(&0x00u8);
     }
 
     pub fn move_to(&mut self, pos: usize) {
-        self.pos = pos.min(self.input.len());
+        let len = self.input.len();
+        let pos = pos.clamp(0, len);
+
+        self.pos = pos;
+        self.at_start = pos == 0;
+        self.at_end = pos + 1 >= len;
+
+        self.prev = *self.input.get(pos.wrapping_sub(1)).unwrap_or(&0x00u8);
+        self.curr = *self.input.get(pos).unwrap_or(&0x00u8);
+        self.next = *self.input.get(pos.saturating_add(1)).unwrap_or(&0x00u8);
     }
 }
 
@@ -72,9 +90,9 @@ impl Display for Cursor<'_> {
         let pos = format!("{: >len_count$}", self.pos, len_count = len.len());
         write!(f, "{}/{} ", pos, len)?;
 
-        if self.pos == 0 {
+        if self.at_start {
             write!(f, "S ")?;
-        } else if self.pos + 1 >= self.input.len() {
+        } else if self.at_end {
             write!(f, "E ")?;
         } else {
             write!(f, "M ")?;
@@ -91,9 +109,9 @@ impl Display for Cursor<'_> {
         write!(
             f,
             "[{} {} {}]",
-            to_str(self.prev()),
-            to_str(self.curr()),
-            to_str(self.next())
+            to_str(self.prev),
+            to_str(self.curr),
+            to_str(self.next)
         )
     }
 }
@@ -101,34 +119,41 @@ impl Display for Cursor<'_> {
 #[cfg(test)]
 mod test {
     use super::*;
-    use pretty_assertions::assert_eq;
 
     #[test]
     fn test_cursor() {
         let mut cursor = Cursor::new(b"hello world");
         assert_eq!(cursor.pos, 0);
-        assert_eq!(cursor.prev(), 0x00);
-        assert_eq!(cursor.curr(), b'h');
-        assert_eq!(cursor.next(), b'e');
+        assert!(cursor.at_start);
+        assert!(!cursor.at_end);
+        assert_eq!(cursor.prev, 0x00);
+        assert_eq!(cursor.curr, b'h');
+        assert_eq!(cursor.next, b'e');
 
         cursor.advance_by(1);
         assert_eq!(cursor.pos, 1);
-        assert_eq!(cursor.prev(), b'h');
-        assert_eq!(cursor.curr(), b'e');
-        assert_eq!(cursor.next(), b'l');
+        assert!(!cursor.at_start);
+        assert!(!cursor.at_end);
+        assert_eq!(cursor.prev, b'h');
+        assert_eq!(cursor.curr, b'e');
+        assert_eq!(cursor.next, b'l');
 
         // Advancing too far should stop at the end
         cursor.advance_by(10);
         assert_eq!(cursor.pos, 11);
-        assert_eq!(cursor.prev(), b'd');
-        assert_eq!(cursor.curr(), 0x00);
-        assert_eq!(cursor.next(), 0x00);
+        assert!(!cursor.at_start);
+        assert!(cursor.at_end);
+        assert_eq!(cursor.prev, b'd');
+        assert_eq!(cursor.curr, 0x00);
+        assert_eq!(cursor.next, 0x00);
 
         // Can't advance past the end
         cursor.advance_by(1);
         assert_eq!(cursor.pos, 11);
-        assert_eq!(cursor.prev(), b'd');
-        assert_eq!(cursor.curr(), 0x00);
-        assert_eq!(cursor.next(), 0x00);
+        assert!(!cursor.at_start);
+        assert!(cursor.at_end);
+        assert_eq!(cursor.prev, b'd');
+        assert_eq!(cursor.curr, 0x00);
+        assert_eq!(cursor.next, 0x00);
     }
 }
diff --git a/crates/oxide/src/extractor/arbitrary_property_machine.rs b/crates/oxide/src/extractor/arbitrary_property_machine.rs
index a43253339..bf5373a3d 100644
--- a/crates/oxide/src/extractor/arbitrary_property_machine.rs
+++ b/crates/oxide/src/extractor/arbitrary_property_machine.rs
@@ -74,7 +74,7 @@ impl Machine for ArbitraryPropertyMachine<IdleState> {
 
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
+        match cursor.curr.into() {
             // Start of an arbitrary property
             Class::OpenBracket => {
                 self.start_pos = cursor.pos;
@@ -97,8 +97,8 @@ impl Machine for ArbitraryPropertyMachine<ParsingPropertyState> {
         let len = cursor.input.len();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
-                Class::Dash => match cursor.next().into() {
+            match cursor.curr.into() {
+                Class::Dash => match cursor.next.into() {
                     // Start of a CSS variable
                     //
                     // E.g.: `[--my-color:red]`
@@ -137,7 +137,7 @@ impl ArbitraryPropertyMachine<ParsingPropertyState> {
     fn parse_property_variable(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         match self.css_variable_machine.next(cursor) {
             MachineState::Idle => self.restart(),
-            MachineState::Done(_) => match cursor.next().into() {
+            MachineState::Done(_) => match cursor.next.into() {
                 // End of the CSS variable, must be followed by a `:`
                 //
                 // E.g.: `[--my-color:red]`
@@ -165,8 +165,8 @@ impl Machine for ArbitraryPropertyMachine<ParsingValueState> {
         let len = cursor.input.len();
         let start_of_value_pos = cursor.pos;
         while cursor.pos < len {
-            match cursor.curr().into() {
-                Class::Escape => match cursor.next().into() {
+            match cursor.curr.into() {
+                Class::Escape => match cursor.next.into() {
                     // An escaped whitespace character is not allowed
                     //
                     // E.g.: `[color:var(--my-\ color)]`
@@ -181,7 +181,7 @@ impl Machine for ArbitraryPropertyMachine<ParsingValueState> {
                 },
 
                 Class::OpenParen | Class::OpenBracket | Class::OpenCurly => {
-                    if !self.bracket_stack.push(cursor.curr()) {
+                    if !self.bracket_stack.push(cursor.curr) {
                         return self.restart();
                     }
                     cursor.advance();
@@ -190,7 +190,7 @@ impl Machine for ArbitraryPropertyMachine<ParsingValueState> {
                 Class::CloseParen | Class::CloseBracket | Class::CloseCurly
                     if !self.bracket_stack.is_empty() =>
                 {
-                    if !self.bracket_stack.pop(cursor.curr()) {
+                    if !self.bracket_stack.pop(cursor.curr) {
                         return self.restart();
                     }
                     cursor.advance();
@@ -227,16 +227,10 @@ impl Machine for ArbitraryPropertyMachine<ParsingValueState> {
                 Class::Slash if start_of_value_pos == cursor.pos => return self.restart(),
 
                 // String interpolation-like syntax is not allowed. E.g.: `[${x}]`
-                Class::Dollar if matches!(cursor.next().into(), Class::OpenCurly) => {
+                Class::Dollar if matches!(cursor.next.into(), Class::OpenCurly) => {
                     return self.restart()
                 }
 
-                // An `!` at the top-level is invalid. We don't allow things to end with
-                // `!important` either as we have dedicated syntax for this.
-                Class::Exclamation if self.bracket_stack.is_empty() => {
-                    return self.restart();
-                }
-
                 // Everything else is valid
                 _ => cursor.advance(),
             };
@@ -299,9 +293,6 @@ enum Class {
     #[bytes(b'/')]
     Slash,
 
-    #[bytes(b'!')]
-    Exclamation,
-
     #[bytes(b' ', b'\t', b'\n', b'\r', b'\x0C')]
     Whitespace,
 
@@ -316,7 +307,6 @@ enum Class {
 mod tests {
     use super::{ArbitraryPropertyMachine, IdleState};
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
@@ -378,9 +368,6 @@ mod tests {
                 "[background:url(https://example.com?q={[{[([{[[2]]}])]}]})]",
                 vec!["[background:url(https://example.com?q={[{[([{[[2]]}])]}]})]"],
             ),
-            // A property containing `!` at the top-level is invalid
-            ("[color:red!]", vec![]),
-            ("[color:red!important]", vec![]),
         ] {
             for wrapper in [
                 // No wrapper
@@ -426,7 +413,7 @@ mod tests {
                 let actual = ArbitraryPropertyMachine::<IdleState>::test_extract_all(&input);
 
                 if actual != expected {
-                    dbg!(&input);
+                    dbg!(&input, &actual, &expected);
                 }
                 assert_eq!(actual, expected);
             }
diff --git a/crates/oxide/src/extractor/arbitrary_value_machine.rs b/crates/oxide/src/extractor/arbitrary_value_machine.rs
index cbef62c42..b4370c2d2 100644
--- a/crates/oxide/src/extractor/arbitrary_value_machine.rs
+++ b/crates/oxide/src/extractor/arbitrary_value_machine.rs
@@ -32,7 +32,7 @@ impl Machine for ArbitraryValueMachine {
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         // An arbitrary value must start with an open bracket
-        if Class::OpenBracket != cursor.curr().into() {
+        if Class::OpenBracket != cursor.curr.into() {
             return MachineState::Idle;
         }
 
@@ -42,8 +42,8 @@ impl Machine for ArbitraryValueMachine {
         let len = cursor.input.len();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
-                Class::Escape => match cursor.next().into() {
+            match cursor.curr.into() {
+                Class::Escape => match cursor.next.into() {
                     // An escaped whitespace character is not allowed
                     //
                     // E.g.: `[color:var(--my-\ color)]`
@@ -61,7 +61,7 @@ impl Machine for ArbitraryValueMachine {
                 },
 
                 Class::OpenParen | Class::OpenBracket | Class::OpenCurly => {
-                    if !self.bracket_stack.push(cursor.curr()) {
+                    if !self.bracket_stack.push(cursor.curr) {
                         return self.restart();
                     }
                     cursor.advance();
@@ -70,7 +70,7 @@ impl Machine for ArbitraryValueMachine {
                 Class::CloseParen | Class::CloseBracket | Class::CloseCurly
                     if !self.bracket_stack.is_empty() =>
                 {
-                    if !self.bracket_stack.pop(cursor.curr()) {
+                    if !self.bracket_stack.pop(cursor.curr) {
                         return self.restart();
                     }
                     cursor.advance();
@@ -96,7 +96,7 @@ impl Machine for ArbitraryValueMachine {
                 Class::Whitespace => return self.restart(),
 
                 // String interpolation-like syntax is not allowed. E.g.: `[${x}]`
-                Class::Dollar if matches!(cursor.next().into(), Class::OpenCurly) => {
+                Class::Dollar if matches!(cursor.next.into(), Class::OpenCurly) => {
                     return self.restart()
                 }
 
@@ -149,7 +149,6 @@ enum Class {
 mod tests {
     use super::ArbitraryValueMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
diff --git a/crates/oxide/src/extractor/arbitrary_variable_machine.rs b/crates/oxide/src/extractor/arbitrary_variable_machine.rs
index e8d475557..355572769 100644
--- a/crates/oxide/src/extractor/arbitrary_variable_machine.rs
+++ b/crates/oxide/src/extractor/arbitrary_variable_machine.rs
@@ -80,13 +80,13 @@ impl Machine for ArbitraryVariableMachine<IdleState> {
 
     #[inline(always)]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
+        match cursor.curr.into() {
             // Arbitrary variables start with `(` followed by a CSS variable
             //
             // E.g.: `(--my-variable)`
             //        ^^
             //
-            Class::OpenParen => match cursor.next().into() {
+            Class::OpenParen => match cursor.next.into() {
                 Class::Dash => {
                     self.start_pos = cursor.pos;
                     cursor.advance();
@@ -117,7 +117,7 @@ impl Machine for ArbitraryVariableMachine<ParsingState> {
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         match self.css_variable_machine.next(cursor) {
             MachineState::Idle => self.restart(),
-            MachineState::Done(_) => match cursor.next().into() {
+            MachineState::Done(_) => match cursor.next.into() {
                 // A CSS variable followed by a `,` means that there is a fallback
                 //
                 // E.g.: `(--my-color,red)`
@@ -134,7 +134,7 @@ impl Machine for ArbitraryVariableMachine<ParsingState> {
                 _ => {
                     cursor.advance();
 
-                    match cursor.curr().into() {
+                    match cursor.curr.into() {
                         // End of an arbitrary variable, must be followed by `)`
                         Class::CloseParen => self.done(self.start_pos, cursor),
 
@@ -156,7 +156,7 @@ impl Machine for ArbitraryVariableMachine<ParsingDataTypeState> {
         let len = cursor.input.len();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
+            match cursor.curr.into() {
                 // Valid data type characters
                 //
                 // E.g.: `(length:--my-length)`
@@ -169,7 +169,7 @@ impl Machine for ArbitraryVariableMachine<ParsingDataTypeState> {
                 //
                 // E.g.: `(length:--my-length)`
                 //               ^
-                Class::Colon => match cursor.next().into() {
+                Class::Colon => match cursor.next.into() {
                     Class::Dash => {
                         cursor.advance();
                         return self.transition::<ParsingState>().next(cursor);
@@ -196,8 +196,8 @@ impl Machine for ArbitraryVariableMachine<ParsingFallbackState> {
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         let len = cursor.input.len();
         while cursor.pos < len {
-            match cursor.curr().into() {
-                Class::Escape => match cursor.next().into() {
+            match cursor.curr.into() {
+                Class::Escape => match cursor.next.into() {
                     // An escaped whitespace character is not allowed
                     //
                     // E.g.: `(--my-\ color)`
@@ -212,7 +212,7 @@ impl Machine for ArbitraryVariableMachine<ParsingFallbackState> {
                 },
 
                 Class::OpenParen | Class::OpenBracket | Class::OpenCurly => {
-                    if !self.bracket_stack.push(cursor.curr()) {
+                    if !self.bracket_stack.push(cursor.curr) {
                         return self.restart();
                     }
                     cursor.advance();
@@ -221,7 +221,7 @@ impl Machine for ArbitraryVariableMachine<ParsingFallbackState> {
                 Class::CloseParen | Class::CloseBracket | Class::CloseCurly
                     if !self.bracket_stack.is_empty() =>
                 {
-                    if !self.bracket_stack.pop(cursor.curr()) {
+                    if !self.bracket_stack.pop(cursor.curr) {
                         return self.restart();
                     }
                     cursor.advance();
@@ -253,7 +253,7 @@ impl Machine for ArbitraryVariableMachine<ParsingFallbackState> {
                 Class::Whitespace => return self.restart(),
 
                 // String interpolation-like syntax is not allowed. E.g.: `[${x}]`
-                Class::Dollar if matches!(cursor.next().into(), Class::OpenCurly) => {
+                Class::Dollar if matches!(cursor.next.into(), Class::OpenCurly) => {
                     return self.restart()
                 }
 
@@ -336,7 +336,6 @@ enum Class {
 mod tests {
     use super::ArbitraryVariableMachine;
     use crate::extractor::{arbitrary_variable_machine::IdleState, machine::Machine};
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
diff --git a/crates/oxide/src/extractor/bracket_stack.rs b/crates/oxide/src/extractor/bracket_stack.rs
index 2b8d3a13f..f34e56ed3 100644
--- a/crates/oxide/src/extractor/bracket_stack.rs
+++ b/crates/oxide/src/extractor/bracket_stack.rs
@@ -25,7 +25,6 @@ impl BracketStack {
                 b'(' => b')',
                 b'[' => b']',
                 b'{' => b'}',
-                b'<' => b'>',
                 _ => std::hint::unreachable_unchecked(),
             };
         }
diff --git a/crates/oxide/src/extractor/candidate_machine.rs b/crates/oxide/src/extractor/candidate_machine.rs
index a755cf02a..33b67098f 100644
--- a/crates/oxide/src/extractor/candidate_machine.rs
+++ b/crates/oxide/src/extractor/candidate_machine.rs
@@ -32,14 +32,14 @@ impl Machine for CandidateMachine {
         while cursor.pos < len {
             // Skip ahead for known characters that will never be part of a candidate. No need to
             // run any sub-machines.
-            if cursor.curr().is_ascii_whitespace() {
+            if cursor.curr.is_ascii_whitespace() {
                 self.reset();
                 cursor.advance();
                 continue;
             }
 
             // Candidates don't start with these characters, so we can skip ahead.
-            if matches!(cursor.curr(), b':' | b'"' | b'\'' | b'`') {
+            if matches!(cursor.curr, b':' | b'"' | b'\'' | b'`') {
                 self.reset();
                 cursor.advance();
                 continue;
@@ -56,7 +56,7 @@ impl Machine for CandidateMachine {
             // E.g.: `Some Class`
             //        ^    ^       Invalid, we can jump ahead to the next boundary
             //
-            if matches!(cursor.curr(), b'<' | b'A'..=b'Z') {
+            if matches!(cursor.curr, b'<' | b'A'..=b'Z') {
                 if let Some(offset) = cursor.input[cursor.pos..]
                     .iter()
                     .position(|&c| is_valid_before_boundary(&c))
@@ -181,7 +181,6 @@ impl CandidateMachine {
 mod tests {
     use super::CandidateMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
@@ -308,7 +307,7 @@ mod tests {
                 actual.sort();
 
                 if actual != expected {
-                    dbg!(&input);
+                    dbg!(&input, &expected, &actual);
                 }
 
                 assert_eq!(actual, expected);
diff --git a/crates/oxide/src/extractor/css_variable_machine.rs b/crates/oxide/src/extractor/css_variable_machine.rs
index 7beb827ee..ab6ab3121 100644
--- a/crates/oxide/src/extractor/css_variable_machine.rs
+++ b/crates/oxide/src/extractor/css_variable_machine.rs
@@ -20,7 +20,7 @@ impl Machine for CssVariableMachine {
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         // CSS Variables must start with `--`
-        if Class::Dash != cursor.curr().into() || Class::Dash != cursor.next().into() {
+        if Class::Dash != cursor.curr.into() || Class::Dash != cursor.next.into() {
             return MachineState::Idle;
         }
 
@@ -30,11 +30,11 @@ impl Machine for CssVariableMachine {
         cursor.advance_twice();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
+            match cursor.curr.into() {
                 // https://drafts.csswg.org/css-syntax-3/#ident-token-diagram
                 //
                 Class::AllowedCharacter | Class::Dash => {
-                    match cursor.next().into() {
+                    match cursor.next.into() {
                         // Valid character followed by a valid character or an escape character
                         //
                         // E.g.: `--my-variable`
@@ -58,7 +58,7 @@ impl Machine for CssVariableMachine {
                     }
                 }
 
-                Class::Escape => match cursor.next().into() {
+                Class::Escape => match cursor.next.into() {
                     // An escaped whitespace character is not allowed
                     //
                     // In CSS it is allowed, but in the context of a class it's not because then we
@@ -116,7 +116,6 @@ enum Class {
 mod tests {
     use super::CssVariableMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
@@ -204,7 +203,7 @@ mod tests {
                 let actual = CssVariableMachine::test_extract_all(&input);
 
                 if actual != expected {
-                    dbg!(&input);
+                    dbg!(&input, &actual, &expected);
                 }
 
                 assert_eq!(actual, expected);
diff --git a/crates/oxide/src/extractor/mod.rs b/crates/oxide/src/extractor/mod.rs
index a3d806a27..ce6d0aeae 100644
--- a/crates/oxide/src/extractor/mod.rs
+++ b/crates/oxide/src/extractor/mod.rs
@@ -86,7 +86,7 @@ impl<'a> Extractor<'a> {
         {
             let cursor = &mut self.cursor.clone();
             while cursor.pos < len {
-                if cursor.curr().is_ascii_whitespace() {
+                if cursor.curr.is_ascii_whitespace() {
                     cursor.advance();
                     continue;
                 }
@@ -104,7 +104,7 @@ impl<'a> Extractor<'a> {
             let cursor = &mut self.cursor.clone();
 
             while cursor.pos < len {
-                if cursor.curr().is_ascii_whitespace() {
+                if cursor.curr.is_ascii_whitespace() {
                     cursor.advance();
                     continue;
                 }
@@ -139,41 +139,6 @@ impl<'a> Extractor<'a> {
 
         extracted
     }
-
-    pub fn extract_variables_from_css(&mut self) -> Vec<Extracted<'a>> {
-        let mut extracted = Vec::with_capacity(100);
-
-        let len = self.cursor.input.len();
-
-        let cursor = &mut self.cursor.clone();
-        while cursor.pos < len {
-            if cursor.curr().is_ascii_whitespace() {
-                cursor.advance();
-                continue;
-            }
-
-            if let MachineState::Done(span) = self.css_variable_machine.next(cursor) {
-                // We are only interested in variables that are used, not defined. Therefore we
-                // need to ensure that the variable is prefixed with `var(`.
-                if span.start < 4 {
-                    cursor.advance();
-                    continue;
-                }
-
-                let slice_before = Span::new(span.start - 4, span.start - 1);
-                if !slice_before.slice(self.cursor.input).starts_with(b"var(") {
-                    cursor.advance();
-                    continue;
-                }
-
-                extracted.push(Extracted::CssVariable(span.slice(self.cursor.input)));
-            }
-
-            cursor.advance();
-        }
-
-        extracted
-    }
 }
 
 // Extract sub-candidates from a given range.
@@ -234,11 +199,10 @@ fn drop_covered_spans(mut spans: Vec<Span>) -> Vec<Span> {
 mod tests {
     use super::{Extracted, Extractor};
     use crate::throughput::Throughput;
-    use pretty_assertions::assert_eq;
     use std::hint::black_box;
 
     fn pre_process_input(input: &str, extension: &str) -> String {
-        let input = crate::scanner::pre_process_input(input.as_bytes().to_vec(), extension);
+        let input = crate::pre_process_input(input.as_bytes(), extension);
         String::from_utf8(input).unwrap()
     }
 
@@ -280,7 +244,7 @@ mod tests {
         expected.dedup();
 
         if actual != expected {
-            dbg!(&input);
+            dbg!(&input, &actual, &expected);
         }
         assert_eq!(actual, expected);
     }
@@ -308,7 +272,7 @@ mod tests {
         expected.sort();
 
         if actual != expected {
-            dbg!(&input);
+            dbg!(&input, &actual, &expected);
         }
         assert_eq!(actual, expected);
     }
@@ -908,18 +872,6 @@ mod tests {
         );
     }
 
-    // https://github.com/tailwindlabs/tailwindcss/issues/20233
-    #[test]
-    fn test_template_toolkit_syntax() {
-        assert_extract_candidates_contains(
-            &pre_process_input(
-                r#"<div class="[% IF $is_open %]bg-white/40[% ELSE %]bg-white/10[% END %]"></div>"#,
-                "tx",
-            ),
-            vec!["bg-white/40", "bg-white/10"],
-        );
-    }
-
     // https://github.com/tailwindlabs/tailwindcss/issues/17050
     #[test]
     fn test_haml_syntax() {
@@ -1066,20 +1018,6 @@ mod tests {
         );
     }
 
-    // See: https://github.com/tailwindlabs/tailwindcss/issues/18092
-    #[test]
-    fn test_leptos_rs_view_class_colon_syntax() {
-        for (input, expected) in [
-            (r#"<div class:px-6=true>"#, vec!["class", "px-6"]),
-            (
-                r#"view! { <div class:px-6=true> }"#,
-                vec!["class", "px-6", "view!"],
-            ),
-        ] {
-            assert_extract_sorted_candidates(&pre_process_input(input, "svelte"), expected);
-        }
-    }
-
     #[test]
     fn test_extract_css_variables() {
         for (input, expected) in [
diff --git a/crates/oxide/src/extractor/modifier_machine.rs b/crates/oxide/src/extractor/modifier_machine.rs
index 811bc9ded..3104a0b11 100644
--- a/crates/oxide/src/extractor/modifier_machine.rs
+++ b/crates/oxide/src/extractor/modifier_machine.rs
@@ -31,14 +31,14 @@ impl Machine for ModifierMachine {
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         // A modifier must start with a `/`, everything else is not a valid start of a modifier
-        if Class::Slash != cursor.curr().into() {
+        if Class::Slash != cursor.curr.into() {
             return MachineState::Idle;
         }
 
         let start_pos = cursor.pos;
         cursor.advance();
 
-        match cursor.curr().into() {
+        match cursor.curr.into() {
             // Start of an arbitrary value:
             //
             // ```
@@ -70,9 +70,9 @@ impl Machine for ModifierMachine {
             Class::ValidStart => {
                 let len = cursor.input.len();
                 while cursor.pos < len {
-                    match cursor.curr().into() {
+                    match cursor.curr.into() {
                         Class::ValidStart | Class::ValidInside => {
-                            match cursor.next().into() {
+                            match cursor.next.into() {
                                 // Only valid characters are allowed, if followed by another valid character
                                 Class::ValidStart | Class::ValidInside => cursor.advance(),
 
@@ -121,7 +121,6 @@ enum Class {
 mod tests {
     use super::ModifierMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
diff --git a/crates/oxide/src/extractor/named_utility_machine.rs b/crates/oxide/src/extractor/named_utility_machine.rs
index 24dc027b2..e206cadc0 100644
--- a/crates/oxide/src/extractor/named_utility_machine.rs
+++ b/crates/oxide/src/extractor/named_utility_machine.rs
@@ -52,8 +52,8 @@ impl Machine for NamedUtilityMachine<IdleState> {
 
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
-            Class::AlphaLower => match cursor.next().into() {
+        match cursor.curr.into() {
+            Class::AlphaLower => match cursor.next.into() {
                 // Valid single character utility in between quotes
                 //
                 // E.g.: `<div class="a"></div>`
@@ -90,7 +90,7 @@ impl Machine for NamedUtilityMachine<IdleState> {
             //
             // E.g.: `-mx-2.5`
             //        ^^
-            Class::Dash => match cursor.next().into() {
+            Class::Dash => match cursor.next.into() {
                 Class::AlphaLower => {
                     self.start_pos = cursor.pos;
                     cursor.advance();
@@ -118,7 +118,7 @@ impl Machine for NamedUtilityMachine<ParsingState> {
         let len = cursor.input.len();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
+            match cursor.curr.into() {
                 // Followed by a boundary character, we are at the end of the utility.
                 //
                 // E.g.: `'flex'`
@@ -132,14 +132,14 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                 // E.g.: `:div="{ flex: true }"` (JavaScript object syntax)
                 //                    ^
                 Class::AlphaLower | Class::AlphaUpper => {
-                    if is_valid_after_boundary(&cursor.next()) || {
+                    if is_valid_after_boundary(&cursor.next) || {
                         // Or any of these characters
                         //
                         // - `:`, because of JS object keys
                         // - `/`, because of modifiers
                         // - `!`, because of important
                         matches!(
-                            cursor.next().into(),
+                            cursor.next.into(),
                             Class::Colon | Class::Slash | Class::Exclamation
                         )
                     } {
@@ -150,7 +150,7 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                     cursor.advance()
                 }
 
-                Class::Dash => match cursor.next().into() {
+                Class::Dash => match cursor.next.into() {
                     // Start of an arbitrary value
                     //
                     // E.g.: `bg-[#0088cc]`
@@ -196,7 +196,7 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                     _ => return self.restart(),
                 },
 
-                Class::Underscore => match cursor.next().into() {
+                Class::Underscore => match cursor.next.into() {
                     // Valid characters _if_ followed by another valid character. These characters are
                     // only valid inside of the utility but not at the end of the utility.
                     //
@@ -225,14 +225,14 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                     //                   ^
                     // E.g.: `:div="{ flex: true }"` (JavaScript object syntax)
                     //                    ^
-                    _ if is_valid_after_boundary(&cursor.next()) || {
+                    _ if is_valid_after_boundary(&cursor.next) || {
                         // Or any of these characters
                         //
                         // - `:`, because of JS object keys
                         // - `/`, because of modifiers
                         // - `!`, because of important
                         matches!(
-                            cursor.next().into(),
+                            cursor.next.into(),
                             Class::Colon | Class::Slash | Class::Exclamation
                         )
                     } =>
@@ -249,11 +249,11 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                 // E.g.: `px-2.5`
                 //           ^^^
                 Class::Dot => {
-                    if !matches!(cursor.prev().into(), Class::Number) {
+                    if !matches!(cursor.prev.into(), Class::Number) {
                         return self.restart();
                     }
 
-                    if !matches!(cursor.next().into(), Class::Number) {
+                    if !matches!(cursor.next.into(), Class::Number) {
                         return self.restart();
                     }
 
@@ -278,19 +278,14 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                 //
                 Class::Number => {
                     if !matches!(
-                        cursor.prev().into(),
-                        Class::Dash
-                            | Class::Underscore
-                            | Class::Dot
-                            | Class::Number
-                            | Class::AlphaLower
-                            | Class::AlphaUpper
+                        cursor.prev.into(),
+                        Class::Dash | Class::Dot | Class::Number | Class::AlphaLower
                     ) {
                         return self.restart();
                     }
 
                     if !matches!(
-                        cursor.next().into(),
+                        cursor.next.into(),
                         Class::Dot
                             | Class::Number
                             | Class::AlphaLower
@@ -314,7 +309,7 @@ impl Machine for NamedUtilityMachine<ParsingState> {
                 //       ^^
                 // ```
                 Class::Percent => {
-                    if !matches!(cursor.prev().into(), Class::Number) {
+                    if !matches!(cursor.prev.into(), Class::Number) {
                         return self.restart();
                     }
 
@@ -391,7 +386,6 @@ enum Class {
 mod tests {
     use super::{IdleState, NamedUtilityMachine};
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
@@ -420,14 +414,9 @@ mod tests {
             // With numbers
             ("px-5", vec!["px-5"]),
             ("px-2.5", vec!["px-2.5"]),
-            // Underscores followed by numbers
-            ("header_1", vec!["header_1"]),
-            ("header_1_2", vec!["header_1_2"]),
             // With number followed by dash or underscore
             ("text-title1-strong", vec!["text-title1-strong"]),
             ("text-title1_strong", vec!["text-title1_strong"]),
-            // With capital letter followed by number
-            ("text-titleV1-strong", vec!["text-titleV1-strong"]),
             // With trailing % sign
             ("from-15%", vec!["from-15%"]),
             // Arbitrary value with bracket notation
@@ -526,7 +515,7 @@ mod tests {
                 actual.sort();
 
                 if actual != expected {
-                    dbg!(&input);
+                    dbg!(&input, &expected, &actual);
                 }
                 assert_eq!(actual, expected);
             }
diff --git a/crates/oxide/src/extractor/named_variant_machine.rs b/crates/oxide/src/extractor/named_variant_machine.rs
index 285fe6ab5..642c568a3 100644
--- a/crates/oxide/src/extractor/named_variant_machine.rs
+++ b/crates/oxide/src/extractor/named_variant_machine.rs
@@ -81,8 +81,8 @@ impl Machine for NamedVariantMachine<IdleState> {
 
     #[inline(always)]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
-            Class::AlphaLower | Class::Star => match cursor.next().into() {
+        match cursor.curr.into() {
+            Class::AlphaLower | Class::Star => match cursor.next.into() {
                 // Valid single character variant, must be followed by a `:`
                 //
                 // E.g.: `<div class="x:flex"></div>`
@@ -134,8 +134,8 @@ impl Machine for NamedVariantMachine<ParsingState> {
         let len = cursor.input.len();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
-                Class::Dash => match cursor.next().into() {
+            match cursor.curr.into() {
+                Class::Dash => match cursor.next.into() {
                     // Start of an arbitrary value
                     //
                     // E.g.: `data-[state=pending]:`.
@@ -192,7 +192,7 @@ impl Machine for NamedVariantMachine<ParsingState> {
                     };
                 }
 
-                Class::Underscore => match cursor.next().into() {
+                Class::Underscore => match cursor.next.into() {
                     // Valid characters _if_ followed by another valid character. These characters are
                     // only valid inside of the variant but not at the end of the variant.
                     //
@@ -240,11 +240,11 @@ impl Machine for NamedVariantMachine<ParsingState> {
                 // E.g.: `2.5xl:flex`
                 //        ^^^
                 Class::Dot => {
-                    if !matches!(cursor.prev().into(), Class::Number) {
+                    if !matches!(cursor.prev.into(), Class::Number) {
                         return self.restart();
                     }
 
-                    if !matches!(cursor.next().into(), Class::Number) {
+                    if !matches!(cursor.next.into(), Class::Number) {
                         return self.restart();
                     }
 
@@ -263,7 +263,7 @@ impl Machine for NamedVariantMachine<ParsingState> {
 impl NamedVariantMachine<ParsingState> {
     #[inline(always)]
     fn parse_arbitrary_end(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.next().into() {
+        match cursor.next.into() {
             Class::Slash => {
                 cursor.advance();
                 self.transition::<ParsingModifierState>().next(cursor)
@@ -285,7 +285,7 @@ impl Machine for NamedVariantMachine<ParsingModifierState> {
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         match self.modifier_machine.next(cursor) {
             MachineState::Idle => self.restart(),
-            MachineState::Done(_) => match cursor.next().into() {
+            MachineState::Done(_) => match cursor.next.into() {
                 // Modifier must be followed by a `:`
                 //
                 // E.g.: `group-hover/name:`
@@ -308,7 +308,7 @@ impl Machine for NamedVariantMachine<ParsingEndState> {
 
     #[inline(always)]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
+        match cursor.curr.into() {
             // The end of a variant must be the `:`
             //
             // E.g.: `hover:`
@@ -367,7 +367,6 @@ enum Class {
 mod tests {
     use super::{IdleState, NamedVariantMachine};
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
@@ -414,7 +413,7 @@ mod tests {
         ] {
             let actual = NamedVariantMachine::<IdleState>::test_extract_all(input);
             if actual != expected {
-                dbg!(&input);
+                dbg!(&input, &actual, &expected);
             }
             assert_eq!(actual, expected);
         }
diff --git a/crates/oxide/src/extractor/pre_processors/clojure.rs b/crates/oxide/src/extractor/pre_processors/clojure.rs
index 3fb4ce601..b86e4993b 100644
--- a/crates/oxide/src/extractor/pre_processors/clojure.rs
+++ b/crates/oxide/src/extractor/pre_processors/clojure.rs
@@ -5,23 +5,6 @@ use bstr::ByteSlice;
 #[derive(Debug, Default)]
 pub struct Clojure;
 
-/// This is meant to be a rough estimate of a valid ClojureScript keyword
-///
-/// This can be approximated by the following regex:
-/// /::?[a-zA-Z0-9!#$%&*+./:<=>?_|-]+/
-///
-/// However, keywords are intended to be detected as utilities. Since the set
-/// of valid characters in a utility (outside of arbitrary values) is smaller,
-/// along with the fact that neither `[]` nor `()` are allowed in keywords we
-/// can simplify this list quite a bit.
-#[inline]
-fn is_keyword_character(byte: u8) -> bool {
-    (matches!(
-        byte,
-        b'!' | b'#' | b'%' | b'*' | b'+' | b'-' | b'.' | b'/' | b':' | b'_'
-    ) | byte.is_ascii_alphanumeric())
-}
-
 impl PreProcessor for Clojure {
     fn process(&self, content: &[u8]) -> Vec<u8> {
         let content = content
@@ -32,22 +15,18 @@ impl PreProcessor for Clojure {
         let mut cursor = cursor::Cursor::new(&content);
 
         while cursor.pos < len {
-            match cursor.curr() {
+            match cursor.curr {
                 // Consume strings as-is
                 b'"' => {
-                    result[cursor.pos] = b' ';
                     cursor.advance();
 
                     while cursor.pos < len {
-                        match cursor.curr() {
+                        match cursor.curr {
                             // Escaped character, skip ahead to the next character
                             b'\\' => cursor.advance_twice(),
 
                             // End of the string
-                            b'"' => {
-                                result[cursor.pos] = b' ';
-                                break;
-                            }
+                            b'"' => break,
 
                             // Everything else is valid
                             _ => cursor.advance(),
@@ -55,140 +34,20 @@ impl PreProcessor for Clojure {
                     }
                 }
 
-                // Discard line comments until the end of the line.
+                // Consume comments as-is until the end of the line.
                 // Comments start with `;;`
-                b';' if matches!(cursor.next(), b';') => {
-                    while cursor.pos < len && cursor.curr() != b'\n' {
-                        result[cursor.pos] = b' ';
+                b';' if matches!(cursor.next, b';') => {
+                    while cursor.pos < len && cursor.curr != b'\n' {
                         cursor.advance();
                     }
                 }
 
-                // Consume keyword until a terminating character is reached.
-                b':' => {
-                    result[cursor.pos] = b' ';
-                    cursor.advance();
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // A `.` surrounded by digits is a decimal number, so we don't want to replace it.
-                            //
-                            // E.g.:
-                            // ```
-                            // gap-1.5
-                            //      ^
-                            // ```
-                            b'.' if cursor.prev().is_ascii_digit()
-                                && cursor.next().is_ascii_digit() =>
-                            {
-                                // Keep the `.` as-is
-                            }
-                            // A `.` not surrounded by digits denotes the start of a new class name in a
-                            // dot-delimited keyword.
-                            //
-                            // E.g.:
-                            // ```
-                            // flex.gap-1.5
-                            //     ^
-                            // ```
-                            b'.' => {
-                                result[cursor.pos] = b' ';
-                            }
-                            // End of keyword.
-                            _ if !is_keyword_character(cursor.curr()) => {
-                                result[cursor.pos] = b' ';
-                                break;
-                            }
-
-                            // Consume everything else.
-                            _ => {}
-                        };
-
-                        cursor.advance();
-                    }
-                }
-
-                // Handle quote with a list, e.g.: `'(…)`
-                // and with a vector, e.g.: `'[…]`
-                b'\'' if matches!(cursor.next(), b'[' | b'(') => {
-                    result[cursor.pos] = b' ';
-                    cursor.advance();
-                    result[cursor.pos] = b' ';
-                    let end = match cursor.curr() {
-                        b'[' => b']',
-                        b'(' => b')',
-                        _ => unreachable!(),
-                    };
-
-                    // Consume until the closing `]`
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            x if x == end => {
-                                result[cursor.pos] = b' ';
-                                break;
-                            }
-
-                            // Consume strings as-is
-                            b'"' => {
-                                result[cursor.pos] = b' ';
-                                cursor.advance();
-
-                                while cursor.pos < len {
-                                    match cursor.curr() {
-                                        // Escaped character, skip ahead to the next character
-                                        b'\\' => cursor.advance_twice(),
-
-                                        // End of the string
-                                        b'"' => {
-                                            result[cursor.pos] = b' ';
-                                            break;
-                                        }
-
-                                        // Everything else is valid
-                                        _ => cursor.advance(),
-                                    };
-                                }
-                            }
-                            _ => {}
-                        };
-
-                        cursor.advance();
-                    }
-                }
-
-                // Handle quote with a keyword, e.g.: `'bg-white`
-                b'\'' if !cursor.next().is_ascii_whitespace() => {
-                    result[cursor.pos] = b' ';
-                    cursor.advance();
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // End of keyword.
-                            _ if !is_keyword_character(cursor.curr()) => {
-                                result[cursor.pos] = b' ';
-                                break;
-                            }
-
-                            // Consume everything else.
-                            _ => {}
-                        };
-
-                        cursor.advance();
-                    }
-                }
-
-                // Aggressively discard everything else, reducing false positives and preventing
-                // characters surrounding keywords from producing false negatives.
-                // E.g.:
-                // ```
-                // (when condition :bg-white)
-                //                          ^
-                // ```
-                // A ')' is never a valid part of a keyword, but will nonetheless prevent 'bg-white'
-                // from being extracted if not discarded.
-                _ => {
+                b':' | b'.' => {
                     result[cursor.pos] = b' ';
                 }
+
+                // Consume everything else
+                _ => {}
             };
 
             cursor.advance();
@@ -209,23 +68,19 @@ mod tests {
             (":div.flex-1.flex-2", " div flex-1 flex-2"),
             (
                 ":.flex-3.flex-4 ;defaults to div",
-                "  flex-3 flex-4                 ",
+                "  flex-3 flex-4 ;defaults to div",
             ),
-            ("{:class :flex-5.flex-6", "         flex-5 flex-6"),
-            (r#"{:class "flex-7 flex-8"}"#, r#"         flex-7 flex-8  "#),
+            ("{:class :flex-5.flex-6", "{        flex-5 flex-6"),
+            (r#"{:class "flex-7 flex-8"}"#, r#"{       "flex-7 flex-8"}"#),
             (
                 r#"{:class  ["flex-9" :flex-10]}"#,
-                r#"           flex-9   flex-10  "#,
+                r#"{        ["flex-9"  flex-10]}"#,
             ),
             (
                 r#"(dom/div {:class "flex-11 flex-12"})"#,
-                r#"                  flex-11 flex-12   "#,
-            ),
-            ("(dom/div :.flex-13.flex-14", "           flex-13 flex-14"),
-            (
-                r#"[:div#hello.bg-white.pr-1.5 {:class ["grid grid-cols-[auto,1fr] grid-rows-2"]}]"#,
-                r#"  div#hello bg-white pr-1.5           grid grid-cols-[auto,1fr] grid-rows-2    "#,
+                r#"(dom/div {       "flex-11 flex-12"})"#,
             ),
+            ("(dom/div :.flex-13.flex-14", "(dom/div   flex-13 flex-14"),
         ] {
             Clojure::test(input, expected);
         }
@@ -301,136 +156,4 @@ mod tests {
 
         Clojure::test_extract_contains(input, vec!["hover:flex", "px-1.5"]);
     }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17760
-    #[test]
-    fn test_extraction_of_classes_with_dots() {
-        let input = r#"
-            ($ :div {:class [:flex :gap-1.5 :p-1]} …)
-        "#;
-
-        Clojure::test_extract_contains(input, vec!["flex", "gap-1.5", "p-1"]);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/18336
-    #[test]
-    fn test_extraction_of_pseudoclasses_from_keywords() {
-        let input = r#"
-            ($ :div {:class [:flex :first:lg:pr-6 :first:2xl:pl-6 :group-hover/2:2xs:pt-6]} …)
-
-            :.hover:bg-white
-
-            [:div#hello.bg-white.pr-1.5]
-        "#;
-
-        Clojure::test_extract_contains(
-            input,
-            vec![
-                "flex",
-                "first:lg:pr-6",
-                "first:2xl:pl-6",
-                "group-hover/2:2xs:pt-6",
-                "hover:bg-white",
-                "bg-white",
-                "pr-1.5",
-            ],
-        );
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/18344
-    #[test]
-    fn test_noninterference_of_parens_on_keywords() {
-        let input = r#"
-            (get props :y-padding :py-5)
-            ($ :div {:class [:flex.pr-1.5 (if condition :bg-white :bg-black)]})
-        "#;
-
-        Clojure::test_extract_contains(
-            input,
-            vec!["py-5", "flex", "pr-1.5", "bg-white", "bg-black"],
-        );
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/18882
-    #[test]
-    fn test_extract_from_symbol_list() {
-        let input = r#"
-            [:div {:class '[z-1 z-2
-                            z-3 z-4]}]
-        "#;
-        Clojure::test_extract_contains(input, vec!["z-1", "z-2", "z-3", "z-4"]);
-
-        // https://github.com/tailwindlabs/tailwindcss/pull/18345#issuecomment-3253403847
-        let input = r#"
-            (def hl-class-names '[ring ring-blue-500])
-
-            [:div
-             {:class (cond-> '[input w-full]
-                       textarea? (conj 'textarea)
-                       (seq errors) (concat '[border-red-500 bg-red-100])
-                       highlight? (concat hl-class-names))}]
-        "#;
-        Clojure::test_extract_contains(
-            input,
-            vec![
-                "ring",
-                "ring-blue-500",
-                "input",
-                "w-full",
-                "textarea",
-                "border-red-500",
-                "bg-red-100",
-            ],
-        );
-
-        let input = r#"
-          [:div
-            {:class '[h-100 lg:h-200 max-w-32 mx-auto py-60
-                      flex flex-col justify-end items-center
-                      lg:flex-row lg:justify-between
-                      bg-cover bg-center bg-no-repeat rounded-3xl overflow-hidden
-                      font-semibold text-gray-900]}]
-        "#;
-        Clojure::test_extract_contains(
-            input,
-            vec![
-                "h-100",
-                "lg:h-200",
-                "max-w-32",
-                "mx-auto",
-                "py-60",
-                "flex",
-                "flex-col",
-                "justify-end",
-                "items-center",
-                "lg:flex-row",
-                "lg:justify-between",
-                "bg-cover",
-                "bg-center",
-                "bg-no-repeat",
-                "rounded-3xl",
-                "overflow-hidden",
-                "font-semibold",
-                "text-gray-900",
-            ],
-        );
-
-        // `/` is invalid and requires explicit quoting
-        let input = r#"
-            '[p-32 "text-black/50"]
-        "#;
-        Clojure::test_extract_contains(input, vec!["p-32", "text-black/50"]);
-
-        // `[…]` is invalid and requires explicit quoting
-        let input = r#"
-            (print '[ring ring-blue-500 "bg-[#0088cc]"])
-        "#;
-        Clojure::test_extract_contains(input, vec!["ring", "ring-blue-500", "bg-[#0088cc]"]);
-
-        // `'(…)` looks similar to `[…]` but uses parentheses instead of brackets
-        let input = r#"
-            (print '(ring ring-blue-500 "bg-[#0088cc]"))
-        "#;
-        Clojure::test_extract_contains(input, vec!["ring", "ring-blue-500", "bg-[#0088cc]"]);
-    }
 }
diff --git a/crates/oxide/src/extractor/pre_processors/elixir.rs b/crates/oxide/src/extractor/pre_processors/elixir.rs
deleted file mode 100644
index 7737a6b2d..000000000
--- a/crates/oxide/src/extractor/pre_processors/elixir.rs
+++ /dev/null
@@ -1,154 +0,0 @@
-use crate::cursor;
-use crate::extractor::bracket_stack::BracketStack;
-use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-#[derive(Debug, Default)]
-pub struct Elixir;
-
-impl PreProcessor for Elixir {
-    fn process(&self, content: &[u8]) -> Vec<u8> {
-        let mut cursor = cursor::Cursor::new(content);
-        let mut result = content.to_vec();
-        let mut bracket_stack = BracketStack::default();
-
-        while cursor.pos < content.len() {
-            // Look for a sigil marker
-            if cursor.curr() != b'~' {
-                cursor.advance();
-                continue;
-            }
-
-            // Scan charlists, strings, and wordlists
-            if !matches!(cursor.next(), b'c' | b'C' | b's' | b'S' | b'w' | b'W') {
-                cursor.advance();
-                continue;
-            }
-
-            cursor.advance_twice();
-
-            // Match the opening for a sigil
-            if !matches!(cursor.curr(), b'(' | b'[' | b'{') {
-                continue;
-            }
-
-            // Replace the opening bracket with a space
-            result[cursor.pos] = b' ';
-
-            // Scan until we find a balanced closing one and replace it too
-            bracket_stack.push(cursor.curr());
-
-            while cursor.pos < content.len() {
-                cursor.advance();
-
-                match cursor.curr() {
-                    // Escaped character, skip ahead to the next character
-                    b'\\' => cursor.advance_twice(),
-                    b'(' | b'[' | b'{' => {
-                        bracket_stack.push(cursor.curr());
-                    }
-                    b')' | b']' | b'}' if !bracket_stack.is_empty() => {
-                        bracket_stack.pop(cursor.curr());
-
-                        if bracket_stack.is_empty() {
-                            // Replace the closing bracket with a space
-                            result[cursor.pos] = b' ';
-                            break;
-                        }
-                    }
-                    _ => {}
-                }
-            }
-        }
-
-        result
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::Elixir;
-    use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-    #[test]
-    fn test_elixir_pre_processor() {
-        for (input, expected) in [
-            // Simple sigils
-            ("~W(flex underline)", "~W flex underline "),
-            ("~W[flex underline]", "~W flex underline "),
-            ("~W{flex underline}", "~W flex underline "),
-            // Sigils with nested brackets
-            (
-                "~W(text-(--my-color) bg-(--my-color))",
-                "~W text-(--my-color) bg-(--my-color) ",
-            ),
-            ("~W[text-[red] bg-[red]]", "~W text-[red] bg-[red] "),
-            // Word sigils with modifiers
-            ("~W(flex underline)a", "~W flex underline a"),
-            ("~W(flex underline)c", "~W flex underline c"),
-            ("~W(flex underline)s", "~W flex underline s"),
-            // Other sigil types
-            ("~w(flex underline)", "~w flex underline "),
-            ("~c(flex underline)", "~c flex underline "),
-            ("~C(flex underline)", "~C flex underline "),
-            ("~s(flex underline)", "~s flex underline "),
-            ("~S(flex underline)", "~S flex underline "),
-        ] {
-            Elixir::test(input, expected);
-        }
-    }
-
-    #[test]
-    fn test_extract_candidates() {
-        let input = r#"
-          ~W(c1 c2)
-          ~W[c3 c4]
-          ~W{c5 c6}
-          ~W(text-(--c7) bg-(--c8))
-          ~W[text-[c9] bg-[c10]]
-          ~W(c13 c14)a
-          ~W(c15 c16)c
-          ~W(c17 c18)s
-          ~w(c19 c20)
-          ~c(c21 c22)
-          ~C(c23 c24)
-          ~s(c25 c26)
-          ~S(c27 c28)
-          ~W"c29 c30"
-          ~W'c31 c32'
-        "#;
-
-        Elixir::test_extract_contains(
-            input,
-            vec![
-                "c1",
-                "c2",
-                "c3",
-                "c4",
-                "c5",
-                "c6",
-                "text-(--c7)",
-                "bg-(--c8)",
-                "c13",
-                "c14",
-                "c15",
-                "c16",
-                "c17",
-                "c18",
-                "c19",
-                "c20",
-                "c21",
-                "c22",
-                "c23",
-                "c24",
-                "c25",
-                "c26",
-                "c27",
-                "c28",
-                "c29",
-                "c30",
-                "c31",
-                "c32",
-            ],
-        );
-    }
-}
diff --git a/crates/oxide/src/extractor/pre_processors/haml.rs b/crates/oxide/src/extractor/pre_processors/haml.rs
index ec8be0817..37cb19054 100644
--- a/crates/oxide/src/extractor/pre_processors/haml.rs
+++ b/crates/oxide/src/extractor/pre_processors/haml.rs
@@ -3,8 +3,6 @@ use crate::extractor::bracket_stack::BracketStack;
 use crate::extractor::machine::{Machine, MachineState};
 use crate::extractor::pre_processors::pre_processor::PreProcessor;
 use crate::extractor::variant_machine::VariantMachine;
-use crate::scanner::pre_process_input;
-use bstr::ByteVec;
 
 #[derive(Debug, Default)]
 pub struct Haml;
@@ -16,153 +14,8 @@ impl PreProcessor for Haml {
         let mut cursor = cursor::Cursor::new(content);
         let mut bracket_stack = BracketStack::default();
 
-        // Haml Comments: -#
-        // https://haml.info/docs/yardoc/file.REFERENCE.html#ruby-evaluation
-        //
-        // > The hyphen followed immediately by the pound sign signifies a silent comment. Any text
-        // > following this isn’t rendered in the resulting document at all.
-        //
-        // ```haml
-        // %p foo
-        // -# This is a comment
-        // %p bar
-        // ```
-        //
-        // > You can also nest text beneath a silent comment. None of this text will be rendered.
-        //
-        // ```haml
-        // %p foo
-        // -#
-        //   This won't be displayed
-        //     Nor will this
-        //                    Nor will this.
-        // %p bar
-        // ```
-        //
-        // Ruby Evaluation
-        // https://haml.info/docs/yardoc/file.REFERENCE.html#ruby-evaluation
-        //
-        // When any of the following characters are the first non-whitespace character on the line,
-        // then the line is treated as Ruby code:
-        //
-        // - Inserting Ruby: =
-        //   https://haml.info/docs/yardoc/file.REFERENCE.html#inserting_ruby
-        //
-        //   ```haml
-        //   %p
-        //     = ['hi', 'there', 'reader!'].join " "
-        //     = "yo"
-        //   ```
-        //
-        // - Running Ruby: -
-        //   https://haml.info/docs/yardoc/file.REFERENCE.html#running-ruby--
-        //
-        //   ```haml
-        //   - foo = "hello"
-        //   - foo << " there"
-        //   - foo << " you!"
-        //   %p= foo
-        //   ```
-        //
-        // - Whitespace Preservation: ~
-        //   https://haml.info/docs/yardoc/file.REFERENCE.html#tilde
-        //
-        //   > ~ works just like =, except that it runs Haml::Helpers.preserve on its input.
-        //
-        //   ```haml
-        //   ~ "Foo\n<pre>Bar\nBaz</pre>"
-        //   ```
-        //
-        // Important note:
-        //
-        // > A line of Ruby code can be stretched over multiple lines as long as each line but the
-        // > last ends with a comma.
-        //
-        // ```haml
-        // - links = {:home => "/",
-        //   :docs => "/docs",
-        //   :about => "/about"}
-        // ```
-        //
-        // Ruby Blocks:
-        // https://haml.info/docs/yardoc/file.REFERENCE.html#ruby-blocks
-        //
-        // > Ruby blocks, like XHTML tags, don’t need to be explicitly closed in Haml. Rather,
-        // > they’re automatically closed, based on indentation. A block begins whenever the
-        // > indentation is increased after a Ruby evaluation command. It ends when the indentation
-        // > decreases (as long as it’s not an else clause or something similar).
-        //
-        // ```haml
-        // - (42...47).each do |i|
-        //   %p= i
-        // %p See, I can count!
-        // ```
-        //
-        let mut last_newline_position = 0;
-
         while cursor.pos < len {
-            match cursor.curr() {
-                // Escape the next character
-                b'\\' => {
-                    cursor.advance_twice();
-                    continue;
-                }
-
-                // Track the last newline position
-                b'\n' => {
-                    last_newline_position = cursor.pos;
-                    cursor.advance();
-                    continue;
-                }
-
-                // Skip HAML comments. `-#`
-                b'-' if cursor.input[last_newline_position..cursor.pos]
-                    .iter()
-                    .all(u8::is_ascii_whitespace)
-                    && matches!(cursor.next(), b'#') =>
-                {
-                    // Just consume the comment
-                    let updated_last_newline_position =
-                        self.skip_indented_block(&mut cursor, last_newline_position);
-
-                    // Override the last known newline position
-                    last_newline_position = updated_last_newline_position;
-                }
-
-                // Skip HTML comments. `/`
-                b'/' if cursor.input[last_newline_position..cursor.pos]
-                    .iter()
-                    .all(u8::is_ascii_whitespace) =>
-                {
-                    // Just consume the comment
-                    let updated_last_newline_position =
-                        self.skip_indented_block(&mut cursor, last_newline_position);
-
-                    // Override the last known newline position
-                    last_newline_position = updated_last_newline_position;
-                }
-
-                // Ruby evaluation
-                b'-' | b'=' | b'~'
-                    if cursor.input[last_newline_position..cursor.pos]
-                        .iter()
-                        .all(u8::is_ascii_whitespace) =>
-                {
-                    let mut start = cursor.pos;
-                    let end = self.skip_indented_block(&mut cursor, last_newline_position);
-
-                    // Increment start with 1 character to skip the `=` or `-` character
-                    start += 1;
-
-                    let ruby_code = &cursor.input[start..end];
-
-                    // Override the last known newline position
-                    last_newline_position = end;
-
-                    let replaced = pre_process_input(ruby_code.to_vec(), "rb");
-                    result.replace_range(start..end, replaced);
-                }
-
+            match cursor.curr {
                 // Only replace `.` with a space if it's not surrounded by numbers. E.g.:
                 //
                 // ```diff
@@ -190,7 +43,7 @@ impl PreProcessor for Haml {
                     // digit.
                     // E.g.: `bg-red-500.2xl:flex`
                     //                 ^^^
-                    if cursor.prev().is_ascii_digit() && cursor.next().is_ascii_digit() {
+                    if cursor.prev.is_ascii_digit() && cursor.next.is_ascii_digit() {
                         let mut next_cursor = cursor.clone();
                         next_cursor.advance();
 
@@ -203,81 +56,6 @@ impl PreProcessor for Haml {
                     }
                 }
 
-                // Handle Ruby syntax with `%w[]` arrays embedded in Haml attribute hashes. E.g.:
-                //
-                // ```haml
-                // %div{class: %w[bg-blue-500 w-10 h-10]}
-                // ```
-                //
-                // A `%` that follows a value is not a percent literal. E.g.: the `50%w` in
-                // `hit rate 50%w.`
-                b'%' if matches!(cursor.next(), b'w' | b'W')
-                    && !cursor.prev().is_ascii_alphanumeric()
-                    && !matches!(cursor.prev(), b'_' | b')' | b']' | b'}') =>
-                {
-                    // Boundary characters
-                    let (open, close) = match cursor.input.get(cursor.pos + 2) {
-                        Some(b'[') => (b'[', b']'),
-                        Some(b'(') => (b'(', b')'),
-                        Some(b'{') => (b'{', b'}'),
-                        Some(b'<') => (b'<', b'>'),
-
-                        // Any other ASCII punctuation can be used as a custom delimiter
-                        Some(&c) if c.is_ascii_punctuation() => (c, c),
-
-                        // Everything else is not a valid delimiter
-                        _ => {
-                            cursor.advance();
-                            continue;
-                        }
-                    };
-
-                    result[cursor.pos] = b' '; // Replace `%`
-                    cursor.advance();
-                    result[cursor.pos] = b' '; // Replace `w`
-                    cursor.advance();
-                    result[cursor.pos] = b' '; // Replace the opening delimiter
-                    cursor.advance();
-
-                    // Paired delimiters can be nested as long as they are balanced. E.g.:
-                    // `%w[foo[bar]baz]` produces a flat array.
-                    let mut depth = 1_usize;
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // Skip escaped characters, unless the backslash is the delimiter
-                            // itself
-                            b'\\' if close != b'\\' => {
-                                // Use backslash to embed spaces in the strings.
-                                if cursor.next() == b' ' {
-                                    result[cursor.pos] = b' ';
-                                }
-
-                                cursor.advance();
-                            }
-
-                            // Start of a nested delimiter pair
-                            c if c == open && open != close => depth += 1,
-
-                            // Closing delimiter
-                            c if c == close => {
-                                depth -= 1;
-
-                                // End of the literal, replace the closing delimiter with a space
-                                if depth == 0 {
-                                    result[cursor.pos] = b' ';
-                                    break;
-                                }
-                            }
-
-                            // Everything else is valid content
-                            _ => {}
-                        }
-
-                        cursor.advance();
-                    }
-                }
-
                 // Replace following characters with spaces if they are not inside of brackets
                 b'#' | b'=' if bracket_stack.is_empty() => {
                     result[cursor.pos] = b' ';
@@ -288,11 +66,11 @@ impl PreProcessor for Haml {
                     if bracket_stack.is_empty() {
                         result[cursor.pos] = b' ';
                     }
-                    bracket_stack.push(cursor.curr());
+                    bracket_stack.push(cursor.curr);
                 }
 
                 b')' | b']' | b'}' if !bracket_stack.is_empty() => {
-                    bracket_stack.pop(cursor.curr());
+                    bracket_stack.pop(cursor.curr);
 
                     // Replace closing bracket with a space
                     if bracket_stack.is_empty() {
@@ -311,117 +89,10 @@ impl PreProcessor for Haml {
     }
 }
 
-impl Haml {
-    fn skip_indented_block(
-        &self,
-        cursor: &mut cursor::Cursor,
-        last_known_newline_position: usize,
-    ) -> usize {
-        let len = cursor.input.len();
-
-        // Special case: if the first character of the block is `=`, then newlines are only allowed
-        // _if_ the last character of the previous line is a comma `,`.
-        //
-        // https://haml.info/docs/yardoc/file.REFERENCE.html#inserting_ruby
-        //
-        // > A line of Ruby code can be stretched over multiple lines as long as each line but the
-        // > last ends with a comma. For example:
-        //
-        // ```haml
-        // = link_to_remote "Add to cart",
-        //     :url => { :action => "add", :id => product.id },
-        //     :update => { :success => "cart", :failure => "error" }
-        // ```
-        let evaluation_type = cursor.curr();
-
-        let block_indentation_level = cursor
-            .pos
-            .saturating_sub(last_known_newline_position)
-            .saturating_sub(1); /* The newline itself */
-
-        let mut last_newline_position = last_known_newline_position;
-
-        // Consume until the end of the line first
-        while cursor.pos < len && cursor.curr() != b'\n' {
-            cursor.advance();
-        }
-
-        // Block is already done, aka just a line
-        if evaluation_type == b'=' && cursor.prev() != b',' {
-            return cursor.pos;
-        }
-
-        'outer: while cursor.pos < len {
-            match cursor.curr() {
-                // Escape the next character
-                b'\\' => {
-                    cursor.advance_twice();
-                    continue;
-                }
-
-                // Track the last newline position
-                b'\n' => {
-                    last_newline_position = cursor.pos;
-
-                    // We are done with this block
-                    if evaluation_type == b'=' && cursor.prev() != b',' {
-                        break;
-                    }
-
-                    cursor.advance();
-                    continue;
-                }
-
-                // Skip whitespace and compute the indentation level
-                x if x.is_ascii_whitespace() => {
-                    // Find first non-whitespace character
-                    while cursor.pos < len && cursor.curr().is_ascii_whitespace() {
-                        if cursor.curr() == b'\n' {
-                            last_newline_position = cursor.pos;
-
-                            if evaluation_type == b'=' && cursor.prev() != b',' {
-                                // We are done with this block
-                                break 'outer;
-                            }
-                        }
-
-                        cursor.advance();
-                    }
-
-                    let indentation = cursor
-                        .pos
-                        .saturating_sub(last_newline_position)
-                        .saturating_sub(1); /* The newline itself */
-                    if indentation < block_indentation_level {
-                        // We are done with this block
-                        break;
-                    }
-                }
-
-                // Not whitespace, end of block
-                _ => break,
-            };
-
-            cursor.advance();
-        }
-
-        // We didn't find a newline, we reached the end of the input
-        if last_known_newline_position == last_newline_position {
-            return cursor.pos;
-        }
-
-        // Move the cursor to the last newline position
-        cursor.move_to(last_newline_position);
-
-        last_newline_position
-    }
-}
-
 #[cfg(test)]
 mod tests {
     use super::Haml;
     use crate::extractor::pre_processors::pre_processor::PreProcessor;
-    use pretty_assertions::assert_eq;
 
     #[test]
     fn test_haml_pre_processor() {
@@ -499,97 +170,14 @@ mod tests {
         );
     }
 
-    // https://github.com/tailwindlabs/tailwindcss/issues/20386
-    #[test]
-    fn test_embedded_ruby_percent_w_delimiters() {
-        for (input, expected) in [
-            // %w[…] in an attribute hash
-            (
-                "%div{class: %w[flex px-2.5]}",
-                "%div class:    flex px-2.5  ",
-            ),
-            // %w<…>
-            (
-                "%div{class: %w<flex px-2.5>}",
-                "%div class:    flex px-2.5  ",
-            ),
-            // Nested `<…>` does not end the literal
-            (
-                "%div{class: %w<flex <nested> px-2.5>}",
-                "%div class:    flex <nested> px-2.5  ",
-            ),
-            // Custom delimiters
-            (
-                "%div{class: %w|flex px-2.5|}",
-                "%div class:    flex px-2.5  ",
-            ),
-            (
-                "%div{class: %W!flex px-2.5!}",
-                "%div class:    flex px-2.5  ",
-            ),
-            (
-                "%div{class: %w#text-sm leading-6#}",
-                "%div class:    text-sm leading-6  ",
-            ),
-            (
-                "%div{class: %w=italic tracking-wide=}",
-                "%div class:    italic tracking-wide  ",
-            ),
-            // Nested paired delimiters stay balanced inside the literal
-            (
-                "%div{class: %w[content-['[hello]'] p-4]}",
-                "%div class:    content-['[hello]'] p-4  ",
-            ),
-            // Escaped spaces embed a space in a single array element
-            (
-                r#"%div{class: %w[foo\ bar baz-1]}"#,
-                r#"%div class:    foo  bar baz-1  "#,
-            ),
-            // A `%` that follows a value is not a percent literal
-            ("%p hit rate 50%w.", "%p hit rate 50%w "),
-        ] {
-            Haml::test(input, expected);
-        }
-
-        let input = r#"
-            %div{class: %w[bg-blue-500 w-10 h-10]}
-            %div{class: %w<flex px-2.5>}
-            %div{class: %w|underline font-bold|}
-            - classes = %w<mt-4 grid>
-        "#;
-
-        Haml::test_extract_contains(
-            input,
-            vec![
-                "bg-blue-500",
-                "w-10",
-                "h-10",
-                "flex",
-                "px-2.5",
-                "underline",
-                "font-bold",
-                "mt-4",
-                "grid",
-            ],
-        );
-    }
-
     // https://github.com/tailwindlabs/tailwindcss/pull/17051#issuecomment-2711181352
     #[test]
-    fn test_haml_full_file_17051() {
-        let actual = Haml::extract_annotated(include_bytes!("./test-fixtures/haml/src-17051.haml"));
-        let expected = include_str!("./test-fixtures/haml/dst-17051.haml");
+    fn test_haml_full_file() {
+        let processed = Haml.process(include_bytes!("./test-fixtures/haml/src-1.haml"));
+        let actual = std::str::from_utf8(&processed).unwrap();
+        let expected = include_str!("./test-fixtures/haml/dst-1.haml");
 
-        assert_eq!(actual.replace("\r\n", "\n"), expected.replace("\r\n", "\n"));
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17813
-    #[test]
-    fn test_haml_full_file_17813() {
-        let actual = Haml::extract_annotated(include_bytes!("./test-fixtures/haml/src-17813.haml"));
-        let expected = include_str!("./test-fixtures/haml/dst-17813.haml");
-
-        assert_eq!(actual.replace("\r\n", "\n"), expected.replace("\r\n", "\n"));
+        assert_eq!(actual, expected);
     }
 
     #[test]
@@ -601,16 +189,4 @@ mod tests {
         "#;
         Haml::test_extract_contains(input, vec!["flex", "items-center"]);
     }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17379#issuecomment-2910108646
-    #[test]
-    fn test_crash_missing_newline() {
-        // The empty `""` will introduce a newline
-        let good = ["- index = 0", "- index += 1", ""].join("\n");
-        Haml::test_extract_contains(&good, vec!["index"]);
-
-        // This used to crash before the fix
-        let bad = ["- index = 0", "- index += 1"].join("\n");
-        Haml::test_extract_contains(&bad, vec!["index"]);
-    }
 }
diff --git a/crates/oxide/src/extractor/pre_processors/json.rs b/crates/oxide/src/extractor/pre_processors/json.rs
index cd457050c..809eb501e 100644
--- a/crates/oxide/src/extractor/pre_processors/json.rs
+++ b/crates/oxide/src/extractor/pre_processors/json.rs
@@ -11,13 +11,13 @@ impl PreProcessor for Json {
         let mut cursor = cursor::Cursor::new(content);
 
         while cursor.pos < len {
-            match cursor.curr() {
+            match cursor.curr {
                 // Consume strings as-is
                 b'"' => {
                     cursor.advance();
 
                     while cursor.pos < len {
-                        match cursor.curr() {
+                        match cursor.curr {
                             // Escaped character, skip ahead to the next character
                             b'\\' => cursor.advance_twice(),
 
diff --git a/crates/oxide/src/extractor/pre_processors/markdown.rs b/crates/oxide/src/extractor/pre_processors/markdown.rs
deleted file mode 100644
index 488614ee5..000000000
--- a/crates/oxide/src/extractor/pre_processors/markdown.rs
+++ /dev/null
@@ -1,83 +0,0 @@
-use crate::cursor;
-use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-#[derive(Debug, Default)]
-pub struct Markdown;
-
-impl PreProcessor for Markdown {
-    fn process(&self, content: &[u8]) -> Vec<u8> {
-        let len = content.len();
-        let mut result = content.to_vec();
-        let mut cursor = cursor::Cursor::new(content);
-        let mut bracket_stack = vec![];
-
-        let mut in_directive = false;
-
-        while cursor.pos < len {
-            match (in_directive, cursor.curr()) {
-                (false, b'{') => {
-                    result[cursor.pos] = b' ';
-                    in_directive = true;
-                }
-                (true, b'(' | b'[' | b'{' | b'<') => {
-                    bracket_stack.push(cursor.curr());
-                }
-                (true, b')' | b']' | b'}' | b'>') if !bracket_stack.is_empty() => {
-                    bracket_stack.pop();
-                }
-                (true, b'}') => {
-                    result[cursor.pos] = b' ';
-                    in_directive = false;
-                }
-                (true, b'.') if bracket_stack.is_empty() => {
-                    result[cursor.pos] = b' ';
-                }
-                _ => {}
-            }
-
-            cursor.advance();
-        }
-
-        result
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::Markdown;
-    use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-    #[test]
-    fn test_markdown_pre_processor() {
-        for (input, expected) in [
-            // Convert dots to spaces inside markdown inline directives
-            (
-                ":span[Some Text]{.text-gray-500}",
-                ":span[Some Text]  text-gray-500 ",
-            ),
-            (
-                ":span[Some Text]{.text-gray-500.bg-red-500}",
-                ":span[Some Text]  text-gray-500 bg-red-500 ",
-            ),
-            (
-                ":span[Some Text]{#myId .my-class key=val key2='val 2'}",
-                ":span[Some Text] #myId  my-class key=val key2='val 2' ",
-            ),
-        ] {
-            Markdown::test(input, expected);
-        }
-    }
-
-    #[test]
-    fn test_nested_classes_keep_the_dots() {
-        for (input, expected) in [
-            (
-                r#"{<div class="px-2.5"></div>}"#,
-                r#" <div class="px-2.5"></div> "#,
-            ),
-            (r#"{content-['example.js']}"#, r#" content-['example.js'] "#),
-        ] {
-            Markdown::test(input, expected);
-        }
-    }
-}
diff --git a/crates/oxide/src/extractor/pre_processors/mod.rs b/crates/oxide/src/extractor/pre_processors/mod.rs
index 1a04af5c9..4609f10b9 100644
--- a/crates/oxide/src/extractor/pre_processors/mod.rs
+++ b/crates/oxide/src/extractor/pre_processors/mod.rs
@@ -1,31 +1,21 @@
 pub mod clojure;
-pub mod elixir;
 pub mod haml;
 pub mod json;
-pub mod markdown;
 pub mod pre_processor;
 pub mod pug;
 pub mod razor;
 pub mod ruby;
-pub mod rust;
 pub mod slim;
 pub mod svelte;
-pub mod template_toolkit;
-pub mod twig;
 pub mod vue;
 
 pub use clojure::*;
-pub use elixir::*;
 pub use haml::*;
 pub use json::*;
-pub use markdown::*;
 pub use pre_processor::*;
 pub use pug::*;
 pub use razor::*;
 pub use ruby::*;
-pub use rust::*;
 pub use slim::*;
 pub use svelte::*;
-pub use template_toolkit::*;
-pub use twig::*;
 pub use vue::*;
diff --git a/crates/oxide/src/extractor/pre_processors/pre_processor.rs b/crates/oxide/src/extractor/pre_processors/pre_processor.rs
index 8e02b8f69..8c807c8c3 100644
--- a/crates/oxide/src/extractor/pre_processors/pre_processor.rs
+++ b/crates/oxide/src/extractor/pre_processors/pre_processor.rs
@@ -3,8 +3,6 @@ pub trait PreProcessor: Sized + Default {
 
     #[cfg(test)]
     fn test(input: &str, expected: &str) {
-        use pretty_assertions::assert_eq;
-
         let input = input.as_bytes();
         let expected = expected.as_bytes();
 
@@ -17,6 +15,10 @@ pub trait PreProcessor: Sized + Default {
         let actual = String::from_utf8_lossy(&actual);
         let expected = String::from_utf8_lossy(expected);
 
+        if actual != expected {
+            dbg!((&input, &actual, &expected));
+        }
+
         // The input and output should have the exact same length.
         assert_eq!(input.len(), actual.len());
         assert_eq!(actual.len(), expected.len());
@@ -25,33 +27,7 @@ pub trait PreProcessor: Sized + Default {
     }
 
     #[cfg(test)]
-    fn test_extract_exact(input: &str, expected: Vec<&str>) {
-        use crate::extractor::{Extracted, Extractor};
-
-        let input = input.as_bytes();
-
-        let processor = Self::default();
-        let transformed = processor.process(input);
-
-        let extracted = Extractor::new(&transformed).extract();
-
-        // Extract all candidates and css variables.
-        let candidates = extracted
-            .iter()
-            .filter_map(|x| match x {
-                Extracted::Candidate(bytes) => std::str::from_utf8(bytes).ok(),
-                Extracted::CssVariable(bytes) => std::str::from_utf8(bytes).ok(),
-            })
-            .collect::<Vec<_>>();
-
-        if candidates != expected {
-            dbg!(&candidates, &expected);
-            panic!("Extracted candidates do not match expected candidates");
-        }
-    }
-
-    #[cfg(test)]
-    fn test_extract_contains(input: &str, expected: Vec<&str>) {
+    fn test_extract_contains(input: &str, items: Vec<&str>) {
         use crate::extractor::{Extracted, Extractor};
 
         let input = input.as_bytes();
@@ -72,7 +48,7 @@ pub trait PreProcessor: Sized + Default {
 
         // Ensure all items are present in the candidates.
         let mut missing = vec![];
-        for item in &expected {
+        for item in &items {
             if !candidates.contains(item) {
                 missing.push(item);
             }
@@ -83,104 +59,4 @@ pub trait PreProcessor: Sized + Default {
             panic!("Missing some items");
         }
     }
-
-    #[cfg(test)]
-    fn extract_annotated(input: &[u8]) -> String {
-        use crate::extractor::{Extracted, Extractor};
-        use std::collections::BTreeMap;
-        use unicode_width::UnicodeWidthStr;
-
-        let processor = Self::default();
-        let transformed = processor.process(input);
-
-        let extracted = Extractor::new(&transformed).extract();
-
-        // Extract only candidate positions
-        let byte_ranges = extracted
-            .iter()
-            .filter_map(|x| match x {
-                Extracted::Candidate(bytes) => {
-                    let start = bytes.as_ptr() as usize - transformed.as_ptr() as usize;
-                    let end = start + bytes.len();
-                    Some((start, end))
-                }
-                _ => None,
-            })
-            .collect::<Vec<_>>();
-
-        // Convert byte ranges to (line, start_col, end_col)
-        let mut annotations = byte_ranges
-            .into_iter()
-            .map(|(start, end)| {
-                let (line, start_col) = byte_offset_to_line_and_column(input, start);
-                let (_, end_col) = byte_offset_to_line_and_column(input, end);
-                (line, start_col, end_col)
-            })
-            .collect::<Vec<_>>();
-
-        // Sort for safe insertion
-        annotations.sort_by(|a, b| b.0.cmp(&a.0).then(b.1.cmp(&a.1)));
-
-        // Convert input to lines
-        let mut lines = std::str::from_utf8(input)
-            .expect("Input must be valid UTF-8")
-            .lines()
-            .map(|line| line.to_string())
-            .collect::<Vec<_>>();
-
-        // Group annotations per line
-        let mut grouped = BTreeMap::<usize, Vec<(usize, usize)>>::new();
-        for (line, start_char, end_char) in annotations {
-            grouped
-                .entry(line)
-                .or_default()
-                .push((start_char, end_char));
-        }
-
-        // Inject annotation lines
-        for (line_idx, spans) in grouped.into_iter().rev() {
-            let display_line = &lines[line_idx];
-            let width = UnicodeWidthStr::width(display_line.as_str());
-            let mut annotation = vec![' '; width];
-
-            for (start, end) in spans {
-                for i in start..end.min(annotation.len()) {
-                    annotation[i] = '^';
-                }
-            }
-
-            let annotation_line: String = annotation
-                .into_iter()
-                .collect::<String>()
-                .trim_end()
-                .to_owned();
-            lines.insert(line_idx + 1, annotation_line);
-        }
-
-        lines.join("\n").trim_end().to_string() + "\n"
-    }
-}
-
-#[cfg(test)]
-fn byte_offset_to_line_and_column(input: &[u8], offset: usize) -> (usize, usize) {
-    use unicode_width::UnicodeWidthStr;
-
-    let mut line_start = 0;
-    let mut line = 0;
-
-    for (i, &b) in input.iter().enumerate() {
-        if i >= offset {
-            break;
-        }
-        if b == b'\n' {
-            line += 1;
-            line_start = i + 1;
-        }
-    }
-
-    let slice = &input[line_start..offset];
-    let column = std::str::from_utf8(slice).expect("Valid UTF-8");
-    let column = UnicodeWidthStr::width(column);
-
-    (line, column)
 }
diff --git a/crates/oxide/src/extractor/pre_processors/pug.rs b/crates/oxide/src/extractor/pre_processors/pug.rs
index 70dfe5683..7b44fcf5b 100644
--- a/crates/oxide/src/extractor/pre_processors/pug.rs
+++ b/crates/oxide/src/extractor/pre_processors/pug.rs
@@ -15,7 +15,7 @@ impl PreProcessor for Pug {
         let mut bracket_stack = BracketStack::default();
 
         while cursor.pos < len {
-            match cursor.curr() {
+            match cursor.curr {
                 // Only replace `.` with a space if it's not surrounded by numbers. E.g.:
                 //
                 // ```diff
@@ -43,7 +43,7 @@ impl PreProcessor for Pug {
                     // digit.
                     // E.g.: `bg-red-500.2xl:flex`
                     //                 ^^^
-                    if cursor.prev().is_ascii_digit() && cursor.next().is_ascii_digit() {
+                    if cursor.prev.is_ascii_digit() && cursor.next.is_ascii_digit() {
                         let mut next_cursor = cursor.clone();
                         next_cursor.advance();
 
@@ -68,17 +68,17 @@ impl PreProcessor for Pug {
                 //
                 // However, we also need to make sure that we keep the parens that are part of the
                 // utility class. E.g.: `bg-(--my-color)`.
-                b'(' if bracket_stack.is_empty() && !matches!(cursor.prev(), b'-' | b'/') => {
+                b'(' if bracket_stack.is_empty() && !matches!(cursor.prev, b'-' | b'/') => {
                     result[cursor.pos] = b' ';
-                    bracket_stack.push(cursor.curr());
+                    bracket_stack.push(cursor.curr);
                 }
 
                 b'(' | b'[' | b'{' => {
-                    bracket_stack.push(cursor.curr());
+                    bracket_stack.push(cursor.curr);
                 }
 
                 b')' | b']' | b'}' if !bracket_stack.is_empty() => {
-                    bracket_stack.pop(cursor.curr());
+                    bracket_stack.pop(cursor.curr);
                 }
 
                 // Consume everything else
diff --git a/crates/oxide/src/extractor/pre_processors/razor.rs b/crates/oxide/src/extractor/pre_processors/razor.rs
index 2713ea748..d77644b12 100644
--- a/crates/oxide/src/extractor/pre_processors/razor.rs
+++ b/crates/oxide/src/extractor/pre_processors/razor.rs
@@ -6,7 +6,7 @@ pub struct Razor;
 
 impl PreProcessor for Razor {
     fn process(&self, content: &[u8]) -> Vec<u8> {
-        content.replace("@@", " @").replace(r#"@("@")"#, "     @")
+        content.replace("@@", " @")
     }
 }
 
@@ -24,19 +24,4 @@ mod tests {
         Razor::test(input, expected);
         Razor::test_extract_contains(input, vec!["@sm:text-red-500"]);
     }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17424
-    #[test]
-    fn test_razor_syntax_with() {
-        let (input, expected) = (
-            r#"<p class="@("@")md:bg-red-500 @@md:border-green-500 border-8">With 2 elements</p>"#,
-            r#"<p class="     @md:bg-red-500  @md:border-green-500 border-8">With 2 elements</p>"#,
-        );
-
-        Razor::test(input, expected);
-        Razor::test_extract_contains(
-            input,
-            vec!["@md:bg-red-500", "@md:border-green-500", "border-8"],
-        );
-    }
 }
diff --git a/crates/oxide/src/extractor/pre_processors/ruby.rs b/crates/oxide/src/extractor/pre_processors/ruby.rs
index d9a57ab77..edc7be49d 100644
--- a/crates/oxide/src/extractor/pre_processors/ruby.rs
+++ b/crates/oxide/src/extractor/pre_processors/ruby.rs
@@ -3,23 +3,13 @@
 use crate::cursor;
 use crate::extractor::bracket_stack;
 use crate::extractor::pre_processors::pre_processor::PreProcessor;
-use crate::scanner::pre_process_input;
-use bstr::ByteVec;
-use regex::{Regex, RegexBuilder};
+use crate::pre_process_input;
+use bstr::ByteSlice;
+use fancy_regex::Regex;
 use std::sync;
 
-static TEMPLATE_START_REGEX: sync::LazyLock<Regex> = sync::LazyLock::new(|| {
-    RegexBuilder::new(r#"\s*([a-z0-9_-]+)_template\s*<<[-~]?([A-Z]+)$"#)
-        .multi_line(true)
-        .build()
-        .unwrap()
-});
-
-static TEMPLATE_END_REGEX: sync::LazyLock<Regex> = sync::LazyLock::new(|| {
-    RegexBuilder::new(r#"^\s*([A-Z]+)"#)
-        .multi_line(true)
-        .build()
-        .unwrap()
+static TEMPLATE_REGEX: sync::LazyLock<Regex> = sync::LazyLock::new(|| {
+    Regex::new(r#"\s*(.*?)_template\s*<<[-~]?([A-Z]+?)\n([\s\S]*?)\2"#).unwrap()
 });
 
 #[derive(Debug, Default)]
@@ -34,135 +24,21 @@ impl PreProcessor for Ruby {
 
         // Extract embedded template languages
         // https://viewcomponent.org/guide/templates.html#interpolations
-        // Only process if content is valid UTF-8, otherwise skip HEREDOC extraction
-        // but still perform the byte-level Ruby processing below
-        if let Ok(content_as_str) = std::str::from_utf8(content) {
-            let starts = TEMPLATE_START_REGEX
-                .captures_iter(content_as_str)
-                .collect::<Vec<_>>();
-            let ends = TEMPLATE_END_REGEX
-                .captures_iter(content_as_str)
-                .collect::<Vec<_>>();
-
-            for start in starts.iter() {
-                // The language for this block
-                let lang = start.get(1).unwrap().as_str();
-
-                // The HEREDOC delimiter
-                let delimiter_start = start.get(2).unwrap().as_str();
-
-                // Where the "body" starts for the HEREDOC block
-                let body_start = start.get(0).unwrap().end();
-
-                // Look through all of the ends to find a matching language
-                for end in ends.iter() {
-                    // 1. This must appear after the start
-                    let body_end = end.get(0).unwrap().start();
-                    if body_end < body_start {
-                        continue;
-                    }
-
-                    // The languages must match otherwise we haven't found the end
-                    let delimiter_end = end.get(1).unwrap().as_str();
-                    if delimiter_end != delimiter_start {
-                        continue;
-                    }
-
-                    let body = &content_as_str[body_start..body_end];
-                    let replaced =
-                        pre_process_input(body.as_bytes().to_vec(), &lang.to_ascii_lowercase());
-
-                    result.replace_range(body_start..body_end, replaced);
-                    break;
-                }
-            }
+        let content_as_str = std::str::from_utf8(content).unwrap();
+        for capture in TEMPLATE_REGEX
+            .captures_iter(content_as_str)
+            .filter_map(Result::ok)
+        {
+            let lang = capture.get(1).unwrap().as_str();
+            let body = capture.get(3).unwrap().as_str();
+            let replaced = pre_process_input(body.as_bytes(), lang);
+            result = result.replace(body, replaced);
         }
 
         // Ruby extraction
         while cursor.pos < len {
-            match cursor.curr() {
-                b'"' => {
-                    cursor.advance();
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // Escaped character, skip ahead to the next character
-                            b'\\' => cursor.advance_twice(),
-
-                            // End of the string
-                            b'"' => break,
-
-                            // Everything else is valid
-                            _ => cursor.advance(),
-                        };
-                    }
-
-                    cursor.advance();
-                    continue;
-                }
-
-                b'\'' => {
-                    cursor.advance();
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // Escaped character, skip ahead to the next character
-                            b'\\' => cursor.advance_twice(),
-
-                            // End of the string
-                            b'\'' => break,
-
-                            // Everything else is valid
-                            _ => cursor.advance(),
-                        };
-                    }
-
-                    cursor.advance();
-                    continue;
-                }
-
-                // Replace comments in Ruby files
-                //
-                // Except for strict locals, these are defined in a `<%# locals: … %>`. Checking if
-                // the comment is preceded by a `%` should be enough without having to perform more
-                // parsing logic. Worst case we _do_ scan a few comments.
-                //
-                // We also want to skip interpolation syntax, which look like `#{…}`.
-                b'#' if !matches!(cursor.prev(), b'%') && !matches!(cursor.next(), b'{') => {
-                    result[cursor.pos] = b' ';
-                    cursor.advance();
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // End of the comment
-                            b'\n' => break,
-
-                            // Everything else is part of the comment and replaced
-                            _ => {
-                                result[cursor.pos] = b' ';
-                                cursor.advance();
-                            }
-                        };
-                    }
-
-                    cursor.advance();
-                    continue;
-                }
-
-                _ => {}
-            }
-
-            // Looking for `%w`, `%W`, or `%p`
-            if cursor.curr() != b'%' || !matches!(cursor.next(), b'w' | b'W' | b'p') {
-                cursor.advance();
-                continue;
-            }
-
-            // A `%` that follows a value is a modulo operation, not a percent literal. E.g.: the
-            // `50%w` in `hit rate 50%w.`
-            if cursor.prev().is_ascii_alphanumeric()
-                || matches!(cursor.prev(), b'_' | b')' | b']' | b'}')
-            {
+            // Looking for `%w` or `%W`
+            if cursor.curr != b'%' && !matches!(cursor.next, b'w' | b'W') {
                 cursor.advance();
                 continue;
             }
@@ -170,17 +46,10 @@ impl PreProcessor for Ruby {
             cursor.advance_twice();
 
             // Boundary character
-            let boundary = match cursor.curr() {
+            let boundary = match cursor.curr {
                 b'[' => b']',
                 b'(' => b')',
                 b'{' => b'}',
-                b'<' => b'>',
-                b' ' => b'\n',
-
-                // Any other ASCII punctuation can be used as a custom delimiter
-                c if c.is_ascii_punctuation() => c,
-
-                // Everything else is not a valid delimiter
                 _ => {
                     cursor.advance();
                     continue;
@@ -196,11 +65,11 @@ impl PreProcessor for Ruby {
             cursor.advance();
 
             while cursor.pos < len {
-                match cursor.curr() {
-                    // Skip escaped characters, unless the backslash is the delimiter itself
-                    b'\\' if boundary != b'\\' => {
+                match cursor.curr {
+                    // Skip escaped characters
+                    b'\\' => {
                         // Use backslash to embed spaces in the strings.
-                        if cursor.next() == b' ' {
+                        if cursor.next == b' ' {
                             result[cursor.pos] = b' ';
                         }
 
@@ -209,36 +78,20 @@ impl PreProcessor for Ruby {
 
                     // Start of a nested bracket
                     b'[' | b'(' | b'{' => {
-                        bracket_stack.push(cursor.curr());
-                    }
-
-                    // Start of a nested `<…>`, which Ruby allows inside a `%w<…>` literal
-                    b'<' if boundary == b'>' => {
-                        bracket_stack.push(cursor.curr());
+                        bracket_stack.push(cursor.curr);
                     }
 
                     // End of a nested bracket
                     b']' | b')' | b'}' if !bracket_stack.is_empty() => {
-                        if !bracket_stack.pop(cursor.curr()) {
-                            // Unbalanced
-                            cursor.advance();
-                        }
-                    }
-
-                    // End of a nested `<…>`
-                    b'>' if boundary == b'>' && !bracket_stack.is_empty() => {
-                        if !bracket_stack.pop(cursor.curr()) {
+                        if !bracket_stack.pop(cursor.curr) {
                             // Unbalanced
                             cursor.advance();
                         }
                     }
 
                     // End of the pattern, replace the boundary character with a space
-                    _ if cursor.curr() == boundary => {
-                        if boundary != b'\n' {
-                            result[cursor.pos] = b' ';
-                        }
-
+                    _ if cursor.curr == boundary => {
+                        result[cursor.pos] = b' ';
                         break;
                     }
 
@@ -280,69 +133,12 @@ mod tests {
                 "%w(flex data-[state=pending]:bg-(--my-color) flex-col)",
                 "%w flex data-[state=pending]:bg-(--my-color) flex-col ",
             ),
-            // %w<…>
-            ("%w<flex px-2.5>", "%w flex px-2.5 "),
-            (
-                "%w<flex data-[state=pending]:bg-(--my-color) flex-col>",
-                "%w flex data-[state=pending]:bg-(--my-color) flex-col ",
-            ),
-            // Nested `<…>` does not end the literal
-            ("%w<flex <nested> px-2.5>", "%w flex <nested> px-2.5 "),
-            // %w|…|, %w:…:, %w!…!
-            ("%w|flex px-2.5|", "%w flex px-2.5 "),
-            ("%w:flex px-2.5:", "%w flex px-2.5 "),
-            ("%w!flex px-2.5!", "%w flex px-2.5 "),
-            (r#"%w\flex px-2.5\"#, r#"%w flex px-2.5 "#),
-            // A `%` that follows a value is a modulo operation, not a percent literal
-            (
-                "hit rate 50%w.\n%w[flex px-2.5]",
-                "hit rate 50%w.\n%w flex px-2.5 ",
-            ),
-
-            // %w …\n
-            ("%w flex px-2.5\n", "%w flex px-2.5\n"),
-
             // Use backslash to embed spaces in the strings.
             (r#"%w[foo\ bar baz\ bat]"#, r#"%w foo  bar baz  bat "#),
             (r#"%W[foo\ bar baz\ bat]"#, r#"%W foo  bar baz  bat "#),
-
             // The nested delimiters evaluated to a flat array of strings
             // (not nested array).
             (r#"%w[foo[bar baz]qux]"#, r#"%w foo[bar baz]qux "#),
-
-            (
-              "# test\n# test\n# {ActiveRecord::Base#save!}[rdoc-ref:Persistence#save!]\n%w[flex px-2.5]",
-              "      \n      \n                                                        \n%w flex px-2.5 "
-            ),
-
-            (r#""foo # bar""#, r#""foo # bar""#),
-            (r#"'foo # bar'"#, r#"'foo # bar'"#),
-            (
-              r#"def call = tag.span "Foo", class: %w[rounded-full h-0.75 w-0.75]"#,
-              r#"def call = tag.span "Foo", class: %w rounded-full h-0.75 w-0.75 "#
-            ),
-
-            (r#"%w[foo ' bar]"#, r#"%w foo ' bar "#),
-            (r#"%w[foo " bar]"#, r#"%w foo " bar "#),
-            (r#"%W[foo ' bar]"#, r#"%W foo ' bar "#),
-            (r#"%W[foo " bar]"#, r#"%W foo " bar "#),
-
-            (r#"%p foo ' bar "#, r#"%p foo ' bar "#),
-            (r#"%p foo " bar "#, r#"%p foo " bar "#),
-
-            (
-              "%p has a ' quote\n# this should be removed\n%p has a ' quote",
-              "%p has a ' quote\n                        \n%p has a ' quote"
-            ),
-            (
-              "%p has a \" quote\n# this should be removed\n%p has a \" quote",
-              "%p has a \" quote\n                        \n%p has a \" quote"
-            ),
-
-            (
-              "%w#this text is kept# # this text is not",
-              "%w this text is kept                    ",
-            ),
         ] {
             Ruby::test(input, expected);
         }
@@ -375,30 +171,6 @@ mod tests {
                 "%w(flex data-[state=pending]:bg-(--my-color) flex-col)",
                 vec!["flex", "data-[state=pending]:bg-(--my-color)", "flex-col"],
             ),
-            // %w<…>
-            ("%w<flex px-2.5>", vec!["flex", "px-2.5"]),
-            ("%w<px-2.5 flex>", vec!["flex", "px-2.5"]),
-            ("%w<2xl:flex>", vec!["2xl:flex"]),
-            (
-                "%w<flex data-[state=pending]:bg-(--my-color) flex-col>",
-                vec!["flex", "data-[state=pending]:bg-(--my-color)", "flex-col"],
-            ),
-            // Nested `<…>` does not end the literal
-            ("%w<flex <nested> px-2.5>", vec!["flex", "px-2.5"]),
-            // %w|…|, %w:…:, %w!…!
-            ("%w|flex px-2.5|", vec!["flex", "px-2.5"]),
-            ("%w:flex px-2.5:", vec!["flex", "px-2.5"]),
-            ("%w!flex px-2.5!", vec!["flex", "px-2.5"]),
-
-            (
-              "# test\n# test\n# {ActiveRecord::Base#save!}[rdoc-ref:Persistence#save!]\n%w[flex px-2.5]",
-              vec!["flex", "px-2.5"],
-            ),
-
-            (r#""foo # bar""#, vec!["foo", "bar"]),
-            (r#"'foo # bar'"#, vec!["foo", "bar"]),
-
-            (r#"%w[foo ' bar]"#, vec!["foo", "bar"]),
         ] {
             Ruby::test_extract_contains(input, expected);
         }
@@ -450,79 +222,4 @@ mod tests {
         "#;
         Ruby::test_extract_contains(input, vec!["z-1", "z-2", "z-3"]);
     }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/19728
-    #[test]
-    fn test_interpolated_expressions() {
-        let input = r#"
-            def width_class(width = nil)
-              <<~STYLE_CLASS
-                #{width || 'w-100'}
-              STYLE_CLASS
-            end
-        "#;
-
-        Ruby::test_extract_contains(input, vec!["w-100"]);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/19239
-    #[test]
-    fn test_skip_comments() {
-        let input = r#"
-          # From activerecord-8.1.1/lib/active_record/errors.rb:147
-          # Rails uses RDoc cross-reference syntax in inline documentation:
-          # {ActiveRecord::Base#save!}[rdoc-ref:Persistence#save!]
-        "#;
-
-        // Nothing should be extracted from comments, so expect an empty array.
-        Ruby::test_extract_exact(input, vec![]);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/19481
-    #[test]
-    fn test_strict_locals() {
-        // Strict locals are defined in a `<%# locals: … %>`, but the `#` looks like a comment
-        // which we should not ignore in this case.
-        let input = r#"
-          <%# locals: (css: "text-amber-600") %>
-          <% more_css = "text-sky-500" %>
-
-          <p class="text-green-500">
-            In a partial
-          </p>
-
-          <p class="<%= css %>">
-            In a partial using explicit local variables
-          </p>
-
-          <p class="<%= more_css %>">
-            In a partial using explicit local variables
-          </p>
-        "#;
-
-        Ruby::test_extract_contains(
-            input,
-            vec!["text-amber-600", "text-sky-500", "text-green-500"],
-        );
-    }
-
-    #[test]
-    fn test_invalid_utf8_does_not_panic() {
-        // Invalid UTF-8 sequence: 0x80 is a continuation byte without a leading byte
-        let invalid_utf8: &[u8] = &[0x80, 0x81, 0x82];
-
-        let processor = Ruby::default();
-
-        // Should not panic, just return the input unchanged
-        let result = processor.process(invalid_utf8);
-        assert_eq!(result, invalid_utf8);
-    }
-
-    #[test]
-    fn test_valid_utf8_with_multibyte_chars() {
-        // Test that valid UTF-8 with multi-byte characters (like em-dashes) works
-        let input = "# Comment with em—dash\n%w[flex px-2.5]";
-
-        Ruby::test_extract_contains(input, vec!["flex", "px-2.5"]);
-    }
 }
diff --git a/crates/oxide/src/extractor/pre_processors/rust.rs b/crates/oxide/src/extractor/pre_processors/rust.rs
deleted file mode 100644
index 4fa53f793..000000000
--- a/crates/oxide/src/extractor/pre_processors/rust.rs
+++ /dev/null
@@ -1,238 +0,0 @@
-use crate::extractor::bracket_stack;
-use crate::extractor::cursor;
-use crate::extractor::machine::Machine;
-use crate::extractor::pre_processors::pre_processor::PreProcessor;
-use crate::extractor::variant_machine::VariantMachine;
-use crate::extractor::MachineState;
-use bstr::ByteSlice;
-
-#[derive(Debug, Default)]
-pub struct Rust;
-
-impl PreProcessor for Rust {
-    fn process(&self, content: &[u8]) -> Vec<u8> {
-        // Leptos support: https://github.com/tailwindlabs/tailwindcss/pull/18093
-        let replaced_content = content
-            .replace(" class:", " class ")
-            .replace("\tclass:", " class ")
-            .replace("\nclass:", " class ");
-
-        if replaced_content.contains_str(b"html!") {
-            self.process_maud_templates(&replaced_content)
-        } else {
-            replaced_content
-        }
-    }
-}
-
-impl Rust {
-    fn process_maud_templates(&self, replaced_content: &[u8]) -> Vec<u8> {
-        let len = replaced_content.len();
-        let mut result = replaced_content.to_vec();
-        let mut cursor = cursor::Cursor::new(replaced_content);
-        let mut bracket_stack = bracket_stack::BracketStack::default();
-
-        while cursor.pos < len {
-            match cursor.curr() {
-                // Escaped character, skip ahead to the next character
-                b'\\' => {
-                    cursor.advance_twice();
-                    continue;
-                }
-
-                // Consume strings as-is
-                b'"' => {
-                    result[cursor.pos] = b' ';
-                    cursor.advance();
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // Escaped character, skip ahead to the next character
-                            b'\\' => cursor.advance_twice(),
-
-                            // End of the string
-                            b'"' => {
-                                result[cursor.pos] = b' ';
-                                break;
-                            }
-
-                            // Everything else is valid
-                            _ => cursor.advance(),
-                        };
-                    }
-                }
-
-                // Only replace `.` with a space if it's not surrounded by numbers. E.g.:
-                //
-                // ```diff
-                // - .flex.items-center
-                // +  flex items-center
-                // ```
-                //
-                // But with numbers, it's allowed:
-                //
-                // ```diff
-                // - px-2.5
-                // + px-2.5
-                // ```
-                b'.' => {
-                    // Don't replace dots with spaces when inside of any type of brackets, because
-                    // this could be part of arbitrary values. E.g.: `bg-[url(https://example.com)]`
-                    //                                                                       ^
-                    if !bracket_stack.is_empty() {
-                        cursor.advance();
-                        continue;
-                    }
-
-                    // If the dot is surrounded by digits, we want to keep it. E.g.: `px-2.5`
-                    // EXCEPT if it's followed by a valid variant that happens to start with a
-                    // digit.
-                    // E.g.: `bg-red-500.2xl:flex`
-                    //                 ^^^
-                    if cursor.prev().is_ascii_digit() && cursor.next().is_ascii_digit() {
-                        let mut next_cursor = cursor.clone();
-                        next_cursor.advance();
-
-                        let mut variant_machine = VariantMachine::default();
-                        if let MachineState::Done(_) = variant_machine.next(&mut next_cursor) {
-                            result[cursor.pos] = b' ';
-                        }
-                    } else {
-                        result[cursor.pos] = b' ';
-                    }
-                }
-
-                b'[' => {
-                    bracket_stack.push(cursor.curr());
-
-                    // Handle `p.flex[condition]`. If there is a `-` before it, it will likely be an
-                    // arbitrary value e.g. `text-[red]`
-                    if !matches!(cursor.prev(), b'-') {
-                        result[cursor.pos] = b' ';
-                    }
-                }
-
-                b']' if !bracket_stack.is_empty() => {
-                    bracket_stack.pop(cursor.curr());
-                }
-
-                // Consume everything else
-                _ => {}
-            };
-
-            cursor.advance();
-        }
-
-        result
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::Rust;
-    use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-    #[test]
-    fn test_leptos_extraction() {
-        for (input, expected) in [
-            // Spaces
-            (
-                "<div class:flex class:px-2.5={condition()}>",
-                "<div class flex class px-2.5={condition()}>",
-            ),
-            // Tabs
-            (
-                "<div\tclass:flex class:px-2.5={condition()}>",
-                "<div class flex class px-2.5={condition()}>",
-            ),
-            // Newlines
-            (
-                "<div\nclass:flex class:px-2.5={condition()}>",
-                "<div class flex class px-2.5={condition()}>",
-            ),
-        ] {
-            Rust::test(input, expected);
-        }
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/18984
-    #[test]
-    fn test_maud_template_extraction() {
-        let input = r#"
-            use maud::{html, Markup};
-
-            pub fn main() -> Markup {
-                html! {
-                    header.px-8.py-4.text-black {
-                        "Hello, world!"
-                    }
-                }
-            }
-        "#;
-
-        Rust::test_extract_contains(input, vec!["px-8", "py-4", "text-black"]);
-
-        // https://maud.lambda.xyz/elements-attributes.html#classes-and-ids-foo-bar
-        let input = r#"
-            html! {
-                input #cannon .big.scary.bright-red type="button" value="Launch Party Cannon";
-            }
-        "#;
-        Rust::test_extract_contains(input, vec!["big", "scary", "bright-red"]);
-
-        let input = r#"
-            html! {
-                div."bg-[#0088cc]" { "Quotes for backticks" }
-            }
-        "#;
-        Rust::test_extract_contains(input, vec!["bg-[#0088cc]"]);
-
-        let input = r#"
-            html! {
-                #main {
-                    "Main content!"
-                    .tip { "Storing food in a refrigerator can make it 20% cooler." }
-                }
-            }
-        "#;
-        Rust::test_extract_contains(input, vec!["tip"]);
-
-        let input = r#"
-            html! {
-                div."bg-[url(https://example.com)]" { "Arbitrary values" }
-            }
-        "#;
-        Rust::test_extract_contains(input, vec!["bg-[url(https://example.com)]"]);
-
-        let input = r#"
-            html! {
-                div.px-4.text-black {
-                    "Some text, with unbalanced brackets ]["
-                }
-                div.px-8.text-white {
-                    "Some more text, with unbalanced brackets ]["
-                }
-            }
-        "#;
-        Rust::test_extract_contains(input, vec!["px-4", "text-black", "px-8", "text-white"]);
-
-        let input = r#"html! { \x.px-4.text-black {  } }"#;
-        Rust::test(input, r#"html! { \x px-4 text-black {  } }"#);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/20233
-    #[test]
-    fn test_maud_template_extraction_with_conditional_classes() {
-        let input = r#"
-            use maud::{html, Markup};
-
-            pub fn main() -> Markup {
-                html! {
-                    p.text-black[cuteness > 50] { "Squee!" }
-                }
-            }
-        "#;
-
-        Rust::test_extract_contains(input, vec!["text-black"]);
-    }
-}
diff --git a/crates/oxide/src/extractor/pre_processors/slim.rs b/crates/oxide/src/extractor/pre_processors/slim.rs
index 5683858d5..9f8855c2c 100644
--- a/crates/oxide/src/extractor/pre_processors/slim.rs
+++ b/crates/oxide/src/extractor/pre_processors/slim.rs
@@ -15,7 +15,7 @@ impl PreProcessor for Slim {
         let mut bracket_stack = BracketStack::default();
 
         while cursor.pos < len {
-            match cursor.curr() {
+            match cursor.curr {
                 // Only replace `.` with a space if it's not surrounded by numbers. E.g.:
                 //
                 // ```diff
@@ -43,7 +43,7 @@ impl PreProcessor for Slim {
                     // digit.
                     // E.g.: `bg-red-500.2xl:flex`
                     //                 ^^^
-                    if cursor.prev().is_ascii_digit() && cursor.next().is_ascii_digit() {
+                    if cursor.prev.is_ascii_digit() && cursor.next.is_ascii_digit() {
                         let mut next_cursor = cursor.clone();
                         next_cursor.advance();
 
@@ -56,85 +56,6 @@ impl PreProcessor for Slim {
                     }
                 }
 
-                // Handle Ruby syntax with `%w[]` arrays embedded in Slim directly.
-                //
-                // E.g.:
-                //
-                // ```
-                // div [
-                //   class=%w[bg-blue-500 w-10 h-10]
-                // ]
-                // ```
-                //
-                // A `%` that follows a value is not a percent literal. E.g.: the `50%w` in
-                // `hit rate 50%w.`
-                b'%' if matches!(cursor.next(), b'w' | b'W')
-                    && !cursor.prev().is_ascii_alphanumeric()
-                    && !matches!(cursor.prev(), b'_' | b')' | b']' | b'}') =>
-                {
-                    // Boundary characters
-                    let (open, close) = match cursor.input.get(cursor.pos + 2) {
-                        Some(b'[') => (b'[', b']'),
-                        Some(b'(') => (b'(', b')'),
-                        Some(b'{') => (b'{', b'}'),
-                        Some(b'<') => (b'<', b'>'),
-
-                        // Any other ASCII punctuation can be used as a custom delimiter
-                        Some(&c) if c.is_ascii_punctuation() => (c, c),
-
-                        // Everything else is not a valid delimiter
-                        _ => {
-                            cursor.advance();
-                            continue;
-                        }
-                    };
-
-                    result[cursor.pos] = b' '; // Replace `%`
-                    cursor.advance();
-                    result[cursor.pos] = b' '; // Replace `w`
-                    cursor.advance();
-                    result[cursor.pos] = b' '; // Replace the opening delimiter
-                    cursor.advance();
-
-                    // Paired delimiters can be nested as long as they are balanced. E.g.:
-                    // `%w[foo[bar]baz]` produces a flat array.
-                    let mut depth = 1_usize;
-
-                    while cursor.pos < len {
-                        match cursor.curr() {
-                            // Skip escaped characters, unless the backslash is the delimiter
-                            // itself
-                            b'\\' if close != b'\\' => {
-                                // Use backslash to embed spaces in the strings.
-                                if cursor.next() == b' ' {
-                                    result[cursor.pos] = b' ';
-                                }
-
-                                cursor.advance();
-                            }
-
-                            // Start of a nested delimiter pair
-                            c if c == open && open != close => depth += 1,
-
-                            // Closing delimiter
-                            c if c == close => {
-                                depth -= 1;
-
-                                // End of the literal, replace the closing delimiter with a space
-                                if depth == 0 {
-                                    result[cursor.pos] = b' ';
-                                    break;
-                                }
-                            }
-
-                            // Everything else is valid content
-                            _ => {}
-                        }
-
-                        cursor.advance();
-                    }
-                }
-
                 // Any `[` preceded by an alphanumeric value will not be part of a candidate.
                 //
                 // E.g.:
@@ -153,10 +74,10 @@ impl PreProcessor for Slim {
                 // Instead of listing all boundary characters, let's list the characters we know
                 // will be invalid instead.
                 b'[' if bracket_stack.is_empty()
-                    && matches!(cursor.prev(), b'a'..=b'z' | b'A'..=b'Z' | b'0'..=b'9') =>
+                    && matches!(cursor.prev, b'a'..=b'z' | b'A'..=b'Z' | b'0'..=b'9') =>
                 {
                     result[cursor.pos] = b' ';
-                    bracket_stack.push(cursor.curr());
+                    bracket_stack.push(cursor.curr);
                 }
 
                 // In Slim the class name shorthand can be followed by a parenthesis. E.g.:
@@ -171,17 +92,17 @@ impl PreProcessor for Slim {
                 //
                 // However, we also need to make sure that we keep the parens that are part of the
                 // utility class. E.g.: `bg-(--my-color)`.
-                b'(' if bracket_stack.is_empty() && !matches!(cursor.prev(), b'-' | b'/') => {
+                b'(' if bracket_stack.is_empty() && !matches!(cursor.prev, b'-' | b'/') => {
                     result[cursor.pos] = b' ';
-                    bracket_stack.push(cursor.curr());
+                    bracket_stack.push(cursor.curr);
                 }
 
                 b'(' | b'[' | b'{' => {
-                    bracket_stack.push(cursor.curr());
+                    bracket_stack.push(cursor.curr);
                 }
 
                 b')' | b']' | b'}' if !bracket_stack.is_empty() => {
-                    bracket_stack.pop(cursor.curr());
+                    bracket_stack.pop(cursor.curr);
                 }
 
                 // Consume everything else
@@ -360,90 +281,4 @@ mod tests {
         "#;
         Slim::test_extract_contains(input, vec!["flex", "items-center"]);
     }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17542
-    #[test]
-    fn test_embedded_ruby_percent_w_extraction() {
-        let input = r#"
-            div[
-              class=%w[bg-blue-500 w-10 h-10]
-            ]
-            div[
-              class=%w[w-10 bg-green-500 h-10]
-            ]
-        "#;
-
-        let expected = "
-            div \n              class=   bg-blue-500 w-10 h-10 \n            ]
-            div \n              class=   w-10 bg-green-500 h-10 \n            ]
-        ";
-
-        Slim::test(input, expected);
-        Slim::test_extract_contains(input, vec!["bg-blue-500", "bg-green-500", "w-10", "h-10"]);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/20386
-    #[test]
-    fn test_embedded_ruby_percent_w_delimiters() {
-        for (input, expected) in [
-            // %w<…>, Slim only counts `[({` nesting in attribute values, so the code must be
-            // wrapped in parentheses to contain spaces
-            (
-                "div class=(%w<bg-blue-500 w-10 h-10>)",
-                "div class=    bg-blue-500 w-10 h-10 )",
-            ),
-            // Nested `<…>` does not end the literal
-            (
-                "div class=(%w<flex <nested> px-2.5>)",
-                "div class=    flex <nested> px-2.5 )",
-            ),
-            // Custom delimiters
-            ("div class=(%w|flex px-2.5|)", "div class=    flex px-2.5 )"),
-            ("div class=(%W!flex px-2.5!)", "div class=    flex px-2.5 )"),
-            (
-                "div class=(%w#text-sm leading-6#)",
-                "div class=    text-sm leading-6 )",
-            ),
-            (
-                "div class=(%w=italic tracking-wide=)",
-                "div class=    italic tracking-wide )",
-            ),
-            // Nested paired delimiters stay balanced inside the literal
-            (
-                "div class=(%w[content-['[hello]'] p-4])",
-                "div class=    content-['[hello]'] p-4 )",
-            ),
-            // Escaped spaces embed a space in a single array element
-            (
-                r#"div class=(%w[foo\ bar baz-1])"#,
-                r#"div class=    foo  bar baz-1 )"#,
-            ),
-            // Ruby control line, which is plain Ruby code
-            ("- classes = %w<mt-4 flex>", "- classes =    mt-4 flex "),
-            // A `%` that follows a value is not a percent literal
-            ("| hit rate 50%w.", "| hit rate 50%w "),
-        ] {
-            Slim::test(input, expected);
-        }
-
-        let input = r#"
-            div[
-              class=(%w<bg-blue-500 w-10 h-10>)
-            ]
-            - classes = %w|w-10 bg-green-500 h-10|
-            = tag.div class: %W!px-2.5 flex!
-        "#;
-
-        Slim::test_extract_contains(
-            input,
-            vec![
-                "bg-blue-500",
-                "bg-green-500",
-                "w-10",
-                "h-10",
-                "px-2.5",
-                "flex",
-            ],
-        );
-    }
 }
diff --git a/crates/oxide/src/extractor/pre_processors/template_toolkit.rs b/crates/oxide/src/extractor/pre_processors/template_toolkit.rs
deleted file mode 100644
index 6456a2694..000000000
--- a/crates/oxide/src/extractor/pre_processors/template_toolkit.rs
+++ /dev/null
@@ -1,52 +0,0 @@
-use crate::cursor;
-use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-#[derive(Debug, Default)]
-pub struct TemplateToolkit;
-
-impl PreProcessor for TemplateToolkit {
-    fn process(&self, content: &[u8]) -> Vec<u8> {
-        let len = content.len();
-        let mut result = content.to_vec();
-        let mut cursor = cursor::Cursor::new(content);
-
-        while cursor.pos < len {
-            match (cursor.curr(), cursor.next()) {
-                (b'[', b'%') => result[cursor.pos] = b' ',
-                (b'%', b']') => result[cursor.pos + 1] = b' ',
-                _ => {}
-            }
-
-            cursor.advance();
-        }
-
-        result
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::TemplateToolkit;
-    use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-    #[test]
-    fn test_template_toolkit_pre_processor() {
-        for (input, expected) in [
-            (
-                "[% IF $is_open %]bg-white/40[% ELSE %]bg-white/10[% END %]",
-                " % IF $is_open % bg-white/40 % ELSE % bg-white/10 % END % ",
-            ),
-            ("[% WRAPPER %]flex[% END %]", " % WRAPPER % flex % END % "),
-        ] {
-            TemplateToolkit::test(input, expected);
-        }
-    }
-
-    #[test]
-    fn test_extraction_between_template_tags_works() {
-        TemplateToolkit::test_extract_contains(
-            r#"<div class="[% IF $is_open %]bg-white/40[% ELSE %]bg-white/10[% END %]"></div>"#,
-            vec!["bg-white/40", "bg-white/10"],
-        );
-    }
-}
diff --git a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-1.haml b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-1.haml
new file mode 100644
index 000000000..fd8bd6eaf
--- /dev/null
+++ b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-1.haml
@@ -0,0 +1,155 @@
+/ https://github com/tailwindlabs/tailwindcss/pull/17051 issuecomment-2711181352
+- star_styles   "size- 800px  mask mask-star bg-gradient-to-r from-secondary via-cyan-400 to-lime-400"
+- crazy_text_styles   "italic font-black bg-gradient-to-r via-60% to-90% from-orange-500 via-secondary to-primary text-transparent bg-clip-text inline-block py-2"
+
+ relative
+  -   Blurred background star
+   absolute left-0 z-0  class: "-top-[400px] -right-[400px]"  
+     flex justify-end blur-3xl
+      %div  class: star_styles  
+
+   relative z-10
+    %h1 mt-8 text-center text-5xl font-black tracking-wide drop-shadow-lg
+      %div
+        Components, Guides, and Paradigms
+       md:inline-flex md:items-center justify-center
+        %span -mr-2
+          for
+        %span relative -rotate-3 hover:-rotate-6 hover:scale-125 transition-transform
+          %span  class: crazy_text_styles + " absolute blur-xl"  
+            &nbsp;CRAZY&nbsp;
+          %span  class: crazy_text_styles + " drop-shadow-[0_0_1px_#fff]"  
+            &nbsp;CRAZY&nbsp;
+        %span -ml-3 md:-ml-1
+          \-fast Development
+      %div
+        in Ruby on Rails!
+
+     mt-16 text-center
+        daisy_button "😃 Get Started", css: "btn-primary text-xl",
+        right_icon: "arrow-right", target: "_blank",
+        href: "https://github com/profoundry-us/loco_motion locomotion-components"
+
+     mt-32 lg:flex lg:space-x-8
+      %div  class: "md:basis-2/5"  
+        %h3 text-4xl font-bold
+          Easy, Flexible Components
+        %p mt-2 text-xl
+          Powered by the fabulous
+            succeed ',' do
+              daisy_link "ViewComponent", "https://viewcomponent.org", target: "_blank" 
+            succeed ', and' do
+              daisy_link "DaisyUI", "https://daisyui com/", target: "_blank"
+            daisy_link "TailwindCSS", "https://tailwindcss com/", target: "_blank"
+          libraries, our components are designed to be fast, flexible, and easy to
+          use <i>directy</i> in Ruby on Rails!
+
+        doc_example css: "mt-8 lg:mt-0 lg:basis-3/5 h-44"  do
+         flex flex-col sm:flex-row items-center gap-4
+            daisy_button "Accent Button", css: "btn-accent"
+            daisy_tip "Click to Swap"  do
+              daisy_swap off: "🌚", on: "🌞", css: "swap-rotate text-4xl"
+            daisy_badge "Large Badge", css: "badge-secondary badge-lg"
+
+
+     mt-32 xl:flex xl:flex-row-reverse xl:items-center
+       text-xl xl:ml-8
+        %h3 text-4xl font-bold
+          Simple, Concise Views
+
+        %p mt-2
+          Utlize
+            daisy_link "HAML", "https://haml.info/", target: "_blank" 
+          so your views are simple, concise, and easy to understand 
+
+        %p mt-2
+          No more messy ERB files with all of their closing tags and Ruby wrappers 
+          HAML feels more natural to write and reduces file sizes, making your
+          views easier to read and maintain 
+
+        %p mt-2
+          :markdown
+            **PLUS!** You can utlize filters like _Markdown_, CoffeeScript,
+            Textile, and many more!
+
+       mt-8 xl:mt-0
+         flex flex-col xl:flex xl:flex-row w-full
+            doc_code css: "grow", code_css: "xl:pl-2 xl:pr-0 xl:rounded-r-none", language: "erb"  do
+            :escaped
+              <%   Ruby %>
+
+              <% 5 times do |i| %>
+                <% if i even? %>
+                  <p class "odd">Number <%  i %></p>
+                <% else %>
+                  <p class "even">Numero <%  i %></p>
+                <% end %>
+              <% end %>
+
+            doc_code css: "grow mt-8 xl:mt-0", pre_css: "xl:h-full", code_css: "xl:pl-0 xl:pr-2 xl:h-full xl:rounded-l-none"  do
+            :escaped
+              -   HAML
+
+              - 5 times do |i|
+                - if i even?
+                  %p odd Number \  i 
+                - else
+                  %p even Numero \  i 
+
+
+    %h3 mt-32 text-4xl font-bold
+      Build Your <i>OWN</i> Components
+
+    %p mt-2 text-xl
+      Can't find exactly what you need? No problem! Build your own components
+      with ease using our simple, flexible, and powerful DSL 
+
+     mt-8 xl:flex xl:space-x-8
+      %div
+          doc_code language: "ruby"  do
+          :escaped
+              app/components/application_component rb
+            class ApplicationComponent < LocoMotion::BaseComponent
+                Add your custom / shared component logic here!
+            end
+
+          doc_code language: "haml", css: "mt-8"  do
+          :escaped
+            -   app/components/character_component html haml
+              part :component  do
+                part :head 
+                part :body  do
+                  content
+                part :legs 
+
+      %div mt-8 xl:mt-0
+          doc_code language: "ruby"  do
+          :escaped
+              app/components/character_component rb
+            class CharacterComponent < ApplicationComponent
+              define_parts :head, :body, :legs
+
+              def before_render
+                set_tag_name :head, :h1 
+                add_css :head, "text-3xl font-bold" 
+
+                set_tag_name :body, :p 
+                add_stimulus_controller :body, "character-body" 
+                add_css :body, "text-lg" 
+
+                set_tag_name :legs, :footer 
+                add_css :legs, "text-sm" 
+              end
+            end
+
+    %h3 mt-24 text-center text-4xl font-bold italic
+      More Coming Soon!
+    %p mt-2 text-xl text-center
+      Keen an eye out as we'll be adding more components, guides, and
+      %br max-sm:hidden
+      suggested gems for you to build amazing Rails apps!
+     mt-4 text-center
+        daisy_button "😉 Get Started", css: "btn-primary text-xl",
+        right_icon: "arrow-right", target: "_blank",
+        class: "px-2.5"
+        href: "https://github com/profoundry-us/loco_motion locomotion-components"
diff --git a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-17051.haml b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-17051.haml
deleted file mode 100644
index 56a38cbe3..000000000
--- a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-17051.haml
+++ /dev/null
@@ -1,262 +0,0 @@
-/ https://github.com/tailwindlabs/tailwindcss/pull/17051#issuecomment-2711181352
-- star_styles = "size-[800px] mask mask-star bg-gradient-to-r from-secondary via-cyan-400 to-lime-400"
-  ^^^^^^^^^^^    ^^^^^^^^^^^^ ^^^^ ^^^^^^^^^ ^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^ ^^^^^^^^^^^^ ^^^^^^^^^^^
-- crazy_text_styles = "italic font-black bg-gradient-to-r via-60% to-90% from-orange-500 via-secondary to-primary text-transparent bg-clip-text inline-block py-2"
-  ^^^^^^^^^^^^^^^^^    ^^^^^^ ^^^^^^^^^^ ^^^^^^^^^^^^^^^^ ^^^^^^^ ^^^^^^ ^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^ ^^^^^^^^^^ ^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^ ^^^^^^^^^^^^ ^^^^
-
-.relative
- ^^^^^^^^
-  - # Blurred background star
-  .absolute.left-0.z-0{ class: "-top-[400px] -right-[400px]" }
-   ^^^^^^^^ ^^^^^^ ^^^  ^^^^^   ^^^^^^^^^^^^ ^^^^^^^^^^^^^^
-    .flex.justify-end.blur-3xl
-     ^^^^ ^^^^^^^^^^^ ^^^^^^^^
-      %div{ class: star_styles }
-            ^^^^^  ^^^^^^^^^^^
-
-  .relative.z-10
-   ^^^^^^^^ ^^^^
-    %h1.mt-8.text-center.text-5xl.font-black.tracking-wide.drop-shadow-lg
-        ^^^^ ^^^^^^^^^^^ ^^^^^^^^ ^^^^^^^^^^ ^^^^^^^^^^^^^ ^^^^^^^^^^^^^^
-      %div
-        Components, Guides, and Paradigms
-                            ^^^
-      .md:inline-flex.md:items-center.justify-center
-       ^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^
-        %span.-mr-2
-              ^^^^^
-          for
-          ^^^
-        %span.relative.-rotate-3.hover:-rotate-6.hover:scale-125.transition-transform
-              ^^^^^^^^ ^^^^^^^^^ ^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^^^^^^
-          %span{ class: crazy_text_styles + " absolute blur-xl" }
-                 ^^^^^  ^^^^^^^^^^^^^^^^^     ^^^^^^^^ ^^^^^^^
-            &nbsp;CRAZY&nbsp;
-          %span{ class: crazy_text_styles + " drop-shadow-[0_0_1px_#fff]" }
-                 ^^^^^  ^^^^^^^^^^^^^^^^^     ^^^^^^^^^^^^^^^^^^^^^^^^^^
-            &nbsp;CRAZY&nbsp;
-        %span.-ml-3.md:-ml-1
-              ^^^^^ ^^^^^^^^
-          \-fast Development
-      %div
-        in Ruby on Rails!
-        ^^      ^^
-
-    .mt-16.text-center
-     ^^^^^ ^^^^^^^^^^^
-      = daisy_button "😃 Get Started", css: "btn-primary text-xl",
-        ^^^^^^^^^^^^                   ^^^   ^^^^^^^^^^^ ^^^^^^^
-        right_icon: "arrow-right", target: "_blank",
-        ^^^^^^^^^^   ^^^^^^^^^^^   ^^^^^^
-        href: "https://github.com/profoundry-us/loco_motion#locomotion-components"
-        ^^^^                                                ^^^^^^^^^^^^^^^^^^^^^
-
-    .mt-32.lg:flex.lg:space-x-8
-     ^^^^^ ^^^^^^^ ^^^^^^^^^^^^
-      %div{ class: "md:basis-2/5" }
-            ^^^^^   ^^^^^^^^^^^^
-        %h3.text-4xl.font-bold
-            ^^^^^^^^ ^^^^^^^^^
-          Easy, Flexible Components
-        %p.mt-2.text-xl
-           ^^^^ ^^^^^^^
-          Powered by the fabulous
-                  ^^ ^^^ ^^^^^^^^
-          = succeed ',' do
-            ^^^^^^^     ^^
-            = daisy_link("ViewComponent", "https://viewcomponent.org", target: "_blank")
-                                                                 ^^^   ^^^^^^
-          = succeed ', and' do
-            ^^^^^^^    ^^^  ^^
-            = daisy_link "DaisyUI", "https://daisyui.com/", target: "_blank"
-              ^^^^^^^^^^                                    ^^^^^^
-          = daisy_link "TailwindCSS", "https://tailwindcss.com/", target: "_blank"
-            ^^^^^^^^^^                                            ^^^^^^
-          libraries, our components are designed to be fast, flexible, and easy to
-                     ^^^ ^^^^^^^^^^ ^^^ ^^^^^^^^ ^^ ^^                 ^^^ ^^^^ ^^
-          use <i>directly</i> in Ruby on Rails!
-          ^^^    ^^^^^^^^     ^^      ^^
-
-      = doc_example(css: "mt-8 lg:mt-0 lg:basis-3/5 h-44") do
-                    ^^^   ^^^^ ^^^^^^^ ^^^^^^^^^^^^ ^^^^   ^^
-        .flex.flex-col.sm:flex-row.items-center.gap-4
-         ^^^^ ^^^^^^^^ ^^^^^^^^^^^ ^^^^^^^^^^^^ ^^^^^
-          = daisy_button "Accent Button", css: "btn-accent"
-            ^^^^^^^^^^^^                  ^^^   ^^^^^^^^^^
-          = daisy_tip("Click to Swap") do
-                             ^^        ^^
-            = daisy_swap off: "🌚", on: "🌞", css: "swap-rotate text-4xl"
-              ^^^^^^^^^^ ^^^        ^^        ^^^   ^^^^^^^^^^^ ^^^^^^^^
-          = daisy_badge "Large Badge", css: "badge-secondary badge-lg"
-            ^^^^^^^^^^^                ^^^   ^^^^^^^^^^^^^^^ ^^^^^^^^
-
-
-    .mt-32.xl:flex.xl:flex-row-reverse.xl:items-center
-     ^^^^^ ^^^^^^^ ^^^^^^^^^^^^^^^^^^^ ^^^^^^^^^^^^^^^
-      .text-xl.xl:ml-8
-       ^^^^^^^ ^^^^^^^
-        %h3.text-4xl.font-bold
-            ^^^^^^^^ ^^^^^^^^^
-          Simple, Concise Views
-
-        %p.mt-2
-           ^^^^
-          Utilize
-          = daisy_link("HAML", "https://haml.info/", target: "_blank")
-                                                     ^^^^^^
-          so your views are simple, concise, and easy to understand.
-          ^^ ^^^^ ^^^^^ ^^^                  ^^^ ^^^^ ^^ ^^^^^^^^^^
-
-        %p.mt-2
-           ^^^^
-          No more messy ERB files with all of their closing tags and Ruby wrappers.
-             ^^^^ ^^^^^     ^^^^^ ^^^^ ^^^ ^^ ^^^^^ ^^^^^^^ ^^^^ ^^^      ^^^^^^^^
-          HAML feels more natural to write and reduces file sizes, making your
-               ^^^^^ ^^^^ ^^^^^^^ ^^ ^^^^^ ^^^ ^^^^^^^ ^^^^        ^^^^^^ ^^^^
-          views easier to read and maintain.
-          ^^^^^ ^^^^^^ ^^ ^^^^ ^^^ ^^^^^^^^
-
-        %p.mt-2
-           ^^^^
-          :markdown
-            **PLUS!** You can utilize filters like _Markdown_, CoffeeScript,
-                          ^^^ ^^^^^^^ ^^^^^^^ ^^^^
-            Textile, and many more!
-                     ^^^ ^^^^ ^^^^^
-
-      .mt-8.xl:mt-0
-       ^^^^ ^^^^^^^
-        .flex.flex-col.xl:flex.xl:flex-row.w-full
-         ^^^^ ^^^^^^^^ ^^^^^^^ ^^^^^^^^^^^ ^^^^^^
-          = doc_code(css: "grow", code_css: "xl:pl-2 xl:pr-0 xl:rounded-r-none", language: "erb") do
-                     ^^^   ^^^^   ^^^^^^^^   ^^^^^^^ ^^^^^^^ ^^^^^^^^^^^^^^^^^   ^^^^^^^^   ^^^   ^^
-            :escaped
-              <% # Ruby %>
-
-              <% 5.times do |i| %>
-                   ^^^^^ ^^
-                <% if i.even? %>
-                   ^^ ^
-                  <p class="odd">Number <%= i %></p>
-                     ^^^^^  ^^^             ^
-                <% else %>
-                   ^^^^
-                  <p class="even">Numero <%= i %></p>
-                     ^^^^^  ^^^^             ^
-                <% end %>
-                   ^^^
-              <% end %>
-                 ^^^
-
-          = doc_code(css: "grow mt-8 xl:mt-0", pre_css: "xl:h-full", code_css: "xl:pl-0 xl:pr-2 xl:h-full xl:rounded-l-none") do
-                     ^^^   ^^^^ ^^^^ ^^^^^^^   ^^^^^^^   ^^^^^^^^^   ^^^^^^^^   ^^^^^^^ ^^^^^^^ ^^^^^^^^^ ^^^^^^^^^^^^^^^^^   ^^
-            :escaped
-              - # HAML
-
-              - 5.times do |i|
-                  ^^^^^ ^^
-                - if i.even?
-                  ^^
-                  %p.odd Number \#{i}
-                     ^^^           ^
-                - else
-                  ^^^^
-                  %p.even Numero \#{i}
-                     ^^^^           ^
-
-
-    %h3.mt-32.text-4xl.font-bold
-        ^^^^^ ^^^^^^^^ ^^^^^^^^^
-      Build Your <i>OWN</i> Components
-
-    %p.mt-2.text-xl
-       ^^^^ ^^^^^^^
-      Can't find exactly what you need? No problem! Build your own components
-          ^ ^^^^ ^^^^^^^ ^^^^ ^^^          ^^^^^^^^       ^^^^ ^^^ ^^^^^^^^^^
-      with ease using our simple, flexible, and powerful DSL.
-      ^^^^ ^^^^ ^^^^^ ^^^                   ^^^ ^^^^^^^^
-
-    .mt-8.xl:flex.xl:space-x-8
-     ^^^^ ^^^^^^^ ^^^^^^^^^^^^
-      %div
-        = doc_code(language: "ruby") do
-                   ^^^^^^^^   ^^^^   ^^
-          :escaped
-            # app/components/application_component.rb
-                                                   ^^
-            class ApplicationComponent < LocoMotion::BaseComponent
-            ^^^^^
-              # Add your custom / shared component logic here!
-                    ^^^^ ^^^^^^   ^^^^^^ ^^^^^^^^^ ^^^^^ ^^^^^
-            end
-            ^^^
-
-        = doc_code(language: "haml", css: "mt-8") do
-                   ^^^^^^^^   ^^^^   ^^^   ^^^^   ^^
-          :escaped
-            - # app/components/character_component.html.haml
-            = part(:component) do
-                               ^^
-              = part(:head)
-              = part(:body) do
-                            ^^
-                = content
-                  ^^^^^^^
-              = part(:legs)
-
-      %div.mt-8.xl:mt-0
-           ^^^^ ^^^^^^^
-        = doc_code(language: "ruby") do
-                   ^^^^^^^^   ^^^^   ^^
-          :escaped
-            # app/components/character_component.rb
-                                                 ^^
-            class CharacterComponent < ApplicationComponent
-            ^^^^^
-              define_parts :head, :body, :legs
-              ^^^^^^^^^^^^
-
-              def before_render
-              ^^^ ^^^^^^^^^^^^^
-                set_tag_name(:head, :h1)
-                ^^^^^^^^^^^^
-                add_css(:head, "text-3xl font-bold")
-                ^^^^^^^         ^^^^^^^^ ^^^^^^^^^
-
-                set_tag_name(:body, :p)
-                ^^^^^^^^^^^^
-                add_stimulus_controller(:body, "character-body")
-                ^^^^^^^^^^^^^^^^^^^^^^^         ^^^^^^^^^^^^^^
-                add_css(:body, "text-lg")
-                ^^^^^^^         ^^^^^^^
-
-                set_tag_name(:legs, :footer)
-                ^^^^^^^^^^^^
-                add_css(:legs, "text-sm")
-                ^^^^^^^         ^^^^^^^
-              end
-              ^^^
-            end
-            ^^^
-
-    %h3.mt-24.text-center.text-4xl.font-bold.italic
-        ^^^^^ ^^^^^^^^^^^ ^^^^^^^^ ^^^^^^^^^ ^^^^^^
-      More Coming Soon!
-    %p.mt-2.text-xl.text-center
-       ^^^^ ^^^^^^^ ^^^^^^^^^^^
-      Keen an eye out as we'll be adding more components, guides, and
-           ^^ ^^^ ^^^ ^^ ^^ ^^ ^^ ^^^^^^ ^^^^                     ^^^
-      %br.max-sm:hidden
-          ^^^^^^^^^^^^^
-      suggested gems for you to build amazing Rails apps!
-      ^^^^^^^^^ ^^^^ ^^^ ^^^ ^^ ^^^^^ ^^^^^^^       ^^^^^
-    .mt-4.text-center
-     ^^^^ ^^^^^^^^^^^
-      = daisy_button "😉 Get Started", css: "btn-primary text-xl",
-        ^^^^^^^^^^^^                   ^^^   ^^^^^^^^^^^ ^^^^^^^
-        right_icon: "arrow-right", target: "_blank",
-        ^^^^^^^^^^   ^^^^^^^^^^^   ^^^^^^
-        class: "px-2.5"
-        ^^^^^   ^^^^^^
-        href: "https://github.com/profoundry-us/loco_motion#locomotion-components"
-        ^^^^                                                ^^^^^^^^^^^^^^^^^^^^^
diff --git a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-17813.haml b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-17813.haml
deleted file mode 100644
index 18f0fdc4b..000000000
--- a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/dst-17813.haml
+++ /dev/null
@@ -1,30 +0,0 @@
-:ruby
-  - devices_classes = 'size-5 mr-2px'
-    ^^^^^^^^^^^^^^^    ^^^^^^ ^^^^^^
-  - icon_classes = 'w-[12px] h-[12px]'
-    ^^^^^^^^^^^^    ^^^^^^^^ ^^^^^^^^
-!!!
-%html{ lang: 'en' }
-       ^^^^   ^^
-  %head
-    %title Tailwind v4.1.4 + HAML bug
-                    ^^^^^^        ^^^
-
-  -# This is a comment
-          ^^ ^ ^^^^^^^
-
-    A multi-line comment
-      ^^^^^^^^^^ ^^^^^^^
-      With more indentation
-           ^^^^ ^^^^^^^^^^^
-
-    Which can dedent again just fine
-          ^^^ ^^^^^^ ^^^^^ ^^^^ ^^^^
-
-  %body
-  - icon_classes = 'self-center w-[16px] h-[16px]'
-    ^^^^^^^^^^^^    ^^^^^^^^^^^ ^^^^^^^^ ^^^^^^^^
-    .flex{ class: icon_classes }
-     ^^^^  ^^^^^  ^^^^^^^^^^^^
-    .flex{ class: devices_classes }
-     ^^^^  ^^^^^  ^^^^^^^^^^^^^^^
diff --git a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-17051.haml b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-1.haml
similarity index 97%
rename from crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-17051.haml
rename to crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-1.haml
index 8f9b61941..38e17b134 100644
--- a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-17051.haml
+++ b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-1.haml
@@ -42,7 +42,7 @@
             = daisy_link "DaisyUI", "https://daisyui.com/", target: "_blank"
           = daisy_link "TailwindCSS", "https://tailwindcss.com/", target: "_blank"
           libraries, our components are designed to be fast, flexible, and easy to
-          use <i>directly</i> in Ruby on Rails!
+          use <i>directy</i> in Ruby on Rails!
 
       = doc_example(css: "mt-8 lg:mt-0 lg:basis-3/5 h-44") do
         .flex.flex-col.sm:flex-row.items-center.gap-4
@@ -58,7 +58,7 @@
           Simple, Concise Views
 
         %p.mt-2
-          Utilize
+          Utlize
           = daisy_link("HAML", "https://haml.info/", target: "_blank")
           so your views are simple, concise, and easy to understand.
 
@@ -69,7 +69,7 @@
 
         %p.mt-2
           :markdown
-            **PLUS!** You can utilize filters like _Markdown_, CoffeeScript,
+            **PLUS!** You can utlize filters like _Markdown_, CoffeeScript,
             Textile, and many more!
 
       .mt-8.xl:mt-0
diff --git a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-17813.haml b/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-17813.haml
deleted file mode 100644
index 5fdaefdb0..000000000
--- a/crates/oxide/src/extractor/pre_processors/test-fixtures/haml/src-17813.haml
+++ /dev/null
@@ -1,19 +0,0 @@
-:ruby
-  - devices_classes = 'size-5 mr-2px'
-  - icon_classes = 'w-[12px] h-[12px]'
-!!!
-%html{ lang: 'en' }
-  %head
-    %title Tailwind v4.1.4 + HAML bug
-
-  -# This is a comment
-
-    A multi-line comment
-      With more indentation
-
-    Which can dedent again just fine
-
-  %body
-  - icon_classes = 'self-center w-[16px] h-[16px]'
-    .flex{ class: icon_classes }
-    .flex{ class: devices_classes }
diff --git a/crates/oxide/src/extractor/pre_processors/twig.rs b/crates/oxide/src/extractor/pre_processors/twig.rs
deleted file mode 100644
index b6f4a3319..000000000
--- a/crates/oxide/src/extractor/pre_processors/twig.rs
+++ /dev/null
@@ -1,179 +0,0 @@
-use crate::cursor;
-use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-#[derive(Debug, Default)]
-pub struct Twig;
-
-impl PreProcessor for Twig {
-    fn process(&self, content: &[u8]) -> Vec<u8> {
-        let len = content.len();
-        let mut result = content.to_vec();
-        let mut cursor = cursor::Cursor::new(content);
-        let mut bracket_stack = vec![];
-
-        const ADD_CLASS: &[u8] = b"addClass";
-        const REMOVE_CLASS: &[u8] = b"removeClass";
-
-        while cursor.pos < len {
-            match (!bracket_stack.is_empty(), cursor.curr()) {
-                // addClass(
-                //         ^
-                (false, b'(')
-                    if cursor.pos >= ADD_CLASS.len()
-                        && matches!(
-                            &content[cursor.pos - ADD_CLASS.len()..cursor.pos],
-                            ADD_CLASS
-                        ) =>
-                {
-                    bracket_stack.push(cursor.curr());
-                    result[cursor.pos] = b' ';
-                }
-
-                // removeClass(
-                //            ^
-                (false, b'(')
-                    if cursor.pos >= REMOVE_CLASS.len()
-                        && matches!(
-                            &content[cursor.pos - REMOVE_CLASS.len()..cursor.pos],
-                            REMOVE_CLASS
-                        ) =>
-                {
-                    bracket_stack.push(cursor.curr());
-                    result[cursor.pos] = b' ';
-                }
-
-                (true, b'(') => {
-                    bracket_stack.push(cursor.curr());
-                }
-
-                (true, b')') => {
-                    bracket_stack.pop();
-
-                    if bracket_stack.is_empty() {
-                        result[cursor.pos] = b' ';
-                    }
-                }
-
-                _ => {}
-            }
-
-            cursor.advance();
-        }
-
-        result
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::Twig;
-    use crate::extractor::pre_processors::pre_processor::PreProcessor;
-
-    #[test]
-    fn test_twig_pre_processor() {
-        for (input, expected) in [
-            (
-                // Ensure we don't crash when we encounter an `(`
-                "(p-(--value))",
-                "(p-(--value))",
-            ),
-            (
-                // addClass with single argument
-                "addClass(p-(--value))",
-                "addClass p-(--value) ",
-            ),
-            (
-                // addClass with single argument
-                "addClass(m-4 p-8 w-full)",
-                "addClass m-4 p-8 w-full ",
-            ),
-            (
-                // removeClass with single argument
-                "removeClass(p-(--value))",
-                "removeClass p-(--value) ",
-            ),
-            (
-                // removeClass with single argument
-                "removeClass(m-4 p-8 w-full)",
-                "removeClass m-4 p-8 w-full ",
-            ),
-            (
-                // Combined with single arguments
-                "addClass(m-(--value))|removeClass(p-(--value))",
-                "addClass m-(--value) |removeClass p-(--value) ",
-            ),
-        ] {
-            Twig::test(input, expected);
-        }
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/19458
-    #[test]
-    fn test_extraction_in_add_class_and_remove_class_works() {
-        // Inside normal HTML
-        let input = r#"
-          <div data-loading="addClass(opacity-50)">
-            <!-- -->
-          </div>
-        "#;
-
-        let expected = r#"
-          <div data-loading="addClass opacity-50 ">
-            <!-- -->
-          </div>
-        "#;
-
-        Twig::test(input, expected);
-        Twig::test_extract_contains(input, vec!["opacity-50"]);
-
-        // Inside a component
-        let input = r#"
-            <twig:d:Card
-              {{ ...attributes.defaults({
-                  as: "a",
-                  class: "cursor-pointer bg-base-200 card-sm md:card-md lg:card-lg",
-                  role: "button",
-                  tabindex: "0",
-                  "data-action": "live#$render",
-                  "data-loading": "addAttribute(disabled)",
-                  "data-poll": "delay(60000)|$render",
-                  "data-loading": "addClass(border border-red-500 opacity-75)",
-                 })
-              }}
-            >
-        "#;
-
-        let expected = r#"
-            <twig:d:Card
-              {{ ...attributes.defaults({
-                  as: "a",
-                  class: "cursor-pointer bg-base-200 card-sm md:card-md lg:card-lg",
-                  role: "button",
-                  tabindex: "0",
-                  "data-action": "live#$render",
-                  "data-loading": "addAttribute(disabled)",
-                  "data-poll": "delay(60000)|$render",
-                  "data-loading": "addClass border border-red-500 opacity-75 ",
-                 })
-              }}
-            >
-        "#;
-
-        Twig::test(input, expected);
-        Twig::test_extract_contains(
-            input,
-            vec![
-                // class
-                "cursor-pointer",
-                "bg-base-200",
-                "card-sm",
-                "md:card-md",
-                "lg:card-lg",
-                // data-loading
-                "border",
-                "border-red-500",
-                "opacity-75",
-            ],
-        );
-    }
-}
diff --git a/crates/oxide/src/extractor/pre_processors/vue.rs b/crates/oxide/src/extractor/pre_processors/vue.rs
index ae037435c..15440bb86 100644
--- a/crates/oxide/src/extractor/pre_processors/vue.rs
+++ b/crates/oxide/src/extractor/pre_processors/vue.rs
@@ -1,5 +1,5 @@
 use crate::extractor::pre_processors::pre_processor::PreProcessor;
-use crate::scanner::pre_process_input;
+use crate::pre_process_input;
 use bstr::ByteSlice;
 use regex::Regex;
 use std::sync;
@@ -15,15 +15,13 @@ impl PreProcessor for Vue {
     fn process(&self, content: &[u8]) -> Vec<u8> {
         let mut result = content.to_vec();
 
-        // Only process template tags if content is valid UTF-8
-        if let Ok(content_as_str) = std::str::from_utf8(content) {
-            for (_, [lang, body]) in TEMPLATE_REGEX
-                .captures_iter(content_as_str)
-                .map(|c| c.extract())
-            {
-                let replaced = pre_process_input(body.as_bytes().to_vec(), lang);
-                result = result.replace(body, replaced);
-            }
+        let content_as_str = std::str::from_utf8(content).unwrap();
+        for (_, [lang, body]) in TEMPLATE_REGEX
+            .captures_iter(content_as_str)
+            .map(|c| c.extract())
+        {
+            let replaced = pre_process_input(body.as_bytes(), lang);
+            result = result.replace(body, replaced);
         }
 
         result
@@ -45,16 +43,4 @@ mod tests {
 
         Vue::test_extract_contains(input, vec!["bg-neutral-900", "text-red-500"]);
     }
-
-    #[test]
-    fn test_invalid_utf8_does_not_panic() {
-        // Invalid UTF-8 sequence: 0x80 is a continuation byte without a leading byte
-        let invalid_utf8: &[u8] = &[0x80, 0x81, 0x82];
-
-        let processor = Vue::default();
-
-        // Should not panic, just return the input unchanged
-        let result = processor.process(invalid_utf8);
-        assert_eq!(result, invalid_utf8);
-    }
 }
diff --git a/crates/oxide/src/extractor/string_machine.rs b/crates/oxide/src/extractor/string_machine.rs
index 4fad49faa..72a1a4c88 100644
--- a/crates/oxide/src/extractor/string_machine.rs
+++ b/crates/oxide/src/extractor/string_machine.rs
@@ -30,20 +30,20 @@ impl Machine for StringMachine {
 
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        if Class::Quote != cursor.curr().into() {
+        if Class::Quote != cursor.curr.into() {
             return MachineState::Idle;
         }
 
         // Start of a string
         let len = cursor.input.len();
         let start_pos = cursor.pos;
-        let end_char = cursor.curr();
+        let end_char = cursor.curr;
 
         cursor.advance();
 
         while cursor.pos < len {
-            match cursor.curr().into() {
-                Class::Escape => match cursor.next().into() {
+            match cursor.curr.into() {
+                Class::Escape => match cursor.next.into() {
                     // An escaped whitespace character is not allowed
                     Class::Whitespace => return MachineState::Idle,
 
@@ -52,7 +52,7 @@ impl Machine for StringMachine {
                 },
 
                 // End of the string
-                Class::Quote if cursor.curr() == end_char => return self.done(start_pos, cursor),
+                Class::Quote if cursor.curr == end_char => return self.done(start_pos, cursor),
 
                 // Any kind of whitespace is not allowed
                 Class::Whitespace => return MachineState::Idle,
@@ -87,7 +87,6 @@ enum Class {
 mod tests {
     use super::StringMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
diff --git a/crates/oxide/src/extractor/utility_machine.rs b/crates/oxide/src/extractor/utility_machine.rs
index c116ec4e4..26b7019c2 100644
--- a/crates/oxide/src/extractor/utility_machine.rs
+++ b/crates/oxide/src/extractor/utility_machine.rs
@@ -27,12 +27,12 @@ impl Machine for UtilityMachine {
 
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
+        match cursor.curr.into() {
             // LEGACY: Important marker
             Class::Exclamation => {
                 self.legacy_important = true;
 
-                match cursor.next().into() {
+                match cursor.next.into() {
                     // Start of an arbitrary property
                     //
                     // E.g.: `![color:red]`
@@ -78,7 +78,7 @@ impl UtilityMachine {
     fn parse_arbitrary_property(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         match self.arbitrary_property_machine.next(cursor) {
             MachineState::Idle => self.restart(),
-            MachineState::Done(_) => match cursor.next().into() {
+            MachineState::Done(_) => match cursor.next.into() {
                 // End of arbitrary property, but there is a potential modifier.
                 //
                 // E.g.: `[color:#0088cc]/`
@@ -109,7 +109,7 @@ impl UtilityMachine {
     fn parse_named_utility(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         match self.named_utility_machine.next(cursor) {
             MachineState::Idle => self.restart(),
-            MachineState::Done(_) => match cursor.next().into() {
+            MachineState::Done(_) => match cursor.next.into() {
                 // End of a named utility, but there is a potential modifier.
                 //
                 // E.g.: `bg-red-500/`
@@ -140,7 +140,7 @@ impl UtilityMachine {
     fn parse_modifier(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
         match self.modifier_machine.next(cursor) {
             MachineState::Idle => self.restart(),
-            MachineState::Done(_) => match cursor.next().into() {
+            MachineState::Done(_) => match cursor.next.into() {
                 // A modifier followed by a modifier is invalid
                 Class::Slash => self.restart(),
 
@@ -192,7 +192,6 @@ enum Class {
 mod tests {
     use super::UtilityMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
@@ -337,7 +336,7 @@ mod tests {
                 actual.sort();
 
                 if actual != expected {
-                    dbg!(&input);
+                    dbg!(&input, &expected, &actual);
                 }
                 assert_eq!(actual, expected);
             }
diff --git a/crates/oxide/src/extractor/variant_machine.rs b/crates/oxide/src/extractor/variant_machine.rs
index 9ec2adc09..b7a0deb86 100644
--- a/crates/oxide/src/extractor/variant_machine.rs
+++ b/crates/oxide/src/extractor/variant_machine.rs
@@ -16,7 +16,7 @@ impl Machine for VariantMachine {
 
     #[inline]
     fn next(&mut self, cursor: &mut cursor::Cursor<'_>) -> MachineState {
-        match cursor.curr().into() {
+        match cursor.curr.into() {
             // Start of an arbitrary variant
             //
             // E.g.: `[&:hover]:`
@@ -48,7 +48,7 @@ impl VariantMachine {
         start_pos: usize,
         cursor: &mut cursor::Cursor<'_>,
     ) -> MachineState {
-        match cursor.next().into() {
+        match cursor.next.into() {
             // End of an arbitrary value, must be followed by a `:`
             //
             // E.g.: `[&:hover]:`
@@ -80,7 +80,6 @@ enum Class {
 mod tests {
     use super::VariantMachine;
     use crate::extractor::machine::Machine;
-    use pretty_assertions::assert_eq;
 
     #[test]
     #[ignore]
diff --git a/crates/oxide/src/fast_skip.rs b/crates/oxide/src/fast_skip.rs
index 54930548c..488e61bd6 100644
--- a/crates/oxide/src/fast_skip.rs
+++ b/crates/oxide/src/fast_skip.rs
@@ -10,7 +10,7 @@ pub fn fast_skip(cursor: &Cursor) -> Option<usize> {
         return None;
     }
 
-    if !cursor.curr().is_ascii_whitespace() {
+    if !cursor.curr.is_ascii_whitespace() {
         return None;
     }
 
diff --git a/crates/oxide/src/glob.rs b/crates/oxide/src/glob.rs
index 9a6296bcb..ca73b5ee1 100644
--- a/crates/oxide/src/glob.rs
+++ b/crates/oxide/src/glob.rs
@@ -1,17 +1,11 @@
+use fast_glob::glob_match;
 use fxhash::{FxHashMap, FxHashSet};
-use std::path::PathBuf;
+use std::path::{Path, PathBuf};
 use tracing::event;
 
-#[derive(Debug, Clone, PartialEq)]
-pub struct GlobEntry {
-    /// Base path of the glob
-    pub base: String,
+use crate::GlobEntry;
 
-    /// Glob pattern
-    pub pattern: String,
-}
-
-pub fn hoist_static_glob_parts(entries: &Vec<GlobEntry>, emit_parent_glob: bool) -> Vec<GlobEntry> {
+pub fn hoist_static_glob_parts(entries: &Vec<GlobEntry>) -> Vec<GlobEntry> {
     let mut result = vec![];
 
     for entry in entries {
@@ -46,7 +40,7 @@ pub fn hoist_static_glob_parts(entries: &Vec<GlobEntry>, emit_parent_glob: bool)
         // If the base path is a file, then we want to move the file to the pattern, and point the
         // directory to the base. This is necessary for file watchers that can only listen to
         // folders.
-        if emit_parent_glob && pattern.is_empty() && base.is_file() {
+        if pattern.is_empty() && base.is_file() {
             result.push(GlobEntry {
                 // SAFETY: `parent()` will be available because we verify `base` is a file, thus a
                 // parent folder exists.
@@ -89,7 +83,7 @@ pub fn hoist_static_glob_parts(entries: &Vec<GlobEntry>, emit_parent_glob: bool)
 /// tailwind --pwd ./project/components --content "**/*.js"
 /// ```
 pub fn optimize_patterns(entries: &Vec<GlobEntry>) -> Vec<GlobEntry> {
-    let entries = hoist_static_glob_parts(entries, true);
+    let entries = hoist_static_glob_parts(entries);
 
     // Track all base paths and their patterns. Later we will turn them back into `GlobalEntry`s.
     let mut pattern_map: FxHashMap<String, FxHashSet<String>> = FxHashMap::default();
@@ -138,23 +132,11 @@ pub fn optimize_patterns(entries: &Vec<GlobEntry>) -> Vec<GlobEntry> {
 // using `*`.
 //
 // E.g.:
-//
-//  Input:
-//  - `../project-b/**/*.html`
-//  - `../project-b/**/*.js`
-//
-//  Split results in:
-//  - `("../project-b", "**/*.html")`
-//  - `("../project-b", "**/*.js")`
-//
-// A static file glob should also be considered as a dynamic part.
-//
-// E.g.:
-//
-// Input: `../project-b/foo/bar.html`
-// Split results in: `("../project-b/foo", "bar.html")`
-//
-pub fn split_pattern(pattern: &str) -> (Option<String>, Option<String>) {
+//  Original input: `../project-b/**/*.{html,js}`
+//  Expanded input: `../project-b/**/*.html` & `../project-b/**/*.js`
+//  Split on first input: ("../project-b", "**/*.html")
+//  Split on second input: ("../project-b", "**/*.js")
+fn split_pattern(pattern: &str) -> (Option<String>, Option<String>) {
     // No dynamic parts, so we can just return the input as-is.
     if !pattern.contains('*') {
         return (Some(pattern.to_owned()), None);
@@ -186,12 +168,19 @@ pub fn split_pattern(pattern: &str) -> (Option<String>, Option<String>) {
     (static_part, dynamic_part)
 }
 
+pub fn path_matches_globs(path: &Path, globs: &[GlobEntry]) -> bool {
+    let path = path.to_string_lossy();
+
+    globs
+        .iter()
+        .any(|g| glob_match(format!("{}/{}", g.base, g.pattern), path.as_bytes()))
+}
+
 #[cfg(test)]
 mod tests {
     use super::optimize_patterns;
     use crate::GlobEntry;
     use bexpand::Expression;
-    use pretty_assertions::assert_eq;
     use std::process::Command;
     use std::{fs, path};
     use tempfile::tempdir;
diff --git a/crates/oxide/src/lib.rs b/crates/oxide/src/lib.rs
index d7f0321af..9088763c3 100644
--- a/crates/oxide/src/lib.rs
+++ b/crates/oxide/src/lib.rs
@@ -1,3 +1,22 @@
+use crate::glob::hoist_static_glob_parts;
+use crate::scanner::allowed_paths::resolve_paths;
+use crate::scanner::detect_sources::DetectSources;
+use bexpand::Expression;
+use bstr::ByteSlice;
+use extractor::{Extracted, Extractor};
+use fast_glob::glob_match;
+use fxhash::{FxHashMap, FxHashSet};
+use glob::optimize_patterns;
+use paths::Path;
+use rayon::prelude::*;
+use scanner::allowed_paths::read_dir;
+use std::borrow::Cow;
+use std::fs;
+use std::path::PathBuf;
+use std::sync;
+use std::time::SystemTime;
+use tracing::event;
+
 pub mod cursor;
 pub mod extractor;
 pub mod fast_skip;
@@ -6,7 +25,554 @@ pub mod paths;
 pub mod scanner;
 pub mod throughput;
 
-pub use glob::GlobEntry;
-pub use scanner::sources::PublicSourceEntry;
-pub use scanner::ChangedContent;
-pub use scanner::Scanner;
+static SHOULD_TRACE: sync::LazyLock<bool> = sync::LazyLock::new(
+    || matches!(std::env::var("DEBUG"), Ok(value) if value.eq("*") || (value.contains("tailwindcss:oxide") && !value.contains("-tailwindcss:oxide"))),
+);
+
+fn init_tracing() {
+    if !*SHOULD_TRACE {
+        return;
+    }
+
+    _ = tracing_subscriber::fmt()
+        .with_max_level(tracing::Level::INFO)
+        .with_span_events(tracing_subscriber::fmt::format::FmtSpan::ACTIVE)
+        .compact()
+        .try_init();
+}
+
+#[derive(Debug, Clone)]
+pub enum ChangedContent<'a> {
+    File(PathBuf, Cow<'a, str>),
+    Content(String, Cow<'a, str>),
+}
+
+#[derive(Debug, Clone)]
+pub struct ScanOptions {
+    /// Base path to start scanning from
+    pub base: Option<String>,
+    /// Glob sources
+    pub sources: Vec<GlobEntry>,
+}
+
+#[derive(Debug, Clone)]
+pub struct ScanResult {
+    pub candidates: Vec<String>,
+    pub files: Vec<String>,
+    pub globs: Vec<GlobEntry>,
+}
+
+#[derive(Debug, Clone, PartialEq)]
+pub struct GlobEntry {
+    pub base: String,
+    pub pattern: String,
+}
+
+#[derive(Debug, Clone, Default)]
+pub struct Scanner {
+    /// Glob sources
+    sources: Option<Vec<GlobEntry>>,
+
+    /// Scanner is ready to scan. We delay the file system traversal for detecting all files until
+    /// we actually need them.
+    ready: bool,
+
+    /// All files that we have to scan
+    files: Vec<PathBuf>,
+
+    /// All directories, sub-directories, etc… we saw during source detection
+    dirs: Vec<PathBuf>,
+
+    /// All generated globs
+    globs: Vec<GlobEntry>,
+
+    /// Track file modification times
+    mtimes: FxHashMap<PathBuf, SystemTime>,
+
+    /// Track unique set of candidates
+    candidates: FxHashSet<String>,
+}
+
+impl Scanner {
+    pub fn new(sources: Option<Vec<GlobEntry>>) -> Self {
+        Self {
+            sources,
+            ..Default::default()
+        }
+    }
+
+    pub fn scan(&mut self) -> Vec<String> {
+        init_tracing();
+
+        self.prepare();
+        self.compute_candidates();
+
+        let mut candidates: Vec<String> = self.candidates.clone().into_par_iter().collect();
+        candidates.par_sort_unstable();
+
+        candidates
+    }
+
+    #[tracing::instrument(skip_all)]
+    pub fn scan_content(&mut self, changed_content: Vec<ChangedContent>) -> Vec<String> {
+        self.prepare();
+        let candidates = parse_all_blobs(read_all_files(changed_content));
+
+        let mut new_candidates = vec![];
+        for candidate in candidates {
+            if self.candidates.contains(&candidate) {
+                continue;
+            }
+            self.candidates.insert(candidate.clone());
+            new_candidates.push(candidate);
+        }
+
+        new_candidates
+    }
+
+    #[tracing::instrument(skip_all)]
+    pub fn get_candidates_with_positions(
+        &mut self,
+        changed_content: ChangedContent,
+    ) -> Vec<(String, usize)> {
+        self.prepare();
+
+        let content = read_changed_content(changed_content).unwrap_or_default();
+        let original_content = &content;
+
+        // Workaround for legacy upgrades:
+        //
+        // `-[]` won't parse in the new parser (`[…]` must contain _something_), but we do need it
+        // for people using `group-[]` (which we will later replace with `in-[.group]` instead).
+        let content = content.replace("-[]", "XYZ");
+        let offset = content.as_ptr() as usize;
+
+        let mut extractor = Extractor::new(&content[..]);
+
+        extractor
+            .extract()
+            .into_par_iter()
+            .flat_map(|extracted| match extracted {
+                Extracted::Candidate(s) => {
+                    let i = s.as_ptr() as usize - offset;
+                    let original = &original_content[i..i + s.len()];
+                    if original.contains_str("-[]") {
+                        return Some(unsafe {
+                            (String::from_utf8_unchecked(original.to_vec()), i)
+                        });
+                    }
+
+                    // SAFETY: When we parsed the candidates, we already guaranteed that the byte
+                    // slices are valid, therefore we don't have to re-check here when we want to
+                    // convert it back to a string.
+                    Some(unsafe { (String::from_utf8_unchecked(s.to_vec()), i) })
+                }
+
+                _ => None,
+            })
+            .collect()
+    }
+
+    #[tracing::instrument(skip_all)]
+    pub fn get_files(&mut self) -> Vec<String> {
+        self.prepare();
+
+        self.files
+            .par_iter()
+            .filter_map(|x| Path::from(x.clone()).canonicalize().ok())
+            .map(|x| x.to_string())
+            .collect()
+    }
+
+    #[tracing::instrument(skip_all)]
+    pub fn get_globs(&mut self) -> Vec<GlobEntry> {
+        self.prepare();
+
+        self.globs.clone()
+    }
+
+    #[tracing::instrument(skip_all)]
+    fn compute_candidates(&mut self) {
+        let mut changed_content = vec![];
+
+        let current_mtimes = self
+            .files
+            .par_iter()
+            .map(|path| {
+                fs::metadata(path)
+                    .and_then(|m| m.modified())
+                    .unwrap_or(SystemTime::now())
+            })
+            .collect::<Vec<_>>();
+
+        for (idx, path) in self.files.iter().enumerate() {
+            let current_time = current_mtimes[idx];
+            let previous_time = self.mtimes.insert(path.clone(), current_time);
+
+            let should_scan_file = match previous_time {
+                // Time has changed, so we need to re-scan the file
+                Some(prev) if prev != current_time => true,
+
+                // File was in the cache, no need to re-scan
+                Some(_) => false,
+
+                // File didn't exist before, so we need to scan it
+                None => true,
+            };
+
+            if should_scan_file {
+                let extension = path.extension().unwrap_or_default().to_string_lossy();
+                changed_content.push(ChangedContent::File(path.to_path_buf(), extension))
+            }
+        }
+
+        if !changed_content.is_empty() {
+            let candidates = parse_all_blobs(read_all_files(changed_content));
+            self.candidates.par_extend(candidates);
+        }
+    }
+
+    // Ensures that all files/globs are resolved and the scanner is ready to scan
+    // content for candidates.
+    fn prepare(&mut self) {
+        if self.ready {
+            self.check_for_new_files();
+            return;
+        }
+
+        self.scan_sources();
+
+        self.ready = true;
+    }
+
+    #[tracing::instrument(skip_all)]
+    fn check_for_new_files(&mut self) {
+        let current_mtimes = self
+            .dirs
+            .par_iter()
+            .map(|path| {
+                fs::metadata(path)
+                    .and_then(|m| m.modified())
+                    .unwrap_or(SystemTime::now())
+            })
+            .collect::<Vec<_>>();
+
+        let mut modified_dirs: Vec<PathBuf> = vec![];
+
+        // Check all directories to see if they were modified
+        for (idx, path) in self.dirs.iter().enumerate() {
+            let current_time = current_mtimes[idx];
+            let previous_time = self.mtimes.insert(path.clone(), current_time);
+
+            let should_scan = match previous_time {
+                // Time has changed, so we need to re-scan the file
+                Some(prev) if prev != current_time => true,
+
+                // File was in the cache, no need to re-scan
+                Some(_) => false,
+
+                // File didn't exist before, so we need to scan it
+                None => true,
+            };
+
+            if should_scan {
+                modified_dirs.push(path.clone());
+            }
+        }
+
+        // Scan all modified directories for their immediate files
+        let mut known = FxHashSet::from_iter(self.files.iter().chain(self.dirs.iter()).cloned());
+
+        while !modified_dirs.is_empty() {
+            let new_entries = modified_dirs
+                .iter()
+                .flat_map(|dir| read_dir(dir, Some(1)))
+                .map(|entry| entry.path().to_owned())
+                .filter(|path| !known.contains(path))
+                .collect::<Vec<_>>();
+
+            modified_dirs.clear();
+
+            for path in new_entries {
+                if path.is_file() {
+                    known.insert(path.clone());
+                    self.files.push(path);
+                } else if path.is_dir() {
+                    known.insert(path.clone());
+                    self.dirs.push(path.clone());
+
+                    // Recursively scan the new directory for files
+                    modified_dirs.push(path);
+                }
+            }
+        }
+    }
+
+    #[tracing::instrument(skip_all)]
+    fn scan_sources(&mut self) {
+        let Some(sources) = &self.sources else {
+            return;
+        };
+
+        if sources.is_empty() {
+            return;
+        }
+
+        // Expand glob patterns and create new `GlobEntry` instances for each expanded pattern.
+        let sources = sources
+            .iter()
+            .flat_map(|source| {
+                let expression: Result<Expression, _> = source.pattern[..].try_into();
+                let Ok(expression) = expression else {
+                    return vec![source.clone()];
+                };
+
+                expression
+                    .into_iter()
+                    .filter_map(Result::ok)
+                    .map(move |pattern| GlobEntry {
+                        base: source.base.clone(),
+                        pattern: pattern.into(),
+                    })
+                    .collect::<Vec<_>>()
+            })
+            .collect::<Vec<_>>();
+
+        // Partition sources into sources that should be promoted to auto source detection and
+        // sources that should be resolved as globs.
+        let (auto_sources, glob_sources): (Vec<_>, Vec<_>) = sources.iter().partition(|source| {
+            // If a glob ends with `/**/*`, then we just want to register the base path as a new
+            // base. Essentially converting it to use auto source detection.
+            if source.pattern.ends_with("**/*") {
+                return true;
+            }
+
+            // Directories should be promoted to auto source detection
+            if PathBuf::from(&source.base).join(&source.pattern).is_dir() {
+                return true;
+            }
+
+            false
+        });
+
+        fn join_paths(a: &str, b: &str) -> PathBuf {
+            let mut tmp = a.to_owned();
+            let b = b.trim_end_matches("**/*").trim_end_matches('/');
+
+            if b.starts_with('/') {
+                return PathBuf::from(b);
+            }
+
+            // On Windows a path like C:/foo.txt is absolute but C:foo.txt is not
+            // (the 2nd is relative to the CWD)
+            if b.chars().nth(1) == Some(':') && b.chars().nth(2) == Some('/') {
+                return PathBuf::from(b);
+            }
+
+            tmp += "/";
+            tmp += b;
+
+            PathBuf::from(&tmp)
+        }
+
+        for path in auto_sources.iter().filter_map(|source| {
+            dunce::canonicalize(join_paths(&source.base, &source.pattern)).ok()
+        }) {
+            // Insert a glob for the base path, so we can see new files/folders in the directory itself.
+            self.globs.push(GlobEntry {
+                base: path.to_string_lossy().into(),
+                pattern: "*".into(),
+            });
+
+            // Detect all files/folders in the directory
+            let detect_sources = DetectSources::new(path);
+
+            let (files, globs, dirs) = detect_sources.detect();
+            self.files.extend(files);
+            self.globs.extend(globs);
+            self.dirs.extend(dirs);
+        }
+
+        // Turn `Vec<&GlobEntry>` in `Vec<GlobEntry>`
+        let glob_sources: Vec<_> = glob_sources.into_iter().cloned().collect();
+        let hoisted = hoist_static_glob_parts(&glob_sources);
+
+        for source in &hoisted {
+            // If the pattern is empty, then the base points to a specific file or folder already
+            // if it doesn't contain any dynamic parts. In that case we can use the base as the
+            // pattern.
+            //
+            // Otherwise we need to combine the base and the pattern, otherwise a pattern that
+            // looks like `*.html`, will never match a path that looks like
+            // `/my-project/project-a/index.html`, because it contains `/`.
+            //
+            // We can't prepend `**/`, because then `/my-project/project-a/nested/index.html` would
+            // match as well.
+            //
+            // Instead we combine the base and the pattern as a single glob pattern.
+            let mut full_pattern = source.base.clone().replace('\\', "/");
+
+            if !source.pattern.is_empty() {
+                full_pattern.push('/');
+                full_pattern.push_str(&source.pattern);
+            }
+
+            let base = PathBuf::from(&source.base);
+            for entry in resolve_paths(&base) {
+                let Some(file_type) = entry.file_type() else {
+                    continue;
+                };
+
+                if !file_type.is_file() {
+                    continue;
+                }
+
+                let file_path = entry.into_path();
+
+                let Some(file_path_str) = file_path.to_str() else {
+                    continue;
+                };
+
+                let file_path_str = file_path_str.replace('\\', "/");
+
+                if glob_match(&full_pattern, &file_path_str) {
+                    self.files.push(file_path);
+                }
+            }
+        }
+
+        self.globs.extend(hoisted);
+
+        // Re-optimize the globs to reduce the number of patterns we have to scan.
+        self.globs = optimize_patterns(&self.globs);
+    }
+}
+
+fn read_changed_content(c: ChangedContent) -> Option<Vec<u8>> {
+    let (content, extension) = match c {
+        ChangedContent::File(file, extension) => match std::fs::read(&file) {
+            Ok(content) => (content, extension),
+            Err(e) => {
+                event!(tracing::Level::ERROR, "Failed to read file: {:?}", e);
+                return None;
+            }
+        },
+
+        ChangedContent::Content(contents, extension) => (contents.into_bytes(), extension),
+    };
+
+    Some(pre_process_input(&content, &extension))
+}
+
+pub fn pre_process_input(content: &[u8], extension: &str) -> Vec<u8> {
+    use crate::extractor::pre_processors::*;
+
+    match extension {
+        "clj" | "cljs" | "cljc" => Clojure.process(content),
+        "cshtml" | "razor" => Razor.process(content),
+        "haml" => Haml.process(content),
+        "json" => Json.process(content),
+        "pug" => Pug.process(content),
+        "rb" | "erb" => Ruby.process(content),
+        "slim" => Slim.process(content),
+        "svelte" => Svelte.process(content),
+        "vue" => Vue.process(content),
+        _ => content.to_vec(),
+    }
+}
+
+#[tracing::instrument(skip_all)]
+fn read_all_files(changed_content: Vec<ChangedContent>) -> Vec<Vec<u8>> {
+    event!(
+        tracing::Level::INFO,
+        "Reading {:?} file(s)",
+        changed_content.len()
+    );
+
+    changed_content
+        .into_par_iter()
+        .filter_map(read_changed_content)
+        .collect()
+}
+
+#[tracing::instrument(skip_all)]
+fn parse_all_blobs(blobs: Vec<Vec<u8>>) -> Vec<String> {
+    let mut result: Vec<_> = blobs
+        .par_iter()
+        .flat_map(|blob| blob.par_split(|x| *x == b'\n'))
+        .filter_map(|blob| {
+            if blob.is_empty() {
+                return None;
+            }
+
+            let extracted = crate::extractor::Extractor::new(blob).extract();
+            if extracted.is_empty() {
+                return None;
+            }
+
+            Some(FxHashSet::from_iter(extracted.into_iter().map(
+                |x| match x {
+                    Extracted::Candidate(bytes) => bytes,
+                    Extracted::CssVariable(bytes) => bytes,
+                },
+            )))
+        })
+        .reduce(Default::default, |mut a, b| {
+            a.extend(b);
+            a
+        })
+        .into_iter()
+        .map(|s| unsafe { String::from_utf8_unchecked(s.to_vec()) })
+        .collect();
+
+    // SAFETY: Unstable sort is faster and in this scenario it's also safe because we are
+    //         guaranteed to have unique candidates.
+    result.par_sort_unstable();
+
+    result
+}
+
+#[cfg(test)]
+mod tests {
+    use crate::Scanner;
+
+    #[test]
+    fn test_positions() {
+        let mut scanner = Scanner::new(None);
+
+        for (input, expected) in [
+            // Before migrations
+            (
+                r#"<div class="!tw__flex sm:!tw__block tw__bg-gradient-to-t flex tw:[color:red] group-[]:tw__flex"#,
+                vec![
+                    ("class".to_string(), 5),
+                    ("!tw__flex".to_string(), 12),
+                    ("sm:!tw__block".to_string(), 22),
+                    ("tw__bg-gradient-to-t".to_string(), 36),
+                    ("flex".to_string(), 57),
+                    ("tw:[color:red]".to_string(), 62),
+                    ("group-[]:tw__flex".to_string(), 77),
+                ],
+            ),
+            // After migrations
+            (
+                r#"<div class="tw:flex! tw:sm:block! tw:bg-linear-to-t flex tw:[color:red] tw:in-[.tw\:group]:flex"></div>"#,
+                vec![
+                    ("class".to_string(), 5),
+                    ("tw:flex!".to_string(), 12),
+                    ("tw:sm:block!".to_string(), 21),
+                    ("tw:bg-linear-to-t".to_string(), 34),
+                    ("flex".to_string(), 52),
+                    ("tw:[color:red]".to_string(), 57),
+                    ("tw:in-[.tw\\:group]:flex".to_string(), 72),
+                ],
+            ),
+        ] {
+            let candidates = scanner.get_candidates_with_positions(crate::ChangedContent::Content(
+                input.to_string(),
+                "html".into(),
+            ));
+            assert_eq!(candidates, expected);
+        }
+    }
+}
diff --git a/crates/oxide/src/scanner/allowed_paths.rs b/crates/oxide/src/scanner/allowed_paths.rs
new file mode 100644
index 000000000..b906335f8
--- /dev/null
+++ b/crates/oxide/src/scanner/allowed_paths.rs
@@ -0,0 +1,128 @@
+use ignore::{DirEntry, WalkBuilder};
+use std::{path::Path, sync};
+
+static BINARY_EXTENSIONS: sync::LazyLock<Vec<&'static str>> = sync::LazyLock::new(|| {
+    include_str!("fixtures/binary-extensions.txt")
+        .trim()
+        .lines()
+        .collect()
+});
+
+static IGNORED_EXTENSIONS: sync::LazyLock<Vec<&'static str>> = sync::LazyLock::new(|| {
+    include_str!("fixtures/ignored-extensions.txt")
+        .trim()
+        .lines()
+        .collect()
+});
+
+static IGNORED_FILES: sync::LazyLock<Vec<&'static str>> = sync::LazyLock::new(|| {
+    include_str!("fixtures/ignored-files.txt")
+        .trim()
+        .lines()
+        .collect()
+});
+
+static IGNORED_CONTENT_DIRS: sync::LazyLock<Vec<&'static str>> =
+    sync::LazyLock::new(|| vec![".git"]);
+
+#[tracing::instrument(skip_all)]
+pub fn resolve_allowed_paths(root: &Path) -> impl Iterator<Item = DirEntry> {
+    // Read the directory recursively with no depth limit
+    read_dir(root, None)
+}
+
+#[tracing::instrument(skip_all)]
+pub fn resolve_paths(root: &Path) -> impl Iterator<Item = DirEntry> {
+    create_walk_builder(root).build().filter_map(Result::ok)
+}
+
+pub fn read_dir(root: &Path, depth: Option<usize>) -> impl Iterator<Item = DirEntry> {
+    create_walk_builder(root)
+        .max_depth(depth)
+        .filter_entry(move |entry| match entry.file_type() {
+            Some(file_type) if file_type.is_dir() => match entry.file_name().to_str() {
+                Some(dir) => !IGNORED_CONTENT_DIRS.contains(&dir),
+                None => false,
+            },
+            Some(file_type) if file_type.is_file() || file_type.is_symlink() => {
+                is_allowed_content_path(entry.path())
+            }
+            _ => false,
+        })
+        .build()
+        .filter_map(Result::ok)
+}
+
+fn create_walk_builder(root: &Path) -> WalkBuilder {
+    let mut builder = WalkBuilder::new(root);
+
+    // Scan hidden files / directories
+    builder.hidden(false);
+
+    // By default, allow .gitignore files to be used regardless of whether or not
+    // a .git directory is present. This is an optimization for when projects
+    // are first created and may not be in a git repo yet.
+    builder.require_git(false);
+
+    // Don't descend into .git directories inside the root folder
+    // This is necessary when `root` contains the `.git` dir.
+    builder.filter_entry(|entry| entry.file_name() != ".git");
+
+    // If we are in a git repo then require it to ensure that only rules within
+    // the repo are used. For example, we don't want to consider a .gitignore file
+    // in the user's home folder if we're in a git repo.
+    //
+    // The alternative is using a call like `.parents(false)` but that will
+    // prevent looking at parent directories for .gitignore files from within
+    // the repo and that's not what we want.
+    //
+    // For example, in a project with this structure:
+    //
+    // home
+    // .gitignore
+    //  my-project
+    //   .gitignore
+    //   apps
+    //     .gitignore
+    //     web
+    //       {root}
+    //
+    // We do want to consider all .gitignore files listed:
+    // - home/.gitignore
+    // - my-project/.gitignore
+    // - my-project/apps/.gitignore
+    //
+    // However, if a repo is initialized inside my-project then only the following
+    // make sense for consideration:
+    // - my-project/.gitignore
+    // - my-project/apps/.gitignore
+    //
+    // Setting the require_git(true) flag conditionally allows us to do this.
+    for parent in root.ancestors() {
+        if parent.join(".git").exists() {
+            builder.require_git(true);
+            break;
+        }
+    }
+
+    builder
+}
+
+pub fn is_allowed_content_path(path: &Path) -> bool {
+    // Skip known ignored files
+    if path
+        .file_name()
+        .unwrap()
+        .to_str()
+        .map(|s| IGNORED_FILES.contains(&s))
+        .unwrap_or(false)
+    {
+        return false;
+    }
+
+    // Skip known ignored extensions
+    path.extension()
+        .map(|s| s.to_str().unwrap_or_default())
+        .map(|ext| !IGNORED_EXTENSIONS.contains(&ext) && !BINARY_EXTENSIONS.contains(&ext))
+        .unwrap_or(false)
+}
diff --git a/crates/oxide/src/scanner/auto_source_detection.rs b/crates/oxide/src/scanner/auto_source_detection.rs
deleted file mode 100644
index 0d723a1ab..000000000
--- a/crates/oxide/src/scanner/auto_source_detection.rs
+++ /dev/null
@@ -1,71 +0,0 @@
-use ignore::gitignore::{Gitignore, GitignoreBuilder};
-use std::sync;
-
-/// All the default rules for auto source detection.
-///
-/// This includes:
-///
-/// - Ignoring common content directories like `.git` and `node_modules`
-/// - Ignoring file extensions we definitely don't want to include like `.css` and `.scss`
-/// - Ignoring common binary file extensions like `.png` and `.jpg`
-/// - Ignoring common files like `yarn.lock` and `package-lock.json`
-///
-pub static RULES: sync::LazyLock<Vec<Gitignore>> = sync::LazyLock::new(|| {
-    let mut builder = GitignoreBuilder::new("");
-
-    builder.add_line(None, &IGNORED_CONTENT_DIRS_GLOB).unwrap();
-    builder.add_line(None, &IGNORED_EXTENSIONS_GLOB).unwrap();
-    builder.add_line(None, &IGNORED_FILES_GLOB).unwrap();
-
-    // Ensure these rules do not match on folder names
-    let mut file_only_builder = GitignoreBuilder::new("");
-    file_only_builder
-        .only_on_files(true)
-        .add_line(None, &BINARY_EXTENSIONS_GLOB)
-        .unwrap();
-
-    vec![builder.build().unwrap(), file_only_builder.build().unwrap()]
-});
-
-pub static IGNORED_CONTENT_DIRS: sync::LazyLock<Vec<&'static str>> = sync::LazyLock::new(|| {
-    include_str!("fixtures/ignored-content-dirs.txt")
-        .trim()
-        .lines()
-        .collect()
-});
-
-static IGNORED_CONTENT_DIRS_GLOB: sync::LazyLock<String> =
-    sync::LazyLock::new(|| format!("{{{}}}/", IGNORED_CONTENT_DIRS.join(",")));
-
-static IGNORED_EXTENSIONS_GLOB: sync::LazyLock<String> = sync::LazyLock::new(|| {
-    format!(
-        "*.{{{}}}",
-        include_str!("fixtures/ignored-extensions.txt")
-            .trim()
-            .lines()
-            .collect::<Vec<&str>>()
-            .join(",")
-    )
-});
-
-pub static BINARY_EXTENSIONS_GLOB: sync::LazyLock<String> = sync::LazyLock::new(|| {
-    format!(
-        "*.{{{}}}",
-        include_str!("fixtures/binary-extensions.txt")
-            .trim()
-            .lines()
-            .collect::<Vec<&str>>()
-            .join(",")
-    )
-});
-
-static IGNORED_FILES_GLOB: sync::LazyLock<String> = sync::LazyLock::new(|| {
-    format!(
-        "{{{}}}",
-        include_str!("fixtures/ignored-files.txt")
-            .trim()
-            .lines()
-            .collect::<Vec<&str>>()
-            .join(",")
-    )
-});
diff --git a/crates/oxide/src/scanner/detect_sources.rs b/crates/oxide/src/scanner/detect_sources.rs
index 6cfdd49cc..6828e8eca 100644
--- a/crates/oxide/src/scanner/detect_sources.rs
+++ b/crates/oxide/src/scanner/detect_sources.rs
@@ -1,12 +1,16 @@
-use crate::scanner::auto_source_detection::IGNORED_CONTENT_DIRS;
+use crate::scanner::allowed_paths::{is_allowed_content_path, resolve_allowed_paths};
 use crate::GlobEntry;
 use fxhash::FxHashSet;
-use globwalk::DirEntry;
 use std::cmp::Ordering;
 use std::path::PathBuf;
 use std::sync;
 use walkdir::WalkDir;
 
+#[derive(Debug, Clone)]
+pub struct DetectSources {
+    base: PathBuf,
+}
+
 static KNOWN_EXTENSIONS: sync::LazyLock<Vec<&'static str>> = sync::LazyLock::new(|| {
     include_str!("fixtures/template-extensions.txt")
         .trim()
@@ -18,143 +22,200 @@ static KNOWN_EXTENSIONS: sync::LazyLock<Vec<&'static str>> = sync::LazyLock::new
         .collect()
 });
 
-// Sorting to make sure that we always see the directories before the files. Also sorting
-// alphabetically by default.
-fn sort_by_dir_and_name(a: &DirEntry, z: &DirEntry) -> Ordering {
-    match (a.file_type().is_dir(), z.file_type().is_dir()) {
-        (true, false) => Ordering::Less,
-        (false, true) => Ordering::Greater,
-        _ => a.file_name().cmp(z.file_name()),
+impl DetectSources {
+    pub fn new(base: PathBuf) -> Self {
+        Self { base }
     }
-}
 
-pub fn resolve_globs(
-    base: PathBuf,
-    dirs: &FxHashSet<PathBuf>,
-    extensions: &FxHashSet<String>,
-) -> Vec<GlobEntry> {
-    // A list of known extensions + a list of extensions we found in the project.
-    let mut found_extensions: FxHashSet<String> =
-        FxHashSet::from_iter(KNOWN_EXTENSIONS.iter().map(|x| x.to_string()));
-    found_extensions.extend(extensions.iter().cloned());
+    pub fn detect(&self) -> (Vec<PathBuf>, Vec<GlobEntry>, Vec<PathBuf>) {
+        let (files, dirs) = self.resolve_files();
+        let globs = self.resolve_globs(&dirs);
 
-    // A list of directory names where we can't use globs, but we should track each file
-    // individually instead. This is because these directories are often used for both source and
-    // destination files.
-    let forced_static_directories: FxHashSet<PathBuf> =
-        FxHashSet::from_iter(vec![base.join("public")]);
+        (files, globs, dirs)
+    }
 
-    // All directories where we can safely use deeply nested globs to watch all files.
-    // In other comments we refer to these as "deep glob directories" or similar.
-    //
-    // E.g.: `./src/**/*.{html,js}`
-    let mut deep_globable_directories: FxHashSet<PathBuf> = Default::default();
+    fn resolve_files(&self) -> (Vec<PathBuf>, Vec<PathBuf>) {
+        let mut files: Vec<PathBuf> = vec![];
+        let mut dirs: Vec<PathBuf> = vec![];
 
-    // All directories where we can only use shallow globs to watch all direct files but not
-    // folders.
-    // In other comments we refer to these as "shallow glob directories" or similar.
-    //
-    // E.g.: `./src/*/*.{html,js}`
-    let mut shallow_globable_directories: FxHashSet<PathBuf> = Default::default();
+        for entry in resolve_allowed_paths(&self.base) {
+            let Some(file_type) = entry.file_type() else {
+                continue;
+            };
 
-    // Collect all valid paths from the root. This will already filter out ignored files, unknown
-    // extensions and binary files.
-    let mut it = WalkDir::new(&base)
-        .sort_by(sort_by_dir_and_name)
-        .into_iter();
-
-    // Figure out all the shallow globable directories.
-    while let Some(Ok(entry)) = it.next() {
-        let path = entry.path();
-        if !path.is_dir() {
-            continue;
+            if file_type.is_file() {
+                files.push(entry.into_path());
+            } else if file_type.is_dir() {
+                dirs.push(entry.into_path());
+            }
         }
 
-        if !dirs.contains(path) {
-            let mut path = path;
-            while let Some(parent) = path.parent() {
-                if parent == base {
-                    break;
-                }
+        (files, dirs)
+    }
 
-                shallow_globable_directories.insert(parent.to_path_buf());
-                path = parent
+    fn resolve_globs(&self, dirs: &Vec<PathBuf>) -> Vec<GlobEntry> {
+        let allowed_paths = FxHashSet::from_iter(dirs);
+
+        // A list of directory names where we can't use globs, but we should track each file
+        // individually instead. This is because these directories are often used for both source and
+        // destination files.
+        let mut forced_static_directories = vec![self.base.join("public")];
+
+        // A list of known extensions + a list of extensions we found in the project.
+        let mut found_extensions =
+            FxHashSet::from_iter(KNOWN_EXTENSIONS.iter().map(|x| x.to_string()));
+
+        // All root directories.
+        let mut root_directories = FxHashSet::from_iter(vec![self.base.clone()]);
+
+        // All directories where we can safely use deeply nested globs to watch all files.
+        // In other comments we refer to these as "deep glob directories" or similar.
+        //
+        // E.g.: `./src/**/*.{html,js}`
+        let mut deep_globable_directories: FxHashSet<PathBuf> = FxHashSet::default();
+
+        // All directories where we can only use shallow globs to watch all direct files but not
+        // folders.
+        // In other comments we refer to these as "shallow glob directories" or similar.
+        //
+        // E.g.: `./src/*/*.{html,js}`
+        let mut shallow_globable_directories: FxHashSet<PathBuf> = FxHashSet::default();
+
+        // Collect all valid paths from the root. This will already filter out ignored files, unknown
+        // extensions and binary files.
+        let mut it = WalkDir::new(&self.base)
+            // Sorting to make sure that we always see the directories before the files. Also sorting
+            // alphabetically by default.
+            .sort_by(
+                |a, z| match (a.file_type().is_dir(), z.file_type().is_dir()) {
+                    (true, false) => Ordering::Less,
+                    (false, true) => Ordering::Greater,
+                    _ => a.file_name().cmp(z.file_name()),
+                },
+            )
+            .into_iter();
+
+        // We are only interested in valid entries
+        while let Some(Ok(entry)) = it.next() {
+            // Ignore known directories that we don't want to traverse into.
+            if entry.file_type().is_dir() && entry.file_name() == ".git" {
+                it.skip_current_dir();
+                continue;
             }
 
-            it.skip_current_dir();
+            if entry.file_type().is_dir() {
+                // If we are in a directory where we know that we can't use any globs, then we have to
+                // track each file individually.
+                if forced_static_directories.contains(&entry.path().to_path_buf()) {
+                    forced_static_directories.push(entry.path().to_path_buf());
+                    root_directories.insert(entry.path().to_path_buf());
+                    continue;
+                }
+
+                // Although normally very unlikely, if running inside a dockerfile
+                // the current directory might be "/" with no parent
+                if let Some(parent) = entry.path().parent() {
+                    // If we are in a directory where the parent is a forced static directory, then this
+                    // will become a forced static directory as well.
+                    if forced_static_directories.contains(&parent.to_path_buf()) {
+                        forced_static_directories.push(entry.path().to_path_buf());
+                        root_directories.insert(entry.path().to_path_buf());
+                        continue;
+                    }
+                }
+
+                // If we are in a directory, and the directory is git ignored, then we don't have to
+                // descent into the directory. However, we have to make sure that we mark the _parent_
+                // directory as a shallow glob directory because using deep globs from any of the
+                // parent directories will include this ignored directory which should not be the case.
+                //
+                // Another important part is that if one of the ignored directories is a deep glob
+                // directory, then all of its parents (until the root) should be marked as shallow glob
+                // directories as well.
+                if !allowed_paths.contains(&entry.path().to_path_buf()) {
+                    let mut parent = entry.path().parent();
+                    while let Some(parent_path) = parent {
+                        // If the parent is already marked as a valid deep glob directory, then we have
+                        // to mark it as a shallow glob directory instead, because we won't be able to
+                        // use deep globs for this directory anymore.
+                        if deep_globable_directories.contains(parent_path) {
+                            deep_globable_directories.remove(parent_path);
+                            shallow_globable_directories.insert(parent_path.to_path_buf());
+                        }
+
+                        // If we reached the root, then we can stop.
+                        if parent_path == self.base {
+                            break;
+                        }
+
+                        // Mark the parent directory as a shallow glob directory and continue with its
+                        // parent.
+                        shallow_globable_directories.insert(parent_path.to_path_buf());
+                        parent = parent_path.parent();
+                    }
+
+                    it.skip_current_dir();
+                    continue;
+                }
+
+                // If we are in a directory that is not git ignored, then we can mark this directory as
+                // a valid deep glob directory. This is only necessary if any of its parents aren't
+                // marked as deep glob directories already.
+                let mut found_deep_glob_parent = false;
+                let mut parent = entry.path().parent();
+                while let Some(parent_path) = parent {
+                    // If we reached the root, then we can stop.
+                    if parent_path == self.base {
+                        break;
+                    }
+
+                    // If the parent is already marked as a deep glob directory, then we can stop
+                    // because this glob will match the current directory already.
+                    if deep_globable_directories.contains(parent_path) {
+                        found_deep_glob_parent = true;
+                        break;
+                    }
+
+                    parent = parent_path.parent();
+                }
+
+                // If we didn't find a deep glob directory parent, then we can mark this directory as a
+                // deep glob directory (unless it is the root).
+                if !found_deep_glob_parent && entry.path() != self.base {
+                    deep_globable_directories.insert(entry.path().to_path_buf());
+                }
+            }
+
+            // Handle allowed content paths
+            if is_allowed_content_path(entry.path())
+                && allowed_paths.contains(&entry.path().to_path_buf())
+            {
+                let path = entry.path();
+
+                // Collect the extension for future use when building globs.
+                if let Some(extension) = path.extension().and_then(|x| x.to_str()) {
+                    found_extensions.insert(extension.to_string());
+                }
+            }
         }
+
+        let mut extension_list = found_extensions.into_iter().collect::<Vec<_>>();
+
+        extension_list.sort();
+
+        let extension_list = extension_list.join(",");
+
+        // Build the globs for all globable directories.
+        let shallow_globs = shallow_globable_directories.iter().map(|path| GlobEntry {
+            base: path.display().to_string(),
+            pattern: format!("*/*.{{{}}}", extension_list),
+        });
+
+        let deep_globs = deep_globable_directories.iter().map(|path| GlobEntry {
+            base: path.display().to_string(),
+            pattern: format!("**/*.{{{}}}", extension_list),
+        });
+
+        shallow_globs.chain(deep_globs).collect::<Vec<_>>()
     }
-
-    // Figure out all the deep globable directories.
-    let mut it = WalkDir::new(&base)
-        .sort_by(sort_by_dir_and_name)
-        .into_iter();
-
-    while let Some(Ok(entry)) = it.next() {
-        let path = entry.path();
-        if path.is_file() {
-            continue;
-        }
-
-        if path == base {
-            continue;
-        }
-
-        if IGNORED_CONTENT_DIRS
-            .iter()
-            .any(|dir| match path.file_name() {
-                Some(name) => name == *dir,
-                None => false,
-            })
-        {
-            it.skip_current_dir();
-            continue;
-        }
-
-        if !dirs.contains(path) {
-            it.skip_current_dir();
-            continue;
-        }
-
-        // Already marked as a shallow globable directory.
-        if shallow_globable_directories.contains(path) {
-            continue;
-        }
-
-        if forced_static_directories.contains(path) {
-            it.skip_current_dir();
-            continue;
-        }
-
-        // Track deep globable directories.
-        deep_globable_directories.insert(path.to_path_buf());
-        it.skip_current_dir();
-    }
-
-    let mut extension_list = found_extensions.clone().into_iter().collect::<Vec<_>>();
-
-    extension_list.sort();
-
-    let extension_list = extension_list.join(",");
-
-    // Build the globs for all globable directories.
-    let shallow_globs = shallow_globable_directories.iter().map(|path| GlobEntry {
-        base: path.display().to_string(),
-        pattern: format!("*/*.{{{}}}", extension_list),
-    });
-
-    let deep_globs = deep_globable_directories.iter().map(|path| GlobEntry {
-        base: path.display().to_string(),
-        pattern: format!("**/*.{{{}}}", extension_list),
-    });
-
-    shallow_globs
-        .chain(deep_globs)
-        // Insert a glob for the base path, so we can see new files/folders in the directory
-        // itself
-        .chain(vec![GlobEntry {
-            base: base.to_string_lossy().into(),
-            pattern: "*".into(),
-        }])
-        .collect::<Vec<_>>()
 }
diff --git a/crates/oxide/src/scanner/fixtures/binary-extensions.txt b/crates/oxide/src/scanner/fixtures/binary-extensions.txt
index d26c1c222..5f5b9a7c6 100644
--- a/crates/oxide/src/scanner/fixtures/binary-extensions.txt
+++ b/crates/oxide/src/scanner/fixtures/binary-extensions.txt
@@ -37,7 +37,6 @@ cpio
 cr2
 cur
 dat
-db
 dcm
 deb
 dex
@@ -66,7 +65,6 @@ eol
 eot
 epub
 exe
-exr
 f4v
 fbs
 fh
@@ -79,7 +77,6 @@ fpx
 fst
 fvt
 g3
-geojson
 gh
 gif
 graffle
@@ -88,7 +85,6 @@ gzip
 h261
 h263
 h264
-hdr
 icns
 ico
 ief
@@ -203,6 +199,8 @@ snap
 snk
 so
 sqlite
+sqlite
+sqlite3
 sqlite3
 stl
 storedata
diff --git a/crates/oxide/src/scanner/fixtures/ignored-content-dirs.txt b/crates/oxide/src/scanner/fixtures/ignored-content-dirs.txt
deleted file mode 100644
index 79f01ecc1..000000000
--- a/crates/oxide/src/scanner/fixtures/ignored-content-dirs.txt
+++ /dev/null
@@ -1,15 +0,0 @@
-.git
-.hg
-.jj
-.next
-.parcel-cache
-.pnpm-store
-.svelte-kit
-.svn
-.turbo
-.venv
-.vercel
-.yarn
-__pycache__
-node_modules
-venv
diff --git a/crates/oxide/src/scanner/fixtures/ignored-extensions.txt b/crates/oxide/src/scanner/fixtures/ignored-extensions.txt
index 4dc099e0d..f147c24fe 100644
--- a/crates/oxide/src/scanner/fixtures/ignored-extensions.txt
+++ b/crates/oxide/src/scanner/fixtures/ignored-extensions.txt
@@ -1,6 +1,6 @@
+css
 less
 lock
 sass
 scss
 styl
-log
diff --git a/crates/oxide/src/scanner/fixtures/ignored-files.txt b/crates/oxide/src/scanner/fixtures/ignored-files.txt
index 1e8f1029f..45d4ced87 100644
--- a/crates/oxide/src/scanner/fixtures/ignored-files.txt
+++ b/crates/oxide/src/scanner/fixtures/ignored-files.txt
@@ -1,6 +1,3 @@
 package-lock.json
 pnpm-lock.yaml
 bun.lockb
-.gitignore
-.env
-.env.*
diff --git a/crates/oxide/src/scanner/init_tracing.rs b/crates/oxide/src/scanner/init_tracing.rs
deleted file mode 100644
index dd4c1d071..000000000
--- a/crates/oxide/src/scanner/init_tracing.rs
+++ /dev/null
@@ -1,102 +0,0 @@
-use std::fs::OpenOptions;
-use std::io::{self, Write};
-use std::path::Path;
-use std::sync::{self, Arc, Mutex};
-use tracing_subscriber::fmt::writer::BoxMakeWriter;
-
-pub static SHOULD_TRACE: sync::LazyLock<bool> = sync::LazyLock::new(
-    || matches!(std::env::var("DEBUG"), Ok(value) if value.eq("*") || (value.contains("tailwindcss:oxide") && !value.contains("-tailwindcss:oxide"))),
-);
-
-fn dim(input: &str) -> String {
-    format!("\u{001b}[2m{input}\u{001b}[22m")
-}
-
-fn blue(input: &str) -> String {
-    format!("\u{001b}[34m{input}\u{001b}[39m")
-}
-
-fn highlight(input: &str) -> String {
-    format!("{}{}{}", dim(&blue("`")), blue(input), dim(&blue("`")))
-}
-
-struct MutexWriter(Arc<Mutex<std::fs::File>>);
-
-impl Write for MutexWriter {
-    fn write(&mut self, buf: &[u8]) -> io::Result<usize> {
-        self.0.lock().unwrap().write(buf)
-    }
-
-    fn flush(&mut self) -> io::Result<()> {
-        self.0.lock().unwrap().flush()
-    }
-}
-
-pub fn init_tracing() {
-    if !*SHOULD_TRACE {
-        return;
-    }
-
-    let root = Path::new(".tailwindcss");
-    let logs_dir = root.join("logs");
-    if let Err(err) = std::fs::create_dir_all(&logs_dir) {
-        eprintln!(
-            "{} Failed to create {}, skipping debug logs ({err})",
-            dim("[DEBUG]"),
-            highlight(&logs_dir.display().to_string())
-        );
-        return;
-    }
-
-    // Ensure everything inside `.tailwindcss/` is ignored by git. The file is only created if it
-    // doesn't exist yet, an existing `.gitignore` is left untouched.
-    if let Ok(mut file) = std::fs::File::create_new(root.join(".gitignore")) {
-        _ = file.write_all(b"*\n");
-    }
-
-    let file_path = logs_dir.join(format!(
-        "scanner-{}-{}.log",
-        std::time::SystemTime::now()
-            .duration_since(std::time::UNIX_EPOCH)
-            .map(|d| d.as_millis())
-            .unwrap_or(0),
-        std::process::id()
-    ));
-    let file = match OpenOptions::new()
-        .create(true)
-        .append(true)
-        .open(&file_path)
-    {
-        Ok(file) => file,
-        Err(err) => {
-            eprintln!(
-                "{} Failed to create {}, skipping debug logs ({err})",
-                dim("[DEBUG]"),
-                highlight(&file_path.display().to_string())
-            );
-            return;
-        }
-    };
-
-    let absolute_file_path = dunce::canonicalize(&file_path).unwrap_or_else(|_| file_path.clone());
-    eprintln!(
-        "{} Writing debug info to: {}\n",
-        dim("[DEBUG]"),
-        highlight(&absolute_file_path.display().to_string())
-    );
-
-    let file = Arc::new(Mutex::new(file));
-
-    let writer: BoxMakeWriter = BoxMakeWriter::new({
-        let file = file.clone();
-        move || Box::new(MutexWriter(file.clone())) as Box<dyn Write + Send>
-    });
-
-    _ = tracing_subscriber::fmt()
-        .with_max_level(tracing::Level::INFO)
-        .with_span_events(tracing_subscriber::fmt::format::FmtSpan::ACTIVE)
-        .with_writer(writer)
-        .with_ansi(false)
-        .compact()
-        .try_init();
-}
diff --git a/crates/oxide/src/scanner/mod.rs b/crates/oxide/src/scanner/mod.rs
index b7da9aa17..8ddf60fd0 100644
--- a/crates/oxide/src/scanner/mod.rs
+++ b/crates/oxide/src/scanner/mod.rs
@@ -1,952 +1,2 @@
-pub mod auto_source_detection;
+pub mod allowed_paths;
 pub mod detect_sources;
-pub mod init_tracing;
-pub mod sources;
-
-use crate::extractor::{Extracted, Extractor};
-use crate::glob::optimize_patterns;
-use crate::scanner::detect_sources::resolve_globs;
-use crate::scanner::sources::{
-    public_source_entries_to_private_source_entries, PublicSourceEntry, SourceEntry, Sources,
-};
-use crate::GlobEntry;
-use auto_source_detection::BINARY_EXTENSIONS_GLOB;
-use bstr::ByteSlice;
-use fast_glob::glob_match;
-use fxhash::{FxHashMap, FxHashSet};
-use ignore::{gitignore::GitignoreBuilder, WalkBuilder};
-use init_tracing::{init_tracing, SHOULD_TRACE};
-use rayon::prelude::*;
-use std::path::{Path, PathBuf};
-use std::sync::{Arc, Mutex};
-use std::time::SystemTime;
-use tracing::event;
-
-// @source "some/folder";               // This is auto source detection
-// @source "some/folder/**/*";          // This is auto source detection
-// @source "some/folder/*.html";        // This is just a glob, but new files matching this should be included
-// @source "node_modules/my-ui-lib";    // Auto source detection but since node_modules is explicit we allow it
-//                                      // Maybe could be considered `external(…)` automatically if:
-//                                      // 1. It's git ignored but listed explicitly
-//                                      // 2. It exists outside of the current working directory (do we know that?)
-//
-// @source "do-include-me.bin";         // `.bin` is typically ignored, but now it's explicit so should be included
-// @source "git-ignored.html";          // A git ignored file that is listed explicitly, should be scanned
-
-#[derive(Debug, Clone)]
-pub enum ChangedContent {
-    File(PathBuf, String),
-    Content(String, String),
-}
-
-#[derive(Debug, Clone)]
-pub struct ScanOptions {
-    /// Base path to start scanning from
-    pub base: Option<String>,
-
-    /// Glob sources
-    pub sources: Vec<GlobEntry>,
-}
-
-#[derive(Debug, Clone)]
-pub struct ScanResult {
-    pub candidates: Vec<String>,
-    pub files: Vec<String>,
-    pub globs: Vec<GlobEntry>,
-}
-
-#[derive(Debug, Clone, Default)]
-pub struct Scanner {
-    /// Content sources
-    sources: Sources,
-
-    /// The walker to detect all files that we have to scan
-    walker: Option<WalkBuilder>,
-
-    /// All found extensions
-    extensions: FxHashSet<String>,
-
-    /// All files that we have to scan
-    files: FxHashSet<PathBuf>,
-
-    /// All directories, sub-directories, etc… we saw during source detection
-    dirs: FxHashSet<PathBuf>,
-
-    /// All generated globs, used for setting up watchers
-    globs: Option<Vec<GlobEntry>>,
-
-    /// Track unique set of candidates
-    candidates: FxHashSet<String>,
-
-    /// Track mtimes for files so incremental scans can skip unchanged files.
-    mtimes: FxHashMap<PathBuf, SystemTime>,
-
-    /// Files that were scanned during the last `scan()` call.
-    scanned_files: Vec<String>,
-
-    /// Whether we've completed at least one full scan. When false, we skip
-    /// mtime tracking entirely so the initial build stays fast.
-    has_scanned_once: bool,
-
-    /// Whether sources have been scanned since the last `scan()` call
-    sources_scanned: bool,
-}
-
-impl Scanner {
-    pub fn new(sources: Vec<PublicSourceEntry>) -> Self {
-        init_tracing();
-
-        if *SHOULD_TRACE {
-            event!(tracing::Level::INFO, "Provided sources:");
-            for source in &sources {
-                event!(tracing::Level::INFO, "Source: {:?}", source);
-            }
-        }
-
-        let sources = Sources::new(public_source_entries_to_private_source_entries(sources));
-        if *SHOULD_TRACE {
-            event!(tracing::Level::INFO, "Optimized sources:");
-            for source in sources.iter() {
-                event!(tracing::Level::INFO, "Source: {:?}", source);
-            }
-        }
-
-        let walker = create_walker(&sources);
-
-        Self {
-            sources,
-            walker,
-            ..Default::default()
-        }
-    }
-
-    pub fn scan(&mut self) -> Vec<String> {
-        self.sources_scanned = false;
-
-        let (scanned_blobs, css_files, files) = self.discover_sources();
-
-        self.extract_candidates(scanned_blobs, css_files);
-        self.scanned_files = files;
-
-        // Return all candidates sorted
-        let mut result = self.candidates.iter().cloned().collect::<Vec<_>>();
-        result.par_sort_unstable();
-        result
-    }
-
-    #[tracing::instrument(skip_all)]
-    pub fn scan_content(&mut self, changed_content: Vec<ChangedContent>) -> Vec<String> {
-        let (changed_files, changed_contents) =
-            changed_content
-                .into_iter()
-                .partition::<Vec<_>, _>(|x| match x {
-                    ChangedContent::File(_, _) => true,
-                    ChangedContent::Content(_, _) => false,
-                });
-
-        // Raw content can be parsed directly, no need to verify if the file exists and is allowed
-        // to be scanned.
-        let mut content_to_scan: Vec<ChangedContent> = changed_contents;
-
-        // Fully resolve all files
-        let changed_files = changed_files
-            .into_iter()
-            .filter_map(|changed_content| match changed_content {
-                ChangedContent::File(file, extension) => {
-                    let Ok(file) = dunce::canonicalize(file) else {
-                        return None;
-                    };
-                    Some(ChangedContent::File(file, extension))
-                }
-                _ => unreachable!(),
-            })
-            .collect::<Vec<_>>();
-
-        let (known_files, mut new_unknown_files) = changed_files
-            .into_iter()
-            .partition::<Vec<_>, _>(|changed_file| match changed_file {
-                ChangedContent::Content(_, _) => unreachable!(),
-                ChangedContent::File(file, _) => self.files.contains(file),
-            });
-
-        // All known files are allowed to be scanned
-        content_to_scan.extend(known_files);
-
-        // Figure out if the new unknown files are allowed to be scanned
-        if !new_unknown_files.is_empty() {
-            if let Some(walk_builder) = &mut self.walker {
-                for entry in walk_builder.build().filter_map(Result::ok) {
-                    let path = entry.path();
-                    if !path.is_file() {
-                        continue;
-                    }
-
-                    // The walked path can contain symlinks, while the changed files have already
-                    // been canonicalized. Lazily canonicalize the walked path so we can compare
-                    // the real paths as well.
-                    let mut canonical_path: Option<PathBuf> = None;
-
-                    let mut drop_file_indexes = vec![];
-                    for (idx, changed_file) in new_unknown_files.iter().enumerate().rev() {
-                        let ChangedContent::File(file, _) = changed_file else {
-                            continue;
-                        };
-
-                        // When the file is found on disk it means that all the rules pass. We can
-                        // extract the current file and remove it from the list of passed in files.
-                        let matches = file == path
-                            || (file.file_name() == path.file_name() && {
-                                if canonical_path.is_none() {
-                                    canonical_path = dunce::canonicalize(path).ok();
-                                }
-                                canonical_path.as_deref() == Some(file.as_path())
-                            });
-
-                        if matches {
-                            self.files.insert(path.to_path_buf()); // Track for future use
-                            content_to_scan.push(changed_file.clone()); // Track for parsing
-                            drop_file_indexes.push(idx);
-                        }
-                    }
-
-                    // Remove all files that we found on disk
-                    if !drop_file_indexes.is_empty() {
-                        drop_file_indexes.into_iter().for_each(|idx| {
-                            new_unknown_files.remove(idx);
-                        });
-                    }
-
-                    // We can stop walking the file system if all files we are interested in have
-                    // been found.
-                    if new_unknown_files.is_empty() {
-                        break;
-                    }
-                }
-            }
-        }
-
-        // Read all content into blobs for extraction
-        let blobs = read_all_files(content_to_scan);
-        self.extract_candidates(blobs, vec![])
-    }
-
-    #[tracing::instrument(skip_all)]
-    fn extract_candidates(&mut self, blobs: Vec<Vec<u8>>, css_files: Vec<PathBuf>) -> Vec<String> {
-        // Extract all candidates from the pre-read blobs
-        let mut new_candidates = parse_all_blobs(blobs);
-
-        // Extract all CSS variables from the CSS files
-        if !css_files.is_empty() {
-            let css_variables = extract_css_variables(read_all_files(
-                css_files
-                    .into_iter()
-                    .map(|file| ChangedContent::File(file, "css".into()))
-                    .collect(),
-            ));
-
-            new_candidates.extend(css_variables);
-        }
-
-        // Only keep candidates we haven't seen before
-        for existing in self.candidates.iter() {
-            new_candidates.remove(existing);
-        }
-
-        // Track new candidates for subsequent calls
-        self.candidates.extend(new_candidates.iter().cloned());
-
-        let mut result: Vec<String> = new_candidates.into_iter().collect();
-        result.par_sort_unstable();
-
-        result
-    }
-
-    #[tracing::instrument(skip_all)]
-    pub fn get_files(&mut self) -> Vec<String> {
-        let _ = self.discover_sources();
-
-        self.files
-            .par_iter()
-            .filter_map(|x| x.clone().into_os_string().into_string().ok())
-            .collect()
-    }
-
-    #[tracing::instrument(skip_all)]
-    pub fn get_scanned_files(&self) -> Vec<String> {
-        self.scanned_files.clone()
-    }
-
-    #[tracing::instrument(skip_all)]
-    pub fn get_globs(&mut self) -> Vec<GlobEntry> {
-        if let Some(globs) = &self.globs {
-            return globs.clone();
-        }
-
-        let _ = self.discover_sources();
-
-        let mut globs = vec![];
-        for source in self.sources.iter() {
-            match source {
-                SourceEntry::Auto { base } | SourceEntry::External { base } => {
-                    globs.extend(resolve_globs(
-                        base.to_path_buf(),
-                        &self.dirs,
-                        &self.extensions,
-                    ));
-                }
-                SourceEntry::Pattern { base, pattern } => {
-                    globs.push(GlobEntry {
-                        base: base.to_string_lossy().to_string(),
-                        pattern: pattern.to_string(),
-                    });
-                }
-                _ => {}
-            }
-        }
-
-        // Re-optimize the globs to reduce the number of patterns we have to scan.
-        globs = optimize_patterns(&globs);
-
-        // Track the globs for subsequent calls
-        self.globs = Some(globs.clone());
-
-        globs
-    }
-
-    #[tracing::instrument(skip_all)]
-    pub fn get_normalized_sources(&self) -> Vec<GlobEntry> {
-        self.sources
-            .iter()
-            .filter_map(|source| match source {
-                SourceEntry::Auto { base } | SourceEntry::External { base } => Some(GlobEntry {
-                    base: base.to_string_lossy().to_string(),
-                    pattern: "**/*".to_string(),
-                }),
-                SourceEntry::Pattern { base, pattern } => Some(GlobEntry {
-                    base: base.to_string_lossy().to_string(),
-                    pattern: pattern.to_string(),
-                }),
-                _ => None,
-            })
-            .collect()
-    }
-
-    #[tracing::instrument(skip_all)]
-    pub fn get_candidates_with_positions(
-        &mut self,
-        changed_content: ChangedContent,
-    ) -> Vec<(String, usize)> {
-        let content = read_changed_content(changed_content).unwrap_or_default();
-        let original_content = &content;
-
-        // Workaround for legacy upgrades:
-        //
-        // `-[]` won't parse in the new parser (`[…]` must contain _something_), but we do need it
-        // for people using `group-[]` (which we will later replace with `in-[.group]` instead).
-        let content = content.replace("-[]", "XYZ");
-        let offset = content.as_ptr() as usize;
-
-        let mut extractor = Extractor::new(&content[..]);
-
-        extractor
-            .extract()
-            .into_par_iter()
-            .flat_map(|extracted| match extracted {
-                Extracted::Candidate(s) => {
-                    let i = s.as_ptr() as usize - offset;
-                    let original = &original_content[i..i + s.len()];
-                    if original.contains_str("-[]") {
-                        return String::from_utf8(original.to_vec())
-                            .ok()
-                            .map(|candidate| (candidate, i));
-                    }
-
-                    String::from_utf8(s.to_vec())
-                        .ok()
-                        .map(|candidate| (candidate, i))
-                }
-
-                _ => None,
-            })
-            .collect()
-    }
-
-    #[tracing::instrument(skip_all)]
-    fn discover_sources(&mut self) -> (Vec<Vec<u8>>, Vec<PathBuf>, Vec<String>) {
-        if self.sources_scanned {
-            return (vec![], vec![], vec![]);
-        }
-        self.sources_scanned = true;
-
-        let Some(walker) = &mut self.walker else {
-            return (vec![], vec![], vec![]);
-        };
-
-        // Use synchronous walk for the initial build (lower overhead) and parallel
-        // walk for subsequent calls (watch mode) where the overhead is amortised.
-        let all_entries = if self.has_scanned_once {
-            walk_parallel(walker)
-        } else {
-            walk_synchronous(walker)
-        };
-
-        let mut css_files: Vec<PathBuf> = vec![];
-        let mut content_paths: Vec<(PathBuf, String)> = vec![];
-        let mut changed_files = vec![];
-
-        // Fresh state
-        self.files.clear();
-        self.dirs.clear();
-        self.extensions.clear();
-        self.globs = None;
-
-        // Cache canonicalized folders in case a file itself is not symlinked, but any of the parent
-        // folders are symlinked.
-        let mut cached_canonical_dirs: FxHashMap<PathBuf, PathBuf> = FxHashMap::default();
-
-        for entry in all_entries {
-            match entry {
-                WalkEntry::Dir(path) => {
-                    self.dirs.insert(path);
-                }
-                WalkEntry::File {
-                    path,
-                    mtime,
-                    is_symlink,
-                } => {
-                    // Deduplicate: parallel walk can visit the same file from multiple threads
-                    if !self.files.insert(path.clone()) {
-                        continue;
-                    }
-
-                    // Track canonicalized paths in addition to potentially symlinked file paths
-                    let canonical = if is_symlink {
-                        dunce::canonicalize(&path).ok()
-                    } else {
-                        path.parent().and_then(|parent| {
-                            // Perf: cache the canonicalized parent path such that sibling files don't
-                            // have to canonicalize over and over again.
-                            let canonical_parent = cached_canonical_dirs
-                                .entry(parent.to_path_buf())
-                                .or_insert_with(|| {
-                                    dunce::canonicalize(parent)
-                                        .unwrap_or_else(|_| parent.to_path_buf())
-                                });
-
-                            if canonical_parent.as_path() != parent {
-                                path.file_name()
-                                    .map(|file_name| canonical_parent.join(file_name))
-                            } else {
-                                None
-                            }
-                        })
-                    };
-
-                    if let Some(canonical) = canonical {
-                        if canonical != path {
-                            self.files.insert(canonical);
-                        }
-                    }
-                    let extension = path
-                        .extension()
-                        .and_then(|x| x.to_str())
-                        .unwrap_or_default()
-                        .to_owned();
-
-                    self.extensions.insert(extension.to_owned());
-
-                    // On incremental scans, check mtime to skip unchanged files.
-                    // On the first scan, track mtimes while still scanning every file.
-                    let changed = if self.has_scanned_once {
-                        match mtime {
-                            Some(mtime) => {
-                                let prev = self.mtimes.insert(path.clone(), mtime);
-                                prev.is_none_or(|prev| prev != mtime)
-                            }
-                            None => true,
-                        }
-                    } else {
-                        if let Some(mtime) = mtime {
-                            self.mtimes.insert(path.clone(), mtime);
-                        }
-
-                        true
-                    };
-
-                    if !changed {
-                        continue;
-                    }
-
-                    if let Ok(file) = path.clone().into_os_string().into_string() {
-                        changed_files.push(file);
-                    }
-
-                    match extension.as_str() {
-                        // Special handing for CSS files, we don't want to extract candidates from
-                        // these files, but we do want to extract used CSS variables.
-                        "css" => css_files.push(path),
-                        _ => content_paths.push((path, extension)),
-                    }
-                }
-            }
-        }
-
-        // Ensure `mtimes` don't include stale files
-        self.mtimes.retain(|path, _| self.files.contains(path));
-
-        // Read + preprocess all discovered files in parallel
-        let scanned_blobs: Vec<Vec<u8>> = content_paths
-            .into_par_iter()
-            .filter_map(|(path, ext)| {
-                let content = std::fs::read(&path).ok()?;
-                event!(tracing::Level::INFO, "Reading {:?}", path);
-                let processed = pre_process_input(content, &ext);
-                if processed.is_empty() {
-                    None
-                } else {
-                    Some(processed)
-                }
-            })
-            .collect();
-
-        if !self.has_scanned_once {
-            self.has_scanned_once = true;
-        }
-
-        changed_files.par_sort_unstable();
-
-        (scanned_blobs, css_files, changed_files)
-    }
-}
-
-fn read_changed_content(c: ChangedContent) -> Option<Vec<u8>> {
-    let (content, extension) = match c {
-        ChangedContent::File(file, extension) => match std::fs::read(&file) {
-            Ok(content) => {
-                event!(tracing::Level::INFO, "Reading {:?}", file);
-                (content, extension)
-            }
-            Err(e) => {
-                event!(tracing::Level::ERROR, "Failed to read file: {:?}", e);
-                return None;
-            }
-        },
-
-        ChangedContent::Content(contents, extension) => (contents.into_bytes(), extension),
-    };
-
-    Some(pre_process_input(content, &extension))
-}
-
-pub fn pre_process_input(content: Vec<u8>, extension: &str) -> Vec<u8> {
-    use crate::extractor::pre_processors::*;
-
-    match extension {
-        "clj" | "cljs" | "cljc" => Clojure.process(&content),
-        "heex" | "eex" | "ex" | "exs" => Elixir.process(&content),
-        "cshtml" | "razor" => Razor.process(&content),
-        "haml" => Haml.process(&content),
-        "json" | "jsonl" | "ndjson" => Json.process(&content),
-        "md" | "mdx" => Markdown.process(&content),
-        "pug" => Pug.process(&content),
-        "rb" | "erb" => Ruby.process(&content),
-        "slim" | "slang" => Slim.process(&content),
-        "svelte" => Svelte.process(&content),
-        "rs" => Rust.process(&content),
-        "tt" | "tt2" | "tx" => TemplateToolkit.process(&content),
-        "twig" => Twig.process(&content),
-        "vue" => Vue.process(&content),
-        _ => content,
-    }
-}
-
-#[tracing::instrument(skip_all)]
-fn read_all_files(changed_content: Vec<ChangedContent>) -> Vec<Vec<u8>> {
-    event!(
-        tracing::Level::INFO,
-        "Reading {:?} file(s)",
-        changed_content.len()
-    );
-
-    changed_content
-        .into_par_iter()
-        .filter_map(read_changed_content)
-        .collect()
-}
-
-#[tracing::instrument(skip_all)]
-fn extract_css_variables(blobs: Vec<Vec<u8>>) -> FxHashSet<String> {
-    extract(blobs, |mut extractor| {
-        extractor.extract_variables_from_css()
-    })
-}
-
-#[tracing::instrument(skip_all)]
-fn parse_all_blobs(blobs: Vec<Vec<u8>>) -> FxHashSet<String> {
-    extract(blobs, |mut extractor| extractor.extract())
-}
-
-#[tracing::instrument(skip_all)]
-fn extract<H>(blobs: Vec<Vec<u8>>, handle: H) -> FxHashSet<String>
-where
-    H: Fn(Extractor) -> Vec<Extracted> + std::marker::Sync,
-{
-    blobs
-        .par_iter()
-        .flat_map(|blob| blob.par_split(|x| *x == b'\n'))
-        .filter_map(|blob| {
-            if blob.is_empty() {
-                return None;
-            }
-
-            let extracted = handle(crate::extractor::Extractor::new(blob));
-            if extracted.is_empty() {
-                return None;
-            }
-
-            Some(FxHashSet::from_iter(extracted.into_iter().map(
-                |x| match x {
-                    Extracted::Candidate(bytes) => bytes,
-                    Extracted::CssVariable(bytes) => bytes,
-                },
-            )))
-        })
-        .reduce(Default::default, |mut a, b| {
-            a.extend(b);
-            a
-        })
-        .into_iter()
-        .filter_map(|s| String::from_utf8(s.to_vec()).ok())
-        .collect()
-}
-
-#[derive(Debug)]
-enum WalkEntry {
-    Dir(PathBuf),
-    File {
-        path: PathBuf,
-        mtime: Option<SystemTime>,
-
-        /// Whether the path itself is a symlink
-        is_symlink: bool,
-    },
-}
-
-impl From<ignore::DirEntry> for WalkEntry {
-    fn from(entry: ignore::DirEntry) -> Self {
-        let is_dir = entry.file_type().map(|ft| ft.is_dir()).unwrap_or(false);
-        let is_symlink = entry.path_is_symlink();
-        let path = entry.into_path();
-
-        if is_dir {
-            WalkEntry::Dir(path)
-        } else {
-            let mtime = path.metadata().ok().and_then(|m| m.modified().ok());
-            WalkEntry::File {
-                path,
-                mtime,
-                is_symlink,
-            }
-        }
-    }
-}
-
-/// Walk the file system synchronously. Used for the initial build where the overhead of spawning
-/// parallel walker threads is not worth it.
-#[tracing::instrument(skip_all)]
-fn walk_synchronous(walker: &mut WalkBuilder) -> Vec<WalkEntry> {
-    walker
-        .build()
-        .filter_map(Result::ok)
-        .map(WalkEntry::from)
-        .collect()
-}
-
-/// Walk the file system in parallel. Used in watch mode where the parallel walker overhead is
-/// amortised across many rebuilds and subsequent calls are much faster.
-#[tracing::instrument(skip_all)]
-fn walk_parallel(walker: &mut WalkBuilder) -> Vec<WalkEntry> {
-    struct FlushOnDrop {
-        local: Vec<WalkEntry>,
-        shared: Arc<Mutex<Vec<WalkEntry>>>,
-    }
-
-    impl Drop for FlushOnDrop {
-        fn drop(&mut self) {
-            if !self.local.is_empty() {
-                self.shared.lock().unwrap().append(&mut self.local);
-            }
-        }
-    }
-
-    let collected: Arc<Mutex<Vec<WalkEntry>>> = Arc::new(Mutex::new(vec![]));
-
-    walker.build_parallel().run(|| {
-        let mut buf = FlushOnDrop {
-            local: Vec::with_capacity(256),
-            shared: collected.clone(),
-        };
-
-        Box::new(move |entry| {
-            let Ok(entry) = entry else {
-                return ignore::WalkState::Continue;
-            };
-
-            buf.local.push(WalkEntry::from(entry));
-
-            if buf.local.len() >= 256 {
-                buf.shared.lock().unwrap().append(&mut buf.local);
-            }
-
-            ignore::WalkState::Continue
-        })
-    });
-
-    // All threads have finished and flushed their buffers via FlushOnDrop::drop
-    Arc::try_unwrap(collected).unwrap().into_inner().unwrap()
-}
-
-/// Sets up a WalkBuilder with all source roots, gitignore rules, and source pattern matching.
-///
-/// This is the common setup shared between the full walker (with mtime tracking for re-scans)
-/// and the parallel walker (without mtime tracking for the initial scan).
-fn create_walker(sources: &Sources) -> Option<WalkBuilder> {
-    let mut other_roots: FxHashSet<&PathBuf> = FxHashSet::default();
-    let mut first_root: Option<&PathBuf> = None;
-
-    let mut ignores: Vec<(&PathBuf, Vec<String>)> = Default::default();
-    let mut emit = |base, pattern| match ignores.last_mut() {
-        Some((prev_base, patterns)) if *prev_base == base => {
-            patterns.push(pattern);
-        }
-        _ => {
-            ignores.push((base, vec![pattern]));
-        }
-    };
-
-    for source in sources.iter() {
-        match source {
-            SourceEntry::Auto { base } => {
-                if first_root.is_none() {
-                    first_root = Some(base);
-                } else {
-                    other_roots.insert(base);
-                }
-            }
-            SourceEntry::Pattern { base, pattern } => {
-                let pattern = pattern.to_owned();
-
-                if first_root.is_none() {
-                    first_root = Some(base);
-                } else {
-                    other_roots.insert(base);
-                }
-
-                if !pattern.contains("**") {
-                    // Specific patterns should take precedence even over git-ignored files:
-                    emit(base, format!("!{}", pattern));
-                } else {
-                    // Assumption: the pattern we receive will already be brace expanded. So
-                    // `*.{html,jsx}` will result in two separate patterns: `*.html` and `*.jsx`.
-                    if let Some(extension) = Path::new(&pattern).extension() {
-                        // Extend auto source detection to include the extension
-                        emit(base, format!("!*.{}", extension.to_string_lossy()));
-                    }
-                }
-            }
-            SourceEntry::Ignored { base, pattern } => {
-                emit(base, pattern.to_owned());
-            }
-            SourceEntry::External { base } => {
-                if first_root.is_none() {
-                    first_root = Some(base);
-                } else {
-                    other_roots.insert(base);
-                }
-
-                // External sources should take precedence even over git-ignored files:
-                emit(base, "!/**/*".to_owned());
-
-                // External sources should still disallow binary extensions:
-                emit(base, BINARY_EXTENSIONS_GLOB.clone());
-            }
-        }
-    }
-
-    let mut builder = WalkBuilder::new(first_root?);
-
-    // We have to follow symlinks
-    builder.follow_links(true);
-
-    // Scan hidden files / directories
-    builder.hidden(false);
-
-    // Don't respect global gitignore files
-    builder.git_global(false);
-
-    // By default, allow .gitignore files to be used regardless of whether or not
-    // a .git directory is present. This is an optimization for when projects
-    // are first created and may not be in a git repo yet.
-    builder.require_git(false);
-
-    // If we are in a git repo then require it to ensure that only rules within
-    // the repo are used. For example, we don't want to consider a .gitignore file
-    // in the user's home folder if we're in a git repo.
-    //
-    // The alternative is using a call like `.parents(false)` but that will
-    // prevent looking at parent directories for .gitignore files from within
-    // the repo and that's not what we want.
-    //
-    // For example, in a project with this structure:
-    //
-    // home
-    // .gitignore
-    //  my-project
-    //   .gitignore
-    //   apps
-    //     .gitignore
-    //     web
-    //       {root}
-    //
-    // We do want to consider all .gitignore files listed:
-    // - home/.gitignore
-    // - my-project/.gitignore
-    // - my-project/apps/.gitignore
-    //
-    // However, if a repo is initialized inside my-project then only the following
-    // make sense for consideration:
-    // - my-project/.gitignore
-    // - my-project/apps/.gitignore
-    //
-    // Setting the require_git(true) flag conditionally allows us to do this.
-    for parent in first_root?.ancestors() {
-        if parent.join(".git").exists() {
-            builder.require_git(true);
-            break;
-        }
-    }
-
-    for root in other_roots {
-        builder.add(root);
-    }
-
-    // Setup auto source detection rules
-    for ignore in auto_source_detection::RULES.iter() {
-        builder.add_gitignore(ignore.clone());
-    }
-
-    // Setup ignores based on `@source` definitions
-    for (base, patterns) in ignores {
-        let mut ignore_builder = GitignoreBuilder::new(base);
-        for pattern in patterns {
-            ignore_builder.add_line(None, &pattern).unwrap();
-        }
-        let ignore = ignore_builder.build().unwrap();
-        builder.add_gitignore(ignore);
-    }
-
-    // Pre-compute source matching data to avoid allocations in the hot filter_entry path
-    let auto_bases: Vec<PathBuf> = sources
-        .iter()
-        .filter_map(|source| match source {
-            SourceEntry::Auto { base } | SourceEntry::External { base } => Some(base.clone()),
-            _ => None,
-        })
-        .collect();
-
-    let pattern_sources: Vec<(PathBuf, String)> = sources
-        .iter()
-        .filter_map(|source| match source {
-            SourceEntry::Pattern { base, pattern } => Some((base.into(), pattern.into())),
-            _ => None,
-        })
-        .collect();
-
-    // Source pattern matching filter (lock-free, safe for parallel walking)
-    builder.filter_entry(move |entry| {
-        let path = entry.path();
-
-        // Ensure the entries are matching any of the provided source patterns (this is
-        // necessary for manual-patterns that can filter the file extension)
-        if path.is_file() {
-            let mut matches = false;
-
-            for base in &auto_bases {
-                if path.starts_with(base) {
-                    matches = true;
-                    break;
-                }
-            }
-
-            if !matches {
-                for (base, pattern) in &pattern_sources {
-                    let remainder = path.strip_prefix(base);
-                    if remainder.is_ok_and(|remainder| {
-                        let mut path_str = remainder.to_string_lossy().to_string();
-                        if !path_str.starts_with("/") {
-                            path_str = format!("/{path_str}");
-                        }
-                        glob_match(pattern, path_str.as_bytes())
-                    }) {
-                        matches = true;
-                        break;
-                    }
-                }
-            }
-
-            if !matches {
-                return false;
-            }
-        }
-
-        true
-    });
-
-    Some(builder)
-}
-
-#[cfg(test)]
-mod tests {
-    use super::{ChangedContent, Scanner};
-    use pretty_assertions::assert_eq;
-
-    #[test]
-    fn test_positions() {
-        let mut scanner = Scanner::new(vec![]);
-
-        for (input, expected) in [
-            // Before migrations
-            (
-                r#"<div class="!tw__flex sm:!tw__block tw__bg-gradient-to-t flex tw:[color:red] group-[]:tw__flex"#,
-                vec![
-                    ("class".to_string(), 5),
-                    ("!tw__flex".to_string(), 12),
-                    ("sm:!tw__block".to_string(), 22),
-                    ("tw__bg-gradient-to-t".to_string(), 36),
-                    ("flex".to_string(), 57),
-                    ("tw:[color:red]".to_string(), 62),
-                    ("group-[]:tw__flex".to_string(), 77),
-                ],
-            ),
-            // After migrations
-            (
-                r#"<div class="tw:flex! tw:sm:block! tw:bg-linear-to-t flex tw:[color:red] tw:in-[.tw\:group]:flex"></div>"#,
-                vec![
-                    ("class".to_string(), 5),
-                    ("tw:flex!".to_string(), 12),
-                    ("tw:sm:block!".to_string(), 21),
-                    ("tw:bg-linear-to-t".to_string(), 34),
-                    ("flex".to_string(), 52),
-                    ("tw:[color:red]".to_string(), 57),
-                    ("tw:in-[.tw\\:group]:flex".to_string(), 72),
-                ],
-            ),
-        ] {
-            let candidates = scanner.get_candidates_with_positions(ChangedContent::Content(
-                input.to_string(),
-                "html".into(),
-            ));
-            assert_eq!(candidates, expected);
-        }
-    }
-}
diff --git a/crates/oxide/src/scanner/sources.rs b/crates/oxide/src/scanner/sources.rs
deleted file mode 100644
index 53c09387f..000000000
--- a/crates/oxide/src/scanner/sources.rs
+++ /dev/null
@@ -1,938 +0,0 @@
-use crate::GlobEntry;
-use bexpand::Expression;
-use fxhash::{FxHashMap, FxHashSet};
-use ignore::gitignore::Gitignore;
-use std::path::{Component, Path, PathBuf};
-use tracing::{event, Level};
-
-use super::auto_source_detection::IGNORED_CONTENT_DIRS;
-
-#[derive(Debug, Clone)]
-pub struct PublicSourceEntry {
-    /// Base path of the glob
-    pub base: String,
-
-    /// Glob pattern
-    pub pattern: String,
-
-    /// Negated flag
-    pub negated: bool,
-}
-
-#[derive(Debug, Clone, PartialEq)]
-pub enum SourceEntry {
-    /// Auto source detection
-    ///
-    /// Represented by:
-    ///
-    /// ```css
-    /// @source "src";`
-    /// @source "src/**/*";`
-    /// ```
-    Auto { base: PathBuf },
-
-    /// Explicit source pattern regardless of any auto source detection rules
-    ///
-    /// Represented by:
-    ///
-    /// ```css
-    /// @source "src/**/*.html";`
-    /// ```
-    Pattern { base: PathBuf, pattern: String },
-
-    /// Ignored pattern
-    ///
-    /// Represented by:
-    ///
-    /// ```css
-    /// @source not "src";`
-    /// @source not "src/**/*.html";`
-    /// ```
-    Ignored { base: PathBuf, pattern: String },
-
-    /// External sources are directories that are ignored (by us or .gitignore rules), but should be
-    /// included bypassing the default ignore rules.
-    ///
-    /// Represented by:
-    ///
-    /// ```css
-    /// @source "../node_modules/my-lib";`
-    /// @source "../node_modules/my-lib/**/*";`
-    /// ```
-    External { base: PathBuf },
-}
-
-#[derive(Debug, Clone, Default)]
-pub struct Sources {
-    sources: Vec<SourceEntry>,
-}
-
-impl Sources {
-    pub fn new(sources: Vec<SourceEntry>) -> Self {
-        Self { sources }
-    }
-
-    pub fn iter(&self) -> impl Iterator<Item = &SourceEntry> {
-        self.sources.iter()
-    }
-}
-
-/// When dealing with a pattern, then it could be that we end up with:
-///
-/// ```json
-/// { base: '/some/folder', pattern: 'foo.ts' }
-/// ```
-///
-/// If we just emit `!foo.ts` for the `/some/folder` path, then _everything_ else in that folder
-/// would still be walked (but the result will be ignored).
-///
-/// Instead, we have to ensure that we ignore everything in that folder _except_ for the `foo.ts`
-/// pattern.
-///
-/// This should be equivalent to:
-/// ```gitignore
-/// *
-/// !foo.ts
-/// ```
-///
-/// However, we have to be careful that we don't start ignoring files/folders that already exist.
-/// ```css
-/// @source "./some/folder/foo.ts";
-/// @source "./some/folder/bar.ts";
-/// ```
-/// Would result in:
-/// ```json
-/// { base: '/some/folder', pattern: 'foo.ts' }
-/// { base: '/some/folder', pattern: 'bar.ts' }
-/// ```
-///
-/// If we were to blindly emit `*` for each pattern, then the `.gitignore` equivalent would look like
-/// this:
-/// ```gitignore
-/// *
-/// !foo.ts
-/// *
-/// !bar.ts
-/// ```
-///
-/// This would result in ignoring the `foo.ts` file as well. Therefore we only want to insert
-/// this `*` pattern when nothing else exists yet.
-///
-/// There is another problem that we need to solve. Let's say you have a pattern that contains a `*`
-/// in the pattern:
-/// ```css
-/// @source './src/ba*/*.html';
-/// ```
-///
-/// This would result in
-/// ```json
-/// { base: '/src', pattern: '/ba*/*.html' }
-/// ```
-///
-/// If we now inject the `*` pattern for the `/src` folder, then we wouldn't scan any `ba*` folders
-/// (e.g. `bar` or `baz`). For this, we have to make sure that we add inverse patterns for these
-/// folders. This would essentially result in:
-/// ```gitignore
-/// *                     ← ignore everything
-/// !/ba*/                ← except for the `ba*/` pattern, so we scan these folders
-/// !/ba*/*.html          ← then ensure we scan the `*.html` files in it as well
-/// ```
-///
-fn expand_restricted_patterns(sources: Vec<SourceEntry>) -> Vec<SourceEntry> {
-    let unrestricted_roots = sources
-        .iter()
-        .filter_map(|source| match source {
-            SourceEntry::Auto { base } | SourceEntry::External { base } => Some(base.clone()),
-            SourceEntry::Pattern { base, pattern } if pattern.contains("**") => Some(base.clone()),
-            _ => None,
-        })
-        .collect::<Vec<_>>();
-
-    // Bases of restricted patterns. Each of these becomes its own walk root with its own
-    // `*` + `!<pattern>` rules, so an ancestor base must not ignore them recursively.
-    let pattern_roots = sources
-        .iter()
-        .filter_map(|source| match source {
-            SourceEntry::Pattern { base, .. } => Some(base.clone()),
-            _ => None,
-        })
-        .collect::<Vec<_>>();
-
-    let mut restricted_roots: FxHashSet<PathBuf> = FxHashSet::default();
-    let mut expanded = vec![];
-
-    for source in sources {
-        let SourceEntry::Pattern { base, pattern } = &source else {
-            expanded.push(source);
-            continue;
-        };
-
-        // `base` is already included by another `@source` that we know should be walked. This
-        // includes the case where `base` is _nested_ inside such a root, because everything under
-        // an unrestricted root is walked already. Restricting it would incorrectly hide siblings
-        // that the broader source is supposed to pick up.
-        if unrestricted_roots.iter().any(|root| base.starts_with(root)) {
-            expanded.push(source);
-            continue;
-        }
-
-        // Ignore everything in the directory. We will later add the specific patterns we are
-        // interested in.
-        if restricted_roots.insert(base.clone()) {
-            // When another source root is nested inside this base — an unrestricted root, or the
-            // base of another restricted pattern (which is walked from its own root with its own
-            // rules) — only ignore direct children so the nested root can still be walked.
-            let has_nested_root = unrestricted_roots.iter().any(|root| root.starts_with(base))
-                || pattern_roots
-                    .iter()
-                    .any(|root| root != base && root.starts_with(base));
-
-            let pattern = if has_nested_root { "/*" } else { "*" };
-
-            expanded.push(SourceEntry::Ignored {
-                base: base.clone(),
-                pattern: pattern.to_owned(),
-            });
-        }
-
-        // Ensure to _include_ parent paths, otherwise the `*` from above would block walking the
-        // folders that need to be walked.
-        //
-        // ```css
-        // @source './src/ba*/*.html';
-        // ```
-        //
-        // ```gitignore
-        // *                     ← added by the above rule
-        // !/ba*/                ← this is what we're focusing on in this block
-        // !/ba*/*.html          ← this is added later
-        // ```
-        {
-            let mut dir = PathBuf::new();
-            let mut components = Path::new(pattern).components().peekable();
-
-            while let Some(component) = components.next() {
-                if components.peek().is_none() {
-                    break;
-                }
-
-                match component {
-                    Component::Prefix(_) | Component::RootDir | Component::CurDir => continue,
-                    Component::ParentDir | Component::Normal(_) => dir.push(component),
-                }
-
-                expanded.push(SourceEntry::Ignored {
-                    base: base.clone(),
-                    pattern: format!("!/{}/", path_to_posix_string(&dir).trim_start_matches('/')),
-                });
-            }
-        }
-
-        // Track the original source
-        expanded.push(source);
-    }
-
-    expanded
-}
-
-impl PublicSourceEntry {
-    /// Optimize the PublicSourceEntry by trying to move all the static parts of the pattern to the
-    /// base of the PublicSourceEntry.
-    ///
-    /// ```diff
-    /// - { base: '/', pattern: 'src/**/*.html'}
-    /// + { base: '/src', pattern: '**/*.html'}
-    /// ```
-    ///
-    /// A file stays in the `pattern` part, because the `base` should only be a directory.
-    ///
-    /// ```diff
-    /// - { base: '/', pattern: 'src/examples/index.html'}
-    /// + { base: '/src/examples', pattern: 'index.html'}
-    /// ```
-    ///
-    /// A folder will be moved to the `base` part, and the `pattern` will be set to `**/*`.
-    ///
-    /// ```diff
-    /// - { base: '/', pattern: 'src/examples'}
-    /// + { base: '/src/examples', pattern: '**/*'}
-    /// ```
-    ///
-    /// In addition, we will canonicalize the base path so we always work with the correctly
-    /// resolved path.
-    pub fn optimize(&mut self) {
-        // Resolve base path immediately
-        let Ok(mut base) = dunce::canonicalize(&self.base) else {
-            event!(Level::ERROR, "Failed to resolve base: {:?}", self.base);
-            return;
-        };
-
-        let mut new_pattern = PathBuf::new();
-        enum ComponentStage {
-            Base,
-            Pattern,
-        }
-        let mut stage = ComponentStage::Base;
-
-        let mut components = Path::new(&self.pattern).components().peekable();
-        while let Some(component) = components.next() {
-            match stage {
-                ComponentStage::Base => {
-                    match component {
-                        // Ignore the current dir, e.g. `.`
-                        Component::CurDir => {}
-
-                        // Go up a directory, e.g. `..`
-                        Component::ParentDir => {
-                            base.pop();
-                        }
-
-                        // Once we hit a component that contains a wildcard character, then we
-                        // can't change the base anymore and we must move to the pattern part.
-                        Component::Normal(part) if part.to_string_lossy().contains("*") => {
-                            new_pattern.push(component);
-                            stage = ComponentStage::Pattern;
-                        }
-
-                        // File or folder, but not the last component
-                        Component::Normal(part) if components.peek().is_some() => {
-                            base.push(part);
-                        }
-
-                        // Last file or folder. If it's a folder, we move it to the base,
-                        // otherwise we move it to the pattern.
-                        Component::Normal(part) => {
-                            let full_path = base.join(part);
-                            if full_path.is_dir() {
-                                base.push(part);
-                            } else {
-                                new_pattern.push(part);
-                            }
-                        }
-
-                        // When we're dealing with an absolute path, then we have to bypass the
-                        // `base` entirely.
-                        Component::Prefix(_) => {
-                            base.clear();
-                            base.push(component);
-                        }
-                        Component::RootDir => {
-                            #[cfg(not(windows))]
-                            base.clear();
-                            base.push(component);
-                        }
-                    }
-                }
-                ComponentStage::Pattern => {
-                    new_pattern.push(component);
-                }
-            }
-        }
-
-        self.base = base.to_string_lossy().to_string();
-        self.pattern = path_to_posix_string(&new_pattern);
-
-        // Ensure we have `**/*` when the base is a folder and we don't have a pattern at all
-        if self.pattern == "" {
-            self.pattern = "/**/*".to_owned();
-        }
-        // Ensure that the pattern is pinned to the base path.
-        else if !self.pattern.starts_with("/") {
-            self.pattern = format!("/{}", self.pattern);
-        }
-    }
-}
-
-fn path_to_posix_string(path: &Path) -> String {
-    let mut parts = Vec::new();
-    let mut is_rooted = false;
-
-    for component in path.components() {
-        match component {
-            Component::Prefix(prefix) => {
-                parts.push(prefix.as_os_str().to_string_lossy().to_string());
-            }
-            Component::RootDir => {
-                is_rooted = true;
-                if parts.is_empty() {
-                    parts.push(String::new());
-                }
-            }
-            Component::CurDir => {
-                parts.push(".".to_string());
-            }
-            Component::ParentDir => {
-                parts.push("..".to_string());
-            }
-            Component::Normal(part) => {
-                parts.push(part.to_string_lossy().to_string());
-            }
-        }
-    }
-
-    let result = parts.join("/");
-    if result.is_empty() && is_rooted {
-        "/".to_string()
-    } else {
-        result
-    }
-}
-
-#[cfg(test)]
-mod tests {
-    use super::*;
-    use pretty_assertions::assert_eq;
-    use std::fs;
-    use tempfile::tempdir;
-
-    #[test]
-    fn path_to_posix_string_serializes_relative_paths() {
-        let path = PathBuf::from("src").join("**").join("*.html");
-
-        assert_eq!(path_to_posix_string(&path), "src/**/*.html");
-    }
-
-    #[test]
-    fn path_to_posix_string_serializes_rooted_paths() {
-        let path = PathBuf::from(std::path::MAIN_SEPARATOR.to_string())
-            .join("src")
-            .join("**")
-            .join("*.html");
-
-        assert_eq!(path_to_posix_string(&path), "/src/**/*.html");
-    }
-
-    #[test]
-    fn path_to_posix_string_serializes_empty_paths() {
-        assert_eq!(path_to_posix_string(&PathBuf::new()), "");
-    }
-
-    #[test]
-    fn optimize_hoists_static_directories_and_keeps_files_in_the_pattern() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src").join("examples")).unwrap();
-
-        let mut source = PublicSourceEntry {
-            base: dir.path().to_string_lossy().to_string(),
-            pattern: "src/examples/index.html".to_string(),
-            negated: false,
-        };
-
-        source.optimize();
-
-        assert_eq!(
-            source.base,
-            dunce::canonicalize(dir.path().join("src").join("examples"))
-                .unwrap()
-                .to_string_lossy()
-        );
-        assert_eq!(source.pattern, "/index.html");
-    }
-
-    #[test]
-    fn optimize_hoists_folder_patterns() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src").join("examples")).unwrap();
-
-        let mut source = PublicSourceEntry {
-            base: dir.path().to_string_lossy().to_string(),
-            pattern: "src/examples".to_string(),
-            negated: false,
-        };
-
-        source.optimize();
-
-        assert_eq!(
-            source.base,
-            dunce::canonicalize(dir.path().join("src").join("examples"))
-                .unwrap()
-                .to_string_lossy()
-        );
-        assert_eq!(source.pattern, "/**/*");
-    }
-
-    #[test]
-    fn optimize_keeps_wildcards_in_the_pattern() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src")).unwrap();
-
-        let mut source = PublicSourceEntry {
-            base: dir.path().to_string_lossy().to_string(),
-            pattern: "src/**/*.html".to_string(),
-            negated: false,
-        };
-
-        source.optimize();
-
-        assert_eq!(
-            source.base,
-            dunce::canonicalize(dir.path().join("src"))
-                .unwrap()
-                .to_string_lossy()
-        );
-        assert_eq!(source.pattern, "/**/*.html");
-    }
-
-    #[test]
-    fn concrete_patterns_are_expanded_to_restrict_their_base() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src")).unwrap();
-        let base = dunce::canonicalize(dir.path().join("src")).unwrap();
-
-        let sources = public_source_entries_to_private_source_entries(vec![PublicSourceEntry {
-            base: dir.path().to_string_lossy().to_string(),
-            pattern: "src/foo.html".to_string(),
-            negated: false,
-        }]);
-
-        assert_eq!(
-            sources,
-            vec![
-                SourceEntry::Ignored {
-                    base: base.clone(),
-                    pattern: "*".to_string(),
-                },
-                SourceEntry::Pattern {
-                    base,
-                    pattern: "/foo.html".to_string(),
-                },
-            ]
-        );
-    }
-
-    #[test]
-    fn restricted_patterns_include_parent_directory_allow_rules() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src")).unwrap();
-        let base = dunce::canonicalize(dir.path().join("src")).unwrap();
-
-        let sources = public_source_entries_to_private_source_entries(vec![PublicSourceEntry {
-            base: dir.path().to_string_lossy().to_string(),
-            pattern: "src/ef*/*.html".to_string(),
-            negated: false,
-        }]);
-
-        assert_eq!(
-            sources,
-            vec![
-                SourceEntry::Ignored {
-                    base: base.clone(),
-                    pattern: "*".to_string(),
-                },
-                SourceEntry::Ignored {
-                    base: base.clone(),
-                    pattern: "!/ef*/".to_string(),
-                },
-                SourceEntry::Pattern {
-                    base,
-                    pattern: "/ef*/*.html".to_string(),
-                },
-            ]
-        );
-    }
-
-    #[test]
-    fn unrestricted_sources_do_not_expand_patterns_for_the_same_base() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src")).unwrap();
-        let base = dunce::canonicalize(dir.path().join("src")).unwrap();
-
-        let sources = public_source_entries_to_private_source_entries(vec![
-            PublicSourceEntry {
-                base: dir.path().to_string_lossy().to_string(),
-                pattern: "src".to_string(),
-                negated: false,
-            },
-            PublicSourceEntry {
-                base: dir.path().to_string_lossy().to_string(),
-                pattern: "src/foo.html".to_string(),
-                negated: false,
-            },
-        ]);
-
-        assert_eq!(
-            sources,
-            vec![
-                SourceEntry::Auto { base: base.clone() },
-                SourceEntry::Pattern {
-                    base,
-                    pattern: "/foo.html".to_string(),
-                },
-            ]
-        );
-    }
-
-    #[test]
-    fn restricted_parent_bases_do_not_open_unrelated_siblings() {
-        let dir = tempdir().unwrap();
-        let project = dir.path().join("Users").join("robin").join("docus-test");
-        fs::create_dir_all(&project).unwrap();
-
-        let users = dunce::canonicalize(dir.path().join("Users")).unwrap();
-        let project = dunce::canonicalize(project).unwrap();
-
-        let sources = public_source_entries_to_private_source_entries(vec![
-            PublicSourceEntry {
-                base: project.to_string_lossy().to_string(),
-                pattern: "**/*".to_string(),
-                negated: false,
-            },
-            PublicSourceEntry {
-                base: project.to_string_lossy().to_string(),
-                pattern: "../../app.config.ts".to_string(),
-                negated: false,
-            },
-        ]);
-
-        assert_eq!(
-            sources,
-            vec![
-                SourceEntry::Auto {
-                    base: project.clone(),
-                },
-                SourceEntry::Ignored {
-                    base: users.clone(),
-                    pattern: "/*".to_string(),
-                },
-                SourceEntry::Pattern {
-                    base: users,
-                    pattern: "/app.config.ts".to_string(),
-                },
-            ]
-        );
-    }
-
-    #[test]
-    fn restricted_patterns_preserve_source_order() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join("src")).unwrap();
-        let base = dunce::canonicalize(dir.path().join("src")).unwrap();
-
-        let sources = public_source_entries_to_private_source_entries(vec![
-            PublicSourceEntry {
-                base: dir.path().to_string_lossy().to_string(),
-                pattern: "src/foo.html".to_string(),
-                negated: false,
-            },
-            PublicSourceEntry {
-                base: dir.path().to_string_lossy().to_string(),
-                pattern: "src/foo.html".to_string(),
-                negated: true,
-            },
-        ]);
-
-        assert_eq!(
-            sources,
-            vec![
-                SourceEntry::Ignored {
-                    base: base.clone(),
-                    pattern: "*".to_string(),
-                },
-                SourceEntry::Pattern {
-                    base: base.clone(),
-                    pattern: "/foo.html".to_string(),
-                },
-                SourceEntry::Ignored {
-                    base,
-                    pattern: "/foo.html".to_string(),
-                },
-            ]
-        );
-    }
-
-    /// Run the public-to-private conversion for an auto-detected source pointing at `base` and
-    /// return the resulting entry.
-    fn auto_source_entry(base: &Path) -> SourceEntry {
-        public_source_entries_to_private_source_entries(vec![PublicSourceEntry {
-            base: base.to_string_lossy().to_string(),
-            pattern: "**/*".to_string(),
-            negated: false,
-        }])
-        .into_iter()
-        .next()
-        .unwrap()
-    }
-
-    #[test]
-    fn auto_detected_folders_become_auto_sources() {
-        let dir = tempdir().unwrap();
-        let base = dir.path().join("src");
-        fs::create_dir_all(&base).unwrap();
-        let base = dunce::canonicalize(&base).unwrap();
-
-        assert_eq!(auto_source_entry(&base), SourceEntry::Auto { base });
-    }
-
-    #[test]
-    fn folders_ignored_by_default_become_external_sources() {
-        let dir = tempdir().unwrap();
-        let base = dir.path().join("node_modules").join("my-lib");
-        fs::create_dir_all(&base).unwrap();
-        let base = dunce::canonicalize(&base).unwrap();
-
-        assert_eq!(auto_source_entry(&base), SourceEntry::External { base });
-    }
-
-    #[test]
-    fn folders_ignored_by_gitignore_become_external_sources() {
-        let dir = tempdir().unwrap();
-        // Pretend this is a git repository so the `.gitignore` search is bounded to it.
-        fs::create_dir_all(dir.path().join(".git")).unwrap();
-        fs::write(dir.path().join(".gitignore"), "dist/\n").unwrap();
-
-        let base = dir.path().join("dist");
-        fs::create_dir_all(&base).unwrap();
-        let base = dunce::canonicalize(&base).unwrap();
-
-        assert_eq!(auto_source_entry(&base), SourceEntry::External { base });
-    }
-
-    #[test]
-    fn folders_ignored_by_a_parent_gitignore_become_external_sources() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join(".git")).unwrap();
-        // A `.gitignore` higher up in the tree should still apply to nested directories.
-        fs::write(dir.path().join(".gitignore"), "generated/\n").unwrap();
-
-        let base = dir.path().join("packages").join("app").join("generated");
-        fs::create_dir_all(&base).unwrap();
-        let base = dunce::canonicalize(&base).unwrap();
-
-        assert_eq!(auto_source_entry(&base), SourceEntry::External { base });
-    }
-
-    #[test]
-    fn folders_not_ignored_by_gitignore_stay_auto_sources() {
-        let dir = tempdir().unwrap();
-        fs::create_dir_all(dir.path().join(".git")).unwrap();
-        fs::write(dir.path().join(".gitignore"), "dist/\n").unwrap();
-
-        let base = dir.path().join("src");
-        fs::create_dir_all(&base).unwrap();
-        let base = dunce::canonicalize(&base).unwrap();
-
-        assert_eq!(auto_source_entry(&base), SourceEntry::Auto { base });
-    }
-}
-
-/// For each public source entry:
-///
-/// 1. Perform brace expansion
-///
-/// ```diff
-/// - { base: '/', pattern: 'src/{foo,bar}.html'}
-/// + { base: '/', pattern: 'src/foo.html'}
-/// + { base: '/', pattern: 'src/bar.html'}
-/// ```
-///
-/// 2. Hoist static parts, e.g.:
-///
-/// ```diff
-/// - { base: '/', pattern: 'src/**/*.html'}
-/// + { base: '/src', pattern: '**/*.html'}
-/// ```
-///
-/// 3. Convert to private SourceEntry
-///
-pub fn public_source_entries_to_private_source_entries(
-    sources: Vec<PublicSourceEntry>,
-) -> Vec<SourceEntry> {
-    // Perform brace expansion
-    let expanded_globs = sources
-        .into_iter()
-        .flat_map(|source| {
-            let expression: Result<Expression, _> = source.pattern[..].try_into();
-            let Ok(expression) = expression else {
-                return vec![source];
-            };
-
-            expression
-                .into_iter()
-                .filter_map(Result::ok)
-                .map(move |pattern| PublicSourceEntry {
-                    base: source.base.clone(),
-                    pattern: pattern.into(),
-                    negated: source.negated,
-                })
-                .collect::<Vec<_>>()
-        })
-        .map(|mut public_source| {
-            public_source.optimize();
-            public_source
-        })
-        .collect::<Vec<_>>();
-
-    // Compiled `.gitignore` matchers are cached per directory so we read and parse each
-    // `.gitignore` file at most once, even though entries commonly share ancestor directories (e.g.
-    // the repository root). A cached `None` means the directory has no `.gitignore` file.
-    let mut gitignores: FxHashMap<PathBuf, Option<Gitignore>> = FxHashMap::default();
-
-    // Boundary for the `.gitignore` walk when a source is not inside a git repository (see below).
-    let cwd = std::env::current_dir()
-        .map(|cwd| dunce::canonicalize(&cwd).unwrap_or(cwd))
-        .ok();
-
-    // Convert from public SourceEntry to private SourceEntry
-    let sources = expanded_globs
-        .into_iter()
-        .map(|public_source| {
-            let mut source: SourceEntry = public_source.into();
-
-            // Promote auto-sources to external sources if they were gitignored
-            if let SourceEntry::Auto { ref base } = source {
-                let inside_git_repo = base.ancestors().any(|dir| dir.join(".git").exists());
-
-                // Walk up from the folder, applying each `.gitignore` relative to the directory
-                // that contains it (matching git), and stop at the git repository root so
-                // `.gitignore` files outside of the repo are not considered.
-                for dir in base.ancestors() {
-                    let gitignore = gitignores.entry(dir.to_path_buf()).or_insert_with(|| {
-                        let path = dir.join(".gitignore");
-
-                        // `Gitignore::new` roots the matcher at the directory containing the file,
-                        // so patterns match relative to it.
-                        path.is_file().then(|| Gitignore::new(&path).0)
-                    });
-
-                    // Only `.gitignore` files in ancestors of `base` can ignore `base` itself.
-                    // Patterns in `base`'s own `.gitignore` only match paths _inside_ `base`, never
-                    // `base` itself (the file walker still applies them to `base`'s contents).
-                    //
-                    // Skipping `base`'s own `.gitignore` also prevents a false positive for
-                    // whitelist style `.gitignore` files, because relativizing `base` against
-                    // itself yields the empty path, which incorrectly matches `/*`.
-                    //
-                    // E.g.:
-                    //
-                    // ```gitignore
-                    // /*
-                    // !/.gitignore
-                    // !/app
-                    // !/public
-                    // ```
-                    //
-                    // Everything inside `base` except `.gitignore`, `app` and `public` is ignored,
-                    // but `base` itself is not.
-                    if dir != base {
-                        if let Some(gitignore) = gitignore {
-                            if gitignore
-                                .matched_path_or_any_parents(&base, true)
-                                .is_ignore()
-                            {
-                                source = SourceEntry::External { base: base.into() };
-                                break;
-                            }
-                        }
-                    }
-
-                    // Stop at the git repository root.
-                    if dir.join(".git").exists() {
-                        break;
-                    }
-
-                    // Without a git repository there is no repository root to stop at. Stop once
-                    // the directory contains the current working directory instead, so `.gitignore`
-                    // files outside of the project (e.g. in the user's home directory) can never
-                    // promote a source to an external source. Note that the file walker still
-                    // applies those `.gitignore` files when deciding which files to scan.
-                    if !inside_git_repo && cwd.as_ref().is_some_and(|cwd| cwd.starts_with(dir)) {
-                        break;
-                    }
-                }
-            }
-
-            source
-        })
-        .collect::<Vec<SourceEntry>>();
-
-    expand_restricted_patterns(sources)
-}
-
-/// Convert a public source entry to a source entry
-impl From<PublicSourceEntry> for SourceEntry {
-    fn from(value: PublicSourceEntry) -> Self {
-        if value.negated {
-            return SourceEntry::Ignored {
-                base: value.base.into(),
-                pattern: value.pattern,
-            };
-        }
-
-        let auto =
-            value.pattern == "/**/*" || PathBuf::from(&value.base).join(&value.pattern).is_dir();
-
-        if !auto {
-            return SourceEntry::Pattern {
-                base: value.base.into(),
-                pattern: value.pattern,
-            };
-        }
-
-        let inside_ignored_content_dir = IGNORED_CONTENT_DIRS.iter().any(|dir| {
-            value.base.contains(&format!(
-                "{}{}{}",
-                std::path::MAIN_SEPARATOR,
-                dir,
-                std::path::MAIN_SEPARATOR
-            )) || value
-                .base
-                .ends_with(&format!("{}{}", std::path::MAIN_SEPARATOR, dir))
-        });
-
-        match inside_ignored_content_dir {
-            false => SourceEntry::Auto {
-                base: value.base.into(),
-            },
-            true => SourceEntry::External {
-                base: value.base.into(),
-            },
-        }
-    }
-}
-
-impl From<GlobEntry> for SourceEntry {
-    fn from(value: GlobEntry) -> Self {
-        SourceEntry::Pattern {
-            base: PathBuf::from(value.base),
-            pattern: value.pattern,
-        }
-    }
-}
-
-impl From<SourceEntry> for GlobEntry {
-    fn from(value: SourceEntry) -> Self {
-        match value {
-            SourceEntry::Auto { base } | SourceEntry::External { base } => GlobEntry {
-                base: base.to_string_lossy().into(),
-                pattern: "**/*".into(),
-            },
-            SourceEntry::Pattern { base, pattern } => GlobEntry {
-                base: base.to_string_lossy().into(),
-                pattern: pattern.clone(),
-            },
-            SourceEntry::Ignored { base, pattern } => GlobEntry {
-                base: base.to_string_lossy().into(),
-                pattern: pattern.clone(),
-            },
-        }
-    }
-}
-
-impl From<&SourceEntry> for GlobEntry {
-    fn from(value: &SourceEntry) -> Self {
-        match value {
-            SourceEntry::Auto { base } | SourceEntry::External { base } => GlobEntry {
-                base: base.to_string_lossy().into(),
-                pattern: "**/*".into(),
-            },
-            SourceEntry::Pattern { base, pattern } => GlobEntry {
-                base: base.to_string_lossy().into(),
-                pattern: pattern.clone(),
-            },
-            SourceEntry::Ignored { base, pattern } => GlobEntry {
-                base: base.to_string_lossy().into(),
-                pattern: pattern.clone(),
-            },
-        }
-    }
-}
diff --git a/crates/oxide/tests/scanner.rs b/crates/oxide/tests/scanner.rs
index fb5354a87..c5556aaa2 100644
--- a/crates/oxide/tests/scanner.rs
+++ b/crates/oxide/tests/scanner.rs
@@ -1,8 +1,5 @@
 #[cfg(test)]
 mod scanner {
-    use insta::assert_snapshot;
-    use pretty_assertions::assert_eq;
-    use std::path::{Path, PathBuf};
     use std::process::Command;
     use std::thread::sleep;
     use std::time::Duration;
@@ -11,204 +8,6 @@ mod scanner {
     use tailwindcss_oxide::*;
     use tempfile::tempdir;
 
-    fn symlink<P: AsRef<Path>, Q: AsRef<Path>>(original: P, link: Q) -> std::io::Result<()> {
-        #[cfg(not(windows))]
-        let result = std::os::unix::fs::symlink(original, link);
-
-        #[cfg(windows)]
-        let result = std::os::windows::fs::symlink_dir(original, link);
-
-        result
-    }
-
-    fn symlink_file<P: AsRef<Path>, Q: AsRef<Path>>(original: P, link: Q) -> std::io::Result<()> {
-        #[cfg(not(windows))]
-        let result = std::os::unix::fs::symlink(original, link);
-
-        #[cfg(windows)]
-        let result = std::os::windows::fs::symlink_file(original, link);
-
-        result
-    }
-
-    fn public_source_entry_from_pattern(dir: PathBuf, pattern: &str) -> PublicSourceEntry {
-        let mut parts = pattern.split_whitespace();
-        let _ = parts.next().unwrap_or_default();
-        let not_or_pattern = parts.next().unwrap_or_default();
-        if not_or_pattern == "not" {
-            let pattern = parts.next().unwrap_or_default();
-            return PublicSourceEntry {
-                base: dir.to_string_lossy().into(),
-                pattern: pattern[1..pattern.len() - 1].to_string(),
-                negated: true,
-            };
-        }
-
-        PublicSourceEntry {
-            base: dir.to_string_lossy().into(),
-            pattern: not_or_pattern[1..not_or_pattern.len() - 1].to_string(),
-            negated: false,
-        }
-    }
-
-    struct ScanResult {
-        files: Vec<String>,
-        globs: Vec<String>,
-        normalized_sources: Vec<String>,
-        candidates: Vec<String>,
-        tree: String,
-    }
-
-    /// Renders the directory as a tree, annotating every file and folder with an indicator that
-    /// shows whether the scanner picked it up:
-    ///
-    /// - `✓` — scanned
-    /// - `✗` — ignored / skipped
-    ///
-    /// Symlinks are rendered as `link → target`, where the target is shown relative to the folder
-    /// containing the symlink. The contents of every `.gitignore` file are printed right below the
-    /// file itself.
-    ///
-    /// Folders that are a git repository root (they contain a `.git` folder) are marked with
-    /// `(git)`, because ignore rules behave differently inside and outside of a repository.
-    fn fs_tree(root: &Path, scanned: &[String]) -> String {
-        /// Computes the relative path from `parent` to `target`, where both are relative to the
-        /// same root, e.g.: `b/c` seen from `b` is `c`, and the root itself seen from `b` is `..`.
-        fn relative_to(target: &Path, parent: &Path) -> String {
-            let target = target.components().collect::<Vec<_>>();
-            let parent = parent.components().collect::<Vec<_>>();
-
-            let common = target
-                .iter()
-                .zip(&parent)
-                .take_while(|(a, b)| **a == **b)
-                .count();
-
-            let mut parts = vec![".."; parent.len() - common];
-            parts.extend(
-                target[common..]
-                    .iter()
-                    .map(|component| component.as_os_str().to_str().unwrap()),
-            );
-
-            if parts.is_empty() {
-                // The symlink points to its own parent folder
-                ".".into()
-            } else {
-                parts.join("/")
-            }
-        }
-
-        fn walk(
-            dir: &Path,
-            root: &Path,
-            prefix: &str,
-            scanned: &[String],
-            visited: &mut Vec<PathBuf>,
-            out: &mut String,
-        ) {
-            let mut entries = fs::read_dir(dir)
-                .unwrap()
-                .filter_map(Result::ok)
-                .filter(|entry| entry.file_name() != ".git")
-                .collect::<Vec<_>>();
-            entries.sort_by_key(|entry| entry.file_name());
-
-            for (i, entry) in entries.iter().enumerate() {
-                let last = i == entries.len() - 1;
-                let connector = if last { "└── " } else { "├── " };
-                let child_prefix = if last { "    " } else { "│   " };
-
-                let path = entry.path();
-                let name = entry.file_name().to_string_lossy().to_string();
-                let rel = path
-                    .strip_prefix(root)
-                    .unwrap()
-                    .to_string_lossy()
-                    .replace('\\', "/");
-
-                let file_type = entry.file_type().unwrap();
-
-                // a file is scanned when it shows up in the scanned files list. a folder is
-                // considered scanned when any scanned file lives inside of it. paths that go
-                // through a symlink count towards the symlink, not towards the target directory.
-                let dir_prefix = format!("{rel}/");
-                let is_scanned = scanned
-                    .iter()
-                    .any(|file| file == &rel || file.starts_with(&dir_prefix));
-                let indicator = if is_scanned { "✓" } else { "✗" };
-
-                let mut display_name = name.clone();
-                if path.join(".git").exists() {
-                    display_name = format!("{display_name} (git)");
-                }
-                if file_type.is_symlink() {
-                    if let Ok(target) = fs::read_link(&path) {
-                        // Show the target relative to the folder containing the symlink, or as-is
-                        // when it points outside of the tree.
-                        let target = match (target.strip_prefix(root), dir.strip_prefix(root)) {
-                            (Ok(target), Ok(parent)) => relative_to(target, parent),
-                            _ => target.to_string_lossy().replace('\\', "/"),
-                        };
-                        display_name = format!("{name} → {target}");
-
-                        // The symlink points to a target that doesn't exist
-                        if path.metadata().is_err() {
-                            display_name = format!("{display_name} (broken)");
-                        }
-                    }
-                }
-
-                out.push_str(&format!("{prefix}{connector}{indicator} {display_name}\n"));
-
-                // Print the contents of `.gitignore` files below the file itself, so the ignore
-                // rules are visible in the same output.
-                if name == ".gitignore" {
-                    if let Ok(contents) = fs::read_to_string(&path) {
-                        for line in contents.lines() {
-                            let line = format!("{prefix}{child_prefix}    {line}");
-                            out.push_str(line.trim_end());
-                            out.push('\n');
-                        }
-                    }
-                }
-
-                // Descend into directories, including symlinked ones. The paths inside a symlinked
-                // directory are computed through the symlink, so the indicators show what the
-                // scanner saw via that route. A visited stack prevents symlink cycles from
-                // recursing forever.
-                if path.metadata().map(|meta| meta.is_dir()).unwrap_or(false) {
-                    let Ok(canonical) = dunce::canonicalize(&path) else {
-                        continue;
-                    };
-                    if visited.contains(&canonical) {
-                        continue;
-                    }
-
-                    visited.push(canonical);
-                    walk(
-                        &path,
-                        root,
-                        &format!("{prefix}{child_prefix}"),
-                        scanned,
-                        visited,
-                        out,
-                    );
-                    visited.pop();
-                }
-            }
-        }
-
-        let mut visited = vec![dunce::canonicalize(root).unwrap()];
-        let mut out = if root.join(".git").exists() {
-            String::from(". (git)\n")
-        } else {
-            String::from(".\n")
-        };
-        walk(root, root, "", scanned, &mut visited, &mut out);
-        out
-    }
-
     fn create_files_in(dir: &path::Path, paths: &[(&str, &str)]) {
         // Create the necessary files
         for (path, contents) in paths {
@@ -223,57 +22,10 @@ mod scanner {
         }
     }
 
-    fn scanned_files(scanner: &mut Scanner, base: &Path) -> Vec<String> {
-        let base_dir =
-            format!("{}{}", dunce::canonicalize(base).unwrap().display(), "/").replace('\\', "/");
-
-        let mut files = scanner
-            .get_files()
-            .iter()
-            // Normalize paths to use unix style separators
-            .map(|file| file.replace('\\', "/").replace(&base_dir, ""))
-            .collect::<Vec<_>>();
-        files.sort();
-        files
-    }
-
-    fn scanned_globs(scanner: &mut Scanner, base: &Path) -> Vec<String> {
-        let base_dir =
-            format!("{}{}", dunce::canonicalize(base).unwrap().display(), "/").replace('\\', "/");
-
-        let mut globs = scanner
-            .get_globs()
-            .iter()
-            .map(|glob| {
-                if glob.pattern.starts_with('/') {
-                    format!("{}{}", glob.base, glob.pattern)
-                } else {
-                    format!("{}/{}", glob.base, glob.pattern)
-                }
-            })
-            // Normalize paths to use unix style separators
-            .map(|file| file.replace('\\', "/").replace(&base_dir, ""))
-            .collect::<Vec<_>>();
-        globs.sort();
-        globs
-    }
-
-    fn normalize_files(files: Vec<String>, base: &Path) -> Vec<String> {
-        let base_dir =
-            format!("{}{}", dunce::canonicalize(base).unwrap().display(), "/").replace('\\', "/");
-
-        let mut files = files
-            .iter()
-            .map(|file| file.replace('\\', "/").replace(&base_dir, ""))
-            .collect::<Vec<_>>();
-        files.sort();
-        files
-    }
-
     fn scan_with_globs(
         paths_with_content: &[(&str, &str)],
-        source_directives: Vec<&str>,
-    ) -> ScanResult {
+        globs: Vec<&str>,
+    ) -> (Vec<String>, Vec<String>) {
         // Create a temporary working directory
         let dir = tempdir().unwrap().into_path();
 
@@ -286,167 +38,101 @@ mod scanner {
         let base = format!("{}", dir.display()).replace('\\', "/");
 
         // Resolve all content paths for the (temporary) current working directory
-        let sources: Vec<PublicSourceEntry> = source_directives
+        let mut sources: Vec<GlobEntry> = globs
             .iter()
-            .map(|str| public_source_entry_from_pattern(base.clone().into(), str))
+            .map(|x| GlobEntry {
+                base: base.clone(),
+                pattern: x.to_string(),
+            })
             .collect();
 
-        let mut scanner = Scanner::new(sources);
+        sources.push(GlobEntry {
+            base: base.clone(),
+            pattern: "**/*".to_string(),
+        });
+
+        let mut scanner = Scanner::new(Some(sources));
 
         let candidates = scanner.scan();
-        let base_dir =
+
+        let mut paths: Vec<_> = scanner.get_files();
+
+        for glob in scanner.get_globs() {
+            paths.push(format!("{}{}{}", glob.base, "/", glob.pattern));
+        }
+
+        let parent_dir =
             format!("{}{}", dunce::canonicalize(&base).unwrap().display(), "/").replace('\\', "/");
 
-        // Get all scanned files as strings relative to the base directory
-        let files = scanned_files(&mut scanner, Path::new(&base));
-
-        // Get all scanned globs as strings relative to the base directory
-        let globs = scanned_globs(&mut scanner, Path::new(&base));
-
-        // Get all normalized sources as strings relative to the base directory
-        let mut normalized_sources = scanner
-            .get_normalized_sources()
-            .iter()
-            .map(|glob| {
-                if glob.pattern.starts_with('/') {
-                    format!("{}{}", glob.base, glob.pattern)
-                } else {
-                    format!("{}/{}", glob.base, glob.pattern)
-                }
+        paths = paths
+            .into_iter()
+            .map(|x| {
+                // Normalize paths to use unix style separators
+                x.replace('\\', "/").replace(&parent_dir, "")
             })
-            // Normalize paths to use unix style separators
-            .map(|file| file.replace('\\', "/").replace(&base_dir, ""))
-            .collect::<Vec<_>>();
-        normalized_sources.sort();
+            .collect();
 
-        let tree = fs_tree(&dir, &files);
+        // Sort the output for easier comparison (depending on internal data structure the order
+        // _could_ be random)
+        paths.sort();
 
-        ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            candidates,
-            tree,
-        }
+        (paths, candidates)
     }
 
-    fn scan(paths_with_content: &[(&str, &str)]) -> ScanResult {
-        scan_with_globs(paths_with_content, vec!["@source '**/*'"])
+    fn scan(paths_with_content: &[(&str, &str)]) -> (Vec<String>, Vec<String>) {
+        scan_with_globs(paths_with_content, vec![])
+    }
+
+    fn test(paths_with_content: &[(&str, &str)]) -> Vec<String> {
+        scan(paths_with_content).0
     }
 
     #[test]
     fn it_should_work_with_a_set_of_root_files() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("a.html", ""),
             ("b.html", ""),
             ("c.html", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ a.html
-        ├── ✓ b.html
-        ├── ✓ c.html
-        └── ✓ index.html
-        ");
-        assert_eq!(files, vec!["a.html", "b.html", "c.html", "index.html"]);
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
+        assert_eq!(globs, vec!["*", "a.html", "b.html", "c.html", "index.html"]);
     }
 
     #[test]
     fn it_should_work_with_a_set_of_root_files_and_ignore_ignored_files() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             (".gitignore", "b.html"),
             ("index.html", ""),
             ("a.html", ""),
             ("b.html", ""),
             ("c.html", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       b.html
-        ├── ✓ a.html
-        ├── ✗ b.html
-        ├── ✓ c.html
-        └── ✓ index.html
-        ");
-
-        assert_eq!(files, vec!["a.html", "c.html", "index.html"]);
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
+        assert_eq!(globs, vec!["*", "a.html", "c.html", "index.html"]);
     }
 
     #[test]
     fn it_should_list_all_files_in_the_public_folder_explicitly() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("public/a.html", ""),
             ("public/b.html", ""),
             ("public/c.html", ""),
-            ("public/nested/c.html", ""),
-            ("public/deeply/nested/c.html", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ index.html
-        └── ✓ public
-            ├── ✓ a.html
-            ├── ✓ b.html
-            ├── ✓ c.html
-            ├── ✓ deeply
-            │   └── ✓ nested
-            │       └── ✓ c.html
-            └── ✓ nested
-                └── ✓ c.html
-        ");
-
         assert_eq!(
-            files,
+            globs,
             vec![
+                "*",
                 "index.html",
                 "public/a.html",
                 "public/b.html",
                 "public/c.html",
-                "public/deeply/nested/c.html",
-                "public/nested/c.html",
             ]
         );
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
     }
 
     #[test]
     fn it_should_list_nested_folders_explicitly_in_the_public_folder() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("public/a.html", ""),
             ("public/b.html", ""),
@@ -457,29 +143,10 @@ mod scanner {
             ("public/nested/again/a.html", ""),
             ("public/very/deeply/nested/a.html", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ index.html
-        └── ✓ public
-            ├── ✓ a.html
-            ├── ✓ b.html
-            ├── ✓ c.html
-            ├── ✓ nested
-            │   ├── ✓ a.html
-            │   ├── ✓ again
-            │   │   └── ✓ a.html
-            │   ├── ✓ b.html
-            │   └── ✓ c.html
-            └── ✓ very
-                └── ✓ deeply
-                    └── ✓ nested
-                        └── ✓ a.html
-        ");
-
         assert_eq!(
-            files,
+            globs,
             vec![
+                "*",
                 "index.html",
                 "public/a.html",
                 "public/b.html",
@@ -491,226 +158,72 @@ mod scanner {
                 "public/very/deeply/nested/a.html",
             ]
         );
-        assert_eq!(globs, vec!["*",]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
     }
 
     #[test]
     fn it_should_list_all_files_in_the_public_folder_explicitly_except_ignored_files() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             (".gitignore", "public/b.html\na.html"),
             ("index.html", ""),
             ("public/a.html", ""),
             ("public/b.html", ""),
             ("public/c.html", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       public/b.html
-        │       a.html
-        ├── ✓ index.html
-        └── ✓ public
-            ├── ✗ a.html
-            ├── ✗ b.html
-            └── ✓ c.html
-        ");
-
-        assert_eq!(files, vec!["index.html", "public/c.html",]);
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
+        assert_eq!(globs, vec!["*", "index.html", "public/c.html",]);
     }
 
     #[test]
     fn it_should_use_a_glob_for_top_level_folders() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("src/a.html", ""),
             ("src/b.html", ""),
             ("src/c.html", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ index.html
-        └── ✓ src
-            ├── ✓ a.html
-            ├── ✓ b.html
-            └── ✓ c.html
-        ");
-
-        assert_eq!(
-            files,
-            vec!["index.html", "src/a.html", "src/b.html", "src/c.html"]
-        );
-        assert_eq!(globs, vec![
-            "*",
+        assert_eq!(globs, vec!["*",
+            "index.html",
             "src/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
+            "src/a.html",
+            "src/b.html",
+            "src/c.html"
         ]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
     }
 
     #[test]
     fn it_should_ignore_binary_files() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("a.mp4", ""),
             ("b.png", ""),
             ("c.lock", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ a.mp4
-        ├── ✗ b.png
-        ├── ✗ c.lock
-        └── ✓ index.html
-        ");
-
-        assert_eq!(files, vec!["index.html"]);
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17569
-    #[test]
-    fn it_should_not_ignore_folders_that_end_with_a_binary_extension() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
-            // Looks like `.pages` binary extension, but it's a folder
-            ("some.pages/index.html", "content-['some.pages/index.html']"),
-            // Ignore a specific folder. This is to ensure that this still "wins" from the internal
-            // solution of dealing with binary extensions for files only.
-            (".gitignore", "other.pages"),
-            (
-                "other.pages/index.html",
-                "content-['other.pages/index.html']",
-            ),
-        ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       other.pages
-        ├── ✗ other.pages
-        │   └── ✗ index.html
-        └── ✓ some.pages
-            └── ✓ index.html
-        ");
-
-        assert_eq!(files, vec!["some.pages/index.html"]);
-        assert_eq!(globs, vec!["*", "some.pages/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
+        assert_eq!(globs, vec!["*", "index.html"]);
     }
 
     #[test]
     fn it_should_ignore_known_extensions() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("a.css", ""),
             ("b.sass", ""),
             ("c.less", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ a.css
-        ├── ✗ b.sass
-        ├── ✗ c.less
-        └── ✓ index.html
-        ");
-
-        assert_eq!(files, vec!["a.css", "index.html"]);
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
-    }
-
-    #[test]
-    fn it_should_find_new_extensions() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[("src/index.my-extension", "")]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            └── ✓ index.my-extension
-        ");
-
-        assert_eq!(files, vec!["src/index.my-extension"]);
-        assert_eq!(globs, vec!["*", "src/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,my-extension,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
+        assert_eq!(globs, vec!["*", "index.html"]);
     }
 
     #[test]
     fn it_should_ignore_known_files() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             ("index.html", ""),
             ("package-lock.json", ""),
             ("yarn.lock", ""),
         ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ index.html
-        ├── ✗ package-lock.json
-        └── ✗ yarn.lock
-        ");
-
-        assert_eq!(files, vec!["index.html"]);
-        assert_eq!(globs, vec!["*"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
+        assert_eq!(globs, vec!["*", "index.html"]);
     }
 
     #[test]
     fn it_should_ignore_and_expand_nested_ignored_folders() {
-        let ScanResult {
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let globs = test(&[
             // Explicitly listed root files
             ("foo.html", ""),
             ("bar.html", ""),
@@ -753,81 +266,39 @@ mod scanner {
             ("nested-d/very/deeply/nested/directory/again/foo.html", ""),
         ]);
 
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ bar.html
-        ├── ✓ baz.html
-        ├── ✓ foo.html
-        ├── ✓ nested-a
-        │   ├── ✓ bar.html
-        │   ├── ✓ baz.html
-        │   └── ✓ foo.html
-        ├── ✓ nested-b
-        │   └── ✓ deeply-nested
-        │       ├── ✓ bar.html
-        │       ├── ✓ baz.html
-        │       └── ✓ foo.html
-        ├── ✓ nested-c
-        │   ├── ✗ .gitignore
-        │   │       ignored-folder/
-        │   ├── ✓ bar.html
-        │   ├── ✓ baz.html
-        │   ├── ✓ foo.html
-        │   ├── ✗ ignored-folder
-        │   │   ├── ✗ bar.html
-        │   │   ├── ✗ baz.html
-        │   │   └── ✗ foo.html
-        │   └── ✓ sibling-folder
-        │       ├── ✓ bar.html
-        │       ├── ✓ baz.html
-        │       └── ✓ foo.html
-        └── ✓ nested-d
-            ├── ✗ .gitignore
-            │       deep/
-            ├── ✓ bar.html
-            ├── ✓ baz.html
-            ├── ✓ foo.html
-            └── ✓ very
-                └── ✓ deeply
-                    └── ✓ nested
-                        ├── ✓ bar.html
-                        ├── ✓ baz.html
-                        ├── ✗ deep
-                        │   ├── ✗ bar.html
-                        │   ├── ✗ baz.html
-                        │   └── ✗ foo.html
-                        ├── ✓ directory
-                        │   ├── ✓ again
-                        │   │   └── ✓ foo.html
-                        │   ├── ✓ bar.html
-                        │   ├── ✓ baz.html
-                        │   └── ✓ foo.html
-                        └── ✓ foo.html
-        ");
-
         assert_eq!(
-            files,
+            globs,
             vec![
+                "*",
                 "bar.html",
                 "baz.html",
                 "foo.html",
+                "nested-a/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-a/bar.html",
                 "nested-a/baz.html",
                 "nested-a/foo.html",
+                "nested-b/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-b/deeply-nested/bar.html",
                 "nested-b/deeply-nested/baz.html",
                 "nested-b/deeply-nested/foo.html",
+                "nested-c/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-c/bar.html",
                 "nested-c/baz.html",
                 "nested-c/foo.html",
+                "nested-c/sibling-folder/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-c/sibling-folder/bar.html",
                 "nested-c/sibling-folder/baz.html",
                 "nested-c/sibling-folder/foo.html",
+                "nested-d/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-d/bar.html",
                 "nested-d/baz.html",
                 "nested-d/foo.html",
+                "nested-d/very/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
+                "nested-d/very/deeply/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
+                "nested-d/very/deeply/nested/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-d/very/deeply/nested/bar.html",
                 "nested-d/very/deeply/nested/baz.html",
+                "nested-d/very/deeply/nested/directory/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
                 "nested-d/very/deeply/nested/directory/again/foo.html",
                 "nested-d/very/deeply/nested/directory/bar.html",
                 "nested-d/very/deeply/nested/directory/baz.html",
@@ -835,19 +306,6 @@ mod scanner {
                 "nested-d/very/deeply/nested/foo.html",
             ]
         );
-        assert_eq!(globs, vec![
-            "*",
-            "nested-a/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-b/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-c/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-c/sibling-folder/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-d/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-d/very/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-d/very/deeply/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-d/very/deeply/nested/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            "nested-d/very/deeply/nested/directory/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-        ]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
     }
 
     #[test]
@@ -856,12 +314,7 @@ mod scanner {
         ignores.push_str("# md:font-bold\n");
         ignores.push_str("foo.html\n");
 
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan(&[
+        let candidates = scan(&[
             // The gitignore file is used to filter out files but not scanned for candidates
             (".gitignore", &ignores),
             // A file that should definitely be scanned
@@ -880,22 +333,8 @@ mod scanner {
             ("index2.svelte", "<div\n\tclass:px-5='condition'></div>"),
             ("index3.svelte", "<div\n  class:px-6='condition'></div>"),
             ("index4.svelte", "<div\nclass:px-7='condition'></div>"),
-        ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       # md:font-bold
-        │       foo.html
-        ├── ✗ foo.html
-        ├── ✗ foo.jpg
-        ├── ✓ index.angular.html
-        ├── ✓ index.html
-        ├── ✓ index.svelte
-        ├── ✓ index2.svelte
-        ├── ✓ index3.svelte
-        └── ✓ index4.svelte
-        ");
+        ])
+        .1;
 
         assert_eq!(
             candidates,
@@ -912,107 +351,32 @@ mod scanner {
                 "underline"
             ]
         );
-        assert_eq!(normalized_sources, vec!["**/*"]);
     }
 
     #[test]
     fn it_should_be_possible_to_scan_in_the_parent_directory() {
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
+        let candidates = scan_with_globs(
             &[("foo/bar/baz/foo.html", "content-['foo.html']")],
-            vec!["@source '**/*'", "@source './foo/bar/baz/..'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ foo
-            └── ✓ bar
-                └── ✓ baz
-                    └── ✓ foo.html
-        ");
+            vec!["./foo/bar/baz/.."],
+        )
+        .1;
 
         assert_eq!(candidates, vec!["content-['foo.html']"]);
-        assert_eq!(normalized_sources, vec!["**/*", "foo/bar/**/*"]);
-    }
-
-    #[test]
-    fn it_should_preserve_source_order_when_referencing_a_sibling_project() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("project-a/src/index.css", ""),
-                ("project-b/keep/keep.html", "content-['GOOD-1']"),
-                ("project-b/ignored/ignored.html", "content-['BAD-1']"),
-                ("project-b/ignored/except.html", "content-['GOOD-2']"),
-            ],
-        );
-
-        let base = dir.join("project-a/src");
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(base.clone(), "@source '../../project-b'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../../project-b/ignored'"),
-            public_source_entry_from_pattern(
-                base.clone(),
-                "@source '../../project-b/ignored/except.html'",
-            ),
-        ]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ project-a
-        │   └── ✗ src
-        │       └── ✗ index.css
-        └── ✓ project-b
-            ├── ✓ ignored
-            │   ├── ✓ except.html
-            │   └── ✗ ignored.html
-            └── ✓ keep
-                └── ✓ keep.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['GOOD-1']", "content-['GOOD-2']"]);
     }
 
     #[test]
     fn it_should_scan_files_without_extensions() {
         // These look like folders, but they are files
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[("my-file", "content-['my-file']")],
-            vec!["@source '**/*'", "@source './my-file'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ my-file
-        ");
+        let candidates =
+            scan_with_globs(&[("my-file", "content-['my-file']")], vec!["./my-file"]).1;
 
         assert_eq!(candidates, vec!["content-['my-file']"]);
-        assert_eq!(normalized_sources, vec!["**/*", "my-file"]);
     }
 
     #[test]
     fn it_should_scan_folders_with_extensions() {
         // These look like files, but they are folders
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
+        let candidates = scan_with_globs(
             &[
                 (
                     "my-folder.templates/foo.html",
@@ -1023,20 +387,9 @@ mod scanner {
                     "content-['my-folder.bin/foo.html']",
                 ),
             ],
-            vec![
-                "@source '**/*'",
-                "@source './my-folder.templates'",
-                "@source './my-folder.bin'",
-            ],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ my-folder.bin
-        │   └── ✓ foo.html
-        └── ✓ my-folder.templates
-            └── ✓ foo.html
-        ");
+            vec!["./my-folder.templates", "./my-folder.bin"],
+        )
+        .1;
 
         assert_eq!(
             candidates,
@@ -1045,185 +398,26 @@ mod scanner {
                 "content-['my-folder.templates/foo.html']",
             ]
         );
-        assert_eq!(
-            normalized_sources,
-            vec!["**/*", "my-folder.bin/**/*", "my-folder.templates/**/*"]
-        );
     }
 
     #[test]
     fn it_should_scan_content_paths() {
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
+        let candidates = scan_with_globs(
             &[
                 // We know that `.styl` extensions are ignored, so they are not covered by auto content
                 // detection.
                 ("foo.styl", "content-['foo.styl']"),
             ],
-            vec!["@source '**/*'", "@source '*.styl'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ foo.styl
-        ");
+            vec!["*.styl"],
+        )
+        .1;
 
         assert_eq!(candidates, vec!["content-['foo.styl']"]);
-        assert_eq!(normalized_sources, vec!["**/*", "*.styl"]);
-    }
-
-    #[test]
-    fn it_should_drop_invalid_utf8_candidates() {
-        let dir = tempdir().unwrap();
-        fs::write(dir.path().join("index.html"), b"flex bg-[\x80] block").unwrap();
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.path().to_path_buf(),
-            "@source '*.html'",
-        )]);
-
-        let candidates = scanner
-            .scan()
-            .into_iter()
-            .map(String::into_bytes)
-            .collect::<Vec<_>>();
-
-        assert_eq!(candidates, vec![b"block".to_vec(), b"flex".to_vec()]);
-    }
-
-    #[test]
-    fn it_should_not_store_invalid_utf8_candidates_during_incremental_scans() {
-        let dir = tempdir().unwrap();
-        let file = dir.path().join("index.html");
-        fs::write(&file, b"flex bg-[\x80]").unwrap();
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.path().to_path_buf(),
-            "@source '*.html'",
-        )]);
-
-        let candidates = scanner
-            .scan_content(vec![ChangedContent::File(file, "html".into())])
-            .into_iter()
-            .map(String::into_bytes)
-            .collect::<Vec<_>>();
-        assert_eq!(candidates, vec![b"flex".to_vec()]);
-
-        let candidates =
-            scanner.scan_content(vec![ChangedContent::Content("block".into(), "html".into())]);
-        assert_eq!(candidates, vec!["block"]);
-
-        let candidates = scanner
-            .scan()
-            .into_iter()
-            .map(String::into_bytes)
-            .collect::<Vec<_>>();
-        assert_eq!(candidates, vec![b"block".to_vec(), b"flex".to_vec()]);
-    }
-
-    #[test]
-    fn it_should_drop_invalid_utf8_candidates_with_positions() {
-        let dir = tempdir().unwrap();
-        let file = dir.path().join("index.html");
-        fs::write(
-            &file,
-            b"flex bg-[\x80] group-[]:block group-[]:bg-[\x80] grid",
-        )
-        .unwrap();
-
-        let mut scanner = Scanner::new(vec![]);
-        let candidates = scanner
-            .get_candidates_with_positions(ChangedContent::File(file, "html".into()))
-            .into_iter()
-            .map(|(candidate, position)| (candidate.into_bytes(), position))
-            .collect::<Vec<_>>();
-
-        assert_eq!(
-            candidates,
-            vec![
-                (b"flex".to_vec(), 0),
-                (b"group-[]:block".to_vec(), 12),
-                (b"grid".to_vec(), 43),
-            ]
-        );
-    }
-
-    #[test]
-    fn it_should_preserve_valid_utf8_candidates() {
-        let dir = tempdir().unwrap();
-        fs::write(
-            dir.path().join("index.html"),
-            "before:content-['💩'] bg-[é] font-[中文]".as_bytes(),
-        )
-        .unwrap();
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.path().to_path_buf(),
-            "@source '*.html'",
-        )]);
-
-        assert_eq!(
-            scanner.scan(),
-            vec!["before:content-['💩']", "bg-[é]", "font-[中文]"]
-        );
-    }
-
-    #[test]
-    fn it_should_preserve_paths_for_sources_ending_in_a_deep_glob() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                (
-                    "blog/2024/foo/bar/baz/index.html",
-                    "content-['blog/2024/foo/bar/baz/index.html']",
-                ),
-                (
-                    "blog/2024/foo/bar/qux/index.html",
-                    "content-['blog/2024/foo/bar/qux/index.html']",
-                ),
-            ],
-            vec!["@source './blog/*/foo/bar/baz/**/*'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ blog
-            └── ✓ 2024
-                └── ✓ foo
-                    └── ✓ bar
-                        ├── ✓ baz
-                        │   └── ✓ index.html
-                        └── ✗ qux
-                            └── ✗ index.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['blog/2024/foo/bar/baz/index.html']"]
-        );
-        assert_eq!(files, vec!["blog/2024/foo/bar/baz/index.html"]);
-        assert_eq!(globs, vec!["blog/*/foo/bar/baz/**/*"]);
-        assert_eq!(normalized_sources, vec!["blog/*/foo/bar/baz/**/*"]);
     }
 
     #[test]
     fn it_should_scan_next_dynamic_folders() {
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
+        let candidates = scan_with_globs(
             &[
                 // We know that `.styl` extensions are ignored, so they are not covered by auto content
                 // detection.
@@ -1232,21 +426,9 @@ mod scanner {
                 ("app/[[...slug]]/page.styl", "content-['[[...slug]]']"),
                 ("app/(theme)/page.styl", "content-['(theme)']"),
             ],
-            vec!["@source '**/*'", "@source './**/*.{styl}'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ app
-            ├── ✓ (theme)
-            │   └── ✓ page.styl
-            ├── ✓ [...slug]
-            │   └── ✓ page.styl
-            ├── ✓ [[...slug]]
-            │   └── ✓ page.styl
-            └── ✓ [slug]
-                └── ✓ page.styl
-        ");
+            vec!["./**/*.{styl}"],
+        )
+        .1;
 
         assert_eq!(
             candidates,
@@ -1257,7 +439,6 @@ mod scanner {
                 "content-['[slug]']",
             ],
         );
-        assert_eq!(normalized_sources, vec!["**/*", "**/*.styl"]);
     }
 
     #[test]
@@ -1280,60 +461,38 @@ mod scanner {
         // Get POSIX-style absolute path
         let full_path = format!("{}", dir.display()).replace('\\', "/");
 
-        let sources = vec![PublicSourceEntry {
+        let sources = vec![GlobEntry {
             base: full_path.clone(),
             pattern: full_path.clone(),
-            negated: false,
         }];
 
-        let mut scanner = Scanner::new(sources);
+        let mut scanner = Scanner::new(Some(sources));
         let candidates = scanner.scan();
 
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        ├── ✓ project-a
-        │   └── ✓ index.html
-        └── ✓ project-b
-            └── ✓ index.html
-        ");
-
         // We've done the initial scan and found the files
         assert_eq!(
             candidates,
             vec![
-                "content-['project-a/index.html']",
-                "content-['project-b/index.html']"
+                "content-['project-a/index.html']".to_owned(),
+                "content-['project-b/index.html']".to_owned(),
             ]
         );
     }
 
     #[test]
     fn it_should_scan_content_paths_even_when_they_are_git_ignored() {
-        let ScanResult {
-            candidates,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
+        let candidates = scan_with_globs(
             &[
                 (".gitignore", "foo.styl"),
                 // We know that `.styl` extensions are ignored, so they are not covered by auto content
                 // detection.
                 ("foo.styl", "content-['foo.styl']"),
             ],
-            // But explicitly including them should still work
-            vec!["@source '**/*'", "@source 'foo.styl'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       foo.styl
-        └── ✓ foo.styl
-        ");
+            vec!["foo.styl"],
+        )
+        .1;
 
         assert_eq!(candidates, vec!["content-['foo.styl']"]);
-        assert_eq!(normalized_sources, vec!["**/*", "foo.styl"]);
     }
 
     #[test]
@@ -1354,27 +513,25 @@ mod scanner {
         );
 
         let sources = vec![
-            public_source_entry_from_pattern(dir.join("project-a"), "@source '**/*'"),
-            public_source_entry_from_pattern(dir.join("project-b"), "@source '**/*'"),
+            GlobEntry {
+                base: dir.join("project-a").to_string_lossy().to_string(),
+                pattern: "**/*".to_owned(),
+            },
+            GlobEntry {
+                base: dir.join("project-b").to_string_lossy().to_string(),
+                pattern: "**/*".to_owned(),
+            },
         ];
 
-        let mut scanner = Scanner::new(sources);
+        let mut scanner = Scanner::new(Some(sources));
         let candidates = scanner.scan();
 
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        ├── ✓ project-a
-        │   └── ✓ index.html
-        └── ✓ project-b
-            └── ✓ index.html
-        ");
-
         // We've done the initial scan and found the files
         assert_eq!(
             candidates,
             vec![
-                "content-['project-a/index.html']",
-                "content-['project-b/index.html']"
+                "content-['project-a/index.html']".to_owned(),
+                "content-['project-b/index.html']".to_owned(),
             ]
         );
 
@@ -1397,10 +554,10 @@ mod scanner {
         assert_eq!(
             candidates,
             vec![
-                "content-['project-a/index.html']",
-                "content-['project-a/new.html']",
-                "content-['project-b/index.html']",
-                "content-['project-b/new.html']"
+                "content-['project-a/index.html']".to_owned(),
+                "content-['project-a/new.html']".to_owned(),
+                "content-['project-b/index.html']".to_owned(),
+                "content-['project-b/new.html']".to_owned(),
             ]
         );
 
@@ -1429,12 +586,12 @@ mod scanner {
         assert_eq!(
             candidates,
             vec![
-                "content-['project-a/index.html']",
-                "content-['project-a/new.html']",
-                "content-['project-a/sub1/sub2/index.html']",
-                "content-['project-b/index.html']",
-                "content-['project-b/new.html']",
-                "content-['project-b/sub1/sub2/index.html']"
+                "content-['project-a/index.html']".to_owned(),
+                "content-['project-a/new.html']".to_owned(),
+                "content-['project-a/sub1/sub2/index.html']".to_owned(),
+                "content-['project-b/index.html']".to_owned(),
+                "content-['project-b/new.html']".to_owned(),
+                "content-['project-b/sub1/sub2/index.html']".to_owned(),
             ]
         );
 
@@ -1463,1170 +620,16 @@ mod scanner {
         assert_eq!(
             candidates,
             vec![
-                "content-['project-a/index.html']",
-                "content-['project-a/new.html']",
-                "content-['project-a/sub1/sub2/index.html']",
-                "content-['project-a/sub1/sub2/new.html']",
-                "content-['project-b/index.html']",
-                "content-['project-b/new.html']",
-                "content-['project-b/sub1/sub2/index.html']",
-                "content-['project-b/sub1/sub2/new.html']"
+                "content-['project-a/index.html']".to_owned(),
+                "content-['project-a/new.html']".to_owned(),
+                "content-['project-a/sub1/sub2/index.html']".to_owned(),
+                "content-['project-a/sub1/sub2/new.html']".to_owned(),
+                "content-['project-b/index.html']".to_owned(),
+                "content-['project-b/new.html']".to_owned(),
+                "content-['project-b/sub1/sub2/index.html']".to_owned(),
+                "content-['project-b/sub1/sub2/new.html']".to_owned(),
             ]
         );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        ├── ✓ project-a
-        │   ├── ✓ index.html
-        │   ├── ✓ new.html
-        │   └── ✓ sub1
-        │       └── ✓ sub2
-        │           ├── ✓ index.html
-        │           └── ✓ new.html
-        └── ✓ project-b
-            ├── ✓ index.html
-            ├── ✓ new.html
-            └── ✓ sub1
-                └── ✓ sub2
-                    ├── ✓ index.html
-                    └── ✓ new.html
-        ");
-    }
-
-    #[test]
-    fn it_should_remove_deleted_files_from_scanned_files() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Initialize this directory as a git repository
-        let _ = Command::new("git").arg("init").current_dir(&dir).output();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("src/index.html", "content-['src/index.html']"),
-                ("src/keep.html", "content-['src/keep.html']"),
-                ("src/remove.html", "content-['src/remove.html']"),
-            ],
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )]);
-
-        scanner.scan();
-        assert_eq!(
-            scanned_files(&mut scanner, &dir),
-            vec!["src/index.html", "src/keep.html", "src/remove.html"]
-        );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        └── ✓ src
-            ├── ✓ index.html
-            ├── ✓ keep.html
-            └── ✓ remove.html
-        ");
-
-        fs::remove_file(dir.join("src/remove.html")).unwrap();
-
-        scanner.scan();
-        assert_eq!(
-            scanned_files(&mut scanner, &dir),
-            vec!["src/index.html", "src/keep.html"]
-        );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        └── ✓ src
-            ├── ✓ index.html
-            └── ✓ keep.html
-        ");
-    }
-
-    #[test]
-    fn it_should_remove_deleted_directories_from_scanned_files() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Initialize this directory as a git repository
-        let _ = Command::new("git").arg("init").current_dir(&dir).output();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("src/index.html", "content-['src/index.html']"),
-                ("src/keep/index.html", "content-['src/keep/index.html']"),
-                ("src/remove/index.html", "content-['src/remove/index.html']"),
-                (
-                    "src/remove/nested/index.html",
-                    "content-['src/remove/nested/index.html']",
-                ),
-            ],
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )]);
-
-        scanner.scan();
-        assert_eq!(
-            scanned_files(&mut scanner, &dir),
-            vec![
-                "src/index.html",
-                "src/keep/index.html",
-                "src/remove/index.html",
-                "src/remove/nested/index.html",
-            ]
-        );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        └── ✓ src
-            ├── ✓ index.html
-            ├── ✓ keep
-            │   └── ✓ index.html
-            └── ✓ remove
-                ├── ✓ index.html
-                └── ✓ nested
-                    └── ✓ index.html
-        ");
-
-        fs::remove_dir_all(dir.join("src/remove")).unwrap();
-
-        scanner.scan();
-        assert_eq!(
-            scanned_files(&mut scanner, &dir),
-            vec!["src/index.html", "src/keep/index.html"]
-        );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        └── ✓ src
-            ├── ✓ index.html
-            └── ✓ keep
-                └── ✓ index.html
-        ");
-    }
-
-    #[test]
-    fn it_should_remove_deleted_directories_from_scanned_globs() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Initialize this directory as a git repository
-        let _ = Command::new("git").arg("init").current_dir(&dir).output();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("index.html", "content-['index.html']"),
-                ("src/index.html", "content-['src/index.html']"),
-            ],
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )]);
-
-        scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        ├── ✓ index.html
-        └── ✓ src
-            └── ✓ index.html
-        ");
-
-        let globs = scanned_globs(&mut scanner, &dir);
-        assert!(globs.iter().any(|glob| glob.starts_with("src/**/*")));
-
-        fs::remove_dir_all(dir.join("src")).unwrap();
-
-        scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        . (git)
-        └── ✓ index.html
-        ");
-
-        let globs = scanned_globs(&mut scanner, &dir);
-        assert!(!globs.iter().any(|glob| glob.starts_with("src/**/*")));
-    }
-
-    #[test]
-    fn it_should_track_files_scanned_by_the_last_scan() {
-        let dir = tempdir().unwrap().into_path();
-
-        let _ = Command::new("git").arg("init").current_dir(&dir).output();
-
-        create_files_in(
-            &dir,
-            &[
-                ("src/index.html", "content-['src/index.html']"),
-                ("src/keep.html", "content-['src/keep.html']"),
-            ],
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )]);
-
-        assert_eq!(
-            scanner.scan(),
-            vec!["content-['src/index.html']", "content-['src/keep.html']"]
-        );
-
-        assert_eq!(
-            scanner.scan(),
-            vec!["content-['src/index.html']", "content-['src/keep.html']"]
-        );
-        assert_eq!(scanner.get_scanned_files(), Vec::<String>::new());
-
-        sleep(Duration::from_millis(10));
-        fs::write(dir.join("src/index.html"), "content-['src/changed.html']").unwrap();
-
-        assert_eq!(
-            scanner.scan(),
-            vec![
-                "content-['src/changed.html']",
-                "content-['src/index.html']",
-                "content-['src/keep.html']",
-            ]
-        );
-        assert_eq!(
-            normalize_files(scanner.get_scanned_files(), &dir),
-            vec!["src/index.html"]
-        );
-    }
-
-    #[test]
-    fn it_should_ignore_negated_custom_sources() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/index.ts", "content-['src/index.ts']"),
-                ("src/colors/red.jsx", "content-['src/colors/red.jsx']"),
-                ("src/colors/blue.tsx", "content-['src/colors/blue.tsx']"),
-                ("src/colors/green.tsx", "content-['src/colors/green.tsx']"),
-                ("src/utils/string.ts", "content-['src/utils/string.ts']"),
-                ("src/utils/date.ts", "content-['src/utils/date.ts']"),
-                ("src/utils/file.ts", "content-['src/utils/file.ts']"),
-                (
-                    "src/admin/foo/template.html",
-                    "content-['src/admin/template.html']",
-                ),
-                (
-                    "src/templates/index.html",
-                    "content-['src/templates/index.html']",
-                ),
-            ],
-            vec![
-                "@source '**/*'",
-                "@source not 'src/index.ts'",
-                "@source not '**/*.{jsx,tsx}'",
-                "@source not 'src/utils'",
-                "@source not 'dist'",
-            ],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            ├── ✓ admin
-            │   └── ✓ foo
-            │       └── ✓ template.html
-            ├── ✗ colors
-            │   ├── ✗ blue.tsx
-            │   ├── ✗ green.tsx
-            │   └── ✗ red.jsx
-            ├── ✗ index.ts
-            ├── ✓ templates
-            │   └── ✓ index.html
-            └── ✗ utils
-                ├── ✗ date.ts
-                ├── ✗ file.ts
-                └── ✗ string.ts
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['src/admin/template.html']",
-                "content-['src/templates/index.html']",
-            ]
-        );
-
-        assert_eq!(
-            files,
-            vec![
-                "src/admin/foo/template.html",
-                "src/templates/index.html",
-                // These files are ignored and thus do not need to be watched:
-
-                // "src/colors/blue.tsx",
-                // "src/colors/green.tsx",
-                // "src/colors/red.jsx",
-                // "src/index.ts",
-                // "src/utils/date.ts",
-                // "src/utils/file.ts",
-                // "src/utils/string.ts"
-            ]
-        );
-        assert_eq!(
-            globs,
-            vec![
-                "*",
-                "src/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-                "src/admin/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-                "src/colors/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-                "src/templates/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-            ]
-        );
-
-        assert_eq!(normalized_sources, vec!["**/*",]);
-    }
-
-    #[test]
-    fn it_should_include_defined_extensions_that_are_ignored_by_default() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            // Typically skipped
-            &[
-                ("src/index.exe", "content-['src/index.exe']"),
-                ("src/index.bin", "content-['src/index.bin']"),
-                ("out/out.exe", "content-['out/out.exe']"),
-            ],
-            // But explicitly included
-            vec!["@source '**/*'", "@source 'src/**/*.{exe,bin}'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ out
-        │   └── ✗ out.exe
-        └── ✓ src
-            ├── ✓ index.bin
-            └── ✓ index.exe
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['src/index.bin']", "content-['src/index.exe']",]
-        );
-        assert_eq!(files, vec!["src/index.bin", "src/index.exe",]);
-        assert_eq!(
-            globs,
-            vec![
-                "*",
-                // Contains `.exe` and `.bin` in the list
-                "out/**/*.{aspx,astro,bin,cjs,cts,eex,erb,exe,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-                "src/{**/*.bin,**/*.exe,**/*.{aspx,astro,bin,cjs,cts,eex,erb,exe,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}}",
-            ]
-        );
-        assert_eq!(
-            normalized_sources,
-            vec!["**/*", "src/**/*.bin", "src/**/*.exe"]
-        );
-    }
-
-    #[test]
-    fn it_should_work_with_manual_glob_only() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("index.html", "content-['index.html']"),
-                ("src/index.html", "content-['src/index.html']"),
-                ("src/ignore.html", "content-['src/ignore.html']"),
-                ("src/admin/index.html", "content-['src/admin/index.html']"),
-                ("src/admin/ignore.html", "content-['src/admin/ignore.html']"),
-                (
-                    "src/dashboard/index.html",
-                    "content-['src/dashboard/index.html']",
-                ),
-                (
-                    "src/dashboard/ignore.html",
-                    "content-['src/dashboard/ignore.html']",
-                ),
-                ("src/lib.ts", "content-['src/lib.ts']"),
-            ],
-            vec![
-                "@source './src/**/*.html'",
-                "@source not './src/index.html'",
-                "@source not './src/**/ignore.html'",
-            ],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ index.html
-        └── ✓ src
-            ├── ✓ admin
-            │   ├── ✗ ignore.html
-            │   └── ✓ index.html
-            ├── ✓ dashboard
-            │   ├── ✗ ignore.html
-            │   └── ✓ index.html
-            ├── ✗ ignore.html
-            ├── ✗ index.html
-            └── ✗ lib.ts
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['src/admin/index.html']",
-                "content-['src/dashboard/index.html']",
-            ]
-        );
-
-        assert_eq!(
-            files,
-            vec!["src/admin/index.html", "src/dashboard/index.html",]
-        );
-        assert_eq!(globs, vec!["src/**/*.html"]);
-        assert_eq!(normalized_sources, vec!["src/**/*.html"]);
-    }
-
-    #[test]
-    fn it_should_restrict_explicit_file_sources_to_the_matching_file() {
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/foo.html", "content-['src/foo.html']"),
-                ("src/bar.html", "content-['src/bar.html']"),
-            ],
-            vec!["@source './src/foo.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            ├── ✗ bar.html
-            └── ✓ foo.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['src/foo.html']"]);
-        assert_eq!(files, vec!["src/foo.html"]);
-    }
-
-    #[test]
-    fn it_should_combine_multiple_restricted_sources_for_the_same_base() {
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/foo.html", "content-['src/foo.html']"),
-                ("src/bar.html", "content-['src/bar.html']"),
-                ("src/baz.html", "content-['src/baz.html']"),
-            ],
-            vec!["@source './src/foo.html'", "@source './src/bar.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            ├── ✓ bar.html
-            ├── ✗ baz.html
-            └── ✓ foo.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['src/bar.html']", "content-['src/foo.html']"]
-        );
-        assert_eq!(files, vec!["src/bar.html", "src/foo.html"]);
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/20333
-    #[test]
-    fn it_should_combine_nested_and_root_restricted_sources() {
-        // The restriction (`*`) added for the root-level file must not prevent walking into the
-        // `nested` folder that another explicit source points into. At the same time, relaxing
-        // that restriction to `/*` must not accidentally open up sibling folders (`ignore-me`)
-        // or files that no explicit source points at.
-        let paths_with_content = &[
-            ("nested/component.html", "content-['nested/component.html']"),
-            ("nested/ignore-me.html", "content-['nested/ignore-me.html']"),
-            ("ignore-me/component.html", "content-['ignore-me']"),
-            ("component-sources.classes.txt", "content-['classes.txt']"),
-            ("ignore-me.txt", "content-['ignore-me.txt']"),
-        ];
-
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            paths_with_content,
-            vec![
-                "@source './nested/component.html'",
-                "@source './component-sources.classes.txt'",
-            ],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ component-sources.classes.txt
-        ├── ✗ ignore-me
-        │   └── ✗ component.html
-        ├── ✗ ignore-me.txt
-        └── ✓ nested
-            ├── ✓ component.html
-            └── ✗ ignore-me.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['classes.txt']",
-                "content-['nested/component.html']"
-            ]
-        );
-        assert_eq!(
-            files,
-            vec!["component-sources.classes.txt", "nested/component.html"]
-        );
-
-        // Same setup, but with the root-level source declared first
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            paths_with_content,
-            vec![
-                "@source './component-sources.classes.txt'",
-                "@source './nested/component.html'",
-            ],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ component-sources.classes.txt
-        ├── ✗ ignore-me
-        │   └── ✗ component.html
-        ├── ✗ ignore-me.txt
-        └── ✓ nested
-            ├── ✓ component.html
-            └── ✗ ignore-me.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['classes.txt']",
-                "content-['nested/component.html']"
-            ]
-        );
-        assert_eq!(
-            files,
-            vec!["component-sources.classes.txt", "nested/component.html"]
-        );
-    }
-
-    #[test]
-    fn it_should_allow_later_ignores_to_override_restricted_sources() {
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[("src/foo.html", "content-['src/foo.html']")],
-            vec!["@source './src/foo.html'", "@source not './src/foo.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✗ src
-            └── ✗ foo.html
-        ");
-
-        assert!(candidates.is_empty());
-        assert!(files.is_empty());
-    }
-
-    #[test]
-    fn it_should_handle_sources_with_parent_patterns() {
-        {
-            let ScanResult {
-                candidates,
-                files,
-                tree,
-                ..
-            } = scan_with_globs(
-                &[
-                    ("src/foo.html", "content-['src/foo.html']"),
-                    ("src/bar/index.html", "content-['src/bar/index.html']"),
-                    ("src/bar/ignore.html", "content-['src/bar/ignore.html']"),
-                ],
-                vec!["@source './src/ba*/*.html'"],
-            );
-
-            assert_snapshot!(tree, @"
-            . (git)
-            └── ✓ src
-                ├── ✓ bar
-                │   ├── ✓ ignore.html
-                │   └── ✓ index.html
-                └── ✗ foo.html
-            ");
-
-            assert_eq!(
-                candidates,
-                vec![
-                    "content-['src/bar/ignore.html']",
-                    "content-['src/bar/index.html']"
-                ]
-            );
-            assert_eq!(files, vec!["src/bar/ignore.html", "src/bar/index.html"]);
-        }
-
-        {
-            let ScanResult {
-                candidates,
-                files,
-                tree,
-                ..
-            } = scan_with_globs(
-                &[
-                    ("src/foo.html", "content-['src/foo.html']"),
-                    ("src/bar/index.html", "content-['src/bar/index.html']"),
-                    ("src/bar/ignore.html", "content-['src/bar/ignore.html']"),
-                ],
-                vec![
-                    "@source './src/ba*/*.html'",
-                    "@source not './src/bar/ignore.html'", // Ignore the ignore.html
-                ],
-            );
-
-            assert_snapshot!(tree, @"
-            . (git)
-            └── ✓ src
-                ├── ✓ bar
-                │   ├── ✗ ignore.html
-                │   └── ✓ index.html
-                └── ✗ foo.html
-            ");
-
-            assert_eq!(candidates, vec!["content-['src/bar/index.html']"]);
-            assert_eq!(files, vec!["src/bar/index.html"]);
-        }
-
-        {
-            let ScanResult {
-                candidates,
-                files,
-                tree,
-                ..
-            } = scan_with_globs(
-                &[
-                    ("src/foo.html", "content-['src/foo.html']"),
-                    ("src/bar/index.html", "content-['src/bar/index.html']"),
-                    ("src/bar/ignore.html", "content-['src/bar/ignore.html']"),
-                ],
-                vec!["@source '**/*'", "@source not './src/ba*/*.html'"],
-            );
-
-            assert_snapshot!(tree, @"
-            . (git)
-            └── ✓ src
-                ├── ✗ bar
-                │   ├── ✗ ignore.html
-                │   └── ✗ index.html
-                └── ✓ foo.html
-            ");
-
-            assert_eq!(candidates, vec!["content-['src/foo.html']"]);
-            assert_eq!(files, vec!["src/foo.html"]);
-        }
-
-        {
-            let ScanResult {
-                candidates,
-                files,
-                tree,
-                ..
-            } = scan_with_globs(
-                &[
-                    ("src/foo.html", "content-['src/foo.html']"),
-                    ("src/bar/index.html", "content-['src/bar/index.html']"),
-                    ("src/bar/ignore.html", "content-['src/bar/ignore.html']"),
-                ],
-                vec![
-                    "@source '**/*'",
-                    "@source not './src/ba*/*.html'",
-                    "@source './src/bar/index.html'", //
-                ],
-            );
-
-            assert_snapshot!(tree, @"
-            . (git)
-            └── ✓ src
-                ├── ✓ bar
-                │   ├── ✗ ignore.html
-                │   └── ✓ index.html
-                └── ✓ foo.html
-            ");
-
-            assert_eq!(
-                candidates,
-                vec!["content-['src/bar/index.html']", "content-['src/foo.html']"]
-            );
-            assert_eq!(files, vec!["src/bar/index.html", "src/foo.html"]);
-        }
-    }
-
-    #[test]
-    fn nested_explicit_source_should_not_suppress_siblings_of_broad_source() {
-        // A broad `**/*` source should keep auto-detecting every file, even when a more
-        // specific `@source` points at a single file inside a subdirectory. The restriction
-        // added for the explicit file must not hide its siblings from the broad source.
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/components/button.html", "content-['button']"),
-                ("src/components/card.html", "content-['card']"),
-            ],
-            vec!["@source '**/*'", "@source './src/components/button.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            └── ✓ components
-                ├── ✓ button.html
-                └── ✓ card.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['button']", "content-['card']"]);
-        assert_eq!(
-            files,
-            vec!["src/components/button.html", "src/components/card.html"]
-        );
-    }
-
-    #[test]
-    fn nested_explicit_source_should_not_suppress_siblings_of_auto_source() {
-        // Same as above, but the broad source is an auto-detected directory (`@source "src"`)
-        // and the explicit file lives in a nested subdirectory of it.
-        let ScanResult {
-            candidates,
-            files,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/components/button.html", "content-['button']"),
-                ("src/components/card.html", "content-['card']"),
-            ],
-            vec!["@source 'src'", "@source './src/components/button.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            └── ✓ components
-                ├── ✓ button.html
-                └── ✓ card.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['button']", "content-['card']"]);
-        assert_eq!(
-            files,
-            vec!["src/components/button.html", "src/components/card.html"]
-        );
-    }
-
-    #[test]
-    fn root_file_source_should_not_suppress_sibling_source_roots() {
-        let ScanResult {
-            candidates, tree, ..
-        } = scan_with_globs(
-            &[
-                ("index.css", ""),
-                ("src/index.html", "content-['src/index.html']"),
-                ("pages/foo.html", "content-['pages/foo.html']"),
-                ("pages/nested/foo.html", "content-['pages/nested/foo.html']"),
-            ],
-            vec![
-                "@source './src'",
-                "@source './pages/**/*.html'",
-                "@source './index.css'",
-            ],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✓ index.css
-        ├── ✓ pages
-        │   ├── ✓ foo.html
-        │   └── ✓ nested
-        │       └── ✓ foo.html
-        └── ✓ src
-            └── ✓ index.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['pages/foo.html']",
-                "content-['pages/nested/foo.html']",
-                "content-['src/index.html']",
-            ]
-        );
-    }
-
-    #[test]
-    fn it_respects_gitignore_in_workspace_root() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                (".gitignore", "ignore-1.html\nweb/ignore-2.html"),
-                ("src/index.html", "content-['src/index.html']"),
-                ("web/index.html", "content-['web/index.html']"),
-                ("web/ignore-1.html", "content-['web/ignore-1.html']"),
-                ("web/ignore-2.html", "content-['web/ignore-2.html']"),
-            ],
-            vec!["@source './src'", "@source './web'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       ignore-1.html
-        │       web/ignore-2.html
-        ├── ✓ src
-        │   └── ✓ index.html
-        └── ✓ web
-            ├── ✗ ignore-1.html
-            ├── ✗ ignore-2.html
-            └── ✓ index.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['src/index.html']", "content-['web/index.html']",]
-        );
-
-        assert_eq!(files, vec!["src/index.html", "web/index.html",]);
-        assert_eq!(globs, vec!["src/*", "web/*",]);
-        assert_eq!(normalized_sources, vec!["src/**/*", "web/**/*",]);
-    }
-
-    #[test]
-    fn it_includes_skipped_by_default_extensions_with_a_specific_source() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/logo.jpg", "content-['/src/logo.jpg']"),
-                ("src/logo.png", "content-['/src/logo.png']"),
-            ],
-            vec!["@source './src/logo.{jpg,png}'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            ├── ✓ logo.jpg
-            └── ✓ logo.png
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['/src/logo.jpg']", "content-['/src/logo.png']"]
-        );
-        assert_eq!(files, vec!["src/logo.jpg", "src/logo.png"]);
-        assert!(globs.is_empty());
-        assert_eq!(normalized_sources, vec!["src/logo.jpg", "src/logo.png"]);
-    }
-
-    #[test]
-    fn it_respects_gitignore_in_workspace_root_for_manual_globs() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                (".gitignore", "ignore-1.html\n/web/ignore-2.html"),
-                ("web/index.html", "content-['web/index.html']"),
-                ("web/ignore-1.html", "content-['web/ignore-1.html']"),
-                ("web/ignore-2.html", "content-['web/ignore-2.html']"),
-            ],
-            vec!["@source './web'", "@source './web/ignore-1.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       ignore-1.html
-        │       /web/ignore-2.html
-        └── ✓ web
-            ├── ✓ ignore-1.html
-            ├── ✗ ignore-2.html
-            └── ✓ index.html
-        ");
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['web/ignore-1.html']",
-                "content-['web/index.html']",
-            ]
-        );
-
-        assert_eq!(files, vec!["web/ignore-1.html", "web/index.html",]);
-        assert_eq!(globs, vec!["web/*"]);
-        assert_eq!(normalized_sources, vec!["web/**/*", "web/ignore-1.html"]);
-    }
-
-    #[test]
-    fn it_respects_gitignore_files_with_whitelist_patterns() {
-        // https://github.com/tailwindlabs/tailwindcss/discussions/20382
-        //
-        // A `.gitignore` that ignores everything (`/*`) and then whitelists specific
-        // directories and files using negated patterns.
-        let ScanResult {
-            files,
-            candidates,
-            tree,
-            ..
-        } = scan(&[
-            (
-                ".gitignore",
-                "/*\n!/app\n!/public\n!/package.json\n!/.gitignore\n",
-            ),
-            ("app/index.html", "content-['app/index.html']"),
-            ("public/index.html", "content-['public/index.html']"),
-            ("package.json", ""),
-            // These are all ignored by the `/*` rule because they are not whitelisted
-            ("build/generated.html", "content-['build/generated.html']"),
-            ("logs/dev.log", "content-['logs/dev.log']"),
-            (
-                "node_modules/my-ui-lib/index.html",
-                "content-['node_modules/my-ui-lib/index.html']",
-            ),
-        ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       /*
-        │       !/app
-        │       !/public
-        │       !/package.json
-        │       !/.gitignore
-        ├── ✓ app
-        │   └── ✓ index.html
-        ├── ✗ build
-        │   └── ✗ generated.html
-        ├── ✗ logs
-        │   └── ✗ dev.log
-        ├── ✗ node_modules
-        │   └── ✗ my-ui-lib
-        │       └── ✗ index.html
-        ├── ✓ package.json
-        └── ✓ public
-            └── ✓ index.html
-        ");
-
-        assert_eq!(
-            files,
-            vec!["app/index.html", "package.json", "public/index.html"]
-        );
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['app/index.html']",
-                "content-['public/index.html']"
-            ]
-        );
-    }
-
-    #[test]
-    fn it_respects_gitignore_files_with_nested_whitelist_patterns() {
-        // Example from the official `.gitignore` documentation:
-        //
-        // ```gitignore
-        // # exclude everything except directory foo/bar
-        // /*
-        // !/foo
-        // /foo/*
-        // !/foo/bar
-        // ```
-        let ScanResult {
-            files,
-            candidates,
-            tree,
-            ..
-        } = scan(&[
-            (
-                ".gitignore",
-                "# exclude everything except directory foo/bar\n/*\n!/foo\n/foo/*\n!/foo/bar\n",
-            ),
-            ("foo/bar/index.html", "content-['foo/bar/index.html']"),
-            (
-                "foo/bar/nested/index.html",
-                "content-['foo/bar/nested/index.html']",
-            ),
-            // These are all ignored because they are not inside `foo/bar`
-            ("index.html", "content-['index.html']"),
-            ("foo/index.html", "content-['foo/index.html']"),
-            ("foo/baz/index.html", "content-['foo/baz/index.html']"),
-        ]);
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       # exclude everything except directory foo/bar
-        │       /*
-        │       !/foo
-        │       /foo/*
-        │       !/foo/bar
-        ├── ✓ foo
-        │   ├── ✓ bar
-        │   │   ├── ✓ index.html
-        │   │   └── ✓ nested
-        │   │       └── ✓ index.html
-        │   ├── ✗ baz
-        │   │   └── ✗ index.html
-        │   └── ✗ index.html
-        └── ✗ index.html
-        ");
-
-        assert_eq!(
-            files,
-            vec!["foo/bar/index.html", "foo/bar/nested/index.html"]
-        );
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['foo/bar/index.html']",
-                "content-['foo/bar/nested/index.html']"
-            ]
-        );
-    }
-
-    #[test]
-    fn explicit_source_directories_respect_their_own_gitignore() {
-        // A directory referenced via `@source` behaves like an auto source detection
-        // root. The `.gitignore` file _inside_ that directory still applies to its
-        // contents. Only when the directory itself is ignored (by an ancestor
-        // `.gitignore`, see the tests above) do we bypass the ignore rules.
-        let ScanResult {
-            files,
-            candidates,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("vendor/.gitignore", "ignored.html"),
-                ("vendor/index.html", "content-['vendor/index.html']"),
-                ("vendor/ignored.html", "content-['vendor/ignored.html']"),
-            ],
-            vec!["@source 'vendor'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ vendor
-            ├── ✗ .gitignore
-            │       ignored.html
-            ├── ✗ ignored.html
-            └── ✓ index.html
-        ");
-
-        assert_eq!(files, vec!["vendor/index.html"]);
-        assert_eq!(candidates, vec!["content-['vendor/index.html']"]);
-    }
-
-    #[test]
-    fn explicit_sources_can_include_files_inside_gitignored_parent_directories() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                (".gitignore", "src/efgh/"),
-                ("src/efgh/index.html", "content-['src/efgh/index.html']"),
-                ("src/efgh/ignore.js", "content-['src/efgh/ignore.js']"),
-                ("src/abcd/index.html", "content-['src/abcd/index.html']"),
-            ],
-            vec!["@source './src/ef*/*.html'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       src/efgh/
-        └── ✓ src
-            ├── ✗ abcd
-            │   └── ✗ index.html
-            └── ✓ efgh
-                ├── ✗ ignore.js
-                └── ✓ index.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['src/efgh/index.html']"]);
-        assert_eq!(files, vec!["src/efgh/index.html"]);
-        assert_eq!(globs, vec!["src/ef*/*.html"]);
     }
 
     #[test]
@@ -2662,80 +665,21 @@ mod scanner {
                     "home/project/apps/web/ignore-web.html",
                     "content-['ignore-web.html']",
                 ),
-                // Auto content detection outside of `web/`
-                (
-                    "home/project/apps/admin/index.html",
-                    "content-['home/project/apps/admin/index.html']",
-                ),
-                // Manual sources outside of `web/`
-                (
-                    "home/project/apps/dashboard/index.html",
-                    "content-['home/project/apps/dashboard/index.html']",
-                ),
             ],
         );
 
-        let sources = vec![
-            public_source_entry_from_pattern(
-                dir.join("home/project/apps/web")
-                    .to_string_lossy()
-                    .to_string()
-                    .into(),
-                "@source '**/*'",
-            ),
-            public_source_entry_from_pattern(
-                dir.join("home/project/apps/web")
-                    .to_string_lossy()
-                    .to_string()
-                    .into(),
-                "@source '../admin'",
-            ),
-            public_source_entry_from_pattern(
-                dir.join("home/project/apps/web")
-                    .to_string_lossy()
-                    .to_string()
-                    .into(),
-                "@source '../dashboard/*.html'",
-            ),
-        ];
+        let sources = vec![GlobEntry {
+            base: dir
+                .join("home/project/apps/web")
+                .to_string_lossy()
+                .to_string(),
+            pattern: "**/*".to_owned(),
+        }];
 
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ home
-            ├── ✗ .gitignore
-            │       ignore-home.html
-            └── ✓ project
-                ├── ✗ .gitignore
-                │       ignore-project.html
-                └── ✓ apps
-                    ├── ✗ .gitignore
-                    │       ignore-apps.html
-                    ├── ✓ admin
-                    │   └── ✓ index.html
-                    ├── ✓ dashboard
-                    │   └── ✓ index.html
-                    └── ✓ web
-                        ├── ✗ .gitignore
-                        │       ignore-web.html
-                        ├── ✗ ignore-apps.html
-                        ├── ✗ ignore-home.html
-                        ├── ✗ ignore-project.html
-                        ├── ✗ ignore-web.html
-                        └── ✓ index.html
-        ");
+        let candidates = Scanner::new(Some(sources.clone())).scan();
 
         // All ignore files are applied because there's no git repo
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['home/project/apps/admin/index.html']",
-                "content-['home/project/apps/dashboard/index.html']",
-                "content-['index.html']"
-            ]
-        );
+        assert_eq!(candidates, vec!["content-['index.html']".to_owned(),]);
 
         // Initialize `home` as a git repository and scan again
         // The results should be the same as before
@@ -2743,42 +687,9 @@ mod scanner {
             .arg("init")
             .current_dir(dir.join("home"))
             .output();
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
+        let candidates = Scanner::new(Some(sources.clone())).scan();
 
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ home (git)
-            ├── ✗ .gitignore
-            │       ignore-home.html
-            └── ✓ project
-                ├── ✗ .gitignore
-                │       ignore-project.html
-                └── ✓ apps
-                    ├── ✗ .gitignore
-                    │       ignore-apps.html
-                    ├── ✓ admin
-                    │   └── ✓ index.html
-                    ├── ✓ dashboard
-                    │   └── ✓ index.html
-                    └── ✓ web
-                        ├── ✗ .gitignore
-                        │       ignore-web.html
-                        ├── ✗ ignore-apps.html
-                        ├── ✗ ignore-home.html
-                        ├── ✗ ignore-project.html
-                        ├── ✗ ignore-web.html
-                        └── ✓ index.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['home/project/apps/admin/index.html']",
-                "content-['home/project/apps/dashboard/index.html']",
-                "content-['index.html']"
-            ]
-        );
+        assert_eq!(candidates, vec!["content-['index.html']".to_owned(),]);
 
         // Drop the .git folder
         fs::remove_dir_all(dir.join("home/.git")).unwrap();
@@ -2788,41 +699,13 @@ mod scanner {
             .arg("init")
             .current_dir(dir.join("home/project"))
             .output();
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ home
-            ├── ✗ .gitignore
-            │       ignore-home.html
-            └── ✓ project (git)
-                ├── ✗ .gitignore
-                │       ignore-project.html
-                └── ✓ apps
-                    ├── ✗ .gitignore
-                    │       ignore-apps.html
-                    ├── ✓ admin
-                    │   └── ✓ index.html
-                    ├── ✓ dashboard
-                    │   └── ✓ index.html
-                    └── ✓ web
-                        ├── ✗ .gitignore
-                        │       ignore-web.html
-                        ├── ✗ ignore-apps.html
-                        ├── ✓ ignore-home.html
-                        ├── ✗ ignore-project.html
-                        ├── ✗ ignore-web.html
-                        └── ✓ index.html
-        ");
+        let candidates = Scanner::new(Some(sources.clone())).scan();
 
         assert_eq!(
             candidates,
             vec![
-                "content-['home/project/apps/admin/index.html']",
-                "content-['home/project/apps/dashboard/index.html']",
-                "content-['ignore-home.html']",
-                "content-['index.html']"
+                "content-['ignore-home.html']".to_owned(),
+                "content-['index.html']".to_owned(),
             ]
         );
 
@@ -2834,42 +717,14 @@ mod scanner {
             .arg("init")
             .current_dir(dir.join("home/project/apps"))
             .output();
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ home
-            ├── ✗ .gitignore
-            │       ignore-home.html
-            └── ✓ project
-                ├── ✗ .gitignore
-                │       ignore-project.html
-                └── ✓ apps (git)
-                    ├── ✗ .gitignore
-                    │       ignore-apps.html
-                    ├── ✓ admin
-                    │   └── ✓ index.html
-                    ├── ✓ dashboard
-                    │   └── ✓ index.html
-                    └── ✓ web
-                        ├── ✗ .gitignore
-                        │       ignore-web.html
-                        ├── ✗ ignore-apps.html
-                        ├── ✓ ignore-home.html
-                        ├── ✓ ignore-project.html
-                        ├── ✗ ignore-web.html
-                        └── ✓ index.html
-        ");
+        let candidates = Scanner::new(Some(sources.clone())).scan();
 
         assert_eq!(
             candidates,
             vec![
-                "content-['home/project/apps/admin/index.html']",
-                "content-['home/project/apps/dashboard/index.html']",
-                "content-['ignore-home.html']",
-                "content-['ignore-project.html']",
-                "content-['index.html']"
+                "content-['ignore-home.html']".to_owned(),
+                "content-['ignore-project.html']".to_owned(),
+                "content-['index.html']".to_owned(),
             ]
         );
 
@@ -2881,1200 +736,16 @@ mod scanner {
             .arg("init")
             .current_dir(dir.join("home/project/apps/web"))
             .output();
-
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ home
-            ├── ✗ .gitignore
-            │       ignore-home.html
-            └── ✓ project
-                ├── ✗ .gitignore
-                │       ignore-project.html
-                └── ✓ apps
-                    ├── ✗ .gitignore
-                    │       ignore-apps.html
-                    ├── ✓ admin
-                    │   └── ✓ index.html
-                    ├── ✓ dashboard
-                    │   └── ✓ index.html
-                    └── ✓ web (git)
-                        ├── ✗ .gitignore
-                        │       ignore-web.html
-                        ├── ✓ ignore-apps.html
-                        ├── ✓ ignore-home.html
-                        ├── ✓ ignore-project.html
-                        ├── ✗ ignore-web.html
-                        └── ✓ index.html
-        ");
+        let candidates = Scanner::new(Some(sources.clone())).scan();
 
         assert_eq!(
             candidates,
             vec![
-                "content-['home/project/apps/admin/index.html']",
-                "content-['home/project/apps/dashboard/index.html']",
-                "content-['ignore-apps.html']",
-                "content-['ignore-home.html']",
-                "content-['ignore-project.html']",
-                "content-['index.html']",
+                "content-['ignore-apps.html']".to_owned(),
+                "content-['ignore-home.html']".to_owned(),
+                "content-['ignore-project.html']".to_owned(),
+                "content-['index.html']".to_owned(),
             ]
         );
     }
-
-    #[test]
-    fn test_explicitly_ignore_explicitly_allowed_files() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("src/keep-me.html", "content-['keep-me.html']"),
-                ("src/ignore-me.html", "content-['ignore-me.html']"),
-            ],
-        );
-
-        let sources = vec![
-            public_source_entry_from_pattern(dir.clone(), "@source '**/*.html'"),
-            public_source_entry_from_pattern(dir.clone(), "@source not 'src/ignore-me.html'"),
-        ];
-
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ src
-            ├── ✗ ignore-me.html
-            └── ✓ keep-me.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['keep-me.html']"]);
-    }
-
-    #[test]
-    fn test_works_with_filenames_containing_glob_characters() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("src/app/[foo]/ignore-me.html", "content-['ignore-me.html']"),
-                ("src/app/[foo]/keep-me.html", "content-['keep-me.html']"),
-            ],
-        );
-
-        let sources = vec![
-            public_source_entry_from_pattern(dir.clone(), "@source '**/*'"),
-            public_source_entry_from_pattern(
-                dir.clone(),
-                "@source not 'src/app/[foo]/ignore*.html'",
-            ),
-        ];
-
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ src
-            └── ✓ app
-                └── ✓ [foo]
-                    ├── ✗ ignore-me.html
-                    └── ✓ keep-me.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['keep-me.html']"]);
-    }
-
-    #[test]
-    fn test_ignore_files_can_be_included_with_custom_source_rule() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[("src/keep-me.html", "content-['src/keep-me.html']")],
-        );
-
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(dir.clone(), "@source '**/*.html'"),
-            public_source_entry_from_pattern(
-                dir.clone(),
-                "@source not 'src/ignored-by-source-not.html'",
-            ),
-        ]);
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['src/keep-me.html']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ src
-            └── ✓ keep-me.html
-        ");
-
-        // Create new files that should definitely be ignored
-        create_files_in(
-            &dir,
-            &[
-                // Create new file that matches the `@source '…'` glob
-                ("src/new-file.html", "content-['src/new-file.html']"),
-                // Create new file that is ignored based on file extension
-                (
-                    "src/ignore-by-extension.bin",
-                    "content-['src/ignore-by-extension.bin']",
-                ),
-                // Create a file that is ignored based on the `.gitignore` file
-                (".gitignore", "src/ignored-by-gitignore.html"),
-                (
-                    "src/ignored-by-gitignore.html",
-                    "content-['src/ignored-by-gitignore.html']",
-                ),
-                // Create a file that is ignored by the `@source not '…'`
-                (
-                    "src/ignored-by-source-not.html",
-                    "content-['src/ignored-by-source-not.html']",
-                ),
-            ],
-        );
-
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       src/ignored-by-gitignore.html
-        └── ✓ src
-            ├── ✗ ignore-by-extension.bin
-            ├── ✓ ignored-by-gitignore.html
-            ├── ✗ ignored-by-source-not.html
-            ├── ✓ keep-me.html
-            └── ✓ new-file.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                // Ignored by git ignore BUT included by `@source "**/*.html"`
-                "content-['src/ignored-by-gitignore.html']",
-                "content-['src/keep-me.html']",
-                "content-['src/new-file.html']"
-            ]
-        );
-    }
-
-    #[test]
-    fn test_allow_default_ignored_files() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(&dir, &[("foo.styl", "content-['foo.styl']")]);
-
-        let sources = vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )];
-
-        let mut scanner = Scanner::new(sources.clone());
-
-        let candidates = scanner.scan();
-        assert!(candidates.is_empty());
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✗ foo.styl
-        ");
-
-        // Explicitly allow `.styl` files
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(dir.clone(), "@source '**/*'"),
-            public_source_entry_from_pattern(dir.clone(), "@source '*.styl'"),
-        ]);
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['foo.styl']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        └── ✓ foo.styl
-        ");
-    }
-
-    #[test]
-    fn test_allow_default_ignored_files_via_gitignore() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                ("index.html", "content-['index.html']"),
-                (".gitignore", "index.html"),
-            ],
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )]);
-
-        let candidates = scanner.scan();
-        assert!(candidates.is_empty());
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       index.html
-        └── ✗ index.html
-        ");
-
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(dir.clone(), "@source '**/*'"),
-            public_source_entry_from_pattern(dir.clone(), "@source './*.html'"),
-        ]);
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['index.html']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       index.html
-        └── ✓ index.html
-        ");
-    }
-
-    #[test]
-    fn test_allow_explicit_node_modules_paths() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                // Current project
-                ("src/index.html", "content-['src/index.html']"),
-                // Ignore file
-                (".gitignore", "node_modules"),
-                // Library ignored by default
-                (
-                    "node_modules/my-ui-lib/index.html",
-                    "content-['node_modules/my-ui-lib/index.html']",
-                ),
-            ],
-        );
-
-        // Default auto source detection
-        let sources = vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source './'",
-        )];
-
-        let mut scanner = Scanner::new(sources.clone());
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['src/index.html']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       node_modules
-        ├── ✗ node_modules
-        │   └── ✗ my-ui-lib
-        │       └── ✗ index.html
-        └── ✓ src
-            └── ✓ index.html
-        ");
-
-        // Explicitly listing all `*.html` files, should not include `node_modules` because it's
-        // ignored
-        let sources = vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*.html'",
-        )];
-
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['src/index.html']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       node_modules
-        ├── ✗ node_modules
-        │   └── ✗ my-ui-lib
-        │       └── ✗ index.html
-        └── ✓ src
-            └── ✓ index.html
-        ");
-
-        // Explicitly listing all `*.html` files
-        // Explicitly list the `node_modules/my-ui-lib`
-        //
-        let sources = vec![
-            public_source_entry_from_pattern(dir.clone(), "@source '**/*.html'"),
-            public_source_entry_from_pattern(dir.clone(), "@source 'node_modules/my-ui-lib'"),
-        ];
-
-        let mut scanner = Scanner::new(sources.clone());
-        let candidates = scanner.scan();
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['node_modules/my-ui-lib/index.html']",
-                "content-['src/index.html']"
-            ]
-        );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       node_modules
-        ├── ✓ node_modules
-        │   └── ✓ my-ui-lib
-        │       └── ✓ index.html
-        └── ✓ src
-            └── ✓ index.html
-        ");
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/19844
-    #[test]
-    fn test_allow_explicit_sources_ignored_by_allow_list_gitignore() {
-        let ScanResult {
-            candidates, tree, ..
-        } = scan_with_globs(
-            &[
-                (".gitignore", "*\n!/app\n!/app/design\n!/app/design/**\n"),
-                (
-                    "app/design/frontend/theme/templates/component.phtml",
-                    "content-['app/design/frontend/theme/templates/component.phtml']",
-                ),
-                (
-                    "vendor/acme/theme/module/templates/component.phtml",
-                    "content-['vendor/acme/theme/module/templates/component.phtml']",
-                ),
-            ],
-            vec!["@source 'vendor/acme/theme'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       *
-        │       !/app
-        │       !/app/design
-        │       !/app/design/**
-        ├── ✗ app
-        │   └── ✗ design
-        │       └── ✗ frontend
-        │           └── ✗ theme
-        │               └── ✗ templates
-        │                   └── ✗ component.phtml
-        └── ✓ vendor
-            └── ✓ acme
-                └── ✓ theme
-                    └── ✓ module
-                        └── ✓ templates
-                            └── ✓ component.phtml
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['vendor/acme/theme/module/templates/component.phtml']"]
-        );
-    }
-
-    #[test]
-    fn test_ignore_node_modules_without_gitignore() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                (
-                    "packages/web/index.html",
-                    "content-['packages/web/index.html']",
-                ),
-                (
-                    "node_modules/index.html",
-                    "content-['node_modules/index.html']",
-                ),
-                (
-                    "packages/web/node_modules/index.html",
-                    "content-['packages/web/node_modules/index.html']",
-                ),
-            ],
-            vec!["@source '**/*'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ node_modules
-        │   └── ✗ index.html
-        └── ✓ packages
-            └── ✓ web
-                ├── ✓ index.html
-                └── ✗ node_modules
-                    └── ✗ index.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['packages/web/index.html']"]);
-
-        assert_eq!(files, vec!["packages/web/index.html",]);
-        assert_eq!(globs, vec!["*", "packages/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}", "packages/web/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
-    }
-
-    #[test]
-    fn test_ignore_gitignore_in_node_modules_source() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                (".gitignore", "node_modules\ndist"),
-                (
-                    "node_modules/my-ui-lib/dist/index.html",
-                    "content-['node_modules/my-ui-lib/dist/index.html']",
-                ),
-                (
-                    "node_modules/my-ui-lib/node.exe",
-                    "content-['node_modules/my-ui-lib/node.exe']",
-                ),
-            ],
-            vec!["@source 'node_modules/my-ui-lib'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       node_modules
-        │       dist
-        └── ✓ node_modules
-            └── ✓ my-ui-lib
-                ├── ✓ dist
-                │   └── ✓ index.html
-                └── ✗ node.exe
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['node_modules/my-ui-lib/dist/index.html']"]
-        );
-        assert_eq!(files, vec!["node_modules/my-ui-lib/dist/index.html"]);
-        assert_eq!(globs, vec!["node_modules/my-ui-lib/*", "node_modules/my-ui-lib/dist/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}"]);
-        assert_eq!(normalized_sources, vec!["node_modules/my-ui-lib/**/*"]);
-    }
-
-    #[test]
-    fn test_manually_scanning_files_should_follow_all_rules() {
-        // Create a temporary working directory
-        let dir = tempdir().unwrap().into_path();
-
-        // Create files
-        create_files_in(
-            &dir,
-            &[
-                // Ignore all `.jsx` files, and all `generated` folders
-                (".gitignore", "*.jsx\ngenerated/"),
-                // .tsx files are allowed
-                (
-                    "src/components/button.tsx",
-                    "content-['src/components/button.tsx']",
-                ),
-                // .jsx files are not allowed
-                (
-                    "src/components/button.jsx",
-                    "content-['src/components/button.jsx']",
-                ),
-            ],
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '**/*'",
-        )]);
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['src/components/button.tsx']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       *.jsx
-        │       generated/
-        └── ✓ src
-            └── ✓ components
-                ├── ✗ button.jsx
-                └── ✓ button.tsx
-        ");
-
-        // Create 2 new files, one "good" and one "bad" file, and manually scan them. This should
-        // only return the "good" file because the "bad" one is ignored by a `.gitignore` file.
-        create_files_in(
-            &dir,
-            &[
-                (
-                    "src/components/good.tsx",
-                    "content-['src/components/good.tsx']",
-                ),
-                (
-                    "src/components/bad.jsx",
-                    "content-['src/components/bad.jsx']",
-                ),
-            ],
-        );
-
-        let candidates = scanner.scan_content(vec![
-            ChangedContent::File(dir.join("src/components/good.tsx"), "tsx".to_owned()),
-            ChangedContent::File(dir.join("src/components/bad.jsx"), "jsx".to_owned()),
-        ]);
-
-        assert_eq!(candidates, vec!["content-['src/components/good.tsx']"]);
-
-        // Create a generated file in a nested folder that is ignored by a `.gitignore` file higher
-        // up the tree.
-        create_files_in(
-            &dir,
-            &[
-                (
-                    "src/components/generated/bad.tsx",
-                    "content-['src/components/generated/bad.tsx']",
-                ),
-                (
-                    "src/components/generated/bad.jsx",
-                    "content-['src/components/generated/bad.jsx']",
-                ),
-            ],
-        );
-
-        let candidates = scanner.scan_content(vec![
-            ChangedContent::File(
-                dir.join("src/components/generated/bad.tsx"),
-                "tsx".to_owned(),
-            ),
-            ChangedContent::File(
-                dir.join("src/components/generated/bad.jsx"),
-                "jsx".to_owned(),
-            ),
-        ]);
-
-        assert!(candidates.is_empty());
-    }
-
-    #[test]
-    fn test_works_with_utf8_special_character_paths() {
-        let ScanResult {
-            candidates,
-            files,
-            globs,
-            normalized_sources,
-            tree,
-            ..
-        } = scan_with_globs(
-            &[
-                ("src/💩.js", "content-['src/💩.js']"),
-                ("src/🤦‍♂️.tsx", "content-['src/🤦‍♂️.tsx']"),
-                ("src/🤦‍♂️/foo.tsx", "content-['src/🤦‍♂️/foo.tsx']"),
-            ],
-            vec!["@source '**/*'", "@source not 'src/🤦‍♂️'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        └── ✓ src
-            ├── ✓ 💩.js
-            ├── ✗ 🤦‍♂️
-            │   └── ✗ foo.tsx
-            └── ✓ 🤦‍♂️.tsx
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['src/💩.js']", "content-['src/🤦‍♂️.tsx']"]
-        );
-
-        assert_eq!(files, vec!["src/💩.js", "src/🤦‍♂️.tsx"]);
-        assert_eq!(globs, vec!["*", "src/*/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}"]);
-        assert_eq!(normalized_sources, vec!["**/*"]);
-    }
-
-    #[test]
-    fn test_glob_with_symlinks() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(
-            &dir,
-            &[
-                (".gitignore", "node_modules\ndist"),
-                (
-                    "node_modules/.pnpm/@org+my-ui-library/dist/index.ts",
-                    "content-['node_modules/.pnpm/@org+my-ui-library/dist/index.ts']",
-                ),
-                // Make sure the `@org` does exist
-                ("node_modules/@org/.gitkeep", ""),
-            ],
-        );
-        let _ = symlink(
-            dir.join("node_modules/.pnpm/@org+my-ui-library"),
-            dir.join("node_modules/@org/my-ui-library"),
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'node_modules'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       node_modules
-        │       dist
-        └── ✓ node_modules
-            ├── ✓ .pnpm
-            │   └── ✓ @org+my-ui-library
-            │       └── ✓ dist
-            │           └── ✓ index.ts
-            └── ✓ @org
-                ├── ✓ .gitkeep
-                └── ✓ my-ui-library → ../.pnpm/@org+my-ui-library
-                    └── ✓ dist
-                        └── ✓ index.ts
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['node_modules/.pnpm/@org+my-ui-library/dist/index.ts']"]
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'node_modules/@org/my-ui-library'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       node_modules
-        │       dist
-        └── ✓ node_modules
-            ├── ✓ .pnpm
-            │   └── ✓ @org+my-ui-library
-            │       └── ✓ dist
-            │           └── ✓ index.ts
-            └── ✓ @org
-                ├── ✗ .gitkeep
-                └── ✓ my-ui-library → ../.pnpm/@org+my-ui-library
-                    └── ✓ dist
-                        └── ✓ index.ts
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['node_modules/.pnpm/@org+my-ui-library/dist/index.ts']"]
-        );
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'node_modules/@org'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ .gitignore
-        │       node_modules
-        │       dist
-        └── ✓ node_modules
-            ├── ✓ .pnpm
-            │   └── ✓ @org+my-ui-library
-            │       └── ✓ dist
-            │           └── ✓ index.ts
-            └── ✓ @org
-                ├── ✓ .gitkeep
-                └── ✓ my-ui-library → ../.pnpm/@org+my-ui-library
-                    └── ✓ dist
-                        └── ✓ index.ts
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['node_modules/.pnpm/@org+my-ui-library/dist/index.ts']"]
-        );
-    }
-
-    #[test]
-    fn test_globs_with_recursive_symlinks() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(
-            &dir,
-            &[
-                ("b/index.html", "content-['b/index.html']"),
-                ("z/index.html", "content-['z/index.html']"),
-            ],
-        );
-
-        // Create recursive symlinks:
-        //
-        // - `a → b`, `b/c → c`, `c → a` form a cycle
-        // - `b/root → .` points back at the root directory
-        let _ = symlink(dir.join("b"), dir.join("a"));
-        let _ = symlink(dir.join("c"), dir.join("b/c"));
-        let _ = symlink(&dir, dir.join("b/root"));
-        let _ = symlink(dir.join("a"), dir.join("c"));
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source '.'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ a → b
-        │   ├── ✗ c → ../c
-        │   ├── ✓ index.html
-        │   └── ✗ root → ..
-        ├── ✓ b
-        │   ├── ✗ c → ../c
-        │   ├── ✓ index.html
-        │   └── ✗ root → ..
-        ├── ✓ c → a
-        │   ├── ✗ c → .
-        │   ├── ✓ index.html
-        │   └── ✗ root → ..
-        └── ✓ z
-            └── ✓ index.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec!["content-['b/index.html']", "content-['z/index.html']"]
-        );
-    }
-
-    #[test]
-    fn test_partial_globs_with_symlinks() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(&dir, &[("abcd/xyz.html", "content-['abcd/xyz.html']")]);
-        let _ = symlink(dir.join("abcd"), dir.join("efgh"));
-
-        // No sources should find nothing
-        let mut scanner = Scanner::new(vec![]);
-        let candidates = scanner.scan();
-        assert!(candidates.is_empty());
-
-        // Full symlinked folder name, should find the file
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'efgh/*.html'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ abcd
-        │   └── ✓ xyz.html
-        └── ✓ efgh → abcd
-            └── ✓ xyz.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['abcd/xyz.html']"]);
-
-        // Partially referencing the symlinked folder with a glob, should find the file
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'ef*/*.html'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_eq!(candidates, vec!["content-['abcd/xyz.html']"]);
-    }
-
-    #[test]
-    fn test_symlinked_sources_within_the_scanned_tree_can_be_ignored() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(
-            &dir,
-            &[
-                ("src/keep.html", "content-['src/keep.html']"),
-                (
-                    "actual-dir/ignore.html",
-                    "content-['actual-dir/ignore.html']",
-                ),
-                ("actual-file.html", "content-['actual-file.html']"),
-            ],
-        );
-
-        let _ = symlink(dir.join("actual-dir"), dir.join("linked-dir"));
-        let _ = symlink_file(dir.join("actual-file.html"), dir.join("linked-file.html"));
-
-        let base = dir.join("src");
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(base.clone(), "@source '../**/*'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../actual-dir'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../linked-dir'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../actual-file.html'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../linked-file.html'"),
-        ]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ actual-dir
-        │   └── ✗ ignore.html
-        ├── ✗ actual-file.html
-        ├── ✗ linked-dir → actual-dir
-        │   └── ✗ ignore.html
-        ├── ✗ linked-file.html → actual-file.html
-        └── ✓ src
-            └── ✓ keep.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['src/keep.html']"]);
-
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(base.clone(), "@source '../**/*'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../actual-dir/**/*.html'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../linked-dir/**/*.html'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../actual-file.html'"),
-            public_source_entry_from_pattern(base.clone(), "@source not '../linked-file.html'"),
-        ]);
-        let candidates = scanner.scan();
-
-        assert_eq!(candidates, vec!["content-['src/keep.html']"]);
-    }
-
-    #[test]
-    fn test_symlinked_sources_outside_the_scanned_tree_can_be_ignored() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(
-            &dir,
-            &[
-                (
-                    "actual-dir/ignore.html",
-                    "content-['actual-dir/ignore.html']",
-                ),
-                ("project/keep.html", "content-['project/keep.html']"),
-            ],
-        );
-
-        let _ = symlink(dir.join("actual-dir"), dir.join("project/linked-dir"));
-
-        let base = dir.join("project");
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            base.clone(),
-            "@source '**/*'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ actual-dir
-        │   └── ✓ ignore.html
-        └── ✓ project
-            ├── ✓ keep.html
-            └── ✓ linked-dir → ../actual-dir
-                └── ✓ ignore.html
-        ");
-
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['actual-dir/ignore.html']",
-                "content-['project/keep.html']",
-            ]
-        );
-
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(base.clone(), "@source '**/*'"),
-            public_source_entry_from_pattern(base.clone(), "@source not 'linked-dir'"),
-        ]);
-        let candidates = scanner.scan();
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✗ actual-dir
-        │   └── ✗ ignore.html
-        └── ✓ project
-            ├── ✓ keep.html
-            └── ✗ linked-dir → ../actual-dir
-                └── ✗ ignore.html
-        ");
-
-        assert_eq!(candidates, vec!["content-['project/keep.html']"]);
-    }
-
-    #[test]
-    fn test_files_behind_symlinks_are_tracked_with_their_canonical_paths() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(
-            &dir,
-            &[
-                (
-                    "packages/repro/source.html",
-                    "content-['packages/repro/source.html']",
-                ),
-                (
-                    "packages/repro/nested/deep.html",
-                    "content-['packages/repro/nested/deep.html']",
-                ),
-                (
-                    "packages/other/index.html",
-                    "content-['packages/other/index.html']",
-                ),
-            ],
-        );
-
-        // Mimic a pnpm workspace where `node_modules` contains a symlink to the actual package
-        fs::create_dir_all(dir.join("node_modules")).unwrap();
-        let _ = symlink(dir.join("packages/repro"), dir.join("node_modules/repro"));
-
-        // A directly symlinked file
-        let _ = symlink_file(
-            dir.join("packages/other/index.html"),
-            dir.join("linked.html"),
-        );
-
-        let mut scanner = Scanner::new(vec![
-            public_source_entry_from_pattern(
-                dir.clone(),
-                "@source 'node_modules/repro/source.html'",
-            ),
-            // The symlink sits multiple levels up from the file
-            public_source_entry_from_pattern(
-                dir.clone(),
-                "@source 'node_modules/repro/nested/deep.html'",
-            ),
-            public_source_entry_from_pattern(dir.clone(), "@source 'linked.html'"),
-        ]);
-
-        let candidates = scanner.scan();
-        assert_eq!(
-            candidates,
-            vec![
-                "content-['packages/other/index.html']",
-                "content-['packages/repro/nested/deep.html']",
-                "content-['packages/repro/source.html']",
-            ]
-        );
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ linked.html → packages/other/index.html
-        ├── ✓ node_modules
-        │   └── ✓ repro → ../packages/repro
-        │       ├── ✓ nested
-        │       │   └── ✓ deep.html
-        │       └── ✓ source.html
-        └── ✓ packages
-            ├── ✓ other
-            │   └── ✓ index.html
-            └── ✓ repro
-                ├── ✓ nested
-                │   └── ✓ deep.html
-                └── ✓ source.html
-        ");
-
-        // Both the symlinked paths and the canonical paths should be tracked, such that file
-        // watchers watching the returned files also watch the real files on disk.
-        let files = scanned_files(&mut scanner, &dir);
-        assert_eq!(
-            files,
-            vec![
-                "linked.html",
-                "node_modules/repro/nested/deep.html",
-                "node_modules/repro/source.html",
-                "packages/other/index.html",
-                "packages/repro/nested/deep.html",
-                "packages/repro/source.html",
-            ]
-        );
-    }
-
-    #[test]
-    fn test_changes_to_the_canonical_path_of_a_symlinked_file_are_detected() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(&dir, &[("packages/repro/source.html", "content-['v1']")]);
-
-        // Mimic a pnpm workspace where `node_modules` contains a symlink to the actual package
-        fs::create_dir_all(dir.join("node_modules")).unwrap();
-        let _ = symlink(dir.join("packages/repro"), dir.join("node_modules/repro"));
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'node_modules/repro/source.html'",
-        )]);
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['v1']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ node_modules
-        │   └── ✓ repro → ../packages/repro
-        │       └── ✓ source.html
-        └── ✓ packages
-            └── ✓ repro
-                └── ✓ source.html
-        ");
-
-        // Update the real file on disk. This is the path file watchers will report changes for.
-        create_files_in(&dir, &[("packages/repro/source.html", "content-['v2']")]);
-
-        let candidates = scanner.scan_content(vec![ChangedContent::File(
-            dir.join("packages/repro/source.html"),
-            "html".into(),
-        )]);
-        assert_eq!(candidates, vec!["content-['v2']"]);
-    }
-
-    #[test]
-    fn test_new_files_behind_symlinks_are_detected_at_their_canonical_path() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(&dir, &[("packages/repro/a.html", "content-['a']")]);
-
-        // Mimic a pnpm workspace where `node_modules` contains a symlink to the actual package
-        fs::create_dir_all(dir.join("node_modules")).unwrap();
-        let _ = symlink(dir.join("packages/repro"), dir.join("node_modules/repro"));
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source 'node_modules/repro/*.html'",
-        )]);
-
-        let candidates = scanner.scan();
-        assert_eq!(candidates, vec!["content-['a']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ node_modules
-        │   └── ✓ repro → ../packages/repro
-        │       └── ✓ a.html
-        └── ✓ packages
-            └── ✓ repro
-                └── ✓ a.html
-        ");
-
-        // Create a new file in the real directory. File watchers watching the real directory
-        // will report the new file with its canonical path.
-        create_files_in(&dir, &[("packages/repro/b.html", "content-['b']")]);
-
-        let candidates = scanner.scan_content(vec![ChangedContent::File(
-            dir.join("packages/repro/b.html"),
-            "html".into(),
-        )]);
-        assert_eq!(candidates, vec!["content-['b']"]);
-
-        assert_snapshot!(fs_tree(&dir, &scanned_files(&mut scanner, &dir)), @"
-        .
-        ├── ✓ node_modules
-        │   └── ✓ repro → ../packages/repro
-        │       ├── ✓ a.html
-        │       └── ✓ b.html
-        └── ✓ packages
-            └── ✓ repro
-                ├── ✓ a.html
-                └── ✗ b.html
-        ");
-    }
-
-    // https://github.com/tailwindlabs/tailwindcss/pull/20408
-    #[test]
-    fn test_resolving_globs_does_not_traverse_gitignored_directories() {
-        let ScanResult {
-            files, globs, tree, ..
-        } = scan_with_globs(
-            &[
-                (".gitignore", "/vendor\n"),
-                ("vendor/pkg/canary/index.html", ""),
-                ("src/index.html", ""),
-            ],
-            vec!["@source '**/*'", "@source './vendor/pkg/canary'"],
-        );
-
-        assert_snapshot!(tree, @"
-        . (git)
-        ├── ✗ .gitignore
-        │       /vendor
-        ├── ✓ src
-        │   └── ✓ index.html
-        └── ✓ vendor
-            └── ✓ pkg
-                └── ✓ canary
-                    └── ✓ index.html
-        ");
-
-        assert_eq!(
-            files,
-            vec!["src/index.html", "vendor/pkg/canary/index.html"]
-        );
-        assert_eq!(globs, vec![
-            "*",
-            "src/**/*.{aspx,astro,cjs,cts,eex,erb,gjs,gts,haml,handlebars,hbs,heex,html,jade,js,jsx,liquid,md,mdx,mjs,mts,mustache,njk,nunjucks,php,pug,py,razor,rb,rhtml,rs,slim,svelte,tpl,ts,tsx,twig,vue}",
-
-            // This should not include `**` or `**.*.{aspx,...}` otherwise this might be scanned recursively.
-            "vendor/pkg/canary/*",
-        ]);
-    }
-
-    #[test]
-    fn test_extract_used_css_variables_from_css() {
-        let dir = tempdir().unwrap().into_path();
-        create_files_in(
-            &dir,
-            &[
-                (
-                    "src/index.css",
-                    r#"
-                        @theme {
-                            --color-red: #ff0000; /* Not used, so don't extract */
-                            --color-green: #00ff00; /* Not used, so don't extract */
-                        }
-
-                        .button {
-                            color: var(--color-red); /* Used, so extract */
-                        }
-                    "#,
-                ),
-                ("src/used-at-start.css", "var(--color-used-at-start)"),
-                // Here to verify that we don't crash when trying to find `var(` in front of the
-                // variable.
-                ("src/defined-at-start.css", "--color-defined-at-start: red;"),
-            ],
-        );
-        fs::write(
-            dir.join("src/invalid.css"),
-            b".button { color: var(--color-\x80); }",
-        )
-        .unwrap();
-
-        let mut scanner = Scanner::new(vec![public_source_entry_from_pattern(
-            dir.clone(),
-            "@source './'",
-        )]);
-        let candidates = scanner.scan();
-
-        assert_eq!(candidates, vec!["--color-red", "--color-used-at-start"]);
-    }
 }
diff --git a/integrations/cli/config.test.ts b/integrations/cli/config.test.ts
index dda70814b..dd93ade64 100644
--- a/integrations/cli/config.test.ts
+++ b/integrations/cli/config.test.ts
@@ -126,72 +126,6 @@ test(
   },
 )
 
-// https://github.com/tailwindlabs/tailwindcss/issues/19706
-test(
-  'Config files (TS, valid types)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          },
-          "devDependencies": {
-            "typescript": "^5.9.3"
-          }
-        }
-      `,
-      'tsconfig.json': json`
-        {
-          "compilerOptions": {
-            "target": "ES2022",
-            "module": "NodeNext",
-            "moduleResolution": "NodeNext",
-            "declaration": true,
-            "composite": true,
-            "outDir": "./.build",
-            "skipLibCheck": true
-          },
-          "include": ["tailwind.config.ts"]
-        }
-      `,
-      'index.html': html`
-        <div class="text-primary"></div>
-      `,
-      'tailwind.config.ts': ts`
-        import type { Config } from 'tailwindcss'
-
-        function defineConfig(config: Config): Config {
-          return config
-        }
-
-        export default defineConfig({
-          theme: {
-            extend: {
-              colors: {
-                primary: 'blue',
-              },
-            },
-          },
-        })
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss';
-        @config '../tailwind.config.ts';
-      `,
-    },
-  },
-  async ({ fs, exec }) => {
-    // We expect that these commands don't crash:
-    await exec('pnpm tsc -b')
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css')
-
-    await fs.expectFileToContain('dist/out.css', [candidate`text-primary`])
-  },
-)
-
 test(
   'Config files (CJS, watch mode)',
   {
diff --git a/integrations/cli/index.test.ts b/integrations/cli/index.test.ts
index 07f8bcb68..487c88e40 100644
--- a/integrations/cli/index.test.ts
+++ b/integrations/cli/index.test.ts
@@ -1,11 +1,8 @@
 import dedent from 'dedent'
 import os from 'node:os'
 import path from 'node:path'
-import { fileURLToPath } from 'node:url'
 import { describe } from 'vitest'
-import { candidate, css, html, js, json, retryAssertion, test, ts, txt, yaml } from '../utils'
-
-const __dirname = path.dirname(fileURLToPath(import.meta.url))
+import { candidate, css, html, js, json, test, ts, yaml } from '../utils'
 
 const STANDALONE_BINARY = (() => {
   switch (os.platform()) {
@@ -26,7 +23,7 @@ describe.each([
     'Standalone CLI',
     path.resolve(__dirname, `../../packages/@tailwindcss-standalone/dist/${STANDALONE_BINARY}`),
   ],
-])('%s', (kind, command) => {
+])('%s', (_, command) => {
   test(
     'production build',
     {
@@ -375,120 +372,6 @@ describe.each([
     },
   )
 
-  test(
-    'watch mode with polling',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.css': css`@import 'tailwindcss/utilities';`,
-        'src/index.html': html`
-          <div class="underline"></div>
-        `,
-      },
-    },
-    async ({ fs, spawn }) => {
-      let process = await spawn(
-        `${command} --input src/index.css --output dist/out.css --watch --poll=50`,
-      )
-      await process.onStderr((m) => m.includes('Done in'))
-
-      await fs.expectFileToContain('dist/out.css', [candidate`underline`])
-
-      await fs.write('src/index.html', html`
-          <div class="underline flex"></div>
-        `)
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-    },
-  )
-
-  test(
-    "watch mode with unknown @source paths shouldn't crash on Windows",
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'index.html': html`
-          <div class="underline"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss';
-          @source "unknown-folder/**/*";
-        `,
-      },
-    },
-    async ({ fs, spawn }) => {
-      let process = await spawn(`${command} --input src/index.css --output dist/out.css --watch`)
-      await process.onStderr((m) => m.includes('Done in'))
-
-      await fs.expectFileToContain('dist/out.css', [candidate`underline`])
-    },
-  )
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/17632
-  test(
-    'watch mode rebuilds when the input file is in an ignored folder',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'assets/tailwind.config.js': js`
-          module.exports = {
-            content: {
-              relative: true,
-              files: ['html/*.html'],
-            },
-          }
-        `,
-        'assets/html/index.html': html`
-          <div class="underline"></div>
-        `,
-        'assets/css/index.css': css`
-          @import 'tailwindcss' source(none);
-          @config '../tailwind.config.js';
-        `,
-      },
-    },
-    async ({ fs, spawn }) => {
-      let process = await spawn(
-        `${command} --input assets/css/index.css --output dist/out.css --watch`,
-      )
-      await process.onStderr((m) => m.includes('Done in'))
-
-      await fs.expectFileToContain('dist/out.css', [candidate`underline`])
-
-      await fs.write(
-        'assets/css/index.css',
-        css`
-          @import 'tailwindcss' source(none);
-          @config '../tailwind.config.js';
-          @source inline("flex");
-        `,
-      )
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-    },
-  )
-
   test(
     'production build (stdin)',
     {
@@ -673,15 +556,6 @@ describe.each([
     'git ignore files outside of a repo are not considered',
     {
       fs: {
-        // Make the test root a pnpm workspace that includes `home/project` so
-        // the install below resolves the transitive dependency overrides that
-        // the test harness injects into this `pnpm-workspace.yaml`.
-        'pnpm-workspace.yaml': yaml`
-          #
-          packages:
-            - home/project
-        `,
-
         // Ignore everything in the "home" directory
         'home/.gitignore': '*',
 
@@ -719,7 +593,7 @@ describe.each([
       installDependencies: false,
     },
     async ({ fs, root, exec }) => {
-      await exec(`pnpm install`, {
+      await exec(`pnpm install --ignore-workspace`, {
         cwd: path.join(root, 'home/project'),
       })
 
@@ -754,749 +628,6 @@ describe.each([
       ])
     },
   )
-
-  test(
-    'production build + inline source maps',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.html': html`
-          <div class="flex"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss/utilities';
-          /*  */
-        `,
-      },
-    },
-    async ({ exec, expect, fs, parseSourceMap }) => {
-      await exec(`${command} --input src/index.css --output dist/out.css --map`)
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-
-      // Make sure we can find a source map
-      let map = parseSourceMap(await fs.read('dist/out.css'))
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}...',
-      })
-    },
-  )
-
-  test(
-    'production build + separate source maps',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.html': html`
-          <div class="flex"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss/utilities';
-          /*  */
-        `,
-      },
-    },
-    async ({ exec, expect, fs, parseSourceMap }) => {
-      await exec(`${command} --input src/index.css --output dist/out.css --map dist/out.css.map`)
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-
-      // Make sure we can find a source map
-      let map = parseSourceMap({
-        map: await fs.read('dist/out.css.map'),
-        content: await fs.read('dist/out.css'),
-      })
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n\n/*# sou...',
-      })
-    },
-  )
-
-  // Skipped because Lightning CSS has a bug with source maps containing
-  // license comments and it breaks stuff.
-  test.skip(
-    'production build + minify + source maps',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.html': html`
-          <div class="flex"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss/utilities';
-          /*  */
-        `,
-      },
-    },
-    async ({ exec, expect, fs, parseSourceMap }) => {
-      await exec(`${command} --input src/index.css --output dist/out.css --minify --map`)
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-
-      // Make sure we can find a source map
-      let map = parseSourceMap(await fs.read('dist/out.css'))
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n\n/*# sou...',
-      })
-    },
-  )
-
-  test(
-    'watch mode + inline source maps',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.html': html`
-          <div class="flex"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss/utilities';
-          /*  */
-        `,
-      },
-    },
-    async ({ spawn, expect, fs, parseSourceMap }) => {
-      let process = await spawn(
-        `${command} --input src/index.css --output dist/out.css --map --watch`,
-      )
-      await process.onStderr((m) => m.includes('Done in'))
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-
-      let originalCss = await fs.read('dist/out.css')
-      let currentCss = originalCss
-
-      // Make sure we can find a source map
-      let map = parseSourceMap(currentCss)
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}...',
-      })
-
-      // Write to project source files
-      await fs.write('src/index.html', html`
-        <div class="flex underline"></div>
-      `)
-
-      // Wait for the CSS to be rebuilt
-      await retryAssertion(async () => {
-        currentCss = await fs.read('dist/out.css')
-        expect(currentCss).not.toEqual(originalCss)
-        originalCss = currentCss
-      })
-
-      // Make sure the source map was updated
-      map = parseSourceMap(currentCss)
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n.underli...',
-      })
-
-      expect(map.at(5, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.underline...',
-      })
-
-      expect(map.at(6, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'text-decor...',
-      })
-
-      expect(map.at(7, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}...',
-      })
-
-      // Write to the main CSS file
-      await fs.write(
-        'src/index.css',
-        css`
-          @import 'tailwindcss/utilities';
-          @source inline("w-auto");
-        `,
-      )
-
-      // Wait for the CSS to be rebuilt
-      await retryAssertion(async () => {
-        currentCss = await fs.read('dist/out.css')
-        expect(currentCss).not.toEqual(originalCss)
-        originalCss = currentCss
-      })
-
-      // Make sure the source map was updated
-      map = parseSourceMap(currentCss)
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n.w-auto...',
-      })
-
-      expect(map.at(5, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.w-auto {...',
-      })
-
-      expect(map.at(6, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'width: aut...',
-      })
-
-      expect(map.at(7, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n.underli...',
-      })
-
-      expect(map.at(8, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.underline...',
-      })
-
-      expect(map.at(9, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'text-decor...',
-      })
-
-      expect(map.at(10, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}...',
-      })
-    },
-  )
-
-  test(
-    'watch mode + separate source maps',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.html': html`
-          <div class="flex"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss/utilities';
-          /*  */
-        `,
-      },
-    },
-    async ({ spawn, expect, fs, parseSourceMap }) => {
-      let process = await spawn(
-        `${command} --input src/index.css --output dist/out.css --map dist/out.css.map --watch`,
-      )
-      await process.onStderr((m) => m.includes('Done in'))
-
-      await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-
-      // Make sure we can find a source map
-      let originalCss = await fs.read('dist/out.css')
-      let originalMap = await fs.read('dist/out.css.map')
-      let currentCss = originalCss
-      let currentMap = originalMap
-
-      // Make sure we can find a source map
-      let map = parseSourceMap({ map: currentMap, content: currentCss })
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n\n/*# sou...',
-      })
-
-      // Write to project source files
-      await fs.write('src/index.html', html`
-        <div class="flex underline"></div>
-      `)
-
-      // Wait for the CSS to be rebuilt
-      await retryAssertion(async () => {
-        currentCss = await fs.read('dist/out.css')
-        currentMap = await fs.read('dist/out.css.map')
-        expect(currentCss).not.toEqual(originalCss)
-        expect(currentMap).not.toEqual(originalMap)
-        originalCss = currentCss
-        originalMap = currentMap
-      })
-
-      // Make sure the source map was updated
-      map = parseSourceMap({ map: currentMap, content: currentCss })
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n.underli...',
-      })
-
-      expect(map.at(5, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.underline...',
-      })
-
-      expect(map.at(6, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'text-decor...',
-      })
-
-      expect(map.at(7, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n\n/*# sou...',
-      })
-
-      // Write to the main CSS file
-      await fs.write(
-        'src/index.css',
-        css`
-          @import 'tailwindcss/utilities';
-          @source inline("w-auto");
-        `,
-      )
-
-      // Wait for the CSS to be rebuilt
-      await retryAssertion(async () => {
-        currentCss = await fs.read('dist/out.css')
-        currentMap = await fs.read('dist/out.css.map')
-        expect(currentCss).not.toEqual(originalCss)
-        expect(currentMap).not.toEqual(originalMap)
-        originalCss = currentCss
-        originalMap = currentMap
-      })
-
-      // Make sure the source map was updated
-      map = parseSourceMap({ map: currentMap, content: currentCss })
-
-      expect(map.at(1, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '/*! tailwi...',
-      })
-
-      expect(map.at(2, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.flex {...',
-      })
-
-      expect(map.at(3, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'display: f...',
-      })
-
-      expect(map.at(4, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n.w-auto...',
-      })
-
-      expect(map.at(5, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.w-auto {...',
-      })
-
-      expect(map.at(6, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'width: aut...',
-      })
-
-      expect(map.at(7, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n.underli...',
-      })
-
-      expect(map.at(8, 0)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: '.underline...',
-      })
-
-      expect(map.at(9, 2)).toMatchObject({
-        source:
-          kind === 'CLI'
-            ? expect.stringContaining('utilities.css')
-            : expect.stringMatching(/\/utilities-\w+\.css$/),
-        original: '@tailwind...',
-        generated: 'text-decor...',
-      })
-
-      expect(map.at(10, 0)).toMatchObject({
-        source: null,
-        original: '(none)',
-        generated: '}\n\n/*# sou...',
-      })
-    },
-  )
-
-  test(
-    'watch mode should trigger a full rebuild when a dependency is removed',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "dependencies": {
-              "tailwindcss": "workspace:^",
-              "@tailwindcss/cli": "workspace:^"
-            }
-          }
-        `,
-        'src/index.html': html`
-          <div class="flex text-primary"></div>
-        `,
-        'src/index.css': css`
-          @import 'tailwindcss/utilities';
-          @config '../tailwind.config.js';
-        `,
-        'tailwind.config.js': js`
-          const myColor = require('./my-color')
-
-          module.exports = {
-            theme: {
-              extend: {
-                colors: {
-                  primary: myColor,
-                },
-              },
-            },
-          }
-        `,
-        'my-color.js': js`
-          //
-          module.exports = 'blue'
-        `,
-      },
-    },
-    async ({ spawn, fs, expect }) => {
-      let process = await spawn(`${command} --input src/index.css --output dist/out.css --watch`)
-      await process.onStderr((m) => m.includes('Done in'))
-
-      expect(await fs.dumpFiles('dist/*.css')).toMatchInlineSnapshot(`
-        "
-        --- dist/out.css ---
-        .flex {
-          display: flex;
-        }
-        .text-primary {
-          color: blue;
-        }
-        "
-      `)
-
-      // Remove the dependency of the tailwind.config.js file
-      await fs.delete('my-color.js')
-
-      // We expect an error
-      await process.onStderr((m) => m.includes('Error'))
-      await process.onStderr((m) => m.includes('Done in'))
-
-      // Re-create the file to resolve the issue
-      await fs.write('my-color.js', js`module.exports = 'red'`)
-      await process.onStderr((m) => m.includes('Done in'))
-
-      // Expect a full rebuild
-      expect(await fs.dumpFiles('dist/*.css')).toMatchInlineSnapshot(`
-        "
-        --- dist/out.css ---
-        .flex {
-          display: flex;
-        }
-        .text-primary {
-          color: red;
-        }
-        "
-      `)
-    },
-  )
 })
 
 test(
@@ -1534,7 +665,7 @@ test(
         /* (4) */
         /* - './pages' should be auto-scanned */
         /* - Only '.html' files should be included */
-        /* - './page/ignored.html' will not be ignored because of the specific pattern */
+        /* - './page/ignored.html' should be ignored */
         @source "./pages/**/*.html";
       `,
 
@@ -1571,7 +702,7 @@ test(
       // (4)
       'pages/foo.html': 'content-["pages/foo.html"]',
       'pages/nested/foo.html': 'content-["pages/nested/foo.html"]',
-      'pages/ignored.html': 'content-["pages/ignored.html"]',
+      'pages/ignored.html': 'content-["pages/ignored.html"] content-["BAD"]',
       'pages/foo.jsx': 'content-["pages/foo.jsx"] content-["BAD"]',
       'pages/nested/foo.jsx': 'content-["pages/nested/foo.jsx"] content-["BAD"]',
     },
@@ -1582,7 +713,6 @@ test(
     expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
       "
       --- ./dist/out.css ---
-      @layer properties;
       .content-\\[\\"components\\/my-component\\.tsx\\"\\] {
         --tw-content: "components/my-component.tsx";
         content: var(--tw-content);
@@ -1603,10 +733,6 @@ test(
         --tw-content: "pages/foo.html";
         content: var(--tw-content);
       }
-      .content-\\[\\"pages\\/ignored\\.html\\"\\] {
-        --tw-content: "pages/ignored.html";
-        content: var(--tw-content);
-      }
       .content-\\[\\"pages\\/nested\\/foo\\.html\\"\\] {
         --tw-content: "pages/nested/foo.html";
         content: var(--tw-content);
@@ -1624,13 +750,6 @@ test(
         inherits: false;
         initial-value: "";
       }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
       "
     `)
   },
@@ -1774,11 +893,10 @@ test(
         bar.html
       `,
 
-      // Project D, foo.html is ignored by the gitignore file but the source rule is explicit about
-      // adding all `.html` files.
+      // Project D, foo.html is ignored by the gitignore file.
       'project-d/src/foo.html': html`
         <div
-          class="content-['project-d/src/foo.html']"
+          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-d/src/foo.html']"
         ></div>
       `,
 
@@ -1821,7 +939,6 @@ test(
     expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(`
       "
       --- ./project-a/dist/out.css ---
-      @layer properties;
       .content-\\[\\'project-a\\/node_modules\\/my-lib-1\\/src\\/index\\.html\\'\\] {
         --tw-content: 'project-a/node modules/my-lib-1/src/index.html';
         content: var(--tw-content);
@@ -1854,10 +971,6 @@ test(
         --tw-content: 'project-d/src/bar.html';
         content: var(--tw-content);
       }
-      .content-\\[\\'project-d\\/src\\/foo\\.html\\'\\] {
-        --tw-content: 'project-d/src/foo.html';
-        content: var(--tw-content);
-      }
       .content-\\[\\'project-d\\/src\\/index\\.html\\'\\] {
         --tw-content: 'project-d/src/index.html';
         content: var(--tw-content);
@@ -1875,13 +988,6 @@ test(
         inherits: false;
         initial-value: "";
       }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
       "
     `)
 
@@ -2013,394 +1119,6 @@ test(
   },
 )
 
-test(
-  'source(…) and `@source` are relative to the file they are in',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'index.css': css` @import './project-a/src/index.css'; `,
-
-      'project-a/src/index.css': css`
-        /* Run auto-content detection in ../../project-b */
-        @import 'tailwindcss/utilities' source('../../project-b');
-
-        /* Explicitly using node_modules in the @source allows git ignored folders */
-        @source '../../project-c';
-      `,
-
-      // Project A is the current folder, but we explicitly configured
-      // `source(project-b)`, therefore project-a should not be included in
-      // the output.
-      'project-a/src/index.html': html`
-        <div
-          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-a/src/index.html']"
-        ></div>
-      `,
-
-      // Project B is the configured `source(…)`, therefore auto source
-      // detection should include known extensions and folders in the output.
-      'project-b/src/index.html': html`
-        <div
-          class="content-['project-b/src/index.html']"
-        ></div>
-      `,
-
-      // Project C should apply auto source detection, therefore known
-      // extensions and folders should be included in the output.
-      'project-c/src/index.html': html`
-        <div
-          class="content-['project-c/src/index.html']"
-        ></div>
-      `,
-    },
-  },
-  async ({ fs, exec, root, expect }) => {
-    await exec('pnpm tailwindcss --input ./index.css --output dist/out.css', { cwd: root })
-
-    let content = await fs.dumpFiles('./dist/*.css')
-
-    expect(content).not.toContain(candidate`content-['project-a/src/index.html']`)
-    expect(content).toContain(candidate`content-['project-b/src/index.html']`)
-    expect(content).toContain(candidate`content-['project-c/src/index.html']`)
-  },
-)
-
-test(
-  '@source order is important (referencing sibling project)',
-  {
-    fs: {
-      'package.json': json`{}`,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - project-a
-      `,
-      'project-a/package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'project-a/src/index.css': css`
-        @import 'tailwindcss/utilities' source(none);
-
-        @source '../../project-b';
-        @source not '../../project-b/ignored';
-        @source '../../project-b/ignored/except.html';
-      `,
-
-      'project-b/keep/keep.html': html`<div class="content-['GOOD-1']"></div>`,
-      'project-b/ignored/ignored.html': html`<div class="content-['BAD-1']"></div>`,
-      'project-b/ignored/except.html': html`<div class="content-['GOOD-2']"></div>`,
-    },
-  },
-  async ({ fs, root, exec, expect }) => {
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css', {
-      cwd: path.join(root, 'project-a'),
-    })
-
-    expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./project-a/dist/out.css ---
-      @layer properties;
-      .content-\\[\\'GOOD-1\\'\\] {
-        --tw-content: 'GOOD-1';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'GOOD-2\\'\\] {
-        --tw-content: 'GOOD-2';
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '@source works with symlinks (referencing sibling project)',
-  {
-    fs: {
-      'package.json': json`{}`,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - project-a
-      `,
-      'project-a/package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'project-a/src/index.css': css`
-        @import 'tailwindcss/utilities' source(none);
-
-        /* Same as the previous test, but using symlinks instead */
-        @source '../../project-b';
-        @source not '../../project-b/ignored';
-        @source '../../project-b/ignored/except.html';
-      `,
-
-      'project-b/keep/keep.html': html`<div class="content-['GOOD-1']"></div>`,
-      'project-c/ignored/ignored.html': html`<div class="content-['BAD-1']"></div>`,
-      'project-c/ignored/except.html': html`<div class="content-['GOOD-2']"></div>`,
-
-      // Symlink the ignored folder to another project
-      'project-b/ignored': 'symlink:../../project-c/ignored/',
-    },
-  },
-  async ({ fs, root, exec, expect }) => {
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css', {
-      cwd: path.join(root, 'project-a'),
-    })
-
-    expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./project-a/dist/out.css ---
-      @layer properties;
-      .content-\\[\\'GOOD-1\\'\\] {
-        --tw-content: 'GOOD-1';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'GOOD-2\\'\\] {
-        --tw-content: 'GOOD-2';
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
-// https://github.com/tailwindlabs/tailwindcss/issues/19844
-test(
-  '@source scans directories ignored by allow-list .gitignore files',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      '.gitignore': txt`
-        *
-        !/app
-        !/app/design
-        !/app/design/**
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/utilities' source(none);
-        @source '../vendor/acme/theme';
-      `,
-      // 1. Ignored by the `*` in `.gitignore`
-      // 2. Included by the `!` pattern in `.gitignore`
-      // 3. Ignored by `source(none)`
-      //
-      // → Should be ignored
-      'app/design/frontend/theme/templates/component.phtml': html`
-        <div
-          class="content-['app/design/frontend/theme/templates/component.phtml']"
-        ></div>
-      `,
-      // 1. Ignored by the `*` in `.gitignore`
-      // 2. Included by the `!` pattern in `.gitignore`
-      // 3. Ignored by `source(none)`
-      // 4. Included by the `@source` directive
-      //
-      // → Should be included
-      'vendor/acme/theme/module/templates/component.phtml': html`
-        <div
-          class="content-['vendor/acme/theme/module/templates/component.phtml']"
-        ></div>
-      `,
-    },
-  },
-  async ({ fs, exec }) => {
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css')
-
-    // 1. Ignored by the `*` in `.gitignore`
-    // 2. Included by the `!` pattern in `.gitignore`
-    // 3. Ignored by `source(none)`
-    //
-    // → Should be ignored
-    await fs.expectFileNotToContain('dist/out.css', [
-      candidate`content-['app/design/frontend/theme/templates/component.phtml']`,
-    ])
-
-    // 1. Ignored by the `*` in `.gitignore`
-    // 2. Included by the `!` pattern in `.gitignore`
-    // 3. Ignored by `source(none)`
-    // 4. Included by the `@source` directive
-    //
-    // → Should be included
-    await fs.expectFileToContain('dist/out.css', [
-      candidate`content-['vendor/acme/theme/module/templates/component.phtml']`,
-    ])
-  },
-)
-
-// https://github.com/tailwindlabs/tailwindcss/discussions/20382
-test(
-  'auto source detection respects allow-list .gitignore files',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      '.gitignore': txt`
-        /*
-        !/.gitignore
-        !/app
-        !/public
-        !/package.json
-      `,
-      'app/root.css': css` @import 'tailwindcss/utilities'; `,
-      // Included by the `!/app` pattern in `.gitignore`
-      //
-      // → Should be included
-      'app/index.html': html`
-        <div class="content-['app/index.html']"></div>
-      `,
-      // Included by the `!/public` pattern in `.gitignore`
-      //
-      // → Should be included
-      'public/index.html': html`
-        <div class="content-['public/index.html']"></div>
-      `,
-      // Ignored by the `/*` in `.gitignore`
-      //
-      // → Should be ignored
-      'build/index.html': html`
-        <div class="content-['build/index.html']"></div>
-      `,
-      // Ignored by the `/*` in `.gitignore` and the default `node_modules` rules
-      //
-      // → Should be ignored
-      'node_modules/my-ui-lib/index.html': html`
-        <div
-          class="content-['node_modules/my-ui-lib/index.html']"
-        ></div>
-      `,
-    },
-  },
-  async ({ fs, exec }) => {
-    await exec('pnpm tailwindcss --input app/root.css --output dist/out.css')
-
-    await fs.expectFileToContain('dist/out.css', [
-      candidate`content-['app/index.html']`,
-      candidate`content-['public/index.html']`,
-    ])
-
-    await fs.expectFileNotToContain('dist/out.css', [
-      candidate`content-['build/index.html']`,
-      candidate`content-['node_modules/my-ui-lib/index.html']`,
-    ])
-  },
-)
-
-test(
-  '@source works with symlinks (referencing folder in current folder)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/utilities' source(none);
-
-        /* Same as the previous test, but using symlinks instead */
-        @source '../lib';
-        @source not '../lib/ignored';
-        @source '../lib/ignored/except.html';
-      `,
-
-      'lib/keep/keep.html': html`<div class="content-['GOOD-1']"></div>`,
-      'vendor/ignored/ignored.html': html`<div class="content-['BAD-1']"></div>`,
-      'vendor/ignored/except.html': html`<div class="content-['GOOD-2']"></div>`,
-
-      // Symlink the ignored folder to another folder
-      'lib/ignored': 'symlink:../../vendor/ignored/',
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/out.css ---
-      @layer properties;
-      .content-\\[\\'GOOD-1\\'\\] {
-        --tw-content: 'GOOD-1';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'GOOD-2\\'\\] {
-        --tw-content: 'GOOD-2';
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
 test(
   'auto source detection disabled',
   {
@@ -2417,13 +1135,15 @@ test(
         @reference 'tailwindcss/theme';
 
         /* (1) */
-        /* - Disable auto-source detection */
+        /* - Only './src' should be auto-scanned, not the current working directory */
+        /* - .gitignore'd paths should be ignored (node_modules) */
+        /* - Binary extensions should be ignored (jpg, zip) */
         @import 'tailwindcss/utilities' source(none);
 
         /* (2) */
         /* - './pages' should be auto-scanned */
         /* - Only '.html' files should be included */
-        /* - './page/ignored.html' will not be ignored because of the specific pattern */
+        /* - './page/ignored.html' should be ignored */
         @source "./pages/**/*.html";
       `,
 
@@ -2443,7 +1163,7 @@ test(
       // (4)
       'pages/foo.html': 'content-["pages/foo.html"]',
       'pages/nested/foo.html': 'content-["pages/nested/foo.html"]',
-      'pages/ignored.html': 'content-["pages/ignored.html"]',
+      'pages/ignored.html': 'content-["pages/ignored.html"] content-["BAD"]',
       'pages/foo.jsx': 'content-["pages/foo.jsx"] content-["BAD"]',
       'pages/nested/foo.jsx': 'content-["pages/nested/foo.jsx"] content-["BAD"]',
     },
@@ -2454,15 +1174,10 @@ test(
     expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
       "
       --- ./dist/out.css ---
-      @layer properties;
       .content-\\[\\"pages\\/foo\\.html\\"\\] {
         --tw-content: "pages/foo.html";
         content: var(--tw-content);
       }
-      .content-\\[\\"pages\\/ignored\\.html\\"\\] {
-        --tw-content: "pages/ignored.html";
-        content: var(--tw-content);
-      }
       .content-\\[\\"pages\\/nested\\/foo\\.html\\"\\] {
         --tw-content: "pages/nested/foo.html";
         content: var(--tw-content);
@@ -2472,13 +1187,6 @@ test(
         inherits: false;
         initial-value: "";
       }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
       "
     `)
   },
@@ -2749,438 +1457,6 @@ test(
   },
 )
 
-test(
-  'suppress output by using the --silent flag',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'index.css': css` @import 'tailwindcss/utilities';`,
-      'index.html': html`<div class="flex"></div>`,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    let output = await exec('pnpm tailwindcss --input index.css --output dist/loud.css')
-    expect(output).toContain('Done in')
-
-    let silentOutput = await exec(
-      'pnpm tailwindcss --input index.css --output dist/silent.css --silent',
-    )
-    expect(silentOutput).not.toContain('Done in')
-    expect(silentOutput).not.toContain('tailwindcss v')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/loud.css ---
-      .flex {
-        display: flex;
-      }
-
-
-      --- ./dist/silent.css ---
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'changes to CSS files should pick up new CSS variables (if any)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'unrelated.module.css': css`
-        .module {
-          color: var(--color-blue-500);
-        }
-      `,
-      'index.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-      'index.html': html`<div class="flex"></div>`,
-    },
-  },
-  async ({ spawn, exec, fs, expect }) => {
-    // Generate the initial build so output CSS files exist on disk
-    await exec('pnpm tailwindcss --input ./index.css --output ./dist/out.css')
-
-    // NOTE: We are writing to an output CSS file which is not being ignored by
-    // `.gitignore` nor marked with `@source not`. This should not result in an
-    // infinite loop.
-    let process = await spawn(
-      'pnpm tailwindcss --input ./index.css --output ./dist/out.css --watch',
-    )
-    await process.onStderr((m) => m.includes('Done in'))
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/out.css ---
-      :root, :host {
-        --color-blue-500: oklch(62.3% 0.214 259.815);
-      }
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-
-    await fs.write(
-      'unrelated.module.css',
-      css`
-        .module {
-          color: var(--color-blue-500);
-          background-color: var(--color-red-500);
-        }
-      `,
-    )
-    await process.onStderr((m) => m.includes('Done in'))
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/out.css ---
-      :root, :host {
-        --color-red-500: oklch(63.7% 0.237 25.331);
-        --color-blue-500: oklch(62.3% 0.214 259.815);
-      }
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'polyfills should be imported after external `@import url(…)` statements',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'index.css': css`
-        @import url('https://fonts.googleapis.com');
-        @import 'tailwindcss';
-      `,
-      'index.html': html`<div class="bg-red-500/50 shadow-md"></div>`,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm tailwindcss --input ./index.css --output ./dist/out.css')
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/out.css ---
-      @import url('https://fonts.googleapis.com');
-      @layer properties;
-      @layer theme, base, components, utilities;
-      @layer theme {
-        :root, :host {
-          --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial,
-          sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-          --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
-          monospace;
-          --color-red-500: oklch(63.7% 0.237 25.331);
-          --default-font-family: var(--font-sans);
-          --default-mono-font-family: var(--font-mono);
-        }
-      }
-      @layer base {
-        *, ::after, ::before, ::backdrop, ::file-selector-button {
-          box-sizing: border-box;
-          margin: 0;
-          padding: 0;
-          border: 0 solid;
-        }
-        html, :host {
-          line-height: 1.5;
-          -webkit-text-size-adjust: 100%;
-          tab-size: 4;
-          font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji');
-          font-feature-settings: var(--default-font-feature-settings, normal);
-          font-variation-settings: var(--default-font-variation-settings, normal);
-          -webkit-tap-highlight-color: transparent;
-        }
-        hr {
-          height: 0;
-          color: inherit;
-          border-top-width: 1px;
-        }
-        abbr:where([title]) {
-          -webkit-text-decoration: underline dotted;
-          text-decoration: underline dotted;
-        }
-        h1, h2, h3, h4, h5, h6 {
-          font-size: inherit;
-          font-weight: inherit;
-        }
-        a {
-          color: inherit;
-          -webkit-text-decoration: inherit;
-          text-decoration: inherit;
-        }
-        b, strong {
-          font-weight: bolder;
-        }
-        code, kbd, samp, pre {
-          font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace);
-          font-feature-settings: var(--default-mono-font-feature-settings, normal);
-          font-variation-settings: var(--default-mono-font-variation-settings, normal);
-          font-size: 1em;
-        }
-        small {
-          font-size: 80%;
-        }
-        sub, sup {
-          font-size: 75%;
-          line-height: 0;
-          position: relative;
-          vertical-align: baseline;
-        }
-        sub {
-          bottom: -0.25em;
-        }
-        sup {
-          top: -0.5em;
-        }
-        table {
-          text-indent: 0;
-          border-color: inherit;
-          border-collapse: collapse;
-        }
-        :-moz-focusring:where(:not(iframe)) {
-          outline: auto;
-        }
-        progress {
-          vertical-align: baseline;
-        }
-        summary {
-          display: list-item;
-        }
-        ol, ul, menu {
-          list-style: none;
-        }
-        img, svg, video, canvas, audio, iframe, embed, object {
-          display: block;
-          vertical-align: middle;
-        }
-        img, video {
-          max-width: 100%;
-          height: auto;
-        }
-        button, input, select, optgroup, textarea, ::file-selector-button {
-          font: inherit;
-          font-feature-settings: inherit;
-          font-variation-settings: inherit;
-          letter-spacing: inherit;
-          color: inherit;
-          border-radius: 0;
-          background-color: transparent;
-          opacity: 1;
-        }
-        :where(select:is([multiple], [size])) optgroup {
-          font-weight: bolder;
-        }
-        :where(select:is([multiple], [size])) optgroup option {
-          padding-inline-start: 20px;
-        }
-        ::file-selector-button {
-          margin-inline-end: 4px;
-        }
-        ::placeholder {
-          opacity: 1;
-        }
-        @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {
-          ::placeholder {
-            color: currentcolor;
-            @supports (color: color-mix(in lab, red, red)) {
-              color: color-mix(in oklab, currentcolor 50%, transparent);
-            }
-          }
-        }
-        textarea {
-          resize: vertical;
-        }
-        ::-webkit-search-decoration {
-          -webkit-appearance: none;
-        }
-        ::-webkit-date-and-time-value {
-          min-height: 1lh;
-          text-align: inherit;
-        }
-        ::-webkit-datetime-edit {
-          display: inline-flex;
-        }
-        ::-webkit-datetime-edit-fields-wrapper {
-          padding: 0;
-        }
-        ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
-          padding-block: 0;
-        }
-        ::-webkit-calendar-picker-indicator {
-          line-height: 1;
-        }
-        :-moz-ui-invalid {
-          box-shadow: none;
-        }
-        button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-button {
-          appearance: button;
-        }
-        ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
-          height: auto;
-        }
-        [hidden]:where(:not([hidden='until-found'])) {
-          display: none !important;
-        }
-      }
-      @layer utilities {
-        .bg-red-500\\/50 {
-          background-color: color-mix(in srgb, oklch(63.7% 0.237 25.331) 50%, transparent);
-          @supports (color: color-mix(in lab, red, red)) {
-            background-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-          }
-        }
-        .shadow-md {
-          --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
-          box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-        }
-      }
-      @property --tw-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-      @property --tw-shadow-color {
-        syntax: "*";
-        inherits: false;
-      }
-      @property --tw-shadow-alpha {
-        syntax: "<percentage>";
-        inherits: false;
-        initial-value: 100%;
-      }
-      @property --tw-inset-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-      @property --tw-inset-shadow-color {
-        syntax: "*";
-        inherits: false;
-      }
-      @property --tw-inset-shadow-alpha {
-        syntax: "<percentage>";
-        inherits: false;
-        initial-value: 100%;
-      }
-      @property --tw-ring-color {
-        syntax: "*";
-        inherits: false;
-      }
-      @property --tw-ring-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-      @property --tw-inset-ring-color {
-        syntax: "*";
-        inherits: false;
-      }
-      @property --tw-inset-ring-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-      @property --tw-ring-inset {
-        syntax: "*";
-        inherits: false;
-      }
-      @property --tw-ring-offset-width {
-        syntax: "<length>";
-        inherits: false;
-        initial-value: 0px;
-      }
-      @property --tw-ring-offset-color {
-        syntax: "*";
-        inherits: false;
-        initial-value: #fff;
-      }
-      @property --tw-ring-offset-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-shadow: 0 0 #0000;
-            --tw-shadow-color: initial;
-            --tw-shadow-alpha: 100%;
-            --tw-inset-shadow: 0 0 #0000;
-            --tw-inset-shadow-color: initial;
-            --tw-inset-shadow-alpha: 100%;
-            --tw-ring-color: initial;
-            --tw-ring-shadow: 0 0 #0000;
-            --tw-inset-ring-color: initial;
-            --tw-inset-ring-shadow: 0 0 #0000;
-            --tw-ring-inset: initial;
-            --tw-ring-offset-width: 0px;
-            --tw-ring-offset-color: #fff;
-            --tw-ring-offset-shadow: 0 0 #0000;
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'CSS parse errors should include filename and line number',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'input.css': txt`
-        .test {
-          color: red;
-          */
-        }
-      `,
-    },
-  },
-  async ({ exec, expect }) => {
-    await expect(exec('pnpm tailwindcss --input input.css --output dist/out.css')).rejects.toThrow(
-      /CssSyntaxError: .*input.css:3:3: Invalid declaration: `\*\/`/,
-    )
-  },
-)
-
 function withBOM(text: string): string {
   return '\uFEFF' + text
 }
diff --git a/integrations/cli/plugins.test.ts b/integrations/cli/plugins.test.ts
index 0b810c538..0597e247b 100644
--- a/integrations/cli/plugins.test.ts
+++ b/integrations/cli/plugins.test.ts
@@ -1,4 +1,4 @@
-import { candidate, css, html, json, test, ts } from '../utils'
+import { candidate, css, html, json, test } from '../utils'
 
 test(
   'builds the `@tailwindcss/typography` plugin utilities',
@@ -42,86 +42,12 @@ test(
 
     await fs.expectFileToContain('dist/out.css', [
       candidate`prose`,
-      ':where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *))',
-      ':where(tbody td, tfoot td):not(:where([class~="not-prose"], [class~="not-prose"] *))',
+      ':where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *))',
+      ':where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *))',
     ])
   },
 )
 
-test(
-  'builds the `@tailwindcss/typography` plugin utilities with `@variant` usages',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "@tailwindcss/typography": "^0.5.14",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'index.html': html`
-        <div className="prose prose-custom">
-          <h1>Headline</h1>
-          <p>
-            Until now, trying to style an article, document, or blog post with Tailwind has been a
-            tedious task that required a keen eye for typography and a lot of complex custom CSS.
-          </p>
-        </div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/utilities';
-        @theme {
-          --breakpoint-sm: 640px;
-        }
-        @plugin '@tailwindcss/typography';
-        @config '../tailwind.config.js';
-        @custom-variant custom (&.custom);
-      `,
-      'tailwind.config.js': ts`
-        module.exports = {
-          theme: {
-            typography: ({ theme }) => ({
-              custom: {
-                css: {
-                  hr: {
-                    '--x': '1',
-                    '@variant sm:custom': {
-                      '--x': '2',
-                    },
-                  },
-                },
-              },
-            }),
-          },
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css')
-
-    // We don't want to see `@variant` in the output
-    let contents = await fs.read('dist/out.css')
-    expect(contents).not.toContain('@variant')
-
-    expect(await fs.dumpFiles('dist/out.css')).toMatchInlineSnapshot(`
-      "
-      --- dist/out.css ---
-      .prose-custom :where(hr):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
-        --x: 1;
-        @media (width >= 640px) {
-          &.custom {
-            --x: 2;
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
 test(
   'builds the `@tailwindcss/forms` plugin utilities',
   {
@@ -191,7 +117,7 @@ test(
     await fs.expectFileToContain('dist/out.css', [
       //
       `::-webkit-date-and-time-value`,
-      `input:where([type='checkbox']):indeterminate`,
+      `[type='checkbox']:indeterminate`,
     ])
 
     // No classes are included even though they are used in the HTML
@@ -281,88 +207,3 @@ test(
     ])
   },
 )
-
-// https://github.com/tailwindlabs/tailwindcss/issues/15844
-test(
-  'builds CSS with a custom plugin compiled from TypeScript',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/cli": "workspace:^"
-          },
-          "devDependencies": {
-            "typescript": "^5.7.2"
-          }
-        }
-      `,
-      'tsconfig.json': json`
-        {
-          "compilerOptions": {
-            "target": "ES2022",
-            "module": "NodeNext",
-            "moduleResolution": "NodeNext",
-            "declaration": true,
-            "composite": true,
-            "rootDir": "./src",
-            "outDir": "./.build",
-            "skipLibCheck": true
-          },
-          "include": ["src/**/*.ts"]
-        }
-      `,
-      'index.html': html`
-        <div class="test-red"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss';
-        @plugin '../.build/plugin.js';
-      `,
-      'src/plugin.ts': ts`
-        import plugin from 'tailwindcss/plugin'
-
-        export const typedPlugin = plugin(() => {
-          return ({ matchComponents }) => {
-            matchComponents(
-              {
-                test: (content: string) => ({
-                  color: content,
-                }),
-              },
-              {
-                values: {
-                  red: 'red',
-                },
-              },
-            )
-          }
-        })
-
-        export default plugin(({ matchComponents }) => {
-          matchComponents(
-            {
-              test: (content: string) => ({
-                color: content,
-              }),
-            },
-            {
-              values: {
-                red: 'red',
-              },
-            },
-          )
-        })
-      `,
-    },
-  },
-  async ({ fs, exec }) => {
-    // We expect that these commands don't crash:
-    await exec('pnpm tsc -b')
-    await exec('pnpm tailwindcss --input src/index.css --output dist/out.css')
-
-    await fs.expectFileToContain('dist/out.css', [candidate`test-red`])
-  },
-)
diff --git a/integrations/cli/standalone.test.ts b/integrations/cli/standalone.test.ts
index f84bf4511..07b8ebfee 100644
--- a/integrations/cli/standalone.test.ts
+++ b/integrations/cli/standalone.test.ts
@@ -1,7 +1,6 @@
-import nodeFs from 'node:fs/promises'
 import os from 'node:os'
 import path from 'node:path'
-import { candidate, css, html, IS_WINDOWS, js, json, test, ts } from '../utils'
+import { candidate, css, html, js, json, test } from '../utils'
 
 const STANDALONE_BINARY = (() => {
   switch (os.platform()) {
@@ -16,41 +15,6 @@ const STANDALONE_BINARY = (() => {
   }
 })()
 
-test(
-  'does not scan itself for candidates',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {}
-        }
-      `,
-      'src/index.css': css` @import 'tailwindcss'; `,
-    },
-  },
-  async ({ root, fs, exec }) => {
-    let sourceBinary = path.resolve(
-      __dirname,
-      `../../packages/@tailwindcss-standalone/dist/${STANDALONE_BINARY}`,
-    )
-    let binary = IS_WINDOWS ? 'tailwindcss.exe' : 'tailwindcss'
-    let localBinary = path.join(root, binary)
-    await nodeFs.copyFile(sourceBinary, localBinary)
-
-    if (!IS_WINDOWS) {
-      await nodeFs.chmod(localBinary, 0o755)
-    }
-
-    await exec(`${IS_WINDOWS ? binary : `./${binary}`} --input src/index.css --output dist/out.css`)
-
-    await fs.expectFileNotToContain('dist/out.css', [
-      candidate`flex`,
-      candidate`grid`,
-      candidate`underline`,
-    ])
-  },
-)
-
 test(
   'includes first-party plugins',
   {
@@ -158,7 +122,7 @@ test(
           })
         })
       `,
-      'src/plugin.ts': ts`
+      'src/plugin.ts': js`
         import plugin from 'tailwindcss/plugin'
 
         // Make sure all available JS APIs can be imported and used
@@ -168,7 +132,8 @@ test(
         import defaultTheme from 'tailwindcss/defaultTheme'
         import * as pkg from 'tailwindcss/package.json'
 
-        export interface PluginOptions {}
+        export interface PluginOptions {
+        }
 
         export default plugin(function ({ addUtilities }) {
           addUtilities({
diff --git a/integrations/oxide/wasm.test.ts b/integrations/oxide/wasm.test.ts
deleted file mode 100644
index 2d63c707a..000000000
--- a/integrations/oxide/wasm.test.ts
+++ /dev/null
@@ -1,243 +0,0 @@
-import { css, js, json, test, yaml } from '../utils'
-
-// This test runs the wasm build using the `node:wasi` runtime.
-//
-// There are currently a known problems that the Node WASI preview implementation does not properly
-// handle FS reads on macOS and it does not implement all APIs on Windows. Because of that, this
-// test is only run on Linux for now.
-//
-// https://github.com/nodejs/node/issues/47193
-// https://github.com/nodejs/uvwasi/issues/11
-
-let testFn = process.platform === 'linux' ? test : test.skip
-
-testFn(
-  '@tailwindcss/oxide-wasm32-wasi can be loaded into a Node.js process',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "@tailwindcss/oxide-wasm32-wasi": "workspace:^"
-          }
-        }
-      `,
-      'src/index.css': css`@import 'tailwindcss/utilities';`,
-      'src/index.js': js`
-        const className = "content-['src/index.js']"
-        module.exports = { className }
-      `,
-      'index.mjs': js`
-        import { Scanner } from '@tailwindcss/oxide-wasm32-wasi'
-        import { join, resolve } from 'node:path'
-
-        let scanner = new Scanner({
-          sources: [
-            {
-              base: join(process.cwd(), 'src'),
-              pattern: '**/*',
-              negated: false,
-            },
-          ],
-        })
-        console.log(JSON.stringify(scanner.scan()))
-        process.exit()
-      `,
-    },
-  },
-  async ({ expect, exec }) => {
-    let output = await exec(`node index.mjs`)
-    expect(JSON.parse(output)).toMatchInlineSnapshot(`
-      [
-        "className",
-        "const",
-        "content-['src/index.js']",
-        "exports",
-      ]
-    `)
-  },
-)
-
-testFn(
-  '`@tailwindcss/oxide` falls back to the wasm build when no native binding is available',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "@tailwindcss/oxide": "workspace:^"
-          }
-        }
-      `,
-      'pnpm-workspace.yaml': yaml`
-        # Trick pnpm in only supporting an architecture that @tailwindcss/oxide
-        # doesn't support, and therefore should fallback to the wasm version.
-        supportedArchitectures:
-          os:
-            - openbsd
-          cpu:
-            - x64
-      `,
-      'src/index.js': js`
-        const className = "content-['src/index.js']"
-        module.exports = { className }
-      `,
-      'index.mjs': js`
-        import { createRequire } from 'node:module'
-        import { join } from 'node:path'
-
-        let require = createRequire(import.meta.url)
-        let { Scanner } = require('@tailwindcss/oxide')
-
-        let loaded = Object.keys(require.cache)
-
-        let scanner = new Scanner({
-          sources: [
-            {
-              base: join(process.cwd(), 'src'),
-              pattern: '**/*',
-              negated: false,
-            },
-          ],
-        })
-
-        console.log(
-          JSON.stringify({
-            native: loaded.filter((file) => file.endsWith('.node')),
-            wasi: loaded.some((file) => file.endsWith('tailwindcss-oxide.wasi.cjs')),
-            candidates: scanner.scan(),
-          }),
-        )
-        process.exit()
-      `,
-    },
-  },
-  async ({ expect, exec }) => {
-    // Since vitest runs under `pnpm run`, pnpm's bin shims export a NODE_PATH
-    // that includes the repository's hidden hoist directory
-    // (`node_modules/.pnpm/node_modules`), which links every workspace package,
-    // including all native `@tailwindcss/oxide-*` bindings.
-    //
-    // Node uses `NODE_PATH` exactly when the local `node_modules` lookup fails,
-    // which would defeat the simulated unsupported platform, so clear it.
-    let output = await exec(`node index.mjs`, { env: { NODE_PATH: '' } })
-    let { native, wasi, candidates } = JSON.parse(output)
-
-    // No native binding was installed or loaded, ...
-    expect(native).toEqual([])
-
-    // ... the wasm32-wasi binding is what actually loaded, ...
-    expect(wasi).toBe(true)
-
-    // ... and scanning real files on disk works through it.
-    expect(candidates).toMatchInlineSnapshot(`
-      [
-        "className",
-        "const",
-        "content-['src/index.js']",
-        "exports",
-      ]
-    `)
-  },
-)
-
-testFn(
-  'the wasm build loads even when preopening the filesystem root is denied',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "@tailwindcss/oxide": "workspace:^"
-          }
-        }
-      `,
-      'pnpm-workspace.yaml': yaml`
-        # Trick pnpm in only supporting an architecture that @tailwindcss/oxide
-        # doesn't support, and therefore should fallback to the wasm version.
-        supportedArchitectures:
-          os:
-            - openbsd
-          cpu:
-            - x64
-      `,
-      // The wasm bindings generated by `@napi-rs/cli` preopen the filesystem
-      // root, which sandboxed platforms (e.g. OpenHarmony, Android) deny with
-      // `UVWASI_EACCES`, making the wasm fallback fail to load on exactly the
-      // platforms that need it.
-      //
-      // We patch `@napi-rs/cli`'s templates to retry with narrower preopens
-      // (see `patches/@napi-rs__cli@3.7.4.patch`). Simulate such a sandbox by
-      // denying `/` preopens.
-      'preload.cjs': js`
-        const wasi = require('node:wasi')
-        const RealWASI = wasi.WASI
-
-        wasi.WASI = class WASI extends RealWASI {
-          constructor(options) {
-            if (options?.preopens?.['/'] !== undefined) {
-              const error = new Error('UVWASI_EACCES, uvwasi_init')
-              error.code = 'UVWASI_EACCES'
-              error.syscall = 'uvwasi_init'
-              throw error
-            }
-            super(options)
-          }
-        }
-      `,
-      'src/index.js': js`
-        const className = "content-['src/index.js']"
-        module.exports = { className }
-      `,
-      'index.mjs': js`
-        import { createRequire } from 'node:module'
-        import { join } from 'node:path'
-
-        let require = createRequire(import.meta.url)
-        let { Scanner } = require('@tailwindcss/oxide')
-
-        let loaded = Object.keys(require.cache)
-
-        let scanner = new Scanner({
-          sources: [
-            {
-              base: join(process.cwd(), 'src'),
-              pattern: '**/*',
-              negated: false,
-            },
-          ],
-        })
-
-        console.log(
-          JSON.stringify({
-            wasi: loaded.some((file) => file.endsWith('tailwindcss-oxide.wasi.cjs')),
-            candidates: scanner.scan(),
-          }),
-        )
-        process.exit()
-      `,
-    },
-  },
-  async ({ expect, exec }) => {
-    // See the note about NODE_PATH in the test above.
-    let output = await exec(`node --require ./preload.cjs index.mjs`, { env: { NODE_PATH: '' } })
-
-    // Only parse the first line, because Node prints an `ExperimentalWarning`
-    // about WASI to stderr, which `exec` appends to the output.
-    let { wasi, candidates } = JSON.parse(output.trim().split('\n')[0])
-
-    // The wasm32-wasi binding loaded despite `/` being denied, ...
-    expect(wasi).toBe(true)
-
-    // ... and scanning files under the current working directory still works
-    // through the narrower preopen.
-    expect(candidates).toMatchInlineSnapshot(`
-      [
-        "className",
-        "const",
-        "content-['src/index.js']",
-        "exports",
-      ]
-    `)
-  },
-)
diff --git a/integrations/package.json b/integrations/package.json
index ae337b5e4..62f458c77 100644
--- a/integrations/package.json
+++ b/integrations/package.json
@@ -3,9 +3,7 @@
   "version": "0.0.0",
   "private": true,
   "devDependencies": {
-    "dedent": "catalog:",
-    "fast-glob": "^3.3.3",
-    "source-map-js": "^1.2.1",
-    "yaml": "^2.9.0"
+    "dedent": "1.5.3",
+    "fast-glob": "^3.3.3"
   }
 }
diff --git a/integrations/postcss/core-as-postcss-plugin.test.ts b/integrations/postcss/core-as-postcss-plugin.test.ts
index 839c80e7b..17545fea3 100644
--- a/integrations/postcss/core-as-postcss-plugin.test.ts
+++ b/integrations/postcss/core-as-postcss-plugin.test.ts
@@ -48,9 +48,9 @@ describe.each(Object.keys(variantConfig))('%s', (variant) => {
       },
     },
     async ({ exec, expect }) => {
-      await expect(
+      expect(
         exec('pnpm postcss src/index.css --output dist/out.css', undefined, { ignoreStdErr: true }),
-      ).rejects.toThrow(
+      ).rejects.toThrowError(
         `It looks like you're trying to use \`tailwindcss\` directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install \`@tailwindcss/postcss\` and update your PostCSS configuration.`,
       )
     },
diff --git a/integrations/postcss/index.test.ts b/integrations/postcss/index.test.ts
index 80025f945..524752b21 100644
--- a/integrations/postcss/index.test.ts
+++ b/integrations/postcss/index.test.ts
@@ -1,3 +1,4 @@
+import dedent from 'dedent'
 import path from 'node:path'
 import { candidate, css, html, js, json, test, ts, yaml } from '../utils'
 
@@ -637,193 +638,7 @@ test(
 )
 
 test(
-  'rebuild error recovery',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "devDependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^10",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.js': js`
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'src/index.html': html`
-        <div class="underline"></div>
-      `,
-      'src/index.css': css` @import './tailwind.css'; `,
-      'src/tailwind.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ fs, expect, spawn }) => {
-    // 1. Start the watcher
-    //
-    // It must have valid CSS for the initial build
-    let process = await spawn('pnpm postcss src/index.css --output dist/out.css --watch --verbose')
-
-    await process.onStderr((message) => message.includes('Waiting for file changes...'))
-
-    expect(await fs.dumpFiles('dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- dist/out.css ---
-      .underline {
-        text-decoration-line: underline;
-      }
-      "
-    `)
-
-    // 2. Cause an error
-    await fs.write(
-      'src/tailwind.css',
-      css`
-        @reference 'tailwindcss/does-not-exist';
-        @import 'tailwindcss/utilities';
-      `,
-    )
-
-    // 2.5 Write to a content file
-    await fs.write('src/index.html', html`
-      <div class="flex underline"></div>
-    `)
-
-    await process.onStderr((message) => message.includes('"./does-not-exist" is not exported'))
-
-    expect(await fs.dumpFiles('dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- dist/out.css ---
-      .underline {
-        text-decoration-line: underline;
-      }
-      "
-    `)
-
-    // 3. Fix the CSS file
-    await fs.write(
-      'src/tailwind.css',
-      css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    )
-
-    await process.onStderr((message) => message.includes('Waiting for file changes...'))
-
-    expect(await fs.dumpFiles('dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- dist/out.css ---
-      .flex {
-        display: flex;
-      }
-      .underline {
-        text-decoration-line: underline;
-      }
-      "
-    `)
-
-    // Now break the CSS file again
-    await fs.write(
-      'src/tailwind.css',
-      css`
-        @reference 'tailwindcss/does-not-exist';
-        @import 'tailwindcss/utilities';
-      `,
-    )
-
-    await process.onStderr((message) => message.includes('"./does-not-exist" is not exported'))
-
-    expect(await fs.dumpFiles('dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- dist/out.css ---
-      .flex {
-        display: flex;
-      }
-      .underline {
-        text-decoration-line: underline;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'dev mode + source maps',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^11",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.js': js`
-        module.exports = {
-          map: { inline: true },
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'src/index.html': html`
-        <div class="flex"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/utilities';
-        @source not inline("inline");
-        /*  */
-      `,
-    },
-  },
-  async ({ fs, exec, expect, parseSourceMap }) => {
-    await exec('pnpm postcss src/index.css --output dist/out.css')
-
-    await fs.expectFileToContain('dist/out.css', [candidate`flex`])
-
-    let map = parseSourceMap(await fs.read('dist/out.css'))
-
-    expect(map.at(1, 0)).toMatchObject({
-      source: '<no source>',
-      original: '(none)',
-      generated: '/*! tailwi...',
-    })
-
-    expect(map.at(2, 0)).toMatchObject({
-      source: expect.stringContaining('utilities.css'),
-      original: '@tailwind...',
-      generated: '.flex {...',
-    })
-
-    expect(map.at(3, 2)).toMatchObject({
-      source: expect.stringContaining('utilities.css'),
-      original: '@tailwind...',
-      generated: 'display: f...',
-    })
-
-    expect(map.at(4, 0)).toMatchObject({
-      source: expect.stringContaining('utilities.css'),
-      original: ';...',
-      generated: '}...',
-    })
-  },
-)
-
-test(
-  'source(…) and `@source` are relative to the file they are in',
+  'auto source detection kitchen sink',
   {
     fs: {
       'package.json': json`
@@ -836,7 +651,6 @@ test(
           }
         }
       `,
-
       'postcss.config.js': js`
         module.exports = {
           plugins: {
@@ -844,15 +658,170 @@ test(
           },
         }
       `,
+      'index.css': css`
+        @reference 'tailwindcss/theme';
 
-      'index.css': css` @import './project-a/src/index.css'; `,
+        /* (1) */
+        /* - Only './src' should be auto-scanned, not the current working directory */
+        /* - .gitignore'd paths should be ignored (node_modules) */
+        /* - Binary extensions should be ignored (jpg, zip) */
+        @import 'tailwindcss/utilities' source('./src');
 
+        /* (2) */
+        /* - All HTML and JSX files in 'ignored/components' should be scanned */
+        /* - All other extensions should be ignored */
+        @source "./ignored/components/*.{html,jsx}";
+
+        /* (3) */
+        /* - './components' should be auto-scanned in addition to './src' */
+        /* - './components/ignored.html' should still be ignored */
+        /* - Binary extensions in './components' should be ignored */
+        @source "./components";
+
+        /* (4) */
+        /* - './pages' should be auto-scanned */
+        /* - Only '.html' files should be included */
+        /* - './page/ignored.html' should be ignored */
+        @source "./pages/**/*.html";
+      `,
+
+      '.gitignore': dedent`
+        /src/ignored
+        /ignored
+        /components/ignored.html
+        /pages/ignored.html
+      `,
+
+      // (1)
+      'index.html': 'content-["index.html"] content-["BAD"]', // "Root" source is in `./src`
+      'src/index.html': 'content-["src/index.html"]',
+      'src/nested/index.html': 'content-["src/nested/index.html"]',
+      'src/index.jpg': 'content-["src/index.jpg"] content-["BAD"]',
+      'src/nested/index.tar': 'content-["src/nested/index.tar"] content-["BAD"]',
+      'src/ignored/index.html': 'content-["src/ignored/index.html"] content-["BAD"]',
+
+      // (2)
+      'ignored/components/my-component.html': 'content-["ignored/components/my-component.html"]',
+      'ignored/components/my-component.jsx': 'content-["ignored/components/my-component.jsx"]',
+
+      // Ignored and not explicitly listed by (2)
+      'ignored/components/my-component.tsx':
+        'content-["ignored/components/my-component.tsx"] content-["BAD"]',
+      'ignored/components/nested/my-component.html':
+        'content-["ignored/components/nested/my-component.html"] content-["BAD"]',
+
+      // (3)
+      'components/my-component.tsx': 'content-["components/my-component.tsx"]',
+      'components/nested/my-component.tsx': 'content-["components/nested/my-component.tsx"]',
+      'components/ignored.html': 'content-["components/ignored.html"] content-["BAD"]',
+
+      // (4)
+      'pages/foo.html': 'content-["pages/foo.html"]',
+      'pages/nested/foo.html': 'content-["pages/nested/foo.html"]',
+      'pages/ignored.html': 'content-["pages/ignored.html"] content-["BAD"]',
+      'pages/foo.jsx': 'content-["pages/foo.jsx"] content-["BAD"]',
+      'pages/nested/foo.jsx': 'content-["pages/nested/foo.jsx"] content-["BAD"]',
+    },
+  },
+  async ({ fs, exec, expect }) => {
+    await exec('pnpm postcss index.css --output dist/out.css')
+
+    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
+      "
+      --- ./dist/out.css ---
+      .content-\\[\\"components\\/my-component\\.tsx\\"\\] {
+        --tw-content: "components/my-component.tsx";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"components\\/nested\\/my-component\\.tsx\\"\\] {
+        --tw-content: "components/nested/my-component.tsx";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"ignored\\/components\\/my-component\\.html\\"\\] {
+        --tw-content: "ignored/components/my-component.html";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"ignored\\/components\\/my-component\\.jsx\\"\\] {
+        --tw-content: "ignored/components/my-component.jsx";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"pages\\/foo\\.html\\"\\] {
+        --tw-content: "pages/foo.html";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"pages\\/nested\\/foo\\.html\\"\\] {
+        --tw-content: "pages/nested/foo.html";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"src\\/index\\.html\\"\\] {
+        --tw-content: "src/index.html";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"src\\/nested\\/index\\.html\\"\\] {
+        --tw-content: "src/nested/index.html";
+        content: var(--tw-content);
+      }
+      @property --tw-content {
+        syntax: "*";
+        inherits: false;
+        initial-value: "";
+      }
+      "
+    `)
+  },
+)
+
+test(
+  'auto source detection in depth, source(…) and `@source` can be configured to use auto source detection (build + watch mode)',
+  {
+    fs: {
+      'package.json': json`{}`,
+      'pnpm-workspace.yaml': yaml`
+        #
+        packages:
+          - project-a
+      `,
+      'project-a/package.json': json`
+        {
+          "dependencies": {
+            "postcss": "^8",
+            "postcss-cli": "^10",
+            "tailwindcss": "workspace:^",
+            "@tailwindcss/postcss": "workspace:^"
+          }
+        }
+      `,
+      'project-a/postcss.config.js': js`
+        module.exports = {
+          plugins: {
+            '@tailwindcss/postcss': {},
+          },
+        }
+      `,
       'project-a/src/index.css': css`
+        @reference 'tailwindcss/theme';
+
         /* Run auto-content detection in ../../project-b */
         @import 'tailwindcss/utilities' source('../../project-b');
 
         /* Explicitly using node_modules in the @source allows git ignored folders */
+        @source '../node_modules/{my-lib-1,my-lib-2}/src/**/*.html';
+
+        /* We typically ignore these extensions, but now include them explicitly */
+        @source './logo.{jpg,png}';
+
+        /* Project C should apply auto source detection */
         @source '../../project-c';
+
+        /* Project D should apply auto source detection rules, such as ignoring node_modules */
+        @source '../../project-d/**/*.{html,js}';
+        @source '../../project-d/**/*.bin';
+
+        /* Same as above, but my-lib-2 _should_ be includes */
+        @source '../../project-d/node_modules/my-lib-2/src/*.{html,js}';
+
+        /* bar.html is git ignored, but explicitly listed here to scan */
+        @source '../../project-d/src/bar.html';
       `,
 
       // Project A is the current folder, but we explicitly configured
@@ -864,6 +833,27 @@ test(
         ></div>
       `,
 
+      // Project A explicitly includes an extension we usually ignore,
+      // therefore it should be included in the output.
+      'project-a/src/logo.jpg': html`
+        <div
+          class="content-['project-a/src/logo.jpg']"
+        ></div>
+      `,
+
+      // Project A explicitly includes node_modules/{my-lib-1,my-lib-2},
+      // therefore these files should be included in the output.
+      'project-a/node_modules/my-lib-1/src/index.html': html`
+        <div
+          class="content-['project-a/node_modules/my-lib-1/src/index.html']"
+        ></div>
+      `,
+      'project-a/node_modules/my-lib-2/src/index.html': html`
+        <div
+          class="content-['project-a/node_modules/my-lib-2/src/index.html']"
+        ></div>
+      `,
+
       // Project B is the configured `source(…)`, therefore auto source
       // detection should include known extensions and folders in the output.
       'project-b/src/index.html': html`
@@ -872,6 +862,15 @@ test(
         ></div>
       `,
 
+      // Project B is the configured `source(…)`, therefore auto source
+      // detection should apply and node_modules should not be included in the
+      // output.
+      'project-b/node_modules/my-lib-3/src/index.html': html`
+        <div
+          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-b/node_modules/my-lib-3/src/index.html']"
+        ></div>
+      `,
+
       // Project C should apply auto source detection, therefore known
       // extensions and folders should be included in the output.
       'project-c/src/index.html': html`
@@ -879,15 +878,347 @@ test(
           class="content-['project-c/src/index.html']"
         ></div>
       `,
+
+      // Project C should apply auto source detection, therefore known ignored
+      // extensions should not be included in the output.
+      'project-c/src/logo.jpg': html`
+        <div
+          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-c/src/logo.jpg']"
+        ></div>
+      `,
+
+      // Project C should apply auto source detection, therefore node_modules
+      // should not be included in the output.
+      'project-c/node_modules/my-lib-1/src/index.html': html`
+        <div
+          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-c/node_modules/my-lib-1/src/index.html']"
+        ></div>
+      `,
+
+      // Project D should apply auto source detection rules, such as ignoring
+      // node_modules.
+      'project-d/node_modules/my-lib-1/src/index.html': html`
+        <div
+          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-d/node_modules/my-lib-1/src/index.html']"
+        ></div>
+      `,
+
+      // Project D has an explicit glob containing node_modules, thus should include the html file
+      'project-d/node_modules/my-lib-2/src/index.html': html`
+        <div
+          class="content-['project-d/node_modules/my-lib-2/src/index.html']"
+        ></div>
+      `,
+
+      'project-d/src/.gitignore': dedent`
+        foo.html
+        bar.html
+      `,
+
+      // Project D, foo.html is ignored by the gitignore file.
+      'project-d/src/foo.html': html`
+        <div
+          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-d/src/foo.html']"
+        ></div>
+      `,
+
+      // Project D, bar.html is ignored by the gitignore file. But explicitly
+      // listed as a `@source` glob.
+      'project-d/src/bar.html': html`
+        <div
+          class="content-['project-d/src/bar.html']"
+        ></div>
+      `,
+
+      // Project D should look for files with the extensions html and js.
+      'project-d/src/index.html': html`
+        <div
+          class="content-['project-d/src/index.html']"
+        ></div>
+      `,
+
+      // Project D should have a binary file even though we ignore binary files
+      // by default, but it's explicitly listed.
+      'project-d/my-binary-file.bin': html`
+        <div
+          class="content-['project-d/my-binary-file.bin']"
+        ></div>
+      `,
     },
   },
-  async ({ fs, exec, root, expect }) => {
-    await exec('pnpm postcss ./index.css --output dist/out.css', { cwd: root })
+  async ({ fs, exec, spawn, root, expect }) => {
+    await exec('pnpm postcss src/index.css --output dist/out.css --verbose', {
+      cwd: path.join(root, 'project-a'),
+    })
 
-    let content = await fs.dumpFiles('./dist/*.css')
+    expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(`
+      "
+      --- ./project-a/dist/out.css ---
+      .content-\\[\\'project-a\\/node_modules\\/my-lib-1\\/src\\/index\\.html\\'\\] {
+        --tw-content: 'project-a/node modules/my-lib-1/src/index.html';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-a\\/node_modules\\/my-lib-2\\/src\\/index\\.html\\'\\] {
+        --tw-content: 'project-a/node modules/my-lib-2/src/index.html';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-a\\/src\\/logo\\.jpg\\'\\] {
+        --tw-content: 'project-a/src/logo.jpg';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-b\\/src\\/index\\.html\\'\\] {
+        --tw-content: 'project-b/src/index.html';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-c\\/src\\/index\\.html\\'\\] {
+        --tw-content: 'project-c/src/index.html';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-d\\/my-binary-file\\.bin\\'\\] {
+        --tw-content: 'project-d/my-binary-file.bin';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-d\\/node_modules\\/my-lib-2\\/src\\/index\\.html\\'\\] {
+        --tw-content: 'project-d/node modules/my-lib-2/src/index.html';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-d\\/src\\/bar\\.html\\'\\] {
+        --tw-content: 'project-d/src/bar.html';
+        content: var(--tw-content);
+      }
+      .content-\\[\\'project-d\\/src\\/index\\.html\\'\\] {
+        --tw-content: 'project-d/src/index.html';
+        content: var(--tw-content);
+      }
+      @property --tw-content {
+        syntax: "*";
+        inherits: false;
+        initial-value: "";
+      }
+      "
+    `)
 
-    expect(content).not.toContain(candidate`content-['project-a/src/index.html']`)
-    expect(content).toContain(candidate`content-['project-b/src/index.html']`)
-    expect(content).toContain(candidate`content-['project-c/src/index.html']`)
+    // Watch mode tests
+    let process = await spawn(
+      'pnpm postcss src/index.css --output dist/out.css --watch --verbose',
+      {
+        cwd: path.join(root, 'project-a'),
+      },
+    )
+    await process.onStderr((message) => message.includes('Waiting for file changes...'))
+
+    // Changes to project-a should not be included in the output, we changed the
+    // base folder to project-b.
+    await fs.write(
+      'project-a/src/index.html',
+      html`<div class="[.changed_&]:content-['project-a/src/index.html']"></div>`,
+    )
+    await fs.expectFileNotToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-a/src/index.html']`,
+    ])
+
+    // Changes to this file should be included, because we explicitly listed
+    // them using `@source`.
+    await fs.write(
+      'project-a/src/logo.jpg',
+      html`<div class="[.changed_&]:content-['project-a/src/logo.jpg']"></div>`,
+    )
+    await fs.expectFileToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-a/src/logo.jpg']`,
+    ])
+
+    // Changes to these files should be included, because we explicitly listed
+    // them using `@source`.
+    await fs.write(
+      'project-a/node_modules/my-lib-1/src/index.html',
+      html`<div
+          class="[.changed_&]:content-['project-a/node_modules/my-lib-1/src/index.html']"
+        ></div>`,
+    )
+    await fs.expectFileToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-a/node_modules/my-lib-1/src/index.html']`,
+    ])
+
+    await fs.write(
+      'project-a/node_modules/my-lib-2/src/index.html',
+      html`<div
+          class="[.changed_&]:content-['project-a/node_modules/my-lib-2/src/index.html']"
+        ></div>`,
+    )
+    await fs.expectFileToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-a/node_modules/my-lib-2/src/index.html']`,
+    ])
+
+    // Changes to this file should be included, because we changed the base to
+    // `project-b`.
+    await fs.write(
+      'project-b/src/index.html',
+      html`<div class="[.changed_&]:content-['project-b/src/index.html']"></div>`,
+    )
+    await fs.expectFileToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-b/src/index.html']`,
+    ])
+
+    // Changes to this file should not be included. We did change the base to
+    // `project-b`, but we still apply the auto source detection rules which
+    // ignore `node_modules`.
+    await fs.write(
+      'project-b/node_modules/my-lib-3/src/index.html',
+      html`<div
+          class="[.changed_&]:content-['project-b/node_modules/my-lib-3/src/index.html']"
+        ></div>`,
+    )
+    await fs.expectFileNotToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-b/node_modules/my-lib-3/src/index.html']`,
+    ])
+
+    // Project C was added explicitly via `@source`, therefore changes to these
+    // files should be included.
+    await fs.write(
+      'project-c/src/index.html',
+      html`<div class="[.changed_&]:content-['project-c/src/index.html']"></div>`,
+    )
+    await fs.expectFileToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-c/src/index.html']`,
+    ])
+
+    // Except for these files, since they are ignored by the default auto source
+    // detection rules.
+    await fs.write(
+      'project-c/src/logo.jpg',
+      html`<div class="[.changed_&]:content-['project-c/src/logo.jpg']"></div>`,
+    )
+    await fs.expectFileNotToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-c/src/logo.jpg']`,
+    ])
+    await fs.write(
+      'project-c/node_modules/my-lib-1/src/index.html',
+      html`<div
+          class="[.changed_&]:content-['project-c/node_modules/my-lib-1/src/index.html']"
+        ></div>`,
+    )
+    await fs.expectFileNotToContain('./project-a/dist/out.css', [
+      candidate`[.changed_&]:content-['project-c/node_modules/my-lib-1/src/index.html']`,
+    ])
+
+    // Creating new files in the "root" of auto source detected folders
+    // We need to create the files and *then* update them because postcss-cli
+    // does not pick up new files — only changes to existing files.
+    await fs.create([
+      'project-b/new-file.html',
+      'project-b/new-folder/new-file.html',
+      'project-c/new-file.html',
+      'project-c/new-folder/new-file.html',
+    ])
+
+    // If we don't wait writes will be coalesced into a "add" event which
+    // isn't picked up by postcss-cli.
+    await new Promise((resolve) => setTimeout(resolve, 100))
+
+    await fs.write(
+      'project-b/new-file.html',
+      html`<div class="[.created_&]:content-['project-b/new-file.html']"></div>`,
+    )
+    await fs.write(
+      'project-b/new-folder/new-file.html',
+      html`<div class="[.created_&]:content-['project-b/new-folder/new-file.html']"></div>`,
+    )
+    await fs.write(
+      'project-c/new-file.html',
+      html`<div class="[.created_&]:content-['project-c/new-file.html']"></div>`,
+    )
+    await fs.write(
+      'project-c/new-folder/new-file.html',
+      html`<div class="[.created_&]:content-['project-c/new-folder/new-file.html']"></div>`,
+    )
+
+    await fs.expectFileToContain('./project-a/dist/out.css', [
+      candidate`[.created_&]:content-['project-b/new-file.html']`,
+      candidate`[.created_&]:content-['project-b/new-folder/new-file.html']`,
+      candidate`[.created_&]:content-['project-c/new-file.html']`,
+      candidate`[.created_&]:content-['project-c/new-folder/new-file.html']`,
+    ])
+  },
+)
+
+test(
+  'auto source detection disabled',
+  {
+    fs: {
+      'package.json': json`
+        {
+          "dependencies": {
+            "postcss": "^8",
+            "postcss-cli": "^10",
+            "tailwindcss": "workspace:^",
+            "@tailwindcss/postcss": "workspace:^"
+          }
+        }
+      `,
+      'postcss.config.js': js`
+        module.exports = {
+          plugins: {
+            '@tailwindcss/postcss': {},
+          },
+        }
+      `,
+      'index.css': css`
+        @reference 'tailwindcss/theme';
+
+        /* (1) */
+        /* - Only './src' should be auto-scanned, not the current working directory */
+        /* - .gitignore'd paths should be ignored (node_modules) */
+        /* - Binary extensions should be ignored (jpg, zip) */
+        @import 'tailwindcss/utilities' source(none);
+
+        /* (2) */
+        /* - './pages' should be auto-scanned */
+        /* - Only '.html' files should be included */
+        /* - './page/ignored.html' should be ignored */
+        @source "./pages/**/*.html";
+      `,
+
+      '.gitignore': dedent`
+        /src/ignored
+        /pages/ignored.html
+      `,
+
+      // (1)
+      'index.html': 'content-["index.html"] content-["BAD"]', // "Root" source is in `./src`
+      'src/index.html': 'content-["src/index.html"] content-["BAD"]',
+      'src/nested/index.html': 'content-["src/nested/index.html"] content-["BAD"]',
+      'src/index.jpg': 'content-["src/index.jpg"] content-["BAD"]',
+      'src/nested/index.tar': 'content-["src/nested/index.tar"] content-["BAD"]',
+      'src/ignored/index.html': 'content-["src/ignored/index.html"] content-["BAD"]',
+
+      // (4)
+      'pages/foo.html': 'content-["pages/foo.html"]',
+      'pages/nested/foo.html': 'content-["pages/nested/foo.html"]',
+      'pages/ignored.html': 'content-["pages/ignored.html"] content-["BAD"]',
+      'pages/foo.jsx': 'content-["pages/foo.jsx"] content-["BAD"]',
+      'pages/nested/foo.jsx': 'content-["pages/nested/foo.jsx"] content-["BAD"]',
+    },
+  },
+  async ({ fs, exec, expect }) => {
+    await exec('pnpm postcss index.css --output dist/out.css')
+
+    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
+      "
+      --- ./dist/out.css ---
+      .content-\\[\\"pages\\/foo\\.html\\"\\] {
+        --tw-content: "pages/foo.html";
+        content: var(--tw-content);
+      }
+      .content-\\[\\"pages\\/nested\\/foo\\.html\\"\\] {
+        --tw-content: "pages/nested/foo.html";
+        content: var(--tw-content);
+      }
+      @property --tw-content {
+        syntax: "*";
+        inherits: false;
+        initial-value: "";
+      }
+      "
+    `)
   },
 )
diff --git a/integrations/postcss/next.test.ts b/integrations/postcss/next.test.ts
index 7fc0ccdcf..a6fb26f8e 100644
--- a/integrations/postcss/next.test.ts
+++ b/integrations/postcss/next.test.ts
@@ -1,5 +1,5 @@
 import { describe } from 'vitest'
-import { candidate, css, fetchStyles, js, json, jsx, retryAssertion, test, txt } from '../utils'
+import { candidate, css, fetchStyles, js, json, retryAssertion, test } from '../utils'
 
 test(
   'production build',
@@ -48,7 +48,7 @@ test(
       'app/page.module.css': css`
         @reference './globals.css';
         .heading {
-          @apply text-red-500 animate-ping skew-7;
+          @apply text-red-500 animate-ping;
         }
       `,
       'app/globals.css': css`
@@ -77,10 +77,9 @@ test(
     ])
 
     await fs.expectFileToContain(moduleCss!, [
-      'color:var(--color-red-500,oklch(63.7% .237 25.331)',
+      'color:var(--color-red-500,oklch(.637 .237 25.331)',
       'animation:var(--animate-ping,ping 1s cubic-bezier(0,0,.2,1) infinite)',
       /@keyframes page_ping.*{75%,to{transform:scale\(2\);opacity:0}/,
-      '--tw-skew-x:skewX(7deg);',
     ])
   },
 )
@@ -131,7 +130,7 @@ describe.each(['turbo', 'webpack'])('%s', (bundler) => {
         'app/page.module.css': css`
           @reference './globals.css';
           .heading {
-            @apply text-red-500 animate-ping skew-7 content-['module'];
+            @apply text-red-500 animate-ping content-['module'];
           }
         `,
         'app/globals.css': css`
@@ -174,7 +173,6 @@ describe.each(['turbo', 'webpack'])('%s', (bundler) => {
         let css = await fetchStyles(url)
         expect(css).toContain(candidate`underline`)
         expect(css).toContain(candidate`bg-red-500`)
-        expect(css).toContain('--tw-skew-x: skewX(7deg);')
         expect(css).toContain('content: var(--tw-content)')
         expect(css).toContain('@keyframes')
       })
@@ -259,228 +257,3 @@ test(
     ])
   },
 )
-
-test(
-  'changes to CSS files should pick up new CSS variables (if any)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "react": "^18",
-            "react-dom": "^18",
-            "next": "^14"
-          },
-          "devDependencies": {
-            "@tailwindcss/postcss": "workspace:^",
-            "tailwindcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.mjs': js`
-        export default {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'next.config.mjs': js`export default {}`,
-      'app/layout.js': js`
-        import './globals.css'
-
-        export default function RootLayout({ children }) {
-          return (
-            <html>
-              <body>{children}</body>
-            </html>
-          )
-        }
-      `,
-      'app/page.js': js`
-        export default function Page() {
-          return <div className="flex"></div>
-        }
-      `,
-      'unrelated.module.css': css`
-        .module {
-          color: var(--color-blue-500);
-        }
-      `,
-      'app/globals.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ spawn, exec, fs, expect }) => {
-    // Generate the initial build so output CSS files exist on disk
-    await exec('pnpm next build')
-
-    // NOTE: We are writing to an output CSS file which is not being ignored by
-    // `.gitignore` nor marked with `@source not`. This should not result in an
-    // infinite loop.
-    let process = await spawn(`pnpm next dev`)
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)/.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await process.onStdout((m) => m.includes('Ready in'))
-
-    await retryAssertion(async () => {
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`flex`)
-      expect(css).toContain('--color-blue-500:')
-      expect(css).not.toContain('--color-red-500:')
-    })
-
-    await fs.write(
-      'unrelated.module.css',
-      css`
-        .module {
-          color: var(--color-blue-500);
-          background-color: var(--color-red-500);
-        }
-      `,
-    )
-    await process.onStdout((m) => m.includes('Compiled in'))
-
-    await retryAssertion(async () => {
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`flex`)
-      expect(css).toContain('--color-blue-500:')
-      expect(css).toContain('--color-red-500:')
-    })
-  },
-)
-
-test(
-  'changes to `public/` should not trigger an infinite loop',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "react": "^18",
-            "react-dom": "^18",
-            "next": "^15",
-            "@ducanh2912/next-pwa": "^10.2.9"
-          },
-          "devDependencies": {
-            "@tailwindcss/postcss": "workspace:^",
-            "tailwindcss": "workspace:^"
-          }
-        }
-      `,
-      '.gitignore': txt`
-        .next/
-        public/workbox-*.js
-        public/sw.js
-      `,
-      'postcss.config.mjs': js`
-        export default {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'next.config.mjs': js`
-        import withPWA from '@ducanh2912/next-pwa'
-
-        const pwaConfig = {
-          dest: 'public',
-          register: true,
-          skipWaiting: true,
-          reloadOnOnline: false,
-          cleanupOutdatedCaches: true,
-          clientsClaim: true,
-          maximumFileSizeToCacheInBytes: 20 * 1024 * 1024,
-        }
-
-        const nextConfig = {}
-
-        const configWithPWA = withPWA(pwaConfig)(nextConfig)
-
-        export default configWithPWA
-      `,
-      'app/layout.js': js`
-        import './globals.css'
-
-        export default function RootLayout({ children }) {
-          return (
-            <html>
-              <body>{children}</body>
-            </html>
-          )
-        }
-      `,
-      'app/page.js': js`
-        export default function Page() {
-          return <div className="flex"></div>
-        }
-      `,
-      'app/globals.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ spawn, fs, expect }) => {
-    let process = await spawn('pnpm next dev')
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)/.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await process.onStdout((m) => m.includes('Ready in'))
-
-    await retryAssertion(async () => {
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`flex`)
-      expect(css).not.toContain(candidate`underline`)
-    })
-
-    await fs.write(
-      'app/page.js',
-      jsx`
-        export default function Page() {
-          return <div className="flex underline"></div>
-        }
-      `,
-    )
-    await process.onStdout((m) => m.includes('Compiled in'))
-
-    await retryAssertion(async () => {
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`flex`)
-      expect(css).toContain(candidate`underline`)
-    })
-    // Flush all existing messages in the queue
-    process.flush()
-
-    // Fetch the styles one more time, to ensure we see the latest version of
-    // the CSS
-    await fetchStyles(url)
-
-    // At this point, no changes should trigger a compile step. If we see any
-    // changes, there is an infinite loop because we (the user) didn't write any
-    // files to disk.
-    //
-    // Ensure there are no more changes in stdout (signaling no infinite loop)
-    let result = await Promise.race([
-      // If this succeeds, it means that it saw another change which indicates
-      // an infinite loop.
-      process.onStdout((m) => m.includes('Compiled in')).then(() => 'infinite loop detected'),
-
-      // There should be no changes in stdout
-      new Promise((resolve) => setTimeout(() => resolve('no infinite loop detected'), 2_000)),
-    ])
-    expect(result).toBe('no infinite loop detected')
-  },
-)
diff --git a/integrations/postcss/source.test.ts b/integrations/postcss/source.test.ts
deleted file mode 100644
index e89d4bbdd..000000000
--- a/integrations/postcss/source.test.ts
+++ /dev/null
@@ -1,831 +0,0 @@
-import dedent from 'dedent'
-import path from 'node:path'
-import { candidate, css, html, js, json, test, yaml } from '../utils'
-
-test(
-  'auto source detection kitchen sink',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^10",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.js': js`
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'index.css': css`
-        @reference 'tailwindcss/theme';
-
-        /* (1) */
-        /* - Only './src' should be auto-scanned, not the current working directory */
-        /* - .gitignore'd paths should be ignored (node_modules) */
-        /* - Binary extensions should be ignored (jpg, zip) */
-        @import 'tailwindcss/utilities' source('./src');
-
-        /* (2) */
-        /* - All HTML and JSX files in 'ignored/components' should be scanned */
-        /* - All other extensions should be ignored */
-        @source "./ignored/components/*.{html,jsx}";
-
-        /* (3) */
-        /* - './components' should be auto-scanned in addition to './src' */
-        /* - './components/ignored.html' should still be ignored */
-        /* - Binary extensions in './components' should be ignored */
-        @source "./components";
-
-        /* (4) */
-        /* - './pages' should be auto-scanned */
-        /* - Only '.html' files should be included */
-        /* - './page/ignored.html' will not be ignored because of the specific pattern */
-        @source "./pages/**/*.html";
-      `,
-
-      '.gitignore': dedent`
-        /src/ignored
-        /ignored
-        /components/ignored.html
-        /pages/ignored.html
-      `,
-
-      // (1)
-      'index.html': 'content-["index.html"] content-["BAD"]', // "Root" source is in `./src`
-      'src/index.html': 'content-["src/index.html"]',
-      'src/nested/index.html': 'content-["src/nested/index.html"]',
-      'src/index.jpg': 'content-["src/index.jpg"] content-["BAD"]',
-      'src/nested/index.tar': 'content-["src/nested/index.tar"] content-["BAD"]',
-      'src/ignored/index.html': 'content-["src/ignored/index.html"] content-["BAD"]',
-
-      // (2)
-      'ignored/components/my-component.html': 'content-["ignored/components/my-component.html"]',
-      'ignored/components/my-component.jsx': 'content-["ignored/components/my-component.jsx"]',
-
-      // Ignored and not explicitly listed by (2)
-      'ignored/components/my-component.tsx':
-        'content-["ignored/components/my-component.tsx"] content-["BAD"]',
-      'ignored/components/nested/my-component.html':
-        'content-["ignored/components/nested/my-component.html"] content-["BAD"]',
-
-      // (3)
-      'components/my-component.tsx': 'content-["components/my-component.tsx"]',
-      'components/nested/my-component.tsx': 'content-["components/nested/my-component.tsx"]',
-      'components/ignored.html': 'content-["components/ignored.html"] content-["BAD"]',
-
-      // (4)
-      'pages/foo.html': 'content-["pages/foo.html"]',
-      'pages/nested/foo.html': 'content-["pages/nested/foo.html"]',
-      'pages/ignored.html': 'content-["pages/ignored.html"]',
-      'pages/foo.jsx': 'content-["pages/foo.jsx"] content-["BAD"]',
-      'pages/nested/foo.jsx': 'content-["pages/nested/foo.jsx"] content-["BAD"]',
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm postcss index.css --output dist/out.css')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/out.css ---
-      @layer properties;
-      .content-\\[\\"components\\/my-component\\.tsx\\"\\] {
-        --tw-content: "components/my-component.tsx";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"components\\/nested\\/my-component\\.tsx\\"\\] {
-        --tw-content: "components/nested/my-component.tsx";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"ignored\\/components\\/my-component\\.html\\"\\] {
-        --tw-content: "ignored/components/my-component.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"ignored\\/components\\/my-component\\.jsx\\"\\] {
-        --tw-content: "ignored/components/my-component.jsx";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"pages\\/foo\\.html\\"\\] {
-        --tw-content: "pages/foo.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"pages\\/ignored\\.html\\"\\] {
-        --tw-content: "pages/ignored.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"pages\\/nested\\/foo\\.html\\"\\] {
-        --tw-content: "pages/nested/foo.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"src\\/index\\.html\\"\\] {
-        --tw-content: "src/index.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"src\\/nested\\/index\\.html\\"\\] {
-        --tw-content: "src/nested/index.html";
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'auto source detection in depth, source(…) and `@source` can be configured to use auto source detection (build + watch mode)',
-  {
-    fs: {
-      'package.json': json`{}`,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - project-a
-      `,
-      'project-a/package.json': json`
-        {
-          "dependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^10",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'project-a/postcss.config.js': js`
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'project-a/src/index.css': css`
-        @reference 'tailwindcss/theme';
-
-        /* Run auto-content detection in ../../project-b */
-        @import 'tailwindcss/utilities' source('../../project-b');
-
-        /* Explicitly using node_modules in the @source allows git ignored folders */
-        @source '../node_modules/{my-lib-1,my-lib-2}/src/**/*.html';
-
-        /* We typically ignore these extensions, but now include them explicitly */
-        @source './logo.{jpg,png}';
-
-        /* Project C should apply auto source detection */
-        @source '../../project-c';
-
-        /* Project D should apply auto source detection rules, such as ignoring node_modules */
-        @source '../../project-d/**/*.{html,js}';
-        @source '../../project-d/**/*.bin';
-
-        /* Same as above, but my-lib-2 _should_ be includes */
-        @source '../../project-d/node_modules/my-lib-2/src/*.{html,js}';
-
-        /* bar.html is git ignored, but explicitly listed here to scan */
-        @source '../../project-d/src/bar.html';
-      `,
-
-      // Project A is the current folder, but we explicitly configured
-      // `source(project-b)`, therefore project-a should not be included in
-      // the output.
-      'project-a/src/index.html': html`
-        <div
-          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-a/src/index.html']"
-        ></div>
-      `,
-
-      // Project A explicitly includes an extension we usually ignore,
-      // therefore it should be included in the output.
-      'project-a/src/logo.jpg': html`
-        <div
-          class="content-['project-a/src/logo.jpg']"
-        ></div>
-      `,
-
-      // Project A explicitly includes node_modules/{my-lib-1,my-lib-2},
-      // therefore these files should be included in the output.
-      'project-a/node_modules/my-lib-1/src/index.html': html`
-        <div
-          class="content-['project-a/node_modules/my-lib-1/src/index.html']"
-        ></div>
-      `,
-      'project-a/node_modules/my-lib-2/src/index.html': html`
-        <div
-          class="content-['project-a/node_modules/my-lib-2/src/index.html']"
-        ></div>
-      `,
-
-      // Project B is the configured `source(…)`, therefore auto source
-      // detection should include known extensions and folders in the output.
-      'project-b/src/index.html': html`
-        <div
-          class="content-['project-b/src/index.html']"
-        ></div>
-      `,
-
-      // Project B is the configured `source(…)`, therefore auto source
-      // detection should apply and node_modules should not be included in the
-      // output.
-      'project-b/node_modules/my-lib-3/src/index.html': html`
-        <div
-          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-b/node_modules/my-lib-3/src/index.html']"
-        ></div>
-      `,
-
-      // Project C should apply auto source detection, therefore known
-      // extensions and folders should be included in the output.
-      'project-c/src/index.html': html`
-        <div
-          class="content-['project-c/src/index.html']"
-        ></div>
-      `,
-
-      // Project C should apply auto source detection, therefore known ignored
-      // extensions should not be included in the output.
-      'project-c/src/logo.jpg': html`
-        <div
-          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-c/src/logo.jpg']"
-        ></div>
-      `,
-
-      // Project C should apply auto source detection, therefore node_modules
-      // should not be included in the output.
-      'project-c/node_modules/my-lib-1/src/index.html': html`
-        <div
-          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-c/node_modules/my-lib-1/src/index.html']"
-        ></div>
-      `,
-
-      // Project D should apply auto source detection rules, such as ignoring
-      // node_modules.
-      'project-d/node_modules/my-lib-1/src/index.html': html`
-        <div
-          class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-d/node_modules/my-lib-1/src/index.html']"
-        ></div>
-      `,
-
-      // Project D has an explicit glob containing node_modules, thus should include the html file
-      'project-d/node_modules/my-lib-2/src/index.html': html`
-        <div
-          class="content-['project-d/node_modules/my-lib-2/src/index.html']"
-        ></div>
-      `,
-
-      'project-d/src/.gitignore': dedent`
-        foo.html
-        bar.html
-      `,
-
-      // Project D, foo.html is ignored by the gitignore file but the source rule is explicit about
-      // adding all `.html` files.
-      'project-d/src/foo.html': html`
-        <div
-          class="content-['project-d/src/foo.html']"
-        ></div>
-      `,
-
-      // Project D, bar.html is ignored by the gitignore file. But explicitly
-      // listed as a `@source` glob.
-      'project-d/src/bar.html': html`
-        <div
-          class="content-['project-d/src/bar.html']"
-        ></div>
-      `,
-
-      // Project D should look for files with the extensions html and js.
-      'project-d/src/index.html': html`
-        <div
-          class="content-['project-d/src/index.html']"
-        ></div>
-      `,
-
-      // Project D should have a binary file even though we ignore binary files
-      // by default, but it's explicitly listed.
-      'project-d/my-binary-file.bin': html`
-        <div
-          class="content-['project-d/my-binary-file.bin']"
-        ></div>
-      `,
-    },
-  },
-  async ({ fs, exec, spawn, root, expect }) => {
-    await exec('pnpm postcss src/index.css --output dist/out.css --verbose', {
-      cwd: path.join(root, 'project-a'),
-    })
-
-    expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./project-a/dist/out.css ---
-      @layer properties;
-      .content-\\[\\'project-a\\/node_modules\\/my-lib-1\\/src\\/index\\.html\\'\\] {
-        --tw-content: 'project-a/node modules/my-lib-1/src/index.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-a\\/node_modules\\/my-lib-2\\/src\\/index\\.html\\'\\] {
-        --tw-content: 'project-a/node modules/my-lib-2/src/index.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-a\\/src\\/logo\\.jpg\\'\\] {
-        --tw-content: 'project-a/src/logo.jpg';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-b\\/src\\/index\\.html\\'\\] {
-        --tw-content: 'project-b/src/index.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-c\\/src\\/index\\.html\\'\\] {
-        --tw-content: 'project-c/src/index.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-d\\/my-binary-file\\.bin\\'\\] {
-        --tw-content: 'project-d/my-binary-file.bin';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-d\\/node_modules\\/my-lib-2\\/src\\/index\\.html\\'\\] {
-        --tw-content: 'project-d/node modules/my-lib-2/src/index.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-d\\/src\\/bar\\.html\\'\\] {
-        --tw-content: 'project-d/src/bar.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-d\\/src\\/foo\\.html\\'\\] {
-        --tw-content: 'project-d/src/foo.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-d\\/src\\/index\\.html\\'\\] {
-        --tw-content: 'project-d/src/index.html';
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-
-    // Watch mode tests
-    let process = await spawn(
-      'pnpm postcss src/index.css --output dist/out.css --watch --verbose',
-      {
-        cwd: path.join(root, 'project-a'),
-      },
-    )
-    await process.onStderr((message) => message.includes('Waiting for file changes...'))
-
-    // Changes to project-a should not be included in the output, we changed the
-    // base folder to project-b.
-    await fs.write(
-      'project-a/src/index.html',
-      html`<div class="[.changed_&]:content-['project-a/src/index.html']"></div>`,
-    )
-    await fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-a/src/index.html']`,
-    ])
-
-    // Changes to this file should be included, because we explicitly listed
-    // them using `@source`.
-    await fs.write(
-      'project-a/src/logo.jpg',
-      html`<div class="[.changed_&]:content-['project-a/src/logo.jpg']"></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-a/src/logo.jpg']`,
-    ])
-
-    // Changes to these files should be included, because we explicitly listed
-    // them using `@source`.
-    await fs.write(
-      'project-a/node_modules/my-lib-1/src/index.html',
-      html`<div
-          class="[.changed_&]:content-['project-a/node_modules/my-lib-1/src/index.html']"
-        ></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-a/node_modules/my-lib-1/src/index.html']`,
-    ])
-
-    await fs.write(
-      'project-a/node_modules/my-lib-2/src/index.html',
-      html`<div
-          class="[.changed_&]:content-['project-a/node_modules/my-lib-2/src/index.html']"
-        ></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-a/node_modules/my-lib-2/src/index.html']`,
-    ])
-
-    // Changes to this file should be included, because we changed the base to
-    // `project-b`.
-    await fs.write(
-      'project-b/src/index.html',
-      html`<div class="[.changed_&]:content-['project-b/src/index.html']"></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-b/src/index.html']`,
-    ])
-
-    // Changes to this file should not be included. We did change the base to
-    // `project-b`, but we still apply the auto source detection rules which
-    // ignore `node_modules`.
-    await fs.write(
-      'project-b/node_modules/my-lib-3/src/index.html',
-      html`<div
-          class="[.changed_&]:content-['project-b/node_modules/my-lib-3/src/index.html']"
-        ></div>`,
-    )
-    await fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-b/node_modules/my-lib-3/src/index.html']`,
-    ])
-
-    // Project C was added explicitly via `@source`, therefore changes to these
-    // files should be included.
-    await fs.write(
-      'project-c/src/index.html',
-      html`<div class="[.changed_&]:content-['project-c/src/index.html']"></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-c/src/index.html']`,
-    ])
-
-    // Except for these files, since they are ignored by the default auto source
-    // detection rules.
-    await fs.write(
-      'project-c/src/logo.jpg',
-      html`<div class="[.changed_&]:content-['project-c/src/logo.jpg']"></div>`,
-    )
-    await fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-c/src/logo.jpg']`,
-    ])
-    await fs.write(
-      'project-c/node_modules/my-lib-1/src/index.html',
-      html`<div
-          class="[.changed_&]:content-['project-c/node_modules/my-lib-1/src/index.html']"
-        ></div>`,
-    )
-    await fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-c/node_modules/my-lib-1/src/index.html']`,
-    ])
-
-    // Creating new files in the "root" of auto source detected folders
-    // We need to create the files and *then* update them because postcss-cli
-    // does not pick up new files — only changes to existing files.
-    await fs.create([
-      'project-b/new-file.html',
-      'project-b/new-folder/new-file.html',
-      'project-c/new-file.html',
-      'project-c/new-folder/new-file.html',
-    ])
-
-    // If we don't wait writes will be coalesced into a "add" event which
-    // isn't picked up by postcss-cli.
-    await new Promise((resolve) => setTimeout(resolve, 100))
-
-    await fs.write(
-      'project-b/new-file.html',
-      html`<div class="[.created_&]:content-['project-b/new-file.html']"></div>`,
-    )
-    await fs.write(
-      'project-b/new-folder/new-file.html',
-      html`<div class="[.created_&]:content-['project-b/new-folder/new-file.html']"></div>`,
-    )
-    await fs.write(
-      'project-c/new-file.html',
-      html`<div class="[.created_&]:content-['project-c/new-file.html']"></div>`,
-    )
-    await fs.write(
-      'project-c/new-folder/new-file.html',
-      html`<div class="[.created_&]:content-['project-c/new-folder/new-file.html']"></div>`,
-    )
-
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.created_&]:content-['project-b/new-file.html']`,
-      candidate`[.created_&]:content-['project-b/new-folder/new-file.html']`,
-      candidate`[.created_&]:content-['project-c/new-file.html']`,
-      candidate`[.created_&]:content-['project-c/new-folder/new-file.html']`,
-    ])
-  },
-)
-
-test(
-  'auto source detection disabled',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^10",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.js': js`
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'index.css': css`
-        @reference 'tailwindcss/theme';
-
-        /* (1) */
-        /* - Only './src' should be auto-scanned, not the current working directory */
-        /* - .gitignore'd paths should be ignored (node_modules) */
-        /* - Binary extensions should be ignored (jpg, zip) */
-        @import 'tailwindcss/utilities' source(none);
-
-        /* (2) */
-        /* - './pages' should be auto-scanned */
-        /* - Only '.html' files should be included */
-        /* - './page/ignored.html' will not be ignored because of the specific pattern */
-        @source "./pages/**/*.html";
-      `,
-
-      '.gitignore': dedent`
-        /src/ignored
-        /pages/ignored.html
-      `,
-
-      // (1)
-      'index.html': 'content-["index.html"] content-["BAD"]', // "Root" source is in `./src`
-      'src/index.html': 'content-["src/index.html"] content-["BAD"]',
-      'src/nested/index.html': 'content-["src/nested/index.html"] content-["BAD"]',
-      'src/index.jpg': 'content-["src/index.jpg"] content-["BAD"]',
-      'src/nested/index.tar': 'content-["src/nested/index.tar"] content-["BAD"]',
-      'src/ignored/index.html': 'content-["src/ignored/index.html"] content-["BAD"]',
-
-      // (4)
-      'pages/foo.html': 'content-["pages/foo.html"]',
-      'pages/nested/foo.html': 'content-["pages/nested/foo.html"]',
-      'pages/ignored.html': 'content-["pages/ignored.html"]',
-      'pages/foo.jsx': 'content-["pages/foo.jsx"] content-["BAD"]',
-      'pages/nested/foo.jsx': 'content-["pages/nested/foo.jsx"] content-["BAD"]',
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm postcss index.css --output dist/out.css')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/out.css ---
-      @layer properties;
-      .content-\\[\\"pages\\/foo\\.html\\"\\] {
-        --tw-content: "pages/foo.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"pages\\/ignored\\.html\\"\\] {
-        --tw-content: "pages/ignored.html";
-        content: var(--tw-content);
-      }
-      .content-\\[\\"pages\\/nested\\/foo\\.html\\"\\] {
-        --tw-content: "pages/nested/foo.html";
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '`@source not "…"`',
-  {
-    fs: {
-      'package.json': json`{}`,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - project-a
-      `,
-      'project-a/package.json': json`
-        {
-          "dependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^10",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'project-a/postcss.config.js': js`
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'project-a/src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-
-        /* Ignore a specific file */
-        @source not "./ignore-me-file.html";
-
-        /* Ignore a entire folder */
-        @source not "./ignore-me-folder";
-
-        /* Ignore an extension */
-        @source not "**/*.ts";
-
-        /* Explicit source detection for 'project-b' */
-        @source "../../project-b/**/*.html";
-
-        /* Explicitly ignoring a file in 'project-b' */
-        @source not "../../project-b/src/ignore-me.html";
-      `,
-      'project-a/src/ignore-me-file.html': html`
-        <div>
-          <div class="content-['project-a/src/ignore-me-file.html']"></div>
-        </div>
-      `,
-      'project-a/src/ignore-me-folder/index.html': html`
-        <div>
-          <div class="content-['project-a/src/ignore-me-folder/index.html']"></div>
-        </div>
-      `,
-      'project-a/src/keep-me.html': html`<div class="content-['keep-me.html']"></div>`,
-      'project-a/src/ignore-me-extension.ts': html`
-        <div>
-          <div class="content-['ignore-me-extension.ts']"></div>
-        </div>
-      `,
-      'project-b/src/ignore-me.html': html`
-        <div>
-          <div class="content-['project-b/src/ignore-me.html']"></div>
-        </div>
-      `,
-      'project-b/src/keep-me.html': html`
-        <div>
-          <div class="content-['project-b/src/keep-me.html']"></div>
-        </div>
-      `,
-    },
-  },
-  async ({ fs, exec, spawn, root, expect }) => {
-    await exec('pnpm postcss src/index.css --output dist/out.css --verbose', {
-      cwd: path.join(root, 'project-a'),
-    })
-
-    expect(await fs.dumpFiles('./project-a/dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./project-a/dist/out.css ---
-      @layer properties;
-      .content-\\[\\'keep-me\\.html\\'\\] {
-        --tw-content: 'keep-me.html';
-        content: var(--tw-content);
-      }
-      .content-\\[\\'project-b\\/src\\/keep-me\\.html\\'\\] {
-        --tw-content: 'project-b/src/keep-me.html';
-        content: var(--tw-content);
-      }
-      @property --tw-content {
-        syntax: "*";
-        inherits: false;
-        initial-value: "";
-      }
-      @layer properties {
-        @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
-          *, ::before, ::after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-      "
-    `)
-
-    // Watch mode tests
-    let process = await spawn(
-      'pnpm postcss src/index.css --output dist/out.css --watch --verbose',
-      {
-        cwd: path.join(root, 'project-a'),
-      },
-    )
-    await process.onStderr((message) => message.includes('Waiting for file changes...'))
-
-    fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`content-['project-a/src/ignore-me-file.html']`,
-      candidate`content-['project-a/src/ignore-me-folder/index.html']`,
-      candidate`content-['project-b/src/ignore-me.html']`,
-    ])
-
-    // Changes to the keep-me files should be included
-    await fs.write(
-      'project-a/src/keep-me.html',
-      html`<div class="[.changed_&]:content-['project-a/src/keep-me.html']"></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-a/src/keep-me.html']`,
-    ])
-
-    await fs.write(
-      'project-b/src/keep-me.html',
-      html`<div class="[.changed_&]:content-['project-b/src/keep-me.html']"></div>`,
-    )
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-b/src/keep-me.html']`,
-    ])
-
-    // Changes to the ignored files should not be included
-    await fs.write(
-      'project-a/src/ignore-me.html',
-      html`<div class="[.changed_&]:content-['project-a/src/ignore-me.html']"></div>`,
-    )
-    await fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-a/src/ignore-me.html']`,
-    ])
-
-    await fs.write(
-      'project-b/src/ignore-me.html',
-      html`<div class="[.changed_&]:content-['project-b/src/ignore-me.html']"></div>`,
-    )
-    await fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`[.changed_&]:content-['project-b/src/ignore-me.html']`,
-    ])
-
-    fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`content-['project-a/src/ignore-me-file.html']`,
-      candidate`content-['project-a/src/ignore-me-folder/index.html']`,
-      candidate`content-['project-b/src/ignore-me.html']`,
-    ])
-
-    // Creating new files that match the source patterns should be included.
-    await fs.create([
-      'project-a/src/new-file.html',
-      'project-a/src/new-folder/new-file.html',
-      'project-b/src/new-file.html',
-      'project-b/src/new-folder/new-file.html',
-    ])
-
-    await fs.write(
-      'project-a/src/new-file.html',
-      html`<div class="[.created_&]:content-['project-a/src/new-file.html']"></div>`,
-    )
-    await fs.write(
-      'project-a/src/new-folder/new-file.html',
-      html`<div class="[.created_&]:content-['project-a/src/new-folder/new-file.html']"></div>`,
-    )
-    await fs.write(
-      'project-b/src/new-file.html',
-      html`<div class="[.created_&]:content-['project-b/src/new-file.html']"></div>`,
-    )
-    await fs.write(
-      'project-b/src/new-folder/new-file.html',
-      html`<div class="[.created_&]:content-['project-b/src/new-folder/new-file.html']"></div>`,
-    )
-
-    // If we don't wait writes will be coalesced into a "add" event which
-    // isn't picked up by postcss-cli.
-    await new Promise((resolve) => setTimeout(resolve, 100))
-
-    await fs.expectFileToContain('./project-a/dist/out.css', [
-      candidate`[.created_&]:content-['project-a/src/new-file.html']`,
-      candidate`[.created_&]:content-['project-a/src/new-folder/new-file.html']`,
-      candidate`[.created_&]:content-['project-b/src/new-file.html']`,
-      candidate`[.created_&]:content-['project-b/src/new-folder/new-file.html']`,
-    ])
-
-    fs.expectFileNotToContain('./project-a/dist/out.css', [
-      candidate`content-['project-a/src/ignore-me-file.html']`,
-      candidate`content-['project-a/src/ignore-me-folder/index.html']`,
-      candidate`content-['project-b/src/ignore-me.html']`,
-    ])
-  },
-)
diff --git a/integrations/postcss/url-rewriting.test.ts b/integrations/postcss/url-rewriting.test.ts
index bac9d95d5..b07632583 100644
--- a/integrations/postcss/url-rewriting.test.ts
+++ b/integrations/postcss/url-rewriting.test.ts
@@ -72,78 +72,3 @@ test(
     `)
   },
 )
-
-test(
-  'url rewriting can be disabled',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "postcss": "^8",
-            "postcss-cli": "^10",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.js': js`
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {
-              transformAssetUrls: false,
-            },
-          },
-        }
-      `,
-      'src/index.css': css`
-        @reference 'tailwindcss';
-        @import './dir-1/bar.css';
-        @import './dir-1/dir-2/baz.css';
-        @import './dir-1/dir-2/vector.css';
-      `,
-      'src/dir-1/bar.css': css`
-        .test1 {
-          background-image: url('../../resources/image.png');
-        }
-      `,
-      'src/dir-1/dir-2/baz.css': css`
-        .test2 {
-          background-image: url('../../../resources/image.png');
-        }
-      `,
-      'src/dir-1/dir-2/vector.css': css`
-        @import './dir-3/vector.css';
-        .test3 {
-          background-image: url('../../../resources/vector.svg');
-        }
-      `,
-      'src/dir-1/dir-2/dir-3/vector.css': css`
-        .test4 {
-          background-image: url('./vector-2.svg');
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm postcss src/index.css --output dist/out.css')
-
-    expect(await fs.dumpFiles('dist/out.css')).toMatchInlineSnapshot(`
-      "
-      --- dist/out.css ---
-      .test1 {
-        background-image: url('../../resources/image.png');
-      }
-      .test2 {
-        background-image: url('../../../resources/image.png');
-      }
-      .test4 {
-        background-image: url('./vector-2.svg');
-      }
-      .test3 {
-        background-image: url('../../../resources/vector.svg');
-      }
-      "
-    `)
-  },
-)
diff --git a/integrations/turbopack/loader.test.ts b/integrations/turbopack/loader.test.ts
deleted file mode 100644
index 755cd60df..000000000
--- a/integrations/turbopack/loader.test.ts
+++ /dev/null
@@ -1,83 +0,0 @@
-import { candidate, css, fetchStyles, js, json, jsx, retryAssertion, test } from '../utils'
-
-test(
-  '@tailwindcss/turbopack loader (dev)',
-  {
-    timeout: 120_000,
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "next": "^16.2.7",
-            "react": "^19.2.7",
-            "react-dom": "^19.2.7",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/turbopack": "workspace:^"
-          }
-        }
-      `,
-      'next.config.mjs': js`
-        export default {
-          turbopack: {
-            rules: {
-              '*.css': {
-                loaders: ['@tailwindcss/turbopack'],
-                as: '*.css',
-              },
-            },
-          },
-        }
-      `,
-      'app/layout.js': jsx`
-        import './globals.css'
-
-        export default function RootLayout({ children }) {
-          return (
-            <html>
-              <body>{children}</body>
-            </html>
-          )
-        }
-      `,
-      'app/page.js': jsx`
-        export default function Page() {
-          return <div className="flex">Hello, Next.js!</div>
-        }
-      `,
-      'app/globals.css': css` @import 'tailwindcss'; `,
-    },
-  },
-  async ({ fs, spawn, expect }) => {
-    let process = await spawn('pnpm next dev')
-
-    let url = ''
-    await process.onStdout((message) => {
-      let match = /Local:\s*(http.*)/.exec(message)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await process.onStdout((message) => message.includes('Ready in'))
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url)
-      expect(styles).toContain(candidate`flex`)
-      expect(styles).not.toContain(candidate`underline`)
-    })
-
-    await fs.write(
-      'app/page.js',
-      jsx`
-        export default function Page() {
-          return <div className="flex underline">Hello, Next.js!</div>
-        }
-      `,
-    )
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url)
-      expect(styles).toContain(candidate`flex`)
-      expect(styles).toContain(candidate`underline`)
-    })
-  },
-)
diff --git a/integrations/upgrade/index.test.ts b/integrations/upgrade/index.test.ts
index efac411db..1da138f2c 100644
--- a/integrations/upgrade/index.test.ts
+++ b/integrations/upgrade/index.test.ts
@@ -1,6 +1,4 @@
-import path from 'node:path'
-import { isRepoDirty } from '../../packages/@tailwindcss-upgrade/src/utils/git'
-import { candidate, css, html, js, json, test, ts, txt, yaml } from '../utils'
+import { candidate, css, html, js, json, test, ts } from '../utils'
 
 test(
   'error when no CSS file with @tailwind is used',
@@ -28,7 +26,7 @@ test(
     },
   },
   async ({ fs, exec, expect }) => {
-    let output = await exec('pnpm exec upgrade')
+    let output = await exec('npx @tailwindcss/upgrade')
     expect(output).toContain('Cannot find any CSS files that reference Tailwind CSS.')
 
     // Files should not be modified
@@ -82,9 +80,6 @@ test(
 
         <!-- Migrate to -3 -->
         <div class="ring"></div>
-
-        <!-- Migrate to -solid -->
-        <div class="outline"></div>
       `,
       'src/input.css': css`
         @tailwind base;
@@ -100,7 +95,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
       "
@@ -121,14 +116,11 @@ test(
       <!-- Migrate to -3 -->
       <div class="ring-3"></div>
 
-      <!-- Migrate to -solid -->
-      <div class="outline-solid"></div>
-
       --- ./src/input.css ---
       @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -141,7 +133,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -158,7 +150,7 @@ test(
     })
 
     // Ensure the v4 project compiles correctly
-    await exec('pnpm exec tailwindcss --input src/input.css --output dist/out.css')
+    await exec('npx tailwindcss --input src/input.css --output dist/out.css')
 
     await fs.expectFileToContain('dist/out.css', [
       candidate`flex!`,
@@ -171,62 +163,9 @@ test(
   },
 )
 
-test(
-  'only migrates files matched by `config.content` when upgrading from v3 to v4',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.js': js`
-        /** @type {import('tailwindcss').Config} */
-        module.exports = {
-          content: ['./src/**/*.html'],
-        }
-      `,
-      'src/index.html': html`
-        <div class="order-[0] bg-[--my-red]"></div>
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-      'templates/email.php': html`
-        <div class="order-[0] bg-[--my-red]"></div>
-      `,
-      'notes/unrelated.txt': `order-[0] bg-[--my-red]`,
-    },
-    retry: 0,
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('./**/*.{html,php,txt}')).toMatchInlineSnapshot(`
-      "
-      --- notes/unrelated.txt ---
-      order-[0] bg-[--my-red]
-
-      --- src/index.html ---
-      <div class="order-0 bg-(--my-red)"></div>
-
-      --- templates/email.php ---
-      <div class="order-[0] bg-[--my-red]"></div>
-      "
-    `)
-  },
-)
-
 test(
   `upgrades a v3 project with prefixes to v4`,
   {
-    // Somehow this test takes *way* longer than the rest (but not always?)
-    timeout: 180_000,
     fs: {
       'package.json': json`
         {
@@ -263,13 +202,13 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
       "
       --- ./src/index.html ---
       <div
-        class="tw:flex! tw:sm:block! tw:bg-linear-to-t flex tw:text-[red] tw:in-[.tw\\:group]:flex"
+        class="tw:flex! tw:sm:block! tw:bg-linear-to-t flex tw:[color:red] tw:in-[.tw\\:group]:flex"
       ></div>
       <div
         class="tw:group tw:group/foo tw:peer tw:peer/foo tw:group-hover:flex tw:group-hover/foo:flex tw:peer-hover:flex tw:peer-hover/foo:flex"
@@ -279,7 +218,7 @@ test(
       @import 'tailwindcss' prefix(tw);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -292,7 +231,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -335,7 +274,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -343,7 +282,7 @@ test(
       @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -356,7 +295,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -407,7 +346,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -415,7 +354,7 @@ test(
       @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -428,7 +367,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -484,7 +423,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -492,7 +431,7 @@ test(
       @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -505,7 +444,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -587,7 +526,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -601,7 +540,7 @@ test(
       @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -614,7 +553,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -654,7 +593,6 @@ test(
 test(
   'migrates a simple postcss setup',
   {
-    timeout: 120_000,
     fs: {
       'package.json': json`
         {
@@ -695,7 +633,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     await fs.expectFileToContain(
       'postcss.config.js',
@@ -766,7 +704,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     let packageJsonContent = await fs.read('package.json')
     let packageJson = JSON.parse(packageJsonContent)
@@ -813,7 +751,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     let packageJsonContent = await fs.read('package.json')
     let packageJson = JSON.parse(packageJsonContent)
@@ -826,7 +764,6 @@ test(
 test(
   'migrates a postcss setup using package.json config',
   {
-    timeout: 120_000,
     fs: {
       'package.json': json`
         {
@@ -865,7 +802,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     await fs.expectFileToContain('src/index.css', css`@import 'tailwindcss';`)
     await fs.expectFileToContain(
@@ -900,7 +837,6 @@ test(
 test(
   'migrates a postcss setup using a json based config file',
   {
-    timeout: 120_000,
     fs: {
       'package.json': json`
         {
@@ -941,7 +877,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     await fs.expectFileToContain('src/index.css', css`@import 'tailwindcss';`)
     await fs.expectFileToContain(
@@ -1008,7 +944,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.html')).toMatchInlineSnapshot(`
       "
@@ -1055,7 +991,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.html')).toMatchInlineSnapshot(`
       "
@@ -1099,7 +1035,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -1108,7 +1044,7 @@ test(
       @import './utilities.css';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1121,7 +1057,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -1169,10 +1105,9 @@ test(
         }
       `,
     },
-    retry: 0,
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -1281,10 +1216,9 @@ test(
         }
       `,
     },
-    retry: 0,
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -1331,6 +1265,7 @@ test(
 
       --- ./src/c.1.css ---
       @import './c.2.css' layer(utilities);
+
       .baz-from-c {
         color: green;
       }
@@ -1417,7 +1352,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    let output = await exec('pnpm exec upgrade --force')
+    let output = await exec('npx @tailwindcss/upgrade --force')
 
     expect(output).toMatch(
       /You have one or more stylesheets that are imported into a utility layer and non-utility layer./,
@@ -1541,7 +1476,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.{html,css}')).toMatchInlineSnapshot(`
       "
@@ -1557,7 +1492,7 @@ test(
       @config './tailwind.config.ts';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1570,7 +1505,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -1581,7 +1516,7 @@ test(
       @config "../../tailwind.config.ts";
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1594,7 +1529,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -1615,7 +1550,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1628,7 +1563,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -1644,7 +1579,7 @@ test(
       @import 'tailwindcss/preflight' layer(base);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1657,7 +1592,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -1675,7 +1610,7 @@ test(
       @config '../../tailwind.config.ts';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1688,7 +1623,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -1766,8 +1701,8 @@ test(
     },
   },
   async ({ exec, expect }) => {
-    let output = await exec('pnpm exec upgrade --force', {}, { ignoreStdErr: true }).catch((e) =>
-      e.toString(),
+    let output = await exec('npx @tailwindcss/upgrade --force', {}, { ignoreStdErr: true }).catch(
+      (e) => e.toString(),
     )
 
     expect(output).toMatch('Could not determine configuration file for:')
@@ -1838,7 +1773,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.{html,css}')).toMatchInlineSnapshot(`
       "
@@ -1855,7 +1790,7 @@ test(
       @import 'tailwindcss/preflight' layer(base);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1868,7 +1803,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -1974,7 +1909,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.{html,css}')).toMatchInlineSnapshot(`
       "
@@ -1991,7 +1926,7 @@ test(
       @import 'tailwindcss/preflight' layer(base);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2004,7 +1939,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -2094,7 +2029,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.{html,css}')).toMatchInlineSnapshot(`
       "
@@ -2108,7 +2043,7 @@ test(
       @import 'tailwindcss/preflight' layer(base);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2121,7 +2056,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -2174,7 +2109,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -2183,7 +2118,7 @@ test(
       @import './styles/components.css' layer(components);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2196,7 +2131,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -2256,10 +2191,9 @@ test(
         }
       `,
     },
-    retry: 0,
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     expect(await fs.dumpFiles('./src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -2313,7 +2247,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     let pkg = JSON.parse(await fs.read('package.json'))
 
@@ -2392,7 +2326,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     // Files should not be modified
     expect(await fs.dumpFiles('./*.{js,css,html}')).toMatchInlineSnapshot(`
@@ -2404,7 +2338,8 @@ test(
         --shadow-*: initial;
         --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
 
-        --default-ring-width: 4px;
+        --ring-width-*: initial;
+        --ring-width: 4px;
 
         --blur: var(--custom-default-blur);
 
@@ -2414,7 +2349,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2427,7 +2362,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -2490,7 +2425,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade --force')
+    await exec('npx @tailwindcss/upgrade --force')
 
     // Files should not be modified
     expect(await fs.dumpFiles('./*.{js,css,html,tsx}')).toMatchInlineSnapshot(`
@@ -2499,7 +2434,7 @@ test(
       @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2512,7 +2447,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -2557,7 +2492,7 @@ test(
         @import './utilities.css';
         @import './generated/ignore-me.css';
       `,
-      'src/generated/.gitignore': txt`
+      'src/generated/.gitignore': `
         *
         !.gitignore
       `,
@@ -2597,7 +2532,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade ./src/index.css')
+    await exec('npx @tailwindcss/upgrade ./src/index.css')
 
     expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
       "
@@ -2612,7 +2547,7 @@ test(
       @import 'tailwindcss/preflight' layer(base);
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2625,7 +2560,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -2660,6 +2595,40 @@ test(
   },
 )
 
+test(
+  'requires Tailwind v3 before attempting an upgrade',
+  {
+    fs: {
+      'package.json': json`
+        {
+          "dependencies": {
+            "tailwindcss": "workspace:^",
+            "@tailwindcss/upgrade": "workspace:^"
+          }
+        }
+      `,
+      'tailwind.config.ts': js` export default {} `,
+      'src/index.html': html`
+        <div class="underline"></div>
+      `,
+      'src/index.css': css`
+        @tailwind base;
+        @tailwind components;
+        @tailwind utilities;
+      `,
+    },
+  },
+  async ({ exec, expect }) => {
+    let output = await exec('npx @tailwindcss/upgrade', {}, { ignoreStdErr: true }).catch((e) =>
+      e.toString(),
+    )
+
+    expect(output).toMatch(
+      /Tailwind CSS v.* found. The migration tool can only be run on v3 projects./,
+    )
+  },
+)
+
 test(
   `upgrades opacity namespace values to percentages`,
   {
@@ -2723,7 +2692,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
       "
@@ -2736,8 +2705,8 @@ test(
           text-red-500/10
           text-red-500/semitransparent
           text-red-500/transparent
-          text-red-500/semitransparent
-          text-red-500/50.50
+          text-red-500/50
+          text-red-500/50.5
           text-red-500/50.50
           text-red-500/50%
           text-red-500/100%"
@@ -2756,7 +2725,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2769,7 +2738,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -2809,7 +2778,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
       "
@@ -2817,10 +2786,10 @@ test(
       <div class="ring-3"></div>
 
       --- ./src/input.css ---
-      @import 'tailwindcss';
+      @import 'tailwindcss';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -2833,7 +2802,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -2841,672 +2810,6 @@ test(
   },
 )
 
-test(
-  'upgrades are idempotent, and can run on v4 projects',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          },
-          "devDependencies": {
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.js': js`
-        /** @type {import('tailwindcss').Config} */
-        module.exports = {
-          content: ['./src/**/*.{html,js}'],
-        }
-      `,
-      'src/index.html': html`
-        <div class="ring"></div>
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-
-        .foo {
-          @apply !bg-[var(--my-color)] rounded;
-        }
-      `,
-    },
-  },
-  async ({ exec, root, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    let before = await fs.dumpFiles('./src/**/*.{css,html}')
-    expect(before).toMatchInlineSnapshot(`
-      "
-      --- ./src/index.html ---
-      <div class="ring-3"></div>
-
-      --- ./src/input.css ---
-      @import 'tailwindcss';
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-
-      .foo {
-        @apply bg-(--my-color)! rounded-sm;
-      }
-      "
-    `)
-
-    // Commit the changes
-    if (isRepoDirty(root)) {
-      await exec('git add .')
-      await exec('git commit -m "upgrade"')
-    }
-
-    // Run the upgrade again
-    let output = await exec('pnpm exec upgrade')
-    expect(output).toContain('No changes were made to your repository')
-
-    let after = await fs.dumpFiles('./src/**/*.{css,html}')
-    expect(after).toMatchInlineSnapshot(`
-      "
-      --- ./src/index.html ---
-      <div class="ring-3"></div>
-
-      --- ./src/input.css ---
-      @import 'tailwindcss';
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-
-      .foo {
-        @apply bg-(--my-color)! rounded-sm;
-      }
-      "
-    `)
-
-    // Ensure the file system is in the same state
-    expect(before).toEqual(after)
-  },
-)
-
-test(
-  'upgrades run on v4 projects',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4",
-            "@tailwindcss/upgrade": "workspace:^"
-          },
-          "devDependencies": {
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'src/index.html': html`
-        <!-- Migrating 'ring', 'rounded' and 'outline-none' are unsafe in v4 -> v4 migrations -->
-        <div class="ring rounded outline"></div>
-
-        <!-- Variant order is also unsafe to change in v4 projects -->
-        <div class="file:hover:flex *:hover:flex"></div>
-        <div class="hover:file:flex hover:*:flex"></div>
-
-        <!-- These are safe to migrate: -->
-        <div
-          class="!flex bg-red-500/[var(--my-opacity)] [@media(pointer:fine)]:flex bg-right-bottom object-left-top"
-        ></div>
-      `,
-      'src/input.css': css`
-        @import 'tailwindcss';
-
-        .foo {
-          @apply !bg-[var(--my-color)];
-        }
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
-      "
-      --- ./src/index.html ---
-      <!-- Migrating 'ring', 'rounded' and 'outline-none' are unsafe in v4 -> v4 migrations -->
-      <div class="ring rounded outline"></div>
-
-      <!-- Variant order is also unsafe to change in v4 projects -->
-      <div class="file:hover:flex *:hover:flex"></div>
-      <div class="hover:file:flex hover:*:flex"></div>
-
-      <!-- These are safe to migrate: -->
-      <div
-        class="flex! bg-red-500/(--my-opacity) pointer-fine:flex bg-bottom-right object-top-left"
-      ></div>
-
-      --- ./src/input.css ---
-      @import 'tailwindcss';
-
-      .foo {
-        @apply bg-(--my-color)!;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'v4 ignores .env files during template migration',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'src/app.css': css`@import 'tailwindcss';`,
-      'src/index.html': html`
-        <div class="order-[0]"></div>
-      `,
-      'src/.env': `TW_TEST_CLASS=order-[0]`,
-      'src/.env.production': `TW_TEST_CLASS=order-[0]`,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('./src/**/{*,.env,.env.*}')).toMatchInlineSnapshot(`
-      "
-      --- ./src/index.html ---
-      <div class="order-0"></div>
-
-      --- ./src/.env ---
-      TW_TEST_CLASS=order-[0]
-
-      --- ./src/.env.production ---
-      TW_TEST_CLASS=order-[0]
-
-      --- ./src/app.css ---
-      @import 'tailwindcss';
-      "
-    `)
-  },
-)
-
-test(
-  'v4 linked configs respect `content` and still ignore gitignored files',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.js': js`
-        /** @type {import('tailwindcss').Config} */
-        module.exports = {
-          content: ['./src/*.html', './src/*.less'],
-        }
-      `,
-      'src/app.css': css`
-        @import 'tailwindcss';
-        @config '../tailwind.config.js';
-      `,
-
-      // Ignore all .html files
-      'src/.gitignore': txt`
-        *.html
-      `,
-
-      // HTML files are in .gitignore, even though they are explicitly mentioned
-      // in the `content` array. Still ignore them
-      'src/do-not-migrate-me.html': html`
-        <div class="order-[0]"></div>
-      `,
-
-      // Should be picked up by auto-content detection
-      'templates/migrate-me.php': html`
-        <div class="order-[0]"></div>
-      `,
-
-      // Does not get picked up by auto content detection (because it's a less
-      // file), but was explicitly listed in the `content` array.
-      //
-      // A bit of a hacky way, I admit, but it allows us to differentiate
-      // between git ignored files, auto content detection and explicitly listed
-      // files.
-      'src/migrate-me.less': html`
-        <div class="order-[0]"></div>
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('./{src,templates}/**/*')).toMatchInlineSnapshot(`
-      "
-      --- ./src/app.css ---
-      @import 'tailwindcss';
-      @config '../tailwind.config.js';
-
-      --- ./src/do-not-migrate-me.html ---
-      <div class="order-[0]"></div>
-
-      --- ./src/migrate-me.less ---
-      <div class="order-0"></div>
-
-      --- ./templates/migrate-me.php ---
-      <div class="order-0"></div>
-      "
-    `)
-  },
-)
-
-test(
-  'interrupting template migration does not truncate files',
-  {
-    timeout: 180_000,
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'src/app.css': css` @import 'tailwindcss'; `,
-      'src/index.html': html`
-        <div class="order-[0]"></div>
-      `,
-      'hook.cjs': js`
-        let fs = require('node:fs/promises')
-        let path = require('node:path')
-        let originalWriteFile = fs.writeFile.bind(fs)
-
-        fs.writeFile = async (file, contents, ...rest) => {
-          // Mimic a bad write
-          await originalWriteFile(file, '') // As-if we truncated first
-          console.error('__TRUNCATED_TARGET__')
-          await new Promise((r) => setTimeout(r, 50)) // Wait 50ms to allow us to kill the process
-          await originalWriteFile(file, contents, ...rest) // Write the actual contents
-        }
-      `,
-      'src/keep.php': `
-        <?php
-
-        return [
-          'keep' => 'this file should never be truncated',
-        ];
-      `,
-    },
-  },
-  async ({ spawn, fs, expect }) => {
-    let repeatedCandidates = Array.from(
-      { length: 250 },
-      () => '<div class="order-[0]"></div>',
-    ).join('\n')
-
-    for (let i = 0; i < 100; i++) {
-      await fs.write(
-        `src/templates/template-${i}.php`,
-        `<?php\n\n${repeatedCandidates}\n\nreturn ['template' => ${i}];\n`,
-      )
-    }
-
-    let originalKeepFile = await fs.read('src/keep.php')
-    let originalTemplate = await fs.read('src/templates/template-0.php')
-
-    // NOTE: This test intentionally keeps `npx` instead of `pnpm exec`. It uses
-    // a `NODE_OPTIONS` hook that overrides `fs.writeFile` to simulate a bad
-    // write, and `pnpm exec` may write a bin shim on startup which would trip
-    // that hook before template migration begins.
-    let process = await spawn('npx @tailwindcss/upgrade --force', {
-      env: {
-        NODE_OPTIONS: '--require=./hook.cjs',
-      },
-    })
-
-    // We're only interested once we start migrating the templates
-    await process.onStderr((message) => message.includes('Migrating templates'))
-
-    // Wait for the trigger that we are mid-write
-    await process.onStderr((message) => message === '__TRUNCATED_TARGET__')
-
-    // Kill the process
-    await process.dispose()
-
-    expect(await fs.read('src/keep.php')).toBe(originalKeepFile)
-    expect(await fs.read('src/templates/template-0.php')).toBe(originalTemplate)
-
-    for (let [file, contents] of await fs.glob('src/**/*.{html,php,css}')) {
-      expect(contents.trim(), `${file} should not be empty after interruption`).not.toBe('')
-    }
-  },
-)
-
-test(
-  'upgrades can run in a pnpm workspace',
-  {
-    fs: {
-      'package.json': json`{}`,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - project-a
-      `,
-      'project-a/package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4"
-          },
-          "devDependencies": {
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'project-a/src/index.html': html`
-        <!-- Migrating 'ring', 'rounded' and 'outline-none' are unsafe in v4 -> v4 migrations -->
-        <div class="ring rounded outline"></div>
-
-        <!-- Variant order is also unsafe to change in v4 projects -->
-        <div class="file:hover:flex *:hover:flex"></div>
-        <div class="hover:file:flex hover:*:flex"></div>
-
-        <!-- These are safe to migrate: -->
-        <div
-          class="!flex bg-red-500/[var(--my-opacity)] [@media(pointer:fine)]:flex bg-right-bottom object-left-top"
-        ></div>
-      `,
-      'project-a/src/input.css': css`
-        @import 'tailwindcss';
-
-        .foo {
-          @apply !bg-[var(--my-color)];
-        }
-      `,
-    },
-  },
-  async ({ root, exec, fs, expect }) => {
-    let stdout = await exec('pnpm exec upgrade', {
-      cwd: path.join(root, 'project-a'),
-    })
-
-    expect(/Path .*? is not in cwd/.test(stdout)).toBe(false)
-
-    expect(await fs.dumpFiles('./project-a/src/**/*.{css,html}')).toMatchInlineSnapshot(`
-      "
-      --- ./project-a/src/index.html ---
-      <!-- Migrating 'ring', 'rounded' and 'outline-none' are unsafe in v4 -> v4 migrations -->
-      <div class="ring rounded outline"></div>
-
-      <!-- Variant order is also unsafe to change in v4 projects -->
-      <div class="file:hover:flex *:hover:flex"></div>
-      <div class="hover:file:flex hover:*:flex"></div>
-
-      <!-- These are safe to migrate: -->
-      <div
-        class="flex! bg-red-500/(--my-opacity) pointer-fine:flex bg-bottom-right object-top-left"
-      ></div>
-
-      --- ./project-a/src/input.css ---
-      @import 'tailwindcss';
-
-      .foo {
-        @apply bg-(--my-color)!;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'upgrades can run in a pnpm workspace root',
-  {
-    fs: {
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - .
-      `,
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4"
-          },
-          "devDependencies": {
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'src/index.html': html`
-        <!-- Migrating 'ring', 'rounded' and 'outline-none' are unsafe in v4 -> v4 migrations -->
-        <div class="ring rounded outline"></div>
-
-        <!-- Variant order is also unsafe to change in v4 projects -->
-        <div class="file:hover:flex *:hover:flex"></div>
-        <div class="hover:file:flex hover:*:flex"></div>
-
-        <!-- These are safe to migrate: -->
-        <div
-          class="!flex bg-red-500/[var(--my-opacity)] [@media(pointer:fine)]:flex bg-right-bottom object-left-top"
-        ></div>
-      `,
-      'src/input.css': css`
-        @import 'tailwindcss';
-
-        .foo {
-          @apply !bg-[var(--my-color)];
-        }
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    let stdout = await exec('pnpm exec upgrade')
-
-    expect(stdout).not.toContain(
-      'Running this command will add the dependency to the workspace root',
-    )
-
-    expect(await fs.dumpFiles('./src/**/*.{css,html}')).toMatchInlineSnapshot(`
-      "
-      --- ./src/index.html ---
-      <!-- Migrating 'ring', 'rounded' and 'outline-none' are unsafe in v4 -> v4 migrations -->
-      <div class="ring rounded outline"></div>
-
-      <!-- Variant order is also unsafe to change in v4 projects -->
-      <div class="file:hover:flex *:hover:flex"></div>
-      <div class="hover:file:flex hover:*:flex"></div>
-
-      <!-- These are safe to migrate: -->
-      <div
-        class="flex! bg-red-500/(--my-opacity) pointer-fine:flex bg-bottom-right object-top-left"
-      ></div>
-
-      --- ./src/input.css ---
-      @import 'tailwindcss';
-
-      .foo {
-        @apply bg-(--my-color)!;
-      }
-      "
-    `)
-  },
-)
-
-// https://github.com/tailwindlabs/tailwindcss/issues/20328
-test(
-  'ignored files should not be touched when upgrading from a nested directory',
-  {
-    fs: {
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - packages/*
-      `,
-      'package.json': json`
-        {
-          "name": "root",
-          "private": true
-        }
-      `,
-      'packages/css/package.json': json`
-        {
-          "name": "css-pkg",
-          "private": true,
-          "devDependencies": {
-            "tailwindcss": "^4",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'packages/css/src/input.css': css`
-        @import 'tailwindcss/utilities.css' layer(utilities) source(none);
-      `,
-      'packages/css/src/index.html': html`<div class="flex text-red-500">Hi</div>`,
-
-      // Ensure files/folders ignored by a `.gitignore` in the root take effect
-      // when executing the upgrade tool from a sub-package.
-      '.gitignore': txt`
-        node_modules/
-      `,
-    },
-  },
-  async ({ root, exec, fs, expect }) => {
-    await exec('git init', { cwd: root })
-
-    await exec('pnpm exec upgrade --force', {
-      cwd: path.join(root, 'packages/css'),
-    })
-
-    expect(await fs.dumpFiles('packages/css/node_modules/tailwindcss/utilities.css'))
-      .toMatchInlineSnapshot(`
-        "
-        --- packages/css/node_modules/tailwindcss/utilities.css ---
-        @tailwind utilities;
-        "
-    `)
-  },
-)
-
-test(
-  'upgrade <style> blocks carefully',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^4",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'src/index.vue': html`
-        <template>
-          <div class="!flex"></div>
-        </template>
-
-        <style>
-          @reference "./input.css";
-
-          .foo {
-            @apply !bg-red-500;
-          }
-
-          .bar {
-            /* Do not upgrade the key: */
-            flex-shrink: 0;
-          }
-        </style>
-      `,
-      'src/input.css': css`
-        @import 'tailwindcss';
-
-        .foo {
-          flex-shrink: 1;
-        }
-
-        .bar {
-          @apply !underline;
-        }
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('./src/**/*.{css,vue}')).toMatchInlineSnapshot(`
-      "
-      --- ./src/index.vue ---
-      <template>
-        <div class="flex!"></div>
-      </template>
-
-      <style>
-        @reference "./input.css";
-
-        .foo {
-          @apply !bg-red-500;
-        }
-
-        .bar {
-          /* Do not upgrade the key: */
-          flex-shrink: 0;
-        }
-      </style>
-
-      --- ./src/input.css ---
-      @import 'tailwindcss';
-
-      .foo {
-        flex-shrink: 1;
-      }
-
-      .bar {
-        @apply underline!;
-      }
-      "
-    `)
-  },
-)
-
 function withBOM(text: string): string {
   return '\uFEFF' + text
 }
diff --git a/integrations/upgrade/js-config.test.ts b/integrations/upgrade/js-config.test.ts
index cab0d3d62..b667a3f09 100644
--- a/integrations/upgrade/js-config.test.ts
+++ b/integrations/upgrade/js-config.test.ts
@@ -1,6 +1,6 @@
 import path from 'node:path'
 import { describe } from 'vitest'
-import { css, html, json, test, ts, txt } from '../utils'
+import { css, html, json, test, ts } from '../utils'
 
 test(
   `upgrade JS config files with flat theme values, darkMode, and content fields`,
@@ -30,23 +30,13 @@ test(
                 400: '#f87171',
                 500: 'red',
               },
-              superRed: '#ff0000',
               steel: 'rgb(70 130 180 / <alpha-value>)',
               smoke: 'rgba(245, 245, 245, var(--smoke-alpha, <alpha-value>))',
             },
-            ringColor: {
-              DEFAULT: '#c0ffee',
-            },
-            opacity: {
-              superOpaque: '0.95',
-            },
             fontSize: {
               xs: ['0.75rem', { lineHeight: '1rem' }],
               sm: ['0.875rem', { lineHeight: '1.5rem' }],
               base: ['1rem', { lineHeight: '2rem' }],
-              lg: ['1.125rem', '2.5rem'],
-              xl: ['1.5rem', '3rem', 'invalid'],
-              '2xl': ['2rem'],
             },
             width: {
               px: '1px',
@@ -151,10 +141,9 @@ test(
         }
       `,
       'src/index.html': html`
-        <div
+       <div
           class="[letter-spacing:theme(letterSpacing.superWide)] [line-height:theme(lineHeight.superLoose)]"
         ></div>
-        <div class="text-superRed/superOpaque leading-superLoose"></div>
       `,
       'node_modules/my-external-lib/src/template.html': html`
         <div class="text-red-500">
@@ -164,15 +153,14 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('src/**/*.{css,js,html}')).toMatchInlineSnapshot(`
       "
       --- src/index.html ---
       <div
-        class="tracking-superWide leading-superLoose"
-      ></div>
-      <div class="text-superRed/superOpaque leading-superLoose"></div>
+         class="[letter-spacing:var(--tracking-super-wide)] [line-height:var(--leading-super-loose)]"
+       ></div>
 
       --- src/input.css ---
       @import 'tailwindcss';
@@ -190,15 +178,9 @@ test(
         --color-red-500: #ef4444;
         --color-red-600: #dc2626;
 
-        --color-superRed: #ff0000;
         --color-steel: rgb(70 130 180);
         --color-smoke: rgba(245, 245, 245, var(--smoke-alpha, 1));
 
-        --default-ring-color: #c0ffee;
-
-        --opacity-*: initial;
-        --opacity-superOpaque: 95%;
-
         --text-*: initial;
         --text-xs: 0.75rem;
         --text-xs--line-height: 1rem;
@@ -206,11 +188,6 @@ test(
         --text-sm--line-height: 1.5rem;
         --text-base: 1rem;
         --text-base--line-height: 2rem;
-        --text-lg: 1.125rem;
-        --text-lg--line-height: 2.5rem;
-        --text-xl: 1.5rem;
-        --text-xl--line-height: 3rem;
-        --text-2xl: 2rem;
 
         --width-*: initial;
         --width-0: 0%;
@@ -270,9 +247,9 @@ test(
         --animate-spin-clockwise: spin-clockwise 1s linear infinite;
         --animate-spin-counterclockwise: spin-counterclockwise 1s linear infinite;
 
-        --tracking-superWide: 0.25em;
+        --tracking-super-wide: 0.25em;
 
-        --leading-superLoose: 3;
+        --leading-super-loose: 3;
 
         @keyframes spin-clockwise {
           0% {
@@ -293,7 +270,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -306,7 +283,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -322,105 +299,6 @@ test(
   },
 )
 
-test(
-  'skips gitignored template files even when they are explicitly referenced in `content`',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      '.gitignore': txt`
-        node_modules
-        src/ignored
-      `,
-      'tailwind.config.ts': ts`
-        import { type Config } from 'tailwindcss'
-
-        module.exports = {
-          content: [
-            './src/migrate-me.html',
-            './src/ignored/do-not-migrate-me.html',
-            './node_modules/my-external-lib/template.html',
-          ],
-          theme: {},
-          plugins: [],
-        } satisfies Config
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-      'src/migrate-me.html': html`
-        <div class="order-[0]"></div>
-      `,
-      'src/ignored/do-not-migrate-me.html': html`
-        <div class="order-[0]"></div>
-      `,
-      'node_modules/my-external-lib/template.html': html`
-        <div
-          class="order-[0]"
-        ></div>
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(
-      await fs.dumpFiles(
-        '{src/**/*.{css,html},node_modules/my-external-lib/template.html,.gitignore}',
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      --- .gitignore ---
-      node_modules
-      src/ignored
-
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @source './ignored/do-not-migrate-me.html';
-      @source '../node_modules/my-external-lib/template.html';
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-
-      --- src/migrate-me.html ---
-      <div class="order-0"></div>
-
-      --- node_modules/my-external-lib/template.html ---
-      <div
-        class="order-[0]"
-      ></div>
-
-      --- src/ignored/do-not-migrate-me.html ---
-      <div class="order-[0]"></div>
-      "
-    `)
-  },
-)
-
 test(
   'upgrades JS config files with plugins',
   {
@@ -484,7 +362,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -526,7 +404,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -539,7 +417,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -586,7 +464,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('src/**/*.{css,ts}')).toMatchInlineSnapshot(`
       "
@@ -594,21 +472,21 @@ test(
       @import 'tailwindcss';
 
       @theme {
-        --color-gray-50: oklch(98.5% 0 none);
-        --color-gray-100: oklch(97% 0 none);
-        --color-gray-200: oklch(92.2% 0 none);
-        --color-gray-300: oklch(87% 0 none);
-        --color-gray-400: oklch(70.8% 0 none);
-        --color-gray-500: oklch(55.6% 0 none);
-        --color-gray-600: oklch(43.9% 0 none);
-        --color-gray-700: oklch(37.1% 0 none);
-        --color-gray-800: oklch(26.9% 0 none);
-        --color-gray-900: oklch(20.5% 0 none);
-        --color-gray-950: oklch(14.5% 0 none);
+        --color-gray-50: oklch(0.985 0 0);
+        --color-gray-100: oklch(0.97 0 0);
+        --color-gray-200: oklch(0.922 0 0);
+        --color-gray-300: oklch(0.87 0 0);
+        --color-gray-400: oklch(0.708 0 0);
+        --color-gray-500: oklch(0.556 0 0);
+        --color-gray-600: oklch(0.439 0 0);
+        --color-gray-700: oklch(0.371 0 0);
+        --color-gray-800: oklch(0.269 0 0);
+        --color-gray-900: oklch(0.205 0 0);
+        --color-gray-950: oklch(0.145 0 0);
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -621,7 +499,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -672,7 +550,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -682,7 +560,7 @@ test(
       @config '../tailwind.config.ts';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -695,7 +573,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -750,7 +628,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -760,7 +638,7 @@ test(
       @config '../tailwind.config.ts';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -773,7 +651,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -824,7 +702,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
       "
@@ -834,7 +712,7 @@ test(
       @config '../tailwind.config.ts';
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -847,7 +725,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -934,7 +812,7 @@ test(
     },
   },
   async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
+    await exec('npx @tailwindcss/upgrade')
 
     expect(await fs.dumpFiles('project-{a,b}/**/*.{css,ts}')).toMatchInlineSnapshot(`
       "
@@ -946,7 +824,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -959,7 +837,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
 
@@ -971,7 +849,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -984,7 +862,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -1032,7 +910,7 @@ test(
     },
   },
   async ({ root, exec, fs, expect }) => {
-    await exec('pnpm exec upgrade', {
+    await exec('npx @tailwindcss/upgrade', {
       cwd: path.join(root, 'frontend'),
     })
 
@@ -1048,7 +926,7 @@ test(
       }
 
       /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+        The default border color has changed to \`currentColor\` in Tailwind CSS v4,
         so we've added these compatibility styles to make sure everything still
         looks the same as it did with Tailwind CSS v3.
 
@@ -1061,253 +939,7 @@ test(
         ::before,
         ::backdrop,
         ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'migrate aria theme keys to custom variants',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.ts': ts`
-        export default {
-          content: {
-            relative: true,
-            files: ['./src/**/*.html'],
-          },
-          theme: {
-            extend: {
-              aria: {
-                // Built-in (not really, but visible because of intellisense)
-                busy: 'busy="true"',
-
-                // Automatically handled by bare values
-                foo: 'foo="true"',
-
-                // Quotes are optional in CSS for these kinds of attribute
-                // selectors
-                bar: 'bar=true',
-
-                // Not automatically handled by bare values because names differ
-                baz: 'qux="true"',
-
-                // Completely custom
-                asc: 'sort="ascending"',
-                desc: 'sort="descending"',
-              },
-            },
-          },
-        }
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('src/*.css')).toMatchInlineSnapshot(`
-      "
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @custom-variant aria-baz (&[aria-qux="true"]);
-      @custom-variant aria-asc (&[aria-sort="ascending"]);
-      @custom-variant aria-desc (&[aria-sort="descending"]);
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'migrate data theme keys to custom variants',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.ts': ts`
-        export default {
-          content: {
-            relative: true,
-            files: ['./src/**/*.html'],
-          },
-          theme: {
-            extend: {
-              data: {
-                // Automatically handled by bare values
-                foo: 'foo',
-
-                // Not automatically handled by bare values because names differ
-                bar: 'baz',
-
-                // Custom
-                checked: 'ui~="checked"',
-              },
-            },
-          },
-        }
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('src/*.css')).toMatchInlineSnapshot(`
-      "
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @custom-variant data-bar (&[data-baz]);
-      @custom-variant data-checked (&[data-ui~="checked"]);
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'migrate supports theme keys to custom variants',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.ts': ts`
-        export default {
-          content: {
-            relative: true,
-            files: ['./src/**/*.html'],
-          },
-          theme: {
-            extend: {
-              supports: {
-                // Automatically handled by bare values (using CSS variable as the value)
-                foo: 'foo: var(--foo)', // parentheses are optional
-                bar: '(bar: var(--bar))',
-
-                // Not automatically handled by bare values because names differ
-                foo: 'bar: var(--foo)', // parentheses are optional
-                bar: '(qux: var(--bar))',
-
-                // Custom
-                grid: 'display: grid',
-              },
-            },
-          },
-        }
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('src/*.css')).toMatchInlineSnapshot(`
-      "
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @custom-variant supports-foo {
-        @supports (bar: var(--foo)) {
-          @slot;
-        }
-      }
-      @custom-variant supports-bar {
-        @supports ((qux: var(--bar))) {
-          @slot;
-        }
-      }
-      @custom-variant supports-grid {
-        @supports (display: grid) {
-          @slot;
-        }
-      }
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
+          border-color: var(--color-gray-200, currentColor);
         }
       }
       "
@@ -1346,7 +978,7 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
         "
@@ -1354,7 +986,7 @@ describe('border compatibility', () => {
         @import 'tailwindcss';
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1367,7 +999,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: var(--color-gray-200, currentcolor);
+            border-color: var(--color-gray-200, currentColor);
           }
         }
         "
@@ -1408,7 +1040,7 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
         "
@@ -1416,7 +1048,7 @@ describe('border compatibility', () => {
         @import 'tailwindcss';
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1429,7 +1061,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: oklch(62.3% 0.214 259.815);
+            border-color: oklch(0.623 0.214 259.815);
           }
         }
         "
@@ -1456,7 +1088,7 @@ describe('border compatibility', () => {
             theme: {
               extend: {
                 borderColor: ({ colors }) => ({
-                  DEFAULT: 'currentcolor',
+                  DEFAULT: 'currentColor',
                 }),
               },
             },
@@ -1470,7 +1102,7 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
         "
@@ -1509,7 +1141,7 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
         "
@@ -1520,7 +1152,7 @@ describe('border compatibility', () => {
         @import 'tailwindcss';
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1533,7 +1165,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: var(--color-gray-200, currentcolor);
+            border-color: var(--color-gray-200, currentColor);
           }
         }
         "
@@ -1580,7 +1212,7 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
         "
@@ -1589,7 +1221,7 @@ describe('border compatibility', () => {
         @import 'tailwindcss/preflight' layer(base);
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1602,7 +1234,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: var(--color-gray-200, currentcolor);
+            border-color: var(--color-gray-200, currentColor);
           }
         }
 
@@ -1683,18 +1315,18 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.{css,html}')).toMatchInlineSnapshot(`
         "
         --- src/index.html ---
         <div
-          class="w-2
-            w-4.5
-            w-5.5
-            w-13
-            w-100
-            w-miami"
+          class="[width:--spacing(2)]
+            [width:--spacing(4.5)]
+            [width:var(--spacing-5_5)]
+            [width:--spacing(13)]
+            [width:var(--spacing-100)]
+            [width:var(--spacing-miami)]"
         ></div>
 
         --- src/input.css ---
@@ -1707,7 +1339,7 @@ describe('border compatibility', () => {
         }
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1720,7 +1352,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: var(--color-gray-200, currentcolor);
+            border-color: var(--color-gray-200, currentColor);
           }
         }
 
@@ -1793,18 +1425,18 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.{css,html}')).toMatchInlineSnapshot(`
         "
         --- src/index.html ---
         <div
-          class="w-2
-            w-4.5
-            w-5.5
-            w-13
-            w-100
-            w-miami"
+          class="[width:var(--spacing-2)]
+            [width:var(--spacing-4_5)]
+            [width:var(--spacing-5_5)]
+            [width:var(--spacing-13)]
+            [width:var(--spacing-100)]
+            [width:var(--spacing-miami)]"
         ></div>
 
         --- src/input.css ---
@@ -1821,7 +1453,7 @@ describe('border compatibility', () => {
         }
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1834,7 +1466,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: var(--color-gray-200, currentcolor);
+            border-color: var(--color-gray-200, currentColor);
           }
         }
 
@@ -1895,7 +1527,7 @@ describe('border compatibility', () => {
       },
     },
     async ({ exec, fs, expect }) => {
-      await exec('pnpm exec upgrade')
+      await exec('npx @tailwindcss/upgrade')
 
       expect(await fs.dumpFiles('src/**/*.{css,html}')).toMatchInlineSnapshot(`
         "
@@ -1924,7 +1556,7 @@ describe('border compatibility', () => {
         }
 
         /*
-          The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+          The default border color has changed to \`currentColor\` in Tailwind CSS v4,
           so we've added these compatibility styles to make sure everything still
           looks the same as it did with Tailwind CSS v3.
 
@@ -1937,7 +1569,7 @@ describe('border compatibility', () => {
           ::before,
           ::backdrop,
           ::file-selector-button {
-            border-color: var(--color-gray-200, currentcolor);
+            border-color: var(--color-gray-200, currentColor);
           }
         }
         "
@@ -1945,243 +1577,3 @@ describe('border compatibility', () => {
     },
   )
 })
-
-test(
-  `future and experimental keys are supported`,
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.ts': ts`
-        import { type Config } from 'tailwindcss'
-        import defaultTheme from 'tailwindcss/defaultTheme'
-
-        module.exports = {
-          darkMode: 'selector',
-          content: ['./src/**/*.{html,js}'],
-          future: {
-            hoverOnlyWhenSupported: true,
-            respectDefaultRingColorOpacity: true,
-            disableColorOpacityUtilitiesByDefault: true,
-            relativeContentPathsByDefault: true,
-          },
-          experimental: {
-            generalizedModifiers: true,
-          },
-          theme: {
-            colors: {
-              red: {
-                400: '#f87171',
-                500: 'red',
-              },
-            },
-          },
-          plugins: [],
-        } satisfies Config
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
-      "
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @custom-variant dark (&:where(.dark, .dark *));
-
-      @theme {
-        --color-*: initial;
-        --color-red-400: #f87171;
-        --color-red-500: red;
-      }
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-      "
-    `)
-
-    expect((await fs.dumpFiles('tailwind.config.ts')).trim()).toBe('')
-  },
-)
-
-test(
-  `unknown future keys dont migrate the config`,
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.ts': ts`
-        import { type Config } from 'tailwindcss'
-        import defaultTheme from 'tailwindcss/defaultTheme'
-
-        module.exports = {
-          darkMode: 'selector',
-          content: ['./src/**/*.{html,js}'],
-          future: {
-            something: true,
-          },
-        } satisfies Config
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
-      "
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @config '../tailwind.config.ts';
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-      "
-    `)
-
-    expect((await fs.dumpFiles('tailwind.config.ts')).trim()).toMatchInlineSnapshot(`
-      "--- tailwind.config.ts ---
-      import { type Config } from 'tailwindcss'
-      import defaultTheme from 'tailwindcss/defaultTheme'
-
-      module.exports = {
-        darkMode: 'selector',
-        content: ['./src/**/*.{html,js}'],
-        future: {
-          something: true,
-        },
-      } satisfies Config"
-    `)
-  },
-)
-
-test(
-  `unknown experimental keys dont migrate the config`,
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.ts': ts`
-        import { type Config } from 'tailwindcss'
-        import defaultTheme from 'tailwindcss/defaultTheme'
-
-        module.exports = {
-          darkMode: 'selector',
-          content: ['./src/**/*.{html,js}'],
-          experimental: {
-            something: true,
-          },
-        } satisfies Config
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm exec upgrade')
-
-    expect(await fs.dumpFiles('src/**/*.css')).toMatchInlineSnapshot(`
-      "
-      --- src/input.css ---
-      @import 'tailwindcss';
-
-      @config '../tailwind.config.ts';
-
-      /*
-        The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
-        so we've added these compatibility styles to make sure everything still
-        looks the same as it did with Tailwind CSS v3.
-
-        If we ever want to remove these styles, we need to add an explicit border
-        color utility to any element that depends on these defaults.
-      */
-      @layer base {
-        *,
-        ::after,
-        ::before,
-        ::backdrop,
-        ::file-selector-button {
-          border-color: var(--color-gray-200, currentcolor);
-        }
-      }
-      "
-    `)
-
-    expect((await fs.dumpFiles('tailwind.config.ts')).trim()).toMatchInlineSnapshot(`
-      "--- tailwind.config.ts ---
-      import { type Config } from 'tailwindcss'
-      import defaultTheme from 'tailwindcss/defaultTheme'
-
-      module.exports = {
-        darkMode: 'selector',
-        content: ['./src/**/*.{html,js}'],
-        experimental: {
-          something: true,
-        },
-      } satisfies Config"
-    `)
-  },
-)
diff --git a/integrations/upgrade/upgrade-errors.test.ts b/integrations/upgrade/upgrade-errors.test.ts
deleted file mode 100644
index fdc60828e..000000000
--- a/integrations/upgrade/upgrade-errors.test.ts
+++ /dev/null
@@ -1,254 +0,0 @@
-import { stripVTControlCharacters } from 'node:util'
-import { css, html, js, json, test } from '../utils'
-
-test(
-  'upgrades half-upgraded v3 project to v4 (pnpm)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          },
-          "devDependencies": {
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.js': js`
-        /** @type {import('tailwindcss').Config} */
-        module.exports = {
-          content: ['./src/**/*.{html,js}'],
-        }
-      `,
-      'src/index.html': html`
-        <div class="!flex">Hello World</div>
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-    retry: 0,
-  },
-  async ({ exec, expect }) => {
-    // Ensure we are in a git repo
-    await exec('git init')
-    await exec('git add --all')
-    await exec('git commit -m "before migration"')
-
-    // Fully upgrade to v4
-    await exec('pnpm exec upgrade')
-
-    // Undo all changes to the current repo. This will bring the repo back to a
-    // v3 state, but the `node_modules` will now have v4 installed.
-    await exec('git reset --hard HEAD')
-
-    // Re-running the upgrade should result in an error
-    return expect(() => {
-      return exec('pnpm exec upgrade', {}, { ignoreStdErr: true }).catch((e) => {
-        // Replacing the current version with a hardcoded `v4` to make it stable
-        // when we release new minor/patch versions.
-        return Promise.reject(
-          stripVTControlCharacters(e.message.replace(/\d+\.\d+\.\d+/g, '4.0.0')),
-        )
-      })
-    }).rejects.toThrowErrorMatchingInlineSnapshot(`
-      "Command failed: pnpm exec upgrade
-      ≈ tailwindcss v4.0.0
-
-      │ ↳ Upgrading from Tailwind CSS \`v4.0.0\` 
-
-      │ ↳ Version mismatch 
-      │    
-      │   \`\`\`diff 
-      │   - "tailwindcss": "^3" (expected version in \`package.json\`) 
-      │   + "tailwindcss": "4.0.0" (installed version in \`node_modules\`) 
-      │   \`\`\` 
-      │    
-      │   Make sure to run \`pnpm install\` and try again. 
-
-      "
-    `)
-  },
-)
-
-test(
-  'upgrades half-upgraded v3 project to v4 (bun)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          },
-          "devDependencies": {
-            "@tailwindcss/cli": "workspace:^",
-            "bun": "^1.0.0"
-          }
-        }
-      `,
-      'tailwind.config.js': js`
-        /** @type {import('tailwindcss').Config} */
-        module.exports = {
-          content: ['./src/**/*.{html,js}'],
-        }
-      `,
-      'src/index.html': html`
-        <div class="!flex">Hello World</div>
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-    retry: 0,
-  },
-  async ({ exec, expect }) => {
-    // Use `bun` to install dependencies
-    await exec('rm ./pnpm-lock.yaml')
-    try {
-      await exec('npx bun install', {}, { ignoreStdErr: true })
-    } catch (e) {
-      // When preparing for a release, the version in `package.json` will point
-      // to a non-existent version because it's not published yet.
-      // TODO: Find a better approach to handle this and actually test it even
-      // on release branches. Note: the pnpm version _does_ work because of
-      // overrides in the package.json file.
-      if (`${e}`.includes('No version matching')) return
-      throw e
-    }
-
-    // Ensure we are in a git repo
-    await exec('git init')
-    await exec('git add --all')
-    await exec('git commit -m "before migration"')
-
-    // Fully upgrade to v4
-    await exec('npx @tailwindcss/upgrade')
-
-    // Undo all changes to the current repo. This will bring the repo back to a
-    // v3 state, but the `node_modules` will now have v4 installed.
-    await exec('git reset --hard HEAD')
-
-    // Re-running the upgrade should result in an error
-    return expect(() => {
-      return exec('npx @tailwindcss/upgrade', {}, { ignoreStdErr: true }).catch((e) => {
-        // Replacing the current version with a hardcoded `v4` to make it stable
-        // when we release new minor/patch versions.
-        return Promise.reject(
-          stripVTControlCharacters(e.message.replace(/\d+\.\d+\.\d+/g, '4.0.0')),
-        )
-      })
-    }).rejects.toThrowErrorMatchingInlineSnapshot(`
-      "Command failed: npx @tailwindcss/upgrade
-      ≈ tailwindcss v4.0.0
-
-      │ ↳ Upgrading from Tailwind CSS \`v4.0.0\` 
-
-      │ ↳ Version mismatch 
-      │    
-      │   \`\`\`diff 
-      │   - "tailwindcss": "^3" (expected version in \`package.json\`) 
-      │   + "tailwindcss": "4.0.0" (installed version in \`node_modules\`) 
-      │   \`\`\` 
-      │    
-      │   Make sure to run \`bun install\` and try again. 
-
-      "
-    `)
-  },
-)
-
-test(
-  'upgrades half-upgraded v3 project to v4 (npm)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "dependencies": {
-            "tailwindcss": "^3",
-            "@tailwindcss/upgrade": "workspace:^"
-          },
-          "devDependencies": {
-            "@tailwindcss/cli": "workspace:^"
-          }
-        }
-      `,
-      'tailwind.config.js': js`
-        /** @type {import('tailwindcss').Config} */
-        module.exports = {
-          content: ['./src/**/*.{html,js}'],
-        }
-      `,
-      'src/index.html': html`
-        <div class="!flex">Hello World</div>
-      `,
-      'src/input.css': css`
-        @tailwind base;
-        @tailwind components;
-        @tailwind utilities;
-      `,
-    },
-    retry: 0,
-  },
-  async ({ exec, expect }) => {
-    // Use `npm` to install dependencies
-    await exec('rm ./pnpm-lock.yaml')
-    await exec('rm -rf ./node_modules')
-    try {
-      await exec('npm install', {}, { ignoreStdErr: true })
-    } catch (e) {
-      // When preparing for a release, the version in `package.json` will point
-      // to a non-existent version because it's not published yet.
-      // TODO: Find a better approach to handle this and actually test it even
-      // on release branches. Note: the pnpm version _does_ work because of
-      // overrides in the package.json file.
-      if (`${e}`.includes('npm error code ETARGET')) return
-      throw e
-    }
-
-    // Ensure we are in a git repo
-    await exec('git init')
-    await exec('git add --all')
-    await exec('git commit -m "before migration"')
-
-    // Fully upgrade to v4
-    await exec('npx @tailwindcss/upgrade')
-
-    // Undo all changes to the current repo. This will bring the repo back to a
-    // v3 state, but the `node_modules` will now have v4 installed.
-    await exec('git reset --hard HEAD')
-
-    // Re-running the upgrade should result in an error
-    return expect(() => {
-      return exec('npx @tailwindcss/upgrade', {}, { ignoreStdErr: true }).catch((e) => {
-        // Replacing the current version with a hardcoded `v4` to make it stable
-        // when we release new minor/patch versions.
-        return Promise.reject(
-          stripVTControlCharacters(e.message.replace(/\d+\.\d+\.\d+/g, '4.0.0')),
-        )
-      })
-    }).rejects.toThrowErrorMatchingInlineSnapshot(`
-      "Command failed: npx @tailwindcss/upgrade
-      ≈ tailwindcss v4.0.0
-
-      │ ↳ Upgrading from Tailwind CSS \`v4.0.0\` 
-
-      │ ↳ Version mismatch 
-      │    
-      │   \`\`\`diff 
-      │   - "tailwindcss": "^3" (expected version in \`package.json\`) 
-      │   + "tailwindcss": "4.0.0" (installed version in \`node_modules\`) 
-      │   \`\`\` 
-      │    
-      │   Make sure to run \`npm install\` and try again. 
-
-      "
-    `)
-  },
-)
diff --git a/integrations/utils.ts b/integrations/utils.ts
index 9863918d1..4558edd03 100644
--- a/integrations/utils.ts
+++ b/integrations/utils.ts
@@ -1,28 +1,20 @@
 import dedent from 'dedent'
 import fastGlob from 'fast-glob'
-import { exec, execFile, spawn, type ChildProcess } from 'node:child_process'
+import { exec, spawn } from 'node:child_process'
 import fs from 'node:fs/promises'
-import { createServer } from 'node:net'
 import { platform, tmpdir } from 'node:os'
 import path from 'node:path'
-import { promisify, stripVTControlCharacters } from 'node:util'
-import { RawSourceMap, SourceMapConsumer } from 'source-map-js'
+import { stripVTControlCharacters } from 'node:util'
 import { test as defaultTest, type ExpectStatic } from 'vitest'
-import * as Yaml from 'yaml'
-import { createLineTable } from '../packages/tailwindcss/src/source-maps/line-table'
 import { escape } from '../packages/tailwindcss/src/utils/escape'
 
 const REPO_ROOT = path.join(__dirname, '..')
-const ROOT_PNPM_WORKSPACE = Yaml.parse(
-  await fs.readFile(path.join(REPO_ROOT, 'pnpm-workspace.yaml'), 'utf8'),
-)
 const PUBLIC_PACKAGES = (await fs.readdir(path.join(REPO_ROOT, 'dist'))).map((name) =>
   name.replace('tailwindcss-', '@tailwindcss/').replace('.tgz', ''),
 )
 
 interface SpawnedProcess {
-  dispose: () => Promise<void>
-  flush: () => void
+  dispose: () => void
   onStdout: (predicate: (message: string) => boolean) => Promise<void>
   onStderr: (predicate: (message: string) => boolean) => Promise<void>
 }
@@ -42,29 +34,24 @@ interface TestConfig {
     [filePath: string]: string | Uint8Array
   }
 
-  timeout?: number
   installDependencies?: boolean
-  retry?: number
 }
 interface TestContext {
   root: string
   expect: ExpectStatic
   exec(command: string, options?: ChildProcessOptions, execOptions?: ExecOptions): Promise<string>
   spawn(command: string, options?: ChildProcessOptions): Promise<SpawnedProcess>
-  parseSourceMap(opts: string | SourceMapOptions): SourceMap
   fs: {
     write(filePath: string, content: string, encoding?: BufferEncoding): Promise<void>
-    symlink(dst: string, src: string): Promise<void>
     create(filePaths: string[]): Promise<void>
     read(filePath: string): Promise<string>
-    delete(filePath: string): Promise<void>
     glob(pattern: string): Promise<[string, string][]>
     dumpFiles(pattern: string): Promise<string>
     expectFileToContain(
       filePath: string,
       contents: string | RegExp | (string | RegExp)[],
     ): Promise<void>
-    expectFileNotToContain(filePath: string, contents: string[]): Promise<void>
+    expectFileNotToContain(filePath: string, contents: string | string[]): Promise<void>
   }
 }
 type TestCallback = (context: TestContext) => Promise<void> | void
@@ -72,14 +59,11 @@ interface TestFlags {
   only?: boolean
   skip?: boolean
   debug?: boolean
-  concurrent?: boolean
 }
 
 type SpawnActor = { predicate: (message: string) => boolean; resolve: () => void }
 
-export const IS_WINDOWS = platform() === 'win32'
-
-const execFileAsync = promisify(execFile)
+const IS_WINDOWS = platform() === 'win32'
 
 const TEST_TIMEOUT = IS_WINDOWS ? 120000 : 60000
 const ASSERTION_TIMEOUT = IS_WINDOWS ? 10000 : 5000
@@ -93,16 +77,16 @@ export function test(
   name: string,
   config: TestConfig,
   testCallback: TestCallback,
-  { only = false, skip = false, debug = false, concurrent = false }: TestFlags = {},
+  { only = false, skip = false, debug = false }: TestFlags = {},
 ) {
   return defaultTest(
     name,
     {
-      timeout: config.timeout ?? TEST_TIMEOUT,
-      retry: config.retry ?? (process.env.CI ? 2 : 0),
+      timeout: TEST_TIMEOUT,
+      retry: process.env.CI ? 2 : 0,
       only: only || (!process.env.CI && debug),
       skip,
-      concurrent,
+      concurrent: true,
     },
     async (options) => {
       let rootDir = debug ? path.join(REPO_ROOT, '.debug') : TMP_ROOT
@@ -119,46 +103,12 @@ export function test(
       let context = {
         root,
         expect: options.expect,
-        parseSourceMap,
         async exec(
           command: string,
           childProcessOptions: ChildProcessOptions = {},
           execOptions: ExecOptions = {},
         ) {
           let cwd = childProcessOptions.cwd ?? root
-          let originalCommand = command
-
-          // Avoid `pnpm exec upgrade` on Windows because the upgrader runs
-          // `pnpm add`, which rewrites Windows `.cmd` shims while the current
-          // shim is still executing.
-          //
-          // Pretty sure this is a pnpm v11 bug on Windows.
-          if (IS_WINDOWS && command.includes('pnpm exec upgrade')) {
-            for (let base = cwd; ; base = path.dirname(base)) {
-              let upgradeBin = path.join(
-                base,
-                'node_modules',
-                '@tailwindcss',
-                'upgrade',
-                'dist',
-                'index.mjs',
-              )
-
-              try {
-                await fs.access(upgradeBin)
-                command = command.replace('pnpm exec upgrade', `node "${upgradeBin}"`)
-                break
-              } catch (error: any) {
-                if (error?.code !== 'ENOENT') throw error
-              }
-
-              let parent = path.dirname(base)
-              if (parent === base) {
-                throw new Error(`Unable to resolve @tailwindcss/upgrade from ${cwd}`)
-              }
-            }
-          }
-
           if (debug && cwd !== root) {
             let relative = path.relative(root, cwd)
             if (relative[0] !== '.') relative = `./${relative}`
@@ -171,18 +121,10 @@ export function test(
               {
                 cwd,
                 ...childProcessOptions,
-                env: {
-                  ...process.env,
-                  ...childProcessOptions.env,
-                },
+                env: childProcessOptions.env,
               },
               (error, stdout, stderr) => {
                 if (error) {
-                  if (command !== originalCommand) {
-                    error.message = error.message.replace(command, originalCommand)
-                    let mappedError = error as any
-                    mappedError.cmd = originalCommand
-                  }
                   if (execOptions.ignoreStdErr !== true) console.error(stderr)
                   if (only || debug) {
                     console.error(stdout)
@@ -219,7 +161,6 @@ export function test(
           if (debug) console.log(`>& ${command}`)
           let child = spawn(command, {
             cwd,
-            detached: !IS_WINDOWS,
             shell: true,
             ...childProcessOptions,
             env: {
@@ -228,26 +169,22 @@ export function test(
             },
           })
 
-          let disposed = false
+          function dispose() {
+            if (!child.kill()) {
+              child.kill('SIGKILL')
+            }
 
-          async function dispose() {
-            if (disposed) return disposePromise
-            disposed = true
-
-            await killProcessTree(child)
-
-            let timer = setTimeout(() => {
-              forceKillProcessTree(child)
-              rejectDisposal?.(new Error(`spawned process (${command}) did not exit in time`))
-            }, ASSERTION_TIMEOUT)
-            disposePromise.then(
-              () => clearTimeout(timer),
-              () => clearTimeout(timer),
+            let timer = setTimeout(
+              () =>
+                rejectDisposal?.(new Error(`spawned process (${command}) did not exit in time`)),
+              ASSERTION_TIMEOUT,
             )
+            disposePromise.finally(() => {
+              clearTimeout(timer)
+            })
             return disposePromise
           }
           disposables.push(dispose)
-
           function onExit() {
             resolveDisposal?.()
           }
@@ -316,13 +253,6 @@ export function test(
 
           return {
             dispose,
-            flush() {
-              stdoutActors.splice(0)
-              stderrActors.splice(0)
-
-              stdoutMessages.splice(0)
-              stderrMessages.splice(0)
-            },
             onStdout(predicate: (message: string) => boolean) {
               return new Promise<void>((resolve) => {
                 stdoutActors.push({ predicate, resolve })
@@ -338,7 +268,11 @@ export function test(
           }
         },
         fs: {
-          async write(filename, content, encoding = 'utf8') {
+          async write(
+            filename: string,
+            content: string | Uint8Array,
+            encoding: BufferEncoding = 'utf8',
+          ): Promise<void> {
             let full = path.join(root, filename)
             let dir = path.dirname(full)
             await fs.mkdir(dir, { recursive: true })
@@ -349,8 +283,6 @@ export function test(
 
             if (filename.endsWith('package.json')) {
               content = await overwriteVersionsInPackageJson(content)
-            } else if (filename.endsWith('pnpm-workspace.yaml')) {
-              content = overwriteVersionsInPnpmWorkspace(content)
             }
 
             // Ensure that files written on Windows use \r\n line ending
@@ -361,19 +293,7 @@ export function test(
             await fs.writeFile(full, content, encoding)
           },
 
-          async symlink(target, src) {
-            let targetAbsolute = path.join(root, target)
-            let targetParent = path.dirname(targetAbsolute)
-            await fs.mkdir(targetParent, { recursive: true })
-
-            let srcAbsolute = path.join(root, src)
-            let srcParent = path.dirname(srcAbsolute)
-            await fs.mkdir(srcParent, { recursive: true })
-
-            await fs.symlink(targetAbsolute, srcAbsolute)
-          },
-
-          async create(filenames) {
+          async create(filenames: string[]): Promise<void> {
             for (let filename of filenames) {
               let full = path.join(root, filename)
 
@@ -383,11 +303,7 @@ export function test(
             }
           },
 
-          async delete(filename) {
-            await fs.unlink(path.join(root, filename))
-          },
-
-          async read(filePath) {
+          async read(filePath: string) {
             let content = await fs.readFile(path.resolve(root, filePath), 'utf8')
 
             // Ensure that files read on Windows have \r\n line endings removed
@@ -397,7 +313,7 @@ export function test(
 
             return content
           },
-          async glob(pattern) {
+          async glob(pattern: string) {
             let files = await fastGlob(pattern, { cwd: root })
             return Promise.all(
               files.map(async (file) => {
@@ -405,12 +321,12 @@ export function test(
                 return [
                   file,
                   // Drop license comment
-                  content.replace(/[\s\n]*\/\*![\s\S]*?\*\/[\s\n]*/g, ''),
+                  content.replace(/[\s\n]*\/\*! tailwindcss .*? \*\/[\s\n]*/g, ''),
                 ]
               }),
             )
           },
-          async dumpFiles(pattern) {
+          async dumpFiles(pattern: string) {
             let files = await context.fs.glob(pattern)
             return `\n${files
               .slice()
@@ -469,44 +385,21 @@ export function test(
         node_modules/
       `
 
-      // Disable Git's automatic line ending conversion in these throwaway test
-      // repositories. Tools like pnpm write files (e.g. `pnpm-lock.yaml`) with
-      // LF endings, which on Windows (where `core.autocrlf=true` is common)
-      // makes Git emit noisy "LF will be replaced by CRLF" warnings when it
-      // touches those files.
-      config.fs['.gitattributes'] ??= txt`
-        * -text
-      `
-
-      // Ensure there is always a root `pnpm-workspace.yaml` so that transitive
-      // dependency overrides (and the build allow list) are injected into it.
-      // As of pnpm v10, these can no longer live in the `pnpm.overrides` field
-      // of `package.json`.
-      config.fs['pnpm-workspace.yaml'] ??= ''
-
       for (let [filename, content] of Object.entries(config.fs)) {
-        if (content.toString().startsWith('symlink:')) {
-          // The symlink path is relative to the target destination's path
-          let target = path.join(
-            filename,
-            content.toString().slice('symlink:'.length), // Relative path
-          )
-
-          await context.fs.symlink(target, filename)
-        } else {
-          await context.fs.write(filename, content)
-        }
+        await context.fs.write(filename, content)
       }
 
       let shouldInstallDependencies = config.installDependencies ?? true
 
       try {
-        // Every test project gets its own root `pnpm-workspace.yaml` (see
-        // above). This makes the test directory its own workspace root, so even
-        // in debug mode — where the directory lives inside this repository's
-        // pnpm workspace — `pnpm install` won't attach to the parent workspace.
+        // In debug mode, the directory is going to be inside the pnpm workspace
+        // of the tailwindcss package. This means that `pnpm install` will run
+        // pnpm install on the workspace instead (expect if the root dir defines
+        // a separate workspace). We work around this by using the
+        // `--ignore-workspace` flag.
         if (shouldInstallDependencies) {
-          await context.exec(`pnpm install`)
+          let ignoreWorkspace = debug && !config.fs['pnpm-workspace.yaml']
+          await context.exec(`pnpm install${ignoreWorkspace ? ' --ignore-workspace' : ''}`)
         }
       } catch (error: any) {
         console.error(error)
@@ -518,18 +411,11 @@ export function test(
       let disposables: (() => Promise<void>)[] = []
 
       async function dispose() {
-        let results = await Promise.allSettled(disposables.map((dispose) => dispose()))
+        await Promise.all(disposables.map((dispose) => dispose()))
 
         if (!debug) {
           await gracefullyRemove(root)
         }
-
-        let errors = results.flatMap((result) =>
-          result.status === 'rejected' ? [result.reason] : [],
-        )
-        if (errors.length > 0) {
-          throw new AggregateError(errors, 'Failed to clean up spawned processes')
-        }
       }
 
       options.onTestFinished(dispose)
@@ -539,7 +425,7 @@ export function test(
         try {
           await context.exec('git init', { cwd: root })
           await context.exec('git add --all', { cwd: root })
-          await context.exec('git commit -m "before migration" --allow-empty', { cwd: root })
+          await context.exec('git commit -m "before migration"', { cwd: root })
         } catch (error: any) {
           console.error(error)
           console.error(error.stdout?.toString())
@@ -558,9 +444,6 @@ test.only = (name: string, config: TestConfig, testCallback: TestCallback) => {
 test.skip = (name: string, config: TestConfig, testCallback: TestCallback) => {
   return test(name, config, testCallback, { skip: true })
 }
-test.concurrent = (name: string, config: TestConfig, testCallback: TestCallback) => {
-  return test(name, config, testCallback, { concurrent: true })
-}
 test.debug = (name: string, config: TestConfig, testCallback: TestCallback) => {
   return test(name, config, testCallback, { debug: true })
 }
@@ -584,43 +467,27 @@ async function overwriteVersionsInPackageJson(content: string): Promise<string>
     }
   }
 
-  return JSON.stringify(json, null, 2)
-}
-
-function overwriteVersionsInPnpmWorkspace(content: string): string {
-  let workspace = content.trim() === '' ? {} : Yaml.parse(content)
-
-  // Inherit information from the root workspace
-  workspace.allowBuilds = {
-    ...ROOT_PNPM_WORKSPACE.allowBuilds,
-    ...workspace.allowBuilds,
-  }
-
   // Inject transitive dependency overwrite. This is necessary because
   // @tailwindcss/vite internally depends on a specific version of
   // @tailwindcss/oxide and we instead want to resolve it to the locally built
   // version.
-  //
-  // As of pnpm v10, the `pnpm.overrides` field in `package.json` is no longer
-  // read. Overrides have to be defined in `pnpm-workspace.yaml` instead.
-  workspace.overrides ||= {}
+  json.pnpm ||= {}
+  json.pnpm.overrides ||= {}
   for (let pkg of PUBLIC_PACKAGES) {
     if (pkg === 'tailwindcss') {
       // We want to be explicit about the `tailwindcss` package so our tests can
       // also import v3 without conflicting v4 tarballs.
-      workspace.overrides['@tailwindcss/node>tailwindcss'] = resolveVersion(pkg)
-      workspace.overrides['@tailwindcss/upgrade>tailwindcss'] = resolveVersion(pkg)
-      workspace.overrides['@tailwindcss/cli>tailwindcss'] = resolveVersion(pkg)
-      workspace.overrides['@tailwindcss/postcss>tailwindcss'] = resolveVersion(pkg)
-      workspace.overrides['@tailwindcss/turbopack>tailwindcss'] = resolveVersion(pkg)
-      workspace.overrides['@tailwindcss/vite>tailwindcss'] = resolveVersion(pkg)
-      workspace.overrides['@tailwindcss/webpack>tailwindcss'] = resolveVersion(pkg)
+      json.pnpm.overrides['@tailwindcss/node>tailwindcss'] = resolveVersion(pkg)
+      json.pnpm.overrides['@tailwindcss/upgrade>tailwindcss'] = resolveVersion(pkg)
+      json.pnpm.overrides['@tailwindcss/cli>tailwindcss'] = resolveVersion(pkg)
+      json.pnpm.overrides['@tailwindcss/postcss>tailwindcss'] = resolveVersion(pkg)
+      json.pnpm.overrides['@tailwindcss/vite>tailwindcss'] = resolveVersion(pkg)
     } else {
-      workspace.overrides[pkg] = resolveVersion(pkg)
+      json.pnpm.overrides[pkg] = resolveVersion(pkg)
     }
   }
 
-  return Yaml.stringify(workspace)
+  return JSON.stringify(json, null, 2)
 }
 
 function resolveVersion(dependency: string) {
@@ -637,7 +504,6 @@ export let css = dedent
 export let html = dedent
 export let ts = dedent
 export let js = dedent
-export let jsx = dedent
 export let json = dedent
 export let yaml = dedent
 export let txt = dedent
@@ -670,7 +536,6 @@ export async function retryAssertion<T>(
     try {
       return await fn()
     } catch (err) {
-      Error.captureStackTrace(err, retryAssertion)
       error = err
       await new Promise((resolve) => setTimeout(resolve, delay))
     }
@@ -686,7 +551,7 @@ export async function fetchStyles(base: string, path = '/'): Promise<string> {
   let index = await fetch(`${base}${path}`)
   let html = await index.text()
 
-  let linkRegex = /<link rel="stylesheet" href="([a-zA-Z0-9/_.?=%-]+)"/gi
+  let linkRegex = /<link rel="stylesheet" href="([a-zA-Z0-9\/_\.\?=%-]+)"/gi
   let styleRegex = /<style\b[^>]*>([\s\S]*?)<\/style>/gi
 
   let stylesheets: string[] = []
@@ -717,155 +582,13 @@ export async function fetchStyles(base: string, path = '/'): Promise<string> {
   }
 
   return stylesheets.reduce((acc, css) => {
-    if (acc.length > 0) acc += '\n'
-    acc += css
-    return acc
+    return acc + '\n' + css
   }, '')
 }
 
-export async function getRandomPort() {
-  return new Promise<number>((resolve, reject) => {
-    let server = createServer()
-    server.unref()
-    server.on('error', reject)
-    server.listen(0, '127.0.0.1', () => {
-      let address = server.address()
-      server.close(() => {
-        if (address && typeof address === 'object') {
-          resolve(address.port)
-        } else {
-          reject(new Error('Unable to allocate random port'))
-        }
-      })
-    })
-  })
-}
-
-async function killProcessTree(child: ChildProcess) {
-  if (child.exitCode !== null || child.signalCode !== null || child.pid === undefined) {
-    return
-  }
-
-  if (IS_WINDOWS) {
-    await execFileAsync('taskkill', ['/pid', String(child.pid), '/T', '/F'], {
-      timeout: ASSERTION_TIMEOUT,
-      windowsHide: true,
-    }).catch(() => {})
-    return
-  }
-
-  try {
-    process.kill(-child.pid, 'SIGTERM')
-  } catch (error: any) {
-    if (error?.code !== 'ESRCH') {
-      child.kill()
-    }
-  }
-}
-
-function forceKillProcessTree(child: ChildProcess) {
-  if (child.exitCode !== null || child.signalCode !== null || child.pid === undefined) {
-    return
-  }
-
-  if (IS_WINDOWS) {
-    execFile('taskkill', ['/pid', String(child.pid), '/T', '/F'], { windowsHide: true }, () => {})
-    return
-  }
-
-  try {
-    process.kill(-child.pid, 'SIGKILL')
-  } catch (error: any) {
-    if (error?.code !== 'ESRCH') {
-      child.kill('SIGKILL')
-    }
-  }
-}
-
 async function gracefullyRemove(dir: string) {
   // Skip removing the directory in CI because it can stall on Windows
   if (!process.env.CI) {
-    await fs.rm(dir, { recursive: true, force: true }).catch((error) => {
-      console.log(`Failed to remove ${dir}`, error)
-    })
-  }
-}
-
-const SOURCE_MAP_COMMENT = /^\/\*# sourceMappingURL=data:application\/json;base64,(.*) \*\/$/
-
-export interface SourceMap {
-  at(
-    line: number,
-    column: number,
-  ): {
-    source: string | null
-    original: string
-    generated: string
-  }
-}
-
-interface SourceMapOptions {
-  /**
-   * A raw source map
-   *
-   * This may be a string or an object. Strings will be decoded.
-   */
-  map: string | object
-
-  /**
-   * The content of the generated file the source map is for
-   */
-  content: string
-
-  /**
-   * The encoding of the source map
-   *
-   * Can be used to decode a base64 map (e.g. an inline source map URI)
-   */
-  encoding?: BufferEncoding
-}
-
-function parseSourceMap(opts: string | SourceMapOptions): SourceMap {
-  if (typeof opts === 'string') {
-    let lines = opts.trimEnd().split('\n')
-    let comment = lines.at(-1) ?? ''
-    let map = String(comment).match(SOURCE_MAP_COMMENT)?.[1] ?? null
-    if (!map) throw new Error('No source map comment found')
-
-    return parseSourceMap({
-      map,
-      content: lines.slice(0, -1).join('\n'),
-      encoding: 'base64',
-    })
-  }
-
-  let rawMap: RawSourceMap
-  let content = opts.content
-
-  if (typeof opts.map === 'object') {
-    rawMap = opts.map as RawSourceMap
-  } else {
-    rawMap = JSON.parse(Buffer.from(opts.map, opts.encoding ?? 'utf-8').toString())
-  }
-
-  let map = new SourceMapConsumer(rawMap)
-  let generatedTable = createLineTable(content)
-
-  return {
-    at(line: number, column: number) {
-      let pos = map.originalPositionFor({ line, column })
-      let source = pos.source ? map.sourceContentFor(pos.source) : null
-      let originalTable = createLineTable(source ?? '')
-      let originalOffset = originalTable.findOffset(pos)
-      let generatedOffset = generatedTable.findOffset({ line, column })
-
-      return {
-        source: pos.source,
-        original: source
-          ? source.slice(originalOffset, originalOffset + 10).trim() + '...'
-          : '(none)',
-        generated: content.slice(generatedOffset, generatedOffset + 10).trim() + '...',
-      }
-    },
+    await fs.rm(dir, { recursive: true, force: true })
   }
 }
diff --git a/integrations/vite/astro.test.ts b/integrations/vite/astro.test.ts
index f828b5071..43406624c 100644
--- a/integrations/vite/astro.test.ts
+++ b/integrations/vite/astro.test.ts
@@ -1,4 +1,4 @@
-import { candidate, css, fetchStyles, html, js, json, retryAssertion, test, ts } from '../utils'
+import { candidate, fetchStyles, html, js, json, retryAssertion, test, ts } from '../utils'
 
 test(
   'dev mode',
@@ -129,73 +129,3 @@ test(
     await fs.expectFileToContain(files[0][0], [candidate`underline`, candidate`overline`])
   },
 )
-
-// https://github.com/tailwindlabs/tailwindcss/issues/19677
-test(
-  'import aliases should work in <style> blocks',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "astro": "^5",
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          }
-        }
-      `,
-      'astro.config.mjs': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'astro/config'
-
-        // https://astro.build/config
-        export default defineConfig({
-          vite: { plugins: [tailwindcss()] },
-        })
-      `,
-      'tsconfig.json': json`
-        {
-          "extends": "astro/tsconfigs/strict",
-          "include": [".astro/types.d.ts", "**/*"],
-          "exclude": ["dist"],
-          "compilerOptions": {
-            "paths": {
-              "@styles/*": ["./src/styles/*"]
-            }
-          }
-        }
-      `,
-      // prettier-ignore
-      'src/pages/index.astro': html`
-        ---
-        import '@styles/global.css'
-        ---
-
-        <html lang="en">
-          <head>
-            <meta charset="utf-8" />
-            <meta name="viewport" content="width=device-width" />
-            <meta name="generator" content={Astro.generator} />
-            <title>Astro</title>
-            <style>
-              @reference "@styles/global.css";
-            </style>
-          </head>
-          <body>
-            <h1 class="underline">Astro</h1>
-          </body>
-        </html>
-      `,
-      'src/styles/global.css': css`@import 'tailwindcss';`,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm astro build')
-
-    let files = await fs.glob('dist/**/*.css')
-    expect(files).toHaveLength(1)
-
-    await fs.expectFileToContain(files[0][0], [candidate`underline`])
-  },
-)
diff --git a/integrations/vite/bundled-dev.test.ts b/integrations/vite/bundled-dev.test.ts
deleted file mode 100644
index 8ba1b6b73..000000000
--- a/integrations/vite/bundled-dev.test.ts
+++ /dev/null
@@ -1,193 +0,0 @@
-import path from 'node:path'
-import { candidate, css, html, json, retryAssertion, test, ts, txt, yaml } from '../utils'
-
-// Vite's experimental `bundledDev` mode invokes the `hotUpdate` hook without a
-// `server`, which used to crash the plugin on every file edit.
-//
-// - https://github.com/tailwindlabs/tailwindcss/issues/20378
-// - https://vite.dev/blog/announcing-vite8-1#experimental-bundled-dev-mode
-test(
-  'dev mode (experimental `bundledDev`)',
-  {
-    fs: {
-      'package.json': json`{}`,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - project-a
-      `,
-      'project-a/package.json': txt`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8.1"
-          }
-        }
-      `,
-      'project-a/vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          experimental: {
-            bundledDev: true,
-          },
-          plugins: [tailwindcss()],
-        })
-      `,
-      'project-a/index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="underline">Hello, world!</div>
-        </body>
-      `,
-      'project-a/src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-        @source '../../project-b/src/**/*.html';
-      `,
-      'project-b/src/index.html': html`
-        <div class="flex" />
-      `,
-    },
-  },
-  async ({ root, spawn, fs, expect }) => {
-    let process = await spawn('pnpm vite dev', {
-      cwd: path.join(root, 'project-a'),
-      env: {
-        // Some CI machines have an upstream rolldown bug where its file watcher
-        // never delivers a single event. The debug output is the only way to
-        // tell that apart from a real regression (see below).
-        DEBUG: 'vite:full-bundle-mode',
-      },
-    })
-
-    // Any debug output beyond the "INITIAL:" startup lines proves rolldown's
-    // watcher delivered at least one file event.
-    let watcherAlive = false
-
-    // `hotUpdate` errors don't kill the dev server, they are only printed to
-    // stderr. Track them explicitly so a crash fails the test even if the
-    // rebuild happens to succeed anyway.
-    let pluginErrors: string[] = []
-    process.onStderr((message) => {
-      if (message.includes('vite:full-bundle-mode')) {
-        if (!message.includes('INITIAL:')) watcherAlive = true
-      } else if (message.includes('@tailwindcss/vite')) {
-        pluginErrors.push(message)
-      }
-      return false
-    })
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    // In `bundledDev` mode the stylesheet is not served separately. Instead the
-    // generated CSS is embedded in the bundled JS and injected at runtime, so
-    // extract the bundle from the served HTML. While the bundle is being built,
-    // Vite serves a temporary fallback page instead.
-    //
-    // The bundle can be split into multiple chunks (e.g. the HMR client runtime
-    // and the app itself), and the chunk containing the CSS is not always the
-    // first one, so fetch every referenced script and stylesheet.
-    async function fetchBundledStyles(): Promise<string> {
-      let index = await fetch(`${url}/`)
-      let html = await index.text()
-      if (html.includes('__vite_is_fallback_page__')) {
-        throw new Error('Bundling still in progress')
-      }
-
-      let sources = [
-        ...html.matchAll(/<script[^>]*\ssrc="([^"]+)"/g),
-        ...html.matchAll(/<link[^>]*\srel="stylesheet"[^>]*\shref="([^"]+)"/g),
-      ].map((match) => match[1])
-      if (sources.length === 0) throw new Error(`No scripts or stylesheets found in:\n\n${html}`)
-
-      let contents = await Promise.all(
-        sources.map(async (src) => {
-          let response = await fetch(new URL(src, `${url}/`))
-          return await response.text()
-        }),
-      )
-      return contents.join('\n')
-    }
-
-    await retryAssertion(
-      async () => {
-        let styles = await fetchBundledStyles()
-        expect(styles).toContain(candidate`underline`)
-        expect(styles).toContain(candidate`flex`)
-      },
-      { timeout: 10_000, delay: 100 },
-    )
-
-    // Edit a module file and a manually `@source`d file. Without a connected
-    // HMR websocket client (this test only uses HTTP fetches), a file change
-    // does not trigger an eager rebuild — it only marks the bundle as stale,
-    // and the next fetch kicks off the rebuild. So poll with fetches without
-    // touching the files again: rewriting would re-mark the bundle stale right
-    // before each fetch and the rebuild could never be observed.
-    await fs.write(
-      'project-a/index.html',
-      html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="underline m-2">Hello, world!</div>
-        </body>
-      `,
-    )
-
-    await fs.write('project-b/src/index.html', html`
-      <div class="flex font-bold" />
-    `)
-
-    try {
-      await retryAssertion(
-        async () => {
-          let styles = await fetchBundledStyles()
-          expect(styles).toContain(candidate`underline`)
-          expect(styles).toContain(candidate`flex`)
-          expect(styles).toContain(candidate`m-2`)
-          expect(styles).toContain(candidate`font-bold`)
-        },
-        { timeout: 15_000, delay: 100 },
-      )
-    } catch (error) {
-      // If rolldown's watcher delivered any file event, the updates were
-      // genuinely dropped somewhere along the way — a real failure.
-      if (watcherAlive) throw error
-
-      // Otherwise the watcher never delivered a single event, so the updates
-      // can never be observed no matter how long we wait — an upstream
-      // rolldown bug on some CI machines, not a plugin regression. The crash
-      // regression this test guards is still covered: `hotUpdate` is driven
-      // by Vite's own (working) chokidar watcher and asserted via
-      // `pluginErrors` below.
-      //
-      // Skipping is only sound while the server still healthily serves the
-      // original bundle. If it stopped serving (crashed, or wedged on the
-      // fallback page), that's real breakage a silent watcher must not mask.
-      console.log(error)
-      let styles = await fetchBundledStyles()
-      expect(styles).toContain(candidate`underline`)
-      expect(styles).toContain(candidate`flex`)
-      console.warn(
-        'Skipping update assertions: rolldown’s file watcher delivered no events on this machine.',
-      )
-    }
-
-    expect(pluginErrors).toEqual([])
-  },
-)
diff --git a/integrations/vite/config.test.ts b/integrations/vite/config.test.ts
index 0ac68f5e9..3bf560e07 100644
--- a/integrations/vite/config.test.ts
+++ b/integrations/vite/config.test.ts
@@ -12,7 +12,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -76,7 +76,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -140,7 +140,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -219,7 +219,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
diff --git a/integrations/vite/css-modules.test.ts b/integrations/vite/css-modules.test.ts
index a680ab9b7..668281cb4 100644
--- a/integrations/vite/css-modules.test.ts
+++ b/integrations/vite/css-modules.test.ts
@@ -14,8 +14,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
diff --git a/integrations/vite/html-style-blocks.test.ts b/integrations/vite/html-style-blocks.test.ts
index 22bb91d78..4a86f96dc 100644
--- a/integrations/vite/html-style-blocks.test.ts
+++ b/integrations/vite/html-style-blocks.test.ts
@@ -12,7 +12,7 @@ test(
           },
           "devDependencies": {
             "@tailwindcss/vite": "workspace:^",
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
diff --git a/integrations/vite/ignored-packages.test.ts b/integrations/vite/ignored-packages.test.ts
index 1efa9dc61..f7f85ff14 100644
--- a/integrations/vite/ignored-packages.test.ts
+++ b/integrations/vite/ignored-packages.test.ts
@@ -11,7 +11,7 @@ const WORKSPACE = {
         "tailwindcss": "workspace:^"
       },
       "devDependencies": {
-        "vite": "^7"
+        "vite": "^6"
       }
     }
   `,
diff --git a/integrations/vite/index.test.ts b/integrations/vite/index.test.ts
index c346f8e37..4c64f220e 100644
--- a/integrations/vite/index.test.ts
+++ b/integrations/vite/index.test.ts
@@ -7,7 +7,6 @@ import {
   html,
   js,
   json,
-  jsx,
   retryAssertion,
   test,
   ts,
@@ -34,8 +33,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
@@ -111,8 +110,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
@@ -294,113 +293,6 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
     },
   )
 
-  // https://github.com/tailwindlabs/tailwindcss/issues/20346
-  test(
-    'dev mode + symlinked `@source` files pick up changes to the real file',
-    {
-      fs: {
-        'package.json': json`{}`,
-        'pnpm-workspace.yaml': yaml`
-          #
-          packages:
-            - project-a
-            - packages/*
-        `,
-        'project-a/package.json': txt`
-          {
-            "type": "module",
-            "dependencies": {
-              "@tailwindcss/vite": "workspace:^",
-              "repro-package": "workspace:*",
-              "tailwindcss": "workspace:^"
-            },
-            "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
-            }
-          }
-        `,
-        'project-a/vite.config.ts': ts`
-          import tailwindcss from '@tailwindcss/vite'
-          import { defineConfig } from 'vite'
-
-          export default defineConfig({
-            css: ${transformer === 'postcss' ? '{}' : "{ transformer: 'lightningcss' }"},
-            build: { cssMinify: false },
-            plugins: [tailwindcss()],
-          })
-        `,
-        'project-a/index.html': html`
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body>
-            <div class="underline">Hello, world!</div>
-          </body>
-        `,
-
-        // The `@source` points through the `node_modules` symlink that pnpm
-        // creates for the workspace package. Vite's file watcher ignores
-        // `node_modules` by default, so the symlinked path can not be watched.
-        // The real file (in `packages/repro-package`) has to be watched
-        // instead.
-        'project-a/src/index.css': css`
-          @reference 'tailwindcss/theme';
-          @import 'tailwindcss/utilities';
-          @source '../node_modules/repro-package/source.html';
-        `,
-        'packages/repro-package/package.json': json`
-          {
-            "name": "repro-package",
-            "private": true,
-            "version": "1.0.0"
-          }
-        `,
-        'packages/repro-package/source.html': html`
-          <div class="content-['v1']">
-            Hello, world!
-          </div>
-        `,
-      },
-    },
-    async ({ root, spawn, fs, expect }) => {
-      let process = await spawn('pnpm vite dev', {
-        cwd: path.join(root, 'project-a'),
-      })
-      await process.onStdout((m) => m.includes('ready in'))
-
-      let url = ''
-      await process.onStdout((m) => {
-        let match = /Local:\s*(http.*)\//.exec(m)
-        if (match) url = match[1]
-        return Boolean(url)
-      })
-
-      await retryAssertion(async () => {
-        let styles = await fetchStyles(url, '/index.html')
-        expect(styles).toContain(candidate`underline`)
-        expect(styles).toContain(candidate`content-['v1']`)
-      })
-
-      await retryAssertion(async () => {
-        // Changes to the real file (behind the symlink) should be picked up
-        await fs.write(
-          'packages/repro-package/source.html',
-          html`
-            <div class="content-['v1'] content-['v2']">
-              Hello, world!
-            </div>
-          `,
-        )
-
-        let styles = await fetchStyles(url)
-        expect(styles).toContain(candidate`underline`)
-        expect(styles).toContain(candidate`content-['v1']`)
-        expect(styles).toContain(candidate`content-['v2']`)
-      })
-    },
-  )
-
   test(
     'watch mode',
     {
@@ -419,8 +311,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
@@ -580,352 +472,6 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
     },
   )
 
-  describe.each([['^6'], ['7.0.8'], ['7.1.12'], ['7.3.1'], ['8.0.0']])(
-    'Using Vite %s',
-    (version) => {
-      test(
-        'external source file changes update the CSS',
-        {
-          fs: {
-            'package.json': json`{}`,
-            'pnpm-workspace.yaml': yaml`
-              #
-              packages:
-                - project-a
-            `,
-            'project-a/package.json': json`
-            {
-              "type": "module",
-              "dependencies": {
-                "@tailwindcss/vite": "workspace:^",
-                "tailwindcss": "workspace:^"
-              },
-              "devDependencies": {
-                ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-                "vite": "${version}"
-              }
-            }
-          `,
-            'project-a/vite.config.ts': ts`
-              import fs from 'node:fs'
-              import path from 'node:path'
-              import tailwindcss from '@tailwindcss/vite'
-              import { defineConfig } from 'vite'
-
-              export default defineConfig({
-                css: ${transformer === 'postcss' ? '{}' : "{ transformer: 'lightningcss' }"},
-                build: { cssMinify: false },
-                plugins: [tailwindcss()],
-                logLevel: 'info',
-              })
-            `,
-            'project-a/index.html': html`
-              <html>
-                <head>
-                  <link rel="stylesheet" href="./src/index.css" />
-                </head>
-                <body>
-                  <div id="app"></div>
-                  <script type="module" src="./src/main.ts"></script>
-                </body>
-              </html>
-            `,
-            'project-a/src/main.ts': jsx`import { classes } from './app'`,
-            'project-a/src/app.ts': jsx`export let classes = "content-['project-a/src/app.ts']"`,
-            'project-a/src/index.css': css`
-              @import 'tailwindcss';
-              @source '../../project-b/**/*.php';
-            `,
-            'project-b/src/index.php': html`
-              <div
-                class="content-['project-b/src/index.php']"
-              ></div>
-            `,
-          },
-        },
-        async ({ root, spawn, fs, expect }) => {
-          let process = await spawn('pnpm vite dev --debug hmr', {
-            cwd: path.join(root, 'project-a'),
-          })
-          await process.onStdout((m) => m.includes('ready in'))
-
-          let url = ''
-          await process.onStdout((m) => {
-            let match = /Local:\s*(http.*)\//.exec(m)
-            if (match) url = match[1]
-            return Boolean(url)
-          })
-
-          await retryAssertion(async () => {
-            let styles = await fetchStyles(url, '/index.html')
-            expect(styles).toContain(candidate`content-['project-b/src/index.php']`)
-          })
-
-          // Flush all messages so that we can be sure the next messages are
-          // from the file changes we're about to make
-          process.flush()
-
-          // Changing an external .php file hot-updates the generated CSS
-          {
-            await fs.write(
-              'project-b/src/index.php',
-              txt`<div class="content-['updated:project-b/src/index.php']"></div>`,
-            )
-
-            // On Vite < 7.1, Vite itself hard-invalidates watched files that
-            // aren't part of the module graph and reloads the page.
-            //
-            // On newer versions nothing reloads the page: the CSS hot-updates
-            // through the regular pipeline because the changed file is a
-            // watch dependency of the CSS root.
-            //
-            // Reloading the page for external template changes is the
-            // responsibility of the backend integration (e.g. `laravel-vite-plugin`'s `refresh` option, or `vite-plugin-full-reload`).
-            //
-            // https://github.com/tailwindlabs/tailwindcss/issues/20411
-            if (version === '^6' || version === '7.0.8') {
-              await process.onStdout((m) => m.includes('page reload') && m.includes('index.php'))
-            } else {
-              await process.onStdout((m) => m.includes('hmr update') && m.includes('index.css'))
-            }
-
-            // Ensure the styles were regenerated with the new content
-            let styles = await fetchStyles(url, '/index.html')
-            expect(styles).toContain(candidate`content-['updated:project-b/src/index.php']`)
-          }
-        },
-      )
-    },
-  )
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/20320
-  // https://github.com/tailwindlabs/tailwindcss/issues/19903
-  test(
-    'editing scanned files that Vite can process as modules does not trigger a full reload',
-    {
-      fs: {
-        'package.json': json`{}`,
-        'pnpm-workspace.yaml': yaml`
-          #
-          packages:
-            - project-a
-        `,
-        'project-a/package.json': json`
-          {
-            "type": "module",
-            "dependencies": {
-              "@tailwindcss/vite": "workspace:^",
-              "tailwindcss": "workspace:^"
-            },
-            "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^8"
-            }
-          }
-        `,
-        'project-a/vite.config.ts': ts`
-          import fs from 'node:fs'
-          import path from 'node:path'
-          import tailwindcss from '@tailwindcss/vite'
-          import { defineConfig } from 'vite'
-
-          export default defineConfig({
-            css: ${transformer === 'postcss' ? '{}' : "{ transformer: 'lightningcss' }"},
-            build: { cssMinify: false },
-            plugins: [
-              tailwindcss(),
-              {
-                // A plugin that processes a custom file type into a JS
-                // module, similar to e.g. \`.vue\` or \`.svelte\` files
-                name: 'custom-file-type',
-                transform(code, id) {
-                  if (id.endsWith('.custom')) {
-                    return { code: 'export default ' + JSON.stringify(code), map: null }
-                  }
-                },
-              },
-              {
-                // Log all HMR payloads to a file so the test can assert on
-                // them
-                name: 'hmr-wiretap',
-                configureServer(server) {
-                  let logFile = path.resolve('hmr.log')
-                  fs.writeFileSync(logFile, '')
-                  for (let environment of Object.values(server.environments)) {
-                    let send = environment.hot.send.bind(environment.hot)
-                    environment.hot.send = (payload) => {
-                      fs.appendFileSync(logFile, JSON.stringify(payload) + '\\n')
-                      return send(payload)
-                    }
-                  }
-                },
-              },
-            ],
-          })
-        `,
-        'project-a/index.html': html`
-          <html>
-            <head>
-              <link rel="stylesheet" href="./src/index.css" />
-            </head>
-            <body>
-              <div id="app"></div>
-              <script type="module" src="./src/main.ts"></script>
-            </body>
-          </html>
-        `,
-        'project-a/src/main.ts': ts`
-          import compA from './comp-a.custom'
-          import snippet from './snippet.php?raw'
-          console.log(compA, snippet)
-        `,
-        'project-a/src/snippet.php': html`
-          <div
-            class="content-['src/snippet.php']"
-          ></div>
-        `,
-        'project-a/src/comp-a.custom': html`
-          <div
-            class="content-['src/comp-a.custom']"
-          ></div>
-        `,
-        'project-a/src/comp-b.custom': html`
-          <div
-            class="content-['src/comp-b.custom']"
-          ></div>
-        `,
-        'project-a/src/lazy.tsx': jsx`
-          export default function Lazy() {
-            return <div className="content-['src/lazy.tsx']" />
-          }
-        `,
-        'project-a/src/unimported.css': css`
-          .unimported {
-            color: red;
-          }
-        `,
-        'project-a/src/index.css': css`
-          @import 'tailwindcss';
-          @source '../../project-b/**/*.php';
-        `,
-        'project-b/src/index.php': html`
-          <div
-            class="content-['project-b/src/index.php']"
-          ></div>
-        `,
-      },
-    },
-    async ({ root, spawn, fs, expect }) => {
-      let process = await spawn('pnpm vite dev', {
-        cwd: path.join(root, 'project-a'),
-      })
-      await process.onStdout((m) => m.includes('ready in'))
-
-      let url = ''
-      await process.onStdout((m) => {
-        let match = /Local:\s*(http.*)\//.exec(m)
-        if (match) url = match[1]
-        return Boolean(url)
-      })
-
-      await retryAssertion(async () => {
-        let styles = await fetchStyles(url, '/index.html')
-        expect(styles).toContain(candidate`content-['src/lazy.tsx']`)
-        expect(styles).toContain(candidate`content-['src/comp-b.custom']`)
-        expect(styles).toContain(candidate`content-['project-b/src/index.php']`)
-      })
-
-      // Load `main.ts`, `comp-a.custom`, and `snippet.php?raw` as real
-      // modules, like a browser visiting the page would
-      await fetch(`${url}/src/main.ts`)
-      await fetch(`${url}/src/comp-a.custom?import`)
-      await fetch(`${url}/src/snippet.php?raw`)
-
-      // Changing a scanned `.tsx` file that is not part of the module graph
-      // (e.g. a lazily-loaded route that hasn't been visited yet) should not
-      // trigger a full reload, but new classes should still apply
-      //
-      // https://github.com/tailwindlabs/tailwindcss/issues/20320
-      {
-        await fs.write(
-          'project-a/src/lazy.tsx',
-          jsx`
-            export default function Lazy() {
-              return <div className="content-['updated:src/lazy.tsx']" />
-            }
-          `,
-        )
-
-        await retryAssertion(async () => {
-          let styles = await fetchStyles(url, '/index.html')
-          expect(styles).toContain(candidate`content-['updated:src/lazy.tsx']`)
-        })
-      }
-
-      // The same holds for a custom file type as long as some file of the
-      // same type was processed as a module before
-      {
-        await fs.write(
-          'project-a/src/comp-b.custom',
-          html`<div class="content-['updated:src/comp-b.custom']"></div>`,
-        )
-
-        await retryAssertion(async () => {
-          let styles = await fetchStyles(url, '/index.html')
-          expect(styles).toContain(candidate`content-['updated:src/comp-b.custom']`)
-        })
-      }
-
-      // Changing a scanned stylesheet that is not part of the module graph
-      // (e.g. a component stylesheet that a framework plugin compiles into
-      // the component) should not trigger a full reload either
-      //
-      // https://github.com/tailwindlabs/tailwindcss/issues/19903
-      {
-        let updates = (await fs.read('project-a/hmr.log')).split('"type":"update"').length
-
-        await fs.write(
-          'project-a/src/unimported.css',
-          css`
-            .unimported {
-              color: blue;
-            }
-          `,
-        )
-
-        // Wait until the change was handled and an update was pushed
-        await retryAssertion(async () => {
-          let log = await fs.read('project-a/hmr.log')
-          expect(log.split('"type":"update"').length).toBeGreaterThan(updates)
-        })
-      }
-
-      // Changing an external file (e.g. a PHP template) hot-updates the
-      // generated CSS but does not trigger a full reload either. Reloading the
-      // page for external template changes is the responsibility of the backend
-      // integration (e.g. `laravel-vite-plugin`'s `refresh` option, or
-      // `vite-plugin-full-reload`).
-      //
-      // https://github.com/tailwindlabs/tailwindcss/issues/20411
-      {
-        let updates = (await fs.read('project-a/hmr.log')).split('"type":"update"').length
-
-        await fs.write(
-          'project-b/src/index.php',
-          html`<div class="content-['updated:project-b/src/index.php']"></div>`,
-        )
-
-        await retryAssertion(async () => {
-          let log = await fs.read('project-a/hmr.log')
-          expect(log.split('"type":"update"').length).toBeGreaterThan(updates)
-        })
-
-        let styles = await fetchStyles(url, '/index.html')
-        expect(styles).toContain(candidate`content-['updated:project-b/src/index.php']`)
-      }
-    },
-  )
-
   test(
     `source(none) disables looking at the module graph`,
     {
@@ -944,8 +490,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
@@ -1030,8 +576,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
@@ -1132,8 +678,8 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+              "vite": "^6"
             }
           }
         `,
@@ -1178,92 +724,12 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
     async ({ root, fs, exec, expect }) => {
       await expect(() =>
         exec('pnpm vite build', { cwd: path.join(root, 'project-a') }, { ignoreStdErr: true }),
-      ).rejects.toThrow('The `source(../i-do-not-exist)` does not exist')
+      ).rejects.toThrowError('The `source(../i-do-not-exist)` does not exist')
 
       let files = await fs.glob('project-a/dist/**/*.css')
       expect(files).toHaveLength(0)
     },
   )
-
-  test(
-    'source(…) and `@source` are relative to the file they are in',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "type": "module",
-            "dependencies": {
-              "@tailwindcss/vite": "workspace:^",
-              "tailwindcss": "workspace:^"
-            },
-            "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-              "vite": "^7"
-            }
-          }
-        `,
-        'vite.config.ts': ts`
-          import tailwindcss from '@tailwindcss/vite'
-          import { defineConfig } from 'vite'
-
-          export default defineConfig({
-            css: ${transformer === 'postcss' ? '{}' : "{ transformer: 'lightningcss' }"},
-            build: { cssMinify: false },
-            plugins: [tailwindcss()],
-          })
-        `,
-        'index.html': html`
-          <head>
-            <link rel="stylesheet" href="/index.css" />
-          </head>
-          <body></body>
-        `,
-        'index.css': css` @import './project-a/src/index.css'; `,
-
-        'project-a/src/index.css': css`
-          /* Run auto-content detection in ../../project-b */
-          @import 'tailwindcss/utilities' source('../../project-b');
-
-          /* Explicitly using node_modules in the @source allows git ignored folders */
-          @source '../../project-c';
-        `,
-
-        // Project A is the current folder, but we explicitly configured
-        // `source(project-b)`, therefore project-a should not be included in
-        // the output.
-        'project-a/src/index.html': html`
-          <div
-            class="content-['SHOULD-NOT-EXIST-IN-OUTPUT'] content-['project-a/src/index.html']"
-          ></div>
-        `,
-
-        // Project B is the configured `source(…)`, therefore auto source
-        // detection should include known extensions and folders in the output.
-        'project-b/src/index.html': html`
-          <div
-            class="content-['project-b/src/index.html']"
-          ></div>
-        `,
-
-        // Project C should apply auto source detection, therefore known
-        // extensions and folders should be included in the output.
-        'project-c/src/index.html': html`
-          <div
-            class="content-['project-c/src/index.html']"
-          ></div>
-        `,
-      },
-    },
-    async ({ fs, exec, spawn, root, expect }) => {
-      await exec('pnpm vite build', { cwd: root })
-
-      let content = await fs.dumpFiles('./dist/assets/*.css')
-
-      expect(content).not.toContain(candidate`content-['project-a/src/index.html']`)
-      expect(content).toContain(candidate`content-['project-b/src/index.html']`)
-      expect(content).toContain(candidate`content-['project-c/src/index.html']`)
-    },
-  )
 })
 
 test(
@@ -1278,7 +744,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -1350,7 +816,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -1413,7 +879,7 @@ test(
             "@tailwindcss/vite": "workspace:^",
             "tailwindcss": "workspace:^",
             "plotly.js": "^3",
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -1432,14 +898,6 @@ test(
         </head>
       `,
       'src/index.js': js`import Plotly from 'plotly.js/lib/core'`,
-
-      // `plotly.js` pulls in `es5-ext`, which has a build script. As of pnpm
-      // v10, build scripts only run when explicitly allowed.
-      'pnpm-workspace.yaml': yaml`
-        #
-        allowBuilds:
-          es5-ext: true
-      `,
     },
   },
   async ({ exec, expect, fs }) => {
@@ -1456,271 +914,3 @@ test(
 function firstLine(str: string) {
   return str.split('\n')[0]
 }
-
-test(
-  'optimize option: disabled',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^7"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss({ optimize: false })],
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="focus:text-[black]">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ exec, expect, fs }) => {
-    await exec('pnpm vite build')
-
-    // Should not be minified when optimize is disabled
-    expect((await fs.dumpFiles('dist/**/*.css')).replace(/-([-_a-zA-Z0-9]*?)\.css/g, '-<hash>.css'))
-      .toMatchInlineSnapshot(`
-        "
-        --- dist/assets/index-<hash>.css ---
-        .focus\\:text-\\[black\\]:focus {
-          color: black;
-        }
-        "
-      `)
-  },
-)
-
-test(
-  'optimize option: enabled with minify disabled',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^7"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss({ optimize: { minify: false } })],
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="hover:text-[black]">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ exec, expect, fs }) => {
-    await exec('pnpm vite build')
-
-    expect((await fs.dumpFiles('dist/**/*.css')).replace(/-([-_a-zA-Z0-9]*?)\.css/g, '-<hash>.css'))
-      .toMatchInlineSnapshot(`
-      "
-      --- dist/assets/index-<hash>.css ---
-      @media (hover: hover) {
-        .hover\\:text-\\[black\\]:hover {
-          color: #000;
-        }
-      }
-      "
-    `)
-  },
-)
-
-test(
-  `the plugin works when using the environment API`,
-  {
-    fs: {
-      'package.json': txt`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^7"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          plugins: [tailwindcss()],
-          builder: {},
-          environments: {
-            server: {
-              build: {
-                cssMinify: false,
-                emitAssets: true,
-                rollupOptions: { input: './src/server.ts' },
-              },
-            },
-          },
-        })
-      `,
-      // Has to exist or the build fails
-      'index.html': html`
-        <div class="content-['index.html']"></div>
-      `,
-      'src/server.ts': js`
-        // Import the stylesheet in the server build
-        import a from './index.css?url'
-        console.log(a)
-      `,
-      'src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ root, fs, exec, expect }) => {
-    await exec('pnpm vite build', { cwd: root })
-
-    let files = await fs.glob('dist/**/*.css')
-    expect(files).toHaveLength(1)
-    let [filename] = files[0]
-
-    await fs.expectFileToContain(filename, [candidate`content-['index.html']`])
-  },
-)
-
-// https://github.com/tailwindlabs/tailwindcss/issues/17532
-test(
-  'deleting a file should not crash Vite',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "6.2.5"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          plugins: [tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <body>
-          <div id="app" class="underline"></div>
-          <script type="module" src="./src/main.js"></script>
-        </body>
-      `,
-      'src/index.css': css`@import 'tailwindcss';`,
-      'src/main.js': js`
-        import iconUrl from './assets/icon.svg?url'
-        import './index.css'
-
-        document.querySelector('#app').innerHTML = iconUrl
-      `,
-      'src/assets/icon.svg': html`
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1 1">
-          <rect class="fill-red-500" width="1" height="1" />
-        </svg>
-       `,
-    },
-  },
-  async ({ fs, spawn, expect }) => {
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let [main, css] = await Promise.all([
-        fetch(`${url}/src/main.js`).then((r) => r.text()),
-        fetch(`${url}/src/index.css`).then((r) => r.text()),
-      ])
-
-      expect(main).toContain('/src/assets/icon.svg?import&url')
-      expect(main).toContain('/src/index.css')
-      expect(css).toContain('.fill-red-500')
-    })
-
-    process.flush()
-
-    let unexpectedError = process.onStderr((m) => {
-      return /error|crash|panic/i.test(m)
-    })
-
-    await fs.write(
-      'src/main.js',
-      js`
-        import './index.css'
-        document.querySelector('#app').innerHTML = 'Hello World'
-      `,
-    )
-
-    await fs.delete('src/assets/icon.svg')
-
-    let result = await Promise.race([
-      unexpectedError.then(() => 'stderr'),
-      new Promise((resolve) => setTimeout(() => resolve('timeout'), 500)),
-    ])
-
-    expect(result).toBe('timeout')
-
-    await retryAssertion(async () => {
-      let response = await fetch(`${url}/src/index.css?t=${Date.now()}`)
-      expect(response.status).toBe(200)
-    })
-  },
-)
diff --git a/integrations/vite/multi-root.test.ts b/integrations/vite/multi-root.test.ts
index 4020aff0f..d1a1337a4 100644
--- a/integrations/vite/multi-root.test.ts
+++ b/integrations/vite/multi-root.test.ts
@@ -12,7 +12,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -96,7 +96,7 @@ test(
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
diff --git a/integrations/vite/nuxt.test.ts b/integrations/vite/nuxt.test.ts
index 20f367020..ab14628c7 100644
--- a/integrations/vite/nuxt.test.ts
+++ b/integrations/vite/nuxt.test.ts
@@ -1,15 +1,4 @@
-import {
-  candidate,
-  css,
-  fetchStyles,
-  getRandomPort,
-  html,
-  json,
-  retryAssertion,
-  test,
-  ts,
-  yaml,
-} from '../utils'
+import { candidate, css, fetchStyles, html, json, retryAssertion, test, ts } from '../utils'
 
 const SETUP = {
   fs: {
@@ -18,18 +7,12 @@ const SETUP = {
         "type": "module",
         "dependencies": {
           "@tailwindcss/vite": "workspace:^",
-          "nuxt": "3.16.0",
-          "nitropack": "2.11.0",
+          "nuxt": "^3.13.1",
           "tailwindcss": "workspace:^",
           "vue": "latest"
         }
       }
     `,
-    'pnpm-workspace.yaml': yaml`
-      #
-      overrides:
-        nuxi: 3.28.0
-    `,
     'nuxt.config.ts': ts`
       import tailwindcss from '@tailwindcss/vite'
 
@@ -95,8 +78,7 @@ test('build', SETUP, async ({ spawn, exec, expect }) => {
   await exec('pnpm nuxt build')
   // The Nuxt preview server does not automatically assign a free port if 3000
   // is taken, so we use a random port instead.
-  let port = await getRandomPort()
-  let process = await spawn(`pnpm nuxt preview --port ${port}`, {
+  let process = await spawn(`pnpm nuxt preview --port 8724`, {
     env: {
       TEST: 'false',
       NODE_ENV: 'development',
diff --git a/integrations/vite/other-transforms.test.ts b/integrations/vite/other-transforms.test.ts
index d56396065..b1cb5819c 100644
--- a/integrations/vite/other-transforms.test.ts
+++ b/integrations/vite/other-transforms.test.ts
@@ -13,8 +13,8 @@ function createSetup(transformer: 'postcss' | 'lightningcss') {
             "tailwindcss": "workspace:^"
           },
           "devDependencies": {
-            ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
-            "vite": "^7"
+            ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
+            "vite": "^6"
           }
         }
       `,
diff --git a/integrations/vite/preact.test.ts b/integrations/vite/preact.test.ts
deleted file mode 100644
index 8e4deec2b..000000000
--- a/integrations/vite/preact.test.ts
+++ /dev/null
@@ -1,165 +0,0 @@
-import { candidate, css, fetchStyles, html, json, retryAssertion, test, ts, txt } from '../utils'
-
-test(
-  'dev mode',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "preact": "^10"
-          },
-          "devDependencies": {
-            "@preact/preset-vite": "^2",
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^",
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import fs from 'node:fs'
-        import path from 'node:path'
-        import preact from '@preact/preset-vite'
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          plugins: [
-            tailwindcss(),
-            preact(),
-            {
-              // Log all HMR payloads to a file so the test can assert on them
-              name: 'hmr-wiretap',
-              configureServer(server) {
-                let logFile = path.resolve('hmr.log')
-                fs.writeFileSync(logFile, '')
-                for (let environment of Object.values(server.environments)) {
-                  let send = environment.hot.send.bind(environment.hot)
-                  environment.hot.send = (payload) => {
-                    fs.appendFileSync(logFile, JSON.stringify(payload) + '\\n')
-                    return send(payload)
-                  }
-                }
-              },
-            },
-          ],
-        })
-      `,
-      'index.html': html`
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body>
-            <div id="app"></div>
-            <script type="module" src="./src/main.tsx"></script>
-          </body>
-        </html>
-      `,
-      'src/main.tsx': ts`
-        import { render } from 'preact'
-        import { App } from './app'
-
-        render(<App />, document.getElementById('app')!)
-      `,
-      'src/app.tsx': ts`
-        import { useState } from 'preact/hooks'
-
-        export function App() {
-          const [count, setCount] = useState(0)
-          return (
-            <button className="underline" onClick={() => setCount((c) => c + 1)}>
-              Count: {count}
-            </button>
-          )
-        }
-      `,
-      'src/index.css': css`@import 'tailwindcss';`,
-    },
-  },
-  async ({ fs, spawn, expect }) => {
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url)
-      expect(styles).toContain(candidate`underline`)
-    })
-
-    // Load the component modules, like a browser visiting the page would
-    await fetch(`${url}/src/main.tsx`)
-    await fetch(`${url}/src/app.tsx`)
-
-    // Editing a component keeps HMR intact: new classes are delivered through
-    // a regular update, not a full page reload (which would lose all state)
-    {
-      await fs.write(
-        'src/app.tsx',
-        ts`
-          import { useState } from 'preact/hooks'
-
-          export function App() {
-            const [count, setCount] = useState(0)
-            return (
-              <button className="underline flex" onClick={() => setCount((c) => c + 1)}>
-                Count: {count}
-              </button>
-            )
-          }
-        `,
-      )
-
-      await retryAssertion(async () => {
-        let styles = await fetchStyles(url)
-        expect(styles).toContain(candidate`underline`)
-        expect(styles).toContain(candidate`flex`)
-      })
-      expect(await fs.read('hmr.log')).toContain('"type":"update"')
-      expect(await fs.read('hmr.log')).not.toContain('full-reload')
-    }
-
-    // Changing a scanned file that is not part of the module graph (e.g.
-    // `package.json`, which package managers and other tooling write to while
-    // the dev server is running) should not trigger a full reload either —
-    // that would destroy client state. New candidates should still be picked
-    // up because the file is a watch dependency of the CSS root, so the CSS
-    // hot-updates through Vite's regular pipeline.
-    //
-    // https://github.com/tailwindlabs/tailwindcss/issues/20411
-    {
-      await fs.write(
-        'package.json',
-        txt`
-          {
-            "type": "module",
-            "description": "content-['package.json']",
-            "dependencies": {
-              "preact": "^10"
-            },
-            "devDependencies": {
-              "@preact/preset-vite": "^2",
-              "@tailwindcss/vite": "workspace:^",
-              "tailwindcss": "workspace:^",
-              "vite": "^8"
-            }
-          }
-        `,
-      )
-
-      await retryAssertion(async () => {
-        let styles = await fetchStyles(url)
-        expect(styles).toContain(candidate`content-['package.json']`)
-      })
-      expect(await fs.read('hmr.log')).not.toContain('full-reload')
-    }
-  },
-)
diff --git a/integrations/vite/qwik.test.ts b/integrations/vite/qwik.test.ts
deleted file mode 100644
index 42db6563a..000000000
--- a/integrations/vite/qwik.test.ts
+++ /dev/null
@@ -1,100 +0,0 @@
-import { candidate, css, fetchStyles, json, retryAssertion, test, ts } from '../utils'
-
-test(
-  'dev mode',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@builder.io/qwik": "^1",
-            "@builder.io/qwik-city": "^1",
-            "vite": "^5",
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import { defineConfig } from 'vite'
-        import { qwikVite } from '@builder.io/qwik/optimizer'
-        import { qwikCity } from '@builder.io/qwik-city/vite'
-        import tailwindcss from '@tailwindcss/vite'
-
-        export default defineConfig(() => {
-          return {
-            plugins: [tailwindcss(), qwikCity(), qwikVite()],
-          }
-        })
-      `,
-      'src/root.tsx': ts`
-        import { component$ } from '@builder.io/qwik'
-        import { QwikCityProvider, RouterOutlet } from '@builder.io/qwik-city'
-
-        import './global.css'
-
-        export default component$(() => {
-          return (
-            <QwikCityProvider>
-              <head></head>
-              <body>
-                <RouterOutlet />
-              </body>
-            </QwikCityProvider>
-          )
-        })
-      `,
-      'src/global.css': css`@import 'tailwindcss/utilities.css';`,
-      'src/entry.ssr.tsx': ts`
-        import { renderToStream, type RenderToStreamOptions } from '@builder.io/qwik/server'
-        import Root from './root'
-
-        export default function (opts: RenderToStreamOptions) {
-          return renderToStream(<Root />, opts)
-        }
-      `,
-      'src/routes/index.tsx': ts`
-        import { component$ } from '@builder.io/qwik'
-
-        export default component$(() => {
-          return <h1 class="underline">Hello World!</h1>
-        })
-      `,
-    },
-  },
-  async ({ fs, spawn, expect }) => {
-    let process = await spawn('pnpm vite --mode ssr')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      console.log(m)
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`underline`)
-    })
-
-    await retryAssertion(async () => {
-      await fs.write(
-        'src/routes/index.tsx',
-        ts`
-          import { component$ } from '@builder.io/qwik'
-
-          export default component$(() => {
-            return <h1 class="underline flex">Hello World!</h1>
-          })
-        `,
-      )
-
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`underline`)
-      expect(css).toContain(candidate`flex`)
-    })
-  },
-)
diff --git a/integrations/vite/react-router.test.ts b/integrations/vite/react-router.test.ts
index 98b0c928d..5b9574fd6 100644
--- a/integrations/vite/react-router.test.ts
+++ b/integrations/vite/react-router.test.ts
@@ -102,101 +102,13 @@ test('dev mode', { fs: WORKSPACE }, async ({ fs, spawn, expect }) => {
   })
 })
 
-test(
-  // cf. https://github.com/remix-run/react-router/blob/00cb4d7b310663b2e84152700c05d3b503005e83/integration/vite-hmr-hdr-test.ts#L311-L318
-  'dev mode, editing a server-only loader dependency triggers HDR instead of a full reload',
-  {
-    fs: {
-      ...WORKSPACE,
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@react-router/dev": "^7",
-            "@react-router/node": "^7",
-            "@react-router/serve": "^7",
-            "@tailwindcss/vite": "workspace:^",
-            "@types/node": "^20",
-            "@types/react-dom": "^19",
-            "@types/react": "^19",
-            "isbot": "^5",
-            "react-dom": "^19",
-            "react-router": "^7",
-            "react": "^19",
-            "tailwindcss": "workspace:^",
-            "vite": "^7"
-          }
-        }
-      `,
-      'app/routes/home.tsx': ts`
-        import type { Route } from './+types/home'
-        import { direct } from '../direct-hdr-dep'
-
-        export async function loader() {
-          return { message: direct }
-        }
-
-        export default function Home({ loaderData }: Route.ComponentProps) {
-          return (
-            <div>
-              <h1 className="font-bold">{loaderData.message}</h1>
-              <input data-testinput />
-            </div>
-          )
-        }
-      `,
-      'app/direct-hdr-dep.ts': ts` export const direct = 'HDR: 0' `,
-    },
-  },
-  async ({ fs, spawn, expect }) => {
-    let process = await spawn('pnpm react-router dev')
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    // check initial state
-    await retryAssertion(async () => {
-      let html = await (await fetch(url)).text()
-      expect(html).toContain('HDR: 0')
-
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`font-bold`)
-    })
-
-    // Flush stdout so we only see messages triggered by the edit below.
-    process.flush()
-
-    // Edit the server-only module. The client environment watches this file
-    // but it only exists in the server module graph. Without the fix, the
-    // Tailwind CSS plugin would trigger a full page reload on the client
-    // instead of letting react-router handle HDR.
-    await fs.write('app/direct-hdr-dep.ts', ts` export const direct = 'HDR: 1' `)
-
-    // check update
-    await retryAssertion(async () => {
-      let html = await (await fetch(url)).text()
-      expect(html).toContain('HDR: 1')
-
-      let css = await fetchStyles(url)
-      expect(css).toContain(candidate`font-bold`)
-    })
-
-    // Assert the client receives an HMR update (not a full page reload).
-    await process.onStdout((m) => m.includes('(client) hmr update'))
-  },
-)
-
 test('build mode', { fs: WORKSPACE }, async ({ spawn, exec, expect }) => {
   await exec('pnpm react-router build')
   let process = await spawn('pnpm react-router-serve ./build/server/index.js')
 
   let url = ''
   await process.onStdout((m) => {
-    let match = /\[react-router-serve\]\s*(http.*) \/?/.exec(m)
+    let match = /\[react-router-serve\]\s*(http.*)\ \/?/.exec(m)
     if (match) url = match[1]
     return url != ''
   })
diff --git a/integrations/vite/resolvers.test.ts b/integrations/vite/resolvers.test.ts
index fc9aca5c7..6072c37da 100644
--- a/integrations/vite/resolvers.test.ts
+++ b/integrations/vite/resolvers.test.ts
@@ -1,661 +1,5 @@
 import { describe } from 'vitest'
-import {
-  candidate,
-  css,
-  fetchStyles,
-  html,
-  js,
-  json,
-  retryAssertion,
-  test,
-  ts,
-  txt,
-  yaml,
-} from '../utils'
-
-test(
-  'resolves tsconfig paths in production build',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'tsconfig.json': json`
-        {
-          "compilerOptions": {
-            "baseUrl": ".",
-            "paths": {
-              "@/*": ["./src/*"]
-            }
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-          resolve: {
-            tsconfigPaths: true,
-          },
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="underline custom-underline">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @import '@/styles/base.css';
-        @plugin '@/plugin.js';
-      `,
-      'src/styles/base.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-      'src/plugin.js': js`
-        export default function ({ addUtilities }) {
-          addUtilities({ '.custom-underline': { 'border-bottom': '1px solid green' } })
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm vite build')
-
-    let files = await fs.glob('dist/**/*.css')
-    expect(files).toHaveLength(1)
-    let [filename] = files[0]
-
-    await fs.expectFileToContain(filename, [candidate`underline`, candidate`custom-underline`])
-  },
-)
-
-test(
-  'resolves tsconfig paths in dev mode',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'tsconfig.json': json`
-        {
-          "compilerOptions": {
-            "baseUrl": ".",
-            "paths": {
-              "@/*": ["./src/*"]
-            }
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-          resolve: {
-            tsconfigPaths: true,
-          },
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="underline custom-underline">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @import '@/styles/base.css';
-        @plugin '@/plugin.js';
-      `,
-      'src/styles/base.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-      'src/plugin.js': js`
-        export default function ({ addUtilities }) {
-          addUtilities({ '.custom-underline': { 'border-bottom': '1px solid green' } })
-        }
-      `,
-    },
-  },
-  async ({ spawn, expect }) => {
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url, '/index.html')
-      expect(styles).toContain(candidate`underline`)
-      expect(styles).toContain(candidate`custom-underline`)
-    })
-  },
-)
-
-test(
-  'resolves at-sign aliases in production build',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-        import { fileURLToPath } from 'node:url'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-          resolve: {
-            alias: [{ find: '@', replacement: fileURLToPath(new URL('.', import.meta.url)) }],
-          },
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="underline custom-underline">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @import '@/src/styles/base.css';
-        @plugin '@/src/plugin.js';
-      `,
-      'src/styles/base.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-      'src/plugin.js': js`
-        export default function ({ addUtilities }) {
-          addUtilities({ '.custom-underline': { 'border-bottom': '1px solid green' } })
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm vite build')
-
-    let files = await fs.glob('dist/**/*.css')
-    expect(files).toHaveLength(1)
-    let [filename] = files[0]
-
-    await fs.expectFileToContain(filename, [candidate`underline`, candidate`custom-underline`])
-  },
-)
-
-test(
-  'resolves package plugins in production build with at-sign aliases',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "tailwind-scrollbar": "^4.0.2",
-            "tailwindcss-motion": "^1.1.1",
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-        import { fileURLToPath } from 'node:url'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-          resolve: {
-            alias: [{ find: '@', replacement: fileURLToPath(new URL('.', import.meta.url)) }],
-          },
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="scrollbar scrollbar-thumb-red-500 motion-preset-fade">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss';
-        @plugin 'tailwind-scrollbar';
-        @plugin 'tailwindcss-motion';
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm vite build')
-
-    let files = await fs.glob('dist/**/*.css')
-    expect(files).toHaveLength(1)
-    let [filename] = files[0]
-
-    await fs.expectFileToContain(filename, [
-      candidate`scrollbar`,
-      candidate`scrollbar-thumb-red-500`,
-      candidate`motion-preset-fade`,
-    ])
-  },
-)
-
-test(
-  'resolves package plugins to JS entries in production build when browser points to CSS',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "plugin-browser-css": "workspace:*",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - packages/*
-      `,
-      'packages/plugin-browser-css/package.json': json`
-        {
-          "name": "plugin-browser-css",
-          "version": "1.0.0",
-          "type": "module",
-          "main": "./index.js",
-          "module": "./index.js",
-          "browser": "./browser.css"
-        }
-      `,
-      'packages/plugin-browser-css/index.js': js`
-        export default function ({ addUtilities }) {
-          addUtilities({ '.browser-css-plugin': { 'border-bottom': '1px solid green' } })
-        }
-      `,
-      'packages/plugin-browser-css/browser.css': css`
-        .should-not-be-loaded-as-a-plugin {
-          display: none;
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body>
-            <div class="browser-css-plugin">Hello, world!</div>
-          </body>
-        </html>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss';
-        @plugin 'plugin-browser-css';
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm vite build')
-
-    let files = await fs.glob('dist/**/*.css')
-    expect(files).toHaveLength(1)
-    let [filename] = files[0]
-
-    await fs.expectFileToContain(filename, [candidate`browser-css-plugin`])
-  },
-)
-
-test(
-  'resolves package plugins to JS entries in dev mode when browser points to CSS',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "plugin-browser-css": "workspace:*",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'pnpm-workspace.yaml': yaml`
-        #
-        packages:
-          - packages/*
-      `,
-      'packages/plugin-browser-css/package.json': json`
-        {
-          "name": "plugin-browser-css",
-          "version": "1.0.0",
-          "type": "module",
-          "main": "./index.js",
-          "module": "./index.js",
-          "browser": "./browser.css"
-        }
-      `,
-      'packages/plugin-browser-css/index.js': js`
-        export default function ({ addUtilities }) {
-          addUtilities({ '.browser-css-plugin': { 'border-bottom': '1px solid green' } })
-        }
-      `,
-      'packages/plugin-browser-css/browser.css': css`
-        .should-not-be-loaded-as-a-plugin {
-          display: none;
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body>
-            <div class="browser-css-plugin">Hello, world!</div>
-          </body>
-        </html>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss';
-        @plugin 'plugin-browser-css';
-      `,
-    },
-  },
-  async ({ spawn, expect }) => {
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url, '/index.html')
-      expect(styles).toContain(candidate`browser-css-plugin`)
-    })
-  },
-)
-
-test(
-  'resolves package plugins in dev mode when package exports CSS files',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "daisyui": "^5",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body>
-            <button class="btn btn-primary">Hello, world!</button>
-          </body>
-        </html>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss';
-        @plugin 'daisyui';
-      `,
-    },
-  },
-  async ({ spawn, expect }) => {
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url, '/index.html')
-      expect(styles).toContain('.btn')
-      expect(styles).toContain('.btn-primary')
-    })
-  },
-)
-
-test(
-  'resolve relative CSS files correctly',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body></body>
-        </html>
-      `,
-      'src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-        @import './themes/glow.css';
-      `,
-      // References a file in the current folder, which names happens to match a
-      // file in the parent folder as well.
-      'src/themes/glow.css': css`@import './entry.css';`,
-      'src/themes/entry.css': css`
-        .do-include-me {
-          color: green;
-        }
-      `,
-
-      // Never rerefenced, so should not be included
-      'src/entry.css': css`
-        .do-not-include-me {
-          color: red;
-        }
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm vite build')
-
-    expect(
-      (await fs.dumpFiles('./dist/**/*.css')).replace(/-([-_a-zA-Z0-9]*?)\.css/g, '-<hash>.css'),
-    ).toMatchInlineSnapshot(`
-      "
-      --- ./dist/assets/index-<hash>.css ---
-      .do-include-me {
-        color: green;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  'resolve relative JS files correctly',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body></body>
-        </html>
-      `,
-      'src/index.css': css`
-        @reference 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-        @import './themes/glow.css';
-      `,
-      // References a file in the current folder, which names happens to match a
-      // file in the parent folder as well.
-      'src/themes/glow.css': css`@plugin "./my-plugin.js";`,
-      'src/themes/my-plugin.js': ts`
-        export default function ({ addBase }) {
-          addBase({ '.do-include-me': { color: 'green' } })
-        }
-      `,
-
-      // Never rerefenced, so should not be included
-      'src/my-plugin.js': css`
-        export default function ({ addBase }) {
-          addBase({ '.do-not-include-me': { 'color': 'red' } })
-        }
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm vite build')
-
-    expect(
-      (await fs.dumpFiles('./dist/**/*.css')).replace(/-([-_a-zA-Z0-9]*?)\.css/g, '-<hash>.css'),
-    ).toMatchInlineSnapshot(`
-        "
-        --- ./dist/assets/index-<hash>.css ---
-        @layer base {
-          .do-include-me {
-            color: green;
-          }
-        }
-        "
-      `)
-  },
-)
+import { candidate, css, fetchStyles, html, js, retryAssertion, test, ts, txt } from '../utils'
 
 describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
   test(
@@ -670,7 +14,7 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
               "vite": "^5.3.5"
             }
           }
@@ -738,7 +82,7 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
               "vite": "^5.3.5"
             }
           }
diff --git a/integrations/vite/source-maps.test.ts b/integrations/vite/source-maps.test.ts
deleted file mode 100644
index fe26d9a7c..000000000
--- a/integrations/vite/source-maps.test.ts
+++ /dev/null
@@ -1,157 +0,0 @@
-import { candidate, css, fetchStyles, html, json, retryAssertion, test, ts } from '../utils'
-
-test(
-  `dev build`,
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "lightningcss": "^1",
-            "vite": "^7"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          plugins: [tailwindcss()],
-          css: {
-            devSourcemap: true,
-          },
-        })
-      `,
-      'index.html': html`
-        <head>
-          <link rel="stylesheet" href="./src/index.css" />
-        </head>
-        <body>
-          <div class="flex">Hello, world!</div>
-        </body>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/utilities';
-        /*  */
-      `,
-    },
-  },
-  async ({ fs, spawn, expect, parseSourceMap }) => {
-    // Source maps only work in development mode in Vite
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    let styles = await retryAssertion(async () => {
-      let styles = await fetchStyles(url, '/index.html')
-
-      // Wait until we have the right CSS
-      expect(styles).toContain(candidate`flex`)
-
-      return styles
-    })
-
-    // Make sure we can find a source map
-    let map = parseSourceMap(styles)
-
-    expect(map.at(1, 0)).toMatchObject({
-      source: null,
-      original: '(none)',
-      generated: '/*! tailwi...',
-    })
-
-    expect(map.at(2, 0)).toMatchObject({
-      source: expect.stringContaining('utilities.css'),
-      original: '@tailwind...',
-      generated: '.flex {...',
-    })
-
-    expect(map.at(3, 2)).toMatchObject({
-      source: expect.stringContaining('utilities.css'),
-      original: '@tailwind...',
-      generated: 'display: f...',
-    })
-
-    expect(map.at(4, 0)).toMatchObject({
-      source: null,
-      original: '(none)',
-      generated: '}...',
-    })
-  },
-)
-
-// https://github.com/tailwindlabs/tailwindcss/issues/19930
-test(
-  'production build without Tailwind roots should not result in source map warnings',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "@tailwindcss/vite": "workspace:^",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "vite": "^7"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import { defineConfig } from 'vite'
-        import tailwindcss from '@tailwindcss/vite'
-
-        export default defineConfig({
-          plugins: [
-            tailwindcss(),
-            {
-              name: 'inspect-source-map-chain',
-              enforce: 'pre',
-              transform(_, id) {
-                if (id.includes('.css')) {
-                  // Force Rollup to collapse the sourcemap chain during this build.
-                  this.getCombinedSourcemap()
-                }
-              },
-            },
-          ],
-          css: {
-            devSourcemap: true,
-          },
-          build: {
-            sourcemap: true,
-          },
-        })
-      `,
-      'index.html': html`
-        <body>
-          <script type="module" src="./src/index.js"></script>
-          <div>Hello, world!</div>
-        </body>
-      `,
-      'src/index.js': ts` import './index.css' `,
-      'src/index.css': css`
-        body {
-          color: red;
-        }
-      `,
-    },
-  },
-  async ({ exec, expect }) => {
-    let output = await exec('pnpm vite build')
-
-    expect(output).not.toContain('Sourcemap is likely to be incorrect')
-  },
-)
diff --git a/integrations/vite/ssr.test.ts b/integrations/vite/ssr.test.ts
index a1d660816..d4d227b8e 100644
--- a/integrations/vite/ssr.test.ts
+++ b/integrations/vite/ssr.test.ts
@@ -1,72 +1,121 @@
-import { describe } from 'vitest'
 import { candidate, css, html, json, test, ts } from '../utils'
 
-describe.each([['^5.3'], ['^6.0'], ['^7'], ['^8']])('Using Vite %s', (version) => {
-  test(
-    `SSR build`,
-    {
-      fs: {
-        'package.json': json`
-          {
-            "type": "module",
-            "dependencies": {
-              "@tailwindcss/vite": "workspace:^",
-              "tailwindcss": "workspace:^"
-            },
-            "devDependencies": {
-              "vite": "${version}"
-            }
+const WORKSPACE = {
+  'index.html': html`
+    <body>
+      <div id="app"></div>
+      <script type="module" src="./src/index.ts"></script>
+    </body>
+  `,
+  'src/index.css': css`@import 'tailwindcss';`,
+  'src/index.ts': ts`
+    import './index.css'
+
+    document.querySelector('#app').innerHTML = \`
+      <div class="underline m-2">Hello, world!</div>
+    \`
+  `,
+  'server.ts': ts`
+    import css from './src/index.css?url'
+
+    document.querySelector('#app').innerHTML = \`
+      <link rel="stylesheet" href="\${css}">
+      <div class="overline m-3">Hello, world!</div>
+    \`
+  `,
+}
+
+test(
+  'Vite 5',
+  {
+    fs: {
+      'package.json': json`
+        {
+          "type": "module",
+          "dependencies": {
+            "@tailwindcss/vite": "workspace:^",
+            "tailwindcss": "workspace:^"
+          },
+          "_comment": "This test uses Vite 5.3 on purpose. Do not upgrade it to Vite 6.",
+          "devDependencies": {
+            "vite": "^5.3"
           }
-        `,
-        'vite.config.ts': ts`
-          import tailwindcss from '@tailwindcss/vite'
-          import { defineConfig } from 'vite'
+        }
+      `,
+      'vite.config.ts': ts`
+        import tailwindcss from '@tailwindcss/vite'
+        import { defineConfig } from 'vite'
 
-          export default defineConfig({
-            build: {
-              cssMinify: false,
-              ssrEmitAssets: true,
-            },
-            plugins: [tailwindcss()],
-          })
-        `,
-        'index.html': html`
-          <body>
-            <div id="app"></div>
-            <script type="module" src="./src/index.ts"></script>
-          </body>
-        `,
-        'src/index.css': css`@import 'tailwindcss';`,
-        'src/index.ts': ts`
-          import './index.css'
-
-          document.querySelector('#app').innerHTML = \`
-            <div class="underline m-2">Hello, world!</div>
-          \`
-        `,
-        'server.ts': ts`
-          import css from './src/index.css?url'
-
-          document.querySelector('#app').innerHTML = \`
-            <link rel="stylesheet" href="\${css}">
-            <div class="overline m-3">Hello, world!</div>
-          \`
-        `,
-      },
+        export default defineConfig({
+          build: {
+            cssMinify: false,
+            ssrEmitAssets: true,
+          },
+          plugins: [tailwindcss()],
+        })
+      `,
+      ...WORKSPACE,
     },
-    async ({ fs, exec, expect }) => {
-      await exec('pnpm vite build --ssr server.ts')
+  },
+  async ({ fs, exec, expect }) => {
+    await exec('pnpm vite build --ssr server.ts')
 
-      let files = await fs.glob('dist/**/*.css')
-      expect(files).toHaveLength(1)
-      let [filename] = files[0]
+    let files = await fs.glob('dist/**/*.css')
+    expect(files).toHaveLength(1)
+    let [filename] = files[0]
 
-      await fs.expectFileToContain(filename, [
-        candidate`underline`,
-        candidate`m-2`,
-        candidate`overline`,
-        candidate`m-3`,
-      ])
+    await fs.expectFileToContain(filename, [
+      candidate`underline`,
+      candidate`m-2`,
+      candidate`overline`,
+      candidate`m-3`,
+    ])
+  },
+)
+
+test(
+  `Vite 6`,
+  {
+    fs: {
+      'package.json': json`
+        {
+          "type": "module",
+          "dependencies": {
+            "@tailwindcss/vite": "workspace:^",
+            "tailwindcss": "workspace:^"
+          },
+          "devDependencies": {
+            "vite": "^6.0"
+          }
+        }
+      `,
+      'vite.config.ts': ts`
+        import tailwindcss from '@tailwindcss/vite'
+        import { defineConfig } from 'vite'
+
+        export default defineConfig({
+          build: {
+            cssMinify: false,
+            ssrEmitAssets: true,
+          },
+          plugins: [tailwindcss()],
+        })
+      `,
+      ...WORKSPACE,
     },
-  )
-})
+  },
+  async ({ fs, exec, expect }) => {
+    await exec('pnpm vite build --ssr server.ts')
+
+    let files = await fs.glob('dist/**/*.css')
+    expect(files).toHaveLength(1)
+    let [filename] = files[0]
+
+    await fs.expectFileToContain(filename, [
+      candidate`underline`,
+      candidate`m-2`,
+      candidate`overline`,
+      candidate`m-3`,
+    ])
+  },
+)
diff --git a/integrations/vite/svelte.test.ts b/integrations/vite/svelte.test.ts
index e186c3f85..053819c73 100644
--- a/integrations/vite/svelte.test.ts
+++ b/integrations/vite/svelte.test.ts
@@ -14,7 +14,7 @@ test(
           "devDependencies": {
             "@sveltejs/vite-plugin-svelte": "^5",
             "@tailwindcss/vite": "workspace:^",
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -100,8 +100,8 @@ test(
 
     await fs.expectFileToContain(files[0][0], [
       candidate`underline`,
-      '.global{color:var(--color-green-500,oklch(72.3% .219 149.579));animation:2s ease-in-out infinite globalKeyframes}',
-      /\.local.svelte-.*\{color:var\(--color-red-500,oklch\(63\.7% \.237 25\.331\)\);animation:2s ease-in-out infinite svelte-.*-localKeyframes\}/,
+      '.global{color:var(--color-green-500,oklch(.723 .219 149.579));animation:2s ease-in-out infinite globalKeyframes}',
+      /\.local.svelte-.*\{color:var\(--color-red-500\,oklch\(\.637 \.237 25\.331\)\);animation:2s ease-in-out infinite svelte-.*-localKeyframes\}/,
       /@keyframes globalKeyframes\{/,
       /@keyframes svelte-.*-localKeyframes\{/,
     ])
@@ -125,7 +125,7 @@ test(
           "devDependencies": {
             "@sveltejs/vite-plugin-svelte": "^5",
             "@tailwindcss/vite": "workspace:^",
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -213,10 +213,10 @@ test(
       let [, css] = files[0]
       expect(css).toContain(candidate`underline`)
       expect(css).toContain(
-        '.global{color:var(--color-green-500,oklch(72.3% .219 149.579));animation:2s ease-in-out infinite globalKeyframes}',
+        '.global{color:var(--color-green-500,oklch(.723 .219 149.579));animation:2s ease-in-out infinite globalKeyframes}',
       )
       expect(css).toMatch(
-        /\.local.svelte-.*\{color:var\(--color-red-500,oklch\(63\.7% \.237 25\.331\)\);animation:2s ease-in-out infinite svelte-.*-localKeyframes\}/,
+        /\.local.svelte-.*\{color:var\(--color-red-500,oklch\(\.637 \.237 25\.331\)\);animation:2s ease-in-out infinite svelte-.*-localKeyframes\}/,
       )
       expect(css).toMatch(/@keyframes globalKeyframes\{/)
       expect(css).toMatch(/@keyframes svelte-.*-localKeyframes\{/)
@@ -238,15 +238,15 @@ test(
       let [, css] = files[0]
       expect(css).toContain(candidate`font-bold`)
       expect(css).toContain(
-        '.global{color:var(--color-green-500,oklch(72.3% .219 149.579));animation:2s ease-in-out infinite globalKeyframes}',
+        '.global{color:var(--color-green-500,oklch(.723 .219 149.579));animation:2s ease-in-out infinite globalKeyframes}',
       )
       expect(css).toMatch(
-        /\.local.svelte-.*\{color:var\(--color-red-500,oklch\(63\.7% \.237 25\.331\)\);animation:2s ease-in-out infinite svelte-.*-localKeyframes\}/,
+        /\.local.svelte-.*\{color:var\(--color-red-500,oklch\(\.637 \.237 25\.331\)\);animation:2s ease-in-out infinite svelte-.*-localKeyframes\}/,
       )
       expect(css).toMatch(/@keyframes globalKeyframes\{/)
       expect(css).toMatch(/@keyframes svelte-.*-localKeyframes\{/)
       expect(css).toMatch(
-        /\.bar.svelte-.*\{color:var\(--color-pink-500,oklch\(65\.6% \.241 354\.308\)\)\}/,
+        /\.bar.svelte-.*\{color:var\(--color-pink-500,oklch\(\.656 \.241 354\.308\)\)\}/,
       )
     })
   },
diff --git a/integrations/vite/sveltekit.test.ts b/integrations/vite/sveltekit.test.ts
deleted file mode 100644
index 92e855da9..000000000
--- a/integrations/vite/sveltekit.test.ts
+++ /dev/null
@@ -1,80 +0,0 @@
-import { candidate, css, html, js, json, test, ts } from '../utils'
-
-test(
-  'sveltekit build resolves package plugins',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "scripts": {
-            "prepare": "svelte-kit sync || echo ''"
-          },
-          "dependencies": {
-            "svelte": "^5",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "@sveltejs/adapter-auto": "^6",
-            "@sveltejs/kit": "^2",
-            "@tailwindcss/forms": "^0.5.11",
-            "@tailwindcss/vite": "workspace:^",
-            "vite": "^8"
-          }
-        }
-      `,
-      'svelte.config.js': js`
-        import adapter from '@sveltejs/adapter-auto'
-
-        export default {
-          kit: {
-            adapter: adapter(),
-          },
-        }
-      `,
-      'vite.config.ts': ts`
-        import tailwindcss from '@tailwindcss/vite'
-        import { sveltekit } from '@sveltejs/kit/vite'
-        import { defineConfig } from 'vite'
-
-        export default defineConfig({
-          build: { cssMinify: false },
-          plugins: [tailwindcss(), sveltekit()],
-        })
-      `,
-      'src/app.html': html`
-        <!doctype html>
-        <html lang="en">
-          <head>
-            %sveltekit.head%
-          </head>
-          <body data-sveltekit-preload-data="hover">
-            <div style="display: contents">%sveltekit.body%</div>
-          </body>
-        </html>
-      `,
-      'src/routes/+layout.svelte': html`
-        <script>
-          import '../app.css'
-        </script>
-
-        <slot />
-      `,
-      'src/routes/+page.svelte': html`
-        <div class="form-input">Hello, world!</div>
-      `,
-      'src/app.css': css`
-        @import 'tailwindcss';
-        @plugin '@tailwindcss/forms';
-      `,
-    },
-  },
-  async ({ exec, fs, expect }) => {
-    await exec('pnpm vite build')
-
-    let files = await fs.glob('.svelte-kit/output/client/**/*.css')
-    expect(files.length).toBeGreaterThan(0)
-
-    await fs.expectFileToContain(files[0][0], [candidate`form-input`])
-  },
-)
diff --git a/integrations/vite/url-rewriting.test.ts b/integrations/vite/url-rewriting.test.ts
index 500fe6d71..4077df16d 100644
--- a/integrations/vite/url-rewriting.test.ts
+++ b/integrations/vite/url-rewriting.test.ts
@@ -15,9 +15,9 @@ describe.each(['postcss', 'lightningcss'])('%s', (transformer) => {
               "tailwindcss": "workspace:^"
             },
             "devDependencies": {
-              ${transformer === 'lightningcss' ? `"lightningcss": "^1",` : ''}
+              ${transformer === 'lightningcss' ? `"lightningcss": "^1.26.0",` : ''}
               "@tailwindcss/vite": "workspace:^",
-              "vite": "^7"
+              "vite": "^6"
             }
           }
         `,
diff --git a/integrations/vite/vue.test.ts b/integrations/vite/vue.test.ts
index b04f57c6b..7b5da2904 100644
--- a/integrations/vite/vue.test.ts
+++ b/integrations/vite/vue.test.ts
@@ -1,5 +1,4 @@
-import { stripVTControlCharacters } from 'node:util'
-import { candidate, css, fetchStyles, html, json, retryAssertion, test, ts } from '../utils'
+import { candidate, html, json, test, ts } from '../utils'
 
 test(
   'production build',
@@ -15,7 +14,7 @@ test(
           "devDependencies": {
             "@vitejs/plugin-vue": "^5.1.2",
             "@tailwindcss/vite": "workspace:^",
-            "vite": "^7"
+            "vite": "^6"
           }
         }
       `,
@@ -72,309 +71,3 @@ test(
     await fs.expectFileToContain(files[0][0], ['.bar{'])
   },
 )
-
-{
-  const VUE_COMPONENT_COUNT = 1_000
-
-  let vueComponentsWithReferences = Object.fromEntries(
-    Array.from({ length: VUE_COMPONENT_COUNT }, (_, idx) => [
-      `src/components/Component${idx}.vue`,
-      html`
-        <template>
-          <div class="content-['component-${idx}']">Component ${idx}</div>
-        </template>
-
-        <style>
-          @reference '../main.css';
-
-          .component-${idx} {
-            @apply text-red-500;
-          }
-        </style>
-      `,
-    ]),
-  )
-
-  let vueComponentImports = Array.from(
-    { length: VUE_COMPONENT_COUNT },
-    (_, idx) => `import Component${idx} from './components/Component${idx}.vue'`,
-  ).join('\n')
-
-  let vueComponentUsages = Array.from(
-    { length: VUE_COMPONENT_COUNT },
-    (_, idx) => `<Component${idx} class="component-${idx}" />`,
-  ).join('\n')
-
-  test(
-    'production build with many Vue style blocks referencing the main stylesheet',
-    {
-      fs: {
-        'package.json': json`
-          {
-            "type": "module",
-            "dependencies": {
-              "vue": "^3.4.37",
-              "tailwindcss": "workspace:^"
-            },
-            "devDependencies": {
-              "@vitejs/plugin-vue": "^5.1.2",
-              "@tailwindcss/vite": "workspace:^",
-              "vite": "^7"
-            }
-          }
-        `,
-        'vite.config.ts': ts`
-          import { defineConfig } from 'vite'
-          import vue from '@vitejs/plugin-vue'
-          import tailwindcss from '@tailwindcss/vite'
-
-          export default defineConfig({
-            plugins: [vue(), tailwindcss()],
-          })
-        `,
-        'index.html': html`
-          <!doctype html>
-          <html>
-            <body>
-              <div id="app"></div>
-              <script type="module" src="./src/main.ts"></script>
-            </body>
-          </html>
-        `,
-        'src/main.css': css`@import 'tailwindcss';`,
-        'src/main.ts': ts`
-          import { createApp } from 'vue'
-          import './main.css'
-          import App from './App.vue'
-
-          createApp(App).mount('#app')
-        `,
-        'src/App.vue': html`
-          <script setup>
-            ${vueComponentImports}
-          </script>
-
-          <template>${vueComponentUsages}</template>
-        `,
-        ...vueComponentsWithReferences,
-      },
-    },
-    async ({ fs, exec, expect }) => {
-      await exec('pnpm vite build')
-
-      let files = await fs.glob('dist/**/*.css')
-      expect(files).toHaveLength(1)
-
-      await fs.expectFileToContain(files[0][0], [
-        candidate`content-['component-0']`,
-        candidate`component-0`,
-        candidate`content-['component-99']`,
-        candidate`component-99`,
-        candidate`content-['component-999']`,
-        candidate`component-999`,
-      ])
-    },
-  )
-}
-
-test(
-  'error when using `@apply` without `@reference`',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "vue": "^3.4.37",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "@vitejs/plugin-vue": "^5.1.2",
-            "@tailwindcss/vite": "workspace:^",
-            "vite": "^7"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import { defineConfig } from 'vite'
-        import vue from '@vitejs/plugin-vue'
-        import tailwindcss from '@tailwindcss/vite'
-
-        export default defineConfig({
-          plugins: [vue(), tailwindcss()],
-        })
-      `,
-      'index.html': html`
-        <!doctype html>
-        <html>
-          <body>
-            <div id="app"></div>
-            <script type="module" src="./src/main.ts"></script>
-          </body>
-        </html>
-      `,
-      'src/main.ts': ts`
-        import { createApp } from 'vue'
-        import App from './App.vue'
-
-        createApp(App).mount('#app')
-      `,
-      'src/App.vue': html`
-        <template>
-          <div class="foo">Hello Vue!</div>
-        </template>
-
-        <style>
-          .foo {
-            @apply text-red-500;
-          }
-        </style>
-      `,
-    },
-  },
-  async ({ exec, expect }) => {
-    expect.assertions(1)
-
-    try {
-      await exec('pnpm vite build', {}, { ignoreStdErr: true })
-    } catch (error) {
-      let [, message] =
-        /error during build:([\s\S]*?)file:/g.exec(
-          stripVTControlCharacters(error.message.replace(/\r?\n/g, '\n')),
-        ) ?? []
-      expect(message.trim()).toMatchInlineSnapshot(
-        `"[@tailwindcss/vite:generate:build] Cannot apply unknown utility class \`text-red-500\`. Are you using CSS modules or similar and missing \`@reference\`? https://tailwindcss.com/docs/functions-and-directives#reference-directive"`,
-      )
-    }
-  },
-)
-
-// https://github.com/tailwindlabs/tailwindcss/issues/20320
-test(
-  'editing a scanned `.vue` file that is not loaded as a module does not trigger a full reload',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "type": "module",
-          "dependencies": {
-            "vue": "^3.4.37",
-            "tailwindcss": "workspace:^"
-          },
-          "devDependencies": {
-            "@vitejs/plugin-vue": "^6",
-            "@tailwindcss/vite": "workspace:^",
-            "vite": "^8"
-          }
-        }
-      `,
-      'vite.config.ts': ts`
-        import fs from 'node:fs'
-        import path from 'node:path'
-        import { defineConfig } from 'vite'
-        import vue from '@vitejs/plugin-vue'
-        import tailwindcss from '@tailwindcss/vite'
-
-        export default defineConfig({
-          plugins: [
-            vue(),
-            tailwindcss(),
-            {
-              // Log update and full-reload HMR payloads to a file so the
-              // test can assert on them. Custom events are not logged
-              // because \`@vitejs/plugin-vue\` sends a \`file-changed\` event
-              // for every file change, including changes to the log file
-              // itself, which would cause an infinite feedback loop.
-              name: 'hmr-wiretap',
-              configureServer(server) {
-                let logFile = path.resolve('hmr.log')
-                fs.writeFileSync(logFile, '')
-                for (let environment of Object.values(server.environments)) {
-                  let send = environment.hot.send.bind(environment.hot)
-                  environment.hot.send = (payload) => {
-                    if (payload.type === 'update' || payload.type === 'full-reload') {
-                      fs.appendFileSync(logFile, JSON.stringify(payload) + '\\n')
-                    }
-                    return send(payload)
-                  }
-                }
-              },
-            },
-          ],
-        })
-      `,
-      'index.html': html`
-        <!doctype html>
-        <html>
-          <head>
-            <link rel="stylesheet" href="./src/index.css" />
-          </head>
-          <body>
-            <div id="app"></div>
-            <script type="module" src="./src/main.ts"></script>
-          </body>
-        </html>
-      `,
-      'src/index.css': css`@import 'tailwindcss';`,
-      'src/main.ts': ts`
-        import { createApp } from 'vue'
-        import App from './App.vue'
-
-        createApp(App).mount('#app')
-      `,
-      'src/App.vue': html`
-        <template>
-          <div class="content-['src/App.vue']">Hello Vue!</div>
-        </template>
-      `,
-
-      // This file is scanned by Tailwind but never imported, so it is not
-      // part of the loaded module graph (e.g. a lazy route that hasn't been
-      // visited yet)
-      'src/LazyRoute.vue': html`
-        <template>
-          <div class="content-['src/LazyRoute.vue']">Lazy</div>
-        </template>
-      `,
-    },
-  },
-  async ({ spawn, fs, expect }) => {
-    let process = await spawn('pnpm vite dev')
-    await process.onStdout((m) => m.includes('ready in'))
-
-    let url = ''
-    await process.onStdout((m) => {
-      let match = /Local:\s*(http.*)\//.exec(m)
-      if (match) url = match[1]
-      return Boolean(url)
-    })
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url, '/index.html')
-      expect(styles).toContain(candidate`content-['src/App.vue']`)
-      expect(styles).toContain(candidate`content-['src/LazyRoute.vue']`)
-    })
-
-    // Load `main.ts` and `App.vue` as real modules, like a browser visiting
-    // the page would
-    await fetch(`${url}/src/main.ts`)
-    await fetch(`${url}/src/App.vue`)
-
-    // Changing the scanned but unloaded `.vue` file should not trigger a
-    // full reload, but new classes should still apply
-    await fs.write(
-      'src/LazyRoute.vue',
-      html`
-        <template>
-          <div class="content-['updated:src/LazyRoute.vue']">Lazy</div>
-        </template>
-      `,
-    )
-
-    await retryAssertion(async () => {
-      let styles = await fetchStyles(url, '/index.html')
-      expect(styles).toContain(candidate`content-['updated:src/LazyRoute.vue']`)
-    })
-    expect(await fs.read('hmr.log')).not.toContain('full-reload')
-  },
-)
diff --git a/integrations/vitest.config.mts b/integrations/vitest.config.ts
similarity index 100%
rename from integrations/vitest.config.mts
rename to integrations/vitest.config.ts
diff --git a/integrations/webpack/index.test.ts b/integrations/webpack/index.test.ts
deleted file mode 100644
index 2a91411d2..000000000
--- a/integrations/webpack/index.test.ts
+++ /dev/null
@@ -1,110 +0,0 @@
-import { css, html, js, json, test } from '../utils'
-
-test(
-  'webpack + PostCSS (watch)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "postcss": "^8",
-            "postcss-loader": "^7",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/postcss": "workspace:^"
-          }
-        }
-      `,
-      'postcss.config.js': js`
-        /** @type {import('postcss-load-config').Config} */
-        module.exports = {
-          plugins: {
-            '@tailwindcss/postcss': {},
-          },
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader'],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.html': html`
-        <div class="flex"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-      'src/unrelated.module.css': css`
-        .module {
-          color: var(--color-blue-500);
-        }
-      `,
-    },
-  },
-  async ({ fs, spawn, exec, expect }) => {
-    // Generate the initial build so output CSS files exist on disk
-    await exec('pnpm webpack --mode=development')
-
-    // NOTE: We are writing to an output CSS file which is not being ignored by
-    // `.gitignore` nor marked with `@source not`. This should not result in an
-    // infinite loop.
-    let process = await spawn('pnpm webpack --mode=development --watch')
-    await process.onStdout((m) => m.includes('compiled successfully in'))
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      :root, :host {
-        --color-blue-500: oklch(62.3% 0.214 259.815);
-      }
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-
-    await fs.write(
-      'src/unrelated.module.css',
-      css`
-        .module {
-          color: var(--color-blue-500);
-          background-color: var(--color-red-500);
-        }
-      `,
-    )
-    await process.onStdout((m) => m.includes('compiled successfully in'))
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      :root, :host {
-        --color-red-500: oklch(63.7% 0.237 25.331);
-        --color-blue-500: oklch(62.3% 0.214 259.815);
-      }
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-  },
-)
diff --git a/integrations/webpack/loader.test.ts b/integrations/webpack/loader.test.ts
deleted file mode 100644
index 9c3d870af..000000000
--- a/integrations/webpack/loader.test.ts
+++ /dev/null
@@ -1,495 +0,0 @@
-import { css, html, js, json, test } from '../utils'
-
-test(
-  '@tailwindcss/webpack loader (build)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.html': html`
-        <div class="flex"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm webpack --mode=development')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '@tailwindcss/webpack loader (watch)',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.html': html`
-        <div class="flex"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ fs, spawn, exec, expect }) => {
-    // Generate the initial build so output CSS files exist on disk
-    await exec('pnpm webpack --mode=development')
-
-    let process = await spawn('pnpm webpack --mode=development --watch')
-    await process.onStdout((m) => m.includes('compiled successfully in'))
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      .flex {
-        display: flex;
-      }
-      "
-    `)
-
-    // Add a new Tailwind class to the HTML file
-    await fs.write('src/index.html', html`
-        <div class="flex underline"></div>
-      `)
-    await process.onStdout((m) => m.includes('compiled successfully in'))
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      .flex {
-        display: flex;
-      }
-      .underline {
-        text-decoration-line: underline;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '@tailwindcss/webpack loader with @apply',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.css': css`
-        @import 'tailwindcss/theme';
-
-        .btn {
-          @apply flex items-center px-4 py-2 rounded-md;
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm webpack --mode=development')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      :root, :host {
-        --spacing: 0.25rem;
-        --radius-md: 0.375rem;
-      }
-      .btn {
-        display: flex;
-        align-items: center;
-        border-radius: var(--radius-md);
-        padding-inline: calc(var(--spacing) * 4);
-        padding-block: calc(var(--spacing) * 2);
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '@tailwindcss/webpack loader with optimization',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [
-                  MiniCssExtractPlugin.loader,
-                  'css-loader',
-                  {
-                    loader: '@tailwindcss/webpack',
-                    options: {
-                      optimize: true,
-                    },
-                  },
-                ],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.html': html`
-        <div class="flex"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm webpack --mode=development')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      .flex{display:flex}
-      "
-    `)
-  },
-)
-
-test(
-  '@tailwindcss/webpack loader with CSS @import',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.html': html`
-        <div class="flex custom-util"></div>
-      `,
-      'src/index.css': css`
-        @import './custom.css';
-        @import 'tailwindcss/theme';
-        @import 'tailwindcss/utilities';
-      `,
-      'src/custom.css': css`
-        /**/
-        @utility custom-util {
-          color: var(--color-red-500);
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm webpack --mode=development')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      :root, :host {
-        --color-red-500: oklch(63.7% 0.237 25.331);
-      }
-      .flex {
-        display: flex;
-      }
-      .custom-util {
-        color: var(--color-red-500);
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '@tailwindcss/webpack loader with @plugin',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-        module.exports = {
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],
-              },
-            ],
-          },
-        }
-      `,
-      'src/index.js': js`import './index.css'`,
-      'src/index.html': html`
-        <div class="custom-underline"></div>
-      `,
-      'src/index.css': css`
-        @import 'tailwindcss/utilities';
-        @plugin './plugin.js';
-      `,
-      'src/plugin.js': js`
-        export default function ({ addUtilities }) {
-          addUtilities({
-            '.custom-underline': {
-              'border-bottom': '1px solid green',
-            },
-          })
-        }
-      `,
-    },
-  },
-  async ({ fs, exec, expect }) => {
-    await exec('pnpm webpack --mode=development')
-
-    expect(await fs.dumpFiles('./dist/*.css')).toMatchInlineSnapshot(`
-      "
-      --- ./dist/main.css ---
-      .custom-underline {
-        border-bottom: 1px solid green;
-      }
-      "
-    `)
-  },
-)
-
-test(
-  '@tailwindcss/webpack loader isolates cache by resource including query',
-  {
-    fs: {
-      'package.json': json`
-        {
-          "main": "./src/index.js",
-          "browser": "./src/index.js",
-          "dependencies": {
-            "css-loader": "^6",
-            "webpack": "^5",
-            "webpack-cli": "^5",
-            "mini-css-extract-plugin": "^2",
-            "tailwindcss": "workspace:^",
-            "@tailwindcss/webpack": "workspace:^"
-          }
-        }
-      `,
-      'webpack.config.js': js`
-        let MiniCssExtractPlugin = require('mini-css-extract-plugin')
-        let path = require('node:path')
-
-        module.exports = {
-          mode: 'development',
-          entry: {
-            a: './src/a.js',
-            b: './src/b.js',
-          },
-          output: {
-            clean: true,
-          },
-          plugins: [new MiniCssExtractPlugin()],
-          module: {
-            rules: [
-              {
-                test: /.css$/i,
-                use: [
-                  MiniCssExtractPlugin.loader,
-                  'css-loader',
-                  '@tailwindcss/webpack',
-                  path.resolve(__dirname, 'query-loader.js'),
-                ],
-              },
-            ],
-          },
-        }
-      `,
-      'query-loader.js': js`
-        module.exports = function (source) {
-          if (this.resourceQuery.includes('a')) {
-            return '@import "tailwindcss/utilities"; @utility only-a {color: var(--color-red-500);}'
-          }
-
-          if (this.resourceQuery.includes('b')) {
-            return '@import "tailwindcss/utilities"; @utility only-b {color: var(--color-blue-500);}'
-          }
-
-          return source
-        }
-      `,
-      'src/a.js': js`import './index.css?a'`,
-      'src/b.js': js`import './index.css?b'`,
-      'src/index.css': css``,
-    },
-  },
-  async ({ fs, exec }) => {
-    await exec('pnpm webpack --mode=development')
-
-    await fs.expectFileToContain('dist/a.css', ['only-a', '--color-red-500'])
-    await fs.expectFileToContain('dist/b.css', ['only-b', '--color-blue-500'])
-    await fs.expectFileNotToContain('dist/a.css', ['only-b', '--color-blue-500'])
-    await fs.expectFileNotToContain('dist/b.css', ['only-a', '--color-red-500'])
-  },
-)
diff --git a/integrations/oxide/workers.test.ts b/integrations/workers/index.test.ts
similarity index 100%
rename from integrations/oxide/workers.test.ts
rename to integrations/workers/index.test.ts
diff --git a/package.json b/package.json
index 7d41a469e..9a2661360 100644
--- a/package.json
+++ b/package.json
@@ -48,17 +48,23 @@
   },
   "license": "MIT",
   "devDependencies": {
-    "@playwright/test": "^1.62.1",
+    "@playwright/test": "^1.51.0",
     "@types/node": "catalog:",
-    "postcss": "catalog:",
-    "postcss-import": "^16.1.1",
+    "postcss": "8.5.3",
+    "postcss-import": "^16.1.0",
     "prettier": "catalog:",
-    "prettier-plugin-embed": "^0.5.1",
-    "prettier-plugin-organize-imports": "^4.3.0",
-    "tsup": "^8.5.1",
-    "turbo": "^2.10.8",
-    "typescript": "^5.9.3",
-    "vitest": "^4.1.10"
+    "prettier-plugin-embed": "^0.5.0",
+    "prettier-plugin-organize-imports": "^4.0.0",
+    "tsup": "^8.4.0",
+    "turbo": "^2.4.4",
+    "typescript": "^5.5.4",
+    "vitest": "^2.0.5"
   },
-  "packageManager": "pnpm@11.9.0"
+  "packageManager": "pnpm@9.6.0",
+  "pnpm": {
+    "patchedDependencies": {
+      "lightningcss@1.29.2": "patches/lightningcss@1.29.2.patch",
+      "@parcel/watcher@2.5.1": "patches/@parcel__watcher@2.5.1.patch"
+    }
+  }
 }
diff --git a/packages/@tailwindcss-browser/README.md b/packages/@tailwindcss-browser/README.md
index 5f532607d..95ec9d87d 100644
--- a/packages/@tailwindcss-browser/README.md
+++ b/packages/@tailwindcss-browser/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,10 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-browser/package.json b/packages/@tailwindcss-browser/package.json
index 70af78c1e..96f80a684 100644
--- a/packages/@tailwindcss-browser/package.json
+++ b/packages/@tailwindcss-browser/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/browser",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "main": "./dist/index.global.js",
@@ -30,8 +30,8 @@
     "access": "public"
   },
   "devDependencies": {
-    "h3": "^1.15.11",
-    "listhen": "^1.10.1",
+    "h3": "^1.15.1",
+    "listhen": "^1.9.0",
     "tailwindcss": "workspace:*"
   }
 }
diff --git a/packages/@tailwindcss-browser/playwright.config.ts b/packages/@tailwindcss-browser/playwright.config.ts
index c6059dd82..c3ad05b91 100644
--- a/packages/@tailwindcss-browser/playwright.config.ts
+++ b/packages/@tailwindcss-browser/playwright.config.ts
@@ -14,7 +14,7 @@ export default defineConfig({
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: [['html', { open: 'never' }]],
+  reporter: 'html',
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
@@ -30,11 +30,10 @@ export default defineConfig({
       name: 'chromium',
       use: { ...devices['Desktop Chrome'] },
     },
-    // Playwright 1.60's Windows WebKit worker hangs on shutdown after all tests
-    // pass, causing CI to fail with a worker force-kill error.
-    ...(process.platform === 'win32'
-      ? []
-      : [{ name: 'webkit', use: { ...devices['Desktop Safari'] } }]),
+    {
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
+    },
     {
       name: 'firefox',
       use: {
diff --git a/packages/@tailwindcss-browser/src/index.ts b/packages/@tailwindcss-browser/src/index.ts
index 49c7e4675..e7688a121 100644
--- a/packages/@tailwindcss-browser/src/index.ts
+++ b/packages/@tailwindcss-browser/src/index.ts
@@ -2,6 +2,12 @@ import * as tailwindcss from 'tailwindcss'
 import * as assets from './assets'
 import { Instrumentation } from './instrumentation'
 
+// Warn users about using the browser build in production as early as possible.
+// It can take time for the script to do its work so this must be at the top.
+console.warn(
+  'The browser build of Tailwind CSS should not be used in production. To use Tailwind CSS in production, use the Tailwind CLI, Vite plugin, or PostCSS plugin: https://tailwindcss.com/docs/installation',
+)
+
 /**
  * The type used by `<style>` tags that contain input CSS.
  */
@@ -110,7 +116,6 @@ async function loadStylesheet(id: string, base: string) {
   function load() {
     if (id === 'tailwindcss') {
       return {
-        path: 'virtual:tailwindcss/index.css',
         base,
         content: assets.css.index,
       }
@@ -120,7 +125,6 @@ async function loadStylesheet(id: string, base: string) {
       id === './preflight.css'
     ) {
       return {
-        path: 'virtual:tailwindcss/preflight.css',
         base,
         content: assets.css.preflight,
       }
@@ -130,7 +134,6 @@ async function loadStylesheet(id: string, base: string) {
       id === './theme.css'
     ) {
       return {
-        path: 'virtual:tailwindcss/theme.css',
         base,
         content: assets.css.theme,
       }
@@ -140,7 +143,6 @@ async function loadStylesheet(id: string, base: string) {
       id === './utilities.css'
     ) {
       return {
-        path: 'virtual:tailwindcss/utilities.css',
         base,
         content: assets.css.utilities,
       }
diff --git a/packages/@tailwindcss-browser/tests/ui.spec.ts b/packages/@tailwindcss-browser/tests/ui.spec.ts
index 241322daa..0b4484c6f 100644
--- a/packages/@tailwindcss-browser/tests/ui.spec.ts
+++ b/packages/@tailwindcss-browser/tests/ui.spec.ts
@@ -9,10 +9,6 @@ test.beforeAll(async ({}, info) => {
   server = await createServer()
 })
 
-test.afterAll(async () => {
-  await server.close()
-})
-
 test('basic', async ({ page }) => {
   await server.render({
     page,
@@ -170,7 +166,6 @@ async function createServer() {
   return {
     app,
     url: listener.url,
-    close: listener.close,
     render,
   }
 }
diff --git a/packages/@tailwindcss-browser/tsup.config.ts b/packages/@tailwindcss-browser/tsup.config.ts
index 10a73f2b7..bb0ddc39c 100644
--- a/packages/@tailwindcss-browser/tsup.config.ts
+++ b/packages/@tailwindcss-browser/tsup.config.ts
@@ -13,20 +13,4 @@ export default defineConfig({
     'process.env.NODE_ENV': '"production"',
     'process.env.FEATURES_ENV': '"stable"',
   },
-  esbuildPlugins: [
-    {
-      name: 'patch-intellisense-apis',
-      setup(build) {
-        build.onLoad({ filter: /intellisense.ts$/ }, () => {
-          return {
-            contents: `
-              export function getClassList() { return [] }
-              export function getVariants() { return [] }
-              export function canonicalizeCandidates() { return [] }
-            `,
-          }
-        })
-      },
-    },
-  ],
 })
diff --git a/packages/@tailwindcss-browser/vitest.config.mts b/packages/@tailwindcss-browser/vitest.config.ts
similarity index 100%
rename from packages/@tailwindcss-browser/vitest.config.mts
rename to packages/@tailwindcss-browser/vitest.config.ts
diff --git a/packages/@tailwindcss-cli/README.md b/packages/@tailwindcss-cli/README.md
index 5f532607d..95ec9d87d 100644
--- a/packages/@tailwindcss-cli/README.md
+++ b/packages/@tailwindcss-cli/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,10 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-cli/package.json b/packages/@tailwindcss-cli/package.json
index 7fa5b5500..bce5c2e3d 100644
--- a/packages/@tailwindcss-cli/package.json
+++ b/packages/@tailwindcss-cli/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/cli",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "repository": {
@@ -29,10 +29,11 @@
     "access": "public"
   },
   "dependencies": {
-    "@parcel/watcher": "catalog:",
+    "@parcel/watcher": "^2.5.1",
     "@tailwindcss/node": "workspace:*",
     "@tailwindcss/oxide": "workspace:*",
-    "enhanced-resolve": "catalog:",
+    "enhanced-resolve": "^5.18.1",
+    "lightningcss": "catalog:",
     "mri": "^1.2.0",
     "picocolors": "^1.1.1",
     "tailwindcss": "workspace:*"
diff --git a/packages/@tailwindcss-cli/src/commands/build/index.ts b/packages/@tailwindcss-cli/src/commands/build/index.ts
index ffef2ae8b..4e9c99e23 100644
--- a/packages/@tailwindcss-cli/src/commands/build/index.ts
+++ b/packages/@tailwindcss-cli/src/commands/build/index.ts
@@ -1,13 +1,8 @@
-import {
-  compile,
-  env,
-  Instrumentation,
-  optimize,
-  toSourceMap,
-  type SourceMap,
-} from '@tailwindcss/node'
+import watcher from '@parcel/watcher'
+import { compile, env, Instrumentation } from '@tailwindcss/node'
 import { clearRequireCache } from '@tailwindcss/node/require-cache'
 import { Scanner, type ChangedContent } from '@tailwindcss/oxide'
+import { Features, transform } from 'lightningcss'
 import { existsSync, type Stats } from 'node:fs'
 import fs from 'node:fs/promises'
 import path from 'node:path'
@@ -20,13 +15,11 @@ import {
   highlight,
   println,
   relative,
-  wordWrap,
 } from '../../utils/renderer'
 import { drainStdin, outputFile } from './utils'
 
 const css = String.raw
 const DEBUG = env.DEBUG
-const DEFAULT_POLL_INTERVAL_MS = 250
 
 export function options() {
   return {
@@ -43,16 +36,8 @@ export function options() {
     },
     '--watch': {
       type: 'boolean | string',
-      description:
-        'Watch for changes and rebuild as needed, and use `always` to keep watching when stdin is closed',
+      description: 'Watch for changes and rebuild as needed',
       alias: '-w',
-      values: ['always'],
-    },
-    '--poll': {
-      type: 'boolean | number',
-      description: 'Use polling instead of filesystem events when watching',
-      default: false,
-      values: ['ms'],
     },
     '--minify': {
       type: 'boolean',
@@ -68,64 +53,21 @@ export function options() {
       description: 'The current working directory',
       default: '.',
     },
-    '--map': {
-      type: 'boolean | string',
-      description: 'Generate a source map',
-      default: false,
-    },
-    '--silent': {
-      type: 'boolean',
-      description: 'Suppress non-error output',
-    },
   } satisfies Arg
 }
 
-function formatError(error: unknown): string {
-  let seen = new Set() // Track seen errors to prevent circular errors
-  function render(err: unknown, depth: number): string[] {
-    let indent = '  '.repeat(depth)
-    let width = (process.stderr.columns ?? Infinity) - 2 * (depth + 1)
-
-    let output = [
-      `${indent}${red(depth === 0 ? 'Error:' : 'Caused by:')}`,
-      `${indent}${dim('\u250C')}`,
-    ]
-
-    for (let line of `${err}`.split('\n')) {
-      let wrapped = wordWrap(line, width)
-      if (wrapped.length === 0) wrapped = ['']
-      for (let chunk of wrapped) {
-        output.push(`${indent}${dim('\u2502')} ${chunk}`)
-      }
-    }
-
-    output.push(`${indent}${dim('\u2514')}`)
-
-    if (typeof err === 'object' && err !== null && 'cause' in err && err.cause != null) {
-      if (!seen.add(err).has(err.cause)) {
-        output.push(...render(err.cause, depth + 1))
-      }
-    }
-
-    return output
-  }
-
-  return render(error, 0).join('\n')
-}
-
 async function handleError<T>(fn: () => T): Promise<T> {
   try {
     return await fn()
   } catch (err) {
-    eprintln(formatError(err))
+    if (err instanceof Error) {
+      eprintln(err.toString())
+    }
     process.exit(1)
   }
 }
 
 export async function handle(args: Result<ReturnType<typeof options>>) {
-  if (!args['--silent']) eprintln(header())
-  if (!args['--silent']) eprintln()
-
   using I = new Instrumentation()
   DEBUG && I.start('[@tailwindcss/cli] (initial build)')
 
@@ -146,6 +88,8 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
 
     // Ensure the provided `--input` exists.
     if (!existsSync(args['--input'])) {
+      eprintln(header())
+      eprintln()
       eprintln(`Specified input file ${highlight(relative(args['--input']))} does not exist.`)
       process.exit(1)
     }
@@ -154,35 +98,14 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
   // Check if the input and output file paths are identical, otherwise return an
   // error to the user.
   if (args['--input'] === args['--output'] && args['--input'] !== '-') {
+    eprintln(header())
+    eprintln()
     eprintln(
       `Specified input file ${highlight(relative(args['--input']))} and output file ${highlight(relative(args['--output']))} are identical.`,
     )
     process.exit(1)
   }
 
-  // If the user passes `{bin} build --map -` then this likely means they want to output the map inline
-  // this is the default behavior of `{bin build} --map` to inform the user of that
-  if (args['--map'] === '-') {
-    eprintln(`Use --map without a value to inline the source map.`)
-    process.exit(1)
-  }
-
-  if (args['--poll'] === undefined) {
-    eprintln(`Use --poll with a non-zero value in milliseconds.`)
-    process.exit(1)
-  }
-  let pollInterval = args['--poll'] === true ? DEFAULT_POLL_INTERVAL_MS : args['--poll']
-  if (pollInterval !== false && pollInterval <= 0) {
-    eprintln(`Specified polling interval must be a positive number.`)
-    process.exit(1)
-  }
-
-  // Resolve the map as an absolute path. If the output is true then we
-  // don't need to resolve it because it'll be an inline source map
-  if (args['--map'] && args['--map'] !== true) {
-    args['--map'] = path.resolve(base, args['--map'])
-  }
-
   let start = process.hrtime.bigint()
 
   let input = args['--input']
@@ -196,75 +119,36 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
   let previous = {
     css: '',
     optimizedCss: '',
-    output: null as string | null,
   }
 
-  async function write(
-    css: string,
-    map: SourceMap | null,
-    args: Result<ReturnType<typeof options>>,
-    I: Instrumentation,
-  ) {
+  async function write(css: string, args: Result<ReturnType<typeof options>>, I: Instrumentation) {
     let output = css
 
     // Optimize the output
     if (args['--minify'] || args['--optimize']) {
       if (css !== previous.css) {
         DEBUG && I.start('Optimize CSS')
-        let optimized = optimize(css, {
+        let optimizedCss = optimizeCss(css, {
           file: args['--input'] ?? 'input.css',
           minify: args['--minify'] ?? false,
-          map: map?.raw ?? undefined,
         })
         DEBUG && I.end('Optimize CSS')
         previous.css = css
-        previous.optimizedCss = optimized.code
-        if (optimized.map) {
-          map = toSourceMap(optimized.map)
-        }
-        output = optimized.code
+        previous.optimizedCss = optimizedCss
+        output = optimizedCss
       } else {
         output = previous.optimizedCss
       }
     }
 
     // Write the output
-    if (map) {
-      // Inline the source map
-      if (args['--map'] === true) {
-        output += `\n`
-        output += map.inline
-      } else if (typeof args['--map'] === 'string') {
-        let basePath =
-          args['--output'] && args['--output'] !== '-'
-            ? path.dirname(path.resolve(args['--output']))
-            : process.cwd()
-
-        let mapPath = path.resolve(args['--map'])
-
-        let relativePath = path.relative(basePath, mapPath)
-
-        output += `\n`
-        output += map.comment(relativePath)
-
-        DEBUG && I.start('Write source map')
-        await outputFile(args['--map'], map.raw)
-        DEBUG && I.end('Write source map')
-      }
-    }
-
-    let didChange = output !== previous.output
-
     DEBUG && I.start('Write output')
     if (args['--output'] && args['--output'] !== '-') {
       await outputFile(args['--output'], output)
-    } else if (didChange) {
+    } else {
       println(output)
     }
     DEBUG && I.end('Write output')
-
-    previous.output = output
-    return didChange
   }
 
   let inputFilePath =
@@ -273,12 +157,10 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
   let inputBasePath = inputFilePath ? path.dirname(inputFilePath) : process.cwd()
 
   let fullRebuildPaths: string[] = inputFilePath ? [inputFilePath] : []
-  let backupRebuildPaths = fullRebuildPaths
 
   async function createCompiler(css: string, I: Instrumentation) {
     DEBUG && I.start('Setup compiler')
     let compiler = await compile(css, {
-      from: args['--output'] ? (inputFilePath ?? 'stdin.css') : undefined,
       base: inputBasePath,
       onDependency(path) {
         fullRebuildPaths.push(path)
@@ -293,30 +175,12 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
 
       // No root specified, use the base directory
       if (compiler.root === null) {
-        return [{ base, pattern: '**/*', negated: false }]
+        return [{ base, pattern: '**/*' }]
       }
 
       // Use the specified root
-      return [{ ...compiler.root, negated: false }]
-    })().concat(compiler.sources)
-
-    // Do not scan the current executable. Otherwise when using the standalone
-    // CLI, if the CLI lives in the current repo we would be scanning that file.
-    //
-    // This is also immune against renames of the executable file.
-    sources.push({
-      base: path.dirname(process.execPath),
-      pattern: path.basename(process.execPath),
-      negated: true,
-    })
-
-    if (inputFilePath !== null) {
-      sources.push({
-        base: path.dirname(inputFilePath),
-        pattern: path.basename(inputFilePath),
-        negated: false,
-      })
-    }
+      return [compiler.root]
+    })().concat(compiler.globs)
 
     let scanner = new Scanner({ sources })
     DEBUG && I.end('Setup compiler')
@@ -325,16 +189,12 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
   }
 
   let [compiler, scanner] = await handleError(() => createCompiler(input, I))
-  let cleanupWatchers: (() => Promise<void>)[] = []
 
   // Watch for changes
-  if (args['--watch'] && pollInterval === false) {
-    // Ensure the file watcher can be loaded before setting up any watchers,
-    // such that we can present a helpful error message if needed.
-    await handleError(() => loadWatcher())
-
-    cleanupWatchers.push(
-      await createWatchers(await watchDirectories(scanner), async function handle(files) {
+  if (args['--watch']) {
+    let cleanupWatchers = await createWatchers(
+      watchDirectories(scanner),
+      async function handle(files) {
         try {
           // If the only change happened to the output file, then we don't want to
           // trigger a rebuild because that will result in an infinite loop.
@@ -346,15 +206,35 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
           // Re-compile the input
           let start = process.hrtime.bigint()
 
+          let changedFiles: ChangedContent[] = []
+          let rebuildStrategy: 'incremental' | 'full' = 'incremental'
+
           let resolvedFullRebuildPaths = fullRebuildPaths
-          let rebuildStrategy = getRebuildStrategy(files, resolvedFullRebuildPaths)
+
+          for (let file of files) {
+            // If one of the changed files is related to the input CSS or JS
+            // config/plugin files, then we need to do a full rebuild because
+            // the theme might have changed.
+            if (resolvedFullRebuildPaths.includes(file)) {
+              rebuildStrategy = 'full'
+
+              // No need to check the rest of the events, because we already know we
+              // need to do a full rebuild.
+              break
+            }
+
+            // Track new and updated files for incremental rebuilds.
+            changedFiles.push({
+              file,
+              extension: path.extname(file).slice(1),
+            } satisfies ChangedContent)
+          }
 
           // Track the compiled CSS
           let compiledCss = ''
-          let compiledMap: SourceMap | null = null
 
           // Scan the entire `base` directory for full rebuilds.
-          if (rebuildStrategy.kind === 'full') {
+          if (rebuildStrategy === 'full') {
             // Read the new `input`.
             let input = args['--input']
               ? args['--input'] === '-'
@@ -364,23 +244,11 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
                   @import 'tailwindcss';
                 `
             clearRequireCache(resolvedFullRebuildPaths)
-
-            // Track current rebuild paths in case something goes wrong when
-            // performing a full rebuild.
-            backupRebuildPaths = fullRebuildPaths.slice()
-
-            // The `inputFilePath`, if provided, will be the only known full
-            // rebuild path before the compiler is re-created.
             fullRebuildPaths = inputFilePath ? [inputFilePath] : []
 
             // Create a new compiler, given the new `input`
             ;[compiler, scanner] = await createCompiler(input, I)
 
-            // Successfully created a new compiler, so the `fullRebuildPaths`
-            // will be updated. If other errors occur, we should be able to
-            // restore the paths unconditionally.
-            backupRebuildPaths = fullRebuildPaths.slice()
-
             // Scan the directory for candidates
             DEBUG && I.start('Scan for candidates')
             let candidates = scanner.scan()
@@ -388,107 +256,60 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
 
             // Setup new watchers
             DEBUG && I.start('Setup new watchers')
-            let newCleanupFunction = await createWatchers(await watchDirectories(scanner), handle)
+            let newCleanupWatchers = await createWatchers(watchDirectories(scanner), handle)
             DEBUG && I.end('Setup new watchers')
 
             // Clear old watchers
             DEBUG && I.start('Cleanup old watchers')
-            await Promise.all(cleanupWatchers.splice(0).map((cleanup) => cleanup()))
+            await cleanupWatchers()
             DEBUG && I.end('Cleanup old watchers')
 
-            cleanupWatchers.push(newCleanupFunction)
+            cleanupWatchers = newCleanupWatchers
 
             // Re-compile the CSS
             DEBUG && I.start('Build CSS')
             compiledCss = compiler.build(candidates)
             DEBUG && I.end('Build CSS')
-
-            if (args['--map']) {
-              DEBUG && I.start('Build Source Map')
-              compiledMap = toSourceMap(compiler.buildSourceMap())
-              DEBUG && I.end('Build Source Map')
-            }
           }
 
           // Scan changed files only for incremental rebuilds.
-          else if (rebuildStrategy.kind === 'incremental') {
+          else if (rebuildStrategy === 'incremental') {
             DEBUG && I.start('Scan for candidates')
-            let newCandidates = scanner.scanFiles(rebuildStrategy.changedFiles)
+            let newCandidates = scanner.scanFiles(changedFiles)
             DEBUG && I.end('Scan for candidates')
 
             // No new candidates found which means we don't need to write to
             // disk, and can return early.
             if (newCandidates.length <= 0) {
               let end = process.hrtime.bigint()
-              if (!args['--silent']) eprintln(`Done in ${formatDuration(end - start)}`)
+              eprintln(`Done in ${formatDuration(end - start)}`)
               return
             }
 
             DEBUG && I.start('Build CSS')
             compiledCss = compiler.build(newCandidates)
             DEBUG && I.end('Build CSS')
-
-            if (args['--map']) {
-              DEBUG && I.start('Build Source Map')
-              compiledMap = toSourceMap(compiler.buildSourceMap())
-              DEBUG && I.end('Build Source Map')
-            }
           }
 
-          await write(compiledCss, compiledMap, args, I)
+          await write(compiledCss, args, I)
 
           let end = process.hrtime.bigint()
-          if (!args['--silent']) eprintln(`Done in ${formatDuration(end - start)}`)
+          eprintln(`Done in ${formatDuration(end - start)}`)
         } catch (err) {
-          // It's important that we perform a full rebuild when any of the
-          // dependencies tracked in `fullRebuildPaths` has been changed.
-          //
-          // If we remove one of those files, then a subsequent build will be
-          // triggered, but it will fail because the dependency is gone. The
-          // compiler itself will be in a broken state and won't be able to
-          // register any dependencies therefore we want to restore all the
-          // dependencies from before. If we don't do that, then we won't be
-          // able to recover from a bug in a transitive dependency.
-          //
-          // E.g.:
-          // ```css
-          // /* input.css — known full rebuild path */
-          // @import 'tailwindcss';
-          // @config "./tailwind.config.js";
-          // ```
-          //
-          // ```js
-          // // tailwind.config.js
-          // const theme = require('./my-theme.js');
-          //
-          // module.exports = {
-          //   theme
-          // }
-          // ```
-          // In this case `my-theme.js` is a transitive dependency of
-          // `input.css` via `tailwind.config.js`. Removing `my-theme.js` will
-          // result in an error, restoring `my-theme.js` should trigger a
-          // fresh build even though the compiler didn't restore.
-          //
-          // Once the build error is fixed, a fresh full rebuild will happen
-          // which in turn will fixup the full rebuild paths.
-          fullRebuildPaths = backupRebuildPaths
-
           // Catch any errors and print them to stderr, but don't exit the process
           // and keep watching.
-          eprintln(formatError(err))
-
-          let end = process.hrtime.bigint()
-          if (!args['--silent']) eprintln(`Done in ${formatDuration(end - start)}`)
+          if (err instanceof Error) {
+            eprintln(err.toString())
+          }
         }
-      }),
+      },
     )
 
     // Abort the watcher if `stdin` is closed to avoid zombie processes. You can
     // disable this behavior with `--watch=always`.
     if (args['--watch'] !== 'always') {
       process.stdin.on('end', () => {
-        Promise.all(cleanupWatchers.map((fn) => fn())).then(
+        cleanupWatchers().then(
           () => process.exit(0),
           () => process.exit(1),
         )
@@ -505,197 +326,27 @@ export async function handle(args: Result<ReturnType<typeof options>>) {
   DEBUG && I.start('Build CSS')
   let output = await handleError(() => compiler.build(candidates))
   DEBUG && I.end('Build CSS')
-
-  let map: SourceMap | null = null
-
-  if (args['--map']) {
-    DEBUG && I.start('Build Source Map')
-    map = await handleError(() => toSourceMap(compiler.buildSourceMap()))
-    DEBUG && I.end('Build Source Map')
-  }
-
-  await write(output, map, args, I)
+  await write(output, args, I)
 
   let end = process.hrtime.bigint()
-  if (!args['--silent']) eprintln(`Done in ${formatDuration(end - start)}`)
-
-  // Watch for changes, using polling
-  if (args['--watch'] && pollInterval !== false) {
-    let cleanupPollingIndicator = () => {}
-
-    function logPollingMessage(message: string) {
-      if (!args['--silent']) {
-        process.stderr.write('\r\x1B[2K')
-      }
-
-      eprintln(message)
-
-      if (!args['--silent']) {
-        process.stderr.write(`\r\x1B[2K${dim(`Polling for changes…`)}`)
-      }
-    }
-
-    async function fullRebuild(I: Instrumentation) {
-      clearRequireCache(fullRebuildPaths)
-      backupRebuildPaths = fullRebuildPaths.slice()
-      fullRebuildPaths = inputFilePath ? [inputFilePath] : []
-
-      let input = args['--input']
-        ? args['--input'] === '-'
-          ? await drainStdin()
-          : await fs.readFile(args['--input'], 'utf-8')
-        : css`
-            @import 'tailwindcss';
-          `
-
-      ;[compiler, scanner] = await createCompiler(input, I)
-      backupRebuildPaths = fullRebuildPaths.slice()
-
-      DEBUG && I.start('Scan for candidates')
-      let candidates = scanner.scan()
-      DEBUG && I.end('Scan for candidates')
-
-      DEBUG && I.start('Build CSS')
-      let output = compiler.build(candidates)
-      DEBUG && I.end('Build CSS')
-
-      let map: SourceMap | null = null
-
-      if (args['--map']) {
-        DEBUG && I.start('Build Source Map')
-        map = toSourceMap(compiler.buildSourceMap())
-        DEBUG && I.end('Build Source Map')
-      }
-
-      await write(output, map, args, I)
-    }
-
-    if (!args['--silent']) {
-      let restored = false
-
-      function restoreCursor() {
-        if (restored) return
-        restored = true
-        process.stderr.write('\r\x1B[2K\x1B[?25h')
-        process.off('exit', restoreCursor)
-        process.off('SIGINT', onSigint)
-        process.off('SIGTERM', onSigterm)
-      }
-
-      function onSigint() {
-        restoreCursor()
-        process.exit(130)
-      }
-
-      function onSigterm() {
-        restoreCursor()
-        process.exit(143)
-      }
-
-      process.stderr.write('\x1B[?25l')
-      process.on('exit', restoreCursor)
-      process.on('SIGINT', onSigint)
-      process.on('SIGTERM', onSigterm)
-
-      cleanupPollingIndicator = restoreCursor
-      cleanupWatchers.push(async () => cleanupPollingIndicator())
-    }
-
-    cleanupWatchers.push(
-      createPollingWatcher(async () => {
-        using I = new Instrumentation()
-
-        DEBUG && I.start('Scan for candidates')
-        let candidates = scanner.scan()
-        DEBUG && I.end('Scan for candidates')
-
-        let files = scanner.scannedFiles.filter(
-          (file) => file !== args['--output'] && file !== args['--map'],
-        )
-
-        if (files.length <= 0) return
-
-        let start = process.hrtime.bigint()
-
-        let strategy = getRebuildStrategy(files, fullRebuildPaths)
-
-        if (strategy.kind === 'full') {
-          try {
-            await fullRebuild(I)
-          } catch (err) {
-            fullRebuildPaths = backupRebuildPaths
-
-            logPollingMessage(formatError(err))
-          }
-
-          if (!args['--silent']) {
-            logPollingMessage(`Done in ${formatDuration(process.hrtime.bigint() - start)}`)
-          }
-          return
-        }
-
-        // No candidates found which means we don't need to write to disk, and
-        // can return early.
-        if (candidates.length <= 0) {
-          if (!args['--silent']) {
-            logPollingMessage(`Done in ${formatDuration(process.hrtime.bigint() - start)}`)
-          }
-          return
-        }
-
-        DEBUG && I.start('Build CSS')
-        let output = compiler.build(candidates)
-        DEBUG && I.end('Build CSS')
-
-        let map: SourceMap | null = null
-
-        if (args['--map']) {
-          DEBUG && I.start('Build Source Map')
-          map = toSourceMap(compiler.buildSourceMap())
-          DEBUG && I.end('Build Source Map')
-        }
-
-        await write(output, map, args, I)
-
-        if (!args['--silent']) {
-          logPollingMessage(`Done in ${formatDuration(process.hrtime.bigint() - start)}`)
-        }
-      }, pollInterval),
-    )
-
-    if (args['--watch'] !== 'always') {
-      process.stdin.on('end', () => {
-        Promise.all(cleanupWatchers.map((fn) => fn())).then(
-          () => process.exit(0),
-          () => process.exit(1),
-        )
-      })
-    }
-
-    process.stdin.resume()
-    if (!args['--silent']) {
-      process.stderr.write(`\r\x1B[2K${dim(`Polling for changes…`)}`)
-    }
-  }
+  eprintln(header())
+  eprintln()
+  eprintln(`Done in ${formatDuration(end - start)}`)
 }
 
-// Load `@parcel/watcher` lazily so a missing or broken native binding only
-// affects `--watch` (without `--poll`), instead of crashing one-off builds and
-// polling mode as well.
-async function loadWatcher(): Promise<typeof import('@parcel/watcher')> {
-  try {
-    return (await import('@parcel/watcher')).default
-  } catch (err) {
-    throw new Error(
-      `Failed to load the file watcher. Your platform may not be supported by \`@parcel/watcher\`. As a workaround, you can use polling instead by passing the \`--watch --poll\` flags.`,
-      { cause: err },
-    )
-  }
+function watchDirectories(scanner: Scanner) {
+  return scanner.globs.flatMap((globEntry) => {
+    // We don't want a watcher for negated globs.
+    if (globEntry.pattern[0] === '!') return []
+
+    // We don't want a watcher for files, only directories.
+    if (globEntry.pattern === '') return []
+
+    return globEntry.base
+  })
 }
 
 async function createWatchers(dirs: string[], cb: (files: string[]) => void) {
-  let watcher = await loadWatcher()
-
   // Remove any directories that are children of an already watched directory.
   // If we don't we may not get notified of certain filesystem events regardless
   // of whether or not they are for the directory that is duplicated.
@@ -757,16 +408,10 @@ async function createWatchers(dirs: string[], cb: (files: string[]) => void) {
 
       await Promise.all(
         events.map(async (event) => {
-          // When a file is deleted, a rebuild should be triggered such that we
-          // can figure out whether this file must trigger a fresh build or not.
-          //
-          // If it must trigger a fresh build, then we will temporarily end up
-          // in a broken state, but an error will be shown to the user. Once the
-          // user resolves the issue, the CLI will recover.
-          if (event.type === 'delete') {
-            files.add(event.path)
-            return
-          }
+          // We currently don't handle deleted files because it doesn't influence
+          // the CSS output. This is because we currently keep all scanned
+          // candidates in a cache for performance reasons.
+          if (event.type === 'delete') return
 
           // Ignore directory changes. We only care about file changes
           let stats: Stats | null = null
@@ -797,78 +442,35 @@ async function createWatchers(dirs: string[], cb: (files: string[]) => void) {
   }
 }
 
-function getRebuildStrategy(
-  files: string[],
-  fullRebuildPaths: string[],
-): { kind: 'incremental'; changedFiles: ChangedContent[] } | { kind: 'full' } {
-  let changedFiles: ChangedContent[] = []
-
-  for (let file of files) {
-    // If one of the changed files is related to the input CSS or JS
-    // config/plugin files, then we need to do a full rebuild because
-    // the theme might have changed.
-    if (fullRebuildPaths.includes(file)) {
-      return { kind: 'full' }
-    }
-
-    // Track new and updated files for incremental rebuilds.
-    changedFiles.push({
-      file,
-      extension: path.extname(file).slice(1),
-    } satisfies ChangedContent)
+function optimizeCss(
+  input: string,
+  { file = 'input.css', minify = false }: { file?: string; minify?: boolean } = {},
+) {
+  function optimize(code: Buffer | Uint8Array) {
+    return transform({
+      filename: file,
+      code,
+      minify,
+      sourceMap: false,
+      drafts: {
+        customMedia: true,
+      },
+      nonStandard: {
+        deepSelectorCombinator: true,
+      },
+      include: Features.Nesting,
+      exclude: Features.LogicalProperties | Features.DirSelector | Features.LightDark,
+      targets: {
+        safari: (16 << 16) | (4 << 8),
+        ios_saf: (16 << 16) | (4 << 8),
+        firefox: 128 << 16,
+        chrome: 111 << 16,
+      },
+      errorRecovery: true,
+    }).code
   }
 
-  return { kind: 'incremental', changedFiles }
-}
-
-function createPollingWatcher(cb: () => Promise<void>, pollInterval: number) {
-  let disposed = false
-  let timer: ReturnType<typeof setTimeout> | null = null
-
-  async function poll() {
-    if (disposed) return
-
-    try {
-      await cb()
-    } catch (err) {
-      console.error(err)
-    } finally {
-      if (!disposed) {
-        timer = setTimeout(poll, pollInterval)
-      }
-    }
-  }
-
-  timer = setTimeout(poll, pollInterval)
-
-  return async () => {
-    disposed = true
-    if (timer) clearTimeout(timer)
-  }
-}
-
-async function watchDirectories(scanner: Scanner) {
-  let directories = (
-    await Promise.all(
-      scanner.normalizedSources.map(async (globEntry) => {
-        let resolvedPath = path.resolve(globEntry.base)
-        let realPath = await fs.realpath(resolvedPath).catch(() => resolvedPath)
-
-        return fs
-          .stat(realPath)
-          .then((stat) => (stat.isDirectory() ? [realPath] : []))
-          .catch(() => [])
-      }),
-    )
-  ).flat(1)
-
-  return Array.from(new Set(directories))
-}
-
-function dim(str: string) {
-  return `\x1B[2m${str}\x1B[22m`
-}
-
-function red(str: string) {
-  return `\x1B[31m${str}\x1B[39m`
+  // Running Lightning CSS twice to ensure that adjacent rules are merged after
+  // nesting is applied. This creates a more optimized output.
+  return optimize(optimize(Buffer.from(input))).toString()
 }
diff --git a/packages/@tailwindcss-cli/src/commands/build/utils.ts b/packages/@tailwindcss-cli/src/commands/build/utils.ts
index ecdd96726..b41a74358 100644
--- a/packages/@tailwindcss-cli/src/commands/build/utils.ts
+++ b/packages/@tailwindcss-cli/src/commands/build/utils.ts
@@ -13,19 +13,10 @@ export function drainStdin() {
 }
 
 export async function outputFile(file: string, contents: string) {
-  // Check for special files like `/dev/stdout` or pipes. We don't want to read from these as that
-  // will hang the process until the file descriptors are closed.
-  let isSpecialFile = await fs
-    .stat(file)
-    .then((stats) => stats.isCharacterDevice() || stats.isFIFO())
-    .catch(() => false)
-
-  if (!isSpecialFile) {
-    try {
-      let currentContents = await fs.readFile(file, 'utf8')
-      if (currentContents === contents) return // Skip writing the file
-    } catch {}
-  }
+  try {
+    let currentContents = await fs.readFile(file, 'utf8')
+    if (currentContents === contents) return // Skip writing the file
+  } catch {}
 
   // Ensure the parent directories exist
   await fs.mkdir(path.dirname(file), { recursive: true })
diff --git a/packages/@tailwindcss-cli/src/commands/canonicalize/canonicalize.test.ts b/packages/@tailwindcss-cli/src/commands/canonicalize/canonicalize.test.ts
deleted file mode 100644
index 4392380a5..000000000
--- a/packages/@tailwindcss-cli/src/commands/canonicalize/canonicalize.test.ts
+++ /dev/null
@@ -1,175 +0,0 @@
-import path from 'node:path'
-import { PassThrough, Readable } from 'node:stream'
-import { fileURLToPath } from 'node:url'
-import { describe, expect, test } from 'vitest'
-import { runCommandLine, streamStdin } from '.'
-import { normalizeWindowsSeparators } from '../../utils/test-helpers'
-
-let css = normalizeWindowsSeparators(
-  path.resolve(path.dirname(fileURLToPath(import.meta.url)), 'fixtures/input.css'),
-)
-
-describe('runCommandLine', { timeout: 30_000 }, () => {
-  test('canonicalizes, collapses, and sorts candidate groups from positional arguments', async () => {
-    let result = await runCommandLine({
-      argv: ['--css', css, 'py-3 p-1 px-3'],
-      stdinIsTTY: true,
-      stdoutIsTTY: false,
-    })
-
-    expect(result).toEqual({
-      exitCode: 0,
-      stdout: 'p-3',
-      stderr: '',
-    })
-  })
-
-  test('falls back to the default tailwind import when --css is omitted', async () => {
-    let result = await runCommandLine({
-      argv: ['py-3 p-1 px-3'],
-      cwd: path.dirname(css),
-      stdinIsTTY: true,
-      stdoutIsTTY: false,
-    })
-
-    expect(result).toEqual({
-      exitCode: 0,
-      stdout: 'p-3',
-      stderr: '',
-    })
-  })
-
-  test('canonicalizes, collapses, and sorts multiple groups from stdin lines', async () => {
-    let result = await runCommandLine({
-      argv: ['--css', css],
-      stdin: '[display:_flex_] py-3 p-1 px-3\nmt-2 mr-2 mb-2 ml-2 focus:hover:p-3 hover:p-1 py-3\n',
-      stdinIsTTY: false,
-      stdoutIsTTY: false,
-    })
-
-    expect(result).toEqual({
-      exitCode: 0,
-      stdout: 'flex p-3\nm-2 py-3 hover:p-1 focus:hover:p-3',
-      stderr: '',
-    })
-  })
-
-  test('collapses equivalent candidates', async () => {
-    let result = await runCommandLine({
-      argv: ['--css', css, 'mt-2 mr-2 mb-2 ml-2'],
-      stdinIsTTY: true,
-      stdoutIsTTY: false,
-    })
-
-    expect(result).toEqual({
-      exitCode: 0,
-      stdout: 'm-2',
-      stderr: '',
-    })
-  })
-
-  test('renders json output for processed candidate groups', async () => {
-    let result = await runCommandLine({
-      argv: ['--css', css, '--format', 'json', 'py-3 p-1 px-3'],
-      stdinIsTTY: true,
-      stdoutIsTTY: false,
-    })
-
-    expect(result.exitCode).toBe(0)
-    expect(JSON.parse(result.stdout)).toEqual([
-      {
-        input: 'py-3 p-1 px-3',
-        output: 'p-3',
-        changed: true,
-      },
-    ])
-    expect(result.stderr).toBe('')
-  })
-
-  test('splits candidate lists with segment-aware spacing', async () => {
-    let result = await runCommandLine({
-      argv: ['--css', css, '--format', 'json', "content-['hello world'] p-1"],
-      stdinIsTTY: true,
-      stdoutIsTTY: false,
-    })
-
-    expect(result.exitCode).toBe(0)
-    expect(JSON.parse(result.stdout)).toEqual([
-      {
-        input: "content-['hello world'] p-1",
-        output: "p-1 content-['hello_world']",
-        changed: true,
-      },
-    ])
-    expect(result.stderr).toBe('')
-  })
-
-  test('shows a usage error when no candidate groups are provided', async () => {
-    let result = await runCommandLine({
-      argv: ['--css', css],
-      stdinIsTTY: true,
-      stdoutIsTTY: false,
-    })
-
-    expect(result.exitCode).toBe(1)
-    expect(result.stderr).toBe('No candidate groups provided')
-    expect(result.stdout).toContain('Usage:')
-  })
-
-  test('streams canonicalized output line by line', async () => {
-    let input = Readable.from('py-3 p-1 px-3\nmt-2 mr-2 mb-2 ml-2\n')
-    let { stream: output, collect: collectOutput } = createOutput()
-
-    await streamStdin({ css, cwd: path.dirname(css), format: 'text', input, output })
-
-    expect(collectOutput()).toBe('p-3\nm-2\n')
-  })
-
-  test('streams empty lines as empty lines', async () => {
-    let input = Readable.from('py-3 p-1 px-3\n\nmt-2 mr-2 mb-2 ml-2\n')
-    let { stream: output, collect: collectOutput } = createOutput()
-
-    await streamStdin({ css, cwd: path.dirname(css), format: 'text', input, output })
-
-    expect(collectOutput()).toBe('p-3\n\nm-2\n')
-  })
-
-  test('streams json output when requested', async () => {
-    let input = Readable.from('py-3 p-1 px-3\nmt-2 mr-2 mb-2 ml-2\n')
-    let { stream: output, collect: collectOutput } = createOutput()
-
-    await streamStdin({ css, cwd: path.dirname(css), format: 'json', input, output })
-
-    expect(JSON.parse(collectOutput())).toEqual([
-      {
-        input: 'py-3 p-1 px-3',
-        output: 'p-3',
-        changed: true,
-      },
-      {
-        input: 'mt-2 mr-2 mb-2 ml-2',
-        output: 'm-2',
-        changed: true,
-      },
-    ])
-  })
-
-  test('streams jsonl output when requested', async () => {
-    let input = Readable.from('py-3 p-1 px-3\nmt-2 mr-2 mb-2 ml-2\n')
-    let { stream: output, collect: collectOutput } = createOutput()
-
-    await streamStdin({ css, cwd: path.dirname(css), format: 'jsonl', input, output })
-
-    expect(collectOutput()).toBe(
-      '{"input":"py-3 p-1 px-3","output":"p-3","changed":true}\n' +
-        '{"input":"mt-2 mr-2 mb-2 ml-2","output":"m-2","changed":true}\n',
-    )
-  })
-})
-
-function createOutput() {
-  let stream = new PassThrough()
-  let chunks: Buffer[] = []
-  stream.on('data', (chunk) => chunks.push(chunk))
-  return { stream, collect: () => Buffer.concat(chunks).toString() }
-}
diff --git a/packages/@tailwindcss-cli/src/commands/canonicalize/fixtures/input.css b/packages/@tailwindcss-cli/src/commands/canonicalize/fixtures/input.css
deleted file mode 100644
index d4b507858..000000000
--- a/packages/@tailwindcss-cli/src/commands/canonicalize/fixtures/input.css
+++ /dev/null
@@ -1 +0,0 @@
-@import 'tailwindcss';
diff --git a/packages/@tailwindcss-cli/src/commands/canonicalize/index.ts b/packages/@tailwindcss-cli/src/commands/canonicalize/index.ts
deleted file mode 100644
index 5aecfe51e..000000000
--- a/packages/@tailwindcss-cli/src/commands/canonicalize/index.ts
+++ /dev/null
@@ -1,362 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import fs from 'node:fs/promises'
-import path from 'node:path'
-import { createInterface } from 'node:readline'
-import type { Readable, Writable } from 'node:stream'
-import { compare } from '../../../../tailwindcss/src/utils/compare'
-import { segment } from '../../../../tailwindcss/src/utils/segment'
-import { args, type Arg } from '../../utils/args'
-import { help } from '../help'
-
-const css = String.raw
-export type OutputFormat = 'text' | 'json' | 'jsonl'
-
-export interface CandidateGroupResult {
-  input: string
-  output: string
-  changed: boolean
-}
-
-export interface RunCommandLineOptions {
-  argv?: string[]
-  cwd?: string
-  stdin?: string | null
-  stdinIsTTY?: boolean
-  stdoutIsTTY?: boolean
-}
-
-export interface RunCommandLineResult {
-  exitCode: number
-  stdout: string
-  stderr: string
-}
-
-export function usage() {
-  return 'tailwindcss canonicalize [classes...]'
-}
-
-function usageWithCss() {
-  return 'tailwindcss canonicalize --css input.css [classes...]'
-}
-
-function usageWithStream() {
-  return 'tailwindcss canonicalize --stream [--css input.css]'
-}
-
-export function options() {
-  return {
-    '--css': {
-      type: 'string',
-      description:
-        'CSS entry file used to load the Tailwind design system (defaults to `@import "tailwindcss";`)',
-    },
-    '--format': {
-      type: 'string',
-      description: 'Output format',
-      default: 'text',
-      values: ['text', 'json', 'jsonl'],
-    },
-    '--stream': {
-      type: 'boolean',
-      description: 'Read candidate groups from stdin line by line and write results to stdout',
-      default: false,
-    },
-  } satisfies Arg
-}
-
-const sharedOptions = {
-  '--help': {
-    type: 'boolean',
-    description: 'Display usage information',
-    alias: '-h',
-    default: false,
-  },
-} satisfies Arg
-
-export async function runCommandLine({
-  argv = process.argv.slice(2),
-  cwd = process.cwd(),
-  stdin = null,
-  stdinIsTTY = process.stdin.isTTY,
-  stdoutIsTTY = process.stdout.isTTY,
-}: RunCommandLineOptions = {}): Promise<RunCommandLineResult> {
-  try {
-    let flags = args(
-      {
-        ...options(),
-        ...sharedOptions,
-      },
-      argv,
-    )
-
-    let format = parseFormat(flags['--format'] ?? 'text')
-
-    if ((stdoutIsTTY && argv.length === 0) || flags['--help']) {
-      return {
-        exitCode: 0,
-        stdout: helpMessage() ?? '',
-        stderr: '',
-      }
-    }
-
-    if (flags['--stream']) {
-      await streamStdin({
-        css: flags['--css'],
-        cwd,
-        format,
-        input: process.stdin,
-        output: process.stdout,
-      })
-      return { exitCode: 0, stdout: '', stderr: '' }
-    }
-
-    let inputs = flags._.length > 0 ? flags._ : await readCandidateGroups({ stdin, stdinIsTTY })
-
-    if (inputs.length === 0) {
-      return usageError('No candidate groups provided')
-    }
-
-    let results = await processCandidateGroups({
-      css: flags['--css'],
-      cwd,
-      inputs,
-    })
-
-    return {
-      exitCode: 0,
-      stdout: formatCandidateResults(results, format),
-      stderr: '',
-    }
-  } catch (error) {
-    return {
-      exitCode: 1,
-      stdout: '',
-      stderr: error instanceof Error ? error.message : String(error),
-    }
-  }
-}
-
-export async function streamStdin({
-  css: cssFile,
-  cwd,
-  format,
-  input,
-  output,
-}: {
-  css: string | null
-  cwd: string
-  format: OutputFormat
-  input: Readable
-  output: Writable
-}): Promise<void> {
-  let designSystem = await loadDesignSystem(cssFile, cwd)
-  let rl = createInterface({ input })
-  let first = true
-
-  if (format === 'json') {
-    output.write('[')
-  }
-
-  for await (let line of rl) {
-    let result = createCandidateGroupResult(designSystem, line)
-
-    switch (format) {
-      case 'text': {
-        output.write(result.output + '\n')
-        break
-      }
-
-      case 'jsonl': {
-        output.write(JSON.stringify(result) + '\n')
-        break
-      }
-
-      case 'json': {
-        if (first) {
-          output.write('\n')
-        } else {
-          output.write(',\n')
-        }
-
-        output.write(indent(JSON.stringify(result, null, 2), 2))
-        first = false
-        break
-      }
-    }
-  }
-
-  if (format === 'json') {
-    output.write(first ? ']' : '\n]')
-  }
-}
-
-export function readCandidateGroups({
-  stdin,
-  stdinIsTTY,
-}: {
-  stdin: string | null
-  stdinIsTTY: boolean
-}) {
-  if (stdin !== null) {
-    return Promise.resolve(splitCandidateGroups(stdin))
-  }
-
-  if (stdinIsTTY) {
-    return Promise.resolve([])
-  }
-
-  return drainStdin().then(splitCandidateGroups)
-}
-
-export async function drainStdin() {
-  return new Promise<string>((resolve, reject) => {
-    let result = ''
-
-    process.stdin.on('data', (chunk) => {
-      result += chunk
-    })
-
-    process.stdin.on('end', () => resolve(result))
-    process.stdin.on('error', (err) => reject(err))
-  })
-}
-
-export async function processCandidateGroups({
-  css,
-  cwd = process.cwd(),
-  inputs,
-}: {
-  css: string | null
-  cwd?: string
-  inputs: string[]
-}): Promise<CandidateGroupResult[]> {
-  let designSystem = await loadDesignSystem(css, cwd)
-
-  return inputs.map((input) => createCandidateGroupResult(designSystem, input))
-}
-
-export function formatCandidateResults(results: CandidateGroupResult[], format: OutputFormat) {
-  switch (format) {
-    case 'json':
-      return JSON.stringify(results, null, 2)
-    case 'jsonl':
-      return results.map((result) => JSON.stringify(result)).join('\n')
-    case 'text':
-      return results.map((result) => result.output).join('\n')
-  }
-}
-
-function helpMessage() {
-  return help({
-    render: false,
-    usage: [usage(), usageWithCss(), usageWithStream()],
-    options: {
-      ...options(),
-      ...sharedOptions,
-    },
-  })
-}
-
-async function loadDesignSystem(cssFile: string | null, cwd: string) {
-  if (cssFile === null) {
-    return __unstable__loadDesignSystem(
-      css`
-        @import 'tailwindcss';
-      `,
-      { base: cwd },
-    )
-  }
-
-  let resolvedCssFile = path.resolve(cwd, cssFile)
-  let content = await fs.readFile(resolvedCssFile, 'utf8')
-  return __unstable__loadDesignSystem(content, {
-    base: path.dirname(resolvedCssFile),
-  })
-}
-
-function splitCandidateGroups(input: string) {
-  return input
-    .split(/\r?\n/g)
-    .map((line) => line.trim())
-    .filter((line) => line.length > 0)
-}
-
-function parseFormat(input: string): OutputFormat {
-  if (input === 'text' || input === 'json' || input === 'jsonl') {
-    return input
-  }
-
-  throw new Error(`Invalid value for --format: ${input}`)
-}
-
-function usageError(message: string): RunCommandLineResult {
-  return {
-    exitCode: 1,
-    stdout: helpMessage() ?? '',
-    stderr: message,
-  }
-}
-
-function splitCandidates(input: string) {
-  let trimmedInput = input.trim()
-  if (trimmedInput.length === 0) return []
-
-  return segment(trimmedInput, ' ')
-    .map((candidate) => candidate.trim())
-    .filter((candidate) => candidate.length > 0)
-}
-
-function canonicalize(
-  designSystem: Awaited<ReturnType<typeof __unstable__loadDesignSystem>>,
-  input: string,
-) {
-  let candidates = splitCandidates(input)
-  candidates = designSystem.canonicalizeCandidates(candidates, {
-    collapse: true,
-    logicalToPhysical: true,
-  })
-  return defaultSort(designSystem.getClassOrder(candidates)).join(' ')
-}
-
-function createCandidateGroupResult(
-  designSystem: Awaited<ReturnType<typeof __unstable__loadDesignSystem>>,
-  input: string,
-): CandidateGroupResult {
-  let output = canonicalize(designSystem, input)
-
-  return {
-    input,
-    output,
-    changed: output !== input,
-  }
-}
-
-function indent(input: string, size: number) {
-  let prefix = ' '.repeat(size)
-  return input
-    .split('\n')
-    .map((line) => prefix + line)
-    .join('\n')
-}
-
-function defaultSort(entries: [string, bigint | null][]) {
-  return entries
-    .slice()
-    .sort(([candidateA, orderA], [candidateZ, orderZ]) => {
-      if (orderA === orderZ) return compare(candidateA, candidateZ)
-      if (orderA === null) return -1
-      if (orderZ === null) return 1
-      return bigSign(orderA - orderZ) || compare(candidateA, candidateZ)
-    })
-    .map(([candidate]) => candidate)
-}
-
-function bigSign(value: bigint) {
-  if (value > 0n) {
-    return 1
-  } else if (value === 0n) {
-    return 0
-  } else {
-    return -1
-  }
-}
diff --git a/packages/@tailwindcss-cli/src/commands/help/index.ts b/packages/@tailwindcss-cli/src/commands/help/index.ts
index b557d03e0..20ee78208 100644
--- a/packages/@tailwindcss-cli/src/commands/help/index.ts
+++ b/packages/@tailwindcss-cli/src/commands/help/index.ts
@@ -3,34 +3,30 @@ import type { Arg } from '../../utils/args'
 import { UI, header, highlight, indent, println, wordWrap } from '../../utils/renderer'
 
 export function help({
-  render = true,
   invalid,
   usage,
   options,
 }: {
-  render?: boolean
   invalid?: string
   usage?: string[]
   options?: Arg
 }) {
   // Available terminal width
-  let width = process.stdout.columns ?? 80
-  let lines: string[] = []
-  let writeLine = render ? println : (value = '') => void lines.push(value)
+  let width = process.stdout.columns
 
   // Render header
-  writeLine(header())
+  println(header())
 
   // Render the invalid command
   if (invalid) {
-    writeLine()
-    writeLine(`${pc.dim('Invalid command:')} ${invalid}`)
+    println()
+    println(`${pc.dim('Invalid command:')} ${invalid}`)
   }
 
   // Render usage
   if (usage && usage.length > 0) {
-    writeLine()
-    writeLine(pc.dim('Usage:'))
+    println()
+    println(pc.dim('Usage:'))
     for (let [idx, example] of usage.entries()) {
       // Split the usage example into the command and its options. This allows
       // us to wrap the options based on the available width of the terminal.
@@ -69,7 +65,7 @@ export function help({
       //     tailwindcss other [--watch] [options...]
       // ```
       if (lines.length > 1 && idx !== 0) {
-        writeLine()
+        println()
       }
 
       // Print the usage examples based on available width of the terminal.
@@ -90,9 +86,9 @@ export function help({
       // ```
       //
       // > Note how the second line is indented to align with the first line.
-      writeLine(indent(`${command}${lines.shift()}`))
+      println(indent(`${command}${lines.shift()}`))
       for (let line of lines) {
-        writeLine(indent(line, command.length))
+        println(indent(line, command.length))
       }
     }
   }
@@ -116,11 +112,7 @@ export function help({
     // `alias` followed by `, ` and followed by the `flag`.
     let maxOptionLength = 0
 
-    for (let [flag, { alias, values }] of Object.entries(options)) {
-      if (values?.length) {
-        flag += `[=${values.join(', ')}]`
-      }
-
+    for (let [flag, { alias }] of Object.entries(options)) {
       // The option string, which is the combination of the alias and the flag
       // but already properly indented based on the other aliases to ensure
       // everything is aligned properly.
@@ -135,8 +127,8 @@ export function help({
       maxOptionLength = Math.max(maxOptionLength, option.length)
     }
 
-    writeLine()
-    writeLine(pc.dim('Options:'))
+    println()
+    println(pc.dim('Options:'))
 
     // The minimum amount of dots between the option and the description.
     let minimumGap = 8
@@ -164,19 +156,15 @@ export function help({
       )
 
       // Print the option, the spacer dots and the start of the description.
-      writeLine(
+      println(
         indent(`${pc.blue(option)} ${pc.dim(pc.gray('\u00B7')).repeat(dotCount)} ${lines.shift()}`),
       )
 
       // Print the remaining lines of the description, indenting them to align
       // with the start of the description.
       for (let line of lines) {
-        writeLine(indent(`${' '.repeat(option.length + dotCount + spaces)}${line}`))
+        println(indent(`${' '.repeat(option.length + dotCount + spaces)}${line}`))
       }
     }
   }
-
-  if (!render) {
-    return lines.join('\n')
-  }
 }
diff --git a/packages/@tailwindcss-cli/src/index.ts b/packages/@tailwindcss-cli/src/index.ts
index 1543f7d13..41807f174 100644
--- a/packages/@tailwindcss-cli/src/index.ts
+++ b/packages/@tailwindcss-cli/src/index.ts
@@ -3,80 +3,46 @@
 import { args, type Arg } from './utils/args'
 
 import * as build from './commands/build'
-import * as canonicalize from './commands/canonicalize'
 import { help } from './commands/help'
 
 const sharedOptions = {
   '--help': { type: 'boolean', description: 'Display usage information', alias: '-h' },
 } satisfies Arg
 
-function buildUsage(command = 'tailwindcss') {
-  return `${command} [--input input.css] [--output output.css] [--watch] [--poll=ms] [options…]`
-}
+const flags = args({
+  ...build.options(),
+  ...sharedOptions,
+})
+const command = flags._[0]
 
-function rootHelp({ invalid }: { invalid?: string } = {}) {
+// Right now we don't support any sub-commands. Let's show the help message
+// instead.
+if (command) {
   help({
-    invalid,
-    usage: [buildUsage('tailwindcss'), buildUsage('tailwindcss build'), canonicalize.usage()],
-    commands: {
-      build: 'Build your CSS',
-      canonicalize: 'Canonicalize candidate lists',
-    },
+    invalid: command,
+    usage: ['tailwindcss [options]'],
     options: { ...build.options(), ...sharedOptions },
   })
+  process.exit(1)
 }
 
-async function run() {
-  let argv = process.argv.slice(2)
-  let command = argv[0]
-  let rootFlags = args({ ...build.options(), ...sharedOptions }, argv)
-
-  if (command === 'build') {
-    let flags = args({ ...build.options(), ...sharedOptions }, argv.slice(1))
-
-    if ((process.stdout.isTTY && argv.length === 1) || flags['--help']) {
-      help({
-        usage: [buildUsage('tailwindcss build')],
-        options: { ...build.options(), ...sharedOptions },
-      })
-      process.exit(0)
-    }
-
-    await build.handle(flags)
-    return
-  }
-
-  if (command === 'canonicalize') {
-    let result = await canonicalize.runCommandLine({ argv: argv.slice(1) })
-
-    if (result.stdout.length > 0) {
-      process.stdout.write(`${result.stdout}\n`)
-    }
-
-    if (result.stderr.length > 0) {
-      process.stderr.write(`${result.stderr}\n`)
-    }
-
-    process.exitCode = result.exitCode
-    return
-  }
-
-  if ((process.stdout.isTTY && command === undefined) || rootFlags['--help']) {
-    rootHelp()
-    process.exit(0)
-  }
-
-  if (command && !command.startsWith('-')) {
-    rootHelp({ invalid: command })
-    process.exit(1)
-  }
-
-  let flags = args({
-    ...build.options(),
-    ...sharedOptions,
+// Display main help message if no command is being used.
+//
+// E.g.:
+//
+//   - `tailwindcss`                // should show the help message
+//
+// E.g.: implicit `build` command
+//
+//   - `tailwindcss -o output.css`  // should run the build command, not show the help message
+//   - `tailwindcss > output.css`   // should run the build command, not show the help message
+if ((process.stdout.isTTY && process.argv[2] === undefined) || flags['--help']) {
+  help({
+    usage: ['tailwindcss [--input input.css] [--output output.css] [--watch] [options…]'],
+    options: { ...build.options(), ...sharedOptions },
   })
-
-  await build.handle(flags)
+  process.exit(0)
 }
 
-await run()
+// Handle the build command
+build.handle(flags)
diff --git a/packages/@tailwindcss-cli/src/utils/args.test.ts b/packages/@tailwindcss-cli/src/utils/args.test.ts
index 249fb23eb..51d2c4747 100644
--- a/packages/@tailwindcss-cli/src/utils/args.test.ts
+++ b/packages/@tailwindcss-cli/src/utils/args.test.ts
@@ -17,38 +17,6 @@ it('should be possible to parse a single argument', () => {
   `)
 })
 
-it('should only return the last value for duplicate arguments', () => {
-  expect(
-    args(
-      {
-        '--output': { type: 'string', description: 'Output file' },
-      },
-      ['--output', 'output.css', '--output', 'override.css'],
-    ),
-  ).toMatchInlineSnapshot(`
-    {
-      "--output": "override.css",
-      "_": [],
-    }
-  `)
-})
-
-it('uses last value when flag with "-" is supplied multiple times', () => {
-  let result = args(
-    {
-      '--output': { type: 'string', description: 'Output file', alias: '-o' },
-    },
-    ['--output', 'output.css', '--output', '-'],
-  )
-
-  expect(result).toMatchInlineSnapshot(`
-    {
-      "--output": "-",
-      "_": [],
-    }
-  `)
-})
-
 it('should fallback to the default value if no flag is passed', () => {
   expect(
     args(
@@ -153,34 +121,3 @@ it('should be possible to provide multiple types, and convert the value to that
     }
   `)
 })
-
-it('should be possible to provide boolean or number arguments', () => {
-  let options = {
-    '--poll': {
-      type: 'boolean | number',
-      description: 'Use polling instead of filesystem events when watching',
-      default: false,
-    },
-  } satisfies Arg
-
-  expect(args(options, ['--poll'])).toMatchInlineSnapshot(`
-    {
-      "--poll": true,
-      "_": [],
-    }
-  `)
-
-  expect(args(options, ['--poll=50'])).toMatchInlineSnapshot(`
-    {
-      "--poll": 50,
-      "_": [],
-    }
-  `)
-
-  expect(args(options, ['--poll=foo'])).toMatchInlineSnapshot(`
-    {
-      "--poll": undefined,
-      "_": [],
-    }
-  `)
-})
diff --git a/packages/@tailwindcss-cli/src/utils/args.ts b/packages/@tailwindcss-cli/src/utils/args.ts
index 88b306b05..1e4e153b8 100644
--- a/packages/@tailwindcss-cli/src/utils/args.ts
+++ b/packages/@tailwindcss-cli/src/utils/args.ts
@@ -7,7 +7,6 @@ export type Arg = {
     description: string
     alias?: `-${string}`
     default?: Types[keyof Types]
-    values?: string[]
   }
 }
 
@@ -77,17 +76,9 @@ export function args<const T extends Arg>(options: T, argv = process.argv.slice(
   let parsed = parse(argv)
 
   for (let key in parsed) {
-    let value = parsed[key]
-
-    if (key !== '_' && Array.isArray(value)) {
-      value = value[value.length - 1]
+    if (parsed[key] === '__IO_DEFAULT_VALUE__') {
+      parsed[key] = '-'
     }
-
-    if (value === '__IO_DEFAULT_VALUE__') {
-      value = '-'
-    }
-
-    parsed[key] = value
   }
 
   let result: { _: string[]; [key: string]: unknown } = {
diff --git a/packages/@tailwindcss-cli/src/utils/renderer.test.ts b/packages/@tailwindcss-cli/src/utils/renderer.test.ts
index 7acef4551..b9950655f 100644
--- a/packages/@tailwindcss-cli/src/utils/renderer.test.ts
+++ b/packages/@tailwindcss-cli/src/utils/renderer.test.ts
@@ -1,29 +1,29 @@
 import path from 'node:path'
 import { describe, expect, it } from 'vitest'
 import { relative, wordWrap } from './renderer'
-import { normalizeWindowsSeparators } from './test-helpers'
+import { normalizeWindowsSeperators } from './test-helpers'
 
 describe('relative', () => {
   it('should print an absolute path relative to the current working directory', () => {
-    expect(normalizeWindowsSeparators(relative(path.resolve('index.css')))).toMatchInlineSnapshot(
+    expect(normalizeWindowsSeperators(relative(path.resolve('index.css')))).toMatchInlineSnapshot(
       `"./index.css"`,
     )
   })
 
   it('should prefer the shortest value by default', () => {
     // Shortest between absolute and relative paths
-    expect(normalizeWindowsSeparators(relative('index.css'))).toMatchInlineSnapshot(`"index.css"`)
+    expect(normalizeWindowsSeperators(relative('index.css'))).toMatchInlineSnapshot(`"index.css"`)
   })
 
   it('should be possible to override the current working directory', () => {
-    expect(normalizeWindowsSeparators(relative('../utils/index.css', '..'))).toMatchInlineSnapshot(
+    expect(normalizeWindowsSeperators(relative('../utils/index.css', '..'))).toMatchInlineSnapshot(
       `"./utils/index.css"`,
     )
   })
 
   it('should be possible to always prefer the relative path', () => {
     expect(
-      normalizeWindowsSeparators(
+      normalizeWindowsSeperators(
         relative('index.css', process.cwd(), { preferAbsoluteIfShorter: false }),
       ),
     ).toMatchInlineSnapshot(`"./index.css"`)
diff --git a/packages/@tailwindcss-cli/src/utils/renderer.ts b/packages/@tailwindcss-cli/src/utils/renderer.ts
index da817dda7..6b0098586 100644
--- a/packages/@tailwindcss-cli/src/utils/renderer.ts
+++ b/packages/@tailwindcss-cli/src/utils/renderer.ts
@@ -49,9 +49,7 @@ export function wordWrap(text: string, width: number) {
   for (let word of words) {
     let wordLength = stripVTControlCharacters(word).length
 
-    // A word longer than `width` is kept on its own line rather than
-    // introducing an empty line before it.
-    if (lineLength > 0 && lineLength + wordLength + 1 > width) {
+    if (lineLength + wordLength + 1 > width) {
       lines.push(line)
       line = ''
       lineLength = 0
diff --git a/packages/@tailwindcss-cli/src/utils/test-helpers.ts b/packages/@tailwindcss-cli/src/utils/test-helpers.ts
index 30f4fc777..8e61b0a13 100644
--- a/packages/@tailwindcss-cli/src/utils/test-helpers.ts
+++ b/packages/@tailwindcss-cli/src/utils/test-helpers.ts
@@ -1,5 +1,5 @@
 import path from 'node:path'
 
-export function normalizeWindowsSeparators(p: string) {
+export function normalizeWindowsSeperators(p: string) {
   return path.sep === '\\' ? p.replaceAll('\\', '/') : p
 }
diff --git a/packages/@tailwindcss-compatibility/README.md b/packages/@tailwindcss-compatibility/README.md
new file mode 100644
index 000000000..95ec9d87d
--- /dev/null
+++ b/packages/@tailwindcss-compatibility/README.md
@@ -0,0 +1,40 @@
+<p align="center">
+  <a href="https://tailwindcss.com" target="_blank">
+    <picture>
+      <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg">
+      <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg">
+      <img alt="Tailwind CSS" src="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg" width="350" height="70" style="max-width: 100%;">
+    </picture>
+  </a>
+</p>
+
+<p align="center">
+  A utility-first CSS framework for rapidly building custom user interfaces.
+</p>
+
+<p align="center">
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
+    <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+</p>
+
+---
+
+## Documentation
+
+For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
+
+## Community
+
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
+
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
+
+## Contributing
+
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-webpack/package.json b/packages/@tailwindcss-compatibility/package.json
similarity index 54%
rename from packages/@tailwindcss-webpack/package.json
rename to packages/@tailwindcss-compatibility/package.json
index dce09429d..a69f778b7 100644
--- a/packages/@tailwindcss-webpack/package.json
+++ b/packages/@tailwindcss-compatibility/package.json
@@ -1,16 +1,17 @@
 {
-  "name": "@tailwindcss/webpack",
-  "version": "4.3.3",
-  "description": "A webpack loader for Tailwind CSS v4.",
+  "name": "@tailwindcss/compatibility",
+  "version": "4.0.15",
+  "description": "PostCSS plugin for Tailwind CSS, a utility-first CSS framework for rapidly building custom user interfaces",
   "license": "MIT",
   "repository": {
     "type": "git",
     "url": "https://github.com/tailwindlabs/tailwindcss.git",
-    "directory": "packages/@tailwindcss-webpack"
+    "directory": "packages/@tailwindcss-postcss"
   },
   "bugs": "https://github.com/tailwindlabs/tailwindcss/issues",
   "homepage": "https://tailwindcss.com",
   "scripts": {
+    "lint": "tsc --noEmit",
     "build": "tsup-node",
     "dev": "pnpm run build -- --watch"
   },
@@ -28,28 +29,22 @@
       "require": "./dist/index.js"
     }
   },
-  "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
   "dependencies": {
-    "@alloc/quick-lru": "^5.2.0",
+    "@csstools/postcss-cascade-layers": "^5.0.1",
+    "@csstools/postcss-color-mix-function": "^3.0.8",
+    "@csstools/postcss-oklab-function": "^4.0.8",
     "@tailwindcss/node": "workspace:*",
     "@tailwindcss/oxide": "workspace:*",
-    "tailwindcss": "workspace:*"
+    "autoprefixer": "^10.4.21",
+    "lightningcss": "catalog:",
+    "postcss": "^8.4.41",
+    "postcss-media-minmax": "^5.0.0",
+    "postcss-nesting": "^13.0.1"
   },
   "devDependencies": {
     "@types/node": "catalog:",
-    "webpack": "catalog:"
-  },
-  "peerDependencies": {
-    "@rspack/core": "^1.0.0 || ^2.0.0",
-    "webpack": "^5.0.0"
-  },
-  "peerDependenciesMeta": {
-    "@rspack/core": {
-      "optional": true
-    },
-    "webpack": {
-      "optional": true
-    }
+    "dedent": "1.5.3",
+    "@tailwindcss/postcss": "workspace:*",
+    "tailwindcss": "workspace:*"
   }
 }
diff --git a/packages/@tailwindcss-compatibility/src/at-property-polyfill.ts b/packages/@tailwindcss-compatibility/src/at-property-polyfill.ts
new file mode 100644
index 000000000..f40d7f0b3
--- /dev/null
+++ b/packages/@tailwindcss-compatibility/src/at-property-polyfill.ts
@@ -0,0 +1,78 @@
+import postcss from 'postcss'
+
+export default () => {
+  return {
+    postcssPlugin: '@tailwindcss/postcss-at-property-polyfill',
+    Once(root: postcss.Root) {
+      const propertyRules = new Map<string, postcss.AtRule>()
+      const initialValues = new Map<string, string>()
+      const nonInheritableValues = new Map<string, string>()
+
+      // Collect @property rules
+      root.walkAtRules('property', (rule: postcss.AtRule) => {
+        const name = rule.params.trim()
+
+        propertyRules.set(name, rule)
+
+        let value: string | null = null
+        rule.walkDecls('initial-value', (decl: postcss.Declaration) => {
+          if (decl.value) {
+            value = decl.value
+          }
+        })
+
+        rule.walkDecls('inherits', (decl: postcss.Declaration) => {
+          if (decl.value === 'false') {
+            nonInheritableValues.set(name, value ? value : 'initial')
+          }
+        })
+
+        if (value && !nonInheritableValues.has(name)) {
+          initialValues.set(name, value)
+        }
+
+        rule.remove()
+      })
+
+      // Add initial values to :root in a layer
+      if (initialValues.size > 0 || nonInheritableValues.size > 0) {
+        const layer = postcss.atRule({
+          name: 'layer',
+          params: '',
+        })
+
+        if (initialValues.size > 0) {
+          const rootRule = postcss.rule({
+            selector: ':root',
+          })
+
+          for (const [name, value] of initialValues) {
+            rootRule.append({
+              prop: name,
+              value: value,
+            })
+          }
+          layer.append(rootRule)
+        }
+
+        if (nonInheritableValues.size > 0) {
+          const rootRule = postcss.rule({
+            selector: '*, *:before, *:after, *:backdrop',
+          })
+
+          for (const [name, value] of nonInheritableValues) {
+            rootRule.append({
+              prop: name,
+              value: value,
+            })
+          }
+          layer.append(rootRule)
+        }
+
+        root.prepend(layer)
+      }
+    },
+  }
+}
+
+export const postcssPlugin = 'postcss-at-property-polyfill'
diff --git a/packages/@tailwindcss-compatibility/src/index.cts b/packages/@tailwindcss-compatibility/src/index.cts
new file mode 100644
index 000000000..065423471
--- /dev/null
+++ b/packages/@tailwindcss-compatibility/src/index.cts
@@ -0,0 +1,7 @@
+import compatibility from './index.ts'
+
+// This is used instead of `export default` to work around a bug in
+// `postcss-load-config`
+
+// @ts-ignore
+export = compatibility
diff --git a/packages/@tailwindcss-compatibility/src/index.test.ts b/packages/@tailwindcss-compatibility/src/index.test.ts
new file mode 100644
index 000000000..93380b95b
--- /dev/null
+++ b/packages/@tailwindcss-compatibility/src/index.test.ts
@@ -0,0 +1,58 @@
+import tailwindcss from '@tailwindcss/postcss'
+import dedent from 'dedent'
+import postcss from 'postcss'
+import { expect, test } from 'vitest'
+import compatibility from './index'
+
+const css = dedent
+
+test('does the thing', async () => {
+  let processor = postcss([tailwindcss(), compatibility()])
+
+  let result = await processor.process(
+    css`
+      @layer theme, base, components, utilities;
+
+      @import 'tailwindcss/theme.css' layer(theme) theme(inline);
+      /* @import 'tailwindcss/preflight.css' layer(base); */
+      @import 'tailwindcss/utilities.css' layer(utilities) source(none);
+
+      @source inline("h-14 bg-linear-to-bl from-violet-500/50 to-fuchsia-500/50");
+    `,
+    { from: `${__dirname}/input.css` },
+  )
+
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    "@layer {
+      *, *:before, *:after, *:backdrop {
+        --tw-gradient-position: initial;
+        --tw-gradient-from: #0000;
+        --tw-gradient-via: #0000;
+        --tw-gradient-to: #0000;
+        --tw-gradient-stops: initial;
+        --tw-gradient-via-stops: initial;
+        --tw-gradient-from-position: 0%;
+        --tw-gradient-via-position: 50%;
+        --tw-gradient-to-position: 100%;
+      }
+    }
+    @layer theme, base, components, utilities;
+    @layer utilities {
+      .h-14 {
+        height: calc(0.25rem * 14);
+      }
+      .bg-linear-to-bl {
+        --tw-gradient-position: to bottom left in oklab;
+        background-image: linear-gradient(var(--tw-gradient-stops));
+      }
+      .from-violet-500\\/50 {
+        --tw-gradient-from: color-mix(in oklab, oklch(0.606 0.25 292.717) 50%, transparent);
+        --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+      }
+      .to-fuchsia-500\\/50 {
+        --tw-gradient-to: color-mix(in oklab, oklch(0.667 0.295 322.15) 50%, transparent);
+        --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
+      }
+    }"
+  `)
+})
diff --git a/packages/@tailwindcss-compatibility/src/index.ts b/packages/@tailwindcss-compatibility/src/index.ts
new file mode 100644
index 000000000..a764b7cbe
--- /dev/null
+++ b/packages/@tailwindcss-compatibility/src/index.ts
@@ -0,0 +1,30 @@
+// import postcssCascadeLayers from '@csstools/postcss-cascade-layers'
+import postcssColorMixFunction from '@csstools/postcss-color-mix-function'
+import postcssOklabFunction from '@csstools/postcss-oklab-function'
+import autoprefixer from 'autoprefixer'
+import type { AcceptedPlugin, PluginCreator } from 'postcss'
+// @ts-ignore
+import postcssMediaMinmax from 'postcss-media-minmax'
+import postcssNesting from 'postcss-nesting'
+import atPropertyPolyfill from './at-property-polyfill'
+
+// TODO:
+//  - [ ] Replace `calc(infinity)` stuff
+//  - tbd
+
+function compatibility(): AcceptedPlugin {
+  return {
+    postcssPlugin: '@tailwindcss/compatibility',
+    plugins: [
+      // postcssCascadeLayers(),
+      atPropertyPolyfill(),
+      postcssMediaMinmax(),
+      postcssOklabFunction(),
+      postcssColorMixFunction(),
+      postcssNesting(),
+      autoprefixer(),
+    ],
+  }
+}
+
+export default Object.assign(compatibility, { postcss: true }) as PluginCreator<{}>
diff --git a/packages/@tailwindcss-compatibility/tsconfig.json b/packages/@tailwindcss-compatibility/tsconfig.json
new file mode 100644
index 000000000..6ae022f65
--- /dev/null
+++ b/packages/@tailwindcss-compatibility/tsconfig.json
@@ -0,0 +1,3 @@
+{
+  "extends": "../tsconfig.base.json",
+}
diff --git a/packages/@tailwindcss-turbopack/tsup.config.ts b/packages/@tailwindcss-compatibility/tsup.config.ts
similarity index 94%
rename from packages/@tailwindcss-turbopack/tsup.config.ts
rename to packages/@tailwindcss-compatibility/tsup.config.ts
index 998eebe4f..684c072ac 100644
--- a/packages/@tailwindcss-turbopack/tsup.config.ts
+++ b/packages/@tailwindcss-compatibility/tsup.config.ts
@@ -3,7 +3,6 @@ import { defineConfig } from 'tsup'
 export default defineConfig([
   {
     format: ['esm'],
-    clean: true,
     minify: true,
     cjsInterop: true,
     dts: true,
diff --git a/packages/@tailwindcss-node/README.md b/packages/@tailwindcss-node/README.md
index 5f532607d..95ec9d87d 100644
--- a/packages/@tailwindcss-node/README.md
+++ b/packages/@tailwindcss-node/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,10 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-node/package.json b/packages/@tailwindcss-node/package.json
index 0eced7366..7c4bfe55e 100644
--- a/packages/@tailwindcss-node/package.json
+++ b/packages/@tailwindcss-node/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/node",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "repository": {
@@ -19,46 +19,26 @@
   ],
   "publishConfig": {
     "provenance": true,
-    "access": "public",
-    "exports": {
-      ".": {
-        "types": "./dist/index.d.ts",
-        "import": "./dist/index.mjs",
-        "require": "./dist/index.js"
-      },
-      "./require-cache": {
-        "types": "./dist/require-cache.d.ts",
-        "default": "./dist/require-cache.js"
-      },
-      "./esm-cache-loader": {
-        "types": "./dist/esm-cache.loader.d.mts",
-        "default": "./dist/esm-cache.loader.mjs"
-      }
-    }
+    "access": "public"
   },
   "exports": {
     ".": {
-      "types": "./src/index.ts",
-      "import": "./src/index.ts",
-      "require": "./src/index.cts"
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
     },
     "./require-cache": {
-      "types": "./src/require-cache.ts",
-      "import": "./src/require-cache.ts",
-      "require": "./src/require-cache.cts"
+      "types": "./dist/require-cache.d.ts",
+      "default": "./dist/require-cache.js"
     },
     "./esm-cache-loader": {
-      "types": "./src/esm-cache.loader.mts",
-      "default": "./src/esm-cache.loader.mts"
+      "types": "./dist/esm-cache.loader.d.mts",
+      "default": "./dist/esm-cache.loader.mjs"
     }
   },
   "dependencies": {
-    "@jridgewell/remapping": "^2.3.5",
-    "enhanced-resolve": "catalog:",
-    "jiti": "^2.7.0",
-    "lightningcss": "catalog:",
-    "magic-string": "^1.1.0",
-    "source-map-js": "^1.2.1",
+    "enhanced-resolve": "^5.18.1",
+    "jiti": "^2.4.2",
     "tailwindcss": "workspace:*"
   }
 }
diff --git a/packages/@tailwindcss-node/src/compile.ts b/packages/@tailwindcss-node/src/compile.ts
index e5f8782c8..54e0256b9 100644
--- a/packages/@tailwindcss-node/src/compile.ts
+++ b/packages/@tailwindcss-node/src/compile.ts
@@ -2,29 +2,26 @@ import EnhancedResolve from 'enhanced-resolve'
 import { createJiti, type Jiti } from 'jiti'
 import fs from 'node:fs'
 import fsPromises from 'node:fs/promises'
-import path from 'node:path'
+import path, { dirname } from 'node:path'
 import { pathToFileURL } from 'node:url'
 import {
   __unstable__loadDesignSystem as ___unstable__loadDesignSystem,
   compile as _compile,
   compileAst as _compileAst,
   Features,
-  Polyfills,
 } from 'tailwindcss'
 import type { AstNode } from '../../tailwindcss/src/ast'
 import { getModuleDependencies } from './get-module-dependencies'
 import { rewriteUrls } from './urls'
 
-export { Features, Polyfills }
+export { Features }
 
 export type Resolver = (id: string, base: string) => Promise<string | false | undefined>
 
 export interface CompileOptions {
   base: string
-  from?: string
   onDependency: (path: string) => void
   shouldRewriteUrls?: boolean
-  polyfills?: Polyfills
 
   customCssResolver?: Resolver
   customJsResolver?: Resolver
@@ -32,8 +29,6 @@ export interface CompileOptions {
 
 function createCompileOptions({
   base,
-  from,
-  polyfills,
   onDependency,
   shouldRewriteUrls,
 
@@ -42,8 +37,6 @@ function createCompileOptions({
 }: CompileOptions) {
   return {
     base,
-    polyfills,
-    from,
     async loadModule(id: string, base: string) {
       return loadModule(id, base, onDependency, customJsResolver)
     },
@@ -63,9 +56,10 @@ function createCompileOptions({
   }
 }
 
-async function ensureSourceDetectionRootExists(compiler: {
-  root: Awaited<ReturnType<typeof compile>>['root']
-}) {
+async function ensureSourceDetectionRootExists(
+  compiler: { root: Awaited<ReturnType<typeof compile>>['root'] },
+  base: string,
+) {
   // Verify if the `source(…)` path exists (until the glob pattern starts)
   if (compiler.root && compiler.root !== 'none') {
     let globSymbols = /[*{]/
@@ -79,27 +73,25 @@ async function ensureSourceDetectionRootExists(compiler: {
     }
 
     let exists = await fsPromises
-      .stat(path.resolve(compiler.root.base, basePath.join('/')))
+      .stat(path.resolve(base, basePath.join('/')))
       .then((stat) => stat.isDirectory())
       .catch(() => false)
 
     if (!exists) {
-      throw new Error(
-        `The \`source(${compiler.root.pattern})\` does not exist or is not a directory.`,
-      )
+      throw new Error(`The \`source(${compiler.root.pattern})\` does not exist`)
     }
   }
 }
 
 export async function compileAst(ast: AstNode[], options: CompileOptions) {
   let compiler = await _compileAst(ast, createCompileOptions(options))
-  await ensureSourceDetectionRootExists(compiler)
+  await ensureSourceDetectionRootExists(compiler, options.base)
   return compiler
 }
 
 export async function compile(css: string, options: CompileOptions) {
   let compiler = await _compile(css, createCompileOptions(options))
-  await ensureSourceDetectionRootExists(compiler)
+  await ensureSourceDetectionRootExists(compiler, options.base)
   return compiler
 }
 
@@ -129,8 +121,7 @@ export async function loadModule(
 
     let module = await importModule(pathToFileURL(resolvedPath).href)
     return {
-      path: resolvedPath,
-      base: path.dirname(resolvedPath),
+      base: dirname(resolvedPath),
       module: module.default ?? module,
     }
   }
@@ -149,8 +140,7 @@ export async function loadModule(
     onDependency(file)
   }
   return {
-    path: resolvedPath,
-    base: path.dirname(resolvedPath),
+    base: dirname(resolvedPath),
     module: module.default ?? module,
   }
 }
@@ -166,9 +156,18 @@ async function loadStylesheet(
 
   onDependency(resolvedPath)
 
+  if (typeof globalThis.__tw_readFile === 'function') {
+    let file = await globalThis.__tw_readFile(resolvedPath, 'utf-8')
+    if (file) {
+      return {
+        base: path.dirname(resolvedPath),
+        content: file,
+      }
+    }
+  }
+
   let file = await fsPromises.readFile(resolvedPath, 'utf-8')
   return {
-    path: resolvedPath,
     base: path.dirname(resolvedPath),
     content: file,
   }
@@ -194,10 +193,7 @@ async function importModule(path: string): Promise<any> {
   }
 }
 
-const modules = [
-  'node_modules',
-  ...(process.env.NODE_PATH ? [...process.env.NODE_PATH.split(path.delimiter)] : []),
-]
+const modules = ['node_modules', ...(process.env.NODE_PATH ? [process.env.NODE_PATH] : [])]
 
 const cssResolver = EnhancedResolve.ResolverFactory.createResolver({
   fileSystem: new EnhancedResolve.CachedInputFileSystem(fs, 4000),
diff --git a/packages/@tailwindcss-node/src/env.ts b/packages/@tailwindcss-node/src/env.ts
index 3b1a1b726..517ccc6c5 100644
--- a/packages/@tailwindcss-node/src/env.ts
+++ b/packages/@tailwindcss-node/src/env.ts
@@ -1,10 +1,6 @@
 export const DEBUG = resolveDebug(process.env.DEBUG)
 
 function resolveDebug(debug: typeof process.env.DEBUG) {
-  if (typeof debug === 'boolean') {
-    return debug
-  }
-
   if (debug === undefined) {
     return false
   }
diff --git a/packages/@tailwindcss-node/src/esm-cache.loader.mts b/packages/@tailwindcss-node/src/esm-cache.loader.mts
index 96d297a29..edcfc8d77 100644
--- a/packages/@tailwindcss-node/src/esm-cache.loader.mts
+++ b/packages/@tailwindcss-node/src/esm-cache.loader.mts
@@ -1,40 +1,22 @@
-import {
-  isBuiltin,
-  type ResolveFnOutput,
-  type ResolveHook,
-  type ResolveHookContext,
-  type ResolveHookSync,
-} from 'node:module'
+import { isBuiltin, type ResolveHook } from 'node:module'
 
 export let resolve: ResolveHook = async (specifier, context, nextResolve) => {
   let result = await nextResolve(specifier, context)
-  return processResolve(context, result)
-}
 
-export let resolveSync: ResolveHookSync = (specifier, context, nextResolve) => {
-  let result = nextResolve(specifier, context)
-  return processResolve(context, result)
-}
+  if (result.url === import.meta.url) return result
+  if (isBuiltin(result.url)) return result
+  if (!context.parentURL) return result
 
-function processResolve(context: ResolveHookContext, result: ResolveFnOutput) {
-  try {
-    if (result.url === import.meta.url) return result
-    if (isBuiltin(result.url)) return result
-    if (!context.parentURL) return result
+  let parent = new URL(context.parentURL)
 
-    let parent = new URL(context.parentURL)
+  let id = parent.searchParams.get('id')
+  if (id === null) return result
 
-    let id = parent.searchParams.get('id')
-    if (id === null) return result
+  let url = new URL(result.url)
+  url.searchParams.set('id', id)
 
-    let url = new URL(result.url)
-    url.searchParams.set('id', id)
-
-    return {
-      ...result,
-      url: `${url}`,
-    }
-  } catch {
-    return result
+  return {
+    ...result,
+    url: `${url}`,
   }
 }
diff --git a/packages/@tailwindcss-node/src/index.cts b/packages/@tailwindcss-node/src/index.cts
index 9f2788933..2e79e25c7 100644
--- a/packages/@tailwindcss-node/src/index.cts
+++ b/packages/@tailwindcss-node/src/index.cts
@@ -1,26 +1,17 @@
 import * as Module from 'node:module'
 import { pathToFileURL } from 'node:url'
 import * as env from './env'
-import { resolveSync } from './esm-cache.loader.mjs'
 export * from './compile'
 export * from './instrumentation'
 export * from './normalize-path'
-export * from './optimize'
-export * from './source-maps'
 export { env }
 
 // In Bun, ESM modules will also populate `require.cache`, so the module hook is
 // not necessary.
 if (!process.versions.bun) {
   // `Module#register` was added in Node v18.19.0 and v20.6.0
-  // `Module#registerHooks` was added in Node v22.15.0 and v23.5.0 and is the preferred API since v25.9.0,
-  // runtime-deprecating `Module#register` since v26
   //
   // Not calling it means that while ESM dependencies don't get reloaded, the
   // actual included files will because they cache bust directly via `?id=…`
-  if (Module.registerHooks) {
-    Module.registerHooks({ resolve: resolveSync })
-  } else {
-    Module.register?.(pathToFileURL(require.resolve('@tailwindcss/node/esm-cache-loader')))
-  }
+  Module.register?.(pathToFileURL(require.resolve('@tailwindcss/node/esm-cache-loader')))
 }
diff --git a/packages/@tailwindcss-node/src/index.ts b/packages/@tailwindcss-node/src/index.ts
index 8eff1466a..4ee2fe805 100644
--- a/packages/@tailwindcss-node/src/index.ts
+++ b/packages/@tailwindcss-node/src/index.ts
@@ -1,27 +1,19 @@
 import * as Module from 'node:module'
 import { pathToFileURL } from 'node:url'
 import * as env from './env'
-import { resolveSync } from './esm-cache.loader.mjs'
-export * from './compile'
+export { __unstable__loadDesignSystem, compile, compileAst, Features } from './compile'
 export * from './instrumentation'
 export * from './normalize-path'
-export * from './optimize'
-export * from './source-maps'
 export { env }
 
 // In Bun, ESM modules will also populate `require.cache`, so the module hook is
 // not necessary.
 if (!process.versions.bun) {
+  let localRequire = Module.createRequire(import.meta.url)
+
   // `Module#register` was added in Node v18.19.0 and v20.6.0
-  // `Module#registerHooks` was added in Node v22.15.0 and v23.5.0 and is the preferred API since v25.9.0,
-  // runtime-deprecating `Module#register` since v26
   //
   // Not calling it means that while ESM dependencies don't get reloaded, the
   // actual included files will because they cache bust directly via `?id=…`
-  if (Module.registerHooks) {
-    Module.registerHooks({ resolve: resolveSync })
-  } else {
-    let localRequire = Module.createRequire(import.meta.url)
-    Module.register?.(pathToFileURL(localRequire.resolve('@tailwindcss/node/esm-cache-loader')))
-  }
+  Module.register?.(pathToFileURL(localRequire.resolve('@tailwindcss/node/esm-cache-loader')))
 }
diff --git a/packages/@tailwindcss-node/src/instrumentation.test.ts b/packages/@tailwindcss-node/src/instrumentation.test.ts
index 102c7ed8e..1f06796fd 100644
--- a/packages/@tailwindcss-node/src/instrumentation.test.ts
+++ b/packages/@tailwindcss-node/src/instrumentation.test.ts
@@ -2,7 +2,7 @@ import { stripVTControlCharacters } from 'util'
 import { expect, it } from 'vitest'
 import { Instrumentation } from './instrumentation'
 
-it('should add instrumentation using start/end markers', () => {
+it('should add instrumentation', () => {
   let I = new Instrumentation()
 
   I.start('Foo')
@@ -35,83 +35,6 @@ it('should add instrumentation using start/end markers', () => {
   })
 })
 
-it('should measure callbacks via the `span` api', () => {
-  let I = new Instrumentation()
-
-  I.span('Foo', () => {
-    let x = 1
-    for (let i = 0; i < 100; i++) {
-      I.span('Bar', () => {
-        x **= 2
-      })
-    }
-  })
-
-  expect.assertions(1)
-
-  I.report((output) => {
-    expect(stripVTControlCharacters(output).replace(/\[.*\]/g, '[0.xxms]')).toMatchInlineSnapshot(`
-      "
-      [0.xxms] Foo
-      [0.xxms]   ↳ Bar × 100
-      "
-    `)
-  })
-})
-
-it('should measure async callbacks via the `span` api', async () => {
-  let I = new Instrumentation()
-
-  await I.span('Foo', async () => {
-    let x = 1
-    for (let i = 0; i < 100; i++) {
-      I.span('Bar', () => {
-        x **= 2
-      })
-    }
-    await new Promise((r) => setTimeout(r, 500))
-  })
-
-  expect.assertions(2)
-
-  I.report((output) => {
-    expect(stripVTControlCharacters(output).replace(/\[.*\]/g, '[0.xxms]')).toMatchInlineSnapshot(`
-      "
-      [0.xxms] Foo
-      [0.xxms]   ↳ Bar × 100
-      "
-    `)
-
-    let [, duration] = stripVTControlCharacters(output).match(/\[(.*)\]/)!
-    expect(parseFloat(duration)).toBeGreaterThanOrEqual(500 - 2 /* Margin of error */)
-  })
-})
-
-it('should measure blocks until they go out of scope via `using`', () => {
-  let I = new Instrumentation()
-
-  {
-    using _ = I.track('Foo')
-
-    let x = 1
-    for (let i = 0; i < 100; i++) {
-      using _ = I.track('Bar')
-      x **= 2
-    }
-  }
-
-  expect.assertions(1)
-
-  I.report((output) => {
-    expect(stripVTControlCharacters(output).replace(/\[.*\]/g, '[0.xxms]')).toMatchInlineSnapshot(`
-      "
-      [0.xxms] Foo
-      [0.xxms]   ↳ Bar × 100
-      "
-    `)
-  })
-})
-
 it('should auto end pending timers when reporting', () => {
   let I = new Instrumentation()
 
diff --git a/packages/@tailwindcss-node/src/instrumentation.ts b/packages/@tailwindcss-node/src/instrumentation.ts
index e454e6744..d27858d88 100644
--- a/packages/@tailwindcss-node/src/instrumentation.ts
+++ b/packages/@tailwindcss-node/src/instrumentation.ts
@@ -13,7 +13,6 @@ export class Instrumentation implements Disposable {
   #timerStack: { id: string; label: string; namespace: string; value: bigint }[] = []
 
   constructor(
-    private shouldReport = env.DEBUG,
     private defaultFlush = (message: string) => void process.stderr.write(`${message}\n`),
   ) {}
 
@@ -49,41 +48,6 @@ export class Instrumentation implements Disposable {
     this.#timers.get(parent.id).value += elapsed
   }
 
-  track(label: string) {
-    this.start(label)
-    let done = false
-
-    return {
-      [Symbol.dispose]: () => {
-        if (!done) {
-          this.end(label)
-          done = true
-        }
-      },
-      [Symbol.asyncDispose]: () => {
-        if (!done) {
-          this.end(label)
-          done = true
-        }
-      },
-    }
-  }
-
-  span<T>(label: string, fn: () => T): T {
-    this.start(label)
-    let isPromise = false
-    try {
-      let result = fn()
-
-      isPromise = result && typeof (result as any).then === 'function'
-
-      // @ts-expect-error — TS can't infer that result is a Promise here
-      return isPromise ? result.finally(() => this.end(label)) : result
-    } finally {
-      if (!isPromise) this.end(label)
-    }
-  }
-
   reset() {
     this.#hits.clear()
     this.#timers.clear()
@@ -136,7 +100,7 @@ export class Instrumentation implements Disposable {
   }
 
   [Symbol.dispose]() {
-    this.shouldReport && this.report()
+    env.DEBUG && this.report()
   }
 }
 
diff --git a/packages/@tailwindcss-node/src/optimize.ts b/packages/@tailwindcss-node/src/optimize.ts
deleted file mode 100644
index 2f0d39589..000000000
--- a/packages/@tailwindcss-node/src/optimize.ts
+++ /dev/null
@@ -1,155 +0,0 @@
-import remapping from '@jridgewell/remapping'
-import { Features, transform } from 'lightningcss'
-import MagicString from 'magic-string'
-
-export interface OptimizeOptions {
-  /**
-   * The file being transformed
-   */
-  file?: string
-
-  /**
-   * Enabled minified output
-   */
-  minify?: boolean
-
-  /**
-   * The output source map before optimization
-   *
-   * If omitted a resulting source map will not be available
-   */
-  map?: string
-}
-
-export interface TransformResult {
-  code: string
-  map: string | undefined
-}
-
-export function optimize(
-  input: string,
-  { file = 'input.css', minify = false, map }: OptimizeOptions = {},
-): TransformResult {
-  function optimize(code: Buffer | Uint8Array, map: string | undefined) {
-    return transform({
-      filename: file,
-      code,
-      minify,
-      sourceMap: typeof map !== 'undefined',
-      inputSourceMap: map,
-      drafts: {
-        customMedia: true,
-      },
-      nonStandard: {
-        deepSelectorCombinator: true,
-      },
-      include: Features.Nesting | Features.MediaQueries,
-      exclude: Features.LogicalProperties | Features.DirSelector | Features.LightDark,
-      targets: {
-        safari: (16 << 16) | (4 << 8),
-        ios_saf: (16 << 16) | (4 << 8),
-        firefox: 128 << 16,
-        chrome: 111 << 16,
-      },
-      errorRecovery: true,
-    })
-  }
-
-  // Running Lightning CSS twice to ensure that adjacent rules are merged after
-  // nesting is applied. This creates a more optimized output.
-  let result = optimize(Buffer.from(input), map)
-  map = result.map?.toString()
-
-  result.warnings = result.warnings.filter((warning) => {
-    // Ignore warnings about unknown pseudo-classes that are used in frameworks
-    // such as Vue or Angular and are handled by their own compilers, before
-    // reaching the browser.
-    if (
-      /'(deep|slotted|global|ng-deep|host-context)' is not recognized as a valid pseudo-/.test(
-        warning.message,
-      )
-    ) {
-      return false
-    }
-
-    return true
-  })
-
-  // Because of `errorRecovery: true`, there could be warnings, so let's let the
-  // user know about them.
-  if (process.env.NODE_ENV !== 'test' && result.warnings.length > 0) {
-    let lines = input.split('\n')
-
-    let output = [
-      `Found ${result.warnings.length} ${result.warnings.length === 1 ? 'warning' : 'warnings'} while optimizing generated CSS:`,
-    ]
-
-    for (let [idx, warning] of result.warnings.entries()) {
-      output.push('')
-      if (result.warnings.length > 1) {
-        output.push(`Issue #${idx + 1}:`)
-      }
-
-      let context = 2
-
-      let start = Math.max(0, warning.loc.line - context - 1)
-      let end = Math.min(lines.length, warning.loc.line + context)
-
-      let snippet = lines.slice(start, end).map((line, idx) => {
-        if (start + idx + 1 === warning.loc.line) {
-          return `${dim(`\u2502`)} ${line}`
-        } else {
-          return dim(`\u2502 ${line}`)
-        }
-      })
-
-      snippet.splice(
-        warning.loc.line - start,
-        0,
-        `${dim('\u2506')}${' '.repeat(warning.loc.column - 1)} ${yellow(`${dim('^--')} ${warning.message}`)}`,
-        `${dim('\u2506')}`,
-      )
-
-      output.push(...snippet)
-    }
-    output.push('')
-
-    console.warn(output.join('\n'))
-  }
-
-  result = optimize(result.code, map)
-  map = result.map?.toString()
-
-  let code = result.code.toString()
-
-  // Work around an issue where the media query range syntax transpilation
-  // generates code that is invalid with `@media` queries level 3.
-  let magic = new MagicString(code)
-  magic.replaceAll('@media not (', '@media not all and (')
-
-  // We have to use a source-map-preserving method of replacing the content
-  // which requires the use of Magic String + remapping(…) to make sure
-  // the resulting map is correct
-  if (map !== undefined && magic.hasChanged()) {
-    let magicMap = magic.generateMap({ source: 'original', hires: 'boundary' }).toString()
-
-    let remapped = remapping([magicMap, map], () => null)
-
-    map = remapped.toString()
-  }
-
-  code = magic.toString()
-
-  return {
-    code,
-    map,
-  }
-}
-
-function dim(str: string) {
-  return `\x1B[2m${str}\x1B[22m`
-}
-
-function yellow(str: string) {
-  return `\x1B[33m${str}\x1B[39m`
-}
diff --git a/packages/@tailwindcss-node/src/require-cache.ts b/packages/@tailwindcss-node/src/require-cache.ts
deleted file mode 100644
index ea0562019..000000000
--- a/packages/@tailwindcss-node/src/require-cache.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export function clearRequireCache(files: string[]) {
-  for (let key of files) {
-    delete require.cache[key]
-  }
-}
diff --git a/packages/@tailwindcss-node/src/source-maps.test.ts b/packages/@tailwindcss-node/src/source-maps.test.ts
deleted file mode 100644
index 96ff8f05c..000000000
--- a/packages/@tailwindcss-node/src/source-maps.test.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { expect, it } from 'vitest'
-import { toSourceMap } from './source-maps'
-
-it('should emit source maps', () => {
-  let map = toSourceMap('{"version":3,"sources":[],"names":[],"mappings":""}')
-
-  expect(map.comment('app.css.map')).toBe('/*# sourceMappingURL=app.css.map */\n')
-})
diff --git a/packages/@tailwindcss-node/src/source-maps.ts b/packages/@tailwindcss-node/src/source-maps.ts
deleted file mode 100644
index 58b79cb25..000000000
--- a/packages/@tailwindcss-node/src/source-maps.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-import { SourceMapGenerator } from 'source-map-js'
-import type { DecodedSource, DecodedSourceMap } from '../../tailwindcss/src/source-maps/source-map'
-import { DefaultMap } from '../../tailwindcss/src/utils/default-map'
-
-export type { DecodedSource, DecodedSourceMap }
-export interface SourceMap {
-  readonly raw: string
-  readonly inline: string
-  comment(url: string): string
-}
-
-function serializeSourceMap(map: DecodedSourceMap): string {
-  let generator = new SourceMapGenerator()
-
-  let id = 1
-  let sourceTable = new DefaultMap<
-    DecodedSource | null,
-    {
-      url: string
-      content: string
-    }
-  >((src) => {
-    return {
-      url: src?.url ?? `<unknown ${id++}>`,
-      content: src?.content ?? '<none>',
-    }
-  })
-
-  for (let mapping of map.mappings) {
-    let original = sourceTable.get(mapping.originalPosition?.source ?? null)
-
-    generator.addMapping({
-      generated: mapping.generatedPosition,
-      original: mapping.originalPosition,
-      source: original.url,
-      name: mapping.name,
-    })
-
-    generator.setSourceContent(original.url, original.content)
-  }
-
-  return generator.toString()
-}
-
-export function toSourceMap(map: DecodedSourceMap | string): SourceMap {
-  let raw = typeof map === 'string' ? map : serializeSourceMap(map)
-
-  function comment(url: string) {
-    return `/*# sourceMappingURL\x3d${url} */\n`
-  }
-
-  return {
-    raw,
-    get inline() {
-      let inlined = Buffer.from(raw, 'utf-8').toString('base64')
-      return comment(`data:application/json;base64,${inlined}`)
-    },
-    comment,
-  }
-}
diff --git a/packages/@tailwindcss-node/src/urls.ts b/packages/@tailwindcss-node/src/urls.ts
index 61695a9d1..e35b9d280 100644
--- a/packages/@tailwindcss-node/src/urls.ts
+++ b/packages/@tailwindcss-node/src/urls.ts
@@ -5,9 +5,8 @@
 // Minor modifications have been made to work with the Tailwind CSS codebase
 
 import * as path from 'node:path'
-import { toCss } from '../../tailwindcss/src/ast'
+import { toCss, walk } from '../../tailwindcss/src/ast'
 import { parse } from '../../tailwindcss/src/css-parser'
-import { walk } from '../../tailwindcss/src/walk'
 import { normalizePath } from './normalize-path'
 
 const cssUrlRE =
@@ -154,7 +153,7 @@ function skipUrlReplacer(rawUrl: string, aliases?: string[]) {
   return (
     isExternalUrl(rawUrl) ||
     isDataUrl(rawUrl) ||
-    !rawUrl[0].match(/[.a-zA-Z0-9_]/) ||
+    !rawUrl[0].match(/[\.a-zA-Z0-9_]/) ||
     functionCallRE.test(rawUrl)
   )
 }
diff --git a/packages/@tailwindcss-node/tsconfig.json b/packages/@tailwindcss-node/tsconfig.json
index d2131cbeb..6ae022f65 100644
--- a/packages/@tailwindcss-node/tsconfig.json
+++ b/packages/@tailwindcss-node/tsconfig.json
@@ -1,6 +1,3 @@
 {
   "extends": "../tsconfig.base.json",
-  "compilerOptions": {
-    "verbatimModuleSyntax": false,
-  },
 }
diff --git a/packages/@tailwindcss-node/tsup.config.ts b/packages/@tailwindcss-node/tsup.config.ts
index 3f2d184d5..0f2ac5855 100644
--- a/packages/@tailwindcss-node/tsup.config.ts
+++ b/packages/@tailwindcss-node/tsup.config.ts
@@ -6,35 +6,23 @@ export default defineConfig([
     minify: true,
     dts: true,
     entry: ['src/index.cts'],
-    define: {
-      'process.env.NODE_ENV': '"production"',
-    },
   },
   {
     format: ['esm'],
     minify: true,
     dts: true,
     entry: ['src/index.ts'],
-    define: {
-      'process.env.NODE_ENV': '"production"',
-    },
   },
   {
     format: ['esm'],
     minify: true,
     dts: true,
     entry: ['src/esm-cache.loader.mts'],
-    define: {
-      'process.env.NODE_ENV': '"production"',
-    },
   },
   {
     format: ['cjs'],
     minify: true,
     dts: true,
     entry: ['src/require-cache.cts'],
-    define: {
-      'process.env.NODE_ENV': '"production"',
-    },
   },
 ])
diff --git a/packages/@tailwindcss-postcss/README.md b/packages/@tailwindcss-postcss/README.md
index 3facf2887..95ec9d87d 100644
--- a/packages/@tailwindcss-postcss/README.md
+++ b/packages/@tailwindcss-postcss/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,85 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
-
----
-
-## `@tailwindcss/postcss` plugin API
-
-### Changing where the plugin searches for source files
-
-You can use the `base` option (defaults to the current working directory) to change the directory in which the plugin searches for source files:
-
-```js
-import tailwindcss from '@tailwindcss/postcss'
-
-export default {
-  plugins: [
-    tailwindcss({
-      base: path.resolve(__dirname, './path'),
-    }),
-  ],
-}
-```
-
-### Enabling or disabling Lightning CSS
-
-By default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.
-
-If you want to always enable or disable Lightning CSS the `optimize` option may be used:
-
-```js
-import tailwindcss from '@tailwindcss/postcss'
-
-export default {
-  plugins: [
-    tailwindcss({
-      // Enable or disable Lightning CSS
-      optimize: false,
-    }),
-  ],
-}
-```
-
-It's also possible to keep Lightning CSS enabled but disable minification:
-
-```js
-import tailwindcss from '@tailwindcss/postcss'
-
-export default {
-  plugins: [
-    tailwindcss({
-      optimize: { minify: false },
-    }),
-  ],
-}
-```
-
-### Enabling or disabling `url(…)` rewriting
-
-Our PostCSS plugin can rewrite `url(…)`s for you since it also handles `@import` (no `postcss-import` is needed). This feature is enabled by default.
-
-In some situations the bundler or framework you're using may provide this feature itself. In this case you can set `transformAssetUrls` to `false` to disable this feature:
-
-```js
-import tailwindcss from '@tailwindcss/postcss'
-
-export default {
-  plugins: [
-    tailwindcss({
-      // Disable `url(…)` rewriting
-      transformAssetUrls: false,
-
-      // Enable `url(…)` rewriting (the default)
-      transformAssetUrls: true,
-    }),
-  ],
-}
-```
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-postcss/package.json b/packages/@tailwindcss-postcss/package.json
index 891578509..f7a84adec 100644
--- a/packages/@tailwindcss-postcss/package.json
+++ b/packages/@tailwindcss-postcss/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/postcss",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "PostCSS plugin for Tailwind CSS, a utility-first CSS framework for rapidly building custom user interfaces",
   "license": "MIT",
   "repository": {
@@ -24,28 +24,24 @@
   },
   "exports": {
     ".": {
-      "import": {
-        "types": "./dist/index.d.mts",
-        "default": "./dist/index.mjs"
-      },
-      "require": {
-        "types": "./dist/index.d.ts",
-        "default": "./dist/index.js"
-      }
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
     }
   },
   "dependencies": {
     "@alloc/quick-lru": "^5.2.0",
     "@tailwindcss/node": "workspace:*",
     "@tailwindcss/oxide": "workspace:*",
-    "postcss": "catalog:",
+    "lightningcss": "catalog:",
+    "postcss": "^8.4.41",
     "tailwindcss": "workspace:*"
   },
   "devDependencies": {
     "@types/node": "catalog:",
     "@types/postcss-import": "14.0.3",
-    "dedent": "catalog:",
+    "dedent": "1.5.3",
     "internal-example-plugin": "workspace:*",
-    "postcss-import": "^16.1.1"
+    "postcss-import": "^16.1.0"
   }
 }
diff --git a/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap b/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap
index 05087fa39..12b578d44 100644
--- a/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap
+++ b/packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap
@@ -1,21 +1,10 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-font-weight: initial;
-    }
-  }
-}
-
-@layer theme {
+"@layer theme {
   :root, :host {
-    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial,
-    sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
-    monospace;
+    --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
     --color-black: #000;
     --text-2xl: 1.5rem;
     --text-2xl--line-height: calc(2 / 1.5);
@@ -44,7 +33,7 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
     -webkit-text-size-adjust: 100%;
     tab-size: 4;
     line-height: 1.5;
-    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
+    font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
     font-feature-settings: var(--default-font-feature-settings, normal);
     font-variation-settings: var(--default-font-variation-settings, normal);
     -webkit-tap-highlight-color: transparent;
@@ -110,7 +99,7 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
     border-collapse: collapse;
   }
 
-  :-moz-focusring:where(:not(iframe)) {
+  :-moz-focusring {
     outline: auto;
   }
 
@@ -176,13 +165,7 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
 
   @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
     ::placeholder {
-      color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      ::placeholder {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+      color: color-mix(in oklab, currentColor 50%, transparent);
     }
   }
 
@@ -243,10 +226,6 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
     padding-block: 0;
   }
 
-  ::-webkit-calendar-picker-indicator {
-    line-height: 1;
-  }
-
   :-moz-ui-invalid {
     box-shadow: none;
   }
@@ -281,20 +260,14 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
   }
 
   .text-black\\/50 {
-    color: #00000080;
-  }
-
-  @supports (color: color-mix(in lab, red, red)) {
-    .text-black\\/50 {
-      color: color-mix(in oklab, var(--color-black) 50%, transparent);
-    }
+    color: color-mix(in oklab, var(--color-black) 50%, transparent);
   }
 
   .underline {
     text-decoration-line: underline;
   }
 
-  @media (min-width: 96rem) {
+  @media (width >= 96rem) {
     .\\32 xl\\:font-bold {
       --tw-font-weight: var(--font-weight-bold);
       font-weight: var(--font-weight-bold);
@@ -305,6 +278,5 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
 @property --tw-font-weight {
   syntax: "*";
   inherits: false
-}
-"
+}"
 `;
diff --git a/packages/@tailwindcss-postcss/src/ast.test.ts b/packages/@tailwindcss-postcss/src/ast.test.ts
index 8a2a5b019..dd7095428 100644
--- a/packages/@tailwindcss-postcss/src/ast.test.ts
+++ b/packages/@tailwindcss-postcss/src/ast.test.ts
@@ -84,7 +84,7 @@ it('should convert a Tailwind CSS AST into a PostCSS AST', () => {
   `
 
   let ast = parse(input)
-  let transformedAst = cssAstToPostCssAst(postcss, ast)
+  let transformedAst = cssAstToPostCssAst(ast)
 
   expect(transformedAst.toString()).toMatchInlineSnapshot(`
     "@charset "UTF-8";
diff --git a/packages/@tailwindcss-postcss/src/ast.ts b/packages/@tailwindcss-postcss/src/ast.ts
index 7ca9e2add..201dd4bf8 100644
--- a/packages/@tailwindcss-postcss/src/ast.ts
+++ b/packages/@tailwindcss-postcss/src/ast.ts
@@ -1,67 +1,18 @@
-import type * as postcss from 'postcss'
+import postcss, {
+  type ChildNode as PostCssChildNode,
+  type Container as PostCssContainerNode,
+  type Root as PostCssRoot,
+  type Source as PostcssSource,
+} from 'postcss'
 import { atRule, comment, decl, rule, type AstNode } from '../../tailwindcss/src/ast'
-import { createLineTable, type LineTable } from '../../tailwindcss/src/source-maps/line-table'
-import type { Source, SourceLocation } from '../../tailwindcss/src/source-maps/source'
-import { DefaultMap } from '../../tailwindcss/src/utils/default-map'
 
 const EXCLAMATION_MARK = 0x21
 
-export function cssAstToPostCssAst(
-  postcss: postcss.Postcss,
-  ast: AstNode[],
-  source?: postcss.Source,
-): postcss.Root {
-  let inputMap = new DefaultMap<Source, postcss.Input>((src) => {
-    return new postcss.Input(src.code, {
-      map: source?.input.map,
-      from: src.file ?? undefined,
-    })
-  })
-
-  let lineTables = new DefaultMap<Source, LineTable>((src) => createLineTable(src.code))
-
+export function cssAstToPostCssAst(ast: AstNode[], source: PostcssSource | undefined): PostCssRoot {
   let root = postcss.root()
   root.source = source
 
-  function toSource(loc: SourceLocation | undefined): postcss.Source | undefined {
-    // Use the fallback if this node has no location info in the AST
-    if (!loc) return
-    if (!loc[0]) return
-
-    let table = lineTables.get(loc[0])
-    let start = table.find(loc[1])
-    let end = table.find(loc[2])
-
-    return {
-      input: inputMap.get(loc[0]),
-      start: {
-        line: start.line,
-        column: start.column + 1,
-        offset: loc[1],
-      },
-      end: {
-        line: end.line,
-        column: end.column + 1,
-        offset: loc[2],
-      },
-    }
-  }
-
-  function updateSource(astNode: postcss.ChildNode, loc: SourceLocation | undefined) {
-    let source = toSource(loc)
-
-    // The `source` property on PostCSS nodes must be defined if present because
-    // `toJSON()` reads each property and tries to read from source.input if it
-    // sees a `source` property. This means for a missing or otherwise absent
-    // source it must be *missing* from the object rather than just `undefined`
-    if (source) {
-      astNode.source = source
-    } else {
-      delete astNode.source
-    }
-  }
-
-  function transform(node: AstNode, parent: postcss.Container) {
+  function transform(node: AstNode, parent: PostCssContainerNode) {
     // Declaration
     if (node.kind === 'declaration') {
       let astNode = postcss.decl({
@@ -69,14 +20,14 @@ export function cssAstToPostCssAst(
         value: node.value ?? '',
         important: node.important,
       })
-      updateSource(astNode, node.src)
+      astNode.source = source
       parent.append(astNode)
     }
 
     // Rule
     else if (node.kind === 'rule') {
       let astNode = postcss.rule({ selector: node.selector })
-      updateSource(astNode, node.src)
+      astNode.source = source
       astNode.raws.semicolon = true
       parent.append(astNode)
       for (let child of node.nodes) {
@@ -87,7 +38,7 @@ export function cssAstToPostCssAst(
     // AtRule
     else if (node.kind === 'at-rule') {
       let astNode = postcss.atRule({ name: node.name.slice(1), params: node.params })
-      updateSource(astNode, node.src)
+      astNode.source = source
       astNode.raws.semicolon = true
       parent.append(astNode)
       for (let child of node.nodes) {
@@ -102,7 +53,7 @@ export function cssAstToPostCssAst(
       // spaces.
       astNode.raws.left = ''
       astNode.raws.right = ''
-      updateSource(astNode, node.src)
+      astNode.source = source
       parent.append(astNode)
     }
 
@@ -123,39 +74,19 @@ export function cssAstToPostCssAst(
   return root
 }
 
-export function postCssAstToCssAst(root: postcss.Root): AstNode[] {
-  let inputMap = new DefaultMap<postcss.Input, Source>((input) => ({
-    file: input.file ?? input.id ?? null,
-    code: input.css,
-  }))
-
-  function toSource(node: postcss.ChildNode): SourceLocation | undefined {
-    let source = node.source
-    if (!source) return
-
-    let input = source.input
-    if (!input) return
-    if (source.start === undefined) return
-    if (source.end === undefined) return
-
-    return [inputMap.get(input), source.start.offset, source.end.offset]
-  }
-
+export function postCssAstToCssAst(root: PostCssRoot): AstNode[] {
   function transform(
-    node: postcss.ChildNode,
+    node: PostCssChildNode,
     parent: Extract<AstNode, { nodes: AstNode[] }>['nodes'],
   ) {
     // Declaration
     if (node.type === 'decl') {
-      let astNode = decl(node.prop, node.value, node.important)
-      astNode.src = toSource(node)
-      parent.push(astNode)
+      parent.push(decl(node.prop, node.value, node.important))
     }
 
     // Rule
     else if (node.type === 'rule') {
       let astNode = rule(node.selector)
-      astNode.src = toSource(node)
       node.each((child) => transform(child, astNode.nodes))
       parent.push(astNode)
     }
@@ -163,7 +94,6 @@ export function postCssAstToCssAst(root: postcss.Root): AstNode[] {
     // AtRule
     else if (node.type === 'atrule') {
       let astNode = atRule(`@${node.name}`, node.params)
-      astNode.src = toSource(node)
       node.each((child) => transform(child, astNode.nodes))
       parent.push(astNode)
     }
@@ -171,9 +101,7 @@ export function postCssAstToCssAst(root: postcss.Root): AstNode[] {
     // Comment
     else if (node.type === 'comment') {
       if (node.text.charCodeAt(0) !== EXCLAMATION_MARK) return
-      let astNode = comment(node.text)
-      astNode.src = toSource(node)
-      parent.push(astNode)
+      parent.push(comment(node.text))
     }
 
     // Unknown
diff --git a/packages/@tailwindcss-postcss/src/fixtures/example-project/input.css b/packages/@tailwindcss-postcss/src/fixtures/example-project/input.css
deleted file mode 100644
index f1af498fc..000000000
--- a/packages/@tailwindcss-postcss/src/fixtures/example-project/input.css
+++ /dev/null
@@ -1 +0,0 @@
-/* the content for this file is set in the tests */
diff --git a/packages/@tailwindcss-postcss/src/index.test.ts b/packages/@tailwindcss-postcss/src/index.test.ts
index b393cc382..fa9d5abbb 100644
--- a/packages/@tailwindcss-postcss/src/index.test.ts
+++ b/packages/@tailwindcss-postcss/src/index.test.ts
@@ -1,10 +1,7 @@
 import dedent from 'dedent'
-import { mkdir, mkdtemp, readFile, rm, unlink, writeFile } from 'node:fs/promises'
-import { tmpdir } from 'node:os'
-import path from 'path'
+import { unlink, writeFile } from 'node:fs/promises'
 import postcss from 'postcss'
-import { afterEach, beforeEach, describe, expect, test, vi } from 'vitest'
-import { pretty } from '../../tailwindcss/src/test-utils/run'
+import { afterEach, beforeEach, describe, expect, test } from 'vitest'
 import tailwindcss from './index'
 
 // We give this file path to PostCSS for processing.
@@ -20,16 +17,6 @@ function inputCssFilePath() {
 
 const css = dedent
 
-async function run(plugin: any, from: string, input: string): Promise<string> {
-  let ast = postcss.parse(input)
-  for (let runner of plugin.plugins) {
-    if (runner.Once) {
-      await runner.Once(ast, { postcss, result: { opts: { from }, messages: [] } })
-    }
-  }
-  return ast.toString()
-}
-
 test("`@import 'tailwindcss'` is replaced with the generated CSS", async () => {
   let processor = postcss([
     tailwindcss({ base: `${__dirname}/fixtures/example-project`, optimize: { minify: false } }),
@@ -37,7 +24,7 @@ test("`@import 'tailwindcss'` is replaced with the generated CSS", async () => {
 
   let result = await processor.process(`@import 'tailwindcss'`, { from: inputCssFilePath() })
 
-  expect(pretty(result.css)).toMatchSnapshot()
+  expect(result.css.trim()).toMatchSnapshot()
 
   // Check for dependency messages
   expect(result.messages).toContainEqual({
@@ -54,7 +41,7 @@ test("`@import 'tailwindcss'` is replaced with the generated CSS", async () => {
   })
   expect(result.messages).toContainEqual({
     type: 'dir-dependency',
-    dir: expect.stringMatching(/example-project[/|\\]src$/g),
+    dir: expect.stringMatching(/example-project[\/|\\]src$/g),
     glob: expect.stringMatching(/^\*\*\/\*/g),
     parent: expect.any(String),
     plugin: expect.any(String),
@@ -83,9 +70,8 @@ test('output is optimized by Lightning CSS', async () => {
     { from: inputCssFilePath() },
   )
 
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    @layer utilities {
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    "@layer utilities {
       .foo {
         color: #000;
       }
@@ -93,8 +79,7 @@ test('output is optimized by Lightning CSS', async () => {
       .bar {
         color: red;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -113,31 +98,22 @@ test('@apply can be used without emitting the theme in the CSS file', async () =
     { from: inputCssFilePath() },
   )
 
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    .foo {
-      color: var(--color-red-500, oklch(63.7% .237 25.331));
-    }
-    "
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    ".foo {
+      color: var(--color-red-500, oklch(.637 .237 25.331));
+    }"
   `)
 })
 
 describe('processing without specifying a base path', () => {
-  let filepath: string
-  let dir: string
+  let filepath = `${process.cwd()}/my-test-file.html`
 
-  beforeEach(async () => {
-    dir = await mkdtemp(path.join(tmpdir(), 'tw-postcss'))
-    await mkdir(dir, { recursive: true })
-    filepath = path.join(dir, 'my-test-file.html')
-    await writeFile(filepath, `<div class="md:[&:hover]:content-['testing_default_base_path']">`)
-  })
+  beforeEach(() =>
+    writeFile(filepath, `<div class="md:[&:hover]:content-['testing_default_base_path']">`),
+  )
   afterEach(() => unlink(filepath))
 
   test('the current working directory is used by default', async () => {
-    using spy = vi.spyOn(process, 'cwd')
-    spy.mockReturnValue(dir)
-
     let processor = postcss([tailwindcss({ optimize: { minify: false } })])
 
     let result = await processor.process(`@import "tailwindcss"`, { from: inputCssFilePath() })
@@ -155,18 +131,6 @@ describe('processing without specifying a base path', () => {
   })
 })
 
-test('fallback to `base` directory when `result.opts.from` is not provided', async () => {
-  using _ = vi.spyOn(console, 'warn').mockImplementation(() => {})
-
-  let processor = postcss([
-    tailwindcss({ base: `${__dirname}/fixtures/example-project`, optimize: { minify: false } }),
-  ])
-
-  let result = await processor.process(`@import 'tailwindcss'`)
-
-  expect(result.css.length).toBeGreaterThan(0)
-})
-
 describe('plugins', () => {
   test('local CJS plugin', async () => {
     let processor = postcss([
@@ -181,9 +145,8 @@ describe('plugins', () => {
       { from: inputCssFilePath() },
     )
 
-    expect(pretty(result.css)).toMatchInlineSnapshot(`
-      "
-      .underline {
+    expect(result.css.trim()).toMatchInlineSnapshot(`
+      ".underline {
         text-decoration-line: underline;
       }
 
@@ -195,8 +158,7 @@ describe('plugins', () => {
 
       .hocus\\:underline:focus, .hocus\\:underline:hover {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
@@ -213,9 +175,8 @@ describe('plugins', () => {
       { from: `${__dirname}/fixtures/another-project/input.css` },
     )
 
-    expect(pretty(result.css)).toMatchInlineSnapshot(`
-      "
-      .underline {
+    expect(result.css.trim()).toMatchInlineSnapshot(`
+      ".underline {
         text-decoration-line: underline;
       }
 
@@ -227,8 +188,7 @@ describe('plugins', () => {
 
       .hocus\\:underline:focus, .hocus\\:underline:hover {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
@@ -245,9 +205,8 @@ describe('plugins', () => {
       { from: inputCssFilePath() },
     )
 
-    expect(pretty(result.css)).toMatchInlineSnapshot(`
-      "
-      .underline {
+    expect(result.css.trim()).toMatchInlineSnapshot(`
+      ".underline {
         text-decoration-line: underline;
       }
 
@@ -259,8 +218,7 @@ describe('plugins', () => {
 
       .hocus\\:underline:focus, .hocus\\:underline:hover {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 })
@@ -283,12 +241,10 @@ test('bail early when Tailwind is not used', async () => {
   // didn't use `@tailwind utilities` we didn't scan for utilities.
   expect(result.css).not.toContain('.underline {')
 
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    .custom-css {
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    ".custom-css {
       color: red;
-    }
-    "
+    }"
   `)
 })
 
@@ -310,14 +266,12 @@ test('handle CSS when only using a `@reference` (we should not bail early)', asy
     { from: inputCssFilePath() },
   )
 
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 48rem) {
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    "@media (width >= 48rem) {
       .foo {
         bar: baz;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -337,12 +291,10 @@ test('handle CSS when using a `@variant` using variants that do not rely on the
     { from: inputCssFilePath() },
   )
 
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    .foo[data-is-hoverable] {
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    ".foo[data-is-hoverable] {
       bar: baz;
-    }
-    "
+    }"
   `)
 })
 
@@ -377,142 +329,22 @@ test('runs `Once` plugins in the right order', async () => {
     { from: inputCssFilePath() },
   )
 
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    .custom-css {
+  expect(result.css.trim()).toMatchInlineSnapshot(`
+    ".custom-css {
       color: red;
-    }
-    "
+    }"
   `)
-  expect(pretty(before)).toMatchInlineSnapshot(`
-    "
-    @theme {
+  expect(before).toMatchInlineSnapshot(`
+    "@theme {
       --color-red-500: red;
     }
     .custom-css {
       color: theme(--color-red-500);
-    }
-    "
+    }"
   `)
-  expect(pretty(after)).toMatchInlineSnapshot(`
-    "
-    .custom-css {
+  expect(after).toMatchInlineSnapshot(`
+    ".custom-css {
       color: red;
-    }
-    "
+    }"
   `)
 })
-
-describe('concurrent builds', () => {
-  let dir: string
-  beforeEach(async () => {
-    dir = await mkdtemp(path.join(tmpdir(), 'tw-postcss'))
-    await writeFile(path.join(dir, 'index.html'), `<div class="underline"></div>`)
-    await writeFile(
-      path.join(dir, 'index.css'),
-      css`
-        @import './dependency.css';
-      `,
-    )
-    await writeFile(
-      path.join(dir, 'dependency.css'),
-      css`
-        @tailwind utilities;
-      `,
-    )
-  })
-  afterEach(() => rm(dir, { recursive: true, force: true }))
-
-  test('does experience a race-condition when calling the plugin two times for the same change', async () => {
-    using spy = vi.spyOn(process, 'cwd')
-    spy.mockReturnValue(dir)
-
-    let from = path.join(dir, 'index.css')
-    let input = (await readFile(path.join(dir, 'index.css'))).toString()
-
-    let plugin = tailwindcss({ optimize: { minify: false } })
-
-    let result = await run(plugin, from, input)
-
-    expect(result).toContain('.underline')
-
-    // Ensure that the mtime is updated
-    await new Promise((resolve) => setTimeout(resolve, 100))
-    await writeFile(
-      path.join(dir, 'dependency.css'),
-      css`
-        @tailwind utilities;
-        .red {
-          color: red;
-        }
-      `,
-    )
-
-    let promise1 = run(plugin, from, input)
-    let promise2 = run(plugin, from, input)
-
-    expect(await promise1).toContain('.red')
-    expect(await promise2).toContain('.red')
-  })
-})
-
-test('rebuilds when the input CSS changes even if the `from` file on disk did not', async () => {
-  let dir = await mkdtemp(path.join(tmpdir(), 'tw-postcss'))
-  // The `from` file exists on disk with a stable mtime. The input CSS is handed
-  // to the plugin directly (as a preprocessor like Sass would produce it), so it
-  // can change without `from`'s mtime ever changing.
-  await writeFile(path.join(dir, 'index.css'), '')
-
-  let from = path.join(dir, 'index.css')
-  let plugin = tailwindcss({ base: dir, optimize: { minify: false } })
-
-  let first = await run(
-    plugin,
-    from,
-    css`
-      @tailwind utilities;
-      .first {
-        @apply underline;
-      }
-    `,
-  )
-  let second = await run(
-    plugin,
-    from,
-    css`
-      @tailwind utilities;
-      .second {
-        @apply line-through;
-      }
-    `,
-  )
-
-  expect(first).toContain('.first')
-  expect(second).toContain('.second')
-
-  await rm(dir, { recursive: true, force: true })
-})
-
-test('does not register the input file as a dependency, even if it is passed in as relative path', async () => {
-  let processor = postcss([
-    tailwindcss({ base: `${__dirname}/fixtures/example-project`, optimize: { minify: false } }),
-  ])
-
-  let result = await processor.process(`@tailwind utilities`, { from: './input.css' })
-
-  expect(pretty(result.css)).toMatchInlineSnapshot(`
-    "
-    .underline {
-      text-decoration-line: underline;
-    }
-    "
-  `)
-
-  // Check for dependency messages
-  expect(result.messages).not.toContainEqual({
-    type: 'dependency',
-    file: expect.stringMatching(/input.css$/g),
-    parent: expect.any(String),
-    plugin: expect.any(String),
-  })
-})
diff --git a/packages/@tailwindcss-postcss/src/index.ts b/packages/@tailwindcss-postcss/src/index.ts
index a4a8d9326..e21217f12 100644
--- a/packages/@tailwindcss-postcss/src/index.ts
+++ b/packages/@tailwindcss-postcss/src/index.ts
@@ -1,17 +1,11 @@
 import QuickLRU from '@alloc/quick-lru'
-import {
-  compileAst,
-  env,
-  Features,
-  Instrumentation,
-  optimize as optimizeCss,
-  Polyfills,
-} from '@tailwindcss/node'
+import { compileAst, env, Features, Instrumentation } from '@tailwindcss/node'
 import { clearRequireCache } from '@tailwindcss/node/require-cache'
 import { Scanner } from '@tailwindcss/oxide'
+import { Features as LightningCssFeatures, transform } from 'lightningcss'
 import fs from 'node:fs'
 import path, { relative } from 'node:path'
-import type { AcceptedPlugin, PluginCreator, Postcss, Root } from 'postcss'
+import postcss, { type AcceptedPlugin, type PluginCreator } from 'postcss'
 import { toCss, type AstNode } from '../../tailwindcss/src/ast'
 import { cssAstToPostCssAst, postCssAstToCssAst } from './ast'
 import fixRelativePathsPlugin from './postcss-fix-relative-paths'
@@ -20,22 +14,20 @@ const DEBUG = env.DEBUG
 
 interface CacheEntry {
   mtimes: Map<string, number>
-  inputCss: string
-  compiler: null | ReturnType<typeof compileAst>
+  compiler: null | Awaited<ReturnType<typeof compileAst>>
   scanner: null | Scanner
   tailwindCssAst: AstNode[]
-  cachedPostCssAst: Root
-  optimizedPostCssAst: Root
+  cachedPostCssAst: postcss.Root
+  optimizedPostCssAst: postcss.Root
   fullRebuildPaths: string[]
 }
 const cache = new QuickLRU<string, CacheEntry>({ maxSize: 50 })
 
-function getContextFromCache(postcss: Postcss, inputFile: string, opts: PluginOptions): CacheEntry {
+function getContextFromCache(inputFile: string, opts: PluginOptions): CacheEntry {
   let key = `${inputFile}:${opts.base ?? ''}:${JSON.stringify(opts.optimize)}`
   if (cache.has(key)) return cache.get(key)!
   let entry = {
     mtimes: new Map<string, number>(),
-    inputCss: '',
     compiler: null,
     scanner: null,
 
@@ -50,30 +42,16 @@ function getContextFromCache(postcss: Postcss, inputFile: string, opts: PluginOp
 }
 
 export type PluginOptions = {
-  /**
-   * The base directory to scan for class candidates.
-   *
-   * Defaults to the current working directory.
-   */
+  // The base directory to scan for class candidates.
   base?: string
 
-  /**
-   * Optimize and minify the output CSS.
-   */
+  // Optimize and minify the output CSS.
   optimize?: boolean | { minify?: boolean }
-
-  /**
-   * Enable or disable asset URL rewriting.
-   *
-   * Defaults to `true`.
-   */
-  transformAssetUrls?: boolean
 }
 
 function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
   let base = opts.base ?? process.cwd()
   let optimize = opts.optimize ?? process.env.NODE_ENV === 'production'
-  let shouldRewriteUrls = opts.transformAssetUrls ?? true
 
   return {
     postcssPlugin: '@tailwindcss/postcss',
@@ -85,11 +63,10 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
 
       {
         postcssPlugin: 'tailwindcss',
-        async Once(root, { result, postcss }) {
+        async Once(root, { result }) {
           using I = new Instrumentation()
 
           let inputFile = result.opts.from ?? ''
-          let isCSSModuleFile = inputFile.endsWith('.module.css')
 
           DEBUG && I.start(`[@tailwindcss/postcss] ${relative(base, inputFile)}`)
 
@@ -105,8 +82,7 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
                 node.name === 'variant' ||
                 node.name === 'config' ||
                 node.name === 'plugin' ||
-                node.name === 'apply' ||
-                node.name === 'tailwind'
+                node.name === 'apply'
               ) {
                 canBail = false
                 return false
@@ -116,12 +92,8 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
             DEBUG && I.end('Quick bail check')
           }
 
-          let context = getContextFromCache(postcss, inputFile, opts)
-          let inputBasePath = inputFile ? path.dirname(path.resolve(inputFile)) : base
-
-          // Whether this is the first build or not, if it is, then we can
-          // optimize the build by not creating the compiler until we need it.
-          let isInitialBuild = context.compiler === null
+          let context = getContextFromCache(inputFile, opts)
+          let inputBasePath = path.dirname(path.resolve(inputFile))
 
           async function createCompiler() {
             DEBUG && I.start('Setup compiler')
@@ -137,14 +109,11 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
 
             DEBUG && I.start('Create compiler')
             let compiler = await compileAst(ast, {
-              from: result.opts.from,
               base: inputBasePath,
-              shouldRewriteUrls,
-              onDependency: (path) => context.fullRebuildPaths.push(path),
-              // In CSS Module files, we have to disable the `@property` polyfill since these will
-              // emit global `*` rules which are considered to be non-pure and will cause builds
-              // to fail.
-              polyfills: isCSSModuleFile ? Polyfills.All ^ Polyfills.AtProperty : Polyfills.All,
+              shouldRewriteUrls: true,
+              onDependency: (path) => {
+                context.fullRebuildPaths.push(path)
+              },
             })
             DEBUG && I.end('Create compiler')
 
@@ -152,203 +121,23 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
             return compiler
           }
 
-          try {
-            // Setup the compiler if it doesn't exist yet. This way we can
-            // guarantee a `build()` function is available.
-            context.compiler ??= createCompiler()
+          // Whether this is the first build or not, if it is, then we can
+          // optimize the build by not creating the compiler until we need it.
+          let isInitialBuild = context.compiler === null
 
-            if ((await context.compiler).features === Features.None) {
-              return
-            }
+          // Setup the compiler if it doesn't exist yet. This way we can
+          // guarantee a `build()` function is available.
+          context.compiler ??= await createCompiler()
 
-            let rebuildStrategy: 'full' | 'incremental' = 'incremental'
+          if (context.compiler.features === Features.None) {
+            return
+          }
 
-            // Track file modification times to CSS files
-            DEBUG && I.start('Register full rebuild paths')
-            {
-              for (let file of context.fullRebuildPaths) {
-                result.messages.push({
-                  type: 'dependency',
-                  plugin: '@tailwindcss/postcss',
-                  file: path.resolve(file),
-                  parent: result.opts.from,
-                })
-              }
+          let rebuildStrategy: 'full' | 'incremental' = 'incremental'
 
-              let files = result.messages.flatMap((message) => {
-                if (message.type !== 'dependency') return []
-                return message.file
-              })
-              files.push(inputFile)
-
-              for (let file of files) {
-                let changedTime = fs.statSync(file, { throwIfNoEntry: false })?.mtimeMs ?? null
-                if (changedTime === null) {
-                  if (file === inputFile) {
-                    rebuildStrategy = 'full'
-                  }
-                  continue
-                }
-
-                let prevTime = context.mtimes.get(file)
-                if (prevTime === changedTime) continue
-
-                rebuildStrategy = 'full'
-                context.mtimes.set(file, changedTime)
-              }
-
-              // The mtimes above only track files on disk. When the input CSS is
-              // generated by another tool (e.g. Sass) and passed to `process()`,
-              // it can change without any tracked file's mtime changing, so also
-              // rebuild when the input CSS itself differs from the last build.
-              let inputCss = root.source?.input.css ?? root.toString()
-              if (context.inputCss !== inputCss) {
-                rebuildStrategy = 'full'
-                context.inputCss = inputCss
-              }
-            }
-            DEBUG && I.end('Register full rebuild paths')
-
-            if (
-              rebuildStrategy === 'full' &&
-              // We can reuse the compiler if it was created during the
-              // initial build. If it wasn't, we need to create a new one.
-              !isInitialBuild
-            ) {
-              context.compiler = createCompiler()
-            }
-
-            let compiler = await context.compiler
-
-            if (context.scanner === null || rebuildStrategy === 'full') {
-              DEBUG && I.start('Setup scanner')
-              let sources = (() => {
-                // Disable auto source detection
-                if (compiler.root === 'none') {
-                  return []
-                }
-
-                // No root specified, use the base directory
-                if (compiler.root === null) {
-                  return [{ base, pattern: '**/*', negated: false }]
-                }
-
-                // Use the specified root
-                return [{ ...compiler.root, negated: false }]
-              })().concat(compiler.sources)
-
-              // Look for candidates used to generate the CSS
-              context.scanner = new Scanner({ sources })
-              DEBUG && I.end('Setup scanner')
-            }
-
-            DEBUG && I.start('Scan for candidates')
-            let candidates = compiler.features & Features.Utilities ? context.scanner.scan() : []
-            DEBUG && I.end('Scan for candidates')
-
-            if (compiler.features & Features.Utilities) {
-              DEBUG && I.start('Register dependency messages')
-              // Add all found files as direct dependencies
-              // Note: With Turbopack, the input file might not be a resolved path
-              let resolvedInputFile = path.resolve(base, inputFile)
-              for (let file of context.scanner.files) {
-                let absolutePath = path.resolve(file)
-                // The CSS file cannot be a dependency of itself
-                if (absolutePath === resolvedInputFile) {
-                  continue
-                }
-                result.messages.push({
-                  type: 'dependency',
-                  plugin: '@tailwindcss/postcss',
-                  file: absolutePath,
-                  parent: result.opts.from,
-                })
-              }
-
-              // Register dependencies so changes in `base` cause a rebuild while
-              // giving tools like Vite or Parcel a glob that can be used to limit
-              // the files that cause a rebuild to only those that match it.
-              for (let { base: globBase, pattern } of context.scanner.globs) {
-                // Avoid adding a dependency on the base directory itself, since it
-                // causes Next.js to start an endless recursion if the `distDir` is
-                // configured to anything other than the default `.next` dir.
-                if (pattern === '*' && base === globBase) {
-                  continue
-                }
-
-                if (pattern === '') {
-                  result.messages.push({
-                    type: 'dependency',
-                    plugin: '@tailwindcss/postcss',
-                    file: path.resolve(globBase),
-                    parent: result.opts.from,
-                  })
-                } else {
-                  result.messages.push({
-                    type: 'dir-dependency',
-                    plugin: '@tailwindcss/postcss',
-                    dir: path.resolve(globBase),
-                    glob: pattern,
-                    parent: result.opts.from,
-                  })
-                }
-              }
-              DEBUG && I.end('Register dependency messages')
-            }
-
-            DEBUG && I.start('Build utilities')
-            let tailwindCssAst = compiler.build(candidates)
-            DEBUG && I.end('Build utilities')
-
-            if (context.tailwindCssAst !== tailwindCssAst) {
-              if (optimize) {
-                DEBUG && I.start('Optimization')
-
-                DEBUG && I.start('AST -> CSS')
-                let css = toCss(tailwindCssAst)
-                DEBUG && I.end('AST -> CSS')
-
-                DEBUG && I.start('Lightning CSS')
-                let optimized = optimizeCss(css, {
-                  minify: typeof optimize === 'object' ? optimize.minify : true,
-                })
-                DEBUG && I.end('Lightning CSS')
-
-                DEBUG && I.start('CSS -> PostCSS AST')
-                context.optimizedPostCssAst = postcss.parse(optimized.code, result.opts)
-                DEBUG && I.end('CSS -> PostCSS AST')
-
-                DEBUG && I.end('Optimization')
-              } else {
-                // Convert our AST to a PostCSS AST
-                DEBUG && I.start('Transform Tailwind CSS AST into PostCSS AST')
-                context.cachedPostCssAst = cssAstToPostCssAst(postcss, tailwindCssAst, root.source)
-                DEBUG && I.end('Transform Tailwind CSS AST into PostCSS AST')
-              }
-            }
-
-            context.tailwindCssAst = tailwindCssAst
-
-            DEBUG && I.start('Update PostCSS AST')
-            root.removeAll()
-            root.append(
-              optimize
-                ? context.optimizedPostCssAst.clone().nodes
-                : context.cachedPostCssAst.clone().nodes,
-            )
-
-            // Trick PostCSS into thinking the indent is 2 spaces, so it uses that
-            // as the default instead of 4.
-            root.raws.indent = '  '
-            DEBUG && I.end('Update PostCSS AST')
-
-            DEBUG && I.end(`[@tailwindcss/postcss] ${relative(base, inputFile)}`)
-          } catch (error) {
-            // An error requires a full rebuild to fix
-            context.compiler = null
-
-            // Ensure all dependencies we have collected thus far are included so that the rebuild
-            // is correctly triggered
+          // Track file modification times to CSS files
+          DEBUG && I.start('Register full rebuild paths')
+          {
             for (let file of context.fullRebuildPaths) {
               result.messages.push({
                 type: 'dependency',
@@ -358,20 +147,196 @@ function tailwindcss(opts: PluginOptions = {}): AcceptedPlugin {
               })
             }
 
-            // We found that throwing the error will cause PostCSS to no longer watch for changes
-            // in some situations so we instead log the error and continue with an empty stylesheet.
-            console.error(error)
+            let files = result.messages.flatMap((message) => {
+              if (message.type !== 'dependency') return []
+              return message.file
+            })
+            files.push(inputFile)
 
-            if (error && typeof error === 'object' && 'message' in error) {
-              throw root.error(`${error.message}`)
+            for (let file of files) {
+              let changedTime = fs.statSync(file, { throwIfNoEntry: false })?.mtimeMs ?? null
+              if (changedTime === null) {
+                if (file === inputFile) {
+                  rebuildStrategy = 'full'
+                }
+                continue
+              }
+
+              let prevTime = context.mtimes.get(file)
+              if (prevTime === changedTime) continue
+
+              rebuildStrategy = 'full'
+              context.mtimes.set(file, changedTime)
+            }
+          }
+          DEBUG && I.end('Register full rebuild paths')
+
+          if (
+            rebuildStrategy === 'full' &&
+            // We can re-use the compiler if it was created during the
+            // initial build. If it wasn't, we need to create a new one.
+            !isInitialBuild
+          ) {
+            context.compiler = await createCompiler()
+          }
+
+          if (context.scanner === null || rebuildStrategy === 'full') {
+            DEBUG && I.start('Setup scanner')
+            let sources = (() => {
+              // Disable auto source detection
+              if (context.compiler.root === 'none') {
+                return []
+              }
+
+              // No root specified, use the base directory
+              if (context.compiler.root === null) {
+                return [{ base, pattern: '**/*' }]
+              }
+
+              // Use the specified root
+              return [context.compiler.root]
+            })().concat(context.compiler.globs)
+
+            // Look for candidates used to generate the CSS
+            context.scanner = new Scanner({ sources })
+            DEBUG && I.end('Setup scanner')
+          }
+
+          DEBUG && I.start('Scan for candidates')
+          let candidates =
+            context.compiler.features & Features.Utilities ? context.scanner.scan() : []
+          DEBUG && I.end('Scan for candidates')
+
+          if (context.compiler.features & Features.Utilities) {
+            DEBUG && I.start('Register dependency messages')
+            // Add all found files as direct dependencies
+            for (let file of context.scanner.files) {
+              result.messages.push({
+                type: 'dependency',
+                plugin: '@tailwindcss/postcss',
+                file: path.resolve(file),
+                parent: result.opts.from,
+              })
             }
 
-            throw root.error(`${error}`)
+            // Register dependencies so changes in `base` cause a rebuild while
+            // giving tools like Vite or Parcel a glob that can be used to limit
+            // the files that cause a rebuild to only those that match it.
+            for (let { base: globBase, pattern } of context.scanner.globs) {
+              // Avoid adding a dependency on the base directory itself, since it
+              // causes Next.js to start an endless recursion if the `distDir` is
+              // configured to anything other than the default `.next` dir.
+              if (pattern === '*' && base === globBase) {
+                continue
+              }
+
+              if (pattern === '') {
+                result.messages.push({
+                  type: 'dependency',
+                  plugin: '@tailwindcss/postcss',
+                  file: path.resolve(globBase),
+                  parent: result.opts.from,
+                })
+              } else {
+                result.messages.push({
+                  type: 'dir-dependency',
+                  plugin: '@tailwindcss/postcss',
+                  dir: path.resolve(globBase),
+                  glob: pattern,
+                  parent: result.opts.from,
+                })
+              }
+            }
+            DEBUG && I.end('Register dependency messages')
           }
+
+          DEBUG && I.start('Build utilities')
+          let tailwindCssAst = context.compiler.build(candidates)
+          DEBUG && I.end('Build utilities')
+
+          if (context.tailwindCssAst !== tailwindCssAst) {
+            if (optimize) {
+              DEBUG && I.start('Optimization')
+
+              DEBUG && I.start('AST -> CSS')
+              let css = toCss(tailwindCssAst)
+              DEBUG && I.end('AST -> CSS')
+
+              DEBUG && I.start('Lightning CSS')
+              let ast = optimizeCss(css, {
+                minify: typeof optimize === 'object' ? optimize.minify : true,
+              })
+              DEBUG && I.end('Lightning CSS')
+
+              DEBUG && I.start('CSS -> PostCSS AST')
+              context.optimizedPostCssAst = postcss.parse(ast, result.opts)
+              DEBUG && I.end('CSS -> PostCSS AST')
+
+              DEBUG && I.end('Optimization')
+            } else {
+              // Convert our AST to a PostCSS AST
+              DEBUG && I.start('Transform Tailwind CSS AST into PostCSS AST')
+              context.cachedPostCssAst = cssAstToPostCssAst(tailwindCssAst, root.source)
+              DEBUG && I.end('Transform Tailwind CSS AST into PostCSS AST')
+            }
+          }
+
+          context.tailwindCssAst = tailwindCssAst
+
+          DEBUG && I.start('Update PostCSS AST')
+          root.removeAll()
+          root.append(
+            optimize
+              ? context.optimizedPostCssAst.clone().nodes
+              : context.cachedPostCssAst.clone().nodes,
+          )
+
+          // Trick PostCSS into thinking the indent is 2 spaces, so it uses that
+          // as the default instead of 4.
+          root.raws.indent = '  '
+          DEBUG && I.end('Update PostCSS AST')
+
+          DEBUG && I.end(`[@tailwindcss/postcss] ${relative(base, inputFile)}`)
         },
       },
     ],
   }
 }
 
+function optimizeCss(
+  input: string,
+  { file = 'input.css', minify = false }: { file?: string; minify?: boolean } = {},
+) {
+  function optimize(code: Buffer | Uint8Array) {
+    return transform({
+      filename: file,
+      code,
+      minify,
+      sourceMap: false,
+      drafts: {
+        customMedia: true,
+      },
+      nonStandard: {
+        deepSelectorCombinator: true,
+      },
+      include: LightningCssFeatures.Nesting,
+      exclude:
+        LightningCssFeatures.LogicalProperties |
+        LightningCssFeatures.DirSelector |
+        LightningCssFeatures.LightDark,
+      targets: {
+        safari: (16 << 16) | (4 << 8),
+        ios_saf: (16 << 16) | (4 << 8),
+        firefox: 128 << 16,
+        chrome: 111 << 16,
+      },
+      errorRecovery: true,
+    }).code
+  }
+
+  // Running Lightning CSS twice to ensure that adjacent rules are merged after
+  // nesting is applied. This creates a more optimized output.
+  return optimize(optimize(Buffer.from(input))).toString()
+}
+
 export default Object.assign(tailwindcss, { postcss: true }) as PluginCreator<PluginOptions>
diff --git a/packages/@tailwindcss-postcss/src/postcss-fix-relative-paths/index.test.ts b/packages/@tailwindcss-postcss/src/postcss-fix-relative-paths/index.test.ts
index fd90c483e..d2f72f664 100644
--- a/packages/@tailwindcss-postcss/src/postcss-fix-relative-paths/index.test.ts
+++ b/packages/@tailwindcss-postcss/src/postcss-fix-relative-paths/index.test.ts
@@ -4,7 +4,6 @@ import postcss from 'postcss'
 import atImport from 'postcss-import'
 import { describe, expect, test } from 'vitest'
 import fixRelativePathsPlugin from '.'
-import { pretty } from '../../../tailwindcss/src/test-utils/run'
 
 describe('fixRelativePathsPlugin', () => {
   test('rewrites @source and @plugin to be relative to the initial css file', async () => {
@@ -15,13 +14,11 @@ describe('fixRelativePathsPlugin', () => {
 
     let result = await processor.process(css, { from: cssPath })
 
-    expect(pretty(result.css)).toMatchInlineSnapshot(`
-      "
-      @source "../../example-project/src/**/*.ts";
+    expect(result.css.trim()).toMatchInlineSnapshot(`
+      "@source "../../example-project/src/**/*.ts";
       @source "!../../example-project/src/**/*.ts";
       @plugin "../../example-project/src/plugin.js";
-      @plugin "../../example-project/src/what\\"s-this.js";
-      "
+      @plugin "../../example-project/src/what\\"s-this.js";"
     `)
   })
 
@@ -33,13 +30,11 @@ describe('fixRelativePathsPlugin', () => {
 
     let result = await processor.process(css, { from: cssPath })
 
-    expect(pretty(result.css)).toMatchInlineSnapshot(`
-      "
-      @plugin "/absolute/paths";
+    expect(result.css.trim()).toMatchInlineSnapshot(`
+      "@plugin "/absolute/paths";
       @plugin "C:\\Program Files\\HAL 9000";
       @plugin "\\\\Media\\Pictures\\Worth\\1000 words";
-      @plugin "some-node-dep";
-      "
+      @plugin "some-node-dep";"
     `)
   })
 
@@ -51,16 +46,13 @@ describe('fixRelativePathsPlugin', () => {
 
     let result = await processor.process(css, { from: cssPath })
 
-    expect(pretty(result.css)).toMatchInlineSnapshot(`
-      "
-      @plugin './plugin-in-sibling.ts';
+    expect(result.css.trim()).toMatchInlineSnapshot(`
+      "@plugin './plugin-in-sibling.ts';
       @plugin '../plugin-in-sibling.ts';
       @plugin 'plugin-in-sibling';
-
       @plugin './plugin-in-root.ts';
       @plugin '../plugin-in-root.ts';
-      @plugin 'plugin-in-root';
-      "
+      @plugin 'plugin-in-root';"
     `)
   })
 })
diff --git a/packages/@tailwindcss-postcss/tsconfig.json b/packages/@tailwindcss-postcss/tsconfig.json
index d2131cbeb..6ae022f65 100644
--- a/packages/@tailwindcss-postcss/tsconfig.json
+++ b/packages/@tailwindcss-postcss/tsconfig.json
@@ -1,6 +1,3 @@
 {
   "extends": "../tsconfig.base.json",
-  "compilerOptions": {
-    "verbatimModuleSyntax": false,
-  },
 }
diff --git a/packages/@tailwindcss-standalone/package.json b/packages/@tailwindcss-standalone/package.json
index 24f8c93c7..84ce8b729 100644
--- a/packages/@tailwindcss-standalone/package.json
+++ b/packages/@tailwindcss-standalone/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/standalone",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "private": true,
   "description": "Standalone CLI for Tailwind CSS",
   "license": "MIT",
@@ -27,23 +27,23 @@
   "dependencies": {
     "@tailwindcss/aspect-ratio": "^0.4.2",
     "@tailwindcss/cli": "workspace:*",
-    "@tailwindcss/forms": "^0.5.11",
-    "@tailwindcss/typography": "^0.5.20",
+    "@tailwindcss/forms": "^0.5.10",
+    "@tailwindcss/typography": "^0.5.16",
     "detect-libc": "1.0.3",
-    "enhanced-resolve": "catalog:",
+    "enhanced-resolve": "^5.18.1",
     "tailwindcss": "workspace:*"
   },
   "__notes": "These binary packages must be included so Bun can build the CLI for all supported platforms. We also rely on Lightning CSS and Parcel being patched so Bun can statically analyze the executables.",
   "devDependencies": {
-    "@parcel/watcher-darwin-arm64": "catalog:",
-    "@parcel/watcher-darwin-x64": "catalog:",
-    "@parcel/watcher-linux-arm64-glibc": "catalog:",
-    "@parcel/watcher-linux-arm64-musl": "catalog:",
-    "@parcel/watcher-linux-x64-glibc": "catalog:",
-    "@parcel/watcher-linux-x64-musl": "catalog:",
-    "@parcel/watcher-win32-x64": "catalog:",
-    "@types/bun": "^1.3.14",
-    "bun": "^1.3.14",
+    "@parcel/watcher-darwin-arm64": "^2.5.1",
+    "@parcel/watcher-darwin-x64": "^2.5.1",
+    "@parcel/watcher-linux-arm64-glibc": "^2.5.1",
+    "@parcel/watcher-linux-arm64-musl": "^2.5.1",
+    "@parcel/watcher-linux-x64-glibc": "^2.5.1",
+    "@parcel/watcher-linux-x64-musl": "^2.5.1",
+    "@parcel/watcher-win32-x64": "^2.5.1",
+    "@types/bun": "^1.2.4",
+    "bun": "^1.2.4",
     "lightningcss-darwin-arm64": "catalog:",
     "lightningcss-darwin-x64": "catalog:",
     "lightningcss-linux-arm64-gnu": "catalog:",
diff --git a/packages/@tailwindcss-standalone/scripts/build.ts b/packages/@tailwindcss-standalone/scripts/build.ts
index 0aee26435..f37bdfd20 100644
--- a/packages/@tailwindcss-standalone/scripts/build.ts
+++ b/packages/@tailwindcss-standalone/scripts/build.ts
@@ -1,3 +1,4 @@
+import { $ } from 'bun'
 import { createHash } from 'node:crypto'
 import { mkdir, readFile, writeFile } from 'node:fs/promises'
 import * as path from 'node:path'
@@ -5,107 +6,76 @@ import { fileURLToPath } from 'node:url'
 
 const __dirname = fileURLToPath(new URL('.', import.meta.url))
 
-// Workaround for Bun binary downloads failing on Windows CI when
-// USERPROFILE is passed through by Turborepo.
-//
-// Unfortunately, setting this at runtime doesn't appear to work so we have to
-// spawn a new process without the env var.
-if (process.env.NESTED_BUILD !== '1' && process.env.USERPROFILE && process.env.USERPROFILE !== '') {
-  let result = await Bun.$`bun ${fileURLToPath(import.meta.url)}`.env({
-    USERPROFILE: '',
-    NESTED_BUILD: '1',
-  })
+async function buildForPlatform(triple: string, outfile: string) {
+  // We wrap this in a retry because occasionally the atomic rename fails for some reason
+  for (let i = 0; i < 5; ++i) {
+    try {
+      let cmd = $`bun build --compile --target=${triple} ./src/index.ts --outfile=${outfile} --env inline`
 
-  process.exit(result.exitCode)
+      // This env var is used by our patched versions of Lightning CSS and Parcel Watcher to
+      // statically bundle the proper binaries for musl vs glibc
+      cmd = cmd.env({
+        PLATFORM_LIBC: triple.includes('-musl') ? 'musl' : 'glibc',
+      })
+
+      return await cmd
+    } catch (err) {
+      if (i < 5) continue
+
+      throw new Error(`Failed to build for platform ${triple}`, { cause: err })
+    }
+  }
 }
 
-// We use baseline builds for all x64 platforms to ensure compatibility with
-// older hardware.
-let builds: { target: Bun.Build.Target; name: string }[] = [
-  { name: 'tailwindcss-linux-arm64', target: 'bun-linux-arm64' },
-  { name: 'tailwindcss-linux-arm64-musl', target: 'bun-linux-arm64-musl' },
-  // @ts-expect-error: Either the types are wrong or the runtime needs to be updated
-  // to accept a `-glibc` at the end like the types suggest.
-  { name: 'tailwindcss-linux-x64', target: 'bun-linux-x64-baseline' },
-  { name: 'tailwindcss-linux-x64-musl', target: 'bun-linux-x64-baseline-musl' },
-  { name: 'tailwindcss-macos-arm64', target: 'bun-darwin-arm64' },
-  { name: 'tailwindcss-macos-x64', target: 'bun-darwin-x64-baseline' },
-  { name: 'tailwindcss-windows-x64.exe', target: 'bun-windows-x64-baseline' },
-]
+async function build(triple: string, file: string) {
+  let start = process.hrtime.bigint()
 
-let summary: { target: Bun.Build.Target; name: string; sum: string }[] = []
+  let outfile = path.resolve(__dirname, `../dist/${file}`)
 
-// Build platform binaries and checksum them.
-let start = process.hrtime.bigint()
-for (let { target, name } of builds) {
-  let outfile = path.resolve(__dirname, `../dist/${name}`)
+  await buildForPlatform(triple, outfile)
 
-  let result = await Bun.build({
-    entrypoints: ['./src/index.ts'],
-    target: 'node',
-    minify: {
-      whitespace: false,
-      syntax: true,
-      identifiers: false,
-      keepNames: true,
-    },
-
-    define: {
-      // This ensures only necessary binaries are bundled for linux targets
-      // It reduces binary size since no runtime selection is necessary
-      'process.env.PLATFORM_LIBC': JSON.stringify(target.includes('-musl') ? 'musl' : 'glibc'),
-
-      // This prevents the WASI build from being bundled with the binary
-      'process.env.NAPI_RS_FORCE_WASI': JSON.stringify(''),
-
-      // This simplifies the Oxide loading code a small amount
-      'process.env.NAPI_RS_NATIVE_LIBRARY_PATH': JSON.stringify(''),
-    },
-
-    compile: {
-      target,
-      outfile,
-
-      // Disable .env loading
-      autoloadDotenv: false,
-
-      // Disable bunfig.toml loading
-      autoloadBunfig: false,
-    },
-
-    plugins: [
-      {
-        name: 'tailwindcss-plugin',
-        setup(build) {
-          build.onLoad({ filter: /tailwindcss-oxide\.wasi\.cjs$/ }, async (args) => {
-            return { contents: '' }
-          })
-        },
-      },
-    ],
-  })
-
-  let entry = result.outputs.find((output) => output.kind === 'entry-point')
-  if (!entry) throw new Error(`Build failed for ${target}`)
+  await new Promise((resolve) => setTimeout(resolve, 100))
 
   let content = await readFile(outfile)
+  let sum = createHash('sha256').update(content).digest('hex')
 
-  summary.push({
-    target,
-    name,
-    sum: createHash('sha256').update(content).digest('hex'),
-  })
+  let elapsed = process.hrtime.bigint() - start
+
+  return {
+    triple,
+    file,
+    sum,
+    elapsed,
+  }
 }
 
 await mkdir(path.resolve(__dirname, '../dist'), { recursive: true })
 
+// Build platform binaries and checksum them. We use baseline builds for all x64 platforms to ensure
+// compatibility with older hardware.
+let results = await Promise.all([
+  build('bun-linux-arm64', './tailwindcss-linux-arm64'),
+  build('bun-linux-arm64-musl', './tailwindcss-linux-arm64-musl'),
+
+  build('bun-linux-x64-baseline', './tailwindcss-linux-x64'),
+  build('bun-linux-x64-musl-baseline', './tailwindcss-linux-x64-musl'),
+
+  build('bun-darwin-arm64', './tailwindcss-macos-arm64'),
+  build('bun-darwin-x64-baseline', './tailwindcss-macos-x64'),
+
+  build('bun-windows-x64-baseline', './tailwindcss-windows-x64.exe'),
+])
+
 // Write the checksums to a file
 let sumsFile = path.resolve(__dirname, '../dist/sha256sums.txt')
-let sums = summary.map(({ name, sum }) => `${sum}  ./${name}`)
+let sums = results.map(({ file, sum }) => `${sum}  ${file}`)
+
+console.table(
+  results.map(({ triple, sum, elapsed }) => ({
+    triple,
+    sum,
+    elapsed: `${(Number(elapsed) / 1e6).toFixed(0)}ms`,
+  })),
+)
 
 await writeFile(sumsFile, sums.join('\n') + '\n')
-
-console.table(summary.map(({ target, sum }) => ({ target, sum })))
-
-let elapsed = process.hrtime.bigint() - start
-console.log(`Build completed in ${(Number(elapsed) / 1e6).toFixed(0)}ms`)
diff --git a/packages/@tailwindcss-standalone/src/index.ts b/packages/@tailwindcss-standalone/src/index.ts
index 23a928f8b..be85729bb 100644
--- a/packages/@tailwindcss-standalone/src/index.ts
+++ b/packages/@tailwindcss-standalone/src/index.ts
@@ -1,3 +1,4 @@
+import fs from 'node:fs'
 import { createRequire } from 'node:module'
 import packageJson from 'tailwindcss/package.json'
 
@@ -60,6 +61,15 @@ globalThis.__tw_load = async (id) => {
   }
 }
 globalThis.__tw_version = packageJson.version
+globalThis.__tw_readFile = async (path, encoding) => {
+  // When reading a file from the `$bunfs`, we need to use the synchronous
+  // `readFileSync` API
+  let isEmbeddedFileBase = path.includes('/$bunfs/root') || path.includes(':/~BUN/root')
+  if (!isEmbeddedFileBase) {
+    return
+  }
+  return fs.readFileSync(path, encoding)
+}
 
 // We use a plugin to make sure that the JS APIs are bundled with the standalone
 // CLI and can be imported inside configs and plugins
@@ -75,10 +85,12 @@ Bun.plugin({
       'tailwindcss/plugin': await import('tailwindcss/plugin'),
       'tailwindcss/plugin.js': await import('tailwindcss/plugin'),
       'tailwindcss/package.json': await import('tailwindcss/package.json'),
-      'tailwindcss/lib/util/flattenColorPalette':
-        await import('tailwindcss/lib/util/flattenColorPalette'),
-      'tailwindcss/lib/util/flattenColorPalette.js':
-        await import('tailwindcss/lib/util/flattenColorPalette'),
+      'tailwindcss/lib/util/flattenColorPalette': await import(
+        'tailwindcss/lib/util/flattenColorPalette'
+      ),
+      'tailwindcss/lib/util/flattenColorPalette.js': await import(
+        'tailwindcss/lib/util/flattenColorPalette'
+      ),
       'tailwindcss/defaultTheme': await import('tailwindcss/defaultTheme'),
       'tailwindcss/defaultTheme.js': await import('tailwindcss/defaultTheme'),
     }
diff --git a/packages/@tailwindcss-standalone/src/types.d.ts b/packages/@tailwindcss-standalone/src/types.d.ts
index 0b5deb6ea..3212ac5b6 100644
--- a/packages/@tailwindcss-standalone/src/types.d.ts
+++ b/packages/@tailwindcss-standalone/src/types.d.ts
@@ -6,5 +6,6 @@ declare module '*.css' {
 declare var __tw_version: string | undefined
 declare var __tw_resolve: undefined | ((id: string, base?: string) => string | false)
 declare var __tw_readFile:
-  undefined | ((path: string, encoding: BufferEncoding) => Promise<string | undefined>)
+  | undefined
+  | ((path: string, encoding: BufferEncoding) => Promise<string | undefined>)
 declare var __tw_load: undefined | ((path: string) => Promise<object | undefined>)
diff --git a/packages/@tailwindcss-turbopack/README.md b/packages/@tailwindcss-turbopack/README.md
deleted file mode 100644
index ee54b4d03..000000000
--- a/packages/@tailwindcss-turbopack/README.md
+++ /dev/null
@@ -1,99 +0,0 @@
-<p align="center">
-  <a href="https://tailwindcss.com" target="_blank">
-    <picture>
-      <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg">
-      <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg">
-      <img alt="Tailwind CSS" src="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg" width="350" height="70" style="max-width: 100%;">
-    </picture>
-  </a>
-</p>
-
-<p align="center">
-  A utility-first CSS framework for rapidly building custom user interfaces.
-</p>
-
-<p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
-    <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
-</p>
-
----
-
-## Documentation
-
-For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
-
-## Community
-
-For help, discussion about best practices, or feature ideas:
-
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
-
-## Contributing
-
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
-
----
-
-## @tailwindcss/turbopack
-
-A Turbopack loader for Tailwind CSS v4.
-
-## Installation
-
-```sh
-npm install @tailwindcss/turbopack
-```
-
-### Usage
-
-```javascript
-// next.config.js
-module.exports = {
-  turbopack: {
-    rules: {
-      '*.css': {
-        loaders: ['@tailwindcss/turbopack'],
-        as: '*.css',
-      },
-    },
-  },
-}
-```
-
-Then create a CSS file that imports Tailwind:
-
-```css
-/* src/index.css */
-@import 'tailwindcss';
-```
-
-### Options
-
-#### `base`
-
-The base directory to scan for class candidates. Defaults to the current working directory.
-
-```javascript
-{
-  loader: '@tailwindcss/turbopack',
-  options: {
-    base: process.cwd(),
-  },
-}
-```
-
-#### `optimize`
-
-Whether to optimize and minify the output CSS. Defaults to `true` in production mode.
-
-```javascript
-{
-  loader: '@tailwindcss/turbopack',
-  options: {
-    optimize: true, // or { minify: true }
-  },
-}
-```
diff --git a/packages/@tailwindcss-turbopack/package.json b/packages/@tailwindcss-turbopack/package.json
deleted file mode 100644
index abdbbe90e..000000000
--- a/packages/@tailwindcss-turbopack/package.json
+++ /dev/null
@@ -1,43 +0,0 @@
-{
-  "name": "@tailwindcss/turbopack",
-  "version": "4.3.3",
-  "description": "A Turbopack loader for Tailwind CSS v4.",
-  "license": "MIT",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/tailwindlabs/tailwindcss.git",
-    "directory": "packages/@tailwindcss-turbopack"
-  },
-  "bugs": "https://github.com/tailwindlabs/tailwindcss/issues",
-  "homepage": "https://tailwindcss.com",
-  "scripts": {
-    "build": "tsup-node",
-    "dev": "pnpm run build -- --watch"
-  },
-  "files": [
-    "dist/"
-  ],
-  "publishConfig": {
-    "provenance": true,
-    "access": "public"
-  },
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
-      "require": "./dist/index.js"
-    }
-  },
-  "main": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "dependencies": {
-    "@alloc/quick-lru": "^5.2.0",
-    "@tailwindcss/node": "workspace:*",
-    "@tailwindcss/oxide": "workspace:*",
-    "tailwindcss": "workspace:*"
-  },
-  "devDependencies": {
-    "@types/node": "catalog:",
-    "webpack": "catalog:"
-  }
-}
diff --git a/packages/@tailwindcss-turbopack/src/index.cts b/packages/@tailwindcss-turbopack/src/index.cts
deleted file mode 100644
index dbdded748..000000000
--- a/packages/@tailwindcss-turbopack/src/index.cts
+++ /dev/null
@@ -1,5 +0,0 @@
-import tailwindLoader from './index.ts'
-
-// CommonJS export for webpack loaders - must be the function directly
-// @ts-ignore
-export = tailwindLoader
diff --git a/packages/@tailwindcss-turbopack/src/index.ts b/packages/@tailwindcss-turbopack/src/index.ts
deleted file mode 100644
index a70f28871..000000000
--- a/packages/@tailwindcss-turbopack/src/index.ts
+++ /dev/null
@@ -1,287 +0,0 @@
-import QuickLRU from '@alloc/quick-lru'
-import {
-  compile,
-  env,
-  Features,
-  Instrumentation,
-  normalizePath,
-  optimize,
-  Polyfills,
-} from '@tailwindcss/node'
-import { clearRequireCache } from '@tailwindcss/node/require-cache'
-import { Scanner } from '@tailwindcss/oxide'
-import fs from 'node:fs'
-import path from 'node:path'
-import type { LoaderContext } from 'webpack'
-
-const DEBUG = env.DEBUG
-
-export interface LoaderOptions {
-  /**
-   * The base directory to scan for class candidates.
-   *
-   * Defaults to the current working directory.
-   */
-  base?: string
-
-  /**
-   * Optimize and minify the output CSS.
-   */
-  optimize?: boolean | { minify?: boolean }
-}
-
-interface CacheEntry {
-  mtimes: Map<string, number>
-  compiler: null | Awaited<ReturnType<typeof compile>>
-  scanner: null | Scanner
-  candidates: Set<string>
-  fullRebuildPaths: string[]
-}
-
-const cache = new QuickLRU<string, CacheEntry>({ maxSize: 50 })
-
-function getCacheKey(resourceId: string, opts: LoaderOptions): string {
-  return `${resourceId}:${opts.base ?? ''}:${JSON.stringify(opts.optimize)}`
-}
-
-function getContextFromCache(resourceId: string, opts: LoaderOptions): CacheEntry {
-  let key = getCacheKey(resourceId, opts)
-  if (cache.has(key)) return cache.get(key)!
-  let entry: CacheEntry = {
-    mtimes: new Map<string, number>(),
-    compiler: null,
-    scanner: null,
-    candidates: new Set<string>(),
-    fullRebuildPaths: [],
-  }
-  cache.set(key, entry)
-  return entry
-}
-
-export default async function tailwindLoader(
-  this: LoaderContext<LoaderOptions>,
-  source: string,
-): Promise<void> {
-  let callback = this.async()
-  let options = this.getOptions() ?? {}
-  let inputFile = this.resourcePath
-  let resourceId = this.resource
-  let base = options.base ?? process.cwd()
-  let shouldOptimize = options.optimize ?? process.env.NODE_ENV === 'production'
-  let isCSSModuleFile = inputFile.endsWith('.module.css')
-
-  using I = new Instrumentation()
-
-  DEBUG && I.start(`[@tailwindcss/turbopack] ${path.relative(base, inputFile)}`)
-
-  // Bail out early if this is guaranteed to be a non-Tailwind CSS file.
-  {
-    DEBUG && I.start('Quick bail check')
-    let canBail = !/@(import|reference|theme|variant|config|plugin|apply|tailwind)\b/.test(source)
-    if (canBail) {
-      DEBUG && I.end('Quick bail check')
-      DEBUG && I.end(`[@tailwindcss/turbopack] ${path.relative(base, inputFile)}`)
-      callback(null, source)
-      return
-    }
-    DEBUG && I.end('Quick bail check')
-  }
-
-  try {
-    let context = getContextFromCache(resourceId, options)
-    let inputBasePath = path.dirname(path.resolve(inputFile))
-
-    // Whether this is the first build or not
-    let isInitialBuild = context.compiler === null
-
-    async function createCompiler() {
-      DEBUG && I.start('Setup compiler')
-      if (context.fullRebuildPaths.length > 0 && !isInitialBuild) {
-        clearRequireCache(context.fullRebuildPaths)
-      }
-
-      context.fullRebuildPaths = []
-
-      DEBUG && I.start('Create compiler')
-      let compiler = await compile(source, {
-        from: inputFile,
-        base: inputBasePath,
-        shouldRewriteUrls: true,
-        onDependency: (depPath) => context.fullRebuildPaths.push(depPath),
-        // In CSS Module files, we have to disable the `@property` polyfill since these will
-        // emit global `*` rules which are considered to be non-pure and will cause builds
-        // to fail.
-        polyfills: isCSSModuleFile ? Polyfills.All ^ Polyfills.AtProperty : Polyfills.All,
-      })
-      DEBUG && I.end('Create compiler')
-
-      DEBUG && I.end('Setup compiler')
-      return compiler
-    }
-
-    // Setup the compiler if it doesn't exist yet
-    context.compiler ??= await createCompiler()
-
-    // Early exit if no Tailwind features are used
-    if (context.compiler.features === Features.None) {
-      DEBUG && I.end(`[@tailwindcss/turbopack] ${path.relative(base, inputFile)}`)
-      callback(null, source)
-      return
-    }
-
-    let rebuildStrategy: 'full' | 'incremental' = 'incremental'
-
-    // Track file modification times to CSS files
-    DEBUG && I.start('Register full rebuild paths')
-    {
-      // Report dependencies for config files, plugins, etc.
-      for (let file of context.fullRebuildPaths) {
-        this.addDependency(path.resolve(file))
-      }
-
-      let files = [...context.fullRebuildPaths, inputFile]
-
-      for (let file of files) {
-        let changedTime: number | null = null
-        try {
-          changedTime = fs.statSync(file)?.mtimeMs ?? null
-        } catch {
-          // File might not exist
-        }
-
-        if (changedTime === null) {
-          if (file === inputFile) {
-            rebuildStrategy = 'full'
-          }
-          continue
-        }
-
-        let prevTime = context.mtimes.get(file)
-        if (prevTime === changedTime) continue
-
-        rebuildStrategy = 'full'
-        context.mtimes.set(file, changedTime)
-      }
-    }
-    DEBUG && I.end('Register full rebuild paths')
-
-    if (rebuildStrategy === 'full' && !isInitialBuild) {
-      context.compiler = await createCompiler()
-    }
-
-    let compiler = context.compiler
-
-    // Check if we need to process this file at all
-    if (
-      !(
-        compiler.features &
-        (Features.AtApply | Features.JsPluginCompat | Features.ThemeFunction | Features.Utilities)
-      )
-    ) {
-      DEBUG && I.end(`[@tailwindcss/turbopack] ${path.relative(base, inputFile)}`)
-      callback(null, source)
-      return
-    }
-
-    // Setup or update scanner if needed
-    if (context.scanner === null || rebuildStrategy === 'full') {
-      DEBUG && I.start('Setup scanner')
-      let sources = (() => {
-        // Disable auto source detection
-        if (compiler.root === 'none') {
-          return []
-        }
-
-        // No root specified, use the base directory
-        if (compiler.root === null) {
-          return [{ base, pattern: '**/*', negated: false }]
-        }
-
-        // Use the specified root
-        return [{ ...compiler.root, negated: false }]
-      })().concat(compiler.sources)
-
-      context.scanner = new Scanner({ sources })
-      DEBUG && I.end('Setup scanner')
-    }
-
-    // Scan for candidates if utilities are used
-    if (compiler.features & Features.Utilities) {
-      DEBUG && I.start('Scan for candidates')
-      for (let candidate of context.scanner.scan()) {
-        context.candidates.add(candidate)
-      }
-      DEBUG && I.end('Scan for candidates')
-
-      DEBUG && I.start('Register dependency messages')
-      // Add all found files as direct dependencies
-      let resolvedInputFile = path.resolve(base, inputFile)
-      for (let file of context.scanner.files) {
-        let absolutePath = path.resolve(file)
-        // The CSS file cannot be a dependency of itself
-        if (absolutePath === resolvedInputFile) {
-          continue
-        }
-        this.addDependency(absolutePath)
-      }
-
-      // Register context dependencies for glob patterns
-      for (let glob of context.scanner.globs) {
-        // Skip negated patterns
-        if (glob.pattern[0] === '!') continue
-
-        // Avoid adding a dependency on the base directory itself
-        if (glob.pattern === '*' && base === glob.base) {
-          continue
-        }
-
-        this.addContextDependency(path.resolve(glob.base))
-      }
-
-      // Validate that source(...) paths are directories
-      let root = compiler.root
-      if (root !== 'none' && root !== null) {
-        let basePath = normalizePath(path.resolve(root.base, root.pattern))
-        try {
-          let stats = fs.statSync(basePath)
-          if (!stats.isDirectory()) {
-            throw new Error(
-              `The path given to \`source(…)\` must be a directory but got \`source(${basePath})\` instead.`,
-            )
-          }
-        } catch (err) {
-          if ((err as NodeJS.ErrnoException).code !== 'ENOENT') {
-            throw err
-          }
-          // Directory doesn't exist yet, which is fine
-        }
-      }
-      DEBUG && I.end('Register dependency messages')
-    }
-
-    DEBUG && I.start('Build utilities')
-    let css = compiler.build([...context.candidates])
-    DEBUG && I.end('Build utilities')
-
-    // Optionally optimize the output
-    let result = css
-    if (shouldOptimize) {
-      DEBUG && I.start('Optimization')
-      let optimized = optimize(css, {
-        minify: typeof shouldOptimize === 'object' ? shouldOptimize.minify : true,
-      })
-      result = optimized.code
-      DEBUG && I.end('Optimization')
-    }
-
-    DEBUG && I.end(`[@tailwindcss/turbopack] ${path.relative(base, inputFile)}`)
-    callback(null, result)
-  } catch (error) {
-    // Clear the cache entry on error to force a full rebuild next time
-    let key = getCacheKey(resourceId, options)
-    cache.delete(key)
-
-    DEBUG && I.end(`[@tailwindcss/turbopack] ${path.relative(base, inputFile)}`)
-    callback(error as Error)
-  }
-}
diff --git a/packages/@tailwindcss-turbopack/tsconfig.json b/packages/@tailwindcss-turbopack/tsconfig.json
deleted file mode 100644
index d2131cbeb..000000000
--- a/packages/@tailwindcss-turbopack/tsconfig.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-  "extends": "../tsconfig.base.json",
-  "compilerOptions": {
-    "verbatimModuleSyntax": false,
-  },
-}
diff --git a/packages/@tailwindcss-upgrade/README.md b/packages/@tailwindcss-upgrade/README.md
index 5f532607d..95ec9d87d 100644
--- a/packages/@tailwindcss-upgrade/README.md
+++ b/packages/@tailwindcss-upgrade/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,10 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-upgrade/package.json b/packages/@tailwindcss-upgrade/package.json
index e960d7677..7d858c83e 100644
--- a/packages/@tailwindcss-upgrade/package.json
+++ b/packages/@tailwindcss-upgrade/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/upgrade",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "repository": {
@@ -29,24 +29,24 @@
   "dependencies": {
     "@tailwindcss/node": "workspace:*",
     "@tailwindcss/oxide": "workspace:*",
-    "dedent": "catalog:",
-    "enhanced-resolve": "catalog:",
-    "globby": "^16.2.2",
-    "jiti": "^2.7.0",
+    "braces": "^3.0.3",
+    "dedent": "1.5.3",
+    "enhanced-resolve": "^5.18.1",
+    "globby": "^14.1.0",
+    "jiti": "^2.0.0-beta.3",
     "mri": "^1.2.0",
     "picocolors": "^1.1.1",
-    "postcss": "catalog:",
-    "postcss-import": "^16.1.1",
-    "postcss-selector-parser": "^7.1.4",
+    "postcss": "^8.4.41",
+    "postcss-import": "^16.1.0",
+    "postcss-selector-parser": "^7.1.0",
     "prettier": "catalog:",
-    "semver": "^7.8.5",
-    "tailwindcss": "workspace:*",
-    "tree-sitter": "^0.25.1",
-    "tree-sitter-typescript": "^0.23.2"
+    "tree-sitter": "^0.22.4",
+    "tree-sitter-typescript": "^0.23.2",
+    "tailwindcss": "workspace:*"
   },
   "devDependencies": {
+    "@types/braces": "^3.0.5",
     "@types/node": "catalog:",
-    "@types/postcss-import": "^14.0.3",
-    "@types/semver": "^7.8.0"
+    "@types/postcss-import": "^14.0.3"
   }
 }
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/analyze.ts b/packages/@tailwindcss-upgrade/src/codemods/css/analyze.ts
deleted file mode 100644
index c7058df54..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/css/analyze.ts
+++ /dev/null
@@ -1,303 +0,0 @@
-import { isGitIgnored } from 'globby'
-import path from 'node:path'
-import postcss, { type Result } from 'postcss'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import { segment } from '../../../../tailwindcss/src/utils/segment'
-import { Stylesheet, type StylesheetConnection } from '../../stylesheet'
-import { gitRoot } from '../../utils/git'
-import { error, highlight, relative } from '../../utils/renderer'
-import { resolveCssId } from '../../utils/resolve'
-
-export async function analyze(stylesheets: Stylesheet[], { base }: { base: string }) {
-  // Use the project's git root, instead of the `base` to ensure all
-  // `.gitignore` rules are being used.
-  let isIgnored = await isGitIgnored({ cwd: gitRoot(base) ?? base })
-  let processingQueue: (() => Promise<Result>)[] = []
-  let stylesheetsByFile = new DefaultMap<string, Stylesheet | null>((file) => {
-    // We don't want to process ignored files (like node_modules)
-    try {
-      if (isIgnored(file)) {
-        return null
-      }
-    } catch {
-      // If the file is not part of the current working directory (which can
-      // happen if you import `tailwindcss` and it's loading a shared file from
-      // pnpm) then this will throw.
-      return null
-    }
-
-    try {
-      let sheet = Stylesheet.loadSync(file)
-
-      // Mutate incoming stylesheets to include the newly discovered sheet
-      stylesheets.push(sheet)
-
-      // Queue up the processing of this stylesheet
-      processingQueue.push(() => processor.process(sheet.root, { from: sheet.file! }))
-
-      return sheet
-    } catch {
-      return null
-    }
-  })
-
-  // Step 1: Record which `@import` rules point to which stylesheets
-  // and which stylesheets are parents/children of each other
-  let processor = postcss([
-    {
-      postcssPlugin: 'mark-import-nodes',
-      AtRule: {
-        import(node) {
-          // Find what the import points to
-          let id = node.params.match(/['"](.*?)['"]/)?.[1]
-          if (!id) return
-
-          let basePath = node.source?.input.file
-            ? path.dirname(node.source.input.file)
-            : process.cwd()
-
-          // Resolve the import to a file path
-          let resolvedPath: string | false = false
-          try {
-            // We first try to resolve the file as relative to the current file
-            // to mimic the behavior of `postcss-import` since that's what was
-            // used to resolve imports in Tailwind CSS v3.
-            if (id[0] !== '.') {
-              try {
-                resolvedPath = resolveCssId(`./${id}`, basePath)
-              } catch {}
-            }
-
-            if (!resolvedPath) {
-              resolvedPath = resolveCssId(id, basePath)
-            }
-          } catch (err) {
-            // Import is a URL, we don't want to process these, but also don't
-            // want to show an error message for them.
-            if (id.startsWith('http://') || id.startsWith('https://') || id.startsWith('//')) {
-              return
-            }
-
-            // Something went wrong, we can't resolve the import.
-            error(
-              `Failed to resolve import: ${highlight(id)} in ${highlight(relative(node.source?.input.file!, basePath))}. Skipping.`,
-              { prefix: '↳ ' },
-            )
-            return
-          }
-
-          if (!resolvedPath) return
-
-          // Find the stylesheet pointing to the resolved path
-          let stylesheet = stylesheetsByFile.get(resolvedPath)
-
-          // If it _does not_ exist in stylesheets we don't care and skip it
-          // this is likely because its in node_modules or a workspace package
-          // that we don't want to modify
-          if (!stylesheet) return
-
-          // Mark the import node with the ID of the stylesheet it points to
-          // We will use these later to build lookup tables and modify the AST
-          node.raws.tailwind_destination_sheet_id = stylesheet.id
-
-          let parent = node.source?.input.file
-            ? stylesheetsByFile.get(node.source.input.file)
-            : undefined
-
-          let layers: string[] = []
-
-          for (let part of segment(node.params, ' ')) {
-            if (!part.startsWith('layer(')) continue
-            if (!part.endsWith(')')) continue
-
-            layers.push(part.slice(6, -1).trim())
-          }
-
-          // Connect sheets together in a dependency graph
-          if (parent) {
-            let meta = { layers }
-            stylesheet.parents.add({ item: parent, meta })
-            parent.children.add({ item: stylesheet, meta })
-          }
-        },
-      },
-    },
-  ])
-
-  // Seed the map with all the known stylesheets, and queue up the processing of
-  // each incoming stylesheet.
-  for (let sheet of stylesheets) {
-    if (sheet.file) {
-      stylesheetsByFile.set(sheet.file, sheet)
-      processingQueue.push(() => processor.process(sheet.root, { from: sheet.file ?? undefined }))
-    }
-  }
-
-  // Process all the stylesheets from step 1
-  while (processingQueue.length > 0) {
-    let task = processingQueue.shift()!
-    await task()
-  }
-
-  // ---
-
-  let commonPath = process.cwd()
-
-  function pathToString(path: StylesheetConnection[]) {
-    let parts: string[] = []
-
-    for (let connection of path) {
-      if (!connection.item.file) continue
-
-      let filePath = connection.item.file.replace(commonPath, '')
-      let layers = connection.meta.layers.join(', ')
-
-      if (layers.length > 0) {
-        parts.push(`${filePath} (layers: ${layers})`)
-      } else {
-        parts.push(filePath)
-      }
-    }
-
-    return parts.join(' <- ')
-  }
-
-  let lines: string[] = []
-
-  for (let sheet of stylesheets) {
-    if (!sheet.file) continue
-
-    let { convertiblePaths, nonConvertiblePaths } = sheet.analyzeImportPaths()
-    let isAmbiguous = convertiblePaths.length > 0 && nonConvertiblePaths.length > 0
-
-    if (!isAmbiguous) continue
-
-    sheet.canMigrate = false
-
-    let filePath = sheet.file.replace(commonPath, '')
-
-    for (let path of convertiblePaths) {
-      lines.push(`- ${filePath} <- ${pathToString(path)}`)
-    }
-
-    for (let path of nonConvertiblePaths) {
-      lines.push(`- ${filePath} <- ${pathToString(path)}`)
-    }
-  }
-
-  if (lines.length === 0) {
-    let tailwindRootLeafs = new Set<Stylesheet>()
-
-    for (let sheet of stylesheets) {
-      // If the current file already contains `@config`, then we can assume it's
-      // a Tailwind CSS root file.
-      sheet.root.walkAtRules('config', () => {
-        sheet.isTailwindRoot = true
-        return false
-      })
-      if (sheet.isTailwindRoot) continue
-
-      // If an `@tailwind` at-rule, or `@import "tailwindcss"` is present,
-      // then we can assume it's a file where Tailwind CSS might be configured.
-      //
-      // However, if 2 or more stylesheets exist with these rules that share a
-      // common parent, then we want to mark the common parent as the root
-      // stylesheet instead.
-      sheet.root.walkAtRules((node) => {
-        if (
-          node.name === 'tailwind' ||
-          (node.name === 'import' && node.params.match(/^["']tailwindcss["']/)) ||
-          (node.name === 'import' && node.params.match(/^["']tailwindcss\/.*?["']$/))
-        ) {
-          sheet.isTailwindRoot = true
-          tailwindRootLeafs.add(sheet)
-        }
-      })
-    }
-
-    // Only a single Tailwind CSS root file exists, no need to do anything else.
-    if (tailwindRootLeafs.size <= 1) {
-      return
-    }
-
-    // Mark the common parent as the root file
-    {
-      // Group each sheet from tailwindRootLeafs by their common parent
-      let commonParents = new DefaultMap<Stylesheet, Set<Stylesheet>>(() => new Set<Stylesheet>())
-
-      // Seed common parents with leafs
-      for (let sheet of tailwindRootLeafs) {
-        commonParents.get(sheet).add(sheet)
-      }
-
-      // If any 2 common parents come from the same tree, then all children of
-      // parent A and parent B will be moved to the parent of parent A and
-      // parent B. Parent A and parent B will be removed.
-      let repeat = true
-      repeat: while (repeat) {
-        repeat = false
-
-        for (let [sheetA, childrenA] of commonParents) {
-          for (let [sheetB, childrenB] of commonParents) {
-            if (sheetA === sheetB) continue
-
-            // Ancestors from self to root. Reversed order so we find the
-            // nearest common parent first
-            //
-            // Including self because if you compare a sheet with its parent,
-            // then the parent is still the common sheet between the two. In
-            // this case, the parent is the root file.
-            let ancestorsA = [sheetA].concat(Array.from(sheetA.ancestors()).reverse())
-            let ancestorsB = [sheetB].concat(Array.from(sheetB.ancestors()).reverse())
-
-            for (let parentA of ancestorsA) {
-              for (let parentB of ancestorsB) {
-                if (parentA !== parentB) continue
-
-                // Found the parent
-                let parent = parentA
-
-                commonParents.delete(sheetA)
-                commonParents.delete(sheetB)
-
-                for (let child of childrenA) {
-                  commonParents.get(parent).add(child)
-                }
-
-                for (let child of childrenB) {
-                  commonParents.get(parent).add(child)
-                }
-
-                // Found a common parent between sheet A and sheet B. We can
-                // stop looking for more common parents between A and B, and
-                // continue with the next sheet.
-                repeat = true
-                continue repeat
-              }
-            }
-          }
-        }
-      }
-
-      // Mark the common parent as the Tailwind CSS root file, and remove the
-      // flag from each leaf.
-      for (let [parent, children] of commonParents) {
-        parent.isTailwindRoot = true
-
-        for (let child of children) {
-          if (parent === child) continue
-
-          child.isTailwindRoot = false
-        }
-      }
-      return
-    }
-  }
-
-  {
-    let error = `You have one or more stylesheets that are imported into a utility layer and non-utility layer.\n`
-    error += `We cannot convert stylesheets under these conditions. Please look at the following stylesheets:\n`
-
-    throw new Error(error + lines.join('\n'))
-  }
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/link.ts b/packages/@tailwindcss-upgrade/src/codemods/css/link.ts
deleted file mode 100644
index 04c2dd770..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/css/link.ts
+++ /dev/null
@@ -1,122 +0,0 @@
-import { normalizePath } from '@tailwindcss/node'
-import path from 'node:path'
-import postcss from 'postcss'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import { Stylesheet } from '../../stylesheet'
-import { error, highlight, relative, success } from '../../utils/renderer'
-import { detectConfigPath } from '../template/prepare-config'
-
-export async function linkConfigs(
-  stylesheets: Stylesheet[],
-  { configPath, base }: { configPath: string | null; base: string },
-) {
-  let rootStylesheets = stylesheets.filter((sheet) => sheet.isTailwindRoot)
-  if (rootStylesheets.length === 0) {
-    throw new Error(
-      `Cannot find any CSS files that reference Tailwind CSS.\nBefore your project can be upgraded you need to create a CSS file that imports Tailwind CSS or uses ${highlight('@tailwind')}.`,
-    )
-  }
-  let withoutAtConfig = rootStylesheets.filter((sheet) => {
-    let hasConfig = false
-    sheet.root.walkAtRules('config', (node) => {
-      let configPath = path.resolve(path.dirname(sheet.file!), node.params.slice(1, -1))
-      sheet.linkedConfigPath = configPath
-      hasConfig = true
-      return false
-    })
-    return !hasConfig
-  })
-
-  // All stylesheets have a `@config` directives
-  if (withoutAtConfig.length === 0) return
-
-  // Find the config file path for each stylesheet
-  let configPathBySheet = new Map<Stylesheet, string>()
-  let sheetByConfigPath = new DefaultMap<string, Set<Stylesheet>>(() => new Set())
-  for (let sheet of withoutAtConfig) {
-    if (!sheet.file) continue
-
-    let localConfigPath = configPath as string
-    if (configPath === null) {
-      localConfigPath = await detectConfigPath(path.dirname(sheet.file), base)
-    } else if (!path.isAbsolute(localConfigPath)) {
-      localConfigPath = path.resolve(base, localConfigPath)
-    }
-
-    configPathBySheet.set(sheet, localConfigPath)
-    sheetByConfigPath.get(localConfigPath).add(sheet)
-  }
-
-  let problematicStylesheets = new Set<Stylesheet>()
-  for (let sheets of sheetByConfigPath.values()) {
-    if (sheets.size > 1) {
-      for (let sheet of sheets) {
-        problematicStylesheets.add(sheet)
-      }
-    }
-  }
-
-  // There are multiple "root" files without `@config` directives. Manual
-  // intervention is needed to link to the correct Tailwind config files.
-  if (problematicStylesheets.size > 1) {
-    for (let sheet of problematicStylesheets) {
-      error(
-        `Could not determine configuration file for: ${highlight(relative(sheet.file!, base))}\nUpdate your stylesheet to use ${highlight('@config')} to specify the correct configuration file explicitly and then run the upgrade tool again.`,
-        { prefix: '↳ ' },
-      )
-    }
-
-    process.exit(1)
-  }
-
-  let relativePath = relative
-  for (let [sheet, configPath] of configPathBySheet) {
-    try {
-      if (!sheet || !sheet.file) return
-      success(
-        `Linked ${highlight(relativePath(configPath, base))} to ${highlight(relativePath(sheet.file, base))}`,
-        { prefix: '↳ ' },
-      )
-
-      // Link the `@config` directive to the root stylesheets
-
-      // Track the config file path on the stylesheet itself for easy access
-      // without traversing the CSS ast and finding the corresponding
-      // `@config` later.
-      sheet.linkedConfigPath = configPath
-
-      // Create a relative path from the current file to the config file.
-      let relative = path.relative(path.dirname(sheet.file), configPath)
-
-      // If the path points to a file in the same directory, `path.relative` will
-      // remove the leading `./` and we need to add it back in order to still
-      // consider the path relative
-      if (!relative.startsWith('.') && !path.isAbsolute(relative)) {
-        relative = './' + relative
-      }
-
-      relative = normalizePath(relative)
-
-      // Add the `@config` directive to the root stylesheet.
-      {
-        let target = sheet.root as postcss.Root | postcss.AtRule
-        let atConfig = postcss.atRule({ name: 'config', params: `'${relative}'` })
-
-        sheet.root.walkAtRules((node) => {
-          if (node.name === 'tailwind' || node.name === 'import') {
-            target = node
-          }
-        })
-
-        if (target.type === 'root') {
-          sheet.root.prepend(atConfig)
-        } else if (target.type === 'atrule') {
-          target.after(atConfig)
-        }
-      }
-    } catch (e: any) {
-      error('Could not load the configuration file: ' + e.message, { prefix: '↳ ' })
-      process.exit(1)
-    }
-  }
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate.ts b/packages/@tailwindcss-upgrade/src/codemods/css/migrate.ts
deleted file mode 100644
index cb9150851..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import postcss from 'postcss'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { Stylesheet } from '../../stylesheet'
-import type { JSConfigMigration } from '../config/migrate-js-config'
-import { migrateAtApply } from './migrate-at-apply'
-import { migrateAtLayerUtilities } from './migrate-at-layer-utilities'
-import { migrateConfig } from './migrate-config'
-import { migrateImport } from './migrate-import'
-import { migrateMediaScreen } from './migrate-media-screen'
-import { migrateMissingLayers } from './migrate-missing-layers'
-import { migratePreflight } from './migrate-preflight'
-import { migrateTailwindDirectives } from './migrate-tailwind-directives'
-import { migrateThemeToVar } from './migrate-theme-to-var'
-import { migrateVariantsDirective } from './migrate-variants-directive'
-
-export interface MigrateOptions {
-  newPrefix: string | null
-  designSystem: DesignSystem | null
-  userConfig: Config | null
-  configFilePath: string | null
-  jsConfigMigration: JSConfigMigration | null
-}
-
-export async function migrate(stylesheet: Stylesheet, options: MigrateOptions) {
-  if (!stylesheet.file) {
-    throw new Error('Cannot migrate a stylesheet without a file path')
-  }
-
-  if (!stylesheet.canMigrate) return
-
-  await migrateContents(stylesheet, options)
-}
-
-export async function migrateContents(
-  stylesheet: Stylesheet | string,
-  options: MigrateOptions,
-  file?: string,
-) {
-  if (typeof stylesheet === 'string') {
-    stylesheet = await Stylesheet.fromString(stylesheet)
-    stylesheet.file = file ?? null
-  }
-
-  return postcss()
-    .use(migrateImport())
-    .use(migrateAtApply(options))
-    .use(migrateMediaScreen(options))
-    .use(migrateVariantsDirective())
-    .use(migrateAtLayerUtilities(stylesheet))
-    .use(migrateMissingLayers())
-    .use(migrateTailwindDirectives(options))
-    .use(migrateConfig(stylesheet, options))
-    .use(migratePreflight(options))
-    .use(migrateThemeToVar(options))
-    .process(stylesheet.root, { from: stylesheet.file ?? undefined })
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/split.ts b/packages/@tailwindcss-upgrade/src/codemods/css/split.ts
deleted file mode 100644
index 146d30733..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/css/split.ts
+++ /dev/null
@@ -1,257 +0,0 @@
-import postcss from 'postcss'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import { Stylesheet, type StylesheetId } from '../../stylesheet'
-import { walk, WalkAction } from '../../utils/walk'
-
-export async function split(stylesheets: Stylesheet[]) {
-  let stylesheetsById = new Map<StylesheetId, Stylesheet>()
-  let stylesheetsByFile = new Map<string, Stylesheet>()
-
-  for (let sheet of stylesheets) {
-    stylesheetsById.set(sheet.id, sheet)
-
-    if (sheet.file) {
-      stylesheetsByFile.set(sheet.file, sheet)
-    }
-  }
-
-  // Keep track of sheets that contain `@utility` rules
-  let requiresSplit = new Set<Stylesheet>()
-
-  for (let sheet of stylesheets) {
-    // Root files don't need to be split
-    if (sheet.isTailwindRoot) continue
-
-    let containsUtility = false
-    let containsUnsafe = sheet.layers().size > 0
-
-    walk(sheet.root, (node) => {
-      if (node.type === 'atrule' && node.name === 'utility') {
-        containsUtility = true
-      }
-
-      // Safe to keep without splitting
-      else if (
-        // An `@import "…" layer(…)` is safe
-        (node.type === 'atrule' && node.name === 'import' && node.params.includes('layer(')) ||
-        // @layer blocks are safe
-        (node.type === 'atrule' && node.name === 'layer') ||
-        // Comments are safe
-        node.type === 'comment'
-      ) {
-        return WalkAction.Skip
-      }
-
-      // Everything else is not safe, and requires a split
-      else {
-        containsUnsafe = true
-      }
-
-      // We already know we need to split this sheet
-      if (containsUtility && containsUnsafe) {
-        return WalkAction.Stop
-      }
-
-      return WalkAction.Skip
-    })
-
-    if (containsUtility && containsUnsafe) {
-      requiresSplit.add(sheet)
-    }
-  }
-
-  // Split every imported stylesheet into two parts
-  let utilitySheets = new Map<Stylesheet, Stylesheet>()
-
-  for (let sheet of stylesheets) {
-    // Ignore stylesheets that were not imported
-    if (!sheet.file) continue
-    if (sheet.parents.size === 0) continue
-
-    // Skip stylesheets that don't have utilities
-    // and don't have any children that have utilities
-    if (!requiresSplit.has(sheet)) {
-      if (!Array.from(sheet.descendants()).some((child) => requiresSplit.has(child))) {
-        continue
-      }
-    }
-
-    let utilities = postcss.root()
-
-    walk(sheet.root, (node) => {
-      if (node.type !== 'atrule') return
-      if (node.name !== 'utility') return
-
-      // `append` will move this node from the original sheet
-      // to the new utilities sheet
-      utilities.append(node)
-
-      return WalkAction.Skip
-    })
-
-    let newFileName = sheet.file.replace(/\.css$/, '.utilities.css')
-
-    let counter = 0
-
-    // If we already have a utility sheet with this name, we need to rename it
-    while (stylesheetsByFile.has(newFileName)) {
-      counter += 1
-      newFileName = sheet.file.replace(/\.css$/, `.utilities.${counter}.css`)
-    }
-
-    let utilitySheet = await Stylesheet.fromRoot(utilities, newFileName)
-
-    utilitySheet.extension = counter > 0 ? `.utilities.${counter}.css` : `.utilities.css`
-
-    utilitySheets.set(sheet, utilitySheet)
-    stylesheetsById.set(utilitySheet.id, utilitySheet)
-  }
-
-  // Make sure the utility sheets are linked to one another
-  for (let [normalSheet, utilitySheet] of utilitySheets) {
-    for (let parent of normalSheet.parents) {
-      let utilityParent = utilitySheets.get(parent.item)
-      if (!utilityParent) continue
-      utilitySheet.parents.add({
-        item: utilityParent,
-        meta: parent.meta,
-      })
-    }
-
-    for (let child of normalSheet.children) {
-      let utilityChild = utilitySheets.get(child.item)
-      if (!utilityChild) continue
-      utilitySheet.children.add({
-        item: utilityChild,
-        meta: child.meta,
-      })
-    }
-  }
-
-  for (let sheet of stylesheets) {
-    let utilitySheet = utilitySheets.get(sheet)
-    let utilityImports: Set<postcss.AtRule> = new Set()
-
-    for (let node of sheet.importRules) {
-      let sheetId = node.raws.tailwind_destination_sheet_id as StylesheetId | undefined
-
-      // This import rule does not point to a stylesheet
-      // which likely means it points to `node_modules`
-      if (!sheetId) continue
-
-      let originalDestination = stylesheetsById.get(sheetId)
-
-      // This import points to a stylesheet that no longer exists which likely
-      // means it was removed by the optimizer this will be cleaned up later
-      if (!originalDestination) continue
-
-      let utilityDestination = utilitySheets.get(originalDestination)
-
-      // A utility sheet doesn't exist for this import so it doesn't need
-      // to be processed
-      if (!utilityDestination) continue
-
-      let match = node.params.match(/(['"])(.*)\1/)
-      if (!match) return
-
-      let quote = match[1]
-      let id = match[2]
-
-      let newFile = id.replace(/\.css$/, utilityDestination.extension!)
-
-      // The import will just point to the new file without any media queries,
-      // layers, or other conditions because `@utility` MUST be top-level.
-      let newImport = node.clone({
-        params: `${quote}${newFile}${quote}`,
-        raws: {
-          tailwind_injected_layer: node.raws.tailwind_injected_layer,
-          tailwind_original_params: `${quote}${id}${quote}`,
-          tailwind_destination_sheet_id: utilityDestination.id,
-        },
-      })
-
-      if (utilitySheet) {
-        // If this import is intended to go into the utility sheet
-        // we'll collect it into a list to add later. If we don't'
-        // we'll end up adding them in reverse order.
-        utilityImports.add(newImport)
-      } else {
-        // This import will go immediately after the original import
-        node.after(newImport)
-      }
-    }
-
-    // Add imports to the top of the utility sheet if necessary
-    if (utilitySheet && utilityImports.size > 0) {
-      utilitySheet.root.prepend(Array.from(utilityImports))
-    }
-  }
-
-  // Tracks the at rules that import a given stylesheet
-  let importNodes = new DefaultMap<Stylesheet, Set<postcss.AtRule>>(() => new Set())
-
-  for (let sheet of stylesheetsById.values()) {
-    for (let node of sheet.importRules) {
-      let sheetId = node.raws.tailwind_destination_sheet_id as StylesheetId | undefined
-
-      // This import rule does not point to a stylesheet
-      if (!sheetId) continue
-
-      let destination = stylesheetsById.get(sheetId)
-
-      // This import rule does not point to a stylesheet that exists
-      // We'll remove it later
-      if (!destination) continue
-
-      importNodes.get(destination).add(node)
-    }
-  }
-
-  // At this point we've created many `{name}.utilities.css` files.
-  // If the original file _becomes_ empty after splitting that means that
-  // dedicated utility file is not required and we can move the utilities
-  // back to the original file.
-  //
-  // This could be done in one step but separating them makes it easier to
-  // reason about since the stylesheets are in a consistent state before we
-  // perform any cleanup tasks.
-  let list: Stylesheet[] = []
-
-  for (let sheet of stylesheets.slice()) {
-    for (let child of sheet.descendants()) {
-      list.push(child)
-    }
-
-    list.push(sheet)
-  }
-
-  for (let sheet of list) {
-    let utilitySheet = utilitySheets.get(sheet)
-
-    // This sheet was not split so there's nothing to do
-    if (!utilitySheet) continue
-
-    // This sheet did not become empty
-    if (!sheet.isEmpty) continue
-
-    // We have a sheet that became empty after splitting
-    // 1. Replace the sheet with it's utility sheet content
-    sheet.root = utilitySheet.root
-
-    // 2. Rewrite imports in parent sheets to point to the original sheet
-    // Ideally this wouldn't need to be _undone_ but instead only done once at the end
-    for (let node of importNodes.get(utilitySheet)) {
-      node.params = node.raws.tailwind_original_params as any
-    }
-
-    // 3. Remove the original import from the non-utility sheet
-    for (let node of importNodes.get(sheet)) {
-      node.remove()
-    }
-
-    // 3. Mark the utility sheet for removal
-    utilitySheets.delete(sheet)
-  }
-
-  stylesheets.push(...utilitySheets.values())
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/fixtures/test.css b/packages/@tailwindcss-upgrade/src/codemods/fixtures/test.css
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/fixtures/test.css
rename to packages/@tailwindcss-upgrade/src/codemods/fixtures/test.css
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/format-nodes.test.ts b/packages/@tailwindcss-upgrade/src/codemods/format-nodes.test.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/format-nodes.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/format-nodes.test.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/format-nodes.ts b/packages/@tailwindcss-upgrade/src/codemods/format-nodes.ts
similarity index 98%
rename from packages/@tailwindcss-upgrade/src/codemods/css/format-nodes.ts
rename to packages/@tailwindcss-upgrade/src/codemods/format-nodes.ts
index 489f2d349..a5c980505 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/format-nodes.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/format-nodes.ts
@@ -1,6 +1,6 @@
 import postcss, { type ChildNode, type Plugin, type Root } from 'postcss'
 import { format, type Options } from 'prettier'
-import { walk } from '../../utils/walk'
+import { walk } from '../utils/walk'
 
 const FORMAT_OPTIONS: Options = {
   parser: 'css',
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-apply.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-apply.test.ts
similarity index 53%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-apply.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-at-apply.test.ts
index 9f6a92008..362f52054 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-apply.test.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-apply.test.ts
@@ -1,11 +1,9 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import dedent from 'dedent'
 import postcss from 'postcss'
-import { expect, it, vi } from 'vitest'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import * as versions from '../../utils/version'
+import { expect, it } from 'vitest'
+import type { Config } from '../../../tailwindcss/src/compat/plugin-api'
 import { migrateAtApply } from './migrate-at-apply'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
 
 const css = dedent
 
@@ -13,11 +11,6 @@ async function migrate(input: string, config: Config = {}) {
   let designSystem = await __unstable__loadDesignSystem(
     css`
       @import 'tailwindcss';
-
-      /* TODO(perf): Only here to speed up the tests */
-      @theme {
-        --*: initial;
-      }
     `,
     { base: __dirname },
   )
@@ -61,6 +54,21 @@ it('should append `!` to each utility, when using `!important`', async () => {
   `)
 })
 
+// TODO: Handle SCSS syntax
+it.skip('should append `!` to each utility, when using `#{!important}`', async () => {
+  expect(
+    await migrate(css`
+      .foo {
+        @apply flex flex-col #{!important};
+      }
+    `),
+  ).toMatchInlineSnapshot(`
+    ".foo {
+      @apply flex! flex-col!;
+    }"
+  `)
+})
+
 it('should move the legacy `!` prefix, to the new `!` postfix notation', async () => {
   expect(
     await migrate(css`
@@ -75,44 +83,35 @@ it('should move the legacy `!` prefix, to the new `!` postfix notation', async (
   `)
 })
 
-it(
-  'should apply all candidate migration when migrating with a config',
-  { timeout: 10_000 },
-  async () => {
-    async function migrateWithPrefix(input: string) {
-      return postcss()
-        .use(
-          migrateAtApply({
-            designSystem: await __unstable__loadDesignSystem(
-              css`
-                @import 'tailwindcss' prefix(tw);
+it('should apply all candidate migration when migrating with a config', async () => {
+  async function migrateWithPrefix(input: string) {
+    return postcss()
+      .use(
+        migrateAtApply({
+          designSystem: await __unstable__loadDesignSystem(
+            css`
+              @import 'tailwindcss' prefix(tw);
+            `,
+            { base: __dirname },
+          ),
+          userConfig: {
+            prefix: 'tw_',
+          },
+        }),
+      )
+      .process(input, { from: expect.getState().testPath })
+      .then((result) => result.css)
+  }
 
-                /* TODO(perf): Only here to speed up the tests */
-                @theme {
-                  --*: initial;
-                }
-              `,
-              { base: __dirname },
-            ),
-            userConfig: {
-              prefix: 'tw_',
-            },
-          }),
-        )
-        .process(input, { from: expect.getState().testPath })
-        .then((result) => result.css)
-    }
-
-    expect(
-      await migrateWithPrefix(css`
-        .foo {
-          @apply !tw_flex [color:--my-color] tw_bg-gradient-to-t;
-        }
-      `),
-    ).toMatchInlineSnapshot(`
+  expect(
+    await migrateWithPrefix(css`
+      .foo {
+        @apply !tw_flex [color:--my-color] tw_bg-gradient-to-t;
+      }
+    `),
+  ).toMatchInlineSnapshot(`
     ".foo {
-      @apply tw:flex! tw:text-(--my-color) tw:bg-linear-to-t;
+      @apply tw:flex! tw:[color:var(--my-color)] tw:bg-linear-to-t;
     }"
   `)
-  },
-)
+})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-apply.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-apply.ts
similarity index 83%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-apply.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-at-apply.ts
index 69f92688d..0d3a1f035 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-apply.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-apply.ts
@@ -1,15 +1,15 @@
 import type { AtRule, Plugin } from 'postcss'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { segment } from '../../../../tailwindcss/src/utils/segment'
+import type { Config } from '../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import { segment } from '../../../tailwindcss/src/utils/segment'
 import { migrateCandidate } from '../template/migrate'
 
 export function migrateAtApply({
   designSystem,
   userConfig,
 }: {
-  designSystem: DesignSystem | null
-  userConfig: Config | null
+  designSystem: DesignSystem
+  userConfig: Config
 }): Plugin {
   function migrate(atRule: AtRule) {
     let utilities = atRule.params.split(/(\s+)/)
@@ -35,8 +35,6 @@ export function migrateAtApply({
     })
 
     return async () => {
-      if (!designSystem) return
-
       // If we have a valid designSystem and config setup, we can run all
       // candidate migrations on each utility
       params = await Promise.all(
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-layer-utilities.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.test.ts
similarity index 88%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-layer-utilities.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.test.ts
index e115951d3..17aeb8577 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-layer-utilities.test.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.test.ts
@@ -1,12 +1,10 @@
 import dedent from 'dedent'
 import postcss from 'postcss'
-import { describe, expect, it, vi } from 'vitest'
-import { Stylesheet } from '../../stylesheet'
-import * as versions from '../../utils/version'
+import { describe, expect, it } from 'vitest'
+import { Stylesheet } from '../stylesheet'
 import { formatNodes } from './format-nodes'
 import { migrateAtLayerUtilities } from './migrate-at-layer-utilities'
 import { sortBuckets } from './sort-buckets'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
 
 const css = dedent
 
@@ -39,7 +37,7 @@ async function migrate(
     .use(sortBuckets())
     .use(formatNodes())
     .process(stylesheet.root!, { from: expect.getState().testPath })
-    .then((result) => `\n${result.css.trim()}\n`)
+    .then((result) => result.css)
 }
 
 it('should migrate simple `@layer utilities` to `@utility`', async () => {
@@ -52,11 +50,9 @@ it('should migrate simple `@layer utilities` to `@utility`', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       color: red;
-    }
-    "
+    }"
   `)
 })
 
@@ -71,15 +67,13 @@ it('should split multiple selectors in separate utilities', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       color: red;
     }
 
     @utility bar {
       color: red;
-    }
-    "
+    }"
   `)
 })
 
@@ -103,16 +97,14 @@ it('should merge `@utility` with the same name', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       color: red;
       font-weight: bold;
     }
 
     .bar {
       color: blue;
-    }
-    "
+    }"
   `)
 })
 
@@ -155,8 +147,7 @@ it('should leave non-class utilities alone', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       /* 2. */
       /* 2.1. */
       color: red;
@@ -189,58 +180,7 @@ it('should leave non-class utilities alone', async () => {
           font-weight: bold;
         }
       }
-    }
-    "
-  `)
-})
-
-it('should not convert empty classes into `@utility` since that would make them invalid', async () => {
-  expect(
-    await migrate(css`
-      @layer utilities {
-        .good {
-          color: red;
-        }
-
-        .bad-empty {
-        }
-
-        /* Comment above */
-        .bad-with-comment-above {
-        }
-
-        .bad-with-comment-inside {
-          /* Comment inside */
-        }
-
-        .bad-with-comment-below {
-        }
-        /* Comment below */
-      }
-    `),
-  ).toMatchInlineSnapshot(`
-    "
-    @utility good {
-      color: red;
-    }
-
-    @layer utilities {
-      .bad-empty {
-      }
-
-      /* Comment above */
-      .bad-with-comment-above {
-      }
-
-      .bad-with-comment-inside {
-        /* Comment inside */
-      }
-
-      .bad-with-comment-below {
-      }
-      /* Comment below */
-    }
-    "
+    }"
   `)
 })
 
@@ -262,8 +202,7 @@ it('should migrate simple `@layer utilities` with nesting to `@utility`', async
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       color: red;
 
       &:hover {
@@ -273,8 +212,7 @@ it('should migrate simple `@layer utilities` with nesting to `@utility`', async
       &:focus {
         color: green;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -292,15 +230,13 @@ it('should migrate multiple simple `@layer utilities` to `@utility`', async () =
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       color: red;
     }
 
     @utility bar {
       color: blue;
-    }
-    "
+    }"
   `)
 })
 
@@ -322,8 +258,7 @@ it('should not migrate Rules inside of Rules to a `@utility`', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       color: red;
     }
 
@@ -333,8 +268,7 @@ it('should not migrate Rules inside of Rules to a `@utility`', async () => {
       .baz {
         color: green;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -350,13 +284,11 @@ it('should invert at-rules to make them migrate-able', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       @media (min-width: 640px) {
         color: red;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -380,8 +312,7 @@ it('should migrate at-rules with multiple utilities and invert them', async () =
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       @media (min-width: 640px) {
         color: red;
       }
@@ -391,8 +322,7 @@ it('should migrate at-rules with multiple utilities and invert them', async () =
       @media (min-width: 640px) {
         color: blue;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -424,8 +354,7 @@ it('should migrate deeply nested at-rules with multiple utilities and invert the
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       @media (min-width: 640px) {
         color: red;
       }
@@ -453,8 +382,7 @@ it('should migrate deeply nested at-rules with multiple utilities and invert the
           }
         }
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -468,13 +396,11 @@ it('should migrate classes with pseudo elements', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility no-scrollbar {
+    "@utility no-scrollbar {
       &::-webkit-scrollbar {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -488,13 +414,11 @@ it('should migrate classes with attribute selectors', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility no-scrollbar {
+    "@utility no-scrollbar {
       &[data-checked=''] {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -508,13 +432,11 @@ it('should migrate classes with element selectors', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility no-scrollbar {
+    "@utility no-scrollbar {
       & main {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -528,13 +450,11 @@ it('should migrate classes attached to an element selector', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility no-scrollbar {
+    "@utility no-scrollbar {
       &main {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -548,13 +468,11 @@ it('should migrate classes with id selectors', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility no-scrollbar {
+    "@utility no-scrollbar {
       &#main {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -568,8 +486,7 @@ it('should migrate classes with another attached class', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility no-scrollbar {
+    "@utility no-scrollbar {
       &.main {
         display: none;
       }
@@ -579,8 +496,7 @@ it('should migrate classes with another attached class', async () => {
       &.no-scrollbar {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -594,8 +510,7 @@ it('should migrate a selector with multiple classes to multiple @utility definit
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       & .bar:hover .baz:focus {
         display: none;
       }
@@ -611,8 +526,7 @@ it('should migrate a selector with multiple classes to multiple @utility definit
       .foo .bar:hover &:focus {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -632,8 +546,7 @@ it('should merge `@utility` definitions with the same name', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility step {
+    "@utility step {
       counter-increment: step;
 
       &:before {
@@ -641,8 +554,7 @@ it('should merge `@utility` definitions with the same name', async () => {
         @apply ml-[-41px];
         content: counter(step);
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -656,8 +568,7 @@ it('should not migrate nested classes inside a `:not(…)`', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       & .bar:not(.qux):has(.baz) {
         display: none;
       }
@@ -673,8 +584,7 @@ it('should not migrate nested classes inside a `:not(…)`', async () => {
       .foo .bar:not(.qux):has(&) {
         display: none;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -708,8 +618,7 @@ it('should migrate advanced combinations', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @utility foo {
+    "@utility foo {
       @media (width >= 100px) {
         @supports (display: none) {
           & .bar:not(.qux):has(.baz) {
@@ -748,8 +657,7 @@ it('should migrate advanced combinations', async () => {
           }
         }
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -767,15 +675,12 @@ describe('comments', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      /* Start of utilities: */
-
+      "/* Start of utilities: */
       @utility foo {
         /* Utility #1 */
         /* Declarations: */
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -792,9 +697,7 @@ describe('comments', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      /* Start of utilities: */
-
+      "/* Start of utilities: */
       @utility foo {
         /* Foo & Bar */
         & .bar {
@@ -802,15 +705,13 @@ describe('comments', () => {
           color: red;
         }
       }
-
       @utility bar {
         /* Foo & Bar */
         .foo & {
           /* Declarations: */
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -830,9 +731,7 @@ describe('comments', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      /* Start of utilities: */
-
+      "/* Start of utilities: */
       @utility foo {
         /* Mobile only */
         @media (width <= 640px) {
@@ -840,8 +739,7 @@ describe('comments', () => {
           /* Declarations: */
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -880,9 +778,7 @@ describe('comments', () => {
         /* After */
       `),
     ).toMatchInlineSnapshot(`
-      "
-      /* Tailwind Utilities: */
-
+      "/* Tailwind Utilities: */
       @utility no-scrollbar {
         /* Chrome, Safari and Opera */
         /* Second comment */
@@ -909,8 +805,7 @@ describe('comments', () => {
       .after {
         /* Inside */
       }
-      /* After */
-      "
+      /* After */"
     `)
   })
 })
@@ -935,8 +830,7 @@ it('should not lose attribute selectors', async () => {
       }
     `),
   ).toMatchInlineSnapshot(`
-    "
-    @layer components {
+    "@layer components {
       #TableOfContents {
         .toc a {
           @apply block max-w-full truncate py-1 pl-2 hover:font-medium hover:no-underline;
@@ -949,8 +843,7 @@ it('should not lose attribute selectors', async () => {
           }
         }
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -968,13 +861,11 @@ describe('layered stylesheets', () => {
         layers: ['utilities'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      @utility foo {
+      "@utility foo {
         /* Utility #1 */
         /* Declarations: */
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -991,13 +882,11 @@ describe('layered stylesheets', () => {
         layers: ['components'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      @utility foo {
+      "@utility foo {
         /* Utility #1 */
         /* Declarations: */
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -1014,13 +903,11 @@ describe('layered stylesheets', () => {
         layers: ['foo'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      /* Utility #1 */
+      "/* Utility #1 */
       .foo {
         /* Declarations: */
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -1040,8 +927,7 @@ describe('layered stylesheets', () => {
         layers: ['utilities'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      @utility foo {
+      "@utility foo {
         /* Utility #1 */
         /* Declarations: */
         color: red;
@@ -1049,8 +935,7 @@ describe('layered stylesheets', () => {
 
       #main {
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -1091,8 +976,7 @@ describe('layered stylesheets', () => {
         layers: ['utilities'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      @utility foo {
+      "@utility foo {
         @layer utilities {
           @layer utilities {
             /* Utility #1 */
@@ -1125,8 +1009,7 @@ describe('layered stylesheets', () => {
 
       #secondary {
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -1143,13 +1026,11 @@ describe('layered stylesheets', () => {
         layers: ['utilities'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      @import 'thing';
+      "@import 'thing';
 
       @utility foo {
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -1166,13 +1047,11 @@ describe('layered stylesheets', () => {
         layers: ['utilities'],
       }),
     ).toMatchInlineSnapshot(`
-      "
-      @charset "utf-8";
+      "@charset "utf-8";
 
       @utility foo {
         color: red;
-      }
-      "
+      }"
     `)
   })
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-layer-utilities.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.ts
similarity index 83%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-layer-utilities.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.ts
index 6bcb72d47..f0f11d3d6 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-at-layer-utilities.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-at-layer-utilities.ts
@@ -1,17 +1,11 @@
-import { type AtRule, type Comment, type Container, type Plugin, type Rule } from 'postcss'
+import { type AtRule, type Comment, type Plugin, type Rule } from 'postcss'
 import SelectorParser from 'postcss-selector-parser'
-import { segment } from '../../../../tailwindcss/src/utils/segment'
-import { Stylesheet } from '../../stylesheet'
-import * as version from '../../utils/version'
-import { walk, WalkAction, walkDepth } from '../../utils/walk'
+import { segment } from '../../../tailwindcss/src/utils/segment'
+import { Stylesheet } from '../stylesheet'
+import { walk, WalkAction, walkDepth } from '../utils/walk'
 
 export function migrateAtLayerUtilities(stylesheet: Stylesheet): Plugin {
   function migrate(atRule: AtRule) {
-    // Migrating `@layer utilities` to `@utility` is only supported in Tailwind
-    // CSS v3 projects. Tailwind CSS v4 projects could also have `@layer
-    // utilities` but those aren't actual utilities.
-    if (!version.isMajor(3)) return
-
     // Only migrate `@layer utilities` and `@layer components`.
     if (atRule.params !== 'utilities' && atRule.params !== 'components') return
 
@@ -43,7 +37,6 @@ export function migrateAtLayerUtilities(stylesheet: Stylesheet): Plugin {
 
     walk(atRule, (node) => {
       if (node.type !== 'rule') return
-      if (isEmpty(node)) return
 
       // Find all the classes in the selector
       SelectorParser((selectors) => {
@@ -185,18 +178,6 @@ export function migrateAtLayerUtilities(stylesheet: Stylesheet): Plugin {
                 toRemove.push(node.parent?.nodes.at(i) as Comment)
               }
             }
-
-            let commentsAfter: Comment[] = []
-            for (let i = idx + 1; i < (node.parent?.nodes.length ?? 0); i++) {
-              if (node.parent?.nodes.at(i)?.type === 'rule') {
-                commentsAfter = []
-                break
-              }
-              if (node.parent?.nodes.at(i)?.type === 'comment') {
-                commentsAfter.push(node.parent?.nodes.at(i) as Comment)
-              }
-            }
-            toRemove.push(...commentsAfter)
           }
           for (let node of toRemove) {
             node.remove()
@@ -244,12 +225,8 @@ export function migrateAtLayerUtilities(stylesheet: Stylesheet): Plugin {
           }
         }
 
-        // Remove empty rules from `@utility` clones and empty wrapper at-rules
-        // from the default `@layer` clone.
-        if (
-          (node.type === 'atrule' && node.nodes?.length === 0) ||
-          (clone !== defaultsAtRule && node.type === 'rule' && node.nodes?.length === 0)
-        ) {
+        // Remove empty rules
+        if ((node.type === 'rule' || node.type === 'atrule') && node.nodes?.length === 0) {
           node.remove()
         }
 
@@ -278,11 +255,6 @@ export function migrateAtLayerUtilities(stylesheet: Stylesheet): Plugin {
       // Remove empty clones entirely
       if (clone.nodes?.length === 0) {
         clones.splice(idx, 1)
-      } else if (clone === defaultsAtRule) {
-        let first = clone.nodes?.[0]
-        if (first) {
-          first.raws.before = first.raws.before?.replace(/\n\s*\n/g, '\n')
-        }
       }
     }
 
@@ -338,17 +310,3 @@ export function migrateAtLayerUtilities(stylesheet: Stylesheet): Plugin {
     },
   }
 }
-
-function isEmpty(node: Container): boolean {
-  // We have no body
-  if (node.nodes === undefined) return false
-
-  // We have a body, but no nodes
-  if (node.nodes.length === 0) return true
-
-  // We have nodes, but they are only comments which we consider empty
-  if (node.nodes.every((child) => child.type === 'comment')) return true
-
-  // Not empty
-  return false
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-config.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-config.ts
similarity index 90%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-config.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-config.ts
index 2004d0969..b54fec34c 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-config.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-config.ts
@@ -1,8 +1,8 @@
 import path from 'node:path'
 import postcss, { AtRule, type Plugin } from 'postcss'
-import { normalizePath } from '../../../../@tailwindcss-node/src/normalize-path'
-import type { Stylesheet } from '../../stylesheet'
-import type { JSConfigMigration } from '../config/migrate-js-config'
+import { normalizePath } from '../../../@tailwindcss-node/src/normalize-path'
+import type { JSConfigMigration } from '../migrate-js-config'
+import type { Stylesheet } from '../stylesheet'
 
 const ALREADY_INJECTED = new WeakMap<Stylesheet, string[]>()
 
@@ -11,11 +11,10 @@ export function migrateConfig(
   {
     configFilePath,
     jsConfigMigration,
-  }: { configFilePath: string | null; jsConfigMigration: JSConfigMigration | null },
+  }: { configFilePath: string; jsConfigMigration: JSConfigMigration },
 ): Plugin {
   function migrate() {
     if (!sheet.isTailwindRoot) return
-    if (!configFilePath) return
 
     let alreadyInjected = ALREADY_INJECTED.get(sheet)
     if (alreadyInjected && alreadyInjected.includes(configFilePath)) {
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-import.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-import.test.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-import.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-import.test.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-import.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-import.ts
similarity index 85%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-import.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-import.ts
index 419f5aa32..cfdf00ee6 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-import.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-import.ts
@@ -1,9 +1,9 @@
 import fs from 'node:fs/promises'
 import { dirname, resolve } from 'node:path'
 import { type Plugin, type Root } from 'postcss'
-import { parseImportParams } from '../../../../tailwindcss/src/at-import'
-import { segment } from '../../../../tailwindcss/src/utils/segment'
-import * as ValueParser from '../../../../tailwindcss/src/value-parser'
+import { parseImportParams } from '../../../tailwindcss/src/at-import'
+import { segment } from '../../../tailwindcss/src/utils/segment'
+import * as ValueParser from '../../../tailwindcss/src/value-parser'
 
 export function migrateImport(): Plugin {
   async function migrate(root: Root) {
@@ -16,7 +16,6 @@ export function migrateImport(): Plugin {
         let [firstParam, ...rest] = segment(rule.params, ' ')
 
         let params = parseImportParams(ValueParser.parse(firstParam))
-        if (!params) return
 
         let isRelative = params.uri[0] === '.'
         let hasCssExtension = params.uri.endsWith('.css')
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-media-screen.test.ts
similarity index 97%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-media-screen.test.ts
index 18ce72e8b..f4afd15fa 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.test.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-media-screen.test.ts
@@ -2,7 +2,7 @@ import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import dedent from 'dedent'
 import postcss from 'postcss'
 import { expect, it } from 'vitest'
-import type { UserConfig } from '../../../../tailwindcss/src/compat/config/types'
+import type { UserConfig } from '../../../tailwindcss/src/compat/config/types'
 import { formatNodes } from './format-nodes'
 import { migrateMediaScreen } from './migrate-media-screen'
 import { sortBuckets } from './sort-buckets'
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-media-screen.ts
similarity index 66%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-media-screen.ts
index c10e9ee99..570a4670f 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-media-screen.ts
@@ -1,23 +1,21 @@
 import { type Plugin, type Root } from 'postcss'
-import { resolveConfig } from '../../../../tailwindcss/src/compat/config/resolve-config'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import { buildMediaQuery } from '../../../../tailwindcss/src/compat/screens-config'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
+import { resolveConfig } from '../../../tailwindcss/src/compat/config/resolve-config'
+import type { Config } from '../../../tailwindcss/src/compat/plugin-api'
+import { buildMediaQuery } from '../../../tailwindcss/src/compat/screens-config'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import { DefaultMap } from '../../../tailwindcss/src/utils/default-map'
 
 export function migrateMediaScreen({
   designSystem,
   userConfig,
 }: {
-  designSystem?: DesignSystem | null
-  userConfig?: Config | null
+  designSystem?: DesignSystem
+  userConfig?: Config
 } = {}): Plugin {
   function migrate(root: Root) {
     if (!designSystem || !userConfig) return
 
-    let { resolvedConfig } = resolveConfig(designSystem, [
-      { base: '', config: userConfig, reference: false, src: undefined },
-    ])
+    let { resolvedConfig } = resolveConfig(designSystem, [{ base: '', config: userConfig }])
     let screens = resolvedConfig?.theme?.screens || {}
 
     let mediaQueries = new DefaultMap<string, string | null>((name) => {
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-missing-layers.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-missing-layers.test.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-missing-layers.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-missing-layers.test.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-missing-layers.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-missing-layers.ts
similarity index 98%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-missing-layers.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-missing-layers.ts
index 10c9d55de..268058cbc 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-missing-layers.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-missing-layers.ts
@@ -1,5 +1,5 @@
 import { AtRule, type ChildNode, type Plugin, type Root } from 'postcss'
-import { segment } from '../../../../tailwindcss/src/utils/segment'
+import { segment } from '../../../tailwindcss/src/utils/segment'
 
 export function migrateMissingLayers(): Plugin {
   function migrate(root: Root) {
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-preflight.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-preflight.test.ts
similarity index 89%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-preflight.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-preflight.test.ts
index 2d8b70041..f9819f35a 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-preflight.test.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-preflight.test.ts
@@ -1,12 +1,10 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import dedent from 'dedent'
 import postcss from 'postcss'
-import { expect, it, vi } from 'vitest'
-import * as versions from '../../utils/version'
+import { expect, it } from 'vitest'
 import { formatNodes } from './format-nodes'
 import { migratePreflight } from './migrate-preflight'
 import { sortBuckets } from './sort-buckets'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
 
 const css = dedent
 
@@ -35,7 +33,7 @@ it("should add compatibility CSS after the `@import 'tailwindcss'`", async () =>
     "@import 'tailwindcss';
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -48,7 +46,7 @@ it("should add compatibility CSS after the `@import 'tailwindcss'`", async () =>
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }"
   `)
@@ -67,7 +65,7 @@ it('should add the compatibility CSS after the last `@import`', async () => {
     @import './bar.css';
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -80,7 +78,7 @@ it('should add the compatibility CSS after the last `@import`', async () => {
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }"
   `)
@@ -113,7 +111,7 @@ it('should add the compatibility CSS after the last import, even if a body-less
     @import './bar.css';
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -126,7 +124,7 @@ it('should add the compatibility CSS after the last import, even if a body-less
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }"
   `)
@@ -159,7 +157,7 @@ it('should add the compatibility CSS before the first `@layer base` (if the "tai
     }
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -172,7 +170,7 @@ it('should add the compatibility CSS before the first `@layer base` (if the "tai
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }
 
@@ -217,7 +215,7 @@ it('should add the compatibility CSS before the first `@layer base` (if the "tai
     }
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -230,7 +228,7 @@ it('should add the compatibility CSS before the first `@layer base` (if the "tai
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }
 
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-preflight.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-preflight.ts
similarity index 81%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-preflight.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-preflight.ts
index d32d96979..8677d6af6 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-preflight.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-preflight.ts
@@ -1,20 +1,18 @@
 import dedent from 'dedent'
 import postcss, { type Plugin, type Root } from 'postcss'
-import { keyPathToCssProperty } from '../../../../tailwindcss/src/compat/apply-config-to-theme'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { toKeyPath } from '../../../../tailwindcss/src/utils/to-key-path'
-import * as ValueParser from '../../../../tailwindcss/src/value-parser'
-import { walk, WalkAction } from '../../../../tailwindcss/src/walk'
-import * as version from '../../utils/version'
+import { keyPathToCssProperty } from '../../../tailwindcss/src/compat/apply-config-to-theme'
+import type { Config } from '../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import { toKeyPath } from '../../../tailwindcss/src/utils/to-key-path'
+import * as ValueParser from '../../../tailwindcss/src/value-parser'
 
 // Defaults in v4
-const DEFAULT_BORDER_COLOR = 'currentcolor'
+const DEFAULT_BORDER_COLOR = 'currentColor'
 
 const css = dedent
 const BORDER_COLOR_COMPATIBILITY_CSS = css`
   /*
-    The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+    The default border color has changed to \`currentColor\` in Tailwind CSS v4,
     so we've added these compatibility styles to make sure everything still
     looks the same as it did with Tailwind CSS v3.
 
@@ -36,23 +34,18 @@ export function migratePreflight({
   designSystem,
   userConfig,
 }: {
-  designSystem: DesignSystem | null
-  userConfig?: Config | null
+  designSystem: DesignSystem
+  userConfig?: Config
 }): Plugin {
   // @ts-expect-error
   let defaultBorderColor = userConfig?.theme?.borderColor?.DEFAULT
 
   function canResolveThemeValue(path: string) {
-    if (!designSystem) return false
     let variable = `--${keyPathToCssProperty(toKeyPath(path))}` as const
     return Boolean(designSystem.theme.get([variable]))
   }
 
   function migrate(root: Root) {
-    // CSS for backwards compatibility with v3 should only injected in v3
-    // projects and not v4 projects.
-    if (!version.isMajor(3)) return
-
     let isTailwindRoot = false
     root.walkAtRules('import', (node) => {
       if (
@@ -85,7 +78,7 @@ export function migratePreflight({
             return defaultBorderColor
           } else {
             if (path === 'borderColor.DEFAULT') {
-              return 'var(--color-gray-200, currentcolor)'
+              return 'var(--color-gray-200, currentColor)'
             }
           }
           return null
@@ -118,7 +111,7 @@ function substituteFunctionsInValue(
   ast: ValueParser.ValueAstNode[],
   handle: (value: string, fallback?: string) => string | null,
 ) {
-  walk(ast, (node) => {
+  ValueParser.walk(ast, (node, { replaceWith }) => {
     if (node.kind === 'function' && node.value === 'theme') {
       if (node.nodes.length < 1) return
 
@@ -156,7 +149,7 @@ function substituteFunctionsInValue(
         fallbackValues.length > 0 ? handle(path, ValueParser.toCss(fallbackValues)) : handle(path)
       if (replacement === null) return
 
-      return WalkAction.Replace(ValueParser.parse(replacement))
+      replaceWith(ValueParser.parse(replacement))
     }
   })
 
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-tailwind-directives.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-tailwind-directives.test.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-tailwind-directives.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-tailwind-directives.test.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-tailwind-directives.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-tailwind-directives.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-tailwind-directives.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-tailwind-directives.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-theme-to-var.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-theme-to-var.test.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-theme-to-var.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-theme-to-var.test.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-theme-to-var.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-theme-to-var.ts
similarity index 80%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-theme-to-var.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-theme-to-var.ts
index 8285def1e..558e6d0cb 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-theme-to-var.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/migrate-theme-to-var.ts
@@ -1,11 +1,11 @@
 import { type Plugin } from 'postcss'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { Convert, createConverter } from '../template/migrate-theme-to-var'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import { Convert, createConverter } from '../template/codemods/theme-to-var'
 
 export function migrateThemeToVar({
   designSystem,
 }: {
-  designSystem?: DesignSystem | null
+  designSystem?: DesignSystem
 } = {}): Plugin {
   return {
     postcssPlugin: '@tailwindcss/upgrade/migrate-theme-to-var',
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-variants-directive.test.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-variants-directive.test.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-variants-directive.test.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-variants-directive.test.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/migrate-variants-directive.ts b/packages/@tailwindcss-upgrade/src/codemods/migrate-variants-directive.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/codemods/css/migrate-variants-directive.ts
rename to packages/@tailwindcss-upgrade/src/codemods/migrate-variants-directive.ts
diff --git a/packages/@tailwindcss-upgrade/src/codemods/css/sort-buckets.ts b/packages/@tailwindcss-upgrade/src/codemods/sort-buckets.ts
similarity index 97%
rename from packages/@tailwindcss-upgrade/src/codemods/css/sort-buckets.ts
rename to packages/@tailwindcss-upgrade/src/codemods/sort-buckets.ts
index 22b0581dd..f76a94249 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/css/sort-buckets.ts
+++ b/packages/@tailwindcss-upgrade/src/codemods/sort-buckets.ts
@@ -1,6 +1,6 @@
 import postcss, { type AtRule, type ChildNode, type Comment, type Plugin, type Root } from 'postcss'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import { walk, WalkAction } from '../../utils/walk'
+import { DefaultMap } from '../../../tailwindcss/src/utils/default-map'
+import { walk, WalkAction } from '../utils/walk'
 
 const BUCKET_ORDER = [
   // Imports
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/candidates.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/candidates.test.ts
deleted file mode 100644
index 2e4d150aa..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/candidates.test.ts
+++ /dev/null
@@ -1,84 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test } from 'vitest'
-import { spliceChangesIntoString } from '../../utils/splice-changes-into-string'
-import { extractRawCandidates } from './candidates'
-
-let html = String.raw
-
-test('extracts candidates with positions from a template', async () => {
-  let content = html`
-    <div class="bg-blue-500 hover:focus:text-white [color:red]">
-      <button class="bg-blue-500 text-white">My button</button>
-    </div>
-  `
-  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
-    base: __dirname,
-  })
-
-  let candidates = await extractRawCandidates(content, 'html')
-  let validCandidates = candidates.filter(
-    ({ rawCandidate }) => designSystem.parseCandidate(rawCandidate).length > 0,
-  )
-
-  expect(validCandidates).toMatchInlineSnapshot(`
-    [
-      {
-        "end": 28,
-        "rawCandidate": "bg-blue-500",
-        "start": 17,
-      },
-      {
-        "end": 51,
-        "rawCandidate": "hover:focus:text-white",
-        "start": 29,
-      },
-      {
-        "end": 63,
-        "rawCandidate": "[color:red]",
-        "start": 52,
-      },
-      {
-        "end": 98,
-        "rawCandidate": "bg-blue-500",
-        "start": 87,
-      },
-      {
-        "end": 109,
-        "rawCandidate": "text-white",
-        "start": 99,
-      },
-    ]
-  `)
-})
-
-test('replaces the right positions for a candidate', async () => {
-  let content = html`
-    <h1>🤠👋</h1>
-    <div class="bg-blue-500" />
-  `
-
-  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
-    base: __dirname,
-  })
-
-  let candidates = await extractRawCandidates(content, 'html')
-
-  let candidate = candidates.find(
-    ({ rawCandidate }) => designSystem.parseCandidate(rawCandidate).length > 0,
-  )!
-
-  let migrated = spliceChangesIntoString(content, [
-    {
-      start: candidate.start,
-      end: candidate.end,
-      replacement: 'flex',
-    },
-  ])
-
-  expect(migrated).toMatchInlineSnapshot(`
-    "
-        <h1>🤠👋</h1>
-        <div class="flex" />
-      "
-  `)
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/candidates.ts b/packages/@tailwindcss-upgrade/src/codemods/template/candidates.ts
deleted file mode 100644
index 88b1e4e03..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/candidates.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Scanner } from '@tailwindcss/oxide'
-import { cloneCandidate, type Candidate } from '../../../../tailwindcss/src/candidate'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-
-export async function extractRawCandidates(
-  content: string,
-  extension: string = 'html',
-): Promise<{ rawCandidate: string; start: number; end: number }[]> {
-  let scanner = new Scanner({})
-  let result = scanner.getCandidatesWithPositions({ content, extension })
-
-  let candidates: { rawCandidate: string; start: number; end: number }[] = []
-  for (let { candidate: rawCandidate, position: start } of result) {
-    candidates.push({ rawCandidate, start, end: start + rawCandidate.length })
-  }
-  return candidates
-}
-
-// Create a basic stripped candidate without variants or important flag
-export function baseCandidate<T extends Candidate>(candidate: T) {
-  let base = cloneCandidate(candidate)
-
-  base.important = false
-  base.variants = []
-
-  return base
-}
-
-export function parseCandidate(designSystem: DesignSystem, input: string) {
-  return designSystem.parseCandidate(
-    designSystem.theme.prefix && !input.startsWith(`${designSystem.theme.prefix}:`)
-      ? `${designSystem.theme.prefix}:${input}`
-      : input,
-  )
-}
-
-export function printUnprefixedCandidate(designSystem: DesignSystem, candidate: Candidate) {
-  let candidateString = designSystem.printCandidate(candidate)
-
-  return designSystem.theme.prefix && candidateString.startsWith(`${designSystem.theme.prefix}:`)
-    ? candidateString.slice(designSystem.theme.prefix.length + 1)
-    : candidateString
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/is-safe-migration.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/is-safe-migration.test.ts
deleted file mode 100644
index 7cfb16c75..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/is-safe-migration.test.ts
+++ /dev/null
@@ -1,154 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { describe, expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateCandidate } from './migrate'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
-
-const css = String.raw
-
-describe('is-safe-migration', async () => {
-  let designSystem = await __unstable__loadDesignSystem(
-    css`
-      @import 'tailwindcss';
-
-      /* TODO(perf): Only here to speed up the tests */
-      @theme {
-        --*: initial;
-        --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-        --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-      }
-    `,
-    { base: __dirname },
-  )
-
-  test.each([
-    [`let notBorder = !border    \n`, '!border'],
-    [`{ "foo": !border.something + ""}\n`, '!border'],
-    [`<div v-if="something && !border"></div>\n`, '!border'],
-    [`<div v-else-if="something && !border"></div>\n`, '!border'],
-    [`<div v-show="something && !border"></div>\n`, '!border'],
-    [`<div v-if="!border || !border"></div>\n`, '!border'],
-    [`<div v-else-if="!border || !border"></div>\n`, '!border'],
-    [`<div v-show="!border || !border"></div>\n`, '!border'],
-    [`<div v-if="!border"></div>\n`, '!border'],
-    [`<div v-else-if="!border"></div>\n`, '!border'],
-    [`<div v-show="!border"></div>\n`, '!border'],
-    [`<div x-if="!border"></div>\n`, '!border'],
-
-    [`let notShadow = shadow    \n`, 'shadow'],
-    [`{ "foo": shadow.something + ""}\n`, 'shadow'],
-    [`<div v-if="something && shadow"></div>\n`, 'shadow'],
-    [`<div v-else-if="something && shadow"></div>\n`, 'shadow'],
-    [`<div v-show="something && shadow"></div>\n`, 'shadow'],
-    [`<div v-if="shadow || shadow"></div>\n`, 'shadow'],
-    [`<div v-else-if="shadow || shadow"></div>\n`, 'shadow'],
-    [`<div v-show="shadow || shadow"></div>\n`, 'shadow'],
-    [`<div v-if="shadow"></div>\n`, 'shadow'],
-    [`<div v-else-if="shadow"></div>\n`, 'shadow'],
-    [`<div v-show="shadow"></div>\n`, 'shadow'],
-    [`<div x-if="shadow"></div>\n`, 'shadow'],
-    [`<div style={{filter: 'drop-shadow(30px 10px 4px #4444dd)'}}/>\n`, 'shadow'],
-    [`<div style="flex-grow: 1"></div>\n`, 'flex-grow'],
-    [`<div style='flex-shrink: 0'></div>\n`, 'flex-shrink'],
-    [`<div style="  flex-shrink: 0"></div>\n`, 'flex-shrink'],
-    [`<div style="\nflex-shrink: 0\n"></div>\n`, 'flex-shrink'],
-
-    // Next.js Image placeholder cases
-    [`<Image placeholder="blur" src="/image.jpg" />`, 'blur'],
-    [`<Image placeholder={'blur'} src="/image.jpg" />`, 'blur'],
-    [`<Image placeholder={blur} src="/image.jpg" />`, 'blur'],
-
-    // https://github.com/tailwindlabs/tailwindcss/issues/17974
-    ['<div v-if="!duration">', '!duration'],
-    ['<div :active="!duration">', '!duration'],
-    ['<div :active="!visible">', '!visible'],
-
-    // Alpine/Livewire wire:…
-    ['<x-input.number required="foo" wire:model.blur="coins" />', 'blur'],
-
-    // Vue 3 events
-    [`emit('blur', props.modelValue)\n`, 'blur'],
-    [`$emit('blur', props.modelValue)\n`, 'blur'],
-
-    // JavaScript / TypeScript
-    [`document.addEventListener('blur',handleBlur)`, 'blur'],
-    [`document.addEventListener('blur', handleBlur)`, 'blur'],
-
-    [`function foo({ outline = true })`, 'outline'],
-    [`function foo({ before = false, outline = true })`, 'outline'],
-    [`function foo({before=false,outline=true })`, 'outline'],
-    [`function foo({outline=true })`, 'outline'],
-    // https://github.com/tailwindlabs/tailwindcss/issues/18675
-    [
-      // With default value
-      `function foo({ size = "1.25rem", digit, outline = true, textClass = "", className = "" })`,
-      'outline',
-    ],
-    [
-      // Without default value
-      `function foo({ size = "1.25rem", digit, outline, textClass = "", className = "" })`,
-      'outline',
-    ],
-    [
-      // As the last argument
-      `function foo({ size = "1.25rem", digit, outline })`,
-      'outline',
-    ],
-    [
-      // As the last argument, but there is technically another `"` on the same line
-      `function foo({ size = "1.25rem", digit, outline }): { return "foo" }`,
-      'outline',
-    ],
-    [
-      // Tricky quote balancing
-      `function foo({ before = "'", outline, after = "'" }): { return "foo" }`,
-      'outline',
-    ],
-
-    [`function foo(blur, foo)`, 'blur'],
-    [`function foo(blur,foo)`, 'blur'],
-
-    // shadcn/ui variants
-    [`<Button variant="outline" />`, 'outline'],
-    [`<Button variant='outline' />`, 'outline'],
-    [`<Button variant={"outline"} />`, 'outline'],
-    [`<Button variant={'outline'} />`, 'outline'],
-    [`function Button({ variant = "outline" }) {}`, 'outline'],
-    [`function Button({ variant = 'outline' }) {}`, 'outline'],
-    [`function Button({ variant="outline" }) {}`, 'outline'],
-    [`function Button({ variant='outline' }) {}`, 'outline'],
-    [`Button({ variant: "outline" })`, 'outline'],
-    [`Button({ variant: 'outline' })`, 'outline'],
-  ])('does not replace classes in invalid positions #%#', async (example, candidate) => {
-    expect(
-      await migrateCandidate(designSystem, {}, candidate, {
-        contents: example,
-        start: example.indexOf(candidate),
-        end: example.indexOf(candidate) + candidate.length,
-      }),
-    ).toEqual(candidate)
-  })
-
-  test.each([
-    // Vue classes
-    [`<div class="shadow"></div>`, 'shadow', 'shadow-sm'],
-    [`<div :class="{ shadow: true }"></div>`, 'shadow', 'shadow-sm'],
-    [`<div enter-class="shadow"></div>`, 'shadow', 'shadow-sm'],
-    [`<div :enter-class="{ shadow: true }"></div>`, 'shadow', 'shadow-sm'],
-
-    // React classes
-    [`<div className="shadow"></div>`, 'shadow', 'shadow-sm'],
-    [`<div enterClassName="shadow"></div>`, 'shadow', 'shadow-sm'],
-
-    // Preact-style
-    [`<div enterClass="shadow"></div>`, 'shadow', 'shadow-sm'],
-  ])('replaces classes in valid positions #%#', async (example, candidate, expected) => {
-    expect(
-      await migrateCandidate(designSystem, {}, candidate, {
-        contents: example,
-        start: example.indexOf(candidate),
-        end: example.indexOf(candidate) + candidate.length,
-      }),
-    ).toEqual(expected)
-  })
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/is-safe-migration.ts b/packages/@tailwindcss-upgrade/src/codemods/template/is-safe-migration.ts
deleted file mode 100644
index 2c09f299f..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/is-safe-migration.ts
+++ /dev/null
@@ -1,367 +0,0 @@
-import { parseCandidate } from '../../../../tailwindcss/src/candidate'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import * as version from '../../utils/version'
-
-const LOGICAL_OPERATORS = ['&&', '||', '?', '===', '==', '!=', '!==', '>', '>=', '<', '<=']
-const CONDITIONAL_TEMPLATE_SYNTAX = [
-  // Skip any generic attributes like `xxx="shadow"`,
-  // including Vue conditions like `v-if="something && shadow"`
-  // and Alpine conditions like `x-if="shadow"`,
-  // but allow Vue and React classes
-  /(?<!:?class|className)=['"]$/i,
-
-  // JavaScript / TypeScript
-  /addEventListener\(['"`]$/,
-
-  // Alpine
-  /wire:[^\s]*?$/,
-
-  // shadcn/ui variants
-  /variant\s*[:=]\s*\{?['"`]$/,
-]
-const NEXT_PLACEHOLDER_PROP = /placeholder=\{?['"`]$/
-const VUE_3_EMIT = /\b\$?emit\(['"`]$/
-
-export function isSafeMigration(
-  rawCandidate: string,
-  location: { contents: string; start: number; end: number },
-  designSystem: DesignSystem,
-): boolean {
-  // Ensure we are not migrating a candidate in a `<style>` block. The heuristic
-  // would be if the candidate is preceded by a whitespace and followed by a
-  // colon and whitespace.
-  //
-  // E.g.:
-  // ```vue
-  // <template>
-  //   <div class="foo"></div>
-  // </template>
-  //
-  //
-  // <style>
-  // .foo {
-  //   flex-shrink: 0;
-  //  ^           ^^
-  // }
-  // </style>
-  // ```
-  if (
-    // Whitespace before the candidate
-    location.contents[location.start - 1]?.match(/\s/) &&
-    // A colon followed by whitespace after the candidate
-    location.contents.slice(location.end, location.end + 2)?.match(/^:\s/)
-  ) {
-    // Compute all `<style>` ranges once and cache it for the current files
-    let ranges = styleBlockRanges.get(location.contents)
-
-    for (let i = 0; i < ranges.length; i += 2) {
-      let start = ranges[i]
-      let end = ranges[i + 1]
-
-      // Check if the candidate is inside a `<style>` block
-      if (location.start >= start && location.end <= end) {
-        return false
-      }
-    }
-  }
-
-  let currentLineBeforeCandidate = ''
-  for (let i = location.start - 1; i >= 0; i--) {
-    let char = location.contents.at(i)!
-    if (char === '\n') {
-      break
-    }
-    currentLineBeforeCandidate = char + currentLineBeforeCandidate
-  }
-  let currentLineAfterCandidate = ''
-  for (let i = location.end; i < location.contents.length; i++) {
-    let char = location.contents.at(i)!
-    if (char === '\n') {
-      break
-    }
-    currentLineAfterCandidate += char
-  }
-
-  // Inline `style="..."` attributes can contain CSS property names that look
-  // like valid utility candidates, such as `flex-grow`.
-  {
-    let ranges = inlineStyleAttributeValueRanges.get(location.contents)
-
-    for (let i = 0; i < ranges.length; i += 2) {
-      let start = ranges[i]
-      let end = ranges[i + 1]
-
-      if (location.start >= start && location.end <= end) {
-        return false
-      }
-    }
-  }
-
-  let [candidate] = parseCandidate(rawCandidate, designSystem)
-
-  // If we can't parse the candidate, then it's not a candidate at all. However,
-  // we could be dealing with legacy classes like `tw__flex` in Tailwind CSS v3
-  // land, which also wouldn't parse.
-  //
-  // So let's only skip if we couldn't parse and we are not in Tailwind CSS v3.
-  //
-  if (!candidate && version.isGreaterThan(3)) {
-    return false
-  }
-
-  // Parsed a candidate successfully, verify if it's a valid candidate
-  else if (candidate) {
-    // When we have variants, we can assume that the candidate is safe to migrate
-    // because that requires colons.
-    //
-    // E.g.: `hover:focus:flex`
-    if (candidate.variants.length > 0) {
-      return true
-    }
-
-    // When we have an arbitrary property, the candidate has such a particular
-    // structure it's very likely to be safe.
-    //
-    // E.g.: `[color:red]`
-    if (candidate.kind === 'arbitrary') {
-      return true
-    }
-
-    // A static candidate is very likely safe if it contains a dash.
-    //
-    // E.g.: `items-center`
-    if (candidate.kind === 'static' && candidate.root.includes('-')) {
-      return true
-    }
-
-    // A functional candidate is very likely safe if it contains a value (which
-    // implies a `-`). Or if the root contains a dash.
-    //
-    // E.g.: `bg-red-500`, `bg-position-20`
-    if (
-      (candidate.kind === 'functional' && candidate.value !== null) ||
-      (candidate.kind === 'functional' && candidate.root.includes('-'))
-    ) {
-      return true
-    }
-
-    // If the candidate contains a modifier, it's very likely to be safe because
-    // it implies that it contains a `/`.
-    //
-    // E.g.: `text-sm/7`
-    if (candidate.kind === 'functional' && candidate.modifier) {
-      return true
-    }
-  }
-
-  // Heuristic: Require the candidate to be inside quotes
-  let isQuoteBeforeCandidate = isMiddleOfString(currentLineBeforeCandidate)
-  let isQuoteAfterCandidate = isMiddleOfString(currentLineAfterCandidate)
-  if (!isQuoteBeforeCandidate || !isQuoteAfterCandidate) {
-    return false
-  }
-
-  // Heuristic: Disallow object access immediately following the candidate
-  if (currentLineAfterCandidate[0] === '.') {
-    return false
-  }
-
-  // Heuristic: Disallow function call expressions immediately following the candidate
-  if (currentLineAfterCandidate.trim().startsWith('(')) {
-    return false
-  }
-
-  // Heuristic: Disallow logical operators preceding or following the candidate
-  for (let operator of LOGICAL_OPERATORS) {
-    if (
-      currentLineAfterCandidate.trim().startsWith(operator) ||
-      currentLineBeforeCandidate.trim().endsWith(operator)
-    ) {
-      return false
-    }
-  }
-
-  // Heuristic: Disallow conditional template syntax
-  for (let rule of CONDITIONAL_TEMPLATE_SYNTAX) {
-    if (rule.test(currentLineBeforeCandidate)) {
-      return false
-    }
-  }
-
-  // Heuristic: Disallow Next.js Image `placeholder` prop
-  if (NEXT_PLACEHOLDER_PROP.test(currentLineBeforeCandidate)) {
-    return false
-  }
-
-  // Heuristic: Disallow replacements inside `emit('…', …)`
-  if (VUE_3_EMIT.test(currentLineBeforeCandidate)) {
-    return false
-  }
-
-  return true
-}
-
-// Assumptions:
-// - All `<style` tags appear before the next `</style>` tag
-// - All `<style` tags are closed with `</style>`
-// - No nested `<style>` tags
-const styleBlockRanges = new DefaultMap((source: string) => {
-  let ranges: number[] = []
-  let offset = 0
-
-  while (true) {
-    let startTag = source.indexOf('<style', offset)
-    if (startTag === -1) return ranges
-
-    offset = startTag + 1
-
-    // Ensure the style looks like:
-    // - `<style>`   (closed)
-    // - `<style …>` (with attributes)
-    if (!source[startTag + 6].match(/[>\s]/)) continue
-
-    let endTag = source.indexOf('</style>', offset)
-    if (endTag === -1) return ranges
-    offset = endTag + 1
-
-    ranges.push(startTag, endTag)
-  }
-})
-
-const BACKSLASH = 0x5c
-const DOUBLE_QUOTE = 0x22
-const SINGLE_QUOTE = 0x27
-const BACKTICK = 0x60
-const TAB = 0x09
-const NEWLINE = 0x0a
-const FORM_FEED = 0x0c
-const CARRIAGE_RETURN = 0x0d
-const SPACE = 0x20
-const SLASH = 0x2f
-const EQUALS = 0x3d
-const GREATER_THAN = 0x3e
-
-function isMiddleOfString(line: string): boolean {
-  let currentQuote: number | null = null
-
-  for (let i = 0; i < line.length; i++) {
-    let char = line.charCodeAt(i)
-    switch (char) {
-      // Escaped character, skip the next character
-      case BACKSLASH:
-        i++
-        break
-
-      case SINGLE_QUOTE:
-      case DOUBLE_QUOTE:
-      case BACKTICK:
-        // Found matching quote, we are outside of a string
-        if (currentQuote === char) {
-          currentQuote = null
-        }
-
-        // Found a quote, we are inside a string
-        else if (currentQuote === null) {
-          currentQuote = char
-        }
-        break
-    }
-  }
-
-  return currentQuote !== null
-}
-
-const inlineStyleAttributeValueRanges = new DefaultMap((source: string) => {
-  let ranges: number[] = []
-  let offset = 0
-
-  while (true) {
-    let tagStart = source.indexOf('<', offset)
-    if (tagStart === -1) return ranges
-
-    let tagEnd = source.indexOf('>', tagStart + 1)
-    if (tagEnd === -1) return ranges
-
-    offset = tagEnd + 1
-
-    for (let i = tagStart + 1; i < tagEnd; i++) {
-      let char = source.charCodeAt(i)
-
-      if (
-        char === SPACE ||
-        char === TAB ||
-        char === NEWLINE ||
-        char === CARRIAGE_RETURN ||
-        char === FORM_FEED
-      ) {
-        continue
-      }
-
-      let start = i
-      while (i < tagEnd) {
-        let char = source.charCodeAt(i)
-        if (
-          char === SPACE ||
-          char === TAB ||
-          char === NEWLINE ||
-          char === CARRIAGE_RETURN ||
-          char === FORM_FEED ||
-          char === EQUALS ||
-          char === GREATER_THAN ||
-          char === SLASH
-        ) {
-          break
-        }
-
-        i++
-      }
-
-      let attribute = source.slice(start, i).toLowerCase()
-      if (attribute !== 'style' && attribute !== ':style') continue
-
-      while (i < tagEnd) {
-        let char = source.charCodeAt(i)
-        if (
-          char !== SPACE &&
-          char !== TAB &&
-          char !== NEWLINE &&
-          char !== CARRIAGE_RETURN &&
-          char !== FORM_FEED
-        ) {
-          break
-        }
-
-        i++
-      }
-
-      if (source[i] !== '=') continue
-
-      i++
-      while (i < tagEnd) {
-        let char = source.charCodeAt(i)
-        if (
-          char !== SPACE &&
-          char !== TAB &&
-          char !== NEWLINE &&
-          char !== CARRIAGE_RETURN &&
-          char !== FORM_FEED
-        ) {
-          break
-        }
-
-        i++
-      }
-
-      let quote = source[i]
-      if (quote !== '"' && quote !== "'") continue
-
-      let valueStart = i + 1
-      let valueEnd = source.indexOf(quote, valueStart)
-      if (valueEnd === -1 || valueEnd > tagEnd) break
-
-      ranges.push(valueStart, valueEnd)
-      i = valueEnd
-    }
-  }
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-arbitrary-variants.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-arbitrary-variants.ts
deleted file mode 100644
index 258ba1b33..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-arbitrary-variants.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-import { cloneCandidate } from '../../../../tailwindcss/src/candidate'
-import {
-  PRE_COMPUTED_VARIANTS_KEY,
-  prepareDesignSystemStorage,
-  VARIANT_SIGNATURE_KEY,
-} from '../../../../tailwindcss/src/canonicalize-candidates'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import type { Writable } from '../../../../tailwindcss/src/types'
-import { replaceObject } from '../../../../tailwindcss/src/utils/replace-object'
-import { walkVariants } from '../../utils/walk-variants'
-
-export function migrateArbitraryVariants(
-  baseDesignSystem: DesignSystem,
-  _userConfig: Config | null,
-  rawCandidate: string,
-): string {
-  let designSystem = prepareDesignSystemStorage(baseDesignSystem)
-  let signatures = designSystem.storage[VARIANT_SIGNATURE_KEY].get(null)
-  let variants = designSystem.storage[PRE_COMPUTED_VARIANTS_KEY].get(null)
-
-  for (let readonlyCandidate of designSystem.parseCandidate(rawCandidate)) {
-    // We are only interested in the variants
-    if (readonlyCandidate.variants.length <= 0) return rawCandidate
-
-    // The below logic makes use of mutation. Since candidates in the
-    // DesignSystem are cached, we can't mutate them directly.
-    let candidate = cloneCandidate(readonlyCandidate) as Writable<typeof readonlyCandidate>
-
-    for (let [variant] of walkVariants(candidate)) {
-      if (variant.kind === 'compound') continue
-
-      let targetString = designSystem.printVariant(variant)
-      let targetSignature = signatures.get(targetString)
-      if (typeof targetSignature !== 'string') continue
-
-      let foundVariants = variants.get(targetSignature)
-      if (foundVariants.length === 0) continue
-
-      // The variant is already in a canonical form, e.g.: `min-lg` and `lg`
-      // produce the same CSS, but both are valid so we keep them as-is.
-      if (foundVariants.includes(targetString)) continue
-
-      let foundVariant = foundVariants[0]
-      let parsedVariant = designSystem.parseVariant(foundVariant)
-      if (parsedVariant === null) continue
-
-      replaceObject(variant, parsedVariant)
-    }
-
-    return designSystem.printCandidate(candidate)
-  }
-
-  return rawCandidate
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-camelcase-in-named-value.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-camelcase-in-named-value.test.ts
deleted file mode 100644
index ed5be23c0..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-camelcase-in-named-value.test.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateCamelcaseInNamedValue } from './migrate-camelcase-in-named-value'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
-
-test.each([
-  ['text-superRed', 'text-super-red'],
-  ['text-red/superOpaque', 'text-red/super-opaque'],
-  ['text-superRed/superOpaque', 'text-super-red/super-opaque'],
-
-  // Should not migrate named values in modifiers
-  ['group-hover/superGroup:underline', 'group-hover/superGroup:underline'],
-
-  ['hover:text-superRed', 'hover:text-super-red'],
-  ['hover:text-red/superOpaque', 'hover:text-red/super-opaque'],
-  ['hover:text-superRed/superOpaque', 'hover:text-super-red/super-opaque'],
-])('%s => %s', async (candidate, result) => {
-  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
-    base: __dirname,
-  })
-
-  expect(migrateCamelcaseInNamedValue(designSystem, {}, candidate)).toEqual(result)
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-camelcase-in-named-value.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-camelcase-in-named-value.ts
deleted file mode 100644
index 9cfbc7de0..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-camelcase-in-named-value.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-import { cloneCandidate } from '../../../../tailwindcss/src/candidate'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import * as version from '../../utils/version'
-
-// Converts named values to use kebab-case. This is necessary because the
-// upgrade tool also renames the theme values to kebab-case, so `text-superRed`
-// will have its theme value renamed to `--color-super-red` and thus the utility
-// will be renamed to `text-super-red`.
-export function migrateCamelcaseInNamedValue(
-  designSystem: DesignSystem,
-  _userConfig: Config | null,
-  rawCandidate: string,
-): string {
-  if (!version.isMajor(3)) return rawCandidate
-
-  for (let candidate of designSystem.parseCandidate(rawCandidate)) {
-    if (candidate.kind !== 'functional') continue
-    let clone = cloneCandidate(candidate)
-    let didChange = false
-
-    if (
-      candidate.value &&
-      clone.value &&
-      candidate.value.kind === 'named' &&
-      clone.value.kind === 'named' &&
-      candidate.value.value.match(/[A-Z]/)
-    ) {
-      clone.value.value = camelToKebab(candidate.value.value)
-      didChange = true
-    }
-
-    if (
-      candidate.modifier &&
-      clone.modifier &&
-      candidate.modifier.kind === 'named' &&
-      clone.modifier.kind === 'named' &&
-      candidate.modifier.value.match(/[A-Z]/)
-    ) {
-      clone.modifier.value = camelToKebab(candidate.modifier.value)
-      didChange = true
-    }
-
-    if (didChange) {
-      return designSystem.printCandidate(clone)
-    }
-  }
-
-  return rawCandidate
-}
-
-function camelToKebab(str: string): string {
-  return str.replace(/([A-Z])/g, '-$1').toLowerCase()
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-canonicalize-candidate.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-canonicalize-candidate.test.ts
deleted file mode 100644
index 57fe80c22..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-canonicalize-candidate.test.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateCanonicalizeCandidate } from './migrate-canonicalize-candidate'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
-
-test.each([
-  // Normalize whitespace in arbitrary properties
-  ['[display:flex]', '[display:flex]'],
-  ['[display:_flex]', '[display:flex]'],
-  ['[display:flex_]', '[display:flex]'],
-  ['[display:_flex_]', '[display:flex]'],
-
-  // Normalize whitespace in `calc` expressions
-  ['w-[calc(100%-2rem)]', 'w-[calc(100%-2rem)]'],
-  ['w-[calc(100%_-_2rem)]', 'w-[calc(100%-2rem)]'],
-
-  // Normalize the important modifier
-  ['!flex', 'flex!'],
-  ['flex!', 'flex!'],
-])('%s => %s', async (candidate, result) => {
-  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
-    base: __dirname,
-  })
-
-  expect(migrateCanonicalizeCandidate(designSystem, {}, candidate)).toEqual(result)
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-canonicalize-candidate.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-canonicalize-candidate.ts
deleted file mode 100644
index 32d126467..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-canonicalize-candidate.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-
-// Canonicalize the value to its minimal form. This will normalize whitespace,
-// and print the important modifier `!` in the correct place.
-//
-// E.g.:
-//
-// ```
-// [display:_flex_] => [display:flex]
-// [display:_flex]  => [display:flex]
-// [display:flex_]  => [display:flex]
-// [display:flex]   => [display:flex]
-// ```
-//
-export function migrateCanonicalizeCandidate(
-  designSystem: DesignSystem,
-  _userConfig: Config | null,
-  rawCandidate: string,
-) {
-  for (let readonlyCandidate of designSystem.parseCandidate(rawCandidate)) {
-    let canonicalizedCandidate = designSystem.printCandidate(readonlyCandidate)
-    if (canonicalizedCandidate !== rawCandidate) {
-      return canonicalizedCandidate
-    }
-  }
-
-  return rawCandidate
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-classes.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-classes.test.ts
deleted file mode 100644
index 5b204386f..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-classes.test.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateLegacyClasses } from './migrate-legacy-classes'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
-
-test.each([
-  ['shadow', 'shadow-sm'],
-  ['shadow-sm', 'shadow-xs'],
-  ['shadow-xs', 'shadow-2xs'],
-
-  ['inset-shadow', 'inset-shadow-sm'],
-  ['inset-shadow-sm', 'inset-shadow-xs'],
-  ['inset-shadow-xs', 'inset-shadow-2xs'],
-
-  ['drop-shadow', 'drop-shadow-sm'],
-  ['drop-shadow-sm', 'drop-shadow-xs'],
-
-  ['rounded', 'rounded-sm'],
-  ['rounded-sm', 'rounded-xs'],
-
-  ['blur', 'blur-sm'],
-  ['blur-sm', 'blur-xs'],
-
-  ['backdrop-blur', 'backdrop-blur-sm'],
-  ['backdrop-blur-sm', 'backdrop-blur-xs'],
-
-  ['ring', 'ring-3'],
-
-  ['outline', 'outline-solid'],
-
-  ['blur!', 'blur-sm!'],
-  ['hover:blur', 'hover:blur-sm'],
-  ['hover:blur!', 'hover:blur-sm!'],
-
-  ['hover:blur-sm', 'hover:blur-xs'],
-  ['blur-sm!', 'blur-xs!'],
-  ['hover:blur-sm!', 'hover:blur-xs!'],
-])('%s => %s (%#)', async (candidate, result) => {
-  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
-    base: __dirname,
-  })
-
-  expect(await migrateLegacyClasses(designSystem, {}, candidate)).toEqual(result)
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.test.ts
deleted file mode 100644
index b1887ae0b..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.test.ts
+++ /dev/null
@@ -1,91 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test, vi } from 'vitest'
-import type { UserConfig } from '../../../../tailwindcss/src/compat/config/types'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import * as versions from '../../utils/version'
-import { migrateArbitraryVariants } from './migrate-arbitrary-variants'
-import { migrateEmptyArbitraryValues } from './migrate-handle-empty-arbitrary-values'
-import { migrateModernizeArbitraryValues } from './migrate-modernize-arbitrary-values'
-import { migratePrefix } from './migrate-prefix'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
-
-const css = String.raw
-
-function migrate(designSystem: DesignSystem, userConfig: UserConfig | null, rawCandidate: string) {
-  for (let migration of [
-    migrateEmptyArbitraryValues,
-    migratePrefix,
-    migrateModernizeArbitraryValues,
-    migrateArbitraryVariants,
-    (designSystem: DesignSystem, _: UserConfig | null, rawCandidate: string) => {
-      return designSystem.canonicalizeCandidates([rawCandidate]).pop() ?? rawCandidate
-    },
-  ]) {
-    rawCandidate = migration(designSystem, userConfig, rawCandidate)
-  }
-  return rawCandidate
-}
-
-test.each([
-  // Some extreme examples of what happens in the wild:
-  ['group-[]:flex', 'in-[.group]:flex'],
-  ['group-[]/name:flex', 'in-[.group\\/name]:flex'],
-
-  // Migrate `peer-[]` to a parsable `peer-[&]` instead:
-  ['peer-[]:flex', 'peer-[&]:flex'],
-  ['peer-[]/name:flex', 'peer-[&]/name:flex'],
-
-  // These shouldn't happen in the real world (because compound variants are
-  // new). But this could happen once we allow codemods to run in v4+ projects.
-  ['has-group-[]:flex', 'has-in-[.group]:flex'],
-  ['has-group-[]/name:flex', 'has-in-[.group\\/name]:flex'],
-  ['not-group-[]:flex', 'not-in-[.group]:flex'],
-  ['not-group-[]/name:flex', 'not-in-[.group\\/name]:flex'],
-])('%s => %s (%#)', async (candidate, result) => {
-  let designSystem = await __unstable__loadDesignSystem(
-    css`
-      @import 'tailwindcss';
-      @theme {
-        --*: initial;
-      }
-    `,
-    { base: __dirname },
-  )
-
-  expect(migrate(designSystem, {}, candidate)).toEqual(result)
-})
-
-test.each([
-  // Should not prefix classes in arbitrary values
-  ['[.foo_&]:tw-flex', 'tw:in-[.foo]:flex'],
-
-  // Should migrate `.group` classes
-  ['group-[]:tw-flex', 'tw:in-[.tw\\:group]:flex'],
-  ['group-[]/name:tw-flex', 'tw:in-[.tw\\:group\\/name]:flex'],
-
-  // Migrate `peer-[]` to a parsable `peer-[&]` instead:
-  ['peer-[]:tw-flex', 'tw:peer-[&]:flex'],
-  ['peer-[]/name:tw-flex', 'tw:peer-[&]/name:flex'],
-
-  // However, `.group` inside of an arbitrary variant should not be prefixed:
-  ['[.group_&]:tw-flex', 'tw:in-[.group]:flex'],
-
-  // These shouldn't happen in the real world (because compound variants are
-  // new). But this could happen once we allow codemods to run in v4+ projects.
-  ['has-group-[]:tw-flex', 'tw:has-in-[.tw\\:group]:flex'],
-  ['has-group-[]/name:tw-flex', 'tw:has-in-[.tw\\:group\\/name]:flex'],
-  ['not-group-[]:tw-flex', 'tw:not-in-[.tw\\:group]:flex'],
-  ['not-group-[]/name:tw-flex', 'tw:not-in-[.tw\\:group\\/name]:flex'],
-])('%s => %s (%#)', async (candidate, result) => {
-  let designSystem = await __unstable__loadDesignSystem(
-    css`
-      @import 'tailwindcss' prefix(tw);
-      @theme {
-        --*: initial;
-      }
-    `,
-    { base: __dirname },
-  )
-
-  expect(migrate(designSystem, { prefix: 'tw-' }, candidate)).toEqual(result)
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.ts
deleted file mode 100644
index 91718b323..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-import { cloneCandidate, parseCandidate } from '../../../../tailwindcss/src/candidate'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { replaceObject } from '../../../../tailwindcss/src/utils/replace-object'
-import { walkVariants } from '../../utils/walk-variants'
-
-export function migrateModernizeArbitraryValues(
-  designSystem: DesignSystem,
-  _userConfig: Config | null,
-  rawCandidate: string,
-): string {
-  for (let candidate of parseCandidate(rawCandidate, designSystem)) {
-    let clone = cloneCandidate(candidate)
-    let changed = false
-
-    for (let [variant] of walkVariants(clone)) {
-      // Forward modifier from the root to the compound variant
-      if (
-        variant.kind === 'compound' &&
-        (variant.root === 'has' || variant.root === 'not' || variant.root === 'in')
-      ) {
-        if (variant.modifier !== null) {
-          if ('modifier' in variant.variant) {
-            variant.variant.modifier = variant.modifier
-            variant.modifier = null
-          }
-        }
-      }
-
-      // Promote `group-[]:flex` to `in-[.group]:flex`
-      //                ^^ Yes, this is empty
-      // Promote `group-[]/name:flex` to `in-[.group\/name]:flex`
-      if (
-        variant.kind === 'compound' &&
-        variant.root === 'group' &&
-        variant.variant.kind === 'arbitrary' &&
-        variant.variant.selector === '&'
-      ) {
-        // `group-[]`
-        if (variant.modifier === null) {
-          changed = true
-          replaceObject(
-            variant,
-            designSystem.parseVariant(
-              designSystem.theme.prefix
-                ? `in-[.${designSystem.theme.prefix}\\:group]`
-                : 'in-[.group]',
-            ),
-          )
-        }
-
-        // `group-[]/name`
-        else if (variant.modifier.kind === 'named') {
-          changed = true
-          replaceObject(
-            variant,
-            designSystem.parseVariant(
-              designSystem.theme.prefix
-                ? `in-[.${designSystem.theme.prefix}\\:group\\/${variant.modifier.value}]`
-                : `in-[.group\\/${variant.modifier.value}]`,
-            ),
-          )
-        }
-        continue
-      }
-    }
-
-    return changed ? designSystem.printCandidate(clone) : rawCandidate
-  }
-
-  return rawCandidate
-}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate.test.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate.test.ts
deleted file mode 100644
index 24bb3d5ef..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate.test.ts
+++ /dev/null
@@ -1,129 +0,0 @@
-import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { describe, expect, test, vi } from 'vitest'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import * as versions from '../../utils/version'
-import { migrateCandidate as migrate } from './migrate'
-vi.spyOn(versions, 'isMajor').mockReturnValue(false)
-
-const designSystems = new DefaultMap((base: string) => {
-  return new DefaultMap((input: string) => {
-    return __unstable__loadDesignSystem(input, { base })
-  })
-})
-
-const css = String.raw
-
-describe.each([['default'], ['with-variant'], ['important'], ['prefix']])('%s', (strategy) => {
-  let testName = '%s => %s (%#)'
-  if (strategy === 'with-variant') {
-    testName = testName.replaceAll('%s', 'focus:%s')
-  } else if (strategy === 'important') {
-    testName = testName.replaceAll('%s', '%s!')
-  } else if (strategy === 'prefix') {
-    testName = testName.replaceAll('%s', 'tw:%s')
-  }
-
-  // Basic input with minimal design system to keep the tests fast
-  let input = css`
-    @import 'tailwindcss' ${strategy === 'prefix' ? 'prefix(tw)' : ''};
-    @theme {
-      --*: initial;
-      --spacing: 0.25rem;
-      --color-red-500: red;
-
-      /* Equivalent of blue-500/50 */
-      --color-primary: color-mix(in oklab, oklch(62.3% 0.214 259.815) 50%, transparent);
-    }
-  `
-
-  test.each([
-    // Arbitrary property to named functional utility
-    ['[color:red]', 'text-red-500'],
-
-    // Promote data types to more specific utility if it exists
-    ['bg-(position:--my-value)', 'bg-position-(--my-value)'],
-
-    // Promote inferred data type to more specific utility if it exists
-    ['bg-[123px]', 'bg-position-[123px]'],
-
-    // Do not migrate bare values or arbitrary values to named values that are
-    // deprecated
-    ['order-[0]', 'order-0'],
-    ['order-0', 'order-0'],
-
-    // Migrate deprecated named values to bare values
-    ['order-none', 'order-0'],
-
-    // `-0` should not be migrated to `0`.
-    //
-    // This used to be a bug that translate `mt-[0px]` into `-mt-[0px]` because
-    // `-mt-[0px]` translates to `margin-top: calc(0px * -1);` and therefore we
-    // handle the `0px * -1` case which translates to `0px` not `-0px`.
-    //
-    // This translation is actually fine, because now, we will prefer the
-    // non-negative version first so we can replace `-mt-[0px]` with `mt-0`.
-    ['mt-[0px]', 'mt-0'],
-    ['-mt-[0px]', 'mt-0'],
-
-    // Shorthand CSS Variables should be converted to the new syntax, even if
-    // the fallback contains functions. The fallback should also be migrated to
-    // the newest syntax.
-    ['bg-[--my-color,theme(colors.red.500)]', 'bg-(--my-color,var(--color-red-500))'],
-
-    // Both the positive and negative versions of arbitrary utilities should be
-    // converted to the bare value version.
-    ['mb-[32rem]', 'mb-128'],
-    ['mb-[-32rem]', '-mb-128'],
-  ])(testName, async (candidate, result) => {
-    if (strategy === 'with-variant') {
-      candidate = `focus:${candidate}`
-      result = `focus:${result}`
-    } else if (strategy === 'important') {
-      candidate = `${candidate}!`
-      result = `${result}!`
-    } else if (strategy === 'prefix') {
-      // Not only do we need to prefix the candidate, we also have to make
-      // sure that we prefix all CSS variables.
-      candidate = `tw:${candidate.replaceAll('var(--', 'var(--tw-')}`
-      result = `tw:${result.replaceAll('var(--', 'var(--tw-')}`
-    }
-
-    let designSystem = await designSystems.get(__dirname).get(input)
-    let migrated = await migrate(designSystem, {}, candidate)
-    expect(migrated).toEqual(result)
-  })
-
-  test.each([
-    ['order-[0]', 'order-0'],
-    ['order-0', 'order-0'],
-
-    // Do not migrate `order-none` if defined as a custom utility as it is then
-    // not safe to migrate to `order-0`
-    ['order-none', 'order-none'],
-  ])(`${testName} with custom implementations`, async (candidate, result) => {
-    if (strategy === 'with-variant') {
-      candidate = `focus:${candidate}`
-      result = `focus:${result}`
-    } else if (strategy === 'important') {
-      candidate = `${candidate}!`
-      result = `${result}!`
-    } else if (strategy === 'prefix') {
-      // Not only do we need to prefix the candidate, we also have to make
-      // sure that we prefix all CSS variables.
-      candidate = `tw:${candidate.replaceAll('var(--', 'var(--tw-')}`
-      result = `tw:${result.replaceAll('var(--', 'var(--tw-')}`
-    }
-
-    let localInput = css`
-      ${input}
-
-      @utility order-none {
-        order: none; /* imagine this exists */
-      }
-    `
-
-    let designSystem = await designSystems.get(__dirname).get(localInput)
-    let migrated = await migrate(designSystem, {}, candidate)
-    expect(migrated).toEqual(result)
-  })
-})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate.ts b/packages/@tailwindcss-upgrade/src/codemods/template/migrate.ts
deleted file mode 100644
index 976c63a83..000000000
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate.ts
+++ /dev/null
@@ -1,137 +0,0 @@
-import fs from 'node:fs/promises'
-import path, { extname } from 'node:path'
-import {
-  createSignatureOptions,
-  prepareDesignSystemStorage,
-  UTILITY_SIGNATURE_KEY,
-} from '../../../../tailwindcss/src/canonicalize-candidates'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import { spliceChangesIntoString, type StringChange } from '../../utils/splice-changes-into-string'
-import { writeFileSafely } from '../../utils/write-file-safely'
-import { extractRawCandidates } from './candidates'
-import { isSafeMigration } from './is-safe-migration'
-import { migrateAutomaticVarInjection } from './migrate-automatic-var-injection'
-import { migrateCamelcaseInNamedValue } from './migrate-camelcase-in-named-value'
-import { migrateCanonicalizeCandidate } from './migrate-canonicalize-candidate'
-import { migrateEmptyArbitraryValues } from './migrate-handle-empty-arbitrary-values'
-import { migrateLegacyArbitraryValues } from './migrate-legacy-arbitrary-values'
-import { migrateLegacyClasses } from './migrate-legacy-classes'
-import { migrateMaxWidthScreen } from './migrate-max-width-screen'
-import { migrateModernizeArbitraryValues } from './migrate-modernize-arbitrary-values'
-import { migratePrefix } from './migrate-prefix'
-import { migrateSimpleLegacyClasses } from './migrate-simple-legacy-classes'
-import { migrateVariantOrder } from './migrate-variant-order'
-
-export type Migration = (
-  designSystem: DesignSystem,
-  userConfig: Config | null,
-  rawCandidate: string,
-) => string | Promise<string>
-
-export const DEFAULT_MIGRATIONS: Migration[] = [
-  migrateEmptyArbitraryValues,
-  migratePrefix,
-  migrateCanonicalizeCandidate,
-  migrateSimpleLegacyClasses,
-  migrateCamelcaseInNamedValue,
-  migrateLegacyClasses,
-  migrateMaxWidthScreen,
-  migrateVariantOrder, // Has to happen before migrations that modify variants
-  migrateAutomaticVarInjection,
-  migrateLegacyArbitraryValues,
-  migrateModernizeArbitraryValues,
-]
-
-let migrateCached = new DefaultMap((baseDesignSystem: DesignSystem) => {
-  let designSystem = prepareDesignSystemStorage(baseDesignSystem)
-  let options = createSignatureOptions(designSystem)
-
-  return new DefaultMap((userConfig: Config | null) => {
-    return new DefaultMap(async (rawCandidate) => {
-      let original = rawCandidate
-
-      for (let migration of DEFAULT_MIGRATIONS) {
-        rawCandidate = await migration(designSystem, userConfig, rawCandidate)
-      }
-
-      // Canonicalize the final migrated candidate to its final form
-      rawCandidate = designSystem.canonicalizeCandidates([rawCandidate]).pop()!
-
-      // Verify that the candidate actually makes sense at all. E.g.: `duration`
-      // is not a valid candidate, but it will parse because `duration-<number>`
-      // exists.
-      let signature = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options).get(rawCandidate)
-      if (typeof signature !== 'string') return original
-
-      return rawCandidate
-    })
-  })
-})
-
-export async function migrateCandidate(
-  designSystem: DesignSystem,
-  userConfig: Config | null,
-  rawCandidate: string,
-  // Location is only set when migrating a candidate from a source file
-  location?: {
-    contents: string
-    start: number
-    end: number
-  },
-): Promise<string> {
-  // Skip this migration if we think that the migration is unsafe
-  if (location && !isSafeMigration(rawCandidate, location, designSystem)) {
-    return rawCandidate
-  }
-
-  return migrateCached.get(designSystem).get(userConfig).get(rawCandidate)
-}
-
-export default async function migrateContents(
-  designSystem: DesignSystem,
-  userConfig: Config | null,
-  contents: string,
-  extension: string,
-): Promise<string> {
-  let candidates = await extractRawCandidates(contents, extension)
-
-  let changes: StringChange[] = []
-
-  for (let { rawCandidate, start, end } of candidates) {
-    let migratedCandidate = await migrateCandidate(designSystem, userConfig, rawCandidate, {
-      contents,
-      start,
-      end,
-    })
-
-    if (migratedCandidate === rawCandidate) {
-      continue
-    }
-
-    changes.push({
-      start,
-      end,
-      replacement: migratedCandidate,
-    })
-  }
-
-  return spliceChangesIntoString(contents, changes)
-}
-
-export async function migrate(
-  designSystem: DesignSystem,
-  userConfig: Config | null,
-  file: string,
-): Promise<boolean> {
-  let fullPath = path.isAbsolute(file) ? file : path.resolve(process.cwd(), file)
-  let contents = await fs.readFile(fullPath, 'utf-8')
-
-  let migrated = await migrateContents(designSystem, userConfig, contents, extname(file))
-  if (migrated === contents) return false // Nothing changed
-  if (migrated.trim() === '') return false // Emptied out, something went horribly wrong
-
-  await writeFileSafely(fullPath, migrated)
-  return true
-}
diff --git a/packages/@tailwindcss-upgrade/src/index.test.ts b/packages/@tailwindcss-upgrade/src/index.test.ts
index 2eae32f30..65d74937b 100644
--- a/packages/@tailwindcss-upgrade/src/index.test.ts
+++ b/packages/@tailwindcss-upgrade/src/index.test.ts
@@ -2,12 +2,10 @@ import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import dedent from 'dedent'
 import path from 'node:path'
 import postcss from 'postcss'
-import { expect, it, vi } from 'vitest'
-import { formatNodes } from './codemods/css/format-nodes'
-import { migrateContents } from './codemods/css/migrate'
-import { sortBuckets } from './codemods/css/sort-buckets'
-import * as versions from './utils/version'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
+import { expect, it } from 'vitest'
+import { formatNodes } from './codemods/format-nodes'
+import { sortBuckets } from './codemods/sort-buckets'
+import { migrateContents } from './migrate'
 
 const css = dedent
 
@@ -99,7 +97,7 @@ it('should migrate a stylesheet', async () => {
     "@import 'tailwindcss';
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -112,7 +110,7 @@ it('should migrate a stylesheet', async () => {
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }
 
@@ -170,7 +168,7 @@ it('should migrate a stylesheet (with imports)', async () => {
     @import './my-utilities.css' layer(utilities);
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -183,7 +181,7 @@ it('should migrate a stylesheet (with imports)', async () => {
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }"
   `)
@@ -212,7 +210,7 @@ it('should migrate a stylesheet (with preceding rules that should be wrapped in
     @import 'tailwindcss';
 
     /*
-      The default border color has changed to \`currentcolor\` in Tailwind CSS v4,
+      The default border color has changed to \`currentColor\` in Tailwind CSS v4,
       so we've added these compatibility styles to make sure everything still
       looks the same as it did with Tailwind CSS v3.
 
@@ -225,7 +223,7 @@ it('should migrate a stylesheet (with preceding rules that should be wrapped in
       ::before,
       ::backdrop,
       ::file-selector-button {
-        border-color: var(--color-gray-200, currentcolor);
+        border-color: var(--color-gray-200, currentColor);
       }
     }
 
diff --git a/packages/@tailwindcss-upgrade/src/index.ts b/packages/@tailwindcss-upgrade/src/index.ts
index d304bbe1f..9069b4ea8 100644
--- a/packages/@tailwindcss-upgrade/src/index.ts
+++ b/packages/@tailwindcss-upgrade/src/index.ts
@@ -1,29 +1,30 @@
 #!/usr/bin/env node
 
-import { Scanner } from '@tailwindcss/oxide'
-import { globby, isGitIgnored } from 'globby'
+import { globby } from 'globby'
 import fs from 'node:fs/promises'
 import path from 'node:path'
-import pc from 'picocolors'
 import postcss from 'postcss'
-import { migrateJsConfig } from './codemods/config/migrate-js-config'
-import { migratePostCSSConfig } from './codemods/config/migrate-postcss'
-import { analyze as analyzeStylesheets } from './codemods/css/analyze'
-import { formatNodes } from './codemods/css/format-nodes'
-import { linkConfigs as linkConfigsToStylesheets } from './codemods/css/link'
-import { migrate as migrateStylesheet } from './codemods/css/migrate'
-import { sortBuckets } from './codemods/css/sort-buckets'
-import { split as splitStylesheets } from './codemods/css/split'
-import { migrate as migrateTemplate } from './codemods/template/migrate'
-import { prepareConfig } from './codemods/template/prepare-config'
+import { formatNodes } from './codemods/format-nodes'
+import { sortBuckets } from './codemods/sort-buckets'
 import { help } from './commands/help'
+import {
+  analyze as analyzeStylesheets,
+  linkConfigs as linkConfigsToStylesheets,
+  migrate as migrateStylesheet,
+  split as splitStylesheets,
+} from './migrate'
+import { migrateJsConfig } from './migrate-js-config'
+import { migratePostCSSConfig } from './migrate-postcss'
+import { migratePrettierPlugin } from './migrate-prettier'
 import { Stylesheet } from './stylesheet'
+import { migrate as migrateTemplate } from './template/migrate'
+import { prepareConfig } from './template/prepare-config'
 import { args, type Arg } from './utils/args'
-import { gitRoot, isRepoDirty } from './utils/git'
+import { isRepoDirty } from './utils/git'
+import { hoistStaticGlobParts } from './utils/hoist-static-glob-parts'
+import { getPackageVersion } from './utils/package-version'
 import { pkg } from './utils/packages'
 import { eprintln, error, header, highlight, info, relative, success } from './utils/renderer'
-import * as version from './utils/version'
-import { writeFileSafely } from './utils/write-file-safely'
 
 const options = {
   '--config': { type: 'string', description: 'Path to the configuration file', alias: '-c' },
@@ -43,9 +44,6 @@ if (flags['--help']) {
 
 async function run() {
   let base = process.cwd()
-  // Use the project's git root, instead of the `base` to ensure all
-  // `.gitignore` rules are being used.
-  let isIgnored = await isGitIgnored({ cwd: gitRoot(base) ?? base })
 
   eprintln(header())
   eprintln()
@@ -63,27 +61,11 @@ async function run() {
     }
   }
 
-  info(`Upgrading from Tailwind CSS ${highlight(`v${version.installedTailwindVersion(base)}`)}`, {
-    prefix: '↳ ',
-  })
-
-  if (version.installedTailwindVersion(base) !== version.expectedTailwindVersion(base)) {
-    let pkgManager = await pkg(base).manager()
-
+  // Require an installed `tailwindcss` version < 4
+  let tailwindVersion = await getPackageVersion('tailwindcss', base)
+  if (tailwindVersion && Number(tailwindVersion.split('.')[0]) !== 3) {
     error(
-      [
-        'Version mismatch',
-        '',
-        pc.dim('```diff'),
-        `${pc.red('-')} ${`${pc.dim('"tailwindcss":')} ${`${pc.dim('"')}${pc.blue(version.expectedTailwindVersion(base))}${pc.dim('"')}`}`} (expected version in ${highlight('package.json')})`,
-        `${pc.green('+')} ${`${pc.dim('"tailwindcss":')} ${`${pc.dim('"')}${pc.blue(version.installedTailwindVersion(base))}${pc.dim('"')}`}`} (installed version in ${highlight('node_modules')})`,
-        pc.dim('```'),
-        '',
-        `Make sure to run ${highlight(`${pkgManager} install`)} and try again.`,
-      ].join('\n'),
-      {
-        prefix: '↳ ',
-      },
+      `Tailwind CSS v${tailwindVersion} found. The migration tool can only be run on v3 projects.`,
     )
     process.exit(1)
   }
@@ -99,11 +81,8 @@ async function run() {
       info('Searching for CSS files in the current directory and its subdirectories…')
 
       files = await globby(['**/*.css'], {
-        cwd: base,
         absolute: true,
         gitignore: true,
-        // gitignore: true will first search for all .gitignore including node_modules folders, this makes the initial search much faster
-        ignore: ['**/node_modules/**'],
       })
     }
 
@@ -123,30 +102,26 @@ async function run() {
     let stylesheets = loadResults
       .filter((result) => result.status === 'fulfilled')
       .map((result) => result.value)
-    let originals = new Map(stylesheets.map((sheet) => [sheet, sheet.root.toString()]))
 
     // Analyze the stylesheets
     try {
-      await analyzeStylesheets(stylesheets, { base })
+      await analyzeStylesheets(stylesheets)
     } catch (e: any) {
       error(`${e?.message ?? e}`, { prefix: '↳ ' })
     }
 
-    // Ensure stylesheets are linked to configs. But this is only necessary when
-    // migrating from v3 to v4.
-    if (version.isMajor(3)) {
-      try {
-        await linkConfigsToStylesheets(stylesheets, {
-          configPath: flags['--config'],
-          base,
-        })
-      } catch (e: any) {
-        error(`${e?.message ?? e}`, { prefix: '↳ ' })
-      }
+    // Ensure stylesheets are linked to configs
+    try {
+      await linkConfigsToStylesheets(stylesheets, {
+        configPath: flags['--config'],
+        base,
+      })
+    } catch (e: any) {
+      error(`${e?.message ?? e}`, { prefix: '↳ ' })
     }
 
     // Migrate js config files, linked to stylesheets
-    if (stylesheets.some((sheet) => sheet.isTailwindRoot && sheet.linkedConfigPath)) {
+    if (stylesheets.some((sheet) => sheet.isTailwindRoot)) {
       info('Migrating JavaScript configuration files…')
     }
     let configBySheet = new Map<Stylesheet, Awaited<ReturnType<typeof prepareConfig>>>()
@@ -156,7 +131,6 @@ async function run() {
     >()
     for (let sheet of stylesheets) {
       if (!sheet.isTailwindRoot) continue
-      if (!version.isMajor(3) && !sheet.linkedConfigPath) continue
 
       let config = await prepareConfig(sheet.linkedConfigPath, { base })
       configBySheet.set(sheet, config)
@@ -181,6 +155,41 @@ async function run() {
       }
     }
 
+    // Migrate source files, linked to config files
+    if (configBySheet.size > 0) {
+      info('Migrating templates…')
+    }
+    {
+      // Template migrations
+      for (let config of configBySheet.values()) {
+        let set = new Set<string>()
+        for (let globEntry of config.globs.flatMap((entry) => hoistStaticGlobParts(entry))) {
+          let files = await globby([globEntry.pattern], {
+            absolute: true,
+            gitignore: true,
+            cwd: globEntry.base,
+          })
+
+          for (let file of files) {
+            set.add(file)
+          }
+        }
+
+        let files = Array.from(set)
+        files.sort()
+
+        // Migrate each file
+        await Promise.allSettled(
+          files.map((file) => migrateTemplate(config.designSystem, config.userConfig, file)),
+        )
+
+        success(
+          `Migrated templates for configuration file: ${highlight(relative(config.configFilePath, base))}`,
+          { prefix: '↳ ' },
+        )
+      }
+    }
+
     // Migrate each CSS file
     if (stylesheets.length > 0) {
       info('Migrating stylesheets…')
@@ -188,33 +197,20 @@ async function run() {
     await Promise.all(
       stylesheets.map(async (sheet) => {
         try {
-          let config = configBySheet.get(sheet)
-          let jsConfigMigration = jsConfigMigrationBySheet.get(sheet) ?? null
+          let config = configBySheet.get(sheet)!
+          let jsConfigMigration = jsConfigMigrationBySheet.get(sheet)!
 
           if (!config) {
             for (let parent of sheet.ancestors()) {
               if (parent.isTailwindRoot) {
                 config ??= configBySheet.get(parent)!
-                jsConfigMigration ??= jsConfigMigrationBySheet.get(parent) ?? null
+                jsConfigMigration ??= jsConfigMigrationBySheet.get(parent)!
                 break
               }
             }
           }
 
-          // Prime the compiler/designSystem cache against the pre-migration AST
-          // so the later template-migration phase sees the same v4 state. After
-          // this point, `sheet.root` may be mutated by `migrateStylesheet`.
-          if (!version.isMajor(3) && sheet.isTailwindRoot) {
-            await Promise.all([sheet.compiler(), sheet.designSystem()])
-          }
-
-          await migrateStylesheet(sheet, {
-            newPrefix: config?.newPrefix ?? null,
-            designSystem: config?.designSystem ?? (await sheet.designSystem()),
-            userConfig: config?.userConfig ?? null,
-            configFilePath: config?.configFilePath ?? null,
-            jsConfigMigration,
-          })
+          await migrateStylesheet(sheet, { ...config, jsConfigMigration })
         } catch (e: any) {
           error(`${e?.message ?? e} in ${highlight(relative(sheet.file!, base))}`, { prefix: '↳ ' })
         }
@@ -222,39 +218,36 @@ async function run() {
     )
 
     // Split up stylesheets (as needed)
-    if (version.isMajor(3)) {
-      try {
-        await splitStylesheets(stylesheets)
-      } catch (e: any) {
-        error(`${e?.message ?? e}`, { prefix: '↳ ' })
-      }
+    try {
+      await splitStylesheets(stylesheets)
+    } catch (e: any) {
+      error(`${e?.message ?? e}`, { prefix: '↳ ' })
+    }
 
-      // Cleanup `@import "…" layer(utilities)`
-      for (let sheet of stylesheets) {
-        for (let importRule of sheet.importRules) {
-          if (!importRule.raws.tailwind_injected_layer) continue
-          let importedSheet = stylesheets.find(
-            (sheet) => sheet.id === importRule.raws.tailwind_destination_sheet_id,
-          )
-          if (!importedSheet) continue
+    // Cleanup `@import "…" layer(utilities)`
+    for (let sheet of stylesheets) {
+      for (let importRule of sheet.importRules) {
+        if (!importRule.raws.tailwind_injected_layer) continue
+        let importedSheet = stylesheets.find(
+          (sheet) => sheet.id === importRule.raws.tailwind_destination_sheet_id,
+        )
+        if (!importedSheet) continue
 
-          // Only remove the `layer(…)` next to the import if any of the children
-          // contain `@utility`. Otherwise `@utility` will not be top-level.
-          if (
-            !importedSheet.containsRule((node) => node.type === 'atrule' && node.name === 'utility')
-          ) {
-            continue
-          }
-
-          // Make sure to remove the `layer(…)` from the `@import` at-rule
-          importRule.params = importRule.params.replace(/ layer\([^)]+\)/, '').trim()
+        // Only remove the `layer(…)` next to the import if any of the children
+        // contain `@utility`. Otherwise `@utility` will not be top-level.
+        if (
+          !importedSheet.containsRule((node) => node.type === 'atrule' && node.name === 'utility')
+        ) {
+          continue
         }
+
+        // Make sure to remove the `layer(…)` from the `@import` at-rule
+        importRule.params = importRule.params.replace(/ layer\([^)]+\)/, '').trim()
       }
     }
 
     // Format nodes
     for (let sheet of stylesheets) {
-      if (originals.get(sheet) === sheet.root.toString()) continue
       await postcss([sortBuckets(), formatNodes()]).process(sheet.root!, { from: sheet.file! })
     }
 
@@ -262,186 +255,31 @@ async function run() {
     for (let sheet of stylesheets) {
       if (!sheet.file) continue
 
-      await writeFileSafely(sheet.file, sheet.root.toString())
+      await fs.writeFile(sheet.file, sheet.root.toString())
 
       if (sheet.isTailwindRoot) {
         success(`Migrated stylesheet: ${highlight(relative(sheet.file, base))}`, { prefix: '↳ ' })
       }
     }
-
-    info('Updating dependencies…')
-    {
-      let pkgManager = pkg(base)
-      let dependencies = [
-        'tailwindcss',
-        '@tailwindcss/cli',
-        '@tailwindcss/postcss',
-        '@tailwindcss/vite',
-        '@tailwindcss/node',
-        '@tailwindcss/oxide',
-        'prettier-plugin-tailwindcss',
-      ].filter((dependency) => dependency === 'tailwindcss' || pkgManager.has(dependency))
-      try {
-        await pkgManager.add(dependencies.map((dependency) => `${dependency}@latest`))
-        for (let dependency of dependencies) {
-          success(`Updated package: ${highlight(dependency)}`, { prefix: '↳ ' })
-        }
-      } catch {}
-    }
-
-    let tailwindRootStylesheets = stylesheets.filter((sheet) => sheet.isTailwindRoot && sheet.file)
-
-    // Migrate source files
-    if (tailwindRootStylesheets.length > 0) {
-      info('Migrating templates…')
-    }
-    {
-      let seenFiles = new Set()
-
-      // Template migrations
-      for (let sheet of tailwindRootStylesheets) {
-        let compiler = await sheet.compiler()
-        if (!compiler) continue
-        let designSystem = await sheet.designSystem()
-        if (!designSystem) continue
-
-        let config = configBySheet.get(sheet)
-
-        // Figure out the source files to migrate
-        let sources = (() => {
-          // Disable auto source detection
-          if (compiler.root === 'none') {
-            return []
-          }
-
-          // No root specified
-          if (compiler.root === null) {
-            // When coming from Tailwind CSS v3, we have to use the
-            // `config.sources` (which came from `config.content` originally)
-            if (version.isMajor(3)) {
-              if (config?.sources) {
-                return config.sources.map((source) => ({ ...source, negated: false }))
-              }
-
-              // When we don't have any sources, then we have to fallback to no
-              // sources at all. We cannot fallback to the `**/*` pattern.
-              return []
-            }
-
-            // When we are upgrading a Tailwind CSS v4 and up version, we use
-            // the default `**/*` pattern. All custom `@source` directives will
-            // be attached later as sources.
-            return [{ base, pattern: '**/*', negated: false }]
-          }
-
-          // Use the specified root
-          return [{ ...compiler.root, negated: false }]
-        })().concat(compiler.sources)
-        let scanner = new Scanner({ sources })
-        let filesToMigrate = []
-
-        let ignoredPaths = new Set<string>()
-
-        for (let file of scanner.files) {
-          file = await fs.realpath(file).catch(() => file) // Ensure we are dealing with the real path, not symlinks
-          if (file.endsWith('.css')) continue
-
-          // When a file is git ignored, then we don't want to migrate it even
-          // if it was listed in the `config.content` array or part of any
-          // `@source` directives.
-          //
-          // We can make this an option later to explicitly allow this, but
-          // this should be the default. This guarantees that:
-          //
-          // 1. Files coming from node_modules aren't touched
-          // 2. Generated files aren't changed (the source should update, not the target)
-          // 3. You can see all the changes that happened
-          try {
-            if (isIgnored(file)) {
-              let culprit = file
-
-              // To prevent print all ignored files, we can also walk up the
-              // parent tree and log those instead _if_ they are:
-              //
-              // 1. Also git ignored
-              // 2. Are not going outside of the current repo
-              let parent = path.dirname(file)
-              do {
-                try {
-                  if (isIgnored(parent)) {
-                    culprit = parent
-                  }
-                } catch {
-                  // Escaping the current repo
-                  break
-                }
-
-                let nextParent = path.dirname(parent)
-                if (nextParent === parent) break
-                parent = nextParent
-              } while (parent)
-
-              if (ignoredPaths.has(culprit)) continue // Already logged, skip
-              ignoredPaths.add(culprit)
-
-              if (culprit === file) {
-                info(`Git ignored, skipping: ${highlight(relative(culprit, base))}`, {
-                  prefix: '↳ ',
-                })
-              } else {
-                info(`Git ignored folder, skipping: ${highlight(relative(culprit, base))}`, {
-                  prefix: '↳ ',
-                })
-              }
-
-              continue
-            }
-          } catch (err) {
-            info(`Outside repository, skipping: ${highlight(relative(file, base))}`, {
-              prefix: '↳ ',
-            })
-            // Skip this file when we run into errors. E.g.: when the current
-            // file is not part of the current git repo it will throw an error.
-            continue
-          }
-
-          if (seenFiles.has(file)) continue
-          seenFiles.add(file)
-          filesToMigrate.push(file)
-        }
-
-        // Migrate each file
-        let changes = 0
-        await Promise.allSettled(
-          filesToMigrate.map(async (file) => {
-            let changed = await migrateTemplate(designSystem, config?.userConfig ?? null, file)
-            if (changed) {
-              changes++
-              info(`Migrated ${highlight(relative(file, base))}`, { prefix: '↳ ' })
-            }
-          }),
-        )
-
-        if (config?.configFilePath) {
-          success(
-            `Migrated templates for configuration file: ${highlight(relative(config.configFilePath, base))} (${changes} file${changes === 1 ? '' : 's'} changed)`,
-            { prefix: '↳ ' },
-          )
-        } else {
-          success(
-            `Migrated templates for: ${highlight(relative(sheet.file ?? '<unknown>', base))} (${changes} file${changes === 1 ? '' : 's'} changed)`,
-            { prefix: '↳ ' },
-          )
-        }
-      }
-    }
   }
 
-  if (version.isMajor(3)) {
+  {
     // PostCSS config migration
     await migratePostCSSConfig(base)
   }
 
+  info('Updating dependencies…')
+  {
+    // Migrate the prettier plugin to the latest version
+    await migratePrettierPlugin(base)
+  }
+
+  try {
+    // Upgrade Tailwind CSS
+    await pkg(base).add(['tailwindcss@latest'])
+    success(`Updated package: ${highlight('tailwindcss')}`, { prefix: '↳ ' })
+  } catch {}
+
   // Run all cleanup functions because we completed the migration
   await Promise.allSettled(cleanup.map((fn) => fn()))
 
diff --git a/packages/@tailwindcss-upgrade/src/codemods/config/migrate-js-config.ts b/packages/@tailwindcss-upgrade/src/migrate-js-config.ts
similarity index 63%
rename from packages/@tailwindcss-upgrade/src/codemods/config/migrate-js-config.ts
rename to packages/@tailwindcss-upgrade/src/migrate-js-config.ts
index 6a451333e..ac0a71a15 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/config/migrate-js-config.ts
+++ b/packages/@tailwindcss-upgrade/src/migrate-js-config.ts
@@ -2,31 +2,27 @@ import { Scanner } from '@tailwindcss/oxide'
 import fs from 'node:fs/promises'
 import path from 'node:path'
 import { fileURLToPath } from 'node:url'
-import { loadModule } from '../../../../@tailwindcss-node/src/compile'
-import defaultTheme from '../../../../tailwindcss/dist/default-theme'
-import { atRule, toCss, type AstNode } from '../../../../tailwindcss/src/ast'
+import { loadModule } from '../../@tailwindcss-node/src/compile'
+import defaultTheme from '../../tailwindcss/dist/default-theme'
+import { atRule, toCss, type AstNode } from '../../tailwindcss/src/ast'
 import {
   keyPathToCssProperty,
   themeableValues,
-} from '../../../../tailwindcss/src/compat/apply-config-to-theme'
-import { keyframesToRules } from '../../../../tailwindcss/src/compat/apply-keyframes-to-theme'
-import {
-  resolveConfig,
-  type ConfigFile,
-} from '../../../../tailwindcss/src/compat/config/resolve-config'
-import type { ResolvedConfig, ThemeConfig } from '../../../../tailwindcss/src/compat/config/types'
-import { buildCustomContainerUtilityRules } from '../../../../tailwindcss/src/compat/container'
-import { darkModePlugin } from '../../../../tailwindcss/src/compat/dark-mode'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { escape } from '../../../../tailwindcss/src/utils/escape'
+} from '../../tailwindcss/src/compat/apply-config-to-theme'
+import { keyframesToRules } from '../../tailwindcss/src/compat/apply-keyframes-to-theme'
+import { resolveConfig, type ConfigFile } from '../../tailwindcss/src/compat/config/resolve-config'
+import type { ResolvedConfig, ThemeConfig } from '../../tailwindcss/src/compat/config/types'
+import { buildCustomContainerUtilityRules } from '../../tailwindcss/src/compat/container'
+import { darkModePlugin } from '../../tailwindcss/src/compat/dark-mode'
+import type { Config } from '../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../tailwindcss/src/design-system'
+import { escape } from '../../tailwindcss/src/utils/escape'
 import {
   isValidOpacityValue,
   isValidSpacingMultiplier,
-} from '../../../../tailwindcss/src/utils/infer-data-type'
-import * as ValueParser from '../../../../tailwindcss/src/value-parser'
-import { findStaticPlugins, type StaticPluginOptions } from '../../utils/extract-static-plugins'
-import { highlight, info, relative } from '../../utils/renderer'
+} from '../../tailwindcss/src/utils/infer-data-type'
+import { findStaticPlugins, type StaticPluginOptions } from './utils/extract-static-plugins'
+import { highlight, info, relative } from './utils/renderer'
 
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
@@ -98,14 +94,12 @@ async function migrateTheme(
   designSystem: DesignSystem,
   unresolvedConfig: Config,
   base: string,
-): Promise<string> {
+): Promise<string | null> {
   // Resolve the config file without applying plugins and presets, as these are
   // migrated to CSS separately.
   let configToResolve: ConfigFile = {
     base,
     config: { ...unresolvedConfig, plugins: [], presets: undefined },
-    reference: false,
-    src: undefined,
   }
   let { resolvedConfig, replacedThemeKeys } = resolveConfig(designSystem, [configToResolve])
 
@@ -115,88 +109,10 @@ async function migrateTheme(
 
   removeUnnecessarySpacingKeys(designSystem, resolvedConfig, replacedThemeKeys)
 
-  let css = ''
   let prevSectionKey = ''
-  let themeSection: string[] = []
-  let keyframesCss = ''
-  let variants = new Map<string, string>()
-
-  // Special handling of specific theme keys:
-  {
-    if ('keyframes' in resolvedConfig.theme) {
-      keyframesCss += keyframesToCss(resolvedConfig.theme.keyframes)
-      delete resolvedConfig.theme.keyframes
-    }
-
-    if ('container' in resolvedConfig.theme) {
-      let rules = buildCustomContainerUtilityRules(resolvedConfig.theme.container, designSystem)
-      if (rules.length > 0) {
-        // Using `theme` instead of `utility` so it sits before the `@layer
-        // base` with compatibility CSS. While this is technically a utility, it
-        // makes a bit more sense to emit this closer to the `@theme` values
-        // since it is needed for backwards compatibility.
-        css += `\n@tw-bucket theme {\n`
-        css += toCss([atRule('@utility', 'container', rules)])
-        css += '}\n' // @tw-bucket
-      }
-      delete resolvedConfig.theme.container
-    }
-
-    if ('aria' in resolvedConfig.theme) {
-      for (let [key, value] of Object.entries(resolvedConfig.theme.aria ?? {})) {
-        // Will be handled by bare values if the names match.
-        // E.g.: `aria-foo:flex` should produce `[aria-foo="true"]`
-        if (new RegExp(`^${key}=(['"]?)true\\1$`).test(`${value}`)) continue
-
-        // Create custom variant
-        variants.set(`aria-${key}`, `&[aria-${value}]`)
-      }
-      delete resolvedConfig.theme.aria
-    }
-
-    if ('data' in resolvedConfig.theme) {
-      for (let [key, value] of Object.entries(resolvedConfig.theme.data ?? {})) {
-        // Will be handled by bare values if the names match.
-        // E.g.: `data-foo:flex` should produce `[data-foo]`
-        if (key === value) continue
-
-        // Create custom variant
-        variants.set(`data-${key}`, `&[data-${value}]`)
-      }
-      delete resolvedConfig.theme.data
-    }
-
-    if ('supports' in resolvedConfig.theme) {
-      for (let [key, value] of Object.entries(resolvedConfig.theme.supports ?? {})) {
-        // Will be handled by bare values if the value of the declaration is a
-        // CSS variable.
-        let parsed = ValueParser.parse(`${value}`)
-
-        // Unwrap the parens, e.g.: `(foo: var(--bar))` → `foo: var(--bar)`
-        if (parsed.length === 1 && parsed[0].kind === 'function' && parsed[0].value === '') {
-          parsed = parsed[0].nodes
-        }
-
-        // Verify structure: `foo: var(--bar)`
-        //                    ^^^ ← must match the `key`
-        if (
-          parsed.length === 3 &&
-          parsed[0].kind === 'word' &&
-          parsed[0].value === key &&
-          parsed[2].kind === 'function' &&
-          parsed[2].value === 'var'
-        ) {
-          continue
-        }
-
-        // Create custom variant
-        variants.set(`supports-${key}`, `{@supports(${value}){@slot;}}`)
-      }
-      delete resolvedConfig.theme.supports
-    }
-  }
-
-  // Convert theme values to CSS custom properties
+  let css = '\n@tw-bucket theme {\n'
+  css += `\n@theme {\n`
+  let containsThemeKeys = false
   for (let [key, value] of themeableValues(resolvedConfig.theme)) {
     if (typeof value !== 'string' && typeof value !== 'number') {
       continue
@@ -231,61 +147,51 @@ async function migrateTheme(
       }
     }
 
+    if (key[0] === 'keyframes') {
+      continue
+    }
+    containsThemeKeys = true
+
     let sectionKey = createSectionKey(key)
     if (sectionKey !== prevSectionKey) {
-      themeSection.push('')
+      css += `\n`
       prevSectionKey = sectionKey
     }
 
+    if (resetNamespaces.has(key[0]) && resetNamespaces.get(key[0]) === false) {
+      resetNamespaces.set(key[0], true)
+      let property = keyPathToCssProperty([key[0]])
+      if (property !== null) {
+        css += `  ${escape(`--${property}`)}-*: initial;\n`
+      }
+    }
+
     let property = keyPathToCssProperty(key)
-
     if (property !== null) {
-      if (
-        !property.startsWith('default-') &&
-        resetNamespaces.has(key[0]) &&
-        resetNamespaces.get(key[0]) === false
-      ) {
-        resetNamespaces.set(key[0], true)
-        let ns = keyPathToCssProperty([key[0]])
-        if (ns !== null) {
-          themeSection.push(`  ${escape(`--${ns}`)}-*: initial;`)
-        }
-      }
-
-      themeSection.push(`  ${escape(`--${property}`)}: ${value};`)
+      css += `  ${escape(`--${property}`)}: ${value};\n`
     }
   }
 
-  if (keyframesCss) {
-    themeSection.push('', keyframesCss)
+  if ('keyframes' in resolvedConfig.theme) {
+    containsThemeKeys = true
+    css += '\n' + keyframesToCss(resolvedConfig.theme.keyframes)
   }
 
-  if (themeSection.length > 0) {
-    css += `\n@tw-bucket theme {\n`
-    css += `\n@theme {\n`
-    css += themeSection.join('\n') + '\n'
-    css += '}\n' // @theme
-    css += '}\n' // @tw-bucket
+  if (!containsThemeKeys) {
+    return null
   }
 
-  if (variants.size > 0) {
-    css += '\n@tw-bucket custom-variant {\n'
+  css += '}\n' // @theme
 
-    let previousRoot = ''
-    for (let [name, selector] of variants) {
-      let root = name.split('-')[0]
-      if (previousRoot !== root) css += '\n'
-      previousRoot = root
-
-      if (selector.startsWith('{')) {
-        css += `@custom-variant ${name} ${selector}\n`
-      } else {
-        css += `@custom-variant ${name} (${selector});\n`
-      }
+  if ('container' in resolvedConfig.theme) {
+    let rules = buildCustomContainerUtilityRules(resolvedConfig.theme.container, designSystem)
+    if (rules.length > 0) {
+      css += '\n' + toCss([atRule('@utility', 'container', rules)])
     }
-    css += '}\n'
   }
 
+  css += '}\n' // @tw-bucket
+
   return css
 }
 
@@ -368,11 +274,7 @@ async function migrateContent(
       throw new Error('Unsupported content value: ' + pattern)
     }
 
-    let sourceFiles = patternSourceFiles({
-      base,
-      pattern: pattern[0] === '!' ? pattern.slice(1) : pattern,
-      negated: pattern[0] === '!',
-    })
+    let sourceFiles = patternSourceFiles({ base, pattern })
 
     let autoContentContainsAllSourceFiles = true
     for (let sourceFile of sourceFiles) {
@@ -407,7 +309,7 @@ function canMigrateConfig(unresolvedConfig: Config, source: string): boolean {
     return false
   }
 
-  // The file may only contain known-migratable top-level properties
+  // The file may only contain known-migrateable top-level properties
   let knownProperties = [
     'darkMode',
     'content',
@@ -416,8 +318,6 @@ function canMigrateConfig(unresolvedConfig: Config, source: string): boolean {
     'presets',
     'prefix', // Prefix is handled in the dedicated prefix migrator
     'corePlugins',
-    'future',
-    'experimental',
   ]
 
   if (Object.keys(unresolvedConfig).some((key) => !knownProperties.includes(key))) {
@@ -432,29 +332,6 @@ function canMigrateConfig(unresolvedConfig: Config, source: string): boolean {
     return false
   }
 
-  // If there are unknown "future" flags we should bail
-  if (unresolvedConfig.future && unresolvedConfig.future !== 'all') {
-    let knownFlags = [
-      'hoverOnlyWhenSupported',
-      'respectDefaultRingColorOpacity',
-      'disableColorOpacityUtilitiesByDefault',
-      'relativeContentPathsByDefault',
-    ]
-
-    if (Object.keys(unresolvedConfig.future).some((key) => !knownFlags.includes(key))) {
-      return false
-    }
-  }
-
-  // If there are unknown "experimental" flags we should bail
-  if (unresolvedConfig.experimental && unresolvedConfig.experimental !== 'all') {
-    let knownFlags = ['generalizedModifiers']
-
-    if (Object.keys(unresolvedConfig.experimental).some((key) => !knownFlags.includes(key))) {
-      return false
-    }
-  }
-
   // Only migrate the config file if all top-level theme keys are allowed to be
   // migrated
   if (theme && typeof theme === 'object') {
@@ -471,11 +348,15 @@ const ALLOWED_THEME_KEYS = [
   // Used by @tailwindcss/container-queries
   'containers',
 ]
+const BLOCKED_THEME_KEYS = ['supports', 'data', 'aria']
 function onlyAllowedThemeValues(theme: ThemeConfig): boolean {
   for (let key of Object.keys(theme)) {
     if (!ALLOWED_THEME_KEYS.includes(key)) {
       return false
     }
+    if (BLOCKED_THEME_KEYS.includes(key)) {
+      return false
+    }
   }
 
   if ('screens' in theme && typeof theme.screens === 'object' && theme.screens !== null) {
@@ -494,20 +375,12 @@ function keyframesToCss(keyframes: Record<string, unknown>): string {
 }
 
 function autodetectedSourceFiles(base: string) {
-  let scanner = new Scanner({
-    sources: [
-      {
-        base,
-        pattern: '**/*',
-        negated: false,
-      },
-    ],
-  })
+  let scanner = new Scanner({ sources: [{ base, pattern: '**/*' }] })
   scanner.scan()
   return scanner.files
 }
 
-function patternSourceFiles(source: { base: string; pattern: string; negated: boolean }): string[] {
+function patternSourceFiles(source: { base: string; pattern: string }): string[] {
   let scanner = new Scanner({ sources: [source] })
   scanner.scan()
   return scanner.files
diff --git a/packages/@tailwindcss-upgrade/src/codemods/config/migrate-postcss.ts b/packages/@tailwindcss-upgrade/src/migrate-postcss.ts
similarity index 94%
rename from packages/@tailwindcss-upgrade/src/codemods/config/migrate-postcss.ts
rename to packages/@tailwindcss-upgrade/src/migrate-postcss.ts
index e16f52287..0d49c2ad2 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/config/migrate-postcss.ts
+++ b/packages/@tailwindcss-upgrade/src/migrate-postcss.ts
@@ -1,8 +1,7 @@
 import fs from 'node:fs/promises'
 import path from 'node:path'
-import { pkg } from '../../utils/packages'
-import { highlight, info, relative, success, warn } from '../../utils/renderer'
-import { writeFileSafely } from '../../utils/write-file-safely'
+import { pkg } from './utils/packages'
+import { highlight, info, relative, success, warn } from './utils/renderer'
 
 // Migrates simple PostCSS setups. This is to cover non-dynamic config files
 // similar to the ones we have all over our docs:
@@ -16,7 +15,6 @@ import { writeFileSafely } from '../../utils/write-file-safely'
 //     autoprefixer: {},
 //   }
 // }
-// ```
 export async function migratePostCSSConfig(base: string) {
   let ranMigration = false
   let didMigrate = false
@@ -51,7 +49,7 @@ export async function migratePostCSSConfig(base: string) {
       ranMigration = true
 
       if (result) {
-        await writeFileSafely(
+        await fs.writeFile(
           packageJsonPath,
           JSON.stringify({ ...packageJson, postcss: result?.json }, null, 2),
         )
@@ -77,7 +75,7 @@ export async function migratePostCSSConfig(base: string) {
         ranMigration = true
 
         if (result) {
-          await writeFileSafely(jsonConfigPath, JSON.stringify(result.json, null, 2))
+          await fs.writeFile(jsonConfigPath, JSON.stringify(result.json, null, 2))
 
           didMigrate = true
           didAddPostcssClient = result.didAddPostcssClient
@@ -137,16 +135,16 @@ async function migratePostCSSJSConfig(configPath: string): Promise<{
   didRemovePostCSSImport: boolean
 } | null> {
   function isTailwindCSSPlugin(line: string) {
-    return /['"]?tailwindcss['"]?: ?\{\}/.test(line)
+    return /['"]?tailwindcss['"]?\: ?\{\}/.test(line)
   }
   function isPostCSSImportPlugin(line: string) {
-    return /['"]?postcss-import['"]?: ?\{\}/.test(line)
+    return /['"]?postcss-import['"]?\: ?\{\}/.test(line)
   }
   function isAutoprefixerPlugin(line: string) {
-    return /['"]?autoprefixer['"]?: ?\{\}/.test(line)
+    return /['"]?autoprefixer['"]?\: ?\{\}/.test(line)
   }
   function isTailwindCSSNestingPlugin(line: string) {
-    return /['"]tailwindcss\/nesting['"]: ?(\{\}|['"]postcss-nesting['"])/.test(line)
+    return /['"]tailwindcss\/nesting['"]\: ?(\{\}|['"]postcss-nesting['"])/.test(line)
   }
 
   info('Migrating PostCSS configuration…')
@@ -207,7 +205,7 @@ async function migratePostCSSJSConfig(configPath: string): Promise<{
       newLines.push(line)
     }
   }
-  await writeFileSafely(configPath, newLines.join('\n'))
+  await fs.writeFile(configPath, newLines.join('\n'))
 
   return { didAddPostcssClient, didRemoveAutoprefixer, didRemovePostCSSImport }
 }
diff --git a/packages/@tailwindcss-upgrade/src/migrate-prettier.ts b/packages/@tailwindcss-upgrade/src/migrate-prettier.ts
new file mode 100644
index 000000000..cd56cc688
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/migrate-prettier.ts
@@ -0,0 +1,15 @@
+import fs from 'node:fs/promises'
+import path from 'node:path'
+import { pkg } from './utils/packages'
+import { highlight, success } from './utils/renderer'
+
+export async function migratePrettierPlugin(base: string) {
+  let packageJsonPath = path.resolve(base, 'package.json')
+  try {
+    let packageJson = await fs.readFile(packageJsonPath, 'utf-8')
+    if (packageJson.includes('prettier-plugin-tailwindcss')) {
+      await pkg(base).add(['prettier-plugin-tailwindcss@latest'])
+      success(`Updated package: ${highlight('prettier-plugin-tailwindcss')}`, { prefix: '↳ ' })
+    }
+  } catch {}
+}
diff --git a/packages/@tailwindcss-upgrade/src/migrate.ts b/packages/@tailwindcss-upgrade/src/migrate.ts
new file mode 100644
index 000000000..45e758496
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/migrate.ts
@@ -0,0 +1,719 @@
+import { normalizePath } from '@tailwindcss/node'
+import { isGitIgnored } from 'globby'
+import path from 'node:path'
+import postcss, { type Result } from 'postcss'
+import type { Config } from '../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../tailwindcss/src/design-system'
+import { DefaultMap } from '../../tailwindcss/src/utils/default-map'
+import { segment } from '../../tailwindcss/src/utils/segment'
+import { migrateAtApply } from './codemods/migrate-at-apply'
+import { migrateAtLayerUtilities } from './codemods/migrate-at-layer-utilities'
+import { migrateConfig } from './codemods/migrate-config'
+import { migrateImport } from './codemods/migrate-import'
+import { migrateMediaScreen } from './codemods/migrate-media-screen'
+import { migrateMissingLayers } from './codemods/migrate-missing-layers'
+import { migratePreflight } from './codemods/migrate-preflight'
+import { migrateTailwindDirectives } from './codemods/migrate-tailwind-directives'
+import { migrateThemeToVar } from './codemods/migrate-theme-to-var'
+import { migrateVariantsDirective } from './codemods/migrate-variants-directive'
+import type { JSConfigMigration } from './migrate-js-config'
+import { Stylesheet, type StylesheetConnection, type StylesheetId } from './stylesheet'
+import { detectConfigPath } from './template/prepare-config'
+import { error, highlight, relative, success } from './utils/renderer'
+import { resolveCssId } from './utils/resolve'
+import { walk, WalkAction } from './utils/walk'
+
+export interface MigrateOptions {
+  newPrefix: string | null
+  designSystem: DesignSystem
+  userConfig: Config
+  configFilePath: string
+  jsConfigMigration: JSConfigMigration
+}
+
+export async function migrateContents(
+  stylesheet: Stylesheet | string,
+  options: MigrateOptions,
+  file?: string,
+) {
+  if (typeof stylesheet === 'string') {
+    stylesheet = await Stylesheet.fromString(stylesheet)
+    stylesheet.file = file ?? null
+  }
+
+  return postcss()
+    .use(migrateImport())
+    .use(migrateAtApply(options))
+    .use(migrateMediaScreen(options))
+    .use(migrateVariantsDirective())
+    .use(migrateAtLayerUtilities(stylesheet))
+    .use(migrateMissingLayers())
+    .use(migrateTailwindDirectives(options))
+    .use(migrateConfig(stylesheet, options))
+    .use(migratePreflight(options))
+    .use(migrateThemeToVar(options))
+    .process(stylesheet.root, { from: stylesheet.file ?? undefined })
+}
+
+export async function migrate(stylesheet: Stylesheet, options: MigrateOptions) {
+  if (!stylesheet.file) {
+    throw new Error('Cannot migrate a stylesheet without a file path')
+  }
+
+  if (!stylesheet.canMigrate) return
+
+  await migrateContents(stylesheet, options)
+}
+
+export async function analyze(stylesheets: Stylesheet[]) {
+  let isIgnored = await isGitIgnored()
+  let processingQueue: (() => Promise<Result>)[] = []
+  let stylesheetsByFile = new DefaultMap<string, Stylesheet | null>((file) => {
+    // We don't want to process ignored files (like node_modules)
+    if (isIgnored(file)) {
+      return null
+    }
+
+    try {
+      let sheet = Stylesheet.loadSync(file)
+
+      // Mutate incoming stylesheets to include the newly discovered sheet
+      stylesheets.push(sheet)
+
+      // Queue up the processing of this stylesheet
+      processingQueue.push(() => processor.process(sheet.root, { from: sheet.file! }))
+
+      return sheet
+    } catch {
+      return null
+    }
+  })
+
+  // Step 1: Record which `@import` rules point to which stylesheets
+  // and which stylesheets are parents/children of each other
+  let processor = postcss([
+    {
+      postcssPlugin: 'mark-import-nodes',
+      AtRule: {
+        import(node) {
+          // Find what the import points to
+          let id = node.params.match(/['"](.*)['"]/)?.[1]
+          if (!id) return
+
+          let basePath = node.source?.input.file
+            ? path.dirname(node.source.input.file)
+            : process.cwd()
+
+          // Resolve the import to a file path
+          let resolvedPath: string | false = false
+          try {
+            // We first try to resolve the file as relative to the current file
+            // to mimic the behavior of `postcss-import` since that's what was
+            // used to resolve imports in Tailwind CSS v3.
+            if (id[0] !== '.') {
+              try {
+                resolvedPath = resolveCssId(`./${id}`, basePath)
+              } catch {}
+            }
+
+            if (!resolvedPath) {
+              resolvedPath = resolveCssId(id, basePath)
+            }
+          } catch (err) {
+            // Import is a URL, we don't want to process these, but also don't
+            // want to show an error message for them.
+            if (id.startsWith('http://') || id.startsWith('https://') || id.startsWith('//')) {
+              return
+            }
+
+            // Something went wrong, we can't resolve the import.
+            error(
+              `Failed to resolve import: ${highlight(id)} in ${highlight(relative(node.source?.input.file!, basePath))}. Skipping.`,
+              { prefix: '↳ ' },
+            )
+            return
+          }
+
+          if (!resolvedPath) return
+
+          // Find the stylesheet pointing to the resolved path
+          let stylesheet = stylesheetsByFile.get(resolvedPath)
+
+          // If it _does not_ exist in stylesheets we don't care and skip it
+          // this is likely because its in node_modules or a workspace package
+          // that we don't want to modify
+          if (!stylesheet) return
+
+          // Mark the import node with the ID of the stylesheet it points to
+          // We will use these later to build lookup tables and modify the AST
+          node.raws.tailwind_destination_sheet_id = stylesheet.id
+
+          let parent = node.source?.input.file
+            ? stylesheetsByFile.get(node.source.input.file)
+            : undefined
+
+          let layers: string[] = []
+
+          for (let part of segment(node.params, ' ')) {
+            if (!part.startsWith('layer(')) continue
+            if (!part.endsWith(')')) continue
+
+            layers.push(part.slice(6, -1).trim())
+          }
+
+          // Connect sheets together in a dependency graph
+          if (parent) {
+            let meta = { layers }
+            stylesheet.parents.add({ item: parent, meta })
+            parent.children.add({ item: stylesheet, meta })
+          }
+        },
+      },
+    },
+  ])
+
+  // Seed the map with all the known stylesheets, and queue up the processing of
+  // each incoming stylesheet.
+  for (let sheet of stylesheets) {
+    if (sheet.file) {
+      stylesheetsByFile.set(sheet.file, sheet)
+      processingQueue.push(() => processor.process(sheet.root, { from: sheet.file ?? undefined }))
+    }
+  }
+
+  // Process all the stylesheets from step 1
+  while (processingQueue.length > 0) {
+    let task = processingQueue.shift()!
+    await task()
+  }
+
+  // ---
+
+  let commonPath = process.cwd()
+
+  function pathToString(path: StylesheetConnection[]) {
+    let parts: string[] = []
+
+    for (let connection of path) {
+      if (!connection.item.file) continue
+
+      let filePath = connection.item.file.replace(commonPath, '')
+      let layers = connection.meta.layers.join(', ')
+
+      if (layers.length > 0) {
+        parts.push(`${filePath} (layers: ${layers})`)
+      } else {
+        parts.push(filePath)
+      }
+    }
+
+    return parts.join(' <- ')
+  }
+
+  let lines: string[] = []
+
+  for (let sheet of stylesheets) {
+    if (!sheet.file) continue
+
+    let { convertiblePaths, nonConvertiblePaths } = sheet.analyzeImportPaths()
+    let isAmbiguous = convertiblePaths.length > 0 && nonConvertiblePaths.length > 0
+
+    if (!isAmbiguous) continue
+
+    sheet.canMigrate = false
+
+    let filePath = sheet.file.replace(commonPath, '')
+
+    for (let path of convertiblePaths) {
+      lines.push(`- ${filePath} <- ${pathToString(path)}`)
+    }
+
+    for (let path of nonConvertiblePaths) {
+      lines.push(`- ${filePath} <- ${pathToString(path)}`)
+    }
+  }
+
+  if (lines.length === 0) {
+    let tailwindRootLeafs = new Set<Stylesheet>()
+
+    for (let sheet of stylesheets) {
+      // If the current file already contains `@config`, then we can assume it's
+      // a Tailwind CSS root file.
+      sheet.root.walkAtRules('config', () => {
+        sheet.isTailwindRoot = true
+        return false
+      })
+      if (sheet.isTailwindRoot) continue
+
+      // If an `@tailwind` at-rule, or `@import "tailwindcss"` is present,
+      // then we can assume it's a file where Tailwind CSS might be configured.
+      //
+      // However, if 2 or more stylesheets exist with these rules that share a
+      // common parent, then we want to mark the common parent as the root
+      // stylesheet instead.
+      sheet.root.walkAtRules((node) => {
+        if (
+          node.name === 'tailwind' ||
+          (node.name === 'import' && node.params.match(/^["']tailwindcss["']/)) ||
+          (node.name === 'import' && node.params.match(/^["']tailwindcss\/.*?["']$/))
+        ) {
+          sheet.isTailwindRoot = true
+          tailwindRootLeafs.add(sheet)
+        }
+      })
+    }
+
+    // Only a single Tailwind CSS root file exists, no need to do anything else.
+    if (tailwindRootLeafs.size <= 1) {
+      return
+    }
+
+    // Mark the common parent as the root file
+    {
+      // Group each sheet from tailwindRootLeafs by their common parent
+      let commonParents = new DefaultMap<Stylesheet, Set<Stylesheet>>(() => new Set<Stylesheet>())
+
+      // Seed common parents with leafs
+      for (let sheet of tailwindRootLeafs) {
+        commonParents.get(sheet).add(sheet)
+      }
+
+      // If any 2 common parents come from the same tree, then all children of
+      // parent A and parent B will be moved to the parent of parent A and
+      // parent B. Parent A and parent B will be removed.
+      let repeat = true
+      repeat: while (repeat) {
+        repeat = false
+
+        for (let [sheetA, childrenA] of commonParents) {
+          for (let [sheetB, childrenB] of commonParents) {
+            if (sheetA === sheetB) continue
+
+            // Ancestors from self to root. Reversed order so we find the
+            // nearest common parent first
+            //
+            // Including self because if you compare a sheet with its parent,
+            // then the parent is still the common sheet between the two. In
+            // this case, the parent is the root file.
+            let ancestorsA = [sheetA].concat(Array.from(sheetA.ancestors()).reverse())
+            let ancestorsB = [sheetB].concat(Array.from(sheetB.ancestors()).reverse())
+
+            for (let parentA of ancestorsA) {
+              for (let parentB of ancestorsB) {
+                if (parentA !== parentB) continue
+
+                // Found the parent
+                let parent = parentA
+
+                commonParents.delete(sheetA)
+                commonParents.delete(sheetB)
+
+                for (let child of childrenA) {
+                  commonParents.get(parent).add(child)
+                }
+
+                for (let child of childrenB) {
+                  commonParents.get(parent).add(child)
+                }
+
+                // Found a common parent between sheet A and sheet B. We can
+                // stop looking for more common parents between A and B, and
+                // continue with the next sheet.
+                repeat = true
+                continue repeat
+              }
+            }
+          }
+        }
+      }
+
+      // Mark the common parent as the Tailwind CSS root file, and remove the
+      // flag from each leaf.
+      for (let [parent, children] of commonParents) {
+        parent.isTailwindRoot = true
+
+        for (let child of children) {
+          if (parent === child) continue
+
+          child.isTailwindRoot = false
+        }
+      }
+      return
+    }
+  }
+
+  {
+    let error = `You have one or more stylesheets that are imported into a utility layer and non-utility layer.\n`
+    error += `We cannot convert stylesheets under these conditions. Please look at the following stylesheets:\n`
+
+    throw new Error(error + lines.join('\n'))
+  }
+}
+
+export async function linkConfigs(
+  stylesheets: Stylesheet[],
+  { configPath, base }: { configPath: string | null; base: string },
+) {
+  let rootStylesheets = stylesheets.filter((sheet) => sheet.isTailwindRoot)
+  if (rootStylesheets.length === 0) {
+    throw new Error(
+      `Cannot find any CSS files that reference Tailwind CSS.\nBefore your project can be upgraded you need to create a CSS file that imports Tailwind CSS or uses ${highlight('@tailwind')}.`,
+    )
+  }
+  let withoutAtConfig = rootStylesheets.filter((sheet) => {
+    let hasConfig = false
+    sheet.root.walkAtRules('config', (node) => {
+      let configPath = path.resolve(path.dirname(sheet.file!), node.params.slice(1, -1))
+      sheet.linkedConfigPath = configPath
+      hasConfig = true
+      return false
+    })
+    return !hasConfig
+  })
+
+  // All stylesheets have a `@config` directives
+  if (withoutAtConfig.length === 0) return
+
+  // Find the config file path for each stylesheet
+  let configPathBySheet = new Map<Stylesheet, string>()
+  let sheetByConfigPath = new DefaultMap<string, Set<Stylesheet>>(() => new Set())
+  for (let sheet of withoutAtConfig) {
+    if (!sheet.file) continue
+
+    let localConfigPath = configPath as string
+    if (configPath === null) {
+      localConfigPath = await detectConfigPath(path.dirname(sheet.file), base)
+    } else if (!path.isAbsolute(localConfigPath)) {
+      localConfigPath = path.resolve(base, localConfigPath)
+    }
+
+    configPathBySheet.set(sheet, localConfigPath)
+    sheetByConfigPath.get(localConfigPath).add(sheet)
+  }
+
+  let problematicStylesheets = new Set<Stylesheet>()
+  for (let sheets of sheetByConfigPath.values()) {
+    if (sheets.size > 1) {
+      for (let sheet of sheets) {
+        problematicStylesheets.add(sheet)
+      }
+    }
+  }
+
+  // There are multiple "root" files without `@config` directives. Manual
+  // intervention is needed to link to the correct Tailwind config files.
+  if (problematicStylesheets.size > 1) {
+    for (let sheet of problematicStylesheets) {
+      error(
+        `Could not determine configuration file for: ${highlight(relative(sheet.file!, base))}\nUpdate your stylesheet to use ${highlight('@config')} to specify the correct configuration file explicitly and then run the upgrade tool again.`,
+        { prefix: '↳ ' },
+      )
+    }
+
+    process.exit(1)
+  }
+
+  let relativePath = relative
+  for (let [sheet, configPath] of configPathBySheet) {
+    try {
+      if (!sheet || !sheet.file) return
+      success(
+        `Linked ${highlight(relativePath(configPath, base))} to ${highlight(relativePath(sheet.file, base))}`,
+        { prefix: '↳ ' },
+      )
+
+      // Link the `@config` directive to the root stylesheets
+
+      // Track the config file path on the stylesheet itself for easy access
+      // without traversing the CSS ast and finding the corresponding
+      // `@config` later.
+      sheet.linkedConfigPath = configPath
+
+      // Create a relative path from the current file to the config file.
+      let relative = path.relative(path.dirname(sheet.file), configPath)
+
+      // If the path points to a file in the same directory, `path.relative` will
+      // remove the leading `./` and we need to add it back in order to still
+      // consider the path relative
+      if (!relative.startsWith('.') && !path.isAbsolute(relative)) {
+        relative = './' + relative
+      }
+
+      relative = normalizePath(relative)
+
+      // Add the `@config` directive to the root stylesheet.
+      {
+        let target = sheet.root as postcss.Root | postcss.AtRule
+        let atConfig = postcss.atRule({ name: 'config', params: `'${relative}'` })
+
+        sheet.root.walkAtRules((node) => {
+          if (node.name === 'tailwind' || node.name === 'import') {
+            target = node
+          }
+        })
+
+        if (target.type === 'root') {
+          sheet.root.prepend(atConfig)
+        } else if (target.type === 'atrule') {
+          target.after(atConfig)
+        }
+      }
+    } catch (e: any) {
+      error('Could not load the configuration file: ' + e.message, { prefix: '↳ ' })
+      process.exit(1)
+    }
+  }
+}
+
+export async function split(stylesheets: Stylesheet[]) {
+  let stylesheetsById = new Map<StylesheetId, Stylesheet>()
+  let stylesheetsByFile = new Map<string, Stylesheet>()
+
+  for (let sheet of stylesheets) {
+    stylesheetsById.set(sheet.id, sheet)
+
+    if (sheet.file) {
+      stylesheetsByFile.set(sheet.file, sheet)
+    }
+  }
+
+  // Keep track of sheets that contain `@utility` rules
+  let requiresSplit = new Set<Stylesheet>()
+
+  for (let sheet of stylesheets) {
+    // Root files don't need to be split
+    if (sheet.isTailwindRoot) continue
+
+    let containsUtility = false
+    let containsUnsafe = sheet.layers().size > 0
+
+    walk(sheet.root, (node) => {
+      if (node.type === 'atrule' && node.name === 'utility') {
+        containsUtility = true
+      }
+
+      // Safe to keep without splitting
+      else if (
+        // An `@import "…" layer(…)` is safe
+        (node.type === 'atrule' && node.name === 'import' && node.params.includes('layer(')) ||
+        // @layer blocks are safe
+        (node.type === 'atrule' && node.name === 'layer') ||
+        // Comments are safe
+        node.type === 'comment'
+      ) {
+        return WalkAction.Skip
+      }
+
+      // Everything else is not safe, and requires a split
+      else {
+        containsUnsafe = true
+      }
+
+      // We already know we need to split this sheet
+      if (containsUtility && containsUnsafe) {
+        return WalkAction.Stop
+      }
+
+      return WalkAction.Skip
+    })
+
+    if (containsUtility && containsUnsafe) {
+      requiresSplit.add(sheet)
+    }
+  }
+
+  // Split every imported stylesheet into two parts
+  let utilitySheets = new Map<Stylesheet, Stylesheet>()
+
+  for (let sheet of stylesheets) {
+    // Ignore stylesheets that were not imported
+    if (!sheet.file) continue
+    if (sheet.parents.size === 0) continue
+
+    // Skip stylesheets that don't have utilities
+    // and don't have any children that have utilities
+    if (!requiresSplit.has(sheet)) {
+      if (!Array.from(sheet.descendants()).some((child) => requiresSplit.has(child))) {
+        continue
+      }
+    }
+
+    let utilities = postcss.root()
+
+    walk(sheet.root, (node) => {
+      if (node.type !== 'atrule') return
+      if (node.name !== 'utility') return
+
+      // `append` will move this node from the original sheet
+      // to the new utilities sheet
+      utilities.append(node)
+
+      return WalkAction.Skip
+    })
+
+    let newFileName = sheet.file.replace(/\.css$/, '.utilities.css')
+
+    let counter = 0
+
+    // If we already have a utility sheet with this name, we need to rename it
+    while (stylesheetsByFile.has(newFileName)) {
+      counter += 1
+      newFileName = sheet.file.replace(/\.css$/, `.utilities.${counter}.css`)
+    }
+
+    let utilitySheet = await Stylesheet.fromRoot(utilities, newFileName)
+
+    utilitySheet.extension = counter > 0 ? `.utilities.${counter}.css` : `.utilities.css`
+
+    utilitySheets.set(sheet, utilitySheet)
+    stylesheetsById.set(utilitySheet.id, utilitySheet)
+  }
+
+  // Make sure the utility sheets are linked to one another
+  for (let [normalSheet, utilitySheet] of utilitySheets) {
+    for (let parent of normalSheet.parents) {
+      let utilityParent = utilitySheets.get(parent.item)
+      if (!utilityParent) continue
+      utilitySheet.parents.add({
+        item: utilityParent,
+        meta: parent.meta,
+      })
+    }
+
+    for (let child of normalSheet.children) {
+      let utilityChild = utilitySheets.get(child.item)
+      if (!utilityChild) continue
+      utilitySheet.children.add({
+        item: utilityChild,
+        meta: child.meta,
+      })
+    }
+  }
+
+  for (let sheet of stylesheets) {
+    let utilitySheet = utilitySheets.get(sheet)
+    let utilityImports: Set<postcss.AtRule> = new Set()
+
+    for (let node of sheet.importRules) {
+      let sheetId = node.raws.tailwind_destination_sheet_id as StylesheetId | undefined
+
+      // This import rule does not point to a stylesheet
+      // which likely means it points to `node_modules`
+      if (!sheetId) continue
+
+      let originalDestination = stylesheetsById.get(sheetId)
+
+      // This import points to a stylesheet that no longer exists which likely
+      // means it was removed by the optimizer this will be cleaned up later
+      if (!originalDestination) continue
+
+      let utilityDestination = utilitySheets.get(originalDestination)
+
+      // A utility sheet doesn't exist for this import so it doesn't need
+      // to be processed
+      if (!utilityDestination) continue
+
+      let match = node.params.match(/(['"])(.*)\1/)
+      if (!match) return
+
+      let quote = match[1]
+      let id = match[2]
+
+      let newFile = id.replace(/\.css$/, utilityDestination.extension!)
+
+      // The import will just point to the new file without any media queries,
+      // layers, or other conditions because `@utility` MUST be top-level.
+      let newImport = node.clone({
+        params: `${quote}${newFile}${quote}`,
+        raws: {
+          tailwind_injected_layer: node.raws.tailwind_injected_layer,
+          tailwind_original_params: `${quote}${id}${quote}`,
+          tailwind_destination_sheet_id: utilityDestination.id,
+        },
+      })
+
+      if (utilitySheet) {
+        // If this import is intended to go into the utility sheet
+        // we'll collect it into a list to add later. If we don't'
+        // we'll end up adding them in reverse order.
+        utilityImports.add(newImport)
+      } else {
+        // This import will go immediately after the original import
+        node.after(newImport)
+      }
+    }
+
+    // Add imports to the top of the utility sheet if necessary
+    if (utilitySheet && utilityImports.size > 0) {
+      utilitySheet.root.prepend(Array.from(utilityImports))
+    }
+  }
+
+  // Tracks the at rules that import a given stylesheet
+  let importNodes = new DefaultMap<Stylesheet, Set<postcss.AtRule>>(() => new Set())
+
+  for (let sheet of stylesheetsById.values()) {
+    for (let node of sheet.importRules) {
+      let sheetId = node.raws.tailwind_destination_sheet_id as StylesheetId | undefined
+
+      // This import rule does not point to a stylesheet
+      if (!sheetId) continue
+
+      let destination = stylesheetsById.get(sheetId)
+
+      // This import rule does not point to a stylesheet that exists
+      // We'll remove it later
+      if (!destination) continue
+
+      importNodes.get(destination).add(node)
+    }
+  }
+
+  // At this point we've created many `{name}.utilities.css` files.
+  // If the original file _becomes_ empty after splitting that means that
+  // dedicated utility file is not required and we can move the utilities
+  // back to the original file.
+  //
+  // This could be done in one step but separating them makes it easier to
+  // reason about since the stylesheets are in a consistent state before we
+  // perform any cleanup tasks.
+  let list: Stylesheet[] = []
+
+  for (let sheet of stylesheets.slice()) {
+    for (let child of sheet.descendants()) {
+      list.push(child)
+    }
+
+    list.push(sheet)
+  }
+
+  for (let sheet of list) {
+    let utilitySheet = utilitySheets.get(sheet)
+
+    // This sheet was not split so there's nothing to do
+    if (!utilitySheet) continue
+
+    // This sheet did not become empty
+    if (!sheet.isEmpty) continue
+
+    // We have a sheet that became empty after splitting
+    // 1. Replace the sheet with it's utility sheet content
+    sheet.root = utilitySheet.root
+
+    // 2. Rewrite imports in parent sheets to point to the original sheet
+    // Ideally this wouldn't need to be _undone_ but instead only done once at the end
+    for (let node of importNodes.get(utilitySheet)) {
+      node.params = node.raws.tailwind_original_params as any
+    }
+
+    // 3. Remove the original import from the non-utility sheet
+    for (let node of importNodes.get(sheet)) {
+      node.remove()
+    }
+
+    // 3. Mark the utility sheet for removal
+    utilitySheets.delete(sheet)
+  }
+
+  stylesheets.push(...utilitySheets.values())
+}
diff --git a/packages/@tailwindcss-upgrade/src/stylesheet.ts b/packages/@tailwindcss-upgrade/src/stylesheet.ts
index 573413262..092d9414b 100644
--- a/packages/@tailwindcss-upgrade/src/stylesheet.ts
+++ b/packages/@tailwindcss-upgrade/src/stylesheet.ts
@@ -1,10 +1,8 @@
-import { __unstable__loadDesignSystem, compileAst } from '@tailwindcss/node'
 import * as fsSync from 'node:fs'
 import * as fs from 'node:fs/promises'
 import * as path from 'node:path'
 import * as util from 'node:util'
 import * as postcss from 'postcss'
-import { postCssAstToCssAst } from '../../@tailwindcss-postcss/src/ast'
 
 export type StylesheetId = string
 
@@ -265,28 +263,6 @@ export class Stylesheet {
     return false
   }
 
-  #compiler?: Promise<Awaited<ReturnType<typeof compileAst>> | null>
-  #designSystem?: Promise<Awaited<ReturnType<typeof __unstable__loadDesignSystem>> | null>
-
-  async compiler(): Promise<Awaited<ReturnType<typeof compileAst>> | null> {
-    if (!this.isTailwindRoot) return null
-    if (!this.file) return null
-
-    return (this.#compiler ??= compileAst(postCssAstToCssAst(this.root), {
-      base: path.dirname(this.file),
-      onDependency() {},
-    }))
-  }
-
-  async designSystem(): Promise<Awaited<ReturnType<typeof __unstable__loadDesignSystem>> | null> {
-    if (!this.isTailwindRoot) return null
-    if (!this.file) return null
-
-    return (this.#designSystem ??= __unstable__loadDesignSystem(this.root.toString(), {
-      base: path.dirname(this.file),
-    }))
-  }
-
   [util.inspect.custom]() {
     return {
       ...this,
diff --git a/packages/@tailwindcss-upgrade/src/template/candidates.test.ts b/packages/@tailwindcss-upgrade/src/template/candidates.test.ts
new file mode 100644
index 000000000..5ec45fa81
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/candidates.test.ts
@@ -0,0 +1,193 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { describe, expect, test } from 'vitest'
+import { extractRawCandidates, printCandidate } from './candidates'
+import { spliceChangesIntoString } from './splice-changes-into-string'
+
+let html = String.raw
+
+test('extracts candidates with positions from a template', async () => {
+  let content = html`
+    <div class="bg-blue-500 hover:focus:text-white [color:red]">
+      <button class="bg-blue-500 text-white">My button</button>
+    </div>
+  `
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  let candidates = await extractRawCandidates(content, 'html')
+  let validCandidates = candidates.filter(
+    ({ rawCandidate }) => designSystem.parseCandidate(rawCandidate).length > 0,
+  )
+
+  expect(validCandidates).toMatchInlineSnapshot(`
+    [
+      {
+        "end": 28,
+        "rawCandidate": "bg-blue-500",
+        "start": 17,
+      },
+      {
+        "end": 51,
+        "rawCandidate": "hover:focus:text-white",
+        "start": 29,
+      },
+      {
+        "end": 63,
+        "rawCandidate": "[color:red]",
+        "start": 52,
+      },
+      {
+        "end": 98,
+        "rawCandidate": "bg-blue-500",
+        "start": 87,
+      },
+      {
+        "end": 109,
+        "rawCandidate": "text-white",
+        "start": 99,
+      },
+    ]
+  `)
+})
+
+test('replaces the right positions for a candidate', async () => {
+  let content = html`
+    <h1>🤠👋</h1>
+    <div class="bg-blue-500" />
+  `
+
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  let candidates = await extractRawCandidates(content, 'html')
+
+  let candidate = candidates.find(
+    ({ rawCandidate }) => designSystem.parseCandidate(rawCandidate).length > 0,
+  )!
+
+  let migrated = spliceChangesIntoString(content, [
+    {
+      start: candidate.start,
+      end: candidate.end,
+      replacement: 'flex',
+    },
+  ])
+
+  expect(migrated).toMatchInlineSnapshot(`
+    "
+        <h1>🤠👋</h1>
+        <div class="flex" />
+      "
+  `)
+})
+
+const candidates = [
+  // Arbitrary candidates
+  ['[color:red]', '[color:red]'],
+  ['[color:red]/50', '[color:red]/50'],
+  ['[color:red]/[0.5]', '[color:red]/[0.5]'],
+  ['[color:red]/50!', '[color:red]/50!'],
+  ['![color:red]/50', '[color:red]/50!'],
+  ['[color:red]/[0.5]!', '[color:red]/[0.5]!'],
+
+  // Static candidates
+  ['box-border', 'box-border'],
+  ['underline!', 'underline!'],
+  ['!underline', 'underline!'],
+  ['-inset-full', '-inset-full'],
+
+  // Functional candidates
+  ['bg-red-500', 'bg-red-500'],
+  ['bg-red-500/50', 'bg-red-500/50'],
+  ['bg-red-500/[0.5]', 'bg-red-500/[0.5]'],
+  ['bg-red-500!', 'bg-red-500!'],
+  ['!bg-red-500', 'bg-red-500!'],
+  ['bg-[#0088cc]/50', 'bg-[#0088cc]/50'],
+  ['bg-[#0088cc]/[0.5]', 'bg-[#0088cc]/[0.5]'],
+  ['bg-[#0088cc]!', 'bg-[#0088cc]!'],
+  ['!bg-[#0088cc]', 'bg-[#0088cc]!'],
+  ['bg-[var(--spacing)-1px]', 'bg-[var(--spacing)-1px]'],
+  ['bg-[var(--spacing)_-_1px]', 'bg-[var(--spacing)-1px]'],
+  ['bg-[var(--_spacing)]', 'bg-(--_spacing)'],
+  ['bg-(--_spacing)', 'bg-(--_spacing)'],
+  ['bg-[var(--\_spacing)]', 'bg-(--_spacing)'],
+  ['bg-(--\_spacing)', 'bg-(--_spacing)'],
+  ['bg-[-1px_-1px]', 'bg-[-1px_-1px]'],
+  ['p-[round(to-zero,1px)]', 'p-[round(to-zero,1px)]'],
+  ['w-1/2', 'w-1/2'],
+  ['p-[calc((100vw-theme(maxWidth.2xl))_/_2)]', 'p-[calc((100vw-theme(maxWidth.2xl))/2)]'],
+
+  // Keep spaces in strings
+  ['content-["hello_world"]', 'content-["hello_world"]'],
+  ['content-[____"hello_world"___]', 'content-["hello_world"]'],
+
+  // Do not escape underscores for url() and CSS variable in var()
+  ['bg-[no-repeat_url(/image_13.png)]', 'bg-[no-repeat_url(/image_13.png)]'],
+  [
+    'bg-[var(--spacing-0_5,_var(--spacing-1_5,_3rem))]',
+    'bg-(--spacing-0_5,var(--spacing-1_5,3rem))',
+  ],
+]
+
+const variants = [
+  ['', ''], // no variant
+  ['*:', '*:'],
+  ['focus:', 'focus:'],
+  ['group-focus:', 'group-focus:'],
+
+  ['hover:focus:', 'hover:focus:'],
+  ['hover:group-focus:', 'hover:group-focus:'],
+  ['group-hover:focus:', 'group-hover:focus:'],
+  ['group-hover:group-focus:', 'group-hover:group-focus:'],
+
+  ['min-[10px]:', 'min-[10px]:'],
+
+  // Normalize spaces
+  ['min-[calc(1000px_+_12em)]:', 'min-[calc(1000px+12em)]:'],
+  ['min-[calc(1000px_+12em)]:', 'min-[calc(1000px+12em)]:'],
+  ['min-[calc(1000px+_12em)]:', 'min-[calc(1000px+12em)]:'],
+  ['min-[calc(1000px___+___12em)]:', 'min-[calc(1000px+12em)]:'],
+
+  ['peer-[&_p]:', 'peer-[&_p]:'],
+  ['peer-[&_p]:hover:', 'peer-[&_p]:hover:'],
+  ['hover:peer-[&_p]:', 'hover:peer-[&_p]:'],
+  ['hover:peer-[&_p]:focus:', 'hover:peer-[&_p]:focus:'],
+  ['peer-[&:hover]:peer-[&_p]:', 'peer-[&:hover]:peer-[&_p]:'],
+
+  ['[p]:', '[p]:'],
+  ['[_p_]:', '[p]:'],
+  ['has-[p]:', 'has-[p]:'],
+  ['has-[_p_]:', 'has-[p]:'],
+
+  // Simplify `&:is(p)` to `p`
+  ['[&:is(p)]:', '[p]:'],
+  ['[&:is(_p_)]:', '[p]:'],
+  ['has-[&:is(p)]:', 'has-[p]:'],
+  ['has-[&:is(_p_)]:', 'has-[p]:'],
+]
+
+let combinations: [string, string][] = []
+
+for (let [inputVariant, outputVariant] of variants) {
+  for (let [inputCandidate, outputCandidate] of candidates) {
+    combinations.push([`${inputVariant}${inputCandidate}`, `${outputVariant}${outputCandidate}`])
+  }
+}
+
+describe('printCandidate()', () => {
+  test.each(combinations)('%s -> %s', async (candidate: string, result: string) => {
+    let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+      base: __dirname,
+    })
+
+    let candidates = designSystem.parseCandidate(candidate)
+
+    // Sometimes we will have a functional and a static candidate for the same
+    // raw input string (e.g. `-inset-full`). Dedupe in this case.
+    let cleaned = new Set([...candidates].map((c) => printCandidate(designSystem, c)))
+
+    expect([...cleaned]).toEqual([result])
+  })
+})
diff --git a/packages/@tailwindcss-upgrade/src/template/candidates.ts b/packages/@tailwindcss-upgrade/src/template/candidates.ts
new file mode 100644
index 000000000..e292168a5
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/candidates.ts
@@ -0,0 +1,285 @@
+import { Scanner } from '@tailwindcss/oxide'
+import type { Candidate, Variant } from '../../../tailwindcss/src/candidate'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import * as ValueParser from '../../../tailwindcss/src/value-parser'
+
+export async function extractRawCandidates(
+  content: string,
+  extension: string = 'html',
+): Promise<{ rawCandidate: string; start: number; end: number }[]> {
+  let scanner = new Scanner({})
+  let result = scanner.getCandidatesWithPositions({ content, extension })
+
+  let candidates: { rawCandidate: string; start: number; end: number }[] = []
+  for (let { candidate: rawCandidate, position: start } of result) {
+    candidates.push({ rawCandidate, start, end: start + rawCandidate.length })
+  }
+  return candidates
+}
+
+export function printCandidate(designSystem: DesignSystem, candidate: Candidate) {
+  let parts: string[] = []
+
+  for (let variant of candidate.variants) {
+    parts.unshift(printVariant(variant))
+  }
+
+  // Handle prefix
+  if (designSystem.theme.prefix) {
+    parts.unshift(designSystem.theme.prefix)
+  }
+
+  let base: string = ''
+
+  // Handle static
+  if (candidate.kind === 'static') {
+    base += candidate.root
+  }
+
+  // Handle functional
+  if (candidate.kind === 'functional') {
+    base += candidate.root
+
+    if (candidate.value) {
+      if (candidate.value.kind === 'arbitrary') {
+        if (candidate.value !== null) {
+          let isVarValue = isVar(candidate.value.value)
+          let value = isVarValue ? candidate.value.value.slice(4, -1) : candidate.value.value
+          let [open, close] = isVarValue ? ['(', ')'] : ['[', ']']
+
+          if (candidate.value.dataType) {
+            base += `-${open}${candidate.value.dataType}:${printArbitraryValue(value)}${close}`
+          } else {
+            base += `-${open}${printArbitraryValue(value)}${close}`
+          }
+        }
+      } else if (candidate.value.kind === 'named') {
+        base += `-${candidate.value.value}`
+      }
+    }
+  }
+
+  // Handle arbitrary
+  if (candidate.kind === 'arbitrary') {
+    base += `[${candidate.property}:${printArbitraryValue(candidate.value)}]`
+  }
+
+  // Handle modifier
+  if (candidate.kind === 'arbitrary' || candidate.kind === 'functional') {
+    if (candidate.modifier) {
+      let isVarValue = isVar(candidate.modifier.value)
+      let value = isVarValue ? candidate.modifier.value.slice(4, -1) : candidate.modifier.value
+      let [open, close] = isVarValue ? ['(', ')'] : ['[', ']']
+
+      if (candidate.modifier.kind === 'arbitrary') {
+        base += `/${open}${printArbitraryValue(value)}${close}`
+      } else if (candidate.modifier.kind === 'named') {
+        base += `/${candidate.modifier.value}`
+      }
+    }
+  }
+
+  // Handle important
+  if (candidate.important) {
+    base += '!'
+  }
+
+  parts.push(base)
+
+  return parts.join(':')
+}
+
+function printVariant(variant: Variant) {
+  // Handle static variants
+  if (variant.kind === 'static') {
+    return variant.root
+  }
+
+  // Handle arbitrary variants
+  if (variant.kind === 'arbitrary') {
+    return `[${printArbitraryValue(simplifyArbitraryVariant(variant.selector))}]`
+  }
+
+  let base: string = ''
+
+  // Handle functional variants
+  if (variant.kind === 'functional') {
+    base += variant.root
+    if (variant.value) {
+      if (variant.value.kind === 'arbitrary') {
+        let isVarValue = isVar(variant.value.value)
+        let value = isVarValue ? variant.value.value.slice(4, -1) : variant.value.value
+        let [open, close] = isVarValue ? ['(', ')'] : ['[', ']']
+
+        base += `-${open}${printArbitraryValue(value)}${close}`
+      } else if (variant.value.kind === 'named') {
+        base += `-${variant.value.value}`
+      }
+    }
+  }
+
+  // Handle compound variants
+  if (variant.kind === 'compound') {
+    base += variant.root
+    base += '-'
+    base += printVariant(variant.variant)
+  }
+
+  // Handle modifiers
+  if (variant.kind === 'functional' || variant.kind === 'compound') {
+    if (variant.modifier) {
+      if (variant.modifier.kind === 'arbitrary') {
+        base += `/[${printArbitraryValue(variant.modifier.value)}]`
+      } else if (variant.modifier.kind === 'named') {
+        base += `/${variant.modifier.value}`
+      }
+    }
+  }
+
+  return base
+}
+
+function printArbitraryValue(input: string) {
+  let ast = ValueParser.parse(input)
+
+  let drop = new Set<ValueParser.ValueAstNode>()
+
+  ValueParser.walk(ast, (node, { parent }) => {
+    let parentArray = parent === null ? ast : (parent.nodes ?? [])
+
+    // Handle operators (e.g.: inside of `calc(…)`)
+    if (
+      node.kind === 'word' &&
+      // Operators
+      (node.value === '+' || node.value === '-' || node.value === '*' || node.value === '/')
+    ) {
+      let idx = parentArray.indexOf(node) ?? -1
+
+      // This should not be possible
+      if (idx === -1) return
+
+      let previous = parentArray[idx - 1]
+      if (previous?.kind !== 'separator' || previous.value !== ' ') return
+
+      let next = parentArray[idx + 1]
+      if (next?.kind !== 'separator' || next.value !== ' ') return
+
+      drop.add(previous)
+      drop.add(next)
+    }
+
+    // The value parser handles `/` as a separator in some scenarios. E.g.:
+    // `theme(colors.red/50%)`. Because of this, we have to handle this case
+    // separately.
+    else if (node.kind === 'separator' && node.value.trim() === '/') {
+      node.value = '/'
+    }
+
+    // Leading and trailing whitespace
+    else if (node.kind === 'separator' && node.value.length > 0 && node.value.trim() === '') {
+      if (parentArray[0] === node || parentArray[parentArray.length - 1] === node) {
+        drop.add(node)
+      }
+    }
+
+    // Whitespace around `,` separators can be removed.
+    // E.g.: `min(1px , 2px)` -> `min(1px,2px)`
+    else if (node.kind === 'separator' && node.value.trim() === ',') {
+      node.value = ','
+    }
+  })
+
+  if (drop.size > 0) {
+    ValueParser.walk(ast, (node, { replaceWith }) => {
+      if (drop.has(node)) {
+        drop.delete(node)
+        replaceWith([])
+      }
+    })
+  }
+
+  recursivelyEscapeUnderscores(ast)
+
+  return ValueParser.toCss(ast)
+}
+
+function simplifyArbitraryVariant(input: string) {
+  let ast = ValueParser.parse(input)
+
+  // &:is(…)
+  if (
+    ast.length === 3 &&
+    // &
+    ast[0].kind === 'word' &&
+    ast[0].value === '&' &&
+    // :
+    ast[1].kind === 'separator' &&
+    ast[1].value === ':' &&
+    // is(…)
+    ast[2].kind === 'function' &&
+    ast[2].value === 'is'
+  ) {
+    return ValueParser.toCss(ast[2].nodes)
+  }
+
+  return input
+}
+
+function recursivelyEscapeUnderscores(ast: ValueParser.ValueAstNode[]) {
+  for (let node of ast) {
+    switch (node.kind) {
+      case 'function': {
+        if (node.value === 'url' || node.value.endsWith('_url')) {
+          // Don't decode underscores in url() but do decode the function name
+          node.value = escapeUnderscore(node.value)
+          break
+        }
+
+        if (
+          node.value === 'var' ||
+          node.value.endsWith('_var') ||
+          node.value === 'theme' ||
+          node.value.endsWith('_theme')
+        ) {
+          node.value = escapeUnderscore(node.value)
+          for (let i = 0; i < node.nodes.length; i++) {
+            recursivelyEscapeUnderscores([node.nodes[i]])
+          }
+          break
+        }
+
+        node.value = escapeUnderscore(node.value)
+        recursivelyEscapeUnderscores(node.nodes)
+        break
+      }
+      case 'separator':
+        node.value = escapeUnderscore(node.value)
+        break
+      case 'word': {
+        // Dashed idents and variables `var(--my-var)` and `--my-var` should not
+        // have underscores escaped
+        if (node.value[0] !== '-' && node.value[1] !== '-') {
+          node.value = escapeUnderscore(node.value)
+        }
+        break
+      }
+      default:
+        never(node)
+    }
+  }
+}
+
+function isVar(value: string) {
+  let ast = ValueParser.parse(value)
+  return ast.length === 1 && ast[0].kind === 'function' && ast[0].value === 'var'
+}
+
+function never(value: never): never {
+  throw new Error(`Unexpected value: ${value}`)
+}
+
+function escapeUnderscore(value: string): string {
+  return value
+    .replaceAll('_', String.raw`\_`) // Escape underscores to keep them as-is
+    .replaceAll(' ', '_') // Replace spaces with underscores
+}
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts
new file mode 100644
index 000000000..c9b459d84
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.test.ts
@@ -0,0 +1,69 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { expect, test } from 'vitest'
+import { arbitraryValueToBareValue } from './arbitrary-value-to-bare-value'
+
+test.each([
+  ['aspect-[12/34]', 'aspect-12/34'],
+  ['aspect-[1.2/34]', 'aspect-[1.2/34]'],
+  ['col-start-[7]', 'col-start-7'],
+  ['flex-[2]', 'flex-2'], // `flex` is implemented as static and functional utilities
+
+  ['grid-cols-[subgrid]', 'grid-cols-subgrid'],
+  ['grid-rows-[subgrid]', 'grid-rows-subgrid'],
+
+  // Only 50-200% (inclusive) are valid:
+  // https://developer.mozilla.org/en-US/docs/Web/CSS/font-stretch#percentage
+  ['font-stretch-[50%]', 'font-stretch-50%'],
+  ['font-stretch-[50.5%]', 'font-stretch-[50.5%]'],
+  ['font-stretch-[201%]', 'font-stretch-[201%]'],
+  ['font-stretch-[49%]', 'font-stretch-[49%]'],
+  // Should stay as-is
+  ['font-stretch-[1/2]', 'font-stretch-[1/2]'],
+
+  // Bare value with % is valid for these utilities
+  ['from-[28%]', 'from-28%'],
+  ['via-[28%]', 'via-28%'],
+  ['to-[28%]', 'to-28%'],
+  ['from-[28.5%]', 'from-[28.5%]'],
+  ['via-[28.5%]', 'via-[28.5%]'],
+  ['to-[28.5%]', 'to-[28.5%]'],
+
+  // This test in itself is a bit flawed because `text-[1/2]` currently
+  // generates something. Converting it to `text-1/2` doesn't produce anything.
+  ['text-[1/2]', 'text-[1/2]'],
+
+  // Leading is special, because `leading-[123]` is the direct value of 123, but
+  // `leading-123` maps to `calc(--spacing(123))`.
+  ['leading-[1]', 'leading-none'],
+  ['leading-[123]', 'leading-[123]'],
+
+  ['data-[selected]:flex', 'data-selected:flex'],
+  ['data-[foo=bar]:flex', 'data-[foo=bar]:flex'],
+
+  ['supports-[gap]:flex', 'supports-gap:flex'],
+  ['supports-[display:grid]:flex', 'supports-[display:grid]:flex'],
+
+  ['group-data-[selected]:flex', 'group-data-selected:flex'],
+  ['group-data-[foo=bar]:flex', 'group-data-[foo=bar]:flex'],
+  ['group-has-data-[selected]:flex', 'group-has-data-selected:flex'],
+
+  ['aria-[selected]:flex', 'aria-[selected]:flex'],
+  ['aria-[selected="true"]:flex', 'aria-selected:flex'],
+  ['aria-[selected*="true"]:flex', 'aria-[selected*="true"]:flex'],
+
+  ['group-aria-[selected]:flex', 'group-aria-[selected]:flex'],
+  ['group-aria-[selected="true"]:flex', 'group-aria-selected:flex'],
+  ['group-has-aria-[selected]:flex', 'group-has-aria-[selected]:flex'],
+
+  ['max-lg:hover:data-[selected]:flex!', 'max-lg:hover:data-selected:flex!'],
+  [
+    'data-[selected]:aria-[selected="true"]:aspect-[12/34]',
+    'data-selected:aria-selected:aspect-12/34',
+  ],
+])('%s => %s', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  expect(arbitraryValueToBareValue(designSystem, {}, candidate)).toEqual(result)
+})
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts
new file mode 100644
index 000000000..64c06a8f3
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/arbitrary-value-to-bare-value.ts
@@ -0,0 +1,203 @@
+import { parseCandidate, type Candidate, type Variant } from '../../../../tailwindcss/src/candidate'
+import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
+import { isPositiveInteger } from '../../../../tailwindcss/src/utils/infer-data-type'
+import { segment } from '../../../../tailwindcss/src/utils/segment'
+import { printCandidate } from '../candidates'
+
+export function arbitraryValueToBareValue(
+  designSystem: DesignSystem,
+  _userConfig: Config,
+  rawCandidate: string,
+): string {
+  for (let candidate of parseCandidate(rawCandidate, designSystem)) {
+    let clone = structuredClone(candidate)
+    let changed = false
+
+    // Convert [subgrid] to subgrid
+    if (
+      clone.kind === 'functional' &&
+      clone.value?.kind === 'arbitrary' &&
+      clone.value.value === 'subgrid' &&
+      (clone.root === 'grid-cols' || clone.root == 'grid-rows')
+    ) {
+      changed = true
+      clone.value = {
+        kind: 'named',
+        value: 'subgrid',
+        fraction: null,
+      }
+    }
+
+    // Convert utilities that accept bare values ending in %
+    if (
+      clone.kind === 'functional' &&
+      clone.value?.kind === 'arbitrary' &&
+      clone.value.dataType === null &&
+      (clone.root === 'from' ||
+        clone.root === 'via' ||
+        clone.root === 'to' ||
+        clone.root === 'font-stretch')
+    ) {
+      if (clone.value.value.endsWith('%') && isPositiveInteger(clone.value.value.slice(0, -1))) {
+        let percentage = parseInt(clone.value.value)
+        if (
+          clone.root === 'from' ||
+          clone.root === 'via' ||
+          clone.root === 'to' ||
+          (clone.root === 'font-stretch' && percentage >= 50 && percentage <= 200)
+        ) {
+          changed = true
+          clone.value = {
+            kind: 'named',
+            value: clone.value.value,
+            fraction: null,
+          }
+        }
+      }
+    }
+
+    // Convert arbitrary values with positive integers to bare values
+    // Convert arbitrary values with fractions to bare values
+    else if (
+      clone.kind === 'functional' &&
+      clone.value?.kind === 'arbitrary' &&
+      clone.value.dataType === null
+    ) {
+      if (clone.root === 'leading') {
+        // leading-[1] -> leading-none
+        if (clone.value.value === '1') {
+          changed = true
+          clone.value = {
+            kind: 'named',
+            value: 'none',
+            fraction: null,
+          }
+        }
+
+        // Keep leading-[<number>] as leading-[<number>]
+        else {
+          continue
+        }
+      }
+
+      let parts = segment(clone.value.value, '/')
+      if (parts.every((part) => isPositiveInteger(part))) {
+        changed = true
+
+        let currentValue = clone.value
+        let currentModifier = clone.modifier
+
+        // E.g.: `col-start-[12]`
+        //                   ^^
+        if (parts.length === 1) {
+          clone.value = {
+            kind: 'named',
+            value: clone.value.value,
+            fraction: null,
+          }
+        }
+
+        // E.g.: `aspect-[12/34]`
+        //                ^^ ^^
+        else {
+          clone.value = {
+            kind: 'named',
+            value: parts[0],
+            fraction: clone.value.value,
+          }
+          clone.modifier = {
+            kind: 'named',
+            value: parts[1],
+          }
+        }
+
+        // Double check that the new value compiles correctly
+        if (designSystem.compileAstNodes(clone).length === 0) {
+          clone.value = currentValue
+          clone.modifier = currentModifier
+          changed = false
+        }
+      }
+    }
+
+    for (let variant of variants(clone)) {
+      // Convert `data-[selected]` to `data-selected`
+      if (
+        variant.kind === 'functional' &&
+        variant.root === 'data' &&
+        variant.value?.kind === 'arbitrary' &&
+        !variant.value.value.includes('=')
+      ) {
+        changed = true
+        variant.value = {
+          kind: 'named',
+          value: variant.value.value,
+        }
+      }
+
+      // Convert `aria-[selected="true"]` to `aria-selected`
+      else if (
+        variant.kind === 'functional' &&
+        variant.root === 'aria' &&
+        variant.value?.kind === 'arbitrary' &&
+        (variant.value.value.endsWith('=true') ||
+          variant.value.value.endsWith('="true"') ||
+          variant.value.value.endsWith("='true'"))
+      ) {
+        let [key, _value] = segment(variant.value.value, '=')
+        if (
+          // aria-[foo~="true"]
+          key[key.length - 1] === '~' ||
+          // aria-[foo|="true"]
+          key[key.length - 1] === '|' ||
+          // aria-[foo^="true"]
+          key[key.length - 1] === '^' ||
+          // aria-[foo$="true"]
+          key[key.length - 1] === '$' ||
+          // aria-[foo*="true"]
+          key[key.length - 1] === '*'
+        ) {
+          continue
+        }
+
+        changed = true
+        variant.value = {
+          kind: 'named',
+          value: variant.value.value.slice(0, variant.value.value.indexOf('=')),
+        }
+      }
+
+      // Convert `supports-[gap]` to `supports-gap`
+      else if (
+        variant.kind === 'functional' &&
+        variant.root === 'supports' &&
+        variant.value?.kind === 'arbitrary' &&
+        /^[a-z-][a-z0-9-]*$/i.test(variant.value.value)
+      ) {
+        changed = true
+        variant.value = {
+          kind: 'named',
+          value: variant.value.value,
+        }
+      }
+    }
+
+    return changed ? printCandidate(designSystem, clone) : rawCandidate
+  }
+
+  return rawCandidate
+}
+
+function* variants(candidate: Candidate) {
+  function* inner(variant: Variant): Iterable<Variant> {
+    yield variant
+    if (variant.kind === 'compound') {
+      yield* inner(variant.variant)
+    }
+  }
+
+  for (let variant of candidate.variants) {
+    yield* inner(variant)
+  }
+}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/automatic-var-injection.test.ts
similarity index 88%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/automatic-var-injection.test.ts
index 5da651d51..59b1523b7 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/automatic-var-injection.test.ts
@@ -1,6 +1,6 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import { expect, test } from 'vitest'
-import { migrateAutomaticVarInjection } from './migrate-automatic-var-injection'
+import { automaticVarInjection } from './automatic-var-injection'
 
 test.each([
   // Arbitrary candidates
@@ -40,11 +40,6 @@ test.each([
   ['w-[--spacing(5)]', 'w-[--spacing(5)]'],
   ['bg-[--theme(--color-red-500)]', 'bg-[--theme(--color-red-500)]'],
 
-  // Fallback values should be included inside the `var(…)` function
-  ['bg-[--my-color,red]', 'bg-(--my-color,red)'],
-  // Fallback values can contain CSS functions
-  ['bg-[--my-color,theme(spacing.1)]', 'bg-(--my-color,theme(spacing.1))'],
-
   // Some properties never had var() injection in v3.
   ['[scroll-timeline-name:--myTimeline]', '[scroll-timeline-name:--myTimeline]'],
   ['[timeline-scope:--myScope]', '[timeline-scope:--myScope]'],
@@ -63,6 +58,6 @@ test.each([
     base: __dirname,
   })
 
-  let migrated = migrateAutomaticVarInjection(designSystem, {}, candidate)
+  let migrated = automaticVarInjection(designSystem, {}, candidate)
   expect(migrated).toEqual(result)
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.ts b/packages/@tailwindcss-upgrade/src/template/codemods/automatic-var-injection.ts
similarity index 79%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/automatic-var-injection.ts
index 0ea3bd691..643d000c6 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/automatic-var-injection.ts
@@ -1,19 +1,18 @@
-import { cloneCandidate, type Candidate, type Variant } from '../../../../tailwindcss/src/candidate'
+import { walk, WalkAction } from '../../../../tailwindcss/src/ast'
+import { type Candidate, type Variant } from '../../../../tailwindcss/src/candidate'
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import type { Writable } from '../../../../tailwindcss/src/types'
-import * as ValueParser from '../../../../tailwindcss/src/value-parser'
-import { walk, WalkAction } from '../../../../tailwindcss/src/walk'
+import { printCandidate } from '../candidates'
 
-export function migrateAutomaticVarInjection(
+export function automaticVarInjection(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
 ): string {
   for (let readonlyCandidate of designSystem.parseCandidate(rawCandidate)) {
     // The below logic makes extended use of mutation. Since candidates in the
     // DesignSystem are cached, we can't mutate them directly.
-    let candidate = cloneCandidate(readonlyCandidate) as Writable<Candidate>
+    let candidate = structuredClone(readonlyCandidate) as Candidate
 
     let didChange = false
 
@@ -67,7 +66,7 @@ export function migrateAutomaticVarInjection(
     }
 
     if (didChange) {
-      return designSystem.printCandidate(candidate)
+      return printCandidate(designSystem, candidate)
     }
   }
   return rawCandidate
@@ -75,23 +74,9 @@ export function migrateAutomaticVarInjection(
 
 function injectVar(value: string): { value: string; didChange: boolean } {
   let didChange = false
-  if (value.startsWith('--')) {
-    // E.g.:
-    //
-    // - `--my-color` → `var(--my-color)`             Convert variable
-    // - `--my-color,red` → `var(--my-color,red)`     Convert variable with fallback
-    // - `--theme(color.red)` → `--theme(color.red)`  Do not convert functions
-    //
-    if (
-      // No `(` definitely means there is no function
-      !value.includes('(') ||
-      // There could be a function call in the fallback value, but it cannot be
-      // top-level, so we can safely check the first part
-      ValueParser.parse(value)[0]?.kind !== 'function'
-    ) {
-      value = `var(${value})`
-      didChange = true
-    }
+  if (value.startsWith('--') && !value.includes('(')) {
+    value = `var(${value})`
+    didChange = true
   } else if (value.startsWith(' --')) {
     value = value.slice(1)
     didChange = true
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/bg-gradient.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/bg-gradient.test.ts
new file mode 100644
index 000000000..3c42903c3
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/bg-gradient.test.ts
@@ -0,0 +1,22 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { expect, test } from 'vitest'
+import { bgGradient } from './bg-gradient'
+
+test.each([
+  ['bg-gradient-to-t', 'bg-linear-to-t'],
+  ['bg-gradient-to-tr', 'bg-linear-to-tr'],
+  ['bg-gradient-to-r', 'bg-linear-to-r'],
+  ['bg-gradient-to-br', 'bg-linear-to-br'],
+  ['bg-gradient-to-b', 'bg-linear-to-b'],
+  ['bg-gradient-to-bl', 'bg-linear-to-bl'],
+  ['bg-gradient-to-l', 'bg-linear-to-l'],
+  ['bg-gradient-to-tl', 'bg-linear-to-tl'],
+
+  ['max-lg:hover:bg-gradient-to-t', 'max-lg:hover:bg-linear-to-t'],
+])('%s => %s', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  expect(bgGradient(designSystem, {}, candidate)).toEqual(result)
+})
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/bg-gradient.ts b/packages/@tailwindcss-upgrade/src/template/codemods/bg-gradient.ts
new file mode 100644
index 000000000..02ad5590b
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/bg-gradient.ts
@@ -0,0 +1,27 @@
+import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
+import { printCandidate } from '../candidates'
+
+const DIRECTIONS = ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
+
+export function bgGradient(
+  designSystem: DesignSystem,
+  _userConfig: Config,
+  rawCandidate: string,
+): string {
+  for (let candidate of designSystem.parseCandidate(rawCandidate)) {
+    if (candidate.kind === 'static' && candidate.root.startsWith('bg-gradient-to-')) {
+      let direction = candidate.root.slice(15)
+
+      if (!DIRECTIONS.includes(direction)) {
+        continue
+      }
+
+      return printCandidate(designSystem, {
+        ...candidate,
+        root: `bg-linear-to-${direction}`,
+      })
+    }
+  }
+  return rawCandidate
+}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-handle-empty-arbitrary-values.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/handle-empty-arbitrary-values.test.ts
similarity index 68%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-handle-empty-arbitrary-values.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/handle-empty-arbitrary-values.test.ts
index bebd43343..b451fbf86 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-handle-empty-arbitrary-values.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/handle-empty-arbitrary-values.test.ts
@@ -1,9 +1,7 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateEmptyArbitraryValues } from './migrate-handle-empty-arbitrary-values'
-import { migratePrefix } from './migrate-prefix'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
+import { expect, test } from 'vitest'
+import { handleEmptyArbitraryValues } from './handle-empty-arbitrary-values'
+import { prefix } from './prefix'
 
 test.each([
   ['group-[]:flex', 'group-[&]:flex'],
@@ -16,7 +14,7 @@ test.each([
     base: __dirname,
   })
 
-  expect(migrateEmptyArbitraryValues(designSystem, {}, candidate)).toEqual(result)
+  expect(handleEmptyArbitraryValues(designSystem, {}, candidate)).toEqual(result)
 })
 
 test.each([
@@ -31,7 +29,7 @@ test.each([
   })
 
   expect(
-    [migrateEmptyArbitraryValues, migratePrefix].reduce(
+    [handleEmptyArbitraryValues, prefix].reduce(
       (acc, step) => step(designSystem, { prefix: 'tw-' }, acc),
       candidate,
     ),
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-handle-empty-arbitrary-values.ts b/packages/@tailwindcss-upgrade/src/template/codemods/handle-empty-arbitrary-values.ts
similarity index 91%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-handle-empty-arbitrary-values.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/handle-empty-arbitrary-values.ts
index 0058814d9..8f7dc5e6e 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-handle-empty-arbitrary-values.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/handle-empty-arbitrary-values.ts
@@ -1,9 +1,9 @@
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
 
-export function migrateEmptyArbitraryValues(
+export function handleEmptyArbitraryValues(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
 ): string {
   // We can parse the candidate, nothing to do
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/important.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/important.test.ts
new file mode 100644
index 000000000..6667d1e3a
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/important.test.ts
@@ -0,0 +1,68 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { expect, test } from 'vitest'
+import { important } from './important'
+
+test.each([
+  ['!flex', 'flex!'],
+  ['min-[calc(1000px+12em)]:!flex', 'min-[calc(1000px+12em)]:flex!'],
+  ['md:!block', 'md:block!'],
+
+  // Does not change non-important candidates
+  ['bg-blue-500', 'bg-blue-500'],
+  ['min-[calc(1000px+12em)]:flex', 'min-[calc(1000px+12em)]:flex'],
+])('%s => %s', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  expect(
+    important(designSystem, {}, candidate, {
+      contents: `"${candidate}"`,
+      start: 1,
+      end: candidate.length + 1,
+    }),
+  ).toEqual(result)
+})
+
+test('does not match false positives', async () => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  expect(
+    important(designSystem, {}, '!border', {
+      contents: `let notBorder = !border\n`,
+      start: 16,
+      end: 16 + '!border'.length,
+    }),
+  ).toEqual('!border')
+})
+
+test('does not replace classes in invalid positions', async () => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  function shouldNotReplace(example: string, candidate = '!border') {
+    expect(
+      important(designSystem, {}, candidate, {
+        contents: example,
+        start: example.indexOf(candidate),
+        end: example.indexOf(candidate) + candidate.length,
+      }),
+    ).toEqual(candidate)
+  }
+
+  shouldNotReplace(`let notBorder = !border    \n`)
+  shouldNotReplace(`{ "foo": !border.something + ""}\n`)
+  shouldNotReplace(`<div v-if="something && !border"></div>\n`)
+  shouldNotReplace(`<div v-else-if="something && !border"></div>\n`)
+  shouldNotReplace(`<div v-show="something && !border"></div>\n`)
+  shouldNotReplace(`<div v-if="!border || !border"></div>\n`)
+  shouldNotReplace(`<div v-else-if="!border || !border"></div>\n`)
+  shouldNotReplace(`<div v-show="!border || !border"></div>\n`)
+  shouldNotReplace(`<div v-if="!border"></div>\n`)
+  shouldNotReplace(`<div v-else-if="!border"></div>\n`)
+  shouldNotReplace(`<div v-show="!border"></div>\n`)
+  shouldNotReplace(`<div x-if="!border"></div>\n`)
+})
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/important.ts b/packages/@tailwindcss-upgrade/src/template/codemods/important.ts
new file mode 100644
index 000000000..4f2c6871f
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/important.ts
@@ -0,0 +1,49 @@
+import { parseCandidate } from '../../../../tailwindcss/src/candidate'
+import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
+import { printCandidate } from '../candidates'
+import { isSafeMigration } from '../is-safe-migration'
+
+// In v3 the important modifier `!` sits in front of the utility itself, not
+// before any of the variants. In v4, we want it to be at the end of the utility
+// so that it's always in the same location regardless of whether you used
+// variants or not.
+//
+// So this:
+//
+//   !flex md:!block
+//
+// Should turn into:
+//
+//   flex! md:block!
+export function important(
+  designSystem: DesignSystem,
+  _userConfig: Config,
+  rawCandidate: string,
+  location?: {
+    contents: string
+    start: number
+    end: number
+  },
+): string {
+  nextCandidate: for (let candidate of parseCandidate(rawCandidate, designSystem)) {
+    if (candidate.important && candidate.raw[candidate.raw.length - 1] !== '!') {
+      // The important migration is one of the most broad migrations with a high
+      // potential of matching false positives since `!` is a valid character in
+      // most programming languages. Since v4 is technically backward compatible
+      // with v3 in that it can read `!` in the front of the utility too, we err
+      // on the side of caution and only migrate candidates that we are certain
+      // are inside of a string.
+      if (location && !isSafeMigration(location)) {
+        continue nextCandidate
+      }
+
+      // The printCandidate function will already put the exclamation mark in
+      // the right place, so we just need to mark this candidate as requiring a
+      // migration.
+      return printCandidate(designSystem, candidate)
+    }
+  }
+
+  return rawCandidate
+}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-arbitrary-values.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-arbitrary-values.test.ts
similarity index 72%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-arbitrary-values.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/legacy-arbitrary-values.test.ts
index 8bb193b43..974cd0ca3 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-arbitrary-values.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-arbitrary-values.test.ts
@@ -1,6 +1,6 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import { expect, test } from 'vitest'
-import { migrateLegacyArbitraryValues } from './migrate-legacy-arbitrary-values'
+import { legacyArbitraryValues } from './legacy-arbitrary-values'
 
 test.each([
   ['grid-cols-[auto,1fr]', 'grid-cols-[auto_1fr]'],
@@ -11,5 +11,5 @@ test.each([
     base: __dirname,
   })
 
-  expect(migrateLegacyArbitraryValues(designSystem, {}, candidate)).toEqual(result)
+  expect(legacyArbitraryValues(designSystem, {}, candidate)).toEqual(result)
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-arbitrary-values.ts b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-arbitrary-values.ts
similarity index 72%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-arbitrary-values.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/legacy-arbitrary-values.ts
index 2bd7d2fd5..1c60526fd 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-arbitrary-values.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-arbitrary-values.ts
@@ -1,15 +1,16 @@
-import { cloneCandidate, parseCandidate } from '../../../../tailwindcss/src/candidate'
+import { parseCandidate } from '../../../../tailwindcss/src/candidate'
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
 import { segment } from '../../../../tailwindcss/src/utils/segment'
+import { printCandidate } from '../candidates'
 
-export function migrateLegacyArbitraryValues(
+export function legacyArbitraryValues(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
 ): string {
   for (let candidate of parseCandidate(rawCandidate, designSystem)) {
-    let clone = cloneCandidate(candidate)
+    let clone = structuredClone(candidate)
     let changed = false
 
     // Convert commas to spaces. E.g.: [auto,1fr] to [auto_1fr]
@@ -22,7 +23,7 @@ export function migrateLegacyArbitraryValues(
       clone.value.value = segment(clone.value.value, ',').join(' ')
     }
 
-    return changed ? designSystem.printCandidate(clone) : rawCandidate
+    return changed ? printCandidate(designSystem, clone) : rawCandidate
   }
 
   return rawCandidate
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/legacy-classes.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-classes.test.ts
new file mode 100644
index 000000000..6b8bbe4c6
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-classes.test.ts
@@ -0,0 +1,76 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { expect, test } from 'vitest'
+import { legacyClasses } from './legacy-classes'
+
+test.each([
+  ['shadow', 'shadow-sm'],
+  ['shadow-sm', 'shadow-xs'],
+  ['shadow-xs', 'shadow-2xs'],
+
+  ['inset-shadow', 'inset-shadow-sm'],
+  ['inset-shadow-sm', 'inset-shadow-xs'],
+  ['inset-shadow-xs', 'inset-shadow-2xs'],
+
+  ['drop-shadow', 'drop-shadow-sm'],
+  ['drop-shadow-sm', 'drop-shadow-xs'],
+
+  ['rounded', 'rounded-sm'],
+  ['rounded-sm', 'rounded-xs'],
+
+  ['blur', 'blur-sm'],
+  ['blur-sm', 'blur-xs'],
+
+  ['backdrop-blur', 'backdrop-blur-sm'],
+  ['backdrop-blur-sm', 'backdrop-blur-xs'],
+
+  ['ring', 'ring-3'],
+
+  ['blur!', 'blur-sm!'],
+  ['hover:blur', 'hover:blur-sm'],
+  ['hover:blur!', 'hover:blur-sm!'],
+
+  ['hover:blur-sm', 'hover:blur-xs'],
+  ['blur-sm!', 'blur-xs!'],
+  ['hover:blur-sm!', 'hover:blur-xs!'],
+])('%s => %s (%#)', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  expect(await legacyClasses(designSystem, {}, candidate)).toEqual(result)
+})
+
+test('does not replace classes in invalid positions', async () => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  async function shouldNotReplace(example: string, candidate = 'shadow') {
+    expect(
+      await legacyClasses(designSystem, {}, candidate, {
+        contents: example,
+        start: example.indexOf(candidate),
+        end: example.indexOf(candidate) + candidate.length,
+      }),
+    ).toEqual(candidate)
+  }
+
+  await shouldNotReplace(`let notShadow = shadow    \n`)
+  await shouldNotReplace(`{ "foo": shadow.something + ""}\n`)
+  await shouldNotReplace(`<div v-if="something && shadow"></div>\n`)
+  await shouldNotReplace(`<div v-else-if="something && shadow"></div>\n`)
+  await shouldNotReplace(`<div v-show="something && shadow"></div>\n`)
+  await shouldNotReplace(`<div v-if="shadow || shadow"></div>\n`)
+  await shouldNotReplace(`<div v-else-if="shadow || shadow"></div>\n`)
+  await shouldNotReplace(`<div v-show="shadow || shadow"></div>\n`)
+  await shouldNotReplace(`<div v-if="shadow"></div>\n`)
+  await shouldNotReplace(`<div v-else-if="shadow"></div>\n`)
+  await shouldNotReplace(`<div v-show="shadow"></div>\n`)
+  await shouldNotReplace(`<div x-if="shadow"></div>\n`)
+  await shouldNotReplace(`<div style={{filter: 'drop-shadow(30px 10px 4px #4444dd)'}}/>\n`)
+
+  // Next.js Image placeholder cases
+  await shouldNotReplace(`<Image placeholder="blur" src="/image.jpg" />`, 'blur')
+  await shouldNotReplace(`<Image placeholder={'blur'} src="/image.jpg" />`, 'blur')
+  await shouldNotReplace(`<Image placeholder={blur} src="/image.jpg" />`, 'blur')
+})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-classes.ts b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-classes.ts
similarity index 71%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-classes.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/legacy-classes.ts
index 2b088aa2e..8dad3967c 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-legacy-classes.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/legacy-classes.ts
@@ -1,12 +1,12 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import path from 'node:path'
 import url from 'node:url'
-import { cloneCandidate, type Candidate } from '../../../../tailwindcss/src/candidate'
+import type { Candidate } from '../../../../tailwindcss/src/candidate'
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
 import { DefaultMap } from '../../../../tailwindcss/src/utils/default-map'
-import * as version from '../../utils/version'
-import { baseCandidate } from './candidates'
+import { printCandidate } from '../candidates'
+import { isSafeMigration } from '../is-safe-migration'
 
 const __filename = url.fileURLToPath(import.meta.url)
 const __dirname = path.dirname(__filename)
@@ -33,8 +33,6 @@ const LEGACY_CLASS_MAP = new Map([
   ['backdrop-blur-sm', 'backdrop-blur-xs'],
 
   ['ring', 'ring-3'],
-
-  ['outline', 'outline-solid'],
 ])
 
 const THEME_KEYS = new Map([
@@ -59,7 +57,7 @@ const THEME_KEYS = new Map([
   ['backdrop-blur-sm', '--backdrop-blur-sm'],
   ['backdrop-blur-xs', '--backdrop-blur-xs'],
 
-  ['ring', '--default-ring-width'],
+  ['ring', '--ring-width'],
   ['ring-3', '--ring-width-3'],
 ])
 
@@ -67,28 +65,26 @@ const DESIGN_SYSTEMS = new DefaultMap((base) => {
   return __unstable__loadDesignSystem('@import "tailwindcss";', { base })
 })
 
-export async function migrateLegacyClasses(
+export async function legacyClasses(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
+  location?: {
+    contents: string
+    start: number
+    end: number
+  },
 ): Promise<string> {
-  // These migrations are only safe when migrating from v3 to v4.
-  //
-  // Migrating from `rounded` to `rounded-sm` once is fine (v3 -> v4). But if we
-  // migrate again (v4 -> v4), then `rounded-sm` would be migrated to
-  // `rounded-xs` which is incorrect because we already migrated this.
-  if (!version.isMajor(3)) {
-    return rawCandidate
-  }
-
   let defaultDesignSystem = await DESIGN_SYSTEMS.get(__dirname)
 
   function* migrate(rawCandidate: string) {
     for (let candidate of designSystem.parseCandidate(rawCandidate)) {
       // Create a base candidate string from the candidate.
       // E.g.: `hover:blur!` -> `blur`
-      let base = baseCandidate(candidate)
-      let baseCandidateString = designSystem.printCandidate(base)
+      let baseCandidate = structuredClone(candidate) as Candidate
+      baseCandidate.variants = []
+      baseCandidate.important = false
+      let baseCandidateString = printCandidate(designSystem, baseCandidate)
 
       // Find the new base candidate string. `blur` -> `blur-sm`
       let newBaseCandidateString = LEGACY_CLASS_MAP.get(baseCandidateString)
@@ -100,11 +96,12 @@ export async function migrateLegacyClasses(
 
       // Re-apply the variants and important flag from the original candidate.
       // E.g.: `hover:blur!` -> `blur` -> `blur-sm` -> `hover:blur-sm!`
-      let newCandidate = cloneCandidate(newBaseCandidate) as Candidate
+      let newCandidate = structuredClone(newBaseCandidate) as Candidate
       newCandidate.variants = candidate.variants
       newCandidate.important = candidate.important
 
       yield [
+        candidate,
         newCandidate,
         THEME_KEYS.get(baseCandidateString),
         THEME_KEYS.get(newBaseCandidateString),
@@ -112,7 +109,34 @@ export async function migrateLegacyClasses(
     }
   }
 
-  for (let [toCandidate, fromThemeKey, toThemeKey] of migrate(rawCandidate)) {
+  for (let [fromCandidate, toCandidate, fromThemeKey, toThemeKey] of migrate(rawCandidate)) {
+    // Every utility that has a simple representation (e.g.: `blur`, `radius`,
+    // etc.`) without variants or special characters _could_ be a potential
+    // problem during the migration.
+    let isPotentialProblematicClass = (() => {
+      if (fromCandidate.variants.length > 0) {
+        return false
+      }
+
+      if (fromCandidate.kind === 'arbitrary') {
+        return false
+      }
+
+      if (fromCandidate.kind === 'static') {
+        return !fromCandidate.root.includes('-')
+      }
+
+      if (fromCandidate.kind === 'functional') {
+        return fromCandidate.value === null || !fromCandidate.root.includes('-')
+      }
+
+      return false
+    })()
+
+    if (location && isPotentialProblematicClass && !isSafeMigration(location)) {
+      continue
+    }
+
     if (fromThemeKey && toThemeKey) {
       // Migrating something that resolves to a value in the theme.
       let customFrom = designSystem.resolveThemeValue(fromThemeKey, true)
@@ -137,7 +161,7 @@ export async function migrateLegacyClasses(
       }
     }
 
-    return designSystem.printCandidate(toCandidate)
+    return printCandidate(designSystem, toCandidate)
   }
 
   return rawCandidate
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-max-width-screen.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/max-width-screen.test.ts
similarity index 74%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-max-width-screen.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/max-width-screen.test.ts
index 91b57b3db..3e3151cbc 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-max-width-screen.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/max-width-screen.test.ts
@@ -1,12 +1,12 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import { expect, test } from 'vitest'
-import { migrateMaxWidthScreen } from './migrate-max-width-screen'
+import { maxWidthScreen } from './max-width-screen'
 
 test('converts max-w-screen-* to max-w-[theme(screens.*)] (so it will later be converted to the var injection)', async () => {
   let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
     base: __dirname,
   })
 
-  let migrated = migrateMaxWidthScreen(designSystem, {}, 'max-w-screen-md')
+  let migrated = maxWidthScreen(designSystem, {}, 'max-w-screen-md')
   expect(migrated).toMatchInlineSnapshot(`"max-w-[theme(screens.md)]"`)
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-max-width-screen.ts b/packages/@tailwindcss-upgrade/src/template/codemods/max-width-screen.ts
similarity index 81%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-max-width-screen.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/max-width-screen.ts
index cc9b7e9e2..4a14e5aad 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-max-width-screen.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/max-width-screen.ts
@@ -1,9 +1,10 @@
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
+import { printCandidate } from '../candidates'
 
-export function migrateMaxWidthScreen(
+export function maxWidthScreen(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
 ): string {
   for (let candidate of designSystem.parseCandidate(rawCandidate)) {
@@ -12,7 +13,7 @@ export function migrateMaxWidthScreen(
       candidate.root === 'max-w' &&
       candidate.value?.value.startsWith('screen-')
     ) {
-      return designSystem.printCandidate({
+      return printCandidate(designSystem, {
         ...candidate,
         value: {
           ...candidate.value,
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/modernize-arbitrary-values.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/modernize-arbitrary-values.test.ts
new file mode 100644
index 000000000..ec38d0864
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/modernize-arbitrary-values.test.ts
@@ -0,0 +1,138 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { expect, test } from 'vitest'
+import { handleEmptyArbitraryValues } from './handle-empty-arbitrary-values'
+import { modernizeArbitraryValues } from './modernize-arbitrary-values'
+import { prefix } from './prefix'
+
+test.each([
+  // Arbitrary variants
+  ['[[data-visible]]:flex', 'data-visible:flex'],
+  ['[&[data-visible]]:flex', 'data-visible:flex'],
+  ['[[data-visible]&]:flex', 'data-visible:flex'],
+  ['[&>[data-visible]]:flex', '*:data-visible:flex'],
+  ['[&_>_[data-visible]]:flex', '*:data-visible:flex'],
+  ['[&>*]:flex', '*:flex'],
+  ['[&_>_*]:flex', '*:flex'],
+
+  ['[&_[data-visible]]:flex', '**:data-visible:flex'],
+  ['[&_*]:flex', '**:flex'],
+
+  ['[&:first-child]:flex', 'first:flex'],
+  ['[&:not(:first-child)]:flex', 'not-first:flex'],
+
+  // in-* variants
+  ['[p_&]:flex', 'in-[p]:flex'],
+  ['[.foo_&]:flex', 'in-[.foo]:flex'],
+  ['[[data-visible]_&]:flex', 'in-data-visible:flex'],
+  // Multiple selectors, should stay as-is
+  ['[[data-foo][data-bar]_&]:flex', '[[data-foo][data-bar]_&]:flex'],
+  // Using `>` instead of ` ` should not be transformed:
+  ['[figure>&]:my-0', '[figure>&]:my-0'],
+  // Some extreme examples of what happens in the wild:
+  ['group-[]:flex', 'in-[.group]:flex'],
+  ['group-[]/name:flex', 'in-[.group\\/name]:flex'],
+
+  // Migrate `peer-[]` to a parsable `peer-[&]` instead:
+  ['peer-[]:flex', 'peer-[&]:flex'],
+  ['peer-[]/name:flex', 'peer-[&]/name:flex'],
+
+  // These shouldn't happen in the real world (because compound variants are
+  // new). But this could happen once we allow codemods to run in v4+ projects.
+  ['has-group-[]:flex', 'has-in-[.group]:flex'],
+  ['has-group-[]/name:flex', 'has-in-[.group\\/name]:flex'],
+  ['not-group-[]:flex', 'not-in-[.group]:flex'],
+  ['not-group-[]/name:flex', 'not-in-[.group\\/name]:flex'],
+
+  // nth-child
+  ['[&:nth-child(2)]:flex', 'nth-2:flex'],
+  ['[&:not(:nth-child(2))]:flex', 'not-nth-2:flex'],
+
+  ['[&:nth-child(-n+3)]:flex', 'nth-[-n+3]:flex'],
+  ['[&:not(:nth-child(-n+3))]:flex', 'not-nth-[-n+3]:flex'],
+  ['[&:nth-child(-n_+_3)]:flex', 'nth-[-n+3]:flex'],
+  ['[&:not(:nth-child(-n_+_3))]:flex', 'not-nth-[-n+3]:flex'],
+
+  // nth-last-child
+  ['[&:nth-last-child(2)]:flex', 'nth-last-2:flex'],
+  ['[&:not(:nth-last-child(2))]:flex', 'not-nth-last-2:flex'],
+
+  ['[&:nth-last-child(-n+3)]:flex', 'nth-last-[-n+3]:flex'],
+  ['[&:not(:nth-last-child(-n+3))]:flex', 'not-nth-last-[-n+3]:flex'],
+  ['[&:nth-last-child(-n_+_3)]:flex', 'nth-last-[-n+3]:flex'],
+  ['[&:not(:nth-last-child(-n_+_3))]:flex', 'not-nth-last-[-n+3]:flex'],
+
+  // nth-child odd/even
+  ['[&:nth-child(odd)]:flex', 'odd:flex'],
+  ['[&:not(:nth-child(odd))]:flex', 'even:flex'],
+  ['[&:nth-child(even)]:flex', 'even:flex'],
+  ['[&:not(:nth-child(even))]:flex', 'odd:flex'],
+
+  // Keep multiple attribute selectors as-is
+  ['[[data-visible][data-dark]]:flex', '[[data-visible][data-dark]]:flex'],
+
+  // Complex attribute selectors with operators, quotes and insensitivity flags
+  ['[[data-url*="example"]]:flex', 'data-[url*="example"]:flex'],
+  ['[[data-url$=".com"_i]]:flex', 'data-[url$=".com"_i]:flex'],
+  ['[[data-url$=.com_i]]:flex', 'data-[url$=.com_i]:flex'],
+
+  // Attribute selector wrapped in `&:is(…)`
+  ['[&:is([data-visible])]:flex', 'data-visible:flex'],
+
+  // Compound arbitrary variants
+  ['has-[[data-visible]]:flex', 'has-data-visible:flex'],
+  ['has-[&:is([data-visible])]:flex', 'has-data-visible:flex'],
+  ['has-[&>[data-visible]]:flex', 'has-[&>[data-visible]]:flex'],
+
+  ['has-[[data-slot=description]]:flex', 'has-data-[slot=description]:flex'],
+  ['has-[&:is([data-slot=description])]:flex', 'has-data-[slot=description]:flex'],
+
+  ['has-[[aria-visible="true"]]:flex', 'has-aria-visible:flex'],
+  ['has-[[aria-visible]]:flex', 'has-aria-[visible]:flex'],
+
+  ['has-[&:not(:nth-child(even))]:flex', 'has-odd:flex'],
+])('%s => %s (%#)', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss";', {
+    base: __dirname,
+  })
+
+  expect(
+    [handleEmptyArbitraryValues, modernizeArbitraryValues].reduce(
+      (acc, step) => step(designSystem, {}, acc),
+      candidate,
+    ),
+  ).toEqual(result)
+})
+
+test.each([
+  // Should not prefix classes in arbitrary values
+  ['[.foo_&]:tw-flex', 'tw:in-[.foo]:flex'],
+
+  // Should migrate `.group` classes
+  ['group-[]:tw-flex', 'tw:in-[.tw\\:group]:flex'],
+  ['group-[]/name:tw-flex', 'tw:in-[.tw\\:group\\/name]:flex'],
+
+  // Migrate `peer-[]` to a parsable `peer-[&]` instead:
+  ['peer-[]:tw-flex', 'tw:peer-[&]:flex'],
+  ['peer-[]/name:tw-flex', 'tw:peer-[&]/name:flex'],
+
+  // However, `.group` inside of an arbitrary variant should not be prefixed:
+  ['[.group_&]:tw-flex', 'tw:in-[.group]:flex'],
+
+  // These shouldn't happen in the real world (because compound variants are
+  // new). But this could happen once we allow codemods to run in v4+ projects.
+  ['has-group-[]:tw-flex', 'tw:has-in-[.tw\\:group]:flex'],
+  ['has-group-[]/name:tw-flex', 'tw:has-in-[.tw\\:group\\/name]:flex'],
+  ['not-group-[]:tw-flex', 'tw:not-in-[.tw\\:group]:flex'],
+  ['not-group-[]/name:tw-flex', 'tw:not-in-[.tw\\:group\\/name]:flex'],
+])('%s => %s (%#)', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem('@import "tailwindcss" prefix(tw);', {
+    base: __dirname,
+  })
+
+  expect(
+    [handleEmptyArbitraryValues, prefix, modernizeArbitraryValues].reduce(
+      (acc, step) => step(designSystem, { prefix: 'tw-' }, acc),
+      candidate,
+    ),
+  ).toEqual(result)
+})
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/modernize-arbitrary-values.ts b/packages/@tailwindcss-upgrade/src/template/codemods/modernize-arbitrary-values.ts
new file mode 100644
index 000000000..3d90351b1
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/modernize-arbitrary-values.ts
@@ -0,0 +1,402 @@
+import SelectorParser from 'postcss-selector-parser'
+import { parseCandidate, type Candidate, type Variant } from '../../../../tailwindcss/src/candidate'
+import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
+import { isPositiveInteger } from '../../../../tailwindcss/src/utils/infer-data-type'
+import { printCandidate } from '../candidates'
+
+function memcpy<T extends object, U extends object | null>(target: T, source: U): U {
+  // Clear out the target object, otherwise inspecting the final object will
+  // look very confusing.
+  for (let key in target) delete target[key]
+
+  return Object.assign(target, source)
+}
+
+export function modernizeArbitraryValues(
+  designSystem: DesignSystem,
+  _userConfig: Config,
+  rawCandidate: string,
+): string {
+  for (let candidate of parseCandidate(rawCandidate, designSystem)) {
+    let clone = structuredClone(candidate)
+    let changed = false
+
+    for (let [variant, parent] of variants(clone)) {
+      // Forward modifier from the root to the compound variant
+      if (
+        variant.kind === 'compound' &&
+        (variant.root === 'has' || variant.root === 'not' || variant.root === 'in')
+      ) {
+        if (variant.modifier !== null) {
+          if ('modifier' in variant.variant) {
+            variant.variant.modifier = variant.modifier
+            variant.modifier = null
+          }
+        }
+      }
+
+      // Promote `group-[]:flex` to `in-[.group]:flex`
+      //                ^^ Yes, this is empty
+      // Promote `group-[]/name:flex` to `in-[.group\/name]:flex`
+      if (
+        variant.kind === 'compound' &&
+        variant.root === 'group' &&
+        variant.variant.kind === 'arbitrary' &&
+        variant.variant.selector === '&'
+      ) {
+        // `group-[]`
+        if (variant.modifier === null) {
+          changed = true
+          memcpy(
+            variant,
+            designSystem.parseVariant(
+              designSystem.theme.prefix
+                ? `in-[.${designSystem.theme.prefix}\\:group]`
+                : 'in-[.group]',
+            ),
+          )
+        }
+
+        // `group-[]/name`
+        else if (variant.modifier.kind === 'named') {
+          changed = true
+          memcpy(
+            variant,
+            designSystem.parseVariant(
+              designSystem.theme.prefix
+                ? `in-[.${designSystem.theme.prefix}\\:group\\/${variant.modifier.value}]`
+                : `in-[.group\\/${variant.modifier.value}]`,
+            ),
+          )
+        }
+        continue
+      }
+
+      // Expecting an arbitrary variant
+      if (variant.kind === 'arbitrary') {
+        // Expecting a non-relative arbitrary variant
+        if (variant.relative) continue
+
+        let ast = SelectorParser().astSync(variant.selector)
+
+        // Expecting a single selector node
+        if (ast.nodes.length !== 1) continue
+
+        // `[&>*]` can be replaced with `*`
+        if (
+          // Only top-level, so `has-[&>*]` is not supported
+          parent === null &&
+          // [&_>_*]:flex
+          //  ^ ^ ^
+          ast.nodes[0].length === 3 &&
+          ast.nodes[0].nodes[0].type === 'nesting' &&
+          ast.nodes[0].nodes[0].value === '&' &&
+          ast.nodes[0].nodes[1].type === 'combinator' &&
+          ast.nodes[0].nodes[1].value === '>' &&
+          ast.nodes[0].nodes[2].type === 'universal'
+        ) {
+          changed = true
+          memcpy(variant, designSystem.parseVariant('*'))
+          continue
+        }
+
+        // `[&_*]` can be replaced with `**`
+        if (
+          // Only top-level, so `has-[&_*]` is not supported
+          parent === null &&
+          // [&_*]:flex
+          //  ^ ^
+          ast.nodes[0].length === 3 &&
+          ast.nodes[0].nodes[0].type === 'nesting' &&
+          ast.nodes[0].nodes[0].value === '&' &&
+          ast.nodes[0].nodes[1].type === 'combinator' &&
+          ast.nodes[0].nodes[1].value === ' ' &&
+          ast.nodes[0].nodes[2].type === 'universal'
+        ) {
+          changed = true
+          memcpy(variant, designSystem.parseVariant('**'))
+          continue
+        }
+
+        // `in-*` variant. If the selector ends with ` &`, we can convert it to an
+        // `in-*` variant.
+        //
+        // E.g.: `[[data-visible]_&]` => `in-data-visible`
+        if (
+          // Only top-level, so `in-[&_[data-visible]]` is not supported
+          parent === null &&
+          // [[data-visible]___&]:flex
+          //  ^^^^^^^^^^^^^^ ^ ^
+          ast.nodes[0].nodes.length === 3 &&
+          ast.nodes[0].nodes[1].type === 'combinator' &&
+          ast.nodes[0].nodes[1].value === ' ' &&
+          ast.nodes[0].nodes[2].type === 'nesting'
+        ) {
+          ast.nodes[0].nodes.pop() // Remove the nesting node
+          ast.nodes[0].nodes.pop() // Remove the combinator
+
+          changed = true
+          // When handling a compound like `in-[[data-visible]]`, we will first
+          // handle `[[data-visible]]`, then the parent `in-*` part. This means
+          // that we can convert `[[data-visible]_&]` to `in-[[data-visible]]`.
+          //
+          // Later this gets converted to `in-data-visible`.
+          memcpy(variant, designSystem.parseVariant(`in-[${ast.toString()}]`))
+          continue
+        }
+
+        let prefixedVariant: Variant | null = null
+
+        // Handling a child combinator. E.g.: `[&>[data-visible]]` => `*:data-visible`
+        if (
+          // Only top-level, so `has-[&>[data-visible]]` is not supported
+          parent === null &&
+          // [&_>_[data-visible]]:flex
+          //  ^ ^ ^^^^^^^^^^^^^^
+          ast.nodes[0].length === 3 &&
+          ast.nodes[0].nodes[0].type === 'nesting' &&
+          ast.nodes[0].nodes[0].value === '&' &&
+          ast.nodes[0].nodes[1].type === 'combinator' &&
+          ast.nodes[0].nodes[1].value === '>' &&
+          ast.nodes[0].nodes[2].type === 'attribute'
+        ) {
+          ast.nodes[0].nodes = [ast.nodes[0].nodes[2]]
+          prefixedVariant = designSystem.parseVariant('*')
+        }
+
+        // Handling a grand child combinator. E.g.: `[&_[data-visible]]` => `**:data-visible`
+        if (
+          // Only top-level, so `has-[&_[data-visible]]` is not supported
+          parent === null &&
+          // [&_[data-visible]]:flex
+          //  ^ ^^^^^^^^^^^^^^
+          ast.nodes[0].length === 3 &&
+          ast.nodes[0].nodes[0].type === 'nesting' &&
+          ast.nodes[0].nodes[0].value === '&' &&
+          ast.nodes[0].nodes[1].type === 'combinator' &&
+          ast.nodes[0].nodes[1].value === ' ' &&
+          ast.nodes[0].nodes[2].type === 'attribute'
+        ) {
+          ast.nodes[0].nodes = [ast.nodes[0].nodes[2]]
+          prefixedVariant = designSystem.parseVariant('**')
+        }
+
+        // Filter out `&`. E.g.: `&[data-foo]` => `[data-foo]`
+        let selectorNodes = ast.nodes[0].filter((node) => node.type !== 'nesting')
+
+        // Expecting a single selector (normal selector or attribute selector)
+        if (selectorNodes.length !== 1) continue
+
+        let target = selectorNodes[0]
+        if (target.type === 'pseudo' && target.value === ':is') {
+          // Expecting a single selector node
+          if (target.nodes.length !== 1) continue
+
+          // Expecting a single attribute selector
+          if (target.nodes[0].nodes.length !== 1) continue
+
+          // Unwrap the selector from inside `&:is(…)`
+          target = target.nodes[0].nodes[0]
+        }
+
+        // Expecting a pseudo selector
+        if (target.type === 'pseudo') {
+          let targetNode = target
+          let compoundNot = false
+          if (target.value === ':not') {
+            compoundNot = true
+            if (target.nodes.length !== 1) continue
+            if (target.nodes[0].type !== 'selector') continue
+            if (target.nodes[0].nodes.length !== 1) continue
+            if (target.nodes[0].nodes[0].type !== 'pseudo') continue
+
+            targetNode = target.nodes[0].nodes[0]
+          }
+
+          let newVariant = ((value) => {
+            //
+            if (value === ':first-letter') return 'first-letter'
+            else if (value === ':first-line') return 'first-line'
+            //
+            else if (value === ':file-selector-button') return 'file'
+            else if (value === ':placeholder') return 'placeholder'
+            else if (value === ':backdrop') return 'backdrop'
+            // Positional
+            else if (value === ':first-child') return 'first'
+            else if (value === ':last-child') return 'last'
+            else if (value === ':only-child') return 'only'
+            else if (value === ':first-of-type') return 'first-of-type'
+            else if (value === ':last-of-type') return 'last-of-type'
+            else if (value === ':only-of-type') return 'only-of-type'
+            // State
+            else if (value === ':visited') return 'visited'
+            else if (value === ':target') return 'target'
+            // Forms
+            else if (value === ':default') return 'default'
+            else if (value === ':checked') return 'checked'
+            else if (value === ':indeterminate') return 'indeterminate'
+            else if (value === ':placeholder-shown') return 'placeholder-shown'
+            else if (value === ':autofill') return 'autofill'
+            else if (value === ':optional') return 'optional'
+            else if (value === ':required') return 'required'
+            else if (value === ':valid') return 'valid'
+            else if (value === ':invalid') return 'invalid'
+            else if (value === ':in-range') return 'in-range'
+            else if (value === ':out-of-range') return 'out-of-range'
+            else if (value === ':read-only') return 'read-only'
+            // Content
+            else if (value === ':empty') return 'empty'
+            // Interactive
+            else if (value === ':focus-within') return 'focus-within'
+            else if (value === ':focus') return 'focus'
+            else if (value === ':focus-visible') return 'focus-visible'
+            else if (value === ':active') return 'active'
+            else if (value === ':enabled') return 'enabled'
+            else if (value === ':disabled') return 'disabled'
+            //
+            if (
+              value === ':nth-child' &&
+              targetNode.nodes.length === 1 &&
+              targetNode.nodes[0].nodes.length === 1 &&
+              targetNode.nodes[0].nodes[0].type === 'tag' &&
+              targetNode.nodes[0].nodes[0].value === 'odd'
+            ) {
+              if (compoundNot) {
+                compoundNot = false
+                return 'even'
+              }
+              return 'odd'
+            }
+            if (
+              value === ':nth-child' &&
+              targetNode.nodes.length === 1 &&
+              targetNode.nodes[0].nodes.length === 1 &&
+              targetNode.nodes[0].nodes[0].type === 'tag' &&
+              targetNode.nodes[0].nodes[0].value === 'even'
+            ) {
+              if (compoundNot) {
+                compoundNot = false
+                return 'odd'
+              }
+              return 'even'
+            }
+
+            for (let [selector, variantName] of [
+              [':nth-child', 'nth'],
+              [':nth-last-child', 'nth-last'],
+              [':nth-of-type', 'nth-of-type'],
+              [':nth-last-of-type', 'nth-of-last-type'],
+            ]) {
+              if (value === selector && targetNode.nodes.length === 1) {
+                if (
+                  targetNode.nodes[0].nodes.length === 1 &&
+                  targetNode.nodes[0].nodes[0].type === 'tag' &&
+                  isPositiveInteger(targetNode.nodes[0].nodes[0].value)
+                ) {
+                  return `${variantName}-${targetNode.nodes[0].nodes[0].value}`
+                }
+
+                return `${variantName}-[${targetNode.nodes[0].toString()}]`
+              }
+            }
+
+            return null
+          })(targetNode.value)
+
+          if (newVariant === null) continue
+
+          // Add `not-` prefix
+          if (compoundNot) newVariant = `not-${newVariant}`
+
+          let parsed = designSystem.parseVariant(newVariant)
+          if (parsed === null) continue
+
+          // Update original variant
+          changed = true
+          memcpy(variant, parsed)
+        }
+
+        // Expecting an attribute selector
+        else if (target.type === 'attribute') {
+          // Attribute selectors
+          let attributeKey = target.attribute
+          let attributeValue = target.value
+            ? target.quoted
+              ? `${target.quoteMark}${target.value}${target.quoteMark}`
+              : target.value
+            : null
+
+          // Insensitive attribute selectors. E.g.: `[data-foo="value" i]`
+          //                                                           ^
+          if (target.insensitive && attributeValue) {
+            attributeValue += ' i'
+          }
+
+          let operator = target.operator ?? '='
+
+          // Migrate `data-*`
+          if (attributeKey.startsWith('data-')) {
+            changed = true
+            attributeKey = attributeKey.slice(5) // Remove `data-`
+            memcpy(variant, {
+              kind: 'functional',
+              root: 'data',
+              modifier: null,
+              value:
+                attributeValue === null
+                  ? { kind: 'named', value: attributeKey }
+                  : { kind: 'arbitrary', value: `${attributeKey}${operator}${attributeValue}` },
+            } satisfies Variant)
+          }
+
+          // Migrate `aria-*`
+          else if (attributeKey.startsWith('aria-')) {
+            changed = true
+            attributeKey = attributeKey.slice(5) // Remove `aria-`
+            memcpy(variant, {
+              kind: 'functional',
+              root: 'aria',
+              modifier: null,
+              value:
+                attributeValue === null
+                  ? { kind: 'arbitrary', value: attributeKey } // aria-[foo]
+                  : operator === '=' && target.value === 'true' && !target.insensitive
+                    ? { kind: 'named', value: attributeKey } // aria-[foo="true"] or aria-[foo='true'] or aria-[foo=true]
+                    : { kind: 'arbitrary', value: `${attributeKey}${operator}${attributeValue}` }, // aria-[foo~="true"], aria-[foo|="true"], …
+            } satisfies Variant)
+          }
+        }
+
+        if (prefixedVariant) {
+          let idx = clone.variants.indexOf(variant)
+          if (idx === -1) continue
+
+          // Ensure we inject the prefixed variant
+          clone.variants.splice(idx, 1, variant, prefixedVariant)
+        }
+      }
+    }
+
+    return changed ? printCandidate(designSystem, clone) : rawCandidate
+  }
+
+  return rawCandidate
+}
+
+function* variants(candidate: Candidate) {
+  function* inner(
+    variant: Variant,
+    parent: Extract<Variant, { kind: 'compound' }> | null = null,
+  ): Iterable<[Variant, Extract<Variant, { kind: 'compound' }> | null]> {
+    yield [variant, parent]
+
+    if (variant.kind === 'compound') {
+      yield* inner(variant.variant, variant)
+    }
+  }
+
+  for (let variant of candidate.variants) {
+    yield* inner(variant, null)
+  }
+}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/prefix.test.ts
similarity index 75%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/prefix.test.ts
index f47e181af..a7ad6a03e 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/prefix.test.ts
@@ -1,8 +1,6 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { describe, expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migratePrefix } from './migrate-prefix'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
+import { describe, expect, test } from 'vitest'
+import { prefix } from './prefix'
 
 describe('for projects with configured prefix', () => {
   test.each([
@@ -33,7 +31,7 @@ describe('for projects with configured prefix', () => {
       base: __dirname,
     })
 
-    expect(migratePrefix(designSystem, { prefix: 'tw-' }, candidate)).toEqual(result)
+    expect(prefix(designSystem, { prefix: 'tw-' }, candidate)).toEqual(result)
   })
 })
 
@@ -42,7 +40,7 @@ test('can handle complex prefix separators', async () => {
     base: __dirname,
   })
 
-  expect(migratePrefix(designSystem, { prefix: 'tw__' }, 'tw__flex')).toEqual('tw:flex')
+  expect(prefix(designSystem, { prefix: 'tw__' }, 'tw__flex')).toEqual('tw:flex')
 })
 
 describe('for projects without configured prefix', () => {
@@ -51,6 +49,6 @@ describe('for projects without configured prefix', () => {
       base: __dirname,
     })
 
-    expect(migratePrefix(designSystem, {}, 'tw-flex')).toEqual('tw-flex')
+    expect(prefix(designSystem, {}, 'tw-flex')).toEqual('tw-flex')
   })
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.ts b/packages/@tailwindcss-upgrade/src/template/codemods/prefix.ts
similarity index 79%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/prefix.ts
index 776032850..47a377239 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/prefix.ts
@@ -1,34 +1,21 @@
-import { decl } from '../../../../tailwindcss/src/ast'
 import { parseCandidate, type Candidate } from '../../../../tailwindcss/src/candidate'
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
 import { segment } from '../../../../tailwindcss/src/utils/segment'
-import * as version from '../../utils/version'
+import { printCandidate } from '../candidates'
 
 let seenDesignSystems = new WeakSet<DesignSystem>()
 
-export function migratePrefix(
+export function prefix(
   designSystem: DesignSystem,
-  userConfig: Config | null,
+  userConfig: Config,
   rawCandidate: string,
 ): string {
   if (!designSystem.theme.prefix) return rawCandidate
-  if (!userConfig) return rawCandidate
-  if (!version.isMajor(3)) return rawCandidate
 
   if (!seenDesignSystems.has(designSystem)) {
-    designSystem.utilities.functional('group', (value) => [
-      // To ensure that `@apply group` works when computing a signature
-      decl('--phantom-class', 'group'),
-      // To ensure `group` and `group/foo` are considered different classes
-      decl('--phantom-modifier', value.modifier?.value),
-    ])
-    designSystem.utilities.functional('peer', (value) => [
-      // To ensure that `@apply peer` works when computing a signature
-      decl('--phantom-class', 'peer'),
-      // To ensure `peer` and `peer/foo` are considered different classes
-      decl('--phantom-modifier', value.modifier?.value),
-    ])
+    designSystem.utilities.functional('group', () => null)
+    designSystem.utilities.functional('peer', () => null)
     seenDesignSystems.add(designSystem)
   }
 
@@ -58,7 +45,7 @@ export function migratePrefix(
 
   if (!candidate) return rawCandidate
 
-  return designSystem.printCandidate(candidate)
+  return printCandidate(designSystem, candidate)
 }
 
 // Parses a raw candidate with v3 compatible prefix syntax. This won't match if
@@ -128,7 +115,7 @@ function extractV3Base(
 }
 
 const VALID_PREFIX = /([a-z]+)/
-export function migratePrefixValue(prefix: string): string {
+export function migratePrefix(prefix: string): string {
   let result = VALID_PREFIX.exec(prefix.toLocaleLowerCase())
   if (!result) {
     console.warn(
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/simple-legacy-classes.test.ts
similarity index 73%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/simple-legacy-classes.test.ts
index 456671dd7..a9da9e54e 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/simple-legacy-classes.test.ts
@@ -1,8 +1,6 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
-import { expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateSimpleLegacyClasses } from './migrate-simple-legacy-classes'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
+import { expect, test } from 'vitest'
+import { simpleLegacyClasses } from './simple-legacy-classes'
 
 test.each([
   ['overflow-ellipsis', 'text-ellipsis'],
@@ -26,5 +24,5 @@ test.each([
     base: __dirname,
   })
 
-  expect(migrateSimpleLegacyClasses(designSystem, {}, candidate)).toEqual(result)
+  expect(simpleLegacyClasses(designSystem, {}, candidate)).toEqual(result)
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.ts b/packages/@tailwindcss-upgrade/src/template/codemods/simple-legacy-classes.ts
similarity index 56%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/simple-legacy-classes.ts
index 415ed524c..1251d0f2d 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-simple-legacy-classes.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/simple-legacy-classes.ts
@@ -1,10 +1,10 @@
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import * as version from '../../utils/version'
+import { printCandidate } from '../candidates'
 
 // Classes that used to exist in Tailwind CSS v3, but do not exist in Tailwind
 // CSS v4 anymore.
-const LEGACY_CLASS_MAP: Record<string, string> = {
+const LEGACY_CLASS_MAP = {
   'overflow-ellipsis': 'text-ellipsis',
 
   'flex-grow': 'grow',
@@ -15,33 +15,16 @@ const LEGACY_CLASS_MAP: Record<string, string> = {
   'decoration-clone': 'box-decoration-clone',
   'decoration-slice': 'box-decoration-slice',
 
-  // Since v4.1.0
-  'bg-left-top': 'bg-top-left',
-  'bg-left-bottom': 'bg-bottom-left',
-  'bg-right-top': 'bg-top-right',
-  'bg-right-bottom': 'bg-bottom-right',
-  'object-left-top': 'object-top-left',
-  'object-left-bottom': 'object-bottom-left',
-  'object-right-top': 'object-top-right',
-  'object-right-bottom': 'object-bottom-right',
+  'outline-none': 'outline-hidden',
 }
 
 let seenDesignSystems = new WeakSet<DesignSystem>()
 
-export function migrateSimpleLegacyClasses(
+export function simpleLegacyClasses(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
 ): string {
-  // `outline-none` in v3 has the same meaning as `outline-hidden` in v4. However,
-  // `outline-none` in v4 _also_ exists but has a different meaning.
-  //
-  // We can only migrate `outline-none` to `outline-hidden` if we are migrating a
-  // v3 project to v4.
-  if (version.isMajor(3)) {
-    LEGACY_CLASS_MAP['outline-none'] = 'outline-hidden'
-  }
-
   // Prepare design system with the unknown legacy classes
   if (!seenDesignSystems.has(designSystem)) {
     for (let old in LEGACY_CLASS_MAP) {
@@ -52,7 +35,7 @@ export function migrateSimpleLegacyClasses(
 
   for (let candidate of designSystem.parseCandidate(rawCandidate)) {
     if (candidate.kind === 'static' && Object.hasOwn(LEGACY_CLASS_MAP, candidate.root)) {
-      return designSystem.printCandidate({
+      return printCandidate(designSystem, {
         ...candidate,
         root: LEGACY_CLASS_MAP[candidate.root as keyof typeof LEGACY_CLASS_MAP],
       })
diff --git a/packages/@tailwindcss-upgrade/src/template/codemods/theme-to-var.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/theme-to-var.test.ts
new file mode 100644
index 000000000..c5131fc29
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/theme-to-var.test.ts
@@ -0,0 +1,195 @@
+import { __unstable__loadDesignSystem } from '@tailwindcss/node'
+import { expect, test } from 'vitest'
+import { themeToVar } from './theme-to-var'
+
+let css = String.raw
+
+test.each([
+  // Keep candidates that don't contain `theme(…)` or `theme(…, …)`
+  ['[color:red]', '[color:red]'],
+
+  // Handle special cases around `.1` in the `theme(…)`
+  ['[--value:theme(spacing.1)]', '[--value:--spacing(1)]'],
+  ['[--value:theme(fontSize.xs.1.lineHeight)]', '[--value:var(--text-xs--line-height)]'],
+  ['[--value:theme(spacing[1.25])]', '[--value:--spacing(1.25)]'],
+
+  // Should not convert invalid spacing values to calc
+  ['[--value:theme(spacing[1.1])]', '[--value:theme(spacing[1.1])]'],
+
+  // Convert to `var(…)` if we can resolve the path
+  ['[color:theme(colors.red.500)]', '[color:var(--color-red-500)]'], // Arbitrary property
+  ['[color:theme(colors.red.500)]/50', '[color:var(--color-red-500)]/50'], // Arbitrary property + modifier
+  ['bg-[theme(colors.red.500)]', 'bg-(--color-red-500)'], // Arbitrary value
+  ['bg-[size:theme(spacing.4)]', 'bg-[size:--spacing(4)]'], // Arbitrary value + data type hint
+
+  // Pretty print CSS functions preceded by an operator to prevent consecutive
+  // operator characters.
+  ['w-[calc(100dvh-theme(spacing.2))]', 'w-[calc(100dvh-(--spacing(2)))]'],
+  ['w-[calc(100dvh+theme(spacing.2))]', 'w-[calc(100dvh+(--spacing(2)))]'],
+  ['w-[calc(100dvh/theme(spacing.2))]', 'w-[calc(100dvh/(--spacing(2)))]'],
+  ['w-[calc(100dvh*theme(spacing.2))]', 'w-[calc(100dvh*(--spacing(2)))]'],
+
+  // Convert to `var(…)` if we can resolve the path, but keep fallback values
+  ['bg-[theme(colors.red.500,red)]', 'bg-(--color-red-500,red)'],
+
+  // Keep `theme(…)` if we can't resolve the path
+  ['bg-[theme(colors.foo.1000)]', 'bg-[theme(colors.foo.1000)]'],
+
+  // Keep `theme(…)` if we can't resolve the path, but still try to convert the
+  // fallback value.
+  [
+    'bg-[theme(colors.foo.1000,theme(colors.red.500))]',
+    'bg-[theme(colors.foo.1000,var(--color-red-500))]',
+  ],
+
+  // Use `theme(…)` (deeply nested) inside of a `calc(…)` function
+  ['text-[calc(theme(fontSize.xs)*2)]', 'text-[calc(var(--text-xs)*2)]'],
+
+  // Multiple `theme(… / …)` calls should result in modern syntax of `theme(…)`
+  // - Can't convert to `var(…)` because that would lose the modifier.
+  // - Can't convert to a candidate modifier because there are multiple
+  //   `theme(…)` calls.
+  //
+  //   If we really want to, we can make a fancy migration that tries to move it
+  //   to a candidate modifier _if_ all `theme(…)` calls use the same modifier.
+  [
+    '[color:theme(colors.red.500/50,theme(colors.blue.500/50))]',
+    '[color:--theme(--color-red-500/50,--theme(--color-blue-500/50))]',
+  ],
+  [
+    '[color:theme(colors.red.500/50,theme(colors.blue.500/50))]/50',
+    '[color:--theme(--color-red-500/50,--theme(--color-blue-500/50))]/50',
+  ],
+
+  // Convert the `theme(…)`, but try to move the inline modifier (e.g. `50%`),
+  // to a candidate modifier.
+  // Arbitrary property, with simple percentage modifier
+  ['[color:theme(colors.red.500/75%)]', '[color:var(--color-red-500)]/75'],
+
+  // Arbitrary property, with numbers (0-1) without a unit
+  ['[color:theme(colors.red.500/.12)]', '[color:var(--color-red-500)]/12'],
+  ['[color:theme(colors.red.500/0.12)]', '[color:var(--color-red-500)]/12'],
+
+  // Arbitrary property, with more complex modifier (we only allow whole numbers
+  // as bare modifiers). Convert the complex numbers to arbitrary values instead.
+  ['[color:theme(colors.red.500/12.34%)]', '[color:var(--color-red-500)]/[12.34%]'],
+  ['[color:theme(colors.red.500/var(--opacity))]', '[color:var(--color-red-500)]/(--opacity)'],
+  ['[color:theme(colors.red.500/.12345)]', '[color:var(--color-red-500)]/[12.345]'],
+  ['[color:theme(colors.red.500/50.25%)]', '[color:var(--color-red-500)]/[50.25%]'],
+
+  // Arbitrary value
+  ['bg-[theme(colors.red.500/75%)]', 'bg-(--color-red-500)/75'],
+  ['bg-[theme(colors.red.500/12.34%)]', 'bg-(--color-red-500)/[12.34%]'],
+
+  // Arbitrary property that already contains a modifier
+  ['[color:theme(colors.red.500/50%)]/50', '[color:--theme(--color-red-500/50%)]/50'],
+
+  // Values that don't contain only `theme(…)` calls should not be converted to
+  // use a modifier since the color is not the whole value.
+  [
+    'shadow-[shadow:inset_0px_1px_theme(colors.white/15%)]',
+    'shadow-[shadow:inset_0px_1px_--theme(--color-white/15%)]',
+  ],
+
+  // Arbitrary value, where the candidate already contains a modifier
+  // This should still migrate the `theme(…)` syntax to the modern syntax.
+  ['bg-[theme(colors.red.500/50%)]/50', 'bg-[--theme(--color-red-500/50%)]/50'],
+
+  // Variants, we can't use `var(…)` especially inside of `@media(…)`. We can
+  // still upgrade the `theme(…)` to the modern syntax.
+  ['max-[theme(screens.lg)]:flex', 'max-[--theme(--breakpoint-lg)]:flex'],
+  // There are no variables for `--spacing` multiples, so we can't convert this
+  ['max-[theme(spacing.4)]:flex', 'max-[theme(spacing.4)]:flex'],
+
+  // This test in itself doesn't make much sense. But we need to make sure
+  // that this doesn't end up as the modifier in the candidate itself.
+  ['max-[theme(spacing.4/50)]:flex', 'max-[theme(spacing.4/50)]:flex'],
+
+  // `theme(…)` calls in another CSS function is replaced correctly.
+  // Additionally we remove unnecessary whitespace.
+  ['grid-cols-[min(50%_,_theme(spacing.80))_auto]', 'grid-cols-[min(50%,--spacing(80))_auto]'],
+
+  // `theme(…)` calls valid in v3, but not in v4 should still be converted.
+  ['[--foo:theme(transitionDuration.500)]', '[--foo:theme(transitionDuration.500)]'],
+
+  // Renamed theme keys
+  ['max-w-[theme(screens.md)]', 'max-w-(--breakpoint-md)'],
+  ['w-[theme(maxWidth.md)]', 'w-(--container-md)'],
+
+  // Invalid cases
+  ['[--foo:theme(colors.red.500/50/50)]', '[--foo:theme(colors.red.500/50/50)]'],
+  ['[--foo:theme(colors.red.500/50/50)]/50', '[--foo:theme(colors.red.500/50/50)]/50'],
+
+  // Partially invalid cases
+  [
+    '[--foo:theme(colors.red.500/50/50)_theme(colors.blue.200)]',
+    '[--foo:theme(colors.red.500/50/50)_var(--color-blue-200)]',
+  ],
+  [
+    '[--foo:theme(colors.red.500/50/50)_theme(colors.blue.200)]/50',
+    '[--foo:theme(colors.red.500/50/50)_var(--color-blue-200)]/50',
+  ],
+])('%s => %s', async (candidate, result) => {
+  let designSystem = await __unstable__loadDesignSystem(
+    css`
+      @import 'tailwindcss';
+    `,
+    {
+      base: __dirname,
+    },
+  )
+
+  expect(themeToVar(designSystem, {}, candidate)).toEqual(result)
+})
+
+test('extended space scale converts to var or calc', async () => {
+  let designSystem = await __unstable__loadDesignSystem(
+    css`
+      @import 'tailwindcss';
+      @theme {
+        --spacing-2: 2px;
+        --spacing-miami: 0.875rem;
+      }
+    `,
+    {
+      base: __dirname,
+    },
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.1)]')).toEqual(
+    '[--value:--spacing(1)]',
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.2)]')).toEqual(
+    '[--value:var(--spacing-2)]',
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.miami)]')).toEqual(
+    '[--value:var(--spacing-miami)]',
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.nyc)]')).toEqual(
+    '[--value:theme(spacing.nyc)]',
+  )
+})
+
+test('custom space scale converts to var', async () => {
+  let designSystem = await __unstable__loadDesignSystem(
+    css`
+      @import 'tailwindcss';
+      @theme {
+        --spacing-*: initial;
+        --spacing-1: 0.25rem;
+        --spacing-2: 0.5rem;
+      }
+    `,
+    {
+      base: __dirname,
+    },
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.1)]')).toEqual(
+    '[--value:var(--spacing-1)]',
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.2)]')).toEqual(
+    '[--value:var(--spacing-2)]',
+  )
+  expect(themeToVar(designSystem, {}, '[--value:theme(spacing.3)]')).toEqual(
+    '[--value:theme(spacing.3)]',
+  )
+})
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-theme-to-var.ts b/packages/@tailwindcss-upgrade/src/template/codemods/theme-to-var.ts
similarity index 73%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-theme-to-var.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/theme-to-var.ts
index e566e7d6e..6248d4347 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-theme-to-var.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/theme-to-var.ts
@@ -1,11 +1,17 @@
-import { type CandidateModifier } from '../../../../tailwindcss/src/candidate'
+import {
+  parseCandidate,
+  type Candidate,
+  type CandidateModifier,
+  type Variant,
+} from '../../../../tailwindcss/src/candidate'
 import { keyPathToCssProperty } from '../../../../tailwindcss/src/compat/apply-config-to-theme'
+import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
 import { isValidSpacingMultiplier } from '../../../../tailwindcss/src/utils/infer-data-type'
 import { segment } from '../../../../tailwindcss/src/utils/segment'
 import { toKeyPath } from '../../../../tailwindcss/src/utils/to-key-path'
 import * as ValueParser from '../../../../tailwindcss/src/value-parser'
-import { walk, WalkAction } from '../../../../tailwindcss/src/walk'
+import { printCandidate } from '../candidates'
 
 export const enum Convert {
   All = 0,
@@ -13,6 +19,68 @@ export const enum Convert {
   MigrateThemeOnly = 1 << 1,
 }
 
+export function themeToVar(
+  designSystem: DesignSystem,
+  _userConfig: Config,
+  rawCandidate: string,
+): string {
+  let convert = createConverter(designSystem)
+
+  for (let candidate of parseCandidate(rawCandidate, designSystem)) {
+    let clone = structuredClone(candidate)
+    let changed = false
+
+    if (clone.kind === 'arbitrary') {
+      let [newValue, modifier] = convert(
+        clone.value,
+        clone.modifier === null ? Convert.MigrateModifier : Convert.All,
+      )
+      if (newValue !== clone.value) {
+        changed = true
+        clone.value = newValue
+
+        if (modifier !== null) {
+          clone.modifier = modifier
+        }
+      }
+    } else if (clone.kind === 'functional' && clone.value?.kind === 'arbitrary') {
+      let [newValue, modifier] = convert(
+        clone.value.value,
+        clone.modifier === null ? Convert.MigrateModifier : Convert.All,
+      )
+      if (newValue !== clone.value.value) {
+        changed = true
+        clone.value.value = newValue
+
+        if (modifier !== null) {
+          clone.modifier = modifier
+        }
+      }
+    }
+
+    // Handle variants
+    for (let variant of variants(clone)) {
+      if (variant.kind === 'arbitrary') {
+        let [newValue] = convert(variant.selector, Convert.MigrateThemeOnly)
+        if (newValue !== variant.selector) {
+          changed = true
+          variant.selector = newValue
+        }
+      } else if (variant.kind === 'functional' && variant.value?.kind === 'arbitrary') {
+        let [newValue] = convert(variant.value.value, Convert.MigrateThemeOnly)
+        if (newValue !== variant.value.value) {
+          changed = true
+          variant.value.value = newValue
+        }
+      }
+    }
+
+    return changed ? printCandidate(designSystem, clone) : rawCandidate
+  }
+
+  return rawCandidate
+}
+
 export function createConverter(designSystem: DesignSystem, { prettyPrint = false } = {}) {
   function convert(input: string, options = Convert.All): [string, CandidateModifier | null] {
     let ast = ValueParser.parse(input)
@@ -28,7 +96,7 @@ export function createConverter(designSystem: DesignSystem, { prettyPrint = fals
     let themeModifierCount = 0
 
     // Analyze AST
-    walk(ast, (node) => {
+    ValueParser.walk(ast, (node) => {
       if (node.kind !== 'function') return
       if (node.value !== 'theme') return
 
@@ -36,19 +104,19 @@ export function createConverter(designSystem: DesignSystem, { prettyPrint = fals
       themeUsageCount += 1
 
       // Figure out if a modifier is used
-      walk(node.nodes, (child) => {
+      ValueParser.walk(node.nodes, (child) => {
         // If we see a `,`, it means that we have a fallback value
         if (child.kind === 'separator' && child.value.includes(',')) {
-          return WalkAction.Stop
+          return ValueParser.ValueWalkAction.Stop
         }
 
         // If we see a `/`, we have a modifier
-        else if (child.kind === 'word' && child.value === '/') {
+        else if (child.kind === 'separator' && child.value.trim() === '/') {
           themeModifierCount += 1
-          return WalkAction.Stop
+          return ValueParser.ValueWalkAction.Stop
         }
 
-        return WalkAction.Skip
+        return ValueParser.ValueWalkAction.Skip
       })
     })
 
@@ -130,10 +198,6 @@ export function createConverter(designSystem: DesignSystem, { prettyPrint = fals
     let variable = `--${keyPathToCssProperty(toKeyPath(path))}` as const
     if (!designSystem.theme.get([variable])) return null
 
-    if (designSystem.theme.prefix) {
-      return `--${designSystem.theme.prefix}-${variable.slice(2)}`
-    }
-
     return variable
   }
 
@@ -173,7 +237,7 @@ function substituteFunctionsInValue(
   ast: ValueParser.ValueAstNode[],
   handle: (value: string, fallback?: string) => string | null,
 ) {
-  walk(ast, (node, ctx) => {
+  ValueParser.walk(ast, (node, { parent, replaceWith }) => {
     if (node.kind === 'function' && node.value === 'theme') {
       if (node.nodes.length < 1) return
 
@@ -211,10 +275,10 @@ function substituteFunctionsInValue(
         fallbackValues.length > 0 ? handle(path, ValueParser.toCss(fallbackValues)) : handle(path)
       if (replacement === null) return
 
-      {
-        let idx = ctx.index - 1
+      if (parent) {
+        let idx = parent.nodes.indexOf(node) - 1
         while (idx !== -1) {
-          let previous = ctx.siblings[idx]
+          let previous = parent.nodes[idx]
           // Skip the space separator
           if (previous.kind === 'separator' && previous.value.trim() === '') {
             idx -= 1
@@ -242,7 +306,7 @@ function substituteFunctionsInValue(
         }
       }
 
-      return WalkAction.Replace(ValueParser.parse(replacement))
+      replaceWith(ValueParser.parse(replacement))
     }
   })
 
@@ -268,3 +332,16 @@ function eventuallyUnquote(value: string) {
 
   return unquoted
 }
+
+function* variants(candidate: Candidate) {
+  function* inner(variant: Variant): Iterable<Variant> {
+    yield variant
+    if (variant.kind === 'compound') {
+      yield* inner(variant.variant)
+    }
+  }
+
+  for (let variant of candidate.variants) {
+    yield* inner(variant)
+  }
+}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-variant-order.test.ts b/packages/@tailwindcss-upgrade/src/template/codemods/variant-order.test.ts
similarity index 88%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-variant-order.test.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/variant-order.test.ts
index 1b14d533f..ffceaaecb 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-variant-order.test.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/variant-order.test.ts
@@ -1,9 +1,7 @@
 import { __unstable__loadDesignSystem } from '@tailwindcss/node'
 import dedent from 'dedent'
-import { expect, test, vi } from 'vitest'
-import * as versions from '../../utils/version'
-import { migrateVariantOrder } from './migrate-variant-order'
-vi.spyOn(versions, 'isMajor').mockReturnValue(true)
+import { expect, test } from 'vitest'
+import { variantOrder } from './variant-order'
 
 let css = dedent
 
@@ -55,7 +53,7 @@ test.each([
     base: __dirname,
   })
 
-  expect(migrateVariantOrder(designSystem, {}, candidate)).toEqual(result)
+  expect(variantOrder(designSystem, {}, candidate)).toEqual(result)
 })
 
 test('it works with custom variants', async () => {
@@ -85,7 +83,7 @@ test('it works with custom variants', async () => {
     },
   )
 
-  expect(migrateVariantOrder(designSystem, {}, 'combinator:pseudo:atrule:underline')).toEqual(
+  expect(variantOrder(designSystem, {}, 'combinator:pseudo:atrule:underline')).toEqual(
     'atrule:combinator:pseudo:underline',
   )
 })
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-variant-order.ts b/packages/@tailwindcss-upgrade/src/template/codemods/variant-order.ts
similarity index 85%
rename from packages/@tailwindcss-upgrade/src/codemods/template/migrate-variant-order.ts
rename to packages/@tailwindcss-upgrade/src/template/codemods/variant-order.ts
index 3fd84af7c..07c7015ab 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/migrate-variant-order.ts
+++ b/packages/@tailwindcss-upgrade/src/template/codemods/variant-order.ts
@@ -1,24 +1,14 @@
-import { type AstNode } from '../../../../tailwindcss/src/ast'
+import { walk, type AstNode } from '../../../../tailwindcss/src/ast'
 import { type Variant } from '../../../../tailwindcss/src/candidate'
 import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
 import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { walk } from '../../../../tailwindcss/src/walk'
-import * as version from '../../utils/version'
+import { printCandidate } from '../candidates'
 
-export function migrateVariantOrder(
+export function variantOrder(
   designSystem: DesignSystem,
-  _userConfig: Config | null,
+  _userConfig: Config,
   rawCandidate: string,
 ): string {
-  // This migration is only needed for Tailwind CSS v3
-  //
-  // Changing the variant order when migrating from v3 to v4 is fine, but
-  // migrating v4 to v4 would make it unsafe because the variant order would
-  // flip-flop every time you run the migration.
-  if (!version.isMajor(3)) {
-    return rawCandidate
-  }
-
   for (let candidate of designSystem.parseCandidate(rawCandidate)) {
     if (candidate.variants.length <= 1) {
       continue
@@ -56,7 +46,7 @@ export function migrateVariantOrder(
       continue
     }
 
-    return designSystem.printCandidate({ ...candidate, variants: newOrder })
+    return printCandidate(designSystem, { ...candidate, variants: newOrder })
   }
   return rawCandidate
 }
diff --git a/packages/@tailwindcss-upgrade/src/template/is-safe-migration.ts b/packages/@tailwindcss-upgrade/src/template/is-safe-migration.ts
new file mode 100644
index 000000000..dc84d3022
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/is-safe-migration.ts
@@ -0,0 +1,73 @@
+const QUOTES = ['"', "'", '`']
+const LOGICAL_OPERATORS = ['&&', '||', '?', '===', '==', '!=', '!==', '>', '>=', '<', '<=']
+const CONDITIONAL_TEMPLATE_SYNTAX = [
+  // Vue
+  /v-else-if=['"]$/,
+  /v-if=['"]$/,
+  /v-show=['"]$/,
+
+  // Alpine
+  /x-if=['"]$/,
+  /x-show=['"]$/,
+]
+const NEXT_PLACEHOLDER_PROP = /placeholder=\{?['"]$/
+
+export function isSafeMigration(location: { contents: string; start: number; end: number }) {
+  let currentLineBeforeCandidate = ''
+  for (let i = location.start - 1; i >= 0; i--) {
+    let char = location.contents.at(i)!
+    if (char === '\n') {
+      break
+    }
+    currentLineBeforeCandidate = char + currentLineBeforeCandidate
+  }
+  let currentLineAfterCandidate = ''
+  for (let i = location.end; i < location.contents.length; i++) {
+    let char = location.contents.at(i)!
+    if (char === '\n') {
+      break
+    }
+    currentLineAfterCandidate += char
+  }
+
+  // Heuristic: Require the candidate to be inside quotes
+  let isQuoteBeforeCandidate = QUOTES.some((quote) => currentLineBeforeCandidate.includes(quote))
+  let isQuoteAfterCandidate = QUOTES.some((quote) => currentLineAfterCandidate.includes(quote))
+  if (!isQuoteBeforeCandidate || !isQuoteAfterCandidate) {
+    return false
+  }
+
+  // Heuristic: Disallow object access immediately following the candidate
+  if (currentLineAfterCandidate[0] === '.') {
+    return false
+  }
+
+  // Heuristic: Disallow function call expressions immediately following the candidate
+  if (currentLineAfterCandidate.trim().startsWith('(')) {
+    return false
+  }
+
+  // Heuristic: Disallow logical operators preceding or following the candidate
+  for (let operator of LOGICAL_OPERATORS) {
+    if (
+      currentLineAfterCandidate.trim().startsWith(operator) ||
+      currentLineBeforeCandidate.trim().endsWith(operator)
+    ) {
+      return false
+    }
+  }
+
+  // Heuristic: Disallow conditional template syntax
+  for (let rule of CONDITIONAL_TEMPLATE_SYNTAX) {
+    if (rule.test(currentLineBeforeCandidate)) {
+      return false
+    }
+  }
+
+  // Heuristic: Disallow Next.js Image `placeholder` prop
+  if (NEXT_PLACEHOLDER_PROP.test(currentLineBeforeCandidate)) {
+    return false
+  }
+
+  return true
+}
diff --git a/packages/@tailwindcss-upgrade/src/template/migrate.ts b/packages/@tailwindcss-upgrade/src/template/migrate.ts
new file mode 100644
index 000000000..7fdc164f2
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/template/migrate.ts
@@ -0,0 +1,104 @@
+import fs from 'node:fs/promises'
+import path, { extname } from 'node:path'
+import type { Config } from '../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import { extractRawCandidates } from './candidates'
+import { arbitraryValueToBareValue } from './codemods/arbitrary-value-to-bare-value'
+import { automaticVarInjection } from './codemods/automatic-var-injection'
+import { bgGradient } from './codemods/bg-gradient'
+import { handleEmptyArbitraryValues } from './codemods/handle-empty-arbitrary-values'
+import { important } from './codemods/important'
+import { legacyArbitraryValues } from './codemods/legacy-arbitrary-values'
+import { legacyClasses } from './codemods/legacy-classes'
+import { maxWidthScreen } from './codemods/max-width-screen'
+import { modernizeArbitraryValues } from './codemods/modernize-arbitrary-values'
+import { prefix } from './codemods/prefix'
+import { simpleLegacyClasses } from './codemods/simple-legacy-classes'
+import { themeToVar } from './codemods/theme-to-var'
+import { variantOrder } from './codemods/variant-order'
+import { spliceChangesIntoString, type StringChange } from './splice-changes-into-string'
+
+export type Migration = (
+  designSystem: DesignSystem,
+  userConfig: Config,
+  rawCandidate: string,
+  location?: {
+    contents: string
+    start: number
+    end: number
+  },
+) => string | Promise<string>
+
+export const DEFAULT_MIGRATIONS: Migration[] = [
+  handleEmptyArbitraryValues,
+  prefix,
+  important,
+  bgGradient,
+  simpleLegacyClasses,
+  legacyClasses,
+  maxWidthScreen,
+  themeToVar,
+  variantOrder, // Has to happen before migrations that modify variants
+  automaticVarInjection,
+  legacyArbitraryValues,
+  arbitraryValueToBareValue,
+  modernizeArbitraryValues,
+]
+
+export async function migrateCandidate(
+  designSystem: DesignSystem,
+  userConfig: Config,
+  rawCandidate: string,
+  // Location is only set when migrating a candidate from a source file
+  location?: {
+    contents: string
+    start: number
+    end: number
+  },
+): Promise<string> {
+  for (let migration of DEFAULT_MIGRATIONS) {
+    rawCandidate = await migration(designSystem, userConfig, rawCandidate, location)
+  }
+  return rawCandidate
+}
+
+export default async function migrateContents(
+  designSystem: DesignSystem,
+  userConfig: Config,
+  contents: string,
+  extension: string,
+): Promise<string> {
+  let candidates = await extractRawCandidates(contents, extension)
+
+  let changes: StringChange[] = []
+
+  for (let { rawCandidate, start, end } of candidates) {
+    let migratedCandidate = await migrateCandidate(designSystem, userConfig, rawCandidate, {
+      contents,
+      start,
+      end,
+    })
+
+    if (migratedCandidate === rawCandidate) {
+      continue
+    }
+
+    changes.push({
+      start,
+      end,
+      replacement: migratedCandidate,
+    })
+  }
+
+  return spliceChangesIntoString(contents, changes)
+}
+
+export async function migrate(designSystem: DesignSystem, userConfig: Config, file: string) {
+  let fullPath = path.isAbsolute(file) ? file : path.resolve(process.cwd(), file)
+  let contents = await fs.readFile(fullPath, 'utf-8')
+
+  await fs.writeFile(
+    fullPath,
+    await migrateContents(designSystem, userConfig, contents, extname(file)),
+  )
+}
diff --git a/packages/@tailwindcss-upgrade/src/codemods/template/prepare-config.ts b/packages/@tailwindcss-upgrade/src/template/prepare-config.ts
similarity index 85%
rename from packages/@tailwindcss-upgrade/src/codemods/template/prepare-config.ts
rename to packages/@tailwindcss-upgrade/src/template/prepare-config.ts
index d9fae442b..e936df6a3 100644
--- a/packages/@tailwindcss-upgrade/src/codemods/template/prepare-config.ts
+++ b/packages/@tailwindcss-upgrade/src/template/prepare-config.ts
@@ -2,12 +2,12 @@ import { __unstable__loadDesignSystem, compile } from '@tailwindcss/node'
 import fs from 'node:fs/promises'
 import path, { dirname } from 'node:path'
 import { fileURLToPath } from 'node:url'
-import { loadModule } from '../../../../@tailwindcss-node/src/compile'
-import { resolveConfig } from '../../../../tailwindcss/src/compat/config/resolve-config'
-import type { Config } from '../../../../tailwindcss/src/compat/plugin-api'
-import type { DesignSystem } from '../../../../tailwindcss/src/design-system'
-import { error, highlight, relative } from '../../utils/renderer'
-import { migratePrefixValue } from './migrate-prefix'
+import { loadModule } from '../../../@tailwindcss-node/src/compile'
+import { resolveConfig } from '../../../tailwindcss/src/compat/config/resolve-config'
+import type { Config } from '../../../tailwindcss/src/compat/plugin-api'
+import type { DesignSystem } from '../../../tailwindcss/src/design-system'
+import { error, highlight, relative } from '../utils/renderer'
+import { migratePrefix } from './codemods/prefix'
 
 const __filename = fileURLToPath(import.meta.url)
 const __dirname = dirname(__filename)
@@ -19,7 +19,7 @@ export async function prepareConfig(
   options: { base: string },
 ): Promise<{
   designSystem: DesignSystem
-  sources: { base: string; pattern: string }[]
+  globs: { base: string; pattern: string }[]
   userConfig: Config
   configFilePath: string
 
@@ -46,7 +46,7 @@ export async function prepareConfig(
 
     let userConfig = await createResolvedUserConfig(configFilePath)
 
-    let newPrefix = userConfig.prefix ? migratePrefixValue(userConfig.prefix) : null
+    let newPrefix = userConfig.prefix ? migratePrefix(userConfig.prefix) : null
     let input = css`
       @import 'tailwindcss' ${newPrefix ? `prefix(${newPrefix})` : ''};
       @config '${relative}';
@@ -59,7 +59,7 @@ export async function prepareConfig(
 
     return {
       designSystem,
-      sources: compiler.sources,
+      globs: compiler.globs,
       userConfig,
       newPrefix,
       configFilePath,
@@ -82,7 +82,7 @@ async function createResolvedUserConfig(fullConfigPath: string): Promise<Config>
   ])
 
   return resolveConfig(noopDesignSystem, [
-    { base: dirname(fullConfigPath), config: unresolvedUserConfig, reference: false },
+    { base: dirname(fullConfigPath), config: unresolvedUserConfig },
   ]).resolvedConfig as any
 }
 
diff --git a/packages/@tailwindcss-upgrade/src/utils/splice-changes-into-string.ts b/packages/@tailwindcss-upgrade/src/template/splice-changes-into-string.ts
similarity index 100%
rename from packages/@tailwindcss-upgrade/src/utils/splice-changes-into-string.ts
rename to packages/@tailwindcss-upgrade/src/template/splice-changes-into-string.ts
diff --git a/packages/@tailwindcss-upgrade/src/utils/git.ts b/packages/@tailwindcss-upgrade/src/utils/git.ts
index 38edf21cb..d716fbb8a 100644
--- a/packages/@tailwindcss-upgrade/src/utils/git.ts
+++ b/packages/@tailwindcss-upgrade/src/utils/git.ts
@@ -1,20 +1,8 @@
 import { execSync } from 'node:child_process'
 
-export function gitRoot(cwd?: string): string | null {
+export function isRepoDirty() {
   try {
-    return execSync('git rev-parse --show-toplevel', {
-      encoding: 'utf-8',
-      cwd,
-      stdio: ['ignore', 'pipe', 'ignore'],
-    }).trim()
-  } catch {
-    return null
-  }
-}
-
-export function isRepoDirty(cwd?: string) {
-  try {
-    let stdout = execSync('git status --porcelain', { encoding: 'utf-8', cwd })
+    let stdout = execSync('git status --porcelain', { encoding: 'utf-8' })
     return stdout.trim() !== ''
   } catch (error) {
     // If it's not a git repository we don't know if it's dirty or not. But we
diff --git a/packages/@tailwindcss-upgrade/src/utils/hoist-static-glob-parts.test.ts b/packages/@tailwindcss-upgrade/src/utils/hoist-static-glob-parts.test.ts
new file mode 100644
index 000000000..1e6d8b1e8
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/utils/hoist-static-glob-parts.test.ts
@@ -0,0 +1,48 @@
+import { expect, it } from 'vitest'
+import { hoistStaticGlobParts } from './hoist-static-glob-parts'
+
+it.each([
+  // A basic glob
+  [
+    { base: '/projects/project-a', pattern: './src/**/*.html' },
+    [{ base: '/projects/project-a/src', pattern: '**/*.html' }],
+  ],
+
+  // A glob pointing to a folder should result in `**/*`
+  [
+    { base: '/projects/project-a', pattern: './src' },
+    [{ base: '/projects/project-a/src', pattern: '**/*' }],
+  ],
+
+  // A glob pointing to a file, should result in the file as the pattern
+  [
+    { base: '/projects/project-a', pattern: './src/index.html' },
+    [{ base: '/projects/project-a/src', pattern: 'index.html' }],
+  ],
+
+  // A glob going up a directory, should result in the new directory as the base
+  [
+    { base: '/projects/project-a', pattern: '../project-b/src/**/*.html' },
+    [{ base: '/projects/project-b/src', pattern: '**/*.html' }],
+  ],
+
+  // A glob with curlies, should be expanded to multiple globs
+  [
+    { base: '/projects/project-a', pattern: '../project-{b,c}/src/**/*.html' },
+    [
+      { base: '/projects/project-b/src', pattern: '**/*.html' },
+      { base: '/projects/project-c/src', pattern: '**/*.html' },
+    ],
+  ],
+  [
+    { base: '/projects/project-a', pattern: '../project-{b,c}/src/**/*.{js,html}' },
+    [
+      { base: '/projects/project-b/src', pattern: '**/*.js' },
+      { base: '/projects/project-b/src', pattern: '**/*.html' },
+      { base: '/projects/project-c/src', pattern: '**/*.js' },
+      { base: '/projects/project-c/src', pattern: '**/*.html' },
+    ],
+  ],
+])('should hoist the static parts of the glob: %s', (input, output) => {
+  expect(hoistStaticGlobParts(input)).toEqual(output)
+})
diff --git a/packages/@tailwindcss-upgrade/src/utils/hoist-static-glob-parts.ts b/packages/@tailwindcss-upgrade/src/utils/hoist-static-glob-parts.ts
new file mode 100644
index 000000000..18d587998
--- /dev/null
+++ b/packages/@tailwindcss-upgrade/src/utils/hoist-static-glob-parts.ts
@@ -0,0 +1,82 @@
+import { normalizePath } from '@tailwindcss/node'
+import braces from 'braces'
+import path from 'node:path'
+
+interface GlobEntry {
+  base: string
+  pattern: string
+}
+
+export function hoistStaticGlobParts(entry: GlobEntry): GlobEntry[] {
+  return braces(entry.pattern, { expand: true }).map((pattern) => {
+    let clone = { ...entry }
+    let [staticPart, dynamicPart] = splitPattern(pattern)
+
+    // Move static part into the `base`.
+    let absolutePosixPath = normalizePath(entry.base)
+
+    if (staticPart !== null) {
+      clone.base = path.posix.join(absolutePosixPath, staticPart)
+    } else {
+      clone.base = absolutePosixPath
+    }
+
+    // Move dynamic part into the `pattern`.
+    if (dynamicPart === null) {
+      clone.pattern = '**/*'
+    } else {
+      clone.pattern = dynamicPart
+    }
+
+    // If the pattern looks like a file, move the file name from the `base` to
+    // the `pattern`.
+    let file = path.basename(clone.base)
+    if (file.includes('.')) {
+      clone.pattern = file
+      clone.base = path.dirname(clone.base)
+    }
+
+    return clone
+  })
+}
+
+// Split a glob pattern into a `static` and `dynamic` part.
+//
+// Assumption: we assume that all globs are expanded, which means that the only
+// dynamic parts are using `*`.
+//
+// E.g.:
+//  Original input: `../project-b/**/*.{html,js}`
+//  Expanded input: `../project-b/**/*.html` & `../project-b/**/*.js`
+//  Split on first input: ("../project-b", "**/*.html")
+//  Split on second input: ("../project-b", "**/*.js")
+function splitPattern(pattern: string): [staticPart: string | null, dynamicPart: string | null] {
+  // No dynamic parts, so we can just return the input as-is.
+  if (!pattern.includes('*')) {
+    return [pattern, null]
+  }
+
+  let lastSlashPosition: number | null = null
+
+  for (let i = 0; i < pattern.length; i++) {
+    let c = pattern[i]
+    if (c === '/') {
+      lastSlashPosition = i
+    }
+
+    if (c === '*' || c === '!') {
+      break
+    }
+  }
+
+  // Very first character is a `*`, therefore there is no static part, only a
+  // dynamic part.
+  if (lastSlashPosition === null) {
+    return [null, pattern]
+  }
+
+  let staticPart = pattern.slice(0, lastSlashPosition).trim()
+  let dynamicPart = pattern.slice(lastSlashPosition + 1).trim()
+
+  return [staticPart || null, dynamicPart || null]
+}
diff --git a/packages/@tailwindcss-upgrade/src/utils/package-version.ts b/packages/@tailwindcss-upgrade/src/utils/package-version.ts
index 64a1e7ed1..833ccadf2 100644
--- a/packages/@tailwindcss-upgrade/src/utils/package-version.ts
+++ b/packages/@tailwindcss-upgrade/src/utils/package-version.ts
@@ -1,4 +1,3 @@
-import { readFileSync } from 'node:fs'
 import fs from 'node:fs/promises'
 import { resolveJsId } from './resolve'
 
@@ -16,14 +15,3 @@ export async function getPackageVersion(pkg: string, base: string): Promise<stri
     return null
   }
 }
-
-export function getPackageVersionSync(pkg: string, base: string): string | null {
-  try {
-    let packageJson = resolveJsId(`${pkg}/package.json`, base)
-    if (!packageJson) return null
-    let { version } = JSON.parse(readFileSync(packageJson, 'utf8'))
-    return version
-  } catch {
-    return null
-  }
-}
diff --git a/packages/@tailwindcss-upgrade/src/utils/packages.ts b/packages/@tailwindcss-upgrade/src/utils/packages.ts
index 461a6983a..863451a29 100644
--- a/packages/@tailwindcss-upgrade/src/utils/packages.ts
+++ b/packages/@tailwindcss-upgrade/src/utils/packages.ts
@@ -1,5 +1,4 @@
 import { exec as execCb } from 'node:child_process'
-import { readFileSync } from 'node:fs'
 import fs from 'node:fs/promises'
 import { dirname, resolve } from 'node:path'
 import { promisify } from 'node:util'
@@ -13,20 +12,8 @@ const SAVE_DEV: Record<string, string> = {
   bun: '-d',
 }
 
-const manifests = new DefaultMap((base) => {
-  try {
-    let packageJsonPath = resolve(base, 'package.json')
-    return readFileSync(packageJsonPath, 'utf-8')
-  } catch {
-    return ''
-  }
-})
-
 export function pkg(base: string) {
   return {
-    async manager() {
-      return await packageManagerForBase.get(base)
-    },
     async add(packages: string[], location: 'dependencies' | 'devDependencies' = 'dependencies') {
       let packageManager = await packageManagerForBase.get(base)
       let args = packages.slice()
@@ -34,13 +21,6 @@ export function pkg(base: string) {
         args.push(SAVE_DEV[packageManager] || SAVE_DEV.default)
       }
 
-      // Allow running the `pnpm` command in the workspace root without
-      // erroring. Can't just use `--workspace-root` because that will force
-      // install dependencies in the workspace root.
-      if (packageManager === 'pnpm') {
-        args.push('--ignore-workspace-root-check')
-      }
-
       let command = `${packageManager} add ${args.join(' ')}`
       try {
         return await exec(command, { cwd: base })
@@ -49,13 +29,8 @@ export function pkg(base: string) {
           prefix: '↳ ',
         })
         throw e
-      } finally {
-        manifests.delete(base)
       }
     },
-    has(name: string) {
-      return manifests.get(base).includes(`"${name}":`)
-    },
     async remove(packages: string[]) {
       let packageManager = await packageManagerForBase.get(base)
       let command = `${packageManager} remove ${packages.join(' ')}`
@@ -66,8 +41,6 @@ export function pkg(base: string) {
           prefix: '↳ ',
         })
         throw e
-      } finally {
-        manifests.delete(base)
       }
     },
   }
diff --git a/packages/@tailwindcss-upgrade/src/utils/renderer.ts b/packages/@tailwindcss-upgrade/src/utils/renderer.ts
index c9a967801..38bd9826a 100644
--- a/packages/@tailwindcss-upgrade/src/utils/renderer.ts
+++ b/packages/@tailwindcss-upgrade/src/utils/renderer.ts
@@ -44,7 +44,7 @@ export function wordWrap(text: string, width: number): string[] {
   // Handle text with newlines by maintaining the newlines, then splitting
   // each line separately.
   if (text.includes('\n')) {
-    return text.split('\n').flatMap((line) => (line ? wordWrap(line, width) : ['']))
+    return text.split('\n').flatMap((line) => wordWrap(line, width))
   }
 
   let words = text.split(' ')
diff --git a/packages/@tailwindcss-upgrade/src/utils/version.ts b/packages/@tailwindcss-upgrade/src/utils/version.ts
deleted file mode 100644
index 27bc44f2b..000000000
--- a/packages/@tailwindcss-upgrade/src/utils/version.ts
+++ /dev/null
@@ -1,63 +0,0 @@
-import { execSync } from 'node:child_process'
-import semver from 'semver'
-import { DefaultMap } from '../../../tailwindcss/src/utils/default-map'
-import { getPackageVersionSync } from './package-version'
-
-/**
- * Must be of major version.
- *
- * E.g.: `isMajor(3)`
- */
-export function isMajor(version: number) {
-  return semver.satisfies(installedTailwindVersion(), `>=${version}.0.0 <${version + 1}.0.0`)
-}
-
-/**
- * Must be of greater than the current major version including minor and patch.
- *
- * E.g.: `isGreaterThan(3)`
- */
-export function isGreaterThan(version: number) {
-  return semver.gte(installedTailwindVersion(), `${version + 1}.0.0`)
-}
-
-let cache = new DefaultMap((base) => {
-  let tailwindVersion = getPackageVersionSync('tailwindcss', base)
-  if (!tailwindVersion) throw new Error('Tailwind CSS is not installed')
-  return tailwindVersion
-})
-
-export function installedTailwindVersion(base = process.cwd()): string {
-  return cache.get(base)
-}
-
-let expectedCache = new DefaultMap((base) => {
-  try {
-    // This will report a problem if the package.json/package-lock.json
-    // mismatches with the installed version in node_modules.
-    //
-    // Also tested this with Bun and PNPM, both seem to work fine.
-    execSync('npm ls tailwindcss --json', { cwd: base, stdio: 'pipe' })
-    return installedTailwindVersion(base)
-  } catch (_e) {
-    try {
-      let e = _e as { stdout: Buffer }
-      let data = JSON.parse(e.stdout.toString())
-
-      return (
-        // Could be a sub-dependency issue, but we are only interested in
-        // the top-level version mismatch.
-        /"(.*?)" from the root project/.exec(data.dependencies.tailwindcss.invalid)?.[1] ??
-        // Fallback to the installed version
-        installedTailwindVersion(base)
-      )
-    } catch {
-      // We don't know how to verify, so let's just return the installed
-      // version to not block the user.
-      return installedTailwindVersion(base)
-    }
-  }
-})
-export function expectedTailwindVersion(base = process.cwd()): string {
-  return expectedCache.get(base)
-}
diff --git a/packages/@tailwindcss-upgrade/src/utils/walk-variants.ts b/packages/@tailwindcss-upgrade/src/utils/walk-variants.ts
deleted file mode 100644
index e0dd16899..000000000
--- a/packages/@tailwindcss-upgrade/src/utils/walk-variants.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import type { Candidate, Variant } from '../../../tailwindcss/src/candidate'
-
-export function* walkVariants(candidate: Candidate) {
-  function* inner(
-    variant: Variant,
-    parent: Extract<Variant, { kind: 'compound' }> | null = null,
-  ): Iterable<[Variant, Extract<Variant, { kind: 'compound' }> | null]> {
-    yield [variant, parent]
-
-    if (variant.kind === 'compound') {
-      yield* inner(variant.variant, variant)
-    }
-  }
-
-  for (let variant of candidate.variants) {
-    yield* inner(variant, null)
-  }
-}
diff --git a/packages/@tailwindcss-upgrade/src/utils/write-file-safely.ts b/packages/@tailwindcss-upgrade/src/utils/write-file-safely.ts
deleted file mode 100644
index 2ff99f9e7..000000000
--- a/packages/@tailwindcss-upgrade/src/utils/write-file-safely.ts
+++ /dev/null
@@ -1,49 +0,0 @@
-import { randomUUID } from 'node:crypto'
-import fs from 'node:fs/promises'
-import path from 'node:path'
-
-export async function writeFileSafely(file: string, contents: string) {
-  // Resolve symlinks so the rename replaces the actual target file rather than
-  // replacing the symlink itself with a regular file.
-  let realFile = await fs.realpath(file).catch(() => file)
-
-  // Start by creating a new file in the current directory that is guaranteed to
-  // be unique (via `uuid`). We can embed the `process.id` in case we need to
-  // debug things later.
-  //
-  // While we can write this to a more global `/tmp` folder, I want to be 100%
-  // sure that we are on the same file system (same drive) so the rename
-  // operation is atomic. Once the file is written, we will rename the file. If
-  // this fails, the old file is still intact, if it works we have an updated
-  // file.
-  //
-  // If this still causes problems (but it will slow things down):
-  // 1. We could make sure that we inherit the file permissions
-  // 2. Use an explicit fsync to force a flush to disk
-  let temporaryFile = path.join(
-    path.dirname(realFile),
-    `.${path.basename(realFile)}.tailwind-upgrade.${process.pid}.${randomUUID()}.tmp`,
-  )
-
-  // Write file uses the `w` flag by default, which is defined as:
-  // > Open file for writing. The file is created (if it does not exist) or truncated (if it exists).
-  // > https://nodejs.org/api/fs.html#file-system-flags
-  //
-  // Which means that if this function is actively running, and you cancel the
-  // process at the wrong time, then the truncated files are present. Since all
-  // these migrations happen in parallel, multiple files are open and available
-  // to be written to, it could mean in multiple truncated files.
-  //
-  // Writing to a temp file first means that if the process is cancelled at this
-  // point, that the old original file is still correct.
-  //
-  // The rename part should be atomic (especially because we guarantee it to be
-  // on the same file system) so this either succeeds or doesn't happen.
-  try {
-    await fs.writeFile(temporaryFile, contents, 'utf8')
-    await fs.rename(temporaryFile, realFile)
-  } catch (error) {
-    await fs.unlink(temporaryFile).catch(() => {})
-    throw error
-  }
-}
diff --git a/packages/@tailwindcss-vite/README.md b/packages/@tailwindcss-vite/README.md
index 1a5d25c73..95ec9d87d 100644
--- a/packages/@tailwindcss-vite/README.md
+++ b/packages/@tailwindcss-vite/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,50 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
-
----
-
-## `@tailwindcss/vite` plugin API
-
-### Enabling or disabling Lightning CSS
-
-By default, this plugin detects whether or not the CSS is being built for production by checking the `NODE_ENV` environment variable. When building for production Lightning CSS will be enabled otherwise it is disabled.
-
-If you want to always enable or disable Lightning CSS the `optimize` option may be used:
-
-```js
-import tailwindcss from '@tailwindcss/vite'
-import { defineConfig } from 'vite'
-
-export default defineConfig({
-  plugins: [
-    tailwindcss({
-      // Disable Lightning CSS optimization
-      optimize: false,
-    }),
-  ],
-})
-```
-
-It's also possible to keep Lightning CSS enabled but disable minification:
-
-```js
-import tailwindcss from '@tailwindcss/vite'
-import { defineConfig } from 'vite'
-
-export default defineConfig({
-  plugins: [
-    tailwindcss({
-      // Enable Lightning CSS but disable minification
-      optimize: { minify: false },
-    }),
-  ],
-})
-```
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/@tailwindcss-vite/package.json b/packages/@tailwindcss-vite/package.json
index 821704a1d..3aae1c7cb 100644
--- a/packages/@tailwindcss-vite/package.json
+++ b/packages/@tailwindcss-vite/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@tailwindcss/vite",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "repository": {
@@ -24,12 +24,13 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.mts",
-      "default": "./dist/index.mjs"
+      "import": "./dist/index.mjs"
     }
   },
   "dependencies": {
     "@tailwindcss/node": "workspace:*",
     "@tailwindcss/oxide": "workspace:*",
+    "lightningcss": "catalog:",
     "tailwindcss": "workspace:*"
   },
   "devDependencies": {
@@ -37,6 +38,6 @@
     "vite": "catalog:"
   },
   "peerDependencies": {
-    "vite": "^5.2.0 || ^6 || ^7 || ^8"
+    "vite": "^5.2.0 || ^6"
   }
 }
diff --git a/packages/@tailwindcss-vite/src/index.ts b/packages/@tailwindcss-vite/src/index.ts
index 8fc660eaa..1d27ee168 100644
--- a/packages/@tailwindcss-vite/src/index.ts
+++ b/packages/@tailwindcss-vite/src/index.ts
@@ -1,178 +1,42 @@
-import {
-  compile,
-  env,
-  Features,
-  Instrumentation,
-  normalizePath,
-  optimize,
-  toSourceMap,
-} from '@tailwindcss/node'
+import { compile, env, Features, Instrumentation, normalizePath } from '@tailwindcss/node'
 import { clearRequireCache } from '@tailwindcss/node/require-cache'
 import { Scanner } from '@tailwindcss/oxide'
+import { Features as LightningCssFeatures, transform } from 'lightningcss'
 import fs from 'node:fs/promises'
 import path from 'node:path'
-import type { Environment, InternalResolveOptions, Plugin, ResolvedConfig } from 'vite'
-import * as vite from 'vite'
+import type { Plugin, ResolvedConfig, ViteDevServer } from 'vite'
 
 const DEBUG = env.DEBUG
 const SPECIAL_QUERY_RE = /[?&](?:worker|sharedworker|raw|url)\b/
 const COMMON_JS_PROXY_RE = /\?commonjs-proxy/
-const INLINE_STYLE_ID_RE = /[?&]index=\d+\.css$/
+const INLINE_STYLE_ID_RE = /[?&]index\=\d+\.css$/
 
-export type PluginOptions = {
-  /**
-   * Optimize and minify the output CSS.
-   */
-  optimize?: boolean | { minify?: boolean }
-}
-
-function createCustomResolver(
-  resolvers: ((id: string, importer: string) => Promise<string | undefined>)[],
-  filter = (_path: string) => true,
-) {
-  return async (id: string, base: string) => {
-    // The resolver expects an `importer` file. We don't really know where the
-    // current `id` was imported from, but Vite will essentially do a
-    // `path.dirname(importer)` so it doesn't really matter.
-    //
-    // It does matter that this is a file, otherwise we would go up a directory,
-    // which means that we would be resolving files from a parent folder first,
-    // instead of the current folder we are in.
-    let importer = path.resolve(base, '__placeholder__.ts')
-
-    for (let resolver of resolvers) {
-      let resolved = await resolver(id, importer)
-
-      // If we didn't resolve, we don't have to bail immediately, but we can try
-      // the next resolver
-      if (!resolved) continue
-
-      if (resolved === id) continue
-
-      // Looks like a relative file, let's resolve it to an absolute path
-      if (resolved[0] === '.') resolved = path.resolve(base, resolved)
-
-      // Must adhere to additional filters (e.g.: must be a .css file)
-      if (!filter(resolved)) continue
-
-      // If it's not an absolute path, then we don't really know how to read
-      // the file from disk.
-      if (!path.isAbsolute(resolved)) continue
-
-      return resolved
-    }
-  }
-}
-
-export default function tailwindcss(opts: PluginOptions = {}): Plugin[] {
+export default function tailwindcss(): Plugin[] {
+  let servers: ViteDevServer[] = []
   let config: ResolvedConfig | null = null
-  let rootsByEnv = new DefaultMap<string, Map<string, Root>>((env: string) => new Map())
 
   let isSSR = false
-  let shouldOptimize = true
-  let minify = true
+  let minify = false
 
-  function createRoot(env: Environment | null, id: string) {
-    type ResolveFn = (id: string, base: string) => Promise<string | false | undefined>
-
-    let customCssResolver: ResolveFn
-    let customJsResolver: ResolveFn
-
-    if (!env) {
-      // Older, pre-environment Vite API
-      // TODO: Can we drop this??
-      let cssResolver = config!.createResolver({
-        ...config!.resolve,
-        extensions: ['.css'],
-        mainFields: ['style'],
-        conditions: ['style', 'development|production'],
-        tryIndex: false,
-        preferRelative: true,
-      })
-
-      let jsResolver = config!.createResolver(config!.resolve)
-
-      customCssResolver = createCustomResolver(
-        [
-          (id, importer) => cssResolver(id, importer, true, isSSR),
-          (id, importer) => cssResolver(id, importer, false, isSSR),
-        ],
-        (path) => path.endsWith('.css'),
-      )
-      customJsResolver = createCustomResolver(
-        [
-          (id, importer) => jsResolver(id, importer, true, isSSR),
-          (id, importer) => jsResolver(id, importer, false, isSSR),
-        ],
-        (path) => !path.endsWith('.css'),
-      )
-    } else {
-      type ResolveIdFn = (
-        environment: Environment,
-        id: string,
-        importer?: string,
-        aliasOnly?: boolean,
-      ) => Promise<string | undefined>
-
-      // There are cases where Environment API is available,
-      // but `createResolver` is still overridden (for example astro v5)
-      //
-      // Copied as-is from vite, because this function is not a part of public API
-      //
-      // TODO: Remove this function and pre-environment code when Vite < 7 is no longer supported
-      function createBackCompatIdResolver(
-        config: ResolvedConfig,
-        options?: Partial<InternalResolveOptions>,
-      ): ResolveIdFn {
-        const compatResolve = config.createResolver(options)
-        let resolve: ResolveIdFn
-        return async (environment, id, importer, aliasOnly) => {
-          if (environment.name === 'client' || environment.name === 'ssr') {
-            return compatResolve(id, importer, aliasOnly, environment.name === 'ssr')
-          }
-          resolve ??= vite.createIdResolver(config, options)
-          return resolve(environment, id, importer, aliasOnly)
-        }
-      }
-
-      // Newer Vite versions
-      let cssResolver = createBackCompatIdResolver(env.config, {
-        ...env.config.resolve,
-        extensions: ['.css'],
-        mainFields: ['style'],
-        conditions: ['style', 'development|production'],
-        tryIndex: false,
-        preferRelative: true,
-      })
-
-      let jsResolver = createBackCompatIdResolver(env.config, env.config.resolve)
-
-      customCssResolver = createCustomResolver(
-        [
-          (id, importer) => cssResolver(env, id, importer, true),
-          (id, importer) => cssResolver(env, id, importer, false),
-        ],
-        (path) => path.endsWith('.css'),
-      )
-      customJsResolver = createCustomResolver(
-        [
-          (id, importer) => jsResolver(env, id, importer, true),
-          (id, importer) => jsResolver(env, id, importer, false),
-        ],
-        (path) => !path.endsWith('.css'),
-      )
+  let roots: DefaultMap<string, Root> = new DefaultMap((id) => {
+    let cssResolver = config!.createResolver({
+      ...config!.resolve,
+      extensions: ['.css'],
+      mainFields: ['style'],
+      conditions: ['style', 'development|production'],
+      tryIndex: false,
+      preferRelative: true,
+    })
+    function customCssResolver(id: string, base: string) {
+      return cssResolver(id, base, true, isSSR)
     }
 
-    return new Root(
-      id,
-      config!.root,
-      // Currently, Vite only supports CSS source maps in development and they
-      // are off by default. Check to see if we need them or not.
-      config?.css.devSourcemap ?? false,
-      customCssResolver,
-      customJsResolver,
-    )
-  }
+    let jsResolver = config!.createResolver(config!.resolve)
+    function customJsResolver(id: string, base: string) {
+      return jsResolver(id, base, true, isSSR)
+    }
+    return new Root(id, config!.root, customCssResolver, customJsResolver)
+  })
 
   return [
     {
@@ -180,24 +44,14 @@ export default function tailwindcss(opts: PluginOptions = {}): Plugin[] {
       name: '@tailwindcss/vite:scan',
       enforce: 'pre',
 
+      configureServer(server) {
+        servers.push(server)
+      },
+
       async configResolved(_config) {
         config = _config
+        minify = config.build.cssMinify !== false
         isSSR = config.build.ssr !== false && config.build.ssr !== undefined
-
-        // By default we optimize CSS during the build phase but if the user
-        // provides explicit options we'll use those instead
-        if (opts.optimize !== undefined) {
-          shouldOptimize = opts.optimize !== false
-        }
-
-        // Minification is also performed when optimizing as long as it's also
-        // enabled in Vite
-        minify = shouldOptimize && config.build.cssMinify !== false
-
-        // But again, the user can override that choice explicitly
-        if (typeof opts.optimize === 'object') {
-          minify = opts.optimize.minify !== false
-        }
       },
     },
 
@@ -206,35 +60,23 @@ export default function tailwindcss(opts: PluginOptions = {}): Plugin[] {
       name: '@tailwindcss/vite:generate:serve',
       apply: 'serve',
       enforce: 'pre',
-      transform: {
-        filter: {
-          id: {
-            exclude: [/\/\.vite\//, SPECIAL_QUERY_RE, COMMON_JS_PROXY_RE],
-            include: [/\.css(?:\?.*)?$/, /&lang\.css/, INLINE_STYLE_ID_RE],
-          },
-        },
-        async handler(src, id) {
-          if (!isPotentialCssRootFile(id)) return
 
-          using I = new Instrumentation()
-          DEBUG && I.start('[@tailwindcss/vite] Generate CSS (serve)')
+      async transform(src, id, options) {
+        if (!isPotentialCssRootFile(id)) return
 
-          let roots = rootsByEnv.get(this.environment?.name ?? 'default')
-          let root = roots.get(id)
-          if (!root) {
-            root ??= createRoot(this.environment ?? null, id)
-            roots.set(id, root)
-          }
+        using I = new Instrumentation()
+        DEBUG && I.start('[@tailwindcss/vite] Generate CSS (serve)')
 
-          let result = await root.generate(src, (file) => this.addWatchFile(file), I)
-          if (!result) {
-            roots.delete(id)
-            return
-          }
+        let root = roots.get(id)
 
-          DEBUG && I.end('[@tailwindcss/vite] Generate CSS (serve)')
-          return result
-        },
+        let generated = await root.generate(src, (file) => this.addWatchFile(file), I)
+        if (!generated) {
+          roots.delete(id)
+          return src
+        }
+
+        DEBUG && I.end('[@tailwindcss/vite] Generate CSS (serve)')
+        return { code: generated }
       },
     },
 
@@ -243,44 +85,27 @@ export default function tailwindcss(opts: PluginOptions = {}): Plugin[] {
       name: '@tailwindcss/vite:generate:build',
       apply: 'build',
       enforce: 'pre',
-      transform: {
-        filter: {
-          id: {
-            exclude: [/\/\.vite\//, SPECIAL_QUERY_RE, COMMON_JS_PROXY_RE],
-            include: [/\.css(?:\?.*)?$/, /&lang\.css/, INLINE_STYLE_ID_RE],
-          },
-        },
-        async handler(src, id) {
-          if (!isPotentialCssRootFile(id)) return
 
-          using I = new Instrumentation()
-          DEBUG && I.start('[@tailwindcss/vite] Generate CSS (build)')
+      async transform(src, id) {
+        if (!isPotentialCssRootFile(id)) return
 
-          let roots = rootsByEnv.get(this.environment?.name ?? 'default')
-          let root = roots.get(id)
-          if (!root) {
-            root ??= createRoot(this.environment ?? null, id)
-            roots.set(id, root)
-          }
+        using I = new Instrumentation()
+        DEBUG && I.start('[@tailwindcss/vite] Generate CSS (build)')
 
-          let result = await root.generate(src, (file) => this.addWatchFile(file), I)
-          if (!result) {
-            roots.delete(id)
-            return
-          }
-          DEBUG && I.end('[@tailwindcss/vite] Generate CSS (build)')
+        let root = roots.get(id)
 
-          if (shouldOptimize) {
-            DEBUG && I.start('[@tailwindcss/vite] Optimize CSS')
-            result = optimize(result.code, {
-              minify,
-              map: result.map,
-            })
-            DEBUG && I.end('[@tailwindcss/vite] Optimize CSS')
-          }
+        let generated = await root.generate(src, (file) => this.addWatchFile(file), I)
+        if (!generated) {
+          roots.delete(id)
+          return src
+        }
+        DEBUG && I.end('[@tailwindcss/vite] Generate CSS (build)')
 
-          return result
-        },
+        DEBUG && I.start('[@tailwindcss/vite] Optimize CSS')
+        generated = optimizeCss(generated, { minify })
+        DEBUG && I.end('[@tailwindcss/vite] Optimize CSS')
+
+        return { code: generated }
       },
     },
   ] satisfies Plugin[]
@@ -292,18 +117,52 @@ function getExtension(id: string) {
 }
 
 function isPotentialCssRootFile(id: string) {
-  if (id.includes('/.vite/')) return false
-
-  // Don't intercept special static asset resources
-  if (SPECIAL_QUERY_RE.test(id)) return false
-  if (COMMON_JS_PROXY_RE.test(id)) return false
-
+  if (id.includes('/.vite/')) return
   let extension = getExtension(id)
-  let isCssFile = extension === 'css' || id.includes('&lang.css') || id.match(INLINE_STYLE_ID_RE)
-
+  let isCssFile =
+    (extension === 'css' || id.includes('&lang.css') || id.match(INLINE_STYLE_ID_RE)) &&
+    // Don't intercept special static asset resources
+    !SPECIAL_QUERY_RE.test(id) &&
+    !COMMON_JS_PROXY_RE.test(id)
   return isCssFile
 }
 
+function optimizeCss(
+  input: string,
+  { file = 'input.css', minify = false }: { file?: string; minify?: boolean } = {},
+) {
+  function optimize(code: Buffer | Uint8Array | any) {
+    return transform({
+      filename: file,
+      code,
+      minify,
+      sourceMap: false,
+      drafts: {
+        customMedia: true,
+      },
+      nonStandard: {
+        deepSelectorCombinator: true,
+      },
+      include: LightningCssFeatures.Nesting,
+      exclude:
+        LightningCssFeatures.LogicalProperties |
+        LightningCssFeatures.DirSelector |
+        LightningCssFeatures.LightDark,
+      targets: {
+        safari: (16 << 16) | (4 << 8),
+        ios_saf: (16 << 16) | (4 << 8),
+        firefox: 128 << 16,
+        chrome: 111 << 16,
+      },
+      errorRecovery: true,
+    }).code
+  }
+
+  // Running Lightning CSS twice to ensure that adjacent rules are merged after
+  // nesting is applied. This creates a more optimized output.
+  return optimize(optimize(Buffer.from(input))).toString()
+}
+
 function idToPath(id: string) {
   return path.resolve(id.replace(/\?.*$/, ''))
 }
@@ -351,7 +210,6 @@ class Root {
     private id: string,
     private base: string,
 
-    private enableSourceMaps: boolean,
     private customCssResolver: (id: string, base: string) => Promise<string | false | undefined>,
     private customJsResolver: (id: string, base: string) => Promise<string | false | undefined>,
   ) {}
@@ -362,33 +220,20 @@ class Root {
     content: string,
     _addWatchFile: (file: string) => void,
     I: Instrumentation,
-  ): Promise<
-    | {
-        code: string
-        map: string | undefined
-      }
-    | false
-  > {
-    let inputPath = idToPath(this.id)
-
+  ): Promise<string | false> {
     function addWatchFile(file: string) {
-      // Don't watch the input file since it's already a dependency and causes
-      // issues with some setups (e.g. Qwik).
-      if (file === inputPath) {
-        return
-      }
-
       // Scanning `.svg` file containing a `#` or `?` in the path will
       // crash Vite. We work around this for now by ignoring updates to them.
       //
       // https://github.com/tailwindlabs/tailwindcss/issues/16877
-      if (/[#?].*\.svg$/.test(file)) {
+      if (/[\#\?].*\.svg$/.test(file)) {
         return
       }
       _addWatchFile(file)
     }
 
     let requiresBuildPromise = this.requiresBuild()
+    let inputPath = idToPath(this.id)
     let inputBase = path.dirname(path.resolve(inputPath))
 
     if (!this.compiler || !this.scanner || (await requiresBuildPromise)) {
@@ -400,7 +245,6 @@ class Root {
       DEBUG && I.start('Setup compiler')
       let addBuildDependenciesPromises: Promise<void>[] = []
       this.compiler = await compile(content, {
-        from: this.enableSourceMaps ? this.id : undefined,
         base: inputBase,
         shouldRewriteUrls: true,
         onDependency: (path) => {
@@ -424,12 +268,12 @@ class Root {
 
         // No root specified, auto-detect based on the `**/*` pattern
         if (this.compiler.root === null) {
-          return [{ base: this.base, pattern: '**/*', negated: false }]
+          return [{ base: this.base, pattern: '**/*' }]
         }
 
         // Use the specified root
-        return [{ ...this.compiler.root, negated: false }]
-      })().concat(this.compiler.sources)
+        return [this.compiler.root]
+      })().concat(this.compiler.globs)
 
       this.scanner = new Scanner({ sources })
       DEBUG && I.end('Setup scanner')
@@ -442,11 +286,7 @@ class Root {
     if (
       !(
         this.compiler.features &
-        (Features.AtApply |
-          Features.JsPluginCompat |
-          Features.ThemeFunction |
-          Features.Utilities |
-          Features.Variants)
+        (Features.AtApply | Features.JsPluginCompat | Features.ThemeFunction | Features.Utilities)
       )
     ) {
       return false
@@ -464,7 +304,6 @@ class Root {
     }
 
     if (this.compiler.features & Features.Utilities) {
-      DEBUG && I.start('Register dependency messages')
       // Watch individual files found via custom `@source` paths
       for (let file of this.scanner.files) {
         addWatchFile(file)
@@ -501,21 +340,13 @@ class Root {
           }
         }
       }
-      DEBUG && I.end('Register dependency messages')
     }
 
     DEBUG && I.start('Build CSS')
-    let code = this.compiler.build([...this.candidates])
+    let result = this.compiler.build([...this.candidates])
     DEBUG && I.end('Build CSS')
 
-    DEBUG && I.start('Build Source Map')
-    let map = this.enableSourceMaps ? toSourceMap(this.compiler.buildSourceMap()).raw : undefined
-    DEBUG && I.end('Build Source Map')
-
-    return {
-      code,
-      map,
-    }
+    return result
   }
 
   private async addBuildDependency(path: string) {
diff --git a/packages/@tailwindcss-webpack/README.md b/packages/@tailwindcss-webpack/README.md
deleted file mode 100644
index 56484ed7f..000000000
--- a/packages/@tailwindcss-webpack/README.md
+++ /dev/null
@@ -1,102 +0,0 @@
-<p align="center">
-  <a href="https://tailwindcss.com" target="_blank">
-    <picture>
-      <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-dark.svg">
-      <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg">
-      <img alt="Tailwind CSS" src="https://raw.githubusercontent.com/tailwindlabs/tailwindcss/HEAD/.github/logo-light.svg" width="350" height="70" style="max-width: 100%;">
-    </picture>
-  </a>
-</p>
-
-<p align="center">
-  A utility-first CSS framework for rapidly building custom user interfaces.
-</p>
-
-<p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
-    <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
-</p>
-
----
-
-## Documentation
-
-For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
-
-## Community
-
-For help, discussion about best practices, or feature ideas:
-
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
-
-## Contributing
-
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
-
----
-
-## @tailwindcss/webpack
-
-A webpack loader for Tailwind CSS v4.
-
-## Installation
-
-```sh
-npm install @tailwindcss/webpack
-```
-
-### Usage
-
-```javascript
-// webpack.config.js
-const MiniCssExtractPlugin = require('mini-css-extract-plugin')
-
-module.exports = {
-  plugins: [new MiniCssExtractPlugin()],
-  module: {
-    rules: [
-      {
-        test: /\.css$/i,
-        use: [MiniCssExtractPlugin.loader, 'css-loader', '@tailwindcss/webpack'],
-      },
-    ],
-  },
-}
-```
-
-Then create a CSS file that imports Tailwind:
-
-```css
-/* src/index.css */
-@import 'tailwindcss';
-```
-
-### Options
-
-#### `base`
-
-The base directory to scan for class candidates. Defaults to the current working directory.
-
-```javascript
-{
-  loader: '@tailwindcss/webpack',
-  options: {
-    base: process.cwd(),
-  },
-}
-```
-
-#### `optimize`
-
-Whether to optimize and minify the output CSS. Defaults to `true` in production mode.
-
-```javascript
-{
-  loader: '@tailwindcss/webpack',
-  options: {
-    optimize: true, // or { minify: true }
-  },
-}
-```
diff --git a/packages/@tailwindcss-webpack/src/index.cts b/packages/@tailwindcss-webpack/src/index.cts
deleted file mode 100644
index dbdded748..000000000
--- a/packages/@tailwindcss-webpack/src/index.cts
+++ /dev/null
@@ -1,5 +0,0 @@
-import tailwindLoader from './index.ts'
-
-// CommonJS export for webpack loaders - must be the function directly
-// @ts-ignore
-export = tailwindLoader
diff --git a/packages/@tailwindcss-webpack/src/index.ts b/packages/@tailwindcss-webpack/src/index.ts
deleted file mode 100644
index 6d02f1f0b..000000000
--- a/packages/@tailwindcss-webpack/src/index.ts
+++ /dev/null
@@ -1,287 +0,0 @@
-import QuickLRU from '@alloc/quick-lru'
-import {
-  compile,
-  env,
-  Features,
-  Instrumentation,
-  normalizePath,
-  optimize,
-  Polyfills,
-} from '@tailwindcss/node'
-import { clearRequireCache } from '@tailwindcss/node/require-cache'
-import { Scanner } from '@tailwindcss/oxide'
-import fs from 'node:fs'
-import path from 'node:path'
-import type { LoaderContext } from 'webpack'
-
-const DEBUG = env.DEBUG
-
-export interface LoaderOptions {
-  /**
-   * The base directory to scan for class candidates.
-   *
-   * Defaults to the current working directory.
-   */
-  base?: string
-
-  /**
-   * Optimize and minify the output CSS.
-   */
-  optimize?: boolean | { minify?: boolean }
-}
-
-interface CacheEntry {
-  mtimes: Map<string, number>
-  compiler: null | Awaited<ReturnType<typeof compile>>
-  scanner: null | Scanner
-  candidates: Set<string>
-  fullRebuildPaths: string[]
-}
-
-const cache = new QuickLRU<string, CacheEntry>({ maxSize: 50 })
-
-function getCacheKey(resourceId: string, opts: LoaderOptions): string {
-  return `${resourceId}:${opts.base ?? ''}:${JSON.stringify(opts.optimize)}`
-}
-
-function getContextFromCache(resourceId: string, opts: LoaderOptions): CacheEntry {
-  let key = getCacheKey(resourceId, opts)
-  if (cache.has(key)) return cache.get(key)!
-  let entry: CacheEntry = {
-    mtimes: new Map<string, number>(),
-    compiler: null,
-    scanner: null,
-    candidates: new Set<string>(),
-    fullRebuildPaths: [],
-  }
-  cache.set(key, entry)
-  return entry
-}
-
-export default async function tailwindLoader(
-  this: LoaderContext<LoaderOptions>,
-  source: string,
-): Promise<void> {
-  let callback = this.async()
-  let options = this.getOptions() ?? {}
-  let inputFile = this.resourcePath
-  let resourceId = this.resource
-  let base = options.base ?? process.cwd()
-  let shouldOptimize = options.optimize ?? process.env.NODE_ENV === 'production'
-  let isCSSModuleFile = inputFile.endsWith('.module.css')
-
-  using I = new Instrumentation()
-
-  DEBUG && I.start(`[@tailwindcss/webpack] ${path.relative(base, inputFile)}`)
-
-  // Bail out early if this is guaranteed to be a non-Tailwind CSS file.
-  {
-    DEBUG && I.start('Quick bail check')
-    let canBail = !/@(import|reference|theme|variant|config|plugin|apply|tailwind)\b/.test(source)
-    if (canBail) {
-      DEBUG && I.end('Quick bail check')
-      DEBUG && I.end(`[@tailwindcss/webpack] ${path.relative(base, inputFile)}`)
-      callback(null, source)
-      return
-    }
-    DEBUG && I.end('Quick bail check')
-  }
-
-  try {
-    let context = getContextFromCache(resourceId, options)
-    let inputBasePath = path.dirname(path.resolve(inputFile))
-
-    // Whether this is the first build or not
-    let isInitialBuild = context.compiler === null
-
-    async function createCompiler() {
-      DEBUG && I.start('Setup compiler')
-      if (context.fullRebuildPaths.length > 0 && !isInitialBuild) {
-        clearRequireCache(context.fullRebuildPaths)
-      }
-
-      context.fullRebuildPaths = []
-
-      DEBUG && I.start('Create compiler')
-      let compiler = await compile(source, {
-        from: inputFile,
-        base: inputBasePath,
-        shouldRewriteUrls: true,
-        onDependency: (depPath) => context.fullRebuildPaths.push(depPath),
-        // In CSS Module files, we have to disable the `@property` polyfill since these will
-        // emit global `*` rules which are considered to be non-pure and will cause builds
-        // to fail.
-        polyfills: isCSSModuleFile ? Polyfills.All ^ Polyfills.AtProperty : Polyfills.All,
-      })
-      DEBUG && I.end('Create compiler')
-
-      DEBUG && I.end('Setup compiler')
-      return compiler
-    }
-
-    // Setup the compiler if it doesn't exist yet
-    context.compiler ??= await createCompiler()
-
-    // Early exit if no Tailwind features are used
-    if (context.compiler.features === Features.None) {
-      DEBUG && I.end(`[@tailwindcss/webpack] ${path.relative(base, inputFile)}`)
-      callback(null, source)
-      return
-    }
-
-    let rebuildStrategy: 'full' | 'incremental' = 'incremental'
-
-    // Track file modification times to CSS files
-    DEBUG && I.start('Register full rebuild paths')
-    {
-      // Report dependencies for config files, plugins, etc.
-      for (let file of context.fullRebuildPaths) {
-        this.addDependency(path.resolve(file))
-      }
-
-      let files = [...context.fullRebuildPaths, inputFile]
-
-      for (let file of files) {
-        let changedTime: number | null = null
-        try {
-          changedTime = fs.statSync(file)?.mtimeMs ?? null
-        } catch {
-          // File might not exist
-        }
-
-        if (changedTime === null) {
-          if (file === inputFile) {
-            rebuildStrategy = 'full'
-          }
-          continue
-        }
-
-        let prevTime = context.mtimes.get(file)
-        if (prevTime === changedTime) continue
-
-        rebuildStrategy = 'full'
-        context.mtimes.set(file, changedTime)
-      }
-    }
-    DEBUG && I.end('Register full rebuild paths')
-
-    if (rebuildStrategy === 'full' && !isInitialBuild) {
-      context.compiler = await createCompiler()
-    }
-
-    let compiler = context.compiler
-
-    // Check if we need to process this file at all
-    if (
-      !(
-        compiler.features &
-        (Features.AtApply | Features.JsPluginCompat | Features.ThemeFunction | Features.Utilities)
-      )
-    ) {
-      DEBUG && I.end(`[@tailwindcss/webpack] ${path.relative(base, inputFile)}`)
-      callback(null, source)
-      return
-    }
-
-    // Setup or update scanner if needed
-    if (context.scanner === null || rebuildStrategy === 'full') {
-      DEBUG && I.start('Setup scanner')
-      let sources = (() => {
-        // Disable auto source detection
-        if (compiler.root === 'none') {
-          return []
-        }
-
-        // No root specified, use the base directory
-        if (compiler.root === null) {
-          return [{ base, pattern: '**/*', negated: false }]
-        }
-
-        // Use the specified root
-        return [{ ...compiler.root, negated: false }]
-      })().concat(compiler.sources)
-
-      context.scanner = new Scanner({ sources })
-      DEBUG && I.end('Setup scanner')
-    }
-
-    // Scan for candidates if utilities are used
-    if (compiler.features & Features.Utilities) {
-      DEBUG && I.start('Scan for candidates')
-      for (let candidate of context.scanner.scan()) {
-        context.candidates.add(candidate)
-      }
-      DEBUG && I.end('Scan for candidates')
-
-      DEBUG && I.start('Register dependency messages')
-      // Add all found files as direct dependencies
-      let resolvedInputFile = path.resolve(base, inputFile)
-      for (let file of context.scanner.files) {
-        let absolutePath = path.resolve(file)
-        // The CSS file cannot be a dependency of itself
-        if (absolutePath === resolvedInputFile) {
-          continue
-        }
-        this.addDependency(absolutePath)
-      }
-
-      // Register context dependencies for glob patterns
-      for (let glob of context.scanner.globs) {
-        // Skip negated patterns
-        if (glob.pattern[0] === '!') continue
-
-        // Avoid adding a dependency on the base directory itself
-        if (glob.pattern === '*' && base === glob.base) {
-          continue
-        }
-
-        this.addContextDependency(path.resolve(glob.base))
-      }
-
-      // Validate that source(...) paths are directories
-      let root = compiler.root
-      if (root !== 'none' && root !== null) {
-        let basePath = normalizePath(path.resolve(root.base, root.pattern))
-        try {
-          let stats = fs.statSync(basePath)
-          if (!stats.isDirectory()) {
-            throw new Error(
-              `The path given to \`source(…)\` must be a directory but got \`source(${basePath})\` instead.`,
-            )
-          }
-        } catch (err) {
-          if ((err as NodeJS.ErrnoException).code !== 'ENOENT') {
-            throw err
-          }
-          // Directory doesn't exist yet, which is fine
-        }
-      }
-      DEBUG && I.end('Register dependency messages')
-    }
-
-    DEBUG && I.start('Build utilities')
-    let css = compiler.build([...context.candidates])
-    DEBUG && I.end('Build utilities')
-
-    // Optionally optimize the output
-    let result = css
-    if (shouldOptimize) {
-      DEBUG && I.start('Optimization')
-      let optimized = optimize(css, {
-        minify: typeof shouldOptimize === 'object' ? shouldOptimize.minify : true,
-      })
-      result = optimized.code
-      DEBUG && I.end('Optimization')
-    }
-
-    DEBUG && I.end(`[@tailwindcss/webpack] ${path.relative(base, inputFile)}`)
-    callback(null, result)
-  } catch (error) {
-    // Clear the cache entry on error to force a full rebuild next time
-    let key = getCacheKey(resourceId, options)
-    cache.delete(key)
-
-    DEBUG && I.end(`[@tailwindcss/webpack] ${path.relative(base, inputFile)}`)
-    callback(error as Error)
-  }
-}
diff --git a/packages/@tailwindcss-webpack/tsconfig.json b/packages/@tailwindcss-webpack/tsconfig.json
deleted file mode 100644
index d2131cbeb..000000000
--- a/packages/@tailwindcss-webpack/tsconfig.json
+++ /dev/null
@@ -1,6 +0,0 @@
-{
-  "extends": "../tsconfig.base.json",
-  "compilerOptions": {
-    "verbatimModuleSyntax": false,
-  },
-}
diff --git a/packages/@tailwindcss-webpack/tsup.config.ts b/packages/@tailwindcss-webpack/tsup.config.ts
deleted file mode 100644
index 998eebe4f..000000000
--- a/packages/@tailwindcss-webpack/tsup.config.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { defineConfig } from 'tsup'
-
-export default defineConfig([
-  {
-    format: ['esm'],
-    clean: true,
-    minify: true,
-    cjsInterop: true,
-    dts: true,
-    entry: ['src/index.ts'],
-  },
-  {
-    format: ['cjs'],
-    minify: true,
-    cjsInterop: true,
-    dts: true,
-    entry: ['src/index.cts'],
-  },
-])
diff --git a/packages/tailwindcss/README.md b/packages/tailwindcss/README.md
index 5f532607d..95ec9d87d 100644
--- a/packages/tailwindcss/README.md
+++ b/packages/tailwindcss/README.md
@@ -13,10 +13,10 @@
 </p>
 
 <p align="center">
-    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=main" alt="Build Status"></a>
+    <a href="https://github.com/tailwindlabs/tailwindcss/actions"><img src="https://img.shields.io/github/actions/workflow/status/tailwindlabs/tailwindcss/ci.yml?branch=next" alt="Build Status"></a>
     <a href="https://www.npmjs.com/package/tailwindcss"><img src="https://img.shields.io/npm/dt/tailwindcss.svg" alt="Total Downloads"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
-    <a href="https://github.com/tailwindlabs/tailwindcss/blob/main/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/releases"><img src="https://img.shields.io/npm/v/tailwindcss.svg" alt="Latest Release"></a>
+    <a href="https://github.com/tailwindcss/tailwindcss/blob/master/LICENSE"><img src="https://img.shields.io/npm/l/tailwindcss.svg" alt="License"></a>
 </p>
 
 ---
@@ -27,10 +27,14 @@ For full documentation, visit [tailwindcss.com](https://tailwindcss.com).
 
 ## Community
 
-For help, discussion about best practices, or feature ideas:
+For help, discussion about best practices, or any other conversation that would benefit from being searchable:
 
-[Discuss Tailwind CSS on GitHub](https://github.com/tailwindlabs/tailwindcss/discussions)
+[Discuss Tailwind CSS on GitHub](https://github.com/tailwindcss/tailwindcss/discussions)
+
+For chatting with others using the framework:
+
+[Join the Tailwind CSS Discord Server](https://discord.gg/7NF8GNe)
 
 ## Contributing
 
-If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindlabs/tailwindcss/blob/main/.github/CONTRIBUTING.md) **before submitting a pull request**.
+If you're interested in contributing to Tailwind CSS, please read our [contributing docs](https://github.com/tailwindcss/tailwindcss/blob/next/.github/CONTRIBUTING.md) **before submitting a pull request**.
diff --git a/packages/tailwindcss/package.json b/packages/tailwindcss/package.json
index d1288d6fa..5e1c7a73d 100644
--- a/packages/tailwindcss/package.json
+++ b/packages/tailwindcss/package.json
@@ -1,6 +1,6 @@
 {
   "name": "tailwindcss",
-  "version": "4.3.3",
+  "version": "4.0.15",
   "description": "A utility-first CSS framework for rapidly building custom user interfaces.",
   "license": "MIT",
   "repository": {
@@ -127,12 +127,9 @@
     "utilities.css"
   ],
   "devDependencies": {
-    "@jridgewell/remapping": "^2.3.5",
     "@tailwindcss/oxide": "workspace:^",
     "@types/node": "catalog:",
-    "dedent": "catalog:",
     "lightningcss": "catalog:",
-    "magic-string": "^1.1.0",
-    "source-map-js": "^1.2.1"
+    "dedent": "1.5.3"
   }
 }
diff --git a/packages/tailwindcss/playwright.config.ts b/packages/tailwindcss/playwright.config.ts
index ba8f95d70..c0a123abf 100644
--- a/packages/tailwindcss/playwright.config.ts
+++ b/packages/tailwindcss/playwright.config.ts
@@ -20,7 +20,7 @@ export default defineConfig({
   /* Opt out of parallel tests on CI. */
   workers: process.env.CI ? 1 : undefined,
   /* Reporter to use. See https://playwright.dev/docs/test-reporters */
-  reporter: [['html', { open: 'never' }]],
+  reporter: 'html',
   /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
   use: {
     /* Base URL to use in actions like `await page.goto('/')`. */
@@ -36,11 +36,10 @@ export default defineConfig({
       name: 'chromium',
       use: { ...devices['Desktop Chrome'] },
     },
-    // Playwright 1.60's Windows WebKit worker hangs on shutdown after all tests
-    // pass, causing CI to fail with a worker force-kill error.
-    ...(process.platform === 'win32'
-      ? []
-      : [{ name: 'webkit', use: { ...devices['Desktop Safari'] } }]),
+    {
+      name: 'webkit',
+      use: { ...devices['Desktop Safari'] },
+    },
     {
       name: 'firefox',
       use: {
diff --git a/packages/tailwindcss/preflight.css b/packages/tailwindcss/preflight.css
index 04e87905c..d39171b95 100644
--- a/packages/tailwindcss/preflight.css
+++ b/packages/tailwindcss/preflight.css
@@ -32,13 +32,8 @@ html,
   tab-size: 4; /* 3 */
   font-family: --theme(
     --default-font-family,
-    -apple-system,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    'Helvetica Neue',
-    'Noto Sans',
-    Arial,
+    ui-sans-serif,
+    system-ui,
     sans-serif,
     'Apple Color Emoji',
     'Segoe UI Emoji',
@@ -175,7 +170,7 @@ table {
   Use the modern Firefox focus style for all focusable elements.
 */
 
-:-moz-focusring:where(:not(iframe)) {
+:-moz-focusring {
   outline: auto;
 }
 
@@ -290,13 +285,13 @@ textarea,
 
 /*
   Set the default placeholder color to a semi-transparent version of the current text color in browsers that do not
-  crash when using `color-mix(…)` with `currentcolor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
+  crash when using `color-mix(…)` with `currentColor`. (https://github.com/tailwindlabs/tailwindcss/issues/17194)
 */
 
 @supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
   (contain-intrinsic-size: 1px) /* Safari 17+ */ {
   ::placeholder {
-    color: color-mix(in oklab, currentcolor 50%, transparent);
+    color: color-mix(in oklab, currentColor 50%, transparent);
   }
 }
 
@@ -354,14 +349,6 @@ textarea {
   padding-block: 0;
 }
 
-/*
-  Center dropdown marker shown on inputs with paired `<datalist>`s in Chrome. (https://github.com/tailwindlabs/tailwindcss/issues/18499)
-*/
-
-::-webkit-calendar-picker-indicator {
-  line-height: 1;
-}
-
 /*
   Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
 */
diff --git a/packages/tailwindcss/src/__snapshots__/index.test.ts.snap b/packages/tailwindcss/src/__snapshots__/index.test.ts.snap
index 9921709d7..049d0f33e 100644
--- a/packages/tailwindcss/src/__snapshots__/index.test.ts.snap
+++ b/packages/tailwindcss/src/__snapshots__/index.test.ts.snap
@@ -1,30 +1,8 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using the default theme 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-shadow: 0 0 #0000;
-      --tw-shadow-color: initial;
-      --tw-shadow-alpha: 100%;
-      --tw-inset-shadow: 0 0 #0000;
-      --tw-inset-shadow-color: initial;
-      --tw-inset-shadow-alpha: 100%;
-      --tw-ring-color: initial;
-      --tw-ring-shadow: 0 0 #0000;
-      --tw-inset-ring-color: initial;
-      --tw-inset-ring-shadow: 0 0 #0000;
-      --tw-ring-inset: initial;
-      --tw-ring-offset-width: 0px;
-      --tw-ring-offset-color: #fff;
-      --tw-ring-offset-shadow: 0 0 #0000;
-    }
-  }
-}
-
-:root, :host {
-  --color-red-500: oklch(63.7% .237 25.331);
+":root, :host {
+  --color-red-500: oklch(.637 .237 25.331);
   --spacing: .25rem;
 }
 
@@ -41,7 +19,7 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
 }
 
-@media (min-width: 40rem) {
+@media (width >= 40rem) {
   .sm\\:flex {
     display: flex;
   }
@@ -58,12 +36,6 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
   inherits: false
 }
 
-@property --tw-shadow-alpha {
-  syntax: "<percentage>";
-  inherits: false;
-  initial-value: 100%;
-}
-
 @property --tw-inset-shadow {
   syntax: "*";
   inherits: false;
@@ -75,12 +47,6 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
   inherits: false
 }
 
-@property --tw-inset-shadow-alpha {
-  syntax: "<percentage>";
-  inherits: false;
-  initial-value: 100%;
-}
-
 @property --tw-ring-color {
   syntax: "*";
   inherits: false
@@ -124,18 +90,14 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
   syntax: "*";
   inherits: false;
   initial-value: 0 0 #0000;
-}
-"
+}"
 `;
 
 exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = `
-"
-@layer theme {
+"@layer theme {
   :root, :host {
-    --tw-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial,
-    sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
-    --tw-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
-    monospace;
+    --tw-font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+    --tw-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
     --tw-default-font-family: var(--tw-font-sans);
     --tw-default-mono-font-family: var(--tw-font-mono);
   }
@@ -160,7 +122,7 @@ exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = `
     -webkit-text-size-adjust: 100%;
     tab-size: 4;
     line-height: 1.5;
-    font-family: var(--tw-default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
+    font-family: var(--tw-default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
     font-feature-settings: var(--tw-default-font-feature-settings, normal);
     font-variation-settings: var(--tw-default-font-variation-settings, normal);
     -webkit-tap-highlight-color: transparent;
@@ -226,7 +188,7 @@ exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = `
     border-collapse: collapse;
   }
 
-  :-moz-focusring:where(:not(iframe)) {
+  :-moz-focusring {
     outline: auto;
   }
 
@@ -292,13 +254,7 @@ exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = `
 
   @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
     ::placeholder {
-      color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      ::placeholder {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+      color: color-mix(in oklab, currentColor 50%, transparent);
     }
   }
 
@@ -359,10 +315,6 @@ exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = `
     padding-block: 0;
   }
 
-  ::-webkit-calendar-picker-indicator {
-    line-height: 1;
-  }
-
   :-moz-ui-invalid {
     box-shadow: none;
   }
@@ -388,6 +340,5 @@ exports[`compiling CSS > prefix all CSS variables inside preflight 1`] = `
   }
 }
 
-@layer components, utilities;
-"
+@layer components, utilities;"
 `;
diff --git a/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap b/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap
index d595e8c01..7fef73d37 100644
--- a/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap
+++ b/packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap
@@ -306,6 +306,66 @@ exports[`getClassList 1`] = `
   "-col-start-11",
   "-col-start-12",
   "-col-start-13",
+  "-end-0",
+  "-end-0.5",
+  "-end-1",
+  "-end-1.5",
+  "-end-2",
+  "-end-2.5",
+  "-end-3",
+  "-end-3.5",
+  "-end-4",
+  "-end-5",
+  "-end-6",
+  "-end-7",
+  "-end-8",
+  "-end-9",
+  "-end-10",
+  "-end-11",
+  "-end-12",
+  "-end-14",
+  "-end-16",
+  "-end-20",
+  "-end-24",
+  "-end-28",
+  "-end-32",
+  "-end-36",
+  "-end-40",
+  "-end-44",
+  "-end-48",
+  "-end-52",
+  "-end-56",
+  "-end-60",
+  "-end-64",
+  "-end-72",
+  "-end-80",
+  "-end-96",
+  "-end-1/2",
+  "-end-1/3",
+  "-end-1/4",
+  "-end-1/5",
+  "-end-1/6",
+  "-end-1/12",
+  "-end-2/3",
+  "-end-2/4",
+  "-end-2/5",
+  "-end-2/6",
+  "-end-2/12",
+  "-end-3/4",
+  "-end-3/5",
+  "-end-3/6",
+  "-end-3/12",
+  "-end-4/5",
+  "-end-4/6",
+  "-end-4/12",
+  "-end-5/6",
+  "-end-5/12",
+  "-end-6/12",
+  "-end-7/12",
+  "-end-8/12",
+  "-end-9/12",
+  "-end-10/12",
+  "-end-11/12",
   "-end-full",
   "-end-px",
   "-indent-0",
@@ -403,256 +463,8 @@ exports[`getClassList 1`] = `
   "-inset-9/12",
   "-inset-10/12",
   "-inset-11/12",
-  "-inset-be-0",
-  "-inset-be-0.5",
-  "-inset-be-1",
-  "-inset-be-1.5",
-  "-inset-be-2",
-  "-inset-be-2.5",
-  "-inset-be-3",
-  "-inset-be-3.5",
-  "-inset-be-4",
-  "-inset-be-5",
-  "-inset-be-6",
-  "-inset-be-7",
-  "-inset-be-8",
-  "-inset-be-9",
-  "-inset-be-10",
-  "-inset-be-11",
-  "-inset-be-12",
-  "-inset-be-14",
-  "-inset-be-16",
-  "-inset-be-20",
-  "-inset-be-24",
-  "-inset-be-28",
-  "-inset-be-32",
-  "-inset-be-36",
-  "-inset-be-40",
-  "-inset-be-44",
-  "-inset-be-48",
-  "-inset-be-52",
-  "-inset-be-56",
-  "-inset-be-60",
-  "-inset-be-64",
-  "-inset-be-72",
-  "-inset-be-80",
-  "-inset-be-96",
-  "-inset-be-1/2",
-  "-inset-be-1/3",
-  "-inset-be-1/4",
-  "-inset-be-1/5",
-  "-inset-be-1/6",
-  "-inset-be-1/12",
-  "-inset-be-2/3",
-  "-inset-be-2/4",
-  "-inset-be-2/5",
-  "-inset-be-2/6",
-  "-inset-be-2/12",
-  "-inset-be-3/4",
-  "-inset-be-3/5",
-  "-inset-be-3/6",
-  "-inset-be-3/12",
-  "-inset-be-4/5",
-  "-inset-be-4/6",
-  "-inset-be-4/12",
-  "-inset-be-5/6",
-  "-inset-be-5/12",
-  "-inset-be-6/12",
-  "-inset-be-7/12",
-  "-inset-be-8/12",
-  "-inset-be-9/12",
-  "-inset-be-10/12",
-  "-inset-be-11/12",
-  "-inset-be-full",
-  "-inset-be-px",
-  "-inset-bs-0",
-  "-inset-bs-0.5",
-  "-inset-bs-1",
-  "-inset-bs-1.5",
-  "-inset-bs-2",
-  "-inset-bs-2.5",
-  "-inset-bs-3",
-  "-inset-bs-3.5",
-  "-inset-bs-4",
-  "-inset-bs-5",
-  "-inset-bs-6",
-  "-inset-bs-7",
-  "-inset-bs-8",
-  "-inset-bs-9",
-  "-inset-bs-10",
-  "-inset-bs-11",
-  "-inset-bs-12",
-  "-inset-bs-14",
-  "-inset-bs-16",
-  "-inset-bs-20",
-  "-inset-bs-24",
-  "-inset-bs-28",
-  "-inset-bs-32",
-  "-inset-bs-36",
-  "-inset-bs-40",
-  "-inset-bs-44",
-  "-inset-bs-48",
-  "-inset-bs-52",
-  "-inset-bs-56",
-  "-inset-bs-60",
-  "-inset-bs-64",
-  "-inset-bs-72",
-  "-inset-bs-80",
-  "-inset-bs-96",
-  "-inset-bs-1/2",
-  "-inset-bs-1/3",
-  "-inset-bs-1/4",
-  "-inset-bs-1/5",
-  "-inset-bs-1/6",
-  "-inset-bs-1/12",
-  "-inset-bs-2/3",
-  "-inset-bs-2/4",
-  "-inset-bs-2/5",
-  "-inset-bs-2/6",
-  "-inset-bs-2/12",
-  "-inset-bs-3/4",
-  "-inset-bs-3/5",
-  "-inset-bs-3/6",
-  "-inset-bs-3/12",
-  "-inset-bs-4/5",
-  "-inset-bs-4/6",
-  "-inset-bs-4/12",
-  "-inset-bs-5/6",
-  "-inset-bs-5/12",
-  "-inset-bs-6/12",
-  "-inset-bs-7/12",
-  "-inset-bs-8/12",
-  "-inset-bs-9/12",
-  "-inset-bs-10/12",
-  "-inset-bs-11/12",
-  "-inset-bs-full",
-  "-inset-bs-px",
-  "-inset-e-0",
-  "-inset-e-0.5",
-  "-inset-e-1",
-  "-inset-e-1.5",
-  "-inset-e-2",
-  "-inset-e-2.5",
-  "-inset-e-3",
-  "-inset-e-3.5",
-  "-inset-e-4",
-  "-inset-e-5",
-  "-inset-e-6",
-  "-inset-e-7",
-  "-inset-e-8",
-  "-inset-e-9",
-  "-inset-e-10",
-  "-inset-e-11",
-  "-inset-e-12",
-  "-inset-e-14",
-  "-inset-e-16",
-  "-inset-e-20",
-  "-inset-e-24",
-  "-inset-e-28",
-  "-inset-e-32",
-  "-inset-e-36",
-  "-inset-e-40",
-  "-inset-e-44",
-  "-inset-e-48",
-  "-inset-e-52",
-  "-inset-e-56",
-  "-inset-e-60",
-  "-inset-e-64",
-  "-inset-e-72",
-  "-inset-e-80",
-  "-inset-e-96",
-  "-inset-e-1/2",
-  "-inset-e-1/3",
-  "-inset-e-1/4",
-  "-inset-e-1/5",
-  "-inset-e-1/6",
-  "-inset-e-1/12",
-  "-inset-e-2/3",
-  "-inset-e-2/4",
-  "-inset-e-2/5",
-  "-inset-e-2/6",
-  "-inset-e-2/12",
-  "-inset-e-3/4",
-  "-inset-e-3/5",
-  "-inset-e-3/6",
-  "-inset-e-3/12",
-  "-inset-e-4/5",
-  "-inset-e-4/6",
-  "-inset-e-4/12",
-  "-inset-e-5/6",
-  "-inset-e-5/12",
-  "-inset-e-6/12",
-  "-inset-e-7/12",
-  "-inset-e-8/12",
-  "-inset-e-9/12",
-  "-inset-e-10/12",
-  "-inset-e-11/12",
-  "-inset-e-full",
-  "-inset-e-px",
   "-inset-full",
   "-inset-px",
-  "-inset-s-0",
-  "-inset-s-0.5",
-  "-inset-s-1",
-  "-inset-s-1.5",
-  "-inset-s-2",
-  "-inset-s-2.5",
-  "-inset-s-3",
-  "-inset-s-3.5",
-  "-inset-s-4",
-  "-inset-s-5",
-  "-inset-s-6",
-  "-inset-s-7",
-  "-inset-s-8",
-  "-inset-s-9",
-  "-inset-s-10",
-  "-inset-s-11",
-  "-inset-s-12",
-  "-inset-s-14",
-  "-inset-s-16",
-  "-inset-s-20",
-  "-inset-s-24",
-  "-inset-s-28",
-  "-inset-s-32",
-  "-inset-s-36",
-  "-inset-s-40",
-  "-inset-s-44",
-  "-inset-s-48",
-  "-inset-s-52",
-  "-inset-s-56",
-  "-inset-s-60",
-  "-inset-s-64",
-  "-inset-s-72",
-  "-inset-s-80",
-  "-inset-s-96",
-  "-inset-s-1/2",
-  "-inset-s-1/3",
-  "-inset-s-1/4",
-  "-inset-s-1/5",
-  "-inset-s-1/6",
-  "-inset-s-1/12",
-  "-inset-s-2/3",
-  "-inset-s-2/4",
-  "-inset-s-2/5",
-  "-inset-s-2/6",
-  "-inset-s-2/12",
-  "-inset-s-3/4",
-  "-inset-s-3/5",
-  "-inset-s-3/6",
-  "-inset-s-3/12",
-  "-inset-s-4/5",
-  "-inset-s-4/6",
-  "-inset-s-4/12",
-  "-inset-s-5/6",
-  "-inset-s-5/12",
-  "-inset-s-6/12",
-  "-inset-s-7/12",
-  "-inset-s-8/12",
-  "-inset-s-9/12",
-  "-inset-s-10/12",
-  "-inset-s-11/12",
-  "-inset-s-full",
-  "-inset-s-px",
   "-inset-x-0",
   "-inset-x-0.5",
   "-inset-x-1",
@@ -874,24 +686,6 @@ exports[`getClassList 1`] = `
   "-m-80",
   "-m-96",
   "-m-px",
-  "-mask-conic-0",
-  "-mask-conic-1",
-  "-mask-conic-2",
-  "-mask-conic-3",
-  "-mask-conic-6",
-  "-mask-conic-12",
-  "-mask-conic-45",
-  "-mask-conic-90",
-  "-mask-conic-180",
-  "-mask-linear-0",
-  "-mask-linear-1",
-  "-mask-linear-2",
-  "-mask-linear-3",
-  "-mask-linear-6",
-  "-mask-linear-12",
-  "-mask-linear-45",
-  "-mask-linear-90",
-  "-mask-linear-180",
   "-mb-0",
   "-mb-0.5",
   "-mb-1",
@@ -927,76 +721,6 @@ exports[`getClassList 1`] = `
   "-mb-80",
   "-mb-96",
   "-mb-px",
-  "-mbe-0",
-  "-mbe-0.5",
-  "-mbe-1",
-  "-mbe-1.5",
-  "-mbe-2",
-  "-mbe-2.5",
-  "-mbe-3",
-  "-mbe-3.5",
-  "-mbe-4",
-  "-mbe-5",
-  "-mbe-6",
-  "-mbe-7",
-  "-mbe-8",
-  "-mbe-9",
-  "-mbe-10",
-  "-mbe-11",
-  "-mbe-12",
-  "-mbe-14",
-  "-mbe-16",
-  "-mbe-20",
-  "-mbe-24",
-  "-mbe-28",
-  "-mbe-32",
-  "-mbe-36",
-  "-mbe-40",
-  "-mbe-44",
-  "-mbe-48",
-  "-mbe-52",
-  "-mbe-56",
-  "-mbe-60",
-  "-mbe-64",
-  "-mbe-72",
-  "-mbe-80",
-  "-mbe-96",
-  "-mbe-px",
-  "-mbs-0",
-  "-mbs-0.5",
-  "-mbs-1",
-  "-mbs-1.5",
-  "-mbs-2",
-  "-mbs-2.5",
-  "-mbs-3",
-  "-mbs-3.5",
-  "-mbs-4",
-  "-mbs-5",
-  "-mbs-6",
-  "-mbs-7",
-  "-mbs-8",
-  "-mbs-9",
-  "-mbs-10",
-  "-mbs-11",
-  "-mbs-12",
-  "-mbs-14",
-  "-mbs-16",
-  "-mbs-20",
-  "-mbs-24",
-  "-mbs-28",
-  "-mbs-32",
-  "-mbs-36",
-  "-mbs-40",
-  "-mbs-44",
-  "-mbs-48",
-  "-mbs-52",
-  "-mbs-56",
-  "-mbs-60",
-  "-mbs-64",
-  "-mbs-72",
-  "-mbs-80",
-  "-mbs-96",
-  "-mbs-px",
   "-me-0",
   "-me-0.5",
   "-me-1",
@@ -1497,76 +1221,6 @@ exports[`getClassList 1`] = `
   "-scroll-mb-80",
   "-scroll-mb-96",
   "-scroll-mb-px",
-  "-scroll-mbe-0",
-  "-scroll-mbe-0.5",
-  "-scroll-mbe-1",
-  "-scroll-mbe-1.5",
-  "-scroll-mbe-2",
-  "-scroll-mbe-2.5",
-  "-scroll-mbe-3",
-  "-scroll-mbe-3.5",
-  "-scroll-mbe-4",
-  "-scroll-mbe-5",
-  "-scroll-mbe-6",
-  "-scroll-mbe-7",
-  "-scroll-mbe-8",
-  "-scroll-mbe-9",
-  "-scroll-mbe-10",
-  "-scroll-mbe-11",
-  "-scroll-mbe-12",
-  "-scroll-mbe-14",
-  "-scroll-mbe-16",
-  "-scroll-mbe-20",
-  "-scroll-mbe-24",
-  "-scroll-mbe-28",
-  "-scroll-mbe-32",
-  "-scroll-mbe-36",
-  "-scroll-mbe-40",
-  "-scroll-mbe-44",
-  "-scroll-mbe-48",
-  "-scroll-mbe-52",
-  "-scroll-mbe-56",
-  "-scroll-mbe-60",
-  "-scroll-mbe-64",
-  "-scroll-mbe-72",
-  "-scroll-mbe-80",
-  "-scroll-mbe-96",
-  "-scroll-mbe-px",
-  "-scroll-mbs-0",
-  "-scroll-mbs-0.5",
-  "-scroll-mbs-1",
-  "-scroll-mbs-1.5",
-  "-scroll-mbs-2",
-  "-scroll-mbs-2.5",
-  "-scroll-mbs-3",
-  "-scroll-mbs-3.5",
-  "-scroll-mbs-4",
-  "-scroll-mbs-5",
-  "-scroll-mbs-6",
-  "-scroll-mbs-7",
-  "-scroll-mbs-8",
-  "-scroll-mbs-9",
-  "-scroll-mbs-10",
-  "-scroll-mbs-11",
-  "-scroll-mbs-12",
-  "-scroll-mbs-14",
-  "-scroll-mbs-16",
-  "-scroll-mbs-20",
-  "-scroll-mbs-24",
-  "-scroll-mbs-28",
-  "-scroll-mbs-32",
-  "-scroll-mbs-36",
-  "-scroll-mbs-40",
-  "-scroll-mbs-44",
-  "-scroll-mbs-48",
-  "-scroll-mbs-52",
-  "-scroll-mbs-56",
-  "-scroll-mbs-60",
-  "-scroll-mbs-64",
-  "-scroll-mbs-72",
-  "-scroll-mbs-80",
-  "-scroll-mbs-96",
-  "-scroll-mbs-px",
   "-scroll-me-0",
   "-scroll-me-0.5",
   "-scroll-me-1",
@@ -1900,6 +1554,66 @@ exports[`getClassList 1`] = `
   "-space-y-80",
   "-space-y-96",
   "-space-y-px",
+  "-start-0",
+  "-start-0.5",
+  "-start-1",
+  "-start-1.5",
+  "-start-2",
+  "-start-2.5",
+  "-start-3",
+  "-start-3.5",
+  "-start-4",
+  "-start-5",
+  "-start-6",
+  "-start-7",
+  "-start-8",
+  "-start-9",
+  "-start-10",
+  "-start-11",
+  "-start-12",
+  "-start-14",
+  "-start-16",
+  "-start-20",
+  "-start-24",
+  "-start-28",
+  "-start-32",
+  "-start-36",
+  "-start-40",
+  "-start-44",
+  "-start-48",
+  "-start-52",
+  "-start-56",
+  "-start-60",
+  "-start-64",
+  "-start-72",
+  "-start-80",
+  "-start-96",
+  "-start-1/2",
+  "-start-1/3",
+  "-start-1/4",
+  "-start-1/5",
+  "-start-1/6",
+  "-start-1/12",
+  "-start-2/3",
+  "-start-2/4",
+  "-start-2/5",
+  "-start-2/6",
+  "-start-2/12",
+  "-start-3/4",
+  "-start-3/5",
+  "-start-3/6",
+  "-start-3/12",
+  "-start-4/5",
+  "-start-4/6",
+  "-start-4/12",
+  "-start-5/6",
+  "-start-5/12",
+  "-start-6/12",
+  "-start-7/12",
+  "-start-8/12",
+  "-start-9/12",
+  "-start-10/12",
+  "-start-11/12",
   "-start-full",
   "-start-px",
   "-top-0",
@@ -2222,7 +1936,6 @@ exports[`getClassList 1`] = `
   "accent-current/90",
   "accent-current/95",
   "accent-current/100",
-  "accent-current/background",
   "accent-inherit",
   "accent-inherit/0",
   "accent-inherit/5",
@@ -2245,7 +1958,6 @@ exports[`getClassList 1`] = `
   "accent-inherit/90",
   "accent-inherit/95",
   "accent-inherit/100",
-  "accent-inherit/background",
   "accent-transparent",
   "accent-transparent/0",
   "accent-transparent/5",
@@ -2268,7 +1980,6 @@ exports[`getClassList 1`] = `
   "accent-transparent/90",
   "accent-transparent/95",
   "accent-transparent/100",
-  "accent-transparent/background",
   "align-baseline",
   "align-bottom",
   "align-middle",
@@ -2445,8 +2156,6 @@ exports[`getClassList 1`] = `
   "bg-blend-screen",
   "bg-blend-soft-light",
   "bg-bottom",
-  "bg-bottom-left",
-  "bg-bottom-right",
   "bg-center",
   "bg-clip-border",
   "bg-clip-content",
@@ -2593,7 +2302,6 @@ exports[`getClassList 1`] = `
   "bg-current/90",
   "bg-current/95",
   "bg-current/100",
-  "bg-current/background",
   "bg-fixed",
   "bg-inherit",
   "bg-inherit/0",
@@ -2617,8 +2325,9 @@ exports[`getClassList 1`] = `
   "bg-inherit/90",
   "bg-inherit/95",
   "bg-inherit/100",
-  "bg-inherit/background",
   "bg-left",
+  "bg-left-bottom",
+  "bg-left-top",
   "bg-linear-0",
   "bg-linear-0/oklab",
   "bg-linear-0/oklch",
@@ -2820,10 +2529,10 @@ exports[`getClassList 1`] = `
   "bg-repeat-x",
   "bg-repeat-y",
   "bg-right",
+  "bg-right-bottom",
+  "bg-right-top",
   "bg-scroll",
   "bg-top",
-  "bg-top-left",
-  "bg-top-right",
   "bg-transparent",
   "bg-transparent/0",
   "bg-transparent/5",
@@ -2846,79 +2555,7 @@ exports[`getClassList 1`] = `
   "bg-transparent/90",
   "bg-transparent/95",
   "bg-transparent/100",
-  "bg-transparent/background",
   "block",
-  "block-0",
-  "block-0.5",
-  "block-1",
-  "block-1.5",
-  "block-2",
-  "block-2.5",
-  "block-3",
-  "block-3.5",
-  "block-4",
-  "block-5",
-  "block-6",
-  "block-7",
-  "block-8",
-  "block-9",
-  "block-10",
-  "block-11",
-  "block-12",
-  "block-14",
-  "block-16",
-  "block-20",
-  "block-24",
-  "block-28",
-  "block-32",
-  "block-36",
-  "block-40",
-  "block-44",
-  "block-48",
-  "block-52",
-  "block-56",
-  "block-60",
-  "block-64",
-  "block-72",
-  "block-80",
-  "block-96",
-  "block-1/2",
-  "block-1/3",
-  "block-1/4",
-  "block-1/5",
-  "block-1/6",
-  "block-1/12",
-  "block-2/3",
-  "block-2/4",
-  "block-2/5",
-  "block-2/6",
-  "block-2/12",
-  "block-3/4",
-  "block-3/5",
-  "block-3/6",
-  "block-3/12",
-  "block-4/5",
-  "block-4/6",
-  "block-4/12",
-  "block-5/6",
-  "block-5/12",
-  "block-6/12",
-  "block-7/12",
-  "block-8/12",
-  "block-9/12",
-  "block-10/12",
-  "block-11/12",
-  "block-auto",
-  "block-dvh",
-  "block-fit",
-  "block-full",
-  "block-lh",
-  "block-lvh",
-  "block-max",
-  "block-min",
-  "block-px",
-  "block-screen",
-  "block-svh",
   "blur-none",
   "border",
   "border/0",
@@ -2942,7 +2579,6 @@ exports[`getClassList 1`] = `
   "border/90",
   "border/95",
   "border/100",
-  "border/background",
   "border-0",
   "border-2",
   "border-4",
@@ -2969,7 +2605,6 @@ exports[`getClassList 1`] = `
   "border-b/90",
   "border-b/95",
   "border-b/100",
-  "border-b/background",
   "border-b-0",
   "border-b-2",
   "border-b-4",
@@ -2996,7 +2631,6 @@ exports[`getClassList 1`] = `
   "border-b-current/90",
   "border-b-current/95",
   "border-b-current/100",
-  "border-b-current/background",
   "border-b-inherit",
   "border-b-inherit/0",
   "border-b-inherit/5",
@@ -3019,7 +2653,6 @@ exports[`getClassList 1`] = `
   "border-b-inherit/90",
   "border-b-inherit/95",
   "border-b-inherit/100",
-  "border-b-inherit/background",
   "border-b-transparent",
   "border-b-transparent/0",
   "border-b-transparent/5",
@@ -3042,199 +2675,6 @@ exports[`getClassList 1`] = `
   "border-b-transparent/90",
   "border-b-transparent/95",
   "border-b-transparent/100",
-  "border-b-transparent/background",
-  "border-be",
-  "border-be/0",
-  "border-be/5",
-  "border-be/10",
-  "border-be/15",
-  "border-be/20",
-  "border-be/25",
-  "border-be/30",
-  "border-be/35",
-  "border-be/40",
-  "border-be/45",
-  "border-be/50",
-  "border-be/55",
-  "border-be/60",
-  "border-be/65",
-  "border-be/70",
-  "border-be/75",
-  "border-be/80",
-  "border-be/85",
-  "border-be/90",
-  "border-be/95",
-  "border-be/100",
-  "border-be/background",
-  "border-be-0",
-  "border-be-2",
-  "border-be-4",
-  "border-be-8",
-  "border-be-current",
-  "border-be-current/0",
-  "border-be-current/5",
-  "border-be-current/10",
-  "border-be-current/15",
-  "border-be-current/20",
-  "border-be-current/25",
-  "border-be-current/30",
-  "border-be-current/35",
-  "border-be-current/40",
-  "border-be-current/45",
-  "border-be-current/50",
-  "border-be-current/55",
-  "border-be-current/60",
-  "border-be-current/65",
-  "border-be-current/70",
-  "border-be-current/75",
-  "border-be-current/80",
-  "border-be-current/85",
-  "border-be-current/90",
-  "border-be-current/95",
-  "border-be-current/100",
-  "border-be-current/background",
-  "border-be-inherit",
-  "border-be-inherit/0",
-  "border-be-inherit/5",
-  "border-be-inherit/10",
-  "border-be-inherit/15",
-  "border-be-inherit/20",
-  "border-be-inherit/25",
-  "border-be-inherit/30",
-  "border-be-inherit/35",
-  "border-be-inherit/40",
-  "border-be-inherit/45",
-  "border-be-inherit/50",
-  "border-be-inherit/55",
-  "border-be-inherit/60",
-  "border-be-inherit/65",
-  "border-be-inherit/70",
-  "border-be-inherit/75",
-  "border-be-inherit/80",
-  "border-be-inherit/85",
-  "border-be-inherit/90",
-  "border-be-inherit/95",
-  "border-be-inherit/100",
-  "border-be-inherit/background",
-  "border-be-transparent",
-  "border-be-transparent/0",
-  "border-be-transparent/5",
-  "border-be-transparent/10",
-  "border-be-transparent/15",
-  "border-be-transparent/20",
-  "border-be-transparent/25",
-  "border-be-transparent/30",
-  "border-be-transparent/35",
-  "border-be-transparent/40",
-  "border-be-transparent/45",
-  "border-be-transparent/50",
-  "border-be-transparent/55",
-  "border-be-transparent/60",
-  "border-be-transparent/65",
-  "border-be-transparent/70",
-  "border-be-transparent/75",
-  "border-be-transparent/80",
-  "border-be-transparent/85",
-  "border-be-transparent/90",
-  "border-be-transparent/95",
-  "border-be-transparent/100",
-  "border-be-transparent/background",
-  "border-bs",
-  "border-bs/0",
-  "border-bs/5",
-  "border-bs/10",
-  "border-bs/15",
-  "border-bs/20",
-  "border-bs/25",
-  "border-bs/30",
-  "border-bs/35",
-  "border-bs/40",
-  "border-bs/45",
-  "border-bs/50",
-  "border-bs/55",
-  "border-bs/60",
-  "border-bs/65",
-  "border-bs/70",
-  "border-bs/75",
-  "border-bs/80",
-  "border-bs/85",
-  "border-bs/90",
-  "border-bs/95",
-  "border-bs/100",
-  "border-bs/background",
-  "border-bs-0",
-  "border-bs-2",
-  "border-bs-4",
-  "border-bs-8",
-  "border-bs-current",
-  "border-bs-current/0",
-  "border-bs-current/5",
-  "border-bs-current/10",
-  "border-bs-current/15",
-  "border-bs-current/20",
-  "border-bs-current/25",
-  "border-bs-current/30",
-  "border-bs-current/35",
-  "border-bs-current/40",
-  "border-bs-current/45",
-  "border-bs-current/50",
-  "border-bs-current/55",
-  "border-bs-current/60",
-  "border-bs-current/65",
-  "border-bs-current/70",
-  "border-bs-current/75",
-  "border-bs-current/80",
-  "border-bs-current/85",
-  "border-bs-current/90",
-  "border-bs-current/95",
-  "border-bs-current/100",
-  "border-bs-current/background",
-  "border-bs-inherit",
-  "border-bs-inherit/0",
-  "border-bs-inherit/5",
-  "border-bs-inherit/10",
-  "border-bs-inherit/15",
-  "border-bs-inherit/20",
-  "border-bs-inherit/25",
-  "border-bs-inherit/30",
-  "border-bs-inherit/35",
-  "border-bs-inherit/40",
-  "border-bs-inherit/45",
-  "border-bs-inherit/50",
-  "border-bs-inherit/55",
-  "border-bs-inherit/60",
-  "border-bs-inherit/65",
-  "border-bs-inherit/70",
-  "border-bs-inherit/75",
-  "border-bs-inherit/80",
-  "border-bs-inherit/85",
-  "border-bs-inherit/90",
-  "border-bs-inherit/95",
-  "border-bs-inherit/100",
-  "border-bs-inherit/background",
-  "border-bs-transparent",
-  "border-bs-transparent/0",
-  "border-bs-transparent/5",
-  "border-bs-transparent/10",
-  "border-bs-transparent/15",
-  "border-bs-transparent/20",
-  "border-bs-transparent/25",
-  "border-bs-transparent/30",
-  "border-bs-transparent/35",
-  "border-bs-transparent/40",
-  "border-bs-transparent/45",
-  "border-bs-transparent/50",
-  "border-bs-transparent/55",
-  "border-bs-transparent/60",
-  "border-bs-transparent/65",
-  "border-bs-transparent/70",
-  "border-bs-transparent/75",
-  "border-bs-transparent/80",
-  "border-bs-transparent/85",
-  "border-bs-transparent/90",
-  "border-bs-transparent/95",
-  "border-bs-transparent/100",
-  "border-bs-transparent/background",
   "border-collapse",
   "border-current",
   "border-current/0",
@@ -3258,7 +2698,6 @@ exports[`getClassList 1`] = `
   "border-current/90",
   "border-current/95",
   "border-current/100",
-  "border-current/background",
   "border-dashed",
   "border-dotted",
   "border-double",
@@ -3284,7 +2723,6 @@ exports[`getClassList 1`] = `
   "border-e/90",
   "border-e/95",
   "border-e/100",
-  "border-e/background",
   "border-e-0",
   "border-e-2",
   "border-e-4",
@@ -3311,7 +2749,6 @@ exports[`getClassList 1`] = `
   "border-e-current/90",
   "border-e-current/95",
   "border-e-current/100",
-  "border-e-current/background",
   "border-e-inherit",
   "border-e-inherit/0",
   "border-e-inherit/5",
@@ -3334,7 +2771,6 @@ exports[`getClassList 1`] = `
   "border-e-inherit/90",
   "border-e-inherit/95",
   "border-e-inherit/100",
-  "border-e-inherit/background",
   "border-e-transparent",
   "border-e-transparent/0",
   "border-e-transparent/5",
@@ -3357,7 +2793,6 @@ exports[`getClassList 1`] = `
   "border-e-transparent/90",
   "border-e-transparent/95",
   "border-e-transparent/100",
-  "border-e-transparent/background",
   "border-hidden",
   "border-inherit",
   "border-inherit/0",
@@ -3381,7 +2816,6 @@ exports[`getClassList 1`] = `
   "border-inherit/90",
   "border-inherit/95",
   "border-inherit/100",
-  "border-inherit/background",
   "border-l",
   "border-l/0",
   "border-l/5",
@@ -3404,7 +2838,6 @@ exports[`getClassList 1`] = `
   "border-l/90",
   "border-l/95",
   "border-l/100",
-  "border-l/background",
   "border-l-0",
   "border-l-2",
   "border-l-4",
@@ -3431,7 +2864,6 @@ exports[`getClassList 1`] = `
   "border-l-current/90",
   "border-l-current/95",
   "border-l-current/100",
-  "border-l-current/background",
   "border-l-inherit",
   "border-l-inherit/0",
   "border-l-inherit/5",
@@ -3454,7 +2886,6 @@ exports[`getClassList 1`] = `
   "border-l-inherit/90",
   "border-l-inherit/95",
   "border-l-inherit/100",
-  "border-l-inherit/background",
   "border-l-transparent",
   "border-l-transparent/0",
   "border-l-transparent/5",
@@ -3477,7 +2908,6 @@ exports[`getClassList 1`] = `
   "border-l-transparent/90",
   "border-l-transparent/95",
   "border-l-transparent/100",
-  "border-l-transparent/background",
   "border-none",
   "border-r",
   "border-r/0",
@@ -3501,7 +2931,6 @@ exports[`getClassList 1`] = `
   "border-r/90",
   "border-r/95",
   "border-r/100",
-  "border-r/background",
   "border-r-0",
   "border-r-2",
   "border-r-4",
@@ -3528,7 +2957,6 @@ exports[`getClassList 1`] = `
   "border-r-current/90",
   "border-r-current/95",
   "border-r-current/100",
-  "border-r-current/background",
   "border-r-inherit",
   "border-r-inherit/0",
   "border-r-inherit/5",
@@ -3551,7 +2979,6 @@ exports[`getClassList 1`] = `
   "border-r-inherit/90",
   "border-r-inherit/95",
   "border-r-inherit/100",
-  "border-r-inherit/background",
   "border-r-transparent",
   "border-r-transparent/0",
   "border-r-transparent/5",
@@ -3574,7 +3001,6 @@ exports[`getClassList 1`] = `
   "border-r-transparent/90",
   "border-r-transparent/95",
   "border-r-transparent/100",
-  "border-r-transparent/background",
   "border-s",
   "border-s/0",
   "border-s/5",
@@ -3597,7 +3023,6 @@ exports[`getClassList 1`] = `
   "border-s/90",
   "border-s/95",
   "border-s/100",
-  "border-s/background",
   "border-s-0",
   "border-s-2",
   "border-s-4",
@@ -3624,7 +3049,6 @@ exports[`getClassList 1`] = `
   "border-s-current/90",
   "border-s-current/95",
   "border-s-current/100",
-  "border-s-current/background",
   "border-s-inherit",
   "border-s-inherit/0",
   "border-s-inherit/5",
@@ -3647,7 +3071,6 @@ exports[`getClassList 1`] = `
   "border-s-inherit/90",
   "border-s-inherit/95",
   "border-s-inherit/100",
-  "border-s-inherit/background",
   "border-s-transparent",
   "border-s-transparent/0",
   "border-s-transparent/5",
@@ -3670,7 +3093,6 @@ exports[`getClassList 1`] = `
   "border-s-transparent/90",
   "border-s-transparent/95",
   "border-s-transparent/100",
-  "border-s-transparent/background",
   "border-separate",
   "border-solid",
   "border-spacing-0",
@@ -3800,7 +3222,6 @@ exports[`getClassList 1`] = `
   "border-t/90",
   "border-t/95",
   "border-t/100",
-  "border-t/background",
   "border-t-0",
   "border-t-2",
   "border-t-4",
@@ -3827,7 +3248,6 @@ exports[`getClassList 1`] = `
   "border-t-current/90",
   "border-t-current/95",
   "border-t-current/100",
-  "border-t-current/background",
   "border-t-inherit",
   "border-t-inherit/0",
   "border-t-inherit/5",
@@ -3850,7 +3270,6 @@ exports[`getClassList 1`] = `
   "border-t-inherit/90",
   "border-t-inherit/95",
   "border-t-inherit/100",
-  "border-t-inherit/background",
   "border-t-transparent",
   "border-t-transparent/0",
   "border-t-transparent/5",
@@ -3873,7 +3292,6 @@ exports[`getClassList 1`] = `
   "border-t-transparent/90",
   "border-t-transparent/95",
   "border-t-transparent/100",
-  "border-t-transparent/background",
   "border-transparent",
   "border-transparent/0",
   "border-transparent/5",
@@ -3896,7 +3314,6 @@ exports[`getClassList 1`] = `
   "border-transparent/90",
   "border-transparent/95",
   "border-transparent/100",
-  "border-transparent/background",
   "border-x",
   "border-x/0",
   "border-x/5",
@@ -3919,7 +3336,6 @@ exports[`getClassList 1`] = `
   "border-x/90",
   "border-x/95",
   "border-x/100",
-  "border-x/background",
   "border-x-0",
   "border-x-2",
   "border-x-4",
@@ -3946,7 +3362,6 @@ exports[`getClassList 1`] = `
   "border-x-current/90",
   "border-x-current/95",
   "border-x-current/100",
-  "border-x-current/background",
   "border-x-inherit",
   "border-x-inherit/0",
   "border-x-inherit/5",
@@ -3969,7 +3384,6 @@ exports[`getClassList 1`] = `
   "border-x-inherit/90",
   "border-x-inherit/95",
   "border-x-inherit/100",
-  "border-x-inherit/background",
   "border-x-transparent",
   "border-x-transparent/0",
   "border-x-transparent/5",
@@ -3992,7 +3406,6 @@ exports[`getClassList 1`] = `
   "border-x-transparent/90",
   "border-x-transparent/95",
   "border-x-transparent/100",
-  "border-x-transparent/background",
   "border-y",
   "border-y/0",
   "border-y/5",
@@ -4015,7 +3428,6 @@ exports[`getClassList 1`] = `
   "border-y/90",
   "border-y/95",
   "border-y/100",
-  "border-y/background",
   "border-y-0",
   "border-y-2",
   "border-y-4",
@@ -4042,7 +3454,6 @@ exports[`getClassList 1`] = `
   "border-y-current/90",
   "border-y-current/95",
   "border-y-current/100",
-  "border-y-current/background",
   "border-y-inherit",
   "border-y-inherit/0",
   "border-y-inherit/5",
@@ -4065,7 +3476,6 @@ exports[`getClassList 1`] = `
   "border-y-inherit/90",
   "border-y-inherit/95",
   "border-y-inherit/100",
-  "border-y-inherit/background",
   "border-y-transparent",
   "border-y-transparent/0",
   "border-y-transparent/5",
@@ -4088,7 +3498,6 @@ exports[`getClassList 1`] = `
   "border-y-transparent/90",
   "border-y-transparent/95",
   "border-y-transparent/100",
-  "border-y-transparent/background",
   "bottom-0",
   "bottom-0.5",
   "bottom-1",
@@ -4179,6 +3588,7 @@ exports[`getClassList 1`] = `
   "break-inside-avoid-page",
   "break-keep",
   "break-normal",
+  "break-words",
   "brightness-0",
   "brightness-50",
   "brightness-75",
@@ -4215,7 +3625,6 @@ exports[`getClassList 1`] = `
   "caret-current/90",
   "caret-current/95",
   "caret-current/100",
-  "caret-current/background",
   "caret-inherit",
   "caret-inherit/0",
   "caret-inherit/5",
@@ -4238,7 +3647,6 @@ exports[`getClassList 1`] = `
   "caret-inherit/90",
   "caret-inherit/95",
   "caret-inherit/100",
-  "caret-inherit/background",
   "caret-transparent",
   "caret-transparent/0",
   "caret-transparent/5",
@@ -4261,7 +3669,6 @@ exports[`getClassList 1`] = `
   "caret-transparent/90",
   "caret-transparent/95",
   "caret-transparent/100",
-  "caret-transparent/background",
   "clear-both",
   "clear-end",
   "clear-left",
@@ -4417,7 +3824,6 @@ exports[`getClassList 1`] = `
   "decoration-current/90",
   "decoration-current/95",
   "decoration-current/100",
-  "decoration-current/background",
   "decoration-dashed",
   "decoration-dotted",
   "decoration-double",
@@ -4444,7 +3850,6 @@ exports[`getClassList 1`] = `
   "decoration-inherit/90",
   "decoration-inherit/95",
   "decoration-inherit/100",
-  "decoration-inherit/background",
   "decoration-solid",
   "decoration-transparent",
   "decoration-transparent/0",
@@ -4468,7 +3873,6 @@ exports[`getClassList 1`] = `
   "decoration-transparent/90",
   "decoration-transparent/95",
   "decoration-transparent/100",
-  "decoration-transparent/background",
   "decoration-wavy",
   "delay-75",
   "delay-100",
@@ -4501,7 +3905,6 @@ exports[`getClassList 1`] = `
   "divide-current/90",
   "divide-current/95",
   "divide-current/100",
-  "divide-current/background",
   "divide-dashed",
   "divide-dotted",
   "divide-double",
@@ -4527,7 +3930,6 @@ exports[`getClassList 1`] = `
   "divide-inherit/90",
   "divide-inherit/95",
   "divide-inherit/100",
-  "divide-inherit/background",
   "divide-none",
   "divide-solid",
   "divide-transparent",
@@ -4552,7 +3954,6 @@ exports[`getClassList 1`] = `
   "divide-transparent/90",
   "divide-transparent/95",
   "divide-transparent/100",
-  "divide-transparent/background",
   "divide-x",
   "divide-x-0",
   "divide-x-2",
@@ -4565,77 +3966,8 @@ exports[`getClassList 1`] = `
   "divide-y-4",
   "divide-y-8",
   "divide-y-reverse",
-  "drop-shadow-current",
-  "drop-shadow-current/0",
-  "drop-shadow-current/5",
-  "drop-shadow-current/10",
-  "drop-shadow-current/15",
-  "drop-shadow-current/20",
-  "drop-shadow-current/25",
-  "drop-shadow-current/30",
-  "drop-shadow-current/35",
-  "drop-shadow-current/40",
-  "drop-shadow-current/45",
-  "drop-shadow-current/50",
-  "drop-shadow-current/55",
-  "drop-shadow-current/60",
-  "drop-shadow-current/65",
-  "drop-shadow-current/70",
-  "drop-shadow-current/75",
-  "drop-shadow-current/80",
-  "drop-shadow-current/85",
-  "drop-shadow-current/90",
-  "drop-shadow-current/95",
-  "drop-shadow-current/100",
-  "drop-shadow-current/background",
-  "drop-shadow-inherit",
-  "drop-shadow-inherit/0",
-  "drop-shadow-inherit/5",
-  "drop-shadow-inherit/10",
-  "drop-shadow-inherit/15",
-  "drop-shadow-inherit/20",
-  "drop-shadow-inherit/25",
-  "drop-shadow-inherit/30",
-  "drop-shadow-inherit/35",
-  "drop-shadow-inherit/40",
-  "drop-shadow-inherit/45",
-  "drop-shadow-inherit/50",
-  "drop-shadow-inherit/55",
-  "drop-shadow-inherit/60",
-  "drop-shadow-inherit/65",
-  "drop-shadow-inherit/70",
-  "drop-shadow-inherit/75",
-  "drop-shadow-inherit/80",
-  "drop-shadow-inherit/85",
-  "drop-shadow-inherit/90",
-  "drop-shadow-inherit/95",
-  "drop-shadow-inherit/100",
-  "drop-shadow-inherit/background",
   "drop-shadow-none",
   "drop-shadow-sm",
-  "drop-shadow-transparent",
-  "drop-shadow-transparent/0",
-  "drop-shadow-transparent/5",
-  "drop-shadow-transparent/10",
-  "drop-shadow-transparent/15",
-  "drop-shadow-transparent/20",
-  "drop-shadow-transparent/25",
-  "drop-shadow-transparent/30",
-  "drop-shadow-transparent/35",
-  "drop-shadow-transparent/40",
-  "drop-shadow-transparent/45",
-  "drop-shadow-transparent/50",
-  "drop-shadow-transparent/55",
-  "drop-shadow-transparent/60",
-  "drop-shadow-transparent/65",
-  "drop-shadow-transparent/70",
-  "drop-shadow-transparent/75",
-  "drop-shadow-transparent/80",
-  "drop-shadow-transparent/85",
-  "drop-shadow-transparent/90",
-  "drop-shadow-transparent/95",
-  "drop-shadow-transparent/100",
-  "drop-shadow-transparent/background",
   "duration-75",
   "duration-100",
   "duration-150",
@@ -4647,6 +3979,66 @@ exports[`getClassList 1`] = `
   "duration-initial",
   "ease-initial",
   "ease-linear",
+  "end-0",
+  "end-0.5",
+  "end-1",
+  "end-1.5",
+  "end-2",
+  "end-2.5",
+  "end-3",
+  "end-3.5",
+  "end-4",
+  "end-5",
+  "end-6",
+  "end-7",
+  "end-8",
+  "end-9",
+  "end-10",
+  "end-11",
+  "end-12",
+  "end-14",
+  "end-16",
+  "end-20",
+  "end-24",
+  "end-28",
+  "end-32",
+  "end-36",
+  "end-40",
+  "end-44",
+  "end-48",
+  "end-52",
+  "end-56",
+  "end-60",
+  "end-64",
+  "end-72",
+  "end-80",
+  "end-96",
+  "end-1/2",
+  "end-1/3",
+  "end-1/4",
+  "end-1/5",
+  "end-1/6",
+  "end-1/12",
+  "end-2/3",
+  "end-2/4",
+  "end-2/5",
+  "end-2/6",
+  "end-2/12",
+  "end-3/4",
+  "end-3/5",
+  "end-3/6",
+  "end-3/12",
+  "end-4/5",
+  "end-4/6",
+  "end-4/12",
+  "end-5/6",
+  "end-5/12",
+  "end-6/12",
+  "end-7/12",
+  "end-8/12",
+  "end-9/12",
+  "end-10/12",
+  "end-11/12",
   "end-auto",
   "end-full",
   "end-px",
@@ -4674,7 +4066,6 @@ exports[`getClassList 1`] = `
   "fill-current/90",
   "fill-current/95",
   "fill-current/100",
-  "fill-current/background",
   "fill-inherit",
   "fill-inherit/0",
   "fill-inherit/5",
@@ -4697,7 +4088,6 @@ exports[`getClassList 1`] = `
   "fill-inherit/90",
   "fill-inherit/95",
   "fill-inherit/100",
-  "fill-inherit/background",
   "fill-none",
   "fill-transparent",
   "fill-transparent/0",
@@ -4721,21 +4111,8 @@ exports[`getClassList 1`] = `
   "fill-transparent/90",
   "fill-transparent/95",
   "fill-transparent/100",
-  "fill-transparent/background",
   "fixed",
   "flex",
-  "flex-1",
-  "flex-2",
-  "flex-3",
-  "flex-4",
-  "flex-5",
-  "flex-6",
-  "flex-7",
-  "flex-8",
-  "flex-9",
-  "flex-10",
-  "flex-11",
-  "flex-12",
   "flex-1/2",
   "flex-1/3",
   "flex-1/4",
@@ -4845,7 +4222,6 @@ exports[`getClassList 1`] = `
   "from-current/90",
   "from-current/95",
   "from-current/100",
-  "from-current/background",
   "from-inherit",
   "from-inherit/0",
   "from-inherit/5",
@@ -4868,7 +4244,6 @@ exports[`getClassList 1`] = `
   "from-inherit/90",
   "from-inherit/95",
   "from-inherit/100",
-  "from-inherit/background",
   "from-transparent",
   "from-transparent/0",
   "from-transparent/5",
@@ -4891,7 +4266,6 @@ exports[`getClassList 1`] = `
   "from-transparent/90",
   "from-transparent/95",
   "from-transparent/100",
-  "from-transparent/background",
   "gap-0",
   "gap-0.5",
   "gap-1",
@@ -5104,7 +4478,6 @@ exports[`getClassList 1`] = `
   "h-dvw",
   "h-fit",
   "h-full",
-  "h-lh",
   "h-lvh",
   "h-lvw",
   "h-max",
@@ -5159,81 +4532,9 @@ exports[`getClassList 1`] = `
   "indent-96",
   "indent-px",
   "inline",
-  "inline-0",
-  "inline-0.5",
-  "inline-1",
-  "inline-1.5",
-  "inline-2",
-  "inline-2.5",
-  "inline-3",
-  "inline-3.5",
-  "inline-4",
-  "inline-5",
-  "inline-6",
-  "inline-7",
-  "inline-8",
-  "inline-9",
-  "inline-10",
-  "inline-11",
-  "inline-12",
-  "inline-14",
-  "inline-16",
-  "inline-20",
-  "inline-24",
-  "inline-28",
-  "inline-32",
-  "inline-36",
-  "inline-40",
-  "inline-44",
-  "inline-48",
-  "inline-52",
-  "inline-56",
-  "inline-60",
-  "inline-64",
-  "inline-72",
-  "inline-80",
-  "inline-96",
-  "inline-auto",
   "inline-block",
-  "inline-dvw",
-  "inline-fit",
   "inline-flex",
-  "inline-full",
   "inline-grid",
-  "inline-lg",
-  "inline-lvw",
-  "inline-max",
-  "inline-md",
-  "inline-1/2",
-  "inline-1/3",
-  "inline-1/4",
-  "inline-1/5",
-  "inline-1/6",
-  "inline-1/12",
-  "inline-2/3",
-  "inline-2/4",
-  "inline-2/5",
-  "inline-2/6",
-  "inline-2/12",
-  "inline-3/4",
-  "inline-3/5",
-  "inline-3/6",
-  "inline-3/12",
-  "inline-4/5",
-  "inline-4/6",
-  "inline-4/12",
-  "inline-5/6",
-  "inline-5/12",
-  "inline-6/12",
-  "inline-7/12",
-  "inline-8/12",
-  "inline-9/12",
-  "inline-10/12",
-  "inline-11/12",
-  "inline-min",
-  "inline-px",
-  "inline-screen",
-  "inline-svw",
   "inline-table",
   "inset-0",
   "inset-0.5",
@@ -5296,195 +4597,6 @@ exports[`getClassList 1`] = `
   "inset-10/12",
   "inset-11/12",
   "inset-auto",
-  "inset-be-0",
-  "inset-be-0.5",
-  "inset-be-1",
-  "inset-be-1.5",
-  "inset-be-2",
-  "inset-be-2.5",
-  "inset-be-3",
-  "inset-be-3.5",
-  "inset-be-4",
-  "inset-be-5",
-  "inset-be-6",
-  "inset-be-7",
-  "inset-be-8",
-  "inset-be-9",
-  "inset-be-10",
-  "inset-be-11",
-  "inset-be-12",
-  "inset-be-14",
-  "inset-be-16",
-  "inset-be-20",
-  "inset-be-24",
-  "inset-be-28",
-  "inset-be-32",
-  "inset-be-36",
-  "inset-be-40",
-  "inset-be-44",
-  "inset-be-48",
-  "inset-be-52",
-  "inset-be-56",
-  "inset-be-60",
-  "inset-be-64",
-  "inset-be-72",
-  "inset-be-80",
-  "inset-be-96",
-  "inset-be-1/2",
-  "inset-be-1/3",
-  "inset-be-1/4",
-  "inset-be-1/5",
-  "inset-be-1/6",
-  "inset-be-1/12",
-  "inset-be-2/3",
-  "inset-be-2/4",
-  "inset-be-2/5",
-  "inset-be-2/6",
-  "inset-be-2/12",
-  "inset-be-3/4",
-  "inset-be-3/5",
-  "inset-be-3/6",
-  "inset-be-3/12",
-  "inset-be-4/5",
-  "inset-be-4/6",
-  "inset-be-4/12",
-  "inset-be-5/6",
-  "inset-be-5/12",
-  "inset-be-6/12",
-  "inset-be-7/12",
-  "inset-be-8/12",
-  "inset-be-9/12",
-  "inset-be-10/12",
-  "inset-be-11/12",
-  "inset-be-auto",
-  "inset-be-full",
-  "inset-be-px",
-  "inset-bs-0",
-  "inset-bs-0.5",
-  "inset-bs-1",
-  "inset-bs-1.5",
-  "inset-bs-2",
-  "inset-bs-2.5",
-  "inset-bs-3",
-  "inset-bs-3.5",
-  "inset-bs-4",
-  "inset-bs-5",
-  "inset-bs-6",
-  "inset-bs-7",
-  "inset-bs-8",
-  "inset-bs-9",
-  "inset-bs-10",
-  "inset-bs-11",
-  "inset-bs-12",
-  "inset-bs-14",
-  "inset-bs-16",
-  "inset-bs-20",
-  "inset-bs-24",
-  "inset-bs-28",
-  "inset-bs-32",
-  "inset-bs-36",
-  "inset-bs-40",
-  "inset-bs-44",
-  "inset-bs-48",
-  "inset-bs-52",
-  "inset-bs-56",
-  "inset-bs-60",
-  "inset-bs-64",
-  "inset-bs-72",
-  "inset-bs-80",
-  "inset-bs-96",
-  "inset-bs-1/2",
-  "inset-bs-1/3",
-  "inset-bs-1/4",
-  "inset-bs-1/5",
-  "inset-bs-1/6",
-  "inset-bs-1/12",
-  "inset-bs-2/3",
-  "inset-bs-2/4",
-  "inset-bs-2/5",
-  "inset-bs-2/6",
-  "inset-bs-2/12",
-  "inset-bs-3/4",
-  "inset-bs-3/5",
-  "inset-bs-3/6",
-  "inset-bs-3/12",
-  "inset-bs-4/5",
-  "inset-bs-4/6",
-  "inset-bs-4/12",
-  "inset-bs-5/6",
-  "inset-bs-5/12",
-  "inset-bs-6/12",
-  "inset-bs-7/12",
-  "inset-bs-8/12",
-  "inset-bs-9/12",
-  "inset-bs-10/12",
-  "inset-bs-11/12",
-  "inset-bs-auto",
-  "inset-bs-full",
-  "inset-bs-px",
-  "inset-e-0",
-  "inset-e-0.5",
-  "inset-e-1",
-  "inset-e-1.5",
-  "inset-e-2",
-  "inset-e-2.5",
-  "inset-e-3",
-  "inset-e-3.5",
-  "inset-e-4",
-  "inset-e-5",
-  "inset-e-6",
-  "inset-e-7",
-  "inset-e-8",
-  "inset-e-9",
-  "inset-e-10",
-  "inset-e-11",
-  "inset-e-12",
-  "inset-e-14",
-  "inset-e-16",
-  "inset-e-20",
-  "inset-e-24",
-  "inset-e-28",
-  "inset-e-32",
-  "inset-e-36",
-  "inset-e-40",
-  "inset-e-44",
-  "inset-e-48",
-  "inset-e-52",
-  "inset-e-56",
-  "inset-e-60",
-  "inset-e-64",
-  "inset-e-72",
-  "inset-e-80",
-  "inset-e-96",
-  "inset-e-1/2",
-  "inset-e-1/3",
-  "inset-e-1/4",
-  "inset-e-1/5",
-  "inset-e-1/6",
-  "inset-e-1/12",
-  "inset-e-2/3",
-  "inset-e-2/4",
-  "inset-e-2/5",
-  "inset-e-2/6",
-  "inset-e-2/12",
-  "inset-e-3/4",
-  "inset-e-3/5",
-  "inset-e-3/6",
-  "inset-e-3/12",
-  "inset-e-4/5",
-  "inset-e-4/6",
-  "inset-e-4/12",
-  "inset-e-5/6",
-  "inset-e-5/12",
-  "inset-e-6/12",
-  "inset-e-7/12",
-  "inset-e-8/12",
-  "inset-e-9/12",
-  "inset-e-10/12",
-  "inset-e-11/12",
-  "inset-e-auto",
-  "inset-e-full",
-  "inset-e-px",
   "inset-full",
   "inset-px",
   "inset-ring",
@@ -5515,7 +4627,6 @@ exports[`getClassList 1`] = `
   "inset-ring-current/90",
   "inset-ring-current/95",
   "inset-ring-current/100",
-  "inset-ring-current/background",
   "inset-ring-inherit",
   "inset-ring-inherit/0",
   "inset-ring-inherit/5",
@@ -5538,7 +4649,6 @@ exports[`getClassList 1`] = `
   "inset-ring-inherit/90",
   "inset-ring-inherit/95",
   "inset-ring-inherit/100",
-  "inset-ring-inherit/background",
   "inset-ring-transparent",
   "inset-ring-transparent/0",
   "inset-ring-transparent/5",
@@ -5561,70 +4671,7 @@ exports[`getClassList 1`] = `
   "inset-ring-transparent/90",
   "inset-ring-transparent/95",
   "inset-ring-transparent/100",
-  "inset-ring-transparent/background",
-  "inset-s-0",
-  "inset-s-0.5",
-  "inset-s-1",
-  "inset-s-1.5",
-  "inset-s-2",
-  "inset-s-2.5",
-  "inset-s-3",
-  "inset-s-3.5",
-  "inset-s-4",
-  "inset-s-5",
-  "inset-s-6",
-  "inset-s-7",
-  "inset-s-8",
-  "inset-s-9",
-  "inset-s-10",
-  "inset-s-11",
-  "inset-s-12",
-  "inset-s-14",
-  "inset-s-16",
-  "inset-s-20",
-  "inset-s-24",
-  "inset-s-28",
-  "inset-s-32",
-  "inset-s-36",
-  "inset-s-40",
-  "inset-s-44",
-  "inset-s-48",
-  "inset-s-52",
-  "inset-s-56",
-  "inset-s-60",
-  "inset-s-64",
-  "inset-s-72",
-  "inset-s-80",
-  "inset-s-96",
-  "inset-s-1/2",
-  "inset-s-1/3",
-  "inset-s-1/4",
-  "inset-s-1/5",
-  "inset-s-1/6",
-  "inset-s-1/12",
-  "inset-s-2/3",
-  "inset-s-2/4",
-  "inset-s-2/5",
-  "inset-s-2/6",
-  "inset-s-2/12",
-  "inset-s-3/4",
-  "inset-s-3/5",
-  "inset-s-3/6",
-  "inset-s-3/12",
-  "inset-s-4/5",
-  "inset-s-4/6",
-  "inset-s-4/12",
-  "inset-s-5/6",
-  "inset-s-5/12",
-  "inset-s-6/12",
-  "inset-s-7/12",
-  "inset-s-8/12",
-  "inset-s-9/12",
-  "inset-s-10/12",
-  "inset-s-11/12",
-  "inset-s-auto",
-  "inset-s-full",
-  "inset-s-px",
+  "inset-shadow",
   "inset-shadow-current",
   "inset-shadow-current/0",
   "inset-shadow-current/5",
@@ -5647,7 +4694,6 @@ exports[`getClassList 1`] = `
   "inset-shadow-current/90",
   "inset-shadow-current/95",
   "inset-shadow-current/100",
-  "inset-shadow-current/background",
   "inset-shadow-inherit",
   "inset-shadow-inherit/0",
   "inset-shadow-inherit/5",
@@ -5670,31 +4716,8 @@ exports[`getClassList 1`] = `
   "inset-shadow-inherit/90",
   "inset-shadow-inherit/95",
   "inset-shadow-inherit/100",
-  "inset-shadow-inherit/background",
   "inset-shadow-initial",
-  "inset-shadow-none",
   "inset-shadow-sm",
-  "inset-shadow-sm/0",
-  "inset-shadow-sm/5",
-  "inset-shadow-sm/10",
-  "inset-shadow-sm/15",
-  "inset-shadow-sm/20",
-  "inset-shadow-sm/25",
-  "inset-shadow-sm/30",
-  "inset-shadow-sm/35",
-  "inset-shadow-sm/40",
-  "inset-shadow-sm/45",
-  "inset-shadow-sm/50",
-  "inset-shadow-sm/55",
-  "inset-shadow-sm/60",
-  "inset-shadow-sm/65",
-  "inset-shadow-sm/70",
-  "inset-shadow-sm/75",
-  "inset-shadow-sm/80",
-  "inset-shadow-sm/85",
-  "inset-shadow-sm/90",
-  "inset-shadow-sm/95",
-  "inset-shadow-sm/100",
   "inset-shadow-transparent",
   "inset-shadow-transparent/0",
   "inset-shadow-transparent/5",
@@ -5717,7 +4740,6 @@ exports[`getClassList 1`] = `
   "inset-shadow-transparent/90",
   "inset-shadow-transparent/95",
   "inset-shadow-transparent/100",
-  "inset-shadow-transparent/background",
   "inset-x-0",
   "inset-x-0.5",
   "inset-x-1",
@@ -6039,2383 +5061,6 @@ exports[`getClassList 1`] = `
   "m-96",
   "m-auto",
   "m-px",
-  "mask-add",
-  "mask-alpha",
-  "mask-auto",
-  "mask-b-from-0",
-  "mask-b-from-0%",
-  "mask-b-from-0.5",
-  "mask-b-from-1",
-  "mask-b-from-1.5",
-  "mask-b-from-2",
-  "mask-b-from-2.5",
-  "mask-b-from-3",
-  "mask-b-from-3.5",
-  "mask-b-from-4",
-  "mask-b-from-5",
-  "mask-b-from-5%",
-  "mask-b-from-6",
-  "mask-b-from-7",
-  "mask-b-from-8",
-  "mask-b-from-9",
-  "mask-b-from-10",
-  "mask-b-from-10%",
-  "mask-b-from-11",
-  "mask-b-from-12",
-  "mask-b-from-14",
-  "mask-b-from-15%",
-  "mask-b-from-16",
-  "mask-b-from-20",
-  "mask-b-from-20%",
-  "mask-b-from-24",
-  "mask-b-from-25%",
-  "mask-b-from-28",
-  "mask-b-from-30%",
-  "mask-b-from-32",
-  "mask-b-from-35%",
-  "mask-b-from-36",
-  "mask-b-from-40",
-  "mask-b-from-40%",
-  "mask-b-from-44",
-  "mask-b-from-45%",
-  "mask-b-from-48",
-  "mask-b-from-50%",
-  "mask-b-from-52",
-  "mask-b-from-55%",
-  "mask-b-from-56",
-  "mask-b-from-60",
-  "mask-b-from-60%",
-  "mask-b-from-64",
-  "mask-b-from-65%",
-  "mask-b-from-70%",
-  "mask-b-from-72",
-  "mask-b-from-75%",
-  "mask-b-from-80",
-  "mask-b-from-80%",
-  "mask-b-from-85%",
-  "mask-b-from-90%",
-  "mask-b-from-95%",
-  "mask-b-from-96",
-  "mask-b-from-100%",
-  "mask-b-from-current",
-  "mask-b-from-current/0",
-  "mask-b-from-current/5",
-  "mask-b-from-current/10",
-  "mask-b-from-current/15",
-  "mask-b-from-current/20",
-  "mask-b-from-current/25",
-  "mask-b-from-current/30",
-  "mask-b-from-current/35",
-  "mask-b-from-current/40",
-  "mask-b-from-current/45",
-  "mask-b-from-current/50",
-  "mask-b-from-current/55",
-  "mask-b-from-current/60",
-  "mask-b-from-current/65",
-  "mask-b-from-current/70",
-  "mask-b-from-current/75",
-  "mask-b-from-current/80",
-  "mask-b-from-current/85",
-  "mask-b-from-current/90",
-  "mask-b-from-current/95",
-  "mask-b-from-current/100",
-  "mask-b-from-current/background",
-  "mask-b-from-inherit",
-  "mask-b-from-inherit/0",
-  "mask-b-from-inherit/5",
-  "mask-b-from-inherit/10",
-  "mask-b-from-inherit/15",
-  "mask-b-from-inherit/20",
-  "mask-b-from-inherit/25",
-  "mask-b-from-inherit/30",
-  "mask-b-from-inherit/35",
-  "mask-b-from-inherit/40",
-  "mask-b-from-inherit/45",
-  "mask-b-from-inherit/50",
-  "mask-b-from-inherit/55",
-  "mask-b-from-inherit/60",
-  "mask-b-from-inherit/65",
-  "mask-b-from-inherit/70",
-  "mask-b-from-inherit/75",
-  "mask-b-from-inherit/80",
-  "mask-b-from-inherit/85",
-  "mask-b-from-inherit/90",
-  "mask-b-from-inherit/95",
-  "mask-b-from-inherit/100",
-  "mask-b-from-inherit/background",
-  "mask-b-from-transparent",
-  "mask-b-from-transparent/0",
-  "mask-b-from-transparent/5",
-  "mask-b-from-transparent/10",
-  "mask-b-from-transparent/15",
-  "mask-b-from-transparent/20",
-  "mask-b-from-transparent/25",
-  "mask-b-from-transparent/30",
-  "mask-b-from-transparent/35",
-  "mask-b-from-transparent/40",
-  "mask-b-from-transparent/45",
-  "mask-b-from-transparent/50",
-  "mask-b-from-transparent/55",
-  "mask-b-from-transparent/60",
-  "mask-b-from-transparent/65",
-  "mask-b-from-transparent/70",
-  "mask-b-from-transparent/75",
-  "mask-b-from-transparent/80",
-  "mask-b-from-transparent/85",
-  "mask-b-from-transparent/90",
-  "mask-b-from-transparent/95",
-  "mask-b-from-transparent/100",
-  "mask-b-from-transparent/background",
-  "mask-b-to-0",
-  "mask-b-to-0%",
-  "mask-b-to-0.5",
-  "mask-b-to-1",
-  "mask-b-to-1.5",
-  "mask-b-to-2",
-  "mask-b-to-2.5",
-  "mask-b-to-3",
-  "mask-b-to-3.5",
-  "mask-b-to-4",
-  "mask-b-to-5",
-  "mask-b-to-5%",
-  "mask-b-to-6",
-  "mask-b-to-7",
-  "mask-b-to-8",
-  "mask-b-to-9",
-  "mask-b-to-10",
-  "mask-b-to-10%",
-  "mask-b-to-11",
-  "mask-b-to-12",
-  "mask-b-to-14",
-  "mask-b-to-15%",
-  "mask-b-to-16",
-  "mask-b-to-20",
-  "mask-b-to-20%",
-  "mask-b-to-24",
-  "mask-b-to-25%",
-  "mask-b-to-28",
-  "mask-b-to-30%",
-  "mask-b-to-32",
-  "mask-b-to-35%",
-  "mask-b-to-36",
-  "mask-b-to-40",
-  "mask-b-to-40%",
-  "mask-b-to-44",
-  "mask-b-to-45%",
-  "mask-b-to-48",
-  "mask-b-to-50%",
-  "mask-b-to-52",
-  "mask-b-to-55%",
-  "mask-b-to-56",
-  "mask-b-to-60",
-  "mask-b-to-60%",
-  "mask-b-to-64",
-  "mask-b-to-65%",
-  "mask-b-to-70%",
-  "mask-b-to-72",
-  "mask-b-to-75%",
-  "mask-b-to-80",
-  "mask-b-to-80%",
-  "mask-b-to-85%",
-  "mask-b-to-90%",
-  "mask-b-to-95%",
-  "mask-b-to-96",
-  "mask-b-to-100%",
-  "mask-b-to-current",
-  "mask-b-to-current/0",
-  "mask-b-to-current/5",
-  "mask-b-to-current/10",
-  "mask-b-to-current/15",
-  "mask-b-to-current/20",
-  "mask-b-to-current/25",
-  "mask-b-to-current/30",
-  "mask-b-to-current/35",
-  "mask-b-to-current/40",
-  "mask-b-to-current/45",
-  "mask-b-to-current/50",
-  "mask-b-to-current/55",
-  "mask-b-to-current/60",
-  "mask-b-to-current/65",
-  "mask-b-to-current/70",
-  "mask-b-to-current/75",
-  "mask-b-to-current/80",
-  "mask-b-to-current/85",
-  "mask-b-to-current/90",
-  "mask-b-to-current/95",
-  "mask-b-to-current/100",
-  "mask-b-to-current/background",
-  "mask-b-to-inherit",
-  "mask-b-to-inherit/0",
-  "mask-b-to-inherit/5",
-  "mask-b-to-inherit/10",
-  "mask-b-to-inherit/15",
-  "mask-b-to-inherit/20",
-  "mask-b-to-inherit/25",
-  "mask-b-to-inherit/30",
-  "mask-b-to-inherit/35",
-  "mask-b-to-inherit/40",
-  "mask-b-to-inherit/45",
-  "mask-b-to-inherit/50",
-  "mask-b-to-inherit/55",
-  "mask-b-to-inherit/60",
-  "mask-b-to-inherit/65",
-  "mask-b-to-inherit/70",
-  "mask-b-to-inherit/75",
-  "mask-b-to-inherit/80",
-  "mask-b-to-inherit/85",
-  "mask-b-to-inherit/90",
-  "mask-b-to-inherit/95",
-  "mask-b-to-inherit/100",
-  "mask-b-to-inherit/background",
-  "mask-b-to-transparent",
-  "mask-b-to-transparent/0",
-  "mask-b-to-transparent/5",
-  "mask-b-to-transparent/10",
-  "mask-b-to-transparent/15",
-  "mask-b-to-transparent/20",
-  "mask-b-to-transparent/25",
-  "mask-b-to-transparent/30",
-  "mask-b-to-transparent/35",
-  "mask-b-to-transparent/40",
-  "mask-b-to-transparent/45",
-  "mask-b-to-transparent/50",
-  "mask-b-to-transparent/55",
-  "mask-b-to-transparent/60",
-  "mask-b-to-transparent/65",
-  "mask-b-to-transparent/70",
-  "mask-b-to-transparent/75",
-  "mask-b-to-transparent/80",
-  "mask-b-to-transparent/85",
-  "mask-b-to-transparent/90",
-  "mask-b-to-transparent/95",
-  "mask-b-to-transparent/100",
-  "mask-b-to-transparent/background",
-  "mask-bottom",
-  "mask-bottom-left",
-  "mask-bottom-right",
-  "mask-center",
-  "mask-circle",
-  "mask-clip-border",
-  "mask-clip-content",
-  "mask-clip-fill",
-  "mask-clip-padding",
-  "mask-clip-stroke",
-  "mask-clip-view",
-  "mask-conic-0",
-  "mask-conic-1",
-  "mask-conic-2",
-  "mask-conic-3",
-  "mask-conic-6",
-  "mask-conic-12",
-  "mask-conic-45",
-  "mask-conic-90",
-  "mask-conic-180",
-  "mask-conic-from-0",
-  "mask-conic-from-0%",
-  "mask-conic-from-0.5",
-  "mask-conic-from-1",
-  "mask-conic-from-1.5",
-  "mask-conic-from-2",
-  "mask-conic-from-2.5",
-  "mask-conic-from-3",
-  "mask-conic-from-3.5",
-  "mask-conic-from-4",
-  "mask-conic-from-5",
-  "mask-conic-from-5%",
-  "mask-conic-from-6",
-  "mask-conic-from-7",
-  "mask-conic-from-8",
-  "mask-conic-from-9",
-  "mask-conic-from-10",
-  "mask-conic-from-10%",
-  "mask-conic-from-11",
-  "mask-conic-from-12",
-  "mask-conic-from-14",
-  "mask-conic-from-15%",
-  "mask-conic-from-16",
-  "mask-conic-from-20",
-  "mask-conic-from-20%",
-  "mask-conic-from-24",
-  "mask-conic-from-25%",
-  "mask-conic-from-28",
-  "mask-conic-from-30%",
-  "mask-conic-from-32",
-  "mask-conic-from-35%",
-  "mask-conic-from-36",
-  "mask-conic-from-40",
-  "mask-conic-from-40%",
-  "mask-conic-from-44",
-  "mask-conic-from-45%",
-  "mask-conic-from-48",
-  "mask-conic-from-50%",
-  "mask-conic-from-52",
-  "mask-conic-from-55%",
-  "mask-conic-from-56",
-  "mask-conic-from-60",
-  "mask-conic-from-60%",
-  "mask-conic-from-64",
-  "mask-conic-from-65%",
-  "mask-conic-from-70%",
-  "mask-conic-from-72",
-  "mask-conic-from-75%",
-  "mask-conic-from-80",
-  "mask-conic-from-80%",
-  "mask-conic-from-85%",
-  "mask-conic-from-90%",
-  "mask-conic-from-95%",
-  "mask-conic-from-96",
-  "mask-conic-from-100%",
-  "mask-conic-from-current",
-  "mask-conic-from-current/0",
-  "mask-conic-from-current/5",
-  "mask-conic-from-current/10",
-  "mask-conic-from-current/15",
-  "mask-conic-from-current/20",
-  "mask-conic-from-current/25",
-  "mask-conic-from-current/30",
-  "mask-conic-from-current/35",
-  "mask-conic-from-current/40",
-  "mask-conic-from-current/45",
-  "mask-conic-from-current/50",
-  "mask-conic-from-current/55",
-  "mask-conic-from-current/60",
-  "mask-conic-from-current/65",
-  "mask-conic-from-current/70",
-  "mask-conic-from-current/75",
-  "mask-conic-from-current/80",
-  "mask-conic-from-current/85",
-  "mask-conic-from-current/90",
-  "mask-conic-from-current/95",
-  "mask-conic-from-current/100",
-  "mask-conic-from-current/background",
-  "mask-conic-from-inherit",
-  "mask-conic-from-inherit/0",
-  "mask-conic-from-inherit/5",
-  "mask-conic-from-inherit/10",
-  "mask-conic-from-inherit/15",
-  "mask-conic-from-inherit/20",
-  "mask-conic-from-inherit/25",
-  "mask-conic-from-inherit/30",
-  "mask-conic-from-inherit/35",
-  "mask-conic-from-inherit/40",
-  "mask-conic-from-inherit/45",
-  "mask-conic-from-inherit/50",
-  "mask-conic-from-inherit/55",
-  "mask-conic-from-inherit/60",
-  "mask-conic-from-inherit/65",
-  "mask-conic-from-inherit/70",
-  "mask-conic-from-inherit/75",
-  "mask-conic-from-inherit/80",
-  "mask-conic-from-inherit/85",
-  "mask-conic-from-inherit/90",
-  "mask-conic-from-inherit/95",
-  "mask-conic-from-inherit/100",
-  "mask-conic-from-inherit/background",
-  "mask-conic-from-transparent",
-  "mask-conic-from-transparent/0",
-  "mask-conic-from-transparent/5",
-  "mask-conic-from-transparent/10",
-  "mask-conic-from-transparent/15",
-  "mask-conic-from-transparent/20",
-  "mask-conic-from-transparent/25",
-  "mask-conic-from-transparent/30",
-  "mask-conic-from-transparent/35",
-  "mask-conic-from-transparent/40",
-  "mask-conic-from-transparent/45",
-  "mask-conic-from-transparent/50",
-  "mask-conic-from-transparent/55",
-  "mask-conic-from-transparent/60",
-  "mask-conic-from-transparent/65",
-  "mask-conic-from-transparent/70",
-  "mask-conic-from-transparent/75",
-  "mask-conic-from-transparent/80",
-  "mask-conic-from-transparent/85",
-  "mask-conic-from-transparent/90",
-  "mask-conic-from-transparent/95",
-  "mask-conic-from-transparent/100",
-  "mask-conic-from-transparent/background",
-  "mask-conic-to-0",
-  "mask-conic-to-0%",
-  "mask-conic-to-0.5",
-  "mask-conic-to-1",
-  "mask-conic-to-1.5",
-  "mask-conic-to-2",
-  "mask-conic-to-2.5",
-  "mask-conic-to-3",
-  "mask-conic-to-3.5",
-  "mask-conic-to-4",
-  "mask-conic-to-5",
-  "mask-conic-to-5%",
-  "mask-conic-to-6",
-  "mask-conic-to-7",
-  "mask-conic-to-8",
-  "mask-conic-to-9",
-  "mask-conic-to-10",
-  "mask-conic-to-10%",
-  "mask-conic-to-11",
-  "mask-conic-to-12",
-  "mask-conic-to-14",
-  "mask-conic-to-15%",
-  "mask-conic-to-16",
-  "mask-conic-to-20",
-  "mask-conic-to-20%",
-  "mask-conic-to-24",
-  "mask-conic-to-25%",
-  "mask-conic-to-28",
-  "mask-conic-to-30%",
-  "mask-conic-to-32",
-  "mask-conic-to-35%",
-  "mask-conic-to-36",
-  "mask-conic-to-40",
-  "mask-conic-to-40%",
-  "mask-conic-to-44",
-  "mask-conic-to-45%",
-  "mask-conic-to-48",
-  "mask-conic-to-50%",
-  "mask-conic-to-52",
-  "mask-conic-to-55%",
-  "mask-conic-to-56",
-  "mask-conic-to-60",
-  "mask-conic-to-60%",
-  "mask-conic-to-64",
-  "mask-conic-to-65%",
-  "mask-conic-to-70%",
-  "mask-conic-to-72",
-  "mask-conic-to-75%",
-  "mask-conic-to-80",
-  "mask-conic-to-80%",
-  "mask-conic-to-85%",
-  "mask-conic-to-90%",
-  "mask-conic-to-95%",
-  "mask-conic-to-96",
-  "mask-conic-to-100%",
-  "mask-conic-to-current",
-  "mask-conic-to-current/0",
-  "mask-conic-to-current/5",
-  "mask-conic-to-current/10",
-  "mask-conic-to-current/15",
-  "mask-conic-to-current/20",
-  "mask-conic-to-current/25",
-  "mask-conic-to-current/30",
-  "mask-conic-to-current/35",
-  "mask-conic-to-current/40",
-  "mask-conic-to-current/45",
-  "mask-conic-to-current/50",
-  "mask-conic-to-current/55",
-  "mask-conic-to-current/60",
-  "mask-conic-to-current/65",
-  "mask-conic-to-current/70",
-  "mask-conic-to-current/75",
-  "mask-conic-to-current/80",
-  "mask-conic-to-current/85",
-  "mask-conic-to-current/90",
-  "mask-conic-to-current/95",
-  "mask-conic-to-current/100",
-  "mask-conic-to-current/background",
-  "mask-conic-to-inherit",
-  "mask-conic-to-inherit/0",
-  "mask-conic-to-inherit/5",
-  "mask-conic-to-inherit/10",
-  "mask-conic-to-inherit/15",
-  "mask-conic-to-inherit/20",
-  "mask-conic-to-inherit/25",
-  "mask-conic-to-inherit/30",
-  "mask-conic-to-inherit/35",
-  "mask-conic-to-inherit/40",
-  "mask-conic-to-inherit/45",
-  "mask-conic-to-inherit/50",
-  "mask-conic-to-inherit/55",
-  "mask-conic-to-inherit/60",
-  "mask-conic-to-inherit/65",
-  "mask-conic-to-inherit/70",
-  "mask-conic-to-inherit/75",
-  "mask-conic-to-inherit/80",
-  "mask-conic-to-inherit/85",
-  "mask-conic-to-inherit/90",
-  "mask-conic-to-inherit/95",
-  "mask-conic-to-inherit/100",
-  "mask-conic-to-inherit/background",
-  "mask-conic-to-transparent",
-  "mask-conic-to-transparent/0",
-  "mask-conic-to-transparent/5",
-  "mask-conic-to-transparent/10",
-  "mask-conic-to-transparent/15",
-  "mask-conic-to-transparent/20",
-  "mask-conic-to-transparent/25",
-  "mask-conic-to-transparent/30",
-  "mask-conic-to-transparent/35",
-  "mask-conic-to-transparent/40",
-  "mask-conic-to-transparent/45",
-  "mask-conic-to-transparent/50",
-  "mask-conic-to-transparent/55",
-  "mask-conic-to-transparent/60",
-  "mask-conic-to-transparent/65",
-  "mask-conic-to-transparent/70",
-  "mask-conic-to-transparent/75",
-  "mask-conic-to-transparent/80",
-  "mask-conic-to-transparent/85",
-  "mask-conic-to-transparent/90",
-  "mask-conic-to-transparent/95",
-  "mask-conic-to-transparent/100",
-  "mask-conic-to-transparent/background",
-  "mask-contain",
-  "mask-cover",
-  "mask-ellipse",
-  "mask-exclude",
-  "mask-intersect",
-  "mask-l-from-0",
-  "mask-l-from-0%",
-  "mask-l-from-0.5",
-  "mask-l-from-1",
-  "mask-l-from-1.5",
-  "mask-l-from-2",
-  "mask-l-from-2.5",
-  "mask-l-from-3",
-  "mask-l-from-3.5",
-  "mask-l-from-4",
-  "mask-l-from-5",
-  "mask-l-from-5%",
-  "mask-l-from-6",
-  "mask-l-from-7",
-  "mask-l-from-8",
-  "mask-l-from-9",
-  "mask-l-from-10",
-  "mask-l-from-10%",
-  "mask-l-from-11",
-  "mask-l-from-12",
-  "mask-l-from-14",
-  "mask-l-from-15%",
-  "mask-l-from-16",
-  "mask-l-from-20",
-  "mask-l-from-20%",
-  "mask-l-from-24",
-  "mask-l-from-25%",
-  "mask-l-from-28",
-  "mask-l-from-30%",
-  "mask-l-from-32",
-  "mask-l-from-35%",
-  "mask-l-from-36",
-  "mask-l-from-40",
-  "mask-l-from-40%",
-  "mask-l-from-44",
-  "mask-l-from-45%",
-  "mask-l-from-48",
-  "mask-l-from-50%",
-  "mask-l-from-52",
-  "mask-l-from-55%",
-  "mask-l-from-56",
-  "mask-l-from-60",
-  "mask-l-from-60%",
-  "mask-l-from-64",
-  "mask-l-from-65%",
-  "mask-l-from-70%",
-  "mask-l-from-72",
-  "mask-l-from-75%",
-  "mask-l-from-80",
-  "mask-l-from-80%",
-  "mask-l-from-85%",
-  "mask-l-from-90%",
-  "mask-l-from-95%",
-  "mask-l-from-96",
-  "mask-l-from-100%",
-  "mask-l-from-current",
-  "mask-l-from-current/0",
-  "mask-l-from-current/5",
-  "mask-l-from-current/10",
-  "mask-l-from-current/15",
-  "mask-l-from-current/20",
-  "mask-l-from-current/25",
-  "mask-l-from-current/30",
-  "mask-l-from-current/35",
-  "mask-l-from-current/40",
-  "mask-l-from-current/45",
-  "mask-l-from-current/50",
-  "mask-l-from-current/55",
-  "mask-l-from-current/60",
-  "mask-l-from-current/65",
-  "mask-l-from-current/70",
-  "mask-l-from-current/75",
-  "mask-l-from-current/80",
-  "mask-l-from-current/85",
-  "mask-l-from-current/90",
-  "mask-l-from-current/95",
-  "mask-l-from-current/100",
-  "mask-l-from-current/background",
-  "mask-l-from-inherit",
-  "mask-l-from-inherit/0",
-  "mask-l-from-inherit/5",
-  "mask-l-from-inherit/10",
-  "mask-l-from-inherit/15",
-  "mask-l-from-inherit/20",
-  "mask-l-from-inherit/25",
-  "mask-l-from-inherit/30",
-  "mask-l-from-inherit/35",
-  "mask-l-from-inherit/40",
-  "mask-l-from-inherit/45",
-  "mask-l-from-inherit/50",
-  "mask-l-from-inherit/55",
-  "mask-l-from-inherit/60",
-  "mask-l-from-inherit/65",
-  "mask-l-from-inherit/70",
-  "mask-l-from-inherit/75",
-  "mask-l-from-inherit/80",
-  "mask-l-from-inherit/85",
-  "mask-l-from-inherit/90",
-  "mask-l-from-inherit/95",
-  "mask-l-from-inherit/100",
-  "mask-l-from-inherit/background",
-  "mask-l-from-transparent",
-  "mask-l-from-transparent/0",
-  "mask-l-from-transparent/5",
-  "mask-l-from-transparent/10",
-  "mask-l-from-transparent/15",
-  "mask-l-from-transparent/20",
-  "mask-l-from-transparent/25",
-  "mask-l-from-transparent/30",
-  "mask-l-from-transparent/35",
-  "mask-l-from-transparent/40",
-  "mask-l-from-transparent/45",
-  "mask-l-from-transparent/50",
-  "mask-l-from-transparent/55",
-  "mask-l-from-transparent/60",
-  "mask-l-from-transparent/65",
-  "mask-l-from-transparent/70",
-  "mask-l-from-transparent/75",
-  "mask-l-from-transparent/80",
-  "mask-l-from-transparent/85",
-  "mask-l-from-transparent/90",
-  "mask-l-from-transparent/95",
-  "mask-l-from-transparent/100",
-  "mask-l-from-transparent/background",
-  "mask-l-to-0",
-  "mask-l-to-0%",
-  "mask-l-to-0.5",
-  "mask-l-to-1",
-  "mask-l-to-1.5",
-  "mask-l-to-2",
-  "mask-l-to-2.5",
-  "mask-l-to-3",
-  "mask-l-to-3.5",
-  "mask-l-to-4",
-  "mask-l-to-5",
-  "mask-l-to-5%",
-  "mask-l-to-6",
-  "mask-l-to-7",
-  "mask-l-to-8",
-  "mask-l-to-9",
-  "mask-l-to-10",
-  "mask-l-to-10%",
-  "mask-l-to-11",
-  "mask-l-to-12",
-  "mask-l-to-14",
-  "mask-l-to-15%",
-  "mask-l-to-16",
-  "mask-l-to-20",
-  "mask-l-to-20%",
-  "mask-l-to-24",
-  "mask-l-to-25%",
-  "mask-l-to-28",
-  "mask-l-to-30%",
-  "mask-l-to-32",
-  "mask-l-to-35%",
-  "mask-l-to-36",
-  "mask-l-to-40",
-  "mask-l-to-40%",
-  "mask-l-to-44",
-  "mask-l-to-45%",
-  "mask-l-to-48",
-  "mask-l-to-50%",
-  "mask-l-to-52",
-  "mask-l-to-55%",
-  "mask-l-to-56",
-  "mask-l-to-60",
-  "mask-l-to-60%",
-  "mask-l-to-64",
-  "mask-l-to-65%",
-  "mask-l-to-70%",
-  "mask-l-to-72",
-  "mask-l-to-75%",
-  "mask-l-to-80",
-  "mask-l-to-80%",
-  "mask-l-to-85%",
-  "mask-l-to-90%",
-  "mask-l-to-95%",
-  "mask-l-to-96",
-  "mask-l-to-100%",
-  "mask-l-to-current",
-  "mask-l-to-current/0",
-  "mask-l-to-current/5",
-  "mask-l-to-current/10",
-  "mask-l-to-current/15",
-  "mask-l-to-current/20",
-  "mask-l-to-current/25",
-  "mask-l-to-current/30",
-  "mask-l-to-current/35",
-  "mask-l-to-current/40",
-  "mask-l-to-current/45",
-  "mask-l-to-current/50",
-  "mask-l-to-current/55",
-  "mask-l-to-current/60",
-  "mask-l-to-current/65",
-  "mask-l-to-current/70",
-  "mask-l-to-current/75",
-  "mask-l-to-current/80",
-  "mask-l-to-current/85",
-  "mask-l-to-current/90",
-  "mask-l-to-current/95",
-  "mask-l-to-current/100",
-  "mask-l-to-current/background",
-  "mask-l-to-inherit",
-  "mask-l-to-inherit/0",
-  "mask-l-to-inherit/5",
-  "mask-l-to-inherit/10",
-  "mask-l-to-inherit/15",
-  "mask-l-to-inherit/20",
-  "mask-l-to-inherit/25",
-  "mask-l-to-inherit/30",
-  "mask-l-to-inherit/35",
-  "mask-l-to-inherit/40",
-  "mask-l-to-inherit/45",
-  "mask-l-to-inherit/50",
-  "mask-l-to-inherit/55",
-  "mask-l-to-inherit/60",
-  "mask-l-to-inherit/65",
-  "mask-l-to-inherit/70",
-  "mask-l-to-inherit/75",
-  "mask-l-to-inherit/80",
-  "mask-l-to-inherit/85",
-  "mask-l-to-inherit/90",
-  "mask-l-to-inherit/95",
-  "mask-l-to-inherit/100",
-  "mask-l-to-inherit/background",
-  "mask-l-to-transparent",
-  "mask-l-to-transparent/0",
-  "mask-l-to-transparent/5",
-  "mask-l-to-transparent/10",
-  "mask-l-to-transparent/15",
-  "mask-l-to-transparent/20",
-  "mask-l-to-transparent/25",
-  "mask-l-to-transparent/30",
-  "mask-l-to-transparent/35",
-  "mask-l-to-transparent/40",
-  "mask-l-to-transparent/45",
-  "mask-l-to-transparent/50",
-  "mask-l-to-transparent/55",
-  "mask-l-to-transparent/60",
-  "mask-l-to-transparent/65",
-  "mask-l-to-transparent/70",
-  "mask-l-to-transparent/75",
-  "mask-l-to-transparent/80",
-  "mask-l-to-transparent/85",
-  "mask-l-to-transparent/90",
-  "mask-l-to-transparent/95",
-  "mask-l-to-transparent/100",
-  "mask-l-to-transparent/background",
-  "mask-left",
-  "mask-linear-0",
-  "mask-linear-1",
-  "mask-linear-2",
-  "mask-linear-3",
-  "mask-linear-6",
-  "mask-linear-12",
-  "mask-linear-45",
-  "mask-linear-90",
-  "mask-linear-180",
-  "mask-linear-from-0",
-  "mask-linear-from-0%",
-  "mask-linear-from-0.5",
-  "mask-linear-from-1",
-  "mask-linear-from-1.5",
-  "mask-linear-from-2",
-  "mask-linear-from-2.5",
-  "mask-linear-from-3",
-  "mask-linear-from-3.5",
-  "mask-linear-from-4",
-  "mask-linear-from-5",
-  "mask-linear-from-5%",
-  "mask-linear-from-6",
-  "mask-linear-from-7",
-  "mask-linear-from-8",
-  "mask-linear-from-9",
-  "mask-linear-from-10",
-  "mask-linear-from-10%",
-  "mask-linear-from-11",
-  "mask-linear-from-12",
-  "mask-linear-from-14",
-  "mask-linear-from-15%",
-  "mask-linear-from-16",
-  "mask-linear-from-20",
-  "mask-linear-from-20%",
-  "mask-linear-from-24",
-  "mask-linear-from-25%",
-  "mask-linear-from-28",
-  "mask-linear-from-30%",
-  "mask-linear-from-32",
-  "mask-linear-from-35%",
-  "mask-linear-from-36",
-  "mask-linear-from-40",
-  "mask-linear-from-40%",
-  "mask-linear-from-44",
-  "mask-linear-from-45%",
-  "mask-linear-from-48",
-  "mask-linear-from-50%",
-  "mask-linear-from-52",
-  "mask-linear-from-55%",
-  "mask-linear-from-56",
-  "mask-linear-from-60",
-  "mask-linear-from-60%",
-  "mask-linear-from-64",
-  "mask-linear-from-65%",
-  "mask-linear-from-70%",
-  "mask-linear-from-72",
-  "mask-linear-from-75%",
-  "mask-linear-from-80",
-  "mask-linear-from-80%",
-  "mask-linear-from-85%",
-  "mask-linear-from-90%",
-  "mask-linear-from-95%",
-  "mask-linear-from-96",
-  "mask-linear-from-100%",
-  "mask-linear-from-current",
-  "mask-linear-from-current/0",
-  "mask-linear-from-current/5",
-  "mask-linear-from-current/10",
-  "mask-linear-from-current/15",
-  "mask-linear-from-current/20",
-  "mask-linear-from-current/25",
-  "mask-linear-from-current/30",
-  "mask-linear-from-current/35",
-  "mask-linear-from-current/40",
-  "mask-linear-from-current/45",
-  "mask-linear-from-current/50",
-  "mask-linear-from-current/55",
-  "mask-linear-from-current/60",
-  "mask-linear-from-current/65",
-  "mask-linear-from-current/70",
-  "mask-linear-from-current/75",
-  "mask-linear-from-current/80",
-  "mask-linear-from-current/85",
-  "mask-linear-from-current/90",
-  "mask-linear-from-current/95",
-  "mask-linear-from-current/100",
-  "mask-linear-from-current/background",
-  "mask-linear-from-inherit",
-  "mask-linear-from-inherit/0",
-  "mask-linear-from-inherit/5",
-  "mask-linear-from-inherit/10",
-  "mask-linear-from-inherit/15",
-  "mask-linear-from-inherit/20",
-  "mask-linear-from-inherit/25",
-  "mask-linear-from-inherit/30",
-  "mask-linear-from-inherit/35",
-  "mask-linear-from-inherit/40",
-  "mask-linear-from-inherit/45",
-  "mask-linear-from-inherit/50",
-  "mask-linear-from-inherit/55",
-  "mask-linear-from-inherit/60",
-  "mask-linear-from-inherit/65",
-  "mask-linear-from-inherit/70",
-  "mask-linear-from-inherit/75",
-  "mask-linear-from-inherit/80",
-  "mask-linear-from-inherit/85",
-  "mask-linear-from-inherit/90",
-  "mask-linear-from-inherit/95",
-  "mask-linear-from-inherit/100",
-  "mask-linear-from-inherit/background",
-  "mask-linear-from-transparent",
-  "mask-linear-from-transparent/0",
-  "mask-linear-from-transparent/5",
-  "mask-linear-from-transparent/10",
-  "mask-linear-from-transparent/15",
-  "mask-linear-from-transparent/20",
-  "mask-linear-from-transparent/25",
-  "mask-linear-from-transparent/30",
-  "mask-linear-from-transparent/35",
-  "mask-linear-from-transparent/40",
-  "mask-linear-from-transparent/45",
-  "mask-linear-from-transparent/50",
-  "mask-linear-from-transparent/55",
-  "mask-linear-from-transparent/60",
-  "mask-linear-from-transparent/65",
-  "mask-linear-from-transparent/70",
-  "mask-linear-from-transparent/75",
-  "mask-linear-from-transparent/80",
-  "mask-linear-from-transparent/85",
-  "mask-linear-from-transparent/90",
-  "mask-linear-from-transparent/95",
-  "mask-linear-from-transparent/100",
-  "mask-linear-from-transparent/background",
-  "mask-linear-to-0",
-  "mask-linear-to-0%",
-  "mask-linear-to-0.5",
-  "mask-linear-to-1",
-  "mask-linear-to-1.5",
-  "mask-linear-to-2",
-  "mask-linear-to-2.5",
-  "mask-linear-to-3",
-  "mask-linear-to-3.5",
-  "mask-linear-to-4",
-  "mask-linear-to-5",
-  "mask-linear-to-5%",
-  "mask-linear-to-6",
-  "mask-linear-to-7",
-  "mask-linear-to-8",
-  "mask-linear-to-9",
-  "mask-linear-to-10",
-  "mask-linear-to-10%",
-  "mask-linear-to-11",
-  "mask-linear-to-12",
-  "mask-linear-to-14",
-  "mask-linear-to-15%",
-  "mask-linear-to-16",
-  "mask-linear-to-20",
-  "mask-linear-to-20%",
-  "mask-linear-to-24",
-  "mask-linear-to-25%",
-  "mask-linear-to-28",
-  "mask-linear-to-30%",
-  "mask-linear-to-32",
-  "mask-linear-to-35%",
-  "mask-linear-to-36",
-  "mask-linear-to-40",
-  "mask-linear-to-40%",
-  "mask-linear-to-44",
-  "mask-linear-to-45%",
-  "mask-linear-to-48",
-  "mask-linear-to-50%",
-  "mask-linear-to-52",
-  "mask-linear-to-55%",
-  "mask-linear-to-56",
-  "mask-linear-to-60",
-  "mask-linear-to-60%",
-  "mask-linear-to-64",
-  "mask-linear-to-65%",
-  "mask-linear-to-70%",
-  "mask-linear-to-72",
-  "mask-linear-to-75%",
-  "mask-linear-to-80",
-  "mask-linear-to-80%",
-  "mask-linear-to-85%",
-  "mask-linear-to-90%",
-  "mask-linear-to-95%",
-  "mask-linear-to-96",
-  "mask-linear-to-100%",
-  "mask-linear-to-current",
-  "mask-linear-to-current/0",
-  "mask-linear-to-current/5",
-  "mask-linear-to-current/10",
-  "mask-linear-to-current/15",
-  "mask-linear-to-current/20",
-  "mask-linear-to-current/25",
-  "mask-linear-to-current/30",
-  "mask-linear-to-current/35",
-  "mask-linear-to-current/40",
-  "mask-linear-to-current/45",
-  "mask-linear-to-current/50",
-  "mask-linear-to-current/55",
-  "mask-linear-to-current/60",
-  "mask-linear-to-current/65",
-  "mask-linear-to-current/70",
-  "mask-linear-to-current/75",
-  "mask-linear-to-current/80",
-  "mask-linear-to-current/85",
-  "mask-linear-to-current/90",
-  "mask-linear-to-current/95",
-  "mask-linear-to-current/100",
-  "mask-linear-to-current/background",
-  "mask-linear-to-inherit",
-  "mask-linear-to-inherit/0",
-  "mask-linear-to-inherit/5",
-  "mask-linear-to-inherit/10",
-  "mask-linear-to-inherit/15",
-  "mask-linear-to-inherit/20",
-  "mask-linear-to-inherit/25",
-  "mask-linear-to-inherit/30",
-  "mask-linear-to-inherit/35",
-  "mask-linear-to-inherit/40",
-  "mask-linear-to-inherit/45",
-  "mask-linear-to-inherit/50",
-  "mask-linear-to-inherit/55",
-  "mask-linear-to-inherit/60",
-  "mask-linear-to-inherit/65",
-  "mask-linear-to-inherit/70",
-  "mask-linear-to-inherit/75",
-  "mask-linear-to-inherit/80",
-  "mask-linear-to-inherit/85",
-  "mask-linear-to-inherit/90",
-  "mask-linear-to-inherit/95",
-  "mask-linear-to-inherit/100",
-  "mask-linear-to-inherit/background",
-  "mask-linear-to-transparent",
-  "mask-linear-to-transparent/0",
-  "mask-linear-to-transparent/5",
-  "mask-linear-to-transparent/10",
-  "mask-linear-to-transparent/15",
-  "mask-linear-to-transparent/20",
-  "mask-linear-to-transparent/25",
-  "mask-linear-to-transparent/30",
-  "mask-linear-to-transparent/35",
-  "mask-linear-to-transparent/40",
-  "mask-linear-to-transparent/45",
-  "mask-linear-to-transparent/50",
-  "mask-linear-to-transparent/55",
-  "mask-linear-to-transparent/60",
-  "mask-linear-to-transparent/65",
-  "mask-linear-to-transparent/70",
-  "mask-linear-to-transparent/75",
-  "mask-linear-to-transparent/80",
-  "mask-linear-to-transparent/85",
-  "mask-linear-to-transparent/90",
-  "mask-linear-to-transparent/95",
-  "mask-linear-to-transparent/100",
-  "mask-linear-to-transparent/background",
-  "mask-luminance",
-  "mask-match",
-  "mask-no-clip",
-  "mask-no-repeat",
-  "mask-none",
-  "mask-origin-border",
-  "mask-origin-content",
-  "mask-origin-fill",
-  "mask-origin-padding",
-  "mask-origin-stroke",
-  "mask-origin-view",
-  "mask-r-from-0",
-  "mask-r-from-0%",
-  "mask-r-from-0.5",
-  "mask-r-from-1",
-  "mask-r-from-1.5",
-  "mask-r-from-2",
-  "mask-r-from-2.5",
-  "mask-r-from-3",
-  "mask-r-from-3.5",
-  "mask-r-from-4",
-  "mask-r-from-5",
-  "mask-r-from-5%",
-  "mask-r-from-6",
-  "mask-r-from-7",
-  "mask-r-from-8",
-  "mask-r-from-9",
-  "mask-r-from-10",
-  "mask-r-from-10%",
-  "mask-r-from-11",
-  "mask-r-from-12",
-  "mask-r-from-14",
-  "mask-r-from-15%",
-  "mask-r-from-16",
-  "mask-r-from-20",
-  "mask-r-from-20%",
-  "mask-r-from-24",
-  "mask-r-from-25%",
-  "mask-r-from-28",
-  "mask-r-from-30%",
-  "mask-r-from-32",
-  "mask-r-from-35%",
-  "mask-r-from-36",
-  "mask-r-from-40",
-  "mask-r-from-40%",
-  "mask-r-from-44",
-  "mask-r-from-45%",
-  "mask-r-from-48",
-  "mask-r-from-50%",
-  "mask-r-from-52",
-  "mask-r-from-55%",
-  "mask-r-from-56",
-  "mask-r-from-60",
-  "mask-r-from-60%",
-  "mask-r-from-64",
-  "mask-r-from-65%",
-  "mask-r-from-70%",
-  "mask-r-from-72",
-  "mask-r-from-75%",
-  "mask-r-from-80",
-  "mask-r-from-80%",
-  "mask-r-from-85%",
-  "mask-r-from-90%",
-  "mask-r-from-95%",
-  "mask-r-from-96",
-  "mask-r-from-100%",
-  "mask-r-from-current",
-  "mask-r-from-current/0",
-  "mask-r-from-current/5",
-  "mask-r-from-current/10",
-  "mask-r-from-current/15",
-  "mask-r-from-current/20",
-  "mask-r-from-current/25",
-  "mask-r-from-current/30",
-  "mask-r-from-current/35",
-  "mask-r-from-current/40",
-  "mask-r-from-current/45",
-  "mask-r-from-current/50",
-  "mask-r-from-current/55",
-  "mask-r-from-current/60",
-  "mask-r-from-current/65",
-  "mask-r-from-current/70",
-  "mask-r-from-current/75",
-  "mask-r-from-current/80",
-  "mask-r-from-current/85",
-  "mask-r-from-current/90",
-  "mask-r-from-current/95",
-  "mask-r-from-current/100",
-  "mask-r-from-current/background",
-  "mask-r-from-inherit",
-  "mask-r-from-inherit/0",
-  "mask-r-from-inherit/5",
-  "mask-r-from-inherit/10",
-  "mask-r-from-inherit/15",
-  "mask-r-from-inherit/20",
-  "mask-r-from-inherit/25",
-  "mask-r-from-inherit/30",
-  "mask-r-from-inherit/35",
-  "mask-r-from-inherit/40",
-  "mask-r-from-inherit/45",
-  "mask-r-from-inherit/50",
-  "mask-r-from-inherit/55",
-  "mask-r-from-inherit/60",
-  "mask-r-from-inherit/65",
-  "mask-r-from-inherit/70",
-  "mask-r-from-inherit/75",
-  "mask-r-from-inherit/80",
-  "mask-r-from-inherit/85",
-  "mask-r-from-inherit/90",
-  "mask-r-from-inherit/95",
-  "mask-r-from-inherit/100",
-  "mask-r-from-inherit/background",
-  "mask-r-from-transparent",
-  "mask-r-from-transparent/0",
-  "mask-r-from-transparent/5",
-  "mask-r-from-transparent/10",
-  "mask-r-from-transparent/15",
-  "mask-r-from-transparent/20",
-  "mask-r-from-transparent/25",
-  "mask-r-from-transparent/30",
-  "mask-r-from-transparent/35",
-  "mask-r-from-transparent/40",
-  "mask-r-from-transparent/45",
-  "mask-r-from-transparent/50",
-  "mask-r-from-transparent/55",
-  "mask-r-from-transparent/60",
-  "mask-r-from-transparent/65",
-  "mask-r-from-transparent/70",
-  "mask-r-from-transparent/75",
-  "mask-r-from-transparent/80",
-  "mask-r-from-transparent/85",
-  "mask-r-from-transparent/90",
-  "mask-r-from-transparent/95",
-  "mask-r-from-transparent/100",
-  "mask-r-from-transparent/background",
-  "mask-r-to-0",
-  "mask-r-to-0%",
-  "mask-r-to-0.5",
-  "mask-r-to-1",
-  "mask-r-to-1.5",
-  "mask-r-to-2",
-  "mask-r-to-2.5",
-  "mask-r-to-3",
-  "mask-r-to-3.5",
-  "mask-r-to-4",
-  "mask-r-to-5",
-  "mask-r-to-5%",
-  "mask-r-to-6",
-  "mask-r-to-7",
-  "mask-r-to-8",
-  "mask-r-to-9",
-  "mask-r-to-10",
-  "mask-r-to-10%",
-  "mask-r-to-11",
-  "mask-r-to-12",
-  "mask-r-to-14",
-  "mask-r-to-15%",
-  "mask-r-to-16",
-  "mask-r-to-20",
-  "mask-r-to-20%",
-  "mask-r-to-24",
-  "mask-r-to-25%",
-  "mask-r-to-28",
-  "mask-r-to-30%",
-  "mask-r-to-32",
-  "mask-r-to-35%",
-  "mask-r-to-36",
-  "mask-r-to-40",
-  "mask-r-to-40%",
-  "mask-r-to-44",
-  "mask-r-to-45%",
-  "mask-r-to-48",
-  "mask-r-to-50%",
-  "mask-r-to-52",
-  "mask-r-to-55%",
-  "mask-r-to-56",
-  "mask-r-to-60",
-  "mask-r-to-60%",
-  "mask-r-to-64",
-  "mask-r-to-65%",
-  "mask-r-to-70%",
-  "mask-r-to-72",
-  "mask-r-to-75%",
-  "mask-r-to-80",
-  "mask-r-to-80%",
-  "mask-r-to-85%",
-  "mask-r-to-90%",
-  "mask-r-to-95%",
-  "mask-r-to-96",
-  "mask-r-to-100%",
-  "mask-r-to-current",
-  "mask-r-to-current/0",
-  "mask-r-to-current/5",
-  "mask-r-to-current/10",
-  "mask-r-to-current/15",
-  "mask-r-to-current/20",
-  "mask-r-to-current/25",
-  "mask-r-to-current/30",
-  "mask-r-to-current/35",
-  "mask-r-to-current/40",
-  "mask-r-to-current/45",
-  "mask-r-to-current/50",
-  "mask-r-to-current/55",
-  "mask-r-to-current/60",
-  "mask-r-to-current/65",
-  "mask-r-to-current/70",
-  "mask-r-to-current/75",
-  "mask-r-to-current/80",
-  "mask-r-to-current/85",
-  "mask-r-to-current/90",
-  "mask-r-to-current/95",
-  "mask-r-to-current/100",
-  "mask-r-to-current/background",
-  "mask-r-to-inherit",
-  "mask-r-to-inherit/0",
-  "mask-r-to-inherit/5",
-  "mask-r-to-inherit/10",
-  "mask-r-to-inherit/15",
-  "mask-r-to-inherit/20",
-  "mask-r-to-inherit/25",
-  "mask-r-to-inherit/30",
-  "mask-r-to-inherit/35",
-  "mask-r-to-inherit/40",
-  "mask-r-to-inherit/45",
-  "mask-r-to-inherit/50",
-  "mask-r-to-inherit/55",
-  "mask-r-to-inherit/60",
-  "mask-r-to-inherit/65",
-  "mask-r-to-inherit/70",
-  "mask-r-to-inherit/75",
-  "mask-r-to-inherit/80",
-  "mask-r-to-inherit/85",
-  "mask-r-to-inherit/90",
-  "mask-r-to-inherit/95",
-  "mask-r-to-inherit/100",
-  "mask-r-to-inherit/background",
-  "mask-r-to-transparent",
-  "mask-r-to-transparent/0",
-  "mask-r-to-transparent/5",
-  "mask-r-to-transparent/10",
-  "mask-r-to-transparent/15",
-  "mask-r-to-transparent/20",
-  "mask-r-to-transparent/25",
-  "mask-r-to-transparent/30",
-  "mask-r-to-transparent/35",
-  "mask-r-to-transparent/40",
-  "mask-r-to-transparent/45",
-  "mask-r-to-transparent/50",
-  "mask-r-to-transparent/55",
-  "mask-r-to-transparent/60",
-  "mask-r-to-transparent/65",
-  "mask-r-to-transparent/70",
-  "mask-r-to-transparent/75",
-  "mask-r-to-transparent/80",
-  "mask-r-to-transparent/85",
-  "mask-r-to-transparent/90",
-  "mask-r-to-transparent/95",
-  "mask-r-to-transparent/100",
-  "mask-r-to-transparent/background",
-  "mask-radial-at-bottom",
-  "mask-radial-at-bottom-left",
-  "mask-radial-at-bottom-right",
-  "mask-radial-at-center",
-  "mask-radial-at-left",
-  "mask-radial-at-right",
-  "mask-radial-at-top",
-  "mask-radial-at-top-left",
-  "mask-radial-at-top-right",
-  "mask-radial-closest-corner",
-  "mask-radial-closest-side",
-  "mask-radial-farthest-corner",
-  "mask-radial-farthest-side",
-  "mask-radial-from-0",
-  "mask-radial-from-0%",
-  "mask-radial-from-0.5",
-  "mask-radial-from-1",
-  "mask-radial-from-1.5",
-  "mask-radial-from-2",
-  "mask-radial-from-2.5",
-  "mask-radial-from-3",
-  "mask-radial-from-3.5",
-  "mask-radial-from-4",
-  "mask-radial-from-5",
-  "mask-radial-from-5%",
-  "mask-radial-from-6",
-  "mask-radial-from-7",
-  "mask-radial-from-8",
-  "mask-radial-from-9",
-  "mask-radial-from-10",
-  "mask-radial-from-10%",
-  "mask-radial-from-11",
-  "mask-radial-from-12",
-  "mask-radial-from-14",
-  "mask-radial-from-15%",
-  "mask-radial-from-16",
-  "mask-radial-from-20",
-  "mask-radial-from-20%",
-  "mask-radial-from-24",
-  "mask-radial-from-25%",
-  "mask-radial-from-28",
-  "mask-radial-from-30%",
-  "mask-radial-from-32",
-  "mask-radial-from-35%",
-  "mask-radial-from-36",
-  "mask-radial-from-40",
-  "mask-radial-from-40%",
-  "mask-radial-from-44",
-  "mask-radial-from-45%",
-  "mask-radial-from-48",
-  "mask-radial-from-50%",
-  "mask-radial-from-52",
-  "mask-radial-from-55%",
-  "mask-radial-from-56",
-  "mask-radial-from-60",
-  "mask-radial-from-60%",
-  "mask-radial-from-64",
-  "mask-radial-from-65%",
-  "mask-radial-from-70%",
-  "mask-radial-from-72",
-  "mask-radial-from-75%",
-  "mask-radial-from-80",
-  "mask-radial-from-80%",
-  "mask-radial-from-85%",
-  "mask-radial-from-90%",
-  "mask-radial-from-95%",
-  "mask-radial-from-96",
-  "mask-radial-from-100%",
-  "mask-radial-from-current",
-  "mask-radial-from-current/0",
-  "mask-radial-from-current/5",
-  "mask-radial-from-current/10",
-  "mask-radial-from-current/15",
-  "mask-radial-from-current/20",
-  "mask-radial-from-current/25",
-  "mask-radial-from-current/30",
-  "mask-radial-from-current/35",
-  "mask-radial-from-current/40",
-  "mask-radial-from-current/45",
-  "mask-radial-from-current/50",
-  "mask-radial-from-current/55",
-  "mask-radial-from-current/60",
-  "mask-radial-from-current/65",
-  "mask-radial-from-current/70",
-  "mask-radial-from-current/75",
-  "mask-radial-from-current/80",
-  "mask-radial-from-current/85",
-  "mask-radial-from-current/90",
-  "mask-radial-from-current/95",
-  "mask-radial-from-current/100",
-  "mask-radial-from-current/background",
-  "mask-radial-from-inherit",
-  "mask-radial-from-inherit/0",
-  "mask-radial-from-inherit/5",
-  "mask-radial-from-inherit/10",
-  "mask-radial-from-inherit/15",
-  "mask-radial-from-inherit/20",
-  "mask-radial-from-inherit/25",
-  "mask-radial-from-inherit/30",
-  "mask-radial-from-inherit/35",
-  "mask-radial-from-inherit/40",
-  "mask-radial-from-inherit/45",
-  "mask-radial-from-inherit/50",
-  "mask-radial-from-inherit/55",
-  "mask-radial-from-inherit/60",
-  "mask-radial-from-inherit/65",
-  "mask-radial-from-inherit/70",
-  "mask-radial-from-inherit/75",
-  "mask-radial-from-inherit/80",
-  "mask-radial-from-inherit/85",
-  "mask-radial-from-inherit/90",
-  "mask-radial-from-inherit/95",
-  "mask-radial-from-inherit/100",
-  "mask-radial-from-inherit/background",
-  "mask-radial-from-transparent",
-  "mask-radial-from-transparent/0",
-  "mask-radial-from-transparent/5",
-  "mask-radial-from-transparent/10",
-  "mask-radial-from-transparent/15",
-  "mask-radial-from-transparent/20",
-  "mask-radial-from-transparent/25",
-  "mask-radial-from-transparent/30",
-  "mask-radial-from-transparent/35",
-  "mask-radial-from-transparent/40",
-  "mask-radial-from-transparent/45",
-  "mask-radial-from-transparent/50",
-  "mask-radial-from-transparent/55",
-  "mask-radial-from-transparent/60",
-  "mask-radial-from-transparent/65",
-  "mask-radial-from-transparent/70",
-  "mask-radial-from-transparent/75",
-  "mask-radial-from-transparent/80",
-  "mask-radial-from-transparent/85",
-  "mask-radial-from-transparent/90",
-  "mask-radial-from-transparent/95",
-  "mask-radial-from-transparent/100",
-  "mask-radial-from-transparent/background",
-  "mask-radial-to-0",
-  "mask-radial-to-0%",
-  "mask-radial-to-0.5",
-  "mask-radial-to-1",
-  "mask-radial-to-1.5",
-  "mask-radial-to-2",
-  "mask-radial-to-2.5",
-  "mask-radial-to-3",
-  "mask-radial-to-3.5",
-  "mask-radial-to-4",
-  "mask-radial-to-5",
-  "mask-radial-to-5%",
-  "mask-radial-to-6",
-  "mask-radial-to-7",
-  "mask-radial-to-8",
-  "mask-radial-to-9",
-  "mask-radial-to-10",
-  "mask-radial-to-10%",
-  "mask-radial-to-11",
-  "mask-radial-to-12",
-  "mask-radial-to-14",
-  "mask-radial-to-15%",
-  "mask-radial-to-16",
-  "mask-radial-to-20",
-  "mask-radial-to-20%",
-  "mask-radial-to-24",
-  "mask-radial-to-25%",
-  "mask-radial-to-28",
-  "mask-radial-to-30%",
-  "mask-radial-to-32",
-  "mask-radial-to-35%",
-  "mask-radial-to-36",
-  "mask-radial-to-40",
-  "mask-radial-to-40%",
-  "mask-radial-to-44",
-  "mask-radial-to-45%",
-  "mask-radial-to-48",
-  "mask-radial-to-50%",
-  "mask-radial-to-52",
-  "mask-radial-to-55%",
-  "mask-radial-to-56",
-  "mask-radial-to-60",
-  "mask-radial-to-60%",
-  "mask-radial-to-64",
-  "mask-radial-to-65%",
-  "mask-radial-to-70%",
-  "mask-radial-to-72",
-  "mask-radial-to-75%",
-  "mask-radial-to-80",
-  "mask-radial-to-80%",
-  "mask-radial-to-85%",
-  "mask-radial-to-90%",
-  "mask-radial-to-95%",
-  "mask-radial-to-96",
-  "mask-radial-to-100%",
-  "mask-radial-to-current",
-  "mask-radial-to-current/0",
-  "mask-radial-to-current/5",
-  "mask-radial-to-current/10",
-  "mask-radial-to-current/15",
-  "mask-radial-to-current/20",
-  "mask-radial-to-current/25",
-  "mask-radial-to-current/30",
-  "mask-radial-to-current/35",
-  "mask-radial-to-current/40",
-  "mask-radial-to-current/45",
-  "mask-radial-to-current/50",
-  "mask-radial-to-current/55",
-  "mask-radial-to-current/60",
-  "mask-radial-to-current/65",
-  "mask-radial-to-current/70",
-  "mask-radial-to-current/75",
-  "mask-radial-to-current/80",
-  "mask-radial-to-current/85",
-  "mask-radial-to-current/90",
-  "mask-radial-to-current/95",
-  "mask-radial-to-current/100",
-  "mask-radial-to-current/background",
-  "mask-radial-to-inherit",
-  "mask-radial-to-inherit/0",
-  "mask-radial-to-inherit/5",
-  "mask-radial-to-inherit/10",
-  "mask-radial-to-inherit/15",
-  "mask-radial-to-inherit/20",
-  "mask-radial-to-inherit/25",
-  "mask-radial-to-inherit/30",
-  "mask-radial-to-inherit/35",
-  "mask-radial-to-inherit/40",
-  "mask-radial-to-inherit/45",
-  "mask-radial-to-inherit/50",
-  "mask-radial-to-inherit/55",
-  "mask-radial-to-inherit/60",
-  "mask-radial-to-inherit/65",
-  "mask-radial-to-inherit/70",
-  "mask-radial-to-inherit/75",
-  "mask-radial-to-inherit/80",
-  "mask-radial-to-inherit/85",
-  "mask-radial-to-inherit/90",
-  "mask-radial-to-inherit/95",
-  "mask-radial-to-inherit/100",
-  "mask-radial-to-inherit/background",
-  "mask-radial-to-transparent",
-  "mask-radial-to-transparent/0",
-  "mask-radial-to-transparent/5",
-  "mask-radial-to-transparent/10",
-  "mask-radial-to-transparent/15",
-  "mask-radial-to-transparent/20",
-  "mask-radial-to-transparent/25",
-  "mask-radial-to-transparent/30",
-  "mask-radial-to-transparent/35",
-  "mask-radial-to-transparent/40",
-  "mask-radial-to-transparent/45",
-  "mask-radial-to-transparent/50",
-  "mask-radial-to-transparent/55",
-  "mask-radial-to-transparent/60",
-  "mask-radial-to-transparent/65",
-  "mask-radial-to-transparent/70",
-  "mask-radial-to-transparent/75",
-  "mask-radial-to-transparent/80",
-  "mask-radial-to-transparent/85",
-  "mask-radial-to-transparent/90",
-  "mask-radial-to-transparent/95",
-  "mask-radial-to-transparent/100",
-  "mask-radial-to-transparent/background",
-  "mask-repeat",
-  "mask-repeat-round",
-  "mask-repeat-space",
-  "mask-repeat-x",
-  "mask-repeat-y",
-  "mask-right",
-  "mask-subtract",
-  "mask-t-from-0",
-  "mask-t-from-0%",
-  "mask-t-from-0.5",
-  "mask-t-from-1",
-  "mask-t-from-1.5",
-  "mask-t-from-2",
-  "mask-t-from-2.5",
-  "mask-t-from-3",
-  "mask-t-from-3.5",
-  "mask-t-from-4",
-  "mask-t-from-5",
-  "mask-t-from-5%",
-  "mask-t-from-6",
-  "mask-t-from-7",
-  "mask-t-from-8",
-  "mask-t-from-9",
-  "mask-t-from-10",
-  "mask-t-from-10%",
-  "mask-t-from-11",
-  "mask-t-from-12",
-  "mask-t-from-14",
-  "mask-t-from-15%",
-  "mask-t-from-16",
-  "mask-t-from-20",
-  "mask-t-from-20%",
-  "mask-t-from-24",
-  "mask-t-from-25%",
-  "mask-t-from-28",
-  "mask-t-from-30%",
-  "mask-t-from-32",
-  "mask-t-from-35%",
-  "mask-t-from-36",
-  "mask-t-from-40",
-  "mask-t-from-40%",
-  "mask-t-from-44",
-  "mask-t-from-45%",
-  "mask-t-from-48",
-  "mask-t-from-50%",
-  "mask-t-from-52",
-  "mask-t-from-55%",
-  "mask-t-from-56",
-  "mask-t-from-60",
-  "mask-t-from-60%",
-  "mask-t-from-64",
-  "mask-t-from-65%",
-  "mask-t-from-70%",
-  "mask-t-from-72",
-  "mask-t-from-75%",
-  "mask-t-from-80",
-  "mask-t-from-80%",
-  "mask-t-from-85%",
-  "mask-t-from-90%",
-  "mask-t-from-95%",
-  "mask-t-from-96",
-  "mask-t-from-100%",
-  "mask-t-from-current",
-  "mask-t-from-current/0",
-  "mask-t-from-current/5",
-  "mask-t-from-current/10",
-  "mask-t-from-current/15",
-  "mask-t-from-current/20",
-  "mask-t-from-current/25",
-  "mask-t-from-current/30",
-  "mask-t-from-current/35",
-  "mask-t-from-current/40",
-  "mask-t-from-current/45",
-  "mask-t-from-current/50",
-  "mask-t-from-current/55",
-  "mask-t-from-current/60",
-  "mask-t-from-current/65",
-  "mask-t-from-current/70",
-  "mask-t-from-current/75",
-  "mask-t-from-current/80",
-  "mask-t-from-current/85",
-  "mask-t-from-current/90",
-  "mask-t-from-current/95",
-  "mask-t-from-current/100",
-  "mask-t-from-current/background",
-  "mask-t-from-inherit",
-  "mask-t-from-inherit/0",
-  "mask-t-from-inherit/5",
-  "mask-t-from-inherit/10",
-  "mask-t-from-inherit/15",
-  "mask-t-from-inherit/20",
-  "mask-t-from-inherit/25",
-  "mask-t-from-inherit/30",
-  "mask-t-from-inherit/35",
-  "mask-t-from-inherit/40",
-  "mask-t-from-inherit/45",
-  "mask-t-from-inherit/50",
-  "mask-t-from-inherit/55",
-  "mask-t-from-inherit/60",
-  "mask-t-from-inherit/65",
-  "mask-t-from-inherit/70",
-  "mask-t-from-inherit/75",
-  "mask-t-from-inherit/80",
-  "mask-t-from-inherit/85",
-  "mask-t-from-inherit/90",
-  "mask-t-from-inherit/95",
-  "mask-t-from-inherit/100",
-  "mask-t-from-inherit/background",
-  "mask-t-from-transparent",
-  "mask-t-from-transparent/0",
-  "mask-t-from-transparent/5",
-  "mask-t-from-transparent/10",
-  "mask-t-from-transparent/15",
-  "mask-t-from-transparent/20",
-  "mask-t-from-transparent/25",
-  "mask-t-from-transparent/30",
-  "mask-t-from-transparent/35",
-  "mask-t-from-transparent/40",
-  "mask-t-from-transparent/45",
-  "mask-t-from-transparent/50",
-  "mask-t-from-transparent/55",
-  "mask-t-from-transparent/60",
-  "mask-t-from-transparent/65",
-  "mask-t-from-transparent/70",
-  "mask-t-from-transparent/75",
-  "mask-t-from-transparent/80",
-  "mask-t-from-transparent/85",
-  "mask-t-from-transparent/90",
-  "mask-t-from-transparent/95",
-  "mask-t-from-transparent/100",
-  "mask-t-from-transparent/background",
-  "mask-t-to-0",
-  "mask-t-to-0%",
-  "mask-t-to-0.5",
-  "mask-t-to-1",
-  "mask-t-to-1.5",
-  "mask-t-to-2",
-  "mask-t-to-2.5",
-  "mask-t-to-3",
-  "mask-t-to-3.5",
-  "mask-t-to-4",
-  "mask-t-to-5",
-  "mask-t-to-5%",
-  "mask-t-to-6",
-  "mask-t-to-7",
-  "mask-t-to-8",
-  "mask-t-to-9",
-  "mask-t-to-10",
-  "mask-t-to-10%",
-  "mask-t-to-11",
-  "mask-t-to-12",
-  "mask-t-to-14",
-  "mask-t-to-15%",
-  "mask-t-to-16",
-  "mask-t-to-20",
-  "mask-t-to-20%",
-  "mask-t-to-24",
-  "mask-t-to-25%",
-  "mask-t-to-28",
-  "mask-t-to-30%",
-  "mask-t-to-32",
-  "mask-t-to-35%",
-  "mask-t-to-36",
-  "mask-t-to-40",
-  "mask-t-to-40%",
-  "mask-t-to-44",
-  "mask-t-to-45%",
-  "mask-t-to-48",
-  "mask-t-to-50%",
-  "mask-t-to-52",
-  "mask-t-to-55%",
-  "mask-t-to-56",
-  "mask-t-to-60",
-  "mask-t-to-60%",
-  "mask-t-to-64",
-  "mask-t-to-65%",
-  "mask-t-to-70%",
-  "mask-t-to-72",
-  "mask-t-to-75%",
-  "mask-t-to-80",
-  "mask-t-to-80%",
-  "mask-t-to-85%",
-  "mask-t-to-90%",
-  "mask-t-to-95%",
-  "mask-t-to-96",
-  "mask-t-to-100%",
-  "mask-t-to-current",
-  "mask-t-to-current/0",
-  "mask-t-to-current/5",
-  "mask-t-to-current/10",
-  "mask-t-to-current/15",
-  "mask-t-to-current/20",
-  "mask-t-to-current/25",
-  "mask-t-to-current/30",
-  "mask-t-to-current/35",
-  "mask-t-to-current/40",
-  "mask-t-to-current/45",
-  "mask-t-to-current/50",
-  "mask-t-to-current/55",
-  "mask-t-to-current/60",
-  "mask-t-to-current/65",
-  "mask-t-to-current/70",
-  "mask-t-to-current/75",
-  "mask-t-to-current/80",
-  "mask-t-to-current/85",
-  "mask-t-to-current/90",
-  "mask-t-to-current/95",
-  "mask-t-to-current/100",
-  "mask-t-to-current/background",
-  "mask-t-to-inherit",
-  "mask-t-to-inherit/0",
-  "mask-t-to-inherit/5",
-  "mask-t-to-inherit/10",
-  "mask-t-to-inherit/15",
-  "mask-t-to-inherit/20",
-  "mask-t-to-inherit/25",
-  "mask-t-to-inherit/30",
-  "mask-t-to-inherit/35",
-  "mask-t-to-inherit/40",
-  "mask-t-to-inherit/45",
-  "mask-t-to-inherit/50",
-  "mask-t-to-inherit/55",
-  "mask-t-to-inherit/60",
-  "mask-t-to-inherit/65",
-  "mask-t-to-inherit/70",
-  "mask-t-to-inherit/75",
-  "mask-t-to-inherit/80",
-  "mask-t-to-inherit/85",
-  "mask-t-to-inherit/90",
-  "mask-t-to-inherit/95",
-  "mask-t-to-inherit/100",
-  "mask-t-to-inherit/background",
-  "mask-t-to-transparent",
-  "mask-t-to-transparent/0",
-  "mask-t-to-transparent/5",
-  "mask-t-to-transparent/10",
-  "mask-t-to-transparent/15",
-  "mask-t-to-transparent/20",
-  "mask-t-to-transparent/25",
-  "mask-t-to-transparent/30",
-  "mask-t-to-transparent/35",
-  "mask-t-to-transparent/40",
-  "mask-t-to-transparent/45",
-  "mask-t-to-transparent/50",
-  "mask-t-to-transparent/55",
-  "mask-t-to-transparent/60",
-  "mask-t-to-transparent/65",
-  "mask-t-to-transparent/70",
-  "mask-t-to-transparent/75",
-  "mask-t-to-transparent/80",
-  "mask-t-to-transparent/85",
-  "mask-t-to-transparent/90",
-  "mask-t-to-transparent/95",
-  "mask-t-to-transparent/100",
-  "mask-t-to-transparent/background",
-  "mask-top",
-  "mask-top-left",
-  "mask-top-right",
-  "mask-type-alpha",
-  "mask-type-luminance",
-  "mask-x-from-0",
-  "mask-x-from-0%",
-  "mask-x-from-0.5",
-  "mask-x-from-1",
-  "mask-x-from-1.5",
-  "mask-x-from-2",
-  "mask-x-from-2.5",
-  "mask-x-from-3",
-  "mask-x-from-3.5",
-  "mask-x-from-4",
-  "mask-x-from-5",
-  "mask-x-from-5%",
-  "mask-x-from-6",
-  "mask-x-from-7",
-  "mask-x-from-8",
-  "mask-x-from-9",
-  "mask-x-from-10",
-  "mask-x-from-10%",
-  "mask-x-from-11",
-  "mask-x-from-12",
-  "mask-x-from-14",
-  "mask-x-from-15%",
-  "mask-x-from-16",
-  "mask-x-from-20",
-  "mask-x-from-20%",
-  "mask-x-from-24",
-  "mask-x-from-25%",
-  "mask-x-from-28",
-  "mask-x-from-30%",
-  "mask-x-from-32",
-  "mask-x-from-35%",
-  "mask-x-from-36",
-  "mask-x-from-40",
-  "mask-x-from-40%",
-  "mask-x-from-44",
-  "mask-x-from-45%",
-  "mask-x-from-48",
-  "mask-x-from-50%",
-  "mask-x-from-52",
-  "mask-x-from-55%",
-  "mask-x-from-56",
-  "mask-x-from-60",
-  "mask-x-from-60%",
-  "mask-x-from-64",
-  "mask-x-from-65%",
-  "mask-x-from-70%",
-  "mask-x-from-72",
-  "mask-x-from-75%",
-  "mask-x-from-80",
-  "mask-x-from-80%",
-  "mask-x-from-85%",
-  "mask-x-from-90%",
-  "mask-x-from-95%",
-  "mask-x-from-96",
-  "mask-x-from-100%",
-  "mask-x-from-current",
-  "mask-x-from-current/0",
-  "mask-x-from-current/5",
-  "mask-x-from-current/10",
-  "mask-x-from-current/15",
-  "mask-x-from-current/20",
-  "mask-x-from-current/25",
-  "mask-x-from-current/30",
-  "mask-x-from-current/35",
-  "mask-x-from-current/40",
-  "mask-x-from-current/45",
-  "mask-x-from-current/50",
-  "mask-x-from-current/55",
-  "mask-x-from-current/60",
-  "mask-x-from-current/65",
-  "mask-x-from-current/70",
-  "mask-x-from-current/75",
-  "mask-x-from-current/80",
-  "mask-x-from-current/85",
-  "mask-x-from-current/90",
-  "mask-x-from-current/95",
-  "mask-x-from-current/100",
-  "mask-x-from-current/background",
-  "mask-x-from-inherit",
-  "mask-x-from-inherit/0",
-  "mask-x-from-inherit/5",
-  "mask-x-from-inherit/10",
-  "mask-x-from-inherit/15",
-  "mask-x-from-inherit/20",
-  "mask-x-from-inherit/25",
-  "mask-x-from-inherit/30",
-  "mask-x-from-inherit/35",
-  "mask-x-from-inherit/40",
-  "mask-x-from-inherit/45",
-  "mask-x-from-inherit/50",
-  "mask-x-from-inherit/55",
-  "mask-x-from-inherit/60",
-  "mask-x-from-inherit/65",
-  "mask-x-from-inherit/70",
-  "mask-x-from-inherit/75",
-  "mask-x-from-inherit/80",
-  "mask-x-from-inherit/85",
-  "mask-x-from-inherit/90",
-  "mask-x-from-inherit/95",
-  "mask-x-from-inherit/100",
-  "mask-x-from-inherit/background",
-  "mask-x-from-transparent",
-  "mask-x-from-transparent/0",
-  "mask-x-from-transparent/5",
-  "mask-x-from-transparent/10",
-  "mask-x-from-transparent/15",
-  "mask-x-from-transparent/20",
-  "mask-x-from-transparent/25",
-  "mask-x-from-transparent/30",
-  "mask-x-from-transparent/35",
-  "mask-x-from-transparent/40",
-  "mask-x-from-transparent/45",
-  "mask-x-from-transparent/50",
-  "mask-x-from-transparent/55",
-  "mask-x-from-transparent/60",
-  "mask-x-from-transparent/65",
-  "mask-x-from-transparent/70",
-  "mask-x-from-transparent/75",
-  "mask-x-from-transparent/80",
-  "mask-x-from-transparent/85",
-  "mask-x-from-transparent/90",
-  "mask-x-from-transparent/95",
-  "mask-x-from-transparent/100",
-  "mask-x-from-transparent/background",
-  "mask-x-to-0",
-  "mask-x-to-0%",
-  "mask-x-to-0.5",
-  "mask-x-to-1",
-  "mask-x-to-1.5",
-  "mask-x-to-2",
-  "mask-x-to-2.5",
-  "mask-x-to-3",
-  "mask-x-to-3.5",
-  "mask-x-to-4",
-  "mask-x-to-5",
-  "mask-x-to-5%",
-  "mask-x-to-6",
-  "mask-x-to-7",
-  "mask-x-to-8",
-  "mask-x-to-9",
-  "mask-x-to-10",
-  "mask-x-to-10%",
-  "mask-x-to-11",
-  "mask-x-to-12",
-  "mask-x-to-14",
-  "mask-x-to-15%",
-  "mask-x-to-16",
-  "mask-x-to-20",
-  "mask-x-to-20%",
-  "mask-x-to-24",
-  "mask-x-to-25%",
-  "mask-x-to-28",
-  "mask-x-to-30%",
-  "mask-x-to-32",
-  "mask-x-to-35%",
-  "mask-x-to-36",
-  "mask-x-to-40",
-  "mask-x-to-40%",
-  "mask-x-to-44",
-  "mask-x-to-45%",
-  "mask-x-to-48",
-  "mask-x-to-50%",
-  "mask-x-to-52",
-  "mask-x-to-55%",
-  "mask-x-to-56",
-  "mask-x-to-60",
-  "mask-x-to-60%",
-  "mask-x-to-64",
-  "mask-x-to-65%",
-  "mask-x-to-70%",
-  "mask-x-to-72",
-  "mask-x-to-75%",
-  "mask-x-to-80",
-  "mask-x-to-80%",
-  "mask-x-to-85%",
-  "mask-x-to-90%",
-  "mask-x-to-95%",
-  "mask-x-to-96",
-  "mask-x-to-100%",
-  "mask-x-to-current",
-  "mask-x-to-current/0",
-  "mask-x-to-current/5",
-  "mask-x-to-current/10",
-  "mask-x-to-current/15",
-  "mask-x-to-current/20",
-  "mask-x-to-current/25",
-  "mask-x-to-current/30",
-  "mask-x-to-current/35",
-  "mask-x-to-current/40",
-  "mask-x-to-current/45",
-  "mask-x-to-current/50",
-  "mask-x-to-current/55",
-  "mask-x-to-current/60",
-  "mask-x-to-current/65",
-  "mask-x-to-current/70",
-  "mask-x-to-current/75",
-  "mask-x-to-current/80",
-  "mask-x-to-current/85",
-  "mask-x-to-current/90",
-  "mask-x-to-current/95",
-  "mask-x-to-current/100",
-  "mask-x-to-current/background",
-  "mask-x-to-inherit",
-  "mask-x-to-inherit/0",
-  "mask-x-to-inherit/5",
-  "mask-x-to-inherit/10",
-  "mask-x-to-inherit/15",
-  "mask-x-to-inherit/20",
-  "mask-x-to-inherit/25",
-  "mask-x-to-inherit/30",
-  "mask-x-to-inherit/35",
-  "mask-x-to-inherit/40",
-  "mask-x-to-inherit/45",
-  "mask-x-to-inherit/50",
-  "mask-x-to-inherit/55",
-  "mask-x-to-inherit/60",
-  "mask-x-to-inherit/65",
-  "mask-x-to-inherit/70",
-  "mask-x-to-inherit/75",
-  "mask-x-to-inherit/80",
-  "mask-x-to-inherit/85",
-  "mask-x-to-inherit/90",
-  "mask-x-to-inherit/95",
-  "mask-x-to-inherit/100",
-  "mask-x-to-inherit/background",
-  "mask-x-to-transparent",
-  "mask-x-to-transparent/0",
-  "mask-x-to-transparent/5",
-  "mask-x-to-transparent/10",
-  "mask-x-to-transparent/15",
-  "mask-x-to-transparent/20",
-  "mask-x-to-transparent/25",
-  "mask-x-to-transparent/30",
-  "mask-x-to-transparent/35",
-  "mask-x-to-transparent/40",
-  "mask-x-to-transparent/45",
-  "mask-x-to-transparent/50",
-  "mask-x-to-transparent/55",
-  "mask-x-to-transparent/60",
-  "mask-x-to-transparent/65",
-  "mask-x-to-transparent/70",
-  "mask-x-to-transparent/75",
-  "mask-x-to-transparent/80",
-  "mask-x-to-transparent/85",
-  "mask-x-to-transparent/90",
-  "mask-x-to-transparent/95",
-  "mask-x-to-transparent/100",
-  "mask-x-to-transparent/background",
-  "mask-y-from-0",
-  "mask-y-from-0%",
-  "mask-y-from-0.5",
-  "mask-y-from-1",
-  "mask-y-from-1.5",
-  "mask-y-from-2",
-  "mask-y-from-2.5",
-  "mask-y-from-3",
-  "mask-y-from-3.5",
-  "mask-y-from-4",
-  "mask-y-from-5",
-  "mask-y-from-5%",
-  "mask-y-from-6",
-  "mask-y-from-7",
-  "mask-y-from-8",
-  "mask-y-from-9",
-  "mask-y-from-10",
-  "mask-y-from-10%",
-  "mask-y-from-11",
-  "mask-y-from-12",
-  "mask-y-from-14",
-  "mask-y-from-15%",
-  "mask-y-from-16",
-  "mask-y-from-20",
-  "mask-y-from-20%",
-  "mask-y-from-24",
-  "mask-y-from-25%",
-  "mask-y-from-28",
-  "mask-y-from-30%",
-  "mask-y-from-32",
-  "mask-y-from-35%",
-  "mask-y-from-36",
-  "mask-y-from-40",
-  "mask-y-from-40%",
-  "mask-y-from-44",
-  "mask-y-from-45%",
-  "mask-y-from-48",
-  "mask-y-from-50%",
-  "mask-y-from-52",
-  "mask-y-from-55%",
-  "mask-y-from-56",
-  "mask-y-from-60",
-  "mask-y-from-60%",
-  "mask-y-from-64",
-  "mask-y-from-65%",
-  "mask-y-from-70%",
-  "mask-y-from-72",
-  "mask-y-from-75%",
-  "mask-y-from-80",
-  "mask-y-from-80%",
-  "mask-y-from-85%",
-  "mask-y-from-90%",
-  "mask-y-from-95%",
-  "mask-y-from-96",
-  "mask-y-from-100%",
-  "mask-y-from-current",
-  "mask-y-from-current/0",
-  "mask-y-from-current/5",
-  "mask-y-from-current/10",
-  "mask-y-from-current/15",
-  "mask-y-from-current/20",
-  "mask-y-from-current/25",
-  "mask-y-from-current/30",
-  "mask-y-from-current/35",
-  "mask-y-from-current/40",
-  "mask-y-from-current/45",
-  "mask-y-from-current/50",
-  "mask-y-from-current/55",
-  "mask-y-from-current/60",
-  "mask-y-from-current/65",
-  "mask-y-from-current/70",
-  "mask-y-from-current/75",
-  "mask-y-from-current/80",
-  "mask-y-from-current/85",
-  "mask-y-from-current/90",
-  "mask-y-from-current/95",
-  "mask-y-from-current/100",
-  "mask-y-from-current/background",
-  "mask-y-from-inherit",
-  "mask-y-from-inherit/0",
-  "mask-y-from-inherit/5",
-  "mask-y-from-inherit/10",
-  "mask-y-from-inherit/15",
-  "mask-y-from-inherit/20",
-  "mask-y-from-inherit/25",
-  "mask-y-from-inherit/30",
-  "mask-y-from-inherit/35",
-  "mask-y-from-inherit/40",
-  "mask-y-from-inherit/45",
-  "mask-y-from-inherit/50",
-  "mask-y-from-inherit/55",
-  "mask-y-from-inherit/60",
-  "mask-y-from-inherit/65",
-  "mask-y-from-inherit/70",
-  "mask-y-from-inherit/75",
-  "mask-y-from-inherit/80",
-  "mask-y-from-inherit/85",
-  "mask-y-from-inherit/90",
-  "mask-y-from-inherit/95",
-  "mask-y-from-inherit/100",
-  "mask-y-from-inherit/background",
-  "mask-y-from-transparent",
-  "mask-y-from-transparent/0",
-  "mask-y-from-transparent/5",
-  "mask-y-from-transparent/10",
-  "mask-y-from-transparent/15",
-  "mask-y-from-transparent/20",
-  "mask-y-from-transparent/25",
-  "mask-y-from-transparent/30",
-  "mask-y-from-transparent/35",
-  "mask-y-from-transparent/40",
-  "mask-y-from-transparent/45",
-  "mask-y-from-transparent/50",
-  "mask-y-from-transparent/55",
-  "mask-y-from-transparent/60",
-  "mask-y-from-transparent/65",
-  "mask-y-from-transparent/70",
-  "mask-y-from-transparent/75",
-  "mask-y-from-transparent/80",
-  "mask-y-from-transparent/85",
-  "mask-y-from-transparent/90",
-  "mask-y-from-transparent/95",
-  "mask-y-from-transparent/100",
-  "mask-y-from-transparent/background",
-  "mask-y-to-0",
-  "mask-y-to-0%",
-  "mask-y-to-0.5",
-  "mask-y-to-1",
-  "mask-y-to-1.5",
-  "mask-y-to-2",
-  "mask-y-to-2.5",
-  "mask-y-to-3",
-  "mask-y-to-3.5",
-  "mask-y-to-4",
-  "mask-y-to-5",
-  "mask-y-to-5%",
-  "mask-y-to-6",
-  "mask-y-to-7",
-  "mask-y-to-8",
-  "mask-y-to-9",
-  "mask-y-to-10",
-  "mask-y-to-10%",
-  "mask-y-to-11",
-  "mask-y-to-12",
-  "mask-y-to-14",
-  "mask-y-to-15%",
-  "mask-y-to-16",
-  "mask-y-to-20",
-  "mask-y-to-20%",
-  "mask-y-to-24",
-  "mask-y-to-25%",
-  "mask-y-to-28",
-  "mask-y-to-30%",
-  "mask-y-to-32",
-  "mask-y-to-35%",
-  "mask-y-to-36",
-  "mask-y-to-40",
-  "mask-y-to-40%",
-  "mask-y-to-44",
-  "mask-y-to-45%",
-  "mask-y-to-48",
-  "mask-y-to-50%",
-  "mask-y-to-52",
-  "mask-y-to-55%",
-  "mask-y-to-56",
-  "mask-y-to-60",
-  "mask-y-to-60%",
-  "mask-y-to-64",
-  "mask-y-to-65%",
-  "mask-y-to-70%",
-  "mask-y-to-72",
-  "mask-y-to-75%",
-  "mask-y-to-80",
-  "mask-y-to-80%",
-  "mask-y-to-85%",
-  "mask-y-to-90%",
-  "mask-y-to-95%",
-  "mask-y-to-96",
-  "mask-y-to-100%",
-  "mask-y-to-current",
-  "mask-y-to-current/0",
-  "mask-y-to-current/5",
-  "mask-y-to-current/10",
-  "mask-y-to-current/15",
-  "mask-y-to-current/20",
-  "mask-y-to-current/25",
-  "mask-y-to-current/30",
-  "mask-y-to-current/35",
-  "mask-y-to-current/40",
-  "mask-y-to-current/45",
-  "mask-y-to-current/50",
-  "mask-y-to-current/55",
-  "mask-y-to-current/60",
-  "mask-y-to-current/65",
-  "mask-y-to-current/70",
-  "mask-y-to-current/75",
-  "mask-y-to-current/80",
-  "mask-y-to-current/85",
-  "mask-y-to-current/90",
-  "mask-y-to-current/95",
-  "mask-y-to-current/100",
-  "mask-y-to-current/background",
-  "mask-y-to-inherit",
-  "mask-y-to-inherit/0",
-  "mask-y-to-inherit/5",
-  "mask-y-to-inherit/10",
-  "mask-y-to-inherit/15",
-  "mask-y-to-inherit/20",
-  "mask-y-to-inherit/25",
-  "mask-y-to-inherit/30",
-  "mask-y-to-inherit/35",
-  "mask-y-to-inherit/40",
-  "mask-y-to-inherit/45",
-  "mask-y-to-inherit/50",
-  "mask-y-to-inherit/55",
-  "mask-y-to-inherit/60",
-  "mask-y-to-inherit/65",
-  "mask-y-to-inherit/70",
-  "mask-y-to-inherit/75",
-  "mask-y-to-inherit/80",
-  "mask-y-to-inherit/85",
-  "mask-y-to-inherit/90",
-  "mask-y-to-inherit/95",
-  "mask-y-to-inherit/100",
-  "mask-y-to-inherit/background",
-  "mask-y-to-transparent",
-  "mask-y-to-transparent/0",
-  "mask-y-to-transparent/5",
-  "mask-y-to-transparent/10",
-  "mask-y-to-transparent/15",
-  "mask-y-to-transparent/20",
-  "mask-y-to-transparent/25",
-  "mask-y-to-transparent/30",
-  "mask-y-to-transparent/35",
-  "mask-y-to-transparent/40",
-  "mask-y-to-transparent/45",
-  "mask-y-to-transparent/50",
-  "mask-y-to-transparent/55",
-  "mask-y-to-transparent/60",
-  "mask-y-to-transparent/65",
-  "mask-y-to-transparent/70",
-  "mask-y-to-transparent/75",
-  "mask-y-to-transparent/80",
-  "mask-y-to-transparent/85",
-  "mask-y-to-transparent/90",
-  "mask-y-to-transparent/95",
-  "mask-y-to-transparent/100",
-  "mask-y-to-transparent/background",
-  "max-block-0",
-  "max-block-0.5",
-  "max-block-1",
-  "max-block-1.5",
-  "max-block-2",
-  "max-block-2.5",
-  "max-block-3",
-  "max-block-3.5",
-  "max-block-4",
-  "max-block-5",
-  "max-block-6",
-  "max-block-7",
-  "max-block-8",
-  "max-block-9",
-  "max-block-10",
-  "max-block-11",
-  "max-block-12",
-  "max-block-14",
-  "max-block-16",
-  "max-block-20",
-  "max-block-24",
-  "max-block-28",
-  "max-block-32",
-  "max-block-36",
-  "max-block-40",
-  "max-block-44",
-  "max-block-48",
-  "max-block-52",
-  "max-block-56",
-  "max-block-60",
-  "max-block-64",
-  "max-block-72",
-  "max-block-80",
-  "max-block-96",
-  "max-block-1/2",
-  "max-block-1/3",
-  "max-block-1/4",
-  "max-block-1/5",
-  "max-block-1/6",
-  "max-block-1/12",
-  "max-block-2/3",
-  "max-block-2/4",
-  "max-block-2/5",
-  "max-block-2/6",
-  "max-block-2/12",
-  "max-block-3/4",
-  "max-block-3/5",
-  "max-block-3/6",
-  "max-block-3/12",
-  "max-block-4/5",
-  "max-block-4/6",
-  "max-block-4/12",
-  "max-block-5/6",
-  "max-block-5/12",
-  "max-block-6/12",
-  "max-block-7/12",
-  "max-block-8/12",
-  "max-block-9/12",
-  "max-block-10/12",
-  "max-block-11/12",
-  "max-block-dvh",
-  "max-block-fit",
-  "max-block-full",
-  "max-block-lh",
-  "max-block-lvh",
-  "max-block-max",
-  "max-block-min",
-  "max-block-none",
-  "max-block-px",
-  "max-block-screen",
-  "max-block-svh",
   "max-h-0",
   "max-h-0.5",
   "max-h-1",
@@ -8480,7 +5125,6 @@ exports[`getClassList 1`] = `
   "max-h-dvw",
   "max-h-fit",
   "max-h-full",
-  "max-h-lh",
   "max-h-lvh",
   "max-h-lvw",
   "max-h-max",
@@ -8490,78 +5134,6 @@ exports[`getClassList 1`] = `
   "max-h-screen",
   "max-h-svh",
   "max-h-svw",
-  "max-inline-0",
-  "max-inline-0.5",
-  "max-inline-1",
-  "max-inline-1.5",
-  "max-inline-2",
-  "max-inline-2.5",
-  "max-inline-3",
-  "max-inline-3.5",
-  "max-inline-4",
-  "max-inline-5",
-  "max-inline-6",
-  "max-inline-7",
-  "max-inline-8",
-  "max-inline-9",
-  "max-inline-10",
-  "max-inline-11",
-  "max-inline-12",
-  "max-inline-14",
-  "max-inline-16",
-  "max-inline-20",
-  "max-inline-24",
-  "max-inline-28",
-  "max-inline-32",
-  "max-inline-36",
-  "max-inline-40",
-  "max-inline-44",
-  "max-inline-48",
-  "max-inline-52",
-  "max-inline-56",
-  "max-inline-60",
-  "max-inline-64",
-  "max-inline-72",
-  "max-inline-80",
-  "max-inline-96",
-  "max-inline-dvw",
-  "max-inline-fit",
-  "max-inline-full",
-  "max-inline-lg",
-  "max-inline-lvw",
-  "max-inline-max",
-  "max-inline-md",
-  "max-inline-1/2",
-  "max-inline-1/3",
-  "max-inline-1/4",
-  "max-inline-1/5",
-  "max-inline-1/6",
-  "max-inline-1/12",
-  "max-inline-2/3",
-  "max-inline-2/4",
-  "max-inline-2/5",
-  "max-inline-2/6",
-  "max-inline-2/12",
-  "max-inline-3/4",
-  "max-inline-3/5",
-  "max-inline-3/6",
-  "max-inline-3/12",
-  "max-inline-4/5",
-  "max-inline-4/6",
-  "max-inline-4/12",
-  "max-inline-5/6",
-  "max-inline-5/12",
-  "max-inline-6/12",
-  "max-inline-7/12",
-  "max-inline-8/12",
-  "max-inline-9/12",
-  "max-inline-10/12",
-  "max-inline-11/12",
-  "max-inline-min",
-  "max-inline-none",
-  "max-inline-px",
-  "max-inline-screen",
-  "max-inline-svw",
   "max-w-0",
   "max-w-0.5",
   "max-w-1",
@@ -8634,6 +5206,7 @@ exports[`getClassList 1`] = `
   "max-w-min",
   "max-w-none",
   "max-w-px",
+  "max-w-screen",
   "max-w-svh",
   "max-w-svw",
   "mb-0",
@@ -8672,78 +5245,6 @@ exports[`getClassList 1`] = `
   "mb-96",
   "mb-auto",
   "mb-px",
-  "mbe-0",
-  "mbe-0.5",
-  "mbe-1",
-  "mbe-1.5",
-  "mbe-2",
-  "mbe-2.5",
-  "mbe-3",
-  "mbe-3.5",
-  "mbe-4",
-  "mbe-5",
-  "mbe-6",
-  "mbe-7",
-  "mbe-8",
-  "mbe-9",
-  "mbe-10",
-  "mbe-11",
-  "mbe-12",
-  "mbe-14",
-  "mbe-16",
-  "mbe-20",
-  "mbe-24",
-  "mbe-28",
-  "mbe-32",
-  "mbe-36",
-  "mbe-40",
-  "mbe-44",
-  "mbe-48",
-  "mbe-52",
-  "mbe-56",
-  "mbe-60",
-  "mbe-64",
-  "mbe-72",
-  "mbe-80",
-  "mbe-96",
-  "mbe-auto",
-  "mbe-px",
-  "mbs-0",
-  "mbs-0.5",
-  "mbs-1",
-  "mbs-1.5",
-  "mbs-2",
-  "mbs-2.5",
-  "mbs-3",
-  "mbs-3.5",
-  "mbs-4",
-  "mbs-5",
-  "mbs-6",
-  "mbs-7",
-  "mbs-8",
-  "mbs-9",
-  "mbs-10",
-  "mbs-11",
-  "mbs-12",
-  "mbs-14",
-  "mbs-16",
-  "mbs-20",
-  "mbs-24",
-  "mbs-28",
-  "mbs-32",
-  "mbs-36",
-  "mbs-40",
-  "mbs-44",
-  "mbs-48",
-  "mbs-52",
-  "mbs-56",
-  "mbs-60",
-  "mbs-64",
-  "mbs-72",
-  "mbs-80",
-  "mbs-96",
-  "mbs-auto",
-  "mbs-px",
   "me-0",
   "me-0.5",
   "me-1",
@@ -8780,77 +5281,6 @@ exports[`getClassList 1`] = `
   "me-96",
   "me-auto",
   "me-px",
-  "min-block-0",
-  "min-block-0.5",
-  "min-block-1",
-  "min-block-1.5",
-  "min-block-2",
-  "min-block-2.5",
-  "min-block-3",
-  "min-block-3.5",
-  "min-block-4",
-  "min-block-5",
-  "min-block-6",
-  "min-block-7",
-  "min-block-8",
-  "min-block-9",
-  "min-block-10",
-  "min-block-11",
-  "min-block-12",
-  "min-block-14",
-  "min-block-16",
-  "min-block-20",
-  "min-block-24",
-  "min-block-28",
-  "min-block-32",
-  "min-block-36",
-  "min-block-40",
-  "min-block-44",
-  "min-block-48",
-  "min-block-52",
-  "min-block-56",
-  "min-block-60",
-  "min-block-64",
-  "min-block-72",
-  "min-block-80",
-  "min-block-96",
-  "min-block-1/2",
-  "min-block-1/3",
-  "min-block-1/4",
-  "min-block-1/5",
-  "min-block-1/6",
-  "min-block-1/12",
-  "min-block-2/3",
-  "min-block-2/4",
-  "min-block-2/5",
-  "min-block-2/6",
-  "min-block-2/12",
-  "min-block-3/4",
-  "min-block-3/5",
-  "min-block-3/6",
-  "min-block-3/12",
-  "min-block-4/5",
-  "min-block-4/6",
-  "min-block-4/12",
-  "min-block-5/6",
-  "min-block-5/12",
-  "min-block-6/12",
-  "min-block-7/12",
-  "min-block-8/12",
-  "min-block-9/12",
-  "min-block-10/12",
-  "min-block-11/12",
-  "min-block-auto",
-  "min-block-dvh",
-  "min-block-fit",
-  "min-block-full",
-  "min-block-lh",
-  "min-block-lvh",
-  "min-block-max",
-  "min-block-min",
-  "min-block-px",
-  "min-block-screen",
-  "min-block-svh",
   "min-h-0",
   "min-h-0.5",
   "min-h-1",
@@ -8916,7 +5346,6 @@ exports[`getClassList 1`] = `
   "min-h-dvw",
   "min-h-fit",
   "min-h-full",
-  "min-h-lh",
   "min-h-lvh",
   "min-h-lvw",
   "min-h-max",
@@ -8925,78 +5354,6 @@ exports[`getClassList 1`] = `
   "min-h-screen",
   "min-h-svh",
   "min-h-svw",
-  "min-inline-0",
-  "min-inline-0.5",
-  "min-inline-1",
-  "min-inline-1.5",
-  "min-inline-2",
-  "min-inline-2.5",
-  "min-inline-3",
-  "min-inline-3.5",
-  "min-inline-4",
-  "min-inline-5",
-  "min-inline-6",
-  "min-inline-7",
-  "min-inline-8",
-  "min-inline-9",
-  "min-inline-10",
-  "min-inline-11",
-  "min-inline-12",
-  "min-inline-14",
-  "min-inline-16",
-  "min-inline-20",
-  "min-inline-24",
-  "min-inline-28",
-  "min-inline-32",
-  "min-inline-36",
-  "min-inline-40",
-  "min-inline-44",
-  "min-inline-48",
-  "min-inline-52",
-  "min-inline-56",
-  "min-inline-60",
-  "min-inline-64",
-  "min-inline-72",
-  "min-inline-80",
-  "min-inline-96",
-  "min-inline-auto",
-  "min-inline-dvw",
-  "min-inline-fit",
-  "min-inline-full",
-  "min-inline-lg",
-  "min-inline-lvw",
-  "min-inline-max",
-  "min-inline-md",
-  "min-inline-1/2",
-  "min-inline-1/3",
-  "min-inline-1/4",
-  "min-inline-1/5",
-  "min-inline-1/6",
-  "min-inline-1/12",
-  "min-inline-2/3",
-  "min-inline-2/4",
-  "min-inline-2/5",
-  "min-inline-2/6",
-  "min-inline-2/12",
-  "min-inline-3/4",
-  "min-inline-3/5",
-  "min-inline-3/6",
-  "min-inline-3/12",
-  "min-inline-4/5",
-  "min-inline-4/6",
-  "min-inline-4/12",
-  "min-inline-5/6",
-  "min-inline-5/12",
-  "min-inline-6/12",
-  "min-inline-7/12",
-  "min-inline-8/12",
-  "min-inline-9/12",
-  "min-inline-10/12",
-  "min-inline-11/12",
-  "min-inline-min",
-  "min-inline-px",
-  "min-inline-screen",
-  "min-inline-svw",
   "min-w-0",
   "min-w-0.5",
   "min-w-1",
@@ -9312,19 +5669,19 @@ exports[`getClassList 1`] = `
   "not-italic",
   "not-sr-only",
   "object-bottom",
-  "object-bottom-left",
-  "object-bottom-right",
   "object-center",
   "object-contain",
   "object-cover",
   "object-fill",
   "object-left",
+  "object-left-bottom",
+  "object-left-top",
   "object-none",
   "object-right",
+  "object-right-bottom",
+  "object-right-top",
   "object-scale-down",
   "object-top",
-  "object-top-left",
-  "object-top-right",
   "oldstyle-nums",
   "opacity-0",
   "opacity-5",
@@ -9362,6 +5719,7 @@ exports[`getClassList 1`] = `
   "order-12",
   "order-first",
   "order-last",
+  "order-none",
   "ordinal",
   "origin-bottom",
   "origin-bottom-left",
@@ -9394,7 +5752,6 @@ exports[`getClassList 1`] = `
   "outline/90",
   "outline/95",
   "outline/100",
-  "outline/background",
   "outline-0",
   "outline-1",
   "outline-2",
@@ -9422,7 +5779,6 @@ exports[`getClassList 1`] = `
   "outline-current/90",
   "outline-current/95",
   "outline-current/100",
-  "outline-current/background",
   "outline-dashed",
   "outline-dotted",
   "outline-double",
@@ -9449,7 +5805,6 @@ exports[`getClassList 1`] = `
   "outline-inherit/90",
   "outline-inherit/95",
   "outline-inherit/100",
-  "outline-inherit/background",
   "outline-none",
   "outline-offset-0",
   "outline-offset-1",
@@ -9479,7 +5834,6 @@ exports[`getClassList 1`] = `
   "outline-transparent/90",
   "outline-transparent/95",
   "outline-transparent/100",
-  "outline-transparent/background",
   "overflow-auto",
   "overflow-clip",
   "overflow-hidden",
@@ -9575,76 +5929,6 @@ exports[`getClassList 1`] = `
   "pb-80",
   "pb-96",
   "pb-px",
-  "pbe-0",
-  "pbe-0.5",
-  "pbe-1",
-  "pbe-1.5",
-  "pbe-2",
-  "pbe-2.5",
-  "pbe-3",
-  "pbe-3.5",
-  "pbe-4",
-  "pbe-5",
-  "pbe-6",
-  "pbe-7",
-  "pbe-8",
-  "pbe-9",
-  "pbe-10",
-  "pbe-11",
-  "pbe-12",
-  "pbe-14",
-  "pbe-16",
-  "pbe-20",
-  "pbe-24",
-  "pbe-28",
-  "pbe-32",
-  "pbe-36",
-  "pbe-40",
-  "pbe-44",
-  "pbe-48",
-  "pbe-52",
-  "pbe-56",
-  "pbe-60",
-  "pbe-64",
-  "pbe-72",
-  "pbe-80",
-  "pbe-96",
-  "pbe-px",
-  "pbs-0",
-  "pbs-0.5",
-  "pbs-1",
-  "pbs-1.5",
-  "pbs-2",
-  "pbs-2.5",
-  "pbs-3",
-  "pbs-3.5",
-  "pbs-4",
-  "pbs-5",
-  "pbs-6",
-  "pbs-7",
-  "pbs-8",
-  "pbs-9",
-  "pbs-10",
-  "pbs-11",
-  "pbs-12",
-  "pbs-14",
-  "pbs-16",
-  "pbs-20",
-  "pbs-24",
-  "pbs-28",
-  "pbs-32",
-  "pbs-36",
-  "pbs-40",
-  "pbs-44",
-  "pbs-48",
-  "pbs-52",
-  "pbs-56",
-  "pbs-60",
-  "pbs-64",
-  "pbs-72",
-  "pbs-80",
-  "pbs-96",
-  "pbs-px",
   "pe-0",
   "pe-0.5",
   "pe-1",
@@ -9773,7 +6057,6 @@ exports[`getClassList 1`] = `
   "placeholder-current/90",
   "placeholder-current/95",
   "placeholder-current/100",
-  "placeholder-current/background",
   "placeholder-inherit",
   "placeholder-inherit/0",
   "placeholder-inherit/5",
@@ -9796,7 +6079,6 @@ exports[`getClassList 1`] = `
   "placeholder-inherit/90",
   "placeholder-inherit/95",
   "placeholder-inherit/100",
-  "placeholder-inherit/background",
   "placeholder-transparent",
   "placeholder-transparent/0",
   "placeholder-transparent/5",
@@ -9819,7 +6101,6 @@ exports[`getClassList 1`] = `
   "placeholder-transparent/90",
   "placeholder-transparent/95",
   "placeholder-transparent/100",
-  "placeholder-transparent/background",
   "pointer-events-auto",
   "pointer-events-none",
   "pr-0",
@@ -10094,7 +6375,6 @@ exports[`getClassList 1`] = `
   "ring-current/90",
   "ring-current/95",
   "ring-current/100",
-  "ring-current/background",
   "ring-inherit",
   "ring-inherit/0",
   "ring-inherit/5",
@@ -10117,7 +6397,6 @@ exports[`getClassList 1`] = `
   "ring-inherit/90",
   "ring-inherit/95",
   "ring-inherit/100",
-  "ring-inherit/background",
   "ring-inset",
   "ring-offset-0",
   "ring-offset-1",
@@ -10146,7 +6425,6 @@ exports[`getClassList 1`] = `
   "ring-offset-current/90",
   "ring-offset-current/95",
   "ring-offset-current/100",
-  "ring-offset-current/background",
   "ring-offset-inherit",
   "ring-offset-inherit/0",
   "ring-offset-inherit/5",
@@ -10169,7 +6447,6 @@ exports[`getClassList 1`] = `
   "ring-offset-inherit/90",
   "ring-offset-inherit/95",
   "ring-offset-inherit/100",
-  "ring-offset-inherit/background",
   "ring-offset-transparent",
   "ring-offset-transparent/0",
   "ring-offset-transparent/5",
@@ -10192,7 +6469,6 @@ exports[`getClassList 1`] = `
   "ring-offset-transparent/90",
   "ring-offset-transparent/95",
   "ring-offset-transparent/100",
-  "ring-offset-transparent/background",
   "ring-transparent",
   "ring-transparent/0",
   "ring-transparent/5",
@@ -10215,7 +6491,6 @@ exports[`getClassList 1`] = `
   "ring-transparent/90",
   "ring-transparent/95",
   "ring-transparent/100",
-  "ring-transparent/background",
   "rotate-0",
   "rotate-1",
   "rotate-2",
@@ -10453,76 +6728,6 @@ exports[`getClassList 1`] = `
   "scroll-mb-80",
   "scroll-mb-96",
   "scroll-mb-px",
-  "scroll-mbe-0",
-  "scroll-mbe-0.5",
-  "scroll-mbe-1",
-  "scroll-mbe-1.5",
-  "scroll-mbe-2",
-  "scroll-mbe-2.5",
-  "scroll-mbe-3",
-  "scroll-mbe-3.5",
-  "scroll-mbe-4",
-  "scroll-mbe-5",
-  "scroll-mbe-6",
-  "scroll-mbe-7",
-  "scroll-mbe-8",
-  "scroll-mbe-9",
-  "scroll-mbe-10",
-  "scroll-mbe-11",
-  "scroll-mbe-12",
-  "scroll-mbe-14",
-  "scroll-mbe-16",
-  "scroll-mbe-20",
-  "scroll-mbe-24",
-  "scroll-mbe-28",
-  "scroll-mbe-32",
-  "scroll-mbe-36",
-  "scroll-mbe-40",
-  "scroll-mbe-44",
-  "scroll-mbe-48",
-  "scroll-mbe-52",
-  "scroll-mbe-56",
-  "scroll-mbe-60",
-  "scroll-mbe-64",
-  "scroll-mbe-72",
-  "scroll-mbe-80",
-  "scroll-mbe-96",
-  "scroll-mbe-px",
-  "scroll-mbs-0",
-  "scroll-mbs-0.5",
-  "scroll-mbs-1",
-  "scroll-mbs-1.5",
-  "scroll-mbs-2",
-  "scroll-mbs-2.5",
-  "scroll-mbs-3",
-  "scroll-mbs-3.5",
-  "scroll-mbs-4",
-  "scroll-mbs-5",
-  "scroll-mbs-6",
-  "scroll-mbs-7",
-  "scroll-mbs-8",
-  "scroll-mbs-9",
-  "scroll-mbs-10",
-  "scroll-mbs-11",
-  "scroll-mbs-12",
-  "scroll-mbs-14",
-  "scroll-mbs-16",
-  "scroll-mbs-20",
-  "scroll-mbs-24",
-  "scroll-mbs-28",
-  "scroll-mbs-32",
-  "scroll-mbs-36",
-  "scroll-mbs-40",
-  "scroll-mbs-44",
-  "scroll-mbs-48",
-  "scroll-mbs-52",
-  "scroll-mbs-56",
-  "scroll-mbs-60",
-  "scroll-mbs-64",
-  "scroll-mbs-72",
-  "scroll-mbs-80",
-  "scroll-mbs-96",
-  "scroll-mbs-px",
   "scroll-me-0",
   "scroll-me-0.5",
   "scroll-me-1",
@@ -10838,76 +7043,6 @@ exports[`getClassList 1`] = `
   "scroll-pb-80",
   "scroll-pb-96",
   "scroll-pb-px",
-  "scroll-pbe-0",
-  "scroll-pbe-0.5",
-  "scroll-pbe-1",
-  "scroll-pbe-1.5",
-  "scroll-pbe-2",
-  "scroll-pbe-2.5",
-  "scroll-pbe-3",
-  "scroll-pbe-3.5",
-  "scroll-pbe-4",
-  "scroll-pbe-5",
-  "scroll-pbe-6",
-  "scroll-pbe-7",
-  "scroll-pbe-8",
-  "scroll-pbe-9",
-  "scroll-pbe-10",
-  "scroll-pbe-11",
-  "scroll-pbe-12",
-  "scroll-pbe-14",
-  "scroll-pbe-16",
-  "scroll-pbe-20",
-  "scroll-pbe-24",
-  "scroll-pbe-28",
-  "scroll-pbe-32",
-  "scroll-pbe-36",
-  "scroll-pbe-40",
-  "scroll-pbe-44",
-  "scroll-pbe-48",
-  "scroll-pbe-52",
-  "scroll-pbe-56",
-  "scroll-pbe-60",
-  "scroll-pbe-64",
-  "scroll-pbe-72",
-  "scroll-pbe-80",
-  "scroll-pbe-96",
-  "scroll-pbe-px",
-  "scroll-pbs-0",
-  "scroll-pbs-0.5",
-  "scroll-pbs-1",
-  "scroll-pbs-1.5",
-  "scroll-pbs-2",
-  "scroll-pbs-2.5",
-  "scroll-pbs-3",
-  "scroll-pbs-3.5",
-  "scroll-pbs-4",
-  "scroll-pbs-5",
-  "scroll-pbs-6",
-  "scroll-pbs-7",
-  "scroll-pbs-8",
-  "scroll-pbs-9",
-  "scroll-pbs-10",
-  "scroll-pbs-11",
-  "scroll-pbs-12",
-  "scroll-pbs-14",
-  "scroll-pbs-16",
-  "scroll-pbs-20",
-  "scroll-pbs-24",
-  "scroll-pbs-28",
-  "scroll-pbs-32",
-  "scroll-pbs-36",
-  "scroll-pbs-40",
-  "scroll-pbs-44",
-  "scroll-pbs-48",
-  "scroll-pbs-52",
-  "scroll-pbs-56",
-  "scroll-pbs-60",
-  "scroll-pbs-64",
-  "scroll-pbs-72",
-  "scroll-pbs-80",
-  "scroll-pbs-96",
-  "scroll-pbs-px",
   "scroll-pe-0",
   "scroll-pe-0.5",
   "scroll-pe-1",
@@ -11154,157 +7289,12 @@ exports[`getClassList 1`] = `
   "scroll-py-96",
   "scroll-py-px",
   "scroll-smooth",
-  "scrollbar-auto",
-  "scrollbar-gutter-auto",
-  "scrollbar-gutter-both",
-  "scrollbar-gutter-stable",
-  "scrollbar-none",
-  "scrollbar-thin",
-  "scrollbar-thumb-current",
-  "scrollbar-thumb-current/0",
-  "scrollbar-thumb-current/5",
-  "scrollbar-thumb-current/10",
-  "scrollbar-thumb-current/15",
-  "scrollbar-thumb-current/20",
-  "scrollbar-thumb-current/25",
-  "scrollbar-thumb-current/30",
-  "scrollbar-thumb-current/35",
-  "scrollbar-thumb-current/40",
-  "scrollbar-thumb-current/45",
-  "scrollbar-thumb-current/50",
-  "scrollbar-thumb-current/55",
-  "scrollbar-thumb-current/60",
-  "scrollbar-thumb-current/65",
-  "scrollbar-thumb-current/70",
-  "scrollbar-thumb-current/75",
-  "scrollbar-thumb-current/80",
-  "scrollbar-thumb-current/85",
-  "scrollbar-thumb-current/90",
-  "scrollbar-thumb-current/95",
-  "scrollbar-thumb-current/100",
-  "scrollbar-thumb-current/background",
-  "scrollbar-thumb-inherit",
-  "scrollbar-thumb-inherit/0",
-  "scrollbar-thumb-inherit/5",
-  "scrollbar-thumb-inherit/10",
-  "scrollbar-thumb-inherit/15",
-  "scrollbar-thumb-inherit/20",
-  "scrollbar-thumb-inherit/25",
-  "scrollbar-thumb-inherit/30",
-  "scrollbar-thumb-inherit/35",
-  "scrollbar-thumb-inherit/40",
-  "scrollbar-thumb-inherit/45",
-  "scrollbar-thumb-inherit/50",
-  "scrollbar-thumb-inherit/55",
-  "scrollbar-thumb-inherit/60",
-  "scrollbar-thumb-inherit/65",
-  "scrollbar-thumb-inherit/70",
-  "scrollbar-thumb-inherit/75",
-  "scrollbar-thumb-inherit/80",
-  "scrollbar-thumb-inherit/85",
-  "scrollbar-thumb-inherit/90",
-  "scrollbar-thumb-inherit/95",
-  "scrollbar-thumb-inherit/100",
-  "scrollbar-thumb-inherit/background",
-  "scrollbar-thumb-transparent",
-  "scrollbar-thumb-transparent/0",
-  "scrollbar-thumb-transparent/5",
-  "scrollbar-thumb-transparent/10",
-  "scrollbar-thumb-transparent/15",
-  "scrollbar-thumb-transparent/20",
-  "scrollbar-thumb-transparent/25",
-  "scrollbar-thumb-transparent/30",
-  "scrollbar-thumb-transparent/35",
-  "scrollbar-thumb-transparent/40",
-  "scrollbar-thumb-transparent/45",
-  "scrollbar-thumb-transparent/50",
-  "scrollbar-thumb-transparent/55",
-  "scrollbar-thumb-transparent/60",
-  "scrollbar-thumb-transparent/65",
-  "scrollbar-thumb-transparent/70",
-  "scrollbar-thumb-transparent/75",
-  "scrollbar-thumb-transparent/80",
-  "scrollbar-thumb-transparent/85",
-  "scrollbar-thumb-transparent/90",
-  "scrollbar-thumb-transparent/95",
-  "scrollbar-thumb-transparent/100",
-  "scrollbar-thumb-transparent/background",
-  "scrollbar-track-current",
-  "scrollbar-track-current/0",
-  "scrollbar-track-current/5",
-  "scrollbar-track-current/10",
-  "scrollbar-track-current/15",
-  "scrollbar-track-current/20",
-  "scrollbar-track-current/25",
-  "scrollbar-track-current/30",
-  "scrollbar-track-current/35",
-  "scrollbar-track-current/40",
-  "scrollbar-track-current/45",
-  "scrollbar-track-current/50",
-  "scrollbar-track-current/55",
-  "scrollbar-track-current/60",
-  "scrollbar-track-current/65",
-  "scrollbar-track-current/70",
-  "scrollbar-track-current/75",
-  "scrollbar-track-current/80",
-  "scrollbar-track-current/85",
-  "scrollbar-track-current/90",
-  "scrollbar-track-current/95",
-  "scrollbar-track-current/100",
-  "scrollbar-track-current/background",
-  "scrollbar-track-inherit",
-  "scrollbar-track-inherit/0",
-  "scrollbar-track-inherit/5",
-  "scrollbar-track-inherit/10",
-  "scrollbar-track-inherit/15",
-  "scrollbar-track-inherit/20",
-  "scrollbar-track-inherit/25",
-  "scrollbar-track-inherit/30",
-  "scrollbar-track-inherit/35",
-  "scrollbar-track-inherit/40",
-  "scrollbar-track-inherit/45",
-  "scrollbar-track-inherit/50",
-  "scrollbar-track-inherit/55",
-  "scrollbar-track-inherit/60",
-  "scrollbar-track-inherit/65",
-  "scrollbar-track-inherit/70",
-  "scrollbar-track-inherit/75",
-  "scrollbar-track-inherit/80",
-  "scrollbar-track-inherit/85",
-  "scrollbar-track-inherit/90",
-  "scrollbar-track-inherit/95",
-  "scrollbar-track-inherit/100",
-  "scrollbar-track-inherit/background",
-  "scrollbar-track-transparent",
-  "scrollbar-track-transparent/0",
-  "scrollbar-track-transparent/5",
-  "scrollbar-track-transparent/10",
-  "scrollbar-track-transparent/15",
-  "scrollbar-track-transparent/20",
-  "scrollbar-track-transparent/25",
-  "scrollbar-track-transparent/30",
-  "scrollbar-track-transparent/35",
-  "scrollbar-track-transparent/40",
-  "scrollbar-track-transparent/45",
-  "scrollbar-track-transparent/50",
-  "scrollbar-track-transparent/55",
-  "scrollbar-track-transparent/60",
-  "scrollbar-track-transparent/65",
-  "scrollbar-track-transparent/70",
-  "scrollbar-track-transparent/75",
-  "scrollbar-track-transparent/80",
-  "scrollbar-track-transparent/85",
-  "scrollbar-track-transparent/90",
-  "scrollbar-track-transparent/95",
-  "scrollbar-track-transparent/100",
-  "scrollbar-track-transparent/background",
   "select-all",
   "select-auto",
   "select-none",
   "select-text",
   "self-auto",
   "self-baseline",
-  "self-baseline-last",
   "self-center",
   "self-center-safe",
   "self-end",
@@ -11315,6 +7305,7 @@ exports[`getClassList 1`] = `
   "sepia-0",
   "sepia-50",
   "sepia-100",
+  "shadow",
   "shadow-current",
   "shadow-current/0",
   "shadow-current/5",
@@ -11337,7 +7328,6 @@ exports[`getClassList 1`] = `
   "shadow-current/90",
   "shadow-current/95",
   "shadow-current/100",
-  "shadow-current/background",
   "shadow-inherit",
   "shadow-inherit/0",
   "shadow-inherit/5",
@@ -11360,7 +7350,6 @@ exports[`getClassList 1`] = `
   "shadow-inherit/90",
   "shadow-inherit/95",
   "shadow-inherit/100",
-  "shadow-inherit/background",
   "shadow-initial",
   "shadow-none",
   "shadow-transparent",
@@ -11385,7 +7374,6 @@ exports[`getClassList 1`] = `
   "shadow-transparent/90",
   "shadow-transparent/95",
   "shadow-transparent/100",
-  "shadow-transparent/background",
   "shrink",
   "shrink-0",
   "size-0",
@@ -11565,6 +7553,66 @@ exports[`getClassList 1`] = `
   "space-y-reverse",
   "sr-only",
   "stacked-fractions",
+  "start-0",
+  "start-0.5",
+  "start-1",
+  "start-1.5",
+  "start-2",
+  "start-2.5",
+  "start-3",
+  "start-3.5",
+  "start-4",
+  "start-5",
+  "start-6",
+  "start-7",
+  "start-8",
+  "start-9",
+  "start-10",
+  "start-11",
+  "start-12",
+  "start-14",
+  "start-16",
+  "start-20",
+  "start-24",
+  "start-28",
+  "start-32",
+  "start-36",
+  "start-40",
+  "start-44",
+  "start-48",
+  "start-52",
+  "start-56",
+  "start-60",
+  "start-64",
+  "start-72",
+  "start-80",
+  "start-96",
+  "start-1/2",
+  "start-1/3",
+  "start-1/4",
+  "start-1/5",
+  "start-1/6",
+  "start-1/12",
+  "start-2/3",
+  "start-2/4",
+  "start-2/5",
+  "start-2/6",
+  "start-2/12",
+  "start-3/4",
+  "start-3/5",
+  "start-3/6",
+  "start-3/12",
+  "start-4/5",
+  "start-4/6",
+  "start-4/12",
+  "start-5/6",
+  "start-5/12",
+  "start-6/12",
+  "start-7/12",
+  "start-8/12",
+  "start-9/12",
+  "start-10/12",
+  "start-11/12",
   "start-auto",
   "start-full",
   "start-px",
@@ -11596,7 +7644,6 @@ exports[`getClassList 1`] = `
   "stroke-current/90",
   "stroke-current/95",
   "stroke-current/100",
-  "stroke-current/background",
   "stroke-inherit",
   "stroke-inherit/0",
   "stroke-inherit/5",
@@ -11619,7 +7666,6 @@ exports[`getClassList 1`] = `
   "stroke-inherit/90",
   "stroke-inherit/95",
   "stroke-inherit/100",
-  "stroke-inherit/background",
   "stroke-none",
   "stroke-transparent",
   "stroke-transparent/0",
@@ -11643,11 +7689,7 @@ exports[`getClassList 1`] = `
   "stroke-transparent/90",
   "stroke-transparent/95",
   "stroke-transparent/100",
-  "stroke-transparent/background",
   "subpixel-antialiased",
-  "tab-2",
-  "tab-4",
-  "tab-8",
   "table",
   "table-auto",
   "table-caption",
@@ -11685,7 +7727,6 @@ exports[`getClassList 1`] = `
   "text-current/90",
   "text-current/95",
   "text-current/100",
-  "text-current/background",
   "text-ellipsis",
   "text-end",
   "text-inherit",
@@ -11710,83 +7751,11 @@ exports[`getClassList 1`] = `
   "text-inherit/90",
   "text-inherit/95",
   "text-inherit/100",
-  "text-inherit/background",
   "text-justify",
   "text-left",
   "text-nowrap",
   "text-pretty",
   "text-right",
-  "text-shadow-current",
-  "text-shadow-current/0",
-  "text-shadow-current/5",
-  "text-shadow-current/10",
-  "text-shadow-current/15",
-  "text-shadow-current/20",
-  "text-shadow-current/25",
-  "text-shadow-current/30",
-  "text-shadow-current/35",
-  "text-shadow-current/40",
-  "text-shadow-current/45",
-  "text-shadow-current/50",
-  "text-shadow-current/55",
-  "text-shadow-current/60",
-  "text-shadow-current/65",
-  "text-shadow-current/70",
-  "text-shadow-current/75",
-  "text-shadow-current/80",
-  "text-shadow-current/85",
-  "text-shadow-current/90",
-  "text-shadow-current/95",
-  "text-shadow-current/100",
-  "text-shadow-current/background",
-  "text-shadow-inherit",
-  "text-shadow-inherit/0",
-  "text-shadow-inherit/5",
-  "text-shadow-inherit/10",
-  "text-shadow-inherit/15",
-  "text-shadow-inherit/20",
-  "text-shadow-inherit/25",
-  "text-shadow-inherit/30",
-  "text-shadow-inherit/35",
-  "text-shadow-inherit/40",
-  "text-shadow-inherit/45",
-  "text-shadow-inherit/50",
-  "text-shadow-inherit/55",
-  "text-shadow-inherit/60",
-  "text-shadow-inherit/65",
-  "text-shadow-inherit/70",
-  "text-shadow-inherit/75",
-  "text-shadow-inherit/80",
-  "text-shadow-inherit/85",
-  "text-shadow-inherit/90",
-  "text-shadow-inherit/95",
-  "text-shadow-inherit/100",
-  "text-shadow-inherit/background",
-  "text-shadow-initial",
-  "text-shadow-none",
-  "text-shadow-transparent",
-  "text-shadow-transparent/0",
-  "text-shadow-transparent/5",
-  "text-shadow-transparent/10",
-  "text-shadow-transparent/15",
-  "text-shadow-transparent/20",
-  "text-shadow-transparent/25",
-  "text-shadow-transparent/30",
-  "text-shadow-transparent/35",
-  "text-shadow-transparent/40",
-  "text-shadow-transparent/45",
-  "text-shadow-transparent/50",
-  "text-shadow-transparent/55",
-  "text-shadow-transparent/60",
-  "text-shadow-transparent/65",
-  "text-shadow-transparent/70",
-  "text-shadow-transparent/75",
-  "text-shadow-transparent/80",
-  "text-shadow-transparent/85",
-  "text-shadow-transparent/90",
-  "text-shadow-transparent/95",
-  "text-shadow-transparent/100",
-  "text-shadow-transparent/background",
   "text-start",
   "text-transparent",
   "text-transparent/0",
@@ -11810,7 +7779,6 @@ exports[`getClassList 1`] = `
   "text-transparent/90",
   "text-transparent/95",
   "text-transparent/100",
-  "text-transparent/background",
   "text-wrap",
   "text-xs",
   "to-0%",
@@ -11856,7 +7824,6 @@ exports[`getClassList 1`] = `
   "to-current/90",
   "to-current/95",
   "to-current/100",
-  "to-current/background",
   "to-inherit",
   "to-inherit/0",
   "to-inherit/5",
@@ -11879,7 +7846,6 @@ exports[`getClassList 1`] = `
   "to-inherit/90",
   "to-inherit/95",
   "to-inherit/100",
-  "to-inherit/background",
   "to-transparent",
   "to-transparent/0",
   "to-transparent/5",
@@ -11902,7 +7868,6 @@ exports[`getClassList 1`] = `
   "to-transparent/90",
   "to-transparent/95",
   "to-transparent/100",
-  "to-transparent/background",
   "top-0",
   "top-0.5",
   "top-1",
@@ -12271,7 +8236,6 @@ exports[`getClassList 1`] = `
   "via-current/90",
   "via-current/95",
   "via-current/100",
-  "via-current/background",
   "via-inherit",
   "via-inherit/0",
   "via-inherit/5",
@@ -12294,7 +8258,6 @@ exports[`getClassList 1`] = `
   "via-inherit/90",
   "via-inherit/95",
   "via-inherit/100",
-  "via-inherit/background",
   "via-none",
   "via-transparent",
   "via-transparent/0",
@@ -12318,7 +8281,6 @@ exports[`getClassList 1`] = `
   "via-transparent/90",
   "via-transparent/95",
   "via-transparent/100",
-  "via-transparent/background",
   "visible",
   "w-0",
   "w-0.5",
@@ -12415,16 +8377,6 @@ exports[`getClassList 1`] = `
   "z-40",
   "z-50",
   "z-auto",
-  "zoom-50",
-  "zoom-75",
-  "zoom-90",
-  "zoom-95",
-  "zoom-100",
-  "zoom-105",
-  "zoom-110",
-  "zoom-125",
-  "zoom-150",
-  "zoom-200",
 ]
 `;
 
@@ -12520,7 +8472,9 @@ exports[`getVariants 1`] = `
       "any-pointer-none",
       "any-pointer-coarse",
       "any-pointer-fine",
-      "noscript",
+      "scripting-initial",
+      "scripting-none",
+      "scripting",
     ],
   },
   {
@@ -13301,7 +9255,21 @@ exports[`getVariants 1`] = `
   {
     "hasDash": true,
     "isArbitrary": false,
-    "name": "noscript",
+    "name": "scripting-initial",
+    "selectors": [Function],
+    "values": [],
+  },
+  {
+    "hasDash": true,
+    "isArbitrary": false,
+    "name": "scripting-none",
+    "selectors": [Function],
+    "values": [],
+  },
+  {
+    "hasDash": true,
+    "isArbitrary": false,
+    "name": "scripting",
     "selectors": [Function],
     "values": [],
   },
diff --git a/packages/tailwindcss/src/__snapshots__/utilities.test.ts.snap b/packages/tailwindcss/src/__snapshots__/utilities.test.ts.snap
index 43e8fdf6f..5f1c2fea3 100644
--- a/packages/tailwindcss/src/__snapshots__/utilities.test.ts.snap
+++ b/packages/tailwindcss/src/__snapshots__/utilities.test.ts.snap
@@ -1,18 +1,8 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
 exports[`border-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border {
@@ -90,41 +80,31 @@ exports[`border-* 1`] = `
 }
 
 .border-\\[\\#0088cc\\]\\/50 {
-  border-color: oklab(59.9824% -.067 -.124 / .5);
+  border-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-\\[color\\:var\\(--my-color\\)\\], .border-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-\\[color\\:var\\(--my-color\\)\\] {
   border-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-\\[var\\(--my-color\\)\\], .border-\\[var\\(--my-color\\)\\]\\/50 {
+.border-\\[var\\(--my-color\\)\\] {
   border-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-\\[var\\(--my-color\\)\\]\\/50 {
-    border-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-\\[var\\(--my-color\\)\\]\\/50 {
+  border-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-blue-500 {
-  border-color: var(--border-color-blue-500);
-}
-
-.border-current, .border-current\\/50 {
+.border-current {
   border-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-current\\/50 {
-    border-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-current\\/50 {
+  border-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-inherit {
@@ -136,43 +116,19 @@ exports[`border-* 1`] = `
 }
 
 .border-red-500\\/2\\.5 {
-  border-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-red-500\\/2\\.5 {
-    border-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-red-500\\/2\\.25 {
-  border-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-red-500\\/2\\.25 {
-    border-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-red-500\\/2\\.75 {
-  border-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-red-500\\/2\\.75 {
-    border-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-red-500\\/50 {
-  border-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-red-500\\/50 {
-    border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-transparent {
@@ -183,23 +139,12 @@ exports[`border-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-b-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-b {
@@ -277,41 +222,31 @@ exports[`border-b-* 1`] = `
 }
 
 .border-b-\\[\\#0088cc\\]\\/50 {
-  border-bottom-color: oklab(59.9824% -.067 -.124 / .5);
+  border-bottom-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-b-\\[color\\:var\\(--my-color\\)\\], .border-b-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-b-\\[color\\:var\\(--my-color\\)\\] {
   border-bottom-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-bottom-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-b-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-bottom-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-b-\\[var\\(--my-color\\)\\], .border-b-\\[var\\(--my-color\\)\\]\\/50 {
+.border-b-\\[var\\(--my-color\\)\\] {
   border-bottom-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-\\[var\\(--my-color\\)\\]\\/50 {
-    border-bottom-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-b-\\[var\\(--my-color\\)\\]\\/50 {
+  border-bottom-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-b-blue-500 {
-  border-bottom-color: var(--border-color-blue-500);
-}
-
-.border-b-current, .border-b-current\\/50 {
+.border-b-current {
   border-bottom-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-current\\/50 {
-    border-bottom-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-b-current\\/50 {
+  border-bottom-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-b-inherit {
@@ -323,43 +258,19 @@ exports[`border-b-* 1`] = `
 }
 
 .border-b-red-500\\/2\\.5 {
-  border-bottom-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-red-500\\/2\\.5 {
-    border-bottom-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-bottom-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-b-red-500\\/2\\.25 {
-  border-bottom-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-red-500\\/2\\.25 {
-    border-bottom-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-bottom-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-b-red-500\\/2\\.75 {
-  border-bottom-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-red-500\\/2\\.75 {
-    border-bottom-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-bottom-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-b-red-500\\/50 {
-  border-bottom-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-b-red-500\\/50 {
-    border-bottom-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-bottom-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-b-transparent {
@@ -370,397 +281,12 @@ exports[`border-b-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
-`;
-
-exports[`border-be-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
-  --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
-}
-
-.border-be {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 1px;
-}
-
-.border-be-0 {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 0;
-}
-
-.border-be-2 {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 2px;
-}
-
-.border-be-4 {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 4px;
-}
-
-.border-be-123 {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 123px;
-}
-
-.border-be-\\[0_1\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 0 1;
-}
-
-.border-be-\\[0_2px_0_2px\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 0 2px 0 2px;
-}
-
-.border-be-\\[12px\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 12px;
-}
-
-.border-be-\\[12px_8px\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: 12px 8px;
-}
-
-.border-be-\\[length\\:var\\(--my-width\\)\\], .border-be-\\[line-width\\:var\\(--my-width\\)\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: var(--my-width);
-}
-
-.border-be-\\[medium\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: medium;
-}
-
-.border-be-\\[thick\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: thick;
-}
-
-.border-be-\\[thin\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: thin;
-}
-
-.border-be-\\[thin_2px\\] {
-  border-block-end-style: var(--tw-border-style);
-  border-block-end-width: thin 2px;
-}
-
-.border-be-\\[\\#0088cc\\] {
-  border-block-end-color: #08c;
-}
-
-.border-be-\\[\\#0088cc\\]\\/50 {
-  border-block-end-color: oklab(59.9824% -.067 -.124 / .5);
-}
-
-.border-be-\\[color\\:var\\(--my-color\\)\\], .border-be-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-  border-block-end-color: var(--my-color);
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-block-end-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
-}
-
-.border-be-\\[var\\(--my-color\\)\\], .border-be-\\[var\\(--my-color\\)\\]\\/50 {
-  border-block-end-color: var(--my-color);
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-\\[var\\(--my-color\\)\\]\\/50 {
-    border-block-end-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
-}
-
-.border-be-blue-500 {
-  border-block-end-color: var(--border-color-blue-500);
-}
-
-.border-be-current, .border-be-current\\/50 {
-  border-block-end-color: currentColor;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-current\\/50 {
-    border-block-end-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
-}
-
-.border-be-inherit {
-  border-block-end-color: inherit;
-}
-
-.border-be-red-500 {
-  border-block-end-color: var(--color-red-500);
-}
-
-.border-be-red-500\\/2\\.5 {
-  border-block-end-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-red-500\\/2\\.5 {
-    border-block-end-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
-}
-
-.border-be-red-500\\/2\\.25 {
-  border-block-end-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-red-500\\/2\\.25 {
-    border-block-end-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
-}
-
-.border-be-red-500\\/2\\.75 {
-  border-block-end-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-red-500\\/2\\.75 {
-    border-block-end-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
-}
-
-.border-be-red-500\\/50 {
-  border-block-end-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-be-red-500\\/50 {
-    border-block-end-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
-}
-
-.border-be-transparent {
-  border-block-end-color: #0000;
-}
-
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-"
-`;
-
-exports[`border-bs-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
-  --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
-}
-
-.border-bs {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 1px;
-}
-
-.border-bs-0 {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 0;
-}
-
-.border-bs-2 {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 2px;
-}
-
-.border-bs-4 {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 4px;
-}
-
-.border-bs-123 {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 123px;
-}
-
-.border-bs-\\[0_1\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 0 1;
-}
-
-.border-bs-\\[0_2px_0_2px\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 0 2px 0 2px;
-}
-
-.border-bs-\\[12px\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 12px;
-}
-
-.border-bs-\\[12px_8px\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: 12px 8px;
-}
-
-.border-bs-\\[length\\:var\\(--my-width\\)\\], .border-bs-\\[line-width\\:var\\(--my-width\\)\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: var(--my-width);
-}
-
-.border-bs-\\[medium\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: medium;
-}
-
-.border-bs-\\[thick\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: thick;
-}
-
-.border-bs-\\[thin\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: thin;
-}
-
-.border-bs-\\[thin_2px\\] {
-  border-block-start-style: var(--tw-border-style);
-  border-block-start-width: thin 2px;
-}
-
-.border-bs-\\[\\#0088cc\\] {
-  border-block-start-color: #08c;
-}
-
-.border-bs-\\[\\#0088cc\\]\\/50 {
-  border-block-start-color: oklab(59.9824% -.067 -.124 / .5);
-}
-
-.border-bs-\\[color\\:var\\(--my-color\\)\\], .border-bs-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-  border-block-start-color: var(--my-color);
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-block-start-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
-}
-
-.border-bs-\\[var\\(--my-color\\)\\], .border-bs-\\[var\\(--my-color\\)\\]\\/50 {
-  border-block-start-color: var(--my-color);
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-\\[var\\(--my-color\\)\\]\\/50 {
-    border-block-start-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
-}
-
-.border-bs-blue-500 {
-  border-block-start-color: var(--border-color-blue-500);
-}
-
-.border-bs-current, .border-bs-current\\/50 {
-  border-block-start-color: currentColor;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-current\\/50 {
-    border-block-start-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
-}
-
-.border-bs-inherit {
-  border-block-start-color: inherit;
-}
-
-.border-bs-red-500 {
-  border-block-start-color: var(--color-red-500);
-}
-
-.border-bs-red-500\\/2\\.5 {
-  border-block-start-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-red-500\\/2\\.5 {
-    border-block-start-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
-}
-
-.border-bs-red-500\\/2\\.25 {
-  border-block-start-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-red-500\\/2\\.25 {
-    border-block-start-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
-}
-
-.border-bs-red-500\\/2\\.75 {
-  border-block-start-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-red-500\\/2\\.75 {
-    border-block-start-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
-}
-
-.border-bs-red-500\\/50 {
-  border-block-start-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-bs-red-500\\/50 {
-    border-block-start-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
-}
-
-.border-bs-transparent {
-  border-block-start-color: #0000;
-}
-
-@property --tw-border-style {
-  syntax: "*";
-  inherits: false;
-  initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-e-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-e {
@@ -838,41 +364,31 @@ exports[`border-e-* 1`] = `
 }
 
 .border-e-\\[\\#0088cc\\]\\/50 {
-  border-inline-end-color: oklab(59.9824% -.067 -.124 / .5);
+  border-inline-end-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-e-\\[color\\:var\\(--my-color\\)\\], .border-e-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-e-\\[color\\:var\\(--my-color\\)\\] {
   border-inline-end-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-inline-end-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-e-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-inline-end-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-e-\\[var\\(--my-color\\)\\], .border-e-\\[var\\(--my-color\\)\\]\\/50 {
+.border-e-\\[var\\(--my-color\\)\\] {
   border-inline-end-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-\\[var\\(--my-color\\)\\]\\/50 {
-    border-inline-end-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-e-\\[var\\(--my-color\\)\\]\\/50 {
+  border-inline-end-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-e-blue-500 {
-  border-inline-end-color: var(--border-color-blue-500);
-}
-
-.border-e-current, .border-e-current\\/50 {
+.border-e-current {
   border-inline-end-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-current\\/50 {
-    border-inline-end-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-e-current\\/50 {
+  border-inline-end-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-e-inherit {
@@ -884,43 +400,19 @@ exports[`border-e-* 1`] = `
 }
 
 .border-e-red-500\\/2\\.5 {
-  border-inline-end-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-red-500\\/2\\.5 {
-    border-inline-end-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-inline-end-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-e-red-500\\/2\\.25 {
-  border-inline-end-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-red-500\\/2\\.25 {
-    border-inline-end-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-inline-end-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-e-red-500\\/2\\.75 {
-  border-inline-end-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-red-500\\/2\\.75 {
-    border-inline-end-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-inline-end-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-e-red-500\\/50 {
-  border-inline-end-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-e-red-500\\/50 {
-    border-inline-end-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-inline-end-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-e-transparent {
@@ -931,23 +423,12 @@ exports[`border-e-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-l-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-l {
@@ -1025,41 +506,31 @@ exports[`border-l-* 1`] = `
 }
 
 .border-l-\\[\\#0088cc\\]\\/50 {
-  border-left-color: oklab(59.9824% -.067 -.124 / .5);
+  border-left-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-l-\\[color\\:var\\(--my-color\\)\\], .border-l-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-l-\\[color\\:var\\(--my-color\\)\\] {
   border-left-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-left-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-l-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-left-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-l-\\[var\\(--my-color\\)\\], .border-l-\\[var\\(--my-color\\)\\]\\/50 {
+.border-l-\\[var\\(--my-color\\)\\] {
   border-left-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-\\[var\\(--my-color\\)\\]\\/50 {
-    border-left-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-l-\\[var\\(--my-color\\)\\]\\/50 {
+  border-left-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-l-blue-500 {
-  border-left-color: var(--border-color-blue-500);
-}
-
-.border-l-current, .border-l-current\\/50 {
+.border-l-current {
   border-left-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-current\\/50 {
-    border-left-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-l-current\\/50 {
+  border-left-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-l-inherit {
@@ -1071,43 +542,19 @@ exports[`border-l-* 1`] = `
 }
 
 .border-l-red-500\\/2\\.5 {
-  border-left-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-red-500\\/2\\.5 {
-    border-left-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-left-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-l-red-500\\/2\\.25 {
-  border-left-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-red-500\\/2\\.25 {
-    border-left-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-left-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-l-red-500\\/2\\.75 {
-  border-left-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-red-500\\/2\\.75 {
-    border-left-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-left-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-l-red-500\\/50 {
-  border-left-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-l-red-500\\/50 {
-    border-left-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-left-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-l-transparent {
@@ -1118,23 +565,12 @@ exports[`border-l-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-r-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-r {
@@ -1212,41 +648,31 @@ exports[`border-r-* 1`] = `
 }
 
 .border-r-\\[\\#0088cc\\]\\/50 {
-  border-right-color: oklab(59.9824% -.067 -.124 / .5);
+  border-right-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-r-\\[color\\:var\\(--my-color\\)\\], .border-r-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-r-\\[color\\:var\\(--my-color\\)\\] {
   border-right-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-right-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-r-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-right-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-r-\\[var\\(--my-color\\)\\], .border-r-\\[var\\(--my-color\\)\\]\\/50 {
+.border-r-\\[var\\(--my-color\\)\\] {
   border-right-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-\\[var\\(--my-color\\)\\]\\/50 {
-    border-right-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-r-\\[var\\(--my-color\\)\\]\\/50 {
+  border-right-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-r-blue-500 {
-  border-right-color: var(--border-color-blue-500);
-}
-
-.border-r-current, .border-r-current\\/50 {
+.border-r-current {
   border-right-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-current\\/50 {
-    border-right-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-r-current\\/50 {
+  border-right-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-r-inherit {
@@ -1258,43 +684,19 @@ exports[`border-r-* 1`] = `
 }
 
 .border-r-red-500\\/2\\.5 {
-  border-right-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-red-500\\/2\\.5 {
-    border-right-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-right-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-r-red-500\\/2\\.25 {
-  border-right-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-red-500\\/2\\.25 {
-    border-right-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-right-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-r-red-500\\/2\\.75 {
-  border-right-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-red-500\\/2\\.75 {
-    border-right-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-right-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-r-red-500\\/50 {
-  border-right-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-r-red-500\\/50 {
-    border-right-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-right-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-r-transparent {
@@ -1305,23 +707,12 @@ exports[`border-r-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-s-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-s {
@@ -1399,41 +790,31 @@ exports[`border-s-* 1`] = `
 }
 
 .border-s-\\[\\#0088cc\\]\\/50 {
-  border-inline-start-color: oklab(59.9824% -.067 -.124 / .5);
+  border-inline-start-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-s-\\[color\\:var\\(--my-color\\)\\], .border-s-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-s-\\[color\\:var\\(--my-color\\)\\] {
   border-inline-start-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-inline-start-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-s-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-inline-start-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-s-\\[var\\(--my-color\\)\\], .border-s-\\[var\\(--my-color\\)\\]\\/50 {
+.border-s-\\[var\\(--my-color\\)\\] {
   border-inline-start-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-\\[var\\(--my-color\\)\\]\\/50 {
-    border-inline-start-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-s-\\[var\\(--my-color\\)\\]\\/50 {
+  border-inline-start-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-s-blue-500 {
-  border-inline-start-color: var(--border-color-blue-500);
-}
-
-.border-s-current, .border-s-current\\/50 {
+.border-s-current {
   border-inline-start-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-current\\/50 {
-    border-inline-start-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-s-current\\/50 {
+  border-inline-start-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-s-inherit {
@@ -1445,43 +826,19 @@ exports[`border-s-* 1`] = `
 }
 
 .border-s-red-500\\/2\\.5 {
-  border-inline-start-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-red-500\\/2\\.5 {
-    border-inline-start-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-inline-start-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-s-red-500\\/2\\.25 {
-  border-inline-start-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-red-500\\/2\\.25 {
-    border-inline-start-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-inline-start-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-s-red-500\\/2\\.75 {
-  border-inline-start-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-red-500\\/2\\.75 {
-    border-inline-start-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-inline-start-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-s-red-500\\/50 {
-  border-inline-start-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-s-red-500\\/50 {
-    border-inline-start-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-inline-start-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-s-transparent {
@@ -1492,23 +849,12 @@ exports[`border-s-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-t-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-t {
@@ -1586,41 +932,31 @@ exports[`border-t-* 1`] = `
 }
 
 .border-t-\\[\\#0088cc\\]\\/50 {
-  border-top-color: oklab(59.9824% -.067 -.124 / .5);
+  border-top-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-t-\\[color\\:var\\(--my-color\\)\\], .border-t-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-t-\\[color\\:var\\(--my-color\\)\\] {
   border-top-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-top-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-t-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-top-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-t-\\[var\\(--my-color\\)\\], .border-t-\\[var\\(--my-color\\)\\]\\/50 {
+.border-t-\\[var\\(--my-color\\)\\] {
   border-top-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-\\[var\\(--my-color\\)\\]\\/50 {
-    border-top-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-t-\\[var\\(--my-color\\)\\]\\/50 {
+  border-top-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-t-blue-500 {
-  border-top-color: var(--border-color-blue-500);
-}
-
-.border-t-current, .border-t-current\\/50 {
+.border-t-current {
   border-top-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-current\\/50 {
-    border-top-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-t-current\\/50 {
+  border-top-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-t-inherit {
@@ -1632,43 +968,19 @@ exports[`border-t-* 1`] = `
 }
 
 .border-t-red-500\\/2\\.5 {
-  border-top-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-red-500\\/2\\.5 {
-    border-top-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-top-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-t-red-500\\/2\\.25 {
-  border-top-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-red-500\\/2\\.25 {
-    border-top-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-top-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-t-red-500\\/2\\.75 {
-  border-top-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-red-500\\/2\\.75 {
-    border-top-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-top-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-t-red-500\\/50 {
-  border-top-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-t-red-500\\/50 {
-    border-top-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-top-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-t-transparent {
@@ -1679,23 +991,12 @@ exports[`border-t-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-x-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-x {
@@ -1773,41 +1074,31 @@ exports[`border-x-* 1`] = `
 }
 
 .border-x-\\[\\#0088cc\\]\\/50 {
-  border-inline-color: oklab(59.9824% -.067 -.124 / .5);
+  border-inline-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-x-\\[color\\:var\\(--my-color\\)\\], .border-x-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-x-\\[color\\:var\\(--my-color\\)\\] {
   border-inline-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-inline-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-x-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-inline-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-x-\\[var\\(--my-color\\)\\], .border-x-\\[var\\(--my-color\\)\\]\\/50 {
+.border-x-\\[var\\(--my-color\\)\\] {
   border-inline-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-\\[var\\(--my-color\\)\\]\\/50 {
-    border-inline-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-x-\\[var\\(--my-color\\)\\]\\/50 {
+  border-inline-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-x-blue-500 {
-  border-inline-color: var(--border-color-blue-500);
-}
-
-.border-x-current, .border-x-current\\/50 {
+.border-x-current {
   border-inline-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-current\\/50 {
-    border-inline-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-x-current\\/50 {
+  border-inline-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-x-inherit {
@@ -1819,43 +1110,19 @@ exports[`border-x-* 1`] = `
 }
 
 .border-x-red-500\\/2\\.5 {
-  border-inline-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-red-500\\/2\\.5 {
-    border-inline-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-inline-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-x-red-500\\/2\\.25 {
-  border-inline-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-red-500\\/2\\.25 {
-    border-inline-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-inline-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-x-red-500\\/2\\.75 {
-  border-inline-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-red-500\\/2\\.75 {
-    border-inline-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-inline-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-x-red-500\\/50 {
-  border-inline-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-x-red-500\\/50 {
-    border-inline-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-inline-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-x-transparent {
@@ -1866,23 +1133,12 @@ exports[`border-x-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
 
 exports[`border-y-* 1`] = `
-"
-@layer properties {
-  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-    *, :before, :after, ::backdrop {
-      --tw-border-style: solid;
-    }
-  }
-}
-
-:root, :host {
+":root, :host {
   --color-red-500: #ef4444;
-  --border-color-blue-500: #3b82f6;
 }
 
 .border-y {
@@ -1960,41 +1216,31 @@ exports[`border-y-* 1`] = `
 }
 
 .border-y-\\[\\#0088cc\\]\\/50 {
-  border-block-color: oklab(59.9824% -.067 -.124 / .5);
+  border-block-color: oklab(59.9824% -.06725 -.12414 / .5);
 }
 
-.border-y-\\[color\\:var\\(--my-color\\)\\], .border-y-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+.border-y-\\[color\\:var\\(--my-color\\)\\] {
   border-block-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-    border-block-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-y-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+  border-block-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-y-\\[var\\(--my-color\\)\\], .border-y-\\[var\\(--my-color\\)\\]\\/50 {
+.border-y-\\[var\\(--my-color\\)\\] {
   border-block-color: var(--my-color);
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-\\[var\\(--my-color\\)\\]\\/50 {
-    border-block-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-  }
+.border-y-\\[var\\(--my-color\\)\\]\\/50 {
+  border-block-color: color-mix(in oklab, var(--my-color) 50%, transparent);
 }
 
-.border-y-blue-500 {
-  border-block-color: var(--border-color-blue-500);
-}
-
-.border-y-current, .border-y-current\\/50 {
+.border-y-current {
   border-block-color: currentColor;
 }
 
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-current\\/50 {
-    border-block-color: color-mix(in oklab, currentcolor 50%, transparent);
-  }
+.border-y-current\\/50 {
+  border-block-color: color-mix(in oklab, currentColor 50%, transparent);
 }
 
 .border-y-inherit {
@@ -2006,43 +1252,19 @@ exports[`border-y-* 1`] = `
 }
 
 .border-y-red-500\\/2\\.5 {
-  border-block-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-red-500\\/2\\.5 {
-    border-block-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-  }
+  border-block-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
 }
 
 .border-y-red-500\\/2\\.25 {
-  border-block-color: #ef444406;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-red-500\\/2\\.25 {
-    border-block-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-  }
+  border-block-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
 }
 
 .border-y-red-500\\/2\\.75 {
-  border-block-color: #ef444407;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-red-500\\/2\\.75 {
-    border-block-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-  }
+  border-block-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
 }
 
 .border-y-red-500\\/50 {
-  border-block-color: #ef444480;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .border-y-red-500\\/50 {
-    border-block-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-  }
+  border-block-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
 }
 
 .border-y-transparent {
@@ -2053,6 +1275,5 @@ exports[`border-y-* 1`] = `
   syntax: "*";
   inherits: false;
   initial-value: solid;
-}
-"
+}"
 `;
diff --git a/packages/tailwindcss/src/apply.ts b/packages/tailwindcss/src/apply.ts
index 2d5e5b847..676b4f2ee 100644
--- a/packages/tailwindcss/src/apply.ts
+++ b/packages/tailwindcss/src/apply.ts
@@ -1,11 +1,8 @@
 import { Features } from '.'
-import { cloneAstNode, rule, toCss, type AstNode } from './ast'
+import { rule, toCss, walk, WalkAction, type AstNode } from './ast'
 import { compileCandidates } from './compile'
 import type { DesignSystem } from './design-system'
-import type { SourceLocation } from './source-maps/source'
 import { DefaultMap } from './utils/default-map'
-import { segment } from './utils/segment'
-import { walk, WalkAction } from './walk'
 
 export function substituteAtApply(ast: AstNode[], designSystem: DesignSystem) {
   let features = Features.None
@@ -26,7 +23,7 @@ export function substituteAtApply(ast: AstNode[], designSystem: DesignSystem) {
   let definitions = new DefaultMap(() => new Set<AstNode>())
 
   // Collect all new `@utility` definitions and all `@apply` rules first
-  walk([root], (node, ctx) => {
+  walk([root], (node, { parent }) => {
     if (node.kind !== 'at-rule') return
 
     // Do not allow `@apply` rules inside `@keyframes` rules.
@@ -62,18 +59,14 @@ export function substituteAtApply(ast: AstNode[], designSystem: DesignSystem) {
     if (node.name === '@apply') {
       // `@apply` cannot be top-level, so we need to have a parent such that we
       // can replace the `@apply` node with the actual utility classes later.
-      if (ctx.parent === null) return
+      if (parent === null) return
 
       features |= Features.AtApply
 
-      parents.add(ctx.parent)
+      parents.add(parent)
 
       for (let dependency of resolveApplyDependencies(node, designSystem)) {
-        // Mark every parent in the path as having a dependency to that utility.
-        for (let parent of ctx.path()) {
-          if (!parents.has(parent)) continue
-          dependencies.get(parent).add(dependency)
-        }
+        dependencies.get(parent).add(dependency)
       }
     }
   })
@@ -158,163 +151,21 @@ export function substituteAtApply(ast: AstNode[], designSystem: DesignSystem) {
   for (let parent of sorted) {
     if (!('nodes' in parent)) continue
 
-    walk(parent.nodes, (child) => {
-      if (child.kind !== 'at-rule' || child.name !== '@apply') return
+    for (let i = 0; i < parent.nodes.length; i++) {
+      let node = parent.nodes[i]
+      if (node.kind !== 'at-rule' || node.name !== '@apply') continue
 
-      let parts = child.params.split(/(\s+)/g)
-      let candidateOffsets: Record<string, number> = {}
-      let normalIdents: string[] = []
-      let dashedIdents: string[] = []
-
-      let offset = 0
-      for (let [idx, part] of parts.entries()) {
-        if (idx % 2 === 0) {
-          if (part[0] === '-' && part[1] === '-') {
-            dashedIdents.push(part)
-          } else {
-            normalIdents.push(part)
-          }
-
-          candidateOffsets[part] = offset
-        }
-
-        offset += part.length
-      }
-
-      if (dashedIdents.length) {
-        // If we have an `@apply` that only consists of dashed idents then the
-        // user is intending to use a CSS mixin:
-        // https://drafts.csswg.org/css-mixins-1/#apply-rule
-        //
-        // These are not considered utilities and need to be emitted literally.
-        if (normalIdents.length === 0) return WalkAction.Skip
-
-        // If we find a dashed ident *here* it means that someone is trying
-        // to use mixins and our `@apply` behavior together.
-        //
-        // This is invalid and the rules must be written separately. Let the
-        // user know they need to move them into a separate rule.
-        let list = dashedIdents.join(' ')
-
-        throw new Error(
-          `You cannot use \`@apply\` with both mixins and utilities. Please move \`@apply ${list}\` into a separate rule.`,
-        )
-      }
-
-      let hasBody = child.nodes.length > 0
-
-      if (hasBody && normalIdents.length) {
-        let list = normalIdents.join(' ')
-
-        throw new Error(`The rule \`@apply ${list}\` must not have a body.`)
-      }
+      let candidates = node.params.split(/\s+/g)
 
       // Replace the `@apply` rule with the actual utility classes
       {
         // Parse the candidates to an AST that we can replace the `@apply` rule
         // with.
-        let candidates = Object.keys(candidateOffsets)
-        let compiled = compileCandidates(candidates, designSystem, {
-          respectImportant: false,
+        let candidateAst = compileCandidates(candidates, designSystem, {
           onInvalidCandidate: (candidate) => {
-            // When using prefix, make sure prefix is used in candidate
-            if (designSystem.theme.prefix && !candidate.startsWith(designSystem.theme.prefix)) {
-              throw new Error(
-                `Cannot apply unprefixed utility class \`${candidate}\`. Did you mean \`${designSystem.theme.prefix}:${candidate}\`?`,
-              )
-            }
-
-            // When the utility is blocklisted, let the user know
-            //
-            // Note: `@apply` is processed before handling incoming classes from
-            // template files. This means that the `invalidCandidates` set will
-            // only contain explicit classes via:
-            //
-            // - `blocklist` from a JS config
-            // - `@source not inline(…)`
-            if (designSystem.invalidCandidates.has(candidate)) {
-              throw new Error(
-                `Cannot apply utility class \`${candidate}\` because it has been explicitly disabled: https://tailwindcss.com/docs/detecting-classes-in-source-files#explicitly-excluding-classes`,
-              )
-            }
-
-            // Verify if variants exist
-            let parts = segment(candidate, ':')
-            if (parts.length > 1) {
-              let utility = parts.pop()!
-
-              // Ensure utility on its own compiles, if not, we will fallback to
-              // the next error
-              if (designSystem.candidatesToCss([utility])[0]) {
-                let compiledVariants = designSystem.candidatesToCss(
-                  parts.map((variant) => `${variant}:[--tw-variant-check:1]`),
-                )
-                let unknownVariants = parts.filter((_, idx) => compiledVariants[idx] === null)
-                if (unknownVariants.length > 0) {
-                  if (unknownVariants.length === 1) {
-                    throw new Error(
-                      `Cannot apply utility class \`${candidate}\` because the ${unknownVariants.map((variant) => `\`${variant}\``)} variant does not exist.`,
-                    )
-                  } else {
-                    let formatter = new Intl.ListFormat('en', {
-                      style: 'long',
-                      type: 'conjunction',
-                    })
-                    throw new Error(
-                      `Cannot apply utility class \`${candidate}\` because the ${formatter.format(unknownVariants.map((variant) => `\`${variant}\``))} variants do not exist.`,
-                    )
-                  }
-                }
-              }
-            }
-
-            // When the theme is empty, it means that no theme was loaded and
-            // `@import "tailwindcss"`, `@reference "app.css"` or similar is
-            // very likely missing.
-            if (designSystem.theme.size === 0) {
-              throw new Error(
-                `Cannot apply unknown utility class \`${candidate}\`. Are you using CSS modules or similar and missing \`@reference\`? https://tailwindcss.com/docs/functions-and-directives#reference-directive`,
-              )
-            }
-
-            // Fallback to most generic error message
-            throw new Error(`Cannot apply unknown utility class \`${candidate}\``)
+            throw new Error(`Cannot apply unknown utility class: ${candidate}`)
           },
-        })
-
-        let src = child.src
-
-        let candidateAst = compiled.astNodes.map((node) => {
-          let candidate = compiled.nodeSorting.get(node)?.candidate
-          let candidateOffset = candidate ? candidateOffsets[candidate] : undefined
-
-          node = cloneAstNode(node)
-
-          if (!src || !candidate || candidateOffset === undefined) {
-            // While the original nodes may have come from an `@utility` we still
-            // want to replace the source because the `@apply` is ultimately the
-            // reason the node was emitted into the AST.
-            walk([node], (node) => {
-              node.src = src
-            })
-
-            return node
-          }
-
-          let candidateSrc: SourceLocation = [src[0], src[1], src[2]]
-
-          candidateSrc[1] += 7 /* '@apply '.length */ + candidateOffset
-          candidateSrc[2] = candidateSrc[1] + candidate.length
-
-          // While the original nodes may have come from an `@utility` we still
-          // want to replace the source because the `@apply` is ultimately the
-          // reason the node was emitted into the AST.
-          walk([node], (node) => {
-            node.src = candidateSrc
-          })
-
-          return node
-        })
+        }).astNodes
 
         // Collect the nodes to insert in place of the `@apply` rule. When a rule
         // was used, we want to insert its children instead of the rule because we
@@ -330,11 +181,10 @@ export function substituteAtApply(ast: AstNode[], designSystem: DesignSystem) {
           }
         }
 
-        return WalkAction.Replace(newNodes)
+        parent.nodes.splice(i, 1, ...newNodes)
       }
-    })
+    }
   }
-
   return features
 }
 
diff --git a/packages/tailwindcss/src/ast.bench.ts b/packages/tailwindcss/src/ast.bench.ts
deleted file mode 100644
index 034faee27..000000000
--- a/packages/tailwindcss/src/ast.bench.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import { bench, describe } from 'vitest'
-import { cloneAstNode, toCss, type AstNode } from './ast'
-import * as CSS from './css-parser'
-
-const css = String.raw
-const input = css`
-  @theme {
-    --color-primary: #333;
-  }
-  @tailwind utilities;
-  .foo {
-    color: red;
-    /* comment */
-    &:hover {
-      color: blue;
-      @apply font-bold;
-    }
-  }
-`
-const ast = CSS.parse(input)
-
-describe('AST to CSS', () => {
-  bench('toCss', () => {
-    toCss(ast)
-  })
-
-  bench('toCss with source maps', () => {
-    toCss(ast, true)
-  })
-})
-
-describe('Cloning AST nodes', () => {
-  bench('cloneAstNode()', () => {
-    ast.map(cloneAstNode)
-  })
-
-  bench('cloneAstNode (with spread)', () => {
-    ast.map(cloneAstNodeSpread)
-  })
-
-  bench('structuredClone()', () => {
-    structuredClone(ast)
-  })
-})
-
-function cloneAstNodeSpread<T extends AstNode>(node: T): T {
-  switch (node.kind) {
-    case 'rule':
-    case 'at-rule':
-    case 'at-root':
-      return { ...node, nodes: node.nodes.map(cloneAstNodeSpread) }
-
-    case 'context':
-      return { ...node, context: { ...node.context }, nodes: node.nodes.map(cloneAstNodeSpread) }
-
-    case 'declaration':
-    case 'comment':
-      return { ...node }
-
-    default:
-      node satisfies never
-      throw new Error(`Unknown node kind: ${(node as any).kind}`)
-  }
-}
diff --git a/packages/tailwindcss/src/ast.test.ts b/packages/tailwindcss/src/ast.test.ts
index 14092c9f5..8bd2004ac 100644
--- a/packages/tailwindcss/src/ast.test.ts
+++ b/packages/tailwindcss/src/ast.test.ts
@@ -1,28 +1,23 @@
-import { describe, expect, it, test } from 'vitest'
+import { expect, it } from 'vitest'
 import {
+  atRule,
   context,
-  cssContext,
   decl,
-  handleNesting,
   optimizeAst,
-  rule,
   styleRule,
   toCss,
+  walk,
+  WalkAction,
   type AstNode,
 } from './ast'
 import * as CSS from './css-parser'
-import { buildDesignSystem } from './design-system'
-import { pretty } from './test-utils/run'
-import { Theme } from './theme'
-import { walk, WalkAction } from './walk'
 
 const css = String.raw
-const defaultDesignSystem = buildDesignSystem(new Theme())
 
 it('should pretty print an AST', () => {
-  expect(pretty(toCss(CSS.parse('.foo{color:red;&:hover{color:blue;}}')))).toMatchInlineSnapshot(`
-    "
-    .foo {
+  expect(toCss(optimizeAst(CSS.parse('.foo{color:red;&:hover{color:blue;}}'))))
+    .toMatchInlineSnapshot(`
+    ".foo {
       color: red;
       &:hover {
         color: blue;
@@ -33,7 +28,7 @@ it('should pretty print an AST', () => {
 })
 
 it('allows the placement of context nodes', () => {
-  let ast: AstNode[] = [
+  const ast = [
     styleRule('.foo', [decl('color', 'red')]),
     context({ context: 'a' }, [
       styleRule('.bar', [
@@ -50,18 +45,17 @@ it('allows the placement of context nodes', () => {
   let blueContext
   let greenContext
 
-  walk(ast, (node, _ctx) => {
+  walk(ast, (node, { context }) => {
     if (node.kind !== 'declaration') return
-    let ctx = cssContext(_ctx)
     switch (node.value) {
       case 'red':
-        redContext = ctx.context
+        redContext = context
         break
       case 'blue':
-        blueContext = ctx.context
+        blueContext = context
         break
       case 'green':
-        greenContext = ctx.context
+        greenContext = context
         break
     }
   })
@@ -70,9 +64,8 @@ it('allows the placement of context nodes', () => {
   expect(blueContext).toEqual({ context: 'a' })
   expect(greenContext).toEqual({ context: 'b' })
 
-  expect(pretty(toCss(optimizeAst(ast, defaultDesignSystem)))).toMatchInlineSnapshot(`
-    "
-    .foo {
+  expect(toCss(optimizeAst(ast))).toMatchInlineSnapshot(`
+    ".foo {
       color: red;
     }
     .bar {
@@ -85,6 +78,36 @@ it('allows the placement of context nodes', () => {
   `)
 })
 
+it('should stop walking when returning `WalkAction.Stop`', () => {
+  let ast = [
+    styleRule('.foo', [styleRule('.nested', [styleRule('.bail', [decl('color', 'red')])])]),
+    styleRule('.bar'),
+    styleRule('.baz'),
+    styleRule('.qux'),
+  ]
+
+  let seen = new Set()
+
+  walk(ast, (node) => {
+    if (node.kind === 'rule') {
+      seen.add(node.selector)
+    }
+
+    if (node.kind === 'rule' && node.selector === '.bail') {
+      return WalkAction.Stop
+    }
+  })
+
+  // We do not want to see `.bar`, `.baz`, or `.qux` because we bailed early
+  expect(seen).toMatchInlineSnapshot(`
+    Set {
+      ".foo",
+      ".nested",
+      ".bail",
+    }
+  `)
+})
+
 it('should not emit empty rules once optimized', () => {
   let ast = CSS.parse(css`
     /* Empty rule */
@@ -127,15 +150,13 @@ it('should not emit empty rules once optimized', () => {
     /* Exceptions: */
     @charset "UTF-8";
     @layer foo, bar, baz;
-    @layer foo, bar, baz; /* Will be deduped */
     @custom-media --modern (color), (hover);
     @namespace 'http://www.w3.org/1999/xhtml';
     @import url('https://fonts.googleapis.com/css2?family=Cedarville+Cursive&display=swap');
   `)
 
-  expect(pretty(toCss(ast))).toMatchInlineSnapshot(`
-    "
-    .foo {
+  expect(toCss(ast)).toMatchInlineSnapshot(`
+    ".foo {
     }
     .foo {
       .bar {
@@ -162,16 +183,14 @@ it('should not emit empty rules once optimized', () => {
     }
     @charset "UTF-8";
     @layer foo, bar, baz;
-    @layer foo, bar, baz;
     @custom-media --modern (color), (hover);
     @namespace 'http://www.w3.org/1999/xhtml';
     @import url('https://fonts.googleapis.com/css2?family=Cedarville+Cursive&display=swap');
     "
   `)
 
-  expect(pretty(toCss(optimizeAst(ast, defaultDesignSystem)))).toMatchInlineSnapshot(`
-    "
-    @charset "UTF-8";
+  expect(toCss(optimizeAst(ast))).toMatchInlineSnapshot(`
+    "@charset "UTF-8";
     @layer foo, bar, baz;
     @custom-media --modern (color), (hover);
     @namespace 'http://www.w3.org/1999/xhtml';
@@ -180,1485 +199,309 @@ it('should not emit empty rules once optimized', () => {
   `)
 })
 
-it('should not emit exact duplicate declarations in the same rule', () => {
-  let ast = CSS.parse(css`
-    .foo {
-      color: red;
-      .bar {
-        color: green;
-        color: blue;
-        color: green;
-      }
-      color: red;
+it('should only visit children once when calling `replaceWith` with single element array', () => {
+  let visited = new Set()
+
+  let ast = [
+    atRule('@media', '', [styleRule('.foo', [decl('color', 'blue')])]),
+    styleRule('.bar', [decl('color', 'blue')]),
+  ]
+
+  walk(ast, (node, { replaceWith }) => {
+    if (visited.has(node)) {
+      throw new Error('Visited node twice')
     }
-    .foo {
-      color: red;
-      & {
-        color: green;
-        & {
-          color: red;
-          color: green;
-          color: blue;
-        }
-        color: red;
-      }
-      background: blue;
-      .bar {
-        color: green;
-        color: blue;
-        color: green;
-      }
-      caret-color: orange;
-    }
-  `)
+    visited.add(node)
 
-  expect(pretty(toCss(ast))).toMatchInlineSnapshot(`
-    "
-    .foo {
-      color: red;
-      .bar {
-        color: green;
-        color: blue;
-        color: green;
-      }
-      color: red;
-    }
-    .foo {
-      color: red;
-      & {
-        color: green;
-        & {
-          color: red;
-          color: green;
-          color: blue;
-        }
-        color: red;
-      }
-      background: blue;
-      .bar {
-        color: green;
-        color: blue;
-        color: green;
-      }
-      caret-color: orange;
-    }
-    "
-  `)
-
-  expect(pretty(toCss(optimizeAst(ast, defaultDesignSystem)))).toMatchInlineSnapshot(`
-    "
-    .foo {
-      .bar {
-        color: green;
-        color: blue;
-        color: green;
-      }
-      color: red;
-      & {
-        color: green;
-        & {
-          color: red;
-          color: green;
-          color: blue;
-        }
-        color: red;
-      }
-      background: blue;
-      .bar {
-        color: green;
-        color: blue;
-        color: green;
-      }
-      caret-color: orange;
-    }
-    "
-  `)
-})
-
-it('should not emit color-mix() fallbacks inside @keyframes', () => {
-  let ast = CSS.parse(css`
-    @keyframes my-animation {
-      0% {
-        color: color-mix(in oklab, var(--color-emerald-600) 0%, transparent);
-      }
-      100% {
-        color: color-mix(in oklab, var(--color-emerald-600) 0%, transparent);
-      }
-    }
-  `)
-
-  let theme = new Theme()
-  theme.add('--color-emerald-600', 'oklch(59.6% 0.145 163.225)')
-
-  let design = buildDesignSystem(theme)
-
-  expect(pretty(toCss(optimizeAst(ast, design)))).toMatchInlineSnapshot(`
-    "
-    @keyframes my-animation {
-      0% {
-        color: color-mix(in oklab, var(--color-emerald-600) 0%, transparent);
-      }
-      100% {
-        color: color-mix(in oklab, var(--color-emerald-600) 0%, transparent);
-      }
-    }
-    "
-  `)
-})
-
-describe('optimization', () => {
-  function optimize(input: string) {
-    let ast = CSS.parse(input)
-    walk(ast, {
-      exit(node) {
-        // Depending on where we use `@scope`, it's handled slightly differently:
-        //
-        // 1. In user authored CSS, we perform the normal CSS nesting and
-        //    hoisting of `@scope` rules
-        // 2. In a `@custom-variant` definition, we need to swap the `@scope`
-        //    with the parent definition. Otherwise you'll never get the
-        //    expected "sandwich" effect.
-        //
-        // This little `@in-variant` hack is just a different way of
-        // differentiating between both cases for these tests.
-        if (node.kind === 'at-rule' && node.name === '@in-variant') {
-          return WalkAction.Replace(context({ source: 'variant' }, node.nodes))
-        }
-      },
-    })
-    return pretty(toCss(handleNesting(ast)))
-  }
-
-  // See: https://drafts.csswg.org/css-nesting-1/
-  describe('CSS Nesting Module Level 1', () => {
-    it('uses the descendant combinator by default', async () => {
-      expect(
-        optimize(css`
-          .a {
-            element {
-              --x: 1;
-            }
-            .class {
-              --x: 2;
-            }
-            #id {
-              --x: 3;
-            }
-            :pseudo-class {
-              --x: 4;
-            }
-            ::pseudo-element {
-              --x: 5;
-            }
-            [attribute] {
-              --x: 6;
-            }
-            * {
-              --x: 7;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a element {
-          --x: 1;
-        }
-        .a .class {
-          --x: 2;
-        }
-        .a #id {
-          --x: 3;
-        }
-        .a :pseudo-class {
-          --x: 4;
-        }
-        .a ::pseudo-element {
-          --x: 5;
-        }
-        .a [attribute] {
-          --x: 6;
-        }
-        .a * {
-          --x: 7;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to change the combinator', async () => {
-      expect(
-        optimize(css`
-          .a {
-            + .b {
-              --x: 1;
-            }
-            > .c {
-              --x: 2;
-            }
-            ~ .d {
-              --x: 3;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a + .b {
-          --x: 1;
-        }
-        .a > .c {
-          --x: 2;
-        }
-        .a ~ .d {
-          --x: 3;
-        }
-        "
-      `)
-    })
-
-    it('should replace the first rule, that contains `&` with `:scope`', async () => {
-      expect(
-        optimize(css`
-          /* Standalone */
-          & {
-            --x: 1;
-          }
-
-          /* In an at-rule */
-          @supports (--y: 1) {
-            & {
-              --x: 2;
-            }
-          }
-
-          /* With :is(…) */
-          :is(&) {
-            --x: 3;
-          }
-
-          /* In an at-rule, with :is(…) */
-          @supports (--y: 2) {
-            :is(&) {
-              --x: 4;
-            }
-          }
-
-          /* With multiple selectors */
-          &,
-          .a {
-            --x: 5;
-          }
-
-          /* With multiple selectors + :is(…) */
-          :is(&),
-          .b {
-            --x: 6;
-          }
-
-          /* With multiple selectors in an at-rule */
-          @supports (--y: 3) {
-            &,
-            .c {
-              --x: 7;
-            }
-          }
-
-          /* With multiple selectors in an at-rule + :is(…) */
-          @supports (--y: 4) {
-            :is(&),
-            .d {
-              --x: 8;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :scope {
-          --x: 1;
-        }
-        @supports (--y: 1) {
-          :scope {
-            --x: 2;
-          }
-        }
-        :is(:scope) {
-          --x: 3;
-        }
-        @supports (--y: 2) {
-          :is(:scope) {
-            --x: 4;
-          }
-        }
-        :scope, .a {
-          --x: 5;
-        }
-        :is(:scope), .b {
-          --x: 6;
-        }
-        @supports (--y: 3) {
-          :scope, .c {
-            --x: 7;
-          }
-        }
-        @supports (--y: 4) {
-          :is(:scope), .d {
-            --x: 8;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` to explicitly match the parent', async () => {
-      expect(
-        optimize(css`
-          .a {
-            & + .b {
-              --x: 1;
-            }
-            & > .c {
-              --x: 2;
-            }
-            & ~ .d {
-              --x: 3;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a + .b {
-          --x: 1;
-        }
-        .a > .c {
-          --x: 2;
-        }
-        .a ~ .d {
-          --x: 3;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` in a different location', async () => {
-      expect(
-        optimize(css`
-          .a {
-            .b & {
-              --x: 1;
-            }
-            .c + & {
-              --x: 2;
-            }
-            .d > & {
-              --x: 3;
-            }
-            .e ~ & {
-              --x: 4;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .b .a {
-          --x: 1;
-        }
-        .c + .a {
-          --x: 2;
-        }
-        .d > .a {
-          --x: 3;
-        }
-        .e ~ .a {
-          --x: 4;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` on its own', async () => {
-      expect(
-        optimize(css`
-          .a {
-            & {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a {
-          --x: 1;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` nested in `:is(…)`', async () => {
-      expect(
-        optimize(css`
-          .a {
-            :is(&) {
-              --x: 1;
-            }
-            :is(:is(:is(&))) {
-              --x: 2;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :is(.a) {
-          --x: 1;
-        }
-        :is(:is(:is(.a))) {
-          --x: 2;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to handle nesting with a parent selector list', async () => {
-      expect(
-        optimize(css`
-          .a,
-          .b {
-            .c,
-            .d & {
-              --x: 1;
-              &:hover {
-                --x: 2;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :is(.a, .b) .c, .d :is(.a, .b) {
-          --x: 1;
-          &:hover {
-            --x: 2;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should not replace `\&`', () => {
-      expect(
-        optimize(css`
-          .a {
-            .b-\& {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a .b-\\& {
-          --x: 1;
-        }
-        "
-      `)
-    })
-
-    it('should not replace `&` as part of a string', () => {
-      expect(
-        optimize(css`
-          .a {
-            [data-b='c&d'] {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a [data-b='c&d'] {
-          --x: 1;
-        }
-        "
-      `)
-    })
-
-    it.each([
-      ['element', '&element', ':is(element)element'], // Invalid CSS
-      ['element', 'element&', 'element:is(element)'],
-      ['element', '&.class', 'element.class'],
-      ['element', '.class&', '.class:is(element)'], // Optimization: element.class
-      ['element', '&#id', 'element#id'],
-      ['element', '#id&', '#id:is(element)'], // Optimization: element#id
-      ['element', '&:hover', 'element:hover'],
-      ['element', ':hover&', ':hover:is(element)'],
-      ['element', '&::before', 'element::before'],
-      ['element', '::before&', '::before:is(element)'], // Invalid CSS
-      ['element', '&:not(.x)', 'element:not(.x)'],
-      ['element', ':not(.x)&', ':not(.x):is(element)'], // Optimization: element:not(.x)
-      ['element', '&[attribute]', 'element[attribute]'],
-      ['element', '[attribute]&', '[attribute]:is(element)'], // Optimization: element[attribute]
-      ['element', '&*', ':is(element)*'], // Invalid CSS
-      ['element', '*&', 'element'],
-
-      ['.class', '&element', ':is(.class)element'], // Invalid CSS
-      ['.class', 'element&', 'element.class'],
-      ['.class', '&.class', '.class.class'],
-      ['.class', '.class&', '.class.class'],
-      ['.class', '&#id', '.class#id'],
-      ['.class', '#id&', '#id.class'],
-      ['.class', '&:hover', '.class:hover'],
-      ['.class', ':hover&', ':hover.class'],
-      ['.class', '&::before', '.class::before'],
-      ['.class', '::before&', '::before.class'], // Invalid CSS
-      ['.class', '&:not(.x)', '.class:not(.x)'],
-      ['.class', ':not(.x)&', ':not(.x).class'],
-      ['.class', '&[attribute]', '.class[attribute]'],
-      ['.class', '[attribute]&', '[attribute].class'],
-      ['.class', '&*', ':is(.class)*'], // Invalid CSS
-      ['.class', '*&', '.class'],
-
-      ['#id', '&element', ':is(#id)element'], // Invalid CSS
-      ['#id', 'element&', 'element#id'],
-      ['#id', '&.class', '#id.class'],
-      ['#id', '.class&', '.class#id'],
-      ['#id', '&#id', '#id#id'],
-      ['#id', '#id&', '#id#id'],
-      ['#id', '&:hover', '#id:hover'],
-      ['#id', ':hover&', ':hover#id'],
-      ['#id', '&::before', '#id::before'],
-      ['#id', '::before&', '::before#id'], // Invalid CSS
-      ['#id', '&:not(.x)', '#id:not(.x)'],
-      ['#id', ':not(.x)&', ':not(.x)#id'],
-      ['#id', '&[attribute]', '#id[attribute]'],
-      ['#id', '[attribute]&', '[attribute]#id'],
-      ['#id', '&*', ':is(#id)*'], // Invalid CSS
-      ['#id', '*&', '#id'],
-
-      [':hover', '&element', ':is(:hover)element'], // Invalid CSS
-      [':hover', 'element&', 'element:hover'],
-      [':hover', '&.class', ':hover.class'],
-      [':hover', '.class&', '.class:hover'],
-      [':hover', '&#id', ':hover#id'],
-      [':hover', '#id&', '#id:hover'],
-      [':hover', '&:hover', ':hover:hover'],
-      [':hover', ':hover&', ':hover:hover'],
-      [':hover', '&::before', ':hover::before'],
-      [':hover', '::before&', '::before:hover'],
-      [':hover', '&:not(.x)', ':hover:not(.x)'],
-      [':hover', ':not(.x)&', ':not(.x):hover'],
-      [':hover', '&[attribute]', ':hover[attribute]'],
-      [':hover', '[attribute]&', '[attribute]:hover'],
-      [':hover', '&*', ':is(:hover)*'], // Invalid CSS
-      [':hover', '*&', ':hover'],
-
-      ['::before', '&element', ':is(::before)element'], // Invalid CSS
-      ['::before', 'element&', 'element::before'],
-      ['::before', '&.class', '::before.class'],
-      ['::before', '.class&', '.class::before'],
-      ['::before', '&#id', '::before#id'],
-      ['::before', '#id&', '#id::before'],
-      ['::before', '&:hover', '::before:hover'],
-      ['::before', ':hover&', ':hover::before'],
-      ['::before', '&::before', '::before::before'],
-      ['::before', '::before&', '::before::before'],
-      ['::before', '&:not(.x)', '::before:not(.x)'],
-      ['::before', ':not(.x)&', ':not(.x)::before'],
-      ['::before', '&[attribute]', '::before[attribute]'],
-      ['::before', '[attribute]&', '[attribute]::before'],
-      ['::before', '&*', ':is(::before)*'], // Invalid CSS
-      ['::before', '*&', '::before'],
-
-      [':not(.x)', '&element', ':is(:not(.x))element'], // Invalid CSS
-      [':not(.x)', 'element&', 'element:not(.x)'],
-      [':not(.x)', '&.class', ':not(.x).class'],
-      [':not(.x)', '.class&', '.class:not(.x)'],
-      [':not(.x)', '&#id', ':not(.x)#id'],
-      [':not(.x)', '#id&', '#id:not(.x)'],
-      [':not(.x)', '&:hover', ':not(.x):hover'],
-      [':not(.x)', ':hover&', ':hover:not(.x)'],
-      [':not(.x)', '&::before', ':not(.x)::before'],
-      [':not(.x)', '::before&', '::before:not(.x)'],
-      [':not(.x)', '&:not(.x)', ':not(.x):not(.x)'],
-      [':not(.x)', ':not(.x)&', ':not(.x):not(.x)'],
-      [':not(.x)', '&[attribute]', ':not(.x)[attribute]'],
-      [':not(.x)', '[attribute]&', '[attribute]:not(.x)'],
-      [':not(.x)', '&*', ':is(:not(.x))*'], // Invalid CSS
-      [':not(.x)', '*&', ':not(.x)'],
-
-      ['[attribute]', '&element', ':is([attribute])element'], // Invalid CSS
-      ['[attribute]', 'element&', 'element[attribute]'],
-      ['[attribute]', '&.class', '[attribute].class'],
-      ['[attribute]', '.class&', '.class[attribute]'],
-      ['[attribute]', '&#id', '[attribute]#id'],
-      ['[attribute]', '#id&', '#id[attribute]'],
-      ['[attribute]', '&:hover', '[attribute]:hover'],
-      ['[attribute]', ':hover&', ':hover[attribute]'],
-      ['[attribute]', '&::before', '[attribute]::before'],
-      ['[attribute]', '::before&', '::before[attribute]'],
-      ['[attribute]', '&:not(.x)', '[attribute]:not(.x)'],
-      ['[attribute]', ':not(.x)&', ':not(.x)[attribute]'],
-      ['[attribute]', '&[attribute]', '[attribute][attribute]'],
-      ['[attribute]', '[attribute]&', '[attribute][attribute]'],
-      ['[attribute]', '&*', ':is([attribute])*'], // Invalid CSS
-      ['[attribute]', '*&', '[attribute]'],
-
-      ['*', '&element', ':is(*)element'], // Invalid CSS
-      ['*', 'element&', 'element:is(*)'],
-      ['*', '&.class', '.class'],
-      ['*', '.class&', '.class:is(*)'], // Optimization: *.class → .class
-      ['*', '&#id', '#id'],
-      ['*', '#id&', '#id:is(*)'], // Optimization: *#id → #id
-      ['*', '&:hover', ':hover'],
-      ['*', ':hover&', ':hover:is(*)'],
-      ['*', '&::before', '::before'],
-      ['*', '::before&', '::before:is(*)'], // Invalid CSS
-      ['*', '&:not(.x)', ':not(.x)'],
-      ['*', ':not(.x)&', ':not(.x):is(*)'], // Optimization: *:not(.x) → :not(.x)
-      ['*', '&[attribute]', '[attribute]'],
-      ['*', '[attribute]&', '[attribute]:is(*)'], // Optimization: *[attribute] → [attribute]
-      ['*', '&*', ':is(*)*'], // Invalid CSS
-      ['*', '*&', '*'],
-
-      ['&', '&element', ':is(:scope)element'], // Invalid CSS
-      ['&', 'element&', 'element:scope'],
-      ['&', '&.class', ':scope.class'],
-      ['&', '.class&', '.class:scope'],
-      ['&', '&#id', ':scope#id'],
-      ['&', '#id&', '#id:scope'],
-      ['&', '&:hover', ':scope:hover'],
-      ['&', ':hover&', ':hover:scope'],
-      ['&', '&::before', ':scope::before'],
-      ['&', '::before&', '::before:scope'],
-      ['&', '&:not(.x)', ':scope:not(.x)'],
-      ['&', ':not(.x)&', ':not(.x):scope'],
-      ['&', '&[attribute]', ':scope[attribute]'],
-      ['&', '[attribute]&', '[attribute]:scope'],
-      ['&', '&*', ':is(:scope)*'], // Invalid CSS
-      ['&', '*&', ':scope'],
-    ])(`'%s { %s }' → '%s' (%#)`, async (root, nested, expected) => {
-      let optimized = optimize(toCss([rule(root, [rule(nested, [decl('--x', '0')])])]))
-      let ast = CSS.parse(optimized)
-
-      let count = 0
-      walk(ast, () => void count++)
-
-      // 1 rule, 1 declaration
-      expect(count).toBe(2)
-
-      if (ast[0].kind !== 'rule') throw new Error('expected a rule')
-      expect(ast[0].selector).toEqual(expected)
-    })
-
-    it('should not remove the `*` namespace from namespaced selectors', () => {
-      expect(
-        optimize(css`
-          .a {
-            & *|div {
-              color: red;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a *|div {
-          color: red;
-        }
-        "
-      `)
-    })
-
-    test('multiple selectors in the list are relative to the parent', async () => {
-      expect(
-        optimize(css`
-          .a,
-          .b {
-            --x: 1;
-            + .c {
-              --x: 2;
-            }
-            &.d {
-              --x: 3;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a, .b {
-          --x: 1;
-          + .c {
-            --x: 2;
-          }
-          &.d {
-            --x: 3;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` multiple times', async () => {
-      expect(
-        optimize(css`
-          .a {
-            & .b & .c & .d {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a .b .a .c .a .d {
-          --x: 1;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` multiple times in a row', async () => {
-      expect(
-        optimize(css`
-          .a {
-            &&& {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a.a.a {
-          --x: 1;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use `&` inside a selector', async () => {
-      expect(
-        optimize(css`
-          .a {
-            :not(&) {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :not(.a) {
-          --x: 1;
-        }
-        "
-      `)
-    })
-
-    it('should be possible to use deeply nested CSS', async () => {
-      expect(
-        optimize(css`
-          .a,
-          .b {
-            --x: 1;
-
-            .c & {
-              --x: 2;
-
-              &:hover,
-              &:focus {
-                --x: 3;
-                .d {
-                  --x: 4;
-                }
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a, .b {
-          --x: 1;
-          .c & {
-            --x: 2;
-            &:hover, &:focus {
-              --x: 3;
-              .d {
-                --x: 4;
-              }
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    it('should properly split rules to guarantee specificity', async () => {
-      expect(
-        optimize(css`
-          .a {
-            --before: 1;
-            &:hover {
-              --inside: 1;
-            }
-            --after: 1;
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .a {
-          --before: 1;
-          &:hover {
-            --inside: 1;
-          }
-          --after: 1;
-        }
-        "
-      `)
-    })
-
-    it.each([
-      ['div', '&', 'div'],
-      ['div', '[before]&', '[before]:is(div)'],
-      ['div', '&[after]', 'div[after]'],
-      ['div', '[before]&[after]', '[before]:is(div)[after]'],
-      ['div', '[before] &', '[before] div'],
-      ['div', '& [after]', 'div [after]'],
-      ['div', '[before] & [after]', '[before] div [after]'],
-
-      ['.parent', '&', '.parent'],
-      ['.parent', '[before]&', '[before].parent'],
-      ['.parent', '&[after]', '.parent[after]'],
-      ['.parent', '[before]&[after]', '[before].parent[after]'],
-      ['.parent', '[before] &', '[before] .parent'],
-      ['.parent', '& [after]', '.parent [after]'],
-      ['.parent', '[before] & [after]', '[before] .parent [after]'],
-
-      ['.a > .b', '&', '.a > .b'],
-      ['.a > .b', '[before]&', '[before]:is(.a > .b)'],
-      ['.a > .b', '&[after]', '.a > .b[after]'],
-      ['.a > .b', '[before]&[after]', '[before]:is(.a > .b)[after]'],
-      ['.a > .b', '[before] &', '[before] :is(.a > .b)'],
-      ['.a > .b', '& [after]', '.a > .b [after]'],
-      ['.a > .b', '[before] & [after]', '[before] :is(.a > .b) [after]'],
-    ])(`should optimize '%s { %s }' → '%s' (%#)`, async (root, nested, expected) => {
-      let optimized = optimize(toCss([rule(root, [rule(nested, [decl('--x', '0')])])]))
-      let ast = CSS.parse(optimized)
-
-      let count = 0
-      walk(ast, () => void count++)
-
-      // 1 rule, 1 declaration
-      expect(count).toBe(2)
-
-      if (ast[0].kind !== 'rule') throw new Error('expected a rule')
-      expect(ast[0].selector).toEqual(expected)
-    })
-
-    it('should hoist at-rules', async () => {
-      expect(
-        optimize(css`
-          @layer utilities {
-            .a,
-            .b {
-              @media (print) {
-                --x: 1;
-                .c {
-                  @media (min-width: 123px) {
-                    --x: 2;
-                  }
-                }
-              }
-            }
-            .d {
-              @media (print) {
-                @media (min-width: 123px) {
-                  --x: 3;
-                }
-              }
-            }
-          }
-          @property --foo {
-            syntax: '*';
-          }
-          @layer utilities {
-            .e {
-              @media (print) {
-                --x: 4;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @media (print) {
-            .a, .b {
-              --x: 1;
-            }
-            @media (min-width: 123px) {
-              :is(.a, .b) .c {
-                --x: 2;
-              }
-              .d {
-                --x: 3;
-              }
-            }
-          }
-        }
-        @property --foo {
-          syntax: '*';
-        }
-        @layer utilities {
-          @media (print) {
-            .e {
-              --x: 4;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    it('should hoist `@scope` at-rules', async () => {
-      expect(
-        optimize(css`
-          @layer utilities {
-            .parent {
-              @in-variant {
-                @scope (.from) to (.to) {
-                  --x: 1;
-                }
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @scope (.from) to (.to) {
-            .parent {
-              --x: 1;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    // We have an optimization where the moment we see a declaration that we
-    // stop handling the nesting and emit everything as-is. This won't work when
-    // we're dealing with `@scope` and we still want to hoist that out.
-    it('should hoist `@scope` at-rules, even when sibling declarations are present', async () => {
-      expect(
-        optimize(css`
-          @layer utilities {
-            .parent {
-              --x: 1;
-              @in-variant {
-                @scope (.from) {
-                  .inside {
-                    --y: 2;
-                  }
-                }
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          .parent {
-            --x: 1;
-          }
-          @scope (.from) {
-            .parent .inside {
-              --y: 2;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    it('should resolve `&` in the `@scope` prelude when hoisting', async () => {
-      // `&` in the `<scope-start>` selector refers to the elements matched by
-      // the nearest ancestor style rule, while `&` in the `<scope-end>`
-      // selector refers to the scoping root.
-      //
-      // See: https://drafts.csswg.org/css-nesting-1/#nesting-at-scope
-      expect(
-        optimize(css`
-          .parent {
-            @scope (& > .scope) to (& .limit) {
-              .content {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.parent > .scope) to (:where(:scope) .limit) {
-          .content {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // Selector lists need `:is(…)` to keep their meaning
-      expect(
-        optimize(css`
-          .parent-a,
-          .parent-b {
-            @scope (& > .from) {
-              .inside {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (:is(.parent-a, .parent-b) > .from) {
-          .inside {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // The `<scope-start>` selector is optional, so the first group in the
-      // prelude is not necessarily the `<scope-start>` selector.
-      expect(
-        optimize(css`
-          .parent {
-            @scope to (& .to) {
-              .inside {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope to (:where(:scope) .to) {
-          .parent .inside {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // The parent selector is substituted with the same logic as the nesting
-      // selector in regular style rules: `:is(…)` is used when substituting the
-      // parent as-is would change the meaning (e.g. a type selector cannot
-      // appear after a class selector in a compound selector), …
-      expect(
-        optimize(css`
-          main {
-            @scope (.card&) {
-              .inside {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.card:is(main)) {
-          .inside {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // … and dropped when the substitution is provably equivalent, even for
-      // complex parent selectors
-      expect(
-        optimize(css`
-          .a .b {
-            @scope (& > .from) {
-              .inside {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.a .b > .from) {
-          .inside {
-            --x: 1;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should wrap bare declarations inside `@scope` in a `&` rule', async () => {
-      // A bug in Lightning CSS causes an error when there are declarations
-      // directly in the `@scope`. To fix this we will ensure a rule with
-      // `:where(:scope)` is available.
-      expect(
-        optimize(css`
-          @scope (.from) to (.to) {
-            --x: 1;
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.from) to (.to) {
-          :where(:scope) {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // When generated by a variant, the declarations resolve against the
-      // parent rule: the `@scope` rule scopes _where the utility applies_
-      // (like nesting `@media` does, and like variants do).
-      //
-      // Note: this deviates from native CSS nesting, where the `<scope-start>`
-      // selector would be relative to `.parent` and the declarations would
-      // apply to the scoping root. User-authored `@scope` rules (without the
-      // `@in-variant` marker) keep those native semantics.
-      expect(
-        optimize(css`
-          .parent {
-            @in-variant {
-              @scope (.from) {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.from) {
-          .parent {
-            --x: 1;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should replace `&` with `:where(:scope)` for rules directly inside `@scope`', async () => {
-      // Inside an `@scope` rule, the nesting selector behaves like
-      // `:where(:scope)` and matches the scoping root with zero specificity.
-      expect(
-        optimize(css`
-          @scope (.from) {
-            & > p {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.from) {
-          :where(:scope) > p {
-            --x: 1;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should handle `&` deeply nested in `@scope` as normal references to a parent', async () => {
-      expect(
-        optimize(css`
-          @scope (.from) {
-            &,
-            .inside {
-              --x: 1;
-
-              &:hover {
-                --x: 2;
-              }
-
-              &:focus {
-                --x: 3;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.from) {
-          :where(:scope), .inside {
-            --x: 1;
-            &:hover {
-              --x: 2;
-            }
-            &:focus {
-              --x: 3;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    it('should compile user-authored `@scope` rules with their native CSS nesting semantics', async () => {
-      // The `<scope-start>` selector is relative to the parent rule (like
-      // nested style rule selectors are), the rules inside are relative to
-      // the scoping root, and `&` refers to the scoping root
-      expect(
-        optimize(css`
-          .parent {
-            @scope (.from) to (.to) {
-              .inside {
-                --x: 1;
-              }
-
-              & > .child {
-                --x: 2;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.parent .from) to (.to) {
-          .inside {
-            --x: 1;
-          }
-          :where(:scope) > .child {
-            --x: 2;
-          }
-        }
-        "
-      `)
-
-      // A trailing `&` makes the parent rule the scoping root: the scoping
-      // roots are `.parent` elements inside `.from` elements
-      expect(
-        optimize(css`
-          .parent {
-            @scope (.from &) to (.to) {
-              .inside {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.from .parent) to (.to) {
-          .inside {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // Bare declarations apply to the scoping root. They are wrapped in a
-      // `:where(:scope)` rule, which is the spec's exact equivalent, because
-      // Lightning CSS drops bare declarations inside `@scope` entirely.
-      expect(
-        optimize(css`
-          .parent {
-            @scope (.from) {
-              --x: 1;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.parent .from) {
-          :where(:scope) {
-            --x: 1;
-          }
-        }
-        "
-      `)
-
-      // Also at the top level
-      expect(
-        optimize(css`
-          @scope (.from) to (.to) {
-            --x: 1;
-
-            .inside {
-              --x: 2;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.from) to (.to) {
-          :where(:scope) {
-            --x: 1;
-          }
-          .inside {
-            --x: 2;
-          }
-        }
-        "
-      `)
-
-      // Every selector in a `<scope-start>` selector list is relative to the
-      // parent rule, whether it uses `&` or not
-      expect(
-        optimize(css`
-          .parent {
-            @scope (.a, & > .b) {
-              .inside {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (.parent .a, .parent > .b) {
-          .inside {
-            --x: 1;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should leave `@property` and `@apply` alone', async () => {
-      expect(
-        optimize(css`
-          .foo {
-            .bar {
-              @apply text-red-500 hover:text-red-600;
-            }
-          }
-
-          .baz {
-            @property --tw-content {
-              syntax: '*';
-              initial-value: '';
-              inherits: false;
-            }
-
-            @property --tw-border-spacing-x {
-              syntax: '<length>';
-              inherits: false;
-              initial-value: 0;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .foo .bar {
-          @apply text-red-500 hover:text-red-600;
-        }
-        .baz {
-          @property --tw-content {
-            syntax: '*';
-            initial-value: '';
-            inherits: false;
-          }
-          @property --tw-border-spacing-x {
-            syntax: '<length>';
-            inherits: false;
-            initial-value: 0;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should merge a body-less @layer with an @layer with the same name that has a body', async () => {
-      expect(
-        optimize(css`
-          @layer a;
-
-          @layer a {
-            @layer b {
-              .x {
-                color: red;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer a {
-          @layer b {
-            .x {
-              color: red;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    it('should not get rid of `:is(…)` when the compound selector is part of a complex selector', async () => {
-      expect(
-        optimize(css`
-          .foo .bar {
-            .system &:focus {
-              --x: 1;
-            }
-          }
-          .foo:hover {
-            .system &:focus {
-              --x: 2;
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .system :is(.foo .bar):focus {
-          --x: 1;
-        }
-        .system .foo:hover:focus {
-          --x: 2;
-        }
-        "
-      `)
-    })
-
-    it('should not dedupe adjacent at-rules with the same prelude but different bodies', async () => {
-      expect(
-        optimize(css`
-          @font-face {
-            font-family: 'A';
-            src: url('/fonts/a.woff2');
-          }
-
-          @font-face {
-            font-family: 'B';
-            src: url('/fonts/b.woff2');
-          }
-
-          @keyframes spin {
-            to {
-              transform: rotate(360deg);
-            }
-          }
-
-          @keyframes spin {
-            to {
-              transform: rotate(-360deg);
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @font-face {
-          font-family: 'A';
-          src: url('/fonts/a.woff2');
-        }
-        @font-face {
-          font-family: 'B';
-          src: url('/fonts/b.woff2');
-        }
-        @keyframes spin {
-          to {
-            transform: rotate(360deg);
-          }
-        }
-        @keyframes spin {
-          to {
-            transform: rotate(-360deg);
-          }
-        }
-        "
-      `)
-    })
+    if (node.kind === 'at-rule') replaceWith(node.nodes)
   })
 })
+
+it('should only visit children once when calling `replaceWith` with multi-element array', () => {
+  let visited = new Set()
+
+  let ast = [
+    atRule('@media', '', [
+      context({}, [
+        styleRule('.foo', [decl('color', 'red')]),
+        styleRule('.baz', [decl('color', 'blue')]),
+      ]),
+    ]),
+    styleRule('.bar', [decl('color', 'green')]),
+  ]
+
+  walk(ast, (node, { replaceWith }) => {
+    let key = id(node)
+    if (visited.has(key)) {
+      throw new Error('Visited node twice')
+    }
+    visited.add(key)
+
+    if (node.kind === 'at-rule') replaceWith(node.nodes)
+  })
+
+  expect(visited).toMatchInlineSnapshot(`
+    Set {
+      "@media ",
+      ".foo",
+      "color: red",
+      ".baz",
+      "color: blue",
+      ".bar",
+      "color: green",
+    }
+  `)
+})
+
+it('should never visit children when calling `replaceWith` with `WalkAction.Skip`', () => {
+  let visited = new Set()
+
+  let inner = styleRule('.foo', [decl('color', 'blue')])
+
+  let ast = [atRule('@media', '', [inner]), styleRule('.bar', [decl('color', 'blue')])]
+
+  walk(ast, (node, { replaceWith }) => {
+    visited.add(node)
+
+    if (node.kind === 'at-rule') {
+      replaceWith(node.nodes)
+      return WalkAction.Skip
+    }
+  })
+
+  expect(visited).not.toContain(inner)
+  expect(visited).toMatchInlineSnapshot(`
+    Set {
+      {
+        "kind": "at-rule",
+        "name": "@media",
+        "nodes": [
+          {
+            "kind": "rule",
+            "nodes": [
+              {
+                "important": false,
+                "kind": "declaration",
+                "property": "color",
+                "value": "blue",
+              },
+            ],
+            "selector": ".foo",
+          },
+        ],
+        "params": "",
+      },
+      {
+        "kind": "rule",
+        "nodes": [
+          {
+            "important": false,
+            "kind": "declaration",
+            "property": "color",
+            "value": "blue",
+          },
+        ],
+        "selector": ".bar",
+      },
+      {
+        "important": false,
+        "kind": "declaration",
+        "property": "color",
+        "value": "blue",
+      },
+    }
+  `)
+})
+
+it('should skip the correct number of children based on the the replaced children nodes', () => {
+  {
+    let ast = [
+      decl('--index', '0'),
+      decl('--index', '1'),
+      decl('--index', '2'),
+      decl('--index', '3'),
+      decl('--index', '4'),
+    ]
+    let visited: string[] = []
+    walk(ast, (node, { replaceWith }) => {
+      visited.push(id(node))
+      if (node.kind === 'declaration' && node.value === '2') {
+        replaceWith([])
+        return WalkAction.Skip
+      }
+    })
+
+    expect(visited).toMatchInlineSnapshot(`
+      [
+        "--index: 0",
+        "--index: 1",
+        "--index: 2",
+        "--index: 3",
+        "--index: 4",
+      ]
+    `)
+  }
+
+  {
+    let ast = [
+      decl('--index', '0'),
+      decl('--index', '1'),
+      decl('--index', '2'),
+      decl('--index', '3'),
+      decl('--index', '4'),
+    ]
+    let visited: string[] = []
+    walk(ast, (node, { replaceWith }) => {
+      visited.push(id(node))
+      if (node.kind === 'declaration' && node.value === '2') {
+        replaceWith([])
+        return WalkAction.Continue
+      }
+    })
+
+    expect(visited).toMatchInlineSnapshot(`
+      [
+        "--index: 0",
+        "--index: 1",
+        "--index: 2",
+        "--index: 3",
+        "--index: 4",
+      ]
+    `)
+  }
+
+  {
+    let ast = [
+      decl('--index', '0'),
+      decl('--index', '1'),
+      decl('--index', '2'),
+      decl('--index', '3'),
+      decl('--index', '4'),
+    ]
+    let visited: string[] = []
+    walk(ast, (node, { replaceWith }) => {
+      visited.push(id(node))
+      if (node.kind === 'declaration' && node.value === '2') {
+        replaceWith([decl('--index', '2.1')])
+        return WalkAction.Skip
+      }
+    })
+
+    expect(visited).toMatchInlineSnapshot(`
+      [
+        "--index: 0",
+        "--index: 1",
+        "--index: 2",
+        "--index: 3",
+        "--index: 4",
+      ]
+    `)
+  }
+
+  {
+    let ast = [
+      decl('--index', '0'),
+      decl('--index', '1'),
+      decl('--index', '2'),
+      decl('--index', '3'),
+      decl('--index', '4'),
+    ]
+    let visited: string[] = []
+    walk(ast, (node, { replaceWith }) => {
+      visited.push(id(node))
+      if (node.kind === 'declaration' && node.value === '2') {
+        replaceWith([decl('--index', '2.1')])
+        return WalkAction.Continue
+      }
+    })
+
+    expect(visited).toMatchInlineSnapshot(`
+      [
+        "--index: 0",
+        "--index: 1",
+        "--index: 2",
+        "--index: 2.1",
+        "--index: 3",
+        "--index: 4",
+      ]
+    `)
+  }
+
+  {
+    let ast = [
+      decl('--index', '0'),
+      decl('--index', '1'),
+      decl('--index', '2'),
+      decl('--index', '3'),
+      decl('--index', '4'),
+    ]
+    let visited: string[] = []
+    walk(ast, (node, { replaceWith }) => {
+      visited.push(id(node))
+      if (node.kind === 'declaration' && node.value === '2') {
+        replaceWith([decl('--index', '2.1'), decl('--index', '2.2')])
+        return WalkAction.Skip
+      }
+    })
+
+    expect(visited).toMatchInlineSnapshot(`
+      [
+        "--index: 0",
+        "--index: 1",
+        "--index: 2",
+        "--index: 3",
+        "--index: 4",
+      ]
+    `)
+  }
+
+  {
+    let ast = [
+      decl('--index', '0'),
+      decl('--index', '1'),
+      decl('--index', '2'),
+      decl('--index', '3'),
+      decl('--index', '4'),
+    ]
+    let visited: string[] = []
+    walk(ast, (node, { replaceWith }) => {
+      visited.push(id(node))
+      if (node.kind === 'declaration' && node.value === '2') {
+        replaceWith([decl('--index', '2.1'), decl('--index', '2.2')])
+        return WalkAction.Continue
+      }
+    })
+
+    expect(visited).toMatchInlineSnapshot(`
+      [
+        "--index: 0",
+        "--index: 1",
+        "--index: 2",
+        "--index: 2.1",
+        "--index: 2.2",
+        "--index: 3",
+        "--index: 4",
+      ]
+    `)
+  }
+})
+
+function id(node: AstNode) {
+  switch (node.kind) {
+    case 'at-rule':
+      return `${node.name} ${node.params}`
+    case 'rule':
+      return node.selector
+    case 'context':
+      return '<context>'
+    case 'at-root':
+      return '<at-root>'
+    case 'declaration':
+      return `${node.property}: ${node.value}`
+    case 'comment':
+      return `// ${node.value}`
+    default:
+      node satisfies never
+      throw new Error('Unknown node kind')
+  }
+}
diff --git a/packages/tailwindcss/src/ast.ts b/packages/tailwindcss/src/ast.ts
index 09c3ea051..e13e19743 100644
--- a/packages/tailwindcss/src/ast.ts
+++ b/packages/tailwindcss/src/ast.ts
@@ -1,25 +1,15 @@
-import { Polyfills } from '.'
-import * as SelectorParser from '../src/selector-parser'
 import { parseAtRule } from './css-parser'
 import type { DesignSystem } from './design-system'
-import type { Source, SourceLocation } from './source-maps/source'
 import { Theme, ThemeOptions } from './theme'
 import { DefaultMap } from './utils/default-map'
-import { segment } from './utils/segment'
 import { extractUsedVariables } from './utils/variables'
-import * as ValueParser from './value-parser'
-import { walk, WalkAction, type VisitContext } from './walk'
 
 const AT_SIGN = 0x40
-const PIPE = 0x7c
 
 export type StyleRule = {
   kind: 'rule'
   selector: string
   nodes: AstNode[]
-
-  src?: SourceLocation
-  dst?: SourceLocation
 }
 
 export type AtRule = {
@@ -27,9 +17,6 @@ export type AtRule = {
   name: string
   params: string
   nodes: AstNode[]
-
-  src?: SourceLocation
-  dst?: SourceLocation
 }
 
 export type Declaration = {
@@ -37,34 +24,22 @@ export type Declaration = {
   property: string
   value: string | undefined
   important: boolean
-
-  src?: SourceLocation
-  dst?: SourceLocation
 }
 
 export type Comment = {
   kind: 'comment'
   value: string
-
-  src?: SourceLocation
-  dst?: SourceLocation
 }
 
 export type Context = {
   kind: 'context'
   context: Record<string, string | boolean>
   nodes: AstNode[]
-
-  src?: undefined
-  dst?: undefined
 }
 
 export type AtRoot = {
   kind: 'at-root'
   nodes: AstNode[]
-
-  src?: undefined
-  dst?: undefined
 }
 
 export type Rule = StyleRule | AtRule
@@ -126,122 +101,177 @@ export function atRoot(nodes: AstNode[]): AtRoot {
   }
 }
 
-export function cloneAstNode<T extends AstNode>(node: T): T {
-  switch (node.kind) {
-    case 'rule':
-      return {
-        kind: node.kind,
-        selector: node.selector,
-        nodes: node.nodes.map(cloneAstNode),
-        src: node.src,
-        dst: node.dst,
-      } satisfies StyleRule as T
+export const enum WalkAction {
+  /** Continue walking, which is the default */
+  Continue,
 
-    case 'at-rule':
-      return {
-        kind: node.kind,
-        name: node.name,
-        params: node.params,
-        nodes: node.nodes.map(cloneAstNode),
-        src: node.src,
-        dst: node.dst,
-      } satisfies AtRule as T
+  /** Skip visiting the children of this node */
+  Skip,
 
-    case 'at-root':
-      return {
-        kind: node.kind,
-        nodes: node.nodes.map(cloneAstNode),
-        src: node.src,
-        dst: node.dst,
-      } satisfies AtRoot as T
+  /** Stop the walk entirely */
+  Stop,
+}
 
-    case 'context':
-      return {
-        kind: node.kind,
-        context: { ...node.context },
-        nodes: node.nodes.map(cloneAstNode),
-        src: node.src,
-        dst: node.dst,
-      } satisfies Context as T
+export function walk(
+  ast: AstNode[],
+  visit: (
+    node: AstNode,
+    utils: {
+      parent: AstNode | null
+      replaceWith(newNode: AstNode | AstNode[]): void
+      context: Record<string, string | boolean>
+      path: AstNode[]
+    },
+  ) => void | WalkAction,
+  path: AstNode[] = [],
+  context: Record<string, string | boolean> = {},
+) {
+  for (let i = 0; i < ast.length; i++) {
+    let node = ast[i]
+    let parent = path[path.length - 1] ?? null
 
-    case 'declaration':
-      return {
-        kind: node.kind,
-        property: node.property,
-        value: node.value,
-        important: node.important,
-        src: node.src,
-        dst: node.dst,
-      } satisfies Declaration as T
+    // We want context nodes to be transparent in walks. This means that
+    // whenever we encounter one, we immediately walk through its children and
+    // furthermore we also don't update the parent.
+    if (node.kind === 'context') {
+      if (walk(node.nodes, visit, path, { ...context, ...node.context }) === WalkAction.Stop) {
+        return WalkAction.Stop
+      }
+      continue
+    }
 
-    case 'comment':
-      return {
-        kind: node.kind,
-        value: node.value,
-        src: node.src,
-        dst: node.dst,
-      } satisfies Comment as T
+    path.push(node)
+    let replacedNode = false
+    let replacedNodeOffset = 0
+    let status =
+      visit(node, {
+        parent,
+        context,
+        path,
+        replaceWith(newNode) {
+          if (replacedNode) return
+          replacedNode = true
 
-    default:
-      node satisfies never
-      throw new Error(`Unknown node kind: ${(node as any).kind}`)
+          if (Array.isArray(newNode)) {
+            if (newNode.length === 0) {
+              ast.splice(i, 1)
+              replacedNodeOffset = 0
+            } else if (newNode.length === 1) {
+              ast[i] = newNode[0]
+              replacedNodeOffset = 1
+            } else {
+              ast.splice(i, 1, ...newNode)
+              replacedNodeOffset = newNode.length
+            }
+          } else {
+            ast[i] = newNode
+            replacedNodeOffset = 1
+          }
+        },
+      }) ?? WalkAction.Continue
+    path.pop()
+
+    // We want to visit or skip the newly replaced node(s), which start at the
+    // current index (i). By decrementing the index here, the next loop will
+    // process this position (containing the replaced node) again.
+    if (replacedNode) {
+      if (status === WalkAction.Continue) {
+        i--
+      } else {
+        i += replacedNodeOffset - 1
+      }
+      continue
+    }
+
+    // Stop the walk entirely
+    if (status === WalkAction.Stop) return WalkAction.Stop
+
+    // Skip visiting the children of this node
+    if (status === WalkAction.Skip) continue
+
+    if ('nodes' in node) {
+      path.push(node)
+      let result = walk(node.nodes, visit, path, context)
+      path.pop()
+
+      if (result === WalkAction.Stop) {
+        return WalkAction.Stop
+      }
+    }
   }
 }
 
-export function cssContext(
-  ctx: VisitContext<AstNode>,
-): VisitContext<AstNode> & { context: Record<string, string | boolean> } {
-  return {
-    depth: ctx.depth,
-    index: ctx.index,
-    siblings: ctx.siblings,
-    get context() {
-      let context: Record<string, string | boolean> = {}
-      for (let child of ctx.path()) {
-        if (child.kind === 'context') {
-          Object.assign(context, child.context)
+// This is a depth-first traversal of the AST
+export function walkDepth(
+  ast: AstNode[],
+  visit: (
+    node: AstNode,
+    utils: {
+      parent: AstNode | null
+      path: AstNode[]
+      context: Record<string, string | boolean>
+      replaceWith(newNode: AstNode[]): void
+    },
+  ) => void,
+  path: AstNode[] = [],
+  context: Record<string, string | boolean> = {},
+) {
+  for (let i = 0; i < ast.length; i++) {
+    let node = ast[i]
+    let parent = path[path.length - 1] ?? null
+
+    if (node.kind === 'rule' || node.kind === 'at-rule') {
+      path.push(node)
+      walkDepth(node.nodes, visit, path, context)
+      path.pop()
+    } else if (node.kind === 'context') {
+      walkDepth(node.nodes, visit, path, { ...context, ...node.context })
+      continue
+    }
+
+    path.push(node)
+    visit(node, {
+      parent,
+      context,
+      path,
+      replaceWith(newNode) {
+        if (Array.isArray(newNode)) {
+          if (newNode.length === 0) {
+            ast.splice(i, 1)
+          } else if (newNode.length === 1) {
+            ast[i] = newNode[0]
+          } else {
+            ast.splice(i, 1, ...newNode)
+          }
+        } else {
+          ast[i] = newNode
         }
-      }
 
-      // Once computed, we never need to compute this again
-      Object.defineProperty(this, 'context', { value: context })
-      return context
-    },
-    get parent() {
-      let parent = (this.path().pop() as Extract<AstNode, { nodes: AstNode[] }>) ?? null
-
-      // Once computed, we never need to compute this again
-      Object.defineProperty(this, 'parent', { value: parent })
-      return parent
-    },
-    path() {
-      return ctx.path().filter((n) => n.kind !== 'context')
-    },
+        // Skip over the newly inserted nodes (being depth-first it doesn't make sense to visit them)
+        i += newNode.length - 1
+      },
+    })
+    path.pop()
   }
 }
 
 // Optimize the AST for printing where all the special nodes that require custom
 // handling are handled such that the printing is a 1-to-1 transformation.
-export function optimizeAst(
-  ast: AstNode[],
-  designSystem: DesignSystem,
-  polyfills: Polyfills = Polyfills.All,
-) {
+export function optimizeAst(ast: AstNode[], designSystem: DesignSystem) {
   let atRoots: AstNode[] = []
   let seenAtProperties = new Set<string>()
-  let cssThemeVariables = new DefaultMap<AstNode[], Set<Declaration>>(() => new Set())
-  let colorMixDeclarations = new DefaultMap<AstNode[], Set<Declaration>>(() => new Set())
+  let cssThemeVariables = new DefaultMap<
+    Extract<AstNode, { nodes: AstNode[] }>['nodes'],
+    Set<Declaration>
+  >(() => new Set())
   let keyframes = new Set<AtRule>()
   let usedKeyframeNames = new Set()
 
-  let propertyFallbacksRoot: Declaration[] = []
-  let propertyFallbacksUniversal: Declaration[] = []
-
   let variableDependencies = new DefaultMap<string, Set<string>>(() => new Set())
 
   function transform(
     node: AstNode,
-    parent: AstNode[],
+    parent: Extract<AstNode, { nodes: AstNode[] }>['nodes'],
     context: Record<string, string | boolean> = {},
     depth = 0,
   ) {
@@ -280,20 +310,8 @@ export function optimizeAst(
 
       // Track used animation names
       if (node.property === 'animation') {
-        for (let keyframeName of extractKeyframeNames(node.value)) {
+        for (let keyframeName of extractKeyframeNames(node.value))
           usedKeyframeNames.add(keyframeName)
-        }
-      }
-
-      // Create fallback values for usages of the `color-mix(…)` function that reference variables
-      // found in the theme config.
-      if (
-        polyfills & Polyfills.ColorMix &&
-        !context.supportsColorMix &&
-        !context.keyframes &&
-        node.value.includes('color-mix(')
-      ) {
-        colorMixDeclarations.get(parent).add(node)
       }
 
       parent.push(node)
@@ -301,14 +319,26 @@ export function optimizeAst(
 
     // Rule
     else if (node.kind === 'rule') {
-      let nodes: AstNode[] = []
-
-      for (let child of node.nodes) {
-        transform(child, nodes, context, depth + 1)
+      // Rules with `&` as the selector should be flattened
+      if (node.selector === '&') {
+        for (let child of node.nodes) {
+          let nodes: AstNode[] = []
+          transform(child, nodes, context, depth + 1)
+          if (nodes.length > 0) {
+            parent.push(...nodes)
+          }
+        }
       }
 
-      if (nodes.length > 0) {
-        parent.push({ ...node, nodes })
+      //
+      else {
+        let copy = { ...node, nodes: [] }
+        for (let child of node.nodes) {
+          transform(child, copy.nodes, context, depth + 1)
+        }
+        if (copy.nodes.length > 0) {
+          parent.push(copy)
+        }
       }
     }
 
@@ -319,32 +349,6 @@ export function optimizeAst(
         return
       }
 
-      // Collect fallbacks for `@property` rules for Firefox support We turn these into rules on
-      // `:root` or `*` and some pseudo-elements based on the value of `inherits`
-      if (polyfills & Polyfills.AtProperty) {
-        let property = node.params
-        let initialValue = null
-        let inherits = false
-
-        for (let prop of node.nodes) {
-          if (prop.kind !== 'declaration') continue
-          if (prop.property === 'initial-value') {
-            initialValue = prop.value
-          } else if (prop.property === 'inherits') {
-            inherits = prop.value === 'true'
-          }
-        }
-
-        let fallback = decl(property, initialValue ?? 'initial')
-        fallback.src = node.src
-
-        if (inherits) {
-          propertyFallbacksRoot.push(fallback)
-        } else {
-          propertyFallbacksUniversal.push(fallback)
-        }
-      }
-
       seenAtProperties.add(node.params)
 
       let copy = { ...node, nodes: [] }
@@ -358,8 +362,6 @@ export function optimizeAst(
     else if (node.kind === 'at-rule') {
       if (node.name === '@keyframes') {
         context = { ...context, keyframes: true }
-      } else if (node.name === '@supports' && node.params.includes('color-mix(')) {
-        context = { ...context, supportsColorMix: true }
       }
 
       let copy = { ...node, nodes: [] }
@@ -367,7 +369,8 @@ export function optimizeAst(
         transform(child, copy.nodes, context, depth + 1)
       }
 
-      // Only track `@keyframes` that could be removed, when they were defined inside of a `@theme`.
+      // Only track `@keyframes` that could be removed, when they were defined
+      // inside of a `@theme`.
       if (node.name === '@keyframes' && context.theme) {
         keyframes.add(copy)
       }
@@ -378,8 +381,7 @@ export function optimizeAst(
         copy.name === '@charset' ||
         copy.name === '@custom-media' ||
         copy.name === '@namespace' ||
-        copy.name === '@import' ||
-        copy.name === '@apply'
+        copy.name === '@import'
       ) {
         parent.push(copy)
       }
@@ -401,21 +403,6 @@ export function optimizeAst(
       // Remove reference imports from printing
       if (node.context.reference) {
         return
-      }
-
-      // Preserve context nodes that track the source of their subtree (variant
-      // bodies and the user content slotted into them), so `handleNesting`
-      // knows whether to compose `@scope` rules with the variant semantics or
-      // their native CSS nesting semantics
-      else if (node.context.source) {
-        let copy = { ...node, nodes: [] as AstNode[] }
-        for (let child of node.nodes) {
-          transform(child, copy.nodes, { ...context, ...node.context }, depth)
-        }
-
-        if (copy.nodes.length > 0) {
-          parent.push(copy)
-        }
       } else {
         for (let child of node.nodes) {
           transform(child, parent, { ...context, ...node.context }, depth)
@@ -504,1146 +491,10 @@ export function optimizeAst(
     }
   }
 
-  newAst = newAst.concat(atRoots)
-
-  // Fallbacks
-  // Create fallback values for usages of the `color-mix(…)` function that reference variables
-  // found in the theme config.
-  if (polyfills & Polyfills.ColorMix) {
-    for (let [parent, declarations] of colorMixDeclarations) {
-      for (let declaration of declarations) {
-        let idx = parent.indexOf(declaration)
-        // If the declaration is no longer present, we don't need to create a polyfill anymore
-        if (idx === -1 || declaration.value == null) continue
-
-        let ast = ValueParser.parse(declaration.value)
-        let requiresPolyfill = false
-        walk(ast, (node) => {
-          if (node.kind !== 'function' || node.value !== 'color-mix') return
-
-          let containsUnresolvableVars = false
-          let containsCurrentcolor = false
-          walk(node.nodes, (node) => {
-            if (node.kind == 'word' && node.value.toLowerCase() === 'currentcolor') {
-              containsCurrentcolor = true
-              requiresPolyfill = true
-              return
-            }
-
-            let varNode: ValueParser.ValueAstNode | null = node
-            let inlinedColor: string | null = null
-            let seenVariables = new Set<string>()
-            do {
-              if (varNode.kind !== 'function' || varNode.value !== 'var') return
-              let firstChild = varNode.nodes[0]
-              if (!firstChild || firstChild.kind !== 'word') return
-
-              let variableName = firstChild.value
-
-              if (seenVariables.has(variableName)) {
-                containsUnresolvableVars = true
-                return
-              }
-
-              seenVariables.add(variableName)
-
-              requiresPolyfill = true
-
-              inlinedColor = designSystem.theme.resolveValue(null, [firstChild.value as any])
-              if (!inlinedColor) {
-                containsUnresolvableVars = true
-                return
-              }
-              if (inlinedColor.toLowerCase() === 'currentcolor') {
-                containsCurrentcolor = true
-                return
-              }
-
-              if (inlinedColor.startsWith('var(')) {
-                let subAst = ValueParser.parse(inlinedColor)
-                varNode = subAst[0]
-              } else {
-                varNode = null
-              }
-            } while (varNode)
-
-            return WalkAction.Replace({ kind: 'word', value: inlinedColor } as const)
-          })
-
-          if (containsUnresolvableVars || containsCurrentcolor) {
-            let separatorIndex = node.nodes.findIndex(
-              (node) => node.kind === 'separator' && node.value.trim().includes(','),
-            )
-            if (separatorIndex === -1) return
-            let firstColorValue =
-              node.nodes.length > separatorIndex ? node.nodes[separatorIndex + 1] : null
-            if (!firstColorValue) return
-            return WalkAction.Replace(firstColorValue)
-          } else if (requiresPolyfill) {
-            // Change the colorspace to `srgb` since the fallback values should not be represented as
-            // `oklab(…)` functions again as their support in Safari <16 is very limited.
-            let colorspace = node.nodes[2]
-            if (
-              colorspace.kind === 'word' &&
-              (colorspace.value === 'oklab' ||
-                colorspace.value === 'oklch' ||
-                colorspace.value === 'lab' ||
-                colorspace.value === 'lch')
-            ) {
-              colorspace.value = 'srgb'
-            }
-          }
-        })
-        if (!requiresPolyfill) continue
-
-        let fallback = {
-          ...declaration,
-          value: ValueParser.toCss(ast),
-        }
-        let colorMixQuery = rule('@supports (color: color-mix(in lab, red, red))', [declaration])
-        colorMixQuery.src = declaration.src
-        parent.splice(idx, 1, fallback, colorMixQuery)
-      }
-    }
-  }
-
-  if (polyfills & Polyfills.AtProperty) {
-    let fallbackAst = []
-
-    if (propertyFallbacksRoot.length > 0) {
-      let wrapper = rule(':root, :host', propertyFallbacksRoot)
-      wrapper.src = propertyFallbacksRoot[0].src
-      fallbackAst.push(wrapper)
-    }
-
-    if (propertyFallbacksUniversal.length > 0) {
-      let wrapper = rule('*, ::before, ::after, ::backdrop', propertyFallbacksUniversal)
-      wrapper.src = propertyFallbacksUniversal[0].src
-      fallbackAst.push(wrapper)
-    }
-
-    if (fallbackAst.length > 0) {
-      // Insert an empty `@layer properties;` at the beginning of the document. We need to place it
-      // after eventual external imports as `lightningcss` would otherwise move the content into the
-      // same place.
-      let firstValidNodeIndex = newAst.findIndex((node) => {
-        // License comments
-        if (node.kind === 'comment') return false
-
-        if (node.kind === 'at-rule') {
-          // Charset
-          if (node.name === '@charset') return false
-
-          // External imports
-          if (node.name === '@import') return false
-        }
-
-        return true
-      })
-
-      let layerPropertiesStatement = atRule('@layer', 'properties', [])
-      layerPropertiesStatement.src = fallbackAst[0].src
-
-      newAst.splice(
-        firstValidNodeIndex < 0 ? newAst.length : firstValidNodeIndex,
-        0,
-        layerPropertiesStatement,
-      )
-
-      let block = rule('@layer properties', [
-        atRule(
-          '@supports',
-          // We can't write a supports query for `@property` directly so we have to test for
-          // features that are added around the same time in Mozilla and Safari.
-          '((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b))))',
-          fallbackAst,
-        ),
-      ])
-
-      block.src = fallbackAst[0].src
-      block.nodes[0].src = fallbackAst[0].src
-
-      newAst.push(block)
-    }
-  }
-
-  return handleNesting(newAst)
+  return newAst.concat(atRoots)
 }
 
-export function handleNesting(ast: AstNode[]): AstNode[] {
-  let parseSelectorCache = new DefaultMap(SelectorParser.parse)
-
-  // Nodes with an `@scope` rule somewhere in their subtree. These cannot use
-  // the "emit as-is" fast path for rules containing declarations, because
-  // `@scope` rules change meaning when they stay nested inside a style rule and
-  // must go through the hoisting machinery instead.
-  let containsAtScope = new Set<AstNode>()
-  {
-    function scan(nodes: AstNode[]): boolean {
-      let found = false
-      for (let node of nodes) {
-        if (node.kind === 'declaration' || node.kind === 'comment') continue
-
-        if (scan(node.nodes) || (node.kind === 'at-rule' && node.name === '@scope')) {
-          containsAtScope.add(node)
-          found = true
-        }
-      }
-      return found
-    }
-    scan(ast)
-  }
-
-  // Track `rule` selectors as we go
-  let selectorStack: [
-    selector: string,
-    src: SourceLocation | undefined,
-    dst: SourceLocation | undefined,
-  ][] = []
-
-  // Track `at-rule` information as we go. Tracking this separately from the
-  // selector stack for rules such that we can hoist this above all the rules.
-  let atRuleStack: [
-    name: string,
-    params: string,
-    src: SourceLocation | undefined,
-    dst: SourceLocation | undefined,
-  ][] = []
-
-  // The current "nodes" we can push to
-  let nodes = null as AstNode[] | null
-
-  // Optimization: Track the declaration properties we've seen in the current
-  // nodes.
-  let seenDeclarationProperties = new Set<string>()
-
-  // Track nodes lists where we want to dedupe declarations
-  let dedupeDeclarationsInNodes = new Set<AstNode[]>()
-
-  // The final, new AST
-  let result: AstNode[] = []
-
-  // Track whether we should skip a node in the `exit` phase
-  let skipExit = new Set<AstNode>()
-
-  // Track the source of the subtree we are currently in. Variant bodies are
-  // wrapped in a `context` node with `source: 'variant'`, and the user content
-  // slotted into them is wrapped in `source: 'user'`. `@scope` rules whose
-  // nearest source is a variant are hoisted with the variant semantics, all
-  // other `@scope` rules use their native CSS nesting semantics.
-  let sourceStack: (string | boolean)[] = []
-
-  // Selector stacks that are masked while inside an `@scope` rule whose
-  // `<scope-start>` selector consumed the parent selector via `&`.
-  //
-  // Once the parent selector is part of the `<scope-start>` selector, the rules
-  // inside the `@scope` are relative to the scoping root, not to the parent
-  // rule. Selectors in scoped style rules only match elements in scope, and the
-  // parent matches ancestors of the scoping root, so prefixing the rules with
-  // the parent selector would make them match nothing at all.
-  //
-  // E.g.:
-  //
-  // ```css
-  // .parent {
-  //   @scope (& > .scope) {
-  //     .content {
-  //       color: red;
-  //     }
-  //   }
-  // }
-  // ```
-  //
-  // becomes:
-  //
-  // ```css
-  // @scope (.parent > .scope) {
-  //   .content { /* ← not `.parent .content` */
-  //     color: red;
-  //   }
-  // }
-  // ```
-  let maskedSelectorStacks = new Map<AstNode, typeof selectorStack>()
-
-  walk(ast, {
-    enter(node) {
-      switch (node.kind) {
-        case 'rule': {
-          nodes = null // Start a new level
-
-          // First time we see a rule
-          if (selectorStack.length === 0) {
-            // A rule with a selector containing `&` should replace the `&` with
-            // `:scope` if there is no parent rule.
-            //
-            // Note: there could be false positives when the `&` is escaped or
-            // part of a string inside an attribute selector. But the
-            // SelectorParser will take care of that.
-            if (node.selector.includes('&')) {
-              // Inside an `@scope` rule, the nesting selector behaves like
-              // `:where(:scope)` and matches the scoping root with zero
-              // specificity. E.g.:
-              //
-              // ```css
-              // @scope (.checkout) {
-              //   & > p {
-              //     color: red;
-              //   }
-              // }
-              // ```
-              //
-              // becomes:
-              //
-              // ```css
-              // @scope (.checkout) {
-              //   :where(:scope) > p {
-              //     color: red;
-              //   }
-              // }
-              // ```
-              //
-              // See: https://drafts.csswg.org/css-nesting-1/#nesting-at-scope
-              let replacement = atRuleStack.some(([name]) => name === '@scope')
-                ? ':where(:scope)'
-                : ':scope'
-
-              let ast = SelectorParser.parse(node.selector)
-              let changed = false
-
-              walk(ast, (node) => {
-                if (node.kind === 'selector' && node.value === '&') {
-                  changed = true
-                  node.value = replacement
-                }
-              })
-
-              if (changed) {
-                selectorStack.push([SelectorParser.toCss(ast), node.src, node.dst])
-              } else {
-                selectorStack.push([node.selector, node.src, node.dst])
-              }
-            }
-
-            // No nesting markers, track as-is
-            else {
-              selectorStack.push([node.selector, node.src, node.dst])
-            }
-          }
-
-          // Nested rule, ensure `&` is present in each selector. Then track the
-          // selector.
-          else {
-            // A rule with just `&` can be replaced by its children. Let's
-            // ignore this node and keep walking its children.
-            if (node.selector === '&') {
-              skipExit.add(node)
-              return
-            }
-
-            let lastSelector = selectorStack[selectorStack.length - 1][0]
-            let selector = segment(node.selector, ',')
-              .map((selector) => substituteNestingSelector(selector, lastSelector))
-              .join(', ')
-            selectorStack.push([selector, node.src, node.dst])
-          }
-
-          // Once we hit a rule that has at least one declaration, then we can
-          // stop handling the nested selectors.
-          //
-          // This ensures that browser devtools can at least show _something_
-          // for a given rule. This also means that we can leverage CSS nesting
-          // which is better for gzip results due to increased repetition.
-          //
-          // E.g.:
-          //
-          // ```css
-          // .a {
-          //   &[b] {
-          //     color: red;
-          //     &:hover {
-          //       color: blue;
-          //     }
-          //   }
-          // }
-          // ```
-          //
-          // ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
-          //
-          // ```css
-          // .a[b] {          /* ← flattened */
-          //   color: red;    /* ← saw a declaration, therefore */
-          //   &:hover {      /* ← we keep this nested syntax */
-          //     color: blue;
-          //   }
-          // }
-          // ```
-          //
-          // The exception is when the rule contains an `@scope` rule somewhere,
-          // because it must go through the normal hoisting machinery instead.
-          // See `containsAtScope` for more details.
-          if (
-            node.nodes.some((child) => child.kind === 'declaration') &&
-            !containsAtScope.has(node)
-          ) {
-            // Emitting each child instead of the node itself because we do want
-            // to flatten the current node and its selector that is already
-            // pushed to the stack.
-            for (let child of node.nodes) emit(child)
-            return WalkAction.Skip
-          }
-          break
-        }
-
-        case 'at-rule': {
-          nodes = null // Start a new level
-
-          // `@layer` is hoistable, but when it's empty then we have to make
-          // sure that we still emit it because this might influence the layer
-          // order. We can't just get rid of it.
-          if (node.nodes.length === 0 && !DROPPABLE_IF_EMPTY_AT_RULES.has(node.name)) {
-            emit(node)
-            skipExit.add(node)
-            return WalkAction.Skip
-          }
-
-          // Hoist at-rules
-          else if (HOISTABLE_AT_RULES.has(node.name)) {
-            let params = node.params
-
-            // `@scope` is the only hoistable at-rule with selectors in its
-            // prelude, and the only one that changes meaning when it stays
-            // nested inside a style rule. Resolve the prelude and its contents
-            // before hoisting, using one of two composition modes:
-            //
-            // 1. Variant-generated `@scope` rules attach the parent selector
-            //    (the utility) to the rules _inside_ the scope:
-            //
-            //    ```css
-            //    .scoped\:underline {
-            //      @scope (.from) to (.to) {
-            //        text-decoration-line: underline;
-            //      }
-            //    }
-            //    ```
-            //
-            //    becomes:
-            //
-            //    ```css
-            //    @scope (.from) to (.to) {
-            //      .scoped\:underline {
-            //        text-decoration-line: underline;
-            //      }
-            //    }
-            //    ```
-            //    This way the utility is properly sandwiched between the
-            //    `.from` and `.to` boundaries.
-            //
-            // 2. User-authored `@scope` rules keep their native CSS nesting
-            //    semantics: the `<scope-start>` selector is relative to the parent
-            //    rule, and the rules inside are relative to the scoping root:
-            //
-            //    ```css
-            //    .parent {
-            //      @scope (.from) {
-            //        color: red;
-            //      }
-            //    }
-            //    ```
-            //
-            //    becomes:
-            //
-            //    ```css
-            //    @scope (.parent .from) {
-            //      :where(:scope) {
-            //        color: red;
-            //      }
-            //    }
-            //    ```
-            //
-            //    In a perfect world we leave this alone, but Lightning CSS
-            //    seems to incorrectly transform this into a version where the
-            //    `.parent` class is gone entirely:
-            //
-            //    ```css
-            //    @scope (.from) {
-            //      color: red;
-            //    }
-            //    ```
-            //
-            // See: https://drafts.csswg.org/css-nesting-1/#nesting-at-scope
-            if (node.name === '@scope') {
-              let isVariant = sourceStack[sourceStack.length - 1] === 'variant'
-              let hasParent = selectorStack.length > 0
-
-              // Lightning CSS bug: This snippet will error
-              //
-              // ```css
-              // @scope {
-              //   --x: 1;
-              // }
-              // ```
-              //
-              // We will wrap these bare-declarations in a `&` rule to fix the crash:
-              // ```css
-              // @scope {
-              //   & {
-              //     --x: 1;
-              //   }
-              // }
-              // ```
-              {
-                let queue: (AtRule | Context)[] = [node]
-
-                for (let parent of queue) {
-                  let newNodes: AstNode[] = []
-                  let group: AstNode[] | null = null
-
-                  for (let child of parent.nodes) {
-                    if (child.kind === 'context') queue.push(child)
-
-                    if (child.kind === 'declaration' || child.kind === 'comment') {
-                      if (group === null) {
-                        group = []
-                        newNodes.push(styleRule('&', group))
-                      }
-                      group.push(child)
-                    } else {
-                      group = null
-                      newNodes.push(child)
-                    }
-                  }
-
-                  parent.nodes = newNodes
-                }
-              }
-
-              if (params.includes('&') || (!isVariant && hasParent)) {
-                // The selector to substitute for `&` in the `<scope-start>`
-                // selector: the elements matched by the nearest ancestor style
-                // rule, or `:scope` when there is none.
-                let parentSelector = hasParent ? selectorStack[selectorStack.length - 1][0] : null
-
-                let paramsAst = ValueParser.parse(params)
-
-                // Whether the current `(…)` group is a `<scope-end>` selector.
-                //
-                // ```css
-                // @scope (.from) to (.to)
-                //        ^^^^^^^           scope-start (optional)
-                //                   ^^^^^  scope-end
-                //
-                // @scope to (.to)
-                //           ^^^^^          scope-end
-                // ```
-                let isScopeEnd = false
-
-                // Whether the `<scope-start>` selector consumed the parent
-                // selector
-                let consumedParent = false
-
-                for (let paramNode of paramsAst) {
-                  if (paramNode.kind === 'word' && paramNode.value === 'to') {
-                    isScopeEnd = true
-                    continue
-                  }
-
-                  // A `(…)` group parses as a function call without a name
-                  if (paramNode.kind !== 'function' || paramNode.value !== '') continue
-
-                  let selector = ValueParser.toCss(paramNode.nodes)
-
-                  // A user-authored `<scope-start>` selector is relative to the
-                  // parent rule, and resolves exactly like nested style rule
-                  // selectors do: `&` refers to the elements matched by the
-                  // parent rule, and selectors without `&` are prefixed with
-                  // it.
-                  if (!isScopeEnd && !isVariant && parentSelector !== null) {
-                    paramNode.nodes = [
-                      ValueParser.word(
-                        segment(selector, ',')
-                          .map((part) => substituteNestingSelector(part.trim(), parentSelector))
-                          .join(', '),
-                      ),
-                    ]
-                    consumedParent = true
-                  }
-
-                  // Otherwise, only an explicit `&` is resolved. In the
-                  // `<scope-start>` selector, `&` refers to the elements
-                  // matched by the nearest ancestor style rule (or `:scope`
-                  // when there is none). In the `<scope-end>` selector, `&`
-                  // refers to the scoping root and behaves like
-                  // `:where(:scope)`.
-                  else if (selector.includes('&')) {
-                    let replacement = isScopeEnd ? ':where(:scope)' : (parentSelector ?? ':scope')
-
-                    paramNode.nodes = [
-                      ValueParser.word(substituteNestingSelector(selector, replacement)),
-                    ]
-                    if (!isScopeEnd && hasParent) consumedParent = true
-                  }
-                }
-
-                params = ValueParser.toCss(paramsAst)
-
-                // Mask the selector stack for the `@scope` rule's subtree, so
-                // its rules resolve like top-level rules within the scope (and
-                // `&` resolves to `:where(:scope)`). The stack is restored in
-                // the exit phase. See `maskedSelectorStacks` for more details.
-                if (consumedParent) {
-                  maskedSelectorStacks.set(node, selectorStack)
-                  selectorStack = []
-                }
-              }
-            }
-
-            atRuleStack.push([node.name, params, node.src, node.dst])
-          }
-
-          // If we can't hoist them, emit them immediately as-is
-          else {
-            emit(node)
-            skipExit.add(node)
-            return WalkAction.Skip
-          }
-          break
-        }
-
-        case 'declaration':
-        case 'comment': {
-          emit(node)
-          break
-        }
-
-        case 'context':
-          if (node.context.source) sourceStack.push(node.context.source)
-          break
-
-        case 'at-root':
-          break
-
-        default:
-          node satisfies never
-          break
-      }
-    },
-    exit(node) {
-      if (skipExit.delete(node)) return
-
-      switch (node.kind) {
-        case 'rule': {
-          nodes = null
-          selectorStack.pop()
-          break
-        }
-
-        case 'at-rule': {
-          nodes = null
-          atRuleStack.pop()
-
-          // Restore the selector stack that was masked by this `@scope` rule
-          let maskedSelectorStack = maskedSelectorStacks.get(node)
-          if (maskedSelectorStack) {
-            selectorStack = maskedSelectorStack
-            maskedSelectorStacks.delete(node)
-          }
-          break
-        }
-
-        case 'context':
-          if (node.context.source) sourceStack.pop()
-          break
-
-        case 'declaration':
-        case 'comment':
-        case 'at-root':
-          break
-
-        default:
-          node satisfies never
-          break
-      }
-    },
-  })
-
-  // Dedupe declarations that we've already seen before if they match the
-  // `property`, `value` and `important` information.
-  {
-    for (let nodes of dedupeDeclarationsInNodes) {
-      let seen = new Set()
-      for (let i = nodes.length - 1; i >= 0; --i) {
-        let node = nodes[i]
-        if (node.kind !== 'declaration') continue
-
-        let id = `${node.property}\0${node.value}\0${node.important}`
-
-        if (seen.has(id)) nodes.splice(i, 1)
-        else seen.add(id)
-      }
-    }
-  }
-
-  return result
-
-  function emit(node: AstNode) {
-    // Existing nodes are available, emit into those nodes
-    if (nodes) {
-      // Optimization: track used declarations in the current node.
-      if (node.kind === 'declaration') {
-        if (seenDeclarationProperties.has(node.property)) {
-          dedupeDeclarationsInNodes.add(nodes)
-        } else {
-          seenDeclarationProperties.add(node.property)
-        }
-      }
-
-      nodes.push(node)
-      return
-    }
-
-    // Nothing available, setup a fresh node
-    {
-      // There are no parent rules or at-rules available, which means that we
-      // can emit the node as-is.
-      if (selectorStack.length === 0 && atRuleStack.length === 0) {
-        let target = result
-        let lastNode = target[target.length - 1]
-
-        // Optimization: when the current and last node are the same, ignore the
-        // new node entirely otherwise we will get unnecessary duplicate
-        // results.
-        //
-        // We only care about at-rules with no body because some of them (such
-        // as `@charset` or `@layer`) need to be emitted. A normal rule that's
-        // empty doesn't need to be emitted. At-rules _with_ a body (such as
-        // `@font-face` or `@keyframes`) can share the same prelude while
-        // containing different bodies, so they must all be emitted.
-        if (
-          lastNode &&
-          lastNode.kind === 'at-rule' &&
-          node.kind === 'at-rule' &&
-          lastNode.nodes.length === 0 &&
-          node.nodes.length === 0 &&
-          lastNode.name === node.name &&
-          lastNode.params === node.params
-        ) {
-          return
-        }
-
-        result.push(node)
-        return
-      }
-
-      // Track the new "parent" nodes
-      {
-        nodes = [node]
-
-        // Clear out seen declarations from the previous work in progress nodes
-        seenDeclarationProperties.clear()
-
-        // Track new declaration
-        if (node.kind === 'declaration') {
-          seenDeclarationProperties.add(node.property)
-        }
-      }
-
-      // Track the new root node that we build up to store in the final AST
-      let root = null as AstNode | null
-
-      let target = result
-      let atRuleOffset = 0
-
-      // Optimization: merge adjacent at-rules
-      //
-      // Figure out whether we can push our new node into a previous node that
-      // was already emitted.
-      //
-      // We have to make sure that the order stays the same, so therefore we
-      // only ever have to look at the last node that was emitted.
-      {
-        let lastNode = target[target.length - 1]
-        if (lastNode && lastNode.kind === 'at-rule') {
-          for (let i = 0; i < atRuleStack.length; i++) {
-            let atRule = atRuleStack[i]
-            if (!lastNode) break
-            if (lastNode.kind !== 'at-rule') break
-            if (lastNode.name !== atRule[0]) break
-            if (lastNode.params !== atRule[1]) break
-
-            atRuleOffset++
-            target = lastNode.nodes
-            lastNode = lastNode.nodes[lastNode.nodes.length - 1]
-          }
-        }
-      }
-
-      // Build up the rule
-      if (selectorStack.length > 0) {
-        let [selector, src, dst] = selectorStack[selectorStack.length - 1]
-
-        // Optimization: merge adjacent rules with the same selector
-        //
-        // Figure out whether we can push into an existing rule.
-        //
-        // If we have some at-rules that we have to keep into account, then we
-        // definitely can't.
-        if (atRuleStack.length - atRuleOffset <= 0) {
-          let lastNode = target[target.length - 1]
-          if (lastNode && lastNode.kind === 'rule' && lastNode.selector === selector) {
-            lastNode.nodes.push(...nodes)
-
-            // Ensure that our current nodes points to the nodes of the
-            // `lastNode`, otherwise we will lose information.
-            nodes = lastNode.nodes
-
-            // We appended a group that could contain declarations already in the
-            // existing rule, so let the final dedupe pass handle it once.
-            //
-            // Note: we could loop over _all_ previous nodes to figure out if we
-            // really want to dedupe this. But this could result in a bunch of
-            // duplicate work if we have `n` nodes that we want to merge
-            // together.
-            dedupeDeclarationsInNodes.add(nodes)
-
-            // We know that we don't have to handle any more at-rules, so we can
-            // bail early since we just merged the nodes with the same selector.
-            return
-          }
-        }
-
-        // Can't push into existing node, create a new node
-        root = rule(selector, nodes)
-        if (src || dst) Object.assign(root, { src, dst })
-      }
-
-      // Wrap in at-rules, if we can push into an existing node then we can
-      // ignore `offset` amount of nodes since the `root`/`nodes` will already
-      // point to a nested node.
-      for (let i = atRuleStack.length - 1; i >= atRuleOffset; --i) {
-        let [name, params, src, dst] = atRuleStack[i]
-
-        root = atRule(name, params, root ? [root] : nodes)
-        if (src || dst) Object.assign(root, { src, dst })
-      }
-
-      // Track the root node in the AST
-      if (root) {
-        target.push(root)
-      }
-
-      // We didn't build up any new root, so we can move our node directly into
-      // the target. This can happen when we emit a node that is not a
-      // declaration or a comment.
-      else {
-        target.push(...nodes)
-      }
-    }
-  }
-
-  // Substitutes the `&` selector with the parent selector with `:is(…)` semantics.
-  //
-  // If the `&` is not found, we will prepend it using a descendant combinator.
-  // E.g.: `& ${selector}` → `${parentSelector} ${selector}`
-  //
-  // In some situations we can get rid of the `:is(…)` wrapper, but only if it's safe to do so.
-  function substituteNestingSelector(selector: string, parentSelector: string): string {
-    // Slow path: we need to replace the `&` with the parent selector. A simple
-    // `replaceAll(…)` won't work because a `&` could be escaped, or could be
-    // part of an attribute selector.
-    //
-    // Much safer to parse the selector and replace the `&` that way
-    if (selector.includes('&')) {
-      let ast = SelectorParser.parse(selector)
-      let changed = false
-      walk(ast, {
-        enter(node, ctx) {
-          if (node.kind !== 'selector' || node.value !== '&') return
-
-          changed = true
-
-          // Safest option: use `is(…)` semantics when substituting `&` for the
-          // parent selector.
-          node.value = `:is(${parentSelector})`
-
-          // We should always have a parent, so this shouldn't happen
-          if (ctx.parent === null) return
-
-          // Optimizations:
-          let parentAst = parseSelectorCache.get(parentSelector)
-
-          // 1. If we're dealing with multiple selectors, then we know that the
-          //    `:is(…)` needs to stay. Nothing to optimize.
-          if (parentAst.length === 1 && parentAst[0].kind === 'list') {
-            return // Keep `:is(…)` semantics
-          }
-
-          // 2. We know that `&` is standalone when it's inside of a complex
-          //    selector. E.g. `[before] & [after]`
-          if (ctx.parent.kind === 'complex') {
-            // `& [after]`
-            //
-            // `:is(…)` semantics are not required, because these are equivalent:
-            //
-            // - `:is(div) [after]`       → `div [after]`
-            // - `:is(.x) [after]`        → `.x [after]`
-            // - `:is([before]) [after]`  → `[before] [after]`
-            // - `:is(.a > .b) [after]`   → `.a > .b [after]`
-            if (ctx.index === 0) {
-              node.value = parentSelector
-              return
-            }
-
-            // `[before] &`
-            //
-            // `:is(…)` semantics are required if we're dealing with a complex
-            // parent selector. Otherwise the meaning of the selector could
-            // change:
-            //
-            // - `[before] :is(div)`      → `[before] div`
-            // - `[before] :is(.x)`       → `[before] .x`
-            // - `[before] :is([after])`  → `[before] [after]`
-            // - `[before] :is(.a > .b)`  → `[before] :is(.a > .b)` (!)
-            else if (ctx.index === ctx.siblings.length - 1) {
-              if (parentAst[0].kind === 'complex') {
-                return // Keep `:is(…)` semantics
-              }
-
-              node.value = parentSelector
-              return
-            }
-
-            // `[before] & [after]`
-            //
-            // `:is(…)` semantics are required if we're dealing with a complex
-            // parent selector. Otherwise the meaning of the selector could
-            // change:
-            //
-            // - `[before] :is(div) [after]`      → `[before] div [after]`
-            // - `[before] :is(.x) [after]`       → `[before] .x [after]`
-            // - `[before] :is(.a > .b) [after]`  → `[before] :is(.a > .b) [after]` (!)
-            else {
-              if (parentAst[0].kind === 'complex') {
-                return // Keep `:is(…)` semantics
-              }
-
-              node.value = parentSelector
-              return
-            }
-          }
-
-          // 3. We know that `&` is attached to some other selector when it's
-          //    inside of a compound selector.
-          //
-          //    E.g. `[before]&[after]`
-          //
-          //    We have to be careful that our parent, when it's part of a complex
-          //    selector, that the same rules apply
-          //
-          //    E.g.: `[before] &[after]`
-          //                    ^          current node
-          //                    ^^^^^^^^   compound selector
-          //           ^^^^^^^^^^^^^^^^^   complex selector
-          //
-          else if (ctx.parent.kind === 'compound') {
-            if (parentAst[0].kind === 'complex') {
-              let path = ctx.path()
-              let grandParent = path[path.length - 2]
-
-              // When our compound parent is part of a complex selector, and it's
-              // not the very first node, then we can't safely get rid of the
-              // `:is(…)` if the last selector is a complex selector as well,
-              // unless the `&` maps to a single selector or compound selector.
-              //
-              // ```css
-              // .foo .bar {            /* Complex selector */
-              //   .system &:focus {    /* Complex selector + compound selecto*/
-              //     --x: 1;
-              //   }
-              // }
-              // .foo:hover {           /* Compound selector */
-              //   .system &:focus {    /* Complex selector + compound selector */
-              //     --x: 2;
-              //   }
-              // }
-              // ```
-              //
-              // ↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
-              //
-              // ```css
-              // .system :is(.foo .bar):focus { /* Cannot drop the `:is(…)`, otherwise `.system` and `.foo` can be swapped in the DOM */
-              //   --x: 1;
-              // }
-              // .system .foo:hover:focus {
-              //   --x: 2;
-              // }
-              // ```
-              if (
-                grandParent &&
-                grandParent.kind === 'complex' &&
-                grandParent.nodes[0] !== ctx.parent
-              ) {
-                return // Keep `:is(…)` semantics
-              }
-            }
-
-            // `&*` and `&div` are invalid CSS so these should stay invalid. They
-            // should be written as `*&` and `div&` instead.
-            if (
-              ctx.siblings
-                .slice(ctx.index + 1)
-                .some(
-                  (sibling) =>
-                    SelectorParser.isUniversalSelector(sibling) ||
-                    SelectorParser.isTypeSelector(sibling),
-                )
-            ) {
-              return // Keep `:is(…)` semantics
-            }
-
-            // `&[after]`
-            //
-            // `:is(…)` semantics are not required, because these are equivalent:
-            //
-            // - `:is(div)[after]`       → `div[after]`
-            // - `:is(.x)[after]`        → `.x[after]`
-            // - `:is([before])[after]`  → `[before][after]`
-            // - `:is(.a > .b)[after]`   → `.a > .b[after]`
-            if (ctx.index === 0) {
-              node.value = parentSelector
-              return
-            }
-
-            // `[before]&`
-            //
-            // `:is(…)` semantics are required if we're dealing with a
-            //
-            // - complex parent selector, to prevent changing the meaning of the selector
-            // - a universal selector, because `*` needs to be first
-            // - a type selector, because `div` needs to be first
-            //
-            // - `[before]:is(div)`      → `[before]:is(div)` (!)
-            // - `[before]:is(*)`        → `[before]:is(*)` (!)
-            // - `[before]:is(.a > .b)`  → `[before]:is(.a > .b)` (!)
-            // - `[before]:is(.x)`       → `[before].x`
-            else if (ctx.index === ctx.siblings.length - 1) {
-              if (
-                parentAst[0].kind === 'complex' ||
-                SelectorParser.isUniversalSelector(parentAst[0]) ||
-                SelectorParser.isTypeSelector(parentAst[0])
-              ) {
-                return // Keep `:is(…)` semantics
-              }
-
-              node.value = parentSelector
-              return
-            }
-
-            // `[before]&[after]`
-            //
-            // `:is(…)` semantics are required if we're dealing with a
-            //
-            // - complex parent selector, to prevent changing the meaning of the selector
-            // - a universal selector, because `*` needs to be first
-            // - a type selector, because `div` needs to be first
-            //
-            // - `[before]:is(div)[after]`      → `[before]:is(div)[after]` (!)
-            // - `[before]:is(*)[after]`        → `[before]:is(*)[after]` (!)
-            // - `[before]:is(.a > .b)[after]`  → `[before]:is(.a > .b)[after]` (!)
-            // - `[before]:is(.x)[after]`       → `[before].x[after]`
-            else {
-              if (
-                parentAst[0].kind === 'complex' ||
-                SelectorParser.isUniversalSelector(parentAst[0]) ||
-                SelectorParser.isTypeSelector(parentAst[0])
-              ) {
-                return // Keep `:is(…)` semantics
-              }
-
-              node.value = parentSelector
-              return
-            }
-          }
-
-          // 4. When the current node is a function argument (e.g. `:not(&))`,
-          //    then we can drop the `:is(…)` entirely.
-          //
-          //    The only exception is when the parent has multiple selectors
-          //    because then we would introduce multiple arguments. Multiple
-          //    selectors are already handled.
-          else if (ctx.parent.kind === 'function') {
-            node.value = parentSelector
-            return
-          }
-        },
-        exit(node, ctx) {
-          // Optimization: We can remove the universal selector `*` if they are
-          // part of a compound selector. E.g.:
-          //
-          // - `*:hover` → `:hover`
-          // - `*[attribute]` → `[attribute]`
-          //
-          // Except when the `*` is a namespace, e.g.: `*|div`, because `*|div`
-          // (any namespace) and `|div` (no namespace) have different meanings.
-          if (
-            ctx.index === 0 &&
-            ctx.siblings.length > 1 &&
-            ctx.parent?.kind === 'compound' &&
-            SelectorParser.isUniversalSelector(node)
-          ) {
-            let next = ctx.siblings[1]
-            if (next.kind === 'selector' && next.value.charCodeAt(0) === PIPE) {
-              return
-            }
-            return WalkAction.ReplaceSkip([])
-          }
-        },
-      })
-
-      if (changed) return SelectorParser.toCss(ast)
-    }
-
-    // Fast path: we know there isn't an `&` so we can prepend the parent
-    // selector immediately.
-    let parentAst = parseSelectorCache.get(parentSelector)
-    return `${parentAst.length === 1 && parentAst[0].kind === 'list' ? `:is(${parentSelector})` : parentSelector} ${selector}`
-  }
-}
-
-// A set of at-rules that can be hoisted to the top without any repercussions.
-// Typically at-rules that rely on the environment, not parent information and
-// contain other rules/declarations.
-const HOISTABLE_AT_RULES = new Set([
-  '@container',
-  '@layer',
-  '@media',
-  '@page',
-  '@scope',
-  '@starting-style',
-  '@supports',
-  '@view-transition',
-])
-
-// A set of at-rules that can be dropped if they don't contain any nodes. We
-// don't have the distinction between an at-rule with no body, or an at-rule
-// with a body that is empty right now.
-const DROPPABLE_IF_EMPTY_AT_RULES = new Set([
-  '@container',
-  '@media',
-  '@page',
-  '@scope',
-  '@starting-style',
-  '@supports',
-  '@view-transition',
-])
-
-export function toCss(ast: AstNode[], track?: boolean) {
-  let pos = 0
-
-  let source: Source = {
-    file: null,
-    code: '',
-  }
-
+export function toCss(ast: AstNode[]) {
   function stringify(node: AstNode, depth = 0): string {
     let css = ''
     let indent = '  '.repeat(depth)
@@ -1651,70 +502,15 @@ export function toCss(ast: AstNode[], track?: boolean) {
     // Declaration
     if (node.kind === 'declaration') {
       css += `${indent}${node.property}: ${node.value}${node.important ? ' !important' : ''};\n`
-
-      if (track) {
-        // indent
-        pos += indent.length
-
-        // node.property
-        let start = pos
-        pos += node.property.length
-
-        // `: `
-        pos += 2
-
-        // node.value
-        pos += node.value?.length ?? 0
-
-        // !important
-        if (node.important) {
-          pos += 11
-        }
-
-        let end = pos
-
-        // `;\n`
-        pos += 2
-
-        node.dst = [source, start, end]
-      }
     }
 
     // Rule
     else if (node.kind === 'rule') {
       css += `${indent}${node.selector} {\n`
-
-      if (track) {
-        // indent
-        pos += indent.length
-
-        // node.selector
-        let start = pos
-        pos += node.selector.length
-
-        // ` `
-        pos += 1
-
-        let end = pos
-        node.dst = [source, start, end]
-
-        // `{\n`
-        pos += 2
-      }
-
       for (let child of node.nodes) {
         css += stringify(child, depth + 1)
       }
-
       css += `${indent}}\n`
-
-      if (track) {
-        // indent
-        pos += indent.length
-
-        // `}\n`
-        pos += 2
-      }
     }
 
     // AtRule
@@ -1727,97 +523,22 @@ export function toCss(ast: AstNode[], track?: boolean) {
       // @layer base, components, utilities;
       // ```
       if (node.nodes.length === 0) {
-        let css = `${indent}${node.name} ${node.params};\n`
-
-        if (track) {
-          // indent
-          pos += indent.length
-
-          // node.name
-          let start = pos
-          pos += node.name.length
-
-          // ` `
-          pos += 1
-
-          // node.params
-          pos += node.params.length
-          let end = pos
-
-          // `;\n`
-          pos += 2
-
-          node.dst = [source, start, end]
-        }
-
-        return css
+        return `${indent}${node.name} ${node.params};\n`
       }
 
       css += `${indent}${node.name}${node.params ? ` ${node.params} ` : ' '}{\n`
-
-      if (track) {
-        // indent
-        pos += indent.length
-
-        // node.name
-        let start = pos
-        pos += node.name.length
-
-        if (node.params) {
-          // ` `
-          pos += 1
-
-          // node.params
-          pos += node.params.length
-        }
-
-        // ` `
-        pos += 1
-
-        let end = pos
-        node.dst = [source, start, end]
-
-        // `{\n`
-        pos += 2
-      }
-
       for (let child of node.nodes) {
         css += stringify(child, depth + 1)
       }
-
       css += `${indent}}\n`
-
-      if (track) {
-        // indent
-        pos += indent.length
-
-        // `}\n`
-        pos += 2
-      }
     }
 
     // Comment
     else if (node.kind === 'comment') {
       css += `${indent}/*${node.value}*/\n`
-
-      if (track) {
-        // indent
-        pos += indent.length
-
-        // The comment itself. We do this instead of just the inside because
-        // it seems more useful to have the entire comment span tracked.
-        let start = pos
-        pos += 2 + node.value.length + 2
-        let end = pos
-
-        node.dst = [source, start, end]
-
-        // `\n`
-        pos += 1
-      }
     }
 
-    // These should've been handled already by `optimizeAst` which
+    // These should've been handled already by `prepareAstForPrinting` which
     // means we can safely ignore them here. We return an empty string
     // immediately to signal that something went wrong.
     else if (node.kind === 'context' || node.kind === 'at-root') {
@@ -1835,20 +556,20 @@ export function toCss(ast: AstNode[], track?: boolean) {
   let css = ''
 
   for (let node of ast) {
-    css += stringify(node, 0)
+    let result = stringify(node)
+    if (result !== '') {
+      css += result
+    }
   }
 
-  source.code = css
-
   return css
 }
 
 function findNode(ast: AstNode[], fn: (node: AstNode) => boolean): AstNode[] | null {
   let foundPath: AstNode[] = []
-  walk(ast, (node, ctx) => {
+  walk(ast, (node, { path }) => {
     if (fn(node)) {
-      foundPath = ctx.path()
-      foundPath.push(node)
+      foundPath = [...path]
       return WalkAction.Stop
     }
   })
diff --git a/packages/tailwindcss/src/at-import.test.ts b/packages/tailwindcss/src/at-import.test.ts
index a19123105..32a203d51 100644
--- a/packages/tailwindcss/src/at-import.test.ts
+++ b/packages/tailwindcss/src/at-import.test.ts
@@ -1,13 +1,37 @@
 import dedent from 'dedent'
 import { expect, test, vi } from 'vitest'
+import type { Plugin } from './compat/plugin-api'
 import { compile, type Config } from './index'
 import plugin from './plugin'
-import { compileCss, run } from './test-utils/run'
+import { optimizeCss } from './test-utils/run'
 
 const css = dedent
 
+async function run(
+  css: string,
+  {
+    loadStylesheet = () => Promise.reject(new Error('Unexpected stylesheet')),
+    loadModule = () => Promise.reject(new Error('Unexpected module')),
+    candidates = [],
+    optimize = true,
+  }: {
+    loadStylesheet?: (id: string, base: string) => Promise<{ content: string; base: string }>
+    loadModule?: (
+      id: string,
+      base: string,
+      resourceHint: 'plugin' | 'config',
+    ) => Promise<{ module: Config | Plugin; base: string }>
+    candidates?: string[]
+    optimize?: boolean
+  },
+) {
+  let compiler = await compile(css, { base: '/root', loadStylesheet, loadModule })
+  let result = compiler.build(candidates)
+  return optimize ? optimizeCss(result) : result
+}
+
 test('can resolve relative @imports', async () => {
-  async function loadStylesheet(id: string, base: string) {
+  let loadStylesheet = async (id: string, base: string) => {
     expect(base).toBe('/root')
     expect(id).toBe('./foo/bar.css')
     return {
@@ -17,20 +41,18 @@ test('can resolve relative @imports', async () => {
         }
       `,
       base: '/root/foo',
-      path: '',
     }
   }
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import './foo/bar.css';
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    .foo {
+  ).resolves.toMatchInlineSnapshot(`
+    ".foo {
       color: red;
     }
     "
@@ -38,14 +60,13 @@ test('can resolve relative @imports', async () => {
 })
 
 test('can recursively resolve relative @imports', async () => {
-  async function loadStylesheet(id: string, base: string) {
+  let loadStylesheet = async (id: string, base: string) => {
     if (base === '/root' && id === './foo/bar.css') {
       return {
         content: css`
           @import './bar/baz.css';
         `,
         base: '/root/foo',
-        path: '',
       }
     } else if (base === '/root/foo' && id === './bar/baz.css') {
       return {
@@ -55,23 +76,21 @@ test('can recursively resolve relative @imports', async () => {
           }
         `,
         base: '/root/foo/bar',
-        path: '',
       }
     }
 
     throw new Error(`Unexpected import: ${id}`)
   }
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import './foo/bar.css';
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    .baz {
+  ).resolves.toMatchInlineSnapshot(`
+    ".baz {
       color: #00f;
     }
     "
@@ -83,56 +102,52 @@ let exampleCSS = css`
     color: red;
   }
 `
-async function loadStylesheet(id: string) {
+let loadStylesheet = async (id: string) => {
   if (!id.endsWith('example.css')) throw new Error('Unexpected import: ' + id)
   return {
     content: exampleCSS,
     base: '/root',
-    path: '',
   }
 }
 
 test('extracts path from @import nodes', async () => {
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css';
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    a {
+  ).resolves.toMatchInlineSnapshot(`
+    "a {
       color: red;
     }
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import './example.css';
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    a {
+  ).resolves.toMatchInlineSnapshot(`
+    "a {
       color: red;
     }
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import '/example.css';
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    a {
+  ).resolves.toMatchInlineSnapshot(`
+    "a {
       color: red;
     }
     "
@@ -140,96 +155,71 @@ test('extracts path from @import nodes', async () => {
 })
 
 test('url() imports are passed-through', async () => {
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import url('example.css');
       `,
-      { base: '/root', loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')) },
+      { loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')), optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @import "example.css";
-    "
-  `)
+  ).resolves.toMatchInlineSnapshot(`"@import url('example.css');"`)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import url('./example.css');
       `,
-      { base: '/root', loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')) },
+      { loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')), optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @import "./example.css";
-    "
-  `)
+  ).resolves.toMatchInlineSnapshot(`"@import url('./example.css');"`)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import url('/example.css');
       `,
-      { base: '/root', loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')) },
+      { loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')), optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @import "/example.css";
-    "
-  `)
+  ).resolves.toMatchInlineSnapshot(`"@import url('/example.css');"`)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import url(example.css);
       `,
-      { base: '/root', loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')) },
+      { loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')), optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @import "example.css";
-    "
-  `)
+  ).resolves.toMatchInlineSnapshot(`"@import url(example.css);"`)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import url(./example.css);
       `,
-      { base: '/root', loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')) },
+      { loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')), optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @import "./example.css";
-    "
-  `)
+  ).resolves.toMatchInlineSnapshot(`"@import url(./example.css);"`)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import url(/example.css);
       `,
-      { base: '/root', loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')) },
+      { loadStylesheet: () => Promise.reject(new Error('Unexpected stylesheet')), optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @import "/example.css";
-    "
-  `)
+  ).resolves.toMatchInlineSnapshot(`"@import url(/example.css);"`)
 })
 
 test('handles case-insensitive @import directive', async () => {
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css';
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    a {
+  ).resolves.toMatchInlineSnapshot(`
+    "a {
       color: red;
     }
     "
@@ -237,16 +227,15 @@ test('handles case-insensitive @import directive', async () => {
 })
 
 test('@media', async () => {
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' print;
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @media print {
+  ).resolves.toMatchInlineSnapshot(`
+    "@media print {
       a {
         color: red;
       }
@@ -254,16 +243,15 @@ test('@media', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' print, screen;
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @media print, screen {
+  ).resolves.toMatchInlineSnapshot(`
+    "@media print, screen {
       a {
         color: red;
       }
@@ -271,16 +259,15 @@ test('@media', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' screen and (orientation: landscape);
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @media screen and (orientation: landscape) {
+  ).resolves.toMatchInlineSnapshot(`
+    "@media screen and (orientation: landscape) {
       a {
         color: red;
       }
@@ -288,16 +275,15 @@ test('@media', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' foo(bar);
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet, optimize: false },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @media foo(bar) {
+  ).resolves.toMatchInlineSnapshot(`
+    "@media foo(bar) {
       a {
         color: red;
       }
@@ -307,16 +293,15 @@ test('@media', async () => {
 })
 
 test('@supports', async () => {
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' supports(display: grid);
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @supports (display: grid) {
+  ).resolves.toMatchInlineSnapshot(`
+    "@supports (display: grid) {
       a {
         color: red;
       }
@@ -324,17 +309,16 @@ test('@supports', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' supports(display: grid) screen and (max-width: 400px);
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @supports (display: grid) {
-      @media screen and (max-width: 400px) {
+  ).resolves.toMatchInlineSnapshot(`
+    "@supports (display: grid) {
+      @media screen and (width <= 400px) {
         a {
           color: red;
         }
@@ -343,18 +327,17 @@ test('@supports', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' supports((not (display: grid)) and (display: flex)) screen and
           (max-width: 400px);
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @supports (not (display: grid)) and (display: flex) {
-      @media screen and (max-width: 400px) {
+  ).resolves.toMatchInlineSnapshot(`
+    "@supports (not (display: grid)) and (display: flex) {
+      @media screen and (width <= 400px) {
         a {
           color: red;
         }
@@ -363,18 +346,17 @@ test('@supports', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       // prettier-ignore
       css`
         @import 'example.css'
         supports((selector(h2 > p)) and (font-tech(color-COLRv1)));
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @supports selector(h2 > p) and font-tech(color-COLRv1) {
+  ).resolves.toMatchInlineSnapshot(`
+    "@supports selector(h2 > p) and font-tech(color-COLRv1) {
       a {
         color: red;
       }
@@ -384,16 +366,15 @@ test('@supports', async () => {
 })
 
 test('@layer', async () => {
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' layer(utilities);
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer utilities {
+  ).resolves.toMatchInlineSnapshot(`
+    "@layer utilities {
       a {
         color: red;
       }
@@ -401,16 +382,15 @@ test('@layer', async () => {
     "
   `)
 
-  expect(
-    await compileCss(
+  await expect(
+    run(
       css`
         @import 'example.css' layer();
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer {
+  ).resolves.toMatchInlineSnapshot(`
+    "@layer {
       a {
         color: red;
       }
@@ -421,14 +401,12 @@ test('@layer', async () => {
 
 test('supports theme(reference) imports', async () => {
   expect(
-    await run(
-      ['text-red-500'],
+    run(
       css`
         @tailwind utilities;
         @import 'example.css' theme(reference);
       `,
       {
-        base: '/root',
         loadStylesheet: () =>
           Promise.resolve({
             content: css`
@@ -437,13 +415,12 @@ test('supports theme(reference) imports', async () => {
               }
             `,
             base: '',
-            path: '',
           }),
+        candidates: ['text-red-500'],
       },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    .text-red-500 {
+  ).resolves.toMatchInlineSnapshot(`
+    ".text-red-500 {
       color: var(--color-red-500, red);
     }
     "
@@ -451,27 +428,27 @@ test('supports theme(reference) imports', async () => {
 })
 
 test('updates the base when loading modules inside nested files', async () => {
-  async function loadStylesheet() {
-    return {
+  let loadStylesheet = () =>
+    Promise.resolve({
       content: css`
         @config './nested-config.js';
         @plugin './nested-plugin.js';
       `,
       base: '/root/foo',
-      path: '',
-    }
-  }
-  using loadModule = vi.fn().mockResolvedValue({ base: '', path: '', module: () => {} })
+    })
+  let loadModule = vi.fn().mockResolvedValue({ base: '', module: () => {} })
 
   expect(
-    await compileCss(
-      css`
-        @import './foo/bar.css';
-        @config './root-config.js';
-        @plugin './root-plugin.js';
-      `,
-      { base: '/root', loadStylesheet, loadModule },
-    ),
+    (
+      await run(
+        css`
+          @import './foo/bar.css';
+          @config './root-config.js';
+          @plugin './root-plugin.js';
+        `,
+        { loadStylesheet, loadModule },
+      )
+    ).trim(),
   ).toBe('')
 
   expect(loadModule).toHaveBeenNthCalledWith(1, './nested-config.js', '/root/foo', 'config')
@@ -481,15 +458,13 @@ test('updates the base when loading modules inside nested files', async () => {
 })
 
 test('emits the right base for @source directives inside nested files', async () => {
-  async function loadStylesheet() {
-    return {
+  let loadStylesheet = () =>
+    Promise.resolve({
       content: css`
         @source './nested/**/*.css';
       `,
       base: '/root/foo',
-      path: '',
-    }
-  }
+    })
 
   let compiler = await compile(
     css`
@@ -499,25 +474,22 @@ test('emits the right base for @source directives inside nested files', async ()
     { base: '/root', loadStylesheet },
   )
 
-  expect(compiler.sources).toEqual([
-    { pattern: './nested/**/*.css', base: '/root/foo', negated: false },
-    { pattern: './root/**/*.css', base: '/root', negated: false },
+  expect(compiler.globs).toEqual([
+    { pattern: './nested/**/*.css', base: '/root/foo' },
+    { pattern: './root/**/*.css', base: '/root' },
   ])
 })
 
 test('emits the right base for @source found inside JS configs and plugins from nested imports', async () => {
-  async function loadStylesheet() {
-    return {
+  let loadStylesheet = () =>
+    Promise.resolve({
       content: css`
         @config './nested-config.js';
         @plugin './nested-plugin.js';
       `,
       base: '/root/foo',
-      path: '',
-    }
-  }
-
-  using loadModule = vi.fn().mockImplementation((id: string) => {
+    })
+  let loadModule = vi.fn().mockImplementation((id: string) => {
     let base = id.includes('nested') ? '/root/foo' : '/root'
     if (id.includes('config')) {
       let glob = id.includes('nested') ? './nested-config/*.html' : './root-config/*.html'
@@ -530,14 +502,12 @@ test('emits the right base for @source found inside JS configs and plugins from
           plugins: [plugin(() => {}, { content: [pluginGlob] })],
         } satisfies Config,
         base: base + '-config',
-        path: '',
       }
     } else {
       let glob = id.includes('nested') ? './nested-plugin/*.html' : './root-plugin/*.html'
       return {
         module: plugin(() => {}, { content: [glob] }),
         base: base + '-plugin',
-        path: '',
       }
     }
   })
@@ -551,38 +521,41 @@ test('emits the right base for @source found inside JS configs and plugins from
     { base: '/root', loadStylesheet, loadModule },
   )
 
-  expect(compiler.sources).toEqual([
-    { pattern: './nested-plugin/*.html', base: '/root/foo-plugin', negated: false },
-    { pattern: './root-plugin/*.html', base: '/root-plugin', negated: false },
+  expect(compiler.globs).toEqual([
+    { pattern: './nested-plugin/*.html', base: '/root/foo-plugin' },
+    { pattern: './root-plugin/*.html', base: '/root-plugin' },
 
-    { pattern: './nested-config-plugin/*.html', base: '/root/foo-config', negated: false },
-    { pattern: './nested-config/*.html', base: '/root/foo-config', negated: false },
+    { pattern: './nested-config-plugin/*.html', base: '/root/foo-config' },
+    { pattern: './nested-config/*.html', base: '/root/foo-config' },
 
-    { pattern: './root-config-plugin/*.html', base: '/root-config', negated: false },
-    { pattern: './root-config/*.html', base: '/root-config', negated: false },
+    { pattern: './root-config-plugin/*.html', base: '/root-config' },
+    { pattern: './root-config/*.html', base: '/root-config' },
   ])
 })
 
 test('it crashes when inside a cycle', async () => {
-  let input = css`
-    @import 'foo.css';
-  `
-
-  async function loadStylesheet() {
-    return {
-      content: input,
+  let loadStylesheet = () =>
+    Promise.resolve({
+      content: css`
+        @import 'foo.css';
+      `,
       base: '/root',
-      path: '',
-    }
-  }
+    })
 
-  await expect(compileCss(input, { base: '/root', loadStylesheet })).rejects.toMatchInlineSnapshot(
+  expect(
+    run(
+      css`
+        @import 'foo.css';
+      `,
+      { loadStylesheet },
+    ),
+  ).rejects.toMatchInlineSnapshot(
     `[Error: Exceeded maximum recursion depth while resolving \`foo.css\` in \`/root\`)]`,
   )
 })
 
 test('resolves @reference as `@import "…" reference`', async () => {
-  async function loadStylesheet(id: string, base: string) {
+  let loadStylesheet = async (id: string, base: string) => {
     expect(base).toBe('/root')
     expect(id).toBe('./foo/bar.css')
     return {
@@ -595,22 +568,19 @@ test('resolves @reference as `@import "…" reference`', async () => {
         }
       `,
       base: '/root/foo',
-      path: '',
     }
   }
 
-  expect(
-    await run(
-      ['text-red-500'],
+  await expect(
+    run(
       css`
         @reference './foo/bar.css';
         @tailwind utilities;
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet, candidates: ['text-red-500'] },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    .text-red-500 {
+  ).resolves.toMatchInlineSnapshot(`
+    ".text-red-500 {
       color: var(--color-red-500, red);
     }
     "
@@ -618,7 +588,7 @@ test('resolves @reference as `@import "…" reference`', async () => {
 })
 
 test('resolves `@variant` used as `@custom-variant` inside `@reference`', async () => {
-  async function loadStylesheet(id: string, base: string) {
+  let loadStylesheet = async (id: string, base: string) => {
     expect(base).toBe('/root')
     expect(id).toBe('./foo/bar.css')
     return {
@@ -630,22 +600,19 @@ test('resolves `@variant` used as `@custom-variant` inside `@reference`', async
         }
       `,
       base: '/root/foo',
-      path: '',
     }
   }
 
-  expect(
-    await run(
-      ['dark:flex'],
+  await expect(
+    run(
       css`
         @reference './foo/bar.css';
         @tailwind utilities;
       `,
-      { base: '/root', loadStylesheet },
+      { loadStylesheet, candidates: ['dark:flex'] },
     ),
-  ).toMatchInlineSnapshot(`
-    "
-    .dark\\:flex:where([data-theme="dark"] *) {
+  ).resolves.toMatchInlineSnapshot(`
+    ".dark\\:flex:where([data-theme="dark"] *) {
       display: flex;
     }
     "
diff --git a/packages/tailwindcss/src/at-import.ts b/packages/tailwindcss/src/at-import.ts
index ba7172f8e..effd33e5b 100644
--- a/packages/tailwindcss/src/at-import.ts
+++ b/packages/tailwindcss/src/at-import.ts
@@ -1,29 +1,20 @@
 import { Features } from '.'
-import { atRule, context, type AstNode } from './ast'
+import { atRule, context, walk, WalkAction, type AstNode } from './ast'
 import * as CSS from './css-parser'
 import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
 
-type LoadStylesheet = (
-  id: string,
-  basedir: string,
-) => Promise<{
-  path: string
-  base: string
-  content: string
-}>
+type LoadStylesheet = (id: string, basedir: string) => Promise<{ base: string; content: string }>
 
 export async function substituteAtImports(
   ast: AstNode[],
   base: string,
   loadStylesheet: LoadStylesheet,
   recurseCount = 0,
-  track = false,
 ) {
   let features = Features.None
   let promises: Promise<void>[] = []
 
-  walk(ast, (node) => {
+  walk(ast, (node, { replaceWith }) => {
     if (node.kind === 'at-rule' && (node.name === '@import' || node.name === '@reference')) {
       let parsed = parseImportParams(ValueParser.parse(node.params))
       if (parsed === null) return
@@ -54,11 +45,10 @@ export async function substituteAtImports(
           }
 
           let loaded = await loadStylesheet(uri, base)
-          let ast = CSS.parse(loaded.content, { from: track ? loaded.path : undefined })
-          await substituteAtImports(ast, loaded.base, loadStylesheet, recurseCount + 1, track)
+          let ast = CSS.parse(loaded.content)
+          await substituteAtImports(ast, loaded.base, loadStylesheet, recurseCount + 1)
 
           contextNode.nodes = buildImportNodes(
-            node,
             [context({ base: loaded.base }, ast)],
             layer,
             media,
@@ -67,9 +57,11 @@ export async function substituteAtImports(
         })(),
       )
 
+      replaceWith(contextNode)
+
       // The resolved Stylesheets already have their transitive @imports
       // resolved, so we can skip walking them.
-      return WalkAction.ReplaceSkip(contextNode)
+      return WalkAction.Skip
     }
   })
 
@@ -148,7 +140,6 @@ export function parseImportParams(params: ValueParser.ValueAstNode[]) {
 }
 
 function buildImportNodes(
-  importNode: AstNode,
   importedAst: AstNode[],
   layer: string | null,
   media: string | null,
@@ -157,21 +148,15 @@ function buildImportNodes(
   let root = importedAst
 
   if (layer !== null) {
-    let node = atRule('@layer', layer, root)
-    node.src = importNode.src
-    root = [node]
+    root = [atRule('@layer', layer, root)]
   }
 
   if (media !== null) {
-    let node = atRule('@media', media, root)
-    node.src = importNode.src
-    root = [node]
+    root = [atRule('@media', media, root)]
   }
 
   if (supports !== null) {
-    let node = atRule('@supports', supports[0] === '(' ? supports : `(${supports})`, root)
-    node.src = importNode.src
-    root = [node]
+    root = [atRule('@supports', supports[0] === '(' ? supports : `(${supports})`, root)]
   }
 
   return root
diff --git a/packages/tailwindcss/src/attribute-selector-parser.bench.ts b/packages/tailwindcss/src/attribute-selector-parser.bench.ts
deleted file mode 100644
index 2d6e89590..000000000
--- a/packages/tailwindcss/src/attribute-selector-parser.bench.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import { bench, describe } from 'vitest'
-import * as AttributeSelectorParser from './attribute-selector-parser'
-
-let examples = [
-  '[open]',
-  '[data-foo]',
-  '[data-state=expanded]',
-  '[data-state = expanded ]',
-  '[data-state*="expanded"]',
-  '[data-state*="expanded"i]',
-  '[data-state*=expanded i]',
-]
-
-const ATTRIBUTE_REGEX =
-  /\[\s*(?<attribute>[a-zA-Z_-][a-zA-Z0-9_-]*)\s*((?<operator>[*|~^$]?=)\s*(?<quote>['"])?\s*(?<value>.*?)\4\s*(?<sensitivity>[is])?\s*)?\]/
-
-describe('parsing', () => {
-  bench('AttributeSelectorParser.parse', () => {
-    for (let example of examples) {
-      AttributeSelectorParser.parse(example)
-    }
-  })
-
-  bench('REGEX.test(…)', () => {
-    for (let example of examples) {
-      ATTRIBUTE_REGEX.exec(example)
-    }
-  })
-
-  bench('….match(REGEX)', () => {
-    for (let example of examples) {
-      example.match(ATTRIBUTE_REGEX)
-    }
-  })
-})
diff --git a/packages/tailwindcss/src/attribute-selector-parser.test.ts b/packages/tailwindcss/src/attribute-selector-parser.test.ts
deleted file mode 100644
index 87f5f3013..000000000
--- a/packages/tailwindcss/src/attribute-selector-parser.test.ts
+++ /dev/null
@@ -1,69 +0,0 @@
-import { describe, expect, it } from 'vitest'
-import { parse } from './attribute-selector-parser'
-
-describe('parse', () => {
-  it.each([
-    [''],
-    [']'],
-    ['[]'],
-    ['['],
-    ['="value"'],
-    ['data-foo]'],
-    ['[data-foo'],
-    ['[data-foo="foo]'],
-    ['[data-foo * = foo]'],
-    ['[data-foo*=]'],
-    ['[data-foo=value x]'],
-    ['[data-foo=value ix]'],
-  ])('should parse an invalid attribute selector (%s) as `null`', (input) => {
-    expect(parse(input)).toBeNull()
-  })
-
-  it.each([
-    [
-      '[data-foo]',
-      { attribute: 'data-foo', operator: null, quote: null, value: null, sensitivity: null },
-    ],
-    [
-      '[ data-foo ]',
-      { attribute: 'data-foo', operator: null, quote: null, value: null, sensitivity: null },
-    ],
-    [
-      // Non-ASCII code points are valid in a CSS ident
-      '[data-état]',
-      { attribute: 'data-état', operator: null, quote: null, value: null, sensitivity: null },
-    ],
-    [
-      '[data-state=expanded]',
-      { attribute: 'data-state', operator: '=', quote: null, value: 'expanded', sensitivity: null },
-    ],
-    [
-      '[data-state = expanded ]',
-      { attribute: 'data-state', operator: '=', quote: null, value: 'expanded', sensitivity: null },
-    ],
-    [
-      '[data-state*="expanded"]',
-      { attribute: 'data-state', operator: '*=', quote: '"', value: 'expanded', sensitivity: null },
-    ],
-    [
-      '[data-state*="expanded"i]',
-      { attribute: 'data-state', operator: '*=', quote: '"', value: 'expanded', sensitivity: 'i' },
-    ],
-    [
-      '[data-state*=expanded i]',
-      { attribute: 'data-state', operator: '*=', quote: null, value: 'expanded', sensitivity: 'i' },
-    ],
-  ])('should parse correctly: %s', (selector, expected) => {
-    expect(parse(selector)).toEqual(expected)
-  })
-
-  it('should work with a real-world example', () => {
-    expect(parse('[data-url$=".com"i]')).toEqual({
-      attribute: 'data-url',
-      operator: '$=',
-      quote: '"',
-      value: '.com',
-      sensitivity: 'i',
-    })
-  })
-})
diff --git a/packages/tailwindcss/src/attribute-selector-parser.ts b/packages/tailwindcss/src/attribute-selector-parser.ts
deleted file mode 100644
index 624043d59..000000000
--- a/packages/tailwindcss/src/attribute-selector-parser.ts
+++ /dev/null
@@ -1,232 +0,0 @@
-const TAB = 9
-const LINE_BREAK = 10
-const CARRIAGE_RETURN = 13
-const SPACE = 32
-const DOUBLE_QUOTE = 34
-const DOLLAR = 36
-const SINGLE_QUOTE = 39
-const ASTERISK = 42
-const EQUALS = 61
-const UPPER_I = 73
-const UPPER_S = 83
-const BACKSLASH = 92
-const CARET = 94
-const LOWER_I = 105
-const LOWER_S = 115
-const PIPE = 124
-const TILDE = 126
-const LOWER_A = 97
-const LOWER_Z = 122
-const UPPER_A = 65
-const UPPER_Z = 90
-const ZERO = 48
-const NINE = 57
-const DASH = 45
-const UNDERSCORE = 95
-const NON_ASCII = 128
-
-interface AttributeSelector {
-  attribute: string
-  operator: '=' | '~=' | '|=' | '^=' | '$=' | '*=' | null
-  quote: '"' | "'" | null
-  value: string | null
-  sensitivity: 'i' | 's' | null
-}
-
-export function parse(input: string): AttributeSelector | null {
-  // Must start with `[` and end with `]`
-  if (input[0] !== '[' || input[input.length - 1] !== ']') {
-    return null
-  }
-
-  let i = 1
-  let start = i
-  let end = input.length - 1
-
-  // Skip whitespace, e.g.: [   data-foo]
-  //                         ^^^
-  while (isAsciiWhitespace(input.charCodeAt(i))) i++
-
-  // Attribute name, e.g.: [data-foo]
-  //                        ^^^^^^^^
-  {
-    start = i
-    for (; i < end; i++) {
-      let currentChar = input.charCodeAt(i)
-      // Skip escaped character
-      if (currentChar === BACKSLASH) {
-        i++
-        continue
-      }
-      if (currentChar >= UPPER_A && currentChar <= UPPER_Z) continue
-      if (currentChar >= LOWER_A && currentChar <= LOWER_Z) continue
-      if (currentChar >= ZERO && currentChar <= NINE) continue
-      if (currentChar === DASH || currentChar === UNDERSCORE) continue
-      // Non-ASCII code points are valid in a CSS ident, e.g.: `[data-état]`
-      if (currentChar >= NON_ASCII) continue
-      break
-    }
-
-    // Must have at least one character in the attribute name
-    if (start === i) {
-      return null
-    }
-  }
-  let attribute = input.slice(start, i)
-
-  // Skip whitespace, e.g.: [data-foo   =value]
-  //                                 ^^^
-  while (isAsciiWhitespace(input.charCodeAt(i))) i++
-
-  // At the end, e.g.: `[data-foo]`
-  if (i === end) {
-    return {
-      attribute,
-      operator: null,
-      quote: null,
-      value: null,
-      sensitivity: null,
-    }
-  }
-
-  // Operator, e.g.: [data-foo*=value]
-  //                          ^^
-  let operator = null
-  let currentChar = input.charCodeAt(i)
-  if (currentChar === EQUALS) {
-    operator = '='
-    i++
-  } else if (
-    (currentChar === TILDE ||
-      currentChar === PIPE ||
-      currentChar === CARET ||
-      currentChar === DOLLAR ||
-      currentChar === ASTERISK) &&
-    input.charCodeAt(i + 1) === EQUALS
-  ) {
-    operator = input[i] + '='
-    i += 2
-  } else {
-    return null // Invalid operator
-  }
-
-  // Skip whitespace, e.g.: [data-foo*=   value]
-  //                                   ^^^
-  while (isAsciiWhitespace(input.charCodeAt(i))) i++
-
-  // At the end, that means that we have an operator but no valid, which is
-  // invalid, e.g.: `[data-foo*=]`
-  if (i === end) {
-    return null
-  }
-
-  // Value, e.g.: [data-foo*=value]
-  //                         ^^^^^
-  let value = ''
-
-  // Quoted value, e.g.: [data-foo*="value"]
-  //                                ^^^^^^^
-  let quote = null
-  currentChar = input.charCodeAt(i)
-  if (currentChar === SINGLE_QUOTE || currentChar === DOUBLE_QUOTE) {
-    quote = input[i] as '"' | "'"
-    i++
-
-    start = i
-    for (let j = i; j < end; j++) {
-      let current = input.charCodeAt(j)
-      // Found ending quote
-      if (current === currentChar) {
-        i = j + 1
-      }
-
-      // Skip escaped character
-      else if (current === BACKSLASH) {
-        j++
-      }
-    }
-
-    value = input.slice(start, i - 1)
-  }
-
-  // Unquoted value, e.g.: [data-foo*=value]
-  //                                  ^^^^^
-  else {
-    start = i
-    // Keep going until we find whitespace or the end
-    while (i < end && !isAsciiWhitespace(input.charCodeAt(i))) i++
-    value = input.slice(start, i)
-  }
-
-  // Skip whitespace, e.g.: [data-foo*=value   ]
-  //                                        ^^^
-  while (isAsciiWhitespace(input.charCodeAt(i))) i++
-
-  // At the end, e.g.: `[data-foo=value]`
-  if (i === end) {
-    return {
-      attribute,
-      operator: operator as '=' | '~=' | '|=' | '^=' | '$=' | '*=',
-      quote: quote as '"' | "'" | null,
-      value,
-      sensitivity: null,
-    }
-  }
-
-  // Sensitivity, e.g.: [data-foo=value i]
-  //                                    ^
-  let sensitivity = null
-  {
-    switch (input.charCodeAt(i)) {
-      case LOWER_I:
-      case UPPER_I: {
-        sensitivity = 'i'
-        i++
-        break
-      }
-
-      case LOWER_S:
-      case UPPER_S: {
-        sensitivity = 's'
-        i++
-        break
-      }
-
-      default:
-        return null // Invalid sensitivity
-    }
-  }
-
-  // Skip whitespace, e.g.: [data-foo=value i   ]
-  //                                         ^^^
-  while (isAsciiWhitespace(input.charCodeAt(i))) i++
-
-  // We must be at the end now, if not, then there is an additional character
-  // after the sensitivity which is invalid, e.g.: [data-foo=value iX]
-  //                                                                ^
-  if (i !== end) {
-    return null
-  }
-
-  // Fully done
-  return {
-    attribute,
-    operator: operator as '=' | '~=' | '|=' | '^=' | '$=' | '*=',
-    quote: quote as '"' | "'" | null,
-    value,
-    sensitivity: sensitivity as 'i' | 's' | null,
-  }
-}
-
-function isAsciiWhitespace(code: number): boolean {
-  switch (code) {
-    case SPACE:
-    case TAB:
-    case LINE_BREAK:
-    case CARRIAGE_RETURN:
-      return true
-
-    default:
-      return false
-  }
-}
diff --git a/packages/tailwindcss/src/candidate.bench.ts b/packages/tailwindcss/src/candidate.bench.ts
index 7ac0dbb0a..5b7171432 100644
--- a/packages/tailwindcss/src/candidate.bench.ts
+++ b/packages/tailwindcss/src/candidate.bench.ts
@@ -1,6 +1,6 @@
 import { Scanner } from '@tailwindcss/oxide'
-import { bench, describe } from 'vitest'
-import { cloneCandidate, parseCandidate, type Candidate, type Variant } from './candidate'
+import { bench } from 'vitest'
+import { parseCandidate } from './candidate'
 import { buildDesignSystem } from './design-system'
 import { Theme } from './theme'
 
@@ -8,87 +8,13 @@ import { Theme } from './theme'
 const root = process.env.FOLDER || process.cwd()
 
 // Auto content detection
-const scanner = new Scanner({ sources: [{ base: root, pattern: '**/*', negated: false }] })
+const scanner = new Scanner({ sources: [{ base: root, pattern: '**/*' }] })
 
 const candidates = scanner.scan()
 const designSystem = buildDesignSystem(new Theme())
 
-describe('parsing', () => {
-  bench('parseCandidate', () => {
-    for (let candidate of candidates) {
-      Array.from(parseCandidate(candidate, designSystem))
-    }
-  })
-})
-
-describe('Candidate cloning', async () => {
-  let parsedCanddiates = candidates.flatMap((candidate) =>
-    Array.from(parseCandidate(candidate, designSystem)),
-  )
-
-  bench('structuredClone', () => {
-    for (let candidate of parsedCanddiates) {
-      structuredClone(candidate)
-    }
-  })
-
-  bench('cloneCandidate', () => {
-    for (let candidate of parsedCanddiates) {
-      cloneCandidate(candidate)
-    }
-  })
-
-  bench('cloneCandidate (spread)', () => {
-    for (let candidate of parsedCanddiates) {
-      cloneCandidateSpread(candidate)
-    }
-  })
-})
-
-function cloneCandidateSpread(candidate: Candidate): Candidate {
-  switch (candidate.kind) {
-    case 'arbitrary':
-      return {
-        ...candidate,
-        modifier: candidate.modifier ? { ...candidate.modifier } : null,
-        variants: candidate.variants.map(cloneVariantSpread),
-      }
-
-    case 'static':
-      return { ...candidate, variants: candidate.variants.map(cloneVariantSpread) }
-
-    case 'functional':
-      return {
-        ...candidate,
-        value: candidate.value ? { ...candidate.value } : null,
-        modifier: candidate.modifier ? { ...candidate.modifier } : null,
-        variants: candidate.variants.map(cloneVariantSpread),
-      }
-
-    default:
-      candidate satisfies never
-      throw new Error('Unknown candidate kind')
+bench('parseCandidate', () => {
+  for (let candidate of candidates) {
+    Array.from(parseCandidate(candidate, designSystem))
   }
-}
-
-function cloneVariantSpread(variant: Variant): Variant {
-  switch (variant.kind) {
-    case 'arbitrary':
-    case 'static':
-      return { ...variant }
-
-    case 'functional':
-      return { ...variant, modifier: variant.modifier ? { ...variant.modifier } : null }
-
-    case 'compound':
-      return {
-        ...variant,
-        variant: cloneVariantSpread(variant.variant),
-        modifier: variant.modifier ? { ...variant.modifier } : null,
-      }
-
-    default:
-      variant satisfies never
-      throw new Error('Unknown variant kind')
-  }
-}
+})
diff --git a/packages/tailwindcss/src/candidate.test.ts b/packages/tailwindcss/src/candidate.test.ts
index b8f914e1b..2892f0053 100644
--- a/packages/tailwindcss/src/candidate.test.ts
+++ b/packages/tailwindcss/src/candidate.test.ts
@@ -1,5 +1,4 @@
-import { describe, expect, it, test } from 'vitest'
-import { __unstable__loadDesignSystem } from '.'
+import { expect, it } from 'vitest'
 import { buildDesignSystem } from './design-system'
 import { Theme } from './theme'
 import { Utilities } from './utilities'
@@ -516,8 +515,6 @@ it('should not parse functional utilities with multiple modifiers', () => {
   utilities.functional('bg', () => [])
 
   expect(run('bg-red-1/2/3', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-red-500/50/', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-red-500/50//foo', { utilities })).toMatchInlineSnapshot(`[]`)
 })
 
 it('should parse a utility with an arbitrary value', () => {
@@ -1090,7 +1087,6 @@ it('should parse a utility with an implicit variable as the modifier using the s
   let utilities = new Utilities()
   utilities.functional('bg', () => [])
 
-  // Standard case (no underscores)
   expect(run('bg-red-500/(--value)', { utilities })).toMatchInlineSnapshot(`
     [
       {
@@ -1111,156 +1107,6 @@ it('should parse a utility with an implicit variable as the modifier using the s
       },
     ]
   `)
-
-  // Should preserve underscores
-  expect(run('bg-red-500/(--with_underscore)', { utilities })).toMatchInlineSnapshot(`
-    [
-      {
-        "important": false,
-        "kind": "functional",
-        "modifier": {
-          "kind": "arbitrary",
-          "value": "var(--with_underscore)",
-        },
-        "raw": "bg-red-500/(--with_underscore)",
-        "root": "bg",
-        "value": {
-          "fraction": null,
-          "kind": "named",
-          "value": "red-500",
-        },
-        "variants": [],
-      },
-    ]
-  `)
-
-  // Should remove underscores in fallback values
-  expect(run('bg-red-500/(--with_underscore,fallback_value)', { utilities }))
-    .toMatchInlineSnapshot(`
-      [
-        {
-          "important": false,
-          "kind": "functional",
-          "modifier": {
-            "kind": "arbitrary",
-            "value": "var(--with_underscore,fallback value)",
-          },
-          "raw": "bg-red-500/(--with_underscore,fallback_value)",
-          "root": "bg",
-          "value": {
-            "fraction": null,
-            "kind": "named",
-            "value": "red-500",
-          },
-          "variants": [],
-        },
-      ]
-    `)
-
-  // Should keep underscores in the CSS variable itself, but remove underscores
-  // in fallback values
-  expect(run('bg-(--a_b,c_d_var(--e_f,g_h))/(--i_j,k_l_var(--m_n,o_p))', { utilities }))
-    .toMatchInlineSnapshot(`
-    [
-      {
-        "important": false,
-        "kind": "functional",
-        "modifier": {
-          "kind": "arbitrary",
-          "value": "var(--i_j,k l var(--m_n,o p))",
-        },
-        "raw": "bg-(--a_b,c_d_var(--e_f,g_h))/(--i_j,k_l_var(--m_n,o_p))",
-        "root": "bg",
-        "value": {
-          "dataType": null,
-          "kind": "arbitrary",
-          "value": "var(--a_b,c d var(--e_f,g h))",
-        },
-        "variants": [],
-      },
-    ]
-  `)
-})
-
-it('should not parse an invalid arbitrary shorthand modifier', () => {
-  let utilities = new Utilities()
-  utilities.functional('bg', () => [])
-
-  // Completely empty
-  expect(run('bg-red-500/()', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Invalid due to leading spaces
-  expect(run('bg-red-500/(_--)', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-red-500/(_--x)', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Invalid due to leading spaces
-  expect(run('bg-red-500/(_--)', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-red-500/(_--x)', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Invalid due to top-level `;` or `}` characters
-  expect(run('bg-red-500/(--x;--y)', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-red-500/(--x:{foo:bar})', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Valid, but ensuring that we didn't make an off-by-one error
-  expect(run('bg-red-500/(--x)', { utilities })).toMatchInlineSnapshot(`
-    [
-      {
-        "important": false,
-        "kind": "functional",
-        "modifier": {
-          "kind": "arbitrary",
-          "value": "var(--x)",
-        },
-        "raw": "bg-red-500/(--x)",
-        "root": "bg",
-        "value": {
-          "fraction": null,
-          "kind": "named",
-          "value": "red-500",
-        },
-        "variants": [],
-      },
-    ]
-  `)
-})
-
-it('should not parse an invalid arbitrary shorthand value', () => {
-  let utilities = new Utilities()
-  utilities.functional('bg', () => [])
-
-  // Completely empty
-  expect(run('bg-()', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Invalid due to leading spaces
-  expect(run('bg-(_--)', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-(_--x)', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Invalid due to leading spaces
-  expect(run('bg-(_--)', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-(_--x)', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Invalid due to top-level `;` or `}` characters
-  expect(run('bg-(--x;--y)', { utilities })).toMatchInlineSnapshot(`[]`)
-  expect(run('bg-(--x:{foo:bar})', { utilities })).toMatchInlineSnapshot(`[]`)
-
-  // Valid, but ensuring that we didn't make an off-by-one error
-  expect(run('bg-(--x)', { utilities })).toMatchInlineSnapshot(`
-    [
-      {
-        "important": false,
-        "kind": "functional",
-        "modifier": null,
-        "raw": "bg-(--x)",
-        "root": "bg",
-        "value": {
-          "dataType": null,
-          "kind": "arbitrary",
-          "value": "var(--x)",
-        },
-        "variants": [],
-      },
-    ]
-  `)
 })
 
 it('should not parse a utility with an implicit invalid variable as the modifier using the shorthand', () => {
@@ -1418,19 +1264,6 @@ it('should parse a functional variant with a modifier', () => {
   `)
 })
 
-it('should not parse variants with multiple modifiers', () => {
-  let utilities = new Utilities()
-  utilities.static('flex', () => [])
-
-  let variants = new Variants()
-  variants.static('hover', () => {})
-  variants.compound('group', Compounds.StyleRules, () => {})
-
-  expect(run('group-hover/foo:flex', { utilities, variants })).toHaveLength(1)
-  expect(run('group-hover/foo/:flex', { utilities, variants })).toEqual([])
-  expect(run('group-hover/foo//bar:flex', { utilities, variants })).toEqual([])
-})
-
 it('should parse a functional variant starting with @', () => {
   let utilities = new Utilities()
   utilities.static('flex', () => [])
@@ -1461,36 +1294,6 @@ it('should parse a functional variant starting with @', () => {
   `)
 })
 
-it('should parse a functional variant starting with @ that has a hyphen', () => {
-  let utilities = new Utilities()
-  utilities.static('flex', () => [])
-
-  let variants = new Variants()
-  variants.functional('@', () => {})
-
-  expect(run('@foo-bar:flex', { utilities, variants })).toMatchInlineSnapshot(`
-    [
-      {
-        "important": false,
-        "kind": "static",
-        "raw": "@foo-bar:flex",
-        "root": "flex",
-        "variants": [
-          {
-            "kind": "functional",
-            "modifier": null,
-            "root": "@",
-            "value": {
-              "kind": "named",
-              "value": "foo-bar",
-            },
-          },
-        ],
-      },
-    ]
-  `)
-})
-
 it('should parse a functional variant starting with @ and a modifier', () => {
   let utilities = new Utilities()
   utilities.static('flex', () => [])
@@ -1791,14 +1594,6 @@ it('should not parse compound group with a non-compoundable variant', () => {
   expect(run('group-*:flex', { utilities, variants })).toMatchInlineSnapshot(`[]`)
 })
 
-it('empty data types are invalid', () => {
-  let utilities = new Utilities()
-  utilities.functional('bg', () => [])
-  let variants = new Variants()
-
-  expect(run('bg-[:foo]', { utilities, variants })).toMatchInlineSnapshot(`[]`)
-})
-
 it('should parse a variant containing an arbitrary string with unbalanced parens, brackets, curlies and other quotes', () => {
   let utilities = new Utilities()
   utilities.static('flex', () => [])
@@ -1995,162 +1790,3 @@ it.each([
 
   expect(run(rawCandidate, { utilities, variants })).toEqual([])
 })
-
-it.each([
-  // Arbitrary properties with `;` or `}`
-  '[color:red;color:blue]',
-  '[color:red}html{color:blue]',
-
-  // Arbitrary values that end the declaration
-  'bg-[red;color:blue]',
-
-  // Arbitrary values that end the block
-  'bg-[red}html{color:blue]',
-
-  // Arbitrary variants that end the block
-  '[&{color:red}]:flex',
-
-  // Arbitrary variant values that end the block
-  'data-[a]{color:red}foo[a]:flex',
-
-  // Named values contain invalid characters
-  'data-foo=bar:flex',
-  'bg-foo=bar',
-  'bg-red-500/foo=bar',
-])('should not parse invalid values: %s', (rawCandidate) => {
-  let utilities = new Utilities()
-  utilities.static('flex', () => [])
-  utilities.functional('bg', () => [])
-
-  let variants = new Variants()
-  variants.functional('data', () => {})
-  variants.compound('group', Compounds.StyleRules, () => {})
-
-  expect(run(rawCandidate, { utilities, variants })).toEqual([])
-})
-
-const candidates = [
-  // Arbitrary candidates
-  ['[color:red]', '[color:red]'],
-  ['[color:red]/50', '[color:red]/50'],
-  ['[color:red]/[0.5]', '[color:red]/[0.5]'],
-  ['[color:red]/50!', '[color:red]/50!'],
-  ['![color:red]/50', '[color:red]/50!'],
-  ['[color:red]/[0.5]!', '[color:red]/[0.5]!'],
-
-  // Static candidates
-  ['box-border', 'box-border'],
-  ['underline!', 'underline!'],
-  ['!underline', 'underline!'],
-  ['-inset-full', '-inset-full'],
-
-  // Functional candidates
-  ['bg-red-500', 'bg-red-500'],
-  ['bg-red-500/50', 'bg-red-500/50'],
-  ['bg-red-500/[0.5]', 'bg-red-500/[0.5]'],
-  ['bg-red-500!', 'bg-red-500!'],
-  ['!bg-red-500', 'bg-red-500!'],
-  ['bg-[#0088cc]/50', 'bg-[#0088cc]/50'],
-  ['bg-[#0088cc]/[0.5]', 'bg-[#0088cc]/[0.5]'],
-  ['bg-[#0088cc]!', 'bg-[#0088cc]!'],
-  ['!bg-[#0088cc]', 'bg-[#0088cc]!'],
-  ['bg-[var(--spacing)-1px]', 'bg-[var(--spacing)-1px]'],
-  ['bg-[var(--spacing)_-_1px]', 'bg-[var(--spacing)-1px]'],
-  ['bg-[var(--_spacing)]', 'bg-(--_spacing)'],
-  ['bg-(--_spacing)', 'bg-(--_spacing)'],
-  ['bg-[-1px_-1px]', 'bg-[-1px_-1px]'],
-  ['p-[round(to-zero,1px)]', 'p-[round(to-zero,1px)]'],
-  ['w-1/2', 'w-1/2'],
-  ['p-[calc((100vw-theme(maxWidth.2xl))_/_2)]', 'p-[calc((100vw-theme(maxWidth.2xl))/2)]'],
-
-  // Keep spaces in strings
-  ['content-["hello_world"]', 'content-["hello_world"]'],
-  ['content-[____"hello_world"___]', 'content-["hello_world"]'],
-
-  // Do not escape underscores for url() and CSS variable in var()
-  ['bg-[no-repeat_url(/image_13.png)]', 'bg-[no-repeat_url(/image_13.png)]'],
-  [
-    'bg-[var(--spacing-0_5,_var(--spacing-1_5,_3rem))]',
-    'bg-(--spacing-0_5,var(--spacing-1_5,3rem))',
-  ],
-
-  // Normalize whitespace in arbitrary properties
-  ['[display:flex]', '[display:flex]'],
-  ['[display:_flex]', '[display:flex]'],
-  ['[display:flex_]', '[display:flex]'],
-  ['[display:_flex_]', '[display:flex]'],
-
-  // Normalize whitespace in `calc` expressions
-  ['w-[calc(100%-2rem)]', 'w-[calc(100%-2rem)]'],
-  ['w-[calc(100%_-_2rem)]', 'w-[calc(100%-2rem)]'],
-
-  // Normalize the important modifier
-  ['!flex', 'flex!'],
-  ['flex!', 'flex!'],
-]
-
-const variants = [
-  ['', ''], // no variant
-  ['*:', '*:'],
-  ['focus:', 'focus:'],
-  ['group-focus:', 'group-focus:'],
-
-  ['hover:focus:', 'hover:focus:'],
-  ['hover:group-focus:', 'hover:group-focus:'],
-  ['group-hover:focus:', 'group-hover:focus:'],
-  ['group-hover:group-focus:', 'group-hover:group-focus:'],
-
-  ['min-[10px]:', 'min-[10px]:'],
-
-  // Normalize spaces
-  ['min-[calc(1000px_+_12em)]:', 'min-[calc(1000px+12em)]:'],
-  ['min-[calc(1000px_+12em)]:', 'min-[calc(1000px+12em)]:'],
-  ['min-[calc(1000px+_12em)]:', 'min-[calc(1000px+12em)]:'],
-  ['min-[calc(1000px___+___12em)]:', 'min-[calc(1000px+12em)]:'],
-
-  ['peer-[&_p]:', 'peer-[&_p]:'],
-  ['peer-[&_p]:hover:', 'peer-[&_p]:hover:'],
-  ['hover:peer-[&_p]:', 'hover:peer-[&_p]:'],
-  ['hover:peer-[&_p]:focus:', 'hover:peer-[&_p]:focus:'],
-  ['peer-[&:hover]:peer-[&_p]:', 'peer-[&:hover]:peer-[&_p]:'],
-
-  ['[p]:', '[p]:'],
-  ['[_p_]:', '[p]:'],
-  ['has-[p]:', 'has-[p]:'],
-  ['has-[_p_]:', 'has-[p]:'],
-
-  // Simplify `&:is(p)` to `p`
-  ['[&:is(p)]:', '[p]:'],
-  ['[&:is(_p_)]:', '[p]:'],
-  ['has-[&:is(p)]:', 'has-[p]:'],
-  ['has-[&:is(_p_)]:', 'has-[p]:'],
-
-  // Handle special `@` variants. These shouldn't be printed as `@-`
-  ['@xl:', '@xl:'],
-  ['@[123px]:', '@[123px]:'],
-
-  // Compound variants that forward modifiers
-  ['not-group-hover/name:', 'not-group-hover/name:'],
-  ['has-group-peer-hover/name:', 'has-group-peer-hover/name:'],
-  ['in-group-peer-hover/name:', 'in-group-peer-hover/name:'],
-]
-
-let combinations: [string, string][] = []
-
-for (let [inputVariant, outputVariant] of variants) {
-  for (let [inputCandidate, outputCandidate] of candidates) {
-    combinations.push([`${inputVariant}${inputCandidate}`, `${outputVariant}${outputCandidate}`])
-  }
-}
-
-describe('normalize candidates', () => {
-  test.each(combinations)('`%s` -> `%s`', async (candidate: string, result: string) => {
-    let designSystem = await __unstable__loadDesignSystem('@tailwind utilities', {
-      base: __dirname,
-    })
-
-    let [parsed] = designSystem.parseCandidate(candidate)
-
-    expect(designSystem.printCandidate(parsed)).toEqual(result)
-  })
-})
diff --git a/packages/tailwindcss/src/candidate.ts b/packages/tailwindcss/src/candidate.ts
index a389af365..8238dfc2f 100644
--- a/packages/tailwindcss/src/candidate.ts
+++ b/packages/tailwindcss/src/candidate.ts
@@ -1,19 +1,13 @@
 import type { DesignSystem } from './design-system'
 import { decodeArbitraryValue } from './utils/decode-arbitrary-value'
-import { DefaultMap } from './utils/default-map'
-import { isValidArbitrary } from './utils/is-valid-arbitrary'
 import { segment } from './utils/segment'
-import type { ValueFunctionNode } from './value-parser'
-import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
 
 const COLON = 0x3a
 const DASH = 0x2d
 const LOWER_A = 0x61
 const LOWER_Z = 0x7a
-const IS_VALID_NAMED_VALUE = /^[a-zA-Z0-9_.%-]+$/
 
-export type ArbitraryUtilityValue = {
+type ArbitraryUtilityValue = {
   kind: 'arbitrary'
 
   /**
@@ -65,7 +59,7 @@ export type NamedUtilityValue = {
   fraction: string | null
 }
 
-export type ArbitraryModifier = {
+type ArbitraryModifier = {
   kind: 'arbitrary'
 
   /**
@@ -77,7 +71,7 @@ export type ArbitraryModifier = {
   value: string
 }
 
-export type NamedModifier = {
+type NamedModifier = {
   kind: 'named'
 
   /**
@@ -218,102 +212,6 @@ export type Candidate =
       raw: string
     }
 
-export function cloneCandidate<T extends Candidate>(candidate: T): T {
-  switch (candidate.kind) {
-    case 'arbitrary':
-      return {
-        kind: candidate.kind,
-        property: candidate.property,
-        value: candidate.value,
-        modifier: candidate.modifier
-          ? { kind: candidate.modifier.kind, value: candidate.modifier.value }
-          : null,
-        variants: candidate.variants.map(cloneVariant),
-        important: candidate.important,
-        raw: candidate.raw,
-      } satisfies Extract<Candidate, { kind: 'arbitrary' }> as T
-
-    case 'static':
-      return {
-        kind: candidate.kind,
-        root: candidate.root,
-        variants: candidate.variants.map(cloneVariant),
-        important: candidate.important,
-        raw: candidate.raw,
-      } satisfies Extract<Candidate, { kind: 'static' }> as T
-
-    case 'functional':
-      return {
-        kind: candidate.kind,
-        root: candidate.root,
-        value: candidate.value
-          ? candidate.value.kind === 'arbitrary'
-            ? {
-                kind: candidate.value.kind,
-                dataType: candidate.value.dataType,
-                value: candidate.value.value,
-              }
-            : {
-                kind: candidate.value.kind,
-                value: candidate.value.value,
-                fraction: candidate.value.fraction,
-              }
-          : null,
-        modifier: candidate.modifier
-          ? { kind: candidate.modifier.kind, value: candidate.modifier.value }
-          : null,
-        variants: candidate.variants.map(cloneVariant),
-        important: candidate.important,
-        raw: candidate.raw,
-      } satisfies Extract<Candidate, { kind: 'functional' }> as T
-
-    default:
-      candidate satisfies never
-      throw new Error('Unknown candidate kind')
-  }
-}
-
-export function cloneVariant<T extends Variant>(variant: T): T {
-  switch (variant.kind) {
-    case 'arbitrary':
-      return {
-        kind: variant.kind,
-        selector: variant.selector,
-        relative: variant.relative,
-      } satisfies Extract<Variant, { kind: 'arbitrary' }> as T
-
-    case 'static':
-      return { kind: variant.kind, root: variant.root } satisfies Extract<
-        Variant,
-        { kind: 'static' }
-      > as T
-
-    case 'functional':
-      return {
-        kind: variant.kind,
-        root: variant.root,
-        value: variant.value ? { kind: variant.value.kind, value: variant.value.value } : null,
-        modifier: variant.modifier
-          ? { kind: variant.modifier.kind, value: variant.modifier.value }
-          : null,
-      } satisfies Extract<Variant, { kind: 'functional' }> as T
-
-    case 'compound':
-      return {
-        kind: variant.kind,
-        root: variant.root,
-        variant: cloneVariant(variant.variant),
-        modifier: variant.modifier
-          ? { kind: variant.modifier.kind, value: variant.modifier.value }
-          : null,
-      } satisfies Extract<Variant, { kind: 'compound' }> as T
-
-    default:
-      variant satisfies never
-      throw new Error('Unknown variant kind')
-  }
-}
-
 export function* parseCandidate(input: string, designSystem: DesignSystem): Iterable<Candidate> {
   // hover:focus:underline
   // ^^^^^ ^^^^^^           -> Variants
@@ -372,14 +270,6 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
     }
   }
 
-  // If there's more than one modifier, the utility is invalid.
-  //
-  // E.g.:
-  //
-  // - `bg-red-500/50/50`
-  let parts = segment(base, '/')
-  if (parts.length > 2) return
-
   // Figure out the new base and the modifier segment if present.
   //
   // E.g.:
@@ -389,7 +279,14 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
   // ^^^^^^^^^^    -> Base without modifier
   //            ^^ -> Modifier segment
   // ```
-  let [baseWithoutModifier, modifierSegment = null] = parts
+  let [baseWithoutModifier, modifierSegment = null, additionalModifier] = segment(base, '/')
+
+  // If there's more than one modifier, the utility is invalid.
+  //
+  // E.g.:
+  //
+  // - `bg-red-500/50/50`
+  if (additionalModifier) return
 
   let parsedModifier = modifierSegment === null ? null : parseModifier(modifierSegment)
 
@@ -429,9 +326,6 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
     let property = baseWithoutModifier.slice(0, idx)
     let value = decodeArbitraryValue(baseWithoutModifier.slice(idx + 1))
 
-    // Values can't contain `;` or `}` characters at the top-level.
-    if (!isValidArbitrary(value)) return
-
     yield {
       kind: 'arbitrary',
       property,
@@ -485,7 +379,6 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
   //
   // E.g.:
   //
-  // ```
   // bg-(--my-var)
   // ^^            -> Root
   //    ^^^^^^^^^^ -> Arbitrary value
@@ -512,10 +405,7 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
 
     // An arbitrary value with `(…)` should always start with `--` since it
     // represents a CSS variable.
-    if (value[0] !== '-' || value[1] !== '-') return
-
-    // Values can't contain `;` or `}` characters at the top-level.
-    if (!isValidArbitrary(value)) return
+    if (value[0] !== '-' && value[1] !== '-') return
 
     roots = [[root, dataType === null ? `[var(${value})]` : `[${dataType}:var(${value})]`]]
   }
@@ -553,11 +443,8 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
 
         let arbitraryValue = decodeArbitraryValue(value.slice(startArbitraryIdx + 1, -1))
 
-        // Values can't contain `;` or `}` characters at the top-level.
-        if (!isValidArbitrary(arbitraryValue)) continue
-
         // Extract an explicit typehint if present, e.g. `bg-[color:var(--my-var)])`
-        let typehint: string | null = null
+        let typehint = ''
         for (let i = 0; i < arbitraryValue.length; i++) {
           let code = arbitraryValue.charCodeAt(i)
 
@@ -583,8 +470,6 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
           continue
         }
 
-        if (typehint === '') continue
-
         candidate.value = {
           kind: 'arbitrary',
           dataType: typehint || null,
@@ -599,8 +484,6 @@ export function* parseCandidate(input: string, designSystem: DesignSystem): Iter
             ? null
             : `${value}/${modifierSegment}`
 
-        if (!IS_VALID_NAMED_VALUE.test(value)) continue
-
         candidate.value = {
           kind: 'named',
           value,
@@ -617,9 +500,6 @@ function parseModifier(modifier: string): CandidateModifier | null {
   if (modifier[0] === '[' && modifier[modifier.length - 1] === ']') {
     let arbitraryValue = decodeArbitraryValue(modifier.slice(1, -1))
 
-    // Values can't contain `;` or `}` characters at the top-level.
-    if (!isValidArbitrary(arbitraryValue)) return null
-
     // Empty arbitrary values are invalid. E.g.: `data-[]:`
     //                                                 ^^
     if (arbitraryValue.length === 0 || arbitraryValue.trim().length === 0) return null
@@ -631,29 +511,21 @@ function parseModifier(modifier: string): CandidateModifier | null {
   }
 
   if (modifier[0] === '(' && modifier[modifier.length - 1] === ')') {
-    // Drop the `(` and `)` characters
-    modifier = modifier.slice(1, -1)
+    let arbitraryValue = decodeArbitraryValue(modifier.slice(1, -1))
 
-    // A modifier with `(…)` should always start with `--` since it
-    // represents a CSS variable.
-    if (modifier[0] !== '-' || modifier[1] !== '-') return null
+    // Empty arbitrary values are invalid. E.g.: `data-():`
+    //                                                 ^^
+    if (arbitraryValue.length === 0 || arbitraryValue.trim().length === 0) return null
 
-    // Values can't contain `;` or `}` characters at the top-level.
-    if (!isValidArbitrary(modifier)) return null
-
-    // Wrap the value in `var(…)` to ensure that it is a valid CSS variable.
-    modifier = `var(${modifier})`
-
-    let arbitraryValue = decodeArbitraryValue(modifier)
+    // Arbitrary values must start with `--` since it represents a CSS variable.
+    if (arbitraryValue[0] !== '-' && arbitraryValue[1] !== '-') return null
 
     return {
       kind: 'arbitrary',
-      value: arbitraryValue,
+      value: `var(${arbitraryValue})`,
     }
   }
 
-  if (!IS_VALID_NAMED_VALUE.test(modifier)) return null
-
   return {
     kind: 'named',
     value: modifier,
@@ -680,9 +552,6 @@ export function parseVariant(variant: string, designSystem: DesignSystem): Varia
 
     let selector = decodeArbitraryValue(variant.slice(1, -1))
 
-    // Values can't contain `;` or `}` characters at the top-level.
-    if (!isValidArbitrary(selector)) return null
-
     // Empty arbitrary values are invalid. E.g.: `[]:`
     //                                            ^^
     if (selector.length === 0 || selector.trim().length === 0) return null
@@ -708,18 +577,17 @@ export function parseVariant(variant: string, designSystem: DesignSystem): Varia
 
   // Static, functional and compound variants
   {
+    // group-hover/group-name
+    // ^^^^^^^^^^^            -> Variant without modifier
+    //             ^^^^^^^^^^ -> Modifier
+    let [variantWithoutModifier, modifier = null, additionalModifier] = segment(variant, '/')
+
     // If there's more than one modifier, the variant is invalid.
     //
     // E.g.:
     //
     // - `group-hover/foo/bar`
-    let parts = segment(variant, '/')
-    if (parts.length > 2) return null
-
-    // group-hover/group-name
-    // ^^^^^^^^^^^            -> Variant without modifier
-    //             ^^^^^^^^^^ -> Modifier
-    let [variantWithoutModifier, modifier = null] = parts
+    if (additionalModifier) return null
 
     let roots = findRoots(variantWithoutModifier, (root) => {
       return designSystem.variants.has(root)
@@ -761,9 +629,6 @@ export function parseVariant(variant: string, designSystem: DesignSystem): Varia
 
             let arbitraryValue = decodeArbitraryValue(value.slice(1, -1))
 
-            // Values can't contain `;` or `}` characters at the top-level.
-            if (!isValidArbitrary(arbitraryValue)) return null
-
             // Empty arbitrary values are invalid. E.g.: `data-[]:`
             //                                                 ^^
             if (arbitraryValue.length === 0 || arbitraryValue.trim().length === 0) return null
@@ -785,15 +650,12 @@ export function parseVariant(variant: string, designSystem: DesignSystem): Varia
 
             let arbitraryValue = decodeArbitraryValue(value.slice(1, -1))
 
-            // Values can't contain `;` or `}` characters at the top-level.
-            if (!isValidArbitrary(arbitraryValue)) return null
-
             // Empty arbitrary values are invalid. E.g.: `data-():`
             //                                                 ^^
             if (arbitraryValue.length === 0 || arbitraryValue.trim().length === 0) return null
 
             // Arbitrary values must start with `--` since it represents a CSS variable.
-            if (arbitraryValue[0] !== '-' || arbitraryValue[1] !== '-') return null
+            if (arbitraryValue[0] !== '-' && arbitraryValue[1] !== '-') return null
 
             return {
               kind: 'functional',
@@ -806,8 +668,6 @@ export function parseVariant(variant: string, designSystem: DesignSystem): Varia
             }
           }
 
-          if (!IS_VALID_NAMED_VALUE.test(value)) continue
-
           return {
             kind: 'functional',
             root,
@@ -819,13 +679,6 @@ export function parseVariant(variant: string, designSystem: DesignSystem): Varia
         case 'compound': {
           if (value === null) return null
 
-          // Forward the modifier of the compound variants to its subVariant.
-          // This allows for `not-group-hover/name:flex` to work.
-          if (modifier && (root === 'not' || root === 'has' || root === 'in')) {
-            value = `${value}/${modifier}`
-            modifier = null
-          }
-
           let subVariant = designSystem.parseVariant(value)
           if (subVariant === null) return null
 
@@ -870,6 +723,14 @@ function* findRoots(input: string, exists: (input: string) => boolean): Iterable
   // Otherwise test every permutation of the input by iteratively removing
   // everything after the last dash.
   let idx = input.lastIndexOf('-')
+  if (idx === -1) {
+    // Variants starting with `@` are special because they don't need a `-`
+    // after the `@` (E.g.: `@-lg` should be written as `@lg`).
+    if (input[0] === '@' && exists('@')) {
+      yield ['@', input.slice(1)]
+    }
+    return
+  }
 
   // Determine the root and value by testing permutations of the incoming input.
   //
@@ -878,7 +739,7 @@ function* findRoots(input: string, exists: (input: string) => boolean): Iterable
   // `bg-red-500` -> No match
   // `bg-red`     -> No match
   // `bg`         -> Match
-  while (idx > 0) {
+  do {
     let maybeRoot = input.slice(0, idx)
 
     if (exists(maybeRoot)) {
@@ -889,351 +750,9 @@ function* findRoots(input: string, exists: (input: string) => boolean): Iterable
       // can skip any further parsing.
       if (root[1] === '') break
 
-      // Edge case: `@-…` is not valid as a variant or a utility so we want to
-      // skip if an `@` is followed by a `-`. Otherwise `@-2xl:flex` and
-      // `@-2xl:flex` would be considered the same.
-      if (root[0] === '@' && exists('@') && input[idx] === '-') break
-
       yield root
     }
 
     idx = input.lastIndexOf('-', idx - 1)
-  }
-
-  // Try '@' variant after permutations. This allows things like `@max` of `@max-foo-bar`
-  // to match before looking for `@`.
-  if (input[0] === '@' && exists('@')) {
-    yield ['@', input.slice(1)]
-  }
-}
-
-export function printCandidate(designSystem: DesignSystem, candidate: Candidate) {
-  let parts: string[] = []
-
-  for (let variant of candidate.variants) {
-    parts.unshift(printVariant(variant))
-  }
-
-  // Handle prefix
-  if (designSystem.theme.prefix) {
-    parts.unshift(designSystem.theme.prefix)
-  }
-
-  let base: string = ''
-
-  // Handle static
-  if (candidate.kind === 'static') {
-    base += candidate.root
-  }
-
-  // Handle functional
-  if (candidate.kind === 'functional') {
-    base += candidate.root
-
-    if (candidate.value) {
-      if (candidate.value.kind === 'arbitrary') {
-        if (candidate.value !== null) {
-          let isVarValue = isVar(candidate.value.value)
-          let value = isVarValue ? candidate.value.value.slice(4, -1) : candidate.value.value
-          let [open, close] = isVarValue ? ['(', ')'] : ['[', ']']
-
-          if (candidate.value.dataType) {
-            base += `-${open}${candidate.value.dataType}:${printArbitraryValue(value)}${close}`
-          } else {
-            base += `-${open}${printArbitraryValue(value)}${close}`
-          }
-        }
-      } else if (candidate.value.kind === 'named') {
-        base += `-${candidate.value.value}`
-      }
-    }
-  }
-
-  // Handle arbitrary
-  if (candidate.kind === 'arbitrary') {
-    base += `[${candidate.property}:${printArbitraryValue(candidate.value)}]`
-  }
-
-  // Handle modifier
-  if (candidate.kind === 'arbitrary' || candidate.kind === 'functional') {
-    base += printModifier(candidate.modifier)
-  }
-
-  // Handle important
-  if (candidate.important) {
-    base += '!'
-  }
-
-  parts.push(base)
-
-  return parts.join(':')
-}
-
-export function printModifier(modifier: ArbitraryModifier | NamedModifier | null) {
-  if (modifier === null) return ''
-
-  let isVarValue = isVar(modifier.value)
-  let value = isVarValue ? modifier.value.slice(4, -1) : modifier.value
-  let [open, close] = isVarValue ? ['(', ')'] : ['[', ']']
-
-  if (modifier.kind === 'arbitrary') {
-    return `/${open}${printArbitraryValue(value)}${close}`
-  } else if (modifier.kind === 'named') {
-    return `/${modifier.value}`
-  } else {
-    modifier satisfies never
-    return ''
-  }
-}
-
-export function printVariant(variant: Variant) {
-  // Handle static variants
-  if (variant.kind === 'static') {
-    return variant.root
-  }
-
-  // Handle arbitrary variants
-  if (variant.kind === 'arbitrary') {
-    return `[${printArbitraryValue(simplifyArbitraryVariant(variant.selector))}]`
-  }
-
-  let base: string = ''
-
-  // Handle functional variants
-  if (variant.kind === 'functional') {
-    base += variant.root
-    // `@` is a special case for functional variants. We want to print: `@lg`
-    // instead of `@-lg`
-    let hasDash = variant.root !== '@'
-    if (variant.value) {
-      if (variant.value.kind === 'arbitrary') {
-        let isVarValue = isVar(variant.value.value)
-        let value = isVarValue ? variant.value.value.slice(4, -1) : variant.value.value
-        let [open, close] = isVarValue ? ['(', ')'] : ['[', ']']
-
-        base += `${hasDash ? '-' : ''}${open}${printArbitraryValue(value)}${close}`
-      } else if (variant.value.kind === 'named') {
-        base += `${hasDash ? '-' : ''}${variant.value.value}`
-      }
-    }
-  }
-
-  // Handle compound variants
-  if (variant.kind === 'compound') {
-    base += variant.root
-    base += '-'
-    base += printVariant(variant.variant)
-  }
-
-  // Handle modifiers
-  if (variant.kind === 'functional' || variant.kind === 'compound') {
-    base += printModifier(variant.modifier)
-  }
-
-  return base
-}
-
-const printArbitraryValueCache = new DefaultMap<string, string>((input) => {
-  let ast = ValueParser.parse(input)
-
-  let drop = new Set<ValueParser.ValueAstNode>()
-
-  let symbols = new Set([
-    // Selectors
-    '~', // Subsequent sibling combinator
-    '>', // Child combinator
-
-    // Math operators
-    '+', // or next sibling combinator
-    '-',
-    '*', // or universal selector
-    '/',
-  ])
-  walk(ast, (node, ctx) => {
-    // Handle operators (e.g.: inside of `calc(…)`)
-    if (node.kind === 'word' && symbols.has(node.value)) {
-      let idx = ctx.index
-
-      // This should not be possible
-      if (idx === -1) return
-
-      // a + b
-      //   ^ node
-      //  ^ previous (whitespace)
-      let previous = ctx.siblings[idx - 1]
-      if (previous?.kind !== 'separator' || previous.value !== ' ') return
-
-      // a + b
-      //   ^ node
-      //    ^ next (whitespace)
-      let next = ctx.siblings[idx + 1]
-      if (next?.kind !== 'separator' || next.value !== ' ') return
-
-      // a + b
-      //   ^ node
-      // ^ previous (node)
-      let previousPrevious = ctx.siblings[idx - 2]
-      if (previousPrevious && symbols.has(previousPrevious.value)) return
-
-      // a + b
-      //   ^ node
-      //     ^ next (node)
-      let nextNext = ctx.siblings[idx + 2]
-      if (nextNext && symbols.has(nextNext.value)) return
-
-      drop.add(previous)
-      drop.add(next)
-    }
-
-    // Leading and trailing whitespace
-    else if (node.kind === 'separator' && node.value.length > 0 && node.value.trim() === '') {
-      if (ctx.siblings[0] === node || ctx.siblings[ctx.siblings.length - 1] === node) {
-        drop.add(node)
-      }
-    }
-
-    // Whitespace around `,` separators can be removed.
-    // E.g.: `min(1px , 2px)` -> `min(1px,2px)`
-    else if (node.kind === 'separator' && node.value.trim() === ',') {
-      node.value = ','
-    }
-
-    // Wrap custom functions starting with `--`, in parentheses if preceded by
-    // a symbol. E.g.: `calc(100%---spacing(2))` → `calc(100%-(--spacing(2)))`
-    else if (node.kind === 'function' && node.value.startsWith('--')) {
-      let idx = ctx.index
-
-      // When it's the first argument, then we don't have to wrap it in `(…)`
-      //
-      // E.g.: `--spacing(…)`, no need to wrap
-      //       `calc(100%---spacing(…))`, we want to wrap
-      //
-      if (idx <= 0) return
-
-      // When it's not the first argument, we likely want to wrap it. However,
-      // when it's separated by a `,` then it's readable enough.
-      //
-      // E.g.: `min(100%,--spacing(2))` is readable, in fact
-      //       `min(100%,(--spacing(2)))` would make it worse
-      let previous = ctx.siblings[idx - 1]
-      if (previous?.kind === 'separator' && previous.value === ',') return
-
-      // When it's part of a bigger list, aka no special symbols were used, then
-      // we don't have to wrap it either.
-      //
-      // E.g.: `shadow-[inset_0px_1px_--theme(--color-white/15%)]`, wrapping would look unnecessary:
-      //       `shadow-[inset_0px_1px_(--theme(--color-white/15%))]`
-      let previousPrevious = ctx.siblings[idx - 2]
-      if (previousPrevious && !symbols.has(previousPrevious.value)) return
-
-      return WalkAction.ReplaceSkip({
-        kind: 'function',
-        value: '', // Unnamed, so will result in `(…)`
-        nodes: [node],
-      } satisfies ValueFunctionNode)
-    }
-  })
-
-  if (drop.size > 0) {
-    walk(ast, (node) => {
-      if (drop.has(node)) {
-        drop.delete(node)
-        return WalkAction.ReplaceSkip([])
-      }
-    })
-  }
-
-  recursivelyEscapeUnderscores(ast)
-
-  return ValueParser.toCss(ast)
-})
-export function printArbitraryValue(input: string) {
-  return printArbitraryValueCache.get(input)
-}
-
-const simplifyArbitraryVariantCache = new DefaultMap<string, string>((input) => {
-  let ast = ValueParser.parse(input)
-
-  // &:is(…)
-  if (
-    ast.length === 3 &&
-    // &
-    ast[0].kind === 'word' &&
-    ast[0].value === '&' &&
-    // :
-    ast[1].kind === 'separator' &&
-    ast[1].value === ':' &&
-    // is(…)
-    ast[2].kind === 'function' &&
-    ast[2].value === 'is'
-  ) {
-    return ValueParser.toCss(ast[2].nodes)
-  }
-
-  return input
-})
-function simplifyArbitraryVariant(input: string) {
-  return simplifyArbitraryVariantCache.get(input)
-}
-
-function recursivelyEscapeUnderscores(ast: ValueParser.ValueAstNode[]) {
-  for (let node of ast) {
-    switch (node.kind) {
-      case 'function': {
-        if (node.value === 'url' || node.value.endsWith('_url')) {
-          // Don't decode underscores in url() but do decode the function name
-          node.value = escapeUnderscore(node.value)
-          break
-        }
-
-        if (
-          node.value === 'var' ||
-          node.value.endsWith('_var') ||
-          node.value === 'theme' ||
-          node.value.endsWith('_theme')
-        ) {
-          node.value = escapeUnderscore(node.value)
-          for (let i = 0; i < node.nodes.length; i++) {
-            recursivelyEscapeUnderscores([node.nodes[i]])
-          }
-          break
-        }
-
-        node.value = escapeUnderscore(node.value)
-        recursivelyEscapeUnderscores(node.nodes)
-        break
-      }
-      case 'separator':
-        node.value = escapeUnderscore(node.value)
-        break
-      case 'word': {
-        // Dashed idents and variables `var(--my-var)` and `--my-var` should not
-        // have underscores escaped
-        if (node.value[0] !== '-' || node.value[1] !== '-') {
-          node.value = escapeUnderscore(node.value)
-        }
-        break
-      }
-      default:
-        never(node)
-    }
-  }
-}
-
-const isVarCache = new DefaultMap<string, boolean>((value) => {
-  let ast = ValueParser.parse(value)
-  return ast.length === 1 && ast[0].kind === 'function' && ast[0].value === 'var'
-})
-function isVar(value: string) {
-  return isVarCache.get(value)
-}
-
-function never(value: never): never {
-  throw new Error(`Unexpected value: ${value}`)
-}
-
-function escapeUnderscore(value: string): string {
-  return value
-    .replaceAll('_', String.raw`\_`) // Escape underscores to keep them as-is
-    .replaceAll(' ', '_') // Replace spaces with underscores
+  } while (idx > 0)
 }
diff --git a/packages/tailwindcss/src/canonicalize-calc-expressions.test.ts b/packages/tailwindcss/src/canonicalize-calc-expressions.test.ts
deleted file mode 100644
index f612e5f7b..000000000
--- a/packages/tailwindcss/src/canonicalize-calc-expressions.test.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import { expect, it } from 'vitest'
-import { canonicalizeCalcExpressions } from './canonicalize-calc-expressions'
-
-it.each([
-  ['calc(-1 * var(--foo))', 'calc(var(--foo) * -1)'],
-  ['calc(1rem + var(--foo))', 'calc(var(--foo) + 1rem)'],
-  ['calc(2rem * calc(3px * var(--foo)))', 'calc(calc(var(--foo) * 3px) * 2rem)'],
-  ['calc(var(--b) + var(--a))', 'calc(var(--a) + var(--b))'],
-  ['calc(3px * 2rem)', 'calc(2rem * 3px)'],
-  ['calc(5px * 3px)', 'calc(3px * 5px)'],
-  ['calc(1 * 1rem)', 'calc(1rem * 1)'],
-  ['calc(10 + 2)', 'calc(2 + 10)'],
-])('`%s` → `%s` (%#)', (input, expected) => {
-  expect(canonicalizeCalcExpressions(input)).toBe(expected)
-})
-
-it.each([
-  ['calc(1rem - var(--foo))'],
-  ['calc(1rem / 2)'],
-  ['calc(var(--a) + 1rem)'],
-  ['calc(2rem * 3px)'],
-])('should keep `%s` (%#)', (input) => {
-  expect(canonicalizeCalcExpressions(input)).toBe(input)
-})
diff --git a/packages/tailwindcss/src/canonicalize-calc-expressions.ts b/packages/tailwindcss/src/canonicalize-calc-expressions.ts
deleted file mode 100644
index 7e08f8622..000000000
--- a/packages/tailwindcss/src/canonicalize-calc-expressions.ts
+++ /dev/null
@@ -1,82 +0,0 @@
-import { dimensions } from './utils/dimensions'
-import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
-
-// Assumption: We already assume that we receive somewhat valid `calc()`
-// expressions. So we will see `calc(1 + 1)` and not `calc(1+1)`
-export function canonicalizeCalcExpressions(input: string): string {
-  let [canonicalized, valueAst] = canonicalizeCalcExpressionsAst(ValueParser.parse(input))
-
-  return canonicalized ? ValueParser.toCss(valueAst) : input
-}
-
-export function canonicalizeCalcExpressionsAst(
-  ast: ValueParser.ValueAstNode[],
-): [canonicalized: boolean, ast: ValueParser.ValueAstNode[]] {
-  let canonicalized = false
-
-  walk(ast, {
-    exit(valueNode) {
-      // We are only interested in binary expressions in `calc(…)` and `(…)`,
-      // and only with the `*` or `+` operators.
-      if (valueNode.kind !== 'function') return
-      if (valueNode.value !== 'calc' && valueNode.value !== '') return
-      if (valueNode.nodes.length !== 5) return
-      if (valueNode.nodes[2].kind !== 'word') return
-      if (valueNode.nodes[2].value !== '*' && valueNode.nodes[2].value !== '+') return
-
-      let lhs = valueNode.nodes[0]
-      let rhs = valueNode.nodes[4]
-
-      if (shouldSwap(lhs, rhs)) {
-        canonicalized = true
-
-        let replacement: ValueParser.ValueFunctionNode = {
-          kind: 'function',
-          value: valueNode.value,
-          nodes: [
-            rhs, // Now lhs
-            valueNode.nodes[1], // Separator
-            valueNode.nodes[2], // Operator
-            valueNode.nodes[3], // Separator
-            lhs, // Now rhs
-          ],
-        }
-
-        return WalkAction.ReplaceSkip(replacement)
-      }
-    },
-  })
-
-  return [canonicalized, ast]
-}
-
-function shouldSwap(lhs: ValueParser.ValueAstNode, rhs: ValueParser.ValueAstNode): boolean {
-  let lhsDimension = lhs.kind === 'word' ? dimensions.get(lhs.value) : null
-  let rhsDimension = rhs.kind === 'word' ? dimensions.get(rhs.value) : null
-
-  if (lhsDimension !== null && rhsDimension === null) return true
-  if (lhsDimension === null && rhsDimension !== null) return false
-
-  if (lhsDimension !== null && rhsDimension !== null) {
-    let [lhsValue, lhsUnit] = lhsDimension
-    let [rhsValue, rhsUnit] = rhsDimension
-
-    // Within dimensions, keep unit-bearing values ahead of unitless numbers so
-    // `1rem` sorts before `1`.
-    if (lhsUnit === null && rhsUnit !== null) return true
-    if (lhsUnit !== null && rhsUnit === null) return false
-
-    // Then sort dimensions numerically, and finally by unit for ties.
-    if (lhsValue !== rhsValue) {
-      return lhsValue - rhsValue > 0
-    }
-
-    if (lhsUnit !== rhsUnit) {
-      return (lhsUnit ?? '').localeCompare(rhsUnit ?? '') > 0
-    }
-  }
-
-  // Both nodes are unknown values (not dimensions), sort them as strings
-  return ValueParser.toCss([lhs]).localeCompare(ValueParser.toCss([rhs])) > 0
-}
diff --git a/packages/tailwindcss/src/canonicalize-candidates.test.ts b/packages/tailwindcss/src/canonicalize-candidates.test.ts
deleted file mode 100644
index 567f0ad0d..000000000
--- a/packages/tailwindcss/src/canonicalize-candidates.test.ts
+++ /dev/null
@@ -1,1663 +0,0 @@
-import { randomUUID } from 'node:crypto'
-import fs from 'node:fs'
-import path from 'node:path'
-import { describe, expect, test } from 'vitest'
-import { __unstable__loadDesignSystem } from '.'
-import { cartesian } from './cartesian'
-import type { CanonicalizeOptions } from './intellisense'
-import plugin from './plugin'
-import { DefaultMap } from './utils/default-map'
-
-const css = String.raw
-const timeout = 25_000
-const defaultTheme = fs.readFileSync(path.resolve(__dirname, '../theme.css'), 'utf8')
-
-const designSystems = new DefaultMap((base: string) => {
-  return new DefaultMap((input: string) => {
-    return __unstable__loadDesignSystem(input, {
-      base,
-      async loadStylesheet() {
-        return {
-          path: '',
-          base: '',
-          content: css`
-            @tailwind utilities;
-
-            ${defaultTheme}
-
-            /* TODO(perf): Only here to speed up the tests */
-            @theme {
-              --*: initial;
-              --breakpoint-lg: 64rem;
-              --breakpoint-md: 48rem;
-              --color-blue-200: oklch(88.2% 0.059 254.128);
-              --color-blue-500: oklch(62.3% 0.214 259.815);
-              --color-red-500: oklch(63.7% 0.237 25.331);
-              --color-white: #fff;
-              --container-md: 28rem;
-              --font-weight-normal: 400;
-              --leading-relaxed: 1.625;
-              --spacing: 0.25rem;
-              --text-sm--line-height: calc(1.25 / 0.875);
-              --text-sm: 0.875rem;
-              --text-xs--line-height: calc(1 / 0.75);
-              --text-xs: 0.75rem;
-            }
-          `,
-        }
-      },
-    })
-  })
-})
-
-const DEFAULT_CANONICALIZATION_OPTIONS: CanonicalizeOptions = {
-  rem: 16,
-  collapse: true,
-  logicalToPhysical: true,
-}
-
-describe.each([['default'], ['with-variant'], ['important'], ['prefix']])('%s', (strategy) => {
-  let testName = '%s → %s (%#)'
-  if (strategy === 'with-variant') {
-    testName = testName.replaceAll('%s', 'focus:%s')
-  } else if (strategy === 'important') {
-    testName = testName.replaceAll('%s', '%s!')
-  } else if (strategy === 'prefix') {
-    testName = testName.replaceAll('%s', 'tw:%s')
-  }
-
-  function prepare(candidate: string) {
-    if (strategy === 'with-variant') {
-      candidate = `focus:${candidate}`
-    } else if (strategy === 'important') {
-      candidate = `${candidate}!`
-    } else if (strategy === 'prefix') {
-      candidate = `tw:${candidate}`
-
-      // Prefix all known CSS variables with `--tw-`, except when used inside of `--theme(…)`.
-      if (candidate.includes('--')) {
-        candidate = candidate
-          .replace(
-            // Replace the variable, as long as it is preceded by a `(`, e.g.:
-            // `bg-(--foo)` or an `:` in case of `bg-(color:--foo)`.
-            //
-            // It also has to end in a `,` or `)` to prevent replacing functions
-            // that look like variables, e.g.: `--spacing(…)`
-            /([(:])--([\w-]+)([,)])/g,
-            (_, start, variable, end) => `${start}--tw-${variable}${end}`,
-          )
-          .replaceAll('--theme(--tw-', '--theme(--')
-      }
-    }
-
-    return candidate
-  }
-
-  async function expectCanonicalization(
-    input: string,
-    candidates: string,
-    expected: string,
-    options: CanonicalizeOptions = DEFAULT_CANONICALIZATION_OPTIONS,
-  ) {
-    let preparedCandidates = candidates.split(/\s+/g).map(prepare)
-    let preparedExpected = expected.split(/\s+/g).map(prepare)
-
-    if (strategy === 'prefix') {
-      input = input.replace("@import 'tailwindcss';", "@import 'tailwindcss' prefix(tw);")
-    }
-
-    let designSystem = await designSystems.get(__dirname).get(input)
-    let actual = designSystem.canonicalizeCandidates(preparedCandidates, options)
-
-    try {
-      expect(actual).toEqual(preparedExpected)
-    } catch (err) {
-      if (err instanceof Error) Error.captureStackTrace(err, expectCanonicalization)
-      throw err
-    }
-  }
-
-  /// ----------------------------------
-
-  describe('deprecated utilities', () => {
-    test.each([
-      /// Legacy bg-gradient-* → bg-linear-*
-      ['bg-gradient-to-t', 'bg-linear-to-t'],
-      ['bg-gradient-to-tr', 'bg-linear-to-tr'],
-      ['bg-gradient-to-r', 'bg-linear-to-r'],
-      ['bg-gradient-to-br', 'bg-linear-to-br'],
-      ['bg-gradient-to-b', 'bg-linear-to-b'],
-      ['bg-gradient-to-bl', 'bg-linear-to-bl'],
-      ['bg-gradient-to-l', 'bg-linear-to-l'],
-      ['bg-gradient-to-tl', 'bg-linear-to-tl'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    let deprecated: [string, string][] = [
-      ['order-none', 'order-0'],
-      ['break-words', 'wrap-break-word'],
-      ['overflow-ellipsis', 'text-ellipsis'],
-
-      ['start-full', 'inset-s-full'],
-      ['-start-full', '-inset-s-full'],
-      ['start-auto', 'inset-s-auto'],
-      ['start-px', 'inset-s-px'],
-      ['-start-px', '-inset-s-px'],
-      ['start-8', 'inset-s-8'], // Within default spacing scale
-      ['-start-8', '-inset-s-8'], // Within default spacing scale
-      ['start-123', 'inset-s-123'], // Outside of default spacing scale
-      ['-start-123', '-inset-s-123'], // Outside of default spacing scale
-
-      ['end-full', 'inset-e-full'],
-      ['-end-full', '-inset-e-full'],
-      ['end-auto', 'inset-e-auto'],
-      ['end-px', 'inset-e-px'],
-      ['-end-px', '-inset-e-px'],
-      ['end-8', 'inset-e-8'], // Within default spacing scale
-      ['-end-8', '-inset-e-8'], // Within default spacing scale
-      ['end-123', 'inset-e-123'], // Outside of default spacing scale
-      ['-end-123', '-inset-e-123'], // Outside of default spacing scale
-    ]
-
-    test.each(deprecated)(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    describe('With custom implementation', () => {
-      // Creating a shared CSS file such that we can re-use the same design
-      // system for all of these.
-      let customImplementations = deprecated
-        .map(
-          ([candidate]) => css`
-          @utility ${candidate} {
-            --custom-${randomUUID()}: implementation;
-          }
-        `,
-        )
-        .join('\n')
-
-      // Keep the current utility because of the custom implementation
-      test.each(deprecated.map(([candidate]) => [candidate, candidate]))(
-        testName,
-        { timeout },
-        async (candidate, expected) => {
-          let input = css`
-            @import 'tailwindcss';
-
-            ${customImplementations}
-          `
-
-          await expectCanonicalization(input, candidate, expected)
-        },
-      )
-    })
-  })
-
-  describe('arbitrary properties', () => {
-    test.each([
-      /// theme(…) to `var(…)`
-      // Keep candidates that don't contain `theme(…)` or `theme(…, …)`
-      ['[color:red]', 'text-[red]'],
-
-      // Handle special cases around `.1` in the `theme(…)`
-      ['[--value:theme(spacing.1)]', '[--value:--spacing(1)]'],
-      ['[--value:theme(fontSize.xs.1.lineHeight)]', '[--value:var(--text-xs--line-height)]'],
-      ['[--value:theme(spacing[1.25])]', '[--value:--spacing(1.25)]'],
-
-      // Should not convert invalid spacing values to calc
-      ['[--value:theme(spacing[1.1])]', '[--value:theme(spacing[1.1])]'],
-
-      // Convert to `var(…)` if we can resolve the path
-      ['[color:theme(colors.red.500)]', 'text-red-500'], // Arbitrary property
-      ['[color:theme(colors.red.500)]/50', 'text-red-500/50'], // Arbitrary property + modifier
-
-      // Multiple `theme(… / …)` calls should result in modern syntax of `theme(…)`
-      // - Can't convert to `var(…)` because that would lose the modifier.
-      // - Can't convert to a candidate modifier because there are multiple
-      //   `theme(…)` calls.
-      //
-      //   If we really want to, we can make a fancy migration that tries to move it
-      //   to a candidate modifier _if_ all `theme(…)` calls use the same modifier.
-      [
-        '[color:theme(colors.red.500/50,theme(colors.blue.500/50))]',
-        'text-[--theme(--color-red-500/50,--theme(--color-blue-500/50))]',
-      ],
-      [
-        '[color:theme(colors.red.500/50,theme(colors.blue.500/50))]/50',
-        'text-[--theme(--color-red-500/50,--theme(--color-blue-500/50))]/50',
-      ],
-
-      // Convert the `theme(…)`, but try to move the inline modifier (e.g. `50%`),
-      // to a candidate modifier.
-      // Arbitrary property, with simple percentage modifier
-      ['[color:theme(colors.red.500/75%)]', 'text-red-500/75'],
-
-      // Arbitrary property, with numbers (0-1) without a unit
-      ['[color:theme(colors.red.500/.12)]', 'text-red-500/12'],
-      ['[color:theme(colors.red.500/0.12)]', 'text-red-500/12'],
-
-      // Arbitrary property, with more complex modifier (we only allow whole numbers
-      // as bare modifiers). Convert the complex numbers to arbitrary values instead.
-      ['[color:theme(colors.red.500/12.34%)]', 'text-red-500/[12.34%]'],
-      ['[color:theme(colors.red.500/var(--opacity))]', 'text-red-500/(--opacity)'],
-      ['[color:theme(colors.red.500/.12345)]', 'text-red-500/1234.5'],
-      ['[color:theme(colors.red.500/50.25%)]', 'text-red-500/50.25'],
-
-      // Arbitrary property that already contains a modifier
-      ['[color:theme(colors.red.500/50%)]/50', 'text-[--theme(--color-red-500/50%)]/50'],
-
-      // `calc(var(--spacing)*…)` to `--spacing(…)`
-      ['[padding-top:min(20%,calc(var(--spacing)*8))]', 'pt-[min(20%,--spacing(8))]'],
-      [
-        '[padding-top:min(20%,calc(var(--spacing)*var(--other)))]',
-        'pt-[min(20%,--spacing(var(--other)))]',
-      ],
-      ['[padding-top:calc(var(--spacing)*8)]', 'pt-8'],
-      ['[padding-top:calc(var(--spacing)*var(--other))]', 'pt-[--spacing(var(--other))]'],
-
-      // `theme(…)` calls valid in v3, but not in v4 should still be converted.
-      ['[--foo:theme(transitionDuration.500)]', '[--foo:theme(transitionDuration.500)]'],
-
-      // Invalid cases
-      ['[--foo:theme(colors.red.500/50/50)]', '[--foo:theme(colors.red.500/50/50)]'],
-      ['[--foo:theme(colors.red.500/50/50)]/50', '[--foo:theme(colors.red.500/50/50)]/50'],
-
-      // Partially invalid cases
-      [
-        '[--foo:theme(colors.red.500/50/50)_theme(colors.blue.200)]',
-        '[--foo:theme(colors.red.500/50/50)_var(--color-blue-200)]',
-      ],
-      [
-        '[--foo:theme(colors.red.500/50/50)_theme(colors.blue.200)]/50',
-        '[--foo:theme(colors.red.500/50/50)_var(--color-blue-200)]/50',
-      ],
-
-      // If a utility sets `property` and `--tw-{property}` with the same value,
-      // we can ignore the `--tw-{property}`. This is just here for composition.
-      // This means that we should be able to upgrade the one _without_ to the one
-      // _with_ the variable
-      ['[font-weight:400]', 'font-normal'],
-      ['[line-height:0]', 'leading-0'],
-      ['[border-style:solid]', 'border-solid'],
-
-      // Do not constant fold `0<unit>` to `0` when the type is unknown (which
-      // is often the case with CSS variables)
-      ['[--foo:0px]', '[--foo:0px]'],
-      ['[--foo:calc(0px*1)]', '[--foo:calc(0px*1)]'],
-      ['[--foo:calc(0*1rem)]', '[--foo:calc(0*1rem)]'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test.each([
-      // Arbitrary property to static utility
-      ['[text-wrap:balance]', 'text-balance'],
-
-      // Arbitrary property to static utility with slight differences in
-      // whitespace. This will require some canonicalization.
-      ['[display:_flex_]', 'flex'],
-      ['[display:_flex]', 'flex'],
-      ['[display:flex_]', 'flex'],
-
-      // Arbitrary property to named functional utility
-      ['[color:var(--color-red-500)]', 'text-red-500'],
-      ['[background-color:var(--color-red-500)]', 'bg-red-500'],
-
-      // Arbitrary property to named utility (case insensitive)
-      ['[color:#fff]', 'text-white'],
-      ['[color:#FFF]', 'text-white'],
-
-      // Arbitrary property with modifier to named functional utility with modifier
-      ['[color:var(--color-red-500)]/25', 'text-red-500/25'],
-
-      // Arbitrary property with arbitrary modifier to named functional utility with
-      // arbitrary modifier
-      ['[color:var(--color-red-500)]/[25%]', 'text-red-500/25'],
-      ['[color:var(--color-red-500)]/[100%]', 'text-red-500'],
-      ['[color:var(--color-red-500)]/100', 'text-red-500'],
-      ['[color:var(--color-red-500)]/[10%]', 'text-red-500/10'],
-      ['[color:var(--color-red-500)]/[10.0%]', 'text-red-500/10'],
-      ['[color:var(--color-red-500)]/[.1]', 'text-red-500/10'],
-      ['[color:var(--color-red-500)]/[.10]', 'text-red-500/10'],
-      // No need for `/50` because that's already encoded in the `--color-primary`
-      // value
-      ['[color:oklch(62.3%_0.214_259.815)]/50', 'text-primary'],
-
-      // Arbitrary property to arbitrary value
-      ['[max-height:20%]', 'max-h-[20%]'],
-
-      // Arbitrary property to bare value
-      ['[grid-column:2]', 'col-2'],
-      ['[grid-column:1234]', 'col-1234'],
-
-      // Complex arbitrary property to arbitrary value
-      [
-        '[grid-template-columns:repeat(2,minmax(100px,1fr))]',
-        'grid-cols-[repeat(2,minmax(100px,1fr))]',
-      ],
-      // Complex arbitrary property to bare value
-      ['[grid-template-columns:repeat(2,minmax(0,1fr))]', 'grid-cols-2'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-
-        @theme {
-          --*: initial;
-          --spacing: 0.25rem;
-          --color-red-500: red;
-          --color-white: #fff;
-
-          /* Equivalent of blue-500/50 */
-          --color-primary: color-mix(in oklab, oklch(62.3% 0.214 259.815) 50%, transparent);
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('arbitrary values', () => {
-    test.each([
-      // Convert to `var(…)` if we can resolve the path
-      ['bg-[theme(colors.red.500)]', 'bg-red-500'], // Arbitrary value
-      ['bg-[size:theme(spacing.4)]', 'bg-size-[--spacing(4)]'], // Arbitrary value + data type hint
-
-      // Pretty print CSS functions preceded by an operator to prevent consecutive
-      // operator characters.
-      ['w-[calc(100dvh-theme(spacing.2))]', 'w-[calc(100dvh-(--spacing(2)))]'],
-      ['w-[calc(100dvh+theme(spacing.2))]', 'w-[calc(100dvh+(--spacing(2)))]'],
-      ['w-[calc(100dvh/theme(spacing.2))]', 'w-[calc(100dvh/(--spacing(2)))]'],
-      ['w-[calc(100dvh*theme(spacing.2))]', 'w-[calc(100dvh*(--spacing(2)))]'],
-
-      // Convert to `var(…)` if we can resolve the path, but keep fallback values
-      ['bg-[theme(colors.red.500,red)]', 'bg-(--color-red-500,red)'],
-
-      // Keep `theme(…)` if we can't resolve the path
-      ['bg-[theme(colors.foo.1000)]', 'bg-[theme(colors.foo.1000)]'],
-
-      // Keep `theme(…)` if we can't resolve the path, but still try to convert the
-      // fallback value.
-      ['bg-[theme(colors.foo.1000,theme(colors.red.500))]', 'bg-red-500'],
-
-      // Use `theme(…)` (deeply nested) inside of a `calc(…)` function
-      ['text-[calc(theme(fontSize.xs)*2)]', 'text-[calc(var(--text-xs)*2)]'],
-
-      // Arbitrary value
-      ['bg-[theme(colors.red.500/75%)]', 'bg-red-500/75'],
-      ['bg-[theme(colors.red.500/12.34%)]', 'bg-red-500/[12.34%]'],
-
-      // Arbitrary value with different casing
-      ['bg-[#fff]', 'bg-white'],
-      ['bg-[#FFF]', 'bg-white'],
-
-      // Values that don't contain only `theme(…)` calls should not be converted to
-      // use a modifier since the color is not the whole value.
-      [
-        'shadow-[shadow:inset_0px_1px_theme(colors.white/15%)]',
-        'shadow-[inset_0px_1px_--theme(--color-white/15%)]',
-      ],
-
-      // Arbitrary value, where the candidate already contains a modifier
-      // This should still migrate the `theme(…)` syntax to the modern syntax.
-      ['bg-[theme(colors.red.500/50%)]/50', 'bg-[--theme(--color-red-500/50%)]/50'],
-
-      // Variants, we can't use `var(…)` especially inside of `@media(…)`. But
-      // since the value matches the `lg` breakpoint exactly, we can migrate to
-      // the `max-lg` variant.
-      ['max-[theme(screens.lg)]:flex', 'max-lg:flex'],
-      ['min-[theme(screens.lg)]:flex', 'lg:flex'], // We could also map to `min-lg:flex`
-      // There are no variables for `--spacing` multiples, so we can't convert this
-      ['max-[theme(spacing.4)]:flex', 'max-[theme(spacing.4)]:flex'],
-
-      // This test in itself doesn't make much sense. But we need to make sure
-      // that this doesn't end up as the modifier in the candidate itself.
-      ['max-[theme(spacing.4/50)]:flex', 'max-[theme(spacing.4/50)]:flex'],
-
-      // `theme(…)` calls in another CSS function is replaced correctly.
-      // Additionally we remove unnecessary whitespace.
-      ['grid-cols-[min(50%_,_theme(spacing.80))_auto]', 'grid-cols-[min(50%,--spacing(80))_auto]'],
-
-      // `calc(var(--spacing)*…)` to `--spacing(…)`
-      ['pt-[min(20%,calc(var(--spacing)*8))]', 'pt-[min(20%,--spacing(8))]'],
-      ['pt-[min(20%,calc(var(--spacing)*var(--other)))]', 'pt-[min(20%,--spacing(var(--other)))]'],
-      ['pt-[calc(var(--spacing)*8)]', 'pt-8'],
-      ['pt-[calc(var(--spacing)*var(--other))]', 'pt-[--spacing(var(--other))]'],
-
-      // Renamed theme keys
-      ['max-w-[theme(screens.md)]', 'max-w-(--breakpoint-md)'],
-      ['w-[theme(maxWidth.md)]', 'w-md'],
-
-      // Arbitrary property to static utility
-      // Map number to keyword-like value
-      ['leading-[1]', 'leading-none'],
-
-      // Arbitrary value to bare value
-      ['border-[2px]', 'border-2'],
-      ['border-[1234px]', 'border-1234'],
-
-      // Arbitrary value with data type, to more specific arbitrary value
-      ['bg-[position:123px]', 'bg-position-[123px]'],
-      ['bg-[size:123px]', 'bg-size-[123px]'],
-
-      // Arbitrary value with inferred data type, to more specific arbitrary value
-      ['bg-[123px]', 'bg-position-[123px]'],
-
-      // Arbitrary value with spacing mul
-      ['w-[64rem]', 'w-256'],
-
-      // Arbitrary value to bare value with percentage
-      ['from-[25%]', 'from-25%'],
-
-      // Arbitrary percentage value must be a whole number. Should not migrate to
-      // a bare value.
-      ['from-[2.5%]', 'from-[2.5%]'],
-
-      // Negative arbitrary values can be simplified
-      // 1. Try to move the sign _inside_ the arbitrary value
-      // 2. Try to move the sign _out_ of the arbitrary value
-      ['-mt-[12rem]', '-mt-48'], // Arbitrary value → bare value
-      ['-mt-[-12rem]', 'mt-48'], // Double negation
-      ['-mt-[12.34rem]', 'mt-[-12.34rem]'], // Move `-` inside
-      ['-mt-[-12.34rem]', 'mt-[12.34rem]'], // Move `-` inside, double negation
-      ['-mt-[12.34px]', 'mt-[-12.34px]'],
-      ['-mt-[-12.34px]', 'mt-[12.34px]'],
-      ['-mt-[492px]', '-mt-123'], // Moving inside, allows us to migrate to a bare value
-      ['-mt-[calc(-1*492px)]', 'mt-123'], // Double negation and constant folding into bare value
-      ['-mt-[-492px]', 'mt-123'],
-      ['-mt-[calc(-1*-492px)]', '-mt-123'], // Constant folding with calc expressions
-      ['-mt-(--my-var)', '-mt-(--my-var)'], // Keep as-is
-      ['-mt-[var(--my-var)]', '-mt-(--my-var)'], // Keep as-is, but convert to shorthand
-      ['mt-[calc(var(--my-var)*-1)]', '-mt-(--my-var)'], // Move `-` out
-      ['mt-[calc(-1*var(--my-var))]', '-mt-(--my-var)'], // Move `-` out
-      ['-mt-[calc(var(--my-var)*-1)]', 'mt-(--my-var)'], // Move `-` out
-      ['-mt-[calc(-1*var(--my-var))]', 'mt-(--my-var)'], // Move `-` out
-      ['mt-[calc(-1*calc(-1*var(--my-var)))]', 'mt-(--my-var)'], // Move `-` out
-      ['-mt-[calc(-1*calc(-1*var(--my-var)))]', '-mt-(--my-var)'], // Move `-` out
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --color-white: #fff;
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('arbitrary utilities', () => {
-    test('migrate with custom static utility `@utility custom {…}`', { timeout }, async () => {
-      let candidate = '[--key:value]'
-      let expected = 'custom'
-
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --*: initial;
-        }
-        @utility custom {
-          --key: value;
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test(
-      'migrate with custom functional utility `@utility custom-* {…}`',
-      { timeout },
-      async () => {
-        let candidate = '[--key:value]'
-        let expected = 'custom-value'
-
-        let input = css`
-          @import 'tailwindcss';
-          @theme {
-            --*: initial;
-          }
-          @utility custom-* {
-            --key: --value('value');
-          }
-        `
-
-        await expectCanonicalization(input, candidate, expected)
-      },
-    )
-
-    test(
-      'migrate with custom functional utility `@utility custom-* {…}` that supports bare values',
-      { timeout },
-      async () => {
-        let candidate = '[--resolved-value:4]'
-        let expected = 'example-4'
-
-        let input = css`
-          @import 'tailwindcss';
-          @theme {
-            --*: initial;
-          }
-          @utility example-* {
-            --resolved-value: --value(integer);
-          }
-        `
-
-        await expectCanonicalization(input, candidate, expected)
-      },
-    )
-
-    test.each([
-      ['[--resolved-value:0]', 'example-0'],
-      ['[--resolved-value:4]', 'example-4'],
-      ['[--resolved-value:8]', 'example-a'],
-      ['example-[0]', 'example-0'],
-      ['example-[4]', 'example-4'],
-      ['example-[8]', 'example-a'],
-    ])(
-      'migrate custom @utility from arbitrary values to bare values and named values (based on theme)',
-      async (candidate, expected) => {
-        let input = css`
-          @import 'tailwindcss';
-          @theme {
-            --*: initial;
-            --example-a: 8;
-          }
-
-          @utility example-* {
-            --resolved-value: --value(--example, integer, [integer]);
-          }
-        `
-
-        await expectCanonicalization(input, candidate, expected)
-      },
-    )
-
-    describe.each([['@theme'], ['@theme inline']])('%s', (theme) => {
-      test.each([
-        ['[color:CanvasText]', 'text-canvas'],
-        ['text-[CanvasText]', 'text-canvas'],
-      ])(`migrate arbitrary value to theme value ${testName}`, async (candidate, expected) => {
-        let input = css`
-          @import 'tailwindcss';
-          ${theme} {
-            --*: initial;
-            --color-canvas: CanvasText;
-          }
-        `
-
-        await expectCanonicalization(input, candidate, expected)
-      })
-
-      // Some utilities read from specific namespaces, in this case we do not want
-      // to migrate to a value in that namespace if we reference a variable that
-      // results in the same value, but comes from a different namespace.
-      //
-      // E.g.: `max-w` reads from: ['--max-width', '--spacing', '--container']
-      test.each([
-        // `max-w` does not read from `--breakpoint-md`, but `--breakpoint-md`  and
-        // `--container-3xl` happen to result in the same value. The difference is
-        // the semantics of the value.
-        ['max-w-(--breakpoint-md)', 'max-w-(--breakpoint-md)'],
-        ['max-w-(--container-3xl)', 'max-w-3xl'],
-      ])(
-        `migrate arbitrary value to theme value ${testName}`,
-        { timeout },
-        async (candidate, expected) => {
-          let input = css`
-            @import 'tailwindcss';
-            ${theme} {
-              --*: initial;
-              --breakpoint-md: 48rem;
-              --container-3xl: 48rem;
-            }
-          `
-
-          await expectCanonicalization(input, candidate, expected)
-        },
-      )
-    })
-
-    test(
-      'migrate an arbitrary property without spaces, to a theme value with spaces (canonicalization)',
-      { timeout },
-      async () => {
-        let candidate = 'font-[foo,bar,baz]'
-        let expected = 'font-example'
-        let input = css`
-          @import 'tailwindcss';
-          @theme {
-            --*: initial;
-            --font-example: foo, bar, baz;
-          }
-        `
-
-        await expectCanonicalization(input, candidate, expected)
-      },
-    )
-
-    test.each([
-      // Default spacing scale
-      ['w-[64rem]', 'w-256', '0.25rem'],
-
-      // Non-suggested numbers
-      ['gap-[7.25rem]', 'gap-29', '0.25rem'],
-      ['gap-[calc(7rem+0.25rem)]', 'gap-29', '0.25rem'],
-      ['gap-[116px]', 'gap-29', '0.25rem'],
-
-      // Non-suggested numbers, with the same spacing scale with different
-      // units
-      ['gap-[7.25rem]', 'gap-29', '4px'],
-      ['gap-[calc(7rem+0.25rem)]', 'gap-29', '4px'],
-      ['gap-[116px]', 'gap-29', '4px'],
-
-      // Non-suggested numbers, with a different spacing scale
-      ['gap-[7.25rem]', 'gap-116', '1px'],
-      ['gap-[calc(7rem+0.25rem)]', 'gap-116', '1px'],
-      ['gap-[116px]', 'gap-116', '1px'],
-
-      // Keep arbitrary value if units are different
-      ['w-[124px]', 'w-31', '0.25rem'],
-
-      // Keep arbitrary value if bare value doesn't fit in steps of .25
-      ['w-[0.123rem]', 'w-[0.123rem]', '0.25rem'],
-
-      // Custom pixel based spacing scale
-      ['w-[123px]', 'w-123', '1px'],
-      ['w-[256px]', 'w-128', '2px'],
-    ])(`${testName} (spacing = \`%s\`)`, { timeout }, async (candidate, expected, spacing) => {
-      let input = css`
-        @import 'tailwindcss';
-
-        @theme {
-          --*: initial;
-          --spacing: ${spacing};
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('bare values', () => {
-    let input = css`
-      @import 'tailwindcss';
-      @theme {
-        --*: initial;
-        --spacing: 0.25rem;
-        --aspect-video: 16 / 9;
-        --example-a: 8;
-      }
-
-      @utility example-* {
-        --resolved-value: --value(--example, integer);
-      }
-    `
-
-    test.each([
-      // Built-in utility with bare value fraction
-      ['aspect-16/9', 'aspect-video'],
-
-      // Custom utility with bare value integer
-      ['example-8', 'example-a'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('arbitrary variants', () => {
-    let input = css`
-      @import 'tailwindcss';
-      @theme {
-        --*: initial;
-        --breakpoint-lg: 64rem;
-      }
-    `
-
-    test.each([
-      // Arbitrary variant to static variant
-      ['[&:focus]:flex', 'focus:flex'],
-
-      // Arbitrary variant to static variant with at-rules
-      ['[@media(scripting:_none)]:flex', 'noscript:flex'],
-
-      // Arbitrary variant to static utility at-rules and with slight differences
-      // in whitespace. This will require some canonicalization.
-      ['[@media(scripting:none)]:flex', 'noscript:flex'],
-      ['[@media(scripting:_none)]:flex', 'noscript:flex'],
-      ['[@media_(scripting:_none)]:flex', 'noscript:flex'],
-
-      // Arbitrary variants with media queries cannot use `var(…)`, but if an
-      // equivalent variant exists we can use that one instead.
-      ['[@media(width>=theme(screens.lg))]:flex', 'lg:flex'], // `min-lg:flex` would also be valid
-      ['[@media(width<theme(screens.lg))]:flex', 'max-lg:flex'],
-
-      // With compound variants
-      ['has-[&:focus]:flex', 'has-focus:flex'],
-      ['not-[&:focus]:flex', 'not-focus:flex'],
-      ['group-[&:focus]:flex', 'group-focus:flex'],
-      ['peer-[&:focus]:flex', 'peer-focus:flex'],
-      ['in-[&:focus]:flex', 'in-focus:flex'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test('unsafe migrations keep the candidate as-is', { timeout }, async () => {
-      // `hover:` also includes an `@media` query in addition to the `&:hover`
-      // state. Migration is not safe because the functionality would be different.
-      let candidate = '[&:hover]:flex'
-      let expected = '[&:hover]:flex'
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --*: initial;
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test('make unsafe migration safe (1)', { timeout }, async () => {
-      // Overriding the `hover:` variant to only use a selector will make the
-      // migration safe.
-      let candidate = '[&:hover]:flex'
-      let expected = 'hover:flex'
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --*: initial;
-        }
-        @variant hover (&:hover);
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test('make unsafe migration safe (2)', { timeout }, async () => {
-      // Overriding the `hover:` variant to only use a selector will make the
-      // migration safe. This time with the long-hand `@variant` syntax.
-      let candidate = '[&:hover]:flex'
-      let expected = 'hover:flex'
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --*: initial;
-        }
-        @variant hover {
-          &:hover {
-            @slot;
-          }
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test('custom selector-based variants', { timeout }, async () => {
-      let candidate = '[&.macos]:flex'
-      let expected = 'is-macos:flex'
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --*: initial;
-        }
-        @variant is-macos (&.macos);
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test('custom @media-based variants', { timeout }, async () => {
-      let candidate = '[@media(prefers-reduced-transparency:reduce)]:flex'
-      let expected = 'transparency-safe:flex'
-      let input = css`
-        @import 'tailwindcss';
-        @theme {
-          --*: initial;
-        }
-        @variant transparency-safe {
-          @media (prefers-reduced-transparency: reduce) {
-            @slot;
-          }
-        }
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('drop unnecessary data types', () => {
-    let input = css`
-      @import 'tailwindcss';
-      @theme {
-        --*: initial;
-        --color-red-500: red;
-      }
-    `
-
-    test.each([
-      // A color value can be inferred from the value
-      ['bg-[color:#008cc]', 'bg-[#008cc]'],
-
-      // A color is the default for `bg-*`
-      ['bg-(color:--my-value)', 'bg-(--my-value)'],
-
-      // A color with a known theme variable migrates to the full utility
-      ['bg-(color:--color-red-500)', 'bg-red-500'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('arbitrary value to bare value', () => {
-    test.each([
-      ['aspect-[12/34]', 'aspect-12/34'],
-      ['aspect-[1.2/34]', 'aspect-[1.2/34]'],
-      ['col-start-[7]', 'col-start-7'],
-      ['flex-[2]', 'flex-2'], // `flex` is implemented as static and functional utilities
-
-      ['grid-cols-[subgrid]', 'grid-cols-subgrid'],
-      ['grid-rows-[subgrid]', 'grid-rows-subgrid'],
-
-      // Handle zeroes
-      ['m-[0]', 'm-0'],
-      ['m-[0px]', 'm-0'],
-      ['m-[0rem]', 'm-0'],
-
-      ['-m-[0]', 'm-0'],
-      ['-m-[0px]', 'm-0'],
-      ['-m-[0rem]', 'm-0'],
-
-      ['m-[-0]', 'm-0'],
-      ['m-[-0px]', 'm-0'],
-      ['m-[-0rem]', 'm-0'],
-
-      ['-m-[-0]', 'm-0'],
-      ['-m-[-0px]', 'm-0'],
-      ['-m-[-0rem]', 'm-0'],
-
-      ['[margin:0]', 'm-0'],
-      ['[margin:-0]', 'm-0'],
-      ['[margin:0px]', 'm-0'],
-
-      // Limit conversions for big values using the `--spacing` multiplier
-      ['left-[99999px]', 'left-[99999px]'], // This would otherwise result in `left-24999.75`
-      ['left-[-99999px]', 'left-[-99999px]'], // This would otherwise result in `-left-24999.75`
-      ['left-[96rem]', 'left-384'], // Within the limit
-      ['left-[-96rem]', '-left-384'], // Within the limit
-      ['left-[calc(96rem+1px)]', 'left-[calc(96rem+1px)]'], // Out of the positive limit
-      ['left-[calc(-96rem-1px)]', 'left-[calc(-96rem-1px)]'], // Out of the negative limit
-      ['z-[9999999]', 'z-9999999'], // `--spacing` multiplier is not used
-
-      // Not a length-unit, can't safely constant fold
-      ['[margin:0%]', 'm-[0%]'],
-
-      // Only 50-200% (inclusive) are valid:
-      // https://developer.mozilla.org/en-US/docs/Web/CSS/font-stretch#percentage
-      ['font-stretch-[50%]', 'font-stretch-50%'],
-      ['font-stretch-[50.5%]', 'font-stretch-[50.5%]'],
-      ['font-stretch-[201%]', 'font-stretch-[201%]'],
-      ['font-stretch-[49%]', 'font-stretch-[49%]'],
-      // Should stay as-is
-      ['font-stretch-[1/2]', 'font-stretch-[1/2]'],
-
-      // Bare value with % is valid for these utilities
-      ['from-[28%]', 'from-28%'],
-      ['via-[28%]', 'via-28%'],
-      ['to-[28%]', 'to-28%'],
-      ['from-[28.5%]', 'from-[28.5%]'],
-      ['via-[28.5%]', 'via-[28.5%]'],
-      ['to-[28.5%]', 'to-[28.5%]'],
-
-      // This test in itself is a bit flawed because `text-[1/2]` currently
-      // generates something. Converting it to `text-1/2` doesn't produce anything.
-      ['text-[1/2]', 'text-[1/2]'],
-
-      // Leading is special, because `leading-[123]` is the direct value of 123, but
-      // `leading-123` maps to `calc(--spacing(123))`.
-      ['leading-[123]', 'leading-[123]'],
-
-      ['data-[selected]:flex', 'data-selected:flex'],
-      ['data-[foo=bar]:flex', 'data-[foo=bar]:flex'],
-
-      ['supports-[gap]:flex', 'supports-gap:flex'],
-      ['supports-[display:grid]:flex', 'supports-[display:grid]:flex'],
-
-      ['group-data-[selected]:flex', 'group-data-selected:flex'],
-      ['group-data-[foo=bar]:flex', 'group-data-[foo=bar]:flex'],
-      ['group-has-data-[selected]:flex', 'group-has-data-selected:flex'],
-
-      ['aria-[selected]:flex', 'aria-[selected]:flex'],
-      ['aria-[selected="true"]:flex', 'aria-selected:flex'],
-      ['aria-[selected*="true"]:flex', 'aria-[selected*="true"]:flex'],
-
-      ['group-aria-[selected]:flex', 'group-aria-[selected]:flex'],
-      ['group-aria-[selected="true"]:flex', 'group-aria-selected:flex'],
-      ['group-has-aria-[selected]:flex', 'group-has-aria-[selected]:flex'],
-
-      ['max-lg:hover:data-[selected]:flex', 'max-lg:hover:data-selected:flex'],
-      [
-        'data-[selected]:aria-[selected="true"]:aspect-[12/34]',
-        'data-selected:aria-selected:aspect-12/34',
-      ],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/20365
-  describe('media query and container query variants', () => {
-    test.each([
-      // Breakpoints (`--breakpoint-lg: 64rem`, `--breakpoint-md: 48rem`)
-      ['min-[64rem]:flex', 'lg:flex'],
-      ['max-[64rem]:flex', 'max-lg:flex'],
-      ['min-[48rem]:flex', 'md:flex'],
-      ['max-[48rem]:flex', 'max-md:flex'],
-
-      // With the `rem` option set, equivalent `px` values should also be
-      // canonicalized to the breakpoint variants.
-      ['min-[1024px]:flex', 'lg:flex'],
-      ['max-[1024px]:flex', 'max-lg:flex'],
-
-      // Container queries (`--container-md: 28rem`)
-      ['@min-[28rem]:flex', '@md:flex'],
-      ['@max-[28rem]:flex', '@max-md:flex'],
-      ['@min-[448px]:flex', '@md:flex'],
-      ['@max-[448px]:flex', '@max-md:flex'],
-
-      // Values that don't map to a known breakpoint or container size should
-      // stay as-is.
-      ['min-[123px]:flex', 'min-[123px]:flex'],
-      ['max-[123px]:flex', 'max-[123px]:flex'],
-      ['@min-[123px]:flex', '@min-[123px]:flex'],
-      ['@max-[123px]:flex', '@max-[123px]:flex'],
-
-      // Named variants that produce the same CSS should be kept as-is
-      ['min-lg:flex', 'min-lg:flex'],
-      ['@min-md:flex', '@min-md:flex'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-
-      await expectCanonicalization(input, candidate, expected)
-    })
-
-    test.each([
-      // Without the `rem` option, `px` values cannot be safely converted to
-      // `rem` based breakpoints.
-      ['min-[1024px]:flex', 'min-[1024px]:flex'],
-      ['@min-[448px]:flex', '@min-[448px]:flex'],
-
-      // Same unit still works without the `rem` option
-      ['min-[64rem]:flex', 'lg:flex'],
-      ['max-[64rem]:flex', 'max-lg:flex'],
-      ['@min-[28rem]:flex', '@md:flex'],
-      ['@max-[28rem]:flex', '@max-md:flex'],
-    ])(`${testName} (no rem option)`, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-
-      await expectCanonicalization(input, candidate, expected, {
-        collapse: true,
-        logicalToPhysical: true,
-      })
-    })
-  })
-
-  describe('modernize arbitrary variants', () => {
-    test.each([
-      // Arbitrary variants
-      ['[[data-visible]]:flex', 'data-visible:flex'],
-      ['[&[data-visible]]:flex', 'data-visible:flex'],
-      ['[[data-visible]&]:flex', 'data-visible:flex'],
-      ['[&>[data-visible]]:flex', '*:data-visible:flex'],
-      ['[&_>_[data-visible]]:flex', '*:data-visible:flex'],
-      ['[&>*]:flex', '*:flex'],
-      ['[&_>_*]:flex', '*:flex'],
-      ['[&_>_[foo]]:flex', '*:[[foo]]:flex'],
-      ['[&_[foo]]:flex', '**:[[foo]]:flex'],
-      ['[&_>_[foo=bar]]:flex', '*:[[foo=bar]]:flex'],
-      ['[&_[foo=bar]]:flex', '**:[[foo=bar]]:flex'],
-
-      ['[&_[data-visible]]:flex', '**:data-visible:flex'],
-      ['[&_*]:flex', '**:flex'],
-
-      ['[&:first-child]:flex', 'first:flex'],
-      ['[&:not(:first-child)]:flex', 'not-first:flex'],
-
-      ['[&_:first-child]:flex', '**:first:flex'],
-      ['[&_>_:first-child]:flex', '*:first:flex'],
-      ['[&_:--custom]:flex', '**:[:--custom]:flex'],
-      ['[&_>_:--custom]:flex', '*:[:--custom]:flex'],
-
-      // in-* variants
-      ['[p_&]:flex', 'in-[p]:flex'],
-      ['[.foo_&]:flex', 'in-[.foo]:flex'],
-      ['[[data-visible]_&]:flex', 'in-data-visible:flex'],
-      // Multiple selectors, should stay as-is
-      ['[[data-foo][data-bar]_&]:flex', '[[data-foo][data-bar]_&]:flex'],
-      // Using `>` instead of ` ` should not be transformed:
-      ['[figure>&]:my-0', '[figure>&]:my-0'],
-
-      // nth-child
-      ['[&:nth-child(2)]:flex', 'nth-2:flex'],
-      ['[&:not(:nth-child(2))]:flex', 'not-nth-2:flex'],
-
-      ['[&:nth-child(-n+3)]:flex', 'nth-[-n+3]:flex'],
-      ['[&:not(:nth-child(-n+3))]:flex', 'not-nth-[-n+3]:flex'],
-      ['[&:nth-child(-n_+_3)]:flex', 'nth-[-n+3]:flex'],
-      ['[&:not(:nth-child(-n_+_3))]:flex', 'not-nth-[-n+3]:flex'],
-
-      // nth-last-child
-      ['[&:nth-last-child(2)]:flex', 'nth-last-2:flex'],
-      ['[&:not(:nth-last-child(2))]:flex', 'not-nth-last-2:flex'],
-
-      ['[&:nth-last-child(-n+3)]:flex', 'nth-last-[-n+3]:flex'],
-      ['[&:not(:nth-last-child(-n+3))]:flex', 'not-nth-last-[-n+3]:flex'],
-      ['[&:nth-last-child(-n_+_3)]:flex', 'nth-last-[-n+3]:flex'],
-      ['[&:not(:nth-last-child(-n_+_3))]:flex', 'not-nth-last-[-n+3]:flex'],
-
-      // nth-child odd/even
-      ['[&:nth-child(odd)]:flex', 'odd:flex'],
-      ['[&:not(:nth-child(odd))]:flex', 'even:flex'],
-      ['[&:nth-child(even)]:flex', 'even:flex'],
-      ['[&:not(:nth-child(even))]:flex', 'odd:flex'],
-
-      // Keep multiple attribute selectors as-is
-      ['[[data-visible][data-dark]]:flex', '[[data-visible][data-dark]]:flex'],
-
-      // Keep `:where(…)` as is
-      ['[:where([data-visible])]:flex', '[:where([data-visible])]:flex'],
-
-      // Complex attribute selectors with operators, quotes and insensitivity flags
-      ['[[data-url*="example"]]:flex', 'data-[url*="example"]:flex'],
-      ['[[data-url$=".com"_i]]:flex', 'data-[url$=".com"_i]:flex'],
-      ['[[data-url$=.com_i]]:flex', 'data-[url$=.com_i]:flex'],
-
-      // Attribute selector wrapped in `&:is(…)`
-      ['[&:is([data-visible])]:flex', 'data-visible:flex'],
-
-      // Media queries
-      ['[@media(pointer:fine)]:flex', 'pointer-fine:flex'],
-      ['[@media_(pointer_:_fine)]:flex', 'pointer-fine:flex'],
-      ['[@media_not_(pointer_:_fine)]:flex', 'not-pointer-fine:flex'],
-      ['[@media_print]:flex', 'print:flex'],
-      ['[@media_not_print]:flex', 'not-print:flex'],
-
-      // Hoist the `:not` part to a compound variant
-      ['[@media_not_(prefers-color-scheme:dark)]:flex', 'not-dark:flex'],
-      [
-        '[@media_not_(prefers-color-scheme:unknown)]:flex',
-        'not-[@media_(prefers-color-scheme:unknown)]:flex',
-      ],
-
-      // Compound arbitrary variants
-      ['has-[[data-visible]]:flex', 'has-data-visible:flex'],
-      ['has-[&:is([data-visible])]:flex', 'has-data-visible:flex'],
-      ['has-[&>[data-visible]]:flex', 'has-[&>[data-visible]]:flex'],
-
-      ['has-[[data-slot=description]]:flex', 'has-data-[slot=description]:flex'],
-      ['has-[&:is([data-slot=description])]:flex', 'has-data-[slot=description]:flex'],
-
-      ['has-[[aria-visible="true"]]:flex', 'has-aria-visible:flex'],
-      ['has-[[aria-visible]]:flex', 'has-aria-[visible]:flex'],
-
-      ['has-[&:not(:nth-child(even))]:flex', 'has-odd:flex'],
-
-      // Arbitrary variant to compound + arbitrary variants
-      ['[&:has([role=checkbox])]:flex', 'has-[[role=checkbox]]:flex'],
-      ['[&:has([aria-visible="true"])]:flex', 'has-aria-visible:flex'],
-      ['[&:has([data-slot=description])]:flex', 'has-data-[slot=description]:flex'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('optimize modifier', () => {
-    let input = css`
-      @import 'tailwindcss';
-      @theme {
-        --*: initial;
-        --color-red-500: red;
-      }
-    `
-
-    test.each([
-      // Keep the modifier as-is, nothing to optimize
-      ['bg-red-500/25', 'bg-red-500/25'],
-
-      // Use a bare value modifier
-      ['bg-red-500/[25%]', 'bg-red-500/25'],
-
-      // Convert 0-1 values to bare values
-      ['bg-[#f00]/[0.16]', 'bg-[#f00]/16'],
-
-      // Drop unnecessary modifiers
-      ['bg-red-500/[100%]', 'bg-red-500'],
-      ['bg-red-500/100', 'bg-red-500'],
-
-      // Keep modifiers on classes that don't _really_ exist
-      ['group/name', 'group/name'],
-    ])(testName, { timeout }, async (candidate, expected) => {
-      await expectCanonicalization(input, candidate, expected)
-    })
-  })
-
-  describe('combine to shorthand utilities', () => {
-    test.each([
-      // 4 to 1
-      ['mt-1 mr-1 mb-1 ml-1', 'm-1'],
-      ['border-t-123 border-r-123 border-b-123 border-l-123', 'border-123'],
-      ['border-t-1 border-r-1 border-b-1 border-l-1', 'border'], // `border` is shorter than `border-1`
-      ['border-t-red-500 border-r-red-500 border-b-red-500 border-l-red-500', 'border-red-500'],
-      ['scroll-mt-1 scroll-mr-1 scroll-mb-1 scroll-ml-1', 'scroll-m-1'],
-      ['scroll-pt-1 scroll-pr-1 scroll-pb-1 scroll-pl-1', 'scroll-p-1'],
-
-      // 2 to 1
-      ['mt-1 mb-1', 'my-1'],
-      ['border-t-123 border-b-123', 'border-y-123'],
-      ['border-t-1 border-b-1', 'border-y'], // `border-y` is shorter than `border-y-1`
-      ['border-t-red-500 border-b-red-500', 'border-y-red-500'],
-      ['scroll-mt-1 scroll-mb-1', 'scroll-my-1'],
-      ['scroll-pt-1 scroll-pb-1', 'scroll-py-1'],
-      ['overflow-x-hidden overflow-y-hidden', 'overflow-hidden'],
-      ['overscroll-x-contain overscroll-y-contain', 'overscroll-contain'],
-
-      // Different order as above
-      ['mb-1 mt-1', 'my-1'],
-
-      // To completely different utility
-      ['w-4 h-4', 'size-4'],
-
-      // Goes beyond the default spacing scale that's being used in intellisense
-      // for code completion. Since it's about bare values, we should still be
-      // able to combine them.
-      ['w-123 h-123', 'size-123'],
-      ['w-128 h-128', 'size-128'], // `w-128` on its own would become `w-lg`
-      ['mt-123 mb-123', 'my-123'],
-
-      // Collapse duplicates into themselves
-      ['w-8 w-8', 'w-8'],
-
-      // `w-*` and `h-*` would canonicalize to `size-5`
-      // `size-5` and `size-5` should then canonicalize to `size-5`
-      ['w-[calc(1rem+0.25rem)] h-[calc(1rem+0.25rem)] size-5', 'size-5'],
-
-      // Same as above, but with an additional unrelated class
-      ['w-[calc(1rem+0.25rem)] h-[calc(1rem+0.25rem)] size-5 flex', 'size-5 flex'],
-
-      // Do not touch if not operating on the same variants
-      ['hover:w-4 h-4', 'hover:w-4 h-4'],
-
-      // Arbitrary properties to combined class
-      ['[width:_16px_] [height:16px]', 'size-4'],
-
-      // Arbitrary properties to combined class with modifier
-      ['[font-size:14px] [line-height:1.625]', 'text-sm/relaxed'],
-    ])(testName, { timeout }, async (candidates, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-      await expectCanonicalization(input, candidates, expected)
-    })
-  })
-
-  describe('font-size/line-height to text-{x}/{y}', () => {
-    test.each([
-      ...Array.from(
-        cartesian(
-          ['[font-size:14px]', 'text-[14px]', 'text-[14px]/6', 'text-sm', 'text-sm/6'],
-          ['[line-height:28px]', 'leading-[28px]', 'leading-7'],
-        ),
-      ).map((classes) => [classes.join(' ').padEnd(40, ' '), 'text-sm/7']),
-      ...Array.from(
-        cartesian(
-          ['[font-size:15px]', 'text-[15px]', 'text-[15px]/6'],
-          ['[line-height:28px]', 'leading-[28px]', 'leading-7'],
-        ),
-      ).map((classes) => [classes.join(' ').padEnd(40, ' '), 'text-[15px]/7']),
-      ...Array.from(
-        cartesian(
-          ['[font-size:14px]', 'text-[14px]', 'text-[14px]/6', 'text-sm', 'text-sm/6'],
-          ['[line-height:28.5px]', 'leading-[28.5px]'],
-        ),
-      ).map((classes) => [classes.join(' ').padEnd(40, ' '), 'text-sm/[28.5px]']),
-      ...Array.from(
-        cartesian(
-          ['[font-size:15px]', 'text-[15px]', 'text-[15px]/6'],
-          ['[line-height:28.5px]', 'leading-[28.5px]'],
-        ),
-      ).map((classes) => [classes.join(' ').padEnd(40, ' '), 'text-[15px]/[28.5px]']),
-    ])(testName, { timeout }, async (candidates, expected) => {
-      let input = css`
-        @import 'tailwindcss';
-      `
-      await expectCanonicalization(input, candidates.trim(), expected)
-    })
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1558
-  test.each([
-    ['tracking-[-0.05em]', 'tracking-tighter'],
-    ['tracking-[-0.025em]', 'tracking-tight'],
-    ['tracking-[0em]', 'tracking-normal'],
-    ['tracking-[0.025em]', 'tracking-wide'],
-    ['tracking-[0.05em]', 'tracking-wider'],
-    ['tracking-[0.1em]', 'tracking-widest'],
-
-    // Negative values that don't make sense
-    // See: https://tailwindcss.com/docs/letter-spacing#using-negative-values
-    ['-tracking-tighter', 'tracking-wider'],
-    ['-tracking-tight', 'tracking-wide'],
-    ['-tracking-normal', 'tracking-normal'],
-    ['-tracking-wide', 'tracking-tight'],
-    ['-tracking-wider', 'tracking-tighter'],
-  ])(testName, { timeout }, async (candidate, expected) => {
-    await expectCanonicalization(
-      css`
-        @import 'tailwindcss';
-        @theme {
-          --tracking-tighter: -0.05em;
-          --tracking-tight: -0.025em;
-          --tracking-normal: 0em;
-          --tracking-wide: 0.025em;
-          --tracking-wider: 0.05em;
-          --tracking-widest: 0.1em;
-        }
-      `,
-      candidate,
-      expected,
-    )
-  })
-
-  test.each([
-    // Keep whitespace characters that are significant
-    ['[&:has(~_*_*:checked)]:flex', '[&:has(~_*_*:checked)]:flex'],
-    [
-      'shadow-[inset_0px_1px_--theme(--color-white/15%)]',
-      'shadow-[inset_0px_1px_--theme(--color-white/15%)]',
-    ],
-
-    // Improve readability when whitespace was used for readability
-    ['w-[calc(100%_-_calc(var(--spacing)*60))]', 'w-[calc(100%-(--spacing(60)))]'],
-    ['w-[calc(100%_-_--spacing(60))]', 'w-[calc(100%-(--spacing(60)))]'],
-
-    // No need to wrap in `(…)` after a `,`
-    ['m-[min(100%,_--spacing(6))]', 'm-[min(100%,--spacing(6))]'],
-    ['m-[min(100%_,_--spacing(6))]', 'm-[min(100%,--spacing(6))]'],
-    ['m-[min(100%,--spacing(6))]', 'm-[min(100%,--spacing(6))]'],
-  ])(testName, async (candidate, expected) => {
-    let input = css`
-      @import 'tailwindcss';
-    `
-
-    await expectCanonicalization(input, candidate, expected)
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1573
-  test.each([
-    ['-mt-[0.04in]', 'mt-[-0.04in]'],
-    ['mt-[-0.04in]', 'mt-[-0.04in]'],
-    ['-mt-[-0.04in]', 'mt-[0.04in]'],
-  ])(testName, { timeout }, async (candidate, expected) => {
-    let input = css`
-      @import 'tailwindcss';
-    `
-
-    await expectCanonicalization(input, candidate, expected)
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1591
-  test.each([
-    ['w-[calc(100%/3.5)]', 'w-[calc(100%/3.5)]'], // Not w-[28.571428571428573%]
-  ])(testName, { timeout }, async (candidate, expected) => {
-    let input = css`
-      @import 'tailwindcss';
-    `
-
-    await expectCanonicalization(input, candidate, expected)
-  })
-})
-
-describe('theme to var', () => {
-  test('extended space scale converts to var or calc', { timeout }, async () => {
-    let designSystem = await __unstable__loadDesignSystem(
-      css`
-        @tailwind utilities;
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-2: 2px;
-          --spacing-miami: 0.875rem;
-        }
-      `,
-      { base: __dirname },
-    )
-    expect(
-      designSystem.canonicalizeCandidates([
-        '[--value:theme(spacing.1)]',
-        '[--value:theme(spacing.2)]',
-        '[--value:theme(spacing.miami)]',
-        '[--value:theme(spacing.nyc)]',
-      ]),
-    ).toEqual([
-      '[--value:--spacing(1)]',
-      '[--value:var(--spacing-2)]',
-      '[--value:var(--spacing-miami)]',
-      '[--value:theme(spacing.nyc)]',
-    ])
-  })
-
-  test('custom space scale converts to var', { timeout }, async () => {
-    let designSystem = await __unstable__loadDesignSystem(
-      css`
-        @tailwind utilities;
-        @theme {
-          --spacing-*: initial;
-          --spacing-1: 0.25rem;
-          --spacing-2: 0.5rem;
-        }
-      `,
-      { base: __dirname },
-    )
-    expect(
-      designSystem.canonicalizeCandidates([
-        '[--value:theme(spacing.1)]',
-        '[--value:theme(spacing.2)]',
-        '[--value:theme(spacing.3)]',
-      ]),
-    ).toEqual([
-      '[--value:var(--spacing-1)]',
-      '[--value:var(--spacing-2)]',
-      '[--value:theme(spacing.3)]',
-    ])
-  })
-})
-
-describe('options', () => {
-  test('normalize `rem` units to `px`', { timeout }, async () => {
-    let designSystem = await __unstable__loadDesignSystem(
-      css`
-        @tailwind utilities;
-        @theme {
-          --spacing: 0.25rem;
-        }
-      `,
-      { base: __dirname },
-    )
-
-    expect(designSystem.canonicalizeCandidates(['m-[16px]'])).toEqual(['m-[16px]'])
-    expect(designSystem.canonicalizeCandidates(['m-[16px]'], { rem: 16 })).toEqual(['m-4'])
-    expect(designSystem.canonicalizeCandidates(['m-[16px]'], { rem: 64 })).toEqual(['m-1'])
-    expect(designSystem.canonicalizeCandidates(['m-[16px]'])).toEqual(['m-[16px]']) // Ensure options don't influence shared state
-  })
-})
-
-describe('regressions', () => {
-  // https://github.com/schoero/eslint-plugin-better-tailwindcss/issues/321
-  {
-    test('a subset of classes should be canonicalizable', { timeout }, async () => {
-      let designSystem = await designSystems.get(__dirname).get(css`
-        @import 'tailwindcss';
-      `)
-
-      let options: CanonicalizeOptions = {
-        collapse: true,
-        logicalToPhysical: true,
-        rem: 16,
-      }
-
-      expect(
-        designSystem.canonicalizeCandidates(['underline', 'h-4', 'w-4', 'text-sm'], options),
-      ).toEqual(['underline', 'text-sm', 'size-4'])
-    })
-
-    test('collapse canonicalization is not affected by previous calls', { timeout }, async () => {
-      let designSystem = await designSystems.get(__dirname).get(css`
-        @import 'tailwindcss';
-      `)
-
-      let options: CanonicalizeOptions = {
-        collapse: true,
-        logicalToPhysical: true,
-        rem: 16,
-      }
-
-      let target = ['underline', 'h-4', 'w-4']
-
-      expect(designSystem.canonicalizeCandidates(target, options)).toEqual(['underline', 'size-4'])
-
-      designSystem.canonicalizeCandidates(['mb-4', 'text-sm'], options)
-      designSystem.canonicalizeCandidates(['underline', 'mb-4'], options)
-
-      expect(designSystem.canonicalizeCandidates(target, options)).toEqual(['underline', 'size-4'])
-      expect(designSystem.canonicalizeCandidates(target.concat('text-sm'), options)).toEqual([
-        'underline',
-        'text-sm',
-        'size-4',
-      ])
-    })
-  }
-
-  // https://github.com/tailwindlabs/tailwindcss/pull/19727
-  test(
-    'collapse does not crash when utilities with no standard properties are present',
-    { timeout },
-    async () => {
-      let designSystem = await designSystems.get(__dirname).get(css`
-        @import 'tailwindcss';
-      `)
-
-      let options: CanonicalizeOptions = {
-        collapse: true,
-        logicalToPhysical: true,
-        rem: 16,
-      }
-
-      // Shadow utilities use CSS custom properties and @property rules but may
-      // produce empty property maps in the collapse algorithm. This should not
-      // crash with "Cannot read properties of null" or "X is not iterable".
-      expect(() =>
-        designSystem.canonicalizeCandidates(['shadow-sm', 'border'], options),
-      ).not.toThrow()
-
-      expect(() => designSystem.canonicalizeCandidates(['shadow-md', 'p-4'], options)).not.toThrow()
-
-      expect(() =>
-        designSystem.canonicalizeCandidates(['shadow-sm', 'shadow-md'], options),
-      ).not.toThrow()
-
-      // Verify the candidates are returned (not collapsed, since shadows can't
-      // meaningfully collapse with unrelated utilities)
-      expect(designSystem.canonicalizeCandidates(['shadow-sm', 'border'], options)).toEqual(
-        expect.arrayContaining(['shadow-sm', 'border']),
-      )
-
-      expect(designSystem.canonicalizeCandidates(['shadow-sm', 'shadow-md'], options)).toEqual(
-        expect.arrayContaining(['shadow-sm', 'shadow-md']),
-      )
-    },
-  )
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/19835
-  test.each([
-    // Arbitrary values should be collapsed to another arbitrary value
-    [
-      ['px-[1.2rem]', 'py-[1.2rem]', 'text-left'],
-      ['text-left', 'p-[1.2rem]'],
-    ],
-
-    // Arbitrary values could also be collapsed into a bare value
-    [
-      ['px-[30.75rem]', 'py-[30.75rem]', 'text-left'],
-      ['text-left', 'p-123'],
-    ],
-  ])(
-    'collapse canonicalization works for arbitrary values',
-    { timeout },
-    async (candidates, expected) => {
-      let designSystem = await designSystems.get(__dirname).get(css`
-        @import 'tailwindcss';
-      `)
-
-      let options: CanonicalizeOptions = {
-        collapse: true,
-        logicalToPhysical: true,
-        rem: 16,
-      }
-
-      expect(designSystem.canonicalizeCandidates(candidates, options)).toEqual(expected)
-    },
-  )
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/20051
-  test(
-    'does not crash when plugin matchComponents rejects speculative values during collapse',
-    { timeout },
-    async () => {
-      let designSystem = await __unstable__loadDesignSystem(
-        css`
-          @import 'tailwindcss';
-          @plugin "./plugin.js";
-        `,
-        {
-          async loadStylesheet(_, base) {
-            return {
-              base,
-              path: '',
-              content: '@tailwind utilities;',
-            }
-          },
-          async loadModule() {
-            return {
-              base: '',
-              path: '',
-              module: plugin(({ matchComponents }) => {
-                matchComponents(
-                  {
-                    myicon: () => {
-                      throw new Error('Mimic as-if a custom plugin failed for some reason')
-                    },
-                  },
-                  { values: { icon: __filename } },
-                )
-              }),
-            }
-          },
-        },
-      )
-
-      expect(
-        designSystem.canonicalizeCandidates(['border-[1.5px]', 'flex'], {
-          collapse: true,
-          logicalToPhysical: true,
-          rem: 16,
-        }),
-      ).toEqual(expect.arrayContaining(['border-[1.5px]', 'flex']))
-    },
-  )
-
-  // https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1579
-  test('does not suggest invalid alternative when canonicalizing calc expressions', async () => {
-    let designSystem = await designSystems.get(__dirname).get(css`
-      @import 'tailwindcss';
-    `)
-
-    let options: CanonicalizeOptions = {
-      collapse: true,
-      logicalToPhysical: true,
-      rem: 16,
-    }
-
-    expect(designSystem.canonicalizeCandidates(['px-[calc(1rem+0px)]'], options)).toEqual(['px-4'])
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/20295
-  test('canonicalizations work when casing of arbitrary values is different', async () => {
-    let designSystem = await designSystems.get(__dirname).get(css`
-      @import 'tailwindcss';
-      @theme {
-        --color-brand-purple: #3f3cbb;
-      }
-    `)
-
-    let options: CanonicalizeOptions = {
-      collapse: true,
-      logicalToPhysical: true,
-      rem: 16,
-    }
-
-    expect(designSystem.canonicalizeCandidates(['bg-[#3F3cbb]'], options)).toEqual([
-      'bg-brand-purple',
-    ])
-    expect(designSystem.canonicalizeCandidates(['bg-[#3F3Cbb]'], options)).toEqual([
-      'bg-brand-purple',
-    ])
-    expect(designSystem.canonicalizeCandidates(['bg-[#3F3CBB]'], options)).toEqual([
-      'bg-brand-purple',
-    ])
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/20365
-  test('canonicalizes min/max media query and container query variants', async () => {
-    let designSystem = await __unstable__loadDesignSystem(
-      css`
-        @tailwind utilities;
-        @theme {
-          --breakpoint-lg: 64rem;
-          --container-lg: 32rem;
-          --spacing: 0.25rem;
-        }
-      `,
-      { base: __dirname },
-    )
-
-    expect(designSystem.canonicalizeCandidates(['min-[64rem]:flex'])).toEqual(['lg:flex'])
-    expect(designSystem.canonicalizeCandidates(['max-[64rem]:flex'])).toEqual(['max-lg:flex'])
-    expect(designSystem.canonicalizeCandidates(['@min-[32rem]:flex'])).toEqual(['@lg:flex'])
-    expect(designSystem.canonicalizeCandidates(['@max-[32rem]:flex'])).toEqual(['@max-lg:flex'])
-    expect(designSystem.canonicalizeCandidates(['min-[1024px]:flex'], { rem: 16 })).toEqual([
-      'lg:flex',
-    ])
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1610
-  test('does not merge utilities whose theme variables resolve to CSS-wide keywords', async () => {
-    let designSystem = await __unstable__loadDesignSystem(
-      css`
-        @tailwind utilities;
-        @theme {
-          --foreground: unset;
-          --default: unset;
-        }
-        @theme inline {
-          --color-foreground: var(--foreground);
-          --color-default-soft-hover: color-mix(in oklab, var(--default) 60%, transparent);
-        }
-      `,
-      { base: __dirname },
-    )
-
-    expect(
-      designSystem.canonicalizeCandidates(['text-foreground/60', 'text-default-soft-hover']),
-    ).toEqual(['text-foreground/60', 'text-default-soft-hover'])
-  })
-})
diff --git a/packages/tailwindcss/src/canonicalize-candidates.ts b/packages/tailwindcss/src/canonicalize-candidates.ts
deleted file mode 100644
index d1dfc09de..000000000
--- a/packages/tailwindcss/src/canonicalize-candidates.ts
+++ /dev/null
@@ -1,3062 +0,0 @@
-import { substituteAtApply } from './apply'
-import { atRule, cloneAstNode, styleRule, toCss, type AstNode } from './ast'
-import * as AttributeSelectorParser from './attribute-selector-parser'
-import {
-  cloneCandidate,
-  cloneVariant,
-  printArbitraryValue,
-  printModifier,
-  type Candidate,
-  type CandidateModifier,
-  type NamedUtilityValue,
-  type Variant,
-} from './candidate'
-import { canonicalizeCalcExpressionsAst } from './canonicalize-calc-expressions'
-import { keyPathToCssProperty } from './compat/apply-config-to-theme'
-import { constantFoldDeclaration, constantFoldDeclarationAst } from './constant-fold-declaration'
-import type { DesignSystem as BaseDesignSystem } from './design-system'
-import { CompileAstFlags } from './design-system'
-import { expandDeclaration } from './expand-declaration'
-import * as SelectorParser from './selector-parser'
-import { ThemeOptions } from './theme'
-import type { Writable } from './types'
-import { DefaultMap } from './utils/default-map'
-import { dimensions } from './utils/dimensions'
-import { isPositiveInteger, isValidSpacingMultiplier } from './utils/infer-data-type'
-import { replaceObject } from './utils/replace-object'
-import { segment } from './utils/segment'
-import { toKeyPath } from './utils/to-key-path'
-import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
-
-export interface CanonicalizeOptions {
-  /**
-   * The root font size in pixels. If provided, `rem` values will be normalized
-   * to `px` values.
-   *
-   * E.g.: `mt-[16px]` with `rem: 16` will become `mt-4` (assuming `--spacing: 0.25rem`).
-   */
-  rem?: number
-
-  /**
-   * Whether to collapse multiple utilities into a single utility if possible.
-   *
-   * E.g.: `mt-2 mr-2 mb-2 ml-2` → `m-2`
-   */
-  collapse?: boolean
-
-  /**
-   * Whether to convert between logical and physical properties when collapsing
-   * utilities.
-   *
-   * E.g.: `mr-2 ml-2` → `mx-2`
-   */
-  logicalToPhysical?: boolean
-}
-
-enum Features {
-  /**
-   * No features enabled (default)
-   */
-  None = 0,
-
-  /**
-   * Collapse multiple utilities into a single utility if possible.
-   */
-  CollapseUtilities = 1 << 0,
-}
-
-interface InternalCanonicalizeOptions {
-  features: Features
-  designSystem: DesignSystem
-  signatureOptions: SignatureOptions
-}
-
-type RemValue = number | null
-
-interface DesignSystem extends BaseDesignSystem {
-  storage: {
-    [SIGNATURE_OPTIONS_KEY]: DefaultMap<RemValue, DefaultMap<SignatureFeatures, SignatureOptions>>
-    [COMPARE_CANDIDATES_KEY]: DefaultMap<
-      SignatureOptions,
-      (a: Candidate | string, b: Candidate | string) => boolean
-    >
-    [INTERNAL_OPTIONS_KEY]: DefaultMap<
-      SignatureOptions,
-      DefaultMap<Features, InternalCanonicalizeOptions>
-    >
-    [CANONICALIZE_CANDIDATE_KEY]: DefaultMap<
-      InternalCanonicalizeOptions,
-      DefaultMap<string, string>
-    >
-    [CANONICALIZE_VARIANT_KEY]: DefaultMap<
-      InternalCanonicalizeOptions,
-      DefaultMap<Variant, Variant[]>
-    >
-    [CANONICALIZE_UTILITY_KEY]: DefaultMap<InternalCanonicalizeOptions, DefaultMap<string, string>>
-    [CONVERTER_KEY]: (input: string, options?: Convert) => [string, CandidateModifier | null]
-    [SPACING_KEY]: DefaultMap<string, number | null> | null
-    [UTILITY_SIGNATURE_KEY]: DefaultMap<SignatureOptions, DefaultMap<string, string | symbol>>
-    [STATIC_UTILITIES_KEY]: DefaultMap<
-      SignatureOptions,
-      DefaultMap<string, DefaultMap<string, Set<string>>>
-    >
-    [UTILITY_PROPERTIES_KEY]: DefaultMap<
-      SignatureOptions,
-      DefaultMap<string, DefaultMap<string, Set<string>>>
-    >
-    [PRE_COMPUTED_UTILITIES_KEY]: DefaultMap<SignatureOptions, DefaultMap<string, string[]>>
-    [VARIANT_SIGNATURE_KEY]: DefaultMap<RemValue, DefaultMap<string, string | symbol>>
-    [PRE_COMPUTED_VARIANTS_KEY]: DefaultMap<RemValue, DefaultMap<string, string[]>>
-  }
-}
-
-export function prepareDesignSystemStorage(
-  baseDesignSystem: BaseDesignSystem,
-  options?: CanonicalizeOptions,
-): DesignSystem {
-  let designSystem = baseDesignSystem as DesignSystem
-
-  designSystem.storage[SIGNATURE_OPTIONS_KEY] ??= createSignatureOptionsCache()
-  designSystem.storage[INTERNAL_OPTIONS_KEY] ??= createInternalOptionsCache(designSystem)
-  designSystem.storage[CANONICALIZE_CANDIDATE_KEY] ??= createCanonicalizeCandidateCache()
-  designSystem.storage[CANONICALIZE_VARIANT_KEY] ??= createCanonicalizeVariantCache()
-  designSystem.storage[CANONICALIZE_UTILITY_KEY] ??= createCanonicalizeUtilityCache()
-  designSystem.storage[CONVERTER_KEY] ??= createConverterCache(designSystem)
-  designSystem.storage[SPACING_KEY] ??= createSpacingCache(designSystem, options)
-  designSystem.storage[UTILITY_SIGNATURE_KEY] ??= createUtilitySignatureCache(designSystem)
-  designSystem.storage[STATIC_UTILITIES_KEY] ??= createStaticUtilitiesCache()
-  designSystem.storage[UTILITY_PROPERTIES_KEY] ??= createUtilityPropertiesCache(designSystem)
-  designSystem.storage[PRE_COMPUTED_UTILITIES_KEY] ??= createPreComputedUtilitiesCache(designSystem)
-  designSystem.storage[VARIANT_SIGNATURE_KEY] ??= createVariantSignatureCache(designSystem)
-  designSystem.storage[PRE_COMPUTED_VARIANTS_KEY] ??= createPreComputedVariantsCache(designSystem)
-  designSystem.storage[COMPARE_CANDIDATES_KEY] ??= createSignatureComparison(designSystem)
-
-  return designSystem
-}
-
-const SIGNATURE_OPTIONS_KEY = Symbol()
-function createSignatureOptionsCache(): DesignSystem['storage'][typeof SIGNATURE_OPTIONS_KEY] {
-  return new DefaultMap((rem: number | null) => {
-    return new DefaultMap((features: SignatureFeatures) => {
-      return { rem, features } satisfies SignatureOptions
-    })
-  })
-}
-
-const COMPARE_CANDIDATES_KEY = Symbol()
-function createSignatureComparison(designSystem: DesignSystem) {
-  return new DefaultMap((options: SignatureOptions) => {
-    let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options)
-
-    return function hasSameSignature(a: Candidate | string, b: Candidate | string): boolean {
-      let aCandidateString = typeof a === 'string' ? a : designSystem.printCandidate(a)
-      let aSignature = signatures.get(aCandidateString)
-      if (typeof aSignature !== 'string') return false
-
-      let bCandidateString = typeof b === 'string' ? b : designSystem.printCandidate(b)
-      let bSignature = signatures.get(bCandidateString)
-      if (typeof bSignature !== 'string') return false
-
-      return aSignature === bSignature
-    }
-  })
-}
-
-export function createSignatureOptions(
-  baseDesignSystem: BaseDesignSystem,
-  options?: CanonicalizeOptions,
-): SignatureOptions {
-  let features = SignatureFeatures.None
-  if (options?.collapse) features |= SignatureFeatures.ExpandProperties
-  if (options?.logicalToPhysical) features |= SignatureFeatures.LogicalToPhysical
-
-  let designSystem = prepareDesignSystemStorage(baseDesignSystem, options)
-
-  return designSystem.storage[SIGNATURE_OPTIONS_KEY].get(options?.rem ?? null).get(features)
-}
-
-const INTERNAL_OPTIONS_KEY = Symbol()
-function createInternalOptionsCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof INTERNAL_OPTIONS_KEY] {
-  return new DefaultMap((signatureOptions: SignatureOptions) => {
-    return new DefaultMap((features: Features) => {
-      return { features, designSystem, signatureOptions } satisfies InternalCanonicalizeOptions
-    })
-  })
-}
-
-function createCanonicalizeOptions(
-  baseDesignSystem: BaseDesignSystem,
-  signatureOptions: SignatureOptions,
-  options?: CanonicalizeOptions,
-) {
-  let features = Features.None
-  if (options?.collapse) features |= Features.CollapseUtilities
-
-  let designSystem = prepareDesignSystemStorage(baseDesignSystem)
-
-  return designSystem.storage[INTERNAL_OPTIONS_KEY].get(signatureOptions).get(features)
-}
-
-export function canonicalizeCandidates(
-  baseDesignSystem: BaseDesignSystem,
-  candidates: string[],
-  options?: CanonicalizeOptions,
-): string[] {
-  let signatureOptions = createSignatureOptions(baseDesignSystem, options)
-  let canonicalizeOptions = createCanonicalizeOptions(baseDesignSystem, signatureOptions, options)
-
-  let designSystem = prepareDesignSystemStorage(baseDesignSystem)
-
-  let result = new Set<string>()
-  let cache = designSystem.storage[CANONICALIZE_CANDIDATE_KEY].get(canonicalizeOptions)
-  for (let candidate of candidates) {
-    result.add(cache.get(candidate))
-  }
-
-  return result.size <= 1 || !(canonicalizeOptions.features & Features.CollapseUtilities)
-    ? Array.from(result)
-    : collapseCandidates(canonicalizeOptions, Array.from(result))
-}
-
-function collapseCandidates(options: InternalCanonicalizeOptions, candidates: string[]): string[] {
-  let designSystem = options.designSystem
-
-  // To keep things simple, we group candidates such that we only collapse
-  // candidates with the same variants and important modifier together.
-  let groups = new DefaultMap((_before: string) => {
-    return new DefaultMap((_after: string) => {
-      return new Set<string>()
-    })
-  })
-
-  let prefix = options.designSystem.theme.prefix ? `${options.designSystem.theme.prefix}:` : ''
-
-  for (let candidate of candidates) {
-    let variants = segment(candidate, ':')
-    let utility = variants.pop()!
-
-    let important = utility.endsWith('!')
-    if (important) {
-      utility = utility.slice(0, -1)
-    }
-
-    let before = variants.length > 0 ? `${variants.join(':')}:` : ''
-    let after = important ? '!' : ''
-
-    // Group by variants and important flag
-    groups.get(before).get(after).add(`${prefix}${utility}`)
-  }
-
-  let result = new Set<string>()
-  for (let [before, group] of groups.entries()) {
-    for (let [after, candidates] of group.entries()) {
-      for (let candidate of collapseGroup(Array.from(candidates))) {
-        // Drop the prefix if we had one, because the prefix is already there as
-        // part of the variants.
-        if (prefix && candidate.startsWith(prefix)) {
-          candidate = candidate.slice(prefix.length)
-        }
-
-        result.add(`${before}${candidate}${after}`)
-      }
-    }
-  }
-
-  return Array.from(result)
-
-  function collapseGroup(candidates: string[]) {
-    let signatureOptions = options.signatureOptions
-    let computeUtilitiesPropertiesLookup =
-      designSystem.storage[UTILITY_PROPERTIES_KEY].get(signatureOptions)
-    let staticUtilities = designSystem.storage[STATIC_UTILITIES_KEY].get(signatureOptions)
-
-    // For each candidate, compute the used properties and values. E.g.: `mt-1` → `margin-top` → `0.25rem`
-    //
-    // NOTE: Currently assuming we are dealing with static utilities only. This
-    // will change the moment we have `@utility` for most built-ins.
-    let candidatePropertiesValues = candidates.map((candidate) =>
-      computeUtilitiesPropertiesLookup.get(candidate),
-    )
-
-    // Hard-coded optimization: if any candidate sets `line-height` and another
-    // candidate sets `font-size`, we pre-compute the `text-*` utilities with
-    // this line-height to try and collapse to those combined values.
-    if (candidatePropertiesValues.some((x) => x.has('line-height'))) {
-      let fontSizeNames = designSystem.theme.keysInNamespaces(['--text'])
-      if (fontSizeNames.length > 0) {
-        let interestingLineHeights = new Set<string | number>()
-        let seenLineHeights = new Set<string>()
-        for (let pairs of candidatePropertiesValues) {
-          if (!pairs.has('line-height')) continue
-
-          for (let lineHeight of pairs.get('line-height')) {
-            if (seenLineHeights.has(lineHeight)) continue
-            seenLineHeights.add(lineHeight)
-
-            let bareValue = designSystem.storage[SPACING_KEY]?.get(lineHeight) ?? null
-            if (bareValue !== null) {
-              if (isValidSpacingMultiplier(bareValue)) {
-                interestingLineHeights.add(bareValue)
-
-                for (let name of fontSizeNames) {
-                  computeUtilitiesPropertiesLookup.get(`text-${name}/${bareValue}`)
-                }
-              } else {
-                interestingLineHeights.add(lineHeight)
-
-                for (let name of fontSizeNames) {
-                  computeUtilitiesPropertiesLookup.get(`text-${name}/[${lineHeight}]`)
-                }
-              }
-            }
-          }
-        }
-
-        let seenFontSizes = new Set<string>()
-        for (let pairs of candidatePropertiesValues) {
-          if (!pairs.has('font-size')) continue
-
-          for (let fontSize of pairs.get('font-size')) {
-            if (seenFontSizes.has(fontSize)) continue
-            seenFontSizes.add(fontSize)
-
-            for (let lineHeight of interestingLineHeights) {
-              if (isValidSpacingMultiplier(lineHeight)) {
-                computeUtilitiesPropertiesLookup.get(`text-[${fontSize}]/${lineHeight}`)
-              } else {
-                computeUtilitiesPropertiesLookup.get(`text-[${fontSize}]/[${lineHeight}]`)
-              }
-            }
-          }
-        }
-      }
-    }
-
-    let dynamicUtilities = new DefaultMap((candidate: string) => {
-      let result = new DefaultMap(
-        (_property: string) => new DefaultMap((_value: string) => new Set<string>()),
-      )
-
-      let relevantProperties = new Set(computeUtilitiesPropertiesLookup.get(candidate).keys())
-      if (relevantProperties.size === 0) return result
-
-      for (let parsedCandidate of parseCandidate(designSystem, candidate)) {
-        if (parsedCandidate.kind !== 'functional' || parsedCandidate.value === null) {
-          continue
-        }
-
-        for (let root of designSystem.utilities.keys('functional')) {
-          if (root === parsedCandidate.root) continue // Skip self
-
-          let replacement = printUnprefixedCandidate(designSystem, {
-            ...cloneCandidate(parsedCandidate),
-            root,
-          })
-
-          let propertyValues = computeUtilitiesPropertiesLookup.get(replacement)
-          for (let [property, values] of propertyValues) {
-            if (!relevantProperties.has(property)) continue // Skip properties that are not relevant for the current candidate
-
-            for (let value of values) {
-              result.get(property).get(value).add(replacement)
-            }
-          }
-        }
-
-        return result
-      }
-
-      return result
-    })
-
-    // For each property, lookup other utilities that also set this property and
-    // this exact value. If multiple properties are used, use the intersection of
-    // each property.
-    //
-    // E.g.: `margin-top` → `mt-1`, `my-1`, `m-1`
-    let otherUtilities = candidatePropertiesValues.map((propertyValues, idx) => {
-      let result: Set<string> | null = null
-      for (let property of propertyValues.keys()) {
-        let otherUtilities = new Set<string>()
-        for (let group of staticUtilities.get(property).values()) {
-          for (let candidate of group) {
-            otherUtilities.add(candidate)
-          }
-        }
-
-        for (let value of propertyValues.get(property)) {
-          for (let candidate of dynamicUtilities.get(candidates[idx]).get(property).get(value)) {
-            otherUtilities.add(candidate)
-          }
-        }
-
-        if (result === null) result = otherUtilities
-        else result = intersection(result, otherUtilities)
-
-        // The moment no other utilities match, we can stop searching because
-        // all intersections with an empty set will remain empty.
-        if (result!.size === 0) return result!
-      }
-      return result ?? new Set<string>()
-    })
-
-    // Link each candidate that could be linked via another utility
-    // (intersection). This way we can reduce the amount of required combinations.
-    //
-    // E.g.: `mt-1` and `mb-1` can be linked via `my-1`.
-    //
-    // Candidates that cannot be linked won't be able to be collapsed.
-    // E.g.: `mt-1` and `text-red-500` cannot be collapsed because there is no 3rd
-    // utility with overlapping property/value combinations.
-    let linked = new DefaultMap<number, Set<number>>((key) => new Set<number>([key]))
-    for (let i = 0; i < otherUtilities.length; i++) {
-      let current = otherUtilities[i]
-      for (let j = i + 1; j < otherUtilities.length; j++) {
-        let other = otherUtilities[j]
-
-        for (let property of current) {
-          if (other.has(property)) {
-            linked.get(i).add(j)
-            linked.get(j).add(i)
-
-            // The moment we find a link, we can stop comparing and move on to the
-            // next candidate. This will safe us some time
-            break
-          }
-        }
-      }
-    }
-
-    // Not a single candidate can be linked to another one, nothing left to do
-    if (linked.size === 0) return candidates
-
-    // Each candidate index will now have a set of other candidate indexes as
-    // its value. Let's make the lists unique combinations so that we can
-    // iterate over them.
-    let uniqueCombinations = new DefaultMap((key: string) => key.split(',').map(Number))
-    for (let group of linked.values()) {
-      let sorted = Array.from(group).sort((a, b) => a - b)
-      uniqueCombinations.get(sorted.join(','))
-    }
-
-    // Let's try to actually collapse them now.
-    let result = new Set<string>(candidates)
-    let drop = new Set<string>()
-
-    for (let idxs of uniqueCombinations.values()) {
-      for (let combo of combinations(idxs)) {
-        if (combo.some((idx) => drop.has(candidates[idx]))) continue // Skip already dropped items
-
-        let potentialReplacements = combo.flatMap((idx) => otherUtilities[idx]).reduce(intersection)
-
-        let collapsedSignature = designSystem.storage[UTILITY_SIGNATURE_KEY].get(
-          signatureOptions,
-        ).get(
-          combo
-            .map((idx) => candidates[idx])
-            .sort((a, z) => a.localeCompare(z)) // Sort to increase cache hits
-            .join(' '),
-        )
-
-        for (let replacement of potentialReplacements) {
-          let signature =
-            designSystem.storage[UTILITY_SIGNATURE_KEY].get(signatureOptions).get(replacement)
-          if (signature !== collapsedSignature) continue // Not a safe replacement
-
-          // Use the replacement
-          result.add(replacement)
-
-          // We can replace all items in the combo with the replacement. If the
-          // replacement is already part of the combo, keep that one around.
-          for (let item of combo) {
-            if (candidates[item] !== replacement) {
-              drop.add(candidates[item])
-            }
-          }
-
-          break
-        }
-      }
-    }
-
-    for (let item of drop) {
-      result.delete(item)
-    }
-
-    return Array.from(result)
-  }
-}
-
-const CANONICALIZE_CANDIDATE_KEY = Symbol()
-function createCanonicalizeCandidateCache(): DesignSystem['storage'][typeof CANONICALIZE_CANDIDATE_KEY] {
-  return new DefaultMap((options: InternalCanonicalizeOptions) => {
-    let ds = options.designSystem
-    let prefix = ds.theme.prefix ? `${ds.theme.prefix}:` : ''
-    let variantCache = ds.storage[CANONICALIZE_VARIANT_KEY].get(options)
-    let utilityCache = ds.storage[CANONICALIZE_UTILITY_KEY].get(options)
-
-    return new DefaultMap<string, string>((rawCandidate: string, self) => {
-      for (let candidate of ds.parseCandidate(rawCandidate)) {
-        let variants = candidate.variants
-          .slice()
-          .reverse()
-          .flatMap((variant) => variantCache.get(variant))
-        let important = candidate.important
-
-        // Canonicalize the base candidate (utility), and re-attach the variants
-        // and important flag afterwards. This way we can maximize cache hits for
-        // the base candidate and each individual variant.
-        if (important || variants.length > 0) {
-          let canonicalizedUtility = self.get(
-            ds.printCandidate({ ...candidate, variants: [], important: false }),
-          )
-
-          // Rebuild the final candidate
-          let result = canonicalizedUtility
-
-          // Remove the prefix if there are variants, because the variants exist
-          // between the prefix and the base candidate.
-          if (ds.theme.prefix !== null && variants.length > 0) {
-            result = result.slice(prefix.length)
-          }
-
-          // Re-attach the variants
-          if (variants.length > 0) {
-            result = `${variants.map((v) => ds.printVariant(v)).join(':')}:${result}`
-          }
-
-          // Re-attach the important flag
-          if (important) {
-            result += '!'
-          }
-
-          // Re-attach the prefix if there were variants
-          if (ds.theme.prefix !== null && variants.length > 0) {
-            result = `${prefix}${result}`
-          }
-
-          return result
-        }
-
-        // We are guaranteed to have no variants and no important flag, just the
-        // base candidate left to canonicalize.
-        let result = utilityCache.get(rawCandidate)
-        if (result !== rawCandidate) {
-          return result
-        }
-      }
-
-      return rawCandidate
-    })
-  })
-}
-
-type VariantCanonicalizationFunction = (
-  variant: Variant,
-  options: InternalCanonicalizeOptions,
-) => Variant | Variant[]
-
-const VARIANT_CANONICALIZATIONS: VariantCanonicalizationFunction[] = [
-  themeToVarVariant,
-  arbitraryValueToBareValueVariant,
-  modernizeArbitraryValuesVariant,
-  arbitraryVariants,
-]
-
-const CANONICALIZE_VARIANT_KEY = Symbol()
-function createCanonicalizeVariantCache(): DesignSystem['storage'][typeof CANONICALIZE_VARIANT_KEY] {
-  return new DefaultMap((options: InternalCanonicalizeOptions) => {
-    return new DefaultMap((variant: Variant): Variant[] => {
-      let replacement = [variant]
-      for (let fn of VARIANT_CANONICALIZATIONS) {
-        for (let current of replacement.splice(0)) {
-          // A single variant can result in multiple variants, e.g.:
-          // `[&>[data-selected]]:flex` → `*:data-selected:flex`
-          let result = fn(cloneVariant(current), options)
-          if (Array.isArray(result)) {
-            replacement.push(...result)
-            continue
-          } else {
-            replacement.push(result)
-          }
-        }
-      }
-      return replacement
-    })
-  })
-}
-
-type UtilityCanonicalizationFunction = (
-  candidate: Candidate,
-  options: InternalCanonicalizeOptions,
-) => Candidate
-
-const UTILITY_CANONICALIZATIONS: UtilityCanonicalizationFunction[] = [
-  bgGradientToLinear,
-  themeToVarUtility,
-  calcToSpacingFunction,
-  optimizeArbitraryValueExpressions,
-  arbitraryUtilities,
-  bareValueUtilities,
-  deprecatedUtilities,
-  dropUnnecessaryDataTypes,
-  arbitraryValueToBareValueUtility,
-  optimizeModifier,
-]
-
-const CANONICALIZE_UTILITY_KEY = Symbol()
-function createCanonicalizeUtilityCache(): DesignSystem['storage'][typeof CANONICALIZE_UTILITY_KEY] {
-  return new DefaultMap((options: InternalCanonicalizeOptions) => {
-    let designSystem = options.designSystem
-    return new DefaultMap((rawCandidate: string): string => {
-      for (let readonlyCandidate of designSystem.parseCandidate(rawCandidate)) {
-        let replacement = cloneCandidate(readonlyCandidate) as Writable<typeof readonlyCandidate>
-
-        for (let fn of UTILITY_CANONICALIZATIONS) {
-          replacement = fn(replacement, options)
-        }
-
-        let canonicalizedCandidate = designSystem.printCandidate(replacement)
-        if (rawCandidate !== canonicalizedCandidate) {
-          return canonicalizedCandidate
-        }
-      }
-
-      return rawCandidate
-    })
-  })
-}
-
-// ----
-
-const DIRECTIONS = ['t', 'tr', 'r', 'br', 'b', 'bl', 'l', 'tl']
-function bgGradientToLinear(candidate: Candidate) {
-  if (candidate.kind === 'static' && candidate.root.startsWith('bg-gradient-to-')) {
-    let direction = candidate.root.slice(15)
-
-    if (!DIRECTIONS.includes(direction)) {
-      return candidate
-    }
-
-    candidate.root = `bg-linear-to-${direction}`
-    return candidate
-  }
-
-  return candidate
-}
-
-// ----
-
-const enum Convert {
-  All = 0,
-  MigrateModifier = 1 << 0,
-  MigrateThemeOnly = 1 << 1,
-}
-
-function themeToVarUtility(candidate: Candidate, options: InternalCanonicalizeOptions): Candidate {
-  let convert = options.designSystem.storage[CONVERTER_KEY]
-
-  if (candidate.kind === 'arbitrary') {
-    let [newValue, modifier] = convert(
-      candidate.value,
-      candidate.modifier === null ? Convert.MigrateModifier : Convert.All,
-    )
-    if (newValue !== candidate.value) {
-      candidate.value = newValue
-
-      if (modifier !== null) {
-        candidate.modifier = modifier
-      }
-    }
-  } else if (candidate.kind === 'functional' && candidate.value?.kind === 'arbitrary') {
-    let [newValue, modifier] = convert(
-      candidate.value.value,
-      candidate.modifier === null ? Convert.MigrateModifier : Convert.All,
-    )
-    if (newValue !== candidate.value.value) {
-      candidate.value.value = newValue
-
-      if (modifier !== null) {
-        candidate.modifier = modifier
-      }
-    }
-  }
-
-  return candidate
-}
-
-function themeToVarVariant(
-  variant: Variant,
-  options: InternalCanonicalizeOptions,
-): Variant | Variant[] {
-  let convert = options.designSystem.storage[CONVERTER_KEY]
-
-  let iterator = walkVariants(variant)
-  for (let [variant] of iterator) {
-    if (variant.kind === 'arbitrary') {
-      let [newValue] = convert(variant.selector, Convert.MigrateThemeOnly)
-      if (newValue !== variant.selector) {
-        variant.selector = newValue
-      }
-    } else if (variant.kind === 'functional' && variant.value?.kind === 'arbitrary') {
-      let [newValue] = convert(variant.value.value, Convert.MigrateThemeOnly)
-      if (newValue !== variant.value.value) {
-        variant.value.value = newValue
-      }
-    }
-  }
-
-  return variant
-}
-
-function calcToSpacingFunction(
-  candidate: Candidate,
-  options: InternalCanonicalizeOptions,
-): Candidate {
-  if (candidate.kind === 'arbitrary') {
-    candidate.value = spacingCalcToSpacingFunction(candidate.value, options.designSystem)
-  } else if (candidate.kind === 'functional' && candidate.value?.kind === 'arbitrary') {
-    candidate.value.value = spacingCalcToSpacingFunction(
-      candidate.value.value,
-      options.designSystem,
-    )
-  }
-
-  return candidate
-}
-
-function spacingCalcToSpacingFunction(input: string, designSystem: DesignSystem) {
-  let spacingVariable = designSystem.theme.prefix
-    ? `--${designSystem.theme.prefix}-spacing`
-    : '--spacing'
-
-  let ast = ValueParser.parse(input)
-
-  walk(ast, (node) => {
-    // calc(…)
-    if (node.kind !== 'function' || node.value !== 'calc') return
-
-    // calc(var(--spacing) * 2)
-    //      --------------       1. function        (var)
-    //                    -      2. separator       ( )
-    //                     -     3. word            (*)
-    //                      -    4. separator       ( )
-    //                       -   5. any value, word (2)
-    if (node.nodes.length !== 5) return
-
-    // *
-    if (node.nodes[2].kind !== 'word' || node.nodes[2].value !== '*') {
-      return
-    }
-
-    // var(--spacing)
-    if (
-      node.nodes[0].kind !== 'function' ||
-      node.nodes[0].value !== 'var' ||
-      node.nodes[0].nodes.length !== 1 ||
-      node.nodes[0].nodes[0].kind !== 'word' ||
-      node.nodes[0].nodes[0].value !== spacingVariable
-    ) {
-      return
-    }
-
-    return WalkAction.Replace(
-      ValueParser.parse(
-        `--spacing(${
-          ValueParser.toCss([node.nodes[4]]) // Value node
-        })`,
-      ),
-    )
-  })
-
-  return ValueParser.toCss(ast)
-}
-
-const CONVERTER_KEY = Symbol()
-function createConverterCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof CONVERTER_KEY] {
-  return createConverter(designSystem)
-
-  function createConverter(designSystem: DesignSystem) {
-    function convert(input: string, options = Convert.All): [string, CandidateModifier | null] {
-      let ast = ValueParser.parse(input)
-
-      // In some scenarios (e.g.: variants), we can't migrate to `var(…)` if it
-      // ends up in the `@media (…)` part. In this case we only have to migrate to
-      // the new `theme(…)` notation.
-      if (options & Convert.MigrateThemeOnly) {
-        return [substituteFunctionsInValue(ast, toTheme), null]
-      }
-
-      let themeUsageCount = 0
-      let themeModifierCount = 0
-
-      // Analyze AST
-      walk(ast, (node) => {
-        if (node.kind !== 'function') return
-        if (node.value !== 'theme') return
-
-        // We are only interested in the `theme` function
-        themeUsageCount += 1
-
-        // Figure out if a modifier is used
-        walk(node.nodes, (child) => {
-          // If we see a `,`, it means that we have a fallback value
-          if (child.kind === 'separator' && child.value.includes(',')) {
-            return WalkAction.Stop
-          }
-
-          // If we see a `/`, we have a modifier
-          else if (child.kind === 'word' && child.value === '/') {
-            themeModifierCount += 1
-            return WalkAction.Stop
-          }
-
-          return WalkAction.Skip
-        })
-      })
-
-      // No `theme(…)` calls, nothing to do
-      if (themeUsageCount === 0) {
-        return [input, null]
-      }
-
-      // No `theme(…)` with modifiers, we can migrate to `var(…)`
-      if (themeModifierCount === 0) {
-        return [substituteFunctionsInValue(ast, toVar), null]
-      }
-
-      // Multiple modifiers which means that there are multiple `theme(…/…)`
-      // values. In this case, we can't convert the modifier to a candidate
-      // modifier.
-      //
-      // We also can't migrate to `var(…)` because that would lose the modifier.
-      //
-      // Try to convert each `theme(…)` call to the modern syntax.
-      if (themeModifierCount > 1) {
-        return [substituteFunctionsInValue(ast, toTheme), null]
-      }
-
-      // Only a single `theme(…)` with a modifier left, that modifier will be
-      // migrated to a candidate modifier.
-      let modifier: CandidateModifier | null = null
-      let result = substituteFunctionsInValue(ast, (path, fallback) => {
-        let parts = segment(path, '/').map((part) => part.trim())
-
-        // Multiple `/` separators, which makes this an invalid path
-        if (parts.length > 2) return null
-
-        // The path contains a `/`, which means that there is a modifier such as
-        // `theme(colors.red.500/50%)`.
-        //
-        // Currently, we are assuming that this is only being used for colors,
-        // which means that we can typically convert them to a modifier on the
-        // candidate itself.
-        //
-        // If there is more than one node in the AST though, `theme(…)` must not
-        // be the whole value so it's not safe to use a modifier instead.
-        //
-        // E.g.: `inset 0px 1px theme(colors.red.500/50%)` is a shadow, not a color.
-        if (ast.length === 1 && parts.length === 2 && options & Convert.MigrateModifier) {
-          let [pathPart, modifierPart] = parts
-
-          // 50% -> /50
-          if (/^\d+%$/.test(modifierPart)) {
-            modifier = { kind: 'named', value: modifierPart.slice(0, -1) }
-          }
-
-          // .12 -> /12
-          // .12345 -> /[12.345]
-          else if (/^0?\.\d+$/.test(modifierPart)) {
-            let value = Number(modifierPart) * 100
-            modifier = {
-              kind: Number.isInteger(value) ? 'named' : 'arbitrary',
-              value: value.toString(),
-            }
-          }
-
-          // Anything else becomes arbitrary
-          else {
-            modifier = { kind: 'arbitrary', value: modifierPart }
-          }
-
-          // Update path to be the first part
-          path = pathPart
-        }
-
-        return toVar(path, fallback) || toTheme(path, fallback)
-      })
-
-      return [result, modifier]
-    }
-
-    function pathToVariableName(path: string, shouldPrefix = true) {
-      let variable = `--${keyPathToCssProperty(toKeyPath(path))}` as const
-      if (!designSystem.theme.get([variable])) return null
-
-      if (shouldPrefix && designSystem.theme.prefix) {
-        return `--${designSystem.theme.prefix}-${variable.slice(2)}`
-      }
-
-      return variable
-    }
-
-    function toVar(path: string, fallback?: string) {
-      let variable = pathToVariableName(path)
-      if (variable) return fallback ? `var(${variable}, ${fallback})` : `var(${variable})`
-
-      let keyPath = toKeyPath(path)
-      if (keyPath[0] === 'spacing' && designSystem.theme.get(['--spacing'])) {
-        let multiplier = keyPath[1]
-        if (!isValidSpacingMultiplier(multiplier)) return null
-
-        return `--spacing(${multiplier})`
-      }
-
-      return null
-    }
-
-    function toTheme(path: string, fallback?: string) {
-      let parts = segment(path, '/').map((part) => part.trim())
-      path = parts.shift()!
-
-      let variable = pathToVariableName(path, false)
-      if (!variable) return null
-
-      let modifier = parts.length > 0 ? `/${parts.join('/')}` : ''
-      return fallback
-        ? `--theme(${variable}${modifier}, ${fallback})`
-        : `--theme(${variable}${modifier})`
-    }
-
-    return convert
-  }
-}
-
-function substituteFunctionsInValue(
-  ast: ValueParser.ValueAstNode[],
-  handle: (value: string, fallback?: string) => string | null,
-) {
-  walk(ast, (node, ctx) => {
-    if (node.kind === 'function' && node.value === 'theme') {
-      if (node.nodes.length < 1) return
-
-      // Ignore whitespace before the first argument
-      if (node.nodes[0].kind === 'separator' && node.nodes[0].value.trim() === '') {
-        node.nodes.shift()
-      }
-
-      let pathNode = node.nodes[0]
-      if (pathNode.kind !== 'word') return
-
-      let path = pathNode.value
-
-      // For the theme function arguments, we require all separators to contain
-      // comma (`,`), spaces alone should be merged into the previous word to
-      // avoid splitting in this case:
-      //
-      // theme(--color-red-500 / 75%) theme(--color-red-500 / 75%, foo, bar)
-      //
-      // We only need to do this for the first node, as the fallback values are
-      // passed through as-is.
-      let skipUntilIndex = 1
-      for (let i = skipUntilIndex; i < node.nodes.length; i++) {
-        if (node.nodes[i].value.includes(',')) {
-          break
-        }
-        path += ValueParser.toCss([node.nodes[i]])
-        skipUntilIndex = i + 1
-      }
-
-      path = eventuallyUnquote(path)
-      let fallbackValues = node.nodes.slice(skipUntilIndex + 1)
-
-      let replacement =
-        fallbackValues.length > 0 ? handle(path, ValueParser.toCss(fallbackValues)) : handle(path)
-      if (replacement === null) return
-
-      {
-        let idx = ctx.index - 1
-        while (idx !== -1) {
-          let previous = ctx.siblings[idx]
-          // Skip the space separator
-          if (previous.kind === 'separator' && previous.value.trim() === '') {
-            idx -= 1
-            continue
-          }
-
-          // If the previous node is a word and contains an operator, we need to
-          // wrap the replacement in parentheses to make the output less
-          // ambiguous.
-          //
-          // Input:
-          // - `calc(100dvh-theme(spacing.2))`
-          //
-          // Output:
-          // - `calc(100dvh-(--spacing(2)))`
-          //
-          // Not:
-          // -`calc(100dvh---spacing(2))`
-          //
-          if (/^[-+*/]$/.test(previous.value.trim())) {
-            replacement = `(${replacement})`
-          }
-
-          break
-        }
-      }
-
-      return WalkAction.Replace(ValueParser.parse(replacement))
-    }
-  })
-
-  return ValueParser.toCss(ast)
-}
-
-function eventuallyUnquote(value: string) {
-  if (value[0] !== "'" && value[0] !== '"') return value
-
-  let unquoted = ''
-  let quoteChar = value[0]
-  for (let i = 1; i < value.length - 1; i++) {
-    let currentChar = value[i]
-    let nextChar = value[i + 1]
-
-    if (currentChar === '\\' && (nextChar === quoteChar || nextChar === '\\')) {
-      unquoted += nextChar
-      i++
-    } else {
-      unquoted += currentChar
-    }
-  }
-
-  return unquoted
-}
-
-// ----
-
-function* walkVariants(variant: Variant) {
-  function* inner(
-    variant: Variant,
-    parent: Extract<Variant, { kind: 'compound' }> | null = null,
-  ): Iterable<[Variant, Extract<Variant, { kind: 'compound' }> | null]> {
-    yield [variant, parent]
-
-    if (variant.kind === 'compound') {
-      yield* inner(variant.variant, variant)
-    }
-  }
-
-  yield* inner(variant, null)
-}
-
-function parseCandidate(designSystem: DesignSystem, input: string) {
-  return designSystem.parseCandidate(
-    designSystem.theme.prefix && !input.startsWith(`${designSystem.theme.prefix}:`)
-      ? `${designSystem.theme.prefix}:${input}`
-      : input,
-  )
-}
-
-function printUnprefixedCandidate(designSystem: DesignSystem, candidate: Candidate) {
-  let candidateString = designSystem.printCandidate(candidate)
-
-  return designSystem.theme.prefix && candidateString.startsWith(`${designSystem.theme.prefix}:`)
-    ? candidateString.slice(designSystem.theme.prefix.length + 1)
-    : candidateString
-}
-
-// ----
-
-const SPACING_KEY = Symbol()
-
-// We prefer bare values over arbitrary values such as `left-[6px]` →
-// `left-1.5`.
-//
-// There are situations where this doesn't always make sense. E.g.:
-// `left-[99999px]` → `left-24999.75`.
-//
-// We could try and analyze the incoming value and bail out if we detect certain
-// patterns. But a first step would be to limit the bare values for large values
-// and keep them low. The largest rem value we have is for the 2xl breakpoint,
-// which is 96rem, which is 1536px.
-const MAX_BARE_VALUE_IN_PX = 1536
-const MAX_BARE_VALUE_IN_REM = MAX_BARE_VALUE_IN_PX / 16
-
-function isReasonableBareValue(value: number, designSystem: DesignSystem, rem: number | null) {
-  let spacingMultiplier = designSystem.resolveThemeValue('--spacing')
-  if (spacingMultiplier === undefined) return false
-
-  let parsed = dimensions.get(constantFoldDeclaration(spacingMultiplier, rem))
-  if (parsed === null) return false
-
-  let [spacingValue, spacingUnit] = parsed
-  let bareValueInPixels = value * spacingValue
-
-  if (spacingUnit === 'px') return bareValueInPixels <= MAX_BARE_VALUE_IN_PX
-  if (spacingUnit === 'rem') return bareValueInPixels <= MAX_BARE_VALUE_IN_REM
-  return false
-}
-
-function createSpacingCache(
-  designSystem: DesignSystem,
-  options?: CanonicalizeOptions,
-): DesignSystem['storage'][typeof SPACING_KEY] {
-  let spacingMultiplier = designSystem.resolveThemeValue('--spacing')
-  if (spacingMultiplier === undefined) return null
-
-  spacingMultiplier = constantFoldDeclaration(spacingMultiplier, options?.rem ?? null)
-
-  let parsed = dimensions.get(spacingMultiplier)
-  if (!parsed) return null
-
-  let [value, unit] = parsed
-
-  return new DefaultMap<string, number | null>((input) => {
-    // If we already know that the spacing multiplier is 0, all spacing
-    // multipliers will also be 0. No need to even try and parse/canonicalize
-    // the input value.
-    if (value === 0) return null
-
-    let parsed = dimensions.get(constantFoldDeclaration(input, options?.rem ?? null))
-    if (!parsed) return null
-
-    let [myValue, myUnit] = parsed
-    if (myUnit !== unit) return null
-
-    return myValue / value
-  })
-}
-
-function arbitraryUtilities(candidate: Candidate, options: InternalCanonicalizeOptions): Candidate {
-  // We are only interested in arbitrary properties and arbitrary values
-  if (
-    // Arbitrary property
-    candidate.kind !== 'arbitrary' &&
-    // Arbitrary value
-    !(candidate.kind === 'functional' && candidate.value?.kind === 'arbitrary')
-  ) {
-    return candidate
-  }
-
-  let designSystem = options.designSystem
-  let utilities = designSystem.storage[PRE_COMPUTED_UTILITIES_KEY].get(options.signatureOptions)
-  let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options.signatureOptions)
-  let hasSameSignature = designSystem.storage[COMPARE_CANDIDATES_KEY].get(options.signatureOptions)
-
-  let targetCandidateString = designSystem.printCandidate(candidate)
-
-  // Compute the signature for the target candidate
-  let targetSignature = signatures.get(targetCandidateString)
-  if (typeof targetSignature !== 'string') return candidate
-
-  // Try a few options to find a suitable replacement utility
-  for (let replacementCandidate of tryReplacements(targetSignature, candidate)) {
-    if (!hasSameSignature(candidate, replacementCandidate)) {
-      continue
-    }
-
-    // Ensure that if CSS variables were used, that they are still used
-    if (!allVariablesAreUsed(designSystem, candidate, replacementCandidate)) {
-      continue
-    }
-
-    return replacementCandidate
-  }
-
-  return candidate
-
-  function* tryReplacements(
-    targetSignature: string,
-    candidate: Extract<Candidate, { kind: 'functional' | 'arbitrary' }>,
-  ): Generator<Candidate> {
-    // Find a corresponding utility for the same signature
-    let replacements = utilities.get(targetSignature)
-
-    // Multiple utilities can map to the same signature.
-    if (replacements.length > 1) {
-      // Prefer positive values over negative values
-      let maybeReplacement: string | undefined = undefined
-      for (let replacement of replacements) {
-        if (replacement[0] === '-') continue // Skip negative values
-
-        // If multiple non-negative replacements exists then we are unsure
-        // what to do, so let's bail.
-        if (maybeReplacement) return
-
-        // Consider this replacement
-        maybeReplacement = replacement
-      }
-
-      if (maybeReplacement) {
-        for (let replacementCandidate of parseCandidate(designSystem, maybeReplacement)) {
-          yield replacementCandidate
-        }
-      }
-
-      return
-    }
-
-    // If we didn't find any replacement utilities, let's try to strip the
-    // modifier and find a replacement then. If we do, we can try to re-add the
-    // modifier later and verify if we have a valid migration.
-    //
-    // This is necessary because `text-red-500/50` will not be pre-computed,
-    // only `text-red-500` will.
-    if (replacements.length === 0 && candidate.modifier) {
-      let candidateWithoutModifier = { ...candidate, modifier: null }
-      let targetSignatureWithoutModifier = signatures.get(
-        designSystem.printCandidate(candidateWithoutModifier),
-      )
-      if (typeof targetSignatureWithoutModifier === 'string') {
-        for (let replacementCandidate of tryReplacements(
-          targetSignatureWithoutModifier,
-          candidateWithoutModifier,
-        )) {
-          yield Object.assign({}, replacementCandidate, { modifier: candidate.modifier })
-        }
-      }
-    }
-
-    // If only a single utility maps to the signature, we can use that as the
-    // replacement.
-    if (replacements.length === 1) {
-      for (let replacementCandidate of parseCandidate(designSystem, replacements[0])) {
-        yield replacementCandidate
-      }
-    }
-
-    // Find a corresponding functional utility for the same signature
-    else if (replacements.length === 0) {
-      // An arbitrary property will only set a single property, we can use that
-      // to find functional utilities that also set this property.
-      let value =
-        candidate.kind === 'arbitrary' ? candidate.value : (candidate.value?.value ?? null)
-      if (value === null) return
-
-      // Try to canonicalize any incoming arbitrary value. Canonicalization of
-      // `rem` and `px` values will be converted to `px`, so we have to
-      // canonicalize the spacing multiplier as well.
-      if (
-        options.signatureOptions.rem !== null &&
-        candidate.kind === 'functional' &&
-        candidate.value?.kind === 'arbitrary'
-      ) {
-        let bareValue = designSystem.storage[SPACING_KEY]?.get(value) ?? null
-        if (bareValue !== null) {
-          if (
-            isValidSpacingMultiplier(bareValue) &&
-            isReasonableBareValue(bareValue, designSystem, options.signatureOptions.rem)
-          ) {
-            yield Object.assign({}, candidate, {
-              value: { kind: 'named', value: bareValue, fraction: null },
-            })
-          }
-        }
-      }
-
-      let spacingMultiplier = designSystem.storage[SPACING_KEY]?.get(value) ?? null
-      let rootPrefix = ''
-      if (spacingMultiplier !== null && spacingMultiplier < 0) {
-        rootPrefix = '-'
-        spacingMultiplier = Math.abs(spacingMultiplier)
-      }
-
-      for (let root of Array.from(designSystem.utilities.keys('functional')).sort(
-        // Sort negative roots after positive roots so that we can try
-        // `mt-*` before `-mt-*`. This is especially useful in situations where
-        // `-mt-[0px]` can be translated to `mt-[0px]`.
-        (a, z) => Number(a[0] === '-') - Number(z[0] === '-'),
-      )) {
-        if (rootPrefix) root = `${rootPrefix}${root}`
-
-        // Try as bare value
-        for (let replacementCandidate of parseCandidate(designSystem, `${root}-${value}`)) {
-          yield replacementCandidate
-        }
-
-        // Try as bare value with modifier
-        if (candidate.modifier) {
-          for (let replacementCandidate of parseCandidate(
-            designSystem,
-            `${root}-${value}${candidate.modifier}`,
-          )) {
-            yield replacementCandidate
-          }
-        }
-
-        // Try bare value based on the `--spacing` value. E.g.:
-        //
-        // - `w-[64rem]` → `w-256`
-        if (
-          spacingMultiplier !== null &&
-          isValidSpacingMultiplier(spacingMultiplier) &&
-          isReasonableBareValue(spacingMultiplier, designSystem, options.signatureOptions.rem)
-        ) {
-          for (let replacementCandidate of parseCandidate(
-            designSystem,
-            `${root}-${spacingMultiplier}`,
-          )) {
-            yield replacementCandidate
-          }
-
-          // Try bare value based on the `--spacing` value, but with a modifier
-          if (candidate.modifier) {
-            for (let replacementCandidate of parseCandidate(
-              designSystem,
-              `${root}-${spacingMultiplier}${printModifier(candidate.modifier)}`,
-            )) {
-              yield replacementCandidate
-            }
-          }
-        }
-
-        // Try as arbitrary value
-        for (let replacementCandidate of parseCandidate(designSystem, `${root}-[${value}]`)) {
-          yield replacementCandidate
-        }
-
-        // Try as arbitrary value with modifier
-        if (candidate.modifier) {
-          for (let replacementCandidate of parseCandidate(
-            designSystem,
-            `${root}-[${value}]${printModifier(candidate.modifier)}`,
-          )) {
-            yield replacementCandidate
-          }
-        }
-      }
-    }
-  }
-}
-
-// Let's make sure that all variables used in the value are also all used in the
-// found replacement. If not, then we are dealing with a different namespace or
-// we could lose functionality in case the variable was changed higher up in the
-// DOM tree.
-function allVariablesAreUsed(
-  designSystem: DesignSystem,
-  candidate: Candidate,
-  replacement: Candidate,
-) {
-  let value: string | null = null
-
-  // Functional utility with arbitrary value and variables
-  if (
-    candidate.kind === 'functional' &&
-    candidate.value?.kind === 'arbitrary' &&
-    candidate.value.value.includes('var(--')
-  ) {
-    value = candidate.value.value
-  }
-
-  // Arbitrary property with variables
-  else if (candidate.kind === 'arbitrary' && candidate.value.includes('var(--')) {
-    value = candidate.value
-  }
-
-  // No variables in the value, so this is a safe migration
-  if (value === null) {
-    return true
-  }
-
-  let replacementAsCss = designSystem
-    .candidatesToCss([designSystem.printCandidate(replacement)])
-    .join('\n')
-
-  let isSafeMigration = true
-  walk(ValueParser.parse(value), (node) => {
-    if (node.kind === 'function' && node.value === 'var') {
-      let variable = node.nodes[0].value
-      let r = new RegExp(`var\\(${variable}[,)]\\s*`, 'g')
-      if (
-        // We need to check if the variable is used in the replacement
-        !r.test(replacementAsCss) ||
-        // The value cannot be set to a different value in the
-        // replacement because that would make it an unsafe migration
-        replacementAsCss.includes(`${variable}:`)
-      ) {
-        isSafeMigration = false
-        return WalkAction.Stop
-      }
-    }
-  })
-
-  return isSafeMigration
-}
-
-// ----
-
-function bareValueUtilities(candidate: Candidate, options: InternalCanonicalizeOptions): Candidate {
-  // We are only interested in bare value utilities
-  if (candidate.kind !== 'functional' || candidate.value?.kind !== 'named') {
-    return candidate
-  }
-
-  let designSystem = options.designSystem
-  let utilities = designSystem.storage[PRE_COMPUTED_UTILITIES_KEY].get(options.signatureOptions)
-  let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options.signatureOptions)
-  let hasSameSignature = designSystem.storage[COMPARE_CANDIDATES_KEY].get(options.signatureOptions)
-
-  let targetCandidateString = designSystem.printCandidate(candidate)
-
-  // Compute the signature for the target candidate
-  let targetSignature = signatures.get(targetCandidateString)
-  if (typeof targetSignature !== 'string') return candidate
-
-  // Try a few options to find a suitable replacement utility
-  for (let replacementCandidate of tryReplacements(targetSignature, candidate)) {
-    if (!hasSameSignature(candidate, replacementCandidate)) {
-      continue
-    }
-
-    return replacementCandidate
-  }
-
-  return candidate
-
-  function* tryReplacements(
-    targetSignature: string,
-    candidate: Extract<Candidate, { kind: 'functional' }>,
-  ): Generator<Candidate> {
-    // Find a corresponding utility for the same signature
-    let replacements = utilities.get(targetSignature)
-
-    // Multiple utilities can map to the same signature.
-    if (replacements.length > 1) {
-      // Prefer positive values over negative values
-      let maybeReplacement: string | undefined = undefined
-      for (let replacement of replacements) {
-        if (replacement[0] === '-') continue // Skip negative values
-
-        // If multiple non-negative replacements exists then we are unsure
-        // what to do, so let's bail.
-        if (maybeReplacement) return
-
-        // Consider this replacement
-        maybeReplacement = replacement
-      }
-
-      if (maybeReplacement) {
-        for (let replacementCandidate of parseCandidate(designSystem, maybeReplacement)) {
-          yield replacementCandidate
-        }
-      }
-
-      return
-    }
-
-    // If we didn't find any replacement utilities, let's try to strip the
-    // modifier and find a replacement then. If we do, we can try to re-add the
-    // modifier later and verify if we have a valid migration.
-    //
-    // This is necessary because `text-red-500/50` will not be pre-computed,
-    // only `text-red-500` will.
-    if (replacements.length === 0 && candidate.modifier) {
-      let candidateWithoutModifier = { ...candidate, modifier: null }
-      let targetSignatureWithoutModifier = signatures.get(
-        designSystem.printCandidate(candidateWithoutModifier),
-      )
-      if (typeof targetSignatureWithoutModifier === 'string') {
-        for (let replacementCandidate of tryReplacements(
-          targetSignatureWithoutModifier,
-          candidateWithoutModifier,
-        )) {
-          yield Object.assign({}, replacementCandidate, { modifier: candidate.modifier })
-        }
-      }
-    }
-
-    // If only a single utility maps to the signature, we can use that as the
-    // replacement.
-    if (replacements.length === 1) {
-      for (let replacementCandidate of parseCandidate(designSystem, replacements[0])) {
-        yield replacementCandidate
-      }
-    }
-  }
-}
-
-// ----
-
-const DEPRECATION_MAP = new Map([
-  ['order-none', 'order-0'],
-  ['break-words', 'wrap-break-word'],
-  ['overflow-ellipsis', 'text-ellipsis'],
-])
-
-const DEPRECATION_TRANSFORMATION_MAP = new Map([
-  [/^(-)?start-(.*?)$/, '$1inset-s-$2'],
-  [/^(-)?end-(.*?)$/, '$1inset-e-$2'],
-])
-
-function* tryDeprecatedUtilities(candidate: string) {
-  // Try static replacements
-  let replacement = DEPRECATION_MAP.get(candidate)
-  if (replacement) yield replacement
-
-  // Try dynamic replacements
-  for (let [searchValue, replaceValue] of DEPRECATION_TRANSFORMATION_MAP) {
-    let replacement = candidate.replace(searchValue, replaceValue)
-    if (replacement === candidate) continue
-
-    yield replacement
-  }
-}
-
-function deprecatedUtilities(
-  candidate: Candidate,
-  options: InternalCanonicalizeOptions,
-): Candidate {
-  let designSystem = options.designSystem
-  let hasSameSignature = designSystem.storage[COMPARE_CANDIDATES_KEY].get(options.signatureOptions)
-
-  let targetCandidateString = printUnprefixedCandidate(designSystem, candidate)
-
-  for (let replacementString of tryDeprecatedUtilities(targetCandidateString)) {
-    if (!hasSameSignature(candidate, replacementString)) {
-      continue
-    }
-
-    let [replacement] = parseCandidate(designSystem, replacementString)
-    return replacement
-  }
-
-  return candidate
-}
-
-// ----
-
-function arbitraryVariants(
-  variant: Variant,
-  options: InternalCanonicalizeOptions,
-): Variant | Variant[] {
-  let designSystem = options.designSystem
-  let signatures = designSystem.storage[VARIANT_SIGNATURE_KEY].get(options.signatureOptions.rem)
-  let variants = designSystem.storage[PRE_COMPUTED_VARIANTS_KEY].get(options.signatureOptions.rem)
-
-  let iterator = walkVariants(variant)
-  for (let [variant] of iterator) {
-    if (variant.kind === 'compound') continue
-
-    let targetString = designSystem.printVariant(variant)
-    let targetSignature = signatures.get(targetString)
-    if (typeof targetSignature !== 'string') continue
-
-    let foundVariants = variants.get(targetSignature)
-    if (foundVariants.length === 0) continue
-
-    // The variant is already in a canonical form, e.g.: `min-lg` and `lg`
-    // produce the same CSS, but both are valid so we keep them as-is.
-    if (foundVariants.includes(targetString)) continue
-
-    let foundVariant = foundVariants[0]
-    let parsedVariant = designSystem.parseVariant(foundVariant)
-    if (parsedVariant === null) continue
-
-    replaceObject(variant, parsedVariant)
-  }
-
-  return variant
-}
-
-// ----
-
-function dropUnnecessaryDataTypes(
-  candidate: Candidate,
-  options: InternalCanonicalizeOptions,
-): Candidate {
-  let designSystem = options.designSystem
-  let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options.signatureOptions)
-
-  if (
-    candidate.kind === 'functional' &&
-    candidate.value?.kind === 'arbitrary' &&
-    candidate.value.dataType !== null
-  ) {
-    let replacement = designSystem.printCandidate({
-      ...candidate,
-      value: { ...candidate.value, dataType: null },
-    })
-
-    if (signatures.get(designSystem.printCandidate(candidate)) === signatures.get(replacement)) {
-      candidate.value.dataType = null
-    }
-  }
-
-  return candidate
-}
-
-// ----
-
-function arbitraryValueToBareValueUtility(
-  candidate: Candidate,
-  options: InternalCanonicalizeOptions,
-): Candidate {
-  // We are only interested in functional utilities with arbitrary values
-  if (candidate.kind !== 'functional' || candidate.value?.kind !== 'arbitrary') {
-    return candidate
-  }
-
-  let designSystem = options.designSystem
-  let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options.signatureOptions)
-
-  let expectedSignature = signatures.get(designSystem.printCandidate(candidate))
-  if (expectedSignature === null) return candidate
-
-  for (let value of tryValueReplacements(candidate)) {
-    let newSignature = signatures.get(designSystem.printCandidate({ ...candidate, value }))
-    if (newSignature === expectedSignature) {
-      candidate.value = value
-      return candidate
-    }
-  }
-
-  return candidate
-}
-
-function arbitraryValueToBareValueVariant(variant: Variant): Variant | Variant[] {
-  let iterator = walkVariants(variant)
-  for (let [variant] of iterator) {
-    // Convert `data-[selected]` to `data-selected`
-    if (
-      variant.kind === 'functional' &&
-      variant.root === 'data' &&
-      variant.value?.kind === 'arbitrary' &&
-      !variant.value.value.includes('=')
-    ) {
-      variant.value = {
-        kind: 'named',
-        value: variant.value.value,
-      }
-    }
-
-    // Convert `aria-[selected="true"]` to `aria-selected`
-    else if (
-      variant.kind === 'functional' &&
-      variant.root === 'aria' &&
-      variant.value?.kind === 'arbitrary' &&
-      (variant.value.value.endsWith('=true') ||
-        variant.value.value.endsWith('="true"') ||
-        variant.value.value.endsWith("='true'"))
-    ) {
-      let [key, _value] = segment(variant.value.value, '=')
-      if (
-        // aria-[foo~="true"]
-        key[key.length - 1] === '~' ||
-        // aria-[foo|="true"]
-        key[key.length - 1] === '|' ||
-        // aria-[foo^="true"]
-        key[key.length - 1] === '^' ||
-        // aria-[foo$="true"]
-        key[key.length - 1] === '$' ||
-        // aria-[foo*="true"]
-        key[key.length - 1] === '*'
-      ) {
-        continue
-      }
-
-      variant.value = {
-        kind: 'named',
-        value: variant.value.value.slice(0, variant.value.value.indexOf('=')),
-      }
-    }
-
-    // Convert `supports-[gap]` to `supports-gap`
-    else if (
-      variant.kind === 'functional' &&
-      variant.root === 'supports' &&
-      variant.value?.kind === 'arbitrary' &&
-      /^[a-z-][a-z0-9-]*$/i.test(variant.value.value)
-    ) {
-      variant.value = {
-        kind: 'named',
-        value: variant.value.value,
-      }
-    }
-  }
-
-  return variant
-}
-
-// Convert functional utilities with arbitrary values to bare values if we can.
-// We know that bare values can only be:
-//
-// 1. A number (with increments of .25)
-// 2. A percentage (with increments of .25 followed by a `%`)
-// 3. A ratio with whole numbers
-//
-// Not a bare value per se, but if we are dealing with a keyword, that could
-// potentially also look like a bare value (aka no `[` or `]`). E.g.:
-// ```diff
-// grid-cols-[subgrid]
-// grid-cols-subgrid
-// ```
-function* tryValueReplacements(
-  candidate: Extract<Candidate, { kind: 'functional' }>,
-  value: string = candidate.value?.value ?? '',
-  seen: Set<string> = new Set(),
-): Generator<NamedUtilityValue> {
-  if (seen.has(value)) return
-  seen.add(value)
-
-  // 0. Just try to drop the square brackets and see if it works
-  // 1. A number (with increments of .25)
-  yield {
-    kind: 'named',
-    value,
-    fraction: null,
-  }
-
-  // 2. A percentage (with increments of .25 followed by a `%`)
-  //    Try to drop the `%` and see if it works
-  if (value.endsWith('%') && isValidSpacingMultiplier(value.slice(0, -1))) {
-    yield {
-      kind: 'named',
-      value: value.slice(0, -1),
-      fraction: null,
-    }
-  }
-
-  // 3. A ratio with whole numbers
-  if (value.includes('/')) {
-    let [numerator, denominator] = value.split('/')
-    if (isPositiveInteger(numerator) && isPositiveInteger(denominator)) {
-      yield {
-        kind: 'named',
-        value: numerator,
-        fraction: `${numerator}/${denominator}`,
-      }
-    }
-  }
-
-  // It could also be that we have `20px`, we can try just `20` and see if it
-  // results in the same signature.
-  let allNumbersAndFractions = new Set<string>()
-
-  // Figure out all numbers and fractions in the value
-  for (let match of value.matchAll(/(\d+\/\d+)|(\d+\.?\d+)/g)) {
-    allNumbersAndFractions.add(match[0].trim())
-  }
-
-  // Sort the numbers and fractions where the smallest length comes first. This
-  // will result in the smallest replacement.
-  let options = Array.from(allNumbersAndFractions).sort((a, z) => {
-    return a.length - z.length
-  })
-
-  // Try all the options
-  for (let option of options) {
-    yield* tryValueReplacements(candidate, option, seen)
-  }
-}
-
-// ----
-
-function isSingleSelector(ast: SelectorParser.SelectorAstNode[]): boolean {
-  if (ast.length === 1 && ast[0].kind === 'list') return false
-  return true
-}
-
-function isAttributeSelector(node: SelectorParser.SelectorNode): boolean {
-  return node.value[0] === '[' && node.value[node.value.length - 1] === ']'
-}
-
-function modernizeArbitraryValuesVariant(
-  variant: Variant,
-  options: InternalCanonicalizeOptions,
-): Variant | Variant[] {
-  let result = [variant]
-  let designSystem = options.designSystem
-  let signatures = designSystem.storage[VARIANT_SIGNATURE_KEY].get(options.signatureOptions.rem)
-
-  let iterator = walkVariants(variant)
-  for (let [variant, parent] of iterator) {
-    // Forward modifier from the root to the compound variant
-    if (
-      variant.kind === 'compound' &&
-      (variant.root === 'has' || variant.root === 'not' || variant.root === 'in')
-    ) {
-      if (variant.modifier !== null) {
-        if ('modifier' in variant.variant) {
-          variant.variant.modifier = variant.modifier
-          variant.modifier = null
-        }
-      }
-    }
-
-    // Expecting an arbitrary variant
-    if (variant.kind === 'arbitrary') {
-      // Expecting a non-relative arbitrary variant
-      if (variant.relative) continue
-
-      let ast = SelectorParser.parse(variant.selector)
-
-      // Expecting a single selector node
-      if (!isSingleSelector(ast)) continue
-
-      // Keep the existing arbitrary variant modernizations working on a flat
-      // selector sequence while the parser exposes complex selectors as a node.
-      if (ast.length === 1 && ast[0].kind === 'complex') {
-        ast = ast[0].nodes
-      }
-
-      // `[&>*]` can be replaced with `*`
-      if (
-        // Only top-level, so `has-[&>*]` is not supported
-        parent === null &&
-        // [&_>_*]:flex
-        //  ^ ^ ^
-        ast.length === 3 &&
-        ast[0].kind === 'selector' &&
-        ast[0].value === '&' &&
-        ast[1].kind === 'combinator' &&
-        ast[1].value === '>' &&
-        ast[2].kind === 'selector' &&
-        ast[2].value === '*'
-      ) {
-        replaceObject(variant, designSystem.parseVariant('*'))
-        continue
-      }
-
-      // `[&_*]` can be replaced with `**`
-      if (
-        // Only top-level, so `has-[&_*]` is not supported
-        parent === null &&
-        // [&_*]:flex
-        //  ^ ^
-        ast.length === 3 &&
-        ast[0].kind === 'selector' &&
-        ast[0].value === '&' &&
-        ast[1].kind === 'combinator' &&
-        ast[1].value === ' ' &&
-        ast[2].kind === 'selector' &&
-        ast[2].value === '*'
-      ) {
-        replaceObject(variant, designSystem.parseVariant('**'))
-        continue
-      }
-
-      // `[&:has(…)]` can be replaced with `has-[…]`
-      if (
-        // Only top-level, so `group-[&:has(…)]` is not covered
-
-        parent === null &&
-        // [&:has(…)]:flex
-        //  ^ ^^^^^^
-        ast.length === 1 &&
-        ast[0].kind === 'compound' &&
-        ast[0].nodes.length === 2 &&
-        ast[0].nodes[0].kind === 'selector' &&
-        ast[0].nodes[0].value === '&' &&
-        ast[0].nodes[1].kind === 'function' &&
-        ast[0].nodes[1].value === ':has' &&
-        ast[0].nodes[1].nodes.length === 1 &&
-        ast[0].nodes[1].nodes[0].kind === 'selector'
-      ) {
-        replaceObject(
-          variant,
-          designSystem.parseVariant(`has-[${SelectorParser.toCss(ast[0].nodes[1].nodes, true)}]`),
-        )
-        continue
-      }
-
-      // `in-*` variant. If the selector ends with ` &`, we can convert it to an
-      // `in-*` variant.
-      //
-      // E.g.: `[[data-visible]_&]` => `in-data-visible`
-      if (
-        // Only top-level, so `in-[&_[data-visible]]` is not supported
-        parent === null &&
-        // [[data-visible]___&]:flex
-        //  ^^^^^^^^^^^^^^ ^ ^
-        ast.length === 3 &&
-        ast[0].kind === 'selector' &&
-        ast[1].kind === 'combinator' &&
-        ast[1].value === ' ' &&
-        ast[2].kind === 'selector' &&
-        ast[2].value === '&'
-      ) {
-        ast.pop() // Remove the nesting node
-        ast.pop() // Remove the combinator
-
-        // When handling a compound like `in-[[data-visible]]`, we will first
-        // handle `[[data-visible]]`, then the parent `in-*` part. This means
-        // that we can convert `[[data-visible]_&]` to `in-[[data-visible]]`.
-        //
-        // Later this gets converted to `in-data-visible`.
-        replaceObject(variant, designSystem.parseVariant(`in-[${SelectorParser.toCss(ast, true)}]`))
-        continue
-      }
-
-      // Hoist `not` modifier for `@media` or `@supports` variants
-      //
-      // E.g.: `[@media_not_(scripting:none)]:` -> `not-[@media_(scripting:none)]:`
-      if (
-        // Only top-level, so something like `in-[@media(scripting:none)]`
-        // (which is not valid anyway) is not supported
-        parent === null &&
-        // [@media_not(scripting:none)]:flex
-        //  ^^^^^^^^^^^^^^^^^^^^^^^^^^^
-        ast[0].kind === 'selector' &&
-        (ast[0].value === '@media' || ast[0].value === '@supports')
-      ) {
-        let targetSignature = signatures.get(designSystem.printVariant(variant))
-
-        let parsed = ValueParser.parse(SelectorParser.toCss(ast, true))
-        let containsNot = false
-        walk(parsed, (node) => {
-          if (node.kind === 'word' && node.value === 'not') {
-            containsNot = true
-            return WalkAction.Replace([])
-          }
-        })
-
-        // Remove unnecessary whitespace
-        parsed = ValueParser.parse(ValueParser.toCss(parsed))
-        walk(parsed, (node) => {
-          if (node.kind === 'separator' && node.value !== ' ' && node.value.trim() === '') {
-            // node.value contains at least 2 spaces. Normalize it to a single
-            // space.
-            node.value = ' '
-          }
-        })
-
-        if (containsNot) {
-          let hoistedNot = designSystem.parseVariant(`not-[${ValueParser.toCss(parsed)}]`)
-          if (hoistedNot === null) continue
-          let hoistedNotSignature = signatures.get(designSystem.printVariant(hoistedNot))
-          if (targetSignature === hoistedNotSignature) {
-            replaceObject(variant, hoistedNot)
-            continue
-          }
-        }
-      }
-
-      let prefixedVariant: Variant | null = null
-
-      // Handling a child combinator. E.g.: `[&>[data-visible]]` => `*:data-visible`
-      if (
-        // Only top-level, so `has-[&>[data-visible]]` is not supported
-        parent === null &&
-        // [&_>_[data-visible]]:flex
-        //  ^ ^ ^^^^^^^^^^^^^^
-        ast.length === 3 &&
-        ast[0].kind === 'selector' &&
-        ast[0].value === '&' &&
-        ast[1].kind === 'combinator' &&
-        ast[1].value === '>' &&
-        ast[2].kind === 'selector' &&
-        (ast[2].value[0] === ':' || isAttributeSelector(ast[2]))
-      ) {
-        ast = [ast[2]]
-        prefixedVariant = designSystem.parseVariant('*')
-      }
-
-      // Handling a grand child combinator. E.g.: `[&_[data-visible]]` => `**:data-visible`
-      if (
-        // Only top-level, so `has-[&_[data-visible]]` is not supported
-        parent === null &&
-        // [&_[data-visible]]:flex
-        //  ^ ^^^^^^^^^^^^^^
-        ast.length === 3 &&
-        ast[0].kind === 'selector' &&
-        ast[0].value === '&' &&
-        ast[1].kind === 'combinator' &&
-        ast[1].value === ' ' &&
-        ast[2].kind === 'selector' &&
-        (ast[2].value[0] === ':' || isAttributeSelector(ast[2]))
-      ) {
-        ast = [ast[2]]
-        prefixedVariant = designSystem.parseVariant('**')
-      }
-
-      let selectorNodes = ast
-      walk(selectorNodes, {
-        enter(node) {
-          // Filter out `&`. E.g.: `&[data-foo]` => `[data-foo]`
-          if (node.kind === 'selector' && node.value === '&') {
-            return WalkAction.Replace([])
-          }
-
-          if (node.kind === 'function') {
-            return WalkAction.Skip
-          }
-        },
-        exit(node) {
-          if (node.kind === 'compound' && node.nodes.length === 1) {
-            return WalkAction.ReplaceSkip(node.nodes)
-          }
-        },
-      })
-
-      // Expecting a single selector (normal selector or attribute selector)
-      if (selectorNodes.length !== 1) continue
-
-      let target = selectorNodes[0]
-      if (target.kind === 'function' && target.value === ':is') {
-        // Expecting a single selector node
-        if (
-          !isSingleSelector(target.nodes) ||
-          // [foo][bar] is considered a single selector but has multiple nodes
-          target.nodes.length !== 1
-        ) {
-          continue
-        }
-
-        // Expecting a single attribute selector
-        if (target.nodes[0].kind === 'selector' && !isAttributeSelector(target.nodes[0])) continue
-
-        // Unwrap the selector from inside `&:is(…)`
-        target = target.nodes[0]
-      }
-
-      // Expecting a pseudo selector (or function)
-      if (
-        (target.kind === 'function' && target.value[0] === ':') ||
-        (target.kind === 'selector' && target.value[0] === ':')
-      ) {
-        let targetNode = target
-        let compoundNot = false
-        if (targetNode.kind === 'function' && targetNode.value === ':not') {
-          compoundNot = true
-          if (targetNode.nodes.length !== 1) continue
-          if (targetNode.nodes[0].kind !== 'selector' && targetNode.nodes[0].kind !== 'function') {
-            continue
-          }
-          if (targetNode.nodes[0].value[0] !== ':') continue
-
-          targetNode = targetNode.nodes[0]
-        }
-
-        let newVariant = ((value) => {
-          if (
-            value === ':nth-child' &&
-            targetNode.kind === 'function' &&
-            targetNode.nodes.length === 1 &&
-            targetNode.nodes[0].kind === 'value' &&
-            targetNode.nodes[0].value === 'odd'
-          ) {
-            if (compoundNot) {
-              compoundNot = false
-              return 'even'
-            }
-            return 'odd'
-          }
-
-          if (
-            value === ':nth-child' &&
-            targetNode.kind === 'function' &&
-            targetNode.nodes.length === 1 &&
-            targetNode.nodes[0].kind === 'value' &&
-            targetNode.nodes[0].value === 'even'
-          ) {
-            if (compoundNot) {
-              compoundNot = false
-              return 'odd'
-            }
-            return 'even'
-          }
-
-          for (let [selector, variantName] of [
-            [':nth-child', 'nth'],
-            [':nth-last-child', 'nth-last'],
-            [':nth-of-type', 'nth-of-type'],
-            [':nth-last-of-type', 'nth-of-last-type'],
-          ]) {
-            if (
-              value === selector &&
-              targetNode.kind === 'function' &&
-              targetNode.nodes.length === 1
-            ) {
-              if (
-                targetNode.nodes.length === 1 &&
-                targetNode.nodes[0].kind === 'value' &&
-                isPositiveInteger(targetNode.nodes[0].value)
-              ) {
-                return `${variantName}-${targetNode.nodes[0].value}`
-              }
-
-              return `${variantName}-[${SelectorParser.toCss(targetNode.nodes, true)}]`
-            }
-          }
-
-          // Hoist `not` modifier
-          if (compoundNot) {
-            let targetSignature = signatures.get(designSystem.printVariant(variant))
-            let replacementSignature = signatures.get(`not-[${value}]`)
-            if (targetSignature === replacementSignature) {
-              return `[&${value}]`
-            }
-          }
-
-          return null
-        })(targetNode.value)
-
-        if (newVariant === null) {
-          if (prefixedVariant) {
-            replaceObject(variant, {
-              kind: 'arbitrary',
-              selector: target.value,
-              relative: false,
-            } satisfies Variant)
-
-            return [prefixedVariant, variant]
-          }
-
-          continue
-        }
-
-        // Add `not-` prefix
-        if (compoundNot) newVariant = `not-${newVariant}`
-
-        let parsed = designSystem.parseVariant(newVariant)
-        if (parsed === null) continue
-
-        // Update original variant
-        replaceObject(variant, parsed)
-      }
-
-      // Expecting an attribute selector
-      else if (target.kind === 'selector' && isAttributeSelector(target)) {
-        let attributeSelector = AttributeSelectorParser.parse(target.value)
-        if (attributeSelector === null) continue // Invalid attribute selector
-
-        // Migrate `data-*`
-        if (attributeSelector.attribute.startsWith('data-')) {
-          let name = attributeSelector.attribute.slice(5) // Remove `data-`
-
-          replaceObject(variant, {
-            kind: 'functional',
-            root: 'data',
-            modifier: null,
-            value:
-              attributeSelector.value === null
-                ? { kind: 'named', value: name }
-                : {
-                    kind: 'arbitrary',
-                    value: `${name}${attributeSelector.operator}${attributeSelector.quote ?? ''}${attributeSelector.value}${attributeSelector.quote ?? ''}${attributeSelector.sensitivity ? ` ${attributeSelector.sensitivity}` : ''}`,
-                  },
-          } satisfies Variant)
-        }
-
-        // Migrate `aria-*`
-        else if (attributeSelector.attribute.startsWith('aria-')) {
-          let name = attributeSelector.attribute.slice(5) // Remove `aria-`
-          replaceObject(variant, {
-            kind: 'functional',
-            root: 'aria',
-            modifier: null,
-            value:
-              attributeSelector.value === null
-                ? { kind: 'arbitrary', value: name } // aria-[foo]
-                : attributeSelector.operator === '=' &&
-                    attributeSelector.value === 'true' &&
-                    attributeSelector.sensitivity === null
-                  ? { kind: 'named', value: name } // aria-[foo="true"] or aria-[foo='true'] or aria-[foo=true]
-                  : {
-                      kind: 'arbitrary',
-                      value: `${attributeSelector.attribute}${attributeSelector.operator}${attributeSelector.quote ?? ''}${attributeSelector.value}${attributeSelector.quote ?? ''}${attributeSelector.sensitivity ? ` ${attributeSelector.sensitivity}` : ''}`,
-                    }, // aria-[foo~="true"], aria-[foo|="true"], …
-          } satisfies Variant)
-        }
-
-        // Arbitrary attributes
-        else {
-          replaceObject(variant, {
-            kind: 'arbitrary',
-            selector: target.value,
-            relative: false,
-          } satisfies Variant)
-        }
-      }
-
-      if (prefixedVariant) {
-        return [prefixedVariant, variant]
-      }
-    }
-  }
-
-  return result
-}
-
-// ---
-
-function optimizeArbitraryValueExpressions(
-  candidate: Candidate,
-  options: InternalCanonicalizeOptions,
-): Candidate {
-  if (candidate.kind !== 'functional' || candidate.value?.kind !== 'arbitrary') {
-    return candidate
-  }
-
-  let designSystem = options.designSystem
-  let hasSameSignature = designSystem.storage[COMPARE_CANDIDATES_KEY].get(options.signatureOptions)
-
-  let valueAst = ValueParser.parse(candidate.value.value)
-
-  // Start by constant folding the value expression, when dealing with `calc(…)`
-  if (valueAst.length === 1 && valueAst[0].kind === 'function' && valueAst[0].value === 'calc') {
-    let [folded, foldedValueAst] = constantFoldDeclarationAst(valueAst, null, false)
-    if (folded) {
-      let replacement = cloneCandidate(candidate)
-      replacement.value!.value = ValueParser.toCss(foldedValueAst)
-
-      if (hasSameSignature(candidate, replacement)) {
-        candidate = replacement
-        valueAst = foldedValueAst
-      }
-    }
-  }
-
-  // Move `-` sign into the arbitrary value itself
-  if (candidate.root[0] === '-') {
-    // We're dealing with a `var(…)`, keep as-is
-    if (valueAst.length === 1 && valueAst[0].kind === 'function' && valueAst[0].value === 'var') {
-      return candidate
-    }
-
-    // Move `* -1` inside, and try to constant fold to see if it's even worth
-    // updating the candidate or not.
-    let expressionAst = ValueParser.parse(`calc(${candidate.value!.value} * -1)`)
-    let [folded, foldedExpressionAst] = constantFoldDeclarationAst(expressionAst, null, false)
-    if (folded) {
-      let replacement = cloneCandidate(candidate)
-
-      replacement.root = replacement.root.slice(1) // Drop the leading `-`
-      replacement.value!.value = ValueParser.toCss(foldedExpressionAst)
-
-      if (hasSameSignature(candidate, replacement)) {
-        candidate = replacement
-        valueAst = foldedExpressionAst
-      }
-    }
-  }
-
-  // Move `-` sign out of the arbitrary value
-  if (valueAst.length === 1 && valueAst[0].kind === 'function' && valueAst[0].value === 'calc') {
-    let calcArgs = valueAst[0].nodes
-
-    // `calc(arg * -1)` or `calc(-1  * arg)`
-    if (
-      calcArgs.length === 5 &&
-      calcArgs[1].kind === 'separator' &&
-      calcArgs[1].value === ' ' &&
-      calcArgs[2].kind === 'word' &&
-      calcArgs[2].value === '*' &&
-      calcArgs[3].kind === 'separator' &&
-      calcArgs[3].value === ' '
-    ) {
-      let arg =
-        calcArgs[4].kind === 'word' && calcArgs[4].value === '-1'
-          ? calcArgs[0]
-          : calcArgs[0].kind === 'word' && calcArgs[0].value === '-1'
-            ? calcArgs[4]
-            : null
-
-      if (arg) {
-        let replacement = cloneCandidate(candidate)
-        replacement.root = `-${candidate.root}`
-        replacement.value!.value = ValueParser.toCss([arg])
-
-        if (hasSameSignature(candidate, replacement)) {
-          candidate = replacement
-        }
-      }
-    }
-  }
-
-  return candidate
-}
-
-// ----
-
-// Optimize the modifier
-//
-// E.g.:
-//
-// - `/[25%]`   → `/25`
-// - `/[100%]`  → `/100`    → <empty>
-// - `/100`     → <empty>
-//
-function optimizeModifier(candidate: Candidate, options: InternalCanonicalizeOptions): Candidate {
-  // We are only interested in functional or arbitrary utilities with a modifier
-  if (
-    (candidate.kind !== 'functional' && candidate.kind !== 'arbitrary') ||
-    candidate.modifier === null
-  ) {
-    return candidate
-  }
-
-  let designSystem = options.designSystem
-  let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options.signatureOptions)
-
-  let targetSignature = signatures.get(designSystem.printCandidate(candidate))
-  let modifier = candidate.modifier
-
-  // 1. Try to drop the modifier entirely
-  if (
-    targetSignature ===
-    signatures.get(designSystem.printCandidate({ ...candidate, modifier: null }))
-  ) {
-    candidate.modifier = null
-    return candidate
-  }
-
-  // 2. Try to remove the square brackets and the `%` sign
-  {
-    let newModifier: NamedUtilityValue = {
-      kind: 'named',
-      value: modifier.value.endsWith('%')
-        ? modifier.value.includes('.')
-          ? `${Number(modifier.value.slice(0, -1))}`
-          : modifier.value.slice(0, -1)
-        : modifier.value,
-      fraction: null,
-    }
-
-    if (
-      targetSignature ===
-      signatures.get(designSystem.printCandidate({ ...candidate, modifier: newModifier }))
-    ) {
-      candidate.modifier = newModifier
-      return candidate
-    }
-  }
-
-  // 3. Try to remove the square brackets, but multiply by 100. E.g.: `[0.16]` -> `16`
-  {
-    let newModifier: NamedUtilityValue = {
-      kind: 'named',
-      value: `${parseFloat(modifier.value) * 100}`,
-      fraction: null,
-    }
-
-    if (
-      targetSignature ===
-      signatures.get(designSystem.printCandidate({ ...candidate, modifier: newModifier }))
-    ) {
-      candidate.modifier = newModifier
-      return candidate
-    }
-  }
-
-  return candidate
-}
-
-export enum SignatureFeatures {
-  None = 0,
-  ExpandProperties = 1 << 0,
-  LogicalToPhysical = 1 << 1,
-}
-
-interface SignatureOptions {
-  /**
-   * The root font size in pixels. If provided, `rem` values will be normalized
-   * to `px` values.
-   *
-   * E.g.: `mt-[16px]` with `rem: 16` will become `mt-4` (assuming `--spacing: 0.25rem`).
-   */
-  rem: number | null
-
-  /**
-   * Features that influence how signatures are computed.
-   */
-  features: SignatureFeatures
-}
-
-// Given a utility, compute a signature that represents the utility. The
-// signature will be a normalised form of the generated CSS for the utility, or
-// a unique symbol if the utility is not valid. The class in the selector will
-// be replaced with the `.x` selector.
-//
-// This function should only be passed the base utility so `flex`, `hover:flex`
-// and `focus:flex` will all use just `flex`. Variants are handled separately.
-//
-// E.g.:
-//
-// | UTILITY          | GENERATED SIGNATURE     |
-// | ---------------- | ----------------------- |
-// | `[display:flex]` | `.x { display: flex; }` |
-// | `flex`           | `.x { display: flex; }` |
-//
-// These produce the same signature, therefore they represent the same utility.
-export const UTILITY_SIGNATURE_KEY = Symbol()
-function createUtilitySignatureCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof UTILITY_SIGNATURE_KEY] {
-  return new DefaultMap((options: SignatureOptions) => {
-    return new DefaultMap<string, string | symbol>((utility) => {
-      try {
-        // Ensure the prefix is added to the utility if it is not already present.
-        utility =
-          designSystem.theme.prefix && !utility.startsWith(designSystem.theme.prefix)
-            ? `${designSystem.theme.prefix}:${utility}`
-            : utility
-
-        // Use `@apply` to normalize the selector to `.x`
-        let ast: AstNode[] = [styleRule('.x', [atRule('@apply', utility)])]
-
-        temporarilyDisableThemeInline(designSystem, () => {
-          // There's separate utility caches for respect important vs not
-          // so we want to compile them both with `@theme inline` disabled
-          for (let candidate of designSystem.parseCandidate(utility)) {
-            designSystem.compileAstNodes(candidate, CompileAstFlags.RespectImportant)
-          }
-
-          substituteAtApply(ast, designSystem)
-        })
-
-        // Optimize the AST. This is needed such that any internal intermediate
-        // nodes are gone. This will also cleanup declaration nodes with undefined
-        // values or `--tw-sort` declarations.
-        canonicalizeAst(designSystem, ast, options)
-
-        // Compute the final signature, by generating the CSS for the utility
-        let signature = toCss(ast)
-        return signature
-      } catch {
-        // A unique symbol is returned to ensure that 2 signatures resulting in
-        // `null` are not considered equal.
-        return Symbol()
-      }
-    })
-  })
-}
-
-// #RGB
-// #RGBA
-// #RRGGBB
-// #RRGGBBAA
-const HEX_REGEX = /#(?:[a-f0-9]{8}|[a-f0-9]{6}|[a-f0-9]{4}|[a-f0-9]{3})/gi
-
-// Optimize the CSS AST to make it suitable for signature comparison. We want to
-// expand declarations, ignore comments, sort declarations etc...
-function canonicalizeAst(designSystem: DesignSystem, ast: AstNode[], options: SignatureOptions) {
-  let { rem } = options
-
-  walk(ast, {
-    enter(node, ctx) {
-      // Optimize declarations
-      if (node.kind === 'declaration') {
-        if (node.value === undefined || node.property === '--tw-sort') {
-          return WalkAction.Replace([])
-        }
-
-        // Ignore `--tw-{property}` if `{property}` exists with the same value
-        if (node.property.startsWith('--tw-')) {
-          if (
-            ctx.siblings.some(
-              (sibling) =>
-                sibling.kind === 'declaration' &&
-                node.value === sibling.value &&
-                node.important === sibling.important &&
-                !sibling.property.startsWith('--tw-'),
-            )
-          ) {
-            return WalkAction.Replace([])
-          }
-        }
-
-        if (options.features & SignatureFeatures.ExpandProperties) {
-          let replacement = expandDeclaration(node, options.features)
-          if (replacement) return WalkAction.Replace(replacement)
-        }
-
-        // Resolve theme values to their inlined value.
-        if (node.value.includes('var(')) {
-          node.value = resolveVariablesInValue(node.value, designSystem)
-        }
-
-        let valueAst = ValueParser.parse(node.value)
-
-        // Very basic `calc(…)` constant folding to handle the spacing scale
-        // multiplier:
-        //
-        // Input:  `--spacing(4)`
-        //       → `calc(var(--spacing, 0.25rem) * 4)`
-        //       → `calc(0.25rem * 4)`       ← this is the case we will see
-        //                                     after inlining the variable
-        //       → `1rem`
-        let [folded, foldedValueAst] = constantFoldDeclarationAst(valueAst, rem)
-
-        // Normalize `calc(…)` expressions such that arguments that are
-        // associatively equivalent are rendered in the same way.
-        //
-        // `calc(var(--foo) * -1)` === `calc(-1 * var(--foo))`
-        let [normalized, canonicalizedValueAst] = canonicalizeCalcExpressionsAst(foldedValueAst)
-
-        if (folded || normalized) {
-          node.value = ValueParser.toCss(canonicalizedValueAst)
-        }
-
-        // We will normalize the `node.value`, this is the same kind of logic
-        // we use when printing arbitrary values. It will remove unnecessary
-        // whitespace.
-        //
-        // Essentially normalizing the `node.value` to a canonical form.
-        node.value = printArbitraryValue(node.value)
-      }
-
-      // Replace special nodes with its children
-      else if (node.kind === 'context' || node.kind === 'at-root') {
-        return WalkAction.Replace(node.nodes)
-      }
-
-      // Remove comments
-      else if (node.kind === 'comment') {
-        return WalkAction.Replace([])
-      }
-
-      // Remove at-rules that are not needed for the signature
-      else if (node.kind === 'at-rule' && node.name === '@property') {
-        return WalkAction.Replace([])
-      }
-    },
-    exit(node) {
-      if (node.kind === 'rule' || node.kind === 'at-rule') {
-        // Remove declarations that are re-defined again later.
-        //
-        // This could maybe result in unwanted behavior (because similar
-        // properties typically exist for backwards compatibility), but for
-        // signature purposes we can assume that the last declaration wins.
-        if (node.nodes.length > 1) {
-          let seen = new Set<string>()
-          for (let i = node.nodes.length - 1; i >= 0; i--) {
-            let child = node.nodes[i]
-            if (child.kind !== 'declaration') continue
-            if (child.value === undefined) continue
-
-            if (seen.has(child.property)) {
-              node.nodes.splice(i, 1)
-            }
-            seen.add(child.property)
-          }
-        }
-
-        // Sort declarations alphabetically by property name
-        node.nodes.sort((a, b) => {
-          if (a.kind !== 'declaration') return 0
-          if (b.kind !== 'declaration') return 0
-          return a.property.localeCompare(b.property)
-        })
-      }
-
-      //
-      else if (node.kind === 'declaration' && node.value) {
-        // Leave CSS variables alone
-        if (node.property[0] === '-' && node.property[1] === '-') return
-
-        // Ensure hex colors are always lowercased
-        {
-          HEX_REGEX.lastIndex = 0
-          node.value = node.value.replace(HEX_REGEX, (color) => color.toLowerCase())
-        }
-      }
-    },
-  })
-
-  return ast
-}
-
-// Variables whose theme value is a CSS-wide keyword (e.g.: `unset`) are never
-// inlined. These are typically registered as a placeholder to be re-assigned at
-// runtime, so two variables that share such a value are not interchangeable.
-//
-// E.g.:
-//
-// ```css
-// @theme {
-//   --foreground: unset;
-//   --background: unset;
-// }
-// ```
-//
-// Inlining would make `text-(--foreground)` and `text-(--background)` produce
-// the same signature `color: unset`, even though they are different at runtime.
-//
-// https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/Data_types#css-wide_keywords
-const CSS_WIDE_KEYWORDS = ['initial', 'inherit', 'revert', 'revert-layer', 'revert-rule', 'unset']
-
-// Resolve theme values to their inlined value.
-//
-// E.g.:
-//
-// `[color:var(--color-red-500)]` → `[color:oklch(63.7%_0.237_25.331)]`
-// `[color:oklch(63.7%_0.237_25.331)]` → `[color:oklch(63.7%_0.237_25.331)]`
-//
-// Due to the `@apply` from above, this will become:
-//
-// ```css
-// .example {
-//   color: oklch(63.7% 0.237 25.331);
-// }
-// ```
-//
-// Which conveniently will be equivalent to: `text-red-500` when we inline the
-// value.
-//
-// Without inlining:
-// ```css
-// .example {
-//   color: var(--color-red-500, oklch(63.7% 0.237 25.331));
-// }
-// ```
-//
-// Inlined:
-// ```css
-// .example {
-//   color: oklch(63.7% 0.237 25.331);
-// }
-// ```
-//
-// Recently we made sure that utilities like `text-red-500` also generate the
-// fallback value for usage in `@reference` mode.
-//
-// The second assumption is that if you use `var(--key, fallback)` that happens
-// to match a known variable _and_ its inlined value. Then we can replace it
-// with the inlined variable. This allows us to handle custom `@theme` and
-// `@theme inline` definitions.
-function resolveVariablesInValue(value: string, designSystem: DesignSystem): string {
-  let changed = false
-  let valueAst = ValueParser.parse(value)
-
-  let seen = new Set<string>()
-  walk(valueAst, (valueNode) => {
-    if (valueNode.kind !== 'function') return
-    if (valueNode.value !== 'var') return
-
-    // Resolve the underlying value of the variable
-    if (valueNode.nodes.length !== 1 && valueNode.nodes.length < 3) {
-      return
-    }
-
-    let variable = valueNode.nodes[0].value
-
-    // Drop the prefix from the variable name if it is present. The
-    // internal variable doesn't have the prefix.
-    if (designSystem.theme.prefix && variable.startsWith(`--${designSystem.theme.prefix}-`)) {
-      variable = variable.slice(`--${designSystem.theme.prefix}-`.length)
-    }
-    let variableValue = designSystem.resolveThemeValue(variable)
-    // Prevent infinite recursion when the variable value contains the
-    // variable itself.
-    if (seen.has(variable)) return
-    seen.add(variable)
-    if (variableValue === undefined) return // Couldn't resolve the variable
-
-    // CSS-wide keywords are never inlined
-    if (CSS_WIDE_KEYWORDS.includes(variableValue.toLowerCase())) return
-
-    // Inject variable fallbacks when no fallback is present yet.
-    //
-    // A fallback could consist of multiple values.
-    //
-    // E.g.:
-    //
-    // ```
-    // var(--font-sans, ui-sans-serif, system-ui, sans-serif, …)
-    // ```
-    {
-      // More than 1 argument means that a fallback is already present
-      if (valueNode.nodes.length === 1) {
-        // Inject the fallback value into the variable lookup
-        changed = true
-        valueNode.nodes.push(...ValueParser.parse(`,${variableValue}`))
-      }
-    }
-
-    // Replace known variable + inlined fallback value with the value
-    // itself again
-    {
-      // We need at least 3 arguments. The variable, the separator and a fallback value.
-      if (valueNode.nodes.length >= 3) {
-        let nodeAsString = ValueParser.toCss(valueNode.nodes) // This could include more than just the variable
-        let constructedValue = `${valueNode.nodes[0].value},${variableValue}`
-        if (nodeAsString === constructedValue) {
-          changed = true
-          return WalkAction.Replace(ValueParser.parse(variableValue))
-        }
-      }
-    }
-  })
-
-  // Replace the value with the new value
-  if (changed) return ValueParser.toCss(valueAst)
-  return value
-}
-
-// Index all static utilities by property and value
-const STATIC_UTILITIES_KEY = Symbol()
-function createStaticUtilitiesCache(): DesignSystem['storage'][typeof STATIC_UTILITIES_KEY] {
-  return new DefaultMap((_optiones: SignatureOptions) => {
-    return new DefaultMap((_property: string) => {
-      return new DefaultMap((_value: string) => {
-        return new Set<string>()
-      })
-    })
-  })
-}
-
-const UTILITY_PROPERTIES_KEY = Symbol()
-function createUtilityPropertiesCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof UTILITY_PROPERTIES_KEY] {
-  return new DefaultMap((options: SignatureOptions) => {
-    return new DefaultMap((className) => {
-      let localPropertyValueLookup = new DefaultMap((_property) => new Set<string>())
-
-      if (designSystem.theme.prefix && !className.startsWith(designSystem.theme.prefix)) {
-        className = `${designSystem.theme.prefix}:${className}`
-      }
-      let parsed = designSystem.parseCandidate(className)
-      if (parsed.length === 0) return localPropertyValueLookup
-
-      try {
-        let ast = designSystem.compileAstNodes(parsed[0]).map((x) => cloneAstNode(x.node))
-        walk(canonicalizeAst(designSystem, ast, options), (node) => {
-          if (node.kind === 'declaration') {
-            localPropertyValueLookup.get(node.property).add(node.value!)
-            designSystem.storage[STATIC_UTILITIES_KEY].get(options)
-              .get(node.property)
-              .get(node.value!)
-              .add(className)
-          }
-        })
-      } catch {
-        // Ignore errors, this could happen when we call a plugin with a value
-        // it didn't expect. But since plugins are functions, we can't know
-        // ahead of time what it expects.
-      }
-
-      return localPropertyValueLookup
-    })
-  })
-}
-
-// For all static utilities in the system, compute a lookup table that maps the
-// utility signature to the utility name. This is used to find the utility name
-// for a given utility signature.
-//
-// For all functional utilities, we can compute static-like utilities by
-// essentially pre-computing the values and modifiers. This is a bit slow, but
-// also only has to happen once per design system.
-const PRE_COMPUTED_UTILITIES_KEY = Symbol()
-function createPreComputedUtilitiesCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof PRE_COMPUTED_UTILITIES_KEY] {
-  return new DefaultMap((options: SignatureOptions) => {
-    let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options)
-    let lookup = new DefaultMap<string, string[]>(() => [])
-
-    // Right now all plugins are implemented using functions so they are a black
-    // box. Let's use the `getClassList` and consider every known suggestion as a
-    // static utility for now.
-    for (let [className, meta] of designSystem.getClassList()) {
-      let signature = signatures.get(className)
-      if (typeof signature !== 'string') continue
-
-      // Skip the utility if `-{utility}-0` has the same signature as
-      // `{utility}-0` (its positive version). This will prefer positive values
-      // over negative values.
-      if (className[0] === '-' && className.endsWith('-0')) {
-        let positiveSignature = signatures.get(className.slice(1))
-        if (typeof positiveSignature === 'string' && signature === positiveSignature) {
-          continue
-        }
-      }
-
-      lookup.get(signature).push(className)
-      designSystem.storage[UTILITY_PROPERTIES_KEY].get(options).get(className)
-
-      for (let modifier of meta.modifiers) {
-        // Modifiers representing numbers can be computed and don't need to be
-        // pre-computed. Doing the math and at the time of writing this, this
-        // would save you 250k additionally pre-computed utilities...
-        if (isValidSpacingMultiplier(modifier)) {
-          continue
-        }
-
-        let classNameWithModifier = `${className}/${modifier}`
-        let signature = signatures.get(classNameWithModifier)
-        if (typeof signature !== 'string') continue
-        lookup.get(signature).push(classNameWithModifier)
-        designSystem.storage[UTILITY_PROPERTIES_KEY].get(options).get(classNameWithModifier)
-      }
-    }
-
-    return lookup
-  })
-}
-
-// Given a variant, compute a signature that represents the variant. The
-// signature will be a normalised form of the generated CSS for the variant, or
-// a unique symbol if the variant is not valid. The class in the selector will
-// be replaced with `.x`.
-//
-// E.g.:
-//
-// | VARIANT          | GENERATED SIGNATURE           |
-// | ---------------- | ----------------------------- |
-// | `[&:focus]:flex` | `.x:focus { display: flex; }` |
-// | `focus:flex`     | `.x:focus { display: flex; }` |
-//
-// These produce the same signature, therefore they represent the same variant.
-export const VARIANT_SIGNATURE_KEY = Symbol()
-function createVariantSignatureCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof VARIANT_SIGNATURE_KEY] {
-  return new DefaultMap((rem: number | null) => {
-    return new DefaultMap<string, string | symbol>((variant) => {
-      try {
-        // Ensure the prefix is added to the utility if it is not already present.
-        variant =
-          designSystem.theme.prefix && !variant.startsWith(designSystem.theme.prefix)
-            ? `${designSystem.theme.prefix}:${variant}`
-            : variant
-
-        // Use `@apply` to normalize the selector to `.x`
-        let ast: AstNode[] = [styleRule('.x', [atRule('@apply', `${variant}:flex`)])]
-        substituteAtApply(ast, designSystem)
-
-        // Canonicalize selectors to their minimal form
-        walk(ast, (node) => {
-          // At-rules
-          if (node.kind === 'at-rule') {
-            // Normalize dimensions such that equivalent values in different
-            // units are considered the same. E.g.: with a root font size of
-            // `16px`, `@media (width >= 64rem)` and `@media (width >= 1024px)`
-            // are equivalent.
-            node.params = constantFoldDeclaration(node.params, rem)
-
-            if (node.params.includes(' ')) {
-              node.params = node.params.replaceAll(' ', '')
-            }
-          }
-
-          // Style rules
-          else if (node.kind === 'rule') {
-            let selectorAst = SelectorParser.parse(node.selector)
-            let changed = false
-            walk(selectorAst, (node) => {
-              // Assumption: when we have a list of selectors: `.foo, .bar` we
-              // want to mark this as changed because this will be re-printed as
-              // `.foo,.bar`.
-              //
-              // Similarly, when we receive a combinator like `.foo + .bar`, this
-              // will be printed as `.foo+.bar`.
-              //
-              // It could be that this was already optimal, but then this would be
-              // a no-op situation.
-              if (node.kind === 'list' || node.kind === 'combinator') {
-                changed = true
-              }
-
-              // Remove unnecessary `:is(…)` selectors
-              else if (node.kind === 'function' && node.value === ':is') {
-                // A single selector inside of `:is(…)` can be replaced with the
-                // selector itself.
-                //
-                // E.g.: `:is(.foo)` → `.foo`
-                if (node.nodes.length === 1) {
-                  changed = true
-                  return WalkAction.Replace(node.nodes)
-                }
-
-                // A selector with the universal selector `*` followed by a pseudo
-                // class, can be replaced with the pseudo class itself.
-                else if (
-                  node.nodes.length === 2 &&
-                  node.nodes[0].kind === 'selector' &&
-                  node.nodes[0].value === '*' &&
-                  node.nodes[1].kind === 'selector' &&
-                  node.nodes[1].value[0] === ':'
-                ) {
-                  changed = true
-                  return WalkAction.Replace(node.nodes[1])
-                }
-              }
-
-              // Ensure `*` exists before pseudo selectors inside of `:not(…)`,
-              // `:where(…)`, …
-              //
-              // E.g.:
-              //
-              // `:not(:first-child)` → `:not(*:first-child)`
-              //
-              else if (
-                node.kind === 'function' &&
-                node.value[0] === ':' &&
-                node.nodes[0]?.kind === 'selector' &&
-                node.nodes[0]?.value[0] === ':'
-              ) {
-                changed = true
-                node.nodes.unshift({ kind: 'selector', value: '*' })
-              }
-            })
-
-            if (changed) {
-              node.selector = SelectorParser.toCss(selectorAst, true)
-            }
-          }
-        })
-
-        // Compute the final signature, by generating the CSS for the variant
-        let signature = toCss(ast)
-        return signature
-      } catch {
-        // A unique symbol is returned to ensure that 2 signatures resulting in
-        // `null` are not considered equal.
-        return Symbol()
-      }
-    })
-  })
-}
-
-export const PRE_COMPUTED_VARIANTS_KEY = Symbol()
-function createPreComputedVariantsCache(
-  designSystem: DesignSystem,
-): DesignSystem['storage'][typeof PRE_COMPUTED_VARIANTS_KEY] {
-  return new DefaultMap((rem: number | null) => {
-    let signatures = designSystem.storage[VARIANT_SIGNATURE_KEY].get(rem)
-    let lookup = new DefaultMap<string, string[]>(() => [])
-
-    for (let [root, variant] of designSystem.variants.entries()) {
-      // Actual static variants
-      if (variant.kind === 'static') {
-        let signature = signatures.get(root)
-        if (typeof signature !== 'string') continue
-        lookup.get(signature).push(root)
-      }
-
-      // Functional variants with known values, e.g.: `max-lg`, `@min-md`, …
-      else if (variant.kind === 'functional') {
-        for (let value of designSystem.variants.getCompletions(root)) {
-          let name = root === '@' ? `@${value}` : `${root}-${value}`
-          let signature = signatures.get(name)
-          if (typeof signature !== 'string') continue
-          lookup.get(signature).push(name)
-        }
-      }
-    }
-
-    return lookup
-  })
-}
-
-function temporarilyDisableThemeInline<T>(designSystem: DesignSystem, cb: () => T): T {
-  // Turn off `@theme inline` feature such that `@theme` and `@theme inline` are
-  // considered the same. The biggest motivation for this is referencing
-  // variables in another namespace that happen to contain the same value as the
-  // utility's own namespaces it is reading from.
-  //
-  // E.g.:
-  //
-  // The `max-w-*` utility doesn't read from the `--breakpoint-*` namespace.
-  // But it does read from the `--container-*` namespace. It also happens to
-  // be the case that `--breakpoint-md` and `--container-3xl` are the exact
-  // same value.
-  //
-  // If you then use the `max-w-(--breakpoint-md)` utility, inlining the
-  // variable would mean:
-  //  - `max-w-(--breakpoint-md)` → `max-width: 48rem;` → `max-w-3xl`
-  //  - `max-w-(--contianer-3xl)` → `max-width: 48rem;` → `max-w-3xl`
-  //
-  // Not inlining the variable would mean:
-  // - `max-w-(--breakpoint-md)` → `max-width: var(--breakpoint-md);` → `max-w-(--breakpoint-md)`
-  // - `max-w-(--container-3xl)` → `max-width: var(--container-3xl);` → `max-w-3xl`
-
-  // @ts-expect-error We are monkey-patching a method that's considered private
-  // in TypeScript
-  let originalGet = designSystem.theme.values.get
-
-  // Track all values with the inline option set, so we can restore them later.
-  let restorableInlineOptions = new Set<{ options: ThemeOptions }>()
-
-  // @ts-expect-error We are monkey-patching a method that's considered private
-  // in TypeScript
-  designSystem.theme.values.get = (key: string) => {
-    // @ts-expect-error We are monkey-patching a method that's considered private
-    // in TypeScript
-    let value = originalGet.call(designSystem.theme.values, key)
-    if (value === undefined) return value
-
-    // Remove `inline` if it was set
-    if (value.options & ThemeOptions.INLINE) {
-      restorableInlineOptions.add(value)
-      value.options &= ~ThemeOptions.INLINE
-    }
-
-    return value
-  }
-
-  try {
-    // Run the callback with the `@theme inline` feature disabled
-    return cb()
-  } finally {
-    // Restore the `@theme inline` to the original value
-    // @ts-expect-error We are monkey-patching a method that's private
-    designSystem.theme.values.get = originalGet
-
-    // Re-add the `inline` option, in case future lookups are done
-    for (let value of restorableInlineOptions) {
-      value.options |= ThemeOptions.INLINE
-    }
-  }
-}
-
-// Generator that generates all combinations of the given set. Using a generator
-// so we can stop early when we found a suitable combination.
-//
-// NOTE:
-//
-// 1. Yield biggest combinations first
-// 2. Sets of size 1 and 0 are not yielded
-function* combinations<T>(arr: T[]): Generator<T[]> {
-  let n = arr.length
-  let limit = 1n << BigInt(n)
-
-  for (let k = n; k >= 2; k--) {
-    let mask = (1n << BigInt(k)) - 1n
-
-    while (mask < limit) {
-      let out = []
-      for (let i = 0; i < n; i++) {
-        if ((mask >> BigInt(i)) & 1n) {
-          out.push(arr[i])
-        }
-      }
-      yield out
-
-      // Gosper's hack:
-      // - https://programmingforinsomniacs.blogspot.com/2018/03/gospers-hack-explained.html
-      // - https://rosettacode.org/wiki/Gosper%27s_hack
-      //
-      // We need to generate the next mask in lexicographical order.
-      let carry = mask & -mask
-      let ripple = mask + carry
-      mask = (((ripple ^ mask) >> 2n) / carry) | ripple
-    }
-  }
-}
-
-function intersection<T>(a: Set<T>, b: Set<T>): Set<T> {
-  // @ts-expect-error Set.prototype.intersection is only available in Node.js v22+
-  if (typeof a.intersection === 'function') return a.intersection(b)
-
-  // Polyfill for environments that do not support Set.prototype.intersection yet
-  if (a.size === 0 || b.size === 0) return new Set<T>()
-
-  let result = new Set<T>(a)
-  for (let item of b) {
-    if (!result.has(item)) {
-      result.delete(item)
-    }
-  }
-
-  return result
-}
diff --git a/packages/tailwindcss/src/cartesian.ts b/packages/tailwindcss/src/cartesian.ts
deleted file mode 100644
index f0f7bbba4..000000000
--- a/packages/tailwindcss/src/cartesian.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-type CartesianInput = readonly unknown[][]
-
-type CartesianResult<T extends CartesianInput> = T extends [
-  infer Head extends unknown[],
-  ...infer Tail extends CartesianInput,
-]
-  ? [Head[number], ...CartesianResult<Tail>]
-  : []
-
-export function* cartesian<T extends CartesianInput>(...sets: T): Generator<CartesianResult<T>> {
-  let n = sets.length
-  if (n === 0) return
-
-  // If any input set is empty, the Cartesian product is empty.
-  if (sets.some((set) => set.length === 0)) {
-    return
-  }
-
-  // Index lookup
-  let idx = Array(n).fill(0)
-
-  while (true) {
-    // Compute current combination
-    let result = [] as CartesianResult<T>
-    for (let i = 0; i < n; i++) {
-      result[i] = sets[i][idx[i]]
-    }
-    yield result
-
-    // Update index vector
-    let k = n - 1
-    while (k >= 0) {
-      idx[k]++
-      if (idx[k] < sets[k].length) {
-        break
-      }
-      idx[k] = 0
-      k--
-    }
-
-    if (k < 0) {
-      return
-    }
-  }
-}
diff --git a/packages/tailwindcss/src/compat/apply-compat-hooks.ts b/packages/tailwindcss/src/compat/apply-compat-hooks.ts
index 036b9d88e..fe30f6270 100644
--- a/packages/tailwindcss/src/compat/apply-compat-hooks.ts
+++ b/packages/tailwindcss/src/compat/apply-compat-hooks.ts
@@ -1,9 +1,7 @@
 import { Features } from '..'
-import { cssContext, styleRule, toCss, type AstNode } from '../ast'
+import { styleRule, toCss, walk, WalkAction, type AstNode } from '../ast'
 import type { DesignSystem } from '../design-system'
-import type { SourceLocation } from '../source-maps/source'
 import { segment } from '../utils/segment'
-import { walk, WalkAction } from '../walk'
 import { applyConfigToTheme } from './apply-config-to-theme'
 import { applyKeyframesToTheme } from './apply-keyframes-to-theme'
 import { createCompatConfig } from './config/create-compat-config'
@@ -23,7 +21,7 @@ export async function applyCompatibilityHooks({
   base,
   ast,
   loadModule,
-  sources,
+  globs,
 }: {
   designSystem: DesignSystem
   base: string
@@ -32,32 +30,20 @@ export async function applyCompatibilityHooks({
     path: string,
     base: string,
     resourceHint: 'plugin' | 'config',
-  ) => Promise<{
-    path: string
-    base: string
-    module: any
-  }>
-  sources: { base: string; pattern: string; negated: boolean }[]
+  ) => Promise<{ module: any; base: string }>
+  globs: { origin?: string; pattern: string }[]
 }) {
   let features = Features.None
-  let pluginPaths: [
-    { id: string; base: string; reference: boolean; src: SourceLocation | undefined },
-    CssPluginOptions | null,
-  ][] = []
-  let configPaths: {
-    id: string
-    base: string
-    reference: boolean
-    src: SourceLocation | undefined
-  }[] = []
+  let pluginPaths: [{ id: string; base: string; reference: boolean }, CssPluginOptions | null][] =
+    []
+  let configPaths: { id: string; base: string; reference: boolean }[] = []
 
-  walk(ast, (node, _ctx) => {
+  walk(ast, (node, { parent, replaceWith, context }) => {
     if (node.kind !== 'at-rule') return
-    let ctx = cssContext(_ctx)
 
     // Collect paths from `@plugin` at-rules
     if (node.name === '@plugin') {
-      if (ctx.parent !== null) {
+      if (parent !== null) {
         throw new Error('`@plugin` cannot be nested.')
       }
 
@@ -110,17 +96,13 @@ export async function applyCompatibilityHooks({
       }
 
       pluginPaths.push([
-        {
-          id: pluginPath,
-          base: ctx.context.base as string,
-          reference: !!ctx.context.reference,
-          src: node.src,
-        },
+        { id: pluginPath, base: context.base as string, reference: !!context.reference },
         Object.keys(options).length > 0 ? options : null,
       ])
 
+      replaceWith([])
       features |= Features.JsPluginCompat
-      return WalkAction.Replace([])
+      return
     }
 
     // Collect paths from `@config` at-rules
@@ -129,18 +111,18 @@ export async function applyCompatibilityHooks({
         throw new Error('`@config` cannot have a body.')
       }
 
-      if (ctx.parent !== null) {
+      if (parent !== null) {
         throw new Error('`@config` cannot be nested.')
       }
 
       configPaths.push({
         id: node.params.slice(1, -1),
-        base: ctx.context.base as string,
-        reference: !!ctx.context.reference,
-        src: node.src,
+        base: context.base as string,
+        reference: !!context.reference,
       })
+      replaceWith([])
       features |= Features.JsPluginCompat
-      return WalkAction.Replace([])
+      return
     }
   })
 
@@ -163,7 +145,7 @@ export async function applyCompatibilityHooks({
       designSystem,
       base,
       ast,
-      sources,
+      globs,
       configs: [],
       pluginDetails: [],
     })
@@ -176,19 +158,18 @@ export async function applyCompatibilityHooks({
 
   let [configs, pluginDetails] = await Promise.all([
     Promise.all(
-      configPaths.map(async ({ id, base, reference, src }) => {
+      configPaths.map(async ({ id, base, reference }) => {
         let loaded = await loadModule(id, base, 'config')
         return {
           path: id,
           base: loaded.base,
           config: loaded.module as UserConfig,
           reference,
-          src,
         }
       }),
     ),
     Promise.all(
-      pluginPaths.map(async ([{ id, base, reference, src }, pluginOptions]) => {
+      pluginPaths.map(async ([{ id, base, reference }, pluginOptions]) => {
         let loaded = await loadModule(id, base, 'plugin')
         return {
           path: id,
@@ -196,7 +177,6 @@ export async function applyCompatibilityHooks({
           plugin: loaded.module as Plugin,
           options: pluginOptions,
           reference,
-          src,
         }
       }),
     ),
@@ -206,7 +186,7 @@ export async function applyCompatibilityHooks({
     designSystem,
     base,
     ast,
-    sources,
+    globs,
     configs,
     pluginDetails,
   })
@@ -218,20 +198,19 @@ function upgradeToFullPluginSupport({
   designSystem,
   base,
   ast,
-  sources,
+  globs,
   configs,
   pluginDetails,
 }: {
   designSystem: DesignSystem
   base: string
   ast: AstNode[]
-  sources: { base: string; pattern: string; negated: boolean }[]
+  globs: { origin?: string; pattern: string }[]
   configs: {
     path: string
     base: string
     config: UserConfig
     reference: boolean
-    src: SourceLocation | undefined
   }[]
   pluginDetails: {
     path: string
@@ -239,7 +218,6 @@ function upgradeToFullPluginSupport({
     plugin: Plugin
     options: CssPluginOptions | null
     reference: boolean
-    src: SourceLocation | undefined
   }[]
 }) {
   let features = Features.None
@@ -249,7 +227,6 @@ function upgradeToFullPluginSupport({
         config: { plugins: [detail.plugin] },
         base: detail.base,
         reference: detail.reference,
-        src: detail.src,
       }
     }
 
@@ -258,7 +235,6 @@ function upgradeToFullPluginSupport({
         config: { plugins: [detail.plugin(detail.options)] },
         base: detail.base,
         reference: detail.reference,
-        src: detail.src,
       }
     }
 
@@ -268,15 +244,38 @@ function upgradeToFullPluginSupport({
   let userConfig = [...pluginConfigs, ...configs]
 
   let { resolvedConfig } = resolveConfig(designSystem, [
-    { config: createCompatConfig(designSystem.theme), base, reference: true, src: undefined },
+    { config: createCompatConfig(designSystem.theme), base, reference: true },
     ...userConfig,
-    { config: { plugins: [darkModePlugin] }, base, reference: true, src: undefined },
+    { config: { plugins: [darkModePlugin] }, base, reference: true },
   ])
   let { resolvedConfig: resolvedUserConfig, replacedThemeKeys } = resolveConfig(
     designSystem,
     userConfig,
   )
 
+  // Replace `resolveThemeValue` with a version that is backwards compatible
+  // with dot-notation but also aware of any JS theme configurations registered
+  // by plugins or JS config files. This is significantly slower than just
+  // upgrading dot-notation keys so we only use this version if plugins or
+  // config files are actually being used. In the future we may want to optimize
+  // this further by only doing this if plugins or config files _actually_
+  // registered JS config objects.
+  designSystem.resolveThemeValue = function resolveThemeValue(path: string, forceInline?: boolean) {
+    let resolvedValue = pluginApi.theme(path, forceInline)
+
+    if (Array.isArray(resolvedValue) && resolvedValue.length === 2) {
+      // When a tuple is returned, return the first element
+      return resolvedValue[0]
+    } else if (Array.isArray(resolvedValue)) {
+      // Arrays get serialized into a comma-separated lists
+      return resolvedValue.join(', ')
+    } else if (typeof resolvedValue === 'string') {
+      // Otherwise only allow string values here, objects (and namespace maps)
+      // are treated as non-resolved values for the CSS `theme()` function.
+      return resolvedValue
+    }
+  }
+
   let pluginApiConfig = {
     designSystem,
     ast,
@@ -288,75 +287,23 @@ function upgradeToFullPluginSupport({
     },
   }
 
-  let sharedPluginApi = buildPluginApi({
-    ...pluginApiConfig,
-    referenceMode: false,
-    src: undefined,
-  })
+  let pluginApi = buildPluginApi({ ...pluginApiConfig, referenceMode: false })
+  let referenceModePluginApi = undefined
 
-  // Replace `resolveThemeValue` with a version that is backwards compatible
-  // with dot-notation but also aware of any JS theme configurations registered
-  // by plugins or JS config files. This is significantly slower than just
-  // upgrading dot-notation keys so we only use this version if plugins or
-  // config files are actually being used. In the future we may want to optimize
-  // this further by only doing this if plugins or config files _actually_
-  // registered JS config objects.
-  let defaultResolveThemeValue = designSystem.resolveThemeValue
-  designSystem.resolveThemeValue = function resolveThemeValue(path: string, forceInline?: boolean) {
-    if (path[0] === '-' && path[1] === '-') {
-      return defaultResolveThemeValue(path, forceInline)
+  for (let { handler, reference } of resolvedConfig.plugins) {
+    if (reference) {
+      referenceModePluginApi ||= buildPluginApi({ ...pluginApiConfig, referenceMode: true })
+      handler(referenceModePluginApi)
+    } else {
+      handler(pluginApi)
     }
-
-    let resolvedValue = sharedPluginApi.theme(path, undefined)
-
-    // If we're dealing with an object that has the `DEFAULT` key, unwrap it to
-    // the default value first. This happens for namespace root lookups where
-    // the CSS theme defines a bare value, e.g. `--shadow` resolved via
-    // `theme('shadow')`.
-    if (
-      typeof resolvedValue === 'object' &&
-      resolvedValue !== null &&
-      !Array.isArray(resolvedValue) &&
-      'DEFAULT' in resolvedValue
-    ) {
-      resolvedValue = resolvedValue.DEFAULT
-    }
-
-    // When a tuple is returned, return the first element
-    if (Array.isArray(resolvedValue) && resolvedValue.length === 2) {
-      return resolvedValue[0]
-    }
-
-    // Arrays get serialized into a comma-separated lists
-    else if (Array.isArray(resolvedValue)) {
-      return resolvedValue.join(', ')
-    }
-
-    // Otherwise only allow string values here, objects (and namespace maps)
-    // are treated as non-resolved values for the CSS `theme()` function.
-    else if (typeof resolvedValue === 'string') {
-      return resolvedValue
-    }
-  }
-
-  for (let { handler, reference, src } of resolvedConfig.plugins) {
-    // Each plugin gets its own instance of the plugin API because nodes added
-    // to the AST may need to point to the `@config` or `@plugin` that they
-    // originated from
-    let api = buildPluginApi({
-      ...pluginApiConfig,
-      referenceMode: reference ?? false,
-      src,
-    })
-
-    handler(api)
   }
 
   // Merge the user-configured theme keys into the design system. The compat
   // config would otherwise expand into namespaces like `background-color` which
   // core utilities already read from.
   applyConfigToTheme(designSystem, resolvedUserConfig, replacedThemeKeys)
-  applyKeyframesToTheme(designSystem, resolvedUserConfig)
+  applyKeyframesToTheme(designSystem, resolvedUserConfig, replacedThemeKeys)
 
   registerThemeVariantOverrides(resolvedUserConfig, designSystem)
   registerScreensConfig(resolvedUserConfig, designSystem)
@@ -389,18 +336,18 @@ function upgradeToFullPluginSupport({
   if (typeof resolvedConfig.important === 'string') {
     let wrappingSelector = resolvedConfig.important
 
-    walk(ast, (node, _ctx) => {
+    walk(ast, (node, { replaceWith, parent }) => {
       if (node.kind !== 'at-rule') return
       if (node.name !== '@tailwind' || node.params !== 'utilities') return
 
-      let ctx = cssContext(_ctx)
-
       // The AST node was already manually wrapped so there's nothing to do
-      if (ctx.parent?.kind === 'rule' && ctx.parent.selector === wrappingSelector) {
+      if (parent?.kind === 'rule' && parent.selector === wrappingSelector) {
         return WalkAction.Stop
       }
 
-      return WalkAction.ReplaceStop(styleRule(wrappingSelector, [node]))
+      replaceWith(styleRule(wrappingSelector, [node]))
+
+      return WalkAction.Stop
     })
   }
 
@@ -415,12 +362,7 @@ function upgradeToFullPluginSupport({
       )
     }
 
-    let negated = false
-    if (file.pattern[0] == '!') {
-      negated = true
-      file.pattern = file.pattern.slice(1)
-    }
-    sources.push({ ...file, negated })
+    globs.push(file)
   }
   return features
 }
diff --git a/packages/tailwindcss/src/compat/apply-config-to-theme.test.ts b/packages/tailwindcss/src/compat/apply-config-to-theme.test.ts
index 12f195e94..619c99182 100644
--- a/packages/tailwindcss/src/compat/apply-config-to-theme.test.ts
+++ b/packages/tailwindcss/src/compat/apply-config-to-theme.test.ts
@@ -31,16 +31,6 @@ test('config values can be merged into the theme', () => {
             normal: '0 1px 3px black',
           },
 
-          borderWidth: {
-            DEFAULT: '1.5px',
-          },
-          outlineWidth: {
-            DEFAULT: '2.5px',
-          },
-          ringWidth: {
-            DEFAULT: '3.5px',
-          },
-
           borderRadius: {
             sm: '0.33rem',
           },
@@ -62,13 +52,6 @@ test('config values can be merged into the theme', () => {
                 lineHeight: '1.5',
               },
             ],
-            lg: ['1.125rem', '2'],
-            xl: ['1.5rem', '3rem', 'invalid'],
-            '2xl': ['2rem'],
-          },
-
-          ringColor: {
-            DEFAULT: '#fff',
           },
 
           letterSpacing: {
@@ -91,17 +74,12 @@ test('config values can be merged into the theme', () => {
           },
 
           transitionTimingFunction: {
-            DEFAULT: 'ease-in-out',
             fast: 'cubic-bezier(0, 0.55, 0.45, 1)',
           },
-          transitionDuration: {
-            DEFAULT: '1234ms',
-          },
         },
       },
       base: '/root',
       reference: false,
-      src: undefined,
     },
   ])
   applyConfigToTheme(design, resolvedConfig, replacedThemeKeys)
@@ -124,42 +102,13 @@ test('config values can be merged into the theme', () => {
     '1rem',
     { '--line-height': '1.5' },
   ])
-  expect(theme.resolve('lg', ['--text'])).toEqual('1.125rem')
-  expect(theme.resolveWith('lg', ['--text'], ['--line-height'])).toEqual([
-    '1.125rem',
-    { '--line-height': '2' },
-  ])
-  expect(theme.resolve('xl', ['--text'])).toEqual('1.5rem')
-  expect(theme.resolveWith('xl', ['--text'], ['--line-height'])).toEqual([
-    '1.5rem',
-    { '--line-height': '3rem' },
-  ])
-  expect(theme.resolve('2xl', ['--text'])).toEqual('2rem')
-  expect(theme.resolveWith('2xl', ['--text'], ['--line-height'])).toEqual(['2rem', {}])
-  expect(theme.resolve('superWide', ['--tracking'])).toEqual('0.25em')
-  expect(theme.resolve('superLoose', ['--leading'])).toEqual('3')
+  expect(theme.resolve('super-wide', ['--tracking'])).toEqual('0.25em')
+  expect(theme.resolve('super-loose', ['--leading'])).toEqual('3')
   expect(theme.resolve('1/2', ['--width'])).toEqual('60%')
   expect(theme.resolve('0.5', ['--width'])).toEqual('60%')
   expect(theme.resolve('100%', ['--width'])).toEqual('100%')
   expect(theme.resolve('9xs', ['--container'])).toEqual('6rem')
   expect(theme.resolve('fast', ['--ease'])).toEqual('cubic-bezier(0, 0.55, 0.45, 1)')
-
-  expect(theme.get(['--border'])).toEqual(null)
-  expect(theme.get(['--default-border-width'])).toEqual('1.5px')
-
-  expect(theme.get(['--outline'])).toEqual(null)
-  expect(theme.get(['--default-outline-width'])).toEqual('2.5px')
-
-  expect(theme.get(['--ring-color'])).toEqual(null)
-  expect(theme.get(['--default-ring-color'])).toEqual('#fff')
-
-  expect(theme.get(['--ring-width'])).toEqual(null)
-  expect(theme.get(['--default-ring-width'])).toEqual('3.5px')
-
-  expect(theme.get(['--default-transition-duration'])).toEqual('1234ms')
-
-  expect(theme.get(['--ease'])).toEqual(null)
-  expect(theme.get(['--default-transition-timing-function'])).toEqual('ease-in-out')
 })
 
 test('will reset default theme values with overwriting theme values', () => {
@@ -196,8 +145,6 @@ test('will reset default theme values with overwriting theme values', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
   applyConfigToTheme(design, resolvedConfig, replacedThemeKeys)
@@ -227,8 +174,6 @@ test('invalid keys are not merged into the theme', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
 
@@ -267,8 +212,6 @@ test('converts opacity modifiers from decimal to percentage values', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
   applyConfigToTheme(design, resolvedConfig, replacedThemeKeys)
@@ -303,7 +246,6 @@ test('handles setting theme keys to null', async () => {
       },
       base: '/root',
       reference: false,
-      src: undefined,
     },
   ])
   applyConfigToTheme(design, resolvedConfig, replacedThemeKeys)
diff --git a/packages/tailwindcss/src/compat/apply-config-to-theme.ts b/packages/tailwindcss/src/compat/apply-config-to-theme.ts
index 8757520ee..d1fec30bc 100644
--- a/packages/tailwindcss/src/compat/apply-config-to-theme.ts
+++ b/packages/tailwindcss/src/compat/apply-config-to-theme.ts
@@ -130,16 +130,7 @@ export function themeableValues(config: ResolvedConfig['theme']): [string[], unk
     }
 
     if (Array.isArray(value) && value.every((v) => typeof v === 'string')) {
-      if (path[0] === 'fontSize') {
-        toAdd.push([path, value[0]])
-
-        if (value.length >= 2) {
-          toAdd.push([[...path, '-line-height'], value[1]])
-        }
-      } else {
-        toAdd.push([path, value.join(', ')])
-      }
-
+      toAdd.push([path, value.join(', ')])
       return WalkAction.Skip
     }
   })
@@ -147,57 +138,32 @@ export function themeableValues(config: ResolvedConfig['theme']): [string[], unk
   return toAdd
 }
 
-const SPECIAL_DEFAULT_KEYS: Record<string, string> = {
-  borderWidth: 'border-width',
-  outlineWidth: 'outline-width',
-  ringColor: 'ring-color',
-  ringWidth: 'ring-width',
-  transitionDuration: 'transition-duration',
-  transitionTimingFunction: 'transition-timing-function',
-}
-
-const OLD_TO_NEW_NAMESPACE: Record<string, string> = {
-  animation: 'animate',
-  aspectRatio: 'aspect',
-  borderRadius: 'radius',
-  boxShadow: 'shadow',
-  colors: 'color',
-  containers: 'container',
-  fontFamily: 'font',
-  fontSize: 'text',
-  letterSpacing: 'tracking',
-  lineHeight: 'leading',
-  maxWidth: 'container',
-  screens: 'breakpoint',
-  transitionTimingFunction: 'ease',
-}
-
-const IS_VALID_KEY = /^[a-zA-Z0-9-_%/.]+$/
+const IS_VALID_KEY = /^[a-zA-Z0-9-_%/\.]+$/
 
 export function keyPathToCssProperty(path: string[]) {
-  // In some special cases the `DEFAULT` key did not map to a "default" utility
-  // e.g. `ringColor.DEFAULT` wasn't *just* used for `ring`. It was used for
-  // all ring utilities as the color when one wasn't specified.
-  //
-  // We place these specialty values under the `--default-*` namespace to signal
-  // that they are defaults used by (potentially) multiple utilities.
-  let specialDefault = SPECIAL_DEFAULT_KEYS[path[0]]
-  if (specialDefault && path[1] === 'DEFAULT') return `default-${specialDefault}`
-
   // The legacy container component config should not be included in the Theme
   if (path[0] === 'container') return null
 
+  path = structuredClone(path)
+
+  if (path[0] === 'animation') path[0] = 'animate'
+  if (path[0] === 'aspectRatio') path[0] = 'aspect'
+  if (path[0] === 'borderRadius') path[0] = 'radius'
+  if (path[0] === 'boxShadow') path[0] = 'shadow'
+  if (path[0] === 'colors') path[0] = 'color'
+  if (path[0] === 'containers') path[0] = 'container'
+  if (path[0] === 'fontFamily') path[0] = 'font'
+  if (path[0] === 'fontSize') path[0] = 'text'
+  if (path[0] === 'letterSpacing') path[0] = 'tracking'
+  if (path[0] === 'lineHeight') path[0] = 'leading'
+  if (path[0] === 'maxWidth') path[0] = 'container'
+  if (path[0] === 'screens') path[0] = 'breakpoint'
+  if (path[0] === 'transitionTimingFunction') path[0] = 'ease'
+
   for (let part of path) {
     if (!IS_VALID_KEY.test(part)) return null
   }
 
-  // Map old v3 namespaces to new theme namespaces
-  let ns = OLD_TO_NEW_NAMESPACE[path[0]]
-  if (ns) {
-    path = path.slice()
-    path[0] = ns
-  }
-
   return (
     path
       // [1] should move into the nested object tuple. To create the CSS variable
@@ -210,27 +176,11 @@ export function keyPathToCssProperty(path: string[]) {
       .map((path, idx, all) => (path === '1' && idx !== all.length - 1 ? '' : path))
 
       // Resolve the key path to a CSS variable segment
-      .map((part, idx) => {
-        part = part.replaceAll('.', '_')
-
-        let shouldConvert =
-          // The first "namespace" part should be converted to kebab-case
-          // This converts things like backgroundColor to `background-color`
-          idx === 0 ||
-          // Any tuple nested key should be converted to kebab-case
-          // These are identified with a leading `-`
-          // e.g. `fontSize.xs.1.lineHeight` -> `font-size-xs--line-height`
-          part.startsWith('-') ||
-          // `lineHeight` is a bit of a special case in which it does not
-          // always begin with a leading `-` even when as a nested tuple key
-          part === 'lineHeight'
-
-        if (shouldConvert) {
-          part = part.replace(/([a-z])([A-Z])/g, (_, a, b) => `${a}-${b.toLowerCase()}`)
-        }
-
-        return part
-      })
+      .map((part) =>
+        part
+          .replaceAll('.', '_')
+          .replace(/([a-z])([A-Z])/g, (_, a, b) => `${a}-${b.toLowerCase()}`),
+      )
 
       // Remove the `DEFAULT` key at the end of a path
       // We're reading from CSS anyway so it'll be a string
diff --git a/packages/tailwindcss/src/compat/apply-keyframes-to-theme.test.ts b/packages/tailwindcss/src/compat/apply-keyframes-to-theme.test.ts
index aed761fce..a0b1c54d5 100644
--- a/packages/tailwindcss/src/compat/apply-keyframes-to-theme.test.ts
+++ b/packages/tailwindcss/src/compat/apply-keyframes-to-theme.test.ts
@@ -9,7 +9,7 @@ test('keyframes can be merged into the theme', () => {
   let theme = new Theme()
   let design = buildDesignSystem(theme)
 
-  let { resolvedConfig } = resolveConfig(design, [
+  let { resolvedConfig, replacedThemeKeys } = resolveConfig(design, [
     {
       config: {
         theme: {
@@ -28,11 +28,9 @@ test('keyframes can be merged into the theme', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
-  applyKeyframesToTheme(design, resolvedConfig)
+  applyKeyframesToTheme(design, resolvedConfig, replacedThemeKeys)
 
   expect(toCss(design.theme.getKeyframes())).toMatchInlineSnapshot(`
     "@keyframes fade-in {
@@ -72,7 +70,7 @@ test('will append to the default keyframes with new keyframes', () => {
     ]),
   )
 
-  let { resolvedConfig } = resolveConfig(design, [
+  let { resolvedConfig, replacedThemeKeys } = resolveConfig(design, [
     {
       config: {
         theme: {
@@ -93,11 +91,9 @@ test('will append to the default keyframes with new keyframes', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
-  applyKeyframesToTheme(design, resolvedConfig)
+  applyKeyframesToTheme(design, resolvedConfig, replacedThemeKeys)
 
   expect(toCss(design.theme.getKeyframes())).toMatchInlineSnapshot(`
     "@keyframes slide-in {
diff --git a/packages/tailwindcss/src/compat/apply-keyframes-to-theme.ts b/packages/tailwindcss/src/compat/apply-keyframes-to-theme.ts
index d5855545f..a58ca13df 100644
--- a/packages/tailwindcss/src/compat/apply-keyframes-to-theme.ts
+++ b/packages/tailwindcss/src/compat/apply-keyframes-to-theme.ts
@@ -6,6 +6,7 @@ import { objectToAst } from './plugin-api'
 export function applyKeyframesToTheme(
   designSystem: DesignSystem,
   resolvedConfig: Pick<ResolvedConfig, 'theme'>,
+  replacedThemeKeys: Set<string>,
 ) {
   for (let rule of keyframesToRules(resolvedConfig)) {
     designSystem.theme.addKeyframes(rule)
diff --git a/packages/tailwindcss/src/compat/colors.ts b/packages/tailwindcss/src/compat/colors.ts
index 64e3bc9c7..0a6cba403 100644
--- a/packages/tailwindcss/src/compat/colors.ts
+++ b/packages/tailwindcss/src/compat/colors.ts
@@ -1,345 +1,293 @@
 export default {
   inherit: 'inherit',
-  current: 'currentcolor',
+  current: 'currentColor',
   transparent: 'transparent',
   black: '#000',
   white: '#fff',
   slate: {
-    '50': 'oklch(98.4% 0.003 247.858)',
-    '100': 'oklch(96.8% 0.007 247.896)',
-    '200': 'oklch(92.9% 0.013 255.508)',
-    '300': 'oklch(86.9% 0.022 252.894)',
-    '400': 'oklch(70.4% 0.04 256.788)',
-    '500': 'oklch(55.4% 0.046 257.417)',
-    '600': 'oklch(44.6% 0.043 257.281)',
-    '700': 'oklch(37.2% 0.044 257.287)',
-    '800': 'oklch(27.9% 0.041 260.031)',
-    '900': 'oklch(20.8% 0.042 265.755)',
-    '950': 'oklch(12.9% 0.042 264.695)',
+    '50': 'oklch(0.984 0.003 247.858)',
+    '100': 'oklch(0.968 0.007 247.896)',
+    '200': 'oklch(0.929 0.013 255.508)',
+    '300': 'oklch(0.869 0.022 252.894)',
+    '400': 'oklch(0.704 0.04 256.788)',
+    '500': 'oklch(0.554 0.046 257.417)',
+    '600': 'oklch(0.446 0.043 257.281)',
+    '700': 'oklch(0.372 0.044 257.287)',
+    '800': 'oklch(0.279 0.041 260.031)',
+    '900': 'oklch(0.208 0.042 265.755)',
+    '950': 'oklch(0.129 0.042 264.695)',
   },
   gray: {
-    '50': 'oklch(98.5% 0.002 247.839)',
-    '100': 'oklch(96.7% 0.003 264.542)',
-    '200': 'oklch(92.8% 0.006 264.531)',
-    '300': 'oklch(87.2% 0.01 258.338)',
-    '400': 'oklch(70.7% 0.022 261.325)',
-    '500': 'oklch(55.1% 0.027 264.364)',
-    '600': 'oklch(44.6% 0.03 256.802)',
-    '700': 'oklch(37.3% 0.034 259.733)',
-    '800': 'oklch(27.8% 0.033 256.848)',
-    '900': 'oklch(21% 0.034 264.665)',
-    '950': 'oklch(13% 0.028 261.692)',
+    '50': 'oklch(0.985 0.002 247.839)',
+    '100': 'oklch(0.967 0.003 264.542)',
+    '200': 'oklch(0.928 0.006 264.531)',
+    '300': 'oklch(0.872 0.01 258.338)',
+    '400': 'oklch(0.707 0.022 261.325)',
+    '500': 'oklch(0.551 0.027 264.364)',
+    '600': 'oklch(0.446 0.03 256.802)',
+    '700': 'oklch(0.373 0.034 259.733)',
+    '800': 'oklch(0.278 0.033 256.848)',
+    '900': 'oklch(0.21 0.034 264.665)',
+    '950': 'oklch(0.13 0.028 261.692)',
   },
   zinc: {
-    '50': 'oklch(98.5% 0 none)',
-    '100': 'oklch(96.7% 0.001 286.375)',
-    '200': 'oklch(92% 0.004 286.32)',
-    '300': 'oklch(87.1% 0.006 286.286)',
-    '400': 'oklch(70.5% 0.015 286.067)',
-    '500': 'oklch(55.2% 0.016 285.938)',
-    '600': 'oklch(44.2% 0.017 285.786)',
-    '700': 'oklch(37% 0.013 285.805)',
-    '800': 'oklch(27.4% 0.006 286.033)',
-    '900': 'oklch(21% 0.006 285.885)',
-    '950': 'oklch(14.1% 0.005 285.823)',
+    '50': 'oklch(0.985 0 0)',
+    '100': 'oklch(0.967 0.001 286.375)',
+    '200': 'oklch(0.92 0.004 286.32)',
+    '300': 'oklch(0.871 0.006 286.286)',
+    '400': 'oklch(0.705 0.015 286.067)',
+    '500': 'oklch(0.552 0.016 285.938)',
+    '600': 'oklch(0.442 0.017 285.786)',
+    '700': 'oklch(0.37 0.013 285.805)',
+    '800': 'oklch(0.274 0.006 286.033)',
+    '900': 'oklch(0.21 0.006 285.885)',
+    '950': 'oklch(0.141 0.005 285.823)',
   },
   neutral: {
-    '50': 'oklch(98.5% 0 none)',
-    '100': 'oklch(97% 0 none)',
-    '200': 'oklch(92.2% 0 none)',
-    '300': 'oklch(87% 0 none)',
-    '400': 'oklch(70.8% 0 none)',
-    '500': 'oklch(55.6% 0 none)',
-    '600': 'oklch(43.9% 0 none)',
-    '700': 'oklch(37.1% 0 none)',
-    '800': 'oklch(26.9% 0 none)',
-    '900': 'oklch(20.5% 0 none)',
-    '950': 'oklch(14.5% 0 none)',
+    '50': 'oklch(0.985 0 0)',
+    '100': 'oklch(0.97 0 0)',
+    '200': 'oklch(0.922 0 0)',
+    '300': 'oklch(0.87 0 0)',
+    '400': 'oklch(0.708 0 0)',
+    '500': 'oklch(0.556 0 0)',
+    '600': 'oklch(0.439 0 0)',
+    '700': 'oklch(0.371 0 0)',
+    '800': 'oklch(0.269 0 0)',
+    '900': 'oklch(0.205 0 0)',
+    '950': 'oklch(0.145 0 0)',
   },
   stone: {
-    '50': 'oklch(98.5% 0.001 106.423)',
-    '100': 'oklch(97% 0.001 106.424)',
-    '200': 'oklch(92.3% 0.003 48.717)',
-    '300': 'oklch(86.9% 0.005 56.366)',
-    '400': 'oklch(70.9% 0.01 56.259)',
-    '500': 'oklch(55.3% 0.013 58.071)',
-    '600': 'oklch(44.4% 0.011 73.639)',
-    '700': 'oklch(37.4% 0.01 67.558)',
-    '800': 'oklch(26.8% 0.007 34.298)',
-    '900': 'oklch(21.6% 0.006 56.043)',
-    '950': 'oklch(14.7% 0.004 49.25)',
-  },
-  mauve: {
-    '50': 'oklch(98.5% 0 none)',
-    '100': 'oklch(96% 0.003 325.6)',
-    '200': 'oklch(92.2% 0.005 325.62)',
-    '300': 'oklch(86.5% 0.012 325.68)',
-    '400': 'oklch(71.1% 0.019 323.02)',
-    '500': 'oklch(54.2% 0.034 322.5)',
-    '600': 'oklch(43.5% 0.029 321.78)',
-    '700': 'oklch(36.4% 0.029 323.89)',
-    '800': 'oklch(26.3% 0.024 320.12)',
-    '900': 'oklch(21.2% 0.019 322.12)',
-    '950': 'oklch(14.5% 0.008 326)',
-  },
-  olive: {
-    '50': 'oklch(98.8% 0.003 106.5)',
-    '100': 'oklch(96.6% 0.005 106.5)',
-    '200': 'oklch(93% 0.007 106.5)',
-    '300': 'oklch(88% 0.011 106.6)',
-    '400': 'oklch(73.7% 0.021 106.9)',
-    '500': 'oklch(58% 0.031 107.3)',
-    '600': 'oklch(46.6% 0.025 107.3)',
-    '700': 'oklch(39.4% 0.023 107.4)',
-    '800': 'oklch(28.6% 0.016 107.4)',
-    '900': 'oklch(22.8% 0.013 107.4)',
-    '950': 'oklch(15.3% 0.006 107.1)',
-  },
-  mist: {
-    '50': 'oklch(98.7% 0.002 197.1)',
-    '100': 'oklch(96.3% 0.002 197.1)',
-    '200': 'oklch(92.5% 0.005 214.3)',
-    '300': 'oklch(87.2% 0.007 219.6)',
-    '400': 'oklch(72.3% 0.014 214.4)',
-    '500': 'oklch(56% 0.021 213.5)',
-    '600': 'oklch(45% 0.017 213.2)',
-    '700': 'oklch(37.8% 0.015 216)',
-    '800': 'oklch(27.5% 0.011 216.9)',
-    '900': 'oklch(21.8% 0.008 223.9)',
-    '950': 'oklch(14.8% 0.004 228.8)',
-  },
-  taupe: {
-    '50': 'oklch(98.6% 0.002 67.8)',
-    '100': 'oklch(96% 0.002 17.2)',
-    '200': 'oklch(92.2% 0.005 34.3)',
-    '300': 'oklch(86.8% 0.007 39.5)',
-    '400': 'oklch(71.4% 0.014 41.2)',
-    '500': 'oklch(54.7% 0.021 43.1)',
-    '600': 'oklch(43.8% 0.017 39.3)',
-    '700': 'oklch(36.7% 0.016 35.7)',
-    '800': 'oklch(26.8% 0.011 36.5)',
-    '900': 'oklch(21.4% 0.009 43.1)',
-    '950': 'oklch(14.7% 0.004 49.3)',
+    '50': 'oklch(0.985 0.001 106.423)',
+    '100': 'oklch(0.97 0.001 106.424)',
+    '200': 'oklch(0.923 0.003 48.717)',
+    '300': 'oklch(0.869 0.005 56.366)',
+    '400': 'oklch(0.709 0.01 56.259)',
+    '500': 'oklch(0.553 0.013 58.071)',
+    '600': 'oklch(0.444 0.011 73.639)',
+    '700': 'oklch(0.374 0.01 67.558)',
+    '800': 'oklch(0.268 0.007 34.298)',
+    '900': 'oklch(0.216 0.006 56.043)',
+    '950': 'oklch(0.147 0.004 49.25)',
   },
   red: {
-    '50': 'oklch(97.1% 0.013 17.38)',
-    '100': 'oklch(93.6% 0.032 17.717)',
-    '200': 'oklch(88.5% 0.062 18.334)',
-    '300': 'oklch(80.8% 0.114 19.571)',
-    '400': 'oklch(70.4% 0.191 22.216)',
-    '500': 'oklch(63.7% 0.237 25.331)',
-    '600': 'oklch(57.7% 0.245 27.325)',
-    '700': 'oklch(50.5% 0.213 27.518)',
-    '800': 'oklch(44.4% 0.177 26.899)',
-    '900': 'oklch(39.6% 0.141 25.723)',
-    '950': 'oklch(25.8% 0.092 26.042)',
+    '50': 'oklch(0.971 0.013 17.38)',
+    '100': 'oklch(0.936 0.032 17.717)',
+    '200': 'oklch(0.885 0.062 18.334)',
+    '300': 'oklch(0.808 0.114 19.571)',
+    '400': 'oklch(0.704 0.191 22.216)',
+    '500': 'oklch(0.637 0.237 25.331)',
+    '600': 'oklch(0.577 0.245 27.325)',
+    '700': 'oklch(0.505 0.213 27.518)',
+    '800': 'oklch(0.444 0.177 26.899)',
+    '900': 'oklch(0.396 0.141 25.723)',
+    '950': 'oklch(0.258 0.092 26.042)',
   },
   orange: {
-    '50': 'oklch(98% 0.016 73.684)',
-    '100': 'oklch(95.4% 0.038 75.164)',
-    '200': 'oklch(90.1% 0.076 70.697)',
-    '300': 'oklch(83.7% 0.128 66.29)',
-    '400': 'oklch(75% 0.183 55.934)',
-    '500': 'oklch(70.5% 0.213 47.604)',
-    '600': 'oklch(64.6% 0.222 41.116)',
-    '700': 'oklch(55.3% 0.195 38.402)',
-    '800': 'oklch(47% 0.157 37.304)',
-    '900': 'oklch(40.8% 0.123 38.172)',
-    '950': 'oklch(26.6% 0.079 36.259)',
+    '50': 'oklch(0.98 0.016 73.684)',
+    '100': 'oklch(0.954 0.038 75.164)',
+    '200': 'oklch(0.901 0.076 70.697)',
+    '300': 'oklch(0.837 0.128 66.29)',
+    '400': 'oklch(0.75 0.183 55.934)',
+    '500': 'oklch(0.705 0.213 47.604)',
+    '600': 'oklch(0.646 0.222 41.116)',
+    '700': 'oklch(0.553 0.195 38.402)',
+    '800': 'oklch(0.47 0.157 37.304)',
+    '900': 'oklch(0.408 0.123 38.172)',
+    '950': 'oklch(0.266 0.079 36.259)',
   },
   amber: {
-    '50': 'oklch(98.7% 0.022 95.277)',
-    '100': 'oklch(96.2% 0.059 95.617)',
-    '200': 'oklch(92.4% 0.12 95.746)',
-    '300': 'oklch(87.9% 0.169 91.605)',
-    '400': 'oklch(82.8% 0.189 84.429)',
-    '500': 'oklch(76.9% 0.188 70.08)',
-    '600': 'oklch(66.6% 0.179 58.318)',
-    '700': 'oklch(55.5% 0.163 48.998)',
-    '800': 'oklch(47.3% 0.137 46.201)',
-    '900': 'oklch(41.4% 0.112 45.904)',
-    '950': 'oklch(27.9% 0.077 45.635)',
+    '50': 'oklch(0.987 0.022 95.277)',
+    '100': 'oklch(0.962 0.059 95.617)',
+    '200': 'oklch(0.924 0.12 95.746)',
+    '300': 'oklch(0.879 0.169 91.605)',
+    '400': 'oklch(0.828 0.189 84.429)',
+    '500': 'oklch(0.769 0.188 70.08)',
+    '600': 'oklch(0.666 0.179 58.318)',
+    '700': 'oklch(0.555 0.163 48.998)',
+    '800': 'oklch(0.473 0.137 46.201)',
+    '900': 'oklch(0.414 0.112 45.904)',
+    '950': 'oklch(0.279 0.077 45.635)',
   },
   yellow: {
-    '50': 'oklch(98.7% 0.026 102.212)',
-    '100': 'oklch(97.3% 0.071 103.193)',
-    '200': 'oklch(94.5% 0.129 101.54)',
-    '300': 'oklch(90.5% 0.182 98.111)',
-    '400': 'oklch(85.2% 0.199 91.936)',
-    '500': 'oklch(79.5% 0.184 86.047)',
-    '600': 'oklch(68.1% 0.162 75.834)',
-    '700': 'oklch(55.4% 0.135 66.442)',
-    '800': 'oklch(47.6% 0.114 61.907)',
-    '900': 'oklch(42.1% 0.095 57.708)',
-    '950': 'oklch(28.6% 0.066 53.813)',
+    '50': 'oklch(0.987 0.026 102.212)',
+    '100': 'oklch(0.973 0.071 103.193)',
+    '200': 'oklch(0.945 0.129 101.54)',
+    '300': 'oklch(0.905 0.182 98.111)',
+    '400': 'oklch(0.852 0.199 91.936)',
+    '500': 'oklch(0.795 0.184 86.047)',
+    '600': 'oklch(0.681 0.162 75.834)',
+    '700': 'oklch(0.554 0.135 66.442)',
+    '800': 'oklch(0.476 0.114 61.907)',
+    '900': 'oklch(0.421 0.095 57.708)',
+    '950': 'oklch(0.286 0.066 53.813)',
   },
   lime: {
-    '50': 'oklch(98.6% 0.031 120.757)',
-    '100': 'oklch(96.7% 0.067 122.328)',
-    '200': 'oklch(93.8% 0.127 124.321)',
-    '300': 'oklch(89.7% 0.196 126.665)',
-    '400': 'oklch(84.1% 0.238 128.85)',
-    '500': 'oklch(76.8% 0.233 130.85)',
-    '600': 'oklch(64.8% 0.2 131.684)',
-    '700': 'oklch(53.2% 0.157 131.589)',
-    '800': 'oklch(45.3% 0.124 130.933)',
-    '900': 'oklch(40.5% 0.101 131.063)',
-    '950': 'oklch(27.4% 0.072 132.109)',
+    '50': 'oklch(0.986 0.031 120.757)',
+    '100': 'oklch(0.967 0.067 122.328)',
+    '200': 'oklch(0.938 0.127 124.321)',
+    '300': 'oklch(0.897 0.196 126.665)',
+    '400': 'oklch(0.841 0.238 128.85)',
+    '500': 'oklch(0.768 0.233 130.85)',
+    '600': 'oklch(0.648 0.2 131.684)',
+    '700': 'oklch(0.532 0.157 131.589)',
+    '800': 'oklch(0.453 0.124 130.933)',
+    '900': 'oklch(0.405 0.101 131.063)',
+    '950': 'oklch(0.274 0.072 132.109)',
   },
   green: {
-    '50': 'oklch(98.2% 0.018 155.826)',
-    '100': 'oklch(96.2% 0.044 156.743)',
-    '200': 'oklch(92.5% 0.084 155.995)',
-    '300': 'oklch(87.1% 0.15 154.449)',
-    '400': 'oklch(79.2% 0.209 151.711)',
-    '500': 'oklch(72.3% 0.219 149.579)',
-    '600': 'oklch(62.7% 0.194 149.214)',
-    '700': 'oklch(52.7% 0.154 150.069)',
-    '800': 'oklch(44.8% 0.119 151.328)',
-    '900': 'oklch(39.3% 0.095 152.535)',
-    '950': 'oklch(26.6% 0.065 152.934)',
+    '50': 'oklch(0.982 0.018 155.826)',
+    '100': 'oklch(0.962 0.044 156.743)',
+    '200': 'oklch(0.925 0.084 155.995)',
+    '300': 'oklch(0.871 0.15 154.449)',
+    '400': 'oklch(0.792 0.209 151.711)',
+    '500': 'oklch(0.723 0.219 149.579)',
+    '600': 'oklch(0.627 0.194 149.214)',
+    '700': 'oklch(0.527 0.154 150.069)',
+    '800': 'oklch(0.448 0.119 151.328)',
+    '900': 'oklch(0.393 0.095 152.535)',
+    '950': 'oklch(0.266 0.065 152.934)',
   },
   emerald: {
-    '50': 'oklch(97.9% 0.021 166.113)',
-    '100': 'oklch(95% 0.052 163.051)',
-    '200': 'oklch(90.5% 0.093 164.15)',
-    '300': 'oklch(84.5% 0.143 164.978)',
-    '400': 'oklch(76.5% 0.177 163.223)',
-    '500': 'oklch(69.6% 0.17 162.48)',
-    '600': 'oklch(59.6% 0.145 163.225)',
-    '700': 'oklch(50.8% 0.118 165.612)',
-    '800': 'oklch(43.2% 0.095 166.913)',
-    '900': 'oklch(37.8% 0.077 168.94)',
-    '950': 'oklch(26.2% 0.051 172.552)',
+    '50': 'oklch(0.979 0.021 166.113)',
+    '100': 'oklch(0.95 0.052 163.051)',
+    '200': 'oklch(0.905 0.093 164.15)',
+    '300': 'oklch(0.845 0.143 164.978)',
+    '400': 'oklch(0.765 0.177 163.223)',
+    '500': 'oklch(0.696 0.17 162.48)',
+    '600': 'oklch(0.596 0.145 163.225)',
+    '700': 'oklch(0.508 0.118 165.612)',
+    '800': 'oklch(0.432 0.095 166.913)',
+    '900': 'oklch(0.378 0.077 168.94)',
+    '950': 'oklch(0.262 0.051 172.552)',
   },
   teal: {
-    '50': 'oklch(98.4% 0.014 180.72)',
-    '100': 'oklch(95.3% 0.051 180.801)',
-    '200': 'oklch(91% 0.096 180.426)',
-    '300': 'oklch(85.5% 0.138 181.071)',
-    '400': 'oklch(77.7% 0.152 181.912)',
-    '500': 'oklch(70.4% 0.14 182.503)',
-    '600': 'oklch(60% 0.118 184.704)',
-    '700': 'oklch(51.1% 0.096 186.391)',
-    '800': 'oklch(43.7% 0.078 188.216)',
-    '900': 'oklch(38.6% 0.063 188.416)',
-    '950': 'oklch(27.7% 0.046 192.524)',
+    '50': 'oklch(0.984 0.014 180.72)',
+    '100': 'oklch(0.953 0.051 180.801)',
+    '200': 'oklch(0.91 0.096 180.426)',
+    '300': 'oklch(0.855 0.138 181.071)',
+    '400': 'oklch(0.777 0.152 181.912)',
+    '500': 'oklch(0.704 0.14 182.503)',
+    '600': 'oklch(0.6 0.118 184.704)',
+    '700': 'oklch(0.511 0.096 186.391)',
+    '800': 'oklch(0.437 0.078 188.216)',
+    '900': 'oklch(0.386 0.063 188.416)',
+    '950': 'oklch(0.277 0.046 192.524)',
   },
   cyan: {
-    '50': 'oklch(98.4% 0.019 200.873)',
-    '100': 'oklch(95.6% 0.045 203.388)',
-    '200': 'oklch(91.7% 0.08 205.041)',
-    '300': 'oklch(86.5% 0.127 207.078)',
-    '400': 'oklch(78.9% 0.154 211.53)',
-    '500': 'oklch(71.5% 0.143 215.221)',
-    '600': 'oklch(60.9% 0.126 221.723)',
-    '700': 'oklch(52% 0.105 223.128)',
-    '800': 'oklch(45% 0.085 224.283)',
-    '900': 'oklch(39.8% 0.07 227.392)',
-    '950': 'oklch(30.2% 0.056 229.695)',
+    '50': 'oklch(0.984 0.019 200.873)',
+    '100': 'oklch(0.956 0.045 203.388)',
+    '200': 'oklch(0.917 0.08 205.041)',
+    '300': 'oklch(0.865 0.127 207.078)',
+    '400': 'oklch(0.789 0.154 211.53)',
+    '500': 'oklch(0.715 0.143 215.221)',
+    '600': 'oklch(0.609 0.126 221.723)',
+    '700': 'oklch(0.52 0.105 223.128)',
+    '800': 'oklch(0.45 0.085 224.283)',
+    '900': 'oklch(0.398 0.07 227.392)',
+    '950': 'oklch(0.302 0.056 229.695)',
   },
   sky: {
-    '50': 'oklch(97.7% 0.013 236.62)',
-    '100': 'oklch(95.1% 0.026 236.824)',
-    '200': 'oklch(90.1% 0.058 230.902)',
-    '300': 'oklch(82.8% 0.111 230.318)',
-    '400': 'oklch(74.6% 0.16 232.661)',
-    '500': 'oklch(68.5% 0.169 237.323)',
-    '600': 'oklch(58.8% 0.158 241.966)',
-    '700': 'oklch(50% 0.134 242.749)',
-    '800': 'oklch(44.3% 0.11 240.79)',
-    '900': 'oklch(39.1% 0.09 240.876)',
-    '950': 'oklch(29.3% 0.066 243.157)',
+    '50': 'oklch(0.977 0.013 236.62)',
+    '100': 'oklch(0.951 0.026 236.824)',
+    '200': 'oklch(0.901 0.058 230.902)',
+    '300': 'oklch(0.828 0.111 230.318)',
+    '400': 'oklch(0.746 0.16 232.661)',
+    '500': 'oklch(0.685 0.169 237.323)',
+    '600': 'oklch(0.588 0.158 241.966)',
+    '700': 'oklch(0.5 0.134 242.749)',
+    '800': 'oklch(0.443 0.11 240.79)',
+    '900': 'oklch(0.391 0.09 240.876)',
+    '950': 'oklch(0.293 0.066 243.157)',
   },
   blue: {
-    '50': 'oklch(97% 0.014 254.604)',
-    '100': 'oklch(93.2% 0.032 255.585)',
-    '200': 'oklch(88.2% 0.059 254.128)',
-    '300': 'oklch(80.9% 0.105 251.813)',
-    '400': 'oklch(70.7% 0.165 254.624)',
-    '500': 'oklch(62.3% 0.214 259.815)',
-    '600': 'oklch(54.6% 0.245 262.881)',
-    '700': 'oklch(48.8% 0.243 264.376)',
-    '800': 'oklch(42.4% 0.199 265.638)',
-    '900': 'oklch(37.9% 0.146 265.522)',
-    '950': 'oklch(28.2% 0.091 267.935)',
+    '50': 'oklch(0.97 0.014 254.604)',
+    '100': 'oklch(0.932 0.032 255.585)',
+    '200': 'oklch(0.882 0.059 254.128)',
+    '300': 'oklch(0.809 0.105 251.813)',
+    '400': 'oklch(0.707 0.165 254.624)',
+    '500': 'oklch(0.623 0.214 259.815)',
+    '600': 'oklch(0.546 0.245 262.881)',
+    '700': 'oklch(0.488 0.243 264.376)',
+    '800': 'oklch(0.424 0.199 265.638)',
+    '900': 'oklch(0.379 0.146 265.522)',
+    '950': 'oklch(0.282 0.091 267.935)',
   },
   indigo: {
-    '50': 'oklch(96.2% 0.018 272.314)',
-    '100': 'oklch(93% 0.034 272.788)',
-    '200': 'oklch(87% 0.065 274.039)',
-    '300': 'oklch(78.5% 0.115 274.713)',
-    '400': 'oklch(67.3% 0.182 276.935)',
-    '500': 'oklch(58.5% 0.233 277.117)',
-    '600': 'oklch(51.1% 0.262 276.966)',
-    '700': 'oklch(45.7% 0.24 277.023)',
-    '800': 'oklch(39.8% 0.195 277.366)',
-    '900': 'oklch(35.9% 0.144 278.697)',
-    '950': 'oklch(25.7% 0.09 281.288)',
+    '50': 'oklch(0.962 0.018 272.314)',
+    '100': 'oklch(0.93 0.034 272.788)',
+    '200': 'oklch(0.87 0.065 274.039)',
+    '300': 'oklch(0.785 0.115 274.713)',
+    '400': 'oklch(0.673 0.182 276.935)',
+    '500': 'oklch(0.585 0.233 277.117)',
+    '600': 'oklch(0.511 0.262 276.966)',
+    '700': 'oklch(0.457 0.24 277.023)',
+    '800': 'oklch(0.398 0.195 277.366)',
+    '900': 'oklch(0.359 0.144 278.697)',
+    '950': 'oklch(0.257 0.09 281.288)',
   },
   violet: {
-    '50': 'oklch(96.9% 0.016 293.756)',
-    '100': 'oklch(94.3% 0.029 294.588)',
-    '200': 'oklch(89.4% 0.057 293.283)',
-    '300': 'oklch(81.1% 0.111 293.571)',
-    '400': 'oklch(70.2% 0.183 293.541)',
-    '500': 'oklch(60.6% 0.25 292.717)',
-    '600': 'oklch(54.1% 0.281 293.009)',
-    '700': 'oklch(49.1% 0.27 292.581)',
-    '800': 'oklch(43.2% 0.232 292.759)',
-    '900': 'oklch(38% 0.189 293.745)',
-    '950': 'oklch(28.3% 0.141 291.089)',
+    '50': 'oklch(0.969 0.016 293.756)',
+    '100': 'oklch(0.943 0.029 294.588)',
+    '200': 'oklch(0.894 0.057 293.283)',
+    '300': 'oklch(0.811 0.111 293.571)',
+    '400': 'oklch(0.702 0.183 293.541)',
+    '500': 'oklch(0.606 0.25 292.717)',
+    '600': 'oklch(0.541 0.281 293.009)',
+    '700': 'oklch(0.491 0.27 292.581)',
+    '800': 'oklch(0.432 0.232 292.759)',
+    '900': 'oklch(0.38 0.189 293.745)',
+    '950': 'oklch(0.283 0.141 291.089)',
   },
   purple: {
-    '50': 'oklch(97.7% 0.014 308.299)',
-    '100': 'oklch(94.6% 0.033 307.174)',
-    '200': 'oklch(90.2% 0.063 306.703)',
-    '300': 'oklch(82.7% 0.119 306.383)',
-    '400': 'oklch(71.4% 0.203 305.504)',
-    '500': 'oklch(62.7% 0.265 303.9)',
-    '600': 'oklch(55.8% 0.288 302.321)',
-    '700': 'oklch(49.6% 0.265 301.924)',
-    '800': 'oklch(43.8% 0.218 303.724)',
-    '900': 'oklch(38.1% 0.176 304.987)',
-    '950': 'oklch(29.1% 0.149 302.717)',
+    '50': 'oklch(0.977 0.014 308.299)',
+    '100': 'oklch(0.946 0.033 307.174)',
+    '200': 'oklch(0.902 0.063 306.703)',
+    '300': 'oklch(0.827 0.119 306.383)',
+    '400': 'oklch(0.714 0.203 305.504)',
+    '500': 'oklch(0.627 0.265 303.9)',
+    '600': 'oklch(0.558 0.288 302.321)',
+    '700': 'oklch(0.496 0.265 301.924)',
+    '800': 'oklch(0.438 0.218 303.724)',
+    '900': 'oklch(0.381 0.176 304.987)',
+    '950': 'oklch(0.291 0.149 302.717)',
   },
   fuchsia: {
-    '50': 'oklch(97.7% 0.017 320.058)',
-    '100': 'oklch(95.2% 0.037 318.852)',
-    '200': 'oklch(90.3% 0.076 319.62)',
-    '300': 'oklch(83.3% 0.145 321.434)',
-    '400': 'oklch(74% 0.238 322.16)',
-    '500': 'oklch(66.7% 0.295 322.15)',
-    '600': 'oklch(59.1% 0.293 322.896)',
-    '700': 'oklch(51.8% 0.253 323.949)',
-    '800': 'oklch(45.2% 0.211 324.591)',
-    '900': 'oklch(40.1% 0.17 325.612)',
-    '950': 'oklch(29.3% 0.136 325.661)',
+    '50': 'oklch(0.977 0.017 320.058)',
+    '100': 'oklch(0.952 0.037 318.852)',
+    '200': 'oklch(0.903 0.076 319.62)',
+    '300': 'oklch(0.833 0.145 321.434)',
+    '400': 'oklch(0.74 0.238 322.16)',
+    '500': 'oklch(0.667 0.295 322.15)',
+    '600': 'oklch(0.591 0.293 322.896)',
+    '700': 'oklch(0.518 0.253 323.949)',
+    '800': 'oklch(0.452 0.211 324.591)',
+    '900': 'oklch(0.401 0.17 325.612)',
+    '950': 'oklch(0.293 0.136 325.661)',
   },
   pink: {
-    '50': 'oklch(97.1% 0.014 343.198)',
-    '100': 'oklch(94.8% 0.028 342.258)',
-    '200': 'oklch(89.9% 0.061 343.231)',
-    '300': 'oklch(82.3% 0.12 346.018)',
-    '400': 'oklch(71.8% 0.202 349.761)',
-    '500': 'oklch(65.6% 0.241 354.308)',
-    '600': 'oklch(59.2% 0.249 0.584)',
-    '700': 'oklch(52.5% 0.223 3.958)',
-    '800': 'oklch(45.9% 0.187 3.815)',
-    '900': 'oklch(40.8% 0.153 2.432)',
-    '950': 'oklch(28.4% 0.109 3.907)',
+    '50': 'oklch(0.971 0.014 343.198)',
+    '100': 'oklch(0.948 0.028 342.258)',
+    '200': 'oklch(0.899 0.061 343.231)',
+    '300': 'oklch(0.823 0.12 346.018)',
+    '400': 'oklch(0.718 0.202 349.761)',
+    '500': 'oklch(0.656 0.241 354.308)',
+    '600': 'oklch(0.592 0.249 0.584)',
+    '700': 'oklch(0.525 0.223 3.958)',
+    '800': 'oklch(0.459 0.187 3.815)',
+    '900': 'oklch(0.408 0.153 2.432)',
+    '950': 'oklch(0.284 0.109 3.907)',
   },
   rose: {
-    '50': 'oklch(96.9% 0.015 12.422)',
-    '100': 'oklch(94.1% 0.03 12.58)',
-    '200': 'oklch(89.2% 0.058 10.001)',
-    '300': 'oklch(81% 0.117 11.638)',
-    '400': 'oklch(71.2% 0.194 13.428)',
-    '500': 'oklch(64.5% 0.246 16.439)',
-    '600': 'oklch(58.6% 0.253 17.585)',
-    '700': 'oklch(51.4% 0.222 16.935)',
-    '800': 'oklch(45.5% 0.188 13.697)',
-    '900': 'oklch(41% 0.159 10.272)',
-    '950': 'oklch(27.1% 0.105 12.094)',
+    '50': 'oklch(0.969 0.015 12.422)',
+    '100': 'oklch(0.941 0.03 12.58)',
+    '200': 'oklch(0.892 0.058 10.001)',
+    '300': 'oklch(0.81 0.117 11.638)',
+    '400': 'oklch(0.712 0.194 13.428)',
+    '500': 'oklch(0.645 0.246 16.439)',
+    '600': 'oklch(0.586 0.253 17.585)',
+    '700': 'oklch(0.514 0.222 16.935)',
+    '800': 'oklch(0.455 0.188 13.697)',
+    '900': 'oklch(0.41 0.159 10.272)',
+    '950': 'oklch(0.271 0.105 12.094)',
   },
 }
diff --git a/packages/tailwindcss/src/compat/config.test.ts b/packages/tailwindcss/src/compat/config.test.ts
index 1f69ae446..f856a557d 100644
--- a/packages/tailwindcss/src/compat/config.test.ts
+++ b/packages/tailwindcss/src/compat/config.test.ts
@@ -1,7 +1,6 @@
 import { describe, expect, test, vi } from 'vitest'
 import { compile, type Config } from '..'
 import { default as plugin } from '../plugin'
-import { compileCss, run } from '../test-utils/run'
 import flattenColorPalette from './flatten-color-palette'
 
 const css = String.raw
@@ -13,28 +12,25 @@ test('Config files can add content', async () => {
   `
 
   let compiler = await compile(input, {
-    loadModule: async () => ({ module: { content: ['./file.txt'] }, base: '/root', path: '' }),
+    loadModule: async () => ({ module: { content: ['./file.txt'] }, base: '/root' }),
   })
 
-  expect(compiler.sources).toEqual([{ base: '/root', pattern: './file.txt', negated: false }])
+  expect(compiler.globs).toEqual([{ base: '/root', pattern: './file.txt' }])
 })
 
 test('Config files can change dark mode (media)', async () => {
-  expect(
-    await run(
-      ['dark:underline'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({ module: { darkMode: 'media' }, base: '/root', path: '' }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @media (prefers-color-scheme: dark) {
-      .dark\\:underline {
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({ module: { darkMode: 'media' }, base: '/root' }),
+  })
+
+  expect(compiler.build(['dark:underline'])).toMatchInlineSnapshot(`
+    ".dark\\:underline {
+      @media (prefers-color-scheme: dark) {
         text-decoration-line: underline;
       }
     }
@@ -43,80 +39,73 @@ test('Config files can change dark mode (media)', async () => {
 })
 
 test('Config files can change dark mode (selector)', async () => {
-  expect(
-    await run(
-      ['dark:underline'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({ module: { darkMode: 'selector' }, base: '/root', path: '' }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .dark\\:underline:where(.dark, .dark *) {
-      text-decoration-line: underline;
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({ module: { darkMode: 'selector' }, base: '/root' }),
+  })
+
+  expect(compiler.build(['dark:underline'])).toMatchInlineSnapshot(`
+    ".dark\\:underline {
+      &:where(.dark, .dark *) {
+        text-decoration-line: underline;
+      }
     }
     "
   `)
 })
 
 test('Config files can change dark mode (variant)', async () => {
-  expect(
-    await run(
-      ['dark:underline'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({
-          module: { darkMode: ['variant', '&:where(:not(.light))'] },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .dark\\:underline:where(:not(.light)) {
-      text-decoration-line: underline;
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: { darkMode: ['variant', '&:where(:not(.light))'] },
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['dark:underline'])).toMatchInlineSnapshot(`
+    ".dark\\:underline {
+      &:where(:not(.light)) {
+        text-decoration-line: underline;
+      }
     }
     "
   `)
 })
 
 test('Config files can add plugins', async () => {
-  expect(
-    await run(
-      ['no-scrollbar'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            plugins: [
-              plugin(function ({ addUtilities }) {
-                addUtilities({
-                  '.no-scrollbar': {
-                    'scrollbar-width': 'none',
-                  },
-                })
-              }),
-            ],
-          },
-          base: '/root',
-          path: '',
-        }),
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        plugins: [
+          plugin(function ({ addUtilities }) {
+            addUtilities({
+              '.no-scrollbar': {
+                'scrollbar-width': 'none',
+              },
+            })
+          }),
+        ],
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .no-scrollbar {
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['no-scrollbar'])).toMatchInlineSnapshot(`
+    ".no-scrollbar {
       scrollbar-width: none;
     }
     "
@@ -124,181 +113,137 @@ test('Config files can add plugins', async () => {
 })
 
 test('Plugins loaded from config files can contribute to the config', async () => {
-  expect(
-    await run(
-      ['dark:underline'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            plugins: [
-              plugin(() => {}, {
-                darkMode: ['variant', '&:where(:not(.light))'],
-              }),
-            ],
-          },
-          base: '/root',
-          path: '',
-        }),
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        plugins: [
+          plugin(() => {}, {
+            darkMode: ['variant', '&:where(:not(.light))'],
+          }),
+        ],
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .dark\\:underline:where(:not(.light)) {
-      text-decoration-line: underline;
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['dark:underline'])).toMatchInlineSnapshot(`
+    ".dark\\:underline {
+      &:where(:not(.light)) {
+        text-decoration-line: underline;
+      }
     }
     "
   `)
 })
 
 test('Config file presets can contribute to the config', async () => {
-  expect(
-    await run(
-      ['dark:underline'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({
-          module: { presets: [{ darkMode: ['variant', '&:where(:not(.light))'] }] },
-          base: '/root',
-          path: '',
-        }),
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        presets: [
+          {
+            darkMode: ['variant', '&:where(:not(.light))'],
+          },
+        ],
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .dark\\:underline:where(:not(.light)) {
-      text-decoration-line: underline;
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['dark:underline'])).toMatchInlineSnapshot(`
+    ".dark\\:underline {
+      &:where(:not(.light)) {
+        text-decoration-line: underline;
+      }
     }
     "
   `)
 })
 
 test('Config files can affect the theme', async () => {
-  expect(
-    await run(
-      ['bg-primary', 'scrollbar-primary'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                colors: {
-                  primary: '#c0ffee',
-                },
-              },
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            colors: {
+              primary: '#c0ffee',
             },
-
-            plugins: [
-              plugin(function ({ addUtilities, theme }) {
-                addUtilities({
-                  '.scrollbar-primary': {
-                    scrollbarColor: theme('colors.primary'),
-                  },
-                })
-              }),
-            ],
           },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .scrollbar-primary {
-      scrollbar-color: #c0ffee;
-    }
+        },
 
-    .bg-primary {
+        plugins: [
+          plugin(function ({ addUtilities, theme }) {
+            addUtilities({
+              '.scrollbar-primary': {
+                scrollbarColor: theme('colors.primary'),
+              },
+            })
+          }),
+        ],
+      },
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['bg-primary', 'scrollbar-primary'])).toMatchInlineSnapshot(`
+    ".bg-primary {
       background-color: #c0ffee;
     }
-    "
-  `)
-})
-
-// https://github.com/tailwindlabs/tailwindcss/issues/19091
-test('Accessing a default color if a sub-color exists via CSS should work as expected', async () => {
-  expect(
-    await compileCss(
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-
-        .example {
-          color: theme('colors.foo-bar');
-          border-color: theme('colors.foo');
-        }
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              // Internally this object gets converted to something like:
-              // ```
-              // {
-              //   foo: { DEFAULT: 'var(--foo-foo)', bar: 'var(--foo-foo-bar)' },
-              // }
-              // ```
-              colors: {
-                foo: 'var(--foo-foo)',
-                'foo-bar': 'var(--foo-foo-bar)',
-              },
-            },
-          },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .example {
-      color: var(--foo-foo-bar);
-      border-color: var(--foo-foo);
+    .scrollbar-primary {
+      scrollbar-color: #c0ffee;
     }
     "
   `)
 })
 
 test('Variants in CSS overwrite variants from plugins', async () => {
-  expect(
-    await run(
-      ['dark:underline', 'light:underline'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-        @custom-variant dark (&:is(.my-dark));
-        @custom-variant light (&:is(.my-light));
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            darkMode: ['variant', '&:is(.dark)'],
-            plugins: [
-              plugin(function ({ addVariant }) {
-                addVariant('light', '&:is(.light)')
-              }),
-            ],
-          },
-          base: '/root',
-          path: '',
-        }),
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+    @custom-variant dark (&:is(.my-dark));
+    @custom-variant light (&:is(.my-light));
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        darkMode: ['variant', '&:is(.dark)'],
+        plugins: [
+          plugin(function ({ addVariant }) {
+            addVariant('light', '&:is(.light)')
+          }),
+        ],
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .dark\\:underline.my-dark, .light\\:underline.my-light {
-      text-decoration-line: underline;
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['dark:underline', 'light:underline'])).toMatchInlineSnapshot(`
+    ".dark\\:underline {
+      &:is(.my-dark) {
+        text-decoration-line: underline;
+      }
+    }
+    .light\\:underline {
+      &:is(.my-light) {
+        text-decoration-line: underline;
+      }
     }
     "
   `)
@@ -308,167 +253,146 @@ describe('theme callbacks', () => {
   test('tuple values from the config overwrite `@theme default` tuple-ish values from the CSS theme', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['leading-base', 'leading-md', 'leading-xl', 'prose'],
-        css`
-          @theme default {
-            --text-base: 0rem;
-            --text-base--line-height: 1rem;
-            --text-md: 0rem;
-            --text-md--line-height: 1rem;
-            --text-xl: 0rem;
-            --text-xl--line-height: 1rem;
-          }
-          @theme {
-            --text-base: 100rem;
-            --text-md--line-height: 101rem;
-          }
-          @tailwind utilities;
-          @config "./config.js";
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                extend: {
-                  fontSize: {
-                    base: ['200rem', { lineHeight: '201rem' }],
-                    md: ['200rem', { lineHeight: '201rem' }],
-                    xl: ['200rem', { lineHeight: '201rem' }],
-                  },
+    let input = css`
+      @theme default {
+        --text-base: 0rem;
+        --text-base--line-height: 1rem;
+        --text-md: 0rem;
+        --text-md--line-height: 1rem;
+        --text-xl: 0rem;
+        --text-xl--line-height: 1rem;
+      }
+      @theme {
+        --text-base: 100rem;
+        --text-md--line-height: 101rem;
+      }
+      @tailwind utilities;
+      @config "./config.js";
+    `
 
-                  // Direct access
-                  lineHeight: ({ theme }) => ({
-                    base: theme('fontSize.base[1].lineHeight'),
-                    md: theme('fontSize.md[1].lineHeight'),
-                    xl: theme('fontSize.xl[1].lineHeight'),
-                  }),
-
-                  // Tuple access
-                  typography: ({ theme }) => ({
-                    '[class~=lead-base]': {
-                      fontSize: theme('fontSize.base')[0],
-                      ...theme('fontSize.base')[1],
-                    },
-                    '[class~=lead-md]': {
-                      fontSize: theme('fontSize.md')[0],
-                      ...theme('fontSize.md')[1],
-                    },
-                    '[class~=lead-xl]': {
-                      fontSize: theme('fontSize.xl')[0],
-                      ...theme('fontSize.xl')[1],
-                    },
-                  }),
-                },
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            extend: {
+              fontSize: {
+                base: ['200rem', { lineHeight: '201rem' }],
+                md: ['200rem', { lineHeight: '201rem' }],
+                xl: ['200rem', { lineHeight: '201rem' }],
               },
 
-              plugins: [
-                plugin(function ({ addUtilities, theme }) {
-                  addUtilities({
-                    '.prose': {
-                      ...theme('typography'),
-                    },
-                  })
-                }),
-              ],
-            } satisfies Config,
-            base: '/root',
-            path: '',
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-leading: initial;
+              // Direct access
+              lineHeight: ({ theme }) => ({
+                base: theme('fontSize.base[1].lineHeight'),
+                md: theme('fontSize.md[1].lineHeight'),
+                xl: theme('fontSize.xl[1].lineHeight'),
+              }),
+
+              // Tuple access
+              typography: ({ theme }) => ({
+                '[class~=lead-base]': {
+                  fontSize: theme('fontSize.base')[0],
+                  ...theme('fontSize.base')[1],
+                },
+                '[class~=lead-md]': {
+                  fontSize: theme('fontSize.md')[0],
+                  ...theme('fontSize.md')[1],
+                },
+                '[class~=lead-xl]': {
+                  fontSize: theme('fontSize.xl')[0],
+                  ...theme('fontSize.xl')[1],
+                },
+              }),
+            },
+          },
+
+          plugins: [
+            plugin(function ({ addUtilities, theme }) {
+              addUtilities({
+                '.prose': {
+                  ...theme('typography'),
+                },
+              })
+            }),
+          ],
+        } satisfies Config,
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['leading-base', 'leading-md', 'leading-xl', 'prose']))
+      .toMatchInlineSnapshot(`
+        ".prose {
+          [class~=lead-base] {
+            font-size: 100rem;
+            line-height: 201rem;
+          }
+          [class~=lead-md] {
+            font-size: 200rem;
+            line-height: 101rem;
+          }
+          [class~=lead-xl] {
+            font-size: 200rem;
+            line-height: 201rem;
           }
         }
-      }
-
-      .prose [class~="lead-base"] {
-        font-size: 100rem;
-        line-height: 201rem;
-      }
-
-      .prose [class~="lead-md"] {
-        font-size: 200rem;
-        line-height: 101rem;
-      }
-
-      .prose [class~="lead-xl"] {
-        font-size: 200rem;
-        line-height: 201rem;
-      }
-
-      .leading-base {
-        --tw-leading: 201rem;
-        line-height: 201rem;
-      }
-
-      .leading-md {
-        --tw-leading: 101rem;
-        line-height: 101rem;
-      }
-
-      .leading-xl {
-        --tw-leading: 201rem;
-        line-height: 201rem;
-      }
-
-      @property --tw-leading {
-        syntax: "*";
-        inherits: false
-      }
-      "
-    `)
+        .leading-base {
+          --tw-leading: 201rem;
+          line-height: 201rem;
+        }
+        .leading-md {
+          --tw-leading: 101rem;
+          line-height: 101rem;
+        }
+        .leading-xl {
+          --tw-leading: 201rem;
+          line-height: 201rem;
+        }
+        @property --tw-leading {
+          syntax: "*";
+          inherits: false;
+        }
+        "
+      `)
   })
 })
 
 describe('theme overrides order', () => {
   test('user theme > js config > default theme', async () => {
-    expect(
-      await run(
-        ['bg-red', 'bg-blue'],
-        css`
-          @theme default {
-            --color-red: red;
-          }
-          @theme {
-            --color-blue: blue;
-          }
-          @tailwind utilities;
-          @config "./config.js";
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                extend: {
-                  colors: {
-                    red: 'very-red',
-                    blue: 'very-blue',
-                  },
-                },
-              },
-            },
-            base: '/root',
-            path: '',
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let input = css`
+      @theme default {
+        --color-red: red;
+      }
+      @theme {
         --color-blue: blue;
       }
+      @tailwind utilities;
+      @config "./config.js";
+    `
 
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            extend: {
+              colors: {
+                red: 'very-red',
+                blue: 'very-blue',
+              },
+            },
+          },
+        },
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['bg-red', 'bg-blue'])).toMatchInlineSnapshot(`
+      ":root, :host {
+        --color-blue: blue;
+      }
       .bg-blue {
         background-color: var(--color-blue);
       }
-
       .bg-red {
         background-color: very-red;
       }
@@ -477,134 +401,131 @@ describe('theme overrides order', () => {
   })
 
   test('user theme > js config > default theme (with nested object)', async () => {
-    expect(
-      await run(
-        [
-          'bg-slate-100',
-          'bg-slate-200',
-          'bg-slate-300',
-          'bg-slate-400',
-          'bg-slate-500',
-          'bg-slate-600',
-          'hover-bg-slate-100',
-          'hover-bg-slate-200',
-          'hover-bg-slate-300',
-          'hover-bg-slate-400',
-          'hover-bg-slate-500',
-          'hover-bg-slate-600',
-        ],
-        css`
-          @theme default {
-            --color-slate-100: #000100;
-            --color-slate-200: #000200;
-            --color-slate-300: #000300;
-          }
-          @theme {
-            --color-slate-400: #100400;
-            --color-slate-500: #100500;
-          }
-          @tailwind utilities;
-          @config "./config.js";
-          @plugin "./plugin.js";
-        `,
-        {
-          loadModule: async (id) => {
-            if (id.includes('config.js')) {
-              return {
-                module: {
-                  theme: {
-                    extend: {
-                      colors: {
-                        slate: {
-                          200: '#200200',
-                          400: '#200400',
-                          600: '#200600',
-                        },
-                      },
+    let input = css`
+      @theme default {
+        --color-slate-100: #000100;
+        --color-slate-200: #000200;
+        --color-slate-300: #000300;
+      }
+      @theme {
+        --color-slate-400: #100400;
+        --color-slate-500: #100500;
+      }
+      @tailwind utilities;
+      @config "./config.js";
+      @plugin "./plugin.js";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id) => {
+        if (id.includes('config.js')) {
+          return {
+            module: {
+              theme: {
+                extend: {
+                  colors: {
+                    slate: {
+                      200: '#200200',
+                      400: '#200400',
+                      600: '#200600',
                     },
                   },
-                } satisfies Config,
-                base: '/root',
-                path: '',
-              }
-            } else {
-              return {
-                module: plugin(({ matchUtilities, theme }) => {
-                  matchUtilities(
-                    {
-                      'hover-bg': (value) => {
-                        return {
-                          '&:hover': {
-                            backgroundColor: value,
-                          },
-                        }
+                },
+              },
+            } satisfies Config,
+            base: '/root',
+          }
+        } else {
+          return {
+            module: plugin(({ matchUtilities, theme }) => {
+              matchUtilities(
+                {
+                  'hover-bg': (value) => {
+                    return {
+                      '&:hover': {
+                        backgroundColor: value,
                       },
-                    },
-                    { values: flattenColorPalette(theme('colors')) },
-                  )
-                }),
-                base: '/root',
-                path: '',
-              }
-            }
-          },
-        },
-      ),
+                    }
+                  },
+                },
+                { values: flattenColorPalette(theme('colors')) },
+              )
+            }),
+            base: '/root',
+          }
+        }
+      },
+    })
+
+    expect(
+      compiler.build([
+        'bg-slate-100',
+        'bg-slate-200',
+        'bg-slate-300',
+        'bg-slate-400',
+        'bg-slate-500',
+        'bg-slate-600',
+        'hover-bg-slate-100',
+        'hover-bg-slate-200',
+        'hover-bg-slate-300',
+        'hover-bg-slate-400',
+        'hover-bg-slate-500',
+        'hover-bg-slate-600',
+      ]),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-slate-100: #000100;
         --color-slate-300: #000300;
         --color-slate-400: #100400;
         --color-slate-500: #100500;
       }
-
       .bg-slate-100 {
         background-color: var(--color-slate-100);
       }
-
       .bg-slate-200 {
         background-color: #200200;
       }
-
       .bg-slate-300 {
         background-color: var(--color-slate-300);
       }
-
       .bg-slate-400 {
         background-color: var(--color-slate-400);
       }
-
       .bg-slate-500 {
         background-color: var(--color-slate-500);
       }
-
       .bg-slate-600 {
         background-color: #200600;
       }
-
-      .hover-bg-slate-100:hover {
-        background-color: #000100;
+      .hover-bg-slate-100 {
+        &:hover {
+          background-color: #000100;
+        }
       }
-
-      .hover-bg-slate-200:hover {
-        background-color: #200200;
+      .hover-bg-slate-200 {
+        &:hover {
+          background-color: #200200;
+        }
       }
-
-      .hover-bg-slate-300:hover {
-        background-color: #000300;
+      .hover-bg-slate-300 {
+        &:hover {
+          background-color: #000300;
+        }
       }
-
-      .hover-bg-slate-400:hover {
-        background-color: #100400;
+      .hover-bg-slate-400 {
+        &:hover {
+          background-color: #100400;
+        }
       }
-
-      .hover-bg-slate-500:hover {
-        background-color: #100500;
+      .hover-bg-slate-500 {
+        &:hover {
+          background-color: #100500;
+        }
       }
-
-      .hover-bg-slate-600:hover {
-        background-color: #200600;
+      .hover-bg-slate-600 {
+        &:hover {
+          background-color: #200600;
+        }
       }
       "
     `)
@@ -613,35 +534,31 @@ describe('theme overrides order', () => {
 
 describe('default font family compatibility', () => {
   test('overriding `fontFamily.sans` sets `--default-font-family`', async () => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: 'Potato Sans',
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: 'Potato Sans',
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-sans {
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`
+      ".font-sans {
         font-family: Potato Sans;
       }
       "
@@ -651,37 +568,33 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.sans[1].fontFeatureSettings` sets `--default-font-feature-settings`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: ['Potato Sans', { fontFeatureSettings: '"cv06"' }],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: ['Potato Sans', { fontFeatureSettings: '"cv06"' }],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-sans {
-        font-feature-settings: "cv06";
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`
+      ".font-sans {
         font-family: Potato Sans;
+        font-feature-settings: "cv06";
       }
       "
     `)
@@ -690,37 +603,33 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.sans[1].fontVariationSettings` sets `--default-font-variation-settings`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: ['Potato Sans', { fontVariationSettings: '"XHGT" 0.7' }],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: ['Potato Sans', { fontVariationSettings: '"XHGT" 0.7' }],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-sans {
-        font-variation-settings: "XHGT" .7;
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`
+      ".font-sans {
         font-family: Potato Sans;
+        font-variation-settings: "XHGT" 0.7;
       }
       "
     `)
@@ -729,41 +638,37 @@ describe('default font family compatibility', () => {
   test('overriding `fontFeatureSettings` and `fontVariationSettings` for `fontFamily.sans` sets `--default-font-feature-settings` and `--default-font-variation-settings`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: [
-                    'Potato Sans',
-                    { fontFeatureSettings: '"cv06"', fontVariationSettings: '"XHGT" 0.7' },
-                  ],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: [
+                'Potato Sans',
+                { fontFeatureSettings: '"cv06"', fontVariationSettings: '"XHGT" 0.7' },
+              ],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-sans {
-        font-feature-settings: "cv06";
-        font-variation-settings: "XHGT" .7;
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`
+      ".font-sans {
         font-family: Potato Sans;
+        font-feature-settings: "cv06";
+        font-variation-settings: "XHGT" 0.7;
       }
       "
     `)
@@ -772,41 +677,36 @@ describe('default font family compatibility', () => {
   test('overriding `--font-family-sans` in `@theme` without `default` preserves the original `--default-font-*` values', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @theme {
-            --font-sans: Sandwich Sans;
-          }
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: 'Potato Sans',
-                },
-              },
-            },
-            base: '/root',
-            path: '',
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @theme {
         --font-sans: Sandwich Sans;
       }
+      @tailwind utilities;
+    `
 
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: 'Potato Sans',
+            },
+          },
+        },
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`
+      ":root, :host {
+        --font-sans: Sandwich Sans;
+      }
       .font-sans {
         font-family: var(--font-sans);
       }
@@ -817,35 +717,31 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.sans` in a config file with an array sets `--default-font-family`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: ['Inter', 'system-ui', 'sans-serif'],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: ['Inter', 'system-ui', 'sans-serif'],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-sans {
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`
+      ".font-sans {
         font-family: Inter, system-ui, sans-serif;
       }
       "
@@ -855,67 +751,58 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.sans` in a config file with an unexpected type is ignored', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-sans'],
-        css`
-          @theme default {
-            --default-font-family: var(--font-family-sans);
-            --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
-            --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  sans: { foo: 'bar', banana: 'sandwich' },
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-font-family: var(--font-family-sans);
+        --default-font-feature-settings: var(--font-family-sans--font-feature-settings);
+        --default-font-variation-settings: var(--font-family-sans--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              sans: { foo: 'bar', banana: 'sandwich' },
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toEqual('')
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-sans'])).toMatchInlineSnapshot(`""`)
   })
 
   test('overriding `fontFamily.mono` sets `--default-mono-font-family`', async () => {
-    expect(
-      await run(
-        ['font-mono'],
-        css`
-          @theme default {
-            --default-mono-font-family: var(--font-family-mono);
-            --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
-            --default-mono-font-variation-settings: var(
-              --font-family-mono--font-variation-settings
-            );
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  mono: 'Potato Mono',
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-mono-font-family: var(--font-family-mono);
+        --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
+        --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              mono: 'Potato Mono',
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-mono {
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-mono'])).toMatchInlineSnapshot(`
+      ".font-mono {
         font-family: Potato Mono;
       }
       "
@@ -925,39 +812,33 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.mono[1].fontFeatureSettings` sets `--default-mono-font-feature-settings`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-mono'],
-        css`
-          @theme default {
-            --default-mono-font-family: var(--font-family-mono);
-            --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
-            --default-mono-font-variation-settings: var(
-              --font-family-mono--font-variation-settings
-            );
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  mono: ['Potato Mono', { fontFeatureSettings: '"cv06"' }],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-mono-font-family: var(--font-family-mono);
+        --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
+        --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              mono: ['Potato Mono', { fontFeatureSettings: '"cv06"' }],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-mono {
-        font-feature-settings: "cv06";
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-mono'])).toMatchInlineSnapshot(`
+      ".font-mono {
         font-family: Potato Mono;
+        font-feature-settings: "cv06";
       }
       "
     `)
@@ -966,39 +847,33 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.mono[1].fontVariationSettings` sets `--default-mono-font-variation-settings`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-mono'],
-        css`
-          @theme default {
-            --default-mono-font-family: var(--font-family-mono);
-            --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
-            --default-mono-font-variation-settings: var(
-              --font-family-mono--font-variation-settings
-            );
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  mono: ['Potato Mono', { fontVariationSettings: '"XHGT" 0.7' }],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-mono-font-family: var(--font-family-mono);
+        --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
+        --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              mono: ['Potato Mono', { fontVariationSettings: '"XHGT" 0.7' }],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-mono {
-        font-variation-settings: "XHGT" .7;
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-mono'])).toMatchInlineSnapshot(`
+      ".font-mono {
         font-family: Potato Mono;
+        font-variation-settings: "XHGT" 0.7;
       }
       "
     `)
@@ -1007,41 +882,37 @@ describe('default font family compatibility', () => {
   test('overriding `fontFeatureSettings` and `fontVariationSettings` for `fontFamily.mono` sets `--default-mono-font-feature-settings` and `--default-mono-font-variation-settings`', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-mono'],
-        css`
-          @theme default {
-            --default-mono-font-family: var(--font-mono);
-            --default-mono-font-feature-settings: var(--font-mono--font-feature-settings);
-            --default-mono-font-variation-settings: var(--font-mono--font-variation-settings);
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  mono: [
-                    'Potato Mono',
-                    { fontFeatureSettings: '"cv06"', fontVariationSettings: '"XHGT" 0.7' },
-                  ],
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-mono-font-family: var(--font-mono);
+        --default-mono-font-feature-settings: var(--font-mono--font-feature-settings);
+        --default-mono-font-variation-settings: var(--font-mono--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              mono: [
+                'Potato Mono',
+                { fontFeatureSettings: '"cv06"', fontVariationSettings: '"XHGT" 0.7' },
+              ],
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .font-mono {
-        font-feature-settings: "cv06";
-        font-variation-settings: "XHGT" .7;
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-mono'])).toMatchInlineSnapshot(`
+      ".font-mono {
         font-family: Potato Mono;
+        font-feature-settings: "cv06";
+        font-variation-settings: "XHGT" 0.7;
       }
       "
     `)
@@ -1050,41 +921,36 @@ describe('default font family compatibility', () => {
   test('overriding `--font-family-mono` in `@theme` without `default` preserves the original `--default-mono-font-*` values', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-mono'],
-        css`
-          @theme default {
-            --default-mono-font-family: var(--font-mono);
-            --default-mono-font-feature-settings: var(--font-mono--font-feature-settings);
-            --default-mono-font-variation-settings: var(--font-mono--font-variation-settings);
-          }
-          @config "./config.js";
-          @theme {
-            --font-mono: Sandwich Mono;
-          }
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  mono: 'Potato Mono',
-                },
-              },
-            },
-            base: '/root',
-            path: '',
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let input = css`
+      @theme default {
+        --default-mono-font-family: var(--font-mono);
+        --default-mono-font-feature-settings: var(--font-mono--font-feature-settings);
+        --default-mono-font-variation-settings: var(--font-mono--font-variation-settings);
+      }
+      @config "./config.js";
+      @theme {
         --font-mono: Sandwich Mono;
       }
+      @tailwind utilities;
+    `
 
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              mono: 'Potato Mono',
+            },
+          },
+        },
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-mono'])).toMatchInlineSnapshot(`
+      ":root, :host {
+        --font-mono: Sandwich Mono;
+      }
       .font-mono {
         font-family: var(--font-mono);
       }
@@ -1095,117 +961,115 @@ describe('default font family compatibility', () => {
   test('overriding `fontFamily.mono` in a config file with an unexpected type is ignored', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['font-mono'],
-        css`
-          @theme default {
-            --default-mono-font-family: var(--font-family-mono);
-            --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
-            --default-mono-font-variation-settings: var(
-              --font-family-mono--font-variation-settings
-            );
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                fontFamily: {
-                  mono: { foo: 'bar', banana: 'sandwich' },
-                },
-              },
+    let input = css`
+      @theme default {
+        --default-mono-font-family: var(--font-family-mono);
+        --default-mono-font-feature-settings: var(--font-family-mono--font-feature-settings);
+        --default-mono-font-variation-settings: var(--font-family-mono--font-variation-settings);
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            fontFamily: {
+              mono: { foo: 'bar', banana: 'sandwich' },
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
-    ).toEqual('')
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build(['font-mono'])).toMatchInlineSnapshot(`""`)
   })
 })
 
 test('creates variants for `data`, `supports`, and `aria` theme options at the same level as the core utility ', async () => {
-  expect(
-    await run(
-      [
-        'aria-polite:underline',
-        'supports-child-combinator:underline',
-        'supports-foo:underline',
-        'data-checked:underline',
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
+  `
 
-        // Ensure core variants still work
-        'aria-hidden:flex',
-        'supports-grid:flex',
-        'data-foo:flex',
-
-        // The `print` variant should still be sorted last, even after registering
-        // the other custom variants.
-        'print:flex',
-      ],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                aria: {
-                  polite: 'live="polite"',
-                },
-                supports: {
-                  'child-combinator': 'selector(h2 > p)',
-                  foo: 'bar',
-                },
-                data: {
-                  checked: 'ui~="checked"',
-                },
-              },
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            aria: {
+              polite: 'live="polite"',
+            },
+            supports: {
+              'child-combinator': 'selector(h2 > p)',
+              foo: 'bar',
+            },
+            data: {
+              checked: 'ui~="checked"',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
+      base: '/root',
+    }),
+  })
+
+  expect(
+    compiler.build([
+      'aria-polite:underline',
+      'supports-child-combinator:underline',
+      'supports-foo:underline',
+      'data-checked:underline',
+
+      // Ensure core variants still work
+      'aria-hidden:flex',
+      'supports-grid:flex',
+      'data-foo:flex',
+
+      // The `print` variant should still be sorted last, even after registering
+      // the other custom variants.
+      'print:flex',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    .aria-hidden\\:flex[aria-hidden="true"] {
-      display: flex;
-    }
-
-    .aria-polite\\:underline[aria-live="polite"], .data-checked\\:underline[data-ui~="checked"] {
-      text-decoration-line: underline;
-    }
-
-    .data-foo\\:flex[data-foo] {
-      display: flex;
-    }
-
-    @supports selector(h2 > p) {
-      .supports-child-combinator\\:underline {
-        text-decoration-line: underline;
-      }
-    }
-
-    @supports (bar: var(--tw)) {
-      .supports-foo\\:underline {
-        text-decoration-line: underline;
-      }
-    }
-
-    @supports (grid: var(--tw)) {
-      .supports-grid\\:flex {
+    ".aria-hidden\\:flex {
+      &[aria-hidden="true"] {
         display: flex;
       }
     }
-
-    @media print {
-      .print\\:flex {
+    .aria-polite\\:underline {
+      &[aria-live="polite"] {
+        text-decoration-line: underline;
+      }
+    }
+    .data-checked\\:underline {
+      &[data-ui~="checked"] {
+        text-decoration-line: underline;
+      }
+    }
+    .data-foo\\:flex {
+      &[data-foo] {
+        display: flex;
+      }
+    }
+    .supports-child-combinator\\:underline {
+      @supports selector(h2 > p) {
+        text-decoration-line: underline;
+      }
+    }
+    .supports-foo\\:underline {
+      @supports (bar: var(--tw)) {
+        text-decoration-line: underline;
+      }
+    }
+    .supports-grid\\:flex {
+      @supports (grid: var(--tw)) {
+        display: flex;
+      }
+    }
+    .print\\:flex {
+      @media print {
         display: flex;
       }
     }
@@ -1214,66 +1078,62 @@ test('creates variants for `data`, `supports`, and `aria` theme options at the s
 })
 
 test('merges css breakpoints with js config screens', async () => {
-  expect(
-    await run(
-      ['sm:flex', 'md:flex', 'lg:flex', 'min-sm:max-md:underline'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @theme {
-          --breakpoint-md: 50rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                screens: {
-                  sm: '44rem',
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @theme {
+      --breakpoint-md: 50rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            screens: {
+              sm: '44rem',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 44rem) {
-      .sm\\:flex {
-        display: flex;
-      }
+      base: '/root',
+    }),
+  })
 
-      @media not all and (min-width: 50rem) {
-        .min-sm\\:max-md\\:underline {
-          text-decoration-line: underline;
+  expect(compiler.build(['sm:flex', 'md:flex', 'lg:flex', 'min-sm:max-md:underline']))
+    .toMatchInlineSnapshot(`
+      ".sm\\:flex {
+        @media (width >= 44rem) {
+          display: flex;
+        }
+      }
+      .min-sm\\:max-md\\:underline {
+        @media (width >= 44rem) {
+          @media (width < 50rem) {
+            text-decoration-line: underline;
+          }
         }
       }
-    }
-
-    @media (min-width: 50rem) {
       .md\\:flex {
-        display: flex;
+        @media (width >= 50rem) {
+          display: flex;
+        }
       }
-    }
-
-    @media (min-width: 64rem) {
       .lg\\:flex {
-        display: flex;
+        @media (width >= 64rem) {
+          display: flex;
+        }
       }
-    }
-    "
-  `)
+      "
+    `)
 })
 
 test('utilities must be prefixed', async () => {
@@ -1286,70 +1146,72 @@ test('utilities must be prefixed', async () => {
     }
   `
 
-  let options: Partial<Parameters<typeof compile>[1]> = {
-    loadModule: async (_id, base) => ({
-      path: '',
+  let compiler = await compile(input, {
+    loadModule: async (id, base) => ({
       base,
       module: { prefix: 'tw' },
     }),
-  }
+  })
 
   // Prefixed utilities are generated
-  expect(await run(['tw:underline', 'tw:hover:line-through', 'tw:custom'], input, options))
+  expect(compiler.build(['tw:underline', 'tw:hover:line-through', 'tw:custom']))
     .toMatchInlineSnapshot(`
-      "
-      .tw\\:custom {
-        color: red;
-      }
-
-      .tw\\:underline {
-        text-decoration-line: underline;
-      }
-
-      @media (hover: hover) {
-        .tw\\:hover\\:line-through:hover {
+    ".tw\\:custom {
+      color: red;
+    }
+    .tw\\:underline {
+      text-decoration-line: underline;
+    }
+    .tw\\:hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
           text-decoration-line: line-through;
         }
       }
-      "
-    `)
+    }
+    "
+  `)
 
   // Non-prefixed utilities are ignored
-  expect(await run(['underline', 'hover:line-through', 'custom'], input, options)).toEqual('')
+  compiler = await compile(input, {
+    loadModule: async (id, base) => ({
+      base,
+      module: { prefix: 'tw' },
+    }),
+  })
+
+  expect(compiler.build(['underline', 'hover:line-through', 'custom'])).toEqual('')
 })
 
 test('utilities used in @apply must be prefixed', async () => {
-  // Prefixed utilities are generated
-  expect(
-    await compileCss(
-      css`
-        @config "./config.js";
+  let compiler = await compile(
+    css`
+      @config "./config.js";
 
-        .my-underline {
-          @apply tw:underline;
-        }
-      `,
-      {
-        loadModule: async (_id, base) => ({
-          path: '',
-          base,
-          module: { prefix: 'tw' },
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .my-underline {
+      .my-underline {
+        @apply tw:underline;
+      }
+    `,
+    {
+      loadModule: async (id, base) => ({
+        base,
+        module: { prefix: 'tw' },
+      }),
+    },
+  )
+
+  // Prefixed utilities are generated
+  expect(compiler.build([])).toMatchInlineSnapshot(`
+    ".my-underline {
       text-decoration-line: underline;
     }
     "
   `)
 
   // Non-prefixed utilities cause an error
-  await expect(
+  expect(() =>
     compile(
       css`
-        @tailwind utilities;
         @config "./config.js";
 
         .my-underline {
@@ -1357,50 +1219,46 @@ test('utilities used in @apply must be prefixed', async () => {
         }
       `,
       {
-        loadModule: async (_id, base) => ({
-          path: '',
+        loadModule: async (id, base) => ({
           base,
           module: { prefix: 'tw' },
         }),
       },
     ),
   ).rejects.toThrowErrorMatchingInlineSnapshot(
-    `[Error: Cannot apply unprefixed utility class \`underline\`. Did you mean \`tw:underline\`?]`,
+    `[Error: Cannot apply unknown utility class: underline]`,
   )
 })
 
 test('Prefixes configured in CSS take precedence over those defined in JS configs', async () => {
-  expect(
-    await run(
-      ['wat:custom'],
-      css`
-        @theme prefix(wat) {
-          --color-red: #f00;
-          --color-green: #0f0;
-          --breakpoint-sm: 640px;
+  let compiler = await compile(
+    css`
+      @theme prefix(wat) {
+        --color-red: #f00;
+        --color-green: #0f0;
+        --breakpoint-sm: 640px;
+      }
+
+      @config "./plugin.js";
+
+      @tailwind utilities;
+
+      @utility custom {
+        color: red;
+      }
+    `,
+    {
+      async loadModule(id, base) {
+        return {
+          base,
+          module: { prefix: 'tw' },
         }
-
-        @config "./plugin.js";
-
-        @tailwind utilities;
-
-        @utility custom {
-          color: red;
-        }
-      `,
-      {
-        async loadModule(_id, base) {
-          return {
-            path: '',
-            base,
-            module: { prefix: 'tw' },
-          }
-        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .wat\\:custom {
+    },
+  )
+
+  expect(compiler.build(['wat:custom'])).toMatchInlineSnapshot(`
+    ".wat\\:custom {
       color: red;
     }
     "
@@ -1414,9 +1272,8 @@ test('a prefix must be letters only', async () => {
         @config "./plugin.js";
       `,
       {
-        async loadModule(_id, base) {
+        async loadModule(id, base) {
           return {
-            path: '',
             base,
             module: { prefix: '__' },
           }
@@ -1429,38 +1286,36 @@ test('a prefix must be letters only', async () => {
 })
 
 test('important: `#app`', async () => {
-  expect(
-    await run(
-      ['underline', 'hover:line-through', 'custom'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
 
-        @utility custom {
-          color: red;
-        }
-      `,
-      {
-        loadModule: async (_id, base) => ({
-          path: '',
-          base,
-          module: { important: '#app' },
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    #app .custom {
+    @utility custom {
       color: red;
     }
+  `
 
-    #app .underline {
-      text-decoration-line: underline;
-    }
+  let compiler = await compile(input, {
+    loadModule: async (_, base) => ({
+      base,
+      module: { important: '#app' },
+    }),
+  })
 
-    @media (hover: hover) {
-      #app .hover\\:line-through:hover {
-        text-decoration-line: line-through;
+  expect(compiler.build(['underline', 'hover:line-through', 'custom'])).toMatchInlineSnapshot(`
+    "#app {
+      .custom {
+        color: red;
+      }
+      .underline {
+        text-decoration-line: underline;
+      }
+      .hover\\:line-through {
+        &:hover {
+          @media (hover: hover) {
+            text-decoration-line: line-through;
+          }
+        }
       }
     }
     "
@@ -1468,38 +1323,34 @@ test('important: `#app`', async () => {
 })
 
 test('important: true', async () => {
-  expect(
-    await run(
-      ['underline', 'hover:line-through', 'custom'],
-      css`
-        @tailwind utilities;
-        @config "./config.js";
+  let input = css`
+    @tailwind utilities;
+    @config "./config.js";
 
-        @utility custom {
-          color: red;
-        }
-      `,
-      {
-        loadModule: async (_id, base) => ({
-          path: '',
-          base,
-          module: { important: true },
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .custom {
+    @utility custom {
+      color: red;
+    }
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async (_, base) => ({
+      base,
+      module: { important: true },
+    }),
+  })
+
+  expect(compiler.build(['underline', 'hover:line-through', 'custom'])).toMatchInlineSnapshot(`
+    ".custom {
       color: red !important;
     }
-
     .underline {
       text-decoration-line: underline !important;
     }
-
-    @media (hover: hover) {
-      .hover\\:line-through:hover {
-        text-decoration-line: line-through !important;
+    .hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
+          text-decoration-line: line-through !important;
+        }
       }
     }
     "
@@ -1507,49 +1358,46 @@ test('important: true', async () => {
 })
 
 test('blocklisted candidates are not generated', async () => {
-  let input = css`
-    @theme reference {
-      --color-white: #fff;
-      --breakpoint-md: 48rem;
-    }
-    @tailwind utilities;
-    @config "./config.js";
-  `
-
-  let options: Partial<Parameters<typeof compile>[1]> = {
-    async loadModule(_id, base) {
-      return {
-        path: '',
-        base,
-        module: {
-          blocklist: ['bg-white'],
-        },
+  let compiler = await compile(
+    css`
+      @theme reference {
+        --color-white: #fff;
+        --breakpoint-md: 48rem;
       }
+      @tailwind utilities;
+      @config "./config.js";
+    `,
+    {
+      async loadModule(id, base) {
+        return {
+          base,
+          module: {
+            blocklist: ['bg-white'],
+          },
+        }
+      },
     },
-  }
+  )
 
   // bg-white will not get generated
-  expect(await run(['bg-white'], input, options)).toEqual('')
+  expect(compiler.build(['bg-white'])).toEqual('')
 
   // underline will as will md:bg-white
-  expect(await run(['underline', 'bg-white', 'md:bg-white'], input, options))
-    .toMatchInlineSnapshot(`
-      "
-      .underline {
-        text-decoration-line: underline;
+  expect(compiler.build(['underline', 'bg-white', 'md:bg-white'])).toMatchInlineSnapshot(`
+    ".underline {
+      text-decoration-line: underline;
+    }
+    .md\\:bg-white {
+      @media (width >= 48rem) {
+        background-color: var(--color-white, #fff);
       }
-
-      @media (min-width: 48rem) {
-        .md\\:bg-white {
-          background-color: var(--color-white, #fff);
-        }
-      }
-      "
-    `)
+    }
+    "
+  `)
 })
 
 test('blocklisted candidates cannot be used with `@apply`', async () => {
-  await expect(
+  await expect(() =>
     compile(
       css`
         @theme reference {
@@ -1563,9 +1411,8 @@ test('blocklisted candidates cannot be used with `@apply`', async () => {
         }
       `,
       {
-        async loadModule(_id, base) {
+        async loadModule(id, base) {
           return {
-            path: '',
             base,
             module: {
               blocklist: ['bg-white'],
@@ -1575,12 +1422,12 @@ test('blocklisted candidates cannot be used with `@apply`', async () => {
       },
     ),
   ).rejects.toThrowErrorMatchingInlineSnapshot(
-    `[Error: Cannot apply utility class \`bg-white\` because it has been explicitly disabled: https://tailwindcss.com/docs/detecting-classes-in-source-files#explicitly-excluding-classes]`,
+    `[Error: Cannot apply unknown utility class: bg-white]`,
   )
 })
 
 test('old theme values are merged with their renamed counterparts in the CSS theme', async () => {
-  using didCallPluginFn = vi.fn()
+  let didCallPluginFn = vi.fn()
 
   await compile(
     css`
@@ -1616,9 +1463,8 @@ test('old theme values are merged with their renamed counterparts in the CSS the
       @plugin "./plugin.js";
     `,
     {
-      async loadModule(_id, base) {
+      async loadModule(id, base) {
         return {
-          path: '',
           base,
           module: plugin(function ({ theme }) {
             didCallPluginFn()
@@ -1704,146 +1550,52 @@ test('old theme values are merged with their renamed counterparts in the CSS the
 })
 
 test('handles setting theme keys to null', async () => {
-  expect(
-    await run(
-      ['bg-red-50', 'bg-red-100', 'bg-red-200'],
-      css`
-        @theme default {
-          --color-red-50: oklch(0.971 0.013 17.38);
-          --color-red-100: oklch(0.936 0.032 17.717);
-        }
-        @config "./my-config.js";
-        @tailwind utilities;
-        @theme {
-          --color-red-100: oklch(0.936 0.032 17.717);
-          --color-red-200: oklch(0.885 0.062 18.334);
-        }
-      `,
-      {
-        loadModule: async () => {
-          return {
-            module: {
-              theme: {
-                extend: {
-                  colors: {
-                    red: null,
-                  },
+  let compiler = await compile(
+    css`
+      @theme default {
+        --color-red-50: oklch(0.971 0.013 17.38);
+        --color-red-100: oklch(0.936 0.032 17.717);
+      }
+      @config "./my-config.js";
+      @tailwind utilities;
+      @theme {
+        --color-red-100: oklch(0.936 0.032 17.717);
+        --color-red-200: oklch(0.885 0.062 18.334);
+      }
+    `,
+    {
+      loadModule: async () => {
+        return {
+          module: {
+            theme: {
+              extend: {
+                colors: {
+                  red: null,
                 },
               },
             },
-            base: '/root',
-            path: '',
-          }
-        },
+          },
+          base: '/root',
+        }
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --color-red-50: oklch(97.1% .013 17.38);
-      --color-red-100: oklch(93.6% .032 17.717);
-      --color-red-200: oklch(88.5% .062 18.334);
-    }
+    },
+  )
 
+  expect(compiler.build(['bg-red-50', 'bg-red-100', 'bg-red-200'])).toMatchInlineSnapshot(`
+    ":root, :host {
+      --color-red-50: oklch(0.971 0.013 17.38);
+      --color-red-100: oklch(0.936 0.032 17.717);
+      --color-red-200: oklch(0.885 0.062 18.334);
+    }
     .bg-red-50 {
       background-color: var(--color-red-50);
     }
-
     .bg-red-100 {
       background-color: var(--color-red-100);
     }
-
     .bg-red-200 {
       background-color: var(--color-red-200);
     }
     "
   `)
 })
-
-test('The theme() function does not try indexing into strings', async () => {
-  expect(
-    await compileCss(css`
-      @theme default {
-        --color-what-50: #f00;
-        --color-what-950: #f00;
-      }
-
-      @theme {
-        /*
-       * The value of this theme variable is > 50 chars because colors.what.50 was previously
-       * indexing the string: "light-dark(theme(colors.what.950), theme(colors.what.50))"
-       * because the resolved config contained an object with a "what" key that was that string
-       */
-        --color-what: light-dark(theme(colors.what.950), theme(colors.what.50));
-      }
-
-      @source inline("text-what");
-
-      @tailwind utilities;
-    `),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --color-what: red;
-    }
-
-    .text-what {
-      color: var(--color-what);
-    }
-    "
-  `)
-})
-
-test('camel case keys are preserved', async () => {
-  expect(
-    await run(
-      [
-        // From CSS
-        'bg-blue-green', // should be output
-        'bg-blueGreen', // should not
-
-        // From JS config
-        'bg-light-green', // should not be output
-        'bg-lightGreen', // should be
-      ],
-      css`
-        @tailwind utilities;
-        @theme {
-          --color-blue-green: slate;
-        }
-        @config "./plugin.js";
-      `,
-      {
-        loadModule: async () => {
-          return {
-            base: '/',
-            path: '',
-            module: {
-              theme: {
-                extend: {
-                  backgroundColor: {
-                    lightGreen: '#c0ffee',
-                  },
-                },
-              },
-            },
-          }
-        },
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .bg-blue-green {
-      background-color: var(--color-blue-green);
-    }
-
-    .bg-lightGreen {
-      background-color: #c0ffee;
-    }
-
-    :root, :host {
-      --color-blue-green: slate;
-    }
-    "
-  `)
-})
diff --git a/packages/tailwindcss/src/compat/config/create-compat-config.test.ts b/packages/tailwindcss/src/compat/config/create-compat-config.test.ts
deleted file mode 100644
index aa1b21cb7..000000000
--- a/packages/tailwindcss/src/compat/config/create-compat-config.test.ts
+++ /dev/null
@@ -1,189 +0,0 @@
-import { describe, expect, test } from 'vitest'
-import { buildDesignSystem } from '../../design-system'
-import { Theme } from '../../theme'
-import { createCompatConfig } from './create-compat-config'
-import { resolveConfig } from './resolve-config'
-
-function buildCompatConfig(cssValues: Record<string, string>) {
-  let theme = new Theme()
-  for (let [key, value] of Object.entries(cssValues)) {
-    theme.add(key, value)
-  }
-  let design = buildDesignSystem(theme)
-
-  let { resolvedConfig } = resolveConfig(design, [
-    { config: createCompatConfig(design.theme), base: '/root', reference: true, src: undefined },
-  ])
-
-  return resolvedConfig
-}
-
-describe('theme namespace lookups', () => {
-  test('a namespace that only defines a bare value resolves to `{ DEFAULT: … }`, not a string', () => {
-    // When the CSS theme only defines `--text` (a single bare value),
-    // `theme('text', {})` used to return the string `'1rem'`.
-    //
-    // Spreading that string, like the compat config does, produced char-indexed
-    // garbage (`{ '0': '1', '1': 'r', … }`) instead of `{ DEFAULT: '1rem' }`.
-    let config = buildCompatConfig({ '--text': '1rem' })
-
-    expect(config.theme?.fontSize?.DEFAULT).toBe('1rem')
-    expect(config.theme?.fontSize).not.toHaveProperty('0')
-  })
-
-  test('a bare value is kept alongside suffixed values in the same namespace', () => {
-    let config = buildCompatConfig({
-      '--text': '1rem',
-      '--text-sm': '0.875rem',
-    })
-
-    expect(config.theme?.fontSize?.DEFAULT).toBe('1rem')
-    expect(config.theme?.fontSize?.sm).toBe('0.875rem')
-  })
-
-  test('a naive spread of a theme namespace in a user config is safe', () => {
-    let theme = new Theme()
-    theme.add('--text', '1rem')
-    let design = buildDesignSystem(theme)
-
-    let { resolvedConfig } = resolveConfig(design, [
-      {
-        config: {
-          theme: {
-            extend: {
-              fontSize: ({ theme }: any) => ({ ...theme('text', {}) }),
-            },
-          },
-        },
-        base: '/root',
-        reference: true,
-        src: undefined,
-      },
-    ])
-
-    expect(resolvedConfig.theme?.fontSize?.DEFAULT).toBe('1rem')
-    expect(resolvedConfig.theme?.fontSize).not.toHaveProperty('0')
-  })
-
-  test('namespace root lookups resolve to an object, key lookups resolve to the value', () => {
-    let theme = new Theme()
-    theme.add('--text', '1rem')
-    theme.add('--animate-spin', 'spin 1s linear infinite')
-    let design = buildDesignSystem(theme)
-
-    let root: unknown
-    let rootWithDefault: unknown
-    let leaf: unknown
-
-    resolveConfig(design, [
-      {
-        config: {
-          theme: {
-            extend: {
-              fontSize: ({ theme }: any) => {
-                root = theme('text')
-                rootWithDefault = theme('text', {})
-                leaf = theme('animate.spin')
-                return {}
-              },
-            },
-          },
-        },
-        base: '/root',
-        reference: true,
-        src: undefined,
-      },
-    ])
-
-    // A namespace root lookup always resolves to an object, like in v3, even
-    // when the namespace only contains a bare value
-    expect(root).toMatchObject({ DEFAULT: '1rem' })
-    expect(rootWithDefault).toMatchObject({ DEFAULT: '1rem' })
-
-    // Lookups of a specific key resolve to the value itself
-    expect(leaf).toBe('spin 1s linear infinite')
-  })
-
-  test('lookups of a specific key still resolve to the value itself', () => {
-    let theme = new Theme()
-    theme.add('--animate-spin', 'spin 1s linear infinite')
-    let design = buildDesignSystem(theme)
-
-    let { resolvedConfig } = resolveConfig(design, [
-      {
-        config: {
-          theme: {
-            extend: {
-              animation: ({ theme }: any) => ({ spin: theme('animate.spin') }),
-            },
-          },
-        },
-        base: '/root',
-        reference: true,
-        src: undefined,
-      },
-    ])
-
-    expect(resolvedConfig.theme?.animation?.spin).toBe('spin 1s linear infinite')
-  })
-})
-
-describe('createCompatConfig namespace mappings', () => {
-  test('fontSize maps from CSS text namespace', () => {
-    let config = buildCompatConfig({ '--text-base': '1rem' })
-    expect(config.theme?.fontSize?.base).toBe('1rem')
-  })
-
-  test('boxShadow maps from CSS shadow namespace', () => {
-    let config = buildCompatConfig({ '--shadow-md': '0 4px 6px #000' })
-    expect(config.theme?.boxShadow?.md).toBe('0 4px 6px #000')
-  })
-
-  test('animation maps from CSS animate namespace', () => {
-    let config = buildCompatConfig({ '--animate-spin': 'spin 1s linear infinite' })
-    expect(config.theme?.animation?.spin).toBe('spin 1s linear infinite')
-  })
-
-  test('aspectRatio maps from CSS aspect namespace', () => {
-    let config = buildCompatConfig({ '--aspect-square': '1 / 1' })
-    expect(config.theme?.aspectRatio?.square).toBe('1 / 1')
-  })
-
-  test('borderRadius maps from CSS radius namespace', () => {
-    let config = buildCompatConfig({ '--radius-lg': '0.5rem' })
-    expect(config.theme?.borderRadius?.lg).toBe('0.5rem')
-  })
-
-  test('screens maps from CSS breakpoint namespace', () => {
-    let config = buildCompatConfig({ '--breakpoint-sm': '640px' })
-    expect(config.theme?.screens?.sm).toBe('640px')
-  })
-
-  test('letterSpacing maps from CSS tracking namespace', () => {
-    let config = buildCompatConfig({ '--tracking-wide': '0.025em' })
-    expect(config.theme?.letterSpacing?.wide).toBe('0.025em')
-  })
-
-  test('lineHeight maps from CSS leading namespace', () => {
-    let config = buildCompatConfig({ '--leading-relaxed': '1.75' })
-    expect(config.theme?.lineHeight?.relaxed).toBe('1.75')
-  })
-
-  test('maxWidth maps from the container namespace in the default theme', () => {
-    let config = buildCompatConfig({})
-    // The default theme has container.sm = '24rem'
-    expect(config.theme?.maxWidth?.sm).toBe('24rem')
-  })
-
-  test('transitionDuration gets DEFAULT from --default-transition-duration', () => {
-    let config = buildCompatConfig({ '--default-transition-duration': '150ms' })
-    expect(config.theme?.transitionDuration?.DEFAULT).toBe('150ms')
-  })
-
-  test('transitionTimingFunction gets DEFAULT from --default-transition-timing-function', () => {
-    let config = buildCompatConfig({
-      '--default-transition-timing-function': 'cubic-bezier(0.4, 0, 0.2, 1)',
-    })
-    expect(config.theme?.transitionTimingFunction?.DEFAULT).toBe('cubic-bezier(0.4, 0, 0.2, 1)')
-  })
-})
diff --git a/packages/tailwindcss/src/compat/config/resolve-config.test.ts b/packages/tailwindcss/src/compat/config/resolve-config.test.ts
index d8cc21a10..d96bdc700 100644
--- a/packages/tailwindcss/src/compat/config/resolve-config.test.ts
+++ b/packages/tailwindcss/src/compat/config/resolve-config.test.ts
@@ -20,8 +20,6 @@ test('top level theme keys are replaced', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
     {
       config: {
@@ -32,8 +30,6 @@ test('top level theme keys are replaced', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
     {
       config: {
@@ -44,8 +40,6 @@ test('top level theme keys are replaced', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
 
@@ -79,8 +73,6 @@ test('theme can be extended', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
     {
       config: {
@@ -93,8 +85,6 @@ test('theme can be extended', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
 
@@ -130,8 +120,6 @@ test('theme keys can reference other theme keys using the theme function regardl
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
     {
       config: {
@@ -145,8 +133,6 @@ test('theme keys can reference other theme keys using the theme function regardl
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
     {
       config: {
@@ -159,8 +145,6 @@ test('theme keys can reference other theme keys using the theme function regardl
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
 
@@ -228,8 +212,6 @@ test('theme keys can read from the CSS theme', () => {
         },
       },
       base: '/root',
-      reference: false,
-      src: undefined,
     },
   ])
 
@@ -249,17 +231,17 @@ test('theme keys can read from the CSS theme', () => {
       },
       caretColor: {
         primary: {
-          '100': 'oklch(96.2% 0.044 156.743)',
-          '200': 'oklch(92.5% 0.084 155.995)',
-          '300': 'oklch(87.1% 0.15 154.449)',
-          '400': 'oklch(79.2% 0.209 151.711)',
-          '50': 'oklch(98.2% 0.018 155.826)',
-          '500': 'oklch(72.3% 0.219 149.579)',
-          '600': 'oklch(62.7% 0.194 149.214)',
-          '700': 'oklch(52.7% 0.154 150.069)',
-          '800': 'oklch(44.8% 0.119 151.328)',
-          '900': 'oklch(39.3% 0.095 152.535)',
-          '950': 'oklch(26.6% 0.065 152.934)',
+          '50': 'oklch(0.982 0.018 155.826)',
+          '100': 'oklch(0.962 0.044 156.743)',
+          '200': 'oklch(0.925 0.084 155.995)',
+          '300': 'oklch(0.871 0.15 154.449)',
+          '400': 'oklch(0.792 0.209 151.711)',
+          '500': 'oklch(0.723 0.219 149.579)',
+          '600': 'oklch(0.627 0.194 149.214)',
+          '700': 'oklch(0.527 0.154 150.069)',
+          '800': 'oklch(0.448 0.119 151.328)',
+          '900': 'oklch(0.393 0.095 152.535)',
+          '950': 'oklch(0.266 0.065 152.934)',
         },
       },
       transitionColor: {
@@ -292,7 +274,6 @@ test('handles null as theme values', () => {
       },
       base: '/root',
       reference: false,
-      src: undefined,
     },
     {
       config: {
@@ -306,7 +287,6 @@ test('handles null as theme values', () => {
       },
       base: '/root',
       reference: false,
-      src: undefined,
     },
   ])
 
diff --git a/packages/tailwindcss/src/compat/config/resolve-config.ts b/packages/tailwindcss/src/compat/config/resolve-config.ts
index 858f4bbbe..6801c7b60 100644
--- a/packages/tailwindcss/src/compat/config/resolve-config.ts
+++ b/packages/tailwindcss/src/compat/config/resolve-config.ts
@@ -1,5 +1,4 @@
 import type { DesignSystem } from '../../design-system'
-import type { SourceLocation } from '../../source-maps/source'
 import colors from '../colors'
 import type { PluginWithConfig } from '../plugin-api'
 import { createThemeFn } from '../plugin-functions'
@@ -17,7 +16,6 @@ export interface ConfigFile {
   base: string
   config: UserConfig
   reference: boolean
-  src: SourceLocation | undefined
 }
 
 interface ResolutionContext {
@@ -33,7 +31,6 @@ interface ResolutionContext {
 let minimal: ResolvedConfig = {
   blocklist: [],
   future: {},
-  experimental: {},
   prefix: '',
   important: false,
   darkMode: null,
@@ -134,7 +131,7 @@ export type PluginUtils = {
 
 function extractConfigs(
   ctx: ResolutionContext,
-  { config, base, path, reference, src }: ConfigFile,
+  { config, base, path, reference }: ConfigFile,
 ): void {
   let plugins: PluginWithConfig[] = []
 
@@ -143,17 +140,17 @@ function extractConfigs(
     if ('__isOptionsFunction' in plugin) {
       // Happens with `plugin.withOptions()` when no options were passed:
       // e.g. `require("my-plugin")` instead of `require("my-plugin")(options)`
-      plugins.push({ ...plugin(), reference, src })
+      plugins.push({ ...plugin(), reference })
     } else if ('handler' in plugin) {
       // Happens with `plugin(…)`:
       // e.g. `require("my-plugin")`
       //
       // or with `plugin.withOptions()` when the user passed options:
       // e.g. `require("my-plugin")(options)`
-      plugins.push({ ...plugin, reference, src })
+      plugins.push({ ...plugin, reference })
     } else {
       // Just a plain function without using the plugin(…) API
-      plugins.push({ handler: plugin, reference, src })
+      plugins.push({ handler: plugin, reference })
     }
   }
 
@@ -165,7 +162,7 @@ function extractConfigs(
   }
 
   for (let preset of config.presets ?? []) {
-    extractConfigs(ctx, { path, base, config: preset, reference, src })
+    extractConfigs(ctx, { path, base, config: preset, reference })
   }
 
   // Apply configs from plugins
@@ -173,13 +170,7 @@ function extractConfigs(
     ctx.plugins.push(plugin)
 
     if (plugin.config) {
-      extractConfigs(ctx, {
-        path,
-        base,
-        config: plugin.config,
-        reference: !!plugin.reference,
-        src: plugin.src ?? src,
-      })
+      extractConfigs(ctx, { path, base, config: plugin.config, reference: !!plugin.reference })
     }
   }
 
diff --git a/packages/tailwindcss/src/compat/config/types.ts b/packages/tailwindcss/src/compat/config/types.ts
index 76851a397..dbcb30de3 100644
--- a/packages/tailwindcss/src/compat/config/types.ts
+++ b/packages/tailwindcss/src/compat/config/types.ts
@@ -52,7 +52,7 @@ type DarkModeStrategy =
   // Use the `class` strategy with a custom class instead of `.dark`.
   | ['class', string]
 
-  // Use the `selector` strategy — same as `class` but uses `:where()` for more predictable behavior
+  // Use the `selector` strategy — same as `class` but uses `:where()` for more predicable behavior
   | 'selector'
 
   // Use the `selector` strategy with a custom selector instead of `.dark`.
@@ -105,12 +105,3 @@ export interface UserConfig {
 export interface ResolvedConfig {
   future: Record<string, boolean>
 }
-
-// `experimental` key support
-export interface UserConfig {
-  experimental?: 'all' | Record<string, boolean>
-}
-
-export interface ResolvedConfig {
-  experimental: Record<string, boolean>
-}
diff --git a/packages/tailwindcss/src/compat/container-config.test.ts b/packages/tailwindcss/src/compat/container-config.test.ts
index 39a12557c..b5618de84 100644
--- a/packages/tailwindcss/src/compat/container-config.test.ts
+++ b/packages/tailwindcss/src/compat/container-config.test.ts
@@ -1,74 +1,54 @@
 import { expect, test } from 'vitest'
-import { run } from '../test-utils/run'
+import { compile } from '..'
 
 const css = String.raw
 
 test('creates a custom utility to extend the built-in container', async () => {
-  expect(
-    await run(
-      ['container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                center: true,
-                padding: '2rem',
-              },
-            },
-          },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .container {
-      width: 100%;
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
     }
+    @config "./config.js";
+    @tailwind utilities;
+  `
 
-    @media (min-width: 40rem) {
-      .container {
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            center: true,
+            padding: '2rem',
+          },
+        },
+      },
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['container'])).toMatchInlineSnapshot(`
+    ".container {
+      width: 100%;
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
     .container {
       margin-inline: auto;
       padding-inline: 2rem;
@@ -78,87 +58,61 @@ test('creates a custom utility to extend the built-in container', async () => {
 })
 
 test('allows padding to be defined at custom breakpoints', async () => {
-  expect(
-    await run(
-      ['container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                padding: {
-                  // The order here is messed up on purpose
-                  '2xl': '3rem',
-                  DEFAULT: '1rem',
-                  lg: '2rem',
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            padding: {
+              // The order here is messed up on purpose
+              '2xl': '3rem',
+              DEFAULT: '1rem',
+              lg: '2rem',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .container {
-      width: 100%;
-    }
+      base: '/root',
+    }),
+  })
 
-    @media (min-width: 40rem) {
-      .container {
+  expect(compiler.build(['container'])).toMatchInlineSnapshot(`
+    ".container {
+      width: 100%;
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
     .container {
       padding-inline: 1rem;
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         padding-inline: 2rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         padding-inline: 3rem;
       }
     }
@@ -167,87 +121,61 @@ test('allows padding to be defined at custom breakpoints', async () => {
 })
 
 test('allows breakpoints to be overwritten', async () => {
-  expect(
-    await run(
-      ['container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                screens: {
-                  xl: '1280px',
-                  '2xl': '1536px',
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            screens: {
+              xl: '1280px',
+              '2xl': '1536px',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .container {
-      width: 100%;
-    }
+      base: '/root',
+    }),
+  })
 
-    @media (min-width: 40rem) {
-      .container {
+  expect(compiler.build(['container'])).toMatchInlineSnapshot(`
+    ".container {
+      width: 100%;
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
-    @media (min-width: 40rem) {
-      .container {
+    .container {
+      @media (width >= 40rem) {
         max-width: none;
       }
-    }
-
-    @media (min-width: 1280px) {
-      .container {
+      @media (width >= 1280px) {
         max-width: 1280px;
       }
-    }
-
-    @media (min-width: 1536px) {
-      .container {
+      @media (width >= 1536px) {
         max-width: 1536px;
       }
     }
@@ -256,84 +184,61 @@ test('allows breakpoints to be overwritten', async () => {
 })
 
 test('padding applies to custom `container` screens', async () => {
-  expect(
-    await run(
-      ['container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                padding: {
-                  sm: '2rem',
-                  md: '3rem',
-                },
-                screens: {
-                  md: '48rem',
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            padding: {
+              sm: '2rem',
+              md: '3rem',
+            },
+            screens: {
+              md: '48rem',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .container {
-      width: 100%;
-    }
+      base: '/root',
+    }),
+  })
 
-    @media (min-width: 40rem) {
-      .container {
+  expect(compiler.build(['container'])).toMatchInlineSnapshot(`
+    ".container {
+      width: 100%;
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
-    @media (min-width: 40rem) {
-      .container {
+    .container {
+      @media (width >= 40rem) {
         max-width: none;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
         padding-inline: 3rem;
       }
@@ -343,81 +248,58 @@ test('padding applies to custom `container` screens', async () => {
 })
 
 test("an empty `screen` config will undo all custom media screens and won't apply any breakpoint-specific padding", async () => {
-  expect(
-    await run(
-      ['container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                padding: {
-                  DEFAULT: '1rem',
-                  sm: '2rem',
-                  md: '3rem',
-                },
-                screens: {},
-              },
-            },
-          },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .container {
-      width: 100%;
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
     }
+    @config "./config.js";
+    @tailwind utilities;
+  `
 
-    @media (min-width: 40rem) {
-      .container {
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            padding: {
+              DEFAULT: '1rem',
+              sm: '2rem',
+              md: '3rem',
+            },
+            screens: {},
+          },
+        },
+      },
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['container'])).toMatchInlineSnapshot(`
+    ".container {
+      width: 100%;
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
     .container {
       padding-inline: 1rem;
-    }
-
-    @media (min-width: 40rem) {
-      .container {
+      @media (width >= 40rem) {
         max-width: none;
       }
     }
@@ -426,50 +308,45 @@ test("an empty `screen` config will undo all custom media screens and won't appl
 })
 
 test('legacy container component does not interfere with new --container variables', async () => {
-  expect(
-    await run(
-      ['max-w-sm'],
-      css`
-        @theme default {
-          --container-3xs: 16rem;
-          --container-2xs: 18rem;
-          --container-xs: 20rem;
-          --container-sm: 24rem;
-          --container-md: 28rem;
-          --container-lg: 32rem;
-          --container-xl: 36rem;
-          --container-2xl: 42rem;
-          --container-3xl: 48rem;
-          --container-4xl: 56rem;
-          --container-5xl: 64rem;
-          --container-6xl: 72rem;
-          --container-7xl: 80rem;
-          --container-prose: 65ch;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                center: true,
-                padding: '2rem',
-              },
-            },
+  let input = css`
+    @theme default {
+      --container-3xs: 16rem;
+      --container-2xs: 18rem;
+      --container-xs: 20rem;
+      --container-sm: 24rem;
+      --container-md: 28rem;
+      --container-lg: 32rem;
+      --container-xl: 36rem;
+      --container-2xl: 42rem;
+      --container-3xl: 48rem;
+      --container-4xl: 56rem;
+      --container-5xl: 64rem;
+      --container-6xl: 72rem;
+      --container-7xl: 80rem;
+      --container-prose: 65ch;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            center: true,
+            padding: '2rem',
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build(['max-w-sm'])).toMatchInlineSnapshot(`
+    ":root, :host {
       --container-sm: 24rem;
     }
-
     .max-w-sm {
       max-width: var(--container-sm);
     }
@@ -478,168 +355,107 @@ test('legacy container component does not interfere with new --container variabl
 })
 
 test('combines custom padding and screen overwrites', async () => {
-  expect(
-    await run(
-      ['container', '!container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                center: true,
-                padding: {
-                  DEFAULT: '2rem',
-                  '2xl': '4rem',
-                },
-                screens: {
-                  md: '48rem', // Matches a default --breakpoint
-                  xl: '1280px',
-                  '2xl': '1536px',
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            center: true,
+            padding: {
+              DEFAULT: '2rem',
+              '2xl': '4rem',
+            },
+            screens: {
+              md: '48rem', // Matches a default --breakpoint
+              xl: '1280px',
+              '2xl': '1536px',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .\\!container {
-      width: 100% !important;
-    }
+      base: '/root',
+    }),
+  })
 
-    @media (min-width: 40rem) {
-      .\\!container {
+  expect(compiler.build(['container', '!container'])).toMatchInlineSnapshot(`
+    ".\\!container {
+      width: 100% !important;
+      @media (width >= 40rem) {
         max-width: 40rem !important;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .\\!container {
+      @media (width >= 48rem) {
         max-width: 48rem !important;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .\\!container {
+      @media (width >= 64rem) {
         max-width: 64rem !important;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .\\!container {
+      @media (width >= 80rem) {
         max-width: 80rem !important;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .\\!container {
+      @media (width >= 96rem) {
         max-width: 96rem !important;
       }
     }
-
     .container {
       width: 100%;
-    }
-
-    @media (min-width: 40rem) {
-      .container {
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
     .\\!container {
       margin-inline: auto !important;
       padding-inline: 2rem !important;
-    }
-
-    @media (min-width: 40rem) {
-      .\\!container {
+      @media (width >= 40rem) {
         max-width: none !important;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .\\!container {
+      @media (width >= 48rem) {
         max-width: 48rem !important;
       }
-    }
-
-    @media (min-width: 1280px) {
-      .\\!container {
+      @media (width >= 1280px) {
         max-width: 1280px !important;
       }
-    }
-
-    @media (min-width: 1536px) {
-      .\\!container {
+      @media (width >= 1536px) {
         max-width: 1536px !important;
         padding-inline: 4rem !important;
       }
     }
-
     .container {
       margin-inline: auto;
       padding-inline: 2rem;
-    }
-
-    @media (min-width: 40rem) {
-      .container {
+      @media (width >= 40rem) {
         max-width: none;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 1280px) {
-      .container {
+      @media (width >= 1280px) {
         max-width: 1280px;
       }
-    }
-
-    @media (min-width: 1536px) {
-      .container {
+      @media (width >= 1536px) {
         max-width: 1536px;
         padding-inline: 4rem;
       }
@@ -649,106 +465,74 @@ test('combines custom padding and screen overwrites', async () => {
 })
 
 test('filters out complex breakpoints', async () => {
-  expect(
-    await run(
-      ['container'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              container: {
-                center: true,
-                padding: {
-                  DEFAULT: '2rem',
-                  '2xl': '4rem',
-                },
-                screens: {
-                  sm: '20px',
-                  md: { min: '100px' },
-                  lg: { max: '200px' },
-                  xl: { min: '300px', max: '400px' },
-                  '2xl': { raw: 'print' },
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          container: {
+            center: true,
+            padding: {
+              DEFAULT: '2rem',
+              '2xl': '4rem',
+            },
+            screens: {
+              sm: '20px',
+              md: { min: '100px' },
+              lg: { max: '200px' },
+              xl: { min: '300px', max: '400px' },
+              '2xl': { raw: 'print' },
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .container {
-      width: 100%;
-    }
+      base: '/root',
+    }),
+  })
 
-    @media (min-width: 40rem) {
-      .container {
+  expect(compiler.build(['container'])).toMatchInlineSnapshot(`
+    ".container {
+      width: 100%;
+      @media (width >= 40rem) {
         max-width: 40rem;
       }
-    }
-
-    @media (min-width: 48rem) {
-      .container {
+      @media (width >= 48rem) {
         max-width: 48rem;
       }
-    }
-
-    @media (min-width: 64rem) {
-      .container {
+      @media (width >= 64rem) {
         max-width: 64rem;
       }
-    }
-
-    @media (min-width: 80rem) {
-      .container {
+      @media (width >= 80rem) {
         max-width: 80rem;
       }
-    }
-
-    @media (min-width: 96rem) {
-      .container {
+      @media (width >= 96rem) {
         max-width: 96rem;
       }
     }
-
     .container {
       margin-inline: auto;
       padding-inline: 2rem;
-    }
-
-    @media (min-width: 40rem) {
-      .container {
+      @media (width >= 40rem) {
         max-width: none;
       }
-    }
-
-    @media (min-width: 20px) {
-      .container {
+      @media (width >= 20px) {
         max-width: 20px;
       }
-    }
-
-    @media (min-width: 100px) {
-      .container {
+      @media (width >= 100px) {
         max-width: 100px;
       }
-    }
-
-    @media (min-width: 300px) {
-      .container {
+      @media (width >= 300px) {
         max-width: 300px;
       }
     }
diff --git a/packages/tailwindcss/src/compat/container.ts b/packages/tailwindcss/src/compat/container.ts
index 98f23ce7a..3cf72c4db 100644
--- a/packages/tailwindcss/src/compat/container.ts
+++ b/packages/tailwindcss/src/compat/container.ts
@@ -1,4 +1,4 @@
-import { atRule, cloneAstNode, decl, type AstNode, type AtRule } from '../ast'
+import { atRule, decl, type AstNode, type AtRule } from '../ast'
 import type { DesignSystem } from '../design-system'
 import { compareBreakpoints } from '../utils/compare-breakpoints'
 import type { ResolvedConfig } from './config/types'
@@ -16,7 +16,7 @@ export function registerContainerCompat(userConfig: ResolvedConfig, designSystem
     return
   }
 
-  designSystem.utilities.static('container', () => rules.map(cloneAstNode))
+  designSystem.utilities.static('container', () => structuredClone(rules))
 }
 
 export function buildCustomContainerUtilityRules(
@@ -50,7 +50,7 @@ export function buildCustomContainerUtilityRules(
   if (typeof screens === 'object' && screens !== null) {
     breakpointOverwrites = new Map()
 
-    // When setting the `screens` in v3, you were overwriting the default
+    // When setting a the `screens` in v3, you were overwriting the default
     // screens config. To do this in v4, you have to manually unset all core
     // screens.
 
diff --git a/packages/tailwindcss/src/compat/default-theme.ts b/packages/tailwindcss/src/compat/default-theme.ts
index 90e699c1c..90f6e017c 100644
--- a/packages/tailwindcss/src/compat/default-theme.ts
+++ b/packages/tailwindcss/src/compat/default-theme.ts
@@ -156,7 +156,7 @@ export default {
     '3xl': '64px',
   },
   borderColor: ({ theme }) => ({
-    DEFAULT: 'currentcolor',
+    DEFAULT: 'currentColor',
     ...theme('colors'),
   }),
   borderOpacity: ({ theme }) => theme('opacity'),
@@ -353,13 +353,8 @@ export default {
   },
   fontFamily: {
     sans: [
-      '-apple-system',
-      'BlinkMacSystemFont',
-      '"Segoe UI"',
-      'Roboto',
-      '"Helvetica Neue"',
-      '"Noto Sans"',
-      'Arial',
+      'ui-sans-serif',
+      'system-ui',
       'sans-serif',
       '"Apple Color Emoji"',
       '"Segoe UI Emoji"',
@@ -830,7 +825,7 @@ export default {
   placeholderColor: ({ theme }) => theme('colors'),
   placeholderOpacity: ({ theme }) => theme('opacity'),
   ringColor: ({ theme }) => ({
-    DEFAULT: 'currentcolor',
+    DEFAULT: 'currentColor',
     ...theme('colors'),
   }),
   ringOffsetColor: ({ theme }) => theme('colors'),
diff --git a/packages/tailwindcss/src/compat/legacy-utilities.test.ts b/packages/tailwindcss/src/compat/legacy-utilities.test.ts
index c90eae845..9a828d673 100644
--- a/packages/tailwindcss/src/compat/legacy-utilities.test.ts
+++ b/packages/tailwindcss/src/compat/legacy-utilities.test.ts
@@ -1,23 +1,27 @@
 import { expect, test } from 'vitest'
-import { run } from '../test-utils/run'
+import { compileCss, run } from '../test-utils/run'
 
 const css = String.raw
 
 test('bg-gradient-*', async () => {
   expect(
-    await run([
-      'bg-gradient-to-t',
-      'bg-gradient-to-tr',
-      'bg-gradient-to-r',
-      'bg-gradient-to-br',
-      'bg-gradient-to-b',
-      'bg-gradient-to-bl',
-      'bg-gradient-to-l',
-      'bg-gradient-to-tl',
-    ]),
+    await compileCss(
+      css`
+        @tailwind utilities;
+      `,
+      [
+        'bg-gradient-to-t',
+        'bg-gradient-to-tr',
+        'bg-gradient-to-r',
+        'bg-gradient-to-br',
+        'bg-gradient-to-b',
+        'bg-gradient-to-bl',
+        'bg-gradient-to-l',
+        'bg-gradient-to-tl',
+      ],
+    ),
   ).toMatchInlineSnapshot(`
-    "
-    .bg-gradient-to-b {
+    ".bg-gradient-to-b {
       --tw-gradient-position: to bottom in oklab;
       background-image: linear-gradient(var(--tw-gradient-stops));
     }
@@ -55,21 +59,13 @@ test('bg-gradient-*', async () => {
     .bg-gradient-to-tr {
       --tw-gradient-position: to top right in oklab;
       background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-    "
+    }"
   `)
 })
 
 test('max-w-screen', async () => {
   expect(
-    await run(
-      [
-        'max-w-screen-sm',
-        'max-w-screen-md',
-        'max-w-screen-lg',
-        'max-w-screen-xl',
-        'max-w-screen-2xl',
-      ],
+    await compileCss(
       css`
         @theme {
           --breakpoint-sm: 40rem;
@@ -80,10 +76,16 @@ test('max-w-screen', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'max-w-screen-sm',
+        'max-w-screen-md',
+        'max-w-screen-lg',
+        'max-w-screen-xl',
+        'max-w-screen-2xl',
+      ],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --breakpoint-sm: 40rem;
       --breakpoint-md: 48rem;
       --breakpoint-lg: 64rem;
@@ -109,8 +111,7 @@ test('max-w-screen', async () => {
 
     .max-w-screen-xl {
       max-width: var(--breakpoint-xl);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -133,8 +134,7 @@ test('max-w-screen', async () => {
 
 test('box-decoration', async () => {
   expect(await run(['decoration-slice', 'decoration-clone'])).toMatchInlineSnapshot(`
-    "
-    .decoration-clone {
+    ".decoration-clone {
       -webkit-box-decoration-break: clone;
       box-decoration-break: clone;
     }
@@ -142,25 +142,21 @@ test('box-decoration', async () => {
     .decoration-slice {
       -webkit-box-decoration-break: slice;
       box-decoration-break: slice;
-    }
-    "
+    }"
   `)
 })
 
 test('overflow-ellipsis', async () => {
   expect(await run(['overflow-ellipsis'])).toMatchInlineSnapshot(`
-    "
-    .overflow-ellipsis {
+    ".overflow-ellipsis {
       text-overflow: ellipsis;
-    }
-    "
+    }"
   `)
 })
 
 test('flex-grow', async () => {
   expect(await run(['flex-grow', 'flex-grow-0', 'flex-grow-[123]'])).toMatchInlineSnapshot(`
-    "
-    .flex-grow {
+    ".flex-grow {
       flex-grow: 1;
     }
 
@@ -170,8 +166,7 @@ test('flex-grow', async () => {
 
     .flex-grow-\\[123\\] {
       flex-grow: 123;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -190,8 +185,7 @@ test('flex-grow', async () => {
 
 test('flex-shrink', async () => {
   expect(await run(['flex-shrink', 'flex-shrink-0', 'flex-shrink-[123]'])).toMatchInlineSnapshot(`
-    "
-    .flex-shrink {
+    ".flex-shrink {
       flex-shrink: 1;
     }
 
@@ -201,8 +195,7 @@ test('flex-shrink', async () => {
 
     .flex-shrink-\\[123\\] {
       flex-shrink: 123;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -218,181 +211,3 @@ test('flex-shrink', async () => {
     ]),
   ).toEqual('')
 })
-
-test('start', async () => {
-  expect(
-    await run(
-      [
-        'start-shadowned',
-        'start-auto',
-        '-start-full',
-        'start-full',
-        'start-3/4',
-        'start-4',
-        '-start-4',
-        'start-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing: .25rem;
-      --inset-shadowned: 1940px;
-    }
-
-    .-start-4 {
-      inset-inline-start: calc(var(--spacing) * -4);
-    }
-
-    .-start-full {
-      inset-inline-start: -100%;
-    }
-
-    .start-3\\/4 {
-      inset-inline-start: 75%;
-    }
-
-    .start-4 {
-      inset-inline-start: calc(var(--spacing) * 4);
-    }
-
-    .start-\\[4px\\] {
-      inset-inline-start: 4px;
-    }
-
-    .start-auto {
-      inset-inline-start: auto;
-    }
-
-    .start-full {
-      inset-inline-start: 100%;
-    }
-
-    .start-shadowned {
-      inset-inline-start: var(--inset-shadowned);
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'start-shadow-sm',
-        'start',
-        'start--1',
-        'start--1/2',
-        'start--1/-2',
-        'start-1/-2',
-        'start-auto/foo',
-        '-start-full/foo',
-        'start-full/foo',
-        'start-3/4/foo',
-        'start-4/foo',
-        '-start-4/foo',
-        'start-[4px]/foo',
-      ],
-      css`
-        @theme reference {
-          --spacing: 0.25rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toEqual('')
-})
-
-test('end', async () => {
-  expect(
-    await run(
-      [
-        'end-shadowned',
-        'end-auto',
-        '-end-full',
-        'end-full',
-        'end-3/4',
-        'end-4',
-        '-end-4',
-        'end-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing: .25rem;
-      --inset-shadowned: 1940px;
-    }
-
-    .-end-4 {
-      inset-inline-end: calc(var(--spacing) * -4);
-    }
-
-    .-end-full {
-      inset-inline-end: -100%;
-    }
-
-    .end-3\\/4 {
-      inset-inline-end: 75%;
-    }
-
-    .end-4 {
-      inset-inline-end: calc(var(--spacing) * 4);
-    }
-
-    .end-\\[4px\\] {
-      inset-inline-end: 4px;
-    }
-
-    .end-auto {
-      inset-inline-end: auto;
-    }
-
-    .end-full {
-      inset-inline-end: 100%;
-    }
-
-    .end-shadowned {
-      inset-inline-end: var(--inset-shadowned);
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'end-shadow-sm',
-        'end',
-        'end--1',
-        'end--1/2',
-        'end--1/-2',
-        'end-1/-2',
-        'end-auto/foo',
-        '-end-full/foo',
-        'end-full/foo',
-        'end-3/4/foo',
-        'end-4/foo',
-        '-end-4/foo',
-        'end-[4px]/foo',
-      ],
-      css`
-        @theme reference {
-          --spacing: 0.25rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toEqual('')
-})
diff --git a/packages/tailwindcss/src/compat/legacy-utilities.ts b/packages/tailwindcss/src/compat/legacy-utilities.ts
index 8e7829035..5711892d7 100644
--- a/packages/tailwindcss/src/compat/legacy-utilities.ts
+++ b/packages/tailwindcss/src/compat/legacy-utilities.ts
@@ -1,7 +1,6 @@
 import { decl } from '../ast'
 import type { DesignSystem } from '../design-system'
-import { isPositiveInteger, isValidSpacingMultiplier } from '../utils/infer-data-type'
-import { segment } from '../utils/segment'
+import { isPositiveInteger } from '../utils/infer-data-type'
 
 export function registerLegacyUtilities(designSystem: DesignSystem) {
   for (let [value, direction] of [
@@ -14,42 +13,12 @@ export function registerLegacyUtilities(designSystem: DesignSystem) {
     ['l', 'left'],
     ['tl', 'top left'],
   ]) {
-    designSystem.utilities.suggest(`bg-gradient-to-${value}`, () => [])
     designSystem.utilities.static(`bg-gradient-to-${value}`, () => [
       decl('--tw-gradient-position', `to ${direction} in oklab`),
       decl('background-image', `linear-gradient(var(--tw-gradient-stops))`),
     ])
   }
 
-  // Legacy `background-position` utilities for compatibility with v4.0 and earlier
-  designSystem.utilities.suggest('bg-left-top', () => [])
-  designSystem.utilities.static('bg-left-top', () => [decl('background-position', 'left top')])
-  designSystem.utilities.suggest('bg-right-top', () => [])
-  designSystem.utilities.static('bg-right-top', () => [decl('background-position', 'right top')])
-  designSystem.utilities.suggest('bg-left-bottom', () => [])
-  designSystem.utilities.static('bg-left-bottom', () => [
-    decl('background-position', 'left bottom'),
-  ])
-  designSystem.utilities.suggest('bg-right-bottom', () => [])
-  designSystem.utilities.static('bg-right-bottom', () => [
-    decl('background-position', 'right bottom'),
-  ])
-
-  // Legacy `object-position` utilities for compatibility with v4.0 and earlier
-  designSystem.utilities.suggest('object-left-top', () => [])
-  designSystem.utilities.static('object-left-top', () => [decl('object-position', 'left top')])
-  designSystem.utilities.suggest('object-right-top', () => [])
-  designSystem.utilities.static('object-right-top', () => [decl('object-position', 'right top')])
-  designSystem.utilities.suggest('object-left-bottom', () => [])
-  designSystem.utilities.static('object-left-bottom', () => [
-    decl('object-position', 'left bottom'),
-  ])
-  designSystem.utilities.suggest('object-right-bottom', () => [])
-  designSystem.utilities.static('object-right-bottom', () => [
-    decl('object-position', 'right bottom'),
-  ])
-
-  designSystem.utilities.suggest('max-w-screen', () => [])
   designSystem.utilities.functional('max-w-screen', (candidate) => {
     if (!candidate.value) return
     if (candidate.value.kind === 'arbitrary') return
@@ -58,22 +27,18 @@ export function registerLegacyUtilities(designSystem: DesignSystem) {
     return [decl('max-width', value)]
   })
 
-  designSystem.utilities.suggest('overflow-ellipsis', () => [])
   designSystem.utilities.static(`overflow-ellipsis`, () => [decl('text-overflow', `ellipsis`)])
 
-  designSystem.utilities.suggest('decoration-slice', () => [])
   designSystem.utilities.static(`decoration-slice`, () => [
     decl('-webkit-box-decoration-break', `slice`),
     decl('box-decoration-break', `slice`),
   ])
 
-  designSystem.utilities.suggest('decoration-clone', () => [])
   designSystem.utilities.static(`decoration-clone`, () => [
     decl('-webkit-box-decoration-break', `clone`),
     decl('box-decoration-break', `clone`),
   ])
 
-  designSystem.utilities.suggest('flex-shrink', () => [])
   designSystem.utilities.functional('flex-shrink', (candidate) => {
     if (candidate.modifier) return
 
@@ -90,7 +55,6 @@ export function registerLegacyUtilities(designSystem: DesignSystem) {
     }
   })
 
-  designSystem.utilities.suggest('flex-grow', () => [])
   designSystem.utilities.functional('flex-grow', (candidate) => {
     if (candidate.modifier) return
 
@@ -106,69 +70,4 @@ export function registerLegacyUtilities(designSystem: DesignSystem) {
       return [decl('flex-grow', candidate.value.value)]
     }
   })
-
-  designSystem.utilities.suggest('order-none', () => [])
-  designSystem.utilities.static('order-none', () => [decl('order', '0')])
-
-  designSystem.utilities.suggest('break-words', () => [])
-  designSystem.utilities.static('break-words', () => [decl('overflow-wrap', 'break-word')])
-
-  // Legacy `start` and `end` inset utilities, replaced by `inset-s` and `inset-e`
-  for (let [name, property] of [
-    ['start', 'inset-inline-start'],
-    ['end', 'inset-inline-end'],
-  ] as const) {
-    designSystem.utilities.static(`${name}-auto`, () => [decl(property, 'auto')])
-    designSystem.utilities.static(`${name}-full`, () => [decl(property, '100%')])
-    designSystem.utilities.static(`-${name}-full`, () => [decl(property, '-100%')])
-    designSystem.utilities.static(`${name}-px`, () => [decl(property, '1px')])
-    designSystem.utilities.static(`-${name}-px`, () => [decl(property, '-1px')])
-
-    function handleInset({ negative }: { negative: boolean }) {
-      return (candidate: Extract<import('../candidate').Candidate, { kind: 'functional' }>) => {
-        if (candidate.value === null) return
-
-        if (candidate.value.kind === 'arbitrary') {
-          if (candidate.modifier) return
-          let value = candidate.value.value
-          return [decl(property, negative ? `calc(${value} * -1)` : value)]
-        }
-
-        let value = designSystem.theme.resolve(candidate.value.fraction ?? candidate.value.value, [
-          '--inset',
-          '--spacing',
-        ])
-
-        // Handle fractions like `start-1/2`
-        if (value === null && candidate.value.fraction) {
-          let [lhs, rhs] = segment(candidate.value.fraction, '/')
-          if (!isPositiveInteger(lhs) || !isPositiveInteger(rhs)) return
-          value = `calc(${candidate.value.fraction} * 100%)`
-        }
-
-        // Handle bare spacing multiplier values like `start-4`
-        if (value === null && negative) {
-          let multiplier = designSystem.theme.resolve(null, ['--spacing'])
-          if (multiplier && isValidSpacingMultiplier(candidate.value.value)) {
-            value = `calc(${multiplier} * -${candidate.value.value})`
-            if (value !== null) return [decl(property, value)]
-          }
-        }
-
-        if (value === null) {
-          let multiplier = designSystem.theme.resolve(null, ['--spacing'])
-          if (multiplier && isValidSpacingMultiplier(candidate.value.value)) {
-            value = `calc(${multiplier} * ${candidate.value.value})`
-          }
-        }
-
-        if (value === null) return
-
-        return [decl(property, negative ? `calc(${value} * -1)` : value)]
-      }
-    }
-
-    designSystem.utilities.functional(`-${name}`, handleInset({ negative: true }))
-    designSystem.utilities.functional(name, handleInset({ negative: false }))
-  }
 }
diff --git a/packages/tailwindcss/src/compat/plugin-api.test.ts b/packages/tailwindcss/src/compat/plugin-api.test.ts
index 5fcacb5cd..b786f2311 100644
--- a/packages/tailwindcss/src/compat/plugin-api.test.ts
+++ b/packages/tailwindcss/src/compat/plugin-api.test.ts
@@ -1,7 +1,7 @@
 import { describe, expect, test, vi } from 'vitest'
 import { compile } from '..'
 import plugin from '../plugin'
-import { compileCss, run } from '../test-utils/run'
+import { optimizeCss } from '../test-utils/run'
 import defaultTheme from './default-theme'
 import type { CssInJs, PluginAPI } from './plugin-api'
 
@@ -9,61 +9,57 @@ const css = String.raw
 
 describe('theme', async () => {
   test('plugin theme can contain objects', async () => {
-    expect(
-      await compileCss(
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ addBase, theme }) {
-                  addBase({
-                    '@keyframes enter': theme('keyframes.enter'),
-                    '@keyframes exit': theme('keyframes.exit'),
-                  })
-                },
-                {
-                  theme: {
-                    extend: {
-                      keyframes: {
-                        enter: {
-                          from: {
-                            opacity: 'var(--tw-enter-opacity, 1)',
-                            transform:
-                              'translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0))',
-                          },
-                        },
-                        exit: {
-                          to: {
-                            opacity: 'var(--tw-exit-opacity, 1)',
-                            transform:
-                              'translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0))',
-                          },
-                        },
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ addBase, theme }) {
+              addBase({
+                '@keyframes enter': theme('keyframes.enter'),
+                '@keyframes exit': theme('keyframes.exit'),
+              })
+            },
+            {
+              theme: {
+                extend: {
+                  keyframes: {
+                    enter: {
+                      from: {
+                        opacity: 'var(--tw-enter-opacity, 1)',
+                        transform:
+                          'translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0))',
+                      },
+                    },
+                    exit: {
+                      to: {
+                        opacity: 'var(--tw-exit-opacity, 1)',
+                        transform:
+                          'translate3d(var(--tw-exit-translate-x, 0), var(--tw-exit-translate-y, 0), 0) scale3d(var(--tw-exit-scale, 1), var(--tw-exit-scale, 1), var(--tw-exit-scale, 1)) rotate(var(--tw-exit-rotate, 0))',
                       },
                     },
                   },
                 },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
+              },
+            },
+          ),
+        }
+      },
+    })
+
+    expect(compiler.build([])).toMatchInlineSnapshot(`
+      "@layer base {
         @keyframes enter {
           from {
             opacity: var(--tw-enter-opacity, 1);
             transform: translate3d(var(--tw-enter-translate-x, 0), var(--tw-enter-translate-y, 0), 0) scale3d(var(--tw-enter-scale, 1), var(--tw-enter-scale, 1), var(--tw-enter-scale, 1)) rotate(var(--tw-enter-rotate, 0));
           }
         }
-
         @keyframes exit {
           to {
             opacity: var(--tw-exit-opacity, 1);
@@ -76,29 +72,30 @@ describe('theme', async () => {
   })
 
   test('keyframes added via addUtilities are appended to the AST', async () => {
-    expect(
-      await compileCss(
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ addUtilities }) {
-                addUtilities({
-                  '@keyframes enter': { from: { opacity: 'var(--tw-enter-opacity, 1)' } },
-                })
-              }),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @keyframes enter {
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(function ({ addUtilities, theme }) {
+            addUtilities({
+              '@keyframes enter': {
+                from: {
+                  opacity: 'var(--tw-enter-opacity, 1)',
+                },
+              },
+            })
+          }),
+        }
+      },
+    })
+
+    expect(compiler.build([])).toMatchInlineSnapshot(`
+      "@keyframes enter {
         from {
           opacity: var(--tw-enter-opacity, 1);
         }
@@ -108,40 +105,47 @@ describe('theme', async () => {
   })
 
   test('plugin theme can extend colors', async () => {
-    expect(
-      await run(
-        ['scrollbar-red-500', 'scrollbar-russet-700'],
-        css`
-          @theme reference {
-            --color-red-500: #ef4444;
-          }
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { scrollbar: (value) => ({ 'scrollbar-color': value }) },
-                    { values: theme('colors') },
-                  )
+    let input = css`
+      @theme reference {
+        --color-red-500: #ef4444;
+      }
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  scrollbar: (value) => ({ 'scrollbar-color': value }),
                 },
-                { theme: { extend: { colors: { 'russet-700': '#7a4724' } } } },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .scrollbar-red-500 {
+                {
+                  values: theme('colors'),
+                },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  colors: {
+                    'russet-700': '#7a4724',
+                  },
+                },
+              },
+            },
+          ),
+        }
+      },
+    })
+
+    expect(compiler.build(['scrollbar-red-500', 'scrollbar-russet-700'])).toMatchInlineSnapshot(`
+      ".scrollbar-red-500 {
         scrollbar-color: #ef4444;
       }
-
       .scrollbar-russet-700 {
         scrollbar-color: #7a4724;
       }
@@ -152,43 +156,45 @@ describe('theme', async () => {
   test('plugin theme values can reference legacy theme keys that have been replaced with bare value support', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['animate-duration-316'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { 'animate-duration': (value) => ({ 'animation-duration': value }) },
-                    { values: theme('animationDuration') },
-                  )
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  'animate-duration': (value) => ({ 'animation-duration': value }),
                 },
                 {
-                  theme: {
-                    extend: {
-                      animationDuration: ({ theme }: { theme: (path: string) => any }) => {
-                        return { ...theme('transitionDuration') }
-                      },
-                    },
+                  values: theme('animationDuration'),
+                },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  animationDuration: ({ theme }: { theme: (path: string) => any }) => {
+                    return {
+                      ...theme('transitionDuration'),
+                    }
                   },
                 },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animate-duration-316 {
-        animation-duration: .316s;
+              },
+            },
+          ),
+        }
+      },
+    })
+
+    expect(compiler.build(['animate-duration-316'])).toMatchInlineSnapshot(`
+      ".animate-duration-316 {
+        animation-duration: 316ms;
       }
       "
     `)
@@ -197,402 +203,433 @@ describe('theme', async () => {
   test('plugin theme values that support bare values are merged with other values for that theme key', async ({
     expect,
   }) => {
-    expect(
-      await run(
-        ['animate-duration-316', 'animate-duration-slow'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { 'animate-duration': (value) => ({ 'animation-duration': value }) },
-                    { values: theme('animationDuration') },
-                  )
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  'animate-duration': (value) => ({ 'animation-duration': value }),
                 },
                 {
-                  theme: {
-                    extend: {
-                      transitionDuration: { slow: '800ms' },
-                      animationDuration: ({ theme }: { theme: (path: string) => any }) => ({
-                        ...theme('transitionDuration'),
-                      }),
-                    },
-                  },
+                  values: theme('animationDuration'),
                 },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animate-duration-316 {
-        animation-duration: .316s;
-      }
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  transitionDuration: {
+                    slow: '800ms',
+                  },
 
+                  animationDuration: ({ theme }: { theme: (path: string) => any }) => ({
+                    ...theme('transitionDuration'),
+                  }),
+                },
+              },
+            },
+          ),
+        }
+      },
+    })
+
+    expect(compiler.build(['animate-duration-316', 'animate-duration-slow']))
+      .toMatchInlineSnapshot(`
+      ".animate-duration-316 {
+        animation-duration: 316ms;
+      }
       .animate-duration-slow {
-        animation-duration: .8s;
+        animation-duration: 800ms;
       }
       "
     `)
   })
 
   test('plugin theme can have opacity modifiers', async () => {
-    expect(
-      await run(
-        ['percentage', 'fraction', 'variable'],
-        css`
-          @tailwind utilities;
-          @theme {
-            --color-red-500: #ef4444;
-          }
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ addUtilities, theme }) {
-                addUtilities({
-                  '.percentage': { color: theme('colors.red.500 / 50%') },
-                  '.fraction': { color: theme('colors.red.500 / 0.5') },
-                  '.variable': { color: theme('colors.red.500 / var(--opacity)') },
-                })
-              }),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .fraction, .percentage {
-        color: oklab(63.6834% .187 .088 / .5);
+    let input = css`
+      @tailwind utilities;
+      @theme {
+        --color-red-500: #ef4444;
       }
+      @plugin "my-plugin";
+    `
 
-      .variable {
-        color: #ef4444;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .variable {
-          color: color-mix(in oklab, #ef4444 var(--opacity), transparent);
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(function ({ addUtilities, theme }) {
+            addUtilities({
+              '.percentage': {
+                color: theme('colors.red.500 / 50%'),
+              },
+              '.fraction': {
+                color: theme('colors.red.500 / 0.5'),
+              },
+              '.variable': {
+                color: theme('colors.red.500 / var(--opacity)'),
+              },
+            })
+          }),
         }
+      },
+    })
+
+    expect(compiler.build(['percentage', 'fraction', 'variable'])).toMatchInlineSnapshot(`
+      ".fraction {
+        color: color-mix(in oklab, #ef4444 50%, transparent);
+      }
+      .percentage {
+        color: color-mix(in oklab, #ef4444 50%, transparent);
+      }
+      .variable {
+        color: color-mix(in oklab, #ef4444 var(--opacity), transparent);
       }
       "
     `)
   })
 
   test('plugin theme colors can use <alpha-value>', async () => {
+    let input = css`
+      @tailwind utilities;
+      @theme {
+        /* This should not work */
+        --color-custom-css: rgba(255 0 0 / <alpha-value>);
+      }
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ addUtilities, theme }) {
+              addUtilities({
+                '.css-percentage': {
+                  color: theme('colors.custom-css / 50%'),
+                },
+                '.css-fraction': {
+                  color: theme('colors.custom-css / 0.5'),
+                },
+                '.css-variable': {
+                  color: theme('colors.custom-css / var(--opacity)'),
+                },
+                '.js-percentage': {
+                  color: theme('colors.custom-js / 50%'),
+                },
+                '.js-fraction': {
+                  color: theme('colors.custom-js / 0.5'),
+                },
+                '.js-variable': {
+                  color: theme('colors.custom-js / var(--opacity)'),
+                },
+              })
+            },
+            {
+              theme: {
+                colors: {
+                  /* This should work */
+                  'custom-js': 'rgb(255 0 0 / <alpha-value>)',
+                },
+              },
+            },
+          ),
+        }
+      },
+    })
+
     expect(
-      await run(
-        [
-          'bg-custom',
-          'css-percentage',
-          'css-fraction',
-          'css-variable',
-          'js-percentage',
-          'js-fraction',
-          'js-variable',
-        ],
-        css`
-          @tailwind utilities;
-          @theme {
-            /* This should not work */
-            --color-custom-css: rgba(255 0 0 / <alpha-value>);
-          }
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ addUtilities, theme }) {
-                  addUtilities({
-                    '.css-percentage': { color: theme('colors.custom-css / 50%') },
-                    '.css-fraction': { color: theme('colors.custom-css / 0.5') },
-                    '.css-variable': { color: theme('colors.custom-css / var(--opacity)') },
-                    '.js-percentage': { color: theme('colors.custom-js / 50%') },
-                    '.js-fraction': { color: theme('colors.custom-js / 0.5') },
-                    '.js-variable': { color: theme('colors.custom-js / var(--opacity)') },
-                  })
-                },
-                {
-                  theme: {
-                    colors: {
-                      /* This should work */
-                      'custom-js': 'rgb(255 0 0 / <alpha-value>)',
-                    },
-                  },
-                },
-              ),
-            }
-          },
-        },
-      ),
+      compiler.build([
+        'bg-custom',
+        'css-percentage',
+        'css-fraction',
+        'css-variable',
+        'js-percentage',
+        'js-fraction',
+        'js-variable',
+      ]),
     ).toMatchInlineSnapshot(`
-      "
-      .css-fraction, .css-percentage {
+      ".css-fraction {
+        color: color-mix(in oklab, rgba(255 0 0 / <alpha-value>) 50%, transparent);
+      }
+      .css-percentage {
         color: color-mix(in oklab, rgba(255 0 0 / <alpha-value>) 50%, transparent);
       }
-
       .css-variable {
-        color: rgba(255 0 0 / <alpha-value>);
+        color: color-mix(in oklab, rgba(255 0 0 / <alpha-value>) var(--opacity), transparent);
       }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .css-variable {
-          color: color-mix(in oklab, rgba(255 0 0 / <alpha-value>) var(--opacity), transparent);
-        }
+      .js-fraction {
+        color: color-mix(in oklab, rgb(255 0 0 / 1) 50%, transparent);
       }
-
-      .js-fraction, .js-percentage {
-        color: oklab(62.7955% .224 .125 / .5);
+      .js-percentage {
+        color: color-mix(in oklab, rgb(255 0 0 / 1) 50%, transparent);
       }
-
       .js-variable {
-        color: red;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .js-variable {
-          color: color-mix(in oklab, red var(--opacity), transparent);
-        }
+        color: color-mix(in oklab, rgb(255 0 0 / 1) var(--opacity), transparent);
       }
       "
     `)
   })
 
   test('theme value functions are resolved correctly regardless of order', async () => {
-    expect(
-      await run(
-        ['animate-delay-316', 'animate-delay-slow'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { 'animate-delay': (value) => ({ 'animation-delay': value }) },
-                    { values: theme('animationDelay') },
-                  )
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  'animate-delay': (value) => ({ 'animation-delay': value }),
                 },
                 {
-                  theme: {
-                    extend: {
-                      animationDuration: ({ theme }: { theme: (path: string) => any }) => ({
-                        ...theme('transitionDuration'),
-                      }),
-                      animationDelay: ({ theme }: { theme: (path: string) => any }) => ({
-                        ...theme('animationDuration'),
-                      }),
-                      transitionDuration: { slow: '800ms' },
-                    },
+                  values: theme('animationDelay'),
+                },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  animationDuration: ({ theme }: { theme: (path: string) => any }) => ({
+                    ...theme('transitionDuration'),
+                  }),
+
+                  animationDelay: ({ theme }: { theme: (path: string) => any }) => ({
+                    ...theme('animationDuration'),
+                  }),
+
+                  transitionDuration: {
+                    slow: '800ms',
                   },
                 },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animate-delay-316 {
-        animation-delay: .316s;
-      }
+              },
+            },
+          ),
+        }
+      },
+    })
 
+    expect(compiler.build(['animate-delay-316', 'animate-delay-slow'])).toMatchInlineSnapshot(`
+      ".animate-delay-316 {
+        animation-delay: 316ms;
+      }
       .animate-delay-slow {
-        animation-delay: .8s;
+        animation-delay: 800ms;
       }
       "
     `)
   })
 
   test('plugins can override the default key', async () => {
-    expect(
-      await run(
-        ['animate-duration'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { 'animate-duration': (value) => ({ 'animation-delay': value }) },
-                    { values: theme('transitionDuration') },
-                  )
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  'animate-duration': (value) => ({ 'animation-delay': value }),
                 },
-                { theme: { extend: { transitionDuration: { DEFAULT: '1500ms' } } } },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animate-duration {
-        animation-delay: 1.5s;
+                {
+                  values: theme('transitionDuration'),
+                },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  transitionDuration: {
+                    DEFAULT: '1500ms',
+                  },
+                },
+              },
+            },
+          ),
+        }
+      },
+    })
+
+    expect(compiler.build(['animate-duration'])).toMatchInlineSnapshot(`
+      ".animate-duration {
+        animation-delay: 1500ms;
       }
       "
     `)
   })
 
   test('plugins can read CSS theme keys using the old theme key notation', async () => {
-    expect(
-      await run(
-        ['animation-spin', 'animation', 'animation2', 'animation2-twist'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-          @theme reference {
-            --animate: pulse 1s linear infinite;
-            --animate-spin: spin 1s linear infinite;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ matchUtilities, theme }) {
-                matchUtilities(
-                  { animation: (value) => ({ animation: value }) },
-                  { values: theme('animation') },
-                )
-
-                matchUtilities(
-                  { animation2: (value) => ({ animation: value }) },
-                  {
-                    values: { DEFAULT: theme('animation.DEFAULT'), twist: theme('animation.spin') },
-                  },
-                )
-              }),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animation {
-        animation: 1s linear infinite pulse;
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+      @theme reference {
+        --animate: pulse 1s linear infinite;
+        --animate-spin: spin 1s linear infinite;
       }
+    `
 
-      .animation-spin {
-        animation: 1s linear infinite spin;
-      }
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(function ({ matchUtilities, theme }) {
+            matchUtilities(
+              {
+                animation: (value) => ({ animation: value }),
+              },
+              {
+                values: theme('animation'),
+              },
+            )
 
-      .animation2 {
-        animation: 1s linear infinite pulse;
-      }
+            matchUtilities(
+              {
+                animation2: (value) => ({ animation: value }),
+              },
+              {
+                values: {
+                  DEFAULT: theme('animation.DEFAULT'),
+                  twist: theme('animation.spin'),
+                },
+              },
+            )
+          }),
+        }
+      },
+    })
 
-      .animation2-twist {
-        animation: 1s linear infinite spin;
-      }
-      "
-    `)
+    expect(compiler.build(['animation-spin', 'animation', 'animation2', 'animation2-twist']))
+      .toMatchInlineSnapshot(`
+        ".animation {
+          animation: pulse 1s linear infinite;
+        }
+        .animation-spin {
+          animation: spin 1s linear infinite;
+        }
+        .animation2 {
+          animation: pulse 1s linear infinite;
+        }
+        .animation2-twist {
+          animation: spin 1s linear infinite;
+        }
+        "
+      `)
   })
 
   test('CSS theme values are merged with JS theme values', async () => {
-    expect(
-      await run(
-        ['animation', 'animation-spin', 'animation-bounce'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-          @theme reference {
-            --animate: pulse 1s linear infinite;
-            --animate-spin: spin 1s linear infinite;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { animation: (value) => ({ '--animation': value }) },
-                    { values: theme('animation') },
-                  )
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+      @theme reference {
+        --animate: pulse 1s linear infinite;
+        --animate-spin: spin 1s linear infinite;
+      }
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  animation: (value) => ({ '--animation': value }),
                 },
-                { theme: { extend: { animation: { bounce: 'bounce 1s linear infinite' } } } },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animation {
-        --animation: pulse 1s linear infinite;
-      }
+                {
+                  values: theme('animation'),
+                },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  animation: {
+                    bounce: 'bounce 1s linear infinite',
+                  },
+                },
+              },
+            },
+          ),
+        }
+      },
+    })
 
-      .animation-bounce {
-        --animation: bounce 1s linear infinite;
-      }
-
-      .animation-spin {
-        --animation: spin 1s linear infinite;
-      }
-      "
-    `)
+    expect(compiler.build(['animation', 'animation-spin', 'animation-bounce']))
+      .toMatchInlineSnapshot(`
+        ".animation {
+          --animation: pulse 1s linear infinite;
+        }
+        .animation-bounce {
+          --animation: bounce 1s linear infinite;
+        }
+        .animation-spin {
+          --animation: spin 1s linear infinite;
+        }
+        "
+      `)
   })
 
   test('CSS theme defaults take precedence over JS theme defaults', async () => {
-    expect(
-      await run(
-        ['animation'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-          @theme reference {
-            --animate: pulse 1s linear infinite;
-            --animate-spin: spin 1s linear infinite;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { animation: (value) => ({ '--animation': value }) },
-                    { values: theme('animation') },
-                  )
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+      @theme reference {
+        --animate: pulse 1s linear infinite;
+        --animate-spin: spin 1s linear infinite;
+      }
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                {
+                  animation: (value) => ({ '--animation': value }),
                 },
-                { theme: { extend: { animation: { DEFAULT: 'twist 1s linear infinite' } } } },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .animation {
+                {
+                  values: theme('animation'),
+                },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  animation: {
+                    DEFAULT: 'twist 1s linear infinite',
+                  },
+                },
+              },
+            },
+          ),
+        }
+      },
+    })
+
+    expect(compiler.build(['animation'])).toMatchInlineSnapshot(`
+      ".animation {
         --animation: pulse 1s linear infinite;
       }
       "
@@ -609,19 +646,24 @@ describe('theme', async () => {
       }
     `
 
-    using fn = vi.fn()
+    let fn = vi.fn()
 
     await compile(input, {
-      loadModule: async (_id, base) => {
+      loadModule: async (id, base) => {
         return {
-          path: '',
           base,
           module: plugin(
             function ({ theme }) {
               fn(theme('animation.simple'))
             },
             {
-              theme: { extend: { animation: { simple: 'simple 1s linear' } } },
+              theme: {
+                extend: {
+                  animation: {
+                    simple: 'simple 1s linear',
+                  },
+                },
+              },
             },
           ),
         }
@@ -635,259 +677,240 @@ describe('theme', async () => {
     })
   })
 
-  test('theme() resolves the DEFAULT value when a bare CSS theme key shares a prefix with a sibling key', async () => {
-    expect(
-      await run(
-        ['example-foo', 'example-foo-bar'],
-        css`
-          @tailwind utilities;
-          @theme {
-            --color-foo: red;
-            --color-foo-bar: blue;
-          }
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ addUtilities, theme }) {
-                addUtilities({
-                  '.example-foo': { color: theme('colors.foo') },
-                  '.example-foo-bar': { color: theme('colors.foo-bar') },
-                })
-              }),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .example-foo {
-        color: red;
-      }
-
-      .example-foo-bar {
-        color: #00f;
-      }
-      "
-    `)
-  })
-
   test('all necessary theme keys support bare values', async () => {
-    expect(
-      await run(
-        [
-          'my-aspect-2/5',
-          'my-backdrop-brightness-1',
-          'my-backdrop-contrast-1',
-          'my-backdrop-grayscale-1',
-          'my-backdrop-hue-rotate-1',
-          'my-backdrop-invert-1',
-          'my-backdrop-opacity-1',
-          'my-backdrop-saturate-1',
-          'my-backdrop-sepia-1',
-          'my-border-width-1',
-          'my-brightness-1',
-          'my-columns-1',
-          'my-contrast-1',
-          'my-divide-width-1',
-          'my-flex-grow-1',
-          'my-flex-shrink-1',
-          'my-gradient-color-stop-positions-1',
-          'my-grayscale-1',
-          'my-grid-row-end-1',
-          'my-grid-row-start-1',
-          'my-grid-template-columns-1',
-          'my-grid-template-rows-1',
-          'my-hue-rotate-1',
-          'my-invert-1',
-          'my-line-clamp-1',
-          'my-opacity-1',
-          'my-order-1',
-          'my-outline-offset-1',
-          'my-outline-width-1',
-          'my-ring-offset-width-1',
-          'my-ring-width-1',
-          'my-rotate-1',
-          'my-saturate-1',
-          'my-scale-1',
-          'my-sepia-1',
-          'my-skew-1',
-          'my-stroke-width-1',
-          'my-text-decoration-thickness-1',
-          'my-text-underline-offset-1',
-          'my-transition-delay-1',
-          'my-transition-duration-1',
-          'my-z-index-1',
-        ],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ matchUtilities, theme }) {
-                function utility(name: string, themeKey: string) {
-                  matchUtilities(
-                    { [name]: (value) => ({ '--value': value }) },
-                    { values: theme(themeKey) },
-                  )
-                }
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
 
-                utility('my-aspect', 'aspectRatio')
-                utility('my-backdrop-brightness', 'backdropBrightness')
-                utility('my-backdrop-contrast', 'backdropContrast')
-                utility('my-backdrop-grayscale', 'backdropGrayscale')
-                utility('my-backdrop-hue-rotate', 'backdropHueRotate')
-                utility('my-backdrop-invert', 'backdropInvert')
-                utility('my-backdrop-opacity', 'backdropOpacity')
-                utility('my-backdrop-saturate', 'backdropSaturate')
-                utility('my-backdrop-sepia', 'backdropSepia')
-                utility('my-border-width', 'borderWidth')
-                utility('my-brightness', 'brightness')
-                utility('my-columns', 'columns')
-                utility('my-contrast', 'contrast')
-                utility('my-divide-width', 'divideWidth')
-                utility('my-flex-grow', 'flexGrow')
-                utility('my-flex-shrink', 'flexShrink')
-                utility('my-gradient-color-stop-positions', 'gradientColorStopPositions')
-                utility('my-grayscale', 'grayscale')
-                utility('my-grid-row-end', 'gridRowEnd')
-                utility('my-grid-row-start', 'gridRowStart')
-                utility('my-grid-template-columns', 'gridTemplateColumns')
-                utility('my-grid-template-rows', 'gridTemplateRows')
-                utility('my-hue-rotate', 'hueRotate')
-                utility('my-invert', 'invert')
-                utility('my-line-clamp', 'lineClamp')
-                utility('my-opacity', 'opacity')
-                utility('my-order', 'order')
-                utility('my-outline-offset', 'outlineOffset')
-                utility('my-outline-width', 'outlineWidth')
-                utility('my-ring-offset-width', 'ringOffsetWidth')
-                utility('my-ring-width', 'ringWidth')
-                utility('my-rotate', 'rotate')
-                utility('my-saturate', 'saturate')
-                utility('my-scale', 'scale')
-                utility('my-sepia', 'sepia')
-                utility('my-skew', 'skew')
-                utility('my-stroke-width', 'strokeWidth')
-                utility('my-text-decoration-thickness', 'textDecorationThickness')
-                utility('my-text-underline-offset', 'textUnderlineOffset')
-                utility('my-transition-delay', 'transitionDelay')
-                utility('my-transition-duration', 'transitionDuration')
-                utility('my-z-index', 'zIndex')
-              }),
+    let { build } = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(function ({ matchUtilities, theme }) {
+            function utility(name: string, themeKey: string) {
+              matchUtilities(
+                { [name]: (value) => ({ '--value': value }) },
+                { values: theme(themeKey) },
+              )
             }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .my-aspect-2\\/5 {
+
+            utility('my-aspect', 'aspectRatio')
+            utility('my-backdrop-brightness', 'backdropBrightness')
+            utility('my-backdrop-contrast', 'backdropContrast')
+            utility('my-backdrop-grayscale', 'backdropGrayscale')
+            utility('my-backdrop-hue-rotate', 'backdropHueRotate')
+            utility('my-backdrop-invert', 'backdropInvert')
+            utility('my-backdrop-opacity', 'backdropOpacity')
+            utility('my-backdrop-saturate', 'backdropSaturate')
+            utility('my-backdrop-sepia', 'backdropSepia')
+            utility('my-border-width', 'borderWidth')
+            utility('my-brightness', 'brightness')
+            utility('my-columns', 'columns')
+            utility('my-contrast', 'contrast')
+            utility('my-divide-width', 'divideWidth')
+            utility('my-flex-grow', 'flexGrow')
+            utility('my-flex-shrink', 'flexShrink')
+            utility('my-gradient-color-stop-positions', 'gradientColorStopPositions')
+            utility('my-grayscale', 'grayscale')
+            utility('my-grid-row-end', 'gridRowEnd')
+            utility('my-grid-row-start', 'gridRowStart')
+            utility('my-grid-template-columns', 'gridTemplateColumns')
+            utility('my-grid-template-rows', 'gridTemplateRows')
+            utility('my-hue-rotate', 'hueRotate')
+            utility('my-invert', 'invert')
+            utility('my-line-clamp', 'lineClamp')
+            utility('my-opacity', 'opacity')
+            utility('my-order', 'order')
+            utility('my-outline-offset', 'outlineOffset')
+            utility('my-outline-width', 'outlineWidth')
+            utility('my-ring-offset-width', 'ringOffsetWidth')
+            utility('my-ring-width', 'ringWidth')
+            utility('my-rotate', 'rotate')
+            utility('my-saturate', 'saturate')
+            utility('my-scale', 'scale')
+            utility('my-sepia', 'sepia')
+            utility('my-skew', 'skew')
+            utility('my-stroke-width', 'strokeWidth')
+            utility('my-text-decoration-thickness', 'textDecorationThickness')
+            utility('my-text-underline-offset', 'textUnderlineOffset')
+            utility('my-transition-delay', 'transitionDelay')
+            utility('my-transition-duration', 'transitionDuration')
+            utility('my-z-index', 'zIndex')
+          }),
+        }
+      },
+    })
+
+    let output = build([
+      'my-aspect-2/5',
+      'my-backdrop-brightness-1',
+      'my-backdrop-contrast-1',
+      'my-backdrop-grayscale-1',
+      'my-backdrop-hue-rotate-1',
+      'my-backdrop-invert-1',
+      'my-backdrop-opacity-1',
+      'my-backdrop-saturate-1',
+      'my-backdrop-sepia-1',
+      'my-border-width-1',
+      'my-brightness-1',
+      'my-columns-1',
+      'my-contrast-1',
+      'my-divide-width-1',
+      'my-flex-grow-1',
+      'my-flex-shrink-1',
+      'my-gradient-color-stop-positions-1',
+      'my-grayscale-1',
+      'my-grid-row-end-1',
+      'my-grid-row-start-1',
+      'my-grid-template-columns-1',
+      'my-grid-template-rows-1',
+      'my-hue-rotate-1',
+      'my-invert-1',
+      'my-line-clamp-1',
+      'my-opacity-1',
+      'my-order-1',
+      'my-outline-offset-1',
+      'my-outline-width-1',
+      'my-ring-offset-width-1',
+      'my-ring-width-1',
+      'my-rotate-1',
+      'my-saturate-1',
+      'my-scale-1',
+      'my-sepia-1',
+      'my-skew-1',
+      'my-stroke-width-1',
+      'my-text-decoration-thickness-1',
+      'my-text-underline-offset-1',
+      'my-transition-delay-1',
+      'my-transition-duration-1',
+      'my-z-index-1',
+    ])
+
+    expect(output).toMatchInlineSnapshot(`
+      ".my-aspect-2\\/5 {
         --value: 2/5;
       }
-
-      .my-backdrop-brightness-1, .my-backdrop-contrast-1, .my-backdrop-grayscale-1 {
+      .my-backdrop-brightness-1 {
+        --value: 1%;
+      }
+      .my-backdrop-contrast-1 {
+        --value: 1%;
+      }
+      .my-backdrop-grayscale-1 {
         --value: 1%;
       }
-
       .my-backdrop-hue-rotate-1 {
         --value: 1deg;
       }
-
-      .my-backdrop-invert-1, .my-backdrop-opacity-1, .my-backdrop-saturate-1, .my-backdrop-sepia-1 {
+      .my-backdrop-invert-1 {
+        --value: 1%;
+      }
+      .my-backdrop-opacity-1 {
+        --value: 1%;
+      }
+      .my-backdrop-saturate-1 {
+        --value: 1%;
+      }
+      .my-backdrop-sepia-1 {
         --value: 1%;
       }
-
       .my-border-width-1 {
         --value: 1px;
       }
-
       .my-brightness-1 {
         --value: 1%;
       }
-
       .my-columns-1 {
         --value: 1;
       }
-
       .my-contrast-1 {
         --value: 1%;
       }
-
       .my-divide-width-1 {
         --value: 1px;
       }
-
-      .my-flex-grow-1, .my-flex-shrink-1 {
+      .my-flex-grow-1 {
         --value: 1;
       }
-
-      .my-gradient-color-stop-positions-1, .my-grayscale-1 {
+      .my-flex-shrink-1 {
+        --value: 1;
+      }
+      .my-gradient-color-stop-positions-1 {
         --value: 1%;
       }
-
-      .my-grid-row-end-1, .my-grid-row-start-1 {
+      .my-grayscale-1 {
+        --value: 1%;
+      }
+      .my-grid-row-end-1 {
         --value: 1;
       }
-
-      .my-grid-template-columns-1, .my-grid-template-rows-1 {
+      .my-grid-row-start-1 {
+        --value: 1;
+      }
+      .my-grid-template-columns-1 {
+        --value: repeat(1, minmax(0, 1fr));
+      }
+      .my-grid-template-rows-1 {
         --value: repeat(1, minmax(0, 1fr));
       }
-
       .my-hue-rotate-1 {
         --value: 1deg;
       }
-
       .my-invert-1 {
         --value: 1%;
       }
-
       .my-line-clamp-1 {
         --value: 1;
       }
-
       .my-opacity-1 {
         --value: 1%;
       }
-
       .my-order-1 {
         --value: 1;
       }
-
-      .my-outline-offset-1, .my-outline-width-1, .my-ring-offset-width-1, .my-ring-width-1 {
+      .my-outline-offset-1 {
+        --value: 1px;
+      }
+      .my-outline-width-1 {
+        --value: 1px;
+      }
+      .my-ring-offset-width-1 {
+        --value: 1px;
+      }
+      .my-ring-width-1 {
         --value: 1px;
       }
-
       .my-rotate-1 {
         --value: 1deg;
       }
-
-      .my-saturate-1, .my-scale-1, .my-sepia-1 {
+      .my-saturate-1 {
+        --value: 1%;
+      }
+      .my-scale-1 {
+        --value: 1%;
+      }
+      .my-sepia-1 {
         --value: 1%;
       }
-
       .my-skew-1 {
         --value: 1deg;
       }
-
       .my-stroke-width-1 {
         --value: 1;
       }
-
-      .my-text-decoration-thickness-1, .my-text-underline-offset-1 {
+      .my-text-decoration-thickness-1 {
         --value: 1px;
       }
-
-      .my-transition-delay-1, .my-transition-duration-1 {
+      .my-text-underline-offset-1 {
+        --value: 1px;
+      }
+      .my-transition-delay-1 {
+        --value: 1ms;
+      }
+      .my-transition-duration-1 {
         --value: 1ms;
       }
-
       .my-z-index-1 {
         --value: 1;
       }
@@ -905,12 +928,11 @@ describe('theme', async () => {
       }
     `
 
-    using fn = vi.fn()
+    let fn = vi.fn()
 
     await compile(input, {
-      loadModule: async (_id, base) => {
+      loadModule: async (id, base) => {
         return {
-          path: '',
           base,
           module: plugin(
             ({ theme }) => {
@@ -948,12 +970,11 @@ describe('theme', async () => {
       }
     `
 
-    using fn = vi.fn()
+    let fn = vi.fn()
 
     await compile(input, {
-      loadModule: async (_id, base) => {
+      loadModule: async (id, base) => {
         return {
-          path: '',
           base,
           module: plugin(({ theme }) => {
             fn(theme('transitionTimingFunction.DEFAULT'))
@@ -980,12 +1001,11 @@ describe('theme', async () => {
       }
     `
 
-    using fn = vi.fn()
+    let fn = vi.fn()
 
     await compile(input, {
-      loadModule: async (_id, base) => {
+      loadModule: async (id, base) => {
         return {
-          path: '',
           base,
           module: plugin(({ theme }) => {
             fn(theme('color.red.100'))
@@ -1009,12 +1029,11 @@ describe('theme', async () => {
       @plugin "my-plugin";
     `
 
-    using fn = vi.fn()
+    let fn = vi.fn()
 
     await compile(input, {
-      loadModule: async (_id, base) => {
+      loadModule: async (id, base) => {
         return {
-          path: '',
           base,
           module: plugin(({ theme }) => {
             fn(theme('i.do.not.exist'))
@@ -1033,242 +1052,271 @@ describe('theme', async () => {
   })
 
   test('Candidates can match multiple utility definitions', async () => {
-    expect(
-      await run(
-        ['foo-bar'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(({ addUtilities, matchUtilities }) => {
-                addUtilities({ '.foo-bar': { color: 'red' } })
-                matchUtilities(
-                  { foo: (value) => ({ '--my-prop': value }) },
-                  { values: { bar: 'bar-valuer', baz: 'bar-valuer' } },
-                )
-                addUtilities({ '.foo-bar': { backgroundColor: 'red' } })
-              }),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let { build } = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(({ addUtilities, matchUtilities }) => {
+            addUtilities({
+              '.foo-bar': {
+                color: 'red',
+              },
+            })
+
+            matchUtilities(
+              {
+                foo: (value) => ({
+                  '--my-prop': value,
+                }),
+              },
+              {
+                values: {
+                  bar: 'bar-valuer',
+                  baz: 'bar-valuer',
+                },
+              },
+            )
+
+            addUtilities({
+              '.foo-bar': {
+                backgroundColor: 'red',
+              },
+            })
+          }),
+        }
+      },
+    })
+
+    expect(build(['foo-bar'])).toMatchInlineSnapshot(`
+      ".foo-bar {
+        background-color: red;
+      }
       .foo-bar {
         color: red;
+      }
+      .foo-bar {
         --my-prop: bar-valuer;
-        background-color: red;
       }
       "
     `)
   })
 
   test('spreading `tailwindcss/defaultTheme` exports keeps bare values', async () => {
-    expect(
-      await run(
-        [
-          'my-aspect-2/5',
-          // 'my-backdrop-brightness-1',
-          // 'my-backdrop-contrast-1',
-          // 'my-backdrop-grayscale-1',
-          // 'my-backdrop-hue-rotate-1',
-          // 'my-backdrop-invert-1',
-          // 'my-backdrop-opacity-1',
-          // 'my-backdrop-saturate-1',
-          // 'my-backdrop-sepia-1',
-          // 'my-divide-width-1',
-          'my-border-width-1',
-          'my-brightness-1',
-          'my-columns-1',
-          'my-contrast-1',
-          'my-flex-grow-1',
-          'my-flex-shrink-1',
-          'my-gradient-color-stop-positions-1',
-          'my-grayscale-1',
-          'my-grid-row-end-1',
-          'my-grid-row-start-1',
-          'my-grid-template-columns-1',
-          'my-grid-template-rows-1',
-          'my-hue-rotate-1',
-          'my-invert-1',
-          'my-line-clamp-1',
-          'my-opacity-1',
-          'my-order-1',
-          'my-outline-offset-1',
-          'my-outline-width-1',
-          'my-ring-offset-width-1',
-          'my-ring-width-1',
-          'my-rotate-1',
-          'my-saturate-1',
-          'my-scale-1',
-          'my-sepia-1',
-          'my-skew-1',
-          'my-stroke-width-1',
-          'my-text-decoration-thickness-1',
-          'my-text-underline-offset-1',
-          'my-transition-delay-1',
-          'my-transition-duration-1',
-          'my-z-index-1',
-        ],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ matchUtilities }) {
-                function utility(name: string, themeKey: string) {
-                  matchUtilities(
-                    { [name]: (value) => ({ '--value': value }) },
-                    // @ts-ignore
-                    { values: defaultTheme[themeKey] },
-                  )
-                }
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
 
-                utility('my-aspect', 'aspectRatio')
-                // The following keys deliberately doesn't work as these are exported
-                // as functions from the compat config.
-                //
-                // utility('my-backdrop-brightness', 'backdropBrightness')
-                // utility('my-backdrop-contrast', 'backdropContrast')
-                // utility('my-backdrop-grayscale', 'backdropGrayscale')
-                // utility('my-backdrop-hue-rotate', 'backdropHueRotate')
-                // utility('my-backdrop-invert', 'backdropInvert')
-                // utility('my-backdrop-opacity', 'backdropOpacity')
-                // utility('my-backdrop-saturate', 'backdropSaturate')
-                // utility('my-backdrop-sepia', 'backdropSepia')
-                // utility('my-divide-width', 'divideWidth')
-                utility('my-border-width', 'borderWidth')
-                utility('my-brightness', 'brightness')
-                utility('my-columns', 'columns')
-                utility('my-contrast', 'contrast')
-                utility('my-flex-grow', 'flexGrow')
-                utility('my-flex-shrink', 'flexShrink')
-                utility('my-gradient-color-stop-positions', 'gradientColorStopPositions')
-                utility('my-grayscale', 'grayscale')
-                utility('my-grid-row-end', 'gridRowEnd')
-                utility('my-grid-row-start', 'gridRowStart')
-                utility('my-grid-template-columns', 'gridTemplateColumns')
-                utility('my-grid-template-rows', 'gridTemplateRows')
-                utility('my-hue-rotate', 'hueRotate')
-                utility('my-invert', 'invert')
-                utility('my-line-clamp', 'lineClamp')
-                utility('my-opacity', 'opacity')
-                utility('my-order', 'order')
-                utility('my-outline-offset', 'outlineOffset')
-                utility('my-outline-width', 'outlineWidth')
-                utility('my-ring-offset-width', 'ringOffsetWidth')
-                utility('my-ring-width', 'ringWidth')
-                utility('my-rotate', 'rotate')
-                utility('my-saturate', 'saturate')
-                utility('my-scale', 'scale')
-                utility('my-sepia', 'sepia')
-                utility('my-skew', 'skew')
-                utility('my-stroke-width', 'strokeWidth')
-                utility('my-text-decoration-thickness', 'textDecorationThickness')
-                utility('my-text-underline-offset', 'textUnderlineOffset')
-                utility('my-transition-delay', 'transitionDelay')
-                utility('my-transition-duration', 'transitionDuration')
-                utility('my-z-index', 'zIndex')
-              }),
+    let { build } = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(function ({ matchUtilities }) {
+            function utility(name: string, themeKey: string) {
+              matchUtilities(
+                { [name]: (value) => ({ '--value': value }) },
+                // @ts-ignore
+                { values: defaultTheme[themeKey] },
+              )
             }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .my-aspect-2\\/5 {
+
+            utility('my-aspect', 'aspectRatio')
+            // The following keys deliberately doesn't work as these are exported
+            // as functions from the compat config.
+            //
+            // utility('my-backdrop-brightness', 'backdropBrightness')
+            // utility('my-backdrop-contrast', 'backdropContrast')
+            // utility('my-backdrop-grayscale', 'backdropGrayscale')
+            // utility('my-backdrop-hue-rotate', 'backdropHueRotate')
+            // utility('my-backdrop-invert', 'backdropInvert')
+            // utility('my-backdrop-opacity', 'backdropOpacity')
+            // utility('my-backdrop-saturate', 'backdropSaturate')
+            // utility('my-backdrop-sepia', 'backdropSepia')
+            // utility('my-divide-width', 'divideWidth')
+            utility('my-border-width', 'borderWidth')
+            utility('my-brightness', 'brightness')
+            utility('my-columns', 'columns')
+            utility('my-contrast', 'contrast')
+            utility('my-flex-grow', 'flexGrow')
+            utility('my-flex-shrink', 'flexShrink')
+            utility('my-gradient-color-stop-positions', 'gradientColorStopPositions')
+            utility('my-grayscale', 'grayscale')
+            utility('my-grid-row-end', 'gridRowEnd')
+            utility('my-grid-row-start', 'gridRowStart')
+            utility('my-grid-template-columns', 'gridTemplateColumns')
+            utility('my-grid-template-rows', 'gridTemplateRows')
+            utility('my-hue-rotate', 'hueRotate')
+            utility('my-invert', 'invert')
+            utility('my-line-clamp', 'lineClamp')
+            utility('my-opacity', 'opacity')
+            utility('my-order', 'order')
+            utility('my-outline-offset', 'outlineOffset')
+            utility('my-outline-width', 'outlineWidth')
+            utility('my-ring-offset-width', 'ringOffsetWidth')
+            utility('my-ring-width', 'ringWidth')
+            utility('my-rotate', 'rotate')
+            utility('my-saturate', 'saturate')
+            utility('my-scale', 'scale')
+            utility('my-sepia', 'sepia')
+            utility('my-skew', 'skew')
+            utility('my-stroke-width', 'strokeWidth')
+            utility('my-text-decoration-thickness', 'textDecorationThickness')
+            utility('my-text-underline-offset', 'textUnderlineOffset')
+            utility('my-transition-delay', 'transitionDelay')
+            utility('my-transition-duration', 'transitionDuration')
+            utility('my-z-index', 'zIndex')
+          }),
+        }
+      },
+    })
+
+    let output = build([
+      'my-aspect-2/5',
+      // 'my-backdrop-brightness-1',
+      // 'my-backdrop-contrast-1',
+      // 'my-backdrop-grayscale-1',
+      // 'my-backdrop-hue-rotate-1',
+      // 'my-backdrop-invert-1',
+      // 'my-backdrop-opacity-1',
+      // 'my-backdrop-saturate-1',
+      // 'my-backdrop-sepia-1',
+      // 'my-divide-width-1',
+      'my-border-width-1',
+      'my-brightness-1',
+      'my-columns-1',
+      'my-contrast-1',
+      'my-flex-grow-1',
+      'my-flex-shrink-1',
+      'my-gradient-color-stop-positions-1',
+      'my-grayscale-1',
+      'my-grid-row-end-1',
+      'my-grid-row-start-1',
+      'my-grid-template-columns-1',
+      'my-grid-template-rows-1',
+      'my-hue-rotate-1',
+      'my-invert-1',
+      'my-line-clamp-1',
+      'my-opacity-1',
+      'my-order-1',
+      'my-outline-offset-1',
+      'my-outline-width-1',
+      'my-ring-offset-width-1',
+      'my-ring-width-1',
+      'my-rotate-1',
+      'my-saturate-1',
+      'my-scale-1',
+      'my-sepia-1',
+      'my-skew-1',
+      'my-stroke-width-1',
+      'my-text-decoration-thickness-1',
+      'my-text-underline-offset-1',
+      'my-transition-delay-1',
+      'my-transition-duration-1',
+      'my-z-index-1',
+    ])
+
+    expect(output).toMatchInlineSnapshot(`
+      ".my-aspect-2\\/5 {
         --value: 2/5;
       }
-
       .my-border-width-1 {
         --value: 1px;
       }
-
       .my-brightness-1 {
         --value: 1%;
       }
-
       .my-columns-1 {
         --value: 1;
       }
-
       .my-contrast-1 {
         --value: 1%;
       }
-
-      .my-flex-grow-1, .my-flex-shrink-1 {
+      .my-flex-grow-1 {
         --value: 1;
       }
-
-      .my-gradient-color-stop-positions-1, .my-grayscale-1 {
+      .my-flex-shrink-1 {
+        --value: 1;
+      }
+      .my-gradient-color-stop-positions-1 {
         --value: 1%;
       }
-
-      .my-grid-row-end-1, .my-grid-row-start-1 {
+      .my-grayscale-1 {
+        --value: 1%;
+      }
+      .my-grid-row-end-1 {
         --value: 1;
       }
-
-      .my-grid-template-columns-1, .my-grid-template-rows-1 {
+      .my-grid-row-start-1 {
+        --value: 1;
+      }
+      .my-grid-template-columns-1 {
+        --value: repeat(1, minmax(0, 1fr));
+      }
+      .my-grid-template-rows-1 {
         --value: repeat(1, minmax(0, 1fr));
       }
-
       .my-hue-rotate-1 {
         --value: 1deg;
       }
-
       .my-invert-1 {
         --value: 1%;
       }
-
       .my-line-clamp-1 {
         --value: 1;
       }
-
       .my-opacity-1 {
         --value: 1%;
       }
-
       .my-order-1 {
         --value: 1;
       }
-
-      .my-outline-offset-1, .my-outline-width-1, .my-ring-offset-width-1, .my-ring-width-1 {
+      .my-outline-offset-1 {
+        --value: 1px;
+      }
+      .my-outline-width-1 {
+        --value: 1px;
+      }
+      .my-ring-offset-width-1 {
+        --value: 1px;
+      }
+      .my-ring-width-1 {
         --value: 1px;
       }
-
       .my-rotate-1 {
         --value: 1deg;
       }
-
-      .my-saturate-1, .my-scale-1, .my-sepia-1 {
+      .my-saturate-1 {
+        --value: 1%;
+      }
+      .my-scale-1 {
+        --value: 1%;
+      }
+      .my-sepia-1 {
         --value: 1%;
       }
-
       .my-skew-1 {
         --value: 1deg;
       }
-
       .my-stroke-width-1 {
         --value: 1;
       }
-
-      .my-text-decoration-thickness-1, .my-text-underline-offset-1 {
+      .my-text-decoration-thickness-1 {
         --value: 1px;
       }
-
-      .my-transition-delay-1, .my-transition-duration-1 {
+      .my-text-underline-offset-1 {
+        --value: 1px;
+      }
+      .my-transition-delay-1 {
+        --value: 1ms;
+      }
+      .my-transition-duration-1 {
         --value: 1ms;
       }
-
       .my-z-index-1 {
         --value: 1;
       }
@@ -1277,211 +1325,190 @@ describe('theme', async () => {
   })
 
   test('can use escaped JS variables in theme values', async () => {
-    expect(
-      await run(
-        ['my-width-1', 'my-width-1/2', 'my-width-1.5'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { 'my-width': (value) => ({ width: value }) },
-                    { values: theme('width') },
-                  )
-                },
-                {
-                  theme: {
-                    extend: {
-                      width: {
-                        '1': '0.25rem',
-                        // Purposely setting to something different from the v3 default
-                        '1/2': '60%',
-                        '1.5': '0.375rem',
-                      },
-                    },
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                { 'my-width': (value) => ({ width: value }) },
+                { values: theme('width') },
+              )
+            },
+            {
+              theme: {
+                extend: {
+                  width: {
+                    '1': '0.25rem',
+                    // Purposely setting to something different from the v3 default
+                    '1/2': '60%',
+                    '1.5': '0.375rem',
                   },
                 },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .my-width-1 {
-        width: .25rem;
-      }
+              },
+            },
+          ),
+        }
+      },
+    })
 
+    expect(compiler.build(['my-width-1', 'my-width-1/2', 'my-width-1.5'])).toMatchInlineSnapshot(
+      `
+      ".my-width-1 {
+        width: 0.25rem;
+      }
       .my-width-1\\.5 {
-        width: .375rem;
+        width: 0.375rem;
       }
-
       .my-width-1\\/2 {
         width: 60%;
       }
       "
-    `)
+    `,
+    )
   })
 
   test('can use escaped CSS variables in theme values', async () => {
-    expect(
-      await run(
-        ['my-width-1', 'my-width-1.5', 'my-width-1/2', 'my-width-2.5'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
 
-          @theme {
-            --width-1: 0.25rem;
-            /* Purposely setting to something different from the v3 default */
-            --width-1\/2: 60%;
-            --width-1\.5: 0.375rem;
-            --width-2_5: 0.625rem;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ matchUtilities, theme }) {
-                matchUtilities(
-                  { 'my-width': (value) => ({ width: value }) },
-                  { values: theme('width') },
-                )
-              }),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .my-width-1 {
-        width: .25rem;
+      @theme {
+        --width-1: 0.25rem;
+        /* Purposely setting to something different from the v3 default */
+        --width-1\/2: 60%;
+        --width-1\.5: 0.375rem;
+        --width-2_5: 0.625rem;
       }
+    `
 
-      .my-width-1\\.5 {
-        width: .375rem;
-      }
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(function ({ matchUtilities, theme }) {
+            matchUtilities(
+              { 'my-width': (value) => ({ width: value }) },
+              { values: theme('width') },
+            )
+          }),
+        }
+      },
+    })
 
-      .my-width-1\\/2 {
-        width: 60%;
-      }
-
-      .my-width-2\\.5 {
-        width: .625rem;
-      }
-      "
-    `)
+    expect(compiler.build(['my-width-1', 'my-width-1.5', 'my-width-1/2', 'my-width-2.5']))
+      .toMatchInlineSnapshot(`
+        ".my-width-1 {
+          width: 0.25rem;
+        }
+        .my-width-1\\.5 {
+          width: 0.375rem;
+        }
+        .my-width-1\\/2 {
+          width: 60%;
+        }
+        .my-width-2\\.5 {
+          width: 0.625rem;
+        }
+        "
+      `)
   })
 
   test('can use escaped CSS variables in referenced theme namespace', async () => {
-    expect(
-      await run(
-        ['my-width-1', 'my-width-1.5', 'my-width-1/2', 'my-width-2.5'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
+    let input = css`
+      @tailwind utilities;
+      @plugin "my-plugin";
 
-          @theme {
-            --width-1: 0.25rem;
-            /* Purposely setting to something different from the v3 default */
-            --width-1\/2: 60%;
-            --width-1\.5: 0.375rem;
-            --width-2_5: 0.625rem;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(
-                function ({ matchUtilities, theme }) {
-                  matchUtilities(
-                    { 'my-width': (value) => ({ width: value }) },
-                    { values: theme('myWidth') },
-                  )
-                },
-                {
-                  theme: { myWidth: ({ theme }) => theme('width') },
-                },
-              ),
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .my-width-1 {
-        width: .25rem;
+      @theme {
+        --width-1: 0.25rem;
+        /* Purposely setting to something different from the v3 default */
+        --width-1\/2: 60%;
+        --width-1\.5: 0.375rem;
+        --width-2_5: 0.625rem;
       }
+    `
 
-      .my-width-1\\.5 {
-        width: .375rem;
-      }
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        return {
+          base,
+          module: plugin(
+            function ({ matchUtilities, theme }) {
+              matchUtilities(
+                { 'my-width': (value) => ({ width: value }) },
+                { values: theme('myWidth') },
+              )
+            },
+            {
+              theme: { myWidth: ({ theme }) => theme('width') },
+            },
+          ),
+        }
+      },
+    })
 
-      .my-width-1\\/2 {
-        width: 60%;
-      }
-
-      .my-width-2\\.5 {
-        width: .625rem;
-      }
-      "
-    `)
+    expect(compiler.build(['my-width-1', 'my-width-1.5', 'my-width-1/2', 'my-width-2.5']))
+      .toMatchInlineSnapshot(`
+        ".my-width-1 {
+          width: 0.25rem;
+        }
+        .my-width-1\\.5 {
+          width: 0.375rem;
+        }
+        .my-width-1\\/2 {
+          width: 60%;
+        }
+        .my-width-2\\.5 {
+          width: 0.625rem;
+        }
+        "
+      `)
   })
 })
 
 describe('addBase', () => {
   test('does not create rules when imported via `@import "…" reference`', async () => {
-    expect(
-      await compileCss(
-        css`
-          @tailwind utilities;
-          @plugin "outside";
-          @import './inside.css' reference;
-        `,
-        {
-          loadModule: async (_id, base) => {
-            if (_id === 'inside') {
-              return {
-                path: '',
-                base,
-                module: plugin(function ({ addBase }) {
-                  addBase({ inside: { color: 'red' } })
-                }),
-              }
-            }
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ addBase }) {
-                addBase({ outside: { color: 'red' } })
-              }),
-            }
-          },
-          async loadStylesheet() {
-            return {
-              path: '',
-              base: '',
-              content: css`
-                @plugin "inside";
-              `,
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
+    let input = css`
+      @tailwind utilities;
+      @plugin "outside";
+      @import './inside.css' reference;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async (id, base) => {
+        if (id === 'inside') {
+          return {
+            base,
+            module: plugin(function ({ addBase }) {
+              addBase({ inside: { color: 'red' } })
+            }),
+          }
+        }
+        return {
+          base,
+          module: plugin(function ({ addBase }) {
+            addBase({ outside: { color: 'red' } })
+          }),
+        }
+      },
+      async loadStylesheet() {
+        return {
+          content: css`
+            @plugin "inside";
+          `,
+          base: '',
+        }
+      },
+    })
+
+    expect(compiler.build([])).toMatchInlineSnapshot(`
+      "@layer base {
         outside {
           color: red;
         }
@@ -1491,24 +1518,27 @@ describe('addBase', () => {
   })
 
   test('does not modify CSS variables', async () => {
-    expect(
-      await compileCss(
-        css`
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: plugin(function ({ addBase }) {
-              addBase({ ':root': { '--PascalCase': '1', '--camelCase': '1', '--UPPERCASE': '1' } })
-            }),
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
+    let input = css`
+      @plugin "my-plugin";
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: plugin(function ({ addBase }) {
+          addBase({
+            ':root': {
+              '--PascalCase': '1',
+              '--camelCase': '1',
+              '--UPPERCASE': '1',
+            },
+          })
+        }),
+        base: '/root',
+      }),
+    })
+
+    expect(compiler.build([])).toMatchInlineSnapshot(`
+      "@layer base {
         :root {
           --PascalCase: 1;
           --camelCase: 1;
@@ -1518,321 +1548,150 @@ describe('addBase', () => {
       "
     `)
   })
-
-  test('@variant is replaced inside rules using addBase', async () => {
-    expect(
-      await compileCss(
-        css`
-          @plugin "my-plugin";
-          @theme {
-            --breakpoint-supertiny: 128px;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: plugin(function ({ addBase }) {
-              addBase({
-                ':root': {
-                  '@variant supertiny': {
-                    '--PascalCase': '1',
-                    '--camelCase': '1',
-                    '--UPPERCASE': '1',
-                  },
-                  '@variant data-enabled:focus, disabled': {
-                    '--x': '1',
-                  },
-                },
-              })
-            }),
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
-        @media (min-width: 128px) {
-          :root {
-            --PascalCase: 1;
-            --camelCase: 1;
-            --UPPERCASE: 1;
-          }
-        }
-
-        :root[data-enabled]:focus, :root:disabled {
-          --x: 1;
-        }
-      }
-      "
-    `)
-  })
-
-  test('@variant inside addBase works with custom variants', async () => {
-    expect(
-      await compileCss(
-        css`
-          @plugin "my-plugin";
-
-          @custom-variant custom (&.custom);
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: plugin(function ({ addBase }) {
-              addBase({
-                ':root': {
-                  '@variant custom': {
-                    '--x': '1',
-                  },
-                },
-              })
-            }),
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
-        :root.custom {
-          --x: 1;
-        }
-      }
-      "
-    `)
-  })
 })
 
 describe('addVariant', () => {
   test('addVariant with string selector', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ addVariant }: PluginAPI) => {
+              addVariant('hocus', '&:hover, &:focus')
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('hocus', '&:hover, &:focus')
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:is(:where(.group):hover, :where(.group):focus) .group-hocus\\:flex) {
+      },
+    )
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        .group-hocus\\:flex:is(:is(:where(.group):hover, :where(.group):focus) *) {
           display: flex;
         }
 
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
-    `)
-  })
-
-  test('addVariant with `@scope`', async () => {
-    expect(
-      await run(
-        ['blue:underline', 'green:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('blue', '@scope ([data-theme=blue]) to ([data-theme])')
-                addVariant('green', '@scope ([data-theme=green]) to ([data-theme]) { & }')
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @scope ([data-theme="blue"]) to ([data-theme]) {
-          .blue\\:underline {
-            text-decoration-line: underline;
-          }
-        }
-
-        @scope ([data-theme="green"]) to ([data-theme]) {
-          .green\\:underline {
-            text-decoration-line: underline;
-          }
-        }
-      }
-      "
-    `)
-  })
-
-  test('matchVariant with `@scope`', async () => {
-    expect(
-      await run(
-        ['theme-[blue]:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('theme', (value) => `@scope ([data-theme=${value}]) to ([data-theme])`)
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @scope ([data-theme="blue"]) to ([data-theme]) {
-          .theme-\\[blue\\]\\:underline {
-            text-decoration-line: underline;
-          }
-        }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with array of selectors', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ addVariant }: PluginAPI) => {
+              addVariant('hocus', ['&:hover', '&:focus'])
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('hocus', ['&:hover', '&:focus'])
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:where(.group):hover .group-hocus\\:flex), :is(:where(.group):focus .group-hocus\\:flex) {
+      },
+    )
+
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        .group-hocus\\:flex:is(:where(.group):hover *), .group-hocus\\:flex:is(:where(.group):focus *) {
           display: flex;
         }
 
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with object syntax and @slot', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ addVariant }: PluginAPI) => {
+              addVariant('hocus', {
+                '&:hover': '@slot',
+                '&:focus': '@slot',
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('hocus', {
-                  '&:hover': '@slot',
-                  '&:focus': '@slot',
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:where(.group):hover .group-hocus\\:flex), :is(:where(.group):focus .group-hocus\\:flex) {
+      },
+    )
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        .group-hocus\\:flex:is(:where(.group):hover *), .group-hocus\\:flex:is(:where(.group):focus *) {
           display: flex;
         }
 
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with object syntax, media, nesting and multiple @slot', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ addVariant }: PluginAPI) => {
+              addVariant('hocus', {
+                '@media (hover: hover)': {
+                  '&:hover': '@slot',
+                },
+                '&:focus': '@slot',
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('hocus', {
-                  '@media (hover: hover)': {
-                    '&:hover': '@slot',
-                  },
-                  '&:focus': '@slot',
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         @media (hover: hover) {
-          :is(:where(.group):hover .group-hocus\\:flex) {
+          .group-hocus\\:flex:is(:where(.group):hover *) {
             display: flex;
           }
         }
 
-        :is(:where(.group):focus .group-hocus\\:flex) {
+        .group-hocus\\:flex:is(:where(.group):focus *) {
           display: flex;
         }
 
@@ -1845,40 +1704,37 @@ describe('addVariant', () => {
         .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with at-rules and placeholder', async () => {
-    expect(
-      await run(
-        ['potato:underline', 'potato:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ addVariant }: PluginAPI) => {
+              addVariant(
+                'potato',
+                '@media (max-width: 400px) { @supports (font:bold) { &:large-potato } }',
+              )
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant(
-                  'potato',
-                  '@media (max-width: 400px) { @supports (font:bold) { &:large-potato } }',
-                )
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (max-width: 400px) {
+      },
+    )
+    let compiled = build(['potato:underline', 'potato:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width <= 400px) {
           @supports (font: bold) {
             .potato\\:flex:large-potato {
               display: flex;
@@ -1889,42 +1745,39 @@ describe('addVariant', () => {
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('@slot is preserved when used as a custom property value', async () => {
-    expect(
-      await run(
-        ['hocus:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ addVariant }: PluginAPI) => {
+              addVariant('hocus', {
+                '&': {
+                  '--custom-property': '@slot',
+                  '&:hover': '@slot',
+                  '&:focus': '@slot',
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('hocus', {
-                  '&': {
-                    '--custom-property': '@slot',
-                    '&:hover': '@slot',
-                    '&:focus': '@slot',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['hocus:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .hocus\\:underline {
           --custom-property: @slot;
         }
@@ -1932,73 +1785,35 @@ describe('addVariant', () => {
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
-    `)
-  })
-
-  test('ignores variants that use :merge(…) and ensures `peer-*` and `group-*` rules work out of the box', async () => {
-    expect(
-      await run(
-        ['optional:flex', 'group-optional:flex', 'peer-optional:flex', 'group-optional/foo:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ addVariant }: PluginAPI) => {
-                addVariant('optional', '&:optional')
-                addVariant('group-optional', { ':merge(.group):optional &': '@slot' })
-                addVariant('peer-optional', { '&': { ':merge(.peer):optional ~ &': '@slot' } })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:where(.group):optional .group-optional\\:flex), :is(:where(.group\\/foo):optional .group-optional\\/foo\\:flex), :is(:where(.peer):optional ~ .peer-optional\\:flex), .optional\\:flex:optional {
-          display: flex;
-        }
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('matchVariant', () => {
   test('partial arbitrary variants', async () => {
-    expect(
-      await run(
-        ['potato-[yellow]:underline', 'potato-[baked]:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('potato', (flavor) => `.potato-${flavor} &`)
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('potato', (flavor) => `.potato-${flavor} &`)
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['potato-[yellow]:underline', 'potato-[baked]:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .potato-baked .potato-\\[baked\\]\\:flex {
           display: flex;
         }
@@ -2006,36 +1821,33 @@ describe('matchVariant', () => {
         .potato-yellow .potato-\\[yellow\\]\\:underline {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('partial arbitrary variants with at-rules', async () => {
-    expect(
-      await run(
-        ['potato-[yellow]:underline', 'potato-[baked]:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('potato', (flavor) => `@media (potato: ${flavor})`)
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('potato', (flavor) => `@media (potato: ${flavor})`)
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['potato-[yellow]:underline', 'potato-[baked]:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         @media (potato: baked) {
           .potato-\\[baked\\]\\:flex {
             display: flex;
@@ -2047,38 +1859,37 @@ describe('matchVariant', () => {
             text-decoration-line: underline;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('partial arbitrary variants with at-rules and placeholder', async () => {
-    expect(
-      await run(
-        ['potato-[yellow]:underline', 'potato-[baked]:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant(
+                'potato',
+                (flavor) =>
+                  `@media (potato: ${flavor}) { @supports (font:bold) { &:large-potato } }`,
+              )
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('potato', (flavor) => {
-                  return `@media (potato: ${flavor}) { @supports (font:bold) { &:large-potato } }`
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['potato-[yellow]:underline', 'potato-[baked]:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         @media (potato: baked) {
           @supports (font: bold) {
             .potato-\\[baked\\]\\:flex:large-potato {
@@ -2094,41 +1905,38 @@ describe('matchVariant', () => {
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('partial arbitrary variants with default values', async () => {
-    expect(
-      await run(
-        ['tooltip-bottom:underline', 'tooltip-top:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('tooltip', (side) => `&${side}`, {
+                values: {
+                  bottom: '[data-location="bottom"]',
+                  top: '[data-location="top"]',
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('tooltip', (side) => `&${side}`, {
-                  values: {
-                    bottom: '[data-location="bottom"]',
-                    top: '[data-location="top"]',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['tooltip-bottom:underline', 'tooltip-top:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .tooltip-bottom\\:underline[data-location="bottom"] {
           text-decoration-line: underline;
         }
@@ -2136,309 +1944,302 @@ describe('matchVariant', () => {
         .tooltip-top\\:flex[data-location="top"] {
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('matched variant values maintain the sort order they are registered in', async () => {
-    expect(
-      await run(
-        [
-          'alphabet-c:underline',
-          'alphabet-a:underline',
-          'alphabet-d:underline',
-          'alphabet-b:underline',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('alphabet', (side) => `&${side}`, {
+                values: {
+                  d: '[data-order="1"]',
+                  a: '[data-order="2"]',
+                  c: '[data-order="3"]',
+                  b: '[data-order="4"]',
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('alphabet', (side) => `&${side}`, {
-                  values: {
-                    d: '[data-order="1"]',
-                    a: '[data-order="2"]',
-                    c: '[data-order="3"]',
-                    b: '[data-order="4"]',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build([
+      'alphabet-c:underline',
+      'alphabet-a:underline',
+      'alphabet-d:underline',
+      'alphabet-b:underline',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .alphabet-d\\:underline[data-order="1"], .alphabet-a\\:underline[data-order="2"], .alphabet-c\\:underline[data-order="3"], .alphabet-b\\:underline[data-order="4"] {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('matchVariant can return an array of format strings from the function', async () => {
-    expect(
-      await run(
-        ['test-[a,b,c]:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('test', (selector) =>
+                selector.split(',').map((selector) => `&.${selector} > *`),
+              )
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('test', (selector) =>
-                  selector.split(',').map((selector) => `&.${selector} > *`),
-                )
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['test-[a,b,c]:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .test-\\[a\\,b\\,c\\]\\:underline.a > *, .test-\\[a\\,b\\,c\\]\\:underline.b > *, .test-\\[a\\,b\\,c\\]\\:underline.c > * {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should be possible to sort variants', async () => {
-    expect(
-      await run(
-        ['testmin-[600px]:flex', 'testmin-[500px]:underline', 'testmin-[700px]:italic'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(a.value) - parseInt(z.value)
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(a.value) - parseInt(z.value)
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (min-width: 500px) {
+      },
+    )
+    let compiled = build([
+      'testmin-[600px]:flex',
+      'testmin-[500px]:underline',
+      'testmin-[700px]:italic',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width >= 500px) {
           .testmin-\\[500px\\]\\:underline {
             text-decoration-line: underline;
           }
         }
 
-        @media (min-width: 600px) {
+        @media (width >= 600px) {
           .testmin-\\[600px\\]\\:flex {
             display: flex;
           }
         }
 
-        @media (min-width: 700px) {
+        @media (width >= 700px) {
           .testmin-\\[700px\\]\\:italic {
             font-style: italic;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should be possible to compare arbitrary variants and hardcoded variants', async () => {
-    expect(
-      await run(
-        ['testmin-[700px]:italic', 'testmin-example:italic', 'testmin-[500px]:italic'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                values: {
+                  example: '600px',
+                },
+                sort(a, z) {
+                  return parseInt(a.value) - parseInt(z.value)
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  values: { example: '600px' },
-                  sort(a, z) {
-                    return parseInt(a.value) - parseInt(z.value)
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (min-width: 500px) {
+      },
+    )
+    let compiled = build([
+      'testmin-[700px]:italic',
+      'testmin-example:italic',
+      'testmin-[500px]:italic',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width >= 500px) {
           .testmin-\\[500px\\]\\:italic {
             font-style: italic;
           }
         }
 
-        @media (min-width: 600px) {
+        @media (width >= 600px) {
           .testmin-example\\:italic {
             font-style: italic;
           }
         }
 
-        @media (min-width: 700px) {
+        @media (width >= 700px) {
           .testmin-\\[700px\\]\\:italic {
             font-style: italic;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should be possible to sort stacked arbitrary variants correctly', async () => {
-    expect(
-      await run(
-        [
-          'testmin-[150px]:testmax-[400px]:order-2',
-          'testmin-[100px]:testmax-[350px]:order-3',
-          'testmin-[100px]:testmax-[300px]:order-4',
-          'testmin-[100px]:testmax-[400px]:order-1',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(a.value) - parseInt(z.value)
-                  },
-                })
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(a.value) - parseInt(z.value)
+                },
+              })
 
-                matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(z.value) - parseInt(a.value)
-                  },
-                })
-              },
-            }
-          },
+              matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(z.value) - parseInt(a.value)
+                },
+              })
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (min-width: 100px) {
-          @media (max-width: 400px) {
+      },
+    )
+
+    let compiled = build([
+      'testmin-[150px]:testmax-[400px]:order-2',
+      'testmin-[100px]:testmax-[350px]:order-3',
+      'testmin-[100px]:testmax-[300px]:order-4',
+      'testmin-[100px]:testmax-[400px]:order-1',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width >= 100px) {
+          @media (width <= 400px) {
             .testmin-\\[100px\\]\\:testmax-\\[400px\\]\\:order-1 {
               order: 1;
             }
           }
         }
 
-        @media (min-width: 150px) {
-          @media (max-width: 400px) {
+        @media (width >= 150px) {
+          @media (width <= 400px) {
             .testmin-\\[150px\\]\\:testmax-\\[400px\\]\\:order-2 {
               order: 2;
             }
           }
         }
 
-        @media (min-width: 100px) {
-          @media (max-width: 350px) {
+        @media (width >= 100px) {
+          @media (width <= 350px) {
             .testmin-\\[100px\\]\\:testmax-\\[350px\\]\\:order-3 {
               order: 3;
             }
           }
 
-          @media (max-width: 300px) {
+          @media (width <= 300px) {
             .testmin-\\[100px\\]\\:testmax-\\[300px\\]\\:order-4 {
               order: 4;
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should maintain sort from other variants, if sort functions of arbitrary variants return 0', async () => {
-    // Expect :focus to come after :hover
-    expect(
-      await run(
-        [
-          'testmin-[100px]:testmax-[200px]:focus:underline',
-          'testmin-[100px]:testmax-[200px]:hover:underline',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(a.value) - parseInt(z.value)
-                  },
-                })
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(a.value) - parseInt(z.value)
+                },
+              })
 
-                matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(z.value) - parseInt(a.value)
-                  },
-                })
-              },
-            }
-          },
+              matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(z.value) - parseInt(a.value)
+                },
+              })
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (min-width: 100px) {
-          @media (max-width: 200px) {
+      },
+    )
+    let compiled = build([
+      'testmin-[100px]:testmax-[200px]:focus:underline',
+      'testmin-[100px]:testmax-[200px]:hover:underline',
+    ])
+
+    // Expect :focus to come after :hover
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width >= 100px) {
+          @media (width <= 200px) {
             @media (hover: hover) {
               .testmin-\\[100px\\]\\:testmax-\\[200px\\]\\:hover\\:underline:hover {
                 text-decoration-line: underline;
@@ -2450,782 +2251,618 @@ describe('matchVariant', () => {
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should sort arbitrary variants left to right (1)', async () => {
-    expect(
-      await run(
-        [
-          'testmin-[200px]:testmax-[400px]:order-2',
-          'testmin-[200px]:testmax-[300px]:order-4',
-          'testmin-[100px]:testmax-[400px]:order-1',
-          'testmin-[100px]:testmax-[300px]:order-3',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(a.value) - parseInt(z.value)
+                },
+              })
+              matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(z.value) - parseInt(a.value)
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(a.value) - parseInt(z.value)
-                  },
-                })
-                matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(z.value) - parseInt(a.value)
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (min-width: 100px) {
-          @media (max-width: 400px) {
+      },
+    )
+    let compiled = build([
+      'testmin-[200px]:testmax-[400px]:order-2',
+      'testmin-[200px]:testmax-[300px]:order-4',
+      'testmin-[100px]:testmax-[400px]:order-1',
+      'testmin-[100px]:testmax-[300px]:order-3',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width >= 100px) {
+          @media (width <= 400px) {
             .testmin-\\[100px\\]\\:testmax-\\[400px\\]\\:order-1 {
               order: 1;
             }
           }
         }
 
-        @media (min-width: 200px) {
-          @media (max-width: 400px) {
+        @media (width >= 200px) {
+          @media (width <= 400px) {
             .testmin-\\[200px\\]\\:testmax-\\[400px\\]\\:order-2 {
               order: 2;
             }
           }
         }
 
-        @media (min-width: 100px) {
-          @media (max-width: 300px) {
+        @media (width >= 100px) {
+          @media (width <= 300px) {
             .testmin-\\[100px\\]\\:testmax-\\[300px\\]\\:order-3 {
               order: 3;
             }
           }
         }
 
-        @media (min-width: 200px) {
-          @media (max-width: 300px) {
+        @media (width >= 200px) {
+          @media (width <= 300px) {
             .testmin-\\[200px\\]\\:testmax-\\[300px\\]\\:order-4 {
               order: 4;
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should sort arbitrary variants left to right (2)', async () => {
-    expect(
-      await run(
-        [
-          'testmax-[400px]:testmin-[200px]:underline',
-          'testmax-[300px]:testmin-[200px]:underline',
-          'testmax-[400px]:testmin-[100px]:underline',
-          'testmax-[300px]:testmin-[100px]:underline',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(a.value) - parseInt(z.value)
+                },
+              })
+              matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
+                sort(a, z) {
+                  return parseInt(z.value) - parseInt(a.value)
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(a.value) - parseInt(z.value)
-                  },
-                })
-                matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
-                  sort(a, z) {
-                    return parseInt(z.value) - parseInt(a.value)
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (max-width: 400px) {
-          @media (min-width: 100px) {
+      },
+    )
+    let compiled = build([
+      'testmax-[400px]:testmin-[200px]:underline',
+      'testmax-[300px]:testmin-[200px]:underline',
+      'testmax-[400px]:testmin-[100px]:underline',
+      'testmax-[300px]:testmin-[100px]:underline',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width <= 400px) {
+          @media (width >= 100px) {
             .testmax-\\[400px\\]\\:testmin-\\[100px\\]\\:underline {
               text-decoration-line: underline;
             }
           }
 
-          @media (min-width: 200px) {
+          @media (width >= 200px) {
             .testmax-\\[400px\\]\\:testmin-\\[200px\\]\\:underline {
               text-decoration-line: underline;
             }
           }
         }
 
-        @media (max-width: 300px) {
-          @media (min-width: 100px) {
+        @media (width <= 300px) {
+          @media (width >= 100px) {
             .testmax-\\[300px\\]\\:testmin-\\[100px\\]\\:underline {
               text-decoration-line: underline;
             }
           }
 
-          @media (min-width: 200px) {
+          @media (width >= 200px) {
             .testmax-\\[300px\\]\\:testmin-\\[200px\\]\\:underline {
               text-decoration-line: underline;
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should guarantee that we are not passing values from other variants to the wrong function', async () => {
-    expect(
-      await run(
-        [
-          'testmin-[200px]:testmax-[400px]:order-2',
-          'testmin-[200px]:testmax-[300px]:order-4',
-          'testmin-[100px]:testmax-[400px]:order-1',
-          'testmin-[100px]:testmax-[300px]:order-3',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
+                sort(a, z) {
+                  let lookup = ['100px', '200px']
+                  if (lookup.indexOf(a.value) === -1 || lookup.indexOf(z.value) === -1) {
+                    throw new Error('We are seeing values that should not be there!')
+                  }
+                  return lookup.indexOf(a.value) - lookup.indexOf(z.value)
+                },
+              })
+              matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
+                sort(a, z) {
+                  let lookup = ['300px', '400px']
+                  if (lookup.indexOf(a.value) === -1 || lookup.indexOf(z.value) === -1) {
+                    throw new Error('We are seeing values that should not be there!')
+                  }
+                  return lookup.indexOf(z.value) - lookup.indexOf(a.value)
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('testmin', (value) => `@media (min-width: ${value})`, {
-                  sort(a, z) {
-                    let lookup = ['100px', '200px']
-                    if (lookup.indexOf(a.value) === -1 || lookup.indexOf(z.value) === -1) {
-                      throw new Error('We are seeing values that should not be there!')
-                    }
-                    return lookup.indexOf(a.value) - lookup.indexOf(z.value)
-                  },
-                })
-                matchVariant('testmax', (value) => `@media (max-width: ${value})`, {
-                  sort(a, z) {
-                    let lookup = ['300px', '400px']
-                    if (lookup.indexOf(a.value) === -1 || lookup.indexOf(z.value) === -1) {
-                      throw new Error('We are seeing values that should not be there!')
-                    }
-                    return lookup.indexOf(z.value) - lookup.indexOf(a.value)
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        @media (min-width: 100px) {
-          @media (max-width: 400px) {
+      },
+    )
+    let compiled = build([
+      'testmin-[200px]:testmax-[400px]:order-2',
+      'testmin-[200px]:testmax-[300px]:order-4',
+      'testmin-[100px]:testmax-[400px]:order-1',
+      'testmin-[100px]:testmax-[300px]:order-3',
+    ])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        @media (width >= 100px) {
+          @media (width <= 400px) {
             .testmin-\\[100px\\]\\:testmax-\\[400px\\]\\:order-1 {
               order: 1;
             }
           }
         }
 
-        @media (min-width: 200px) {
-          @media (max-width: 400px) {
+        @media (width >= 200px) {
+          @media (width <= 400px) {
             .testmin-\\[200px\\]\\:testmax-\\[400px\\]\\:order-2 {
               order: 2;
             }
           }
         }
 
-        @media (min-width: 100px) {
-          @media (max-width: 300px) {
+        @media (width >= 100px) {
+          @media (width <= 300px) {
             .testmin-\\[100px\\]\\:testmax-\\[300px\\]\\:order-3 {
               order: 3;
             }
           }
         }
 
-        @media (min-width: 200px) {
-          @media (max-width: 300px) {
+        @media (width >= 200px) {
+          @media (width <= 300px) {
             .testmin-\\[200px\\]\\:testmax-\\[300px\\]\\:order-4 {
               order: 4;
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should default to the DEFAULT value for variants', async () => {
-    expect(
-      await run(
-        ['foo:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('foo', (value) => `.foo${value} &`, {
+                values: {
+                  DEFAULT: '.bar',
+                },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('foo', (value) => `.foo${value} &`, {
-                  values: { DEFAULT: '.bar' },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['foo:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .foo.bar .foo\\:underline {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should not generate anything if the matchVariant does not have a DEFAULT value configured', async () => {
-    expect(
-      await run(
-        ['foo:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('foo', (value) => `.foo${value} &`)
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('foo', (value) => `.foo${value} &`)
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities;
-      "
-    `)
+      },
+    )
+    let compiled = build(['foo:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`"@layer utilities;"`)
   })
 
   test('should be possible to use `null` as a DEFAULT value', async () => {
-    expect(
-      await run(
-        ['foo:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('foo', (value) => `.foo${value === null ? '-good' : '-bad'} &`, {
+                values: { DEFAULT: null },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('foo', (value) => `.foo${value === null ? '-good' : '-bad'} &`, {
-                  values: { DEFAULT: null },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['foo:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .foo-good .foo\\:underline {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should be possible to use `undefined` as a DEFAULT value', async () => {
-    expect(
-      await run(
-        ['foo:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('foo', (value) => `.foo${value === undefined ? '-good' : '-bad'} &`, {
+                values: { DEFAULT: undefined },
+              })
+            },
           }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('foo', (value) => `.foo${value === undefined ? '-good' : '-bad'} &`, {
-                  values: { DEFAULT: undefined },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+    let compiled = build(['foo:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .foo-good .foo\\:underline {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('should be called with eventual modifiers', async () => {
-    expect(
-      await run(
-        ['my-container-[250px]:underline', 'my-container-[250px]/placement:underline'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('my-container', (value, { modifier }) => {
-                  function parseValue(value: string) {
-                    const numericValue = value.match(/^(\d+\.\d+|\d+|\.\d+)\D+/)?.[1] ?? null
-                    if (numericValue === null) return null
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        loadModule: async (id, base) => {
+          return {
+            base,
+            module: ({ matchVariant }: PluginAPI) => {
+              matchVariant('my-container', (value, { modifier }) => {
+                function parseValue(value: string) {
+                  const numericValue = value.match(/^(\d+\.\d+|\d+|\.\d+)\D+/)?.[1] ?? null
+                  if (numericValue === null) return null
 
-                    return parseFloat(value)
-                  }
+                  return parseFloat(value)
+                }
 
-                  const parsed = parseValue(value)
-                  return parsed !== null ? `@container ${modifier ?? ''} (min-width: ${value})` : []
-                })
-              },
-            }
-          },
+                const parsed = parseValue(value)
+                return parsed !== null ? `@container ${modifier ?? ''} (min-width: ${value})` : []
+              })
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @container (min-width: 250px) {
+      },
+    )
+    let compiled = build([
+      'my-container-[250px]:underline',
+      'my-container-[250px]/placement:underline',
+    ])
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@container (width >= 250px) {
         .my-container-\\[250px\\]\\:underline {
           text-decoration-line: underline;
         }
       }
 
-      @container placement (min-width: 250px) {
+      @container placement (width >= 250px) {
         .my-container-\\[250px\\]\\/placement\\:underline {
           text-decoration-line: underline;
         }
-      }
-      "
-    `)
-  })
-
-  test('ignores variants that use :merge(…)', async () => {
-    expect(
-      await run(
-        [
-          'optional-[test]:flex',
-          'group-optional-[test]:flex',
-          'peer-optional-[test]:flex',
-          'group-optional-[test]/foo:flex',
-        ],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('optional', (flavor) => `&:optional:has(${flavor}) &`)
-                matchVariant(
-                  'group-optional',
-                  (flavor) => `:merge(.group):optional:has(${flavor}) &`,
-                )
-                matchVariant(
-                  'peer-optional',
-                  (flavor) => `:merge(.peer):optional:has(${flavor}) ~ &`,
-                )
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:where(.group):optional:has(test) :where(.group) .group-optional-\\[test\\]\\:flex), :is(:where(.group\\/foo):optional:has(test) :where(.group\\/foo) .group-optional-\\[test\\]\\/foo\\:flex), :is(:where(.peer):optional:has(test) :where(.peer) ~ .peer-optional-\\[test\\]\\:flex), .optional-\\[test\\]\\:flex:optional:has(test) .optional-\\[test\\]\\:flex {
-          display: flex;
-        }
-      }
-      "
-    `)
-  })
-
-  test('ignores variants that use unknown values', async () => {
-    expect(
-      await run(
-        ['foo-[test]:flex', 'foo-known:flex', 'foo-unknown:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('foo', (flavor) => `&:is(${flavor})`, {
-                  values: { known: 'known' },
-                })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        .foo-known\\:flex:is(known), .foo-\\[test\\]\\:flex:is(test) {
-          display: flex;
-        }
-      }
-      "
-    `)
-  })
-
-  test('ignores variants that produce non-string values', async () => {
-    expect(
-      await run(
-        ['foo-[test]:flex', 'foo-string:flex', 'foo-object:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: ({ matchVariant }: PluginAPI) => {
-                matchVariant('foo', (flavor) => `&:is(${flavor})`, {
-                  values: {
-                    string: 'some string',
-                    object: { some: 'object' },
-                  },
-                })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        .foo-string\\:flex:is(some string), .foo-\\[test\\]\\:flex:is(test) {
-          display: flex;
-        }
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('addUtilities()', () => {
   test('custom static utility', async () => {
-    expect(
-      await run(
-        ['text-trim', 'lg:text-trim'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
 
-          @theme reference {
-            --breakpoint-lg: 1024px;
+        @theme reference {
+          --breakpoint-lg: 1024px;
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.text-trim': {
+                  'text-box-trim': 'both',
+                  'text-box-edge': 'cap alphabetic',
+                },
+              })
+            },
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.text-trim': {
-                    'text-box-trim': 'both',
-                    'text-box-edge': 'cap alphabetic',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['text-trim', 'lg:text-trim'])).trim())
+      .toMatchInlineSnapshot(`
+      "@layer utilities {
         .text-trim {
           text-box-trim: both;
           text-box-edge: cap alphabetic;
         }
 
-        @media (min-width: 1024px) {
+        @media (width >= 1024px) {
           .lg\\:text-trim {
             text-box-trim: both;
             text-box-edge: cap alphabetic;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('return multiple rule objects from a custom utility', async () => {
-    expect(
-      await run(
-        ['text-trim'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities([
-                  {
-                    '.text-trim': [
-                      { 'text-box-trim': 'both' },
-                      { 'text-box-edge': 'cap alphabetic' },
-                    ],
-                  },
-                ])
-              },
-            }
-          },
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities([
+                {
+                  '.text-trim': [
+                    { 'text-box-trim': 'both' },
+                    { 'text-box-edge': 'cap alphabetic' },
+                  ],
+                },
+              ])
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .text-trim {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['text-trim'])).trim()).toMatchInlineSnapshot(`
+      ".text-trim {
         text-box-trim: both;
         text-box-edge: cap alphabetic;
-      }
-      "
+      }"
     `)
   })
 
   test('define multiple utilities with array syntax', async () => {
-    expect(
-      await run(
-        ['text-trim', 'text-trim-2'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities([
-                  {
-                    '.text-trim': {
-                      'text-box-trim': 'both',
-                      'text-box-edge': 'cap alphabetic',
-                    },
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities([
+                {
+                  '.text-trim': {
+                    'text-box-trim': 'both',
+                    'text-box-edge': 'cap alphabetic',
                   },
-                  {
-                    '.text-trim-2': {
-                      'text-box-trim': 'both',
-                      'text-box-edge': 'cap alphabetic',
-                    },
+                },
+                {
+                  '.text-trim-2': {
+                    'text-box-trim': 'both',
+                    'text-box-edge': 'cap alphabetic',
                   },
-                ])
-              },
-            }
-          },
+                },
+              ])
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .text-trim, .text-trim-2 {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['text-trim', 'text-trim-2'])).trim()).toMatchInlineSnapshot(`
+      ".text-trim, .text-trim-2 {
         text-box-trim: both;
         text-box-edge: cap alphabetic;
-      }
-      "
+      }"
     `)
   })
 
   test('utilities can use arrays for fallback declaration values', async () => {
-    expect(
-      await run(
-        ['outlined'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities([
-                  {
-                    '.outlined': {
-                      outline: ['1px solid ButtonText', '1px auto -webkit-focus-ring-color'],
-                    },
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities([
+                {
+                  '.outlined': {
+                    outline: ['1px solid ButtonText', '1px auto -webkit-focus-ring-color'],
                   },
-                ])
-              },
-            }
-          },
+                },
+              ])
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .outlined {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['outlined'])).trim()).toMatchInlineSnapshot(`
+      ".outlined {
         outline: 1px solid buttontext;
         outline: 1px auto -webkit-focus-ring-color;
-      }
-      "
+      }"
     `)
   })
 
   test('camel case properties are converted to kebab-case', async () => {
-    expect(
-      await run(
-        ['text-trim'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.text-trim': {
+                  WebkitAppearance: 'none',
+                  textBoxTrim: 'both',
+                  textBoxEdge: 'cap alphabetic',
+                },
+              })
+            },
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.text-trim': {
-                    WebkitAppearance: 'none',
-                    textBoxTrim: 'both',
-                    textBoxEdge: 'cap alphabetic',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['text-trim'])).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .text-trim {
           -webkit-appearance: none;
           text-box-trim: both;
           text-box-edge: cap alphabetic;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom static utilities support `@apply`', async () => {
-    expect(
-      await run(
-        ['foo', 'lg:foo'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
 
-          @theme reference {
-            --breakpoint-lg: 1024px;
+        @theme reference {
+          --breakpoint-lg: 1024px;
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.foo': {
+                  '@apply flex dark:underline': {},
+                },
+              })
+            },
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.foo': {
-                    '@apply flex dark:underline': {},
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['foo', 'lg:foo'])).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .foo {
           display: flex;
         }
@@ -3236,7 +2873,7 @@ describe('addUtilities()', () => {
           }
         }
 
-        @media (min-width: 1024px) {
+        @media (width >= 1024px) {
           .lg\\:foo {
             display: flex;
           }
@@ -3247,8 +2884,7 @@ describe('addUtilities()', () => {
             }
           }
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -3266,9 +2902,8 @@ describe('addUtilities()', () => {
           }
         `,
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ addUtilities }: PluginAPI) => {
                 addUtilities({
@@ -3282,336 +2917,354 @@ describe('addUtilities()', () => {
           },
         },
       )
-    }).rejects.toThrow(/invalid utility selector/)
+    }).rejects.toThrowError(/invalid utility selector/)
   })
 
   test('supports multiple selector names', async () => {
-    expect(
-      await run(
-        ['form-input', 'lg:form-textarea'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
 
-          @theme reference {
-            --breakpoint-lg: 1024px;
+        @theme reference {
+          --breakpoint-lg: 1024px;
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.form-input, .form-textarea': {
+                  appearance: 'none',
+                  'background-color': '#fff',
+                },
+              })
+            },
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.form-input, .form-textarea': {
-                    appearance: 'none',
-                    'background-color': '#fff',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .form-input {
-        appearance: none;
-        background-color: #fff;
-      }
+      },
+    )
 
-      @media (min-width: 1024px) {
-        .lg\\:form-textarea {
+    expect(optimizeCss(compiled.build(['form-input', 'lg:form-textarea'])).trim())
+      .toMatchInlineSnapshot(`
+        ".form-input {
           appearance: none;
           background-color: #fff;
         }
-      }
-      "
-    `)
+
+        @media (width >= 1024px) {
+          .lg\\:form-textarea {
+            appearance: none;
+            background-color: #fff;
+          }
+        }"
+      `)
   })
 
   test('supports pseudo classes and pseudo elements', async () => {
-    expect(
-      await run(
-        ['form-input', 'lg:form-textarea'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
 
-          @theme reference {
-            --breakpoint-lg: 1024px;
+        @theme reference {
+          --breakpoint-lg: 1024px;
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.form-input, .form-input::placeholder, .form-textarea:hover:focus': {
+                  'background-color': 'red',
+                },
+              })
+            },
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.form-input, .form-input::placeholder, .form-textarea:hover:focus': {
-                    'background-color': 'red',
-                  },
-                })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .form-input, .form-input::placeholder {
-        background-color: red;
-      }
+      },
+    )
 
-      @media (min-width: 1024px) {
-        .lg\\:form-textarea:hover:focus {
+    expect(compiled.build(['form-input', 'lg:form-textarea']).trim()).toMatchInlineSnapshot(`
+      ".form-input {
+        background-color: red;
+        &::placeholder {
           background-color: red;
         }
       }
-      "
+      .lg\\:form-textarea {
+        @media (width >= 1024px) {
+          &:hover:focus {
+            background-color: red;
+          }
+        }
+      }"
     `)
   })
 
   test('nests complex utility names', async () => {
-    expect(
-      await run(
-        ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.a .b:hover .c': { color: 'red' },
-                  '.d > *': { color: 'red' },
-                  '.e .bar:not(.f):has(.g)': { color: 'red' },
-                  '.h~.i': { color: 'red' },
-                  '.j.j': { color: 'red' },
-                })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        .j.j, .a .b:hover .c, .d > *, .e .bar:not(.f):has(.g), .h ~ .i {
-          color: red;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
         }
-      }
-      "
-    `)
-  })
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.a .b:hover .c': {
+                  color: 'red',
+                },
+                '.d > *': {
+                  color: 'red',
+                },
+                '.e .bar:not(.f):has(.g)': {
+                  color: 'red',
+                },
+                '.h~.i': {
+                  color: 'red',
+                },
+                '.j.j': {
+                  color: 'red',
+                },
+              })
+            },
+          }
+        },
+      },
+    )
 
-  test('does not register class names inside `:nth-child(… of …)` as utilities', async () => {
     expect(
-      await run(
-        ['foo', 'mark'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
+      compiled.build(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']).trim(),
+    ).toMatchInlineSnapshot(
+      `
+      "@layer utilities {
+        .j {
+          &.j {
+            color: red;
+          }
+          .j& {
+            color: red;
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.foo:nth-child(2 of .mark)': { color: 'red' },
-                })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        .foo:nth-child(2 of .mark) {
-          color: red;
         }
-      }
-      "
-    `)
+        .a {
+          & .b:hover .c {
+            color: red;
+          }
+        }
+        .b {
+          .a &:hover .c {
+            color: red;
+          }
+        }
+        .c {
+          .a .b:hover & {
+            color: red;
+          }
+        }
+        .d {
+          & > * {
+            color: red;
+          }
+        }
+        .e {
+          & .bar:not(.f):has(.g) {
+            color: red;
+          }
+        }
+        .g {
+          .e .bar:not(.f):has(&) {
+            color: red;
+          }
+        }
+        .h {
+          &~.i {
+            color: red;
+          }
+        }
+        .i {
+          .h~& {
+            color: red;
+          }
+        }
+      }"
+    `,
+    )
   })
 
   test('prefixes nested class names with the configured theme prefix', async () => {
-    expect(
-      await run(
-        ['tw:a', 'tw:b', 'tw:c', 'tw:d'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-          @theme prefix(tw) {
-          }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({ '.a .b:hover .c.d': { color: 'red' } })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        .tw\\:a .tw\\:b:hover .tw\\:c.tw\\:d {
-          color: red;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
         }
-      }
-      "
-    `)
+        @theme prefix(tw) {
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.a .b:hover .c.d': {
+                  color: 'red',
+                },
+              })
+            },
+          }
+        },
+      },
+    )
+
+    expect(compiled.build(['tw:a', 'tw:b', 'tw:c', 'tw:d']).trim()).toMatchInlineSnapshot(
+      `
+      "@layer utilities {
+        .tw\\:a {
+          & .tw\\:b:hover .tw\\:c.tw\\:d {
+            color: red;
+          }
+        }
+        .tw\\:b {
+          .tw\\:a &:hover .tw\\:c.tw\\:d {
+            color: red;
+          }
+        }
+        .tw\\:c {
+          .tw\\:a .tw\\:b:hover &.tw\\:d {
+            color: red;
+          }
+        }
+        .tw\\:d {
+          .tw\\:a .tw\\:b:hover .tw\\:c& {
+            color: red;
+          }
+        }
+      }"
+    `,
+    )
   })
 
   test('replaces the class name with variants in nested selectors', async () => {
-    expect(
-      await run(
-        ['foo', 'md:foo', 'not-hover:md:foo'],
-        css`
-          @plugin "my-plugin";
-          @theme {
-            --breakpoint-md: 768px;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @theme {
+          --breakpoint-md: 768px;
+        }
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addUtilities }: PluginAPI) => {
+              addUtilities({
+                '.foo': {
+                  ':where(.foo > :first-child)': {
+                    color: 'red',
+                  },
+                },
+              })
+            },
           }
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({ '.foo': { ':where(.foo > :first-child)': { color: 'red' } } })
-              },
-            }
-          },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .foo :where(.foo > :first-child) {
-        color: red;
-      }
+      },
+    )
 
-      @media (min-width: 768px) {
-        .md\\:foo :where(.md\\:foo > :first-child), .not-hover\\:md\\:foo:not(:hover) :where(.not-hover\\:md\\:foo > :first-child) {
+    expect(compiled.build(['foo', 'md:foo', 'not-hover:md:foo']).trim()).toMatchInlineSnapshot(`
+      ".foo {
+        :where(.foo > :first-child) {
           color: red;
         }
       }
-
-      @media not all and (hover: hover) {
-        @media (min-width: 768px) {
-          .not-hover\\:md\\:foo :where(.not-hover\\:md\\:foo > :first-child) {
+      .md\\:foo {
+        @media (width >= 768px) {
+          :where(.md\\:foo > :first-child) {
             color: red;
           }
         }
       }
-      "
-    `)
-  })
-
-  test('values that are `false`, `null`, or `undefined` are discarded from CSS object ASTs', async () => {
-    expect(
-      await run(
-        ['foo'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addUtilities }: PluginAPI) => {
-                addUtilities({
-                  '.foo': {
-                    a: 'red',
-                    // @ts-ignore: While this isn't valid per the types this did work in v3
-                    'z-index': 0,
-                    // @ts-ignore
-                    '.bar': false,
-                    // @ts-ignore
-                    '.baz': null,
-                    // @ts-ignore
-                    '.qux': undefined,
-                  },
-                })
-              },
+      .not-hover\\:md\\:foo {
+        &:not(*:hover) {
+          @media (width >= 768px) {
+            :where(.not-hover\\:md\\:foo > :first-child) {
+              color: red;
             }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .foo {
-        a: red;
-        z-index: 0;
-      }
-      "
+          }
+        }
+        @media not (hover: hover) {
+          @media (width >= 768px) {
+            :where(.not-hover\\:md\\:foo > :first-child) {
+              color: red;
+            }
+          }
+        }
+      }"
     `)
   })
 })
 
 describe('matchUtilities()', () => {
   test('custom functional utility', async () => {
-    let input = css`
-      @plugin "my-plugin";
+    async function run(candidates: string[]) {
+      let compiled = await compile(
+        css`
+          @plugin "my-plugin";
 
-      @tailwind utilities;
+          @tailwind utilities;
 
-      @theme reference {
-        --breakpoint-lg: 1024px;
-      }
-    `
+          @theme reference {
+            --breakpoint-lg: 1024px;
+          }
+        `,
 
-    expect(
-      await run(
-        [
-          'border-block',
-          'border-block-2',
-          'border-block-[35px]',
-          'border-block-[var(--foo)]',
-          'lg:border-block-2',
-        ],
-        input,
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities(
-                  { 'border-block': (value) => ({ 'border-block-width': value }) },
-                  { values: { DEFAULT: '1px', '2': '2px' } },
+                  {
+                    'border-block': (value) => ({ 'border-block-width': value }),
+                  },
+                  {
+                    values: {
+                      DEFAULT: '1px',
+                      '2': '2px',
+                    },
+                  },
                 )
               },
             }
           },
         },
-      ),
+      )
+
+      return compiled.build(candidates)
+    }
+
+    expect(
+      optimizeCss(
+        await run([
+          'border-block',
+          'border-block-2',
+          'border-block-[35px]',
+          'border-block-[var(--foo)]',
+          'lg:border-block-2',
+        ]),
+      ).trim(),
     ).toMatchInlineSnapshot(`
-      "
-      .border-block {
+      ".border-block {
         border-block-width: 1px;
       }
 
@@ -3627,122 +3280,114 @@ describe('matchUtilities()', () => {
         border-block-width: var(--foo);
       }
 
-      @media (min-width: 1024px) {
+      @media (width >= 1024px) {
         .lg\\:border-block-2 {
           border-block-width: 2px;
         }
-      }
-      "
+      }"
     `)
 
     expect(
-      await run(
-        [
+      optimizeCss(
+        await run([
           '-border-block',
           '-border-block-2',
           'lg:-border-block-2',
           'border-block-unknown',
           'border-block/1',
-        ],
-        input,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchUtilities }: PluginAPI) => {
-                matchUtilities(
-                  { 'border-block': (value) => ({ 'border-block-width': value }) },
-                  { values: { DEFAULT: '1px', '2': '2px' } },
-                )
-              },
-            }
-          },
-        },
-      ),
+        ]),
+      ).trim(),
     ).toEqual('')
   })
 
   test('custom functional utilities can start with @', async () => {
-    expect(
-      await run(
-        ['@w-1', 'hover:@w-1'],
+    async function run(candidates: string[]) {
+      let compiled = await compile(
         css`
           @plugin "my-plugin";
           @tailwind utilities;
         `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchUtilities }: PluginAPI) => {
-                matchUtilities({ '@w': (value) => ({ width: value }) }, { values: { 1: '1px' } })
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .\\@w-1 {
-        width: 1px;
-      }
 
-      @media (hover: hover) {
-        .hover\\:\\@w-1:hover {
-          width: 1px;
-        }
-      }
-      "
-    `)
-  })
-
-  test('custom functional utilities can return an array of rules', async () => {
-    expect(
-      await run(
-        ['all-but-order-bottom-left-radius'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities(
+                  { '@w': (value) => ({ width: value }) },
                   {
-                    'all-but-order-bottom-left-radius': (value) =>
-                      [
-                        { 'border-top-left-radius': value },
-                        { 'border-top-right-radius': value },
-                        { 'border-bottom-right-radius': value },
-                      ] as CssInJs[],
+                    values: {
+                      1: '1px',
+                    },
                   },
-                  { values: { DEFAULT: '1px' } },
                 )
               },
             }
           },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .all-but-order-bottom-left-radius {
-        border-top-left-radius: 1px;
-        border-top-right-radius: 1px;
-        border-bottom-right-radius: 1px;
-      }
-      "
-    `)
+      )
+
+      return compiled.build(candidates)
+    }
+
+    expect(optimizeCss(await run(['@w-1', 'hover:@w-1'])).trim()).toMatchInlineSnapshot(`
+        ".\\@w-1 {
+          width: 1px;
+        }
+
+        @media (hover: hover) {
+          .hover\\:\\@w-1:hover {
+            width: 1px;
+          }
+        }"
+      `)
+  })
+
+  test('custom functional utilities can return an array of rules', async () => {
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ matchUtilities }: PluginAPI) => {
+              matchUtilities(
+                {
+                  'all-but-order-bottom-left-radius': (value) =>
+                    [
+                      { 'border-top-left-radius': value },
+                      { 'border-top-right-radius': value },
+                      { 'border-bottom-right-radius': value },
+                    ] as CssInJs[],
+                },
+                {
+                  values: {
+                    DEFAULT: '1px',
+                  },
+                },
+              )
+            },
+          }
+        },
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['all-but-order-bottom-left-radius'])).trim())
+      .toMatchInlineSnapshot(`
+        ".all-but-order-bottom-left-radius {
+          border-top-left-radius: 1px;
+          border-top-right-radius: 1px;
+          border-bottom-right-radius: 1px;
+        }"
+      `)
   })
 
   test('custom functional utility with any modifier', async () => {
-    expect(
-      await run(
-        ['border-block', 'border-block-2', 'border-block/foo', 'border-block-2/foo'],
+    async function run(candidates: string[]) {
+      let compiled = await compile(
         css`
           @plugin "my-plugin";
 
@@ -3752,10 +3397,10 @@ describe('matchUtilities()', () => {
             --breakpoint-lg: 1024px;
           }
         `,
+
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities(
@@ -3765,16 +3410,30 @@ describe('matchUtilities()', () => {
                       'border-block-width': value,
                     }),
                   },
-                  { values: { DEFAULT: '1px', '2': '2px' }, modifiers: 'any' },
+                  {
+                    values: {
+                      DEFAULT: '1px',
+                      '2': '2px',
+                    },
+
+                    modifiers: 'any',
+                  },
                 )
               },
             }
           },
         },
-      ),
+      )
+
+      return compiled.build(candidates)
+    }
+
+    expect(
+      optimizeCss(
+        await run(['border-block', 'border-block-2', 'border-block/foo', 'border-block-2/foo']),
+      ).trim(),
     ).toMatchInlineSnapshot(`
-      "
-      .border-block {
+      ".border-block {
         --my-modifier: none;
         border-block-width: 1px;
       }
@@ -3792,30 +3451,26 @@ describe('matchUtilities()', () => {
       .border-block\\/foo {
         --my-modifier: foo;
         border-block-width: 1px;
-      }
-      "
+      }"
     `)
   })
 
   test('custom functional utility with known modifier', async () => {
-    let input = css`
-      @plugin "my-plugin";
+    async function run(candidates: string[]) {
+      let compiled = await compile(
+        css`
+          @plugin "my-plugin";
 
-      @tailwind utilities;
+          @tailwind utilities;
 
-      @theme reference {
-        --breakpoint-lg: 1024px;
-      }
-    `
+          @theme reference {
+            --breakpoint-lg: 1024px;
+          }
+        `,
 
-    expect(
-      await run(
-        ['border-block', 'border-block-2', 'border-block/foo', 'border-block-2/foo'],
-        input,
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities(
@@ -3826,18 +3481,31 @@ describe('matchUtilities()', () => {
                     }),
                   },
                   {
-                    values: { DEFAULT: '1px', '2': '2px' },
-                    modifiers: { foo: 'foo' },
+                    values: {
+                      DEFAULT: '1px',
+                      '2': '2px',
+                    },
+
+                    modifiers: {
+                      foo: 'foo',
+                    },
                   },
                 )
               },
             }
           },
         },
-      ),
+      )
+
+      return compiled.build(candidates)
+    }
+
+    expect(
+      optimizeCss(
+        await run(['border-block', 'border-block-2', 'border-block/foo', 'border-block-2/foo']),
+      ).trim(),
     ).toMatchInlineSnapshot(`
-      "
-      .border-block {
+      ".border-block {
         --my-modifier: none;
         border-block-width: 1px;
       }
@@ -3855,33 +3523,11 @@ describe('matchUtilities()', () => {
       .border-block\\/foo {
         --my-modifier: foo;
         border-block-width: 1px;
-      }
-      "
+      }"
     `)
 
     expect(
-      await run(['border-block/unknown', 'border-block-2/unknown'], input, {
-        async loadModule(_id, base) {
-          return {
-            path: '',
-            base,
-            module: ({ matchUtilities }: PluginAPI) => {
-              matchUtilities(
-                {
-                  'border-block': (value, { modifier }) => ({
-                    '--my-modifier': modifier ?? 'none',
-                    'border-block-width': value,
-                  }),
-                },
-                {
-                  values: { DEFAULT: '1px', '2': '2px' },
-                  modifiers: { foo: 'foo' },
-                },
-              )
-            },
-          }
-        },
-      }),
+      optimizeCss(await run(['border-block/unknown', 'border-block-2/unknown'])).trim(),
     ).toEqual('')
   })
 
@@ -3889,127 +3535,190 @@ describe('matchUtilities()', () => {
   // future don't be afraid to change what should happen in this scenario.
   describe('plugins that handle a specific arbitrary value type prevent falling through to other plugins if the result is invalid for that plugin', () => {
     test('implicit color modifier', async () => {
-      let input = css`
-        @tailwind utilities;
-        @plugin "my-plugin";
-      `
-
-      let options: Partial<Parameters<typeof compile>[1]> = {
-        async loadModule(_id, base) {
-          return {
-            path: '',
-            base,
-            module: ({ matchUtilities }: PluginAPI) => {
-              matchUtilities(
-                { scrollbar: (value) => ({ 'scrollbar-color': value }) },
-                { type: ['color', 'any'] },
-              )
-              matchUtilities(
-                { scrollbar: (value) => ({ 'scrollbar-width': value }) },
-                { type: ['length'] },
-              )
-            },
-          }
-        },
-      }
-
-      expect(
-        await run(['scrollbar-[2px]', 'scrollbar-[#08c]', 'scrollbar-[#08c]/50'], input, options),
-      ).toMatchInlineSnapshot(`
-        "
-        .scrollbar-\\[2px\\] {
-          scrollbar-width: 2px;
-        }
-
-        .scrollbar-\\[\\#08c\\] {
-          scrollbar-color: #08c;
-        }
-
-        .scrollbar-\\[\\#08c\\]\\/50 {
-          scrollbar-color: oklab(59.9824% -.067 -.124 / .5);
-        }
-        "
-      `)
-      expect(await run(['scrollbar-[2px]/50'], input, options)).toEqual('')
-    })
-
-    test('no modifiers are supported by the plugins', async () => {
-      expect(
-        await run(
-          ['scrollbar-[2px]/50'],
+      async function run(candidates: string[]) {
+        let compiled = await compile(
           css`
             @tailwind utilities;
             @plugin "my-plugin";
           `,
+
           {
-            async loadModule(_id, base) {
+            async loadModule(id, base) {
               return {
-                path: '',
                 base,
                 module: ({ matchUtilities }: PluginAPI) => {
                   matchUtilities(
-                    { scrollbar: (value) => ({ '--scrollbar-angle': value }) },
-                    { type: ['angle', 'any'] },
+                    {
+                      scrollbar: (value) => ({ 'scrollbar-color': value }),
+                    },
+                    { type: ['color', 'any'] },
                   )
 
                   matchUtilities(
-                    { scrollbar: (value) => ({ '--scrollbar-width': value }) },
+                    {
+                      scrollbar: (value) => ({ 'scrollbar-width': value }),
+                    },
                     { type: ['length'] },
                   )
                 },
               }
             },
           },
-        ),
-      ).toEqual('')
+        )
+
+        return compiled.build(candidates)
+      }
+
+      expect(
+        optimizeCss(
+          await run(['scrollbar-[2px]', 'scrollbar-[#08c]', 'scrollbar-[#08c]/50']),
+        ).trim(),
+      ).toMatchInlineSnapshot(`
+        ".scrollbar-\\[\\#08c\\] {
+          scrollbar-color: #08c;
+        }
+
+        .scrollbar-\\[\\#08c\\]\\/50 {
+          scrollbar-color: oklab(59.9824% -.06725 -.12414 / .5);
+        }
+
+        .scrollbar-\\[2px\\] {
+          scrollbar-width: 2px;
+        }"
+      `)
+      expect(optimizeCss(await run(['scrollbar-[2px]/50'])).trim()).toEqual('')
     })
 
-    test('invalid named modifier', async () => {
-      expect(
-        await run(
-          ['scrollbar-[2px]/foo'],
+    test('no modifiers are supported by the plugins', async () => {
+      async function run(candidates: string[]) {
+        let compiled = await compile(
           css`
             @tailwind utilities;
             @plugin "my-plugin";
           `,
+
           {
-            async loadModule(_id, base) {
+            async loadModule(id, base) {
               return {
-                path: '',
                 base,
                 module: ({ matchUtilities }: PluginAPI) => {
                   matchUtilities(
-                    { scrollbar: (value) => ({ 'scrollbar-color': value }) },
+                    {
+                      scrollbar: (value) => ({ '--scrollbar-angle': value }),
+                    },
+                    { type: ['angle', 'any'] },
+                  )
+
+                  matchUtilities(
+                    {
+                      scrollbar: (value) => ({ '--scrollbar-width': value }),
+                    },
+                    { type: ['length'] },
+                  )
+                },
+              }
+            },
+          },
+        )
+
+        return compiled.build(candidates)
+      }
+
+      expect(optimizeCss(await run(['scrollbar-[2px]/50'])).trim()).toEqual('')
+    })
+
+    test('invalid named modifier', async () => {
+      async function run(candidates: string[]) {
+        let compiled = await compile(
+          css`
+            @tailwind utilities;
+            @plugin "my-plugin";
+          `,
+
+          {
+            async loadModule(id, base) {
+              return {
+                base,
+                module: ({ matchUtilities }: PluginAPI) => {
+                  matchUtilities(
+                    {
+                      scrollbar: (value) => ({ 'scrollbar-color': value }),
+                    },
                     { type: ['color', 'any'], modifiers: { foo: 'foo' } },
                   )
 
                   matchUtilities(
-                    { scrollbar: (value) => ({ 'scrollbar-width': value }) },
+                    {
+                      scrollbar: (value) => ({ 'scrollbar-width': value }),
+                    },
                     { type: ['length'], modifiers: { bar: 'bar' } },
                   )
                 },
               }
             },
           },
-        ),
-      ).toEqual('')
+        )
+
+        return compiled.build(candidates)
+      }
+
+      expect(optimizeCss(await run(['scrollbar-[2px]/foo'])).trim()).toEqual('')
     })
   })
 
   test('custom functional utilities with different types', async () => {
-    let input = css`
-      @plugin "my-plugin";
+    async function run(candidates: string[]) {
+      let compiled = await compile(
+        css`
+          @plugin "my-plugin";
 
-      @tailwind utilities;
+          @tailwind utilities;
 
-      @theme reference {
-        --breakpoint-lg: 1024px;
-      }
-    `
+          @theme reference {
+            --breakpoint-lg: 1024px;
+          }
+        `,
+
+        {
+          async loadModule(id, base) {
+            return {
+              base,
+              module: ({ matchUtilities }: PluginAPI) => {
+                matchUtilities(
+                  {
+                    scrollbar: (value) => ({ 'scrollbar-color': value }),
+                  },
+                  {
+                    type: ['color', 'any'],
+                    values: {
+                      black: 'black',
+                    },
+                  },
+                )
+
+                matchUtilities(
+                  {
+                    scrollbar: (value) => ({ 'scrollbar-width': value }),
+                  },
+                  {
+                    type: ['length'],
+                    values: {
+                      2: '2px',
+                    },
+                  },
+                )
+              },
+            }
+          },
+        },
+      )
+
+      return compiled.build(candidates)
+    }
 
     expect(
-      await run(
-        [
+      optimizeCss(
+        await run([
           'scrollbar-black',
           'scrollbar-black/50',
           'scrollbar-2',
@@ -4021,38 +3730,13 @@ describe('matchUtilities()', () => {
           'scrollbar-[color:var(--my-color)]',
           'scrollbar-[color:var(--my-color)]/50',
           'scrollbar-[length:var(--my-width)]',
-        ],
-        input,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchUtilities }: PluginAPI) => {
-                matchUtilities(
-                  { scrollbar: (value) => ({ 'scrollbar-color': value }) },
-                  { type: ['color', 'any'], values: { black: 'black' } },
-                )
-
-                matchUtilities(
-                  { scrollbar: (value) => ({ 'scrollbar-width': value }) },
-                  { type: ['length'], values: { 2: '2px' } },
-                )
-              },
-            }
-          },
-        },
-      ),
+        ]),
+      ).trim(),
     ).toMatchInlineSnapshot(`
-      "
-      .scrollbar-2, .scrollbar-\\[2px\\] {
+      ".scrollbar-2 {
         scrollbar-width: 2px;
       }
 
-      .scrollbar-\\[length\\:var\\(--my-width\\)\\] {
-        scrollbar-width: var(--my-width);
-      }
-
       .scrollbar-\\[\\#fff\\] {
         scrollbar-color: #fff;
       }
@@ -4061,24 +3745,28 @@ describe('matchUtilities()', () => {
         scrollbar-color: oklab(100% 0 5.96046e-8 / .5);
       }
 
-      .scrollbar-\\[color\\:var\\(--my-color\\)\\], .scrollbar-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+      .scrollbar-\\[2px\\] {
+        scrollbar-width: 2px;
+      }
+
+      .scrollbar-\\[color\\:var\\(--my-color\\)\\] {
         scrollbar-color: var(--my-color);
       }
 
-      @supports (color: color-mix(in lab, red, red)) {
-        .scrollbar-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-          scrollbar-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        }
+      .scrollbar-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+        scrollbar-color: color-mix(in oklab, var(--my-color) 50%, transparent);
       }
 
-      .scrollbar-\\[var\\(--my-color\\)\\], .scrollbar-\\[var\\(--my-color\\)\\]\\/50 {
+      .scrollbar-\\[length\\:var\\(--my-width\\)\\] {
+        scrollbar-width: var(--my-width);
+      }
+
+      .scrollbar-\\[var\\(--my-color\\)\\] {
         scrollbar-color: var(--my-color);
       }
 
-      @supports (color: color-mix(in lab, red, red)) {
-        .scrollbar-\\[var\\(--my-color\\)\\]\\/50 {
-          scrollbar-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        }
+      .scrollbar-\\[var\\(--my-color\\)\\]\\/50 {
+        scrollbar-color: color-mix(in oklab, var(--my-color) 50%, transparent);
       }
 
       .scrollbar-black {
@@ -4087,48 +3775,23 @@ describe('matchUtilities()', () => {
 
       .scrollbar-black\\/50 {
         scrollbar-color: oklab(0% none none / .5);
-      }
-      "
+      }"
     `)
 
     expect(
-      await run(
-        ['scrollbar-2/50', 'scrollbar-[2px]/50', 'scrollbar-[length:var(--my-width)]/50'],
-        input,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchUtilities }: PluginAPI) => {
-                matchUtilities(
-                  { scrollbar: (value) => ({ 'scrollbar-color': value }) },
-                  { type: ['color', 'any'], values: { black: 'black' } },
-                )
-
-                matchUtilities(
-                  { scrollbar: (value) => ({ 'scrollbar-width': value }) },
-                  { type: ['length'], values: { 2: '2px' } },
-                )
-              },
-            }
-          },
-        },
-      ),
+      optimizeCss(
+        await run([
+          'scrollbar-2/50',
+          'scrollbar-[2px]/50',
+          'scrollbar-[length:var(--my-width)]/50',
+        ]),
+      ).trim(),
     ).toEqual('')
   })
 
   test('functional utilities with `type: color` automatically support opacity', async () => {
-    expect(
-      await run(
-        [
-          'scrollbar-current',
-          'scrollbar-current/45',
-          'scrollbar-black',
-          'scrollbar-black/33',
-          'scrollbar-black/[50%]',
-          'scrollbar-[var(--my-color)]/[25%]',
-        ],
+    async function run(candidates: string[]) {
+      let compiled = await compile(
         css`
           @plugin "my-plugin";
 
@@ -4138,31 +3801,46 @@ describe('matchUtilities()', () => {
             --breakpoint-lg: 1024px;
           }
         `,
+
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities(
-                  { scrollbar: (value) => ({ 'scrollbar-color': value }) },
-                  { type: ['color', 'any'], values: { black: 'black' } },
+                  {
+                    scrollbar: (value) => ({ 'scrollbar-color': value }),
+                  },
+                  {
+                    type: ['color', 'any'],
+                    values: {
+                      black: 'black',
+                    },
+                  },
                 )
               },
             }
           },
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .scrollbar-\\[var\\(--my-color\\)\\]\\/\\[25\\%\\] {
-        scrollbar-color: var(--my-color);
-      }
+      )
 
-      @supports (color: color-mix(in lab, red, red)) {
-        .scrollbar-\\[var\\(--my-color\\)\\]\\/\\[25\\%\\] {
-          scrollbar-color: color-mix(in oklab, var(--my-color) 25%, transparent);
-        }
+      return compiled.build(candidates)
+    }
+
+    expect(
+      optimizeCss(
+        await run([
+          'scrollbar-current',
+          'scrollbar-current/45',
+          'scrollbar-black',
+          'scrollbar-black/33',
+          'scrollbar-black/[50%]',
+          'scrollbar-[var(--my-color)]/[25%]',
+        ]),
+      ).trim(),
+    ).toMatchInlineSnapshot(`
+      ".scrollbar-\\[var\\(--my-color\\)\\]\\/\\[25\\%\\] {
+        scrollbar-color: color-mix(in oklab, var(--my-color) 25%, transparent);
       }
 
       .scrollbar-black {
@@ -4177,23 +3855,19 @@ describe('matchUtilities()', () => {
         scrollbar-color: oklab(0% none none / .5);
       }
 
-      .scrollbar-current, .scrollbar-current\\/45 {
-        scrollbar-color: currentcolor;
+      .scrollbar-current {
+        scrollbar-color: currentColor;
       }
 
-      @supports (color: color-mix(in lab, red, red)) {
-        .scrollbar-current\\/45 {
-          scrollbar-color: color-mix(in oklab, currentcolor 45%, transparent);
-        }
-      }
-      "
+      .scrollbar-current\\/45 {
+        scrollbar-color: color-mix(in oklab, currentColor 45%, transparent);
+      }"
     `)
   })
 
   test('functional utilities with explicit modifiers', async () => {
-    expect(
-      await run(
-        ['scrollbar-[12px]', 'scrollbar-[12px]/foo', 'scrollbar-[12px]/bar'],
+    async function run(candidates: string[]) {
+      let compiled = await compile(
         css`
           @plugin "my-plugin";
 
@@ -4204,10 +3878,10 @@ describe('matchUtilities()', () => {
             --opacity-my-opacity: 0.5;
           }
         `,
+
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities(
@@ -4217,16 +3891,29 @@ describe('matchUtilities()', () => {
                       'scrollbar-width': value,
                     }),
                   },
-                  { type: ['any'], values: {}, modifiers: { foo: 'foo' } },
+                  {
+                    type: ['any'],
+                    values: {},
+                    modifiers: {
+                      foo: 'foo',
+                    },
+                  },
                 )
               },
             }
           },
         },
-      ),
+      )
+
+      return compiled.build(candidates)
+    }
+
+    expect(
+      optimizeCss(
+        await run(['scrollbar-[12px]', 'scrollbar-[12px]/foo', 'scrollbar-[12px]/bar']),
+      ).trim(),
     ).toMatchInlineSnapshot(`
-      "
-      .scrollbar-\\[12px\\] {
+      ".scrollbar-\\[12px\\] {
         --modifier: none;
         scrollbar-width: 12px;
       }
@@ -4234,43 +3921,50 @@ describe('matchUtilities()', () => {
       .scrollbar-\\[12px\\]\\/foo {
         --modifier: foo;
         scrollbar-width: 12px;
-      }
-      "
+      }"
     `)
   })
 
   test('functional utilities support `@apply`', async () => {
-    expect(
-      await run(
-        ['foo-bar', 'lg:foo-bar', 'foo-[12px]', 'lg:foo-[12px]'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
 
-          @theme reference {
-            --breakpoint-lg: 1024px;
+        @theme reference {
+          --breakpoint-lg: 1024px;
+        }
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ matchUtilities }: PluginAPI) => {
+              matchUtilities(
+                {
+                  foo: (value) => ({
+                    '--foo': value,
+                    [`@apply flex`]: {},
+                  }),
+                },
+                {
+                  values: {
+                    bar: 'bar',
+                  },
+                },
+              )
+            },
           }
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchUtilities }: PluginAPI) => {
-                matchUtilities(
-                  { foo: (value) => ({ '--foo': value, [`@apply flex`]: {} }) },
-                  { values: { bar: 'bar' } },
-                )
-              },
-            }
-          },
         },
-      ),
+      },
+    )
+
+    expect(
+      optimizeCss(compiled.build(['foo-bar', 'lg:foo-bar', 'foo-[12px]', 'lg:foo-[12px]'])).trim(),
     ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      "@layer utilities {
         .foo-\\[12px\\] {
           --foo: 12px;
           display: flex;
@@ -4281,7 +3975,7 @@ describe('matchUtilities()', () => {
           display: flex;
         }
 
-        @media (min-width: 1024px) {
+        @media (width >= 1024px) {
           .lg\\:foo-\\[12px\\] {
             --foo: 12px;
             display: flex;
@@ -4292,8 +3986,7 @@ describe('matchUtilities()', () => {
             display: flex;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -4312,9 +4005,8 @@ describe('matchUtilities()', () => {
         `,
 
         {
-          async loadModule(_id, base) {
+          async loadModule(id, base) {
             return {
-              path: '',
               base,
               module: ({ matchUtilities }: PluginAPI) => {
                 matchUtilities({
@@ -4328,103 +4020,119 @@ describe('matchUtilities()', () => {
           },
         },
       )
-    }).rejects.toThrow(/invalid utility name/)
+    }).rejects.toThrowError(/invalid utility name/)
   })
 
   test('replaces the class name with variants in nested selectors', async () => {
-    expect(
-      await run(
-        ['foo-red', 'md:foo-red', 'not-hover:md:foo-red'],
-        css`
-          @plugin "my-plugin";
-          @theme {
-            --breakpoint-md: 768px;
-          }
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchUtilities }: PluginAPI) => {
-                matchUtilities(
-                  { foo: (value) => ({ ':where(.foo > :first-child)': { color: value } }) },
-                  { values: { red: 'red' } },
-                )
-              },
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .foo-red :where(.foo-red > :first-child) {
-        color: red;
-      }
-
-      @media (min-width: 768px) {
-        .md\\:foo-red :where(.md\\:foo-red > :first-child), .not-hover\\:md\\:foo-red:not(:hover) :where(.not-hover\\:md\\:foo-red > :first-child) {
-          color: red;
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @theme {
+          --breakpoint-md: 768px;
         }
-      }
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(base) {
+          return {
+            base,
+            module: ({ matchUtilities }: PluginAPI) => {
+              matchUtilities(
+                {
+                  foo: (value) => ({
+                    ':where(.foo > :first-child)': {
+                      color: value,
+                    },
+                  }),
+                },
+                {
+                  values: {
+                    red: 'red',
+                  },
+                },
+              )
+            },
+          }
+        },
+      },
+    )
 
-      @media not all and (hover: hover) {
-        @media (min-width: 768px) {
-          .not-hover\\:md\\:foo-red :where(.not-hover\\:md\\:foo-red > :first-child) {
+    expect(compiled.build(['foo-red', 'md:foo-red', 'not-hover:md:foo-red']).trim())
+      .toMatchInlineSnapshot(`
+        ".foo-red {
+          :where(.foo-red > :first-child) {
             color: red;
           }
         }
-      }
-      "
-    `)
+        .md\\:foo-red {
+          @media (width >= 768px) {
+            :where(.md\\:foo-red > :first-child) {
+              color: red;
+            }
+          }
+        }
+        .not-hover\\:md\\:foo-red {
+          &:not(*:hover) {
+            @media (width >= 768px) {
+              :where(.not-hover\\:md\\:foo-red > :first-child) {
+                color: red;
+              }
+            }
+          }
+          @media not (hover: hover) {
+            @media (width >= 768px) {
+              :where(.not-hover\\:md\\:foo-red > :first-child) {
+                color: red;
+              }
+            }
+          }
+        }"
+      `)
   })
 })
 
 describe('addComponents()', () => {
   test('is an alias for addUtilities', async () => {
-    expect(
-      await run(
-        ['btn', 'btn-blue', 'btn-red'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ addComponents }: PluginAPI) => {
-                addComponents({
-                  '.btn': {
-                    padding: '.5rem 1rem',
-                    borderRadius: '.25rem',
-                    fontWeight: '600',
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ addComponents }: PluginAPI) => {
+              addComponents({
+                '.btn': {
+                  padding: '.5rem 1rem',
+                  borderRadius: '.25rem',
+                  fontWeight: '600',
+                },
+                '.btn-blue': {
+                  backgroundColor: '#3490dc',
+                  color: '#fff',
+                  '&:hover': {
+                    backgroundColor: '#2779bd',
                   },
-                  '.btn-blue': {
-                    backgroundColor: '#3490dc',
-                    color: '#fff',
-                    '&:hover': {
-                      backgroundColor: '#2779bd',
-                    },
+                },
+                '.btn-red': {
+                  backgroundColor: '#e3342f',
+                  color: '#fff',
+                  '&:hover': {
+                    backgroundColor: '#cc1f1a',
                   },
-                  '.btn-red': {
-                    backgroundColor: '#e3342f',
-                    color: '#fff',
-                    '&:hover': {
-                      backgroundColor: '#cc1f1a',
-                    },
-                  },
-                })
-              },
-            }
-          },
+                },
+              })
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .btn {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['btn', 'btn-blue', 'btn-red'])).trim())
+      .toMatchInlineSnapshot(`
+      ".btn {
         border-radius: .25rem;
         padding: .5rem 1rem;
         font-weight: 600;
@@ -4446,39 +4154,44 @@ describe('addComponents()', () => {
 
       .btn-red:hover {
         background-color: #cc1f1a;
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('matchComponents()', () => {
   test('is an alias for matchUtilities', async () => {
-    expect(
-      await run(
-        ['prose', 'sm:prose-sm', 'hover:prose-lg'],
-        css`
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          async loadModule(_id, base) {
-            return {
-              path: '',
-              base,
-              module: ({ matchComponents }: PluginAPI) => {
-                matchComponents(
-                  { prose: (value) => ({ '--container-size': value }) },
-                  { values: { DEFAULT: 'normal', sm: 'sm', lg: 'lg' } },
-                )
-              },
-            }
-          },
+    let compiled = await compile(
+      css`
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        async loadModule(id, base) {
+          return {
+            base,
+            module: ({ matchComponents }: PluginAPI) => {
+              matchComponents(
+                {
+                  prose: (value) => ({ '--container-size': value }),
+                },
+                {
+                  values: {
+                    DEFAULT: 'normal',
+                    sm: 'sm',
+                    lg: 'lg',
+                  },
+                },
+              )
+            },
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .prose {
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['prose', 'sm:prose-sm', 'hover:prose-lg'])).trim())
+      .toMatchInlineSnapshot(`
+      ".prose {
         --container-size: normal;
       }
 
@@ -4486,23 +4199,21 @@ describe('matchComponents()', () => {
         .hover\\:prose-lg:hover {
           --container-size: lg;
         }
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('prefix()', () => {
   test('is an identity function', async () => {
-    using fn = vi.fn()
+    let fn = vi.fn()
     await compile(
       css`
         @plugin "my-plugin";
       `,
       {
-        async loadModule(_id, base) {
+        async loadModule(id, base) {
           return {
-            path: '',
             base,
             module: ({ prefix }: PluginAPI) => {
               fn(prefix('btn'))
@@ -4518,15 +4229,14 @@ describe('prefix()', () => {
 
 describe('config()', () => {
   test('can return the resolved config when passed no arguments', async () => {
-    using fn = vi.fn()
+    let fn = vi.fn()
     await compile(
       css`
         @plugin "my-plugin";
       `,
       {
-        async loadModule(_id, base) {
+        async loadModule(id, base) {
           return {
-            path: '',
             base,
             module: ({ config }: PluginAPI) => {
               fn(config())
@@ -4546,15 +4256,14 @@ describe('config()', () => {
   })
 
   test('can return part of the config', async () => {
-    using fn = vi.fn()
+    let fn = vi.fn()
     await compile(
       css`
         @plugin "my-plugin";
       `,
       {
-        async loadModule(_id, base) {
+        async loadModule(id, base) {
           return {
-            path: '',
             base,
             module: ({ config }: PluginAPI) => {
               fn(config('theme'))
@@ -4572,15 +4281,14 @@ describe('config()', () => {
   })
 
   test('falls back to default value if requested path does not exist', async () => {
-    using fn = vi.fn()
+    let fn = vi.fn()
     await compile(
       css`
         @plugin "my-plugin";
       `,
       {
-        async loadModule(_id, base) {
+        async loadModule(id, base) {
           return {
-            path: '',
             base,
             module: ({ config }: PluginAPI) => {
               fn(config('somekey', 'defaultvalue'))
@@ -4592,40 +4300,4 @@ describe('config()', () => {
 
     expect(fn).toHaveBeenCalledWith('defaultvalue')
   })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/19721
-  test('matchUtilities does not match Object.prototype properties as values', async ({
-    expect,
-  }) => {
-    // These should not crash or produce output
-    expect(
-      await run(
-        [
-          'test-constructor',
-          'test-hasOwnProperty',
-          'test-toString',
-          'test-valueOf',
-          'test-__proto__',
-        ],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin";
-        `,
-        {
-          loadModule: async (_id, base) => {
-            return {
-              path: '',
-              base,
-              module: plugin(function ({ matchUtilities }) {
-                matchUtilities(
-                  { test: (value) => ({ '--test': value }) },
-                  { values: { foo: 'bar' } },
-                )
-              }),
-            }
-          },
-        },
-      ),
-    ).toEqual('')
-  })
 })
diff --git a/packages/tailwindcss/src/compat/plugin-api.ts b/packages/tailwindcss/src/compat/plugin-api.ts
index 11878fb30..9a2f5d117 100644
--- a/packages/tailwindcss/src/compat/plugin-api.ts
+++ b/packages/tailwindcss/src/compat/plugin-api.ts
@@ -1,12 +1,10 @@
 import type { Features } from '..'
 import { substituteAtApply } from '../apply'
-import { atRule, cloneAstNode, context, decl, rule, type AstNode } from '../ast'
+import { atRule, decl, rule, walk, type AstNode } from '../ast'
 import type { Candidate, CandidateModifier, NamedUtilityValue } from '../candidate'
 import { substituteFunctions } from '../css-functions'
 import * as CSS from '../css-parser'
 import type { DesignSystem } from '../design-system'
-import * as SelectorParser from '../selector-parser'
-import type { SourceLocation } from '../source-maps/source'
 import { withAlpha } from '../utilities'
 import { DefaultMap } from '../utils/default-map'
 import { escape } from '../utils/escape'
@@ -14,9 +12,9 @@ import { inferDataType } from '../utils/infer-data-type'
 import { segment } from '../utils/segment'
 import { toKeyPath } from '../utils/to-key-path'
 import { compoundsForSelectors, IS_VALID_VARIANT_NAME, substituteAtSlot } from '../variants'
-import { walk, WalkAction } from '../walk'
 import type { ResolvedConfig, UserConfig } from './config/types'
 import { createThemeFn } from './plugin-functions'
+import * as SelectorParser from './selector-parser'
 
 export type Config = UserConfig
 export type PluginFn = (api: PluginAPI) => void
@@ -26,7 +24,6 @@ export type PluginWithConfig = {
 
   /** @internal */
   reference?: boolean
-  src?: SourceLocation | undefined
 }
 export type PluginWithOptions<T> = {
   (options?: T): PluginWithConfig
@@ -96,50 +93,28 @@ export function buildPluginApi({
   resolvedConfig,
   featuresRef,
   referenceMode,
-  src,
 }: {
   designSystem: DesignSystem
   ast: AstNode[]
   resolvedConfig: ResolvedConfig
   featuresRef: { current: Features }
   referenceMode: boolean
-  src: SourceLocation | undefined
 }): PluginAPI {
   let api: PluginAPI = {
     addBase(css) {
       if (referenceMode) return
       let baseNodes = objectToAst(css)
       featuresRef.current |= substituteFunctions(baseNodes, designSystem)
-      let rule = atRule('@layer', 'base', baseNodes)
-      walk([rule], (node) => {
-        node.src = src
-      })
-      ast.push(rule)
+      ast.push(atRule('@layer', 'base', baseNodes))
     },
 
     addVariant(name, variant) {
       if (!IS_VALID_VARIANT_NAME.test(name)) {
         throw new Error(
-          `\`addVariant('${name}')\` defines an invalid variant name. Variants should only contain alphanumeric, dashes, or underscore characters and start with a lowercase letter or number.`,
+          `\`addVariant('${name}')\` defines an invalid variant name. Variants should only contain alphanumeric, dashes or underscore characters.`,
         )
       }
 
-      // Ignore variants emitting v3 `:merge(…)` rules. In v4, the `group-*` and `peer-*` variants
-      // compound automatically.
-      if (typeof variant === 'string') {
-        if (variant.includes(':merge(')) return
-      } else if (Array.isArray(variant)) {
-        if (variant.some((v) => v.includes(':merge('))) return
-      } else if (typeof variant === 'object') {
-        function keyIncludes(object: Record<string, any>, search: string): boolean {
-          return Object.entries(object).some(
-            ([key, value]) =>
-              key.includes(search) || (typeof value === 'object' && keyIncludes(value, search)),
-          )
-        }
-        if (keyIncludes(variant, ':merge(')) return
-      }
-
       // Single selector or multiple parallel selectors
       if (typeof variant === 'string' || Array.isArray(variant)) {
         designSystem.variants.static(
@@ -155,7 +130,7 @@ export function buildPluginApi({
 
       // CSS-in-JS object
       else if (typeof variant === 'object') {
-        designSystem.variants.fromAst(name, objectToAst(variant), designSystem)
+        designSystem.variants.fromAst(name, objectToAst(variant))
       }
     },
     matchVariant(name, fn, options) {
@@ -168,17 +143,6 @@ export function buildPluginApi({
         return parseVariantValue(resolved, nodes)
       }
 
-      try {
-        // Sample variant value and ignore variants emitting v3 `:merge` rules. In
-        // v4, the `group-*` and `peer-*` variants compound automatically.
-        let sample = fn('a', { modifier: null })
-        if (typeof sample === 'string' && sample.includes(':merge(')) {
-          return
-        } else if (Array.isArray(sample) && sample.some((r) => r.includes(':merge('))) {
-          return
-        }
-      } catch {}
-
       let defaultOptionKeys = Object.keys(options?.values ?? {})
       designSystem.variants.group(
         () => {
@@ -202,17 +166,12 @@ export function buildPluginApi({
                 ruleNodes.nodes,
               )
             } else if (variant.value.kind === 'named' && options?.values) {
-              if (!Object.hasOwn(options.values, variant.value.value)) {
-                return null
-              }
               let defaultValue = options.values[variant.value.value]
               if (typeof defaultValue !== 'string') {
-                return null
+                return
               }
 
               ruleNodes.nodes = resolveVariantValue(defaultValue, variant.modifier, ruleNodes.nodes)
-            } else {
-              return null
             }
           })
         },
@@ -226,14 +185,8 @@ export function buildPluginApi({
           let aValueKey = a.value ? a.value.value : 'DEFAULT'
           let zValueKey = z.value ? z.value.value : 'DEFAULT'
 
-          let aValue =
-            (options?.values && Object.hasOwn(options.values, aValueKey)
-              ? options.values[aValueKey]
-              : undefined) ?? aValueKey
-          let zValue =
-            (options?.values && Object.hasOwn(options.values, zValueKey)
-              ? options.values[zValueKey]
-              : undefined) ?? zValueKey
+          let aValue = options?.values?.[aValueKey] ?? aValueKey
+          let zValue = options?.values?.[zValueKey] ?? zValueKey
 
           if (options && typeof options.sort === 'function') {
             return options.sort(
@@ -257,10 +210,6 @@ export function buildPluginApi({
           return aValue < zValue ? -1 : 1
         },
       )
-
-      designSystem.variants.suggest(name, () =>
-        Object.keys(options?.values ?? {}).filter((v) => v !== 'DEFAULT'),
-      )
     },
 
     addUtilities(utilities) {
@@ -279,11 +228,7 @@ export function buildPluginApi({
       for (let [name, css] of entries) {
         if (name.startsWith('@keyframes ')) {
           if (!referenceMode) {
-            let keyframes = rule(name, objectToAst(css))
-            walk([keyframes], (node) => {
-              node.src = src
-            })
-            ast.push(keyframes)
+            ast.push(rule(name, objectToAst(css)))
           }
           continue
         }
@@ -291,7 +236,7 @@ export function buildPluginApi({
         let selectorAst = SelectorParser.parse(name)
         let foundValidUtility = false
 
-        walk(selectorAst, (node) => {
+        SelectorParser.walk(selectorAst, (node) => {
           if (
             node.kind === 'selector' &&
             node.value[0] === '.' &&
@@ -310,15 +255,8 @@ export function buildPluginApi({
             return
           }
 
-          if (
-            node.kind === 'function' &&
-            (node.value === ':not' ||
-              // A class inside `:nth-child(… of <selector>)` is part of the
-              // condition, not a utility being defined.
-              node.value === ':nth-child' ||
-              node.value === ':nth-last-child')
-          ) {
-            return WalkAction.Skip
+          if (node.kind === 'function' && node.value === ':not') {
+            return SelectorParser.SelectorWalkAction.Skip
           }
         })
 
@@ -335,7 +273,7 @@ export function buildPluginApi({
           walk(ast, (node) => {
             if (node.kind === 'rule') {
               let selectorAst = SelectorParser.parse(node.selector)
-              walk(selectorAst, (node) => {
+              SelectorParser.walk(selectorAst, (node) => {
                 if (node.kind === 'selector' && node.value[0] === '.') {
                   node.value = `.${designSystem.theme.prefix}\\:${node.value.slice(1)}`
                 }
@@ -346,7 +284,7 @@ export function buildPluginApi({
         }
 
         designSystem.utilities.static(className, (candidate) => {
-          let clonedAst = ast.map(cloneAstNode)
+          let clonedAst = structuredClone(ast)
           replaceNestedClassNameReferences(clonedAst, className, candidate.raw)
           featuresRef.current |= substituteAtApply(clonedAst, designSystem)
           return clonedAst
@@ -406,13 +344,13 @@ export function buildPluginApi({
               let values = options?.values ?? {}
 
               if (isColor) {
-                // Color utilities implicitly support `inherit`, `transparent`, and `currentcolor`
+                // Color utilities implicitly support `inherit`, `transparent`, and `currentColor`
                 // for backwards compatibility but still allow them to be overridden
                 values = Object.assign(
                   {
                     inherit: 'inherit',
                     transparent: 'transparent',
-                    current: 'currentcolor',
+                    current: 'currentColor',
                   },
                   values,
                 )
@@ -422,13 +360,10 @@ export function buildPluginApi({
                 value = values.DEFAULT ?? null
               } else if (candidate.value.kind === 'arbitrary') {
                 value = candidate.value.value
-              } else if (
-                candidate.value.fraction &&
-                Object.hasOwn(values, candidate.value.fraction)
-              ) {
+              } else if (candidate.value.fraction && values[candidate.value.fraction]) {
                 value = values[candidate.value.fraction]
                 ignoreModifier = true
-              } else if (Object.hasOwn(values, candidate.value.value)) {
+              } else if (values[candidate.value.value]) {
                 value = values[candidate.value.value]
               } else if (values.__BARE_VALUE__) {
                 value = values.__BARE_VALUE__(candidate.value) ?? null
@@ -449,7 +384,7 @@ export function buildPluginApi({
                 modifier = null
               } else if (modifiers === 'any' || candidate.modifier.kind === 'arbitrary') {
                 modifier = candidate.modifier.value
-              } else if (modifiers && Object.hasOwn(modifiers, candidate.modifier.value)) {
+              } else if (modifiers?.[candidate.modifier.value]) {
                 modifier = modifiers[candidate.modifier.value]
               } else if (isColor && !Number.isNaN(Number(candidate.modifier.value))) {
                 modifier = `${candidate.modifier.value}%`
@@ -492,10 +427,6 @@ export function buildPluginApi({
           // work even with legacy configs and plugins
           valueKeys.delete('__BARE_VALUE__')
 
-          // The `__CSS_VALUES__` key is a special key used by the theme function
-          // to transport `@theme` metadata about values from CSS
-          valueKeys.delete('__CSS_VALUES__')
-
           // The `DEFAULT` key is represented as `null` in the utility API
           if (valueKeys.has('DEFAULT')) {
             valueKeys.delete('DEFAULT')
@@ -570,13 +501,6 @@ export function objectToAst(rules: CssInJs | CssInJs[]): AstNode[] {
   let entries = rules.flatMap((rule) => Object.entries(rule))
 
   for (let [name, value] of entries) {
-    if (value === null || value === undefined) continue
-
-    // @ts-expect-error
-    // We do not want `false` present in the types but still need to discard these nodes for
-    // compatibility purposes
-    if (value === false) continue
-
     if (typeof value !== 'object') {
       if (!name.startsWith('--')) {
         if (value === '@slot') {
@@ -598,7 +522,7 @@ export function objectToAst(rules: CssInJs | CssInJs[]): AstNode[] {
           ast.push(rule(name, objectToAst(item)))
         }
       }
-    } else {
+    } else if (value !== null) {
       ast.push(rule(name, objectToAst(value)))
     }
   }
@@ -608,28 +532,14 @@ export function objectToAst(rules: CssInJs | CssInJs[]): AstNode[] {
 
 function parseVariantValue(resolved: string | string[], nodes: AstNode[]): AstNode[] {
   let resolvedArray = typeof resolved === 'string' ? [resolved] : resolved
-  return resolvedArray.flatMap((r): AstNode | AstNode[] => {
+  return resolvedArray.flatMap((r) => {
     if (r.trim().endsWith('}')) {
-      let usesAtScope = r.includes('@scope')
       let updatedCSS = r.replace('}', '{@slot}}')
       let ast = CSS.parse(updatedCSS)
-
-      if (usesAtScope) {
-        substituteAtSlot(ast, [context({ source: 'user' }, nodes)])
-        return context({ source: 'variant' }, ast)
-      }
-
       substituteAtSlot(ast, nodes)
       return ast
     } else {
-      let node = rule(r, nodes)
-
-      if (node.kind === 'at-rule' && node.name === '@scope') {
-        node.nodes = [context({ source: 'user' }, nodes)]
-        return context({ source: 'variant' }, [node])
-      }
-
-      return node
+      return rule(r, nodes)
     }
   })
 }
@@ -646,7 +556,7 @@ function replaceNestedClassNameReferences(
   walk(ast, (node) => {
     if (node.kind === 'rule') {
       let selectorAst = SelectorParser.parse(node.selector)
-      walk(selectorAst, (node) => {
+      SelectorParser.walk(selectorAst, (node) => {
         if (node.kind === 'selector' && node.value === `.${utilityName}`) {
           node.value = `.${escape(rawCandidate)}`
         }
diff --git a/packages/tailwindcss/src/compat/plugin-functions.ts b/packages/tailwindcss/src/compat/plugin-functions.ts
index bbd5fac46..339bd11c6 100644
--- a/packages/tailwindcss/src/compat/plugin-functions.ts
+++ b/packages/tailwindcss/src/compat/plugin-functions.ts
@@ -100,28 +100,6 @@ export function createThemeFn(
         return [base, extra]
       }
 
-      // If `--color-foo` and `--color-foo-bar` are both defined, `colors.foo`
-      // produces a synthetic object:
-      //
-      // ```ts
-      // { DEFAULT: 'red', bar: 'blue', __CSS_VALUES__: { DEFAULT: 0, bar: 0 } }
-      // ```
-      //
-      // Prefer `DEFAULT` instead of exposing the object to plugin code.
-      //
-      // This only applies to lookups of a specific key (e.g. `colors.foo`). A
-      // namespace root lookup (e.g. `theme('shadow')`) resolves to the whole
-      // namespace as an object, like in v3.
-      if (
-        keypath.length > 1 &&
-        cssValue !== null &&
-        typeof cssValue === 'object' &&
-        !Array.isArray(cssValue) &&
-        'DEFAULT' in cssValue
-      ) {
-        return cssValue.DEFAULT
-      }
-
       // Values from CSS take precedence over values from the config
       return cssValue ?? configValue
     })()
@@ -230,12 +208,7 @@ function readFromCss(
   // The request looked like `theme('animation.spin')` and was turned into a
   // lookup for `--animation-spin-*` which had only one entry which means it
   // should be returned directly.
-  //
-  // This only applies to lookups of a specific key (`path.length > 1`). A
-  // namespace root lookup like `theme('shadow')` resolves to the whole
-  // namespace as an object, like in v3, so it must keep the object shape (`{
-  // DEFAULT: … }`).
-  if (path.length > 1 && 'DEFAULT' in obj && Object.keys(obj).length === 1) {
+  if ('DEFAULT' in obj && Object.keys(obj).length === 1) {
     return [obj.DEFAULT as any, optionsObj.DEFAULT ?? ThemeOptions.NONE] as const
   }
 
@@ -250,10 +223,8 @@ function get(obj: any, path: string[]) {
   for (let i = 0; i < path.length; ++i) {
     let key = path[i]
 
-    // The key does not exist so concatenate it with the next key.
-    // We use Object.hasOwn to avoid matching inherited prototype properties
-    // (e.g. "constructor", "toString") when traversing config objects.
-    if (obj === null || obj === undefined || typeof obj !== 'object' || !Object.hasOwn(obj, key)) {
+    // The key does not exist so concatenate it with the next key
+    if (obj?.[key] === undefined) {
       if (path[i + 1] === undefined) {
         return undefined
       }
diff --git a/packages/tailwindcss/src/compat/screens-config.test.ts b/packages/tailwindcss/src/compat/screens-config.test.ts
index d81cd8de6..ac73d8216 100644
--- a/packages/tailwindcss/src/compat/screens-config.test.ts
+++ b/packages/tailwindcss/src/compat/screens-config.test.ts
@@ -1,89 +1,85 @@
 import { describe, expect, test } from 'vitest'
-import { run } from '../test-utils/run'
+import { compile } from '..'
 
 const css = String.raw
 
 test('CSS `--breakpoint-*` merge with JS config `screens`', async () => {
-  expect(
-    await run(
-      [
-        'sm:flex',
-        'md:flex',
-        'lg:flex',
-        'min-sm:max-md:underline',
-        'min-md:max-lg:underline',
-        'max-w-screen-sm',
-        // Ensure other core variants appear at the end
-        'print:items-end',
-      ],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @theme {
-          --breakpoint-md: 50rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                screens: {
-                  sm: '44rem',
-                },
-              },
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @theme {
+      --breakpoint-md: 50rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            screens: {
+              sm: '44rem',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
+      base: '/root',
+    }),
+  })
+
+  expect(
+    compiler.build([
+      'sm:flex',
+      'md:flex',
+      'lg:flex',
+      'min-sm:max-md:underline',
+      'min-md:max-lg:underline',
+      'max-w-screen-sm',
+      // Ensure other core variants appear at the end
+      'print:items-end',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    .max-w-screen-sm {
+    ".max-w-screen-sm {
       max-width: 44rem;
     }
-
-    @media (min-width: 44rem) {
-      .sm\\:flex {
+    .sm\\:flex {
+      @media (width >= 44rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 50rem) {
-        .min-sm\\:max-md\\:underline {
+    }
+    .min-sm\\:max-md\\:underline {
+      @media (width >= 44rem) {
+        @media (width < 50rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 50rem) {
-      .md\\:flex {
+    .md\\:flex {
+      @media (width >= 50rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 64rem) {
-        .min-md\\:max-lg\\:underline {
+    }
+    .min-md\\:max-lg\\:underline {
+      @media (width >= 50rem) {
+        @media (width < 64rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 64rem) {
-      .lg\\:flex {
+    .lg\\:flex {
+      @media (width >= 64rem) {
         display: flex;
       }
     }
-
-    @media print {
-      .print\\:items-end {
+    .print\\:items-end {
+      @media print {
         align-items: flex-end;
       }
     }
@@ -92,98 +88,100 @@ test('CSS `--breakpoint-*` merge with JS config `screens`', async () => {
 })
 
 test('JS config `screens` extend CSS `--breakpoint-*`', async () => {
-  expect(
-    await run(
-      [
-        // Order is messed up on purpose
-        'md:flex',
-        'sm:flex',
-        'lg:flex',
-        'xs:flex',
-        'min-md:max-lg:underline',
-        'min-sm:max-md:underline',
-        'min-xs:flex',
-        'min-xs:max-md:underline',
+  let input = css`
+    @theme default {
+      --breakpoint-xs: 39rem;
+      --breakpoint-md: 49rem;
+    }
+    @theme {
+      --breakpoint-md: 50rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
 
-        // Ensure other core variants appear at the end
-        'print:items-end',
-      ],
-      css`
-        @theme default {
-          --breakpoint-xs: 39rem;
-          --breakpoint-md: 49rem;
-        }
-        @theme {
-          --breakpoint-md: 50rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                screens: {
-                  xs: '30rem',
-                  sm: '40rem',
-                  md: '48rem',
-                  lg: '60rem',
-                },
-              },
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            screens: {
+              xs: '30rem',
+              sm: '40rem',
+              md: '48rem',
+              lg: '60rem',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
+      base: '/root',
+    }),
+  })
+
+  expect(
+    compiler.build([
+      // Order is messed up on purpose
+      'md:flex',
+      'sm:flex',
+      'lg:flex',
+      'xs:flex',
+      'min-md:max-lg:underline',
+      'min-sm:max-md:underline',
+      'min-xs:flex',
+      'min-xs:max-md:underline',
+
+      // Ensure other core variants appear at the end
+      'print:items-end',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 30rem) {
-      .min-xs\\:flex, .xs\\:flex {
+    ".min-xs\\:flex {
+      @media (width >= 30rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 50rem) {
-        .min-xs\\:max-md\\:underline {
+    }
+    .xs\\:flex {
+      @media (width >= 30rem) {
+        display: flex;
+      }
+    }
+    .min-xs\\:max-md\\:underline {
+      @media (width >= 30rem) {
+        @media (width < 50rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 40rem) {
-      .sm\\:flex {
+    .sm\\:flex {
+      @media (width >= 40rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 50rem) {
-        .min-sm\\:max-md\\:underline {
+    }
+    .min-sm\\:max-md\\:underline {
+      @media (width >= 40rem) {
+        @media (width < 50rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 50rem) {
-      .md\\:flex {
+    .md\\:flex {
+      @media (width >= 50rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 60rem) {
-        .min-md\\:max-lg\\:underline {
+    }
+    .min-md\\:max-lg\\:underline {
+      @media (width >= 50rem) {
+        @media (width < 60rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 60rem) {
-      .lg\\:flex {
+    .lg\\:flex {
+      @media (width >= 60rem) {
         display: flex;
       }
     }
-
-    @media print {
-      .print\\:items-end {
+    .print\\:items-end {
+      @media print {
         align-items: flex-end;
       }
     }
@@ -192,73 +190,70 @@ test('JS config `screens` extend CSS `--breakpoint-*`', async () => {
 })
 
 test('JS config `screens` only setup, even if those match the default-theme export', async () => {
-  expect(
-    await run(
-      [
-        // Order is messed up on purpose
-        'md:flex',
-        'sm:flex',
-        'lg:flex',
-        'min-md:max-lg:underline',
-        'min-sm:max-md:underline',
+  let input = css`
+    @config "./config.js";
+    @tailwind utilities;
+  `
 
-        // Ensure other core variants appear at the end
-        'print:items-end',
-      ],
-      css`
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              screens: {
-                sm: '40rem',
-                md: '48rem',
-                lg: '64rem',
-              },
-            },
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          screens: {
+            sm: '40rem',
+            md: '48rem',
+            lg: '64rem',
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
+      base: '/root',
+    }),
+  })
+
+  expect(
+    compiler.build([
+      // Order is messed up on purpose
+      'md:flex',
+      'sm:flex',
+      'lg:flex',
+      'min-md:max-lg:underline',
+      'min-sm:max-md:underline',
+
+      // Ensure other core variants appear at the end
+      'print:items-end',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 40rem) {
-      .sm\\:flex {
+    ".sm\\:flex {
+      @media (width >= 40rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 48rem) {
-        .min-sm\\:max-md\\:underline {
+    }
+    .min-sm\\:max-md\\:underline {
+      @media (width >= 40rem) {
+        @media (width < 48rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 48rem) {
-      .md\\:flex {
+    .md\\:flex {
+      @media (width >= 48rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 64rem) {
-        .min-md\\:max-lg\\:underline {
+    }
+    .min-md\\:max-lg\\:underline {
+      @media (width >= 48rem) {
+        @media (width < 64rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 64rem) {
-      .lg\\:flex {
+    .lg\\:flex {
+      @media (width >= 64rem) {
         display: flex;
       }
     }
-
-    @media print {
-      .print\\:items-end {
+    .print\\:items-end {
+      @media print {
         align-items: flex-end;
       }
     }
@@ -267,85 +262,106 @@ test('JS config `screens` only setup, even if those match the default-theme expo
 })
 
 test('JS config `screens` overwrite CSS `--breakpoint-*`', async () => {
-  expect(
-    await run(
-      [
-        'sm:flex',
-        'md:flex',
-        'mini:flex',
-        'midi:flex',
-        'maxi:flex',
-        'min-md:max-lg:underline',
-        'min-sm:max-md:underline',
-        'min-midi:max-maxi:underline',
-        'min-mini:max-midi:underline',
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
 
-        // Ensure other core variants appear at the end
-        'print:items-end',
-      ],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                screens: {
-                  mini: '40rem',
-                  midi: '48rem',
-                  maxi: '64rem',
-                },
-              },
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            screens: {
+              mini: '40rem',
+              midi: '48rem',
+              maxi: '64rem',
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
       },
-    ),
+      base: '/root',
+    }),
+  })
+
+  expect(
+    compiler.build([
+      'sm:flex',
+      'md:flex',
+      'mini:flex',
+      'midi:flex',
+      'maxi:flex',
+      'min-md:max-lg:underline',
+      'min-sm:max-md:underline',
+      'min-midi:max-maxi:underline',
+      'min-mini:max-midi:underline',
+
+      // Ensure other core variants appear at the end
+      'print:items-end',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 40rem) {
-      .mini\\:flex, .sm\\:flex {
+    ".mini\\:flex {
+      @media (width >= 40rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 48rem) {
-        .min-mini\\:max-midi\\:underline, .min-sm\\:max-md\\:underline {
+    }
+    .sm\\:flex {
+      @media (width >= 40rem) {
+        display: flex;
+      }
+    }
+    .min-mini\\:max-midi\\:underline {
+      @media (width >= 40rem) {
+        @media (width < 48rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 48rem) {
-      .md\\:flex, .midi\\:flex {
-        display: flex;
-      }
-
-      @media not all and (min-width: 64rem) {
-        .min-md\\:max-lg\\:underline, .min-midi\\:max-maxi\\:underline {
+    .min-sm\\:max-md\\:underline {
+      @media (width >= 40rem) {
+        @media (width < 48rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 64rem) {
-      .maxi\\:flex {
+    .md\\:flex {
+      @media (width >= 48rem) {
         display: flex;
       }
     }
-
-    @media print {
-      .print\\:items-end {
+    .midi\\:flex {
+      @media (width >= 48rem) {
+        display: flex;
+      }
+    }
+    .min-md\\:max-lg\\:underline {
+      @media (width >= 48rem) {
+        @media (width < 64rem) {
+          text-decoration-line: underline;
+        }
+      }
+    }
+    .min-midi\\:max-maxi\\:underline {
+      @media (width >= 48rem) {
+        @media (width < 64rem) {
+          text-decoration-line: underline;
+        }
+      }
+    }
+    .maxi\\:flex {
+      @media (width >= 64rem) {
+        display: flex;
+      }
+    }
+    .print\\:items-end {
+      @media print {
         align-items: flex-end;
       }
     }
@@ -359,91 +375,70 @@ test('JS config with `theme: { extends }` should not include the `default-config
     @tailwind utilities;
   `
 
-  expect(
-    await run(['sm:flex', 'md:flex', 'min-md:max-lg:underline', 'min-sm:max-md:underline'], input, {
-      loadModule: async () => ({
-        module: {
-          theme: {
-            extend: {
-              screens: {
-                mini: '40rem',
-                midi: '48rem',
-                maxi: '64rem',
-              },
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          extend: {
+            screens: {
+              mini: '40rem',
+              midi: '48rem',
+              maxi: '64rem',
             },
           },
         },
-        base: '/root',
-        path: '',
-      }),
+      },
+      base: '/root',
     }),
+  })
+
+  expect(
+    compiler.build(['sm:flex', 'md:flex', 'min-md:max-lg:underline', 'min-sm:max-md:underline']),
   ).toBe('')
 
   expect(
-    await run(
-      [
-        'mini:flex',
-        'midi:flex',
-        'maxi:flex',
-        'min-midi:max-maxi:underline',
-        'min-mini:max-midi:underline',
+    compiler.build([
+      'mini:flex',
+      'midi:flex',
+      'maxi:flex',
+      'min-midi:max-maxi:underline',
+      'min-mini:max-midi:underline',
 
-        // Ensure other core variants appear at the end
-        'print:items-end',
-      ],
-      input,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                screens: {
-                  mini: '40rem',
-                  midi: '48rem',
-                  maxi: '64rem',
-                },
-              },
-            },
-          },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
+      // Ensure other core variants appear at the end
+      'print:items-end',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 40rem) {
-      .mini\\:flex {
+    ".mini\\:flex {
+      @media (width >= 40rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 48rem) {
-        .min-mini\\:max-midi\\:underline {
+    }
+    .min-mini\\:max-midi\\:underline {
+      @media (width >= 40rem) {
+        @media (width < 48rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 48rem) {
-      .midi\\:flex {
+    .midi\\:flex {
+      @media (width >= 48rem) {
         display: flex;
       }
-
-      @media not all and (min-width: 64rem) {
-        .min-midi\\:max-maxi\\:underline {
+    }
+    .min-midi\\:max-maxi\\:underline {
+      @media (width >= 48rem) {
+        @media (width < 64rem) {
           text-decoration-line: underline;
         }
       }
     }
-
-    @media (min-width: 64rem) {
-      .maxi\\:flex {
+    .maxi\\:flex {
+      @media (width >= 64rem) {
         display: flex;
       }
     }
-
-    @media print {
-      .print\\:items-end {
+    .print\\:items-end {
+      @media print {
         align-items: flex-end;
       }
     }
@@ -458,104 +453,76 @@ describe('complex screen configs', () => {
       @tailwind utilities;
     `
 
-    expect(
-      await run(['min-sm:flex', 'min-md:flex', 'min-xl:flex', 'min-tall:flex'], input, {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              extend: {
-                screens: {
-                  sm: { max: '639px' },
-                  md: [
-                    //
-                    { min: '668px', max: '767px' },
-                    '868px',
-                  ],
-                  lg: { min: '868px' },
-                  xl: { min: '1024px', max: '1279px' },
-                  tall: { raw: '(min-height: 800px)' },
-                },
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            extend: {
+              screens: {
+                sm: { max: '639px' },
+                md: [
+                  //
+                  { min: '668px', max: '767px' },
+                  '868px',
+                ],
+                lg: { min: '868px' },
+                xl: { min: '1024px', max: '1279px' },
+                tall: { raw: '(min-height: 800px)' },
               },
             },
           },
-          base: '/root',
-          path: '',
-        }),
+        },
+        base: '/root',
       }),
-    ).toBe('')
+    })
+
+    expect(compiler.build(['min-sm:flex', 'min-md:flex', 'min-xl:flex', 'min-tall:flex'])).toBe('')
 
     expect(
-      await run(
-        [
-          'sm:flex',
-          'md:flex',
-          'lg:flex',
-          'min-lg:flex',
-          'xl:flex',
-          'tall:flex',
+      compiler.build([
+        'sm:flex',
+        'md:flex',
+        'lg:flex',
+        'min-lg:flex',
+        'xl:flex',
+        'tall:flex',
 
-          // Ensure other core variants appear at the end
-          'print:items-end',
-        ],
-        input,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                extend: {
-                  screens: {
-                    sm: { max: '639px' },
-                    md: [
-                      //
-                      { min: '668px', max: '767px' },
-                      '868px',
-                    ],
-                    lg: { min: '868px' },
-                    xl: { min: '1024px', max: '1279px' },
-                    tall: { raw: '(min-height: 800px)' },
-                  },
-                },
-              },
-            },
-            base: '/root',
-            path: '',
-          }),
-        },
-      ),
+        // Ensure other core variants appear at the end
+        'print:items-end',
+      ]),
     ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 868px) {
-        .lg\\:flex, .min-lg\\:flex {
+      ".lg\\:flex {
+        @media (width >= 868px) {
           display: flex;
         }
       }
-
-      @media (max-width: 639px) {
-        .sm\\:flex {
+      .min-lg\\:flex {
+        @media (width >= 868px) {
           display: flex;
         }
       }
-
-      @media (max-width: 767px) and (min-width: 668px), (min-width: 868px) {
-        .md\\:flex {
+      .sm\\:flex {
+        @media (639px >= width) {
           display: flex;
         }
       }
-
-      @media (max-width: 1279px) and (min-width: 1024px) {
-        .xl\\:flex {
+      .md\\:flex {
+        @media (767px >= width >= 668px), (width >= 868px) {
           display: flex;
         }
       }
-
-      @media (min-height: 800px) {
-        .tall\\:flex {
+      .xl\\:flex {
+        @media (1279px >= width >= 1024px) {
           display: flex;
         }
       }
-
-      @media print {
-        .print\\:items-end {
+      .tall\\:flex {
+        @media (min-height: 800px) {
+          display: flex;
+        }
+      }
+      .print\\:items-end {
+        @media print {
           align-items: flex-end;
         }
       }
@@ -564,65 +531,70 @@ describe('complex screen configs', () => {
   })
 
   test("don't interfere with `min-*` and `max-*` variants of non-complex screen configs", async () => {
-    expect(
-      await run(
-        [
-          'sm:flex',
-          'md:flex',
-          'portrait:flex',
-          'min-sm:flex',
-          'min-md:flex',
-          'min-portrait:flex',
-          // Ensure other core variants appear at the end
-          'print:items-end',
-        ],
-        css`
-          @theme default {
-            --breakpoint-sm: 39rem;
-            --breakpoint-md: 48rem;
-          }
-          @config "./config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => ({
-            module: {
-              theme: {
-                extend: {
-                  screens: {
-                    sm: '40rem',
-                    portrait: { raw: 'screen and (orientation: portrait)' },
-                  },
-                },
+    let input = css`
+      @theme default {
+        --breakpoint-sm: 39rem;
+        --breakpoint-md: 48rem;
+      }
+      @config "./config.js";
+      @tailwind utilities;
+    `
+
+    let compiler = await compile(input, {
+      loadModule: async () => ({
+        module: {
+          theme: {
+            extend: {
+              screens: {
+                sm: '40rem',
+                portrait: { raw: 'screen and (orientation: portrait)' },
               },
             },
-            base: '/root',
-            path: '',
-          }),
+          },
         },
-      ),
+        base: '/root',
+      }),
+    })
+
+    expect(
+      compiler.build([
+        'sm:flex',
+        'md:flex',
+        'portrait:flex',
+        'min-sm:flex',
+        'min-md:flex',
+        'min-portrait:flex',
+        // Ensure other core variants appear at the end
+        'print:items-end',
+      ]),
     ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 40rem) {
-        .min-sm\\:flex, .sm\\:flex {
+      ".min-sm\\:flex {
+        @media (width >= 40rem) {
           display: flex;
         }
       }
-
-      @media (min-width: 48rem) {
-        .md\\:flex, .min-md\\:flex {
+      .sm\\:flex {
+        @media (width >= 40rem) {
           display: flex;
         }
       }
-
-      @media screen and (orientation: portrait) {
-        .portrait\\:flex {
+      .md\\:flex {
+        @media (width >= 48rem) {
           display: flex;
         }
       }
-
-      @media print {
-        .print\\:items-end {
+      .min-md\\:flex {
+        @media (width >= 48rem) {
+          display: flex;
+        }
+      }
+      .portrait\\:flex {
+        @media screen and (orientation: portrait) {
+          display: flex;
+        }
+      }
+      .print\\:items-end {
+        @media print {
           align-items: flex-end;
         }
       }
@@ -632,38 +604,37 @@ describe('complex screen configs', () => {
 })
 
 test('JS config `screens` can overwrite default CSS `--breakpoint-*`', async () => {
+  let input = css`
+    @theme default {
+      --breakpoint-sm: 40rem;
+      --breakpoint-md: 48rem;
+      --breakpoint-lg: 64rem;
+      --breakpoint-xl: 80rem;
+      --breakpoint-2xl: 96rem;
+    }
+    @config "./config.js";
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: {
+        theme: {
+          screens: {
+            mini: '40rem',
+            midi: '48rem',
+            maxi: '64rem',
+          },
+        },
+      },
+      base: '/root',
+    }),
+  })
+
   // Note: The `sm`, `md`, and other variants are still there because they are
   // created before the compat layer can intercept. We do not remove them
   // currently.
   expect(
-    await run(
-      ['min-sm:flex', 'min-md:flex', 'min-lg:flex', 'min-xl:flex', 'min-2xl:flex'],
-      css`
-        @theme default {
-          --breakpoint-sm: 40rem;
-          --breakpoint-md: 48rem;
-          --breakpoint-lg: 64rem;
-          --breakpoint-xl: 80rem;
-          --breakpoint-2xl: 96rem;
-        }
-        @config "./config.js";
-        @tailwind utilities;
-      `,
-      {
-        loadModule: async () => ({
-          module: {
-            theme: {
-              screens: {
-                mini: '40rem',
-                midi: '48rem',
-                maxi: '64rem',
-              },
-            },
-          },
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toEqual('')
+    compiler.build(['min-sm:flex', 'min-md:flex', 'min-lg:flex', 'min-xl:flex', 'min-2xl:flex']),
+  ).toMatchInlineSnapshot(`""`)
 })
diff --git a/packages/tailwindcss/src/compat/selector-parser.test.ts b/packages/tailwindcss/src/compat/selector-parser.test.ts
new file mode 100644
index 000000000..f995c9de7
--- /dev/null
+++ b/packages/tailwindcss/src/compat/selector-parser.test.ts
@@ -0,0 +1,176 @@
+import { describe, expect, it } from 'vitest'
+import { parse, toCss, walk } from './selector-parser'
+
+describe('parse', () => {
+  it('should parse a simple selector', () => {
+    expect(parse('.foo')).toEqual([{ kind: 'selector', value: '.foo' }])
+  })
+
+  it('should parse a compound selector', () => {
+    expect(parse('.foo.bar:hover#id')).toEqual([
+      { kind: 'selector', value: '.foo' },
+      { kind: 'selector', value: '.bar' },
+      { kind: 'selector', value: ':hover' },
+      { kind: 'selector', value: '#id' },
+    ])
+  })
+
+  it('should parse a selector list', () => {
+    expect(parse('.foo,.bar')).toEqual([
+      { kind: 'selector', value: '.foo' },
+      { kind: 'separator', value: ',' },
+      { kind: 'selector', value: '.bar' },
+    ])
+  })
+
+  it('should combine everything within attribute selectors', () => {
+    expect(parse('.foo[bar="baz"]')).toEqual([
+      { kind: 'selector', value: '.foo' },
+      { kind: 'selector', value: '[bar="baz"]' },
+    ])
+  })
+
+  it('should parse functions', () => {
+    expect(parse('.foo:hover:not(.bar:focus)')).toEqual([
+      { kind: 'selector', value: '.foo' },
+      { kind: 'selector', value: ':hover' },
+      {
+        kind: 'function',
+        nodes: [
+          {
+            kind: 'selector',
+            value: '.bar',
+          },
+          {
+            kind: 'selector',
+            value: ':focus',
+          },
+        ],
+        value: ':not',
+      },
+    ])
+  })
+
+  it('should handle next-children combinator', () => {
+    expect(parse('.foo + p')).toEqual([
+      { kind: 'selector', value: '.foo' },
+      { kind: 'combinator', value: ' + ' },
+      { kind: 'selector', value: 'p' },
+    ])
+  })
+
+  it('should handle escaped characters', () => {
+    expect(parse('foo\\.bar')).toEqual([{ kind: 'selector', value: 'foo\\.bar' }])
+  })
+
+  it('parses :nth-child()', () => {
+    expect(parse(':nth-child(n+1)')).toEqual([
+      {
+        kind: 'function',
+        value: ':nth-child',
+        nodes: [
+          {
+            kind: 'value',
+            value: 'n+1',
+          },
+        ],
+      },
+    ])
+  })
+
+  it('parses &:has(.child:nth-child(2))', () => {
+    expect(parse('&:has(.child:nth-child(2))')).toEqual([
+      {
+        kind: 'selector',
+        value: '&',
+      },
+      {
+        kind: 'function',
+        value: ':has',
+        nodes: [
+          {
+            kind: 'selector',
+            value: '.child',
+          },
+          {
+            kind: 'function',
+            value: ':nth-child',
+            nodes: [
+              {
+                kind: 'value',
+                value: '2',
+              },
+            ],
+          },
+        ],
+      },
+    ])
+  })
+
+  it('parses &:has(:nth-child(2))', () => {
+    expect(parse('&:has(:nth-child(2))')).toEqual([
+      {
+        kind: 'selector',
+        value: '&',
+      },
+      {
+        kind: 'function',
+        value: ':has',
+        nodes: [
+          {
+            kind: 'function',
+            value: ':nth-child',
+            nodes: [
+              {
+                kind: 'value',
+                value: '2',
+              },
+            ],
+          },
+        ],
+      },
+    ])
+  })
+})
+
+describe('toCss', () => {
+  it('should print a simple selector', () => {
+    expect(toCss(parse('.foo'))).toBe('.foo')
+  })
+
+  it('should print a compound selector', () => {
+    expect(toCss(parse('.foo.bar:hover#id'))).toBe('.foo.bar:hover#id')
+  })
+
+  it('should print a selector list', () => {
+    expect(toCss(parse('.foo,.bar'))).toBe('.foo,.bar')
+  })
+
+  it('should print an attribute selectors', () => {
+    expect(toCss(parse('.foo[bar="baz"]'))).toBe('.foo[bar="baz"]')
+  })
+
+  it('should print a function', () => {
+    expect(toCss(parse('.foo:hover:not(.bar:focus)'))).toBe('.foo:hover:not(.bar:focus)')
+  })
+
+  it('should print escaped characters', () => {
+    expect(toCss(parse('foo\\.bar'))).toBe('foo\\.bar')
+  })
+
+  it('should print :nth-child()', () => {
+    expect(toCss(parse(':nth-child(n+1)'))).toBe(':nth-child(n+1)')
+  })
+})
+
+describe('walk', () => {
+  it('can be used to replace a function call', () => {
+    const ast = parse('.foo:hover:not(.bar:focus)')
+    walk(ast, (node, { replaceWith }) => {
+      if (node.kind === 'function' && node.value === ':not') {
+        replaceWith({ kind: 'selector', value: '.inverted-bar' })
+      }
+    })
+    expect(toCss(ast)).toBe('.foo:hover.inverted-bar')
+  })
+})
diff --git a/packages/tailwindcss/src/compat/selector-parser.ts b/packages/tailwindcss/src/compat/selector-parser.ts
new file mode 100644
index 000000000..77a1ce4d4
--- /dev/null
+++ b/packages/tailwindcss/src/compat/selector-parser.ts
@@ -0,0 +1,467 @@
+export type SelectorCombinatorNode = {
+  kind: 'combinator'
+  value: string
+}
+
+export type SelectorFunctionNode = {
+  kind: 'function'
+  value: string
+  nodes: SelectorAstNode[]
+}
+
+export type SelectorNode = {
+  kind: 'selector'
+  value: string
+}
+
+export type SelectorValueNode = {
+  kind: 'value'
+  value: string
+}
+
+export type SelectorSeparatorNode = {
+  kind: 'separator'
+  value: string
+}
+
+export type SelectorAstNode =
+  | SelectorCombinatorNode
+  | SelectorFunctionNode
+  | SelectorNode
+  | SelectorSeparatorNode
+  | SelectorValueNode
+type SelectorParentNode = SelectorFunctionNode | null
+
+function combinator(value: string): SelectorCombinatorNode {
+  return {
+    kind: 'combinator',
+    value,
+  }
+}
+
+function fun(value: string, nodes: SelectorAstNode[]): SelectorFunctionNode {
+  return {
+    kind: 'function',
+    value: value,
+    nodes,
+  }
+}
+
+function selector(value: string): SelectorNode {
+  return {
+    kind: 'selector',
+    value,
+  }
+}
+
+function separator(value: string): SelectorSeparatorNode {
+  return {
+    kind: 'separator',
+    value,
+  }
+}
+
+function value(value: string): SelectorValueNode {
+  return {
+    kind: 'value',
+    value,
+  }
+}
+
+export const enum SelectorWalkAction {
+  /** Continue walking, which is the default */
+  Continue,
+
+  /** Skip visiting the children of this node */
+  Skip,
+
+  /** Stop the walk entirely */
+  Stop,
+}
+
+export function walk(
+  ast: SelectorAstNode[],
+  visit: (
+    node: SelectorAstNode,
+    utils: {
+      parent: SelectorParentNode
+      replaceWith(newNode: SelectorAstNode | SelectorAstNode[]): void
+    },
+  ) => void | SelectorWalkAction,
+  parent: SelectorParentNode = null,
+) {
+  for (let i = 0; i < ast.length; i++) {
+    let node = ast[i]
+    let replacedNode = false
+    let replacedNodeOffset = 0
+    let status =
+      visit(node, {
+        parent,
+        replaceWith(newNode) {
+          if (replacedNode) return
+          replacedNode = true
+
+          if (Array.isArray(newNode)) {
+            if (newNode.length === 0) {
+              ast.splice(i, 1)
+              replacedNodeOffset = 0
+            } else if (newNode.length === 1) {
+              ast[i] = newNode[0]
+              replacedNodeOffset = 1
+            } else {
+              ast.splice(i, 1, ...newNode)
+              replacedNodeOffset = newNode.length
+            }
+          } else {
+            ast[i] = newNode
+            replacedNodeOffset = 1
+          }
+        },
+      }) ?? SelectorWalkAction.Continue
+
+    // We want to visit or skip the newly replaced node(s), which start at the
+    // current index (i). By decrementing the index here, the next loop will
+    // process this position (containing the replaced node) again.
+    if (replacedNode) {
+      if (status === SelectorWalkAction.Continue) {
+        i--
+      } else {
+        i += replacedNodeOffset - 1
+      }
+      continue
+    }
+
+    // Stop the walk entirely
+    if (status === SelectorWalkAction.Stop) return SelectorWalkAction.Stop
+
+    // Skip visiting the children of this node
+    if (status === SelectorWalkAction.Skip) continue
+
+    if (node.kind === 'function') {
+      if (walk(node.nodes, visit, node) === SelectorWalkAction.Stop) {
+        return SelectorWalkAction.Stop
+      }
+    }
+  }
+}
+
+export function toCss(ast: SelectorAstNode[]) {
+  let css = ''
+  for (const node of ast) {
+    switch (node.kind) {
+      case 'combinator':
+      case 'selector':
+      case 'separator':
+      case 'value': {
+        css += node.value
+        break
+      }
+      case 'function': {
+        css += node.value + '(' + toCss(node.nodes) + ')'
+      }
+    }
+  }
+  return css
+}
+
+const BACKSLASH = 0x5c
+const CLOSE_BRACKET = 0x5d
+const CLOSE_PAREN = 0x29
+const COLON = 0x3a
+const COMMA = 0x2c
+const DOUBLE_QUOTE = 0x22
+const FULL_STOP = 0x2e
+const GREATER_THAN = 0x3e
+const NEWLINE = 0x0a
+const NUMBER_SIGN = 0x23
+const OPEN_BRACKET = 0x5b
+const OPEN_PAREN = 0x28
+const PLUS = 0x2b
+const SINGLE_QUOTE = 0x27
+const SPACE = 0x20
+const TAB = 0x09
+const TILDE = 0x7e
+
+export function parse(input: string) {
+  input = input.replaceAll('\r\n', '\n')
+
+  let ast: SelectorAstNode[] = []
+
+  let stack: (SelectorFunctionNode | null)[] = []
+
+  let parent = null as SelectorFunctionNode | null
+
+  let buffer = ''
+
+  let peekChar
+
+  for (let i = 0; i < input.length; i++) {
+    let currentChar = input.charCodeAt(i)
+
+    switch (currentChar) {
+      // E.g.:
+      //
+      // ```css
+      // .foo .bar
+      //     ^
+      //
+      // .foo > .bar
+      //     ^^^
+      // ```
+      case COMMA:
+      case GREATER_THAN:
+      case NEWLINE:
+      case SPACE:
+      case PLUS:
+      case TAB:
+      case TILDE: {
+        // 1. Handle everything before the combinator as a selector
+        if (buffer.length > 0) {
+          let node = selector(buffer)
+          if (parent) {
+            parent.nodes.push(node)
+          } else {
+            ast.push(node)
+          }
+          buffer = ''
+        }
+
+        // 2. Look ahead and find the end of the combinator
+        let start = i
+        let end = i + 1
+        for (; end < input.length; end++) {
+          peekChar = input.charCodeAt(end)
+          if (
+            peekChar !== COMMA &&
+            peekChar !== GREATER_THAN &&
+            peekChar !== NEWLINE &&
+            peekChar !== SPACE &&
+            peekChar !== PLUS &&
+            peekChar !== TAB &&
+            peekChar !== TILDE
+          ) {
+            break
+          }
+        }
+        i = end - 1
+
+        let contents = input.slice(start, end)
+        let node = contents.trim() === ',' ? separator(contents) : combinator(contents)
+        if (parent) {
+          parent.nodes.push(node)
+        } else {
+          ast.push(node)
+        }
+
+        break
+      }
+
+      // Start of a function call.
+      //
+      // E.g.:
+      //
+      // ```css
+      // .foo:not(.bar)
+      //         ^
+      // ```
+      case OPEN_PAREN: {
+        let node = fun(buffer, [])
+        buffer = ''
+
+        // If the function is not one of the following, we combine all it's
+        // contents into a single value node
+        if (
+          node.value !== ':not' &&
+          node.value !== ':where' &&
+          node.value !== ':has' &&
+          node.value !== ':is'
+        ) {
+          // Find the end of the function call
+          let start = i + 1
+          let nesting = 0
+
+          // Find the closing bracket.
+          for (let j = i + 1; j < input.length; j++) {
+            peekChar = input.charCodeAt(j)
+            if (peekChar === OPEN_PAREN) {
+              nesting++
+              continue
+            }
+            if (peekChar === CLOSE_PAREN) {
+              if (nesting === 0) {
+                i = j
+                break
+              }
+              nesting--
+            }
+          }
+          let end = i
+
+          node.nodes.push(value(input.slice(start, end)))
+          buffer = ''
+          i = end
+
+          if (parent) {
+            parent.nodes.push(node)
+          } else {
+            ast.push(node)
+          }
+
+          break
+        }
+
+        if (parent) {
+          parent.nodes.push(node)
+        } else {
+          ast.push(node)
+        }
+        stack.push(node)
+        parent = node
+
+        break
+      }
+
+      // End of a function call.
+      //
+      // E.g.:
+      //
+      // ```css
+      // foo(bar, baz)
+      //             ^
+      // ```
+      case CLOSE_PAREN: {
+        let tail = stack.pop()
+
+        // Handle everything before the closing paren a selector
+        if (buffer.length > 0) {
+          let node = selector(buffer)
+          tail!.nodes.push(node)
+          buffer = ''
+        }
+
+        if (stack.length > 0) {
+          parent = stack[stack.length - 1]
+        } else {
+          parent = null
+        }
+
+        break
+      }
+
+      // Split compound selectors.
+      //
+      // E.g.:
+      //
+      // ```css
+      // .foo.bar
+      //     ^
+      // ```
+      case FULL_STOP:
+      case COLON:
+      case NUMBER_SIGN: {
+        // Handle everything before the combinator as a selector and
+        // start a new selector
+        if (buffer.length > 0) {
+          let node = selector(buffer)
+          if (parent) {
+            parent.nodes.push(node)
+          } else {
+            ast.push(node)
+          }
+        }
+        buffer = String.fromCharCode(currentChar)
+        break
+      }
+
+      // Start of an attribute selector.
+      case OPEN_BRACKET: {
+        // Handle everything before the combinator as a selector
+        if (buffer.length > 0) {
+          let node = selector(buffer)
+          if (parent) {
+            parent.nodes.push(node)
+          } else {
+            ast.push(node)
+          }
+        }
+        buffer = ''
+
+        let start = i
+        let nesting = 0
+
+        // Find the closing bracket.
+        for (let j = i + 1; j < input.length; j++) {
+          peekChar = input.charCodeAt(j)
+          if (peekChar === OPEN_BRACKET) {
+            nesting++
+            continue
+          }
+          if (peekChar === CLOSE_BRACKET) {
+            if (nesting === 0) {
+              i = j
+              break
+            }
+            nesting--
+          }
+        }
+
+        // Adjust `buffer` to include the string.
+        buffer += input.slice(start, i + 1)
+        break
+      }
+
+      // Start of a string.
+      case SINGLE_QUOTE:
+      case DOUBLE_QUOTE: {
+        let start = i
+
+        // We need to ensure that the closing quote is the same as the opening
+        // quote.
+        //
+        // E.g.:
+        //
+        // ```css
+        // "This is a string with a 'quote' in it"
+        //                          ^     ^         -> These are not the end of the string.
+        // ```
+        for (let j = i + 1; j < input.length; j++) {
+          peekChar = input.charCodeAt(j)
+          // Current character is a `\` therefore the next character is escaped.
+          if (peekChar === BACKSLASH) {
+            j += 1
+          }
+
+          // End of the string.
+          else if (peekChar === currentChar) {
+            i = j
+            break
+          }
+        }
+
+        // Adjust `buffer` to include the string.
+        buffer += input.slice(start, i + 1)
+        break
+      }
+
+      // Escaped characters.
+      case BACKSLASH: {
+        let nextChar = input.charCodeAt(i + 1)
+        buffer += String.fromCharCode(currentChar) + String.fromCharCode(nextChar)
+        i += 1
+        break
+      }
+
+      // Everything else will be collected in the buffer
+      default: {
+        buffer += String.fromCharCode(currentChar)
+      }
+    }
+  }
+
+  // Collect the remainder as a word
+  if (buffer.length > 0) {
+    ast.push(selector(buffer))
+  }
+
+  return ast
+}
diff --git a/packages/tailwindcss/src/compile.ts b/packages/tailwindcss/src/compile.ts
index 46f562918..6530541a0 100644
--- a/packages/tailwindcss/src/compile.ts
+++ b/packages/tailwindcss/src/compile.ts
@@ -1,20 +1,25 @@
-import { atRule, context, decl, rule, type AstNode, type Rule, type StyleRule } from './ast'
+import {
+  atRule,
+  decl,
+  rule,
+  walk,
+  WalkAction,
+  type AstNode,
+  type Rule,
+  type StyleRule,
+} from './ast'
 import { type Candidate, type Variant } from './candidate'
-import { CompileAstFlags, type DesignSystem } from './design-system'
+import { type DesignSystem } from './design-system'
 import GLOBAL_PROPERTY_ORDER from './property-order'
 import { asColor, type Utility } from './utilities'
 import { compare } from './utils/compare'
 import { escape } from './utils/escape'
 import type { Variants } from './variants'
-import { walk, WalkAction } from './walk'
 
 export function compileCandidates(
   rawCandidates: Iterable<string>,
   designSystem: DesignSystem,
-  {
-    onInvalidCandidate,
-    respectImportant,
-  }: { onInvalidCandidate?: (candidate: string) => void; respectImportant?: boolean } = {},
+  { onInvalidCandidate }: { onInvalidCandidate?: (candidate: string) => void } = {},
 ) {
   let nodeSorting = new Map<
     AstNode,
@@ -39,12 +44,6 @@ export function compileCandidates(
     matches.set(rawCandidate, candidates)
   }
 
-  let flags = CompileAstFlags.None
-
-  if (respectImportant ?? true) {
-    flags |= CompileAstFlags.RespectImportant
-  }
-
   let variantOrderMap = designSystem.getVariantOrder()
 
   // Create the AST
@@ -52,7 +51,7 @@ export function compileCandidates(
     let found = false
 
     for (let candidate of candidates) {
-      let rules = designSystem.compileAstNodes(candidate, flags)
+      let rules = designSystem.compileAstNodes(candidate)
       if (rules.length === 0) continue
 
       found = true
@@ -120,16 +119,10 @@ export function compileCandidates(
   }
 }
 
-export function compileAstNodes(
-  candidate: Candidate,
-  designSystem: DesignSystem,
-  flags: CompileAstFlags,
-) {
+export function compileAstNodes(candidate: Candidate, designSystem: DesignSystem) {
   let asts = compileBaseUtility(candidate, designSystem)
   if (asts.length === 0) return []
 
-  let respectImportant = designSystem.important && Boolean(flags & CompileAstFlags.RespectImportant)
-
   let rules: {
     node: AstNode
     propertySort: {
@@ -143,10 +136,7 @@ export function compileAstNodes(
   for (let nodes of asts) {
     let propertySort = getPropertySort(nodes)
 
-    // If the candidate itself is important then we want to always mark
-    // the utility as important. However, at a design system level we want
-    // to be able to opt-out when using things like `@apply`
-    if (candidate.important || respectImportant) {
+    if (candidate.important || designSystem.important) {
       applyImportant(nodes)
     }
 
@@ -187,18 +177,7 @@ export function applyVariant(
     // E.g. `[>img]:flex` is not valid, but `has-[>img]:flex` is
     if (variant.relative && depth === 0) return null
 
-    let child: AstNode = rule(variant.selector, node.nodes)
-
-    // Wrap variant-generated `@scope` rules in a `context` marker, so they are
-    // hoisted with the variant semantics instead of their native CSS nesting
-    // semantics. The slotted content is marked as `user` content, so `@scope`
-    // rules defined there keep their native CSS nesting semantics.
-    if (child.kind === 'at-rule' && child.name === '@scope') {
-      child.nodes = [context({ source: 'user' }, node.nodes)]
-      child = context({ source: 'variant' }, [child])
-    }
-
-    node.nodes = [child]
+    node.nodes = [rule(variant.selector, node.nodes)]
     return
   }
 
@@ -298,19 +277,7 @@ function compileBaseUtility(candidate: Candidate, designSystem: DesignSystem) {
 
     let compiledNodes = utility.compileFn(candidate)
     if (compiledNodes === undefined) continue
-    if (compiledNodes === null) {
-      // `null` means that the result is invalid and that this plugin should not
-      // result in any CSS, but that doesn't mean that subsequent plugins are
-      // invalid as well.
-      //
-      // However, for backwards compatibility with `matchUtilities` this means
-      // that we do need to bail entirely: plugins that handle a specific
-      // arbitrary value type prevent falling through to other plugins if the
-      // result is invalid for that plugin
-      if (utility.options?.types?.length) return asts
-
-      continue
-    }
+    if (compiledNodes === null) return asts
     asts.push(compiledNodes)
   }
 
@@ -322,19 +289,7 @@ function compileBaseUtility(candidate: Candidate, designSystem: DesignSystem) {
 
     let compiledNodes = utility.compileFn(candidate)
     if (compiledNodes === undefined) continue
-    if (compiledNodes === null) {
-      // `null` means that the result is invalid and that this plugin should not
-      // result in any CSS, but that doesn't mean that subsequent plugins are
-      // invalid as well.
-      //
-      // However, for backwards compatibility with `matchUtilities` this means
-      // that we do need to bail entirely: plugins that handle a specific
-      // arbitrary value type prevent falling through to other plugins if the
-      // result is invalid for that plugin
-      if (utility.options?.types?.length) return asts
-
-      continue
-    }
+    if (compiledNodes === null) return asts
     asts.push(compiledNodes)
   }
 
diff --git a/packages/tailwindcss/src/constant-fold-declaration.test.ts b/packages/tailwindcss/src/constant-fold-declaration.test.ts
deleted file mode 100644
index 5a0c867b6..000000000
--- a/packages/tailwindcss/src/constant-fold-declaration.test.ts
+++ /dev/null
@@ -1,137 +0,0 @@
-import { expect, it } from 'vitest'
-import { constantFoldDeclaration } from './constant-fold-declaration'
-
-it.each([
-  // Simple expression
-  ['calc(1 + 1)', '2'],
-  ['calc(3 - 2)', '1'],
-  ['calc(2 * 3)', '6'],
-  ['calc(8 / 2)', '4'],
-
-  // Nested
-  ['calc(1 + calc(1 + 1))', '3'],
-  ['calc(3 - calc(1 + 2))', '0'],
-  ['calc(2 * calc(1 + 3))', '8'],
-  ['calc(8 / calc(2 + 2))', '2'],
-  ['calc(1 + (1 + 1))', '3'],
-  ['calc(3 - (1 + 2))', '0'],
-  ['calc(2 * (1 + 3))', '8'],
-  ['calc(8 / (2 + 2))', '2'],
-
-  // With units
-  ['calc(1rem * 2)', '2rem'],
-  ['calc(2rem - 0.5rem)', '1.5rem'],
-  ['calc(3rem * 6)', '18rem'],
-  ['calc(5rem / 2)', '2.5rem'],
-
-  // Negating with units
-  ['calc(2rem * -1)', '-2rem'],
-  ['calc(-1 * 2rem)', '-2rem'],
-
-  // Nested partial evaluation
-  ['calc(calc(1 + 2) + 2rem)', 'calc(3 + 2rem)'],
-
-  // Nested multiplication with unknown values
-  ['calc(2 * calc(3 * var(--foo)))', 'calc(6 * var(--foo))'],
-  ['calc(calc(3 * var(--foo)) * 2)', 'calc(6 * var(--foo))'],
-  ['calc(2rem * calc(3 * var(--foo)))', 'calc(6rem * var(--foo))'],
-
-  // Nested addition with unknown values
-  ['calc(1rem + calc(2rem + var(--foo)))', 'calc(3rem + var(--foo))'],
-  ['calc(calc(2rem + var(--foo)) + 1rem)', 'calc(3rem + var(--foo))'],
-
-  // Nested multiplication can collapse away entirely
-  ['calc(-1 * calc(-1 * var(--foo)))', 'var(--foo)'],
-  ['calc(calc(-1 * var(--foo)) * -1)', 'var(--foo)'],
-  ['calc(-1 * calc(var(--foo) * -1))', 'var(--foo)'],
-  ['calc(-1 * (-1 * var(--foo)))', 'var(--foo)'],
-  ['calc(1 * var(--foo))', 'var(--foo)'],
-  ['calc(var(--foo) * 1)', 'var(--foo)'],
-
-  // Evaluation only handles two operands right now, this can change in the future
-  ['calc(1 + 2 + 3)', 'calc(1 + 2 + 3)'],
-])('should constant fold `%s` into `%s`', (input, expected) => {
-  expect(constantFoldDeclaration(input)).toBe(expected)
-})
-
-it.each([
-  ['calc(1rem * 2%)'],
-  ['calc(1rem * 2px)'],
-  ['calc(2rem - 6)'],
-  ['calc(3rem * 3dvw)'],
-  ['calc(3rem * 2dvh)'],
-  ['calc(5rem / 17px)'],
-  ['calc(2rem * calc(3px * var(--foo)))'],
-  ['calc(1rem + 0px + var(--foo))'],
-])('should not constant fold different units `%s`', (input) => {
-  expect(constantFoldDeclaration(input)).toBe(input)
-})
-
-it.each([
-  ['calc(0 * 100vw)'],
-  ['calc(0 * calc(1 * 2))'],
-  ['calc(0 * var(--foo))'],
-  ['calc(0 * calc(var(--spacing) * 32))'],
-
-  ['calc(100vw * 0)'],
-  ['calc(calc(1 * 2) * 0)'],
-  ['calc(var(--foo) * 0)'],
-  ['calc(calc(var(--spacing, 0.25rem) * 32) * 0)'],
-  ['calc(var(--spacing, 0.25rem) * -0)'],
-
-  // Zeroes
-  ['0px'],
-  ['0rem'],
-  ['0em'],
-  ['0dvh'],
-  ['-0'],
-  ['+0'],
-  ['-0.0rem'],
-  ['+0.00rem'],
-
-  // Expressions
-  ['calc(-0px * -1)'],
-  ['calc(-1 * -0px)'],
-])('should constant fold `%s` to `0` (%#)', (input) => {
-  expect(constantFoldDeclaration(input)).toBe('0')
-})
-
-it.each([
-  // Expressions, keep unit when they are nested
-  //
-  // TODO: We might be able to fold this further to just `1rem`, but we can't do
-  // that for any `0<unit>`. E.g.: `calc(0s + 1rem)` which is invalid, would
-  // become valid if we just use `1rem`.
-  ['calc(calc(0px * -1) + 1rem)', 'calc(0px + 1rem)'],
-  ['calc(calc(-1 * 0px) + 1rem)', 'calc(0px + 1rem)'],
-
-  // Non-foldable units
-  ['0deg', '0deg'],
-  ['0rad', '0deg'],
-  ['0%', '0%'],
-  ['0turn', '0deg'],
-  ['0fr', '0fr'],
-  ['0ms', '0s'],
-  ['0s', '0s'],
-  ['-0.0deg', '0deg'],
-  ['-0.0rad', '0deg'],
-  ['-0.0%', '0%'],
-  ['-0.0turn', '0deg'],
-  ['-0.0fr', '0fr'],
-  ['-0.0ms', '0s'],
-  ['-0.0s', '0s'],
-])('should not fold non-foldable units to `0`. Constant fold `%s` into `%s`', (input, expected) => {
-  expect(constantFoldDeclaration(input)).toBe(expected)
-})
-
-it('should not constant fold when dividing by `0`', () => {
-  expect(constantFoldDeclaration('calc(123rem / 0)')).toBe('calc(123rem / 0)')
-})
-
-it('should not constant fold when a computation has a high-precision result', () => {
-  expect(constantFoldDeclaration('calc(100% / 3.5)')).toBe('calc(100% / 3.5)')
-})
-
-it('should constant fold division results with floating-point error after scaling', () => {
-  expect(constantFoldDeclaration('calc(29% / 100)')).toBe('0.29%')
-})
diff --git a/packages/tailwindcss/src/constant-fold-declaration.ts b/packages/tailwindcss/src/constant-fold-declaration.ts
deleted file mode 100644
index c15420150..000000000
--- a/packages/tailwindcss/src/constant-fold-declaration.ts
+++ /dev/null
@@ -1,357 +0,0 @@
-import { dimensions } from './utils/dimensions'
-import { isLength } from './utils/infer-data-type'
-import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
-
-// Assumption: We already assume that we receive somewhat valid `calc()`
-// expressions. So we will see `calc(1 + 1)` and not `calc(1+1)`
-export function constantFoldDeclaration(
-  input: string,
-  rem: number | null = null,
-  normalizeUnit = true,
-): string {
-  let [folded, valueAst] = constantFoldDeclarationAst(ValueParser.parse(input), rem, normalizeUnit)
-
-  return folded ? ValueParser.toCss(valueAst) : input
-}
-
-export function constantFoldDeclarationAst(
-  ast: ValueParser.ValueAstNode[],
-  rem: number | null = null,
-  normalizeUnit = true,
-): [folded: boolean, ast: ValueParser.ValueAstNode[]] {
-  let folded = false
-
-  walk(ast, {
-    exit(valueNode, ctx) {
-      // Canonicalize dimensions to their simplest form. This includes:
-      // - Convert `-0`, `+0`, `0.0`, … to `0`
-      // - Convert `-0px`, `+0em`, `0.0rem`, … to `0<unit>`
-      // - Convert units to an equivalent unit
-      if (
-        valueNode.kind === 'word' &&
-        valueNode.value !== '0' // Already `0`, nothing to do
-      ) {
-        let canonical = canonicalizeDimension(valueNode.value, rem, normalizeUnit)
-        if (canonical === null) return // Couldn't be canonicalized, nothing to do
-        if (canonical === valueNode.value) return // Already in canonical form, nothing to do
-
-        // We need to be careful with `0` because `0<unit>` can only be
-        // converted to `0` if we're dealing with a `<length>` type.
-        if (canonical === '0') {
-          // When used inside of a function such as `calc(…)`, then this isn't
-          // always safe to convert to `0`.
-          //
-          // E.g.:
-          // - `calc(0px + 1rem)` → `calc(0 + 1rem)` this goes from valid to invalid
-          // - `calc(0px * 1rem)` → `calc(0 * 1rem)` this goes from invalid to valid
-          if (ctx.parent?.kind === 'function') {
-            let withUnit = canonicalizeDimension(valueNode.value, rem, false)
-            if (withUnit === null) return
-
-            folded = true
-            return WalkAction.ReplaceSkip(ValueParser.word(withUnit))
-          }
-        }
-
-        folded = true
-        return WalkAction.ReplaceSkip(ValueParser.word(canonical))
-      }
-
-      // Constant fold `calc()` expressions with two operands and one operator
-      else if (
-        valueNode.kind === 'function' &&
-        (valueNode.value === 'calc' || valueNode.value === '')
-      ) {
-        // [
-        //   { kind: 'word', value: '0.25rem' },            0
-        //   { kind: 'separator', value: ' ' },             1
-        //   { kind: 'word', value: '*' },                  2
-        //   { kind: 'separator', value: ' ' },             3
-        //   { kind: 'word', value: '256' }                 4
-        // ]
-        if (valueNode.nodes.length !== 5) return
-        if (valueNode.nodes[2].kind !== 'word') return
-
-        let lhsNode = valueNode.nodes[0]
-        let operator = valueNode.nodes[2].value
-        let rhsNode = valueNode.nodes[4]
-
-        let lhs = lhsNode.kind === 'word' ? dimensions.get(lhsNode.value) : null
-        let rhs = rhsNode.kind === 'word' ? dimensions.get(rhsNode.value) : null
-
-        // Nullify entire expression when multiplying by `0`, e.g.: `calc(0 * 100vw)` -> `0`
-        //
-        // TODO: Ensure it's safe to do so based on the data types?
-        if (
-          operator === '*' &&
-          ((lhs?.[0] === 0 && lhs?.[1] === null) || // 0 * something
-            (rhs?.[0] === 0 && rhs?.[1] === null)) // something * 0
-        ) {
-          folded = true
-          return WalkAction.ReplaceSkip(ValueParser.word('0'))
-        }
-
-        // Fold `0<unit> * something-without-unit` to just `0<unit>`, inside of a function such as `calc(…)`
-        if (operator === '*' && lhs?.[0] === 0 && lhs?.[1] !== null && rhs?.[1] === null) {
-          folded = true
-          if (ctx.parent?.kind === 'function') {
-            return WalkAction.ReplaceSkip(ValueParser.word(`0${lhs[1]}`))
-          } else {
-            return WalkAction.ReplaceSkip(ValueParser.word('0'))
-          }
-        }
-
-        // Fold `something-without-unit * 0<unit>` to just `0<unit>`, inside of a function such as `calc(…)`
-        if (operator === '*' && rhs?.[0] === 0 && rhs?.[1] !== null && lhs?.[1] === null) {
-          folded = true
-          if (ctx.parent?.kind === 'function') {
-            return WalkAction.ReplaceSkip(ValueParser.word(`0${rhs[1]}`))
-          } else {
-            return WalkAction.ReplaceSkip(ValueParser.word('0'))
-          }
-        }
-
-        if (operator === '*') {
-          // Multiplying by `1` can always unwrap the other side, even when that
-          // side is an expression like `var(--foo)` that we can't fully fold.
-          if (lhs?.[0] === 1 && lhs?.[1] === null) {
-            folded = true
-            return WalkAction.ReplaceSkip(rhsNode)
-          }
-
-          if (rhs?.[0] === 1 && rhs?.[1] === null) {
-            folded = true
-            return WalkAction.ReplaceSkip(lhsNode)
-          }
-        }
-
-        if (operator === '*' || operator === '+') {
-          // If only one side is known, and the unknown side is itself another
-          // binary expression with the same operator, try to combine the two
-          // known parts and keep the unknown part in place.
-          //
-          // E.g.:
-          //
-          // - `calc(2rem * calc(3    * var(--foo)))` → `calc(6rem * var(--foo))`
-          // - `calc(2rem + calc(3rem + var(--foo)))` → `calc(5rem + var(--foo))`
-          //
-          // At this point `lhs` and `rhs` are dimensions ([value, unit] |
-          // null). The `null` one is the unknown node.
-          let constant = lhs ?? rhs
-          let nestedNode = lhs === null ? lhsNode : rhs === null ? rhsNode : null
-
-          if (
-            constant !== null &&
-            nestedNode !== null &&
-            nestedNode.kind === 'function' &&
-            (nestedNode.value === 'calc' || nestedNode.value === '') &&
-            nestedNode.nodes.length === 5 &&
-            nestedNode.nodes[2].kind === 'word' &&
-            nestedNode.nodes[2].value === operator
-          ) {
-            let nestedLhsNode = nestedNode.nodes[0]
-            let nestedRhsNode = nestedNode.nodes[4]
-            let nestedLhs =
-              nestedLhsNode.kind === 'word' ? dimensions.get(nestedLhsNode.value) : null
-            let nestedRhs =
-              nestedRhsNode.kind === 'word' ? dimensions.get(nestedRhsNode.value) : null
-
-            let known = nestedLhs ?? nestedRhs
-            let unknown =
-              nestedLhs === null ? nestedLhsNode : nestedRhs === null ? nestedRhsNode : null
-
-            if (known !== null && unknown !== null) {
-              // `*` requires both values being unitless, or one of them. Both
-              // values having a unit is invalid.
-              //
-              // - `2    * 3`     → valid
-              // - `4rem * 5`     → valid
-              // - `6    * 7rem`  → valid
-              // - `8rem * 9rem`  → invalid
-              if (
-                operator === '*' &&
-                !(
-                  (constant[1] === null && known[1] === null) || // Both can be unitless
-                  (constant[1] === null && known[1] !== null) || // One of them can be unitless, but the other can't
-                  (constant[1] !== null && known[1] === null) // One of them can be unitless, but the other can't
-                )
-              ) {
-                return
-              }
-
-              // `+` requires that both values being unitless, or both values
-              // have a unit. Mixed units are valid, but we won't fold these.
-              //
-              // - `2    + 3`     → valid
-              // - `4rem + 5`     → invalid
-              // - `6    + 7rem`  → invalid
-              // - `8rem + 9rem`  → valid
-              if (
-                operator === '+' &&
-                !(
-                  constant[1] === known[1] // Only same unit is allowed
-                )
-              ) {
-                return
-              }
-
-              // Re-associate nested expressions so we can still fold the known
-              // part of `x op (y op z)` when `z` is unknown.
-              //
-              // Examples:
-              // - `calc(2 * calc(3 * var(--foo)))` -> `calc(6 * var(--foo))`
-              // - `calc(1rem + calc(2rem + var(--foo)))` -> `calc(3rem + var(--foo))`
-              let combined: string
-              switch (operator) {
-                case '*': {
-                  combined = `${constant[0] * known[0]}${constant[1] ?? known[1] ?? ''}`
-                  break
-                }
-                case '+': {
-                  combined = `${constant[0] + known[0]}${constant[1] ?? known[1] ?? ''}`
-                  break
-                }
-
-                default:
-                  return
-              }
-
-              folded = true
-
-              if (operator === '*' && combined === '1') {
-                return WalkAction.ReplaceSkip(unknown)
-              }
-
-              let replacement: ValueParser.ValueFunctionNode = {
-                kind: 'function',
-                value: valueNode.value,
-                nodes: [
-                  ValueParser.word(combined),
-                  valueNode.nodes[1],
-                  valueNode.nodes[2],
-                  valueNode.nodes[3],
-                  unknown,
-                ],
-              }
-
-              return WalkAction.ReplaceSkip(replacement)
-            }
-          }
-        }
-
-        // We're not dealing with dimensions, so we can't fold this
-        if (lhs === null || rhs === null) {
-          return
-        }
-
-        switch (operator) {
-          case '*': {
-            if (
-              lhs[1] === rhs[1] || // Same Units, e.g.: `1rem * 2rem`, `8 * 6`
-              (lhs[1] === null && rhs[1] !== null) || // Unitless * Unit, e.g.: `2 * 1rem`
-              (lhs[1] !== null && rhs[1] === null) // Unit * Unitless, e.g.: `1rem * 2`
-            ) {
-              folded = true
-              return WalkAction.ReplaceSkip(
-                ValueParser.word(`${lhs[0] * rhs[0]}${lhs[1] ?? rhs[1] ?? ''}`),
-              )
-            }
-            break
-          }
-
-          case '+': {
-            if (
-              lhs[1] === rhs[1] // Same unit or unitless, e.g.: `1rem + 2rem`, `8 + 6`
-            ) {
-              folded = true
-              return WalkAction.ReplaceSkip(ValueParser.word(`${lhs[0] + rhs[0]}${lhs[1] ?? ''}`))
-            }
-            break
-          }
-
-          case '-': {
-            if (
-              lhs[1] === rhs[1] // Same unit or unitless, e.g.: `2rem - 1rem`, `8 - 6`
-            ) {
-              folded = true
-              return WalkAction.ReplaceSkip(ValueParser.word(`${lhs[0] - rhs[0]}${lhs[1] ?? ''}`))
-            }
-            break
-          }
-
-          case '/': {
-            if (
-              rhs[0] !== 0 && // Don't divide by zero
-              ((lhs[1] === null && rhs[1] === null) || // Unitless / Unitless, e.g.: `8 / 2`
-                (lhs[1] !== null && rhs[1] === null)) // Unit / Unitless, e.g.: `1rem / 2`
-            ) {
-              let computed = lhs[0] / rhs[0]
-
-              // Only fold with .xx precision, anything beyond that might be a bit too much.
-              //
-              // E.g. 100% / 3.5 = 28.571428571428573%, which is correct but not
-              //      as user friendly. Especially when going from
-              //      `w-[calc(100%/3.5)]` → `w-[28.571428571428573%]`
-              if (Math.round(computed * 100) / 100 !== computed) {
-                break
-              }
-
-              folded = true
-              return WalkAction.ReplaceSkip(ValueParser.word(`${computed}${lhs[1] ?? ''}`))
-            }
-            break
-          }
-        }
-      }
-    },
-  })
-
-  return [folded, ast]
-}
-
-function canonicalizeDimension(
-  input: string,
-  rem: number | null = null,
-  normalizeUnit = true,
-): string | null {
-  let dimension = dimensions.get(input)
-  if (dimension === null) return null // This shouldn't happen
-
-  let [value, unit] = dimension
-  if (unit === null) return `${value}` // Already unitless, nothing to do
-
-  // Replace `0<length>` units with just `0`
-  if (value === 0 && isLength(input)) {
-    if (normalizeUnit) return '0'
-    else return `0${unit}` // Keep unit
-  }
-
-  // Only normalize into base units when necessary
-  if (!normalizeUnit) return `${input}`
-
-  // prettier-ignore
-  switch (unit.toLowerCase()) {
-    // <length> to px, https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Styling_basics/Values_and_units#lengths
-    case 'in':  return `${value * 96}px`                  // 1in  = 96.000px
-    case 'cm':  return `${value * 96 / 2.54}px`           // 1cm  = 37.795px
-    case 'mm':  return `${value * 96 / 2.54 / 10}px`      // 1mm  =  3.779px
-    case 'q':   return `${value * 96 / 2.54 / 10 / 4}px`  //  1q  =  0.945px
-    case 'pc':  return `${value * 96 / 6}px`              // 1pc  = 16.000px
-    case 'pt':  return `${value * 96 / 72}px`             // 1pt  =  1.333px
-    case 'rem': return rem !== null ? `${value * rem}px` : null    // 1rem = 16.000px (Assuming root font-size is 16px)
-
-    // <angle> to deg, https://developer.mozilla.org/en-US/docs/Web/CSS/angle
-    case 'grad': return `${value * 0.9}deg`               // 1grad =   0.900deg
-    case 'rad':  return `${value * 180 / Math.PI}deg`     //  1rad =  57.296deg
-    case 'turn': return `${value * 360}deg`               // 1turn = 360.000deg
-
-    // <time> to s, https://developer.mozilla.org/en-US/docs/Web/CSS/time
-    case 'ms':   return `${value / 1000}s`                // 1ms = 0.001s
-
-    // <frequency> to hz, https://developer.mozilla.org/en-US/docs/Web/CSS/frequency
-    case 'khz':  return `${value * 1000}hz`               // 1kHz = 1000Hz
-
-    default: return `${value}${unit}` // No canonicalization possible, return as-is
-  }
-}
diff --git a/packages/tailwindcss/src/css-functions.test.ts b/packages/tailwindcss/src/css-functions.test.ts
index 8cab2949f..29e09d7d8 100644
--- a/packages/tailwindcss/src/css-functions.test.ts
+++ b/packages/tailwindcss/src/css-functions.test.ts
@@ -3,7 +3,7 @@ import path from 'node:path'
 import { describe, expect, test } from 'vitest'
 import { compile } from '.'
 import plugin from './plugin'
-import { compileCss, pretty, run } from './test-utils/run'
+import { compileCss, optimizeCss } from './test-utils/run'
 
 const css = String.raw
 
@@ -16,16 +16,14 @@ describe('--alpha(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .foo {
-        margin: oklab(62.7955% .224 .125 / .5);
-      }
-      "
+      ".foo {
+        margin: oklab(62.7955% .22486 .12584 / .5);
+      }"
     `)
   })
 
   test('--alpha(…) errors when no arguments are used', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         .foo {
           margin: --alpha();
@@ -37,7 +35,7 @@ describe('--alpha(…)', () => {
   })
 
   test('--alpha(…) errors when alpha value is missing', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         .foo {
           margin: --alpha(red);
@@ -49,7 +47,7 @@ describe('--alpha(…)', () => {
   })
 
   test('--alpha(…) errors multiple arguments are used', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         .foo {
           margin: --alpha(red / 50%, blue);
@@ -74,15 +72,13 @@ describe('--spacing(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --spacing: .25rem;
       }
 
       .foo {
         margin: calc(var(--spacing) * 4);
-      }
-      "
+      }"
     `)
   })
 
@@ -98,117 +94,14 @@ describe('--spacing(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .foo {
+      ".foo {
         margin: 1rem;
-      }
-      "
+      }"
     `)
   })
 
-  describe('optimizations', () => {
-    // Use custom `compileCss` such that we can use a version without Lightning
-    // CSS. This way we test _our_ optimizations instead of Lightning's
-    // optimizations.
-    async function compileCss(css: string, options: Parameters<typeof compile>[1] = {}) {
-      let { build } = await compile(css, options)
-      return pretty(build([]))
-    }
-
-    test('--spacing(…) optimizes the output when the input is `0`', async () => {
-      expect(
-        await compileCss(css`
-          @theme {
-            --spacing: 0.25rem;
-          }
-
-          .foo {
-            margin: --spacing(0);
-            padding: --spacing(0px);
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .foo {
-          margin: 0px;
-          padding: 0px;
-        }
-        "
-      `)
-    })
-
-    test('--spacing(…) optimizes the output when the input is `0` (with an inlined theme value)', async () => {
-      expect(
-        await compileCss(css`
-          @theme inline {
-            --spacing: 0.25rem;
-          }
-
-          .foo {
-            margin: --spacing(0);
-            padding: --spacing(0px);
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .foo {
-          margin: 0px;
-          padding: 0px;
-        }
-        "
-      `)
-    })
-
-    test('--spacing(…) optimizes the output when the input is `1`', async () => {
-      expect(
-        await compileCss(css`
-          @theme {
-            --spacing: 0.25rem;
-          }
-
-          .foo {
-            margin: --spacing(1);
-            padding: --spacing(1px);
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :root, :host {
-          --spacing: 0.25rem;
-        }
-        .foo {
-          margin: var(--spacing);
-          padding: var(--spacing);
-        }
-        "
-      `)
-    })
-
-    test('--spacing(…) optimizes the output when the input is `1` (with an inlined theme value)', async () => {
-      expect(
-        await compileCss(css`
-          @theme inline {
-            --spacing: 0.25rem;
-          }
-
-          .foo {
-            margin: --spacing(1);
-            padding: --spacing(1px);
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .foo {
-          margin: 0.25rem;
-          padding: 0.25rem;
-        }
-        "
-      `)
-    })
-  })
-
   test('--spacing(…) relies on `--spacing` to be defined', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         .foo {
           margin: --spacing(4);
@@ -220,7 +113,7 @@ describe('--spacing(…)', () => {
   })
 
   test('--spacing(…) requires a single value', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         @theme {
           --spacing: 0.25rem;
@@ -236,7 +129,7 @@ describe('--spacing(…)', () => {
   })
 
   test('--spacing(…) does not have multiple arguments', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         .foo {
           margin: --spacing(4, 5, 6);
@@ -260,15 +153,13 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-red-500: red;
       }
 
       .red {
         color: var(--color-red-500);
-      }
-      "
+      }"
     `)
   })
 
@@ -283,11 +174,9 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .red {
+      ".red {
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -302,21 +191,13 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-red-500: red;
       }
 
       .red {
-        color: #ff000080;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .red {
-          color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        }
-      }
-      "
+        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
+      }"
     `)
   })
 
@@ -331,11 +212,9 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .red {
+      ".red {
         color: oklab(62.7955% .224863 .125846);
-      }
-      "
+      }"
     `)
   })
 
@@ -350,11 +229,9 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .red {
+      ".red {
         font-family: var(--tw-default-font-family, Potato Sans, sans-serif);
-      }
-      "
+      }"
     `)
   })
 
@@ -369,11 +246,9 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .red {
+      ".red {
         font-family: var(--tw-default-font-family, Potato Sans, sans-serif);
-      }
-      "
+      }"
     `)
   })
 
@@ -388,11 +263,9 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .red {
+      ".red {
         font-family: Potato Sans, sans-serif;
-      }
-      "
+      }"
     `)
   })
 
@@ -407,18 +280,15 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .red {
+      ".red {
         font-family: Potato Sans, sans-serif;
-      }
-      "
+      }"
     `)
   })
 
   test('--theme(…) does not inject the fallback if the fallback is `initial`', async () => {
     expect(
-      await run(
-        ['tw:font-sans'],
+      await compileCss(
         css`
           @theme prefix(tw) {
             --font-sans:
@@ -433,12 +303,11 @@ describe('--theme(…)', () => {
           }
           @tailwind utilities;
         `,
+        ['tw:font-sans'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --tw-font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
-                    "Segoe UI Symbol", "Noto Color Emoji";
+      ":root, :host {
+        --tw-font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
         --tw-default-font-family: var(--tw-font-sans);
       }
 
@@ -450,8 +319,7 @@ describe('--theme(…)', () => {
 
       .tw\\:font-sans {
         font-family: var(--tw-font-sans);
-      }
-      "
+      }"
     `)
   })
 
@@ -475,24 +343,22 @@ describe('--theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 48rem) {
+      "@media (width >= 48rem) {
         .blue {
           color: #00f;
         }
       }
 
-      @media (min-width: 64rem) {
+      @media (width >= 64rem) {
         .red {
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('--theme(…) can only be used with CSS variables from your @theme', async () => {
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         @theme {
           --color-red-500: #f00;
@@ -505,7 +371,7 @@ describe('--theme(…)', () => {
       `[Error: The --theme(…) function can only be used with CSS variables from your theme.]`,
     )
 
-    await expect(() =>
+    expect(() =>
       compileCss(css`
         @theme {
           --color-red-500: #f00;
@@ -518,50 +384,6 @@ describe('--theme(…)', () => {
       `[Error: Could not resolve value for theme function: \`theme(--color-green-500)\`. Consider checking if the variable name is correct or provide a fallback value to silence this error.]`,
     )
   })
-
-  test('--theme(…) function still works as expected, even when a plugin is imported', async () => {
-    expect(
-      await compileCss(
-        css`
-          @layer base {
-            html,
-            :host {
-              font-family: --theme(--default-font-family, system-ui);
-            }
-          }
-          @layer theme {
-            @theme {
-              --font-sans: sans-serif;
-              --default-font-family: --theme(--font-sans, initial);
-            }
-          }
-          @plugin "my-plugin.js";
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: () => {},
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
-        html, :host {
-          font-family: var(--default-font-family, system-ui);
-        }
-      }
-
-      @layer theme {
-        :root, :host {
-          --font-sans: sans-serif;
-          --default-font-family: var(--font-sans);
-        }
-      }
-      "
-    `)
-  })
 })
 
 describe('theme(…)', () => {
@@ -578,11 +400,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -597,11 +417,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -616,11 +434,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -635,11 +451,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -654,11 +468,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -673,11 +485,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -692,11 +502,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: oklab(62.7955% .224 .125 / .75);
-          }
-          "
+          ".red {
+            color: oklab(62.7955% .22486 .12584 / .75);
+          }"
         `)
       })
 
@@ -711,11 +519,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: oklab(62.7955% .224 .125 / .75);
-          }
-          "
+          ".red {
+            color: oklab(62.7955% .22486 .12584 / .75);
+          }"
         `)
       })
 
@@ -730,11 +536,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: oklab(62.7955% .224 .125 / .75);
-          }
-          "
+          ".red {
+            color: oklab(62.7955% .22486 .12584 / .75);
+          }"
         `)
       })
 
@@ -749,17 +553,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: red;
-          }
-
-          @supports (color: color-mix(in lab, red, red)) {
-            .red {
-              color: color-mix(in oklab, red var(--opacity), transparent);
-            }
-          }
-          "
+          ".red {
+            color: color-mix(in oklab, red var(--opacity), transparent);
+          }"
         `)
       })
 
@@ -775,17 +571,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: red;
-          }
-
-          @supports (color: color-mix(in lab, red, red)) {
-            .red {
-              color: color-mix(in oklab, red var(--opacity, 50%), transparent);
-            }
-          }
-          "
+          ".red {
+            color: color-mix(in oklab, red var(--opacity, 50%), transparent);
+          }"
         `)
       })
 
@@ -800,11 +588,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .space-on-the-left {
+          ".space-on-the-left {
             margin-left: 3rem;
-          }
-          "
+          }"
         `)
       })
 
@@ -819,11 +605,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .space-on-the-left {
+          ".space-on-the-left {
             margin-left: .625rem;
-          }
-          "
+          }"
         `)
       })
 
@@ -838,11 +622,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .space-on-the-left {
+          ".space-on-the-left {
             margin-left: calc(100vh - .625rem);
-          }
-          "
+          }"
         `)
       })
 
@@ -857,11 +639,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .radius {
+          ".radius {
             border-radius: .5rem;
-          }
-          "
+          }"
         `)
       })
 
@@ -877,11 +657,9 @@ describe('theme(…)', () => {
               }
             `),
           ).toMatchInlineSnapshot(`
-            "
-            .default-blur {
+            ".default-blur {
               filter: blur(8px);
-            }
-            "
+            }"
           `)
         })
 
@@ -898,12 +676,10 @@ describe('theme(…)', () => {
               }
             `),
           ).toMatchInlineSnapshot(`
-            "
-            .text {
+            ".text {
               font-size: 1337.75rem;
               line-height: 1337rem;
-            }
-            "
+            }"
           `)
         })
 
@@ -912,46 +688,43 @@ describe('theme(…)', () => {
             await compileCss(css`
               @theme default reference {
                 --font-family-sans:
-                  -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Noto Sans,
-                  Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol,
-                  Noto Color Emoji;
+                  ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji,
+                  Segoe UI Symbol, Noto Color Emoji;
               }
               .fam {
                 font-family: theme(fontFamily.sans);
               }
             `),
           ).toMatchInlineSnapshot(`
-            "
-            .fam {
-              font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
-            }
-            "
-          `)
+          ".fam {
+            font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+          }"
+        `)
         })
 
         test('theme(fontFamily.sans) (config)', async () => {
-          expect(
-            await compileCss(
-              css`
-                @config "./my-config.js";
-                .fam {
-                  font-family: theme(fontFamily.sans);
-                }
-              `,
-              { loadModule: async () => ({ path: '', base: '/root', module: {} }) },
-            ),
-          ).toMatchInlineSnapshot(`
-            "
-            .fam {
-              font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Noto Sans, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
-            }
-            "
-          `)
+          let compiled = await compile(
+            css`
+              @config "./my-config.js";
+              .fam {
+                font-family: theme(fontFamily.sans);
+              }
+            `,
+            {
+              loadModule: async () => ({ module: {}, base: '/root' }),
+            },
+          )
+
+          expect(optimizeCss(compiled.build([])).trim()).toMatchInlineSnapshot(`
+          ".fam {
+            font-family: ui-sans-serif, system-ui, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
+          }"
+        `)
         })
       })
 
       test('theme(colors.unknown.500)', async () =>
-        await expect(() =>
+        expect(() =>
           compileCss(css`
             .red {
               color: theme(colors.unknown.500);
@@ -971,11 +744,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -990,11 +761,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: oklab(62.7955% .224 .125 / .25);
-          }
-          "
+          ".red {
+            color: oklab(62.7955% .22486 .12584 / .25);
+          }"
         `)
       })
 
@@ -1006,11 +775,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .fam {
+          ".fam {
             font-family: Helvetica Neue, Helvetica, sans-serif;
-          }
-          "
+          }"
         `)
       })
 
@@ -1028,11 +795,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .fam {
+          ".fam {
             font-family: Helvetica Neue, Helvetica, sans-serif;
-          }
-          "
+          }"
         `)
       })
     })
@@ -1050,11 +815,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -1070,11 +833,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: oklab(62.7955% .224 .125 / .25);
-          }
-          "
+          ".red {
+            color: oklab(62.7955% .22486 .12584 / .25);
+          }"
         `)
       })
     })
@@ -1091,11 +852,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
 
@@ -1110,11 +869,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
-            color: oklab(62.7955% .224 .125 / .5);
-          }
-          "
+          ".red {
+            color: oklab(62.7955% .22486 .12584 / .5);
+          }"
         `)
       })
 
@@ -1129,11 +886,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .red {
+          ".red {
             color: red;
-          }
-          "
+          }"
         `)
       })
     })
@@ -1150,11 +905,9 @@ describe('theme(…)', () => {
             }
           `),
         ).toMatchInlineSnapshot(`
-          "
-          .blur {
+          ".blur {
             filter: blur(8px);
-          }
-          "
+          }"
         `)
       })
     })
@@ -1163,13 +916,13 @@ describe('theme(…)', () => {
       test.each([
         [
           'fontFamily.sans',
-          '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"',
+          'ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"',
         ],
         ['maxWidth.xs', '20rem'],
         ['transitionTimingFunction.in-out', 'cubic-bezier(.4, 0, .2, 1)'],
         ['letterSpacing.wide', '.025em'],
         ['lineHeight.tight', '1.25'],
-        ['backgroundColor.red.500', 'oklch(63.7% .237 25.331)'],
+        ['backgroundColor.red.500', 'oklch(.637 .237 25.331)'],
       ])('theme(%s) → %s', async (value, result) => {
         let defaultTheme = await fs.readFile(path.join(__dirname, '..', 'theme.css'), 'utf8')
         let compiled = await compileCss(css`
@@ -1196,8 +949,7 @@ describe('theme(…)', () => {
   describe('in candidates', () => {
     test('sm:[--color:theme(colors.red[500])]', async () => {
       expect(
-        await run(
-          ['sm:[--color:theme(colors.red[500])]'],
+        await compileCss(
           css`
             @tailwind utilities;
             @theme {
@@ -1205,47 +957,50 @@ describe('theme(…)', () => {
               --color-red-500: #f00;
             }
           `,
+          ['sm:[--color:theme(colors.red[500])]'],
         ),
       ).toMatchInlineSnapshot(`
-        "
-        @media (min-width: 40rem) {
+        "@media (width >= 40rem) {
           .sm\\:\\[--color\\:theme\\(colors\\.red\\[500\\]\\)\\] {
             --color: red;
           }
-        }
-        "
+        }"
       `)
     })
 
     test("values that don't exist don't produce candidates", async () => {
-      let input = css`
-        @tailwind utilities;
-        @theme reference {
-          --radius-sm: 2rem;
-        }
-      `
-
       // This guarantees that valid candidates still make it through when some are invalid
       expect(
-        await run(
+        await compileCss(
+          css`
+            @tailwind utilities;
+            @theme reference {
+              --radius-sm: 2rem;
+            }
+          `,
           [
             'rounded-[theme(--radius-sm)]',
             'rounded-[theme(i.do.not.exist)]',
             'rounded-[theme(--i-do-not-exist)]',
           ],
-          input,
         ),
       ).toMatchInlineSnapshot(`
-        "
-        .rounded-\\[theme\\(--radius-sm\\)\\] {
+        ".rounded-\\[theme\\(--radius-sm\\)\\] {
           border-radius: 2rem;
-        }
-        "
+        }"
       `)
 
       // This guarantees no output for the following candidates
       expect(
-        await run(['rounded-[theme(i.do.not.exist)]', 'rounded-[theme(--i-do-not-exist)]'], input),
+        await compileCss(
+          css`
+            @tailwind utilities;
+            @theme reference {
+              --radius-sm: 2rem;
+            }
+          `,
+          ['rounded-[theme(i.do.not.exist)]', 'rounded-[theme(--i-do-not-exist)]'],
+        ),
       ).toEqual('')
     })
   })
@@ -1266,13 +1021,11 @@ describe('theme(…)', () => {
           }
         `),
       ).toMatchInlineSnapshot(`
-        "
-        @media (min-width: 48rem) and (max-width: 64rem) {
+        "@media (width >= 48rem) and (width <= 64rem) {
           .red {
             color: red;
           }
-        }
-        "
+        }"
       `)
     })
 
@@ -1290,13 +1043,11 @@ describe('theme(…)', () => {
           }
         `),
       ).toMatchInlineSnapshot(`
-        "
-        @media (min-width: 48rem) and (not (min-width: 64rem)) {
+        "@media (width >= 48rem) and (width < 64rem) {
           .red {
             color: red;
           }
-        }
-        "
+        }"
       `)
     })
   })
@@ -1315,13 +1066,11 @@ describe('theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 48rem) {
+      "@media (width >= 48rem) {
         .red {
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -1338,13 +1087,11 @@ describe('theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      @container not (max-width: 48rem) {
+      "@container (width > 48rem) {
         .red {
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -1361,47 +1108,106 @@ describe('theme(…)', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      @supports (text-stroke: 0.75rem) {
+      "@supports (text-stroke: 0.75rem) {
         .red {
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('in plugins', () => {
   test('CSS theme functions in plugins are properly evaluated', async () => {
-    expect(
-      await run(
-        ['my-utility'],
-        css`
-          @layer base, utilities;
-          @plugin "my-plugin";
-          @theme reference {
-            --color-red: oklch(62% 0.25 30);
-            --color-orange: oklch(79% 0.17 70);
-            --color-blue: oklch(45% 0.31 264);
-            --color-pink: oklch(87% 0.07 7);
+    let compiled = await compile(
+      css`
+        @layer base, utilities;
+        @plugin "my-plugin";
+        @theme reference {
+          --color-red: oklch(62% 0.25 30);
+          --color-orange: oklch(79% 0.17 70);
+          --color-blue: oklch(45% 0.31 264);
+          --color-pink: oklch(87% 0.07 7);
+        }
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        async loadModule() {
+          return {
+            module: plugin(({ addBase, addUtilities }) => {
+              addBase({
+                '.my-base-rule': {
+                  color: 'theme(colors.red)',
+                  'outline-color': 'theme(colors.orange / 15%)',
+                  'background-color': 'theme(--color-blue)',
+                  'border-color': 'theme(--color-pink / 10%)',
+                },
+              })
+
+              addUtilities({
+                '.my-utility': {
+                  color: 'theme(colors.red)',
+                },
+              })
+            }),
+            base: '/root',
           }
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          async loadModule() {
-            return {
-              path: '',
-              base: '/root',
-              module: plugin(({ addBase, addUtilities }) => {
+        },
+      },
+    )
+
+    expect(optimizeCss(compiled.build(['my-utility'])).trim()).toMatchInlineSnapshot(`
+      "@layer base {
+        .my-base-rule {
+          color: oklch(62% .25 30);
+          background-color: oklch(45% .31 264);
+          border-color: oklab(87% .06947 .00853 / .1);
+          outline-color: oklab(79% .05814 .15974 / .15);
+        }
+      }
+
+      @layer utilities {
+        .my-utility {
+          color: oklch(62% .25 30);
+        }
+      }"
+    `)
+  })
+})
+
+describe('in JS config files', () => {
+  test('CSS theme functions in config files are properly evaluated', async () => {
+    let compiled = await compile(
+      css`
+        @layer base, utilities;
+        @config "./my-config.js";
+        @theme reference {
+          --color-red: red;
+          --color-orange: orange;
+        }
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: {
+            theme: {
+              extend: {
+                colors: {
+                  primary: 'theme(colors.red)',
+                  secondary: 'theme(--color-orange)',
+                },
+              },
+            },
+            plugins: [
+              plugin(({ addBase, addUtilities }) => {
                 addBase({
                   '.my-base-rule': {
-                    color: 'theme(colors.red)',
-                    'outline-color': 'theme(colors.orange / 15%)',
-                    'background-color': 'theme(--color-blue)',
-                    'border-color': 'theme(--color-pink / 10%)',
+                    background: 'theme(colors.primary)',
+                    color: 'theme(colors.secondary)',
                   },
                 })
 
@@ -1411,83 +1217,15 @@ describe('in plugins', () => {
                   },
                 })
               }),
-            }
+            ],
           },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
-        .my-base-rule {
-          color: oklch(62% .25 30);
-          background-color: oklch(45% .31 264);
-          border-color: oklab(87% .069 .008 / .1);
-          outline-color: oklab(79% .058 .159 / .15);
-        }
-      }
+          base: '/root',
+        }),
+      },
+    )
 
-      @layer utilities {
-        .my-utility {
-          color: oklch(62% .25 30);
-        }
-      }
-      "
-    `)
-  })
-})
-
-describe('in JS config files', () => {
-  test('CSS theme functions in config files are properly evaluated', async () => {
-    expect(
-      await run(
-        ['my-utility'],
-        css`
-          @layer base, utilities;
-          @config "./my-config.js";
-          @theme reference {
-            --color-red: red;
-            --color-orange: orange;
-          }
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: {
-              theme: {
-                extend: {
-                  colors: {
-                    primary: 'theme(colors.red)',
-                    secondary: 'theme(--color-orange)',
-                  },
-                },
-              },
-              plugins: [
-                plugin(({ addBase, addUtilities }) => {
-                  addBase({
-                    '.my-base-rule': {
-                      background: 'theme(colors.primary)',
-                      color: 'theme(colors.secondary)',
-                    },
-                  })
-
-                  addUtilities({
-                    '.my-utility': {
-                      color: 'theme(colors.red)',
-                    },
-                  })
-                }),
-              ],
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer base {
+    expect(optimizeCss(compiled.build(['my-utility'])).trim()).toMatchInlineSnapshot(`
+      "@layer base {
         .my-base-rule {
           color: orange;
           background: red;
@@ -1498,8 +1236,7 @@ describe('in JS config files', () => {
         .my-utility {
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 })
@@ -1513,10 +1250,10 @@ test('replaces CSS theme() function with values inside imported stylesheets', as
         }
         @import './bar.css';
       `,
+      [],
       {
         async loadStylesheet() {
           return {
-            path: '',
             base: '/bar.css',
             content: css`
               .red {
@@ -1528,46 +1265,46 @@ test('replaces CSS theme() function with values inside imported stylesheets', as
       },
     ),
   ).toMatchInlineSnapshot(`
-    "
-    .red {
+    ".red {
       color: red;
-    }
-    "
+    }"
   `)
 })
 
 test('resolves paths ending with a 1', async () => {
   expect(
-    await compileCss(css`
-      @theme {
-        --spacing-1: 0.25rem;
-      }
+    await compileCss(
+      css`
+        @theme {
+          --spacing-1: 0.25rem;
+        }
 
-      .foo {
-        margin: theme(spacing.1);
-      }
-    `),
+        .foo {
+          margin: theme(spacing.1);
+        }
+      `,
+      [],
+    ),
   ).toMatchInlineSnapshot(`
-    "
-    .foo {
+    ".foo {
       margin: .25rem;
-    }
-    "
+    }"
   `)
 })
 
-test('upgrades to a full JS compat theme lookup if a value cannot be mapped to a CSS variable', async () => {
+test('upgrades to a full JS compat theme lookup if a value can not be mapped to a CSS variable', async () => {
   expect(
-    await compileCss(css`
-      .semi {
-        font-weight: theme(fontWeight.semibold);
-      }
-    `),
+    await compileCss(
+      css`
+        .semi {
+          font-weight: theme(fontWeight.semibold);
+        }
+      `,
+      [],
+    ),
   ).toMatchInlineSnapshot(`
-    "
-    .semi {
+    ".semi {
       font-weight: 600;
-    }
-    "
+    }"
   `)
 })
diff --git a/packages/tailwindcss/src/css-functions.ts b/packages/tailwindcss/src/css-functions.ts
index 32fba455f..618835fec 100644
--- a/packages/tailwindcss/src/css-functions.ts
+++ b/packages/tailwindcss/src/css-functions.ts
@@ -1,11 +1,9 @@
 import { Features } from '.'
-import { type AstNode } from './ast'
+import { walk, type AstNode } from './ast'
 import type { DesignSystem } from './design-system'
 import { withAlpha } from './utilities'
-import { dimensions } from './utils/dimensions'
 import { segment } from './utils/segment'
 import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
 
 const CSS_FUNCTIONS: Record<
   string,
@@ -63,24 +61,6 @@ function spacing(
     )
   }
 
-  // Optimization:
-  //
-  // - We know that at this point the `--spacing` value must be set.
-  // - We know that `--spacing` must be set to a `<length>` unit, such as `0.25rem`
-  // - We can assume that the `--spacing` value is not set to a `0`-like value.
-  //   Otherwise `p-<anything>` would calculate as `0` which wouldn't make sense.
-  //
-  // - That means that a value of `0` can be replaced by `0px`. It's important
-  //   to keep the unit so the value stays a `<length>`, e.g. when assigned to
-  //   a custom property and later used inside `calc(…)`.
-  // - That means that a value of `1` can be replaced by `multiplier`
-  let valueDimension = dimensions.get(value)
-  if (valueDimension) {
-    if (valueDimension[0] === 0) return '0px'
-    if (valueDimension[0] === 1) return multiplier
-  }
-
-  // No known optimizations available, use full calculation
   return `calc(${multiplier} * ${value})`
 }
 
@@ -124,7 +104,7 @@ function theme(
   let joinedFallback = fallback.join(', ')
   if (joinedFallback === 'initial') return resolvedValue
 
-  // When the resolved value returns `initial`, resolve with the fallback value
+  // When the resolved value returns `initial`, resolve with the the fallback value
   if (resolvedValue === 'initial') return joinedFallback
 
   // Inject the fallback of a `--theme(…)` function into the fallback of a referenced `--theme(…)`
@@ -207,7 +187,7 @@ export function substituteFunctionsInValue(
   designSystem: DesignSystem,
 ): string {
   let ast = ValueParser.parse(value)
-  walk(ast, (node) => {
+  ValueParser.walk(ast, (node, { replaceWith }) => {
     if (node.kind === 'function' && node.value in CSS_FUNCTIONS) {
       let args = segment(ValueParser.toCss(node.nodes).trim(), ',').map((x) => x.trim())
       let result = CSS_FUNCTIONS[node.value as keyof typeof CSS_FUNCTIONS](
@@ -215,7 +195,7 @@ export function substituteFunctionsInValue(
         source,
         ...args,
       )
-      return WalkAction.Replace(ValueParser.parse(result))
+      return replaceWith(ValueParser.parse(result))
     }
   })
 
@@ -243,7 +223,7 @@ function eventuallyUnquote(value: string) {
 }
 
 function injectFallbackForInitialFallback(ast: ValueParser.ValueAstNode[], fallback: string): void {
-  walk(ast, (node) => {
+  ValueParser.walk(ast, (node) => {
     if (node.kind !== 'function') return
     if (node.value !== 'var' && node.value !== 'theme' && node.value !== '--theme') return
 
diff --git a/packages/tailwindcss/src/css-parser.bench.ts b/packages/tailwindcss/src/css-parser.bench.ts
index d48f88ab3..ab490e103 100644
--- a/packages/tailwindcss/src/css-parser.bench.ts
+++ b/packages/tailwindcss/src/css-parser.bench.ts
@@ -10,7 +10,3 @@ const cssFile = readFileSync(currentFolder + './preflight.css', 'utf-8')
 bench('css-parser on preflight.css', () => {
   CSS.parse(cssFile)
 })
-
-bench('CSS with sourcemaps', () => {
-  CSS.parse(cssFile, { from: 'input.css' })
-})
diff --git a/packages/tailwindcss/src/css-parser.test.ts b/packages/tailwindcss/src/css-parser.test.ts
index 0dcbc0a41..379b4b942 100644
--- a/packages/tailwindcss/src/css-parser.test.ts
+++ b/packages/tailwindcss/src/css-parser.test.ts
@@ -8,12 +8,6 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
     return CSS.parse(string.replaceAll(/\r?\n/g, lineEndings === 'Windows' ? '\r\n' : '\n'))
   }
 
-  function parseWithLoc(string: string) {
-    return CSS.parse(string.replaceAll(/\r?\n/g, lineEndings === 'Windows' ? '\r\n' : '\n'), {
-      from: 'input.css',
-    })
-  }
-
   describe('comments', () => {
     it('should parse a comment and ignore it', () => {
       expect(
@@ -31,23 +25,6 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
       ).toEqual([])
     })
 
-    it('should end a comment at `*/` even when it is preceded by a `\\`', () => {
-      expect(
-        parse(css`
-          /* C:\temp\*/
-          .foo {
-            color: red;
-          }
-        `),
-      ).toEqual([
-        {
-          kind: 'rule',
-          selector: '.foo',
-          nodes: [{ kind: 'declaration', property: 'color', value: 'red', important: false }],
-        },
-      ])
-    })
-
     it('should parse a comment inside of a selector and ignore it', () => {
       expect(
         parse(css`
@@ -109,7 +86,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
           kind: 'comment',
           value: `!
             * License #2
-            `.replaceAll(/\r?\n/g, lineEndings === 'Windows' ? '\r\n' : '\n'),
+            `,
         },
       ])
     })
@@ -220,7 +197,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
       ])
     })
 
-    it('should parse declarations with strings and escaped string endings', () => {
+    it('should parse declarations with with strings and escaped string endings', () => {
       expect(
         parse(css`
           content: 'These are not the end "\' of the string';
@@ -229,7 +206,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
         {
           kind: 'declaration',
           property: 'content',
-          value: `'These are not the end "\\' of the string'`,
+          value: `'These are not the end \"\\' of the string'`,
           important: false,
         },
       ])
@@ -391,7 +368,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
               background-color: red;
               /* A comment */
               content: 'Hello, world!';
-            }`.replaceAll(/\r?\n/g, lineEndings === 'Windows' ? '\r\n' : '\n'),
+            }`,
             important: false,
           },
         ])
@@ -419,7 +396,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
               background-color: red;
               /* A comment ; */
               content: 'Hello, world!';
-            }`.replaceAll(/\r?\n/g, lineEndings === 'Windows' ? '\r\n' : '\n'),
+            }`,
             important: false,
           },
           {
@@ -429,7 +406,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
               background-color: red;
               /* A comment } */
               content: 'Hello, world!';
-            }`.replaceAll(/\r?\n/g, lineEndings === 'Windows' ? '\r\n' : '\n'),
+            }`,
             important: false,
           },
         ])
@@ -465,28 +442,6 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
         ])
       })
 
-      it('should end a comment in a custom property at `*/` even when it is preceded by a `\\`', () => {
-        expect(
-          parse(css`
-            --foo: /* C:\temp\*/ bar;
-            --bar: /* baz */ qux;
-          `),
-        ).toEqual([
-          {
-            kind: 'declaration',
-            property: '--foo',
-            value: '/* C:\\temp\\*/ bar',
-            important: false,
-          },
-          {
-            kind: 'declaration',
-            property: '--bar',
-            value: '/* baz */ qux',
-            important: false,
-          },
-        ])
-      })
-
       it('should parse empty custom properties', () => {
         expect(
           parse(css`
@@ -502,21 +457,6 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
           `),
         ).toEqual([{ kind: 'declaration', property: '--foo', value: 'bar', important: true }])
       })
-
-      it('should parse custom properties with data URL value', () => {
-        expect(
-          parse(css`
-            --foo: 'data:text/plain;base64,SGVsbG8sIFdvcmxkIQ==';
-          `),
-        ).toEqual([
-          {
-            kind: 'declaration',
-            property: '--foo',
-            value: "'data:text/plain;base64,SGVsbG8sIFdvcmxkIQ=='",
-            important: false,
-          },
-        ])
-      })
     })
 
     it('should parse multiple declarations', () => {
@@ -768,26 +708,6 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
       ).toEqual([{ kind: 'at-rule', name: '@charset', params: '"UTF-8"', nodes: [] }])
     })
 
-    it.each([
-      [' '], // space
-      ['  '], // multiple spaces
-      ['\t'], // tab
-      [' \t'], // space + tab
-      ['\t '], // tab + space
-      ['\t\t'], // multiple tabs
-      ['\n'], // newline
-      [' \n'], // space + newline
-      ['\n '], // newline + space
-      ['\n\n'], // multiple newlines
-      ['\r\n'], // windows newline
-      [' \r\n'], // space + windows newline
-      ['\r\n '], // windows newline + space
-    ])('should parse an at-rule with whitespace %s in the params', (whitespace) => {
-      expect(parse(`@apply${whitespace}bg-red-500;`)).toEqual([
-        { kind: 'at-rule', name: '@apply', params: 'bg-red-500', nodes: [] },
-      ])
-    })
-
     it('should parse an at-rule without a block or semicolon', () => {
       expect(
         parse(`
@@ -1143,38 +1063,6 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
         },
       ])
     })
-
-    it('should ignore consecutive semicolons', () => {
-      expect(parse(';;;')).toEqual([])
-    })
-
-    it('should ignore semicolons after an at-rule with a body', () => {
-      expect(parse('@plugin "foo" {} ;')).toEqual([
-        {
-          kind: 'at-rule',
-          name: '@plugin',
-          params: '"foo"',
-          nodes: [],
-        },
-      ])
-    })
-
-    it('should ignore consecutive semicolons a declaration', () => {
-      expect(parse('.foo { color: red;;; }')).toEqual([
-        {
-          kind: 'rule',
-          selector: '.foo',
-          nodes: [
-            {
-              kind: 'declaration',
-              property: 'color',
-              value: 'red',
-              important: false,
-            },
-          ],
-        },
-      ])
-    })
   })
 
   describe('errors', () => {
@@ -1190,20 +1078,7 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
             color: blue;
           }
         `),
-      ).toThrowErrorMatchingInlineSnapshot(`[CssSyntaxError: Missing opening {]`)
-
-      expect(() =>
-        parseWithLoc(`
-          .foo {
-            color: red;
-          }
-
-          .bar
-            /* ^ Missing opening { */
-            color: blue;
-          }
-        `),
-      ).toThrowErrorMatchingInlineSnapshot(`[CssSyntaxError: input.css:9:11: Missing opening {]`)
+      ).toThrowErrorMatchingInlineSnapshot(`[Error: Missing opening {]`)
     })
 
     it('should error when curly brackets are unbalanced (closing)', () => {
@@ -1218,105 +1093,64 @@ describe.each(['Unix', 'Windows'])('Line endings: %s', (lineEndings) => {
 
        /* ^ Missing closing } */
         `),
-      ).toThrowErrorMatchingInlineSnapshot(`[CssSyntaxError: Missing closing } at .bar]`)
-
-      expect(() =>
-        parseWithLoc(`
-          .foo {
-            color: red;
-          }
-
-          .bar {
-            color: blue;
-
-       /* ^ Missing closing } */
-        `),
-      ).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:6:11: Missing closing } at .bar]`,
-      )
+      ).toThrowErrorMatchingInlineSnapshot(`[Error: Missing closing } at .bar]`)
     })
 
     it('should error when an unterminated string is used', () => {
-      let input = css`
-        .foo {
-          content: "Hello world!
-          /*                    ^ missing " */
-          font-weight: bold;
-        }
-      `
-
-      expect(() => parse(input)).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: Unterminated string: "Hello world!"]`,
-      )
-
-      expect(() => parseWithLoc(input)).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:3:20: Unterminated string: "Hello world!"]`,
-      )
+      expect(() =>
+        parse(css`
+          .foo {
+            content: "Hello world!
+            /*                    ^ missing " */
+            font-weight: bold;
+          }
+        `),
+      ).toThrowErrorMatchingInlineSnapshot(`[Error: Unterminated string: "Hello world!"]`)
     })
 
     it('should error when an unterminated string is used with a `;`', () => {
-      let input = css`
-        .foo {
-          content: "Hello world!;
-          /*                    ^ missing " */
-          font-weight: bold;
-        }
-      `
-
-      expect(() => parse(input)).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: Unterminated string: "Hello world!;"]`,
-      )
-
-      expect(() => parseWithLoc(input)).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:3:20: Unterminated string: "Hello world!;"]`,
-      )
+      expect(() =>
+        parse(css`
+          .foo {
+            content: "Hello world!;
+            /*                    ^ missing " */
+            font-weight: bold;
+          }
+        `),
+      ).toThrowErrorMatchingInlineSnapshot(`[Error: Unterminated string: "Hello world!;"]`)
     })
 
     it('should error when incomplete custom properties are used', () => {
       expect(() => parse('--foo')).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: Invalid custom property, expected a value]`,
-      )
-
-      expect(() => parseWithLoc('--foo')).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:1:1: Invalid custom property, expected a value]`,
+        `[Error: Invalid custom property, expected a value]`,
       )
     })
 
     it('should error when incomplete custom properties are used inside rules', () => {
       expect(() => parse('.foo { --bar }')).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: Invalid custom property, expected a value]`,
-      )
-
-      expect(() => parseWithLoc('.foo { --bar }')).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:1:8: Invalid custom property, expected a value]`,
-      )
-    })
-
-    it('should error when an unterminated string is used in a custom property', () => {
-      // prettier-ignore
-      let input = css`
-        .foo {
-          --bar: 'Hello world!
-          /*                  ^ missing ' * /;
-        }
-      `
-
-      expect(() => parse(input)).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: Unterminated string: 'Hello world!']`,
-      )
-
-      expect(() => parseWithLoc(input)).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:3:18: Unterminated string: 'Hello world!']`,
+        `[Error: Invalid custom property, expected a value]`,
       )
     })
 
     it('should error when a declaration is incomplete', () => {
       expect(() => parse('.foo { bar }')).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: Invalid declaration: \`bar\`]`,
+        `[Error: Invalid declaration: \`bar\`]`,
       )
+    })
 
-      expect(() => parseWithLoc('.foo { bar }')).toThrowErrorMatchingInlineSnapshot(
-        `[CssSyntaxError: input.css:1:8: Invalid declaration: \`bar\`]`,
+    it('should error when a semicolon exists after an at-rule with a body', () => {
+      expect(() => parse('@plugin "foo" {} ;')).toThrowErrorMatchingInlineSnapshot(
+        `[Error: Unexpected semicolon]`,
+      )
+    })
+
+    it('should error when consecutive semicolons exist', () => {
+      expect(() => parse(';;;')).toThrowErrorMatchingInlineSnapshot(`[Error: Unexpected semicolon]`)
+    })
+
+    it('should error when consecutive semicolons exist after a declaration', () => {
+      expect(() => parse('.foo { color: red;;; }')).toThrowErrorMatchingInlineSnapshot(
+        `[Error: Unexpected semicolon]`,
       )
     })
   })
diff --git a/packages/tailwindcss/src/css-parser.ts b/packages/tailwindcss/src/css-parser.ts
index 0896881e6..df10fa850 100644
--- a/packages/tailwindcss/src/css-parser.ts
+++ b/packages/tailwindcss/src/css-parser.ts
@@ -9,8 +9,6 @@ import {
   type Declaration,
   type Rule,
 } from './ast'
-import { createLineTable } from './source-maps/line-table'
-import type { Source, SourceLocation } from './source-maps/source'
 
 const BACKSLASH = 0x5c
 const SLASH = 0x2f
@@ -20,7 +18,6 @@ const SINGLE_QUOTE = 0x27
 const COLON = 0x3a
 const SEMICOLON = 0x3b
 const LINE_BREAK = 0x0a
-const CARRIAGE_RETURN = 0xd
 const SPACE = 0x20
 const TAB = 0x09
 const OPEN_CURLY = 0x7b
@@ -33,41 +30,9 @@ const DASH = 0x2d
 const AT_SIGN = 0x40
 const EXCLAMATION_MARK = 0x21
 
-export interface ParseOptions {
-  from?: string
-}
-
-/**
- * CSS syntax error with source location information.
- */
-export class CssSyntaxError extends Error {
-  loc: SourceLocation | null
-
-  constructor(message: string, loc: SourceLocation | null) {
-    if (loc) {
-      let source = loc[0]
-      let start = createLineTable(source.code).find(loc[1])
-      message = `${source.file}:${start.line}:${start.column + 1}: ${message}`
-    }
-
-    super(message)
-
-    this.name = 'CssSyntaxError'
-    this.loc = loc
-
-    if (Error.captureStackTrace) {
-      Error.captureStackTrace(this, CssSyntaxError)
-    }
-  }
-}
-
-export function parse(input: string, opts?: ParseOptions) {
-  let source: Source | null = opts?.from ? { file: opts.from, code: input } : null
-
-  // Note: it is important that any transformations of the input string
-  // *before* processing do NOT change the length of the string. This
-  // would invalidate the mechanism used to track source locations.
-  if (input[0] === '\uFEFF') input = ' ' + input.slice(1)
+export function parse(input: string) {
+  if (input[0] === '\uFEFF') input = input.slice(1)
+  input = input.replaceAll('\r\n', '\n')
 
   let ast: AstNode[] = []
   let licenseComments: Comment[] = []
@@ -80,22 +45,11 @@ export function parse(input: string, opts?: ParseOptions) {
   let buffer = ''
   let closingBracketStack = ''
 
-  // The start of the first non-whitespace character in the buffer
-  let bufferStart = 0
-
   let peekChar
 
   for (let i = 0; i < input.length; i++) {
     let currentChar = input.charCodeAt(i)
 
-    // Skip over the CR in CRLF. This allows code below to only check for a line
-    // break even if we're looking at a Windows newline. Peeking the input still
-    // has to check for CRLF but that happens less often.
-    if (currentChar === CARRIAGE_RETURN) {
-      peekChar = input.charCodeAt(i + 1)
-      if (peekChar === LINE_BREAK) continue
-    }
-
     // Current character is a `\` therefore the next character is escaped,
     // consume it together with the next character and continue.
     //
@@ -107,7 +61,6 @@ export function parse(input: string, opts?: ParseOptions) {
     // ```
     //
     if (currentChar === BACKSLASH) {
-      if (buffer === '') bufferStart = i
       buffer += input.slice(i, i + 2)
       i += 1
     }
@@ -128,24 +81,19 @@ export function parse(input: string, opts?: ParseOptions) {
     //         ^^^^^^^^^^^^^
     // }
     // ```
-    //
-    // The escape character `\` in comments are ignored, this means that a
-    // the end of a comment preceded by `\` does _not_ mean that the end of the
-    // comment is escaped and therefore we have to keep parsing.
-    //
-    // This is a valid comment:
-    // ```
-    // /*C:\*/
-    // ```
-    // See: https://www.w3.org/TR/css-syntax-3/#consume-comment
     else if (currentChar === SLASH && input.charCodeAt(i + 1) === ASTERISK) {
       let start = i
 
       for (let j = i + 2; j < input.length; j++) {
         peekChar = input.charCodeAt(j)
 
-        // End of the comment.
-        if (peekChar === ASTERISK && input.charCodeAt(j + 1) === SLASH) {
+        // Current character is a `\` therefore the next character is escaped.
+        if (peekChar === BACKSLASH) {
+          j += 1
+        }
+
+        // End of the comment
+        else if (peekChar === ASTERISK && input.charCodeAt(j + 1) === SLASH) {
           i = j + 1
           break
         }
@@ -156,23 +104,73 @@ export function parse(input: string, opts?: ParseOptions) {
       // Collect all license comments so that we can hoist them to the top of
       // the AST.
       if (commentString.charCodeAt(2) === EXCLAMATION_MARK) {
-        let node = comment(commentString.slice(2, -2))
-        licenseComments.push(node)
-
-        if (source) {
-          node.src = [source, start, i + 1]
-          node.dst = [source, start, i + 1]
-        }
+        licenseComments.push(comment(commentString.slice(2, -2)))
       }
     }
 
     // Start of a string.
     else if (currentChar === SINGLE_QUOTE || currentChar === DOUBLE_QUOTE) {
-      let end = parseString(input, i, currentChar, source)
+      let start = i
+
+      // We need to ensure that the closing quote is the same as the opening
+      // quote.
+      //
+      // E.g.:
+      //
+      // ```css
+      // .foo {
+      //   content: "This is a string with a 'quote' in it";
+      //                                     ^     ^         -> These are not the end of the string.
+      // }
+      // ```
+      for (let j = i + 1; j < input.length; j++) {
+        peekChar = input.charCodeAt(j)
+        // Current character is a `\` therefore the next character is escaped.
+        if (peekChar === BACKSLASH) {
+          j += 1
+        }
+
+        // End of the string.
+        else if (peekChar === currentChar) {
+          i = j
+          break
+        }
+
+        // End of the line without ending the string but with a `;` at the end.
+        //
+        // E.g.:
+        //
+        // ```css
+        // .foo {
+        //   content: "This is a string with a;
+        //                                    ^ Missing "
+        // }
+        // ```
+        else if (peekChar === SEMICOLON && input.charCodeAt(j + 1) === LINE_BREAK) {
+          throw new Error(
+            `Unterminated string: ${input.slice(start, j + 1) + String.fromCharCode(currentChar)}`,
+          )
+        }
+
+        // End of the line without ending the string.
+        //
+        // E.g.:
+        //
+        // ```css
+        // .foo {
+        //   content: "This is a string with a
+        //                                    ^ Missing "
+        // }
+        // ```
+        else if (peekChar === LINE_BREAK) {
+          throw new Error(
+            `Unterminated string: ${input.slice(start, j) + String.fromCharCode(currentChar)}`,
+          )
+        }
+      }
 
       // Adjust `buffer` to include the string.
-      buffer += input.slice(i, end + 1)
-      i = end
+      buffer += input.slice(start, i + 1)
     }
 
     // Skip whitespace if the next character is also whitespace. This allows us
@@ -180,12 +178,7 @@ export function parse(input: string, opts?: ParseOptions) {
     else if (
       (currentChar === SPACE || currentChar === LINE_BREAK || currentChar === TAB) &&
       (peekChar = input.charCodeAt(i + 1)) &&
-      (peekChar === SPACE ||
-        peekChar === LINE_BREAK ||
-        peekChar === TAB ||
-        (peekChar === CARRIAGE_RETURN &&
-          (peekChar = input.charCodeAt(i + 2)) &&
-          peekChar == LINE_BREAK))
+      (peekChar === SPACE || peekChar === LINE_BREAK || peekChar === TAB)
     ) {
       continue
     }
@@ -220,18 +213,17 @@ export function parse(input: string, opts?: ParseOptions) {
           j += 1
         }
 
-        // Start of a string.
-        else if (peekChar === SINGLE_QUOTE || peekChar === DOUBLE_QUOTE) {
-          j = parseString(input, j, peekChar, source)
-        }
-
         // Start of a comment.
         else if (peekChar === SLASH && input.charCodeAt(j + 1) === ASTERISK) {
           for (let k = j + 2; k < input.length; k++) {
             peekChar = input.charCodeAt(k)
+            // Current character is a `\` therefore the next character is escaped.
+            if (peekChar === BACKSLASH) {
+              k += 1
+            }
 
-            // End of the comment.
-            if (peekChar === ASTERISK && input.charCodeAt(k + 1) === SLASH) {
+            // End of the comment
+            else if (peekChar === ASTERISK && input.charCodeAt(k + 1) === SLASH) {
               j = k + 1
               break
             }
@@ -295,17 +287,7 @@ export function parse(input: string, opts?: ParseOptions) {
       }
 
       let declaration = parseDeclaration(buffer, colonIdx)
-      if (!declaration) {
-        throw new CssSyntaxError(
-          `Invalid custom property, expected a value`,
-          source ? [source, start, i] : null,
-        )
-      }
-
-      if (source) {
-        declaration.src = [source, start, i]
-        declaration.dst = [source, start, i]
-      }
+      if (!declaration) throw new Error(`Invalid custom property, expected a value`)
 
       if (parent) {
         parent.nodes.push(declaration)
@@ -327,11 +309,6 @@ export function parse(input: string, opts?: ParseOptions) {
     else if (currentChar === SEMICOLON && buffer.charCodeAt(0) === AT_SIGN) {
       node = parseAtRule(buffer)
 
-      if (source) {
-        node.src = [source, bufferStart, i]
-        node.dst = [source, bufferStart, i]
-      }
-
       // At-rule is nested inside of a rule, attach it to the parent.
       if (parent) {
         parent.nodes.push(node)
@@ -364,16 +341,8 @@ export function parse(input: string, opts?: ParseOptions) {
     ) {
       let declaration = parseDeclaration(buffer)
       if (!declaration) {
-        if (buffer.length === 0) continue
-        throw new CssSyntaxError(
-          `Invalid declaration: \`${buffer.trim()}\``,
-          source ? [source, bufferStart, i] : null,
-        )
-      }
-
-      if (source) {
-        declaration.src = [source, bufferStart, i]
-        declaration.dst = [source, bufferStart, i]
+        if (buffer.length === 0) throw new Error('Unexpected semicolon')
+        throw new Error(`Invalid declaration: \`${buffer.trim()}\``)
       }
 
       if (parent) {
@@ -395,12 +364,6 @@ export function parse(input: string, opts?: ParseOptions) {
       // At this point `buffer` should resemble a selector or an at-rule.
       node = rule(buffer.trim())
 
-      // Track the source location for source maps
-      if (source) {
-        node.src = [source, bufferStart, i]
-        node.dst = [source, bufferStart, i]
-      }
-
       // Attach the rule to the parent in case it's nested.
       if (parent) {
         parent.nodes.push(node)
@@ -425,7 +388,7 @@ export function parse(input: string, opts?: ParseOptions) {
       closingBracketStack[closingBracketStack.length - 1] !== ')'
     ) {
       if (closingBracketStack === '') {
-        throw new CssSyntaxError('Missing opening {', source ? [source, i, i] : null)
+        throw new Error('Missing opening {')
       }
 
       closingBracketStack = closingBracketStack.slice(0, -1)
@@ -447,12 +410,6 @@ export function parse(input: string, opts?: ParseOptions) {
         if (buffer.charCodeAt(0) === AT_SIGN) {
           node = parseAtRule(buffer)
 
-          // Track the source location for source maps
-          if (source) {
-            node.src = [source, bufferStart, i]
-            node.dst = [source, bufferStart, i]
-          }
-
           // At-rule is nested inside of a rule, attach it to the parent.
           if (parent) {
             parent.nodes.push(node)
@@ -487,17 +444,7 @@ export function parse(input: string, opts?: ParseOptions) {
           // Attach the declaration to the parent.
           if (parent) {
             let node = parseDeclaration(buffer, colonIdx)
-            if (!node) {
-              throw new CssSyntaxError(
-                `Invalid declaration: \`${buffer.trim()}\``,
-                source ? [source, bufferStart, i] : null,
-              )
-            }
-
-            if (source) {
-              node.src = [source, bufferStart, i]
-              node.dst = [source, bufferStart, i]
-            }
+            if (!node) throw new Error(`Invalid declaration: \`${buffer.trim()}\``)
 
             parent.nodes.push(node)
           }
@@ -531,7 +478,7 @@ export function parse(input: string, opts?: ParseOptions) {
     // `)`
     else if (currentChar === CLOSE_PAREN) {
       if (closingBracketStack[closingBracketStack.length - 1] !== ')') {
-        throw new CssSyntaxError('Missing opening (', source ? [source, i, i] : null)
+        throw new Error('Missing opening (')
       }
 
       closingBracketStack = closingBracketStack.slice(0, -1)
@@ -548,8 +495,6 @@ export function parse(input: string, opts?: ParseOptions) {
         continue
       }
 
-      if (buffer === '') bufferStart = i
-
       buffer += String.fromCharCode(currentChar)
     }
   }
@@ -558,32 +503,17 @@ export function parse(input: string, opts?: ParseOptions) {
   // means that we have an at-rule that is not terminated with a semicolon at
   // the end of the input.
   if (buffer.charCodeAt(0) === AT_SIGN) {
-    let node = parseAtRule(buffer)
-
-    // Track the source location for source maps
-    if (source) {
-      node.src = [source, bufferStart, input.length]
-      node.dst = [source, bufferStart, input.length]
-    }
-
-    ast.push(node)
+    ast.push(parseAtRule(buffer))
   }
 
   // When we are done parsing then everything should be balanced. If we still
   // have a leftover `parent`, then it means that we have an unterminated block.
   if (closingBracketStack.length > 0 && parent) {
     if (parent.kind === 'rule') {
-      throw new CssSyntaxError(
-        `Missing closing } at ${parent.selector}`,
-        parent.src ? [parent.src[0], parent.src[1], parent.src[1]] : null,
-      )
+      throw new Error(`Missing closing } at ${parent.selector}`)
     }
-
     if (parent.kind === 'at-rule') {
-      throw new CssSyntaxError(
-        `Missing closing } at ${parent.name} ${parent.params}`,
-        parent.src ? [parent.src[0], parent.src[1], parent.src[1]] : null,
-      )
+      throw new Error(`Missing closing } at ${parent.name} ${parent.params}`)
     }
   }
 
@@ -595,9 +525,6 @@ export function parse(input: string, opts?: ParseOptions) {
 }
 
 export function parseAtRule(buffer: string, nodes: AstNode[] = []): AtRule {
-  let name = buffer
-  let params = ''
-
   // Assumption: The smallest at-rule in CSS right now is `@page`, this means
   //             that we can always skip the first 5 characters and start at the
   //             sixth (at index 5).
@@ -617,14 +544,14 @@ export function parseAtRule(buffer: string, nodes: AstNode[] = []): AtRule {
   // behavior if necessary.
   for (let i = 5 /* '@page'.length */; i < buffer.length; i++) {
     let currentChar = buffer.charCodeAt(i)
-    if (currentChar === SPACE || currentChar === TAB || currentChar === OPEN_PAREN) {
-      name = buffer.slice(0, i)
-      params = buffer.slice(i)
-      break
+    if (currentChar === SPACE || currentChar === OPEN_PAREN) {
+      let name = buffer.slice(0, i).trim()
+      let params = buffer.slice(i).trim()
+      return atRule(name, params, nodes)
     }
   }
 
-  return atRule(name.trim(), params.trim(), nodes)
+  return atRule(buffer.trim(), '', nodes)
 }
 
 function parseDeclaration(
@@ -639,80 +566,3 @@ function parseDeclaration(
     importantIdx !== -1,
   )
 }
-
-function parseString(
-  input: string,
-  startIdx: number,
-  quoteChar: number,
-  source: Source | null = null,
-): number {
-  let peekChar: number
-
-  // We need to ensure that the closing quote is the same as the opening
-  // quote.
-  //
-  // E.g.:
-  //
-  // ```css
-  // .foo {
-  //   content: "This is a string with a 'quote' in it";
-  //                                     ^     ^         -> These are not the end of the string.
-  // }
-  // ```
-  for (let i = startIdx + 1; i < input.length; i++) {
-    peekChar = input.charCodeAt(i)
-
-    // Current character is a `\` therefore the next character is escaped.
-    if (peekChar === BACKSLASH) {
-      i += 1
-    }
-
-    // End of the string.
-    else if (peekChar === quoteChar) {
-      return i
-    }
-
-    // End of the line without ending the string but with a `;` at the end.
-    //
-    // E.g.:
-    //
-    // ```css
-    // .foo {
-    //   content: "This is a string with a;
-    //                                    ^ Missing "
-    // }
-    // ```
-    else if (
-      peekChar === SEMICOLON &&
-      (input.charCodeAt(i + 1) === LINE_BREAK ||
-        (input.charCodeAt(i + 1) === CARRIAGE_RETURN && input.charCodeAt(i + 2) === LINE_BREAK))
-    ) {
-      throw new CssSyntaxError(
-        `Unterminated string: ${input.slice(startIdx, i + 1) + String.fromCharCode(quoteChar)}`,
-        source ? [source, startIdx, i + 1] : null,
-      )
-    }
-
-    // End of the line without ending the string.
-    //
-    // E.g.:
-    //
-    // ```css
-    // .foo {
-    //   content: "This is a string with a
-    //                                    ^ Missing "
-    // }
-    // ```
-    else if (
-      peekChar === LINE_BREAK ||
-      (peekChar === CARRIAGE_RETURN && input.charCodeAt(i + 1) === LINE_BREAK)
-    ) {
-      throw new CssSyntaxError(
-        `Unterminated string: ${input.slice(startIdx, i) + String.fromCharCode(quoteChar)}`,
-        source ? [source, startIdx, i + 1] : null,
-      )
-    }
-  }
-
-  return startIdx
-}
diff --git a/packages/tailwindcss/src/design-system.ts b/packages/tailwindcss/src/design-system.ts
index 7786790f6..b11dabc11 100644
--- a/packages/tailwindcss/src/design-system.ts
+++ b/packages/tailwindcss/src/design-system.ts
@@ -1,36 +1,14 @@
-import { Polyfills } from '.'
-import { optimizeAst, toCss, type AstNode } from './ast'
-import {
-  parseCandidate,
-  parseVariant,
-  printCandidate,
-  printVariant,
-  type Candidate,
-  type Variant,
-} from './candidate'
+import { optimizeAst, toCss } from './ast'
+import { parseCandidate, parseVariant, type Candidate, type Variant } from './candidate'
 import { compileAstNodes, compileCandidates } from './compile'
 import { substituteFunctions } from './css-functions'
-import {
-  canonicalizeCandidates,
-  getClassList,
-  getVariants,
-  type CanonicalizeOptions,
-  type ClassEntry,
-  type VariantEntry,
-} from './intellisense'
+import { getClassList, getVariants, type ClassEntry, type VariantEntry } from './intellisense'
 import { getClassOrder } from './sort'
-import type { SourceLocation } from './source-maps/source'
 import { Theme, ThemeOptions, type ThemeKey } from './theme'
 import { Utilities, createUtilities, withAlpha } from './utilities'
 import { DefaultMap } from './utils/default-map'
 import { extractUsedVariables } from './utils/variables'
-import { Variants, createVariants, substituteAtVariant } from './variants'
-import { WalkAction, walk } from './walk'
-
-export const enum CompileAstFlags {
-  None = 0,
-  RespectImportant = 1 << 0,
-}
+import { Variants, createVariants } from './variants'
 
 export type DesignSystem = {
   theme: Theme
@@ -48,63 +26,46 @@ export type DesignSystem = {
 
   parseCandidate(candidate: string): Readonly<Candidate>[]
   parseVariant(variant: string): Readonly<Variant> | null
-  compileAstNodes(candidate: Candidate, flags?: CompileAstFlags): ReturnType<typeof compileAstNodes>
-
-  printCandidate(candidate: Candidate): string
-  printVariant(variant: Variant): string
+  compileAstNodes(candidate: Candidate): ReturnType<typeof compileAstNodes>
 
   getVariantOrder(): Map<Variant, number>
   resolveThemeValue(path: string, forceInline?: boolean): string | undefined
 
   trackUsedVariables(raw: string): void
-  canonicalizeCandidates(candidates: string[], options?: CanonicalizeOptions): string[]
 
   // Used by IntelliSense
   candidatesToCss(classes: string[]): (string | null)[]
-  candidatesToAst(classes: string[]): AstNode[][]
-
-  // General purpose storage
-  storage: Record<symbol, unknown>
 }
 
-export function buildDesignSystem(
-  theme: Theme,
-  utilitiesSrc?: SourceLocation | undefined,
-): DesignSystem {
+export function buildDesignSystem(theme: Theme): DesignSystem {
   let utilities = createUtilities(theme)
   let variants = createVariants(theme)
 
   let parsedVariants = new DefaultMap((variant) => parseVariant(variant, designSystem))
-  let cachedVariantOrder: Map<Variant, number> | null = null
-  let cachedVariantOrderSize = -1
   let parsedCandidates = new DefaultMap((candidate) =>
     Array.from(parseCandidate(candidate, designSystem)),
   )
 
-  let compiledAstNodes = new DefaultMap<number>((flags) => {
-    return new DefaultMap<Candidate>((candidate) => {
-      let ast = compileAstNodes(candidate, designSystem, flags)
+  let compiledAstNodes = new DefaultMap<Candidate>((candidate) => {
+    let ast = compileAstNodes(candidate, designSystem)
 
-      try {
-        let nodes = ast.map((value) => value.node)
+    // Arbitrary values (`text-[theme(--color-red-500)]`) and arbitrary
+    // properties (`[--my-var:theme(--color-red-500)]`) can contain function
+    // calls so we need evaluate any functions we find there that weren't in
+    // the source CSS.
+    try {
+      substituteFunctions(
+        ast.map(({ node }) => node),
+        designSystem,
+      )
+    } catch (err) {
+      // If substitution fails then the candidate likely contains a call to
+      // `theme()` that is invalid which may be because of incorrect usage,
+      // invalid arguments, or a theme key that does not exist.
+      return []
+    }
 
-        // Arbitrary values (`text-[theme(--color-red-500)]`) and arbitrary
-        // properties (`[--my-var:theme(--color-red-500)]`) can contain function
-        // calls so we need evaluate any functions we find there that weren't in
-        // the source CSS.
-        substituteFunctions(nodes, designSystem)
-
-        // JS plugins might contain an `@variant` inside a generated utility
-        substituteAtVariant(nodes, designSystem)
-      } catch (err) {
-        // If substitution fails then the candidate likely contains a call to
-        // `theme()` that is invalid which may be because of incorrect usage,
-        // invalid arguments, or a theme key that does not exist.
-        return []
-      }
-
-      return ast
-    })
+    return ast
   })
 
   let trackUsedVariables = new DefaultMap((raw) => {
@@ -113,44 +74,6 @@ export function buildDesignSystem(
     }
   })
 
-  function candidatesToAst(classes: string[]): AstNode[][] {
-    let result: AstNode[][] = []
-
-    for (let className of classes) {
-      let wasValid = true
-
-      let { astNodes } = compileCandidates([className], designSystem, {
-        onInvalidCandidate() {
-          wasValid = false
-        },
-      })
-
-      if (utilitiesSrc) {
-        walk(astNodes, (node) => {
-          // We do this conditionally to preserve source locations from both
-          // `@utility` and `@custom-variant`. Even though generated nodes are
-          // cached this should be fine because `utilitiesNode.src` should not
-          // change without a full rebuild which destroys the cache.
-          node.src ??= utilitiesSrc
-          return WalkAction.Continue
-        })
-      }
-
-      // Disable all polyfills to not unnecessarily pollute IntelliSense output
-      astNodes = optimizeAst(astNodes, designSystem, Polyfills.None)
-
-      result.push(wasValid ? astNodes : [])
-    }
-
-    return result
-  }
-
-  function candidatesToCss(classes: string[]): (string | null)[] {
-    return candidatesToAst(classes).map((nodes) => {
-      return nodes.length > 0 ? toCss(nodes) : null
-    })
-  }
-
   let designSystem: DesignSystem = {
     theme,
     utilities,
@@ -159,8 +82,29 @@ export function buildDesignSystem(
     invalidCandidates: new Set(),
     important: false,
 
-    candidatesToCss,
-    candidatesToAst,
+    candidatesToCss(classes: string[]) {
+      let result: (string | null)[] = []
+
+      for (let className of classes) {
+        let wasInvalid = false
+
+        let { astNodes } = compileCandidates([className], this, {
+          onInvalidCandidate() {
+            wasInvalid = true
+          },
+        })
+
+        astNodes = optimizeAst(astNodes, designSystem)
+
+        if (astNodes.length === 0 || wasInvalid) {
+          result.push(null)
+        } else {
+          result.push(toCss(astNodes))
+        }
+      }
+
+      return result
+    },
 
     getClassOrder(classes) {
       return getClassOrder(this, classes)
@@ -178,23 +122,10 @@ export function buildDesignSystem(
     parseVariant(variant: string) {
       return parsedVariants.get(variant)
     },
-    compileAstNodes(candidate: Candidate, flags = CompileAstFlags.RespectImportant) {
-      return compiledAstNodes.get(flags).get(candidate)
+    compileAstNodes(candidate: Candidate) {
+      return compiledAstNodes.get(candidate)
     },
-
-    printCandidate(candidate: Candidate) {
-      return printCandidate(designSystem, candidate)
-    },
-    printVariant(variant: Variant) {
-      return printVariant(variant)
-    },
-
     getVariantOrder() {
-      // parsedVariants only grows, so the cache should be reset only when the size changes
-      if (cachedVariantOrder !== null && cachedVariantOrderSize === parsedVariants.size) {
-        return cachedVariantOrder
-      }
-
       let variants = Array.from(parsedVariants.values())
       variants.sort((a, z) => this.variants.compare(a, z))
 
@@ -216,9 +147,6 @@ export function buildDesignSystem(
         prevVariant = variant
       }
 
-      cachedVariantOrder = order
-      cachedVariantOrderSize = parsedVariants.size
-
       return order
     },
 
@@ -247,14 +175,6 @@ export function buildDesignSystem(
     trackUsedVariables(raw: string) {
       trackUsedVariables.get(raw)
     },
-
-    canonicalizeCandidates(candidates: string[], options?: CanonicalizeOptions) {
-      return canonicalizeCandidates(this, candidates, options)
-    },
-
-    // General purpose storage, each key has to be a unique symbol to avoid
-    // collisions.
-    storage: {},
   }
 
   return designSystem
diff --git a/packages/tailwindcss/src/expand-declaration.test.ts b/packages/tailwindcss/src/expand-declaration.test.ts
deleted file mode 100644
index eb3d5ffb2..000000000
--- a/packages/tailwindcss/src/expand-declaration.test.ts
+++ /dev/null
@@ -1,629 +0,0 @@
-import { describe, expect, test } from 'vitest'
-import { toCss } from './ast'
-import { SignatureFeatures } from './canonicalize-candidates'
-import { parse } from './css-parser'
-import { expandDeclaration } from './expand-declaration'
-import { walk, WalkAction } from './walk'
-
-const css = String.raw
-
-function expand(input: string, options: SignatureFeatures): string {
-  let ast = parse(input)
-
-  walk(ast, (node) => {
-    if (node.kind === 'declaration') {
-      let result = expandDeclaration(node, options)
-      if (result) return WalkAction.ReplaceSkip(result)
-    }
-  })
-
-  return toCss(ast)
-}
-
-describe('expand declarations', () => {
-  let options = SignatureFeatures.ExpandProperties
-
-  test('inset', () => {
-    let input = css`
-      .one {
-        inset: 10px;
-      }
-
-      .two {
-        inset: 10px 20px;
-      }
-
-      .three {
-        inset: 10px 20px 30px;
-      }
-
-      .four {
-        inset: 10px 20px 30px 40px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        top: 10px;
-        right: 10px;
-        bottom: 10px;
-        left: 10px;
-      }
-      .two {
-        top: 10px;
-        right: 20px;
-        bottom: 10px;
-        left: 20px;
-      }
-      .three {
-        top: 10px;
-        right: 20px;
-        bottom: 30px;
-        left: 20px;
-      }
-      .four {
-        top: 10px;
-        right: 20px;
-        bottom: 30px;
-        left: 40px;
-      }
-      "
-    `)
-  })
-
-  test('gap', () => {
-    let input = css`
-      .one {
-        gap: 10px;
-      }
-
-      .two {
-        gap: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        row-gap: 10px;
-        column-gap: 10px;
-      }
-      .two {
-        row-gap: 10px;
-        column-gap: 20px;
-      }
-      "
-    `)
-  })
-
-  test('border-width', () => {
-    let input = css`
-      .one {
-        border-width: 1px;
-      }
-
-      .two {
-        border-width: 1px 2px;
-      }
-
-      .three {
-        border-width: 1px 2px 3px;
-      }
-
-      .four {
-        border-width: 1px 2px 3px 4px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        border-top-width: 1px;
-        border-right-width: 1px;
-        border-bottom-width: 1px;
-        border-left-width: 1px;
-      }
-      .two {
-        border-top-width: 1px;
-        border-right-width: 2px;
-        border-bottom-width: 1px;
-        border-left-width: 2px;
-      }
-      .three {
-        border-top-width: 1px;
-        border-right-width: 2px;
-        border-bottom-width: 3px;
-        border-left-width: 2px;
-      }
-      .four {
-        border-top-width: 1px;
-        border-right-width: 2px;
-        border-bottom-width: 3px;
-        border-left-width: 4px;
-      }
-      "
-    `)
-  })
-
-  test('border-style', () => {
-    let input = css`
-      .one {
-        border-style: solid;
-      }
-
-      .two {
-        border-style: solid dashed;
-      }
-
-      .three {
-        border-style: solid dashed dotted;
-      }
-
-      .four {
-        border-style: solid dashed dotted double;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        border-top-style: solid;
-        border-right-style: solid;
-        border-bottom-style: solid;
-        border-left-style: solid;
-      }
-      .two {
-        border-top-style: solid;
-        border-right-style: dashed;
-        border-bottom-style: solid;
-        border-left-style: dashed;
-      }
-      .three {
-        border-top-style: solid;
-        border-right-style: dashed;
-        border-bottom-style: dotted;
-        border-left-style: dashed;
-      }
-      .four {
-        border-top-style: solid;
-        border-right-style: dashed;
-        border-bottom-style: dotted;
-        border-left-style: double;
-      }
-      "
-    `)
-  })
-
-  test('border-color', () => {
-    let input = css`
-      .one {
-        border-color: red;
-      }
-
-      .two {
-        border-color: red green;
-      }
-
-      .three {
-        border-color: red green blue;
-      }
-
-      .four {
-        border-color: red green blue black;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        border-top-color: red;
-        border-right-color: red;
-        border-bottom-color: red;
-        border-left-color: red;
-      }
-      .two {
-        border-top-color: red;
-        border-right-color: green;
-        border-bottom-color: red;
-        border-left-color: green;
-      }
-      .three {
-        border-top-color: red;
-        border-right-color: green;
-        border-bottom-color: blue;
-        border-left-color: green;
-      }
-      .four {
-        border-top-color: red;
-        border-right-color: green;
-        border-bottom-color: blue;
-        border-left-color: black;
-      }
-      "
-    `)
-  })
-
-  test('scroll-margin', () => {
-    let input = css`
-      .one {
-        scroll-margin: 1px;
-      }
-
-      .two {
-        scroll-margin: 1px 2px;
-      }
-
-      .three {
-        scroll-margin: 1px 2px 3px;
-      }
-
-      .four {
-        scroll-margin: 1px 2px 3px 4px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        scroll-margin-top: 1px;
-        scroll-margin-right: 1px;
-        scroll-margin-bottom: 1px;
-        scroll-margin-left: 1px;
-      }
-      .two {
-        scroll-margin-top: 1px;
-        scroll-margin-right: 2px;
-        scroll-margin-bottom: 1px;
-        scroll-margin-left: 2px;
-      }
-      .three {
-        scroll-margin-top: 1px;
-        scroll-margin-right: 2px;
-        scroll-margin-bottom: 3px;
-        scroll-margin-left: 2px;
-      }
-      .four {
-        scroll-margin-top: 1px;
-        scroll-margin-right: 2px;
-        scroll-margin-bottom: 3px;
-        scroll-margin-left: 4px;
-      }
-      "
-    `)
-  })
-
-  test('scroll-padding', () => {
-    let input = css`
-      .one {
-        scroll-padding: 1px;
-      }
-
-      .two {
-        scroll-padding: 1px 2px;
-      }
-
-      .three {
-        scroll-padding: 1px 2px 3px;
-      }
-
-      .four {
-        scroll-padding: 1px 2px 3px 4px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        scroll-padding-top: 1px;
-        scroll-padding-right: 1px;
-        scroll-padding-bottom: 1px;
-        scroll-padding-left: 1px;
-      }
-      .two {
-        scroll-padding-top: 1px;
-        scroll-padding-right: 2px;
-        scroll-padding-bottom: 1px;
-        scroll-padding-left: 2px;
-      }
-      .three {
-        scroll-padding-top: 1px;
-        scroll-padding-right: 2px;
-        scroll-padding-bottom: 3px;
-        scroll-padding-left: 2px;
-      }
-      .four {
-        scroll-padding-top: 1px;
-        scroll-padding-right: 2px;
-        scroll-padding-bottom: 3px;
-        scroll-padding-left: 4px;
-      }
-      "
-    `)
-  })
-
-  test('overflow', () => {
-    let input = css`
-      .one {
-        overflow: clip;
-      }
-
-      .two {
-        overflow: hidden visible;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        overflow-x: clip;
-        overflow-y: clip;
-      }
-      .two {
-        overflow-x: hidden;
-        overflow-y: visible;
-      }
-      "
-    `)
-  })
-
-  test('overscroll-behavior', () => {
-    let input = css`
-      .one {
-        overscroll-behavior: none;
-      }
-
-      .two {
-        overscroll-behavior: auto contain;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        overscroll-behavior-x: none;
-        overscroll-behavior-y: none;
-      }
-      .two {
-        overscroll-behavior-x: auto;
-        overscroll-behavior-y: contain;
-      }
-      "
-    `)
-  })
-
-  test('expansion with `!important`', () => {
-    let input = css`
-      .one {
-        inset: 10px;
-      }
-
-      .two {
-        inset: 10px 20px;
-      }
-
-      .three {
-        inset: 10px 20px 30px !important;
-      }
-
-      .four {
-        inset: 10px 20px 30px 40px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".one {
-        top: 10px;
-        right: 10px;
-        bottom: 10px;
-        left: 10px;
-      }
-      .two {
-        top: 10px;
-        right: 20px;
-        bottom: 10px;
-        left: 20px;
-      }
-      .three {
-        top: 10px !important;
-        right: 20px !important;
-        bottom: 30px !important;
-        left: 20px !important;
-      }
-      .four {
-        top: 10px;
-        right: 20px;
-        bottom: 30px;
-        left: 40px;
-      }
-      "
-    `)
-  })
-})
-
-describe('expand logical properties', () => {
-  let options = SignatureFeatures.ExpandProperties | SignatureFeatures.LogicalToPhysical
-
-  test('margin-inline', () => {
-    let input = css`
-      .example {
-        margin-inline: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        margin-left: 10px;
-        margin-right: 20px;
-      }
-      "
-    `)
-  })
-
-  test('margin-block', () => {
-    let input = css`
-      .example {
-        margin-block: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        margin-top: 10px;
-        margin-bottom: 20px;
-      }
-      "
-    `)
-  })
-
-  test('padding-inline', () => {
-    let input = css`
-      .example {
-        padding-inline: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        padding-left: 10px;
-        padding-right: 20px;
-      }
-      "
-    `)
-  })
-
-  test('padding-block', () => {
-    let input = css`
-      .example {
-        padding-block: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        padding-top: 10px;
-        padding-bottom: 20px;
-      }
-      "
-    `)
-  })
-
-  test('scroll-margin-inline', () => {
-    let input = css`
-      .example {
-        scroll-margin-inline: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        scroll-margin-left: 10px;
-        scroll-margin-right: 20px;
-      }
-      "
-    `)
-  })
-
-  test('scroll-margin-block', () => {
-    let input = css`
-      .example {
-        scroll-margin-block: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        scroll-margin-top: 10px;
-        scroll-margin-bottom: 20px;
-      }
-      "
-    `)
-  })
-
-  test('scroll-padding-inline', () => {
-    let input = css`
-      .example {
-        scroll-padding-inline: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        scroll-padding-left: 10px;
-        scroll-padding-right: 20px;
-      }
-      "
-    `)
-  })
-
-  test('scroll-padding-block', () => {
-    let input = css`
-      .example {
-        scroll-padding-block: 10px 20px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        scroll-padding-top: 10px;
-        scroll-padding-bottom: 20px;
-      }
-      "
-    `)
-  })
-
-  test('border-inline-width', () => {
-    let input = css`
-      .example {
-        border-inline-width: 1px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        border-left-width: 1px;
-        border-right-width: 1px;
-      }
-      "
-    `)
-  })
-
-  test('border-block-width', () => {
-    let input = css`
-      .example {
-        border-block-width: 1px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        border-bottom-width: 1px;
-        border-top-width: 1px;
-      }
-      "
-    `)
-  })
-
-  test('border-inline-style', () => {
-    let input = css`
-      .example {
-        border-inline-style: 1px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        border-left-style: 1px;
-        border-right-style: 1px;
-      }
-      "
-    `)
-  })
-
-  test('border-block-style', () => {
-    let input = css`
-      .example {
-        border-block-style: 1px;
-      }
-    `
-
-    expect(expand(input, options)).toMatchInlineSnapshot(`
-      ".example {
-        border-bottom-style: 1px;
-        border-top-style: 1px;
-      }
-      "
-    `)
-  })
-})
diff --git a/packages/tailwindcss/src/expand-declaration.ts b/packages/tailwindcss/src/expand-declaration.ts
deleted file mode 100644
index 7cef98952..000000000
--- a/packages/tailwindcss/src/expand-declaration.ts
+++ /dev/null
@@ -1,122 +0,0 @@
-import { decl, type AstNode } from './ast'
-import { SignatureFeatures } from './canonicalize-candidates'
-import { segment } from './utils/segment'
-
-function createPrefixedQuad(
-  prefix: string,
-  t = 'top',
-  r = 'right',
-  b = 'bottom',
-  l = 'left',
-): Record<number, [prop: string, index: number][]> {
-  return createBareQuad(`${prefix}-${t}`, `${prefix}-${r}`, `${prefix}-${b}`, `${prefix}-${l}`)
-}
-
-// prettier-ignore
-function createBareQuad(t = 'top', r = 'right', b = 'bottom', l = 'left'): Record<number, [prop: string, index: number][]> {
-  return {
-    1: [[t, 0], [r, 0], [b, 0], [l, 0]],
-    2: [[t, 0], [r, 1], [b, 0], [l, 1]],
-    3: [[t, 0], [r, 1], [b, 2], [l, 1]],
-    4: [[t, 0], [r, 1], [b, 2], [l, 3]],
-  } as const;
-}
-
-// prettier-ignore
-function createPair(lhs: string, rhs: string): Record<number, [prop: string, index: number][]> {
-  return {
-    1: [[lhs, 0], [rhs, 0]],
-    2: [[lhs, 0], [rhs, 1]],
-  } as const;
-}
-
-// Depending on the length of the value, map to different properties
-let VARIADIC_EXPANSION_MAP: Record<string, Record<number, [prop: string, index: number][]>> = {
-  inset: createBareQuad(),
-  margin: createPrefixedQuad('margin'),
-  padding: createPrefixedQuad('padding'),
-  'scroll-margin': createPrefixedQuad('scroll-margin'),
-  'scroll-padding': createPrefixedQuad('scroll-padding'),
-  'border-width': createPrefixedQuad(
-    'border',
-    'top-width',
-    'right-width',
-    'bottom-width',
-    'left-width',
-  ),
-  'border-style': createPrefixedQuad(
-    'border',
-    'top-style',
-    'right-style',
-    'bottom-style',
-    'left-style',
-  ),
-  'border-color': createPrefixedQuad(
-    'border',
-    'top-color',
-    'right-color',
-    'bottom-color',
-    'left-color',
-  ),
-  gap: createPair('row-gap', 'column-gap'),
-  overflow: createPair('overflow-x', 'overflow-y'),
-  'overscroll-behavior': createPair('overscroll-behavior-x', 'overscroll-behavior-y'),
-}
-
-// Depending on the length of the value, map to different properties
-let VARIADIC_LOGICAL_EXPANSION_MAP: Record<
-  string,
-  Record<number, [prop: string, index: number][]>
-> = {
-  'inset-block': createPair('top', 'bottom'),
-  'inset-inline': createPair('left', 'right'),
-  'margin-block': createPair('margin-top', 'margin-bottom'),
-  'margin-inline': createPair('margin-left', 'margin-right'),
-  'padding-block': createPair('padding-top', 'padding-bottom'),
-  'padding-inline': createPair('padding-left', 'padding-right'),
-  'scroll-margin-block': createPair('scroll-margin-top', 'scroll-margin-bottom'),
-  'scroll-margin-inline': createPair('scroll-margin-left', 'scroll-margin-right'),
-  'scroll-padding-block': createPair('scroll-padding-top', 'scroll-padding-bottom'),
-  'scroll-padding-inline': createPair('scroll-padding-left', 'scroll-padding-right'),
-}
-
-// The entire value is mapped to each property
-let LOGICAL_EXPANSION_MAP: Record<string, string[]> = {
-  'border-block': ['border-bottom', 'border-top'],
-  'border-block-color': ['border-bottom-color', 'border-top-color'],
-  'border-block-style': ['border-bottom-style', 'border-top-style'],
-  'border-block-width': ['border-bottom-width', 'border-top-width'],
-  'border-inline': ['border-left', 'border-right'],
-  'border-inline-color': ['border-left-color', 'border-right-color'],
-  'border-inline-style': ['border-left-style', 'border-right-style'],
-  'border-inline-width': ['border-left-width', 'border-right-width'],
-}
-
-export function expandDeclaration(
-  node: Extract<AstNode, { kind: 'declaration' }>,
-  options: SignatureFeatures,
-): AstNode[] | null {
-  if (options & SignatureFeatures.LogicalToPhysical) {
-    if (node.property in VARIADIC_LOGICAL_EXPANSION_MAP) {
-      let args = segment(node.value!, ' ')
-      return VARIADIC_LOGICAL_EXPANSION_MAP[node.property][args.length]?.map(([prop, index]) => {
-        return decl(prop, args[index], node.important)
-      })
-    }
-
-    if (node.property in LOGICAL_EXPANSION_MAP) {
-      return LOGICAL_EXPANSION_MAP[node.property]?.map((prop) => {
-        return decl(prop, node.value!, node.important)
-      })
-    }
-  }
-
-  if (node.property in VARIADIC_EXPANSION_MAP) {
-    let args = segment(node.value!, ' ')
-    return VARIADIC_EXPANSION_MAP[node.property][args.length]?.map(([prop, index]) => {
-      return decl(prop, args[index], node.important)
-    })
-  }
-
-  return null
-}
diff --git a/packages/tailwindcss/src/feature-flags.ts b/packages/tailwindcss/src/feature-flags.ts
index e69de29bb..203bfe335 100644
--- a/packages/tailwindcss/src/feature-flags.ts
+++ b/packages/tailwindcss/src/feature-flags.ts
@@ -0,0 +1,9 @@
+export const enableBaselineLast = process.env.FEATURES_ENV !== 'stable'
+export const enableDetailsContent = process.env.FEATURES_ENV !== 'stable'
+export const enableInvertedColors = process.env.FEATURES_ENV !== 'stable'
+export const enablePointerVariants = process.env.FEATURES_ENV !== 'stable'
+export const enableSafeAlignment = process.env.FEATURES_ENV !== 'stable'
+export const enableScripting = process.env.FEATURES_ENV !== 'stable'
+export const enableSourceInline = process.env.FEATURES_ENV !== 'stable'
+export const enableUserValid = process.env.FEATURES_ENV !== 'stable'
+export const enableWrapAnywhere = process.env.FEATURES_ENV !== 'stable'
diff --git a/packages/tailwindcss/src/important.test.ts b/packages/tailwindcss/src/important.test.ts
index a3c9447fc..b3594219b 100644
--- a/packages/tailwindcss/src/important.test.ts
+++ b/packages/tailwindcss/src/important.test.ts
@@ -1,28 +1,30 @@
 import { expect, test } from 'vitest'
-import { run } from './test-utils/run'
+import { compile } from '.'
+import { compileCss } from './test-utils/run'
 
 const css = String.raw
 
 test('Utilities can be wrapped in a selector', async () => {
   // This is the v4 equivalent of `important: "#app"` from v3
-  expect(
-    await run(
-      ['underline', 'hover:line-through'],
-      css`
-        #app {
-          @tailwind utilities;
-        }
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    #app .underline {
-      text-decoration-line: underline;
+  let input = css`
+    #app {
+      @tailwind utilities;
     }
+  `
 
-    @media (hover: hover) {
-      #app .hover\\:line-through:hover {
-        text-decoration-line: line-through;
+  let compiler = await compile(input)
+
+  expect(compiler.build(['underline', 'hover:line-through'])).toMatchInlineSnapshot(`
+    "#app {
+      .underline {
+        text-decoration-line: underline;
+      }
+      .hover\\:line-through {
+        &:hover {
+          @media (hover: hover) {
+            text-decoration-line: line-through;
+          }
+        }
       }
     }
     "
@@ -31,29 +33,26 @@ test('Utilities can be wrapped in a selector', async () => {
 
 test('Utilities can be marked with important', async () => {
   // This is the v4 equivalent of `important: true` from v3
-  expect(
-    await run(
-      ['underline', 'hover:line-through'],
-      css`
-        @import 'tailwindcss/utilities' important;
-      `,
-      {
-        loadStylesheet: async (_id: string, base: string) => ({
-          base,
-          content: '@tailwind utilities;',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .underline {
+  let input = css`
+    @import 'tailwindcss/utilities' important;
+  `
+
+  let compiler = await compile(input, {
+    loadStylesheet: async (id: string, base: string) => ({
+      base,
+      content: '@tailwind utilities;',
+    }),
+  })
+
+  expect(compiler.build(['underline', 'hover:line-through'])).toMatchInlineSnapshot(`
+    ".underline {
       text-decoration-line: underline !important;
     }
-
-    @media (hover: hover) {
-      .hover\\:line-through:hover {
-        text-decoration-line: line-through !important;
+    .hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
+          text-decoration-line: line-through !important;
+        }
       }
     }
     "
@@ -63,26 +62,27 @@ test('Utilities can be marked with important', async () => {
 test('Utilities can be wrapped with a selector and marked as important', async () => {
   // This does not have a direct equivalent in v3 but works as a consequence of
   // the new APIs
-  expect(
-    await run(
-      ['underline', 'hover:line-through'],
-      css`
-        @media important {
-          #app {
-            @tailwind utilities;
+  let input = css`
+    @media important {
+      #app {
+        @tailwind utilities;
+      }
+    }
+  `
+
+  let compiler = await compile(input)
+
+  expect(compiler.build(['underline', 'hover:line-through'])).toMatchInlineSnapshot(`
+    "#app {
+      .underline {
+        text-decoration-line: underline !important;
+      }
+      .hover\\:line-through {
+        &:hover {
+          @media (hover: hover) {
+            text-decoration-line: line-through !important;
           }
         }
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    #app .underline {
-      text-decoration-line: underline !important;
-    }
-
-    @media (hover: hover) {
-      #app .hover\\:line-through:hover {
-        text-decoration-line: line-through !important;
       }
     }
     "
@@ -91,26 +91,17 @@ test('Utilities can be wrapped with a selector and marked as important', async (
 
 test('variables in utilities should not be marked as important', async () => {
   expect(
-    await run(
-      ['ease-out!', 'z-10!'],
+    await compileCss(
       css`
         @theme {
           --ease-out: cubic-bezier(0, 0, 0.2, 1);
         }
         @tailwind utilities;
       `,
+      ['ease-out!', 'z-10!'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-ease: initial;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --ease-out: cubic-bezier(0, 0, .2, 1);
     }
 
@@ -126,7 +117,6 @@ test('variables in utilities should not be marked as important', async () => {
     @property --tw-ease {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
 })
diff --git a/packages/tailwindcss/src/index.bench.ts b/packages/tailwindcss/src/index.bench.ts
index 0ca33fde1..fb9cd0e71 100644
--- a/packages/tailwindcss/src/index.bench.ts
+++ b/packages/tailwindcss/src/index.bench.ts
@@ -7,7 +7,7 @@ const root = process.env.FOLDER || process.cwd()
 const css = String.raw
 
 bench('compile', async () => {
-  let scanner = new Scanner({ sources: [{ base: root, pattern: '**/*', negated: true }] })
+  let scanner = new Scanner({ sources: [{ base: root, pattern: '**/*' }] })
   let candidates = scanner.scan()
 
   let { build } = await compile(css`
diff --git a/packages/tailwindcss/src/index.test.ts b/packages/tailwindcss/src/index.test.ts
index 7f4a0eef3..25d30f2ea 100644
--- a/packages/tailwindcss/src/index.test.ts
+++ b/packages/tailwindcss/src/index.test.ts
@@ -1,19 +1,17 @@
 import fs from 'node:fs'
 import path from 'node:path'
 import { describe, expect, it, test } from 'vitest'
-import { compile, Features, Polyfills } from '.'
-import { cartesian } from './cartesian'
+import { compile } from '.'
 import type { PluginAPI } from './compat/plugin-api'
 import plugin from './plugin'
-import { compileCss, run } from './test-utils/run'
+import { compileCss, optimizeCss, run } from './test-utils/run'
 
 const css = String.raw
 
 describe('compiling CSS', () => {
   test('`@tailwind utilities` is replaced with the generated utility classes', async () => {
     expect(
-      await run(
-        ['flex', 'md:grid', 'hover:underline', 'dark:bg-black'],
+      await compileCss(
         css`
           @theme {
             --color-black: #000;
@@ -24,10 +22,10 @@ describe('compiling CSS', () => {
             @tailwind utilities;
           }
         `,
+        ['flex', 'md:grid', 'hover:underline', 'dark:bg-black'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-black: #000;
       }
 
@@ -42,7 +40,7 @@ describe('compiling CSS', () => {
           }
         }
 
-        @media (min-width: 768px) {
+        @media (width >= 768px) {
           .md\\:grid {
             display: grid;
           }
@@ -53,15 +51,13 @@ describe('compiling CSS', () => {
             background-color: var(--color-black);
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('that only CSS variables are allowed', () => {
     return expect(
-      run(
-        ['bg-primary'],
+      compileCss(
         css`
           @theme {
             --color-primary: red;
@@ -71,6 +67,7 @@ describe('compiling CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['bg-primary'],
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(`
       [Error: \`@theme\` blocks must only contain custom properties or \`@keyframes\`.
@@ -86,23 +83,21 @@ describe('compiling CSS', () => {
 
   test('`@tailwind utilities` is only processed once', async () => {
     expect(
-      await run(
-        ['flex', 'grid'],
+      await compileCss(
         css`
           @tailwind utilities;
           @tailwind utilities;
         `,
+        ['flex', 'grid'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .flex {
+      ".flex {
         display: flex;
       }
 
       .grid {
         display: grid;
-      }
-      "
+      }"
     `)
   })
 
@@ -110,33 +105,32 @@ describe('compiling CSS', () => {
     let defaultTheme = fs.readFileSync(path.resolve(__dirname, '..', 'theme.css'), 'utf-8')
 
     expect(
-      await run(
-        ['bg-red-500', 'w-4', 'sm:flex', 'shadow-sm'],
+      await compileCss(
         css`
           ${defaultTheme}
           @tailwind utilities;
         `,
+        ['bg-red-500', 'w-4', 'sm:flex', 'shadow-sm'],
       ),
     ).toMatchSnapshot()
   })
 
   test('prefix all CSS variables inside preflight', async () => {
     expect(
-      await run(
-        ['font-mono'],
+      await compileCss(
         css`
           @import 'tailwindcss' prefix(tw);
           @tailwind utilities;
         `,
+        ['font-mono'],
         {
           async loadStylesheet(id) {
             return {
-              path: '',
-              base: '',
               content: fs.readFileSync(
                 path.resolve(__dirname, '..', id === 'tailwindcss' ? 'index.css' : id),
                 'utf-8',
               ),
+              base: '',
             }
           },
         },
@@ -146,12 +140,7 @@ describe('compiling CSS', () => {
 
   test('unescapes underscores to spaces inside arbitrary values except for `url()` and first argument of `var()` and `theme()`', async () => {
     expect(
-      await run(
-        [
-          'bg-[no-repeat_url(./my_file.jpg)]',
-          'ml-[var(--spacing-1_5,_var(--spacing-2_5,_1rem))]',
-          'ml-[theme(--spacing-1_5,theme(--spacing-2_5,_1rem)))]',
-        ],
+      await compileCss(
         css`
           @theme {
             --spacing-1_5: 1.5rem;
@@ -159,10 +148,14 @@ describe('compiling CSS', () => {
           }
           @tailwind utilities;
         `,
+        [
+          'bg-[no-repeat_url(./my_file.jpg)]',
+          'ml-[var(--spacing-1_5,_var(--spacing-2_5,_1rem))]',
+          'ml-[theme(--spacing-1_5,theme(--spacing-2_5,_1rem)))]',
+        ],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --spacing-1_5: 1.5rem;
         --spacing-2_5: 2.5rem;
       }
@@ -177,15 +170,13 @@ describe('compiling CSS', () => {
 
       .bg-\\[no-repeat_url\\(\\.\\/my_file\\.jpg\\)\\] {
         background-color: no-repeat url("./my_file.jpg");
-      }
-      "
+      }"
     `)
   })
 
   test('unescapes theme variables and handles dots as underscore', async () => {
     expect(
-      await run(
-        ['m-1.5', 'm-2.5', 'm-2_5', 'm-3.5', 'm-foo/bar'],
+      await compileCss(
         css`
           @theme {
             --spacing-*: initial;
@@ -197,10 +188,10 @@ describe('compiling CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['m-1.5', 'm-2.5', 'm-2_5', 'm-3.5', 'm-foo/bar'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --spacing-1\\.5: 1.5px;
         --spacing-2_5: 2.5px;
         --spacing-3\\.5: 3.5px;
@@ -221,20 +212,24 @@ describe('compiling CSS', () => {
 
       .m-foo\\/bar {
         margin: var(--spacing-foo\\/bar);
-      }
-      "
+      }"
     `)
   })
 
   test('adds vendor prefixes', async () => {
-    expect(await run(['[text-size-adjust:none]'])).toMatchInlineSnapshot(`
-      "
-      .\\[text-size-adjust\\:none\\] {
+    expect(
+      await compileCss(
+        css`
+          @tailwind utilities;
+        `,
+        ['[text-size-adjust:none]'],
+      ),
+    ).toMatchInlineSnapshot(`
+      ".\\[text-size-adjust\\:none\\] {
         -webkit-text-size-adjust: none;
         -moz-text-size-adjust: none;
         text-size-adjust: none;
-      }
-      "
+      }"
     `)
   })
 })
@@ -242,41 +237,29 @@ describe('compiling CSS', () => {
 describe('arbitrary properties', () => {
   it('should generate arbitrary properties', async () => {
     expect(await run(['[color:red]'])).toMatchInlineSnapshot(`
-      "
-      .\\[color\\:red\\] {
+      ".\\[color\\:red\\] {
         color: red;
-      }
-      "
+      }"
     `)
   })
 
   it('should generate arbitrary properties with modifiers', async () => {
     expect(await run(['[color:red]/50'])).toMatchInlineSnapshot(`
-      "
-      .\\[color\\:red\\]\\/50 {
-        color: oklab(62.7955% .224 .125 / .5);
-      }
-      "
+      ".\\[color\\:red\\]\\/50 {
+        color: oklab(62.7955% .22486 .12584 / .5);
+      }"
     `)
   })
 
   it('should not generate arbitrary properties with invalid modifiers', async () => {
-    expect(await run(['[color:red]/not-a-percentage'])).toEqual('')
+    expect(await run(['[color:red]/not-a-percentage'])).toMatchInlineSnapshot(`""`)
   })
 
   it('should generate arbitrary properties with variables and with modifiers', async () => {
     expect(await run(['[color:var(--my-color)]/50'])).toMatchInlineSnapshot(`
-      "
-      .\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        color: var(--my-color);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .\\[color\\:var\\(--my-color\\)\\]\\/50 {
-          color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        }
-      }
-      "
+      ".\\[color\\:var\\(--my-color\\)\\]\\/50 {
+        color: color-mix(in oklab, var(--my-color) 50%, transparent);
+      }"
     `)
   })
 })
@@ -296,90 +279,6 @@ describe('@apply', () => {
     )
   })
 
-  it('@apply referencing theme values without `@tailwind utilities` or `@reference` should error', () => {
-    return expect(() =>
-      compileCss(css`
-        .foo {
-          @apply p-2;
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: Cannot apply unknown utility class \`p-2\`. Are you using CSS modules or similar and missing \`@reference\`? https://tailwindcss.com/docs/functions-and-directives#reference-directive]`,
-    )
-  })
-
-  it('@apply referencing theme values with `@tailwind utilities` should work', async () => {
-    return expect(
-      await compileCss(
-        css`
-          @import 'tailwindcss';
-
-          .foo {
-            @apply p-2;
-          }
-        `,
-        {
-          async loadStylesheet() {
-            return {
-              path: '',
-              base: '/',
-              content: css`
-                @theme {
-                  --spacing: 0.25rem;
-                }
-                @tailwind utilities;
-              `,
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --spacing: .25rem;
-      }
-
-      .foo {
-        padding: calc(var(--spacing) * 2);
-      }
-      "
-    `)
-  })
-
-  it('@apply referencing theme values with `@reference` should work', async () => {
-    return expect(
-      await compileCss(
-        css`
-          @reference "style.css";
-
-          .foo {
-            @apply p-2;
-          }
-        `,
-        {
-          async loadStylesheet() {
-            return {
-              path: '',
-              base: '/',
-              content: css`
-                @theme {
-                  --spacing: 0.25rem;
-                }
-                @tailwind utilities;
-              `,
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .foo {
-        padding: calc(var(--spacing, .25rem) * 2);
-      }
-      "
-    `)
-  })
-
   it('should replace @apply with the correct result', async () => {
     expect(
       await compileCss(css`
@@ -410,18 +309,7 @@ describe('@apply', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-translate-x: 0;
-            --tw-translate-y: 0;
-            --tw-translate-z: 0;
-          }
-        }
-      }
-
-      :root, :host {
+      ":root, :host {
         --color-red-200: #fecaca;
         --color-red-500: #ef4444;
         --color-blue-500: #3b82f6;
@@ -444,7 +332,7 @@ describe('@apply', () => {
         }
       }
 
-      @media (min-width: 768px) {
+      @media (width >= 768px) {
         .foo {
           background-color: var(--color-green-500);
         }
@@ -454,7 +342,7 @@ describe('@apply', () => {
         background-color: var(--color-red-200);
       }
 
-      @media (min-width: 768px) {
+      @media (width >= 768px) {
         .foo:hover:focus {
           background-color: var(--color-green-200);
         }
@@ -482,8 +370,7 @@ describe('@apply', () => {
         to {
           transform: rotate(360deg);
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -494,10 +381,10 @@ describe('@apply', () => {
           @import './bar.css';
           @tailwind utilities;
         `,
+        [],
         {
           async loadStylesheet() {
             return {
-              path: '',
               base: '/bar.css',
               content: css`
                 .foo {
@@ -509,11 +396,9 @@ describe('@apply', () => {
         },
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .foo {
+      ".foo {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
@@ -531,78 +416,23 @@ describe('@apply', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-
-      .foo, .bar {
+      ".foo, .bar {
         --tw-content: "b";
         content: var(--tw-content);
+        content: var(--tw-content);
       }
 
       @property --tw-content {
         syntax: "*";
         inherits: false;
         initial-value: "";
-      }
-      "
+      }"
     `)
   })
 
-  it('@apply does not cache important state', async () => {
-    expect(
-      await compileCss(css`
-        .c1 {
-          @apply leading-none;
-        }
-        .c2 {
-          @apply leading-none!;
-        }
-        .c3 {
-          @apply leading-none;
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-leading: initial;
-          }
-        }
-      }
-
-      .c1 {
-        --tw-leading: 1;
-        line-height: 1;
-      }
-
-      .c2 {
-        --tw-leading: 1 !important;
-        line-height: 1 !important;
-      }
-
-      .c3 {
-        --tw-leading: 1;
-        line-height: 1;
-      }
-
-      @property --tw-leading {
-        syntax: "*";
-        inherits: false
-      }
-      "
-    `)
-  })
-
-  it('should error when using @apply with a utility that does not exist', async () => {
-    await expect(
-      compile(css`
+  it('should error when using @apply with a utility that does not exist', () => {
+    return expect(
+      compileCss(css`
         @tailwind utilities;
 
         .foo {
@@ -610,24 +440,21 @@ describe('@apply', () => {
         }
       `),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: Cannot apply unknown utility class \`bg-not-found\`. Are you using CSS modules or similar and missing \`@reference\`? https://tailwindcss.com/docs/functions-and-directives#reference-directive]`,
+      `[Error: Cannot apply unknown utility class: bg-not-found]`,
     )
   })
 
-  it('should error when using @apply with a variant that does not exist', async () => {
-    await expect(
-      compile(css`
+  it('should error when using @apply with a variant that does not exist', () => {
+    return expect(
+      compileCss(css`
         @tailwind utilities;
-        @theme {
-          --color-red-500: red;
-        }
 
         .foo {
-          @apply hocus:hover:pocus:bg-red-500;
+          @apply hocus:bg-red-500;
         }
       `),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: Cannot apply utility class \`hocus:hover:pocus:bg-red-500\` because the \`hocus\` and \`pocus\` variants do not exist.]`,
+      `[Error: Cannot apply unknown utility class: hocus:bg-red-500]`,
     )
   })
 
@@ -641,11 +468,9 @@ describe('@apply', () => {
         }
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .foo {
+      ".foo {
         display: flex;
-      }
-      "
+      }"
     `)
   })
 
@@ -672,22 +497,19 @@ describe('@apply', () => {
         @tailwind utilities;
       `),
     ).toMatchInlineSnapshot(`
-      "
-      .foo:before {
+      ".foo:before {
         content: "bar";
       }
 
       .foo:after {
         content: "baz";
-      }
-      "
+      }"
     `)
   })
 
   it('should recursively apply with custom `@utility`, which is used before it is defined', async () => {
     expect(
-      await run(
-        ['a', 'b', 'c', 'flex', 'my-flex'],
+      await compileCss(
         css`
           @tailwind utilities;
 
@@ -713,10 +535,10 @@ describe('@apply', () => {
             @apply flex;
           }
         `,
+        ['a', 'b', 'c', 'flex', 'my-flex'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .a:focus, .b:focus, .c {
+      ".a:focus, .b:focus, .c {
         display: flex !important;
       }
 
@@ -728,16 +550,14 @@ describe('@apply', () => {
         body:focus {
           display: flex !important;
         }
-      }
-      "
+      }"
     `)
   })
 
   // https://github.com/tailwindlabs/tailwindcss/issues/16935
-  it('should not swallow @utility declarations when @apply is used in nested rules', async () => {
+  it('should now swallow @utility declarations when @apply is used in nested rules', async () => {
     expect(
-      await run(
-        ['custom-utility'],
+      await compileCss(
         css`
           @tailwind utilities;
 
@@ -752,10 +572,10 @@ describe('@apply', () => {
             @apply flex;
           }
         `,
+        ['custom-utility'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .custom-utility {
+      ".custom-utility {
         display: flex;
       }
 
@@ -765,218 +585,27 @@ describe('@apply', () => {
 
       .ignore-me div {
         display: flex;
-      }
-      "
+      }"
     `)
   })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/17924
-  it('should correctly apply nested usages of @apply when one @utility applies another', async () => {
-    expect(
-      await run(
-        ['foo', 'test', 'test2'],
-        css`
-          @theme {
-            --color-green-500: green;
-            --color-red-500: red;
-            --color-indigo-500: indigo;
-          }
-
-          @tailwind utilities;
-
-          @utility test2 {
-            @apply test;
-          }
-
-          @utility test {
-            @apply bg-green-500;
-            &:hover {
-              @apply bg-red-500;
-            }
-            &:disabled {
-              @apply bg-indigo-500;
-            }
-          }
-
-          .foo {
-            @apply test2;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-green-500: green;
-        --color-red-500: red;
-        --color-indigo-500: indigo;
-      }
-
-      .test {
-        background-color: var(--color-green-500);
-      }
-
-      .test:hover {
-        background-color: var(--color-red-500);
-      }
-
-      .test:disabled {
-        background-color: var(--color-indigo-500);
-      }
-
-      .test2 {
-        background-color: var(--color-green-500);
-      }
-
-      .test2:hover {
-        background-color: var(--color-red-500);
-      }
-
-      .test2:disabled {
-        background-color: var(--color-indigo-500);
-      }
-
-      .foo {
-        background-color: var(--color-green-500);
-      }
-
-      .foo:hover {
-        background-color: var(--color-red-500);
-      }
-
-      .foo:disabled {
-        background-color: var(--color-indigo-500);
-      }
-      "
-    `)
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/18400
-  it('should ignore the design systems `important` flag when using @apply', async () => {
-    expect(
-      await run(
-        ['flex'],
-        css`
-          @import 'tailwindcss/utilities' important;
-          .flex-explicitly-important {
-            @apply flex!;
-          }
-          .flex-not-important {
-            @apply flex;
-          }
-        `,
-        {
-          async loadStylesheet(_, base) {
-            return {
-              content: '@tailwind utilities;',
-              base,
-              path: '',
-            }
-          },
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .flex, .flex-explicitly-important {
-        display: flex !important;
-      }
-
-      .flex-not-important {
-        display: flex;
-      }
-      "
-    `)
-  })
-
-  it('should be usable with CSS mixins', async () => {
-    let input = css`
-      .foo {
-        /* Utility usage */
-        @apply underline;
-
-        /* CSS mixin usage */
-        @apply --my-mixin-1;
-        @apply --my-mixin-1();
-        @apply --my-mixin-1 --my-mixin-2;
-        @apply --my-mixin-1() --my-mixin-2();
-        @apply --my-mixin-3 {
-          color: red;
-        }
-      }
-    `
-
-    expect(await compileCss(input)).toMatchInlineSnapshot(`
-      "
-      .foo {
-        text-decoration-line: underline;
-        @apply --my-mixin-1;
-        @apply --my-mixin-1();
-        @apply --my-mixin-1 --my-mixin-2;
-        @apply --my-mixin-1() --my-mixin-2();
-        @apply --my-mixin-3 {
-          color: red;
-        }
-      }
-      "
-    `)
-  })
-
-  it('should error when trying to use mixins and utilities together', async () => {
-    await expect(
-      compile(css`
-        .foo {
-          @apply underline --my-mixin-1;
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: You cannot use \`@apply\` with both mixins and utilities. Please move \`@apply --my-mixin-1\` into a separate rule.]`,
-    )
-
-    await expect(
-      compile(css`
-        .foo {
-          @apply --my-mixin-1 underline;
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: You cannot use \`@apply\` with both mixins and utilities. Please move \`@apply --my-mixin-1\` into a separate rule.]`,
-    )
-  })
-
-  it('should error when used with a body', async () => {
-    await expect(
-      compile(css`
-        .foo {
-          @apply underline {
-            color: red;
-          }
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: The rule \`@apply underline\` must not have a body.]`,
-    )
-  })
 })
 
 describe('arbitrary variants', () => {
   it('should generate arbitrary variants', async () => {
     expect(await run(['[&_p]:flex'])).toMatchInlineSnapshot(`
-      "
-      .\\[\\&_p\\]\\:flex p {
+      ".\\[\\&_p\\]\\:flex p {
         display: flex;
-      }
-      "
+      }"
     `)
   })
 
   it('should generate arbitrary at-rule variants', async () => {
     expect(await run(['[@media(width>=123px)]:flex'])).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 123px) {
+      "@media (width >= 123px) {
         .\\[\\@media\\(width\\>\\=123px\\)\\]\\:flex {
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -988,52 +617,37 @@ describe('arbitrary variants', () => {
 describe('variant stacking', () => {
   it('should stack simple variants', async () => {
     expect(await run(['focus:hover:flex'])).toMatchInlineSnapshot(`
-      "
-      @media (hover: hover) {
+      "@media (hover: hover) {
         .focus\\:hover\\:flex:focus:hover {
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   it('should stack arbitrary variants and simple variants', async () => {
     expect(await run(['[&_p]:hover:flex'])).toMatchInlineSnapshot(`
-      "
-      @media (hover: hover) {
+      "@media (hover: hover) {
         .\\[\\&_p\\]\\:hover\\:flex p:hover {
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   it('should stack multiple arbitrary variants', async () => {
     expect(await run(['[&_p]:[@media(width>=123px)]:flex'])).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 123px) {
+      "@media (width >= 123px) {
         .\\[\\&_p\\]\\:\\[\\@media\\(width\\>\\=123px\\)\\]\\:flex p {
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   it('pseudo element variants are re-ordered', async () => {
     expect(await run(['before:hover:flex', 'hover:before:flex'])).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-content: "";
-          }
-        }
-      }
-
-      .before\\:hover\\:flex:before {
+      ".before\\:hover\\:flex:before {
         content: var(--tw-content);
       }
 
@@ -1052,8 +666,7 @@ describe('variant stacking', () => {
         syntax: "*";
         inherits: false;
         initial-value: "";
-      }
-      "
+      }"
     `)
   })
 })
@@ -1061,28 +674,23 @@ describe('variant stacking', () => {
 describe('important', () => {
   it('should generate an important utility', async () => {
     expect(await run(['underline!'])).toMatchInlineSnapshot(`
-      "
-      .underline\\! {
+      ".underline\\! {
         text-decoration-line: underline !important;
-      }
-      "
+      }"
     `)
   })
 
   it('should generate an important utility with legacy syntax', async () => {
     expect(await run(['!underline'])).toMatchInlineSnapshot(`
-      "
-      .\\!underline {
+      ".\\!underline {
         text-decoration-line: underline !important;
-      }
-      "
+      }"
     `)
   })
 
   it('should not mark declarations inside of @keyframes as important', async () => {
     expect(
-      await run(
-        ['animate-spin!'],
+      await compileCss(
         css`
           @theme {
             --animate-spin: spin 1s linear infinite;
@@ -1095,10 +703,10 @@ describe('important', () => {
           }
           @tailwind utilities;
         `,
+        ['animate-spin!'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --animate-spin: spin 1s linear infinite;
       }
 
@@ -1110,18 +718,15 @@ describe('important', () => {
         to {
           transform: rotate(360deg);
         }
-      }
-      "
+      }"
     `)
   })
 
   it('should generate an important arbitrary property utility', async () => {
     expect(await run(['[color:red]!'])).toMatchInlineSnapshot(`
-      "
-      .\\[color\\:red\\]\\! {
+      ".\\[color\\:red\\]\\! {
         color: red !important;
-      }
-      "
+      }"
     `)
   })
 })
@@ -1129,18 +734,17 @@ describe('important', () => {
 describe('sorting', () => {
   it('should sort utilities based on their property order', async () => {
     expect(
-      await run(
-        ['pointer-events-none', 'flex', 'p-1', 'px-1', 'pl-1'].sort(() => Math.random() - 0.5),
+      await compileCss(
         css`
           @theme {
             --spacing-1: 0.25rem;
           }
           @tailwind utilities;
         `,
+        ['pointer-events-none', 'flex', 'p-1', 'px-1', 'pl-1'].sort(() => Math.random() - 0.5),
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --spacing-1: .25rem;
       }
 
@@ -1162,15 +766,13 @@ describe('sorting', () => {
 
       .pl-1 {
         padding-left: var(--spacing-1);
-      }
-      "
+      }"
     `)
   })
 
   it('should sort based on amount of properties', async () => {
     expect(await run(['text-clip', 'truncate', 'overflow-scroll'])).toMatchInlineSnapshot(`
-      "
-      .truncate {
+      ".truncate {
         text-overflow: ellipsis;
         white-space: nowrap;
         overflow: hidden;
@@ -1182,8 +784,7 @@ describe('sorting', () => {
 
       .text-clip {
         text-overflow: clip;
-      }
-      "
+      }"
     `)
   })
 
@@ -1194,8 +795,7 @@ describe('sorting', () => {
    */
   it('should sort utilities with a custom internal --tw-sort correctly', async () => {
     expect(
-      await run(
-        ['mx-0', 'gap-4', 'space-x-2'].sort(() => Math.random() - 0.5),
+      await compileCss(
         css`
           @theme {
             --spacing-0: 0px;
@@ -1204,18 +804,10 @@ describe('sorting', () => {
           }
           @tailwind utilities;
         `,
+        ['mx-0', 'gap-4', 'space-x-2'].sort(() => Math.random() - 0.5),
       ),
     ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-space-x-reverse: 0;
-          }
-        }
-      }
-
-      :root, :host {
+      ":root, :host {
         --spacing-0: 0px;
         --spacing-2: .5rem;
         --spacing-4: 1rem;
@@ -1239,14 +831,21 @@ describe('sorting', () => {
         syntax: "*";
         inherits: false;
         initial-value: 0;
-      }
-      "
+      }"
     `)
   })
 
   it('should sort individual logical properties later than left/right pairs', async () => {
     expect(
-      await run(
+      await compileCss(
+        css`
+          @theme {
+            --spacing-1: 1px;
+            --spacing-2: 2px;
+            --spacing-3: 3px;
+          }
+          @tailwind utilities;
+        `,
         [
           // scroll-margin
           'scroll-ms-1',
@@ -1268,18 +867,9 @@ describe('sorting', () => {
           'pe-2',
           'px-3',
         ].sort(() => Math.random() - 0.5),
-        css`
-          @theme {
-            --spacing-1: 1px;
-            --spacing-2: 2px;
-            --spacing-3: 3px;
-          }
-          @tailwind utilities;
-        `,
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --spacing-1: 1px;
         --spacing-2: 2px;
         --spacing-3: 3px;
@@ -1331,8 +921,7 @@ describe('sorting', () => {
 
       .pe-2 {
         padding-inline-end: var(--spacing-2);
-      }
-      "
+      }"
     `)
   })
 
@@ -1344,8 +933,7 @@ describe('sorting', () => {
         ),
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .pointer-events-none {
+      ".pointer-events-none {
         pointer-events: none;
       }
 
@@ -1361,8 +949,7 @@ describe('sorting', () => {
 
       .focus\\:pointer-events-none:focus {
         pointer-events: none;
-      }
-      "
+      }"
     `)
   })
 
@@ -1389,8 +976,7 @@ describe('sorting', () => {
         ),
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .flex {
+      ".flex {
         display: flex;
       }
 
@@ -1412,8 +998,7 @@ describe('sorting', () => {
 
       .disabled\\:flex:disabled {
         display: flex;
-      }
-      "
+      }"
     `)
   })
 
@@ -1442,44 +1027,43 @@ describe('sorting', () => {
         ].sort(() => Math.random() - 0.5),
       ),
     ).toMatchInlineSnapshot(`
-      "
-      @media (hover: hover) {
-        :is(:where(.group):hover .group-hover\\:flex) {
+      "@media (hover: hover) {
+        .group-hover\\:flex:is(:where(.group):hover *) {
           display: flex;
         }
       }
 
-      :is(:where(.group):focus .group-focus\\:flex) {
+      .group-focus\\:flex:is(:where(.group):focus *) {
         display: flex;
       }
 
       @media (hover: hover) {
-        :is(:where(.peer):hover ~ .peer-hover\\:flex) {
+        .peer-hover\\:flex:is(:where(.peer):hover ~ *) {
           display: flex;
         }
 
         @media (hover: hover) {
-          :is(:where(.peer):hover ~ :is(:where(.group):hover .group-hover\\:peer-hover\\:flex)), :is(:where(.group):hover :is(:where(.peer):hover ~ .peer-hover\\:group-hover\\:flex)) {
+          .group-hover\\:peer-hover\\:flex:is(:where(.group):hover *):is(:where(.peer):hover ~ *), .peer-hover\\:group-hover\\:flex:is(:where(.peer):hover ~ *):is(:where(.group):hover *) {
             display: flex;
           }
         }
 
-        :is(:where(.peer):hover ~ :is(:where(.group):focus .group-focus\\:peer-hover\\:flex)), :is(:where(.group):focus :is(:where(.peer):hover ~ .peer-hover\\:group-focus\\:flex)) {
+        .group-focus\\:peer-hover\\:flex:is(:where(.group):focus *):is(:where(.peer):hover ~ *), .peer-hover\\:group-focus\\:flex:is(:where(.peer):hover ~ *):is(:where(.group):focus *) {
           display: flex;
         }
       }
 
-      :is(:where(.peer):focus ~ .peer-focus\\:flex) {
+      .peer-focus\\:flex:is(:where(.peer):focus ~ *) {
         display: flex;
       }
 
       @media (hover: hover) {
-        :is(:where(.peer):focus ~ :is(:where(.group):hover .group-hover\\:peer-focus\\:flex)), :is(:where(.group):hover :is(:where(.peer):focus ~ .peer-focus\\:group-hover\\:flex)) {
+        .group-hover\\:peer-focus\\:flex:is(:where(.group):hover *):is(:where(.peer):focus ~ *), .peer-focus\\:group-hover\\:flex:is(:where(.peer):focus ~ *):is(:where(.group):hover *) {
           display: flex;
         }
       }
 
-      :is(:where(.peer):focus ~ :is(:where(.group):focus .group-focus\\:peer-focus\\:flex)), :is(:where(.group):focus :is(:where(.peer):focus ~ .peer-focus\\:group-focus\\:flex)) {
+      .group-focus\\:peer-focus\\:flex:is(:where(.group):focus *):is(:where(.peer):focus ~ *), .peer-focus\\:group-focus\\:flex:is(:where(.peer):focus ~ *):is(:where(.group):focus *) {
         display: flex;
       }
 
@@ -1487,16 +1071,14 @@ describe('sorting', () => {
         .hover\\:flex:hover {
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   // https://github.com/tailwindlabs/tailwindcss/issues/16973
   it('should not take undefined values into account when sorting', async () => {
     expect(
-      await run(
-        ['fancy-text', 'text-sm'],
+      await compileCss(
         css`
           @theme {
             --text-sm: 0.875rem;
@@ -1509,10 +1091,10 @@ describe('sorting', () => {
             font-weight: var(--font-weight-bold);
           }
         `,
+        ['fancy-text', 'text-sm'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --text-sm: .875rem;
         --text-sm--line-height: calc(1.25 / .875);
       }
@@ -1526,8 +1108,7 @@ describe('sorting', () => {
       .text-sm {
         font-size: var(--text-sm);
         line-height: var(--tw-leading, var(--text-sm--line-height));
-      }
-      "
+      }"
     `)
   })
 })
@@ -1535,32 +1116,29 @@ describe('sorting', () => {
 describe('Parsing theme values from CSS', () => {
   test('Can read values from `@theme`', async () => {
     expect(
-      await run(
-        ['accent-red-500'],
+      await compileCss(
         css`
           @theme {
             --color-red-500: #f00;
           }
           @tailwind utilities;
         `,
+        ['accent-red-500'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-red-500: red;
       }
 
       .accent-red-500 {
         accent-color: var(--color-red-500);
-      }
-      "
+      }"
     `)
   })
 
   test('Later values from `@theme` override earlier ones', async () => {
     expect(
-      await run(
-        ['accent-red-500'],
+      await compileCss(
         css`
           @theme {
             --color-red-500: #f00;
@@ -1568,24 +1146,22 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['accent-red-500'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-red-500: #f10;
       }
 
       .accent-red-500 {
         accent-color: var(--color-red-500);
-      }
-      "
+      }"
     `)
   })
 
   test('Multiple `@theme` blocks are merged', async () => {
     expect(
-      await run(
-        ['accent-red-500', 'accent-blue-500'],
+      await compileCss(
         css`
           @theme {
             --color-red-500: #f00;
@@ -1595,10 +1171,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['accent-red-500', 'accent-blue-500'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-red-500: red;
         --color-blue-500: #00f;
       }
@@ -1609,15 +1185,13 @@ describe('Parsing theme values from CSS', () => {
 
       .accent-red-500 {
         accent-color: var(--color-red-500);
-      }
-      "
+      }"
     `)
   })
 
   test('`@theme` values with escaped forward slashes map to unescaped slashes in candidate values', async () => {
     expect(
-      await run(
-        ['w-1/2', 'w-75%'],
+      await compileCss(
         css`
           @theme {
             /* Cursed but we want this to work */
@@ -1626,10 +1200,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['w-1/2', 'w-75%'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --width-1\\/2: 75%;
         --width-75\\%: 50%;
       }
@@ -1640,23 +1214,13 @@ describe('Parsing theme values from CSS', () => {
 
       .w-75\\% {
         width: var(--width-75\\%);
-      }
-      "
+      }"
     `)
   })
 
-  // https://github.com/tailwindlabs/tailwindcss/issues/19786
-  test('out-of-range escaped CSS variable candidates do not crash the build', async () => {
-    // Shouldn't crash
-    await run([
-      String.raw`--Coding-Projects-CharacterMapper-Master-Workspace\d8819554-4725-4235-9d22-2d0ed572e924`,
-    ])
-  })
-
   test('`@keyframes` in `@theme` are hoisted', async () => {
     expect(
-      await run(
-        ['accent-red', 'text-lg'],
+      await compileCss(
         css`
           @theme {
             --color-red: red;
@@ -1672,10 +1236,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['accent-red', 'text-lg'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-red: red;
         --text-lg: 20px;
       }
@@ -1686,15 +1250,13 @@ describe('Parsing theme values from CSS', () => {
 
       .accent-red {
         accent-color: var(--color-red);
-      }
-      "
+      }"
     `)
   })
 
   test('`@keyframes` in `@theme` are generated when name contains a new line', async () => {
     expect(
-      await run(
-        ['animate-very-long-animation-name'],
+      await compileCss(
         css`
           @theme {
             --animate-very-long-animation-name: very-long-animation-name
@@ -1712,12 +1274,11 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['animate-very-long-animation-name'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --animate-very-long-animation-name: very-long-animation-name
-                    var(--very-long-animation-name-configuration, 2.5s ease-in-out 0s infinite normal none running);
+      ":root, :host {
+        --animate-very-long-animation-name: very-long-animation-name var(--very-long-animation-name-configuration, 2.5s ease-in-out 0s infinite normal none running);
       }
 
       .animate-very-long-animation-name {
@@ -1728,15 +1289,13 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('`@theme` values can be unset', async () => {
     expect(
-      await run(
-        ['accent-red', 'accent-blue', 'accent-green', 'text-sm', 'text-md'],
+      await compileCss(
         css`
           @theme {
             --color-red: #f00;
@@ -1763,10 +1322,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['accent-red', 'accent-blue', 'accent-green', 'text-sm', 'text-md'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --text-sm: 13px;
         --color-green: #0f0;
       }
@@ -1777,15 +1336,13 @@ describe('Parsing theme values from CSS', () => {
 
       .accent-green {
         accent-color: var(--color-green);
-      }
-      "
+      }"
     `)
   })
 
   test('`@theme` values can be unset (using the escaped syntax)', async () => {
     expect(
-      await run(
-        ['accent-red', 'accent-blue', 'accent-green', 'text-sm', 'text-md'],
+      await compileCss(
         css`
           @theme {
             --color-red: #f00;
@@ -1812,10 +1369,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['accent-red', 'accent-blue', 'accent-green', 'text-sm', 'text-md'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --text-sm: 13px;
         --color-green: #0f0;
       }
@@ -1826,15 +1383,13 @@ describe('Parsing theme values from CSS', () => {
 
       .accent-green {
         accent-color: var(--color-green);
-      }
-      "
+      }"
     `)
   })
 
   test('all `@theme` values can be unset at once', async () => {
     expect(
-      await run(
-        ['accent-red', 'accent-blue', 'accent-green', 'text-sm', 'text-md'],
+      await compileCss(
         css`
           @theme {
             --color-red: #f00;
@@ -1850,24 +1405,22 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['accent-red', 'accent-blue', 'accent-green', 'text-sm', 'text-md'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-green: #0f0;
       }
 
       .accent-green {
         accent-color: var(--color-green);
-      }
-      "
+      }"
     `)
   })
 
   test('unsetting `--font-*` does not unset `--font-weight-*`', async () => {
     expect(
-      await run(
-        ['font-bold', 'font-sans', 'font-serif', 'font-body'],
+      await compileCss(
         css`
           @theme {
             --font-weight-bold: bold;
@@ -1880,18 +1433,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['font-bold', 'font-sans', 'font-serif', 'font-body'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-font-weight: initial;
-          }
-        }
-      }
-
-      :root, :host {
+      ":root, :host {
         --font-weight-bold: bold;
         --font-body: Inter;
       }
@@ -1908,15 +1453,13 @@ describe('Parsing theme values from CSS', () => {
       @property --tw-font-weight {
         syntax: "*";
         inherits: false
-      }
-      "
+      }"
     `)
   })
 
   test('unsetting `--inset-*` does not unset `--inset-shadow-*`', async () => {
     expect(
-      await run(
-        ['inset-shadow-sm', 'inset-ring-thick', 'inset-lg', 'inset-sm', 'inset-md'],
+      await compileCss(
         css`
           @theme {
             --inset-shadow-sm: inset 0 2px 4px rgb(0 0 0 / 0.05);
@@ -1929,31 +1472,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['inset-shadow-sm', 'inset-ring-thick', 'inset-lg', 'inset-sm', 'inset-md'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-shadow: 0 0 #0000;
-            --tw-shadow-color: initial;
-            --tw-shadow-alpha: 100%;
-            --tw-inset-shadow: 0 0 #0000;
-            --tw-inset-shadow-color: initial;
-            --tw-inset-shadow-alpha: 100%;
-            --tw-ring-color: initial;
-            --tw-ring-shadow: 0 0 #0000;
-            --tw-inset-ring-color: initial;
-            --tw-inset-ring-shadow: 0 0 #0000;
-            --tw-ring-inset: initial;
-            --tw-ring-offset-width: 0px;
-            --tw-ring-offset-color: #fff;
-            --tw-ring-offset-shadow: 0 0 #0000;
-          }
-        }
-      }
-
-      :root, :host {
+      ":root, :host {
         --inset-md: 50px;
       }
 
@@ -1977,12 +1499,6 @@ describe('Parsing theme values from CSS', () => {
         inherits: false
       }
 
-      @property --tw-shadow-alpha {
-        syntax: "<percentage>";
-        inherits: false;
-        initial-value: 100%;
-      }
-
       @property --tw-inset-shadow {
         syntax: "*";
         inherits: false;
@@ -1994,12 +1510,6 @@ describe('Parsing theme values from CSS', () => {
         inherits: false
       }
 
-      @property --tw-inset-shadow-alpha {
-        syntax: "<percentage>";
-        inherits: false;
-        initial-value: 100%;
-      }
-
       @property --tw-ring-color {
         syntax: "*";
         inherits: false
@@ -2043,22 +1553,13 @@ describe('Parsing theme values from CSS', () => {
         syntax: "*";
         inherits: false;
         initial-value: 0 0 #0000;
-      }
-      "
+      }"
     `)
   })
 
   test('unsetting `--text-*` does not unset `--text-color-*`, `--text-underline-offset-*`, `--text-indent-*`, `--text-decoration-thickness-*` or `--text-decoration-color-*`', async () => {
     expect(
-      await run(
-        [
-          'text-potato',
-          'underline-offset-potato',
-          'indent-potato',
-          'decoration-potato',
-          'decoration-salad',
-          'text-lg',
-        ],
+      await compileCss(
         css`
           @theme {
             --text-color-potato: brown;
@@ -2074,10 +1575,17 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        [
+          'text-potato',
+          'underline-offset-potato',
+          'indent-potato',
+          'decoration-potato',
+          'decoration-salad',
+          'text-lg',
+        ],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --text-color-potato: brown;
         --text-underline-offset-potato: 4px;
         --text-indent-potato: 6px;
@@ -2110,15 +1618,13 @@ describe('Parsing theme values from CSS', () => {
 
       .underline-offset-potato {
         text-underline-offset: var(--text-underline-offset-potato);
-      }
-      "
+      }"
     `)
   })
 
   test('unused keyframes are removed when an animation is unset', async () => {
     expect(
-      await run(
-        ['animate-foo', 'animate-foobar'],
+      await compileCss(
         css`
           @theme {
             --animate-foo: foo 1s infinite;
@@ -2141,10 +1647,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['animate-foo', 'animate-foobar'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --animate-foobar: foobar 1s infinite;
       }
 
@@ -2156,15 +1662,13 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 0;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('keyframes are generated when used in an animation', async () => {
     expect(
-      await run(
-        ['animate-foo'],
+      await compileCss(
         css`
           @theme {
             --animate-foo: used 1s infinite;
@@ -2185,10 +1689,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --animate-foo: used 1s infinite;
       }
 
@@ -2200,15 +1704,13 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('keyframes are generated when used in an animation within a prefixed setup', async () => {
     expect(
-      await run(
-        ['tw:animate-foo'],
+      await compileCss(
         css`
           @theme prefix(tw) {
             --animate-foo: used 1s infinite;
@@ -2229,10 +1731,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['tw:animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --tw-animate-foo: used 1s infinite;
       }
 
@@ -2244,40 +1746,39 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom properties are generated when used from a CSS var with a prefixed setup', async () => {
     expect(
-      await compileCss(css`
-        @theme prefix(tw) {
-          --color-tomato: #e10c04;
-        }
-        @tailwind utilities;
-        .red {
-          color: var(--tw-color-tomato);
-        }
-      `),
+      await compileCss(
+        css`
+          @theme prefix(tw) {
+            --color-tomato: #e10c04;
+          }
+          @tailwind utilities;
+          .red {
+            color: var(--tw-color-tomato);
+          }
+        `,
+        [],
+      ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --tw-color-tomato: #e10c04;
       }
 
       .red {
         color: var(--tw-color-tomato);
-      }
-      "
+      }"
     `)
   })
 
   // https://github.com/tailwindlabs/tailwindcss/issues/16374
   test('custom properties in keyframes preserved', async () => {
     expect(
-      await run(
-        ['animate-foo'],
+      await compileCss(
         css`
           @theme {
             --animate-foo: used 1s infinite;
@@ -2292,10 +1793,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --animate-foo: used 1s infinite;
       }
 
@@ -2308,15 +1809,13 @@ describe('Parsing theme values from CSS', () => {
           --other: var(--angle);
           --angle: 360deg;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('keyframes are generated when used in an animation using `@theme inline`', async () => {
     expect(
-      await run(
-        ['animate-foo'],
+      await compileCss(
         css`
           @theme inline {
             --animate-foo: used 1s infinite;
@@ -2337,10 +1836,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .animate-foo {
+      ".animate-foo {
         animation: 1s infinite used;
       }
 
@@ -2348,15 +1847,13 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('keyframes are generated when used in an animation using `@theme static`', async () => {
     expect(
-      await run(
-        ['animate-foo'],
+      await compileCss(
         css`
           @theme static {
             --animate-foo: used 1s infinite;
@@ -2377,10 +1874,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --animate-foo: used 1s infinite;
         --animate-bar: unused-but-kept 1s infinite;
       }
@@ -2399,37 +1896,38 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 0;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('keyframes are generated when used in user CSS', async () => {
     expect(
-      await compileCss(css`
-        @theme {
-          @keyframes used {
-            to {
-              opacity: 1;
+      await compileCss(
+        css`
+          @theme {
+            @keyframes used {
+              to {
+                opacity: 1;
+              }
+            }
+
+            @keyframes unused {
+              to {
+                opacity: 0;
+              }
             }
           }
 
-          @keyframes unused {
-            to {
-              opacity: 0;
-            }
+          .foo {
+            animation: used 1s infinite;
           }
-        }
 
-        .foo {
-          animation: used 1s infinite;
-        }
-
-        @tailwind utilities;
-      `),
+          @tailwind utilities;
+        `,
+        [],
+      ),
     ).toMatchInlineSnapshot(`
-      "
-      .foo {
+      ".foo {
         animation: 1s infinite used;
       }
 
@@ -2437,16 +1935,14 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   // https://github.com/tailwindlabs/tailwindcss/issues/17332
   test('extracts keyframe names followed by comma', async () => {
     expect(
-      await run(
-        ['animate-test'],
+      await compileCss(
         css`
           @theme {
             --animate-test: 500ms both fade-in, 1000ms linear 500ms spin infinite;
@@ -2463,10 +1959,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['animate-test'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --animate-test: .5s both fade-in, 1s linear .5s spin infinite;
       }
 
@@ -2482,37 +1978,38 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('keyframes outside of `@theme are always preserved', async () => {
     expect(
-      await compileCss(css`
-        @theme {
-          @keyframes used {
-            to {
-              opacity: 1;
+      await compileCss(
+        css`
+          @theme {
+            @keyframes used {
+              to {
+                opacity: 1;
+              }
             }
           }
-        }
 
-        @keyframes unused {
-          to {
-            opacity: 0;
+          @keyframes unused {
+            to {
+              opacity: 0;
+            }
           }
-        }
 
-        .foo {
-          animation: used 1s infinite;
-        }
+          .foo {
+            animation: used 1s infinite;
+          }
 
-        @tailwind utilities;
-      `),
+          @tailwind utilities;
+        `,
+        [],
+      ),
     ).toMatchInlineSnapshot(`
-      "
-      @keyframes unused {
+      "@keyframes unused {
         to {
           opacity: 0;
         }
@@ -2526,15 +2023,13 @@ describe('Parsing theme values from CSS', () => {
         to {
           opacity: 1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('theme values added as reference are not included in the output as variables but emit fallback values', async () => {
     expect(
-      await run(
-        ['bg-tomato', 'bg-potato'],
+      await compileCss(
         css`
           @theme {
             --color-tomato: #e10c04;
@@ -2544,10 +2039,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-tomato: #e10c04;
       }
 
@@ -2557,15 +2052,13 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: var(--color-tomato);
-      }
-      "
+      }"
     `)
   })
 
   test('`@keyframes` added in `@theme reference` should not be emitted', async () => {
     return expect(
-      await run(
-        ['animate-foo'],
+      await compileCss(
         css`
           @theme reference {
             --animate-foo: foo 1s infinite;
@@ -2582,10 +2075,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .animate-foo {
+      ".animate-foo {
         animation: var(--animate-foo, foo 1s infinite);
       }
 
@@ -2597,15 +2090,13 @@ describe('Parsing theme values from CSS', () => {
         50% {
           color: #00f;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('`@keyframes` added in `@theme reference` should not be emitted, even if another `@theme` block exists', async () => {
     return expect(
-      await run(
-        ['bg-pink', 'animate-foo'],
+      await compileCss(
         css`
           @theme reference {
             --animate-foo: foo 1s infinite;
@@ -2627,10 +2118,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-pink', 'animate-foo'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-pink: pink;
       }
 
@@ -2650,15 +2141,13 @@ describe('Parsing theme values from CSS', () => {
         50% {
           color: #00f;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('theme values added as reference that override existing theme value suppress the output of the original theme value as a variable', async () => {
     expect(
-      await run(
-        ['bg-potato'],
+      await compileCss(
         css`
           @theme {
             --color-potato: #ac855b;
@@ -2668,20 +2157,18 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: var(--color-potato, #c794aa);
-      }
-      "
+      }"
     `)
   })
 
   test('overriding a reference theme value with a non-reference theme value includes it in the output as a variable', async () => {
     expect(
-      await run(
-        ['bg-potato'],
+      await compileCss(
         css`
           @theme reference {
             --color-potato: #ac855b;
@@ -2691,24 +2178,22 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-potato: #c794aa;
       }
 
       .bg-potato {
         background-color: var(--color-potato);
-      }
-      "
+      }"
     `)
   })
 
   test('wrapping `@theme` with `@media reference` behaves like `@theme reference` to support `@import` statements', async () => {
     expect(
-      await run(
-        ['bg-tomato', 'bg-potato', 'bg-avocado'],
+      await compileCss(
         css`
           @theme {
             --color-tomato: #e10c04;
@@ -2723,10 +2208,10 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato', 'bg-avocado'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-tomato: #e10c04;
       }
 
@@ -2740,23 +2225,20 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: var(--color-tomato);
-      }
-      "
+      }"
     `)
   })
 
   test('`@import "tailwindcss" theme(static)` will always generate theme values, regardless of whether they were used or not', async () => {
     expect(
-      await run(
-        ['bg-tomato'],
+      await compileCss(
         css`
           @import 'tailwindcss' theme(static);
         `,
+        ['bg-tomato'],
         {
           async loadStylesheet() {
             return {
-              path: '',
-              base: '',
               content: css`
                 @theme {
                   --color-tomato: #e10c04;
@@ -2766,13 +2248,13 @@ describe('Parsing theme values from CSS', () => {
 
                 @tailwind utilities;
               `,
+              base: '',
             }
           },
         },
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-tomato: #e10c04;
         --color-potato: #ac855b;
         --color-primary: var(--primary);
@@ -2780,15 +2262,13 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: var(--color-tomato);
-      }
-      "
+      }"
     `)
   })
 
   test('`@media theme(reference)` can only contain `@theme` rules', () => {
     return expect(
-      run(
-        ['bg-tomato', 'bg-potato', 'bg-avocado'],
+      compileCss(
         css`
           @media theme(reference) {
             .not-a-theme-rule {
@@ -2797,6 +2277,7 @@ describe('Parsing theme values from CSS', () => {
           }
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato', 'bg-avocado'],
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
       `
@@ -2808,8 +2289,7 @@ describe('Parsing theme values from CSS', () => {
 
   test('theme values added as `inline` are not wrapped in `var(…)` when used as utility values', async () => {
     expect(
-      await run(
-        ['bg-tomato', 'bg-potato', 'bg-primary'],
+      await compileCss(
         css`
           @theme inline {
             --color-tomato: #e10c04;
@@ -2819,10 +2299,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato', 'bg-primary'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: #ac855b;
       }
 
@@ -2832,23 +2312,20 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: #e10c04;
-      }
-      "
+      }"
     `)
   })
 
   test('`@import "tailwindcss" theme(inline)` theme values added as `inline` are not wrapped in `var(…)` when used as utility values', async () => {
     expect(
-      await run(
-        ['bg-tomato'],
+      await compileCss(
         css`
           @import 'tailwindcss' theme(inline);
         `,
+        ['bg-tomato'],
         {
           async loadStylesheet() {
             return {
-              path: '',
-              base: '',
               content: css`
                 @theme {
                   --color-tomato: #e10c04;
@@ -2858,23 +2335,21 @@ describe('Parsing theme values from CSS', () => {
 
                 @tailwind utilities;
               `,
+              base: '',
             }
           },
         },
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-tomato {
+      ".bg-tomato {
         background-color: #e10c04;
-      }
-      "
+      }"
     `)
   })
 
   test('theme values added as `static` will always be generated, regardless of whether they were used or not', async () => {
     expect(
-      await run(
-        ['bg-tomato'],
+      await compileCss(
         css`
           @theme static {
             --color-tomato: #e10c04;
@@ -2884,10 +2359,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-tomato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-tomato: #e10c04;
         --color-potato: #ac855b;
         --color-primary: var(--primary);
@@ -2895,15 +2370,13 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: var(--color-tomato);
-      }
-      "
+      }"
     `)
   })
 
   test('when no theme values are emitted, empty layers can be removed', async () => {
     expect(
-      await run(
-        ['underline'],
+      await compileCss(
         css`
           @layer theme1 {
             @layer theme2 {
@@ -2916,20 +2389,18 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['underline'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .underline {
+      ".underline {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
   test('wrapping `@theme` with `@media theme(inline)` behaves like `@theme inline` to support `@import` statements', async () => {
     expect(
-      await run(
-        ['bg-tomato', 'bg-potato', 'bg-primary'],
+      await compileCss(
         css`
           @media theme(inline) {
             @theme {
@@ -2941,10 +2412,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato', 'bg-primary'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: #ac855b;
       }
 
@@ -2954,15 +2425,13 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: #e10c04;
-      }
-      "
+      }"
     `)
   })
 
   test('`inline` and `reference` can be used together', async () => {
     expect(
-      await run(
-        ['bg-tomato', 'bg-potato', 'bg-primary'],
+      await compileCss(
         css`
           @theme reference inline {
             --color-tomato: #e10c04;
@@ -2972,10 +2441,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato', 'bg-primary'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: #ac855b;
       }
 
@@ -2985,15 +2454,13 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: #e10c04;
-      }
-      "
+      }"
     `)
   })
 
   test('`inline` and `reference` can be used together in `media(…)`', async () => {
     expect(
-      await run(
-        ['bg-tomato', 'bg-potato', 'bg-primary'],
+      await compileCss(
         css`
           @media theme(reference inline) {
             @theme {
@@ -3005,10 +2472,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-tomato', 'bg-potato', 'bg-primary'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: #ac855b;
       }
 
@@ -3018,15 +2485,13 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: #e10c04;
-      }
-      "
+      }"
     `)
   })
 
   test('`default` theme values can be overridden by regular theme values`', async () => {
     expect(
-      await run(
-        ['bg-potato'],
+      await compileCss(
         css`
           @theme {
             --color-potato: #ac855b;
@@ -3037,24 +2502,22 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-potato: #ac855b;
       }
 
       .bg-potato {
         background-color: var(--color-potato);
-      }
-      "
+      }"
     `)
   })
 
   test('`default` and `inline` can be used together', async () => {
     expect(
-      await run(
-        ['bg-potato'],
+      await compileCss(
         css`
           @theme default inline {
             --color-potato: #efb46b;
@@ -3062,20 +2525,18 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: #efb46b;
-      }
-      "
+      }"
     `)
   })
 
   test('`default` and `reference` can be used together', async () => {
     expect(
-      await run(
-        ['bg-potato'],
+      await compileCss(
         css`
           @theme default reference {
             --color-potato: #efb46b;
@@ -3083,20 +2544,18 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: var(--color-potato, #efb46b);
-      }
-      "
+      }"
     `)
   })
 
   test('`default`, `inline`, and `reference` can be used together', async () => {
     expect(
-      await run(
-        ['bg-potato'],
+      await compileCss(
         css`
           @theme default reference inline {
             --color-potato: #efb46b;
@@ -3104,20 +2563,18 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-potato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bg-potato {
+      ".bg-potato {
         background-color: #efb46b;
-      }
-      "
+      }"
     `)
   })
 
   test('`default` can be used in `media(…)`', async () => {
     expect(
-      await run(
-        ['bg-potato', 'bg-tomato'],
+      await compileCss(
         css`
           @media theme() {
             @theme {
@@ -3133,10 +2590,10 @@ describe('Parsing theme values from CSS', () => {
 
           @tailwind utilities;
         `,
+        ['bg-potato', 'bg-tomato'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --color-potato: #ac855b;
         --color-tomato: tomato;
       }
@@ -3147,47 +2604,43 @@ describe('Parsing theme values from CSS', () => {
 
       .bg-tomato {
         background-color: var(--color-tomato);
-      }
-      "
+      }"
     `)
   })
 
   test('`default` theme values can be overridden by plugin theme values', async () => {
-    expect(
-      await run(
-        ['text-red', 'text-orange'],
-        css`
-          @theme default {
-            --color-red: red;
-          }
-          @theme {
-            --color-orange: orange;
-          }
-          @plugin "my-plugin";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => {
-            return {
-              path: '',
-              base: '/root',
-              module: plugin(({}) => {}, {
-                theme: {
-                  extend: {
-                    colors: {
-                      red: 'tomato',
-                      orange: '#f28500',
-                    },
+    let { build } = await compile(
+      css`
+        @theme default {
+          --color-red: red;
+        }
+        @theme {
+          --color-orange: orange;
+        }
+        @plugin "my-plugin";
+        @tailwind utilities;
+      `,
+      {
+        loadModule: async () => {
+          return {
+            module: plugin(({}) => {}, {
+              theme: {
+                extend: {
+                  colors: {
+                    red: 'tomato',
+                    orange: '#f28500',
                   },
                 },
-              }),
-            }
-          },
+              },
+            }),
+            base: '/root',
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      },
+    )
+
+    expect(optimizeCss(build(['text-red', 'text-orange'])).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --color-orange: orange;
       }
 
@@ -3197,47 +2650,43 @@ describe('Parsing theme values from CSS', () => {
 
       .text-red {
         color: tomato;
-      }
-      "
+      }"
     `)
   })
 
   test('`default` theme values can be overridden by config theme values', async () => {
-    expect(
-      await run(
-        ['text-red', 'text-orange'],
-        css`
-          @theme default {
-            --color-red: red;
-          }
-          @theme {
-            --color-orange: orange;
-          }
-          @config "./my-config.js";
-          @tailwind utilities;
-        `,
-        {
-          loadModule: async () => {
-            return {
-              path: '',
-              base: '/root',
-              module: {
-                theme: {
-                  extend: {
-                    colors: {
-                      red: 'tomato',
-                      orange: '#f28500',
-                    },
+    let { build } = await compile(
+      css`
+        @theme default {
+          --color-red: red;
+        }
+        @theme {
+          --color-orange: orange;
+        }
+        @config "./my-config.js";
+        @tailwind utilities;
+      `,
+      {
+        loadModule: async () => {
+          return {
+            module: {
+              theme: {
+                extend: {
+                  colors: {
+                    red: 'tomato',
+                    orange: '#f28500',
                   },
                 },
               },
-            }
-          },
+            },
+            base: '/root',
+          }
         },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      },
+    )
+
+    expect(optimizeCss(build(['text-red', 'text-orange'])).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --color-orange: orange;
       }
 
@@ -3247,42 +2696,40 @@ describe('Parsing theme values from CSS', () => {
 
       .text-red {
         color: tomato;
-      }
-      "
+      }"
     `)
   })
 
   test('only emits theme variables that are used outside of being defined by another variable', async () => {
-    expect(
-      await run(
-        ['get-var-b', 'get-var-two'],
-        css`
-          @theme {
-            --var-a: var(--var-b);
-            --var-b: var(--var-c);
-            --var-c: var(--var-d);
-            --var-d: red;
+    let { build } = await compile(
+      css`
+        @theme {
+          --var-a: var(--var-b);
+          --var-b: var(--var-c);
+          --var-c: var(--var-d);
+          --var-d: red;
 
-            --var-four: green;
-            --var-three: var(--var-four);
-            --var-two: var(--var-three);
-            --var-one: var(--var-two);
+          --var-four: green;
+          --var-three: var(--var-four);
+          --var-two: var(--var-three);
+          --var-one: var(--var-two);
 
-            --var-eins: var(--var-zwei);
-            --var-zwei: var(--var-drei);
-            --var-drei: var(--var-vier);
-            --var-vier: blue;
-          }
+          --var-eins: var(--var-zwei);
+          --var-zwei: var(--var-drei);
+          --var-drei: var(--var-vier);
+          --var-vier: blue;
+        }
 
-          @utility get-var-* {
-            color: --value(--var-\*);
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+        @utility get-var-* {
+          color: --value(--var-\*);
+        }
+        @tailwind utilities;
+      `,
+      {},
+    )
+
+    expect(optimizeCss(build(['get-var-b', 'get-var-two'])).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --var-b: var(--var-c);
         --var-c: var(--var-d);
         --var-d: red;
@@ -3297,8 +2744,7 @@ describe('Parsing theme values from CSS', () => {
 
       .get-var-two {
         color: var(--var-two);
-      }
-      "
+      }"
     `)
   })
 })
@@ -3312,18 +2758,17 @@ describe('plugins', () => {
         `,
         {
           loadModule: async () => ({
-            path: '',
-            base: '/root',
             module: ({ addVariant }: PluginAPI) => {
               addVariant('hocus', '&:hover, &:focus')
             },
+            base: '/root',
           }),
         },
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(`[Error: \`@plugin\` must have a path.]`)
   })
 
-  test('@plugin cannot have an empty path', () => {
+  test('@plugin can not have an empty path', () => {
     return expect(
       compile(
         css`
@@ -3331,11 +2776,10 @@ describe('plugins', () => {
         `,
         {
           loadModule: async () => ({
-            path: '',
-            base: '/root',
             module: ({ addVariant }: PluginAPI) => {
               addVariant('hocus', '&:hover, &:focus')
             },
+            base: '/root',
           }),
         },
       ),
@@ -3352,11 +2796,10 @@ describe('plugins', () => {
         `,
         {
           loadModule: async () => ({
-            path: '',
-            base: '/root',
             module: ({ addVariant }: PluginAPI) => {
               addVariant('hocus', '&:hover, &:focus')
             },
+            base: '/root',
           }),
         },
       ),
@@ -3366,41 +2809,39 @@ describe('plugins', () => {
   test('@plugin can accept options', async () => {
     expect.hasAssertions()
 
-    expect(
-      await run(
-        ['text-primary'],
-        css`
-          @tailwind utilities;
-          @plugin "my-plugin" {
-            color: red;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: plugin.withOptions((options) => {
-              expect(options).toEqual({
-                color: 'red',
-              })
+    let { build } = await compile(
+      css`
+        @tailwind utilities;
+        @plugin "my-plugin" {
+          color: red;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: plugin.withOptions((options) => {
+            expect(options).toEqual({
+              color: 'red',
+            })
 
-              return ({ addUtilities }) => {
-                addUtilities({
-                  '.text-primary': {
-                    color: options.color,
-                  },
-                })
-              }
-            }),
+            return ({ addUtilities }) => {
+              addUtilities({
+                '.text-primary': {
+                  color: options.color,
+                },
+              })
+            }
           }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .text-primary {
+          base: '/root',
+        }),
+      },
+    )
+
+    let compiled = build(['text-primary'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      ".text-primary {
         color: red;
-      }
-      "
+      }"
     `)
   })
 
@@ -3429,8 +2870,6 @@ describe('plugins', () => {
       `,
       {
         loadModule: async () => ({
-          path: '',
-          base: '/root',
           module: plugin.withOptions((options) => {
             expect(options).toEqual({
               'is-null': null,
@@ -3451,6 +2890,7 @@ describe('plugins', () => {
 
             return () => {}
           }),
+          base: '/root',
         }),
       },
     )
@@ -3470,8 +2910,6 @@ describe('plugins', () => {
         `,
         {
           loadModule: async () => ({
-            path: '',
-            base: '/root',
             module: plugin.withOptions((options) => {
               return ({ addUtilities }) => {
                 addUtilities({
@@ -3481,6 +2919,7 @@ describe('plugins', () => {
                 })
               }
             }),
+            base: '/root',
           }),
         },
       ),
@@ -3509,8 +2948,6 @@ describe('plugins', () => {
         `,
         {
           loadModule: async () => ({
-            path: '',
-            base: '/root',
             module: plugin(({ addUtilities }) => {
               addUtilities({
                 '.text-primary': {
@@ -3518,6 +2955,7 @@ describe('plugins', () => {
                 },
               })
             }),
+            base: '/root',
           }),
         },
       ),
@@ -3535,11 +2973,7 @@ describe('plugins', () => {
           }
         `,
         {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: plugin(() => {}),
-          }),
+          loadModule: async () => ({ module: plugin(() => {}), base: '/root' }),
         },
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
@@ -3560,11 +2994,7 @@ describe('plugins', () => {
           }
         `,
         {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: plugin(() => {}),
-          }),
+          loadModule: async () => ({ module: plugin(() => {}), base: '/root' }),
         },
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(`
@@ -3579,148 +3009,138 @@ describe('plugins', () => {
   })
 
   test('addVariant with string selector', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: ({ addVariant }: PluginAPI) => {
-              addVariant('hocus', '&:hover, &:focus')
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:is(:where(.group):hover, :where(.group):focus) .group-hocus\\:flex) {
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: ({ addVariant }: PluginAPI) => {
+            addVariant('hocus', '&:hover, &:focus')
+          },
+          base: '/root',
+        }),
+      },
+    )
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        .group-hocus\\:flex:is(:is(:where(.group):hover, :where(.group):focus) *) {
           display: flex;
         }
 
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with array of selectors', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: ({ addVariant }: PluginAPI) => {
-              addVariant('hocus', ['&:hover', '&:focus'])
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:where(.group):hover .group-hocus\\:flex), :is(:where(.group):focus .group-hocus\\:flex) {
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: ({ addVariant }: PluginAPI) => {
+            addVariant('hocus', ['&:hover', '&:focus'])
+          },
+          base: '/root',
+        }),
+      },
+    )
+
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        .group-hocus\\:flex:is(:where(.group):hover *), .group-hocus\\:flex:is(:where(.group):focus *) {
           display: flex;
         }
 
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with object syntax and @slot', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: ({ addVariant }: PluginAPI) => {
-              addVariant('hocus', {
-                '&:hover': '@slot',
-                '&:focus': '@slot',
-              })
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        :is(:where(.group):hover .group-hocus\\:flex), :is(:where(.group):focus .group-hocus\\:flex) {
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: ({ addVariant }: PluginAPI) => {
+            addVariant('hocus', {
+              '&:hover': '@slot',
+              '&:focus': '@slot',
+            })
+          },
+          base: '/root',
+        }),
+      },
+    )
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
+        .group-hocus\\:flex:is(:where(.group):hover *), .group-hocus\\:flex:is(:where(.group):focus *) {
           display: flex;
         }
 
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('addVariant with object syntax, media, nesting and multiple @slot', async () => {
-    expect(
-      await run(
-        ['hocus:underline', 'group-hocus:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: ({ addVariant }: PluginAPI) => {
-              addVariant('hocus', {
-                '@media (hover: hover)': {
-                  '&:hover': '@slot',
-                },
-                '&:focus': '@slot',
-              })
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: ({ addVariant }: PluginAPI) => {
+            addVariant('hocus', {
+              '@media (hover: hover)': {
+                '&:hover': '@slot',
+              },
+              '&:focus': '@slot',
+            })
+          },
+          base: '/root',
+        }),
+      },
+    )
+    let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         @media (hover: hover) {
-          :is(:where(.group):hover .group-hocus\\:flex) {
+          .group-hocus\\:flex:is(:where(.group):hover *) {
             display: flex;
           }
         }
 
-        :is(:where(.group):focus .group-hocus\\:flex) {
+        .group-hocus\\:flex:is(:where(.group):focus *) {
           display: flex;
         }
 
@@ -3733,40 +3153,37 @@ describe('plugins', () => {
         .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('@slot is preserved when used as a custom property value', async () => {
-    expect(
-      await run(
-        ['hocus:underline'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: ({ addVariant }: PluginAPI) => {
-              addVariant('hocus', {
-                '&': {
-                  '--custom-property': '@slot',
-                  '&:hover': '@slot',
-                  '&:focus': '@slot',
-                },
-              })
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: ({ addVariant }: PluginAPI) => {
+            addVariant('hocus', {
+              '&': {
+                '--custom-property': '@slot',
+                '&:hover': '@slot',
+                '&:focus': '@slot',
+              },
+            })
+          },
+          base: '/root',
+        }),
+      },
+    )
+    let compiled = build(['hocus:underline'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .hocus\\:underline {
           --custom-property: @slot;
         }
@@ -3774,36 +3191,35 @@ describe('plugins', () => {
         .hocus\\:underline:hover, .hocus\\:underline:focus {
           text-decoration-line: underline;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('built-in variants can be overridden while keeping their order', async () => {
-    expect(
-      await run(
-        // Make sure the order does not change by including the variants
-        // immediately before and after `dark`
-        ['rtl:flex', 'dark:flex', 'starting:flex'],
-        css`
-          @plugin "my-plugin";
-          @layer utilities {
-            @tailwind utilities;
-          }
-        `,
-        {
-          loadModule: async () => ({
-            path: '',
-            base: '/root',
-            module: ({ addVariant }: PluginAPI) => {
-              addVariant('dark', '&:is([data-theme=dark] *)')
-            },
-          }),
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+    let { build } = await compile(
+      css`
+        @plugin "my-plugin";
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `,
+      {
+        loadModule: async () => ({
+          module: ({ addVariant }: PluginAPI) => {
+            addVariant('dark', '&:is([data-theme=dark] *)')
+          },
+          base: '/root',
+        }),
+      },
+    )
+    let compiled = build(
+      // Make sure the order does not change by including the variants
+      // immediately before and after `dark`
+      ['rtl:flex', 'dark:flex', 'starting:flex'],
+    )
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .rtl\\:flex:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *), .dark\\:flex:is([data-theme="dark"] *) {
           display: flex;
         }
@@ -3813,26 +3229,25 @@ describe('plugins', () => {
             display: flex;
           }
         }
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('@source', () => {
   test('emits @source files', async () => {
-    let { sources } = await compile(
+    let { globs } = await compile(
       css`
         @source "./foo/bar/*.ts";
       `,
       { base: '/root' },
     )
 
-    expect(sources).toEqual([{ pattern: './foo/bar/*.ts', base: '/root', negated: false }])
+    expect(globs).toEqual([{ pattern: './foo/bar/*.ts', base: '/root' }])
   })
 
   test('emits multiple @source files', async () => {
-    let { sources } = await compile(
+    let { globs } = await compile(
       css`
         @source "./foo/**/*.ts";
         @source "./php/secr3t/smarty.php";
@@ -3840,37 +3255,24 @@ describe('@source', () => {
       { base: '/root' },
     )
 
-    expect(sources).toEqual([
-      { pattern: './foo/**/*.ts', base: '/root', negated: false },
-      { pattern: './php/secr3t/smarty.php', base: '/root', negated: false },
-    ])
-  })
-
-  test('emits negated @source files', async () => {
-    let { sources } = await compile(
-      css`
-        @source not "./foo/**/*.ts";
-        @source not "./php/secr3t/smarty.php";
-      `,
-      { base: '/root' },
-    )
-
-    expect(sources).toEqual([
-      { pattern: './foo/**/*.ts', base: '/root', negated: true },
-      { pattern: './php/secr3t/smarty.php', base: '/root', negated: true },
+    expect(globs).toEqual([
+      { pattern: './foo/**/*.ts', base: '/root' },
+      { pattern: './php/secr3t/smarty.php', base: '/root' },
     ])
   })
 
   describe('@source inline(…)', () => {
     test('always includes the candidate', async () => {
-      expect(
-        await compileCss(css`
+      let { build } = await compile(
+        css`
           @source inline("underline");
           @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .underline {
+        `,
+        { base: '/root' },
+      )
+
+      expect(build([])).toMatchInlineSnapshot(`
+        ".underline {
           text-decoration-line: underline;
         }
         "
@@ -3878,8 +3280,8 @@ describe('@source', () => {
     })
 
     test('applies brace expansion', async () => {
-      expect(
-        await compileCss(css`
+      let { build } = await compile(
+        css`
           @theme {
             --color-red-50: oklch(0.971 0.013 17.38);
             --color-red-100: oklch(0.936 0.032 17.717);
@@ -3895,63 +3297,54 @@ describe('@source', () => {
           }
           @source inline("bg-red-{50,{100..900..100},950}");
           @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :root, :host {
-          --color-red-50: oklch(97.1% .013 17.38);
-          --color-red-100: oklch(93.6% .032 17.717);
-          --color-red-200: oklch(88.5% .062 18.334);
-          --color-red-300: oklch(80.8% .114 19.571);
-          --color-red-400: oklch(70.4% .191 22.216);
-          --color-red-500: oklch(63.7% .237 25.331);
-          --color-red-600: oklch(57.7% .245 27.325);
-          --color-red-700: oklch(50.5% .213 27.518);
-          --color-red-800: oklch(44.4% .177 26.899);
-          --color-red-900: oklch(39.6% .141 25.723);
-          --color-red-950: oklch(25.8% .092 26.042);
-        }
+        `,
+        { base: '/root' },
+      )
 
+      expect(build([])).toMatchInlineSnapshot(`
+        ":root, :host {
+          --color-red-50: oklch(0.971 0.013 17.38);
+          --color-red-100: oklch(0.936 0.032 17.717);
+          --color-red-200: oklch(0.885 0.062 18.334);
+          --color-red-300: oklch(0.808 0.114 19.571);
+          --color-red-400: oklch(0.704 0.191 22.216);
+          --color-red-500: oklch(0.637 0.237 25.331);
+          --color-red-600: oklch(0.577 0.245 27.325);
+          --color-red-700: oklch(0.505 0.213 27.518);
+          --color-red-800: oklch(0.444 0.177 26.899);
+          --color-red-900: oklch(0.396 0.141 25.723);
+          --color-red-950: oklch(0.258 0.092 26.042);
+        }
         .bg-red-50 {
           background-color: var(--color-red-50);
         }
-
         .bg-red-100 {
           background-color: var(--color-red-100);
         }
-
         .bg-red-200 {
           background-color: var(--color-red-200);
         }
-
         .bg-red-300 {
           background-color: var(--color-red-300);
         }
-
         .bg-red-400 {
           background-color: var(--color-red-400);
         }
-
         .bg-red-500 {
           background-color: var(--color-red-500);
         }
-
         .bg-red-600 {
           background-color: var(--color-red-600);
         }
-
         .bg-red-700 {
           background-color: var(--color-red-700);
         }
-
         .bg-red-800 {
           background-color: var(--color-red-800);
         }
-
         .bg-red-900 {
           background-color: var(--color-red-900);
         }
-
         .bg-red-950 {
           background-color: var(--color-red-950);
         }
@@ -3960,30 +3353,29 @@ describe('@source', () => {
     })
 
     test('adds multiple inline sources separated by spaces', async () => {
-      expect(
-        await compileCss(css`
+      let { build } = await compile(
+        css`
           @theme {
             --color-red-100: oklch(0.936 0.032 17.717);
             --color-red-200: oklch(0.885 0.062 18.334);
           }
           @source inline("block bg-red-{100..200..100}");
           @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        :root, :host {
-          --color-red-100: oklch(93.6% .032 17.717);
-          --color-red-200: oklch(88.5% .062 18.334);
-        }
+        `,
+        { base: '/root' },
+      )
 
+      expect(build([])).toMatchInlineSnapshot(`
+        ":root, :host {
+          --color-red-100: oklch(0.936 0.032 17.717);
+          --color-red-200: oklch(0.885 0.062 18.334);
+        }
         .block {
           display: block;
         }
-
         .bg-red-100 {
           background-color: var(--color-red-100);
         }
-
         .bg-red-200 {
           background-color: var(--color-red-200);
         }
@@ -3992,90 +3384,59 @@ describe('@source', () => {
     })
 
     test('ignores invalid inline candidates', async () => {
-      expect(
-        await compileCss(css`
+      let { build } = await compile(
+        css`
           @source inline("my-cucumber");
           @tailwind utilities;
-        `),
-      ).toEqual('')
+        `,
+        { base: '/root' },
+      )
+
+      expect(build([])).toMatchInlineSnapshot(`""`)
     })
 
     test('can be negated', async () => {
-      expect(
-        await run(
-          ['container'],
-          css`
-            @theme {
-              --breakpoint-sm: 40rem;
-              --breakpoint-md: 48rem;
-              --breakpoint-lg: 64rem;
-              --breakpoint-xl: 80rem;
-              --breakpoint-2xl: 96rem;
-            }
-            @source not inline("container");
-            @tailwind utilities;
-          `,
-        ),
-      ).toEqual('')
+      let { build } = await compile(
+        css`
+          @theme {
+            --breakpoint-sm: 40rem;
+            --breakpoint-md: 48rem;
+            --breakpoint-lg: 64rem;
+            --breakpoint-xl: 80rem;
+            --breakpoint-2xl: 96rem;
+          }
+          @source not inline("container");
+          @tailwind utilities;
+        `,
+        { base: '/root' },
+      )
+
+      expect(build(['container'])).toMatchInlineSnapshot(`""`)
     })
 
     test('applies brace expansion to negated sources', async () => {
-      expect(
-        await run(
-          ['bg-red-500', 'bg-red-700'],
-          css`
-            @theme {
-              --color-red-50: oklch(0.971 0.013 17.38);
-              --color-red-100: oklch(0.936 0.032 17.717);
-              --color-red-200: oklch(0.885 0.062 18.334);
-              --color-red-300: oklch(0.808 0.114 19.571);
-              --color-red-400: oklch(0.704 0.191 22.216);
-              --color-red-500: oklch(0.637 0.237 25.331);
-              --color-red-600: oklch(0.577 0.245 27.325);
-              --color-red-700: oklch(0.505 0.213 27.518);
-              --color-red-800: oklch(0.444 0.177 26.899);
-              --color-red-900: oklch(0.396 0.141 25.723);
-              --color-red-950: oklch(0.258 0.092 26.042);
-            }
-            @source not inline("bg-red-{50,{100..900..100},950}");
-            @tailwind utilities;
-          `,
-        ),
-      ).toEqual('')
-    })
-
-    test('works with whitespace around the argument', async () => {
-      expect(
-        await compileCss(css`
-          /* prettier-ignore */
-          @source inline( "underline" );
+      let { build } = await compile(
+        css`
+          @theme {
+            --color-red-50: oklch(0.971 0.013 17.38);
+            --color-red-100: oklch(0.936 0.032 17.717);
+            --color-red-200: oklch(0.885 0.062 18.334);
+            --color-red-300: oklch(0.808 0.114 19.571);
+            --color-red-400: oklch(0.704 0.191 22.216);
+            --color-red-500: oklch(0.637 0.237 25.331);
+            --color-red-600: oklch(0.577 0.245 27.325);
+            --color-red-700: oklch(0.505 0.213 27.518);
+            --color-red-800: oklch(0.444 0.177 26.899);
+            --color-red-900: oklch(0.396 0.141 25.723);
+            --color-red-950: oklch(0.258 0.092 26.042);
+          }
+          @source not inline("bg-red-{50,{100..900..100},950}");
           @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .underline {
-          text-decoration-line: underline;
-        }
-        "
-      `)
-    })
+        `,
+        { base: '/root' },
+      )
 
-    test('works with newlines around the argument', async () => {
-      expect(
-        await compileCss(css`
-          /* prettier-ignore */
-          @source inline(
-            "underline"
-          );
-          @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .underline {
-          text-decoration-line: underline;
-        }
-        "
-      `)
+      expect(build(['bg-red-500', 'bg-red-700'])).toMatchInlineSnapshot(`""`)
     })
   })
 })
@@ -4087,38 +3448,11 @@ describe('@custom-variant', () => {
         @custom-variant foo:bar (&:hover, &:focus);
       `),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: \`@custom-variant foo:bar\` defines an invalid variant name. Variants should only contain alphanumeric, dashes, or underscore characters and start with a lowercase letter or number.]`,
+      `[Error: \`@custom-variant foo:bar\` defines an invalid variant name. Variants should only contain alphanumeric, dashes or underscore characters.]`,
     )
   })
 
-  test.each([
-    // Cannot be a dash on its own
-    [`@custom-variant - (&);`],
-    // Cannot be multiple dashes on their own
-    [`@custom-variant --- (&);`],
-    // Cannot be an underscore on its own
-    [`@custom-variant _ (&);`],
-    // Cannot be multiple underscores on their own
-    [`@custom-variant ___ (&);`],
-
-    // Cannot start with a dash
-    [`@custom-variant -foo (&);`],
-    [`@custom-variant --foo (&);`],
-    // Cannot start with an underscore
-    [`@custom-variant _foo (&);`],
-    [`@custom-variant __foo (&);`],
-
-    // Cannot end with a dash
-    [`@custom-variant foo- (&);`],
-    [`@custom-variant foo-- (&);`],
-    // Cannot end with an underscore
-    [`@custom-variant foo_ (&);`],
-    [`@custom-variant foo__ (&);`],
-  ])('@custom-variant must have a valid name', (input) => {
-    return expect(compileCss(input)).rejects.toThrow()
-  })
-
-  test('@custom-variant must not contain special characters', () => {
+  test('@custom-variant must not container special characters', () => {
     return expect(
       compileCss(css`
         .foo {
@@ -4185,47 +3519,40 @@ describe('@custom-variant', () => {
 
   describe('body-less syntax', () => {
     test('selector variant', async () => {
-      expect(
-        await run(
-          ['hocus:underline', 'group-hocus:flex'],
-          css`
-            @custom-variant hocus (&:hover, &:focus);
+      let { build } = await compile(css`
+        @custom-variant hocus (&:hover, &:focus);
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
-          :is(:is(:where(.group):hover, :where(.group):focus) .group-hocus\\:flex) {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['hocus:underline', 'group-hocus:flex'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
+          .group-hocus\\:flex:is(:is(:where(.group):hover, :where(.group):focus) *) {
             display: flex;
           }
 
           .hocus\\:underline:hover, .hocus\\:underline:focus {
             text-decoration-line: underline;
           }
-        }
-        "
+        }"
       `)
     })
 
     test('at-rule variant', async () => {
-      expect(
-        await run(
-          ['any-hover:hover:underline'],
-          css`
-            @custom-variant any-hover (@media (any-hover: hover));
+      let { build } = await compile(css`
+        @custom-variant any-hover (@media (any-hover: hover));
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['any-hover:hover:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           @media (any-hover: hover) {
             @media (hover: hover) {
               .any-hover\\:hover\\:underline:hover {
@@ -4233,156 +3560,136 @@ describe('@custom-variant', () => {
               }
             }
           }
-        }
-        "
+        }"
       `)
     })
 
     test('style-rules and at-rules', async () => {
-      expect(
-        await run(
-          ['cant-hover:focus:underline'],
-          css`
-            @custom-variant cant-hover (&:not(:hover), &:not(:active), @media not (any-hover: hover), @media not (pointer: fine));
+      let { build } = await compile(css`
+        @custom-variant cant-hover (&:not(:hover), &:not(:active), @media not (any-hover: hover), @media not (pointer: fine));
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['cant-hover:focus:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           :is(.cant-hover\\:focus\\:underline:not(:hover), .cant-hover\\:focus\\:underline:not(:active)):focus {
             text-decoration-line: underline;
           }
 
-          @media not all and (any-hover: hover) {
+          @media not (any-hover: hover) {
             .cant-hover\\:focus\\:underline:focus {
               text-decoration-line: underline;
             }
           }
 
-          @media not all and (pointer: fine) {
+          @media not (pointer: fine) {
             .cant-hover\\:focus\\:underline:focus {
               text-decoration-line: underline;
             }
           }
-        }
-        "
+        }"
       `)
     })
   })
 
   describe('body with @slot syntax', () => {
     test('selector with @slot', async () => {
-      expect(
-        await run(
-          ['selected:underline', 'group-selected:underline'],
-          css`
-            @custom-variant selected {
-              &[data-selected] {
-                @slot;
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          :is(:where(.group)[data-selected] .group-selected\\:underline), .selected\\:underline[data-selected] {
-            text-decoration-line: underline;
+      let { build } = await compile(css`
+        @custom-variant selected {
+          &[data-selected] {
+            @slot;
           }
         }
-        "
+
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['selected:underline', 'group-selected:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
+          .group-selected\\:underline:is(:where(.group)[data-selected] *), .selected\\:underline[data-selected] {
+            text-decoration-line: underline;
+          }
+        }"
       `)
     })
 
     test('grouped selectors with @slot', async () => {
-      expect(
-        await run(
-          ['hocus:underline', 'group-hocus:underline'],
-          css`
-            @custom-variant hocus {
-              &:hover,
-              &:focus {
-                @slot;
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          :is(:is(:where(.group):hover, :where(.group):focus) .group-hocus\\:underline), .hocus\\:underline:hover, .hocus\\:underline:focus {
-            text-decoration-line: underline;
+      let { build } = await compile(css`
+        @custom-variant hocus {
+          &:hover,
+          &:focus {
+            @slot;
           }
         }
-        "
+
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['hocus:underline', 'group-hocus:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
+          .group-hocus\\:underline:is(:is(:where(.group):hover, :where(.group):focus) *), .hocus\\:underline:hover, .hocus\\:underline:focus {
+            text-decoration-line: underline;
+          }
+        }"
       `)
     })
 
     test('multiple selectors with @slot', async () => {
-      expect(
-        await run(
-          ['hocus:underline', 'group-hocus:underline'],
-          css`
-            @custom-variant hocus {
-              &:hover {
-                @slot;
-              }
+      let { build } = await compile(css`
+        @custom-variant hocus {
+          &:hover {
+            @slot;
+          }
 
-              &:focus {
-                @slot;
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          :is(:where(.group):hover .group-hocus\\:underline), :is(:where(.group):focus .group-hocus\\:underline), .hocus\\:underline:hover, .hocus\\:underline:focus {
-            text-decoration-line: underline;
+          &:focus {
+            @slot;
           }
         }
-        "
+
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['hocus:underline', 'group-hocus:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
+          .group-hocus\\:underline:is(:where(.group):hover *), .group-hocus\\:underline:is(:where(.group):focus *), .hocus\\:underline:hover, .hocus\\:underline:focus {
+            text-decoration-line: underline;
+          }
+        }"
       `)
     })
 
     test('nested selector with @slot', async () => {
-      expect(
-        await run(
-          ['custom-before:underline'],
-          css`
-            @custom-variant custom-before {
-              & {
-                --has-before: 1;
-                &::before {
-                  @slot;
-                }
-              }
+      let { build } = await compile(css`
+        @custom-variant custom-before {
+          & {
+            --has-before: 1;
+            &::before {
+              @slot;
             }
+          }
+        }
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['custom-before:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           .custom-before\\:underline {
             --has-before: 1;
           }
@@ -4390,36 +3697,32 @@ describe('@custom-variant', () => {
           .custom-before\\:underline:before {
             text-decoration-line: underline;
           }
-        }
-        "
+        }"
       `)
     })
 
     test('grouped nested selectors with @slot', async () => {
-      expect(
-        await run(
-          ['custom-before:underline'],
-          css`
-            @custom-variant custom-before {
-              & {
-                --has-before: 1;
-                &::before {
-                  &:hover,
-                  &:focus {
-                    @slot;
-                  }
-                }
+      let { build } = await compile(css`
+        @custom-variant custom-before {
+          & {
+            --has-before: 1;
+            &::before {
+              &:hover,
+              &:focus {
+                @slot;
               }
             }
+          }
+        }
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['custom-before:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           .custom-before\\:underline {
             --has-before: 1;
           }
@@ -4427,43 +3730,39 @@ describe('@custom-variant', () => {
           .custom-before\\:underline:before:hover, .custom-before\\:underline:before:focus {
             text-decoration-line: underline;
           }
-        }
-        "
+        }"
       `)
     })
 
     test('nested multiple selectors with @slot', async () => {
-      expect(
-        await run(
-          ['hocus:underline', 'group-hocus:underline'],
-          css`
-            @custom-variant hocus {
-              &:hover {
-                @media (hover: hover) {
-                  @slot;
-                }
-              }
-
-              &:focus {
-                @slot;
-              }
+      let { build } = await compile(css`
+        @custom-variant hocus {
+          &:hover {
+            @media (hover: hover) {
+              @slot;
             }
+          }
+
+          &:focus {
+            @slot;
+          }
+        }
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['hocus:underline', 'group-hocus:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           @media (hover: hover) {
-            :is(:where(.group):hover .group-hocus\\:underline) {
+            .group-hocus\\:underline:is(:where(.group):hover *) {
               text-decoration-line: underline;
             }
           }
 
-          :is(:where(.group):focus .group-hocus\\:underline) {
+          .group-hocus\\:underline:is(:where(.group):focus *) {
             text-decoration-line: underline;
           }
 
@@ -4476,94 +3775,82 @@ describe('@custom-variant', () => {
           .hocus\\:underline:focus {
             text-decoration-line: underline;
           }
-        }
-        "
+        }"
       `)
     })
 
     test('selector nested under at-rule with @slot', async () => {
-      expect(
-        await run(
-          ['hocus:underline', 'group-hocus:underline'],
-          css`
-            @custom-variant hocus {
-              @media (hover: hover) {
-                &:hover {
-                  @slot;
-                }
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
+      let { build } = await compile(css`
+        @custom-variant hocus {
           @media (hover: hover) {
-            :is(:where(.group):hover .group-hocus\\:underline), .hocus\\:underline:hover {
-              text-decoration-line: underline;
+            &:hover {
+              @slot;
             }
           }
         }
-        "
+
+        @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['hocus:underline', 'group-hocus:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
+          @media (hover: hover) {
+            .group-hocus\\:underline:is(:where(.group):hover *), .hocus\\:underline:hover {
+              text-decoration-line: underline;
+            }
+          }
+        }"
       `)
     })
 
     test('at-rule with @slot', async () => {
-      expect(
-        await run(
-          ['any-hover:underline'],
-          css`
-            @custom-variant any-hover {
-              @media (any-hover: hover) {
-                @slot;
-              }
-            }
+      let { build } = await compile(css`
+        @custom-variant any-hover {
+          @media (any-hover: hover) {
+            @slot;
+          }
+        }
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['any-hover:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           @media (any-hover: hover) {
             .any-hover\\:underline {
               text-decoration-line: underline;
             }
           }
-        }
-        "
+        }"
       `)
     })
 
     test('multiple at-rules with @slot', async () => {
-      expect(
-        await run(
-          ['desktop:underline'],
-          css`
-            @custom-variant desktop {
-              @media (any-hover: hover) {
-                @slot;
-              }
+      let { build } = await compile(css`
+        @custom-variant desktop {
+          @media (any-hover: hover) {
+            @slot;
+          }
 
-              @media (pointer: fine) {
-                @slot;
-              }
-            }
+          @media (pointer: fine) {
+            @slot;
+          }
+        }
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['desktop:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           @media (any-hover: hover) {
             .desktop\\:underline {
               text-decoration-line: underline;
@@ -4575,36 +3862,32 @@ describe('@custom-variant', () => {
               text-decoration-line: underline;
             }
           }
-        }
-        "
+        }"
       `)
     })
 
     test('nested at-rules with @slot', async () => {
-      expect(
-        await run(
-          ['custom-variant:underline'],
-          css`
-            @custom-variant custom-variant {
-              @media (orientation: landscape) {
-                @media screen {
-                  @slot;
-                }
-
-                @media print {
-                  display: none;
-                }
-              }
+      let { build } = await compile(css`
+        @custom-variant custom-variant {
+          @media (orientation: landscape) {
+            @media screen {
+              @slot;
             }
 
-            @layer utilities {
-              @tailwind utilities;
+            @media print {
+              display: none;
             }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
+          }
+        }
+
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['custom-variant:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           @media (orientation: landscape) {
             @media screen {
               .custom-variant\\:underline {
@@ -4618,33 +3901,29 @@ describe('@custom-variant', () => {
               }
             }
           }
-        }
-        "
+        }"
       `)
     })
 
     test('at-rule and selector with @slot', async () => {
-      expect(
-        await run(
-          ['custom-dark:underline'],
-          css`
-            @custom-variant custom-dark {
-              @media (prefers-color-scheme: dark) {
-                @slot;
-              }
-              &:is(.dark *) {
-                @slot;
-              }
-            }
+      let { build } = await compile(css`
+        @custom-variant custom-dark {
+          @media (prefers-color-scheme: dark) {
+            @slot;
+          }
+          &:is(.dark *) {
+            @slot;
+          }
+        }
 
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
         @layer utilities {
+          @tailwind utilities;
+        }
+      `)
+      let compiled = build(['custom-dark:underline'])
+
+      expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+        "@layer utilities {
           @media (prefers-color-scheme: dark) {
             .custom-dark\\:underline {
               text-decoration-line: underline;
@@ -4654,341 +3933,27 @@ describe('@custom-variant', () => {
           .custom-dark\\:underline:is(.dark *) {
             text-decoration-line: underline;
           }
-        }
-        "
-      `)
-    })
-  })
-
-  describe('@scope', () => {
-    test('arbitrary variant', async () => {
-      expect(await run(['[@scope_(.from)_to_(.to)]:underline'])).toMatchInlineSnapshot(`
-        "
-        @scope (.from) to (.to) {
-          .\\[\\@scope_\\(\\.from\\)_to_\\(\\.to\\)\\]\\:underline {
-            text-decoration-line: underline;
-          }
-        }
-        "
-      `)
-    })
-
-    test('shorthand syntax', async () => {
-      expect(
-        await run(
-          ['scoped:underline'],
-          css`
-            @custom-variant scoped (@scope (.from) to (.to));
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @scope (.from) to (.to) {
-            .scoped\\:underline {
-              text-decoration-line: underline;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    test('with @slot syntax', async () => {
-      expect(
-        await run(
-          ['scoped:underline'],
-          css`
-            @custom-variant scoped {
-              @scope (.from) to (.to) {
-                @slot;
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @scope (.from) to (.to) {
-            .scoped\\:underline {
-              text-decoration-line: underline;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    test('@scope in a custom variant combined with user-authored `@scope` rules', async () => {
-      expect(
-        await run(
-          ['blue:bg-blue-500'],
-          css`
-            @layer utilities {
-              @tailwind utilities;
-            }
-
-            @theme inline {
-              --color-blue-500: blue;
-            }
-
-            /* In a variant */
-            @custom-variant blue {
-              @scope ([data-theme='blue']) to ([data-theme]) {
-                @slot;
-              }
-            }
-
-            /* User CSS */
-            .parent {
-              /* @scope with bare declarations */
-              @scope (.from) to (.to) {
-                --x: 1;
-              }
-
-              .child {
-                .a {
-                  /* Variant with @scope used by @apply */
-                  @apply blue:[--x:2];
-                }
-                .b {
-                  /* Variant with @scope used by @apply combined with another variant */
-                  @apply blue:hover:[--x:3];
-                }
-                .c {
-                  /* Variant with @scoped used by @variant */
-                  @variant blue {
-                    --x: 4;
-                  }
-                }
-              }
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @scope ([data-theme="blue"]) to ([data-theme]) {
-            .blue\\:bg-blue-500 {
-              background-color: #00f;
-            }
-          }
-        }
-
-        @scope (.parent .from) to (.to) {
-          :where(:scope) {
-            --x: 1;
-          }
-        }
-
-        @scope ([data-theme="blue"]) to ([data-theme]) {
-          .parent .child .a {
-            --x: 2;
-          }
-
-          @media (hover: hover) {
-            .parent .child .b:hover {
-              --x: 3;
-            }
-          }
-
-          .parent .child .c {
-            --x: 4;
-          }
-        }
-        "
-      `)
-    })
-
-    test('`&` in the `@scope` prelude of a custom variant controls the composition', async () => {
-      expect(
-        await run(
-          ['in-blue:flex', 'blue-self:flex', 'scoped-panel:flex', 'in-blue:hover:flex'],
-          css`
-            /* Default: the utility applies to elements inside the scope */
-            @custom-variant in-blue {
-              @scope ([data-theme='blue']) to ([data-theme]) {
-                @slot;
-              }
-            }
-
-            /* Trailing &: the utility itself becomes the scoping root */
-            @custom-variant blue-self {
-              @scope ([data-theme='blue'] &) to ([data-theme]) {
-                @slot;
-              }
-            }
-
-            /* Leading &: the scoping roots are found inside the utility */
-            @custom-variant scoped-panel {
-              @scope (& .panel) {
-                @slot;
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @scope ([data-theme="blue"]) to ([data-theme]) {
-            .in-blue\\:flex {
-              display: flex;
-            }
-
-            @media (hover: hover) {
-              .in-blue\\:hover\\:flex:hover {
-                display: flex;
-              }
-            }
-          }
-
-          @scope ([data-theme="blue"] .blue-self\\:flex) to ([data-theme]) {
-            :where(:scope) {
-              display: flex;
-            }
-          }
-
-          @scope (.scoped-panel\\:flex .panel) {
-            :where(:scope) {
-              display: flex;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    test('user-authored `@scope` inside `@variant` keeps its native semantics', async () => {
-      // The `hocus` variant does not use `@scope` itself, so the inner `@scope`
-      // is user CSS and compiles with the native CSS nesting semantics: the
-      // parent selector moves into the prelude, and bare declarations apply to
-      // the scoping root.
-      expect(
-        await compileCss(css`
-          @custom-variant hocus (&:hover, &:focus);
-
-          .btn {
-            @variant hocus {
-              @scope (.from) to (.to) {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope (:is(.btn:hover, .btn:focus) .from) to (.to) {
-          :where(:scope) {
-            --x: 1;
-          }
-        }
-        "
-      `)
-    })
-
-    test('user-authored `@scope` inside a `@variant` that uses `@scope` keeps its native semantics', async () => {
-      // The `blue` variant uses `@scope` itself, so its own `@scope` takes the
-      // variant composition. But the user CSS slotted into its body is marked
-      // as `user` content, so the inner `@scope` keeps its native CSS nesting
-      // semantics: the parent selector moves into the prelude, and bare
-      // declarations apply to the scoping root.
-      expect(
-        await compileCss(css`
-          @custom-variant blue {
-            @scope ([data-theme='blue']) to ([data-theme]) {
-              @slot;
-            }
-          }
-
-          .btn {
-            @variant blue {
-              @scope (.from) to (.to) {
-                --x: 1;
-              }
-            }
-          }
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        @scope ([data-theme="blue"]) to ([data-theme]) {
-          @scope (.btn .from) to (.to) {
-            :where(:scope) {
-              --x: 1;
-            }
-          }
-        }
-        "
-      `)
-    })
-
-    test('@scope nested in a rule, nested in another @scope, with @slot', async () => {
-      // Both `@scope` rules take the variant composition: neither prelude is
-      // made relative to a parent, the outer/inner nesting order is preserved,
-      // and the rule between them composes into the body with the utility's
-      // selector.
-      expect(
-        await run(
-          ['foo:underline'],
-          css`
-            @custom-variant foo {
-              @scope (.outer) to (.outer-limit) {
-                .middle {
-                  @scope (.inner) to (.inner-limit) {
-                    @slot;
-                  }
-                }
-              }
-            }
-
-            @layer utilities {
-              @tailwind utilities;
-            }
-          `,
-        ),
-      ).toMatchInlineSnapshot(`
-        "
-        @layer utilities {
-          @scope (.outer) to (.outer-limit) {
-            @scope (.inner) to (.inner-limit) {
-              .foo\\:underline .middle {
-                text-decoration-line: underline;
-              }
-            }
-          }
-        }
-        "
+        }"
       `)
     })
   })
 
   test('built-in variants can be overridden while keeping their order', async () => {
     expect(
-      await run(
-        // Make sure the order does not change by including the variants
-        // immediately before and after `dark`
-        ['rtl:flex', 'dark:flex', 'starting:flex'],
+      await compileCss(
         css`
           @custom-variant dark (&:is([data-theme='dark'] *));
           @layer utilities {
             @tailwind utilities;
           }
         `,
+
+        // Make sure the order does not change by including the variants
+        // immediately before and after `dark`
+        ['rtl:flex', 'dark:flex', 'starting:flex'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      "@layer utilities {
         .rtl\\:flex:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *), .dark\\:flex:is([data-theme="dark"] *) {
           display: flex;
         }
@@ -4998,15 +3963,13 @@ describe('@custom-variant', () => {
             display: flex;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('at-rule-only variants cannot be used with compound variants', async () => {
     expect(
-      await run(
-        ['foo:flex', 'group-foo:flex', 'peer-foo:flex', 'has-foo:flex', 'not-foo:flex'],
+      await compileCss(
         css`
           @custom-variant foo (@media foo);
 
@@ -5014,10 +3977,11 @@ describe('@custom-variant', () => {
             @tailwind utilities;
           }
         `,
+
+        ['foo:flex', 'group-foo:flex', 'peer-foo:flex', 'has-foo:flex', 'not-foo:flex'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+      "@layer utilities {
         @media not foo {
           .not-foo\\:flex {
             display: flex;
@@ -5029,287 +3993,7 @@ describe('@custom-variant', () => {
             display: flex;
           }
         }
-      }
-      "
-    `)
-  })
-
-  test('@custom-variant can reuse existing @variant in the definition', async () => {
-    expect(
-      await run(
-        ['hocus:flex'],
-        css`
-          @custom-variant hocus {
-            @variant hover {
-              @variant focus {
-                @slot;
-              }
-            }
-          }
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @media (hover: hover) {
-        .hocus\\:flex:hover:focus {
-          display: flex;
-        }
-      }
-      "
-    `)
-  })
-
-  test('@custom-variant can reuse @custom-variant that is defined later', async () => {
-    expect(
-      await run(
-        ['hocus:flex'],
-        css`
-          @custom-variant hocus {
-            @variant custom-hover {
-              @variant focus {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant custom-hover (&:hover);
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .hocus\\:flex:hover:focus {
-        display: flex;
-      }
-      "
-    `)
-  })
-
-  test('@custom-variant can reuse existing @variant that is overwritten later', async () => {
-    expect(
-      await run(
-        ['hocus:flex'],
-        css`
-          @custom-variant hocus {
-            @variant hover {
-              @variant focus {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant hover (&:hover);
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .hocus\\:flex:hover:focus {
-        display: flex;
-      }
-      "
-    `)
-  })
-
-  test('@custom-variant cannot use @variant that eventually results in a circular dependency', async () => {
-    return expect(() =>
-      run(
-        ['foo:flex'],
-        css`
-          @custom-variant custom-variant {
-            @variant foo {
-              @slot;
-            }
-          }
-
-          @custom-variant foo {
-            @variant hover {
-              @variant bar {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant bar {
-            @variant focus {
-              @variant baz {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant baz {
-            @variant active {
-              @variant foo {
-                @slot;
-              }
-            }
-          }
-
-          @tailwind utilities;
-        `,
-      ),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(`
-      [Error: Circular dependency detected in custom variants:
-
-      @custom-variant custom-variant {
-        @variant foo { … }
-      }
-      @custom-variant foo { /* ← */
-        @variant bar { … }
-      }
-      @custom-variant bar {
-        @variant baz { … }
-      }
-      @custom-variant baz {
-        @variant foo { … }
-      }
-      ]
-    `)
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/19618
-  test('@custom-variant can use a @variant that eventually uses another @custom-variant', async () => {
-    expect(
-      await run(
-        ['a:flex', 'b:flex', 'a:b:flex', 'b:a:flex'],
-        css`
-          @custom-variant a {
-            @slot;
-          }
-
-          @custom-variant b {
-            @variant a {
-              @slot;
-            }
-          }
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .a\\:flex, .b\\:flex, .a\\:b\\:flex, .b\\:a\\:flex {
-        display: flex;
-      }
-      "
-    `)
-  })
-
-  test('@custom-variant can use a @variant that eventually uses another @custom-variant (2)', async () => {
-    expect(
-      await run(
-        ['a:flex', 'b:flex', 'a:b:flex', 'b:a:flex'],
-        css`
-          @custom-variant a {
-            .a {
-              @slot;
-            }
-          }
-
-          @custom-variant b {
-            .b {
-              @variant a {
-                .a-inside-b {
-                  @slot;
-                }
-              }
-            }
-          }
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .a\\:flex .a, .b\\:flex .b .a .a-inside-b, .a\\:b\\:flex .a .b .a .a-inside-b, .b\\:a\\:flex .b .a .a-inside-b .a {
-        display: flex;
-      }
-      "
-    `)
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/19618#issuecomment-3830775912
-  test('@custom-variant can use existing @slot @variants', async () => {
-    expect(
-      await run(
-        ['hocus:flex'],
-        css`
-          @custom-variant hocus {
-            @variant hover {
-              @variant focus {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant hover {
-            &:hover {
-              @slot;
-            }
-
-            &[data-hover] {
-              @slot;
-            }
-          }
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .hocus\\:flex:hover:focus, .hocus\\:flex[data-hover]:focus {
-        display: flex;
-      }
-      "
-    `)
-  })
-
-  test('@custom-variant setup that results in a circular dependency error can be solved', async () => {
-    expect(
-      await run(
-        ['baz:flex'],
-        css`
-          @custom-variant foo {
-            @variant hover {
-              @variant bar {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant bar {
-            @variant focus {
-              @variant baz {
-                @slot;
-              }
-            }
-          }
-
-          @custom-variant baz {
-            @variant active {
-              @variant foo {
-                @slot;
-              }
-            }
-          }
-
-          /* Break the circle */
-          @custom-variant foo ([data-broken-circle] &);
-
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      [data-broken-circle] .baz\\:flex:active {
-        display: flex;
-      }
-      "
+      }"
     `)
   })
 })
@@ -5349,126 +4033,35 @@ describe('@utility', () => {
       `[Error: \`@utility 💨\` defines an invalid utility name. Utilities should be alphanumeric and start with a lowercase letter.]`,
     )
   })
-
-  test('@utility can handle escape sequences correctly', async () => {
-    expect(
-      await run(
-        ['push-1/2', 'push-50%'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @utility push-1\/2 {
-            right: 50%;
-          }
-
-          @utility push-50\% {
-            right: 50%;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
-        .push-1\\/2, .push-50\\% {
-          right: 50%;
-        }
-      }
-      "
-    `)
-  })
-
-  test('A functional @utility must end in -*', () => {
-    return expect(
-      compileCss(css`
-        @utility foo* {
-          color: red;
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: \`@utility foo*\` defines an invalid utility name. A functional utility must end in \`-*\`.]`,
-    )
-  })
-
-  test('Only the last part of a functional @utility can be dynamic', () => {
-    return expect(
-      compileCss(css`
-        @utility my-*-utility {
-          color: red;
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: \`@utility my-*-utility\` defines an invalid utility name. The dynamic portion marked by \`-*\` must appear once at the end.]`,
-    )
-  })
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/19505
-  test('@utility name cannot contain multiple `/` characters', async () => {
-    expect(
-      await run(
-        ['ui/button'],
-        css`
-          @utility ui/button {
-            display: inline-flex;
-            background: blue;
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(
-      `
-      "
-      .ui\\/button {
-        background: #00f;
-        display: inline-flex;
-      }
-      "
-    `,
-    )
-
-    await expect(
-      compileCss(css`
-        @utility ui/button/sm {
-          display: inline-flex;
-          background: blue;
-          font-size: 12px;
-        }
-      `),
-    ).rejects.toThrowErrorMatchingInlineSnapshot(
-      `[Error: \`@utility ui/button/sm\` defines an invalid utility name. Utilities should be alphanumeric and start with a lowercase letter.]`,
-    )
-  })
 })
 
 test('addBase', async () => {
-  expect(
-    await run(
-      ['underline'],
-      css`
-        @plugin "my-plugin";
-        @layer base, utilities;
-        @layer utilities {
-          @tailwind utilities;
-        }
-      `,
-      {
-        loadModule: async () => ({
-          path: '',
-          base: '/root',
-          module: ({ addBase }: PluginAPI) => {
-            addBase({
-              body: {
-                'font-feature-settings': '"tnum"',
-              },
-            })
-          },
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer base {
+  let { build } = await compile(
+    css`
+      @plugin "my-plugin";
+      @layer base, utilities;
+      @layer utilities {
+        @tailwind utilities;
+      }
+    `,
+    {
+      loadModule: async () => ({
+        module: ({ addBase }: PluginAPI) => {
+          addBase({
+            body: {
+              'font-feature-settings': '"tnum"',
+            },
+          })
+        },
+        base: '/root',
+      }),
+    },
+  )
+
+  let compiled = build(['underline'])
+
+  expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+    "@layer base {
       body {
         font-feature-settings: "tnum";
       }
@@ -5478,76 +4071,20 @@ test('addBase', async () => {
       .underline {
         text-decoration-line: underline;
       }
-    }
-    "
-  `)
-})
-
-test('JS APIs support @variant', async () => {
-  expect(
-    await run(
-      ['underline', 'foo', 'bar-one'],
-      css`
-        @plugin "my-plugin";
-        @layer base, utilities;
-        @layer utilities {
-          @tailwind utilities;
-        }
-      `,
-      {
-        loadModule: async () => ({
-          path: '',
-          base: '/root',
-          module: ({ addBase, addUtilities, matchUtilities }: PluginAPI) => {
-            addBase({ body: { '@variant dark': { color: 'red' } } })
-            addUtilities({ '.foo': { '@variant dark': { '--foo': 'foo' } } })
-            matchUtilities(
-              { bar: (value) => ({ '@variant dark': { '--bar': value } }) },
-              { values: { one: '1' } },
-            )
-          },
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer base {
-      @media (prefers-color-scheme: dark) {
-        body {
-          color: red;
-        }
-      }
-    }
-
-    @layer utilities {
-      .underline {
-        text-decoration-line: underline;
-      }
-
-      @media (prefers-color-scheme: dark) {
-        .bar-one {
-          --bar: 1;
-        }
-
-        .foo {
-          --foo: foo;
-        }
-      }
-    }
-    "
+    }"
   `)
 })
 
 it("should error when `layer(…)` is used, but it's not the first param", async () => {
-  await expect(async () => {
+  expect(async () => {
     return await compileCss(
       css`
         @import './bar.css' supports(display: grid) layer(utilities);
       `,
+      [],
       {
         async loadStylesheet() {
           return {
-            path: '',
             base: '/bar.css',
             content: css`
               .foo {
@@ -5565,11 +4102,9 @@ it("should error when `layer(…)` is used, but it's not the first param", async
 
 describe('`@reference "…" imports`', () => {
   test('recursively removes styles', async () => {
-    let loadStylesheet = async (id: string, base = '/root/foo') => {
+    let loadStylesheet = async (id: string, base: string) => {
       if (id === './foo/baz.css') {
         return {
-          base,
-          path: '',
           content: css`
             .foo {
               color: red;
@@ -5582,76 +4117,71 @@ describe('`@reference "…" imports`', () => {
             }
             @custom-variant hocus (&:hover, &:focus);
           `,
+          base: '/root/foo',
         }
       }
       return {
-        path: '',
-        base: '/root/foo',
         content: css`
           @import './foo/baz.css';
         `,
+        base: '/root/foo',
       }
     }
 
-    expect(
-      await compileCss(
-        css`
+    await expect(
+      compileCss(
+        `
           @reference './foo/bar.css';
 
           .bar {
             @apply md:hocus:foo;
           }
         `,
+        [],
         { loadStylesheet },
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 768px) {
+    ).resolves.toMatchInlineSnapshot(`
+      "@media (width >= 768px) {
         .bar:hover, .bar:focus {
           color: red;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('does not generate utilities', async () => {
-    expect(
-      await run(
-        ['text-underline', 'border'],
-        css`
-          @reference './foo/bar.css';
+    let loadStylesheet = async (id: string, base: string) => {
+      if (id === './foo/baz.css') {
+        return {
+          content: css`
+            @layer utilities {
+              @tailwind utilities;
+            }
+          `,
+          base: '/root/foo',
+        }
+      }
+      return {
+        content: css`
+          @import './foo/baz.css';
         `,
-        {
-          loadStylesheet: async (id: string, base = '/root/foo') => {
-            if (id === './foo/baz.css') {
-              return {
-                base,
-                path: '',
-                content: css`
-                  @layer utilities {
-                    @tailwind utilities;
-                  }
-                `,
-              }
-            }
-            return {
-              path: '',
-              base: '/root/foo',
-              content: css`
-                @import './foo/baz.css';
-              `,
-            }
-          },
-        },
-      ),
-    ).toEqual('')
+        base: '/root/foo',
+      }
+    }
+
+    let { build } = await compile(
+      css`
+        @reference './foo/bar.css';
+      `,
+      { loadStylesheet },
+    )
+
+    expect(build(['text-underline', 'border']).trim()).toMatchInlineSnapshot(`""`)
   })
 
   test('removes all @keyframes, even those contributed by JavasScript plugins', async () => {
-    expect(
-      await run(
-        ['animate-spin', 'match-utility-initial', 'match-components-initial'],
+    await expect(
+      compileCss(
         css`
           @media reference {
             @layer theme, base, components, utilities;
@@ -5682,10 +4212,9 @@ describe('`@reference "…" imports`', () => {
             @apply animate-spin;
           }
         `,
+        ['animate-spin', 'match-utility-initial', 'match-components-initial'],
         {
           loadModule: async () => ({
-            path: '',
-            base: '/root',
             module: ({
               addBase,
               addUtilities,
@@ -5704,7 +4233,7 @@ describe('`@reference "…" imports`', () => {
               })
               matchUtilities(
                 {
-                  'match-utility': (_value) => ({
+                  'match-utility': (value) => ({
                     '@keyframes match-utilities': { '100%': { opacity: '0' } },
                   }),
                 },
@@ -5712,19 +4241,19 @@ describe('`@reference "…" imports`', () => {
               )
               matchComponents(
                 {
-                  'match-components': (_value) => ({
+                  'match-components': (value) => ({
                     '@keyframes match-components': { '100%': { opacity: '0' } },
                   }),
                 },
                 { values: { initial: 'initial' } },
               )
             },
+            base: '/root',
           }),
         },
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      .bar {
+    ).resolves.toMatchInlineSnapshot(`
+      ".bar {
         animation: var(--animate-spin, spin 1s linear infinite);
       }
 
@@ -5732,36 +4261,31 @@ describe('`@reference "…" imports`', () => {
         to {
           transform: rotate(360deg);
         }
-      }
-      "
+      }"
     `)
   })
 
   test('emits CSS variable fallback and keyframes defined inside @reference-ed files', async () => {
-    let loadStylesheet = async (id: string, base = '/root') => {
+    let loadStylesheet = async (id: string, base: string) => {
       switch (id) {
         case './one.css': {
           return {
-            base,
-            path: '',
             content: css`
               @import './two.css' layer(two);
             `,
+            base: '/root',
           }
         }
         case './two.css': {
           return {
-            base,
-            path: '',
             content: css`
               @import './three.css' layer(three);
             `,
+            base: '/root',
           }
         }
         case './three.css': {
           return {
-            base,
-            path: '',
             content: css`
               .foo {
                 color: red;
@@ -5780,26 +4304,25 @@ describe('`@reference "…" imports`', () => {
                 }
               }
             `,
+            base: '/root',
           }
         }
       }
-
-      throw new Error('unreachable')
     }
 
-    expect(
-      await compileCss(
-        css`
+    await expect(
+      compileCss(
+        `
           @reference './one.css';
           .bar {
             @apply text-red animate-wiggle;
           }
         `,
+        [],
         { loadStylesheet },
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      .bar {
+    ).resolves.toMatchInlineSnapshot(`
+      ".bar {
         animation: var(--animate-wiggle, wiggle 1s ease-in-out infinite);
         color: var(--color-red, red);
       }
@@ -5812,16 +4335,13 @@ describe('`@reference "…" imports`', () => {
         50% {
           transform: rotate(3deg);
         }
-      }
-      "
+      }"
     `)
   })
 
   test('supports `@import "…" reference` syntax', async () => {
     let loadStylesheet = async () => {
       return {
-        path: '',
-        base: '/root/foo',
         content: css`
           .foo {
             color: red;
@@ -5834,88 +4354,86 @@ describe('`@reference "…" imports`', () => {
           }
           @custom-variant hocus (&:hover, &:focus);
         `,
+        base: '/root/foo',
       }
     }
 
-    expect(
-      await compileCss(
-        css`
-          @import './foo/bar.css' reference;
+    await expect(
+      compileCss(
+        `
+            @import './foo/bar.css' reference;
+
+            .bar {
+              @apply md:hocus:foo;
+            }
+          `,
+        [],
+        { loadStylesheet },
+      ),
+    ).resolves.toMatchInlineSnapshot(`
+        "@media (width >= 768px) {
+          .bar:hover, .bar:focus {
+            color: red;
+          }
+        }"
+      `)
+  })
+
+  test('removes styles when the import resolver was handled outside of Tailwind CSS', async () => {
+    await expect(
+      compileCss(
+        `
+          @media reference {
+            @layer theme {
+              @theme {
+                --breakpoint-md: 48rem;
+              }
+              .foo {
+                color: red;
+              }
+            }
+            @utility foo {
+              color: red;
+            }
+            @custom-variant hocus (&:hover, &:focus);
+          }
 
           .bar {
             @apply md:hocus:foo;
           }
         `,
-        { loadStylesheet },
+        [],
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 768px) {
+    ).resolves.toMatchInlineSnapshot(`
+      "@media (width >= 48rem) {
         .bar:hover, .bar:focus {
           color: red;
         }
-      }
-      "
-    `)
-  })
-
-  test('removes styles when the import resolver was handled outside of Tailwind CSS', async () => {
-    expect(
-      await compileCss(css`
-        @media reference {
-          @layer theme {
-            @theme {
-              --breakpoint-md: 48rem;
-            }
-            .foo {
-              color: red;
-            }
-          }
-          @utility foo {
-            color: red;
-          }
-          @custom-variant hocus (&:hover, &:focus);
-        }
-
-        .bar {
-          @apply md:hocus:foo;
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      @media (min-width: 48rem) {
-        .bar:hover, .bar:focus {
-          color: red;
-        }
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('@variant', () => {
   it('should convert legacy body-less `@variant` as a `@custom-variant`', async () => {
-    expect(
-      await run(
-        ['hocus:underline'],
+    await expect(
+      compileCss(
         css`
           @variant hocus (&:hover, &:focus);
           @tailwind utilities;
         `,
+        ['hocus:underline'],
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      .hocus\\:underline:hover, .hocus\\:underline:focus {
+    ).resolves.toMatchInlineSnapshot(`
+      ".hocus\\:underline:hover, .hocus\\:underline:focus {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
   it('should convert legacy `@variant` with `@slot` as a `@custom-variant`', async () => {
-    expect(
-      await run(
-        ['hocus:underline'],
+    await expect(
+      compileCss(
         css`
           @variant hocus {
             &:hover {
@@ -5928,62 +4446,63 @@ describe('@variant', () => {
           }
           @tailwind utilities;
         `,
+        ['hocus:underline'],
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      .hocus\\:underline:hover, .hocus\\:underline:focus {
+    ).resolves.toMatchInlineSnapshot(`
+      ".hocus\\:underline:hover, .hocus\\:underline:focus {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
   it('should be possible to use `@variant` in your CSS', async () => {
-    expect(
-      await compileCss(css`
-        .btn {
-          background: black;
+    await expect(
+      compileCss(
+        css`
+          .btn {
+            background: black;
 
-          @variant dark {
-            background: white;
+            @variant dark {
+              background: white;
+            }
           }
-        }
 
-        @variant hover {
-          @variant landscape {
-            .btn2 {
+          @variant hover {
+            @variant landscape {
+              .btn2 {
+                color: red;
+              }
+            }
+          }
+
+          @variant hover {
+            .foo {
               color: red;
             }
+            @variant landscape {
+              .bar {
+                color: blue;
+              }
+            }
+            .baz {
+              @variant portrait {
+                color: green;
+              }
+            }
           }
-        }
 
-        @variant hover {
-          .foo {
-            color: red;
-          }
-          @variant landscape {
-            .bar {
-              color: blue;
+          @media something {
+            @variant landscape {
+              @page {
+                color: red;
+              }
             }
           }
-          .baz {
-            @variant portrait {
-              color: green;
-            }
-          }
-        }
-
-        @media something {
-          @variant landscape {
-            @page {
-              color: red;
-            }
-          }
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      .btn {
+        `,
+        [],
+      ),
+    ).resolves.toMatchInlineSnapshot(`
+      ".btn {
         background: #000;
       }
 
@@ -6023,41 +4542,40 @@ describe('@variant', () => {
             color: red;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   it('should be possible to use `@variant` in your CSS with a `@custom-variant` that is defined later', async () => {
-    expect(
-      await compileCss(css`
-        .btn {
-          background: black;
+    await expect(
+      compileCss(
+        css`
+          .btn {
+            background: black;
 
-          @variant hocus {
-            background: white;
+            @variant hocus {
+              background: white;
+            }
           }
-        }
 
-        @custom-variant hocus (&:hover, &:focus);
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      .btn {
+          @custom-variant hocus (&:hover, &:focus);
+        `,
+        [],
+      ),
+    ).resolves.toMatchInlineSnapshot(`
+      ".btn {
         background: #000;
       }
 
       .btn:hover, .btn:focus {
         background: #fff;
-      }
-      "
+      }"
     `)
   })
 
   it('should be possible to use nested `@variant` rules', async () => {
-    expect(
-      await run(
-        ['disabled:focus:underline'],
+    await expect(
+      compileCss(
         css`
           .btn {
             background: black;
@@ -6070,10 +4588,10 @@ describe('@variant', () => {
           }
           @tailwind utilities;
         `,
+        ['disabled:focus:underline'],
       ),
-    ).toMatchInlineSnapshot(`
-      "
-      .btn {
+    ).resolves.toMatchInlineSnapshot(`
+      ".btn {
         background: #000;
       }
 
@@ -6083,1250 +4601,40 @@ describe('@variant', () => {
 
       .disabled\\:focus\\:underline:disabled:focus {
         text-decoration-line: underline;
-      }
-      "
+      }"
     `)
   })
 
-  describe('comma-separated `@variant` rules', () => {
-    it('should be possible to use comma-separated `@variant` rules', async () => {
-      let input = css`
-        .btn {
-          background: black;
-
-          @variant hover, focus {
-            background: red;
-          }
-        }
-        @tailwind utilities;
-      `
-
-      expect(await compileCss(input)).toMatchInlineSnapshot(`
-        "
-        .btn {
-          background: #000;
-        }
-
-        @media (hover: hover) {
-          .btn:hover {
-            background: red;
-          }
-        }
-
-        .btn:focus {
-          background: red;
-        }
-        "
-      `)
-
-      expect(await compileCss(input)).toEqual(
-        await compileCss(css`
-          .btn {
-            background: black;
-
-            @variant hover {
-              background: red;
-            }
-            @variant focus {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      )
-    })
-
-    it.each(
-      Array.from(
-        cartesian(
-          ['', ' ', '  ', '\t', '\t\t'], // Before
-          ['', ' ', '  ', '\t', '\t\t'], // After
-        ),
-      ),
-    )(
-      "should handle optional whitespace ('%s', '%s') between `@variant` variants",
-      async (before, after) => {
-        expect(
-          await compileCss(css`
-            .btn {
-              background: black;
-
-              @variant hover${before},${after}focus {
-                background: red;
-              }
-            }
-            @tailwind utilities;
-          `),
-        ).toMatchInlineSnapshot(`
-          "
-          .btn {
-            background: #000;
-          }
-
-          @media (hover: hover) {
-            .btn:hover {
-              background: red;
-            }
-          }
-
-          .btn:focus {
-            background: red;
-          }
-          "
-        `)
-      },
-    )
-
-    it('should handle variants containing a `,` inside', async () => {
-      expect(
-        await compileCss(css`
-          .btn {
-            background: black;
-
-            @variant [&:is(:hover,:focus)], disabled {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .btn {
-          background: #000;
-        }
-
-        .btn:is(:hover, :focus), .btn:disabled {
-          background: red;
-        }
-        "
-      `)
-    })
-
-    it('should handle nested comma-separated variants', async () => {
-      let input = css`
-        .btn {
-          background: black;
-
-          @variant hover, focus {
-            background: red;
-
-            @variant active, disabled {
-              background: blue;
-            }
-          }
-        }
-        @tailwind utilities;
-      `
-
-      expect(await compileCss(input)).toMatchInlineSnapshot(`
-        "
-        .btn {
-          background: #000;
-        }
-
-        @media (hover: hover) {
-          .btn:hover {
-            background: red;
-          }
-
-          .btn:hover:active, .btn:hover:disabled {
-            background: #00f;
-          }
-        }
-
-        .btn:focus {
-          background: red;
-        }
-
-        .btn:focus:active, .btn:focus:disabled {
-          background: #00f;
-        }
-        "
-      `)
-
-      expect(await compileCss(input)).toEqual(
-        await compileCss(css`
-          .btn {
-            background: black;
-
-            @variant hover {
-              background: red;
-
-              @variant active {
-                background: blue;
-              }
-
-              @variant disabled {
-                background: blue;
-              }
-            }
-
-            @variant focus {
-              background: red;
-
-              @variant active {
-                background: blue;
-              }
-
-              @variant disabled {
-                background: blue;
-              }
-            }
-          }
-          @tailwind utilities;
-        `),
-      )
-    })
-
-    it('should error on invalid variants (trailing comma)', async () => {
-      await expect(
-        compileCss(css`
-          .btn {
-            background: black;
-
-            @variant hover,focus, {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      ).rejects.toThrowErrorMatchingInlineSnapshot(
-        `[Error: Cannot use \`@variant\` with empty variant]`,
-      )
-    })
-
-    it('should error on invalid variants (double comma)', async () => {
-      await expect(
-        compileCss(css`
-          .btn {
-            background: black;
-
-            @variant hover,,focus {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      ).rejects.toThrowErrorMatchingInlineSnapshot(
-        `[Error: Cannot use \`@variant\` with empty variant]`,
-      )
-    })
-  })
-
-  describe('stacked `@variant` rules', () => {
-    it('should handle stacked variants', async () => {
-      expect(
-        await compileCss(css`
-          .btn {
-            background: black;
-
-            @variant hover:focus {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .btn {
-          background: #000;
-        }
-
-        @media (hover: hover) {
-          .btn:hover:focus {
-            background: red;
-          }
-        }
-        "
-      `)
-    })
-
-    it('should handle stacked variants & comma-separated variants', async () => {
-      expect(
-        await compileCss(css`
-          .btn {
-            background: black;
-
-            @variant hover:focus, disabled {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .btn {
-          background: #000;
-        }
-
-        @media (hover: hover) {
-          .btn:hover:focus {
-            background: red;
-          }
-        }
-
-        .btn:disabled {
-          background: red;
-        }
-        "
-      `)
-    })
-
-    it('should handle variants containing a `:` inside', async () => {
-      expect(
-        await compileCss(css`
-          .btn {
-            background: black;
-
-            @variant [&:is(:hover,:focus)]:disabled, aria-disabled:hover {
-              background: red;
-            }
-          }
-          @tailwind utilities;
-        `),
-      ).toMatchInlineSnapshot(`
-        "
-        .btn {
-          background: #000;
-        }
-
-        .btn:is(:hover, :focus):disabled {
-          background: red;
-        }
-
-        @media (hover: hover) {
-          .btn[aria-disabled="true"]:hover {
-            background: red;
-          }
-        }
-        "
-      `)
-    })
-  })
-
-  it('should be possible to use compound and stacked variants in `@variant`', async () => {
-    let input = css`
-      .btn {
-        background: black;
-
-        @variant data-a, data-b:data-c {
-          background: red;
-
-          @variant data-d, data-e:data-f {
-            background: blue;
-          }
-        }
-      }
-      @tailwind utilities;
-    `
-
-    expect(await compileCss(input)).toMatchInlineSnapshot(`
-      "
-      .btn {
-        background: #000;
-      }
-
-      .btn[data-a] {
-        background: red;
-      }
-
-      .btn[data-a][data-d], .btn[data-a][data-e][data-f] {
-        background: #00f;
-      }
-
-      .btn[data-b][data-c] {
-        background: red;
-      }
-
-      .btn[data-b][data-c][data-d], .btn[data-b][data-c][data-e][data-f] {
-        background: #00f;
-      }
-      "
-    `)
-
-    expect(await compileCss(input)).toEqual(
-      await compileCss(css`
-        .btn {
-          background: black;
-
-          @variant data-a {
-            background: red;
-
-            @variant data-d {
-              background: blue;
-            }
-
-            @variant data-e {
-              @variant data-f {
-                background: blue;
-              }
-            }
-          }
-
-          @variant data-b {
-            @variant data-c {
-              background: red;
-
-              @variant data-d {
-                background: blue;
-              }
-
-              @variant data-e {
-                @variant data-f {
-                  background: blue;
-                }
-              }
-            }
-          }
-        }
-        @tailwind utilities;
-      `),
-    )
-  })
-
   it('should be possible to use `@variant` with a funky looking variants', async () => {
-    expect(
-      await compileCss(css`
-        @theme inline reference {
-          --container-md: 768px;
-        }
+    await expect(
+      compileCss(
+        css`
+          @theme inline reference {
+            --container-md: 768px;
+          }
 
-        .btn {
-          background: black;
+          .btn {
+            background: black;
 
-          @variant @md {
-            @variant [&.foo] {
-              background: white;
+            @variant @md {
+              @variant [&.foo] {
+                background: white;
+              }
             }
           }
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      .btn {
+        `,
+        [],
+      ),
+    ).resolves.toMatchInlineSnapshot(`
+      ".btn {
         background: #000;
       }
 
-      @container (min-width: 768px) {
+      @container (width >= 768px) {
         .btn.foo {
           background: #fff;
         }
-      }
-      "
+      }"
     `)
   })
 })
-
-describe('`color-mix(…)` polyfill', () => {
-  it('creates an inlined variable version of the color-mix(…) usages', async () => {
-    expect(
-      await run(
-        ['text-red-500/50'],
-        css`
-          @theme {
-            --color-red-500: oklch(63.7% 0.237 25.331);
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: oklch(63.7% .237 25.331);
-      }
-
-      .text-red-500\\/50 {
-        color: #fb2c3680;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-red-500\\/50 {
-          color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('creates an inlined variable version of the color-mix(…) usages when it resolves to a var(…) containing another theme variable', async () => {
-    expect(
-      await run(
-        ['text-red/50'],
-        css`
-          @theme {
-            --color-red: var(--color-red-500);
-            --color-red-500: oklch(63.7% 0.237 25.331);
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red: var(--color-red-500);
-        --color-red-500: oklch(63.7% .237 25.331);
-      }
-
-      .text-red\\/50 {
-        color: #fb2c3680;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-red\\/50 {
-          color: color-mix(in oklab, var(--color-red) 50%, transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('works for color values in the first and second position', async () => {
-    expect(
-      await compileCss(css`
-        @theme {
-          --color-red-500: oklch(63.7% 0.237 25.331);
-          --color-orange-500: oklch(70.5% 0.213 47.604);
-        }
-        @tailwind utilities;
-        .mixed {
-          color: color-mix(in lch, var(--color-red-500) 50%, var(--color-orange-500));
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: oklch(63.7% .237 25.331);
-        --color-orange-500: oklch(70.5% .213 47.604);
-      }
-
-      .mixed {
-        color: #fc4d1b;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .mixed {
-          color: color-mix(in lch, var(--color-red-500) 50%, var(--color-orange-500));
-        }
-      }
-      "
-    `)
-  })
-
-  it('works for nested `color-mix(…)` calls', async () => {
-    expect(
-      await compileCss(css`
-        @theme {
-          --color-red-500: oklch(63.7% 0.237 25.331);
-        }
-        @tailwind utilities;
-        .stacked {
-          color: color-mix(
-            in lch,
-            color-mix(in lch, var(--color-red-500) 50%, transparent) 50%,
-            transparent
-          );
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: oklch(63.7% .237 25.331);
-      }
-
-      .stacked {
-        color: lch(55.5764% 89.7903 33.1932 / .25098);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .stacked {
-          color: color-mix(in lch, color-mix(in lch, var(--color-red-500) 50%, transparent) 50%, transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('works with multiple `color-mix(…)` functions in one declaration', async () => {
-    expect(
-      await compileCss(css`
-        @theme {
-          --color-red-500: oklch(63.7% 0.237 25.331);
-          --color-orange-500: oklch(70.5% 0.213 47.604);
-        }
-        @tailwind utilities;
-        .gradient {
-          background: linear-gradient(
-            90deg,
-            color-mix(in oklab, var(--color-red-500) 50%, transparent) 0%,
-            color-mix(in oklab, var(--color-orange-500) 50%, transparent) 0%,
-            100%
-          );
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: oklch(63.7% .237 25.331);
-        --color-orange-500: oklch(70.5% .213 47.604);
-      }
-
-      .gradient {
-        background: linear-gradient(90deg, #fb2c3680 0%, #fe6e0080 0%, 100%);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .gradient {
-          background: linear-gradient(90deg, color-mix(in oklab, var(--color-red-500) 50%, transparent) 0%, color-mix(in oklab, var(--color-orange-500) 50%, transparent) 0%, 100%);
-        }
-      }
-      "
-    `)
-  })
-
-  it('works with no spaces after the `var(…)`', async () => {
-    expect(
-      await compileCss(
-        // prettier-ignore
-        css`
-          @theme {
-            --color-red-500: oklch(63.7% 0.237 25.331);
-          }
-          @tailwind utilities;
-          .text-red-500\/50 {
-            color: color-mix(in oklab,var(--color-red-500)50%,transparent);
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: oklch(63.7% .237 25.331);
-      }
-
-      .text-red-500\\/50 {
-        color: #fb2c3680;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-red-500\\/50 {
-          color: color-mix(in oklab,var(--color-red-500)50%,transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('uses the first color value as the fallback when the `color-mix(…)` function contains non-theme variables', async () => {
-    expect(
-      await run(
-        ['text-(--my-color)/50', 'text-red-500/(--my-opacity)', 'text-(--my-color)/(--my-opacity)'],
-        css`
-          @theme {
-            --color-red-500: oklch(63.7% 0.237 25.331);
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: oklch(63.7% .237 25.331);
-      }
-
-      .text-\\(--my-color\\)\\/\\(--my-opacity\\) {
-        color: var(--my-color);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-\\(--my-color\\)\\/\\(--my-opacity\\) {
-          color: color-mix(in oklab, var(--my-color) var(--my-opacity), transparent);
-        }
-      }
-
-      .text-\\(--my-color\\)\\/50 {
-        color: var(--my-color);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-\\(--my-color\\)\\/50 {
-          color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        }
-      }
-
-      .text-red-500\\/\\(--my-opacity\\) {
-        color: oklch(63.7% .237 25.331);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-red-500\\/\\(--my-opacity\\) {
-          color: color-mix(in oklab, var(--color-red-500) var(--my-opacity), transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('uses the first color value as the fallback when the `color-mix(…)` function contains currentcolor', async () => {
-    expect(await run(['text-current/50'])).toMatchInlineSnapshot(`
-      "
-      .text-current\\/50 {
-        color: currentColor;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-current\\/50 {
-          color: color-mix(in oklab, currentcolor 50%, transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('uses the first color value as the fallback when the `color-mix(…)` function contains theme variables that resolves to other variables', async () => {
-    expect(
-      await run(
-        ['text-red/50'],
-        css`
-          @tailwind utilities;
-          @theme {
-            --color-red: var(--my-red);
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .text-red\\/50 {
-        color: var(--color-red);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-red\\/50 {
-          color: color-mix(in oklab, var(--color-red) 50%, transparent);
-        }
-      }
-
-      :root, :host {
-        --color-red: var(--my-red);
-      }
-      "
-    `)
-  })
-
-  it('uses the first color value of the inner most `color-mix(…)` function as the fallback when nested `color-mix(…)` function all contain non-theme variables', async () => {
-    expect(
-      await compileCss(css`
-        @tailwind utilities;
-        .stacked {
-          color: color-mix(
-            in oklab,
-            color-mix(in oklab, var(--my-color) var(--my-inner-opacity), transparent)
-              var(--my-outer-opacity),
-            transparent
-          );
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      .stacked {
-        color: var(--my-color);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .stacked {
-          color: color-mix(in oklab, color-mix(in oklab, var(--my-color) var(--my-inner-opacity), transparent) var(--my-outer-opacity), transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('does not create a fallback when all color values are statically analyzable (lightningcss will flatten this)', async () => {
-    expect(
-      await run(
-        ['text-red-500/50'],
-        css`
-          @theme inline {
-            --color-red-500: oklch(63.7% 0.237 25.331);
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      .text-red-500\\/50 {
-        color: oklab(63.7% .214 .101 / .5);
-      }
-      "
-    `)
-  })
-
-  it('also replaces eventual variables in opacity values', async () => {
-    expect(
-      await run(
-        ['text-red-500/(--my-half)'],
-        css`
-          @theme {
-            --my-half: 50%;
-            --color-red-500: oklch(63.7% 0.237 25.331);
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --my-half: 50%;
-        --color-red-500: oklch(63.7% .237 25.331);
-      }
-
-      .text-red-500\\/\\(--my-half\\) {
-        color: #fb2c3680;
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .text-red-500\\/\\(--my-half\\) {
-          color: color-mix(in oklab, var(--color-red-500) var(--my-half), transparent);
-        }
-      }
-      "
-    `)
-  })
-
-  it('does not delete theme variables from the output', async () => {
-    expect(
-      await run(
-        ['text-red-500', 'shadow-xl', 'opacity-disabled'],
-        css`
-          @layer theme {
-            @theme {
-              --color-red-500: red;
-              --shadow-xl: 0 6px 18px 4px color-mix(in oklab, var(--color-red-500) 25%, transparent);
-              --opacity-disabled: 50%;
-            }
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-shadow: 0 0 #0000;
-            --tw-shadow-color: initial;
-            --tw-shadow-alpha: 100%;
-            --tw-inset-shadow: 0 0 #0000;
-            --tw-inset-shadow-color: initial;
-            --tw-inset-shadow-alpha: 100%;
-            --tw-ring-color: initial;
-            --tw-ring-shadow: 0 0 #0000;
-            --tw-inset-ring-color: initial;
-            --tw-inset-ring-shadow: 0 0 #0000;
-            --tw-ring-inset: initial;
-            --tw-ring-offset-width: 0px;
-            --tw-ring-offset-color: #fff;
-            --tw-ring-offset-shadow: 0 0 #0000;
-          }
-        }
-      }
-
-      @layer theme {
-        :root, :host {
-          --color-red-500: red;
-          --opacity-disabled: 50%;
-        }
-      }
-
-      .text-red-500 {
-        color: var(--color-red-500);
-      }
-
-      .opacity-disabled {
-        opacity: var(--opacity-disabled);
-      }
-
-      .shadow-xl {
-        --tw-shadow: 0 6px 18px 4px var(--tw-shadow-color, #ff000040);
-      }
-
-      @supports (color: color-mix(in lab, red, red)) {
-        .shadow-xl {
-          --tw-shadow: 0 6px 18px 4px var(--tw-shadow-color, color-mix(in oklab, var(--color-red-500) 25%, transparent));
-        }
-      }
-
-      .shadow-xl {
-        box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-      }
-
-      @property --tw-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-
-      @property --tw-shadow-color {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --tw-shadow-alpha {
-        syntax: "<percentage>";
-        inherits: false;
-        initial-value: 100%;
-      }
-
-      @property --tw-inset-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-
-      @property --tw-inset-shadow-color {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --tw-inset-shadow-alpha {
-        syntax: "<percentage>";
-        inherits: false;
-        initial-value: 100%;
-      }
-
-      @property --tw-ring-color {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --tw-ring-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-
-      @property --tw-inset-ring-color {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --tw-inset-ring-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-
-      @property --tw-ring-inset {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --tw-ring-offset-width {
-        syntax: "<length>";
-        inherits: false;
-        initial-value: 0;
-      }
-
-      @property --tw-ring-offset-color {
-        syntax: "*";
-        inherits: false;
-        initial-value: #fff;
-      }
-
-      @property --tw-ring-offset-shadow {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0 0 #0000;
-      }
-      "
-    `)
-  })
-
-  it('does not apply optimizations when already inside a @supports (color: color-mix... block', async () => {
-    expect(
-      await run(
-        ['mixed'],
-        css`
-          @tailwind utilities;
-          @utility mixed {
-            @supports (color: color-mix(in lab, red, red)) {
-              background: color-mix(in oklab, var(--color-1), var(--color-2) 0%);
-            }
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @supports (color: color-mix(in lab, red, red)) {
-        .mixed {
-          background: color-mix(in oklab, var(--color-1), var(--color-2) 0%);
-        }
-      }
-      "
-    `)
-  })
-})
-
-describe('`@property` polyfill', async () => {
-  it('emits fallbacks', async () => {
-    expect(
-      await compileCss(css`
-        @tailwind utilities;
-
-        @property --no-inherit-no-value {
-          syntax: '*';
-          inherits: false;
-        }
-        @property --no-inherit-value {
-          syntax: '*';
-          inherits: false;
-          initial-value: red;
-        }
-        @property --inherit-no-value {
-          syntax: '*';
-          inherits: true;
-        }
-        @property --inherit-value {
-          syntax: '*';
-          inherits: true;
-          initial-value: red;
-        }
-      `),
-    ).toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          :root, :host {
-            --inherit-no-value: initial;
-            --inherit-value: red;
-          }
-
-          *, :before, :after, ::backdrop {
-            --no-inherit-no-value: initial;
-            --no-inherit-value: red;
-          }
-        }
-      }
-
-      @property --no-inherit-no-value {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --no-inherit-value {
-        syntax: "*";
-        inherits: false;
-        initial-value: red;
-      }
-
-      @property --inherit-no-value {
-        syntax: "*";
-        inherits: true
-      }
-
-      @property --inherit-value {
-        syntax: "*";
-        inherits: true;
-        initial-value: red;
-      }
-      "
-    `)
-  })
-
-  it('emitting fallbacks can be disabled (necessary for CSS modules)', async () => {
-    expect(
-      await compileCss(
-        css`
-          @tailwind utilities;
-
-          @property --no-inherit-no-value {
-            syntax: '*';
-            inherits: false;
-          }
-          @property --no-inherit-value {
-            syntax: '*';
-            inherits: false;
-            initial-value: red;
-          }
-          @property --inherit-no-value {
-            syntax: '*';
-            inherits: true;
-          }
-          @property --inherit-value {
-            syntax: '*';
-            inherits: true;
-            initial-value: red;
-          }
-        `,
-        {
-          polyfills: Polyfills.None,
-        },
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      @property --no-inherit-no-value {
-        syntax: "*";
-        inherits: false
-      }
-
-      @property --no-inherit-value {
-        syntax: "*";
-        inherits: false;
-        initial-value: red;
-      }
-
-      @property --inherit-no-value {
-        syntax: "*";
-        inherits: true
-      }
-
-      @property --inherit-value {
-        syntax: "*";
-        inherits: true;
-        initial-value: red;
-      }
-      "
-    `)
-  })
-})
-
-describe('feature detection', () => {
-  test('using `@tailwind utilities`', async () => {
-    let compiler = await compile(css`
-      @tailwind utilities;
-    `)
-
-    expect(compiler.features & Features.Utilities).toBeTruthy()
-  })
-
-  test('using `@apply`', async () => {
-    let compiler = await compile(css`
-      .foo {
-        @apply underline;
-      }
-    `)
-
-    expect(compiler.features & Features.AtApply).toBeTruthy()
-  })
-
-  test('using `@import`', async () => {
-    let compiler = await compile(
-      css`
-        @import 'tailwindcss/preflight';
-      `,
-      { loadStylesheet: async (_, base) => ({ base, path: '', content: '' }) },
-    )
-
-    expect(compiler.features & Features.AtImport).toBeTruthy()
-  })
-
-  test('using `@reference`', async () => {
-    let compiler = await compile(
-      css`
-        @reference 'tailwindcss/preflight';
-      `,
-      { loadStylesheet: async (_, base) => ({ base, path: '', content: '' }) },
-    )
-
-    // There's little difference between `@reference` and `@import` on a feature
-    // level as it's just like an import but with side-effect behavior.
-    //
-    // It's really just shorthand for `@import "…" reference;`
-    expect(compiler.features & Features.AtImport).toBeTruthy()
-  })
-
-  test('using `theme(…)`', async () => {
-    let compiler = await compile(
-      css`
-        @theme {
-          --color-red: #f00;
-        }
-
-        .foo {
-          color: theme(--color-red);
-        }
-      `,
-      { loadStylesheet: async (_, base) => ({ base, path: '', content: '' }) },
-    )
-
-    expect(compiler.features & Features.ThemeFunction).toBeTruthy()
-  })
-
-  test('using `@plugin`', async () => {
-    let compiler = await compile(
-      css`
-        @plugin "./some-plugin.js";
-      `,
-      { loadModule: async (_, base) => ({ base, path: '', module: () => {} }) },
-    )
-
-    expect(compiler.features & Features.JsPluginCompat).toBeTruthy()
-  })
-
-  test('using `@config`', async () => {
-    let compiler = await compile(
-      css`
-        @config "./some-config.js";
-      `,
-      { loadModule: async (_, base) => ({ base, path: '', module: {} }) },
-    )
-
-    expect(compiler.features & Features.JsPluginCompat).toBeTruthy()
-  })
-
-  test('using `@variant`', async () => {
-    let compiler = await compile(css`
-      .foo {
-        @variant dark {
-          color: red;
-        }
-      }
-    `)
-
-    expect(compiler.features & Features.Variants).toBeTruthy()
-  })
-
-  test('legacy `@variant` syntax does not trigger the variant feature', async () => {
-    let compiler = await compile(css`
-      @variant dark (&:is(.dark, .dark *));
-    `)
-
-    expect(compiler.features & Features.Variants).toBeFalsy()
-  })
-
-  test('`@tailwind utilities` is ignored inside `@reference`', async () => {
-    let compiler = await compile(
-      css`
-        @reference "tailwindcss/utilities";
-      `,
-      {
-        async loadStylesheet(_id, base) {
-          return {
-            base,
-            path: '',
-            content: css`
-              @tailwind utilities;
-            `,
-          }
-        },
-      },
-    )
-
-    // We see @tailwind utilities but because of @reference it is ignored
-    expect(compiler.features & Features.AtImport).toBeTruthy()
-    expect(compiler.features & Features.Utilities).toBeFalsy()
-  })
-
-  test('using `@theme`', async () => {
-    let compiler = await compile(css`
-      @theme {
-        --tracking-narrower: -0.02em;
-      }
-    `)
-
-    // We see @theme
-    expect(compiler.features & Features.AtTheme).toBeTruthy()
-
-    // And this produces no output because no other CSS is present
-    expect(compiler.build([])).toEqual('')
-  })
-})
diff --git a/packages/tailwindcss/src/index.ts b/packages/tailwindcss/src/index.ts
index bc279e624..ebf4b3875 100644
--- a/packages/tailwindcss/src/index.ts
+++ b/packages/tailwindcss/src/index.ts
@@ -6,12 +6,13 @@ import {
   comment,
   context,
   context as contextNode,
-  cssContext,
   decl,
   optimizeAst,
   rule,
   styleRule,
   toCss,
+  walk,
+  WalkAction,
   type AstNode,
   type AtRule,
   type Context,
@@ -21,58 +22,29 @@ import { substituteAtImports } from './at-import'
 import { applyCompatibilityHooks } from './compat/apply-compat-hooks'
 import type { UserConfig } from './compat/config/types'
 import { type Plugin } from './compat/plugin-api'
-import { compileCandidates } from './compile'
+import { applyVariant, compileCandidates } from './compile'
 import { substituteFunctions } from './css-functions'
 import * as CSS from './css-parser'
 import { buildDesignSystem, type DesignSystem } from './design-system'
-import { createSourceMap, type DecodedSourceMap } from './source-maps/source-map'
+import { enableSourceInline } from './feature-flags'
 import { Theme, ThemeOptions } from './theme'
 import { createCssUtility } from './utilities'
 import { expand } from './utils/brace-expansion'
 import { escape, unescape } from './utils/escape'
 import { segment } from './utils/segment'
-import { topologicalSort } from './utils/topological-sort'
-import { compoundsForSelectors, IS_VALID_VARIANT_NAME, substituteAtVariant } from './variants'
-import { walk, WalkAction } from './walk'
-
-export interface Config extends UserConfig {}
+import { compoundsForSelectors, IS_VALID_VARIANT_NAME } from './variants'
+export type Config = UserConfig
 
 const IS_VALID_PREFIX = /^[a-z]+$/
 
-export const enum Polyfills {
-  None = 0,
-
-  // Control if fallbacks for `@property` rules are emitted
-  AtProperty = 1 << 0,
-
-  // Control if `color-mix(…)` fallbacks are inserted
-  ColorMix = 1 << 1,
-
-  // Enable all
-  All = AtProperty | ColorMix,
-}
-
 type CompileOptions = {
   base?: string
-  from?: string
-  polyfills?: Polyfills
   loadModule?: (
     id: string,
     base: string,
     resourceHint: 'plugin' | 'config',
-  ) => Promise<{
-    path: string
-    base: string
-    module: Plugin | Config
-  }>
-  loadStylesheet?: (
-    id: string,
-    base: string,
-  ) => Promise<{
-    path: string
-    base: string
-    content: string
-  }>
+  ) => Promise<{ module: Plugin | Config; base: string }>
+  loadStylesheet?: (id: string, base: string) => Promise<{ content: string; base: string }>
 }
 
 function throwOnLoadModule(): never {
@@ -134,16 +106,12 @@ export const enum Features {
 
   // `@variant` was used
   Variants = 1 << 5,
-
-  // `@theme` was used
-  AtTheme = 1 << 6,
 }
 
 async function parseCss(
   ast: AstNode[],
   {
     base = '',
-    from,
     loadModule = throwOnLoadModule,
     loadStylesheet = throwOnLoadStylesheet,
   }: CompileOptions = {},
@@ -151,25 +119,23 @@ async function parseCss(
   let features = Features.None
   ast = [contextNode({ base }, ast)] as AstNode[]
 
-  features |= await substituteAtImports(ast, base, loadStylesheet, 0, from !== undefined)
+  features |= await substituteAtImports(ast, base, loadStylesheet)
 
   let important = null as boolean | null
   let theme = new Theme()
-  let customVariants = new Map<string, (designSystem: DesignSystem) => void>()
-  let customVariantDependencies = new Map<string, Set<string>>()
+  let customVariants: ((designSystem: DesignSystem) => void)[] = []
   let customUtilities: ((designSystem: DesignSystem) => void)[] = []
   let firstThemeRule = null as StyleRule | null
   let utilitiesNode = null as AtRule | null
   let variantNodes: AtRule[] = []
-  let sources: { base: string; pattern: string; negated: boolean }[] = []
+  let globs: { base: string; pattern: string }[] = []
   let inlineCandidates: string[] = []
   let ignoredCandidates: string[] = []
   let root = null as Root
 
   // Handle at-rules
-  walk(ast, (node, _ctx) => {
+  walk(ast, (node, { parent, replaceWith, context }) => {
     if (node.kind !== 'at-rule') return
-    let ctx = cssContext(_ctx)
 
     // Find `@tailwind utilities` so that we can later replace it with the
     // actual generated utility class CSS.
@@ -179,14 +145,8 @@ async function parseCss(
     ) {
       // Any additional `@tailwind utilities` nodes can be removed
       if (utilitiesNode !== null) {
-        return WalkAction.Replace([])
-      }
-
-      // When inside `@reference` we should treat `@tailwind utilities` as if
-      // it wasn't there in the first place. This should also let `build()`
-      // return the cached static AST.
-      if (ctx.context.reference) {
-        return WalkAction.Replace([])
+        replaceWith([])
+        return
       }
 
       let params = segment(node.params, ' ')
@@ -210,7 +170,7 @@ async function parseCss(
           }
 
           root = {
-            base: (ctx.context.sourceBase as string) ?? (ctx.context.base as string),
+            base: (context.sourceBase as string) ?? (context.base as string),
             pattern: path.slice(1, -1),
           }
         }
@@ -222,7 +182,7 @@ async function parseCss(
 
     // Collect custom `@utility` at-rules
     if (node.name === '@utility') {
-      if (ctx.parent !== null) {
+      if (parent !== null) {
         throw new Error('`@utility` cannot be nested.')
       }
 
@@ -234,18 +194,6 @@ async function parseCss(
 
       let utility = createCssUtility(node)
       if (utility === null) {
-        if (!node.params.endsWith('-*')) {
-          if (node.params.endsWith('*')) {
-            throw new Error(
-              `\`@utility ${node.params}\` defines an invalid utility name. A functional utility must end in \`-*\`.`,
-            )
-          } else if (node.params.includes('*')) {
-            throw new Error(
-              `\`@utility ${node.params}\` defines an invalid utility name. The dynamic portion marked by \`-*\` must appear once at the end.`,
-            )
-          }
-        }
-
         throw new Error(
           `\`@utility ${node.params}\` defines an invalid utility name. Utilities should be alphanumeric and start with a lowercase letter.`,
         )
@@ -260,7 +208,7 @@ async function parseCss(
         throw new Error('`@source` cannot have a body.')
       }
 
-      if (ctx.parent !== null) {
+      if (parent !== null) {
         throw new Error('`@source` cannot be nested.')
       }
 
@@ -268,14 +216,16 @@ async function parseCss(
       let inline = false
       let path = node.params
 
-      if (path[0] === 'n' && path.startsWith('not ')) {
-        not = true
-        path = path.slice(4)
-      }
+      if (enableSourceInline) {
+        if (path[0] === 'n' && path.startsWith('not ')) {
+          not = true
+          path = path.slice(4)
+        }
 
-      if (path[0] === 'i' && path.startsWith('inline(')) {
-        inline = true
-        path = path.slice(7, -1).trim()
+        if (path[0] === 'i' && path.startsWith('inline(')) {
+          inline = true
+          path = path.slice(7, -1)
+        }
       }
 
       if (
@@ -288,7 +238,7 @@ async function parseCss(
 
       let source = path.slice(1, -1)
 
-      if (inline) {
+      if (enableSourceInline && inline) {
         let destination = not ? ignoredCandidates : inlineCandidates
         let sources = segment(source, ' ')
         for (let source of sources) {
@@ -297,21 +247,17 @@ async function parseCss(
           }
         }
       } else {
-        sources.push({
-          base: ctx.context.base as string,
-          pattern: source,
-          negated: not,
-        })
+        globs.push({ base: context.base as string, pattern: source })
       }
-
-      return WalkAction.ReplaceSkip([])
+      replaceWith([])
+      return
     }
 
     // Apply `@variant` at-rules
     if (node.name === '@variant') {
       // Legacy `@variant` at-rules containing `@slot` or without a body should
       // be considered a `@custom-variant` at-rule.
-      if (ctx.parent === null) {
+      if (parent === null) {
         // Body-less `@variant`, e.g.: `@variant foo (…);`
         if (node.nodes.length === 0) {
           node.name = '@custom-variant'
@@ -350,15 +296,18 @@ async function parseCss(
 
     // Register custom variants from `@custom-variant` at-rules
     if (node.name === '@custom-variant') {
-      if (ctx.parent !== null) {
+      if (parent !== null) {
         throw new Error('`@custom-variant` cannot be nested.')
       }
 
+      // Remove `@custom-variant` at-rule so it's not included in the compiled CSS
+      replaceWith([])
+
       let [name, selector] = segment(node.params, ' ')
 
       if (!IS_VALID_VARIANT_NAME.test(name)) {
         throw new Error(
-          `\`@custom-variant ${name}\` defines an invalid variant name. Variants should only contain alphanumeric, dashes, or underscore characters and start with a lowercase letter or number.`,
+          `\`@custom-variant ${name}\` defines an invalid variant name. Variants should only contain alphanumeric, dashes or underscore characters.`,
         )
       }
 
@@ -392,32 +341,29 @@ async function parseCss(
           }
         }
 
-        let usesAtScope = atRuleParams.some((param) => param.startsWith('@scope'))
-
-        customVariants.set(name, (designSystem) => {
+        customVariants.push((designSystem) => {
           designSystem.variants.static(
             name,
             (r) => {
-              let slot = usesAtScope ? [contextNode({ source: 'user' }, r.nodes)] : r.nodes
-
               let nodes: AstNode[] = []
 
               if (styleRuleSelectors.length > 0) {
-                nodes.push(styleRule(styleRuleSelectors.join(', '), slot))
+                nodes.push(styleRule(styleRuleSelectors.join(', '), r.nodes))
               }
 
               for (let selector of atRuleParams) {
-                nodes.push(rule(selector, slot))
+                nodes.push(rule(selector, r.nodes))
               }
 
-              r.nodes = usesAtScope ? [contextNode({ source: 'variant' }, nodes)] : nodes
+              r.nodes = nodes
             },
             {
               compounds: compoundsForSelectors([...styleRuleSelectors, ...atRuleParams]),
             },
           )
         })
-        customVariantDependencies.set(name, new Set<string>())
+
+        return
       }
 
       // Variants without a selector, but with a body:
@@ -436,21 +382,12 @@ async function parseCss(
       // }
       // ```
       else {
-        let dependencies = new Set<string>()
-        walk(node.nodes, (child) => {
-          if (child.kind === 'at-rule' && child.name === '@variant') {
-            dependencies.add(child.params)
-          }
+        customVariants.push((designSystem) => {
+          designSystem.variants.fromAst(name, node.nodes)
         })
 
-        customVariants.set(name, (designSystem) => {
-          designSystem.variants.fromAst(name, node.nodes, designSystem)
-        })
-        customVariantDependencies.set(name, dependencies)
+        return
       }
-
-      // Remove `@custom-variant` at-rule so it's not included in the compiled CSS
-      return WalkAction.ReplaceSkip([])
     }
 
     if (node.name === '@media') {
@@ -462,14 +399,13 @@ async function parseCss(
         if (param.startsWith('source(')) {
           let path = param.slice(7, -1)
 
-          walk(node.nodes, (child) => {
+          walk(node.nodes, (child, { replaceWith }) => {
             if (child.kind !== 'at-rule') return
 
             if (child.name === '@tailwind' && child.params === 'utilities') {
               child.params += ` source(${path})`
-              return WalkAction.ReplaceStop([
-                contextNode({ sourceBase: ctx.context.base }, [child]),
-              ])
+              replaceWith([contextNode({ sourceBase: context.base }, [child])])
+              return WalkAction.Stop
             }
           })
         }
@@ -484,7 +420,6 @@ async function parseCss(
           let hasReference = themeParams.includes('reference')
 
           walk(node.nodes, (child) => {
-            if (child.kind === 'context') return
             if (child.kind !== 'at-rule') {
               if (hasReference) {
                 throw new Error(
@@ -537,19 +472,15 @@ async function parseCss(
       if (unknownParams.length > 0) {
         node.params = unknownParams.join(' ')
       } else if (params.length > 0) {
-        return WalkAction.Replace(node.nodes)
+        replaceWith(node.nodes)
       }
-
-      return WalkAction.Continue
     }
 
     // Handle `@theme`
     if (node.name === '@theme') {
       let [themeOptions, themePrefix] = parseThemeOptions(node.params)
 
-      features |= Features.AtTheme
-
-      if (ctx.context.reference) {
+      if (context.reference) {
         themeOptions |= ThemeOptions.REFERENCE
       }
 
@@ -574,7 +505,7 @@ async function parseCss(
 
         if (child.kind === 'comment') return
         if (child.kind === 'declaration' && child.property.startsWith('--')) {
-          theme.add(unescape(child.property), child.value ?? '', themeOptions, child.src)
+          theme.add(unescape(child.property), child.value ?? '', themeOptions)
           return
         }
 
@@ -592,15 +523,15 @@ async function parseCss(
       // theme later, and delete any other `@theme` rules.
       if (!firstThemeRule) {
         firstThemeRule = styleRule(':root, :host', [])
-        firstThemeRule.src = node.src
-        return WalkAction.ReplaceSkip(firstThemeRule)
+        replaceWith([firstThemeRule])
       } else {
-        return WalkAction.ReplaceSkip([])
+        replaceWith([])
       }
+      return WalkAction.Skip
     }
   })
 
-  let designSystem = buildDesignSystem(theme, utilitiesNode?.src)
+  let designSystem = buildDesignSystem(theme)
 
   if (important) {
     designSystem.important = important
@@ -621,30 +552,11 @@ async function parseCss(
     base,
     ast,
     loadModule,
-    sources,
+    globs,
   })
 
-  for (let name of customVariants.keys()) {
-    // Pre-register the variant to ensure its position in the variant list is
-    // based on the order we see them in the CSS.
-    designSystem.variants.static(name, () => {})
-  }
-
-  // Register custom variants in order
-  for (let variant of topologicalSort(customVariantDependencies, {
-    onCircularDependency(path, start) {
-      let output = toCss(
-        path.map((name, idx) => {
-          return atRule('@custom-variant', name, [atRule('@variant', path[idx + 1] ?? start, [])])
-        }),
-      )
-        .replaceAll(';', ' { … }')
-        .replace(`@custom-variant ${start} {`, `@custom-variant ${start} { /* ← */`)
-
-      throw new Error(`Circular dependency detected in custom variants:\n\n${output}`)
-    },
-  })) {
-    customVariants.get(variant)?.(designSystem)
+  for (let customVariant of customVariants) {
+    customVariant(designSystem)
   }
 
   for (let customUtility of customUtilities) {
@@ -658,9 +570,8 @@ async function parseCss(
 
     for (let [key, value] of designSystem.theme.entries()) {
       if (value.options & ThemeOptions.REFERENCE) continue
-      let node = decl(escape(key), value.value)
-      node.src = value.src
-      nodes.push(node)
+
+      nodes.push(decl(escape(key), value.value))
     }
 
     let keyframesRules = designSystem.theme.getKeyframes()
@@ -674,10 +585,6 @@ async function parseCss(
     firstThemeRule.nodes = [context({ theme: true }, nodes)]
   }
 
-  features |= substituteAtVariant(ast, designSystem)
-  features |= substituteFunctions(ast, designSystem)
-  features |= substituteAtApply(ast, designSystem)
-
   // Replace the `@tailwind utilities` node with a context since it prints
   // children directly.
   if (utilitiesNode) {
@@ -686,13 +593,40 @@ async function parseCss(
     node.context = {}
   }
 
+  // Replace the `@variant` at-rules with the actual variant rules.
+  if (variantNodes.length > 0) {
+    for (let variantNode of variantNodes) {
+      // Starting with the `&` rule node
+      let node = styleRule('&', variantNode.nodes)
+
+      let variant = variantNode.params
+
+      let variantAst = designSystem.parseVariant(variant)
+      if (variantAst === null) {
+        throw new Error(`Cannot use \`@variant\` with unknown variant: ${variant}`)
+      }
+
+      let result = applyVariant(node, variantAst, designSystem.variants)
+      if (result === null) {
+        throw new Error(`Cannot use \`@variant\` with variant: ${variant}`)
+      }
+
+      // Update the variant at-rule node, to be the `&` rule node
+      Object.assign(variantNode, node)
+    }
+    features |= Features.Variants
+  }
+
+  features |= substituteFunctions(ast, designSystem)
+  features |= substituteAtApply(ast, designSystem)
+
   // Remove `@utility`, we couldn't replace it before yet because we had to
   // handle the nested `@apply` at-rules first.
-  walk(ast, (node) => {
+  walk(ast, (node, { replaceWith }) => {
     if (node.kind !== 'at-rule') return
 
     if (node.name === '@utility') {
-      return WalkAction.Replace([])
+      replaceWith([])
     }
 
     // The `@utility` has to be top-level, therefore we don't have to traverse
@@ -703,7 +637,7 @@ async function parseCss(
   return {
     designSystem,
     ast,
-    sources,
+    globs,
     root,
     utilitiesNode,
     features,
@@ -715,12 +649,12 @@ export async function compileAst(
   input: AstNode[],
   opts: CompileOptions = {},
 ): Promise<{
-  sources: { base: string; pattern: string; negated: boolean }[]
+  globs: { base: string; pattern: string }[]
   root: Root
   features: Features
   build(candidates: string[]): AstNode[]
 }> {
-  let { designSystem, ast, sources, root, utilitiesNode, features, inlineCandidates } =
+  let { designSystem, ast, globs, root, utilitiesNode, features, inlineCandidates } =
     await parseCss(input, opts)
 
   if (process.env.NODE_ENV !== 'test') {
@@ -748,7 +682,7 @@ export async function compileAst(
   }
 
   return {
-    sources,
+    globs,
     root,
     features,
     build(newRawCandidates: string[]) {
@@ -757,7 +691,7 @@ export async function compileAst(
       }
 
       if (!utilitiesNode) {
-        compiled ??= optimizeAst(ast, designSystem, opts.polyfills)
+        compiled ??= optimizeAst(ast, designSystem)
         return compiled
       }
 
@@ -783,7 +717,7 @@ export async function compileAst(
       // If no new candidates were added, we can return the original CSS. This
       // currently assumes that we only add new candidates and never remove any.
       if (!didChange) {
-        compiled ??= optimizeAst(ast, designSystem, opts.polyfills)
+        compiled ??= optimizeAst(ast, designSystem)
         return compiled
       }
 
@@ -791,21 +725,11 @@ export async function compileAst(
         onInvalidCandidate,
       }).astNodes
 
-      if (opts.from) {
-        walk(newNodes, (node) => {
-          // We do this conditionally to preserve source locations from both
-          // `@utility` and `@custom-variant`. Even though generated nodes are
-          // cached this should be fine because `utilitiesNode.src` should not
-          // change without a full rebuild which destroys the cache.
-          node.src ??= utilitiesNode.src
-        })
-      }
-
       // If no new ast nodes were generated, then we can return the original
       // CSS. This currently assumes that we only add new ast nodes and never
       // remove any.
       if (!didAddExternalVariable && previousAstNodeCount === newNodes.length) {
-        compiled ??= optimizeAst(ast, designSystem, opts.polyfills)
+        compiled ??= optimizeAst(ast, designSystem)
         return compiled
       }
 
@@ -813,25 +737,22 @@ export async function compileAst(
 
       utilitiesNode.nodes = newNodes
 
-      compiled = optimizeAst(ast, designSystem, opts.polyfills)
+      compiled = optimizeAst(ast, designSystem)
       return compiled
     },
   }
 }
 
-export type { DecodedSourceMap }
-
 export async function compile(
   css: string,
   opts: CompileOptions = {},
 ): Promise<{
-  sources: { base: string; pattern: string; negated: boolean }[]
+  globs: { base: string; pattern: string }[]
   root: Root
   features: Features
   build(candidates: string[]): string
-  buildSourceMap(): DecodedSourceMap
 }> {
-  let ast = CSS.parse(css, { from: opts.from })
+  let ast = CSS.parse(css)
   let api = await compileAst(ast, opts)
   let compiledAst = ast
   let compiledCss = css
@@ -845,22 +766,16 @@ export async function compile(
         return compiledCss
       }
 
-      compiledCss = toCss(newAst, !!opts.from)
+      compiledCss = toCss(newAst)
       compiledAst = newAst
 
       return compiledCss
     },
-
-    buildSourceMap() {
-      return createSourceMap({
-        ast: compiledAst,
-      })
-    },
   }
 }
 
 export async function __unstable__loadDesignSystem(css: string, opts: CompileOptions = {}) {
-  let result = await parseCss(CSS.parse(css, { from: opts.from }), opts)
+  let result = await parseCss(CSS.parse(css), opts)
   return result.designSystem
 }
 
diff --git a/packages/tailwindcss/src/intellisense.test.ts b/packages/tailwindcss/src/intellisense.test.ts
index 63f9e7576..24e418be3 100644
--- a/packages/tailwindcss/src/intellisense.test.ts
+++ b/packages/tailwindcss/src/intellisense.test.ts
@@ -1,37 +1,35 @@
 import { expect, test } from 'vitest'
 import { __unstable__loadDesignSystem } from '.'
-import { decl, rule } from './ast'
+import { buildDesignSystem } from './design-system'
 import plugin from './plugin'
-import { ThemeOptions } from './theme'
+import { Theme, ThemeOptions } from './theme'
 
 const css = String.raw
 
 function loadDesignSystem() {
-  return __unstable__loadDesignSystem(`
-    @theme {
-      --spacing: 0.25rem;
-      --colors-red-500: red;
-      --colors-blue-500: blue;
-      --breakpoint-sm: 640px;
-      --aspect-video: 16 / 9;
-      --font-sans: sans-serif;
-      --font-weight-superbold: 900;
-      --text-xs: 0.75rem;
-      --text-xs--line-height: 1rem;
-      --perspective-dramatic: 100px;
-      --perspective-normal: 500px;
-      --opacity-background: 0.3;
-      --drop-shadow-sm: 0 1px 1px rgb(0 0 0 / 0.05);
-      --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-      --font-weight-bold: 700;
-      --container-md: 768px;
-      --container-lg: 1024px;
-    }
-  `)
+  let theme = new Theme()
+  theme.add('--spacing', '0.25rem')
+  theme.add('--colors-red-500', 'red')
+  theme.add('--colors-blue-500', 'blue')
+  theme.add('--breakpoint-sm', '640px')
+  theme.add('--aspect-video', '16 / 9')
+  theme.add('--font-sans', 'sans-serif')
+  theme.add('--font-weight-superbold', '900')
+  theme.add('--text-xs', '0.75rem')
+  theme.add('--text-xs--line-height', '1rem')
+  theme.add('--perspective-dramatic', '100px')
+  theme.add('--perspective-normal', '500px')
+  theme.add('--opacity-background', '0.3')
+  theme.add('--drop-shadow-sm', '0 1px 1px rgb(0 0 0 / 0.05)')
+  theme.add('--inset-shadow-sm', 'inset 0 1px 1px rgb(0 0 0 / 0.05)')
+  theme.add('--font-weight-bold', '700')
+  theme.add('--container-md', '768px')
+  theme.add('--container-lg', '1024px')
+  return buildDesignSystem(theme)
 }
 
-test('getClassList', async () => {
-  let design = await loadDesignSystem()
+test('getClassList', () => {
+  let design = loadDesignSystem()
   let classList = design.getClassList()
   let classNames = classList.flatMap(([name, meta]) => [
     name,
@@ -41,8 +39,8 @@ test('getClassList', async () => {
   expect(classNames).toMatchSnapshot()
 })
 
-test('Spacing utilities do not suggest bare values when not using the multiplier-based spacing scale', async () => {
-  let design = await loadDesignSystem()
+test('Spacing utilities do not suggest bare values when not using the multiplier-based spacing scale', () => {
+  let design = loadDesignSystem()
 
   // Remove spacing scale
   design.theme.clearNamespace('--spacing', ThemeOptions.NONE)
@@ -60,22 +58,22 @@ test('Spacing utilities do not suggest bare values when not using the multiplier
   expect(classNames).not.toContain('p-4')
 })
 
-test('Theme values with underscores are converted back to decimal points', async () => {
-  let design = await loadDesignSystem()
+test('Theme values with underscores are converted back to decimal points', () => {
+  let design = loadDesignSystem()
   let classes = design.getClassList()
 
   expect(classes).toContainEqual(['inset-0.5', { modifiers: [] }])
 })
 
-test('getVariants', async () => {
-  let design = await loadDesignSystem()
+test('getVariants', () => {
+  let design = loadDesignSystem()
   let variants = design.getVariants()
 
   expect(variants).toMatchSnapshot()
 })
 
-test('getVariants compound', async () => {
-  let design = await loadDesignSystem()
+test('getVariants compound', () => {
+  let design = loadDesignSystem()
   let variants = design.getVariants()
   let group = variants.find((v) => v.name === 'group')!
 
@@ -97,9 +95,9 @@ test('getVariants compound', async () => {
   ]
 
   expect(list).toEqual([
-    ['@media (hover: hover) { :is(:where(.group):hover &) }'],
-    ['@media (hover: hover) { :is(:where(.group\\/sidebar):hover &) }'],
-    ['@media (hover: hover) { :is(:is(:where(.group):hover :where(.group)) &) }'],
+    ['@media (hover: hover) { &:is(:where(.group):hover *) }'],
+    ['@media (hover: hover) { &:is(:where(.group\\/sidebar):hover *) }'],
+    ['@media (hover: hover) { &:is(:where(.group):is(:where(.group):hover *) *) }'],
     [],
     [],
   ])
@@ -132,16 +130,16 @@ test('variant selectors are in the correct order', async () => {
   `)
 })
 
-test('The variant `has-force` does not crash', async () => {
-  let design = await loadDesignSystem()
+test('The variant `has-force` does not crash', () => {
+  let design = loadDesignSystem()
   let variants = design.getVariants()
   let has = variants.find((v) => v.name === 'has')!
 
   expect(has.selectors({ value: 'force' })).toMatchInlineSnapshot(`[]`)
 })
 
-test('Can produce CSS per candidate using `candidatesToCss`', async () => {
-  let design = await loadDesignSystem()
+test('Can produce CSS per candidate using `candidatesToCss`', () => {
+  let design = loadDesignSystem()
   design.invalidCandidates = new Set(['bg-[#fff]'])
 
   expect(design.candidatesToCss(['underline', 'i-dont-exist', 'bg-[#fff]', 'bg-[#000]', 'text-xs']))
@@ -166,26 +164,6 @@ test('Can produce CSS per candidate using `candidatesToCss`', async () => {
     `)
 })
 
-test('Can produce AST per candidate using `candidatesToAst`', async () => {
-  let design = await loadDesignSystem()
-  design.invalidCandidates = new Set(['bg-[#fff]'])
-
-  expect(
-    design.candidatesToAst(['underline', 'i-dont-exist', 'bg-[#fff]', 'bg-[#000]', 'text-xs']),
-  ).toEqual([
-    [rule('.underline', [decl('text-decoration-line', 'underline')])],
-    [],
-    [],
-    [rule('.bg-\\[\\#000\\]', [decl('background-color', '#000')])],
-    [
-      rule('.text-xs', [
-        decl('font-size', 'var(--text-xs)'),
-        decl('line-height', 'var(--tw-leading, var(--text-xs--line-height))'),
-      ]),
-    ],
-  ])
-})
-
 test('Utilities do not show wrapping selector in intellisense', async () => {
   let input = css`
     @import 'tailwindcss/utilities';
@@ -194,12 +172,10 @@ test('Utilities do not show wrapping selector in intellisense', async () => {
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
     loadModule: async () => ({
-      path: '',
       base: '',
       module: {
         important: '#app',
@@ -213,9 +189,11 @@ test('Utilities do not show wrapping selector in intellisense', async () => {
       text-decoration-line: underline;
     }
     ",
-      "@media (hover: hover) {
-      .hover\\:line-through:hover {
-        text-decoration-line: line-through;
+      ".hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
+          text-decoration-line: line-through;
+        }
       }
     }
     ",
@@ -230,7 +208,6 @@ test('Utilities, when marked as important, show as important in intellisense', a
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
@@ -242,9 +219,11 @@ test('Utilities, when marked as important, show as important in intellisense', a
       text-decoration-line: underline !important;
     }
     ",
-      "@media (hover: hover) {
-      .hover\\:line-through:hover {
-        text-decoration-line: line-through !important;
+      ".hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
+          text-decoration-line: line-through !important;
+        }
       }
     }
     ",
@@ -255,17 +234,15 @@ test('Utilities, when marked as important, show as important in intellisense', a
 test('Static utilities from plugins are listed in hovers and completions', async () => {
   let input = css`
     @import 'tailwindcss/utilities';
-    @plugin "./plugin.js";
+    @plugin "./plugin.js"l;
   `
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
     loadModule: async () => ({
-      path: '',
       base: '',
       module: plugin(({ addUtilities }) => {
         addUtilities({
@@ -292,17 +269,15 @@ test('Static utilities from plugins are listed in hovers and completions', async
 test('Functional utilities from plugins are listed in hovers and completions', async () => {
   let input = css`
     @import 'tailwindcss/utilities';
-    @plugin "./plugin.js";
+    @plugin "./plugin.js"l;
   `
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
     loadModule: async () => ({
-      path: '',
       base: '',
       module: plugin(({ matchUtilities }) => {
         matchUtilities(
@@ -357,48 +332,48 @@ test('Functional utilities from plugins are listed in hovers and completions', a
 
   expect(design.candidatesToCss(['custom-1-red', 'custom-1-green', 'custom-1-unknown']))
     .toMatchInlineSnapshot(`
-      [
-        ".custom-1-red {
-        color: #ff0000;
-      }
-      ",
-        ".custom-1-green {
-        color: #ff0000;
-      }
-      ",
-        null,
-      ]
-    `)
+    [
+      ".custom-1-red {
+      color: #ff0000;
+    }
+    ",
+      ".custom-1-green {
+      color: #ff0000;
+    }
+    ",
+      null,
+    ]
+  `)
 
   expect(design.candidatesToCss(['custom-2-red', 'custom-2-green', 'custom-2-unknown']))
     .toMatchInlineSnapshot(`
-      [
-        ".custom-2-red {
-        color: #ff0000 / 0%;
-      }
-      ",
-        ".custom-2-green {
-        color: #ff0000 / 0%;
-      }
-      ",
-        null,
-      ]
-    `)
+    [
+      ".custom-2-red {
+      color: #ff0000 / 0%;
+    }
+    ",
+      ".custom-2-green {
+      color: #ff0000 / 0%;
+    }
+    ",
+      null,
+    ]
+  `)
 
   expect(design.candidatesToCss(['custom-2-red/50', 'custom-2-red/75', 'custom-2-red/unknown']))
     .toMatchInlineSnapshot(`
-      [
-        ".custom-2-red\\/50 {
-        color: #ff0000 / 50%;
-      }
-      ",
-        ".custom-2-red\\/75 {
-        color: #ff0000 / 75%;
-      }
-      ",
-        null,
-      ]
-    `)
+    [
+      ".custom-2-red\\/50 {
+      color: #ff0000 / 50%;
+    }
+    ",
+      ".custom-2-red\\/75 {
+      color: #ff0000 / 75%;
+    }
+    ",
+      null,
+    ]
+  `)
 
   let classMap = new Map(design.getClassList())
   let classNames = Array.from(classMap.keys())
@@ -445,12 +420,10 @@ test('Custom at-rule variants do not show up as a value under `group`', async ()
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
     loadModule: async () => ({
-      path: '',
       base: '',
       module: plugin(({ addVariant }) => {
         addVariant('variant-3', '@media baz')
@@ -493,6 +466,11 @@ test('Custom functional @utility', async () => {
     @import 'tailwindcss/utilities';
 
     @theme reference {
+      --tab-size-1: 1;
+      --tab-size-2: 2;
+      --tab-size-4: 4;
+      --tab-size-github: 8;
+
       --text-xs: 0.75rem;
       --text-xs--line-height: calc(1 / 0.75);
 
@@ -501,16 +479,15 @@ test('Custom functional @utility', async () => {
 
       --spacing: 0.25rem;
       --spacing-custom: 123px;
+    }
 
-      --negative-1: 1;
-      --negative-2: 2;
-      --negative-4: 4;
-      --negative-a: 8;
+    @utility tab-* {
+      tab-size: --value(--tab-size, 'revert', 'initial');
     }
 
     @utility example-* {
       font-size: --value(--text);
-      line-height: --value(--text-* --line-height);
+      line-height: --value(--text- * --line-height);
       line-height: --modifier(--leading, 'normal');
     }
 
@@ -527,13 +504,12 @@ test('Custom functional @utility', async () => {
     }
 
     @utility -negative-* {
-      margin: --value(--negative-*);
+      margin: --value(--tab-size- *);
     }
   `
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
@@ -542,6 +518,18 @@ test('Custom functional @utility', async () => {
   let classMap = new Map(design.getClassList())
   let classNames = Array.from(classMap.keys())
 
+  expect(classNames).toContain('tab-1')
+  expect(classNames).toContain('tab-2')
+  expect(classNames).toContain('tab-4')
+  expect(classNames).toContain('tab-github')
+  expect(classNames).toContain('tab-revert')
+  expect(classNames).toContain('tab-initial')
+
+  expect(classNames).not.toContain('-tab-1')
+  expect(classNames).not.toContain('-tab-2')
+  expect(classNames).not.toContain('-tab-4')
+  expect(classNames).not.toContain('-tab-github')
+
   expect(classNames).toContain('with-custom-spacing-custom')
   expect(classNames).not.toContain('with-custom-spacing-0')
   expect(classNames).not.toContain('with-custom-spacing-0.5')
@@ -563,50 +551,17 @@ test('Custom functional @utility', async () => {
   expect(classNames).toContain('-negative-1')
   expect(classNames).toContain('-negative-2')
   expect(classNames).toContain('-negative-4')
-  expect(classNames).toContain('-negative-a')
+  expect(classNames).toContain('-negative-github')
 
   expect(classNames).not.toContain('--negative-1')
   expect(classNames).not.toContain('--negative-2')
   expect(classNames).not.toContain('--negative-4')
-  expect(classNames).not.toContain('--negative-a')
+  expect(classNames).not.toContain('--negative-github')
 
   expect(classNames).toContain('example-xs')
   expect(classMap.get('example-xs')?.modifiers).toEqual(['normal', 'foo', 'bar'])
 })
 
-test('Custom utilities sharing a root with built-in utilities should merge suggestions', async () => {
-  let input = css`
-    @import 'tailwindcss/utilities';
-    @theme {
-      --font-sans: sans-serif;
-    }
-
-    @theme {
-      --font-weight-custom: 1234;
-      --font-weight-bold: bold; /* Overlap with existing utility */
-    }
-
-    @utility font-* {
-      --my-font-weight: --value(--font-weight-*);
-    }
-  `
-
-  let design = await __unstable__loadDesignSystem(input, {
-    loadStylesheet: async (_, base) => ({
-      path: '',
-      base,
-      content: '@tailwind utilities;',
-    }),
-  })
-
-  let classMap = new Map(design.getClassList())
-  let classNames = Array.from(classMap.keys())
-
-  expect(classNames).toContain('font-sans') // Existing font-family utility
-  expect(classNames).toContain('font-bold') // Existing font-family utility & custom font-weight utility
-  expect(classNames).toContain('font-custom') // Custom font-weight utility
-})
-
 test('Theme keys with underscores are suggested with underscores', async () => {
   let input = css`
     @import 'tailwindcss/utilities';
@@ -615,170 +570,31 @@ test('Theme keys with underscores are suggested with underscores', async () => {
       /* Disable the spacing scale */
       --spacing: initial;
 
-      /* This will get suggested with a dot because its surrounded by numbers */
+      /* This will get suggeted with a dot because its surrounded by numbers */
       --spacing-1_5: 1.5rem;
 
-      /* This will get suggested with a dot  */
+      /* This will get suggeted with a dot  */
       --spacing-2\.5: 1.5rem;
 
-      /* This will get suggested with an underscore */
+      /* This will get suggeted with an underscore */
       --spacing-logo_margin: 0.875rem;
     }
-
-    @utility ex-* {
-      width: --value(--spacing-*);
-    }
   `
 
   let design = await __unstable__loadDesignSystem(input, {
     loadStylesheet: async (_, base) => ({
-      path: '',
       base,
       content: '@tailwind utilities;',
     }),
   })
 
-  let entries = design
-    .getClassList()
-    .filter(([name]) => name.startsWith('p-') || name.startsWith('ex-'))
+  let entries = design.getClassList().filter(([name]) => name.startsWith('p-'))
 
   expect(entries).toContainEqual(['p-1.5', { modifiers: [] }])
   expect(entries).toContainEqual(['p-2.5', { modifiers: [] }])
   expect(entries).toContainEqual(['p-logo_margin', { modifiers: [] }])
 
-  expect(entries).toContainEqual(['ex-1.5', { modifiers: [] }])
-  expect(entries).toContainEqual(['ex-2.5', { modifiers: [] }])
-  expect(entries).toContainEqual(['ex-logo_margin', { modifiers: [] }])
-
   expect(entries).not.toContainEqual(['p-1_5', { modifiers: [] }])
   expect(entries).not.toContainEqual(['p-2_5', { modifiers: [] }])
   expect(entries).not.toContainEqual(['p-logo.margin', { modifiers: [] }])
-
-  expect(entries).not.toContainEqual(['ex-1_5', { modifiers: [] }])
-  expect(entries).not.toContainEqual(['ex-2_5', { modifiers: [] }])
-  expect(entries).not.toContainEqual(['ex-logo.margin', { modifiers: [] }])
-})
-
-test('shadow utility default suggestions', async () => {
-  let input = css`
-    @theme {
-      /* nothing */
-    }
-  `
-
-  let design = await __unstable__loadDesignSystem(input)
-  let classNames = design.getClassList().map(([name]) => name)
-
-  expect(classNames).not.toContain('shadow')
-  expect(classNames).not.toContain('inset-shadow')
-  expect(classNames).not.toContain('text-shadow')
-
-  input = css`
-    @theme {
-      --shadow: 0 0 0 solid black;
-      --text-shadow: 0 0 0 solid black;
-      --inset-shadow: 0 0 0 solid black;
-    }
-  `
-
-  design = await __unstable__loadDesignSystem(input)
-  classNames = design.getClassList().map(([name]) => name)
-
-  expect(classNames).toContain('shadow')
-  expect(classNames).toContain('inset-shadow')
-  expect(classNames).toContain('text-shadow')
-})
-
-test('Custom @utility and existing utility with names matching theme keys dont give duplicate results', async () => {
-  let input = css`
-    @theme reference {
-      --leading-sm: 0.25rem;
-      --text-header: 1.5rem;
-    }
-
-    @utility text-header {
-      text-transform: uppercase;
-    }
-  `
-
-  let design = await __unstable__loadDesignSystem(input)
-
-  let classList = design.getClassList()
-  let classMap = new Map(classList)
-  let matches = classList.filter(([className]) => className === 'text-header')
-
-  expect(matches).toHaveLength(1)
-  expect(classMap.get('text-header')?.modifiers).toEqual(['sm'])
-})
-
-test('matchVariant', async () => {
-  let input = css`
-    @import 'tailwindcss/utilities';
-    @plugin "./plugin.js";
-  `
-
-  let design = await __unstable__loadDesignSystem(input, {
-    loadStylesheet: async (_, base) => ({
-      path: '',
-      base,
-      content: '@tailwind utilities;',
-    }),
-    loadModule: async () => ({
-      path: '',
-      base: '',
-      module: plugin(({ matchVariant }) => {
-        matchVariant('foo', (val) => `&:is(${val})`, {
-          values: {
-            DEFAULT: '1',
-            a: 'a',
-            b: 'b',
-          },
-        })
-      }),
-    }),
-  })
-
-  let variants = design.getVariants()
-  let v1 = variants.find((v) => v.name === 'foo')!
-  expect(v1).not.toBeUndefined()
-
-  expect(v1.hasDash).toEqual(true)
-  expect(v1.isArbitrary).toEqual(true)
-  expect(v1.name).toEqual('foo')
-  expect(v1.values).toEqual(['a', 'b'])
-})
-
-test('matchUtilities discards internal only helpers from suggestions when using the theme function', async () => {
-  let input = css`
-    @import 'tailwindcss/utilities';
-    @plugin "./plugin.js";
-
-    @theme {
-      --color-red: red;
-    }
-  `
-
-  let design = await __unstable__loadDesignSystem(input, {
-    loadStylesheet: async (_, base) => ({
-      path: '',
-      base,
-      content: '@tailwind utilities;',
-    }),
-    loadModule: async () => ({
-      path: '',
-      base: '',
-      module: plugin(({ matchUtilities, theme }) => {
-        matchUtilities({ foo: (val) => ({ color: val }) }, { values: theme('colors') })
-        matchUtilities({ bar: (val) => ({ color: val }) }, { values: theme('transitionDuration') })
-      }),
-    }),
-  })
-
-  let classNames = design.getClassList().map((e) => e[0])
-
-  expect(classNames).not.toContain('foo-__BARE_VALUE__')
-  expect(classNames).not.toContain('bar-__BARE_VALUE__')
-
-  expect(classNames).not.toContain('foo-__CSS_VALUES__')
-  expect(classNames).not.toContain('bar-__CSS_VALUES__')
 })
diff --git a/packages/tailwindcss/src/intellisense.ts b/packages/tailwindcss/src/intellisense.ts
index e21663fe0..ca9c1a386 100644
--- a/packages/tailwindcss/src/intellisense.ts
+++ b/packages/tailwindcss/src/intellisense.ts
@@ -1,10 +1,8 @@
-import { styleRule } from './ast'
+import { styleRule, walkDepth } from './ast'
 import { applyVariant } from './compile'
 import type { DesignSystem } from './design-system'
 import { compare } from './utils/compare'
 import { DefaultMap } from './utils/default-map'
-import { walk } from './walk'
-export { canonicalizeCandidates, type CanonicalizeOptions } from './canonicalize-candidates'
 
 interface ClassMetadata {
   modifiers: string[]
@@ -22,21 +20,16 @@ export type ClassEntry = [string, ClassMetadata]
 const IS_FRACTION = /^\d+\/\d+$/
 
 export function getClassList(design: DesignSystem): ClassEntry[] {
-  let items = new DefaultMap<string, ClassItem>((utility) => ({
-    name: utility,
-    utility,
-    fraction: false,
-    modifiers: [],
-  }))
+  let list: ClassItem[] = []
 
   // Static utilities only work as-is
   for (let utility of design.utilities.keys('static')) {
-    let completions = design.utilities.getCompletions(utility)
-    if (completions.length === 0) continue
-
-    let item = items.get(utility)
-    item.fraction = false
-    item.modifiers = []
+    list.push({
+      name: utility,
+      utility,
+      fraction: false,
+      modifiers: [],
+    })
   }
 
   // Functional utilities have their own list of completions
@@ -49,28 +42,28 @@ export function getClassList(design: DesignSystem): ClassEntry[] {
 
         let name = value === null ? utility : `${utility}-${value}`
 
-        let item = items.get(name)
-        item.utility = utility
-        item.fraction ||= fraction
-        item.modifiers.push(...group.modifiers)
+        list.push({
+          name,
+          utility,
+          fraction,
+          modifiers: group.modifiers,
+        })
 
         if (group.supportsNegative) {
-          let item = items.get(`-${name}`)
-          item.utility = `-${utility}`
-          item.fraction ||= fraction
-          item.modifiers.push(...group.modifiers)
+          list.push({
+            name: `-${name}`,
+            utility: `-${utility}`,
+            fraction,
+            modifiers: group.modifiers,
+          })
         }
-
-        // Deduplicate modifiers
-        item.modifiers = Array.from(new Set(item.modifiers))
       }
     }
   }
 
-  if (items.size === 0) return []
+  if (list.length === 0) return []
 
   // Sort utilities by their class name
-  let list = Array.from(items.values())
   list.sort((a, b) => compare(a.name, b.name))
 
   let entries = sortFractionsLast(list)
@@ -184,47 +177,42 @@ export function getVariants(design: DesignSystem) {
 
       // Produce v3-style selector strings in the face of nested rules
       // this is more visible for things like group-*, not-*, etc…
-      walk(node.nodes, {
-        exit(node, ctx) {
-          if (node.kind !== 'rule' && node.kind !== 'at-rule') return
-          if (node.nodes.length > 0) return
+      walkDepth(node.nodes, (node, { path }) => {
+        if (node.kind !== 'rule' && node.kind !== 'at-rule') return
+        if (node.nodes.length > 0) return
 
-          let path = ctx.path()
-          path.push(node)
+        // Sort at-rules before style rules
+        path.sort((a, b) => {
+          let aIsAtRule = a.kind === 'at-rule'
+          let bIsAtRule = b.kind === 'at-rule'
 
-          // Sort at-rules before style rules
-          path.sort((a, b) => {
-            let aIsAtRule = a.kind === 'at-rule'
-            let bIsAtRule = b.kind === 'at-rule'
+          if (aIsAtRule && !bIsAtRule) return -1
+          if (!aIsAtRule && bIsAtRule) return 1
 
-            if (aIsAtRule && !bIsAtRule) return -1
-            if (!aIsAtRule && bIsAtRule) return 1
+          return 0
+        })
 
-            return 0
-          })
-
-          // A list of the selectors / at rules encountered to get to this point
-          let group = path.flatMap((node) => {
-            if (node.kind === 'rule') {
-              return node.selector === '&' ? [] : [node.selector]
-            }
-
-            if (node.kind === 'at-rule') {
-              return [`${node.name} ${node.params}`]
-            }
-
-            return []
-          })
-
-          // Build a v3-style nested selector
-          let selector = ''
-
-          for (let i = group.length - 1; i >= 0; i--) {
-            selector = selector === '' ? group[i] : `${group[i]} { ${selector} }`
+        // A list of the selectors / at rules encountered to get to this point
+        let group = path.flatMap((node) => {
+          if (node.kind === 'rule') {
+            return node.selector === '&' ? [] : [node.selector]
           }
 
-          selectors.push(selector)
-        },
+          if (node.kind === 'at-rule') {
+            return [`${node.name} ${node.params}`]
+          }
+
+          return []
+        })
+
+        // Build a v3-style nested selector
+        let selector = ''
+
+        for (let i = group.length - 1; i >= 0; i--) {
+          selector = selector === '' ? group[i] : `${group[i]} { ${selector} }`
+        }
+
+        selectors.push(selector)
       })
 
       return selectors
diff --git a/packages/tailwindcss/src/plugin.test.ts b/packages/tailwindcss/src/plugin.test.ts
index a7704ae58..9af3a55fb 100644
--- a/packages/tailwindcss/src/plugin.test.ts
+++ b/packages/tailwindcss/src/plugin.test.ts
@@ -1,32 +1,29 @@
 import { expect, test } from 'vitest'
+import { compile } from '.'
 import plugin from './plugin'
-import { compileCss } from './test-utils/run'
 
 const css = String.raw
 
 test('plugin', async () => {
-  expect(
-    await compileCss(
-      css`
-        @plugin "my-plugin";
-      `,
-      {
-        loadModule: async () => ({
-          module: plugin(function ({ addBase }) {
-            addBase({
-              body: {
-                margin: '0',
-              },
-            })
-          }),
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer base {
+  let input = css`
+    @plugin "my-plugin";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: plugin(function ({ addBase }) {
+        addBase({
+          body: {
+            margin: '0',
+          },
+        })
+      }),
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build([])).toMatchInlineSnapshot(`
+    "@layer base {
       body {
         margin: 0;
       }
@@ -36,30 +33,27 @@ test('plugin', async () => {
 })
 
 test('plugin.withOptions', async () => {
-  expect(
-    await compileCss(
-      css`
-        @plugin "my-plugin";
-      `,
-      {
-        loadModule: async () => ({
-          module: plugin.withOptions(function (opts = { foo: '1px' }) {
-            return function ({ addBase }) {
-              addBase({
-                body: {
-                  margin: opts.foo,
-                },
-              })
-            }
-          }),
-          base: '/root',
-          path: '',
-        }),
-      },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer base {
+  let input = css`
+    @plugin "my-plugin";
+  `
+
+  let compiler = await compile(input, {
+    loadModule: async () => ({
+      module: plugin.withOptions(function (opts = { foo: '1px' }) {
+        return function ({ addBase }) {
+          addBase({
+            body: {
+              margin: opts.foo,
+            },
+          })
+        }
+      }),
+      base: '/root',
+    }),
+  })
+
+  expect(compiler.build([])).toMatchInlineSnapshot(`
+    "@layer base {
       body {
         margin: 1px;
       }
diff --git a/packages/tailwindcss/src/plugin.ts b/packages/tailwindcss/src/plugin.ts
index 8035633b0..5425f03c1 100644
--- a/packages/tailwindcss/src/plugin.ts
+++ b/packages/tailwindcss/src/plugin.ts
@@ -41,6 +41,5 @@ export type {
   PluginFn as PluginCreator,
   Plugin as PluginsConfig,
   PluginUtils,
-  PluginWithConfig,
   ThemeConfig,
 }
diff --git a/packages/tailwindcss/src/prefix.test.ts b/packages/tailwindcss/src/prefix.test.ts
index ded304cad..65e234276 100644
--- a/packages/tailwindcss/src/prefix.test.ts
+++ b/packages/tailwindcss/src/prefix.test.ts
@@ -1,7 +1,6 @@
 import { expect, test } from 'vitest'
 import { compile } from '.'
 import plugin from './plugin'
-import { compileCss, run } from './test-utils/run'
 
 const css = String.raw
 
@@ -15,64 +14,73 @@ test('utilities must be prefixed', async () => {
     }
   `
 
+  let compiler = await compile(input)
+
   // Prefixed utilities are generated
   expect(
-    await run(
-      [
-        'tw:underline',
-        'tw:hover:line-through',
-        'tw:custom',
-        'tw:group-hover:flex',
-        'tw:peer-hover:flex',
-      ],
-      input,
-    ),
+    compiler.build([
+      'tw:underline',
+      'tw:hover:line-through',
+      'tw:custom',
+      'tw:group-hover:flex',
+      'tw:peer-hover:flex',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    .tw\\:custom {
+    ".tw\\:custom {
       color: red;
     }
-
     .tw\\:underline {
       text-decoration-line: underline;
     }
-
-    @media (hover: hover) {
-      :is(:where(.tw\\:group):hover .tw\\:group-hover\\:flex), :is(:where(.tw\\:peer):hover ~ .tw\\:peer-hover\\:flex) {
-        display: flex;
+    .tw\\:group-hover\\:flex {
+      &:is(:where(.tw\\:group):hover *) {
+        @media (hover: hover) {
+          display: flex;
+        }
       }
-
-      .tw\\:hover\\:line-through:hover {
-        text-decoration-line: line-through;
+    }
+    .tw\\:peer-hover\\:flex {
+      &:is(:where(.tw\\:peer):hover ~ *) {
+        @media (hover: hover) {
+          display: flex;
+        }
+      }
+    }
+    .tw\\:hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
+          text-decoration-line: line-through;
+        }
       }
     }
     "
   `)
 
   // Non-prefixed utilities are ignored
-  expect(await run(['underline', 'hover:line-through', 'custom'], input)).toEqual('')
+  compiler = await compile(input)
+
+  expect(compiler.build(['underline', 'hover:line-through', 'custom'])).toEqual('')
 })
 
 test('utilities used in @apply must be prefixed', async () => {
-  // Prefixed utilities are generated
-  expect(
-    await compileCss(css`
-      @theme reference prefix(tw);
+  let compiler = await compile(css`
+    @theme reference prefix(tw);
 
-      .my-underline {
-        @apply tw:underline;
-      }
-    `),
-  ).toMatchInlineSnapshot(`
-    "
     .my-underline {
+      @apply tw:underline;
+    }
+  `)
+
+  // Prefixed utilities are generated
+  expect(compiler.build([])).toMatchInlineSnapshot(`
+    ".my-underline {
       text-decoration-line: underline;
     }
     "
   `)
 
   // Non-prefixed utilities cause an error
-  await expect(
+  expect(() =>
     compile(css`
       @theme reference prefix(tw);
 
@@ -81,31 +89,26 @@ test('utilities used in @apply must be prefixed', async () => {
       }
     `),
   ).rejects.toThrowErrorMatchingInlineSnapshot(
-    `[Error: Cannot apply unprefixed utility class \`underline\`. Did you mean \`tw:underline\`?]`,
+    `[Error: Cannot apply unknown utility class: underline]`,
   )
 })
 
 test('CSS variables output by the theme are prefixed', async () => {
-  // Prefixed utilities are generated
-  expect(
-    await run(
-      ['tw:text-red'],
-      css`
-        @theme prefix(tw) {
-          --color-red: #f00;
-          --color-green: #0f0;
-          --breakpoint-sm: 640px;
-        }
-
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --tw-color-red: red;
+  let compiler = await compile(css`
+    @theme prefix(tw) {
+      --color-red: #f00;
+      --color-green: #0f0;
+      --breakpoint-sm: 640px;
     }
 
+    @tailwind utilities;
+  `)
+
+  // Prefixed utilities are generated
+  expect(compiler.build(['tw:text-red'])).toMatchInlineSnapshot(`
+    ":root, :host {
+      --tw-color-red: #f00;
+    }
     .tw\\:text-red {
       color: var(--tw-color-red);
     }
@@ -114,81 +117,77 @@ test('CSS variables output by the theme are prefixed', async () => {
 })
 
 test('CSS theme functions do not use the prefix', async () => {
-  expect(
-    await run(
-      ['tw:[color:theme(--color-red)]', 'tw:text-[theme(--color-red)]'],
-      css`
-        @theme prefix(tw) {
-          --color-red: #f00;
-          --color-green: #0f0;
-          --breakpoint-sm: 640px;
-        }
-
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .tw\\:\\[color\\:theme\\(--color-red\\)\\], .tw\\:text-\\[theme\\(--color-red\\)\\] {
-      color: red;
+  let compiler = await compile(css`
+    @theme prefix(tw) {
+      --color-red: #f00;
+      --color-green: #0f0;
+      --breakpoint-sm: 640px;
     }
-    "
+
+    @tailwind utilities;
+  `)
+
+  expect(compiler.build(['tw:[color:theme(--color-red)]', 'tw:text-[theme(--color-red)]']))
+    .toMatchInlineSnapshot(`
+      ".tw\\:\\[color\\:theme\\(--color-red\\)\\] {
+        color: #f00;
+      }
+      .tw\\:text-\\[theme\\(--color-red\\)\\] {
+        color: #f00;
+      }
+      "
+    `)
+
+  compiler = await compile(css`
+    @theme reference prefix(tw) {
+      --color-red: #f00;
+      --color-green: #0f0;
+      --breakpoint-sm: 640px;
+    }
+
+    @tailwind utilities;
   `)
 
   expect(
-    await run(
-      ['tw:[color:theme(--tw-color-red)]', 'tw:text-[theme(--tw-color-red)]'],
-      css`
-        @theme reference prefix(tw) {
-          --color-red: #f00;
-          --color-green: #0f0;
-          --breakpoint-sm: 640px;
-        }
-
-        @tailwind utilities;
-      `,
-    ),
+    compiler.build(['tw:[color:theme(--tw-color-red)]', 'tw:text-[theme(--tw-color-red)]']),
   ).toEqual('')
 })
 
 test('JS theme functions do not use the prefix', async () => {
-  expect(
-    await run(
-      ['tw:my-custom'],
-      css`
-        @theme prefix(tw) {
-          --color-red: #f00;
-          --color-green: #0f0;
-          --breakpoint-sm: 640px;
+  let compiler = await compile(
+    css`
+      @theme prefix(tw) {
+        --color-red: #f00;
+        --color-green: #0f0;
+        --breakpoint-sm: 640px;
+      }
+
+      @plugin "./plugin.js";
+
+      @tailwind utilities;
+    `,
+    {
+      async loadModule(id, base) {
+        return {
+          base,
+          module: plugin(({ addUtilities, theme }) => {
+            addUtilities({
+              '.my-custom': {
+                color: theme('--color-red'),
+              },
+            })
+
+            // The theme function does not use the prefix
+            expect(theme('--tw-color-red')).toEqual(undefined)
+          }),
         }
-
-        @plugin "./plugin.js";
-
-        @tailwind utilities;
-      `,
-      {
-        async loadModule(_id, base) {
-          return {
-            path: '',
-            base,
-            module: plugin(({ addUtilities, theme }) => {
-              addUtilities({
-                '.my-custom': {
-                  color: theme('--color-red'),
-                },
-              })
-
-              // The theme function does not use the prefix
-              expect(theme('--tw-color-red')).toEqual(undefined)
-            }),
-          }
-        },
       },
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .tw\\:my-custom {
-      color: red;
+    },
+  )
+
+  expect(compiler.build(['tw:my-custom'])).toMatchInlineSnapshot(`
+    ".tw\\:my-custom {
+      color: #f00;
     }
     "
   `)
@@ -204,10 +203,9 @@ test('a prefix can be configured via @import theme(…)', async () => {
     }
   `
 
-  let options: Partial<Parameters<typeof compile>[1]> = {
-    async loadStylesheet(_id, base) {
+  let compiler = await compile(input, {
+    async loadStylesheet(id, base) {
       return {
-        path: '',
         base,
         content: css`
           @theme {
@@ -216,39 +214,53 @@ test('a prefix can be configured via @import theme(…)', async () => {
         `,
       }
     },
-  }
+  })
 
   // Prefixed utilities are generated
   expect(
-    await run(
-      ['tw:underline', 'tw:bg-potato', 'tw:hover:line-through', 'tw:custom', 'flex', 'text-potato'],
-      input,
-      options,
-    ),
+    compiler.build([
+      'tw:underline',
+      'tw:bg-potato',
+      'tw:hover:line-through',
+      'tw:custom',
+      'flex',
+      'text-potato',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    .tw\\:bg-potato {
+    ".tw\\:bg-potato {
       background-color: var(--tw-color-potato, #7a4724);
     }
-
     .tw\\:custom {
       color: red;
     }
-
     .tw\\:underline {
       text-decoration-line: underline;
     }
-
-    @media (hover: hover) {
-      .tw\\:hover\\:line-through:hover {
-        text-decoration-line: line-through;
+    .tw\\:hover\\:line-through {
+      &:hover {
+        @media (hover: hover) {
+          text-decoration-line: line-through;
+        }
       }
     }
     "
   `)
 
   // Non-prefixed utilities are ignored
-  expect(await run(['underline', 'hover:line-through', 'custom'], input, options)).toEqual('')
+  compiler = await compile(input, {
+    async loadStylesheet(id, base) {
+      return {
+        base,
+        content: css`
+          @theme {
+            --color-potato: #7a4724;
+          }
+        `,
+      }
+    },
+  })
+
+  expect(compiler.build(['underline', 'hover:line-through', 'custom'])).toMatchInlineSnapshot(`""`)
 })
 
 test('a prefix can be configured via @import prefix(…)', async () => {
@@ -260,10 +272,9 @@ test('a prefix can be configured via @import prefix(…)', async () => {
     }
   `
 
-  let options: Partial<Parameters<typeof compile>[1]> = {
-    async loadStylesheet(_id, base) {
+  let compiler = await compile(input, {
+    async loadStylesheet(id, base) {
       return {
-        path: '',
         base,
         content: css`
           @theme {
@@ -273,42 +284,48 @@ test('a prefix can be configured via @import prefix(…)', async () => {
         `,
       }
     },
-  }
+  })
 
-  expect(
-    await run(
-      ['tw:underline', 'tw:bg-potato', 'tw:hover:line-through', 'tw:custom'],
-      input,
-      options,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --tw-color-potato: #7a4724;
-    }
-
-    .tw\\:bg-potato {
-      background-color: var(--tw-color-potato);
-    }
-
-    .tw\\:custom {
-      color: red;
-    }
-
-    .tw\\:underline {
-      text-decoration-line: underline;
-    }
-
-    @media (hover: hover) {
-      .tw\\:hover\\:line-through:hover {
-        text-decoration-line: line-through;
+  expect(compiler.build(['tw:underline', 'tw:bg-potato', 'tw:hover:line-through', 'tw:custom']))
+    .toMatchInlineSnapshot(`
+      ":root, :host {
+        --tw-color-potato: #7a4724;
       }
-    }
-    "
-  `)
+      .tw\\:bg-potato {
+        background-color: var(--tw-color-potato);
+      }
+      .tw\\:custom {
+        color: red;
+      }
+      .tw\\:underline {
+        text-decoration-line: underline;
+      }
+      .tw\\:hover\\:line-through {
+        &:hover {
+          @media (hover: hover) {
+            text-decoration-line: line-through;
+          }
+        }
+      }
+      "
+    `)
 
   // Non-prefixed utilities are ignored
-  expect(await run(['underline', 'hover:line-through', 'custom'], input, options)).toEqual('')
+  compiler = await compile(input, {
+    async loadStylesheet(id, base) {
+      return {
+        base,
+        content: css`
+          @theme {
+            --color-potato: #7a4724;
+          }
+          @tailwind utilities;
+        `,
+      }
+    },
+  })
+
+  expect(compiler.build(['underline', 'hover:line-through', 'custom'])).toMatchInlineSnapshot(`""`)
 })
 
 test('a prefix must be letters only', async () => {
@@ -322,17 +339,15 @@ test('a prefix must be letters only', async () => {
 })
 
 test('a candidate matching the prefix does not crash', async () => {
-  expect(
-    await run(
-      ['tomato', 'tomato:flex'],
-      css`
-        @theme reference prefix(tomato);
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .tomato\\:flex {
+  let input = css`
+    @theme reference prefix(tomato);
+    @tailwind utilities;
+  `
+
+  let compiler = await compile(input)
+
+  expect(compiler.build(['tomato', 'tomato:flex'])).toMatchInlineSnapshot(`
+    ".tomato\\:flex {
       display: flex;
     }
     "
diff --git a/packages/tailwindcss/src/property-order.ts b/packages/tailwindcss/src/property-order.ts
index bf9f0791a..f2ed4bc51 100644
--- a/packages/tailwindcss/src/property-order.ts
+++ b/packages/tailwindcss/src/property-order.ts
@@ -11,8 +11,6 @@ export default [
   'inset-block',
   'inset-inline-start',
   'inset-inline-end',
-  'inset-block-start',
-  'inset-block-end',
   'top',
   'right',
   'bottom',
@@ -41,8 +39,6 @@ export default [
   'margin-block',
   'margin-inline-start',
   'margin-inline-end',
-  'margin-block-start',
-  'margin-block-end',
   'margin-top',
   'margin-right',
   'margin-bottom',
@@ -92,8 +88,6 @@ export default [
   '--tw-skew-y',
   'transform',
 
-  'zoom',
-
   'animation',
 
   'cursor',
@@ -114,8 +108,6 @@ export default [
   'scroll-margin-block',
   'scroll-margin-inline-start',
   'scroll-margin-inline-end',
-  'scroll-margin-block-start',
-  'scroll-margin-block-end',
   'scroll-margin-top',
   'scroll-margin-right',
   'scroll-margin-bottom',
@@ -126,17 +118,11 @@ export default [
   'scroll-padding-block',
   'scroll-padding-inline-start',
   'scroll-padding-inline-end',
-  'scroll-padding-block-start',
-  'scroll-padding-block-end',
   'scroll-padding-top',
   'scroll-padding-right',
   'scroll-padding-bottom',
   'scroll-padding-left',
 
-  'scrollbar-width',
-  'scrollbar-color',
-  'scrollbar-gutter',
-
   'list-style-position',
   'list-style-type',
   'list-style-image',
@@ -210,8 +196,6 @@ export default [
   'border-block-width',
   'border-inline-start-width',
   'border-inline-end-width',
-  'border-block-start-width',
-  'border-block-end-width',
   'border-top-width',
   'border-right-width',
   'border-bottom-width',
@@ -222,8 +206,6 @@ export default [
   'border-block-style',
   'border-inline-start-style',
   'border-inline-end-style',
-  'border-block-start-style',
-  'border-block-end-style',
   'border-top-style',
   'border-right-style',
   'border-bottom-style',
@@ -234,8 +216,6 @@ export default [
   'border-block-color',
   'border-inline-start-color',
   'border-inline-end-color',
-  'border-block-start-color',
-  'border-block-end-color',
   'border-top-color',
   'border-right-color',
   'border-bottom-color',
@@ -254,59 +234,6 @@ export default [
   '--tw-gradient-to',
   '--tw-gradient-to-position',
 
-  'mask-image',
-
-  // Edge masks
-  '--tw-mask-top',
-  '--tw-mask-top-from-color',
-  '--tw-mask-top-from-position',
-  '--tw-mask-top-to-color',
-  '--tw-mask-top-to-position',
-
-  '--tw-mask-right',
-  '--tw-mask-right-from-color',
-  '--tw-mask-right-from-position',
-  '--tw-mask-right-to-color',
-  '--tw-mask-right-to-position',
-
-  '--tw-mask-bottom',
-  '--tw-mask-bottom-from-color',
-  '--tw-mask-bottom-from-position',
-  '--tw-mask-bottom-to-color',
-  '--tw-mask-bottom-to-position',
-
-  '--tw-mask-left',
-  '--tw-mask-left-from-color',
-  '--tw-mask-left-from-position',
-  '--tw-mask-left-to-color',
-  '--tw-mask-left-to-position',
-
-  // Linear masks
-  '--tw-mask-linear',
-  '--tw-mask-linear-position',
-  '--tw-mask-linear-from-color',
-  '--tw-mask-linear-from-position',
-  '--tw-mask-linear-to-color',
-  '--tw-mask-linear-to-position',
-
-  // Radial masks
-  '--tw-mask-radial',
-  '--tw-mask-radial-shape',
-  '--tw-mask-radial-size',
-  '--tw-mask-radial-position',
-  '--tw-mask-radial-from-color',
-  '--tw-mask-radial-from-position',
-  '--tw-mask-radial-to-color',
-  '--tw-mask-radial-to-position',
-
-  // Conic masks
-  '--tw-mask-conic',
-  '--tw-mask-conic-position',
-  '--tw-mask-conic-from-color',
-  '--tw-mask-conic-from-position',
-  '--tw-mask-conic-to-color',
-  '--tw-mask-conic-to-position',
-
   'box-decoration-break',
 
   'background-size',
@@ -316,15 +243,6 @@ export default [
   'background-repeat',
   'background-origin',
 
-  'mask-composite',
-  'mask-mode',
-  'mask-type',
-  'mask-size',
-  'mask-clip',
-  'mask-position',
-  'mask-repeat',
-  'mask-origin',
-
   'fill',
   'stroke',
   'stroke-width',
@@ -337,8 +255,6 @@ export default [
   'padding-block',
   'padding-inline-start',
   'padding-inline-end',
-  'padding-block-start',
-  'padding-block-end',
   'padding-top',
   'padding-right',
   'padding-bottom',
@@ -349,7 +265,6 @@ export default [
   'vertical-align',
 
   'font-family',
-  'font-feature-settings',
   'font-size',
   'line-height',
   'font-weight',
@@ -360,7 +275,6 @@ export default [
   'text-overflow',
   'hyphens',
   'white-space',
-  'tab-size',
 
   'color',
   'text-transform',
diff --git a/packages/tailwindcss/src/selector-parser.test.ts b/packages/tailwindcss/src/selector-parser.test.ts
deleted file mode 100644
index fa38dc578..000000000
--- a/packages/tailwindcss/src/selector-parser.test.ts
+++ /dev/null
@@ -1,620 +0,0 @@
-import { describe, expect, it } from 'vitest'
-import { parse, toCss } from './selector-parser'
-import { walk, WalkAction } from './walk'
-
-describe('parse', () => {
-  it('should parse a simple selector', () => {
-    expect(parse('.foo')).toEqual([{ kind: 'selector', value: '.foo' }])
-  })
-
-  it('should parse a compound selector', () => {
-    expect(parse('.foo.bar:hover#id')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '.bar' },
-          { kind: 'selector', value: ':hover' },
-          { kind: 'selector', value: '#id' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse a pseudo-element selector with double ::', () => {
-    expect(parse('.foo::before')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '::before' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse a selector list', () => {
-    expect(parse('.foo,.bar')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-  })
-
-  // We've got 3 options here:
-  //
-  // 1. We could throw, but then it becomes more annoying when you don't have
-  //    control over the CSS (for example when it's coming from a package).
-  // 2. We could parse it and ignore the invalid cases as-if they weren't there.
-  //    Re-printing the AST would turn it into a valid situation.
-  // 3. We could parse the invalid case and turn it into a `compound` such that
-  //    it stays invalid. When we re-print we would re-introduce the error.
-  //
-  // Before this change, we would keep the errors, and pass it along:
-  // - In a browser environment, these would be ignored
-  // - In Lightning CSS, these are thrown out
-  //
-  // For that reason alone, let's go with option 3 for now, such that the
-  // behavior is the same as before. This does mean that we see "weird" empty
-  // compound nodes.
-  it('should safely parse an invalid selector list', () => {
-    expect(parse('.foo,')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'compound', nodes: [] },
-        ],
-      },
-    ])
-    expect(parse(',.foo')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'compound', nodes: [] },
-          { kind: 'selector', value: '.foo' },
-        ],
-      },
-    ])
-    expect(parse(',.foo,')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'compound', nodes: [] },
-          { kind: 'selector', value: '.foo' },
-          { kind: 'compound', nodes: [] },
-        ],
-      },
-    ])
-    expect(parse('.foo,,.bar')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'compound', nodes: [] },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse selector lists with whitespace around the comma', () => {
-    expect(parse('.foo, .bar')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-
-    expect(parse('.foo , .bar')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-
-    expect(parse('.foo ,.bar')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse a list of attribute selectors', () => {
-    expect(parse('[foo],[bar]')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '[foo]' },
-          { kind: 'selector', value: '[bar]' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse a list of selectors with just functions', () => {
-    expect(parse(':is(.a),:is(.b)')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'function', value: ':is', nodes: [{ kind: 'selector', value: '.a' }] },
-          { kind: 'function', value: ':is', nodes: [{ kind: 'selector', value: '.b' }] },
-        ],
-      },
-    ])
-  })
-
-  it('should parse selector lists with more than two selectors', () => {
-    expect(parse('.foo,.bar,.baz')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '.bar' },
-          { kind: 'selector', value: '.baz' },
-        ],
-      },
-    ])
-  })
-
-  it('should group selectors with combinators in a selector list', () => {
-    expect(parse('.a+.b, .c .d[attr], .e')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          {
-            kind: 'complex',
-            nodes: [
-              { kind: 'selector', value: '.a' },
-              { kind: 'combinator', value: '+' },
-              { kind: 'selector', value: '.b' },
-            ],
-          },
-          {
-            kind: 'complex',
-            nodes: [
-              { kind: 'selector', value: '.c' },
-              { kind: 'combinator', value: ' ' },
-              {
-                kind: 'compound',
-                nodes: [
-                  { kind: 'selector', value: '.d' },
-                  { kind: 'selector', value: '[attr]' },
-                ],
-              },
-            ],
-          },
-          { kind: 'selector', value: '.e' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse complex selectors in a selector list', () => {
-    expect(parse('#a.b > .c, .d')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          {
-            kind: 'complex',
-            nodes: [
-              {
-                kind: 'compound',
-                nodes: [
-                  { kind: 'selector', value: '#a' },
-                  { kind: 'selector', value: '.b' },
-                ],
-              },
-              { kind: 'combinator', value: '>' },
-              { kind: 'selector', value: '.c' },
-            ],
-          },
-          { kind: 'selector', value: '.d' },
-        ],
-      },
-    ])
-  })
-
-  it('should combine everything within attribute selectors', () => {
-    expect(parse('.foo[bar="baz"]')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: '[bar="baz"]' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse functions', () => {
-    expect(parse('.foo:hover:not(.bar:focus)')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'selector', value: ':hover' },
-          {
-            kind: 'function',
-            value: ':not',
-            nodes: [
-              {
-                kind: 'compound',
-                nodes: [
-                  { kind: 'selector', value: '.bar' },
-                  { kind: 'selector', value: ':focus' },
-                ],
-              },
-            ],
-          },
-        ],
-      },
-    ])
-  })
-
-  it('should parse selector lists in functions', () => {
-    expect(parse(':is(.foo, .bar)')).toEqual([
-      {
-        kind: 'function',
-        value: ':is',
-        nodes: [
-          {
-            kind: 'list',
-            nodes: [
-              { kind: 'selector', value: '.foo' },
-              { kind: 'selector', value: '.bar' },
-            ],
-          },
-        ],
-      },
-    ])
-  })
-
-  it('should handle next-children combinator', () => {
-    expect(parse('.foo + p')).toEqual([
-      {
-        kind: 'complex',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'combinator', value: '+' },
-          { kind: 'selector', value: 'p' },
-        ],
-      },
-    ])
-  })
-
-  it('should normalize combinators', () => {
-    expect(parse('.foo + .bar')).toEqual([
-      {
-        kind: 'complex',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'combinator', value: '+' },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-
-    expect(parse('.foo  \n\t .bar')).toEqual([
-      {
-        kind: 'complex',
-        nodes: [
-          { kind: 'selector', value: '.foo' },
-          { kind: 'combinator', value: ' ' },
-          { kind: 'selector', value: '.bar' },
-        ],
-      },
-    ])
-  })
-
-  it('should handle escaped characters', () => {
-    expect(parse('foo\\.bar')).toEqual([{ kind: 'selector', value: 'foo\\.bar' }])
-  })
-
-  it('parses :nth-child()', () => {
-    // The `An+B` part is not a selector, it stays an opaque value
-    expect(parse(':nth-child(n+1)')).toEqual([
-      {
-        kind: 'function',
-        value: ':nth-child',
-        nodes: [{ kind: 'value', value: 'n+1' }],
-      },
-    ])
-
-    // The selector list after `of` is parsed as a selector
-    expect(parse(':nth-child(2 of &)')).toEqual([
-      {
-        kind: 'function',
-        value: ':nth-child',
-        nodes: [
-          { kind: 'value', value: '2 of ' },
-          { kind: 'selector', value: '&' },
-        ],
-      },
-    ])
-
-    expect(parse(':nth-child(2n + 1 of .foo, .bar)')).toEqual([
-      {
-        kind: 'function',
-        value: ':nth-child',
-        nodes: [
-          { kind: 'value', value: '2n + 1 of ' },
-          {
-            kind: 'list',
-            nodes: [
-              { kind: 'selector', value: '.foo' },
-              { kind: 'selector', value: '.bar' },
-            ],
-          },
-        ],
-      },
-    ])
-  })
-
-  it('parses &:has(.child:nth-child(2))', () => {
-    expect(parse('&:has(.child:nth-child(2))')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          {
-            kind: 'selector',
-            value: '&',
-          },
-          {
-            kind: 'function',
-            value: ':has',
-            nodes: [
-              {
-                kind: 'compound',
-                nodes: [
-                  {
-                    kind: 'selector',
-                    value: '.child',
-                  },
-                  {
-                    kind: 'function',
-                    value: ':nth-child',
-                    nodes: [
-                      {
-                        kind: 'value',
-                        value: '2',
-                      },
-                    ],
-                  },
-                ],
-              },
-            ],
-          },
-        ],
-      },
-    ])
-  })
-
-  it('parses &:has(:nth-child(2))', () => {
-    expect(parse('&:has(:nth-child(2))')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          {
-            kind: 'selector',
-            value: '&',
-          },
-          {
-            kind: 'function',
-            value: ':has',
-            nodes: [
-              {
-                kind: 'function',
-                value: ':nth-child',
-                nodes: [
-                  {
-                    kind: 'value',
-                    value: '2',
-                  },
-                ],
-              },
-            ],
-          },
-        ],
-      },
-    ])
-  })
-
-  it('parses nesting selector before attribute selector', () => {
-    expect(parse('&[data-foo]')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '&' },
-          { kind: 'selector', value: '[data-foo]' },
-        ],
-      },
-    ])
-  })
-
-  it('parses nesting selector after an attribute selector', () => {
-    expect(parse('[data-foo]&')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '[data-foo]' },
-          { kind: 'selector', value: '&' },
-        ],
-      },
-    ])
-  })
-
-  it('parses universal selector before attribute selector', () => {
-    expect(parse('*[data-foo]')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '*' },
-          { kind: 'selector', value: '[data-foo]' },
-        ],
-      },
-    ])
-  })
-
-  it('parses the universal selector after an attribute selector', () => {
-    expect(parse('[data-foo]*')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '[data-foo]' },
-          { kind: 'selector', value: '*' },
-        ],
-      },
-    ])
-  })
-
-  it('parses another attribute selector after an attribute selector', () => {
-    expect(parse('[data-foo][data-bar]')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '[data-foo]' },
-          { kind: 'selector', value: '[data-bar]' },
-        ],
-      },
-    ])
-  })
-
-  it('parses a type selector before an attribute selector', () => {
-    expect(parse('div[data-foo]')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: 'div' },
-          { kind: 'selector', value: '[data-foo]' },
-        ],
-      },
-    ])
-  })
-
-  it('parses a type selector after an attribute selector', () => {
-    expect(parse('[data-foo]div')).toEqual([
-      {
-        kind: 'compound',
-        nodes: [
-          { kind: 'selector', value: '[data-foo]' },
-          { kind: 'selector', value: 'div' },
-        ],
-      },
-    ])
-  })
-
-  it('should parse selector lists as real selectors', () => {
-    expect(parse('.foo[attr], .bar#id, .baz + .qux')).toEqual([
-      {
-        kind: 'list',
-        nodes: [
-          {
-            kind: 'compound',
-            nodes: [
-              { kind: 'selector', value: '.foo' },
-              { kind: 'selector', value: '[attr]' },
-            ],
-          },
-          {
-            kind: 'compound',
-            nodes: [
-              { kind: 'selector', value: '.bar' },
-              { kind: 'selector', value: '#id' },
-            ],
-          },
-          {
-            kind: 'complex',
-            nodes: [
-              { kind: 'selector', value: '.baz' },
-              { kind: 'combinator', value: '+' },
-              { kind: 'selector', value: '.qux' },
-            ],
-          },
-        ],
-      },
-    ])
-  })
-})
-
-describe('toCss', () => {
-  it('should print a simple selector', () => {
-    expect(toCss(parse('.foo'))).toBe('.foo')
-  })
-
-  it('should print a compound selector', () => {
-    expect(toCss(parse('.foo.bar:hover#id'))).toBe('.foo.bar:hover#id')
-  })
-
-  it('should print a selector list', () => {
-    expect(toCss(parse('.foo, .bar'))).toBe('.foo, .bar')
-  })
-
-  it('should print a selector list with normalized commas', () => {
-    expect(toCss(parse('.foo,.bar'))).toBe('.foo, .bar')
-    expect(toCss(parse('.foo, .bar'))).toBe('.foo, .bar')
-    expect(toCss(parse('.foo , .bar'))).toBe('.foo, .bar')
-    expect(toCss(parse('.foo ,.bar'))).toBe('.foo, .bar')
-  })
-
-  it('should print a selector list but minimized', () => {
-    expect(toCss(parse('.foo, .bar'), true)).toBe('.foo,.bar')
-    expect(toCss(parse('.foo , .bar'), true)).toBe('.foo,.bar')
-    expect(toCss(parse('.foo ,.bar'), true)).toBe('.foo,.bar')
-  })
-
-  it('should print an attribute selectors', () => {
-    expect(toCss(parse('.foo[bar="baz"]'))).toBe('.foo[bar="baz"]')
-  })
-
-  it('should print a function', () => {
-    expect(toCss(parse('.foo:hover:not(.bar:focus)'))).toBe('.foo:hover:not(.bar:focus)')
-  })
-
-  it('should print escaped characters', () => {
-    expect(toCss(parse('foo\\.bar'))).toBe('foo\\.bar')
-  })
-
-  it('should print :nth-child()', () => {
-    // The `An+B` part is printed verbatim, whitespace in the selector list
-    // after `of` is normalized
-    expect(toCss(parse(':nth-child(n+1)'))).toBe(':nth-child(n+1)')
-    expect(toCss(parse(':nth-child(+2)'))).toBe(':nth-child(+2)')
-    expect(toCss(parse(':nth-child(2n + 1 of .foo,.bar)'))).toBe(':nth-child(2n + 1 of .foo, .bar)')
-  })
-
-  it('should pretty print a complex selector', () => {
-    expect(toCss(parse('.a+.b, .c .d[attr], .e'))).toBe('.a + .b, .c .d[attr], .e')
-  })
-
-  it('should minify a complex selector during printing', () => {
-    expect(toCss(parse('.a+.b, .c .d[attr], .e'), true)).toBe('.a+.b,.c .d[attr],.e')
-    //                                                                 ^ This space is significant to indicate a descendant combinator
-  })
-})
-
-describe('walk', () => {
-  it('can be used to replace a function call', () => {
-    const ast = parse('.foo:hover:not(.bar:focus)')
-    walk(ast, (node) => {
-      if (node.kind === 'function' && node.value === ':not') {
-        return WalkAction.Replace({ kind: 'selector', value: '.inverted-bar' } as const)
-      }
-    })
-    expect(toCss(ast)).toBe('.foo:hover.inverted-bar')
-  })
-})
diff --git a/packages/tailwindcss/src/selector-parser.ts b/packages/tailwindcss/src/selector-parser.ts
deleted file mode 100644
index 2a435f687..000000000
--- a/packages/tailwindcss/src/selector-parser.ts
+++ /dev/null
@@ -1,627 +0,0 @@
-type Combinator =
-  | ' ' // Descendant combinator
-  | '>' // Child combinator
-  | '+' // Next-sibling combinator
-  | '~' // Subsequent-sibling combinator
-
-export type SelectorListNode = {
-  kind: 'list'
-  nodes: SelectorAstNode[]
-}
-
-export type SelectorCombinatorNode = {
-  kind: 'combinator'
-  value: Combinator
-}
-
-export type SelectorComplexNode = {
-  kind: 'complex'
-  nodes: SelectorAstNode[]
-}
-
-export type SelectorCompoundNode = {
-  kind: 'compound'
-  nodes: SelectorAstNode[]
-}
-
-export type SelectorNode = {
-  kind: 'selector'
-  value: string
-}
-
-export type SelectorFunctionNode = {
-  kind: 'function'
-  value: string
-  nodes: SelectorAstNode[]
-}
-
-export type SelectorValueNode = {
-  kind: 'value'
-  value: string
-}
-
-export type SelectorAstNode =
-  | SelectorFunctionNode
-  | SelectorCombinatorNode
-  | SelectorComplexNode
-  | SelectorCompoundNode
-  | SelectorListNode
-  | SelectorNode
-  | SelectorValueNode
-
-function combinator(value: Combinator): SelectorCombinatorNode {
-  return {
-    kind: 'combinator',
-    value,
-  }
-}
-
-function complex(nodes: SelectorAstNode[]): SelectorComplexNode {
-  return {
-    kind: 'complex',
-    nodes,
-  }
-}
-
-function compound(nodes: SelectorAstNode[]): SelectorCompoundNode {
-  return {
-    kind: 'compound',
-    nodes,
-  }
-}
-
-export function fun(value: string, nodes: SelectorAstNode[]): SelectorFunctionNode {
-  return {
-    kind: 'function',
-    value,
-    nodes,
-  }
-}
-
-function list(nodes: SelectorAstNode[]): SelectorListNode {
-  return {
-    kind: 'list',
-    nodes,
-  }
-}
-
-export function selector(value: string): SelectorNode {
-  return {
-    kind: 'selector',
-    value,
-  }
-}
-
-function value(value: string): SelectorValueNode {
-  return {
-    kind: 'value',
-    value,
-  }
-}
-
-export function isUniversalSelector(node: SelectorAstNode): boolean {
-  return node.kind === 'selector' && node.value.charCodeAt(0) === ASTERISK
-}
-
-export function isNestingSelector(node: SelectorAstNode): boolean {
-  return node.kind === 'selector' && node.value.charCodeAt(0) === AMPERSAND
-}
-
-export function isClassSelector(node: SelectorAstNode): boolean {
-  return node.kind === 'selector' && node.value.charCodeAt(0) === DOT
-}
-
-export function isIdSelector(node: SelectorAstNode): boolean {
-  return node.kind === 'selector' && node.value.charCodeAt(0) === HASH
-}
-
-export function isPseudoSelector(node: SelectorAstNode): boolean {
-  return node.kind === 'selector' && node.value.charCodeAt(0) === COLON
-}
-
-export function isAttributeSelector(node: SelectorAstNode): boolean {
-  return node.kind === 'selector' && node.value.charCodeAt(0) === OPEN_BRACKET
-}
-
-export function isTypeSelector(node: SelectorAstNode): boolean {
-  if (node.kind !== 'selector') return false
-
-  switch (node.value.charCodeAt(0)) {
-    case ASTERISK: // Universal selector
-    case AMPERSAND: // Nesting selector
-    case DOT: // Class selector
-    case HASH: // ID selector
-    case COLON: // Pseudo selector
-    case OPEN_BRACKET: // Attribute selector
-      return false
-
-    // We don't fully verify whether this is actually a proper type selector,
-    // but we assume it is one if it's not any of the other ones.
-    default:
-      return true
-  }
-}
-
-export function cloneAstNode<T extends SelectorAstNode>(node: T): T {
-  switch (node.kind) {
-    case 'combinator':
-    case 'selector':
-    case 'value':
-      return {
-        kind: node.kind,
-        value: node.value,
-      } as T
-
-    case 'complex':
-    case 'compound':
-    case 'list':
-      return {
-        kind: node.kind,
-        nodes: node.nodes.map(cloneAstNode),
-      } as T
-
-    case 'function':
-      return {
-        kind: node.kind,
-        value: node.value,
-        nodes: node.nodes.map(cloneAstNode),
-      } satisfies SelectorFunctionNode as T
-
-    default:
-      node satisfies never
-      throw new Error(`Unknown node kind: ${(node as any).kind}`)
-  }
-}
-
-export function toCss(ast: SelectorAstNode[], minify = false) {
-  let css = ''
-  for (let node of ast) {
-    switch (node.kind) {
-      case 'selector':
-      case 'value': {
-        css += node.value
-        break
-      }
-      case 'combinator': {
-        if (minify || node.value === ' ') {
-          css += node.value
-        } else {
-          css += ` ${node.value} `
-        }
-        break
-      }
-
-      case 'function': {
-        css += `${node.value}(${toCss(node.nodes, minify)})`
-        break
-      }
-      case 'complex':
-      case 'compound': {
-        css += toCss(node.nodes, minify)
-        break
-      }
-      case 'list': {
-        css += node.nodes.map((node) => toCss([node], minify)).join(minify ? ',' : ', ')
-        break
-      }
-    }
-  }
-  return css
-}
-
-const BACKSLASH = 0x5c
-const CLOSE_BRACKET = 0x5d
-const CLOSE_PAREN = 0x29
-const COLON = 0x3a
-const COMMA = 0x2c
-const DOUBLE_QUOTE = 0x22
-const DOT = 0x2e
-const GREATER_THAN = 0x3e
-const NEWLINE = 0x0a
-const HASH = 0x23
-const OPEN_BRACKET = 0x5b
-const OPEN_PAREN = 0x28
-const PLUS = 0x2b
-const SINGLE_QUOTE = 0x27
-const SPACE = 0x20
-const TAB = 0x09
-const TILDE = 0x7e
-const AMPERSAND = 0x26
-const ASTERISK = 0x2a
-
-export function parse(input: string) {
-  input = input.replaceAll('\r\n', '\n')
-
-  let ast: SelectorAstNode[] = []
-
-  let target = ast
-
-  let containsCombinator = false
-
-  let contextStack: {
-    target: SelectorAstNode[]
-    currentList: SelectorListNode | null
-    containsCombinator: boolean
-  }[] = []
-
-  let currentList: SelectorListNode | null = null
-
-  let buffer = ''
-
-  let peekChar
-
-  function current(nodes = target): SelectorAstNode {
-    return nodes.length === 1 ? nodes[0] : containsCombinator ? complex(nodes) : compound(nodes)
-  }
-
-  function append(node: SelectorAstNode) {
-    let existing = target[target.length - 1]
-
-    if (existing?.kind === 'compound') {
-      existing.nodes.push(node)
-    } else if (existing && existing.kind !== 'list' && existing.kind !== 'combinator') {
-      target[target.length - 1] = compound([existing, node])
-    } else {
-      target.push(node)
-    }
-  }
-
-  for (let i = 0; i < input.length; i++) {
-    let currentChar = input.charCodeAt(i)
-
-    switch (currentChar) {
-      // Handle selector lists
-      //
-      // ```css
-      // .foo, .bar {}
-      //     ^
-      // ```
-      case COMMA: {
-        // Flush remaining buffer as a selector
-        if (buffer.length > 0) {
-          append(selector(buffer))
-          buffer = ''
-        }
-
-        // Skip whitespace
-        for (; i + 1 < input.length; i++) {
-          peekChar = input.charCodeAt(i + 1)
-          if (peekChar !== NEWLINE && peekChar !== SPACE && peekChar !== TAB) {
-            break
-          }
-        }
-
-        // Add nodes to the current list
-        if (currentList) {
-          currentList.nodes.push(current())
-          target = []
-          containsCombinator = false
-        }
-
-        // Start a new list
-        else {
-          let nodes = target.splice(0)
-          let item = current(nodes)
-          let node = list([item])
-          target.push(node)
-          currentList = node
-          target = []
-          containsCombinator = false
-        }
-
-        break
-      }
-
-      // Handle combinators
-      //
-      // E.g.:
-      //
-      // ```css
-      // .foo .bar
-      //     ^
-      //
-      // .foo > .bar
-      //     ^^^
-      // ```
-      case GREATER_THAN:
-      case NEWLINE:
-      case SPACE:
-      case PLUS:
-      case TAB:
-      case TILDE: {
-        // Flush remaining buffer as a selector
-        if (buffer.length > 0) {
-          append(selector(buffer))
-          buffer = ''
-        }
-
-        // Look ahead and find the end of the combinator
-        let start = i
-        let end = i + 1
-        for (; end < input.length; end++) {
-          peekChar = input.charCodeAt(end)
-          if (
-            peekChar !== GREATER_THAN &&
-            peekChar !== NEWLINE &&
-            peekChar !== SPACE &&
-            peekChar !== PLUS &&
-            peekChar !== TAB &&
-            peekChar !== TILDE
-          ) {
-            break
-          }
-        }
-        i = end - 1
-
-        let value = input.slice(start, end).trim()
-        if (
-          value === '' &&
-          (target.length === 0 || end >= input.length || input.charCodeAt(end) === COMMA)
-        ) {
-          break
-        }
-
-        target.push(combinator((value === '' ? ' ' : value) as Combinator))
-        containsCombinator = true
-
-        break
-      }
-
-      // Start of a function call
-      //
-      // E.g.:
-      //
-      // ```css
-      // .foo:not(.bar)
-      //         ^
-      // ```
-      case OPEN_PAREN: {
-        let node = fun(buffer, [])
-        buffer = ''
-
-        // If the function is not one of the following, we combine all its
-        // contents into a single value node
-        if (
-          node.value !== ':not' &&
-          node.value !== ':where' &&
-          node.value !== ':has' &&
-          node.value !== ':is'
-        ) {
-          // Find the end of the function call
-          let start = i + 1
-          let nesting = 0
-
-          // Find the closing bracket
-          for (let j = i + 1; j < input.length; j++) {
-            peekChar = input.charCodeAt(j)
-            if (peekChar === OPEN_PAREN) {
-              nesting++
-              continue
-            }
-            if (peekChar === CLOSE_PAREN) {
-              if (nesting === 0) {
-                i = j
-                break
-              }
-              nesting--
-            }
-          }
-          let end = i
-
-          let contents = input.slice(start, end)
-
-          // `:nth-child(…)` and `:nth-last-child(…)` can contain an
-          // `of <complex-selector-list>` clause. The selector list must be
-          // parsed (e.g. to be able to substitute `&`), but the `An+B` part
-          // is not a selector so it stays an opaque value node. E.g.:
-          //
-          // ```css
-          // :nth-child(2n + 1 of .foo, .bar)
-          //            ^^^^^^^^^^ value
-          //                       ^^^^^^^^^^ selector list
-          // ```
-          if (node.value === ':nth-child' || node.value === ':nth-last-child') {
-            let idx = contents.indexOf('of ')
-            if (idx !== -1) {
-              node.nodes.push(
-                value(
-                  contents.slice(0, idx + 3), // value `2n + 1 of `
-                ),
-                ...parse(
-                  contents.slice(idx + 3), // `.foo, .bar`
-                ),
-              )
-              buffer = ''
-              i = end
-
-              append(node)
-
-              break
-            }
-          }
-
-          node.nodes.push(value(contents))
-          buffer = ''
-          i = end
-
-          append(node)
-
-          break
-        }
-
-        append(node)
-        contextStack.push({ target, currentList, containsCombinator })
-        target = node.nodes
-        containsCombinator = false
-        currentList = null
-
-        break
-      }
-
-      // End of a function call
-      //
-      // E.g.:
-      //
-      // ```css
-      // foo(bar, baz)
-      //             ^
-      // ```
-      case CLOSE_PAREN: {
-        // Flush remaining buffer as a selector
-        if (buffer.length > 0) {
-          append(selector(buffer))
-          buffer = ''
-        }
-
-        if (currentList) {
-          currentList.nodes.push(current())
-        } else if (containsCombinator) {
-          target.splice(0, target.length, complex(target.splice(0)))
-        }
-
-        let context = contextStack.pop()
-        target = context?.target ?? ast
-        currentList = context?.currentList ?? null
-        containsCombinator = context?.containsCombinator ?? false
-
-        break
-      }
-
-      // Split compound selectors
-      //
-      // E.g.:
-      //
-      // ```css
-      // .foo.bar
-      //     ^
-      // ```
-      case DOT:
-      case COLON:
-      case HASH: {
-        if (currentChar === COLON && buffer === ':') {
-          buffer += input[i]
-          break
-        }
-
-        // Handle everything before the combinator as a selector and start a new
-        // selector
-        if (buffer.length > 0) {
-          append(selector(buffer))
-        }
-        buffer = input[i]
-        break
-      }
-
-      // Start of an attribute selector
-      //
-      // NOTE: Right now we don't care about the individual parts of the
-      // attribute selector, we just want to find the matching closing bracket.
-      //
-      // If we need more information from inside the attribute selector in the
-      // future, then we can use the `AttributeSelectorParser` here (and even
-      // inline it if needed)
-      case OPEN_BRACKET: {
-        // Flush remaining buffer as a selector
-        if (buffer.length > 0) {
-          append(selector(buffer))
-          buffer = ''
-        }
-
-        let start = i
-        let nesting = 0
-
-        // Find the closing bracket
-        for (let j = i + 1; j < input.length; j++) {
-          peekChar = input.charCodeAt(j)
-          if (peekChar === OPEN_BRACKET) {
-            nesting++
-            continue
-          }
-          if (peekChar === CLOSE_BRACKET) {
-            if (nesting === 0) {
-              i = j
-              break
-            }
-            nesting--
-          }
-        }
-
-        append(selector(input.slice(start, i + 1)))
-        break
-      }
-
-      // Start of a string
-      case SINGLE_QUOTE:
-      case DOUBLE_QUOTE: {
-        let start = i
-
-        // We need to ensure that the closing quote is the same as the opening
-        // quote.
-        //
-        // E.g.:
-        //
-        // ```css
-        // "This is a string with a 'quote' in it"
-        //                          ^     ^         -> These are not the end of the string
-        // ```
-        for (let j = i + 1; j < input.length; j++) {
-          peekChar = input.charCodeAt(j)
-          // Current character is a `\` therefore the next character is escaped
-          if (peekChar === BACKSLASH) {
-            j += 1
-          }
-
-          // End of the string
-          else if (peekChar === currentChar) {
-            i = j
-            break
-          }
-        }
-
-        // Adjust `buffer` to include the string
-        buffer += input.slice(start, i + 1)
-        break
-      }
-
-      // Nesting `&` is always a new selector
-      // Universal `*` is always a new selector
-      case AMPERSAND:
-      case ASTERISK: {
-        // Flush remaining buffer as a selector
-        if (buffer.length > 0) {
-          append(selector(buffer))
-          buffer = ''
-        }
-
-        // Handle the `&` or `*` as a selector on its own
-        append(selector(input[i]))
-        break
-      }
-
-      // Escaped characters
-      case BACKSLASH: {
-        buffer += input[i] + input[i + 1]
-        i += 1
-        break
-      }
-
-      // Everything else will be collected in the buffer
-      default: {
-        buffer += input[i]
-      }
-    }
-  }
-
-  // Collect the remainder as a selector
-  if (buffer.length > 0) {
-    append(selector(buffer))
-  }
-
-  if (currentList) {
-    currentList.nodes.push(current())
-  } else if (containsCombinator) {
-    target.splice(0, target.length, complex(target.splice(0)))
-  }
-
-  return ast
-}
diff --git a/packages/tailwindcss/src/source-maps/line-table.bench.ts b/packages/tailwindcss/src/source-maps/line-table.bench.ts
deleted file mode 100644
index 862e2d398..000000000
--- a/packages/tailwindcss/src/source-maps/line-table.bench.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-import { readFileSync } from 'node:fs'
-import { fileURLToPath } from 'node:url'
-
-import { bench } from 'vitest'
-import { createLineTable } from './line-table'
-
-const currentFolder = fileURLToPath(new URL('..', import.meta.url))
-const cssFile = readFileSync(currentFolder + '../preflight.css', 'utf-8')
-const table = createLineTable(cssFile)
-
-bench('line table lookups', () => {
-  for (let i = 0; i < cssFile.length; ++i) table.find(i)
-})
diff --git a/packages/tailwindcss/src/source-maps/line-table.test.ts b/packages/tailwindcss/src/source-maps/line-table.test.ts
deleted file mode 100644
index 23c46243b..000000000
--- a/packages/tailwindcss/src/source-maps/line-table.test.ts
+++ /dev/null
@@ -1,87 +0,0 @@
-import dedent from 'dedent'
-import { expect, test } from 'vitest'
-import { createLineTable } from './line-table'
-
-const css = dedent
-
-test('line tables', () => {
-  let text = css`
-    .foo {
-      color: red;
-    }
-  `
-
-  let table = createLineTable(`${text}\n`)
-
-  // Line 1: `.foo {\n`
-  expect(table.find(0)).toEqual({ line: 1, column: 0 })
-  expect(table.find(1)).toEqual({ line: 1, column: 1 })
-  expect(table.find(2)).toEqual({ line: 1, column: 2 })
-  expect(table.find(3)).toEqual({ line: 1, column: 3 })
-  expect(table.find(4)).toEqual({ line: 1, column: 4 })
-  expect(table.find(5)).toEqual({ line: 1, column: 5 })
-  expect(table.find(6)).toEqual({ line: 1, column: 6 })
-
-  // Line 2: `  color: red;\n`
-  expect(table.find(6 + 1)).toEqual({ line: 2, column: 0 })
-  expect(table.find(6 + 2)).toEqual({ line: 2, column: 1 })
-  expect(table.find(6 + 3)).toEqual({ line: 2, column: 2 })
-  expect(table.find(6 + 4)).toEqual({ line: 2, column: 3 })
-  expect(table.find(6 + 5)).toEqual({ line: 2, column: 4 })
-  expect(table.find(6 + 6)).toEqual({ line: 2, column: 5 })
-  expect(table.find(6 + 7)).toEqual({ line: 2, column: 6 })
-  expect(table.find(6 + 8)).toEqual({ line: 2, column: 7 })
-  expect(table.find(6 + 9)).toEqual({ line: 2, column: 8 })
-  expect(table.find(6 + 10)).toEqual({ line: 2, column: 9 })
-  expect(table.find(6 + 11)).toEqual({ line: 2, column: 10 })
-  expect(table.find(6 + 12)).toEqual({ line: 2, column: 11 })
-  expect(table.find(6 + 13)).toEqual({ line: 2, column: 12 })
-
-  // Line 3: `}\n`
-  expect(table.find(20 + 1)).toEqual({ line: 3, column: 0 })
-  expect(table.find(20 + 2)).toEqual({ line: 3, column: 1 })
-
-  // After the new line
-  expect(table.find(22 + 1)).toEqual({ line: 4, column: 0 })
-})
-
-test('line tables findOffset', () => {
-  let text = css`
-    .foo {
-      color: red;
-    }
-  `
-
-  let table = createLineTable(`${text}\n`)
-
-  // Line 1: `.foo {\n`
-  expect(table.findOffset({ line: 1, column: 0 })).toEqual(0)
-  expect(table.findOffset({ line: 1, column: 1 })).toEqual(1)
-  expect(table.findOffset({ line: 1, column: 2 })).toEqual(2)
-  expect(table.findOffset({ line: 1, column: 3 })).toEqual(3)
-  expect(table.findOffset({ line: 1, column: 4 })).toEqual(4)
-  expect(table.findOffset({ line: 1, column: 5 })).toEqual(5)
-  expect(table.findOffset({ line: 1, column: 6 })).toEqual(6)
-
-  // Line 2: `  color: red;\n`
-  expect(table.findOffset({ line: 2, column: 0 })).toEqual(6 + 1)
-  expect(table.findOffset({ line: 2, column: 1 })).toEqual(6 + 2)
-  expect(table.findOffset({ line: 2, column: 2 })).toEqual(6 + 3)
-  expect(table.findOffset({ line: 2, column: 3 })).toEqual(6 + 4)
-  expect(table.findOffset({ line: 2, column: 4 })).toEqual(6 + 5)
-  expect(table.findOffset({ line: 2, column: 5 })).toEqual(6 + 6)
-  expect(table.findOffset({ line: 2, column: 6 })).toEqual(6 + 7)
-  expect(table.findOffset({ line: 2, column: 7 })).toEqual(6 + 8)
-  expect(table.findOffset({ line: 2, column: 8 })).toEqual(6 + 9)
-  expect(table.findOffset({ line: 2, column: 9 })).toEqual(6 + 10)
-  expect(table.findOffset({ line: 2, column: 10 })).toEqual(6 + 11)
-  expect(table.findOffset({ line: 2, column: 11 })).toEqual(6 + 12)
-  expect(table.findOffset({ line: 2, column: 12 })).toEqual(6 + 13)
-
-  // Line 3: `}\n`
-  expect(table.findOffset({ line: 3, column: 0 })).toEqual(20 + 1)
-  expect(table.findOffset({ line: 3, column: 1 })).toEqual(20 + 2)
-
-  // After the new line
-  expect(table.findOffset({ line: 4, column: 0 })).toEqual(22 + 1)
-})
diff --git a/packages/tailwindcss/src/source-maps/line-table.ts b/packages/tailwindcss/src/source-maps/line-table.ts
deleted file mode 100644
index e16051762..000000000
--- a/packages/tailwindcss/src/source-maps/line-table.ts
+++ /dev/null
@@ -1,100 +0,0 @@
-/**
- * Line offset tables are the key to generating our source maps. They allow us
- * to store indexes with our AST nodes and later convert them into positions as
- * when given the source that the indexes refer to.
- */
-
-const LINE_BREAK = 0x0a
-
-/**
- * A position in source code
- *
- * https://tc39.es/ecma426/#sec-position-record-type
- */
-export interface Position {
-  /** The line number, one-based */
-  line: number
-
-  /** The column/character number, one-based */
-  column: number
-}
-
-/**
- * A table that lets you turn an offset into a line number and column
- */
-export interface LineTable {
-  /**
-   * Find the line/column position in the source code for a given offset
-   *
-   * Searching for a given offset takes O(log N) time where N is the number of
-   * lines of code.
-   *
-   * @param offset The index for which to find the position
-   */
-  find(offset: number): Position
-
-  /**
-   * Find the most likely byte offset for given a position
-   *
-   * @param offset The position for which to find the byte offset
-   */
-  findOffset(pos: Position): number
-}
-
-/**
- * Compute a lookup table to allow for efficient line/column lookups based on
- * offsets in the source code.
- *
- * Creating this table is an O(N) operation where N is the length of the source
- */
-export function createLineTable(source: string): LineTable {
-  let table: number[] = [0]
-
-  // Compute the offsets for the start of each line
-  for (let i = 0; i < source.length; i++) {
-    if (source.charCodeAt(i) === LINE_BREAK) {
-      table.push(i + 1)
-    }
-  }
-
-  function find(offset: number) {
-    // Based on esbuild's binary search for line numbers
-    let line = 0
-    let count = table.length
-    while (count > 0) {
-      // `| 0` improves performance (in V8 at least)
-      let mid = (count | 0) >> 1
-      let i = line + mid
-      if (table[i] <= offset) {
-        line = i + 1
-        count = count - mid - 1
-      } else {
-        count = mid
-      }
-    }
-
-    line -= 1
-
-    let column = offset - table[line]
-
-    return {
-      line: line + 1,
-      column: column,
-    }
-  }
-
-  function findOffset({ line, column }: Position) {
-    line -= 1
-    line = Math.min(Math.max(line, 0), table.length - 1)
-
-    let offsetA = table[line]
-    let offsetB = table[line + 1] ?? offsetA
-
-    return Math.min(Math.max(offsetA + column, 0), offsetB)
-  }
-
-  return {
-    find,
-    findOffset,
-  }
-}
diff --git a/packages/tailwindcss/src/source-maps/source-map.test.ts b/packages/tailwindcss/src/source-maps/source-map.test.ts
deleted file mode 100644
index 2bc7b0962..000000000
--- a/packages/tailwindcss/src/source-maps/source-map.test.ts
+++ /dev/null
@@ -1,893 +0,0 @@
-import remapping from '@jridgewell/remapping'
-import dedent from 'dedent'
-import MagicString from 'magic-string'
-import * as fs from 'node:fs/promises'
-import * as path from 'node:path'
-import { SourceMapGenerator, type RawSourceMap } from 'source-map-js'
-import { test } from 'vitest'
-import { compile } from '..'
-import createPlugin from '../plugin'
-import { DefaultMap } from '../utils/default-map'
-import type { DecodedSource, DecodedSourceMap } from './source-map'
-import { visualizeSourceMap } from './visualize-source-map'
-const css = dedent
-
-interface RunOptions {
-  input: string
-  candidates?: string[]
-  options?: Parameters<typeof compile>[1]
-}
-
-async function run({ input, candidates, options }: RunOptions) {
-  let source = new MagicString(input)
-  let root = path.resolve(__dirname, '../..')
-
-  let compiler = await compile(source.toString(), {
-    from: 'input.css',
-    async loadStylesheet(id, base) {
-      let resolvedPath = path.resolve(root, id === 'tailwindcss' ? 'index.css' : id)
-
-      return {
-        path: path.relative(root, resolvedPath),
-        base,
-        content: await fs.readFile(resolvedPath, 'utf-8'),
-      }
-    },
-    ...options,
-  })
-
-  let css = compiler.build(candidates ?? [])
-  let decoded = compiler.buildSourceMap()
-  let rawMap = toRawSourceMap(decoded)
-  let combined = remapping(rawMap, () => null)
-  let map = JSON.parse(rawMap.toString()) as RawSourceMap
-
-  let sources = combined.sources
-  let annotations = visualizeSourceMap(map, css)
-
-  return { css, map, sources, annotations }
-}
-
-function toRawSourceMap(map: DecodedSourceMap): string {
-  let generator = new SourceMapGenerator()
-
-  let id = 1
-  let sourceTable = new DefaultMap<
-    DecodedSource | null,
-    {
-      url: string
-      content: string
-    }
-  >((src) => {
-    return {
-      url: src?.url ?? `<unknown ${id++}>`,
-      content: src?.content ?? '<none>',
-    }
-  })
-
-  for (let mapping of map.mappings) {
-    let original = sourceTable.get(mapping.originalPosition?.source ?? null)
-
-    generator.addMapping({
-      generated: mapping.generatedPosition,
-      original: mapping.originalPosition,
-      source: original.url,
-      name: mapping.name ?? undefined,
-    })
-
-    generator.setSourceContent(original.url, original.content)
-  }
-
-  return generator.toString()
-}
-
-test('source maps trace back to @import location', async ({ expect }) => {
-  let { sources, annotations } = await run({
-    input: css`
-      @import 'tailwindcss';
-
-      .foo {
-        @apply underline;
-      }
-    `,
-  })
-
-  // All CSS should be mapped back to the original source file
-  expect(sources).toEqual([
-    //
-    'index.css',
-    'theme.css',
-    'preflight.css',
-    'input.css',
-  ])
-  expect(sources.length).toBe(4)
-
-  // The output CSS should include annotations linking back to:
-  // 1. The class definition `.foo`
-  // 2. The `@apply underline` line inside of it
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-         output.css                                                                                      |      original
-                                                                                                         | 
-                                                                                                         |      --- index.css ---
-      1  @layer theme, base, components, utilities;                                                      |   1  @layer theme, base, components, utilities;
-         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ A @ 1:0-41                                            |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ A @ 1:0-41
-      2  @layer theme {                                                                                  |   3  @import './theme.css' layer(theme);
-         ^^^^^^^^^^^^^ B @ 2:0-13                                                                        |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ B @ 3:0-34
-                                                                                                         |      --- theme.css ---
-      3    :root, :host {                                                                                |   1  @theme default {
-           ^^^^^^^^^^^^^ C @ 3:2-15                                                                      |      ^^^^^^^^^^^^^^^ C @ 1:0-15
-      4      --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'N... |   2    --font-sans:
-             ^ D @ 4:4                                                                                   |        ^ D @ 2:2
-      4      --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'N... |   3      -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Ar...
-             ^ E @ 4:4                                                                                   |      ^ E @ 3:0
-      4      --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'N... |   4      sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... F @ 4:4-5:0 |      ^ F @ 4:0
-      5      sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';   |   4      sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-                                                                                        ... G @ 5:92-6:0 |                                                                                         ... G @ 4:92
-                                                                                                         |   5    --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
-      6      --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', '... |   6    --font-mono:
-             ^ H @ 6:4                                                                                   |        ^ H @ 6:2
-      6      --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', '... |   7      ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
-             ^ I @ 6:4                                                                                   |      ^ I @ 7:0
-      6      --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', '... |   8      monospace;
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... J @ 6:4-7:0 |      ^ J @ 8:0
-      7      monospace;                                                                                  |   8      monospace;
-                      ^ K @ 7:13-8:0                                                                     |                   ^ K @ 8:13
-      8      --default-font-family: var(--font-sans);                                                    | 494    --default-font-family: --theme(--font-sans, initial);
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ L @ 8:4-43                                          |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ L @ 494:2-54
-                                                                                                         | 495    --default-font-feature-settings: --theme(--font-sans--font-feature-settings, initial);
-                                                                                                         | 496    --default-font-variation-settings: --theme(--font-sans--font-variation-settings, initial);
-      9      --default-mono-font-family: var(--font-mono);                                               | 497    --default-mono-font-family: --theme(--font-mono, initial);
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ M @ 9:4-48                                     |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ M @ 497:2-59
-     10    }                                                                                             | 
-     11  }                                                                                               | 
-                                                                                                         |      --- index.css ---
-     12  @layer base {                                                                                   |   4  @import './preflight.css' layer(base);
-         ^^^^^^^^^^^^ N @ 12:0-12                                                                        |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ N @ 4:0-37
-                                                                                                         |      --- preflight.css ---
-     13    *, ::after, ::before, ::backdrop, ::file-selector-button {                                    |   7  *,
-           ^ O @ 13:2                                                                                    |      ^ O @ 7:0
-     13    *, ::after, ::before, ::backdrop, ::file-selector-button {                                    |   8  ::after,
-           ^ P @ 13:2                                                                                    |      ^ P @ 8:0
-     13    *, ::after, ::before, ::backdrop, ::file-selector-button {                                    |   9  ::before,
-           ^ Q @ 13:2                                                                                    |      ^ Q @ 9:0
-     13    *, ::after, ::before, ::backdrop, ::file-selector-button {                                    |  10  ::backdrop,
-           ^ R @ 13:2                                                                                    |      ^ R @ 10:0
-     13    *, ::after, ::before, ::backdrop, ::file-selector-button {                                    |  11  ::file-selector-button {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ S @ 13:2-59                         |      ^^^^^^^^^^^^^^^^^^^^^^^ S @ 11:0-23
-     14      box-sizing: border-box;                                                                     |  12    box-sizing: border-box; /* 1 */
-             ^^^^^^^^^^^^^^^^^^^^^^ T @ 14:4-26                                                          |        ^^^^^^^^^^^^^^^^^^^^^^ T @ 12:2-24
-     15      margin: 0;                                                                                  |  13    margin: 0; /* 2 */
-             ^^^^^^^^^ U @ 15:4-13                                                                       |        ^^^^^^^^^ U @ 13:2-11
-     16      padding: 0;                                                                                 |  14    padding: 0; /* 2 */
-             ^^^^^^^^^^ V @ 16:4-14                                                                      |        ^^^^^^^^^^ V @ 14:2-12
-     17      border: 0 solid;                                                                            |  15    border: 0 solid; /* 3 */
-             ^^^^^^^^^^^^^^^ W @ 17:4-19                                                                 |        ^^^^^^^^^^^^^^^ W @ 15:2-17
-                                                                                                         |  16  }
-     18    }                                                                                             | 
-     19    html, :host {                                                                                 |  28  html,
-           ^ X @ 19:2                                                                                    |      ^ X @ 28:0
-     19    html, :host {                                                                                 |  29  :host {
-           ^^^^^^^^^^^^ Y @ 19:2-14                                                                      |      ^^^^^^ Y @ 29:0-6
-     20      line-height: 1.5;                                                                           |  30    line-height: 1.5; /* 1 */
-             ^^^^^^^^^^^^^^^^ Z @ 20:4-20                                                                |        ^^^^^^^^^^^^^^^^ Z @ 30:2-18
-     21      -webkit-text-size-adjust: 100%;                                                             |  31    -webkit-text-size-adjust: 100%; /* 2 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AA @ 21:4-34                                                 |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AA @ 31:2-32
-     22      tab-size: 4;                                                                                |  32    tab-size: 4; /* 3 */
-             ^^^^^^^^^^^ AB @ 22:4-15                                                                    |        ^^^^^^^^^^^ AB @ 32:2-13
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  33    font-family: --theme(
-             ^ AC @ 23:4                                                                                 |        ^ AC @ 33:2
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  34      --default-font-family,
-             ^ AD @ 23:4                                                                                 |      ^ AD @ 34:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  35      -apple-system,
-             ^ AE @ 23:4                                                                                 |      ^ AE @ 35:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  36      BlinkMacSystemFont,
-             ^ AF @ 23:4                                                                                 |      ^ AF @ 36:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  37      'Segoe UI',
-             ^ AG @ 23:4                                                                                 |      ^ AG @ 37:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  38      Roboto,
-             ^ AH @ 23:4                                                                                 |      ^ AH @ 38:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  39      'Helvetica Neue',
-             ^ AI @ 23:4                                                                                 |      ^ AI @ 39:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  40      'Noto Sans',
-             ^ AJ @ 23:4                                                                                 |      ^ AJ @ 40:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  41      Arial,
-             ^ AK @ 23:4                                                                                 |      ^ AK @ 41:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  42      sans-serif,
-             ^ AL @ 23:4                                                                                 |      ^ AL @ 42:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  43      'Apple Color Emoji',
-             ^ AM @ 23:4                                                                                 |      ^ AM @ 43:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  44      'Segoe UI Emoji',
-             ^ AN @ 23:4                                                                                 |      ^ AN @ 44:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  45      'Segoe UI Symbol',
-             ^ AO @ 23:4                                                                                 |      ^ AO @ 45:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  46      'Noto Color Emoji'
-             ^ AP @ 23:4                                                                                 |      ^ AP @ 46:0
-     23      font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, 'Segoe UI', R... |  47    ); /* 4 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... AQ @ 23:4-226 |      ^^^ AQ @ 47:0-3
-     24      font-feature-settings: var(--default-font-feature-settings, normal);                        |  48    font-feature-settings: --theme(--default-font-feature-settings, normal); /* 5 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AR @ 24:4-71            |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AR @ 48:2-73
-     25      font-variation-settings: var(--default-font-variation-settings, normal);                    |  49    font-variation-settings: --theme(--default-font-variation-settings, normal); /* 6 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AS @ 25:4-75        |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AS @ 49:2-77
-     26      -webkit-tap-highlight-color: transparent;                                                   |  50    -webkit-tap-highlight-color: transparent; /* 7 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AT @ 26:4-44                                       |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AT @ 50:2-42
-                                                                                                         |  51  }
-     27    }                                                                                             | 
-     28    hr {                                                                                          |  59  hr {
-           ^^^ AU @ 28:2-5                                                                               |      ^^^ AU @ 59:0-3
-     29      height: 0;                                                                                  |  60    height: 0; /* 1 */
-             ^^^^^^^^^ AV @ 29:4-13                                                                      |        ^^^^^^^^^ AV @ 60:2-11
-     30      color: inherit;                                                                             |  61    color: inherit; /* 2 */
-             ^^^^^^^^^^^^^^ AW @ 30:4-18                                                                 |        ^^^^^^^^^^^^^^ AW @ 61:2-16
-     31      border-top-width: 1px;                                                                      |  62    border-top-width: 1px; /* 3 */
-             ^^^^^^^^^^^^^^^^^^^^^ AX @ 31:4-25                                                          |        ^^^^^^^^^^^^^^^^^^^^^ AX @ 62:2-23
-                                                                                                         |  63  }
-     32    }                                                                                             | 
-     33    abbr:where([title]) {                                                                         |  69  abbr:where([title]) {
-           ^^^^^^^^^^^^^^^^^^^^ AY @ 33:2-22                                                             |      ^^^^^^^^^^^^^^^^^^^^ AY @ 69:0-20
-     34      -webkit-text-decoration: underline dotted;                                                  |  70    -webkit-text-decoration: underline dotted;
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AZ @ 34:4-45                                      |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ AZ @ 70:2-43
-     35      text-decoration: underline dotted;                                                          |  71    text-decoration: underline dotted;
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ BA @ 35:4-37                                              |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ BA @ 71:2-35
-                                                                                                         |  72  }
-     36    }                                                                                             | 
-     37    h1, h2, h3, h4, h5, h6 {                                                                      |  78  h1,
-           ^ BB @ 37:2                                                                                   |      ^ BB @ 78:0
-     37    h1, h2, h3, h4, h5, h6 {                                                                      |  79  h2,
-           ^ BC @ 37:2                                                                                   |      ^ BC @ 79:0
-     37    h1, h2, h3, h4, h5, h6 {                                                                      |  80  h3,
-           ^ BD @ 37:2                                                                                   |      ^ BD @ 80:0
-     37    h1, h2, h3, h4, h5, h6 {                                                                      |  81  h4,
-           ^ BE @ 37:2                                                                                   |      ^ BE @ 81:0
-     37    h1, h2, h3, h4, h5, h6 {                                                                      |  82  h5,
-           ^ BF @ 37:2                                                                                   |      ^ BF @ 82:0
-     37    h1, h2, h3, h4, h5, h6 {                                                                      |  83  h6 {
-           ^^^^^^^^^^^^^^^^^^^^^^^ BG @ 37:2-25                                                          |      ^^^ BG @ 83:0-3
-     38      font-size: inherit;                                                                         |  84    font-size: inherit;
-             ^^^^^^^^^^^^^^^^^^ BH @ 38:4-22                                                             |        ^^^^^^^^^^^^^^^^^^ BH @ 84:2-20
-     39      font-weight: inherit;                                                                       |  85    font-weight: inherit;
-             ^^^^^^^^^^^^^^^^^^^^ BI @ 39:4-24                                                           |        ^^^^^^^^^^^^^^^^^^^^ BI @ 85:2-22
-                                                                                                         |  86  }
-     40    }                                                                                             | 
-     41    a {                                                                                           |  92  a {
-           ^^ BJ @ 41:2-4                                                                                |      ^^ BJ @ 92:0-2
-     42      color: inherit;                                                                             |  93    color: inherit;
-             ^^^^^^^^^^^^^^ BK @ 42:4-18                                                                 |        ^^^^^^^^^^^^^^ BK @ 93:2-16
-     43      -webkit-text-decoration: inherit;                                                           |  94    -webkit-text-decoration: inherit;
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ BL @ 43:4-36                                               |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ BL @ 94:2-34
-     44      text-decoration: inherit;                                                                   |  95    text-decoration: inherit;
-             ^^^^^^^^^^^^^^^^^^^^^^^^ BM @ 44:4-28                                                       |        ^^^^^^^^^^^^^^^^^^^^^^^^ BM @ 95:2-26
-                                                                                                         |  96  }
-     45    }                                                                                             | 
-     46    b, strong {                                                                                   | 102  b,
-           ^ BN @ 46:2                                                                                   |      ^ BN @ 102:0
-     46    b, strong {                                                                                   | 103  strong {
-           ^^^^^^^^^^ BO @ 46:2-12                                                                       |      ^^^^^^^ BO @ 103:0-7
-     47      font-weight: bolder;                                                                        | 104    font-weight: bolder;
-             ^^^^^^^^^^^^^^^^^^^ BP @ 47:4-23                                                            |        ^^^^^^^^^^^^^^^^^^^ BP @ 104:2-21
-                                                                                                         | 105  }
-     48    }                                                                                             | 
-     49    code, kbd, samp, pre {                                                                        | 114  code,
-           ^ BQ @ 49:2                                                                                   |      ^ BQ @ 114:0
-     49    code, kbd, samp, pre {                                                                        | 115  kbd,
-           ^ BR @ 49:2                                                                                   |      ^ BR @ 115:0
-     49    code, kbd, samp, pre {                                                                        | 116  samp,
-           ^ BS @ 49:2                                                                                   |      ^ BS @ 116:0
-     49    code, kbd, samp, pre {                                                                        | 117  pre {
-           ^^^^^^^^^^^^^^^^^^^^^ BT @ 49:2-23                                                            |      ^^^^ BT @ 117:0-4
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 118    font-family: --theme(
-             ^ BU @ 50:4                                                                                 |        ^ BU @ 118:2
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 119      --default-mono-font-family,
-             ^ BV @ 50:4                                                                                 |      ^ BV @ 119:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 120      ui-monospace,
-             ^ BW @ 50:4                                                                                 |      ^ BW @ 120:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 121      SFMono-Regular,
-             ^ BX @ 50:4                                                                                 |      ^ BX @ 121:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 122      Menlo,
-             ^ BY @ 50:4                                                                                 |      ^ BY @ 122:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 123      Monaco,
-             ^ BZ @ 50:4                                                                                 |      ^ BZ @ 123:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 124      Consolas,
-             ^ CA @ 50:4                                                                                 |      ^ CA @ 124:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 125      'Liberation Mono',
-             ^ CB @ 50:4                                                                                 |      ^ CB @ 125:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 126      'Courier New',
-             ^ CC @ 50:4                                                                                 |      ^ CC @ 126:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 127      monospace
-             ^ CD @ 50:4                                                                                 |      ^ CD @ 127:0
-     50      font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco... | 128    ); /* 1 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... CE @ 50:4-148 |      ^^^ CE @ 128:0-3
-     51      font-feature-settings: var(--default-mono-font-feature-settings, normal);                   | 129    font-feature-settings: --theme(--default-mono-font-feature-settings, normal); /* 2 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CF @ 51:4-76       |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CF @ 129:2-78
-     52      font-variation-settings: var(--default-mono-font-variation-settings, normal);               | 130    font-variation-settings: --theme(--default-mono-font-variation-settings, normal); /* 3 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CG @ 52:4-80   |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... CG @ 130:2-82
-     53      font-size: 1em;                                                                             | 131    font-size: 1em; /* 4 */
-             ^^^^^^^^^^^^^^ CH @ 53:4-18                                                                 |        ^^^^^^^^^^^^^^ CH @ 131:2-16
-                                                                                                         | 132  }
-     54    }                                                                                             | 
-     55    small {                                                                                       | 138  small {
-           ^^^^^^ CI @ 55:2-8                                                                            |      ^^^^^^ CI @ 138:0-6
-     56      font-size: 80%;                                                                             | 139    font-size: 80%;
-             ^^^^^^^^^^^^^^ CJ @ 56:4-18                                                                 |        ^^^^^^^^^^^^^^ CJ @ 139:2-16
-                                                                                                         | 140  }
-     57    }                                                                                             | 
-     58    sub, sup {                                                                                    | 146  sub,
-           ^ CK @ 58:2                                                                                   |      ^ CK @ 146:0
-     58    sub, sup {                                                                                    | 147  sup {
-           ^^^^^^^^^ CL @ 58:2-11                                                                        |      ^^^^ CL @ 147:0-4
-     59      font-size: 75%;                                                                             | 148    font-size: 75%;
-             ^^^^^^^^^^^^^^ CM @ 59:4-18                                                                 |        ^^^^^^^^^^^^^^ CM @ 148:2-16
-     60      line-height: 0;                                                                             | 149    line-height: 0;
-             ^^^^^^^^^^^^^^ CN @ 60:4-18                                                                 |        ^^^^^^^^^^^^^^ CN @ 149:2-16
-     61      position: relative;                                                                         | 150    position: relative;
-             ^^^^^^^^^^^^^^^^^^ CO @ 61:4-22                                                             |        ^^^^^^^^^^^^^^^^^^ CO @ 150:2-20
-     62      vertical-align: baseline;                                                                   | 151    vertical-align: baseline;
-             ^^^^^^^^^^^^^^^^^^^^^^^^ CP @ 62:4-28                                                       |        ^^^^^^^^^^^^^^^^^^^^^^^^ CP @ 151:2-26
-                                                                                                         | 152  }
-     63    }                                                                                             | 
-     64    sub {                                                                                         | 154  sub {
-           ^^^^ CQ @ 64:2-6                                                                              |      ^^^^ CQ @ 154:0-4
-     65      bottom: -0.25em;                                                                            | 155    bottom: -0.25em;
-             ^^^^^^^^^^^^^^^ CR @ 65:4-19                                                                |        ^^^^^^^^^^^^^^^ CR @ 155:2-17
-                                                                                                         | 156  }
-     66    }                                                                                             | 
-     67    sup {                                                                                         | 158  sup {
-           ^^^^ CS @ 67:2-6                                                                              |      ^^^^ CS @ 158:0-4
-     68      top: -0.5em;                                                                                | 159    top: -0.5em;
-             ^^^^^^^^^^^ CT @ 68:4-15                                                                    |        ^^^^^^^^^^^ CT @ 159:2-13
-                                                                                                         | 160  }
-     69    }                                                                                             | 
-     70    table {                                                                                       | 168  table {
-           ^^^^^^ CU @ 70:2-8                                                                            |      ^^^^^^ CU @ 168:0-6
-     71      text-indent: 0;                                                                             | 169    text-indent: 0; /* 1 */
-             ^^^^^^^^^^^^^^ CV @ 71:4-18                                                                 |        ^^^^^^^^^^^^^^ CV @ 169:2-16
-     72      border-color: inherit;                                                                      | 170    border-color: inherit; /* 2 */
-             ^^^^^^^^^^^^^^^^^^^^^ CW @ 72:4-25                                                          |        ^^^^^^^^^^^^^^^^^^^^^ CW @ 170:2-23
-     73      border-collapse: collapse;                                                                  | 171    border-collapse: collapse; /* 3 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^ CX @ 73:4-29                                                      |        ^^^^^^^^^^^^^^^^^^^^^^^^^ CX @ 171:2-27
-                                                                                                         | 172  }
-     74    }                                                                                             | 
-     75    :-moz-focusring:where(:not(iframe)) {                                                         | 178  :-moz-focusring:where(:not(iframe)) {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CY @ 75:2-38                                             |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ CY @ 178:0-36
-     76      outline: auto;                                                                              | 179    outline: auto;
-             ^^^^^^^^^^^^^ CZ @ 76:4-17                                                                  |        ^^^^^^^^^^^^^ CZ @ 179:2-15
-                                                                                                         | 180  }
-     77    }                                                                                             | 
-     78    progress {                                                                                    | 186  progress {
-           ^^^^^^^^^ DA @ 78:2-11                                                                        |      ^^^^^^^^^ DA @ 186:0-9
-     79      vertical-align: baseline;                                                                   | 187    vertical-align: baseline;
-             ^^^^^^^^^^^^^^^^^^^^^^^^ DB @ 79:4-28                                                       |        ^^^^^^^^^^^^^^^^^^^^^^^^ DB @ 187:2-26
-                                                                                                         | 188  }
-     80    }                                                                                             | 
-     81    summary {                                                                                     | 194  summary {
-           ^^^^^^^^ DC @ 81:2-10                                                                         |      ^^^^^^^^ DC @ 194:0-8
-     82      display: list-item;                                                                         | 195    display: list-item;
-             ^^^^^^^^^^^^^^^^^^ DD @ 82:4-22                                                             |        ^^^^^^^^^^^^^^^^^^ DD @ 195:2-20
-                                                                                                         | 196  }
-     83    }                                                                                             | 
-     84    ol, ul, menu {                                                                                | 202  ol,
-           ^ DE @ 84:2                                                                                   |      ^ DE @ 202:0
-     84    ol, ul, menu {                                                                                | 203  ul,
-           ^ DF @ 84:2                                                                                   |      ^ DF @ 203:0
-     84    ol, ul, menu {                                                                                | 204  menu {
-           ^^^^^^^^^^^^^ DG @ 84:2-15                                                                    |      ^^^^^ DG @ 204:0-5
-     85      list-style: none;                                                                           | 205    list-style: none;
-             ^^^^^^^^^^^^^^^^ DH @ 85:4-20                                                               |        ^^^^^^^^^^^^^^^^ DH @ 205:2-18
-                                                                                                         | 206  }
-     86    }                                                                                             | 
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 214  img,
-           ^ DI @ 87:2                                                                                   |      ^ DI @ 214:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 215  svg,
-           ^ DJ @ 87:2                                                                                   |      ^ DJ @ 215:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 216  video,
-           ^ DK @ 87:2                                                                                   |      ^ DK @ 216:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 217  canvas,
-           ^ DL @ 87:2                                                                                   |      ^ DL @ 217:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 218  audio,
-           ^ DM @ 87:2                                                                                   |      ^ DM @ 218:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 219  iframe,
-           ^ DN @ 87:2                                                                                   |      ^ DN @ 219:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 220  embed,
-           ^ DO @ 87:2                                                                                   |      ^ DO @ 220:0
-     87    img, svg, video, canvas, audio, iframe, embed, object {                                       | 221  object {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ DP @ 87:2-56                           |      ^^^^^^^ DP @ 221:0-7
-     88      display: block;                                                                             | 222    display: block; /* 1 */
-             ^^^^^^^^^^^^^^ DQ @ 88:4-18                                                                 |        ^^^^^^^^^^^^^^ DQ @ 222:2-16
-     89      vertical-align: middle;                                                                     | 223    vertical-align: middle; /* 2 */
-             ^^^^^^^^^^^^^^^^^^^^^^ DR @ 89:4-26                                                         |        ^^^^^^^^^^^^^^^^^^^^^^ DR @ 223:2-24
-                                                                                                         | 224  }
-     90    }                                                                                             | 
-     91    img, video {                                                                                  | 230  img,
-           ^ DS @ 91:2                                                                                   |      ^ DS @ 230:0
-     91    img, video {                                                                                  | 231  video {
-           ^^^^^^^^^^^ DT @ 91:2-13                                                                      |      ^^^^^^ DT @ 231:0-6
-     92      max-width: 100%;                                                                            | 232    max-width: 100%;
-             ^^^^^^^^^^^^^^^ DU @ 92:4-19                                                                |        ^^^^^^^^^^^^^^^ DU @ 232:2-17
-     93      height: auto;                                                                               | 233    height: auto;
-             ^^^^^^^^^^^^ DV @ 93:4-16                                                                   |        ^^^^^^^^^^^^ DV @ 233:2-14
-                                                                                                         | 234  }
-     94    }                                                                                             | 
-     95    button, input, select, optgroup, textarea, ::file-selector-button {                           | 243  button,
-           ^ DW @ 95:2                                                                                   |      ^ DW @ 243:0
-     95    button, input, select, optgroup, textarea, ::file-selector-button {                           | 244  input,
-           ^ DX @ 95:2                                                                                   |      ^ DX @ 244:0
-     95    button, input, select, optgroup, textarea, ::file-selector-button {                           | 245  select,
-           ^ DY @ 95:2                                                                                   |      ^ DY @ 245:0
-     95    button, input, select, optgroup, textarea, ::file-selector-button {                           | 246  optgroup,
-           ^ DZ @ 95:2                                                                                   |      ^ DZ @ 246:0
-     95    button, input, select, optgroup, textarea, ::file-selector-button {                           | 247  textarea,
-           ^ EA @ 95:2                                                                                   |      ^ EA @ 247:0
-     95    button, input, select, optgroup, textarea, ::file-selector-button {                           | 248  ::file-selector-button {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EB @ 95:2-68               |      ^^^^^^^^^^^^^^^^^^^^^^^ EB @ 248:0-23
-     96      font: inherit;                                                                              | 249    font: inherit; /* 1 */
-             ^^^^^^^^^^^^^ EC @ 96:4-17                                                                  |        ^^^^^^^^^^^^^ EC @ 249:2-15
-     97      font-feature-settings: inherit;                                                             | 250    font-feature-settings: inherit; /* 1 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ED @ 97:4-34                                                 |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ED @ 250:2-32
-     98      font-variation-settings: inherit;                                                           | 251    font-variation-settings: inherit; /* 1 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EE @ 98:4-36                                               |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EE @ 251:2-34
-     99      letter-spacing: inherit;                                                                    | 252    letter-spacing: inherit; /* 1 */
-             ^^^^^^^^^^^^^^^^^^^^^^^ EF @ 99:4-27                                                        |        ^^^^^^^^^^^^^^^^^^^^^^^ EF @ 252:2-25
-    100      color: inherit;                                                                             | 253    color: inherit; /* 1 */
-             ^^^^^^^^^^^^^^ EG @ 100:4-18                                                                |        ^^^^^^^^^^^^^^ EG @ 253:2-16
-    101      border-radius: 0;                                                                           | 254    border-radius: 0; /* 2 */
-             ^^^^^^^^^^^^^^^^ EH @ 101:4-20                                                              |        ^^^^^^^^^^^^^^^^ EH @ 254:2-18
-    102      background-color: transparent;                                                              | 255    background-color: transparent; /* 3 */
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EI @ 102:4-33                                                 |        ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EI @ 255:2-31
-    103      opacity: 1;                                                                                 | 256    opacity: 1; /* 4 */
-             ^^^^^^^^^^ EJ @ 103:4-14                                                                    |        ^^^^^^^^^^ EJ @ 256:2-12
-                                                                                                         | 257  }
-    104    }                                                                                             | 
-    105    :where(select:is([multiple], [size])) optgroup {                                              | 263  :where(select:is([multiple], [size])) optgroup {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EK @ 105:2-49                                 |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EK @ 263:0-47
-    106      font-weight: bolder;                                                                        | 264    font-weight: bolder;
-             ^^^^^^^^^^^^^^^^^^^ EL @ 106:4-23                                                           |        ^^^^^^^^^^^^^^^^^^^ EL @ 264:2-21
-                                                                                                         | 265  }
-    107    }                                                                                             | 
-    108    :where(select:is([multiple], [size])) optgroup option {                                       | 271  :where(select:is([multiple], [size])) optgroup option {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EM @ 108:2-56                          |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EM @ 271:0-54
-    109      padding-inline-start: 20px;                                                                 | 272    padding-inline-start: 20px;
-             ^^^^^^^^^^^^^^^^^^^^^^^^^^ EN @ 109:4-30                                                    |        ^^^^^^^^^^^^^^^^^^^^^^^^^^ EN @ 272:2-28
-                                                                                                         | 273  }
-    110    }                                                                                             | 
-    111    ::file-selector-button {                                                                      | 279  ::file-selector-button {
-           ^^^^^^^^^^^^^^^^^^^^^^^ EO @ 111:2-25                                                         |      ^^^^^^^^^^^^^^^^^^^^^^^ EO @ 279:0-23
-    112      margin-inline-end: 4px;                                                                     | 280    margin-inline-end: 4px;
-             ^^^^^^^^^^^^^^^^^^^^^^ EP @ 112:4-26                                                        |        ^^^^^^^^^^^^^^^^^^^^^^ EP @ 280:2-24
-                                                                                                         | 281  }
-    113    }                                                                                             | 
-    114    ::placeholder {                                                                               | 287  ::placeholder {
-           ^^^^^^^^^^^^^^ EQ @ 114:2-16                                                                  |      ^^^^^^^^^^^^^^ EQ @ 287:0-14
-    115      opacity: 1;                                                                                 | 288    opacity: 1;
-             ^^^^^^^^^^ ER @ 115:4-14                                                                    |        ^^^^^^^^^^ ER @ 288:2-12
-                                                                                                         | 289  }
-    116    }                                                                                             | 
-    117    @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {   | 296  @supports (not (-webkit-appearance: -apple-pay-button)) /* Not Safari */ or
-           ^ ES @ 117:2                                                                                  |      ^ ES @ 296:0
-    117    @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {   | 297    (contain-intrinsic-size: 1px) /* Safari 17+ */ {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... ET @ 117:2-92 |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ET @ 297:0-49
-    118      ::placeholder {                                                                             | 298    ::placeholder {
-             ^^^^^^^^^^^^^^ EU @ 118:4-18                                                                |        ^^^^^^^^^^^^^^ EU @ 298:2-16
-    119        color: currentcolor;                                                                      | 299      color: color-mix(in oklab, currentcolor 50%, transparent);
-               ^^^^^^^^^^^^^^^^^^^ EV @ 119:6-25                                                         |          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EV @ 299:4-61
-                                                                                                         | 300    }
-                                                                                                         | 301  }
-    120        @supports (color: color-mix(in lab, red, red)) {                                          | 
-               ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EV @ 120:6-53                             | 
-    121          color: color-mix(in oklab, currentcolor 50%, transparent);                              | 
-                 ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EV @ 121:8-65                 | 
-    122        }                                                                                         | 
-    123      }                                                                                           | 
-    124    }                                                                                             | 
-    125    textarea {                                                                                    | 307  textarea {
-           ^^^^^^^^^ EW @ 125:2-11                                                                       |      ^^^^^^^^^ EW @ 307:0-9
-    126      resize: vertical;                                                                           | 308    resize: vertical;
-             ^^^^^^^^^^^^^^^^ EX @ 126:4-20                                                              |        ^^^^^^^^^^^^^^^^ EX @ 308:2-18
-                                                                                                         | 309  }
-    127    }                                                                                             | 
-    128    ::-webkit-search-decoration {                                                                 | 315  ::-webkit-search-decoration {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EY @ 128:2-30                                                    |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ EY @ 315:0-28
-    129      -webkit-appearance: none;                                                                   | 316    -webkit-appearance: none;
-             ^^^^^^^^^^^^^^^^^^^^^^^^ EZ @ 129:4-28                                                      |        ^^^^^^^^^^^^^^^^^^^^^^^^ EZ @ 316:2-26
-                                                                                                         | 317  }
-    130    }                                                                                             | 
-    131    ::-webkit-date-and-time-value {                                                               | 324  ::-webkit-date-and-time-value {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FA @ 131:2-32                                                  |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FA @ 324:0-30
-    132      min-height: 1lh;                                                                            | 325    min-height: 1lh; /* 1 */
-             ^^^^^^^^^^^^^^^ FB @ 132:4-19                                                               |        ^^^^^^^^^^^^^^^ FB @ 325:2-17
-    133      text-align: inherit;                                                                        | 326    text-align: inherit; /* 2 */
-             ^^^^^^^^^^^^^^^^^^^ FC @ 133:4-23                                                           |        ^^^^^^^^^^^^^^^^^^^ FC @ 326:2-21
-                                                                                                         | 327  }
-    134    }                                                                                             | 
-    135    ::-webkit-datetime-edit {                                                                     | 333  ::-webkit-datetime-edit {
-           ^^^^^^^^^^^^^^^^^^^^^^^^ FD @ 135:2-26                                                        |      ^^^^^^^^^^^^^^^^^^^^^^^^ FD @ 333:0-24
-    136      display: inline-flex;                                                                       | 334    display: inline-flex;
-             ^^^^^^^^^^^^^^^^^^^^ FE @ 136:4-24                                                          |        ^^^^^^^^^^^^^^^^^^^^ FE @ 334:2-22
-                                                                                                         | 335  }
-    137    }                                                                                             | 
-    138    ::-webkit-datetime-edit-fields-wrapper {                                                      | 341  ::-webkit-datetime-edit-fields-wrapper {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FF @ 138:2-41                                         |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FF @ 341:0-39
-    139      padding: 0;                                                                                 | 342    padding: 0;
-             ^^^^^^^^^^ FG @ 139:4-14                                                                    |        ^^^^^^^^^^ FG @ 342:2-12
-                                                                                                         | 343  }
-    140    }                                                                                             | 
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 345  ::-webkit-datetime-edit,
-           ^ FH @ 141:2                                                                                  |      ^ FH @ 345:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 346  ::-webkit-datetime-edit-year-field,
-           ^ FI @ 141:2                                                                                  |      ^ FI @ 346:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 347  ::-webkit-datetime-edit-month-field,
-           ^ FJ @ 141:2                                                                                  |      ^ FJ @ 347:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 348  ::-webkit-datetime-edit-day-field,
-           ^ FK @ 141:2                                                                                  |      ^ FK @ 348:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 349  ::-webkit-datetime-edit-hour-field,
-           ^ FL @ 141:2                                                                                  |      ^ FL @ 349:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 350  ::-webkit-datetime-edit-minute-field,
-           ^ FM @ 141:2                                                                                  |      ^ FM @ 350:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 351  ::-webkit-datetime-edit-second-field,
-           ^ FN @ 141:2                                                                                  |      ^ FN @ 351:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 352  ::-webkit-datetime-edit-millisecond-field,
-           ^ FO @ 141:2                                                                                  |      ^ FO @ 352:0
-    141    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month... | 353  ::-webkit-datetime-edit-meridiem-field {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... FP @ 141:2-329 |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FP @ 353:0-39
-    142      padding-block: 0;                                                                           | 354    padding-block: 0;
-             ^^^^^^^^^^^^^^^^ FQ @ 142:4-20                                                              |        ^^^^^^^^^^^^^^^^ FQ @ 354:2-18
-                                                                                                         | 355  }
-    143    }                                                                                             | 
-    144    ::-webkit-calendar-picker-indicator {                                                         | 361  ::-webkit-calendar-picker-indicator {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FR @ 144:2-38                                            |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ FR @ 361:0-36
-    145      line-height: 1;                                                                             | 362    line-height: 1;
-             ^^^^^^^^^^^^^^ FS @ 145:4-18                                                                |        ^^^^^^^^^^^^^^ FS @ 362:2-16
-                                                                                                         | 363  }
-    146    }                                                                                             | 
-    147    :-moz-ui-invalid {                                                                            | 369  :-moz-ui-invalid {
-           ^^^^^^^^^^^^^^^^^ FT @ 147:2-19                                                               |      ^^^^^^^^^^^^^^^^^ FT @ 369:0-17
-    148      box-shadow: none;                                                                           | 370    box-shadow: none;
-             ^^^^^^^^^^^^^^^^ FU @ 148:4-20                                                              |        ^^^^^^^^^^^^^^^^ FU @ 370:2-18
-                                                                                                         | 371  }
-    149    }                                                                                             | 
-    150    button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-but... | 377  button,
-           ^ FV @ 150:2                                                                                  |      ^ FV @ 377:0
-    150    button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-but... | 378  input:where([type='button'], [type='reset'], [type='submit']),
-           ^ FW @ 150:2                                                                                  |      ^ FW @ 378:0
-    150    button, input:where([type='button'], [type='reset'], [type='submit']), ::file-selector-but... | 379  ::file-selector-button {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^... FX @ 150:2-96 |      ^^^^^^^^^^^^^^^^^^^^^^^ FX @ 379:0-23
-    151      appearance: button;                                                                         | 380    appearance: button;
-             ^^^^^^^^^^^^^^^^^^ FY @ 151:4-22                                                            |        ^^^^^^^^^^^^^^^^^^ FY @ 380:2-20
-                                                                                                         | 381  }
-    152    }                                                                                             | 
-    153    ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {                                    | 387  ::-webkit-inner-spin-button,
-           ^ FZ @ 153:2                                                                                  |      ^ FZ @ 387:0
-    153    ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {                                    | 388  ::-webkit-outer-spin-button {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ GA @ 153:2-59                       |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ GA @ 388:0-28
-    154      height: auto;                                                                               | 389    height: auto;
-             ^^^^^^^^^^^^ GB @ 154:4-16                                                                  |        ^^^^^^^^^^^^ GB @ 389:2-14
-                                                                                                         | 390  }
-    155    }                                                                                             | 
-    156    [hidden]:where(:not([hidden='until-found'])) {                                                | 396  [hidden]:where(:not([hidden='until-found'])) {
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ GC @ 156:2-47                                   |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ GC @ 396:0-45
-    157      display: none !important;                                                                   | 397    display: none !important;
-             ^^^^^^^^^^^^^^^^^^^^^^^^ GD @ 157:4-28                                                      |        ^^^^^^^^^^^^^^^^^^^^^^^^ GD @ 397:2-26
-                                                                                                         | 398  }
-    158    }                                                                                             | 
-    159  }                                                                                               | 
-                                                                                                         |      --- index.css ---
-    160  @layer utilities;                                                                               |   5  @import './utilities.css' layer(utilities);
-         ^^^^^^^^^^^^^^^^ GE @ 160:0-16                                                                  |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ GE @ 5:0-42
-                                                                                                         |      --- input.css ---
-    161  .foo {                                                                                          |   3  .foo {
-         ^^^^^ GF @ 161:0-5                                                                              |      ^^^^^ GF @ 3:0-5
-    162    text-decoration-line: underline;                                                              |   4    @apply underline;
-           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ GG @ 162:2-33                                                 |               ^^^^^^^^^ GG @ 4:9-18
-                                                                                                         |   5  }
-    163  }                                                                                               | 
-    164                                                                                                  | 
-    "
-  `)
-})
-
-test('source maps are generated for utilities', async ({ expect }) => {
-  let {
-    sources,
-    css: output,
-    annotations,
-  } = await run({
-    input: css`
-      @import './utilities.css';
-      @plugin "./plugin.js";
-      @utility custom {
-        color: orange;
-      }
-    `,
-    candidates: ['custom', 'custom-js', 'flex'],
-    options: {
-      loadModule: async (_, base) => ({
-        path: '',
-        base,
-        module: createPlugin(({ addUtilities }) => {
-          addUtilities({ '.custom-js': { color: 'blue' } })
-        }),
-      }),
-    },
-  })
-
-  // All CSS should be mapped back to the original source file
-  expect(sources).toEqual(['utilities.css', 'input.css'])
-  expect(sources.length).toBe(2)
-
-  // The output CSS should include annotations linking back to:
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-        output.css                 |    original
-                                   | 
-                                   |    --- utilities.css ---
-     1  .flex {                    | 1  @tailwind utilities;
-        ^^^^^^ A @ 1:0-6           |    ^^^^^^^^^^^^^^^^^^^ A @ 1:0-19
-     2    display: flex;           | 
-          ^^^^^^^^^^^^^ A @ 2:2-15 | 
-     3  }                          | 
-     4  .custom {                  | 
-        ^^^^^^^^ A @ 4:0-8         | 
-                                   |    --- input.css ---
-     5    color: orange;           | 4    color: orange;
-          ^^^^^^^^^^^^^ B @ 5:2-15 |      ^^^^^^^^^^^^^ B @ 4:2-15
-                                   | 5  }
-     6  }                          | 
-     7  .custom-js {               | 
-        ^^^^^^^^^^^ A @ 7:0-11     | 
-     8    color: blue;             | 
-          ^^^^^^^^^^^ A @ 8:2-13   | 
-     9  }                          | 
-    10                             | 
-    "
-  `)
-
-  expect(output).toMatchInlineSnapshot(`
-    ".flex {
-      display: flex;
-    }
-    .custom {
-      color: orange;
-    }
-    .custom-js {
-      color: blue;
-    }
-    "
-  `)
-})
-
-test('utilities have source maps pointing to the utilities node', async ({ expect }) => {
-  let { sources, annotations } = await run({
-    input: `@tailwind utilities;`,
-    candidates: [
-      //
-      'underline',
-    ],
-  })
-
-  expect(sources).toEqual(['input.css'])
-
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-       output.css                                   |    input.css
-                                                    | 
-    1  .underline {                                 | 1  @tailwind utilities;
-       ^^^^^^^^^^^ A @ 1:0-11                       |    ^^^^^^^^^^^^^^^^^^^ A @ 1:0-19
-    2    text-decoration-line: underline;           | 
-         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ A @ 2:2-33 | 
-    3  }                                            | 
-    4                                               | 
-    "
-  `)
-})
-
-test('@apply generates source maps', async ({ expect }) => {
-  let { sources, annotations } = await run({
-    input: css`
-      .foo {
-        color: blue;
-        @apply text-[#000] hover:text-[#f00];
-        @apply underline;
-        @apply --my-mixin-1 --my-mixin-2();
-        color: red;
-      }
-    `,
-  })
-
-  expect(sources).toEqual(['input.css'])
-
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-        output.css                                       |    input.css
-                                                         | 
-     1  .foo {                                           | 1  .foo {
-        ^^^^^ A @ 1:0-5                                  |    ^^^^^ A @ 1:0-5
-     2    color: blue;                                   | 2    color: blue;
-          ^^^^^^^^^^^ B @ 2:2-13                         |      ^^^^^^^^^^^ B @ 2:2-13
-     3    color: #000;                                   | 3    @apply text-[#000] hover:text-[#f00];
-          ^^^^^^^^^^^ C @ 3:2-13                         |             ^^^^^^^^^^^ C @ 3:9-20
-     4    &:hover {                                      | 3    @apply text-[#000] hover:text-[#f00];
-          ^^^^^^^^ D @ 4:2-10                            |                         ^^^^^^^^^^^^^^^^^ D @ 3:21-38
-     5      @media (hover: hover) {                      | 
-            ^^^^^^^^^^^^^^^^^^^^^^ D @ 5:4-26            | 
-     6        color: #f00;                               | 
-              ^^^^^^^^^^^ D @ 6:6-17                     | 
-     7      }                                            | 
-     8    }                                              | 
-     9    text-decoration-line: underline;               | 4    @apply underline;
-          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ E @ 9:2-33     |             ^^^^^^^^^ E @ 4:9-18
-    10    @apply --my-mixin-1 --my-mixin-2();            | 5    @apply --my-mixin-1 --my-mixin-2();
-          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ F @ 10:2-36 |      ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ F @ 5:2-36
-    11    color: red;                                    | 6    color: red;
-          ^^^^^^^^^^ G @ 11:2-12                         |      ^^^^^^^^^^ G @ 6:2-12
-                                                         | 7  }
-    12  }                                                | 
-    13                                                   | 
-    "
-  `)
-})
-
-test('@variant generates source maps', async ({ expect }) => {
-  let { sources, annotations } = await run({
-    input: css`
-      .foo {
-        color: red;
-
-        @variant data-a, data-b:data-c {
-          color: green;
-
-          @variant data-d, data-e:data-f {
-            color: blue;
-          }
-        }
-      }
-    `,
-  })
-
-  expect(sources).toEqual(['input.css'])
-
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-        output.css                         |     input.css
-                                           | 
-     1  .foo {                             |  1  .foo {
-        ^^^^^ A @ 1:0-5                    |     ^^^^^ A @ 1:0-5
-     2    color: red;                      |  2    color: red;
-          ^^^^^^^^^^ B @ 2:2-12            |       ^^^^^^^^^^ B @ 2:2-12
-     3    &[data-a] {                      | 
-                                           |  4    @variant data-a, data-b:data-c {
-     4      color: green;                  |  5      color: green;
-            ^^^^^^^^^^^^ C @ 4:4-16        |         ^^^^^^^^^^^^ C @ 5:4-16
-     5      &[data-d] {                    | 
-                                           |  7      @variant data-d, data-e:data-f {
-     6        color: blue;                 |  8        color: blue;
-              ^^^^^^^^^^^ D @ 6:6-17       |           ^^^^^^^^^^^ D @ 8:6-17
-                                           |  9      }
-                                           | 10    }
-                                           | 11  }
-     7      }                              | 
-     8      &[data-e] {                    | 
-     9        &[data-f] {                  | 
-    10          color: blue;               | 
-                ^^^^^^^^^^^ D @ 10:8-19    | 
-    11        }                            | 
-    12      }                              | 
-    13    }                                | 
-    14    &[data-b] {                      | 
-    15      &[data-c] {                    | 
-    16        color: green;                | 
-              ^^^^^^^^^^^^ C @ 16:6-18     | 
-    17        &[data-d] {                  | 
-    18          color: blue;               | 
-                ^^^^^^^^^^^ D @ 18:8-19    | 
-    19        }                            | 
-    20        &[data-e] {                  | 
-    21          &[data-f] {                | 
-    22            color: blue;             | 
-                  ^^^^^^^^^^^ D @ 22:10-21 | 
-    23          }                          | 
-    24        }                            | 
-    25      }                              | 
-    26    }                                | 
-    27  }                                  | 
-    28                                     | 
-    "
-  `)
-})
-
-test('license comments preserve source locations', async ({ expect }) => {
-  let { sources, annotations } = await run({
-    input: `/*! some comment */`,
-  })
-
-  expect(sources).toEqual(['input.css'])
-
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-       output.css                     |    input.css
-                                      | 
-    1  /*! some comment */            | 1  /*! some comment */
-       ^^^^^^^^^^^^^^^^^^^ A @ 1:0-19 |    ^^^^^^^^^^^^^^^^^^^ A @ 1:0-19
-    "
-  `)
-})
-
-test('license comments with new lines preserve source locations', async ({ expect }) => {
-  let { sources, annotations } = await run({
-    input: `/*! some \n comment */`,
-  })
-
-  expect(sources).toEqual(['input.css'])
-
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-       output.css                |    input.css
-                                 | 
-    1  /*! some                  | 1  /*! some 
-       ^ A @ 1:0                 |    ^ A @ 1:0
-    1  /*! some                  | 2   comment */
-       ^^^^^^^^^ B @ 1:0-2:0     |    ^ B @ 2:0
-    2   comment */               | 2   comment */
-                  ^ C @ 2:11-3:0 |               ^ C @ 2:11
-    "
-  `)
-})
-
-test('Source locations for `addBase` point to the `@plugin` that generated them', async ({
-  expect,
-}) => {
-  let { sources, annotations } = await run({
-    input: css`
-      @plugin "./plugin.js";
-      @config "./config.js";
-    `,
-    options: {
-      async loadModule(id, base) {
-        if (id === './plugin.js') {
-          return {
-            module: createPlugin(({ addBase }) => {
-              addBase({ body: { color: 'red' } })
-            }),
-            base,
-            path: '',
-          }
-        }
-
-        if (id === './config.js') {
-          return {
-            module: {
-              plugins: [
-                createPlugin(({ addBase }) => {
-                  addBase({ body: { color: 'green' } })
-                }),
-              ],
-            },
-            base,
-            path: '',
-          }
-        }
-
-        throw new Error(`unknown module ${id}`)
-      },
-    },
-  })
-
-  expect(sources).toEqual(['input.css'])
-
-  expect(annotations).toMatchInlineSnapshot(`
-    "
-       output.css                  |    input.css
-                                   | 
-    1  @layer base {               | 1  @plugin "./plugin.js";
-       ^^^^^^^^^^^^ A @ 1:0-12     |    ^^^^^^^^^^^^^^^^^^^^^ A @ 1:0-21
-    2    body {                    | 
-         ^^^^^ A @ 2:2-7           | 
-    3      color: red;             | 
-           ^^^^^^^^^^ A @ 3:4-14   | 
-    4      color: green;           | 2  @config "./config.js";
-           ^^^^^^^^^^^^ B @ 4:4-16 |    ^^^^^^^^^^^^^^^^^^^^^ B @ 2:0-21
-    5    }                         | 
-    6  }                           | 
-    7                              | 
-    "
-  `)
-})
diff --git a/packages/tailwindcss/src/source-maps/source-map.ts b/packages/tailwindcss/src/source-maps/source-map.ts
deleted file mode 100644
index 31f8a094f..000000000
--- a/packages/tailwindcss/src/source-maps/source-map.ts
+++ /dev/null
@@ -1,198 +0,0 @@
-import { type AstNode } from '../ast'
-import { DefaultMap } from '../utils/default-map'
-import { walk } from '../walk'
-import { createLineTable, type LineTable, type Position } from './line-table'
-import type { Source } from './source'
-
-// https://tc39.es/ecma426/#sec-original-position-record-type
-export interface OriginalPosition extends Position {
-  source: DecodedSource
-}
-
-/**
- * A "decoded" sourcemap
- *
- * @see https://tc39.es/ecma426/#decoded-source-map-record
- */
-export interface DecodedSourceMap {
-  file: string | null
-  sources: DecodedSource[]
-  mappings: DecodedMapping[]
-}
-
-/**
- * A "decoded" source
- *
- * @see https://tc39.es/ecma426/#decoded-source-record
- */
-export interface DecodedSource {
-  url: string | null
-  content: string | null
-  ignore: boolean
-}
-
-/**
- * A "decoded" mapping
- *
- * @see https://tc39.es/ecma426/#decoded-mapping-record
- */
-export interface DecodedMapping {
-  // https://tc39.es/ecma426/#sec-original-position-record-type
-  originalPosition: OriginalPosition | null
-
-  // https://tc39.es/ecma426/#sec-position-record-type
-  generatedPosition: Position
-
-  name: string | null
-}
-
-/**
- * Build a source map from the given AST.
- *
- * Our AST is build from flat CSS strings but there are many because we handle
- * `@import`. This means that different nodes can have a different source.
- *
- * Instead of taking an input source map, we take the input CSS string we were
- * originally given, as well as the source text for any imported files, and
- * use that to generate a source map.
- *
- * We then require the use of other tools that can translate one or more
- * "input" source maps into a final output source map. For example,
- * `@jridgewell/remapping` can be used to handle this.
- *
- * This also ensures that tools that expect "local" source maps are able to
- * consume the source map we generate.
- *
- * The source map type we generate may be a bit different from "raw" source maps
- * that the `source-map-js` package uses. It's a "decoded" source map that is
- * represented by an object graph. It's identical to "decoded" source map from
- * the ECMA-426 spec for source maps.
- *
- * Note that the spec itself is still evolving which means our implementation
- * may need to evolve to match it.
- *
- * This can easily be converted to a "raw" source map by any tool that needs to.
- **/
-export function createSourceMap({ ast }: { ast: AstNode[] }) {
-  // Compute line tables for both the original and generated source lazily so we
-  // don't have to do it during parsing or printing.
-  let lineTables = new DefaultMap<Source, LineTable>((src) => createLineTable(src.code))
-  let sourceTable = new DefaultMap<Source, DecodedSource>((src) => ({
-    url: src.file,
-    content: src.code,
-    ignore: false,
-  }))
-
-  // Convert each mapping to a set of positions
-  let map: DecodedSourceMap = {
-    file: null,
-    sources: [],
-    mappings: [],
-  }
-
-  // Get all the indexes from the mappings
-  walk(ast, (node) => {
-    if (!node.src || !node.dst) return
-
-    let originalSource = sourceTable.get(node.src[0])
-    if (!originalSource.content) return
-
-    let originalTable = lineTables.get(node.src[0])
-    let generatedTable = lineTables.get(node.dst[0])
-
-    let originalSlice = originalSource.content.slice(node.src[1], node.src[2])
-
-    // Source maps only encode single locations — not multi-line ranges
-    // So to properly emulate this we'll scan the original text for multiple
-    // lines and create mappings for each of those lines that point to the
-    // destination node (whether it spans multiple lines or not)
-    //
-    // This is not 100% accurate if both the source and destination preserve
-    // their newlines but this only happens in the case of custom properties
-    //
-    // This is _good enough_
-    let offset = 0
-    for (let line of originalSlice.split('\n')) {
-      if (line.trim() !== '') {
-        let originalStart = originalTable.find(node.src[1] + offset)
-        let generatedStart = generatedTable.find(node.dst[1])
-
-        map.mappings.push({
-          name: null,
-          originalPosition: {
-            source: originalSource,
-            ...originalStart,
-          },
-          generatedPosition: generatedStart,
-        })
-      }
-
-      offset += line.length
-      offset += 1
-    }
-
-    let originalEnd = originalTable.find(node.src[2])
-    let generatedEnd = generatedTable.find(node.dst[2])
-
-    map.mappings.push({
-      name: null,
-      originalPosition: {
-        source: originalSource,
-        ...originalEnd,
-      },
-      generatedPosition: generatedEnd,
-    })
-  })
-
-  // Populate
-  for (let source of lineTables.keys()) {
-    map.sources.push(sourceTable.get(source))
-  }
-
-  // Sort the mappings in ascending order
-  map.mappings.sort((a, b) => {
-    return (
-      a.generatedPosition.line - b.generatedPosition.line ||
-      a.generatedPosition.column - b.generatedPosition.column ||
-      (a.originalPosition?.line ?? 0) - (b.originalPosition?.line ?? 0) ||
-      (a.originalPosition?.column ?? 0) - (b.originalPosition?.column ?? 0)
-    )
-  })
-
-  return map
-}
-
-export function createTranslationMap({
-  original,
-  generated,
-}: {
-  original: string
-  generated: string
-}) {
-  // Compute line tables for both the original and generated source lazily so we
-  // don't have to do it during parsing or printing.
-  let originalTable = createLineTable(original)
-  let generatedTable = createLineTable(generated)
-
-  type Translation = [
-    originalStart: Position,
-    originalEnd: Position,
-    generatedStart: Position | null,
-    generatedEnd: Position | null,
-  ]
-
-  return (node: AstNode) => {
-    if (!node.src) return []
-
-    let translations: Translation[] = []
-
-    translations.push([
-      originalTable.find(node.src[1]),
-      originalTable.find(node.src[2]),
-      node.dst ? generatedTable.find(node.dst[1]) : null,
-      node.dst ? generatedTable.find(node.dst[2]) : null,
-    ])
-
-    return translations
-  }
-}
diff --git a/packages/tailwindcss/src/source-maps/source.ts b/packages/tailwindcss/src/source-maps/source.ts
deleted file mode 100644
index c3a4f8988..000000000
--- a/packages/tailwindcss/src/source-maps/source.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-/**
- * The source code for one or more nodes in the AST
- *
- * This generally corresponds to a stylesheet
- */
-export interface Source {
-  /**
-   * The path to the file that contains the referenced source code
-   *
-   * If this references the *output* source code, this is `null`.
-   */
-  file: string | null
-
-  /**
-   * The referenced source code
-   */
-  code: string
-}
-
-/**
- * The file and offsets within it that this node covers
- *
- * This can represent either:
- * - A location in the original CSS which caused this node to be created
- * - A location in the output CSS where this node resides
- */
-export type SourceLocation = [source: Source, start: number, end: number]
diff --git a/packages/tailwindcss/src/source-maps/translation-map.test.ts b/packages/tailwindcss/src/source-maps/translation-map.test.ts
deleted file mode 100644
index 0c367ebbd..000000000
--- a/packages/tailwindcss/src/source-maps/translation-map.test.ts
+++ /dev/null
@@ -1,371 +0,0 @@
-import dedent from 'dedent'
-import { assert, expect, test } from 'vitest'
-import { toCss, type AstNode } from '../ast'
-import * as CSS from '../css-parser'
-import { createTranslationMap } from './source-map'
-import { visualizeSourceMapRanges, type SourceMapVisualizationRange } from './visualize-source-map'
-
-async function analyze(input: string) {
-  let ast = CSS.parse(input, { from: 'input.css' })
-  let css = toCss(ast, true)
-  let translate = createTranslationMap({
-    original: input,
-    generated: css,
-  })
-
-  function format(node: AstNode) {
-    let ranges: SourceMapVisualizationRange[] = []
-
-    for (let [oStart, oEnd, gStart, gEnd] of translate(node)) {
-      ranges.push({
-        original: {
-          source: 'input.css',
-          start: [oStart.line, oStart.column],
-          end: [oEnd.line, oEnd.column],
-        },
-        generated:
-          gStart && gEnd
-            ? {
-                start: [gStart.line, gStart.column],
-                end: [gEnd.line, gEnd.column],
-              }
-            : null,
-      })
-    }
-
-    return visualizeSourceMapRanges({ 'input.css': input }, css, ranges)
-  }
-
-  return { ast, css, format }
-}
-
-test('comment, single line', async () => {
-  let { ast, css, format } = await analyze(`/*! foo */`)
-
-  assert(ast[0].kind === 'comment')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css            |    input.css
-                             | 
-    1  /*! foo */            | 1  /*! foo */
-       ^^^^^^^^^^ A @ 1:0-10 |    ^^^^^^^^^^ A @ 1:0-10
-    2                        | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    "/*! foo */
-    "
-  `)
-})
-
-test('comment, multi line', async () => {
-  let { ast, css, format } = await analyze(`/*! foo \n bar */`)
-
-  assert(ast[0].kind === 'comment')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css           |    input.css
-                            | 
-    1  /*! foo              | 1  /*! foo 
-       ^^^^^^^^ A @ 1:0-2:7 |    ^^^^^^^^ A @ 1:0-2:7
-    2   bar */              | 2   bar */
-       ^^^^^^^ A            |    ^^^^^^^ A
-    3                       | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    "/*! foo 
-     bar */
-    "
-  `)
-})
-
-test('declaration, normal property, single line', async () => {
-  let { ast, css, format } = await analyze(`.foo { color: red; }`)
-
-  assert(ast[0].kind === 'rule')
-  assert(ast[0].nodes[0].kind === 'declaration')
-  expect(format(ast[0].nodes[0])).toMatchInlineSnapshot(`
-    "
-       output.css              |    input.css
-                               | 
-    1  .foo {                  | 
-    2    color: red;           | 1  .foo { color: red; }
-         ^^^^^^^^^^ A @ 2:2-12 |           ^^^^^^^^^^ A @ 1:7-17
-    3  }                       | 
-    4                          | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    ".foo {
-      color: red;
-    }
-    "
-  `)
-})
-
-test('declaration, normal property, multi line', async () => {
-  // Works, no changes needed
-  let { ast, css, format } = await analyze(dedent`
-    .foo {
-      grid-template-areas:
-        "a b c"
-        "d e f"
-        "g h i";
-    }
-  `)
-
-  assert(ast[0].kind === 'rule')
-  assert(ast[0].nodes[0].kind === 'declaration')
-  expect(format(ast[0].nodes[0])).toMatchInlineSnapshot(`
-    "
-       output.css                                                |    input.css
-                                                                 | 
-    1  .foo {                                                    | 
-    2    grid-template-areas: "a b c" "d e f" "g h i";           | 2    grid-template-areas:
-         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ A @ 2:2-46 |      ^^^^^^^^^^^^^^^^^^^^ A @ 2:2-5:11
-                                                                 | 3      "a b c"
-                                                                 |    ^^^^^^^^^^^ A
-                                                                 | 4      "d e f"
-                                                                 |    ^^^^^^^^^^^ A
-                                                                 | 5      "g h i";
-                                                                 |    ^^^^^^^^^^^ A
-                                                                 | 6  }
-    3  }                                                         | 
-    4                                                            | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    ".foo {
-      grid-template-areas: "a b c" "d e f" "g h i";
-    }
-    "
-  `)
-})
-
-test('declaration, custom property, single line', async () => {
-  let { ast, css, format } = await analyze(`.foo { --foo: bar; }`)
-
-  assert(ast[0].kind === 'rule')
-  assert(ast[0].nodes[0].kind === 'declaration')
-  expect(format(ast[0].nodes[0])).toMatchInlineSnapshot(`
-    "
-       output.css              |    input.css
-                               | 
-    1  .foo {                  | 
-    2    --foo: bar;           | 1  .foo { --foo: bar; }
-         ^^^^^^^^^^ A @ 2:2-12 |           ^^^^^^^^^^ A @ 1:7-17
-    3  }                       | 
-    4                          | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    ".foo {
-      --foo: bar;
-    }
-    "
-  `)
-})
-
-test('declaration, custom property, multi line', async () => {
-  let { ast, css, format } = await analyze(dedent`
-    .foo {
-      --foo: bar\nbaz;
-    }
-  `)
-
-  assert(ast[0].kind === 'rule')
-  assert(ast[0].nodes[0].kind === 'declaration')
-  expect(format(ast[0].nodes[0])).toMatchInlineSnapshot(`
-    "
-       output.css               |    input.css
-                                | 
-    1  .foo {                   | 
-    2    --foo: bar             | 2    --foo: bar
-         ^^^^^^^^^^ A @ 2:2-3:3 |      ^^^^^^^^^^ A @ 2:2-3:3
-    3  baz;                     | 3  baz;
-       ^^^ A                    |    ^^^ A
-                                | 4  }
-    4  }                        | 
-    5                           | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    ".foo {
-      --foo: bar
-    baz;
-    }
-    "
-  `)
-})
-
-test('at rules, bodyless, single line', async () => {
-  // This intentionally has extra spaces
-  let { ast, css, format } = await analyze(`@layer foo,     bar;`)
-
-  assert(ast[0].kind === 'at-rule')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css                 |    input.css
-                                  | 
-    1  @layer foo, bar;           | 1  @layer foo,     bar;
-       ^^^^^^^^^^^^^^^ A @ 1:0-15 |    ^^^^^^^^^^^^^^^^^^^ A @ 1:0-19
-    2                             | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    "@layer foo, bar;
-    "
-  `)
-})
-
-test('at rules, bodyless, multi line', async () => {
-  let { ast, css, format } = await analyze(dedent`
-    @layer
-      foo,
-      bar
-    ;
-  `)
-
-  assert(ast[0].kind === 'at-rule')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css                 |    input.css
-                                  | 
-    1  @layer foo, bar;           | 1  @layer
-       ^^^^^^^^^^^^^^^ A @ 1:0-15 |    ^^^^^^ A @ 1:0-4:0
-                                  | 2    foo,
-                                  |    ^^^^^^ A
-                                  | 3    bar
-                                  |    ^^^^^ A
-    2                             | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    "@layer foo, bar;
-    "
-  `)
-})
-
-test('at rules, body, single line', async () => {
-  let { ast, css, format } = await analyze(`@layer foo { color: red; }`)
-
-  assert(ast[0].kind === 'at-rule')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css             |    input.css
-                              | 
-    1  @layer foo {           | 1  @layer foo { color: red; }
-       ^^^^^^^^^^^ A @ 1:0-11 |    ^^^^^^^^^^^ A @ 1:0-11
-    2    color: red;          | 
-    3  }                      | 
-    4                         | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    "@layer foo {
-      color: red;
-    }
-    "
-  `)
-})
-
-test('at rules, body, multi line', async () => {
-  let { ast, css, format } = await analyze(dedent`
-    @layer
-      foo
-    {
-      color: baz;
-    }
-  `)
-
-  assert(ast[0].kind === 'at-rule')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css             |    input.css
-                              | 
-    1  @layer foo {           | 1  @layer
-       ^^^^^^^^^^^ A @ 1:0-11 |    ^^^^^^ A @ 1:0-3:0
-                              | 2    foo
-                              |    ^^^^^ A
-    2    color: baz;          | 
-    3  }                      | 
-    4                         | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    "@layer foo {
-      color: baz;
-    }
-    "
-  `)
-})
-
-test('style rules, body, single line', async () => {
-  let { ast, css, format } = await analyze(`.foo:is(.bar) { color: red; }`)
-
-  assert(ast[0].kind === 'rule')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css                |    input.css
-                                 | 
-    1  .foo:is(.bar) {           | 1  .foo:is(.bar) { color: red; }
-       ^^^^^^^^^^^^^^ A @ 1:0-14 |    ^^^^^^^^^^^^^^ A @ 1:0-14
-    2    color: red;             | 
-    3  }                         | 
-    4                            | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    ".foo:is(.bar) {
-      color: red;
-    }
-    "
-  `)
-})
-
-test('style rules, body, multi line', async () => {
-  // Works, no changes needed
-  let { ast, css, format } = await analyze(dedent`
-    .foo:is(
-      .bar
-    ) {
-      color: red;
-    }
-  `)
-
-  assert(ast[0].kind === 'rule')
-  expect(format(ast[0])).toMatchInlineSnapshot(`
-    "
-       output.css                  |    input.css
-                                   | 
-    1  .foo:is( .bar ) {           | 1  .foo:is(
-       ^^^^^^^^^^^^^^^^ A @ 1:0-16 |    ^^^^^^^^ A @ 1:0-3:2
-                                   | 2    .bar
-                                   |    ^^^^^^ A
-                                   | 3  ) {
-                                   |    ^^ A
-    2    color: red;               | 
-    3  }                           | 
-    4                              | 
-    "
-  `)
-
-  expect(css).toMatchInlineSnapshot(`
-    ".foo:is( .bar ) {
-      color: red;
-    }
-    "
-  `)
-})
diff --git a/packages/tailwindcss/src/source-maps/visualize-source-map.test.ts b/packages/tailwindcss/src/source-maps/visualize-source-map.test.ts
deleted file mode 100644
index f69bfac31..000000000
--- a/packages/tailwindcss/src/source-maps/visualize-source-map.test.ts
+++ /dev/null
@@ -1,318 +0,0 @@
-import dedent from 'dedent'
-import { SourceMapGenerator, type RawSourceMap } from 'source-map-js'
-import { expect, test } from 'vitest'
-import { visualizeSourceMap, visualizeSourceMapRanges } from './visualize-source-map'
-
-const css = dedent
-
-function sourceMap({
-  sources,
-  mappings,
-}: {
-  sources: Record<string, string>
-  mappings: {
-    source: string
-    original: [line: number, column: number]
-    generated: [line: number, column: number]
-  }[]
-}) {
-  let generator = new SourceMapGenerator()
-
-  for (let mapping of mappings) {
-    generator.addMapping({
-      source: mapping.source,
-      original: {
-        line: mapping.original[0],
-        column: mapping.original[1],
-      },
-      generated: {
-        line: mapping.generated[0],
-        column: mapping.generated[1],
-      },
-    })
-  }
-
-  for (let [source, content] of Object.entries(sources)) {
-    generator.setSourceContent(source, content)
-  }
-
-  return JSON.parse(generator.toString()) as RawSourceMap
-}
-
-test('visualizes single-line ranges', () => {
-  expect(
-    visualizeSourceMapRanges(
-      {
-        // prettier-ignore
-        'input.css': css`.foo { color: red; }`,
-      },
-      css`
-        .foo {
-          color: red;
-        }
-      `,
-      [
-        {
-          original: {
-            source: 'input.css',
-            start: [1, 7],
-            end: [1, 17],
-          },
-          generated: {
-            start: [2, 2],
-            end: [2, 12],
-          },
-        },
-      ],
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css              |    input.css
-                               | 
-    1  .foo {                  | 
-    2    color: red;           | 1  .foo { color: red; }
-         ^^^^^^^^^^ A @ 2:2-12 |           ^^^^^^^^^^ A @ 1:7-17
-    3  }                       | 
-    "
-  `)
-})
-
-test('visualizes multi-line ranges', () => {
-  expect(
-    visualizeSourceMapRanges(
-      {
-        'input.css': css`
-          /*! foo
-           bar */
-        `,
-      },
-      css`
-        /*! foo
-         bar */
-      `,
-      [
-        {
-          original: {
-            source: 'input.css',
-            start: [1, 0],
-            end: [2, 7],
-          },
-          generated: {
-            start: [1, 0],
-            end: [2, 7],
-          },
-        },
-      ],
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css          |    input.css
-                           | 
-    1  /*! foo             | 1  /*! foo
-       ^^^^^^^ A @ 1:0-2:7 |    ^^^^^^^ A @ 1:0-2:7
-    2   bar */             | 2   bar */
-       ^^^^^^^ A           |    ^^^^^^^ A
-    "
-  `)
-})
-
-test('visualizes multiple sources', () => {
-  expect(
-    visualizeSourceMapRanges(
-      {
-        'utilities.css': css`
-          @tailwind utilities;
-        `,
-        'input.css': css`
-          @utility custom {
-            color: red;
-          }
-        `,
-      },
-      css`
-        .flex {
-          display: flex;
-        }
-        .custom {
-          color: red;
-        }
-      `,
-      [
-        {
-          original: {
-            source: 'utilities.css',
-            start: [1, 0],
-            end: [1, 19],
-          },
-          generated: {
-            start: [1, 0],
-            end: [1, 6],
-          },
-        },
-        {
-          original: {
-            source: 'utilities.css',
-            start: [1, 0],
-            end: [1, 19],
-          },
-          generated: {
-            start: [2, 2],
-            end: [2, 15],
-          },
-        },
-        {
-          original: {
-            source: 'input.css',
-            start: [2, 2],
-            end: [2, 12],
-          },
-          generated: {
-            start: [5, 2],
-            end: [5, 12],
-          },
-        },
-      ],
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css                 |    original
-                                  | 
-                                  |    --- utilities.css ---
-    1  .flex {                    | 1  @tailwind utilities;
-       ^^^^^^ A @ 1:0-6           |    ^^^^^^^^^^^^^^^^^^^ A @ 1:0-19
-    2    display: flex;           | 
-         ^^^^^^^^^^^^^ A @ 2:2-15 | 
-    3  }                          | 
-    4  .custom {                  | 
-                                  |    --- input.css ---
-    5    color: red;              | 2    color: red;
-         ^^^^^^^^^^ B @ 5:2-12    |      ^^^^^^^^^^ B @ 2:2-12
-                                  | 3  }
-    6  }                          | 
-    "
-  `)
-})
-
-test('visualizes unmapped source ranges', () => {
-  expect(
-    visualizeSourceMapRanges(
-      {
-        // prettier-ignore
-        'input.css': css`.foo { color: red; }`,
-      },
-      css`
-        .foo {
-          color: red;
-        }
-      `,
-      [
-        {
-          original: {
-            source: 'input.css',
-            start: [1, 7],
-            end: [1, 17],
-          },
-          generated: null,
-        },
-      ],
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css |    input.css
-                  | 
-       unmapped A | 1  .foo { color: red; }
-                  |           ^^^^^^^^^^ A @ 1:7-17
-    1  .foo {     | 
-    2    color... | 
-    3  }          | 
-    "
-  `)
-})
-
-test('visualizes source-map points as generated segments', () => {
-  let generated = css`
-    /*! foo
-     bar */
-  `
-
-  expect(
-    visualizeSourceMap(
-      sourceMap({
-        sources: {
-          'input.css': css`
-            /*! foo
-             bar */
-          `,
-        },
-        mappings: [
-          { source: 'input.css', original: [1, 0], generated: [1, 0] },
-          { source: 'input.css', original: [2, 0], generated: [2, 0] },
-          { source: 'input.css', original: [2, 7], generated: [2, 7] },
-        ],
-      }),
-      generated,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css          |    input.css
-                           | 
-    1  /*! foo             | 1  /*! foo
-       ^^^^^^^ A @ 1:0-2:0 |    ^^^^^^^ A @ 1:0-2:0
-    2   bar */             | 2   bar */
-       ^^^^^^^ B @ 2:0-7   |    ^^^^^^^ B @ 2:0-7
-    "
-  `)
-})
-
-test('visualizes final source-map point through end of line', () => {
-  expect(
-    visualizeSourceMap(
-      sourceMap({
-        sources: {
-          'input.css': css`aaaa`,
-        },
-        mappings: [{ source: 'input.css', original: [1, 0], generated: [1, 0] }],
-      }),
-      css`aaaa`,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css       |    input.css
-                        | 
-    1  aaaa             | 1  aaaa
-       ^^^^ A @ 1:0-2:0 |    ^ A @ 1:0
-    "
-  `)
-})
-
-test('visualizes duplicate source-map points without hiding them', () => {
-  expect(
-    visualizeSourceMap(
-      sourceMap({
-        sources: {
-          'input.css': css`
-            aaaa
-            bbbb
-          `,
-        },
-        mappings: [
-          { source: 'input.css', original: [1, 0], generated: [1, 0] },
-          { source: 'input.css', original: [2, 0], generated: [1, 0] },
-          { source: 'input.css', original: [2, 4], generated: [1, 4] },
-        ],
-      }),
-      css`
-        bbbb
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-       output.css     |    input.css
-                      | 
-    1  bbbb           | 1  aaaa
-       ^ A @ 1:0      |    ^ A @ 1:0
-    1  bbbb           | 2  bbbb
-       ^^^^ B @ 1:0-4 |    ^^^^ B @ 2:0-4
-    "
-  `)
-})
diff --git a/packages/tailwindcss/src/source-maps/visualize-source-map.ts b/packages/tailwindcss/src/source-maps/visualize-source-map.ts
deleted file mode 100644
index d0da423be..000000000
--- a/packages/tailwindcss/src/source-maps/visualize-source-map.ts
+++ /dev/null
@@ -1,538 +0,0 @@
-import { SourceMapConsumer, type RawSourceMap } from 'source-map-js'
-
-import { DefaultMap } from '../utils/default-map'
-
-const COLUMN_WIDTH = 100
-const CONTEXT_LINES = 3
-
-type Range = { start: [number, number]; end: [number, number] }
-
-interface Annotation {
-  original: Range
-  generated: Range | null
-  source: string
-}
-
-interface MappedAnnotation extends Annotation {
-  generated: Range
-}
-
-interface SourceMapPoint {
-  original: [number, number]
-  generated: [number, number]
-  source: string
-}
-
-interface SourceVisualization {
-  before: string[]
-  line: string
-  marker: string
-  after: string[]
-}
-
-export interface SourceMapVisualizationRange {
-  original: Range & { source: string }
-  generated: Range | null
-}
-
-/**
- * Render source map mappings as a side-by-side view of generated and original code.
- *
- * For raw source maps this renders the generated segments implied by mapping points,
- * so duplicate points and unmapped generated lines are visible in snapshots.
- */
-export function visualizeSourceMap(map: RawSourceMap, css: string) {
-  let smc = new SourceMapConsumer(map)
-  let sourceContents = buildSourceContents(map.sources, map.sourcesContent ?? [])
-  let points: SourceMapPoint[] = []
-
-  smc.eachMapping((mapping) => {
-    if (
-      mapping.source === null ||
-      mapping.originalLine === null ||
-      mapping.originalColumn === null
-    ) {
-      return
-    }
-
-    points.push({
-      original: [mapping.originalLine, mapping.originalColumn],
-      generated: [mapping.generatedLine, mapping.generatedColumn],
-      source: mapping.source,
-    })
-  })
-
-  return renderVisualization(sourceContents, buildAnnotationsFromSourceMapPoints(points), css)
-}
-
-export function visualizeSourceMapRanges(
-  sources: Record<string, string>,
-  generated: string,
-  ranges: SourceMapVisualizationRange[],
-) {
-  let sourceContents = buildSourceContents(Object.keys(sources), Object.values(sources))
-  let annotations: Annotation[] = []
-
-  for (let range of ranges) {
-    annotations.push({
-      generated: range.generated,
-      original: range.original,
-      source: range.original.source,
-    })
-  }
-
-  return renderVisualization(sourceContents, annotations, generated)
-}
-
-function buildSourceContents(sources: string[], contents: (string | null)[]) {
-  let result = new Map<string, string[]>()
-
-  for (let i = 0; i < sources.length; i++) {
-    let content = contents[i]
-
-    if (content === undefined || content === null) continue
-
-    result.set(sources[i], content.split('\n'))
-  }
-
-  return result
-}
-
-function buildAnnotationsFromSourceMapPoints(points: SourceMapPoint[]) {
-  let annotations: Annotation[] = []
-  let current: MappedAnnotation | null = null
-
-  function finish(next: SourceMapPoint | null) {
-    if (current === null) return
-
-    if (samePosition(current.generated.start, current.generated.end)) {
-      if (next === null) {
-        current.generated.end = [current.generated.start[0] + 1, 0]
-      } else if (next.generated[0] > current.generated.start[0]) {
-        current.generated.end = [current.generated.start[0] + 1, 0]
-
-        if (
-          next.source === current.source &&
-          next.generated[0] === current.generated.start[0] + 1 &&
-          next.generated[1] === 0 &&
-          next.original[0] === current.original.start[0] + 1 &&
-          next.original[1] === 0
-        ) {
-          current.original.end = next.original
-        }
-      }
-    }
-
-    annotations.push(current)
-    current = null
-  }
-
-  for (let point of points) {
-    if (
-      current !== null &&
-      current.source === point.source &&
-      current.generated.start[0] === point.generated[0] &&
-      point.generated[1] > current.generated.end[1] &&
-      comparePosition(current.original.start, point.original) <= 0
-    ) {
-      current.generated.end = point.generated
-      current.original.end = point.original
-      continue
-    }
-
-    finish(point)
-
-    current = {
-      original: {
-        start: point.original,
-        end: point.original,
-      },
-      generated: {
-        start: point.generated,
-        end: point.generated,
-      },
-      source: point.source,
-    }
-  }
-
-  finish(null)
-
-  return annotations
-}
-
-function renderVisualization(
-  sourceContents: Map<string, string[]>,
-  annotationsList: Annotation[],
-  generated: string,
-) {
-  let generatedLines = generated.split('\n')
-  let nextLabelIdx = 0
-  let labelsBySource = new DefaultMap<string, string>(() => annotationLabel(nextLabelIdx++))
-  let labels = annotationsList.map((annotation) => {
-    return labelsBySource.get(sourceKey(annotation.source, annotation.original))
-  })
-  let generatedLineWidth = String(generatedLines.length).length
-  let sourceLineWidth = Math.max(
-    1,
-    ...Array.from(sourceContents.values(), (lines) => String(lines.length).length),
-  )
-  let leftWidth = Math.min(
-    100,
-    Math.max(
-      withLineNumber(generatedLineWidth, 'output.css').length,
-      ...annotationsList.map((annotation, idx) => {
-        let label = labels[idx]
-
-        if (annotation.generated === null) {
-          return withoutLineNumber(generatedLineWidth, `unmapped ${label}`).length
-        }
-
-        let line = withLineNumber(
-          generatedLineWidth,
-          generatedLines[annotation.generated.start[0] - 1] ?? '',
-          annotation.generated.start[0],
-        )
-        let marker = withoutLineNumber(
-          generatedLineWidth,
-          visualizeRange(
-            annotation.generated,
-            label,
-            generatedLines[annotation.generated.start[0] - 1] ?? '',
-          ),
-        )
-        let after = visualizeGeneratedRangeContinuation(
-          generatedLines,
-          generatedLineWidth,
-          annotation.generated,
-          label,
-        )
-
-        return Math.max(line.length, marker.length, ...after.map((line) => line.length))
-      }),
-    ),
-  )
-  let sources = new Set(annotationsList.map((annotation) => annotation.source))
-  let sourceHeader = sources.size === 1 ? (annotationsList[0]?.source ?? 'original') : 'original'
-  let result: string[] = []
-
-  function add(left: string, right: string) {
-    result.push(sideBySide(left, right, leftWidth))
-  }
-
-  add(
-    withLineNumber(generatedLineWidth, 'output.css'),
-    withLineNumber(sourceLineWidth, sourceHeader),
-  )
-  add(withoutLineNumber(generatedLineWidth, ''), withoutLineNumber(sourceLineWidth, ''))
-
-  let lastLine = 0
-  let lastSourceLine = new Map<string, number>()
-  let lastSource: string | null = null
-  let renderedSources = new Set<string>()
-
-  for (let idx = 0; idx < annotationsList.length; idx++) {
-    let annotation = annotationsList[idx]
-    let label = labels[idx]
-
-    if (annotation.generated === null) {
-      let source = visualizeSource(
-        sourceContents,
-        lastSourceLine,
-        renderedSources,
-        sourceLineWidth,
-        annotation.source,
-        annotation.original,
-        label,
-      )
-
-      if (sources.size > 1 && source.line !== '' && annotation.source !== lastSource) {
-        add(
-          withoutLineNumber(generatedLineWidth, ''),
-          withoutLineNumber(sourceLineWidth, `--- ${annotation.source} ---`),
-        )
-        lastSource = annotation.source
-      }
-
-      for (let line of source.before) {
-        add(withoutLineNumber(generatedLineWidth, ''), line)
-      }
-
-      add(withoutLineNumber(generatedLineWidth, `unmapped ${label}`), source.line)
-      add(withoutLineNumber(generatedLineWidth, ''), source.marker)
-
-      for (let line of source.after) {
-        add(withoutLineNumber(generatedLineWidth, ''), line)
-      }
-
-      continue
-    }
-
-    let lineNumber = annotation.generated.start[0]
-
-    for (let i = lastLine + 1; i < lineNumber; i++) {
-      add(
-        withLineNumber(generatedLineWidth, generatedLines[i - 1] ?? '', i),
-        withoutLineNumber(sourceLineWidth, ''),
-      )
-    }
-
-    let endLine = coveredEndLine(annotation.generated)
-    let generatedAfter = visualizeGeneratedRangeContinuation(
-      generatedLines,
-      generatedLineWidth,
-      annotation.generated,
-      label,
-    )
-    let source = visualizeSource(
-      sourceContents,
-      lastSourceLine,
-      renderedSources,
-      sourceLineWidth,
-      annotation.source,
-      annotation.original,
-      label,
-    )
-
-    if (sources.size > 1 && source.line !== '' && annotation.source !== lastSource) {
-      add(
-        withoutLineNumber(generatedLineWidth, ''),
-        withoutLineNumber(sourceLineWidth, `--- ${annotation.source} ---`),
-      )
-      lastSource = annotation.source
-    }
-
-    for (let line of source.before) {
-      add(withoutLineNumber(generatedLineWidth, ''), line)
-    }
-
-    add(
-      withLineNumber(generatedLineWidth, generatedLines[lineNumber - 1] ?? '', lineNumber),
-      source.line,
-    )
-    add(
-      withoutLineNumber(
-        generatedLineWidth,
-        visualizeRange(annotation.generated, label, generatedLines[lineNumber - 1] ?? ''),
-      ),
-      source.marker,
-    )
-
-    for (let i = 0; i < Math.max(generatedAfter.length, source.after.length); i++) {
-      add(generatedAfter[i] ?? withoutLineNumber(generatedLineWidth, ''), source.after[i] ?? '')
-    }
-
-    lastLine = endLine
-  }
-
-  for (let i = lastLine + 1; i <= generatedLines.length; i++) {
-    add(
-      withLineNumber(generatedLineWidth, generatedLines[i - 1] ?? '', i),
-      withoutLineNumber(sourceLineWidth, ''),
-    )
-  }
-
-  return `\n${result.join('\n')}\n`
-}
-
-function sideBySide(left: string, right: string, leftWidth: number) {
-  return `${fitColumn(left, leftWidth)} | ${fitColumn(right, COLUMN_WIDTH, false)}`
-}
-
-function withLineNumber(width: number, value: string, line?: number) {
-  return `${line === undefined ? ' '.repeat(width) : String(line).padStart(width)}  ${value}`
-}
-
-function withoutLineNumber(width: number, value: string) {
-  if (value === '') return ''
-
-  return `${' '.repeat(width)}  ${value}`
-}
-
-function fitColumn(value: string, width: number, pad = true) {
-  if (value.length <= width) {
-    return pad ? value.padEnd(width) : value
-  }
-
-  let markerIdx = value.indexOf(' @ ')
-
-  if (markerIdx !== -1) {
-    let labelIdx = value.lastIndexOf(' ', markerIdx - 1) + 1
-    let suffix = value.slice(labelIdx)
-    let prefixWidth = width - suffix.length - 4
-
-    if (prefixWidth > 0) {
-      let result = `${value.slice(0, prefixWidth)}... ${suffix}`
-
-      return pad ? result.padEnd(width) : result
-    }
-  }
-
-  return `${value.slice(0, width - 3)}...`
-}
-
-function annotationLabel(idx: number) {
-  let label = ''
-
-  for (let current = idx; current >= 0; current = Math.floor(current / 26) - 1) {
-    label = String.fromCharCode(65 + (current % 26)) + label
-  }
-
-  return label
-}
-
-function visualizeRange(range: Range, label: string, line?: string) {
-  let start = range.start[1]
-  let width = (() => {
-    if (line !== undefined && range.start[0] !== range.end[0]) {
-      return Math.max(1, line.length - start)
-    }
-
-    return Math.max(1, range.end[1] - start)
-  })()
-  return `${' '.repeat(start)}${'^'.repeat(width)} ${label} @ ${formatRange(range)}`
-}
-
-function visualizeSource(
-  sourceContents: Map<string, string[]>,
-  lastSourceLine: Map<string, number>,
-  renderedSources: Set<string>,
-  sourceLineWidth: number,
-  source: string,
-  range: Range,
-  label: string,
-): SourceVisualization {
-  let lines = sourceContents.get(source)
-
-  if (lines === undefined) return { before: [], line: '', marker: '', after: [] }
-
-  let startLine = range.start[0]
-  let line = lines[startLine - 1]
-
-  if (line === undefined) return { before: [], line: '', marker: '', after: [] }
-
-  let before: string[] = []
-  let lastLine = lastSourceLine.get(source) ?? 0
-
-  if (lastLine > 0 && startLine > lastLine && startLine - lastLine <= CONTEXT_LINES + 1) {
-    for (let i = lastLine + 1; i < startLine; i++) {
-      let line = lines[i - 1] ?? ''
-
-      if (line.trim() === '') continue
-
-      before.push(withLineNumber(sourceLineWidth, line, i))
-    }
-  }
-
-  let key = sourceKey(source, range)
-
-  if (renderedSources.has(key)) {
-    lastSourceLine.set(source, Math.max(lastLine, startLine))
-
-    return { before: [], line: '', marker: '', after: [] }
-  }
-
-  renderedSources.add(key)
-
-  let endLine = coveredEndLine(range)
-  let after = visualizeSourceRangeContinuation(lines, sourceLineWidth, range, label)
-
-  if (startLine > lastLine) {
-    for (let i = endLine + 1; i <= Math.min(endLine + CONTEXT_LINES, lines.length); i++) {
-      let line = lines[i - 1]
-
-      if (line?.trim() !== '}') break
-
-      after.push(withLineNumber(sourceLineWidth, line, i))
-      endLine = i
-    }
-  }
-
-  lastSourceLine.set(source, Math.max(lastLine, endLine))
-
-  return {
-    before,
-    line: withLineNumber(sourceLineWidth, line, startLine),
-    marker: withoutLineNumber(sourceLineWidth, visualizeRange(range, label, line)),
-    after,
-  }
-}
-
-function visualizeSourceRangeContinuation(
-  lines: string[],
-  sourceLineWidth: number,
-  range: Range,
-  label: string,
-) {
-  let result: string[] = []
-
-  for (let i = range.start[0] + 1; i <= coveredEndLine(range); i++) {
-    let line = lines[i - 1] ?? ''
-
-    result.push(withLineNumber(sourceLineWidth, line, i))
-    result.push(
-      withoutLineNumber(sourceLineWidth, visualizeContinuationRange(range, label, line, i)),
-    )
-  }
-
-  return result
-}
-
-function visualizeGeneratedRangeContinuation(
-  lines: string[],
-  generatedLineWidth: number,
-  range: Range,
-  label: string,
-) {
-  let result: string[] = []
-
-  for (let i = range.start[0] + 1; i <= coveredEndLine(range); i++) {
-    let line = lines[i - 1] ?? ''
-
-    result.push(withLineNumber(generatedLineWidth, line, i))
-    result.push(
-      withoutLineNumber(generatedLineWidth, visualizeContinuationRange(range, label, line, i)),
-    )
-  }
-
-  return result
-}
-
-function coveredEndLine(range: Range) {
-  if (range.start[0] !== range.end[0] && range.end[1] === 0) {
-    return range.end[0] - 1
-  }
-
-  return range.end[0]
-}
-
-function visualizeContinuationRange(range: Range, label: string, line: string, lineNumber: number) {
-  let start = lineNumber === range.start[0] ? range.start[1] : 0
-  let end = lineNumber === range.end[0] ? range.end[1] : line.length
-  let width = Math.max(1, end - start)
-
-  return `${' '.repeat(start)}${'^'.repeat(width)} ${label}`
-}
-
-function sourceKey(source: string, range: Range) {
-  return `${source}:${range.start[0]}:${range.start[1]}:${range.end[0]}:${range.end[1]}`
-}
-
-function samePosition(a: [number, number], b: [number, number]) {
-  return a[0] === b[0] && a[1] === b[1]
-}
-
-function comparePosition(a: [number, number], b: [number, number]) {
-  return a[0] - b[0] || a[1] - b[1]
-}
-
-function formatRange(range: Range): string {
-  if (range.start[0] === range.end[0]) {
-    if (range.start[1] === range.end[1]) {
-      return `${range.start[0]}:${range.start[1]}`
-    }
-
-    return `${range.start[0]}:${range.start[1]}-${range.end[1]}`
-  }
-
-  return `${range.start[0]}:${range.start[1]}-${range.end[0]}:${range.end[1]}`
-}
diff --git a/packages/tailwindcss/src/test-utils/custom-serializer.ts b/packages/tailwindcss/src/test-utils/custom-serializer.ts
index 1704340e7..ff2b0a3f0 100644
--- a/packages/tailwindcss/src/test-utils/custom-serializer.ts
+++ b/packages/tailwindcss/src/test-utils/custom-serializer.ts
@@ -3,20 +3,19 @@ import type { SnapshotSerializer } from 'vitest'
 // We're reducing the precision of parameters to the `oklab()` function from
 // our snapshots as we've observed lightningcss generating different decimal
 // places in the last position when run on different operating systems.
-const HIGH_PRECISION_COLOR_FUNCTION =
-  /(oklab\(|oklch\(|lab\(|lch\()\d{1,2}\.?\d{0,4}% -?\d{0,2}\.(\d{4,8}) -?\d{0,2}.(\d{4,8}) \/ \.\d{1,2}\)/g
+const HIGH_PRECISION_OKLAB = /oklab\(\d{1,2}\.?\d{0,4}% -?\.(\d{6,8}) -?\.(\d{6,8}) \/ \.\d{1,2}\)/g
 
 export default {
   test(val) {
-    return typeof val === 'string' && val.match(HIGH_PRECISION_COLOR_FUNCTION) !== null
+    return typeof val === 'string' && val.match(HIGH_PRECISION_OKLAB) !== null
   },
   serialize(val, config, indentation, depth, refs, printer) {
     if (typeof val !== 'string') {
       throw new Error('This was already tested in the test() callback')
     }
 
-    let replaced = val.replaceAll(HIGH_PRECISION_COLOR_FUNCTION, (match, _, first, second) => {
-      return match.replaceAll(first, first.slice(0, 3)).replaceAll(second, second.slice(0, 3))
+    let replaced = val.replaceAll(HIGH_PRECISION_OKLAB, (match, first, second) => {
+      return match.replaceAll(first, first.slice(0, 5)).replaceAll(second, second.slice(0, 5))
     })
     return printer(replaced, config, indentation, depth, refs)
   },
diff --git a/packages/tailwindcss/src/test-utils/run.ts b/packages/tailwindcss/src/test-utils/run.ts
index 7667ca66f..2951ef576 100644
--- a/packages/tailwindcss/src/test-utils/run.ts
+++ b/packages/tailwindcss/src/test-utils/run.ts
@@ -1,25 +1,49 @@
+import { Features, transform } from 'lightningcss'
 import { compile } from '..'
-import { optimize } from '../../../@tailwindcss-node/src/optimize'
 
-const css = String.raw
-
-export async function run(
-  candidates: string[],
-  input = css`
-    @tailwind utilities;
-  `,
+export async function compileCss(
+  css: string,
+  candidates: string[] = [],
   options: Parameters<typeof compile>[1] = {},
 ) {
-  let { build } = await compile(input, options)
-  return pretty(optimize(build(candidates)).code)
+  let { build } = await compile(css, options)
+  return optimizeCss(build(candidates)).trim()
 }
 
-export async function compileCss(css: string, options: Parameters<typeof compile>[1] = {}) {
-  return run([], css, options)
+export async function run(candidates: string[]) {
+  let { build } = await compile('@tailwind utilities;')
+  return optimizeCss(build(candidates)).trim()
 }
 
-export function pretty(input: string) {
-  input = input.trim()
-  if (input === '') return ''
-  return `\n${input}\n`
+export function optimizeCss(
+  input: string,
+  { file = 'input.css', minify = false }: { file?: string; minify?: boolean } = {},
+) {
+  function optimize(code: Buffer | Uint8Array) {
+    return transform({
+      filename: file,
+      code,
+      minify,
+      sourceMap: false,
+      drafts: {
+        customMedia: true,
+      },
+      nonStandard: {
+        deepSelectorCombinator: true,
+      },
+      include: Features.Nesting,
+      exclude: Features.LogicalProperties | Features.DirSelector | Features.LightDark,
+      targets: {
+        safari: (16 << 16) | (4 << 8),
+        ios_saf: (16 << 16) | (4 << 8),
+        firefox: 128 << 16,
+        chrome: 111 << 16,
+      },
+      errorRecovery: true,
+    }).code
+  }
+
+  // Running Lightning CSS twice to ensure that adjacent rules are merged after
+  // nesting is applied. This creates a more optimized output.
+  return optimize(optimize(Buffer.from(input))).toString()
 }
diff --git a/packages/tailwindcss/src/theme.ts b/packages/tailwindcss/src/theme.ts
index 073fb242f..b72b99a09 100644
--- a/packages/tailwindcss/src/theme.ts
+++ b/packages/tailwindcss/src/theme.ts
@@ -1,4 +1,4 @@
-import { type AtRule, type Declaration } from './ast'
+import { type AtRule } from './ast'
 import { escape, unescape } from './utils/escape'
 
 export const enum ThemeOptions {
@@ -21,15 +21,12 @@ const ignoredThemeKeyMap = new Map([
     '--text',
     [
       '--text-color',
-      '--text-decoration-color',
-      '--text-decoration-thickness',
-      '--text-indent',
-      '--text-shadow',
       '--text-underline-offset',
+      '--text-indent',
+      '--text-decoration-thickness',
+      '--text-decoration-color',
     ],
   ],
-  ['--grid-column', ['--grid-column-start', '--grid-column-end']],
-  ['--grid-row', ['--grid-row-start', '--grid-row-end']],
 ])
 
 function isIgnoredThemeKey(themeKey: ThemeKey, namespace: ThemeKey) {
@@ -42,22 +39,11 @@ export class Theme {
   public prefix: string | null = null
 
   constructor(
-    private values = new Map<
-      string,
-      {
-        value: string
-        options: ThemeOptions
-        src: Declaration['src']
-      }
-    >(),
+    private values = new Map<string, { value: string; options: ThemeOptions }>(),
     private keyframes = new Set<AtRule>([]),
   ) {}
 
-  get size() {
-    return this.values.size
-  }
-
-  add(key: string, value: string, options = ThemeOptions.NONE, src?: Declaration['src']): void {
+  add(key: string, value: string, options = ThemeOptions.NONE): void {
     if (key.endsWith('-*')) {
       if (value !== 'initial') {
         throw new Error(`Invalid theme value \`${value}\` for namespace \`${key}\``)
@@ -81,7 +67,7 @@ export class Theme {
     if (value === 'initial') {
       this.values.delete(key)
     } else {
-      this.values.set(key, { value, options, src })
+      this.values.set(key, { value, options })
     }
   }
 
diff --git a/packages/tailwindcss/src/types.ts b/packages/tailwindcss/src/types.ts
deleted file mode 100644
index f0fca5cf7..000000000
--- a/packages/tailwindcss/src/types.ts
+++ /dev/null
@@ -1 +0,0 @@
-export type Writable<T> = T extends Readonly<infer U> ? U : T
diff --git a/packages/tailwindcss/src/utilities.test.ts b/packages/tailwindcss/src/utilities.test.ts
index 66b051d57..908a2398a 100644
--- a/packages/tailwindcss/src/utilities.test.ts
+++ b/packages/tailwindcss/src/utilities.test.ts
@@ -1,15 +1,13 @@
-import { describe, expect, test, vi } from 'vitest'
+import { describe, expect, test } from 'vitest'
 import { compile } from '.'
-import { compileCss, run } from './test-utils/run'
-import { isValidFunctionalUtilityName, isValidStaticUtilityName } from './utilities'
+import { compileCss, optimizeCss, run } from './test-utils/run'
 
 const css = String.raw
 
 test('sr-only', async () => {
   expect(await run(['sr-only'])).toMatchInlineSnapshot(`
-    "
-    .sr-only {
-      clip-path: inset(50%);
+    ".sr-only {
+      clip: rect(0, 0, 0, 0);
       white-space: nowrap;
       border-width: 0;
       width: 1px;
@@ -18,17 +16,15 @@ test('sr-only', async () => {
       padding: 0;
       position: absolute;
       overflow: hidden;
-    }
-    "
+    }"
   `)
   expect(await run(['-sr-only', 'sr-only-[var(--value)]', 'sr-only/foo'])).toEqual('')
 })
 
 test('not-sr-only', async () => {
   expect(await run(['not-sr-only'])).toMatchInlineSnapshot(`
-    "
-    .not-sr-only {
-      clip-path: none;
+    ".not-sr-only {
+      clip: auto;
       white-space: normal;
       width: auto;
       height: auto;
@@ -36,23 +32,20 @@ test('not-sr-only', async () => {
       padding: 0;
       position: static;
       overflow: visible;
-    }
-    "
+    }"
   `)
   expect(await run(['-not-sr-only', 'not-sr-only-[var(--value)]', 'not-sr-only/foo'])).toEqual('')
 })
 
 test('pointer-events', async () => {
   expect(await run(['pointer-events-none', 'pointer-events-auto'])).toMatchInlineSnapshot(`
-    "
-    .pointer-events-auto {
+    ".pointer-events-auto {
       pointer-events: auto;
     }
 
     .pointer-events-none {
       pointer-events: none;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -66,8 +59,7 @@ test('pointer-events', async () => {
 
 test('visibility', async () => {
   expect(await run(['visible', 'invisible', 'collapse'])).toMatchInlineSnapshot(`
-    "
-    .collapse {
+    ".collapse {
       visibility: collapse;
     }
 
@@ -77,8 +69,7 @@ test('visibility', async () => {
 
     .visible {
       visibility: visible;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -94,8 +85,7 @@ test('visibility', async () => {
 
 test('position', async () => {
   expect(await run(['static', 'fixed', 'absolute', 'relative', 'sticky'])).toMatchInlineSnapshot(`
-    "
-    .absolute {
+    ".absolute {
       position: absolute;
     }
 
@@ -113,8 +103,7 @@ test('position', async () => {
 
     .sticky {
       position: sticky;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -134,7 +123,15 @@ test('position', async () => {
 
 test('inset', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
       [
         'inset-auto',
         'inset-shadow-sm',
@@ -146,39 +143,9 @@ test('inset', async () => {
         '-inset-4',
         'inset-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-shadow: 0 0 #0000;
-          --tw-shadow-color: initial;
-          --tw-shadow-alpha: 100%;
-          --tw-inset-shadow: 0 0 #0000;
-          --tw-inset-shadow-color: initial;
-          --tw-inset-shadow-alpha: 100%;
-          --tw-ring-color: initial;
-          --tw-ring-shadow: 0 0 #0000;
-          --tw-inset-ring-color: initial;
-          --tw-inset-ring-shadow: 0 0 #0000;
-          --tw-ring-inset: initial;
-          --tw-ring-offset-width: 0px;
-          --tw-ring-offset-color: #fff;
-          --tw-ring-offset-shadow: 0 0 #0000;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -231,12 +198,6 @@ test('inset', async () => {
       inherits: false
     }
 
-    @property --tw-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-inset-shadow {
       syntax: "*";
       inherits: false;
@@ -248,12 +209,6 @@ test('inset', async () => {
       inherits: false
     }
 
-    @property --tw-inset-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-ring-color {
       syntax: "*";
       inherits: false
@@ -297,8 +252,7 @@ test('inset', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0 0 #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -320,7 +274,14 @@ test('inset', async () => {
 
 test('inset-x', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
       [
         'inset-x-shadowned',
         'inset-x-auto',
@@ -331,17 +292,9 @@ test('inset-x', async () => {
         '-inset-x-4',
         'inset-x-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -376,11 +329,17 @@ test('inset-x', async () => {
 
     .inset-x-shadowned {
       inset-inline: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px #0000000d;
+        }
+        @tailwind utilities;
+      `,
       [
         'inset-x-shadow-sm',
         'inset-x',
@@ -396,20 +355,20 @@ test('inset-x', async () => {
         '-inset-x-4/foo',
         'inset-x-[4px]/foo',
       ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px #0000000d;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('inset-y', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
       [
         'inset-y-shadowned',
         'inset-y-auto',
@@ -420,17 +379,9 @@ test('inset-y', async () => {
         '-inset-y-4',
         'inset-y-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -465,11 +416,17 @@ test('inset-y', async () => {
 
     .inset-y-shadowned {
       inset-block: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+        }
+        @tailwind utilities;
+      `,
       [
         'inset-y-shadow-sm',
         'inset-y',
@@ -485,30 +442,13 @@ test('inset-y', async () => {
         '-inset-y-4/foo',
         'inset-y-[4px]/foo',
       ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
-test('inset-s', async () => {
+test('start', async () => {
   expect(
-    await run(
-      [
-        'inset-s-shadowned',
-        'inset-s-auto',
-        '-inset-s-full',
-        'inset-s-full',
-        'inset-s-3/4',
-        'inset-s-4',
-        '-inset-s-4',
-        'inset-s-[4px]',
-      ],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
@@ -516,64 +456,57 @@ test('inset-s', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'start-shadowned',
+        'start-auto',
+        '-start-full',
+        'start-full',
+        'start-3/4',
+        'start-4',
+        '-start-4',
+        'start-[4px]',
+      ],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
 
-    .-inset-s-4 {
+    .-start-4 {
       inset-inline-start: calc(var(--spacing-4) * -1);
     }
 
-    .-inset-s-full {
+    .-start-full {
       inset-inline-start: -100%;
     }
 
-    .inset-s-3\\/4 {
+    .start-3\\/4 {
       inset-inline-start: 75%;
     }
 
-    .inset-s-4 {
+    .start-4 {
       inset-inline-start: var(--spacing-4);
     }
 
-    .inset-s-\\[4px\\] {
+    .start-\\[4px\\] {
       inset-inline-start: 4px;
     }
 
-    .inset-s-auto {
+    .start-auto {
       inset-inline-start: auto;
     }
 
-    .inset-s-full {
+    .start-full {
       inset-inline-start: 100%;
     }
 
-    .inset-s-shadowned {
+    .start-shadowned {
       inset-inline-start: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      [
-        'inset-s-shadow-sm',
-        'inset-s',
-        'inset-s--1',
-        'inset-s--1/2',
-        'inset-s--1/-2',
-        'inset-s-1/-2',
-        'inset-s-auto/foo',
-        '-inset-s-full/foo',
-        'inset-s-full/foo',
-        'inset-s-3/4/foo',
-        'inset-s-4/foo',
-        '-inset-s-4/foo',
-        'inset-s-[4px]/foo',
-      ],
+    await compileCss(
       css`
         @theme reference {
           --spacing-4: 1rem;
@@ -581,23 +514,28 @@ test('inset-s', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'start-shadow-sm',
+        'start',
+        'start--1',
+        'start--1/2',
+        'start--1/-2',
+        'start-1/-2',
+        'start-auto/foo',
+        '-start-full/foo',
+        'start-full/foo',
+        'start-3/4/foo',
+        'start-4/foo',
+        '-start-4/foo',
+        'start-[4px]/foo',
+      ],
     ),
   ).toEqual('')
 })
 
-test('inset-e', async () => {
+test('end', async () => {
   expect(
-    await run(
-      [
-        'inset-e-shadowned',
-        'inset-e-auto',
-        '-inset-e-full',
-        'inset-e-full',
-        'inset-e-3/4',
-        'inset-e-4',
-        '-inset-e-4',
-        'inset-e-[4px]',
-      ],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
@@ -605,64 +543,57 @@ test('inset-e', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'end-shadowned',
+        'end-auto',
+        '-end-full',
+        'end-full',
+        'end-3/4',
+        'end-4',
+        '-end-4',
+        'end-[4px]',
+      ],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
 
-    .-inset-e-4 {
+    .-end-4 {
       inset-inline-end: calc(var(--spacing-4) * -1);
     }
 
-    .-inset-e-full {
+    .-end-full {
       inset-inline-end: -100%;
     }
 
-    .inset-e-3\\/4 {
+    .end-3\\/4 {
       inset-inline-end: 75%;
     }
 
-    .inset-e-4 {
+    .end-4 {
       inset-inline-end: var(--spacing-4);
     }
 
-    .inset-e-\\[4px\\] {
+    .end-\\[4px\\] {
       inset-inline-end: 4px;
     }
 
-    .inset-e-auto {
+    .end-auto {
       inset-inline-end: auto;
     }
 
-    .inset-e-full {
+    .end-full {
       inset-inline-end: 100%;
     }
 
-    .inset-e-shadowned {
+    .end-shadowned {
       inset-inline-end: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      [
-        'inset-e-shadow-sm',
-        'inset-e',
-        'inset-e--1',
-        'inset-e--1/2',
-        'inset-e--1/-2',
-        'inset-e-1/-2',
-        'inset-e-auto/foo',
-        '-inset-e-full/foo',
-        'inset-e-full/foo',
-        'inset-e-3/4/foo',
-        'inset-e-4/foo',
-        '-inset-e-4/foo',
-        'inset-e-[4px]/foo',
-      ],
+    await compileCss(
       css`
         @theme reference {
           --spacing-4: 1rem;
@@ -670,191 +601,36 @@ test('inset-e', async () => {
         }
         @tailwind utilities;
       `,
-    ),
-  ).toEqual('')
-})
-
-test('inset-bs', async () => {
-  expect(
-    await run(
       [
-        'inset-bs-shadowned',
-        'inset-bs-auto',
-        '-inset-bs-full',
-        'inset-bs-full',
-        'inset-bs-3/4',
-        'inset-bs-4',
-        '-inset-bs-4',
-        'inset-bs-[4px]',
+        'end-shadow-sm',
+        'end',
+        'end--1',
+        'end--1/2',
+        'end--1/-2',
+        'end-1/-2',
+        'end-auto/foo',
+        '-end-full/foo',
+        'end-full/foo',
+        'end-3/4/foo',
+        'end-4/foo',
+        '-end-4/foo',
+        'end-[4px]/foo',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-      --inset-shadowned: 1940px;
-    }
-
-    .-inset-bs-4 {
-      inset-block-start: calc(var(--spacing-4) * -1);
-    }
-
-    .-inset-bs-full {
-      inset-block-start: -100%;
-    }
-
-    .inset-bs-3\\/4 {
-      inset-block-start: 75%;
-    }
-
-    .inset-bs-4 {
-      inset-block-start: var(--spacing-4);
-    }
-
-    .inset-bs-\\[4px\\] {
-      inset-block-start: 4px;
-    }
-
-    .inset-bs-auto {
-      inset-block-start: auto;
-    }
-
-    .inset-bs-full {
-      inset-block-start: 100%;
-    }
-
-    .inset-bs-shadowned {
-      inset-block-start: var(--inset-shadowned);
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'inset-bs-shadow-sm',
-        'inset-bs',
-        'inset-bs--1',
-        'inset-bs--1/2',
-        'inset-bs--1/-2',
-        'inset-bs-1/-2',
-        'inset-bs-auto/foo',
-        '-inset-bs-full/foo',
-        'inset-bs-full/foo',
-        'inset-bs-3/4/foo',
-        'inset-bs-4/foo',
-        '-inset-bs-4/foo',
-        'inset-bs-[4px]/foo',
-      ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toEqual('')
-})
-
-test('inset-be', async () => {
-  expect(
-    await run(
-      [
-        'inset-be-shadowned',
-        'inset-be-auto',
-        '-inset-be-full',
-        'inset-be-full',
-        'inset-be-3/4',
-        'inset-be-4',
-        '-inset-be-4',
-        'inset-be-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-      --inset-shadowned: 1940px;
-    }
-
-    .-inset-be-4 {
-      inset-block-end: calc(var(--spacing-4) * -1);
-    }
-
-    .-inset-be-full {
-      inset-block-end: -100%;
-    }
-
-    .inset-be-3\\/4 {
-      inset-block-end: 75%;
-    }
-
-    .inset-be-4 {
-      inset-block-end: var(--spacing-4);
-    }
-
-    .inset-be-\\[4px\\] {
-      inset-block-end: 4px;
-    }
-
-    .inset-be-auto {
-      inset-block-end: auto;
-    }
-
-    .inset-be-full {
-      inset-block-end: 100%;
-    }
-
-    .inset-be-shadowned {
-      inset-block-end: var(--inset-shadowned);
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'inset-be-shadow-sm',
-        'inset-be',
-        'inset-be--1',
-        'inset-be--1/2',
-        'inset-be--1/-2',
-        'inset-be-1/-2',
-        'inset-be-auto/foo',
-        '-inset-be-full/foo',
-        'inset-be-full/foo',
-        'inset-be-3/4/foo',
-        'inset-be-4/foo',
-        '-inset-be-4/foo',
-        'inset-be-[4px]/foo',
-      ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('top', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
+
       [
         'top-shadowned',
         'top-auto',
@@ -865,17 +641,9 @@ test('top', async () => {
         '-top-4',
         'top-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -910,11 +678,17 @@ test('top', async () => {
 
     .top-shadowned {
       top: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+        }
+        @tailwind utilities;
+      `,
       [
         'top-shadow-sm',
         'top',
@@ -930,20 +704,20 @@ test('top', async () => {
         '-top-4/foo',
         'top-[4px]/foo',
       ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('right', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
       [
         'right-shadowned',
         'right-auto',
@@ -954,17 +728,9 @@ test('right', async () => {
         '-right-4',
         'right-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -999,11 +765,17 @@ test('right', async () => {
 
     .right-shadowned {
       right: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+        }
+        @tailwind utilities;
+      `,
       [
         'right-shadow-sm',
         'right',
@@ -1019,20 +791,20 @@ test('right', async () => {
         '-right-4/foo',
         'right-[4px]/foo',
       ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('bottom', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
       [
         'bottom-shadowned',
         'bottom-auto',
@@ -1043,17 +815,9 @@ test('bottom', async () => {
         '-bottom-4',
         'bottom-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -1088,11 +852,17 @@ test('bottom', async () => {
 
     .bottom-shadowned {
       bottom: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+        }
+        @tailwind utilities;
+      `,
       [
         'bottom-shadow-sm',
         'bottom',
@@ -1108,20 +878,20 @@ test('bottom', async () => {
         '-bottom-4/foo',
         'bottom-[4px]/foo',
       ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('left', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --inset-shadowned: 1940px;
+        }
+        @tailwind utilities;
+      `,
       [
         'left-shadowned',
         'left-auto',
@@ -1131,21 +901,10 @@ test('left', async () => {
         'left-4',
         '-left-4',
         'left-[4px]',
-
-        // https://github.com/tailwindlabs/tailwindcss/issues/20010
-        '-left-[(var(--my-var1)+var(--my-var2))]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --inset-shadowned: 1940px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --inset-shadowned: 1940px;
     }
@@ -1154,10 +913,6 @@ test('left', async () => {
       left: calc(var(--spacing-4) * -1);
     }
 
-    .-left-\\[\\(var\\(--my-var1\\)\\+var\\(--my-var2\\)\\)\\] {
-      left: calc((var(--my-var1) + var(--my-var2)) * -1);
-    }
-
     .-left-full {
       left: -100%;
     }
@@ -1184,11 +939,17 @@ test('left', async () => {
 
     .left-shadowned {
       left: var(--inset-shadowned);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --spacing-4: 1rem;
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+        }
+        @tailwind utilities;
+      `,
       [
         'left-shadow-sm',
         'left',
@@ -1204,28 +965,19 @@ test('left', async () => {
         '-left-4/foo',
         'left-[4px]/foo',
       ],
-      css`
-        @theme reference {
-          --spacing-4: 1rem;
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('isolation', async () => {
   expect(await run(['isolate', 'isolation-auto'])).toMatchInlineSnapshot(`
-    "
-    .isolate {
+    ".isolate {
       isolation: isolate;
     }
 
     .isolation-auto {
       isolation: auto;
-    }
-    "
+    }"
   `)
   expect(await run(['-isolate', '-isolation-auto', 'isolate/foo', 'isolation-auto/foo'])).toEqual(
     '',
@@ -1235,8 +987,7 @@ test('isolation', async () => {
 test('z-index', async () => {
   expect(await run(['z-auto', 'z-10', '-z-10', 'z-[123]', '-z-[var(--value)]']))
     .toMatchInlineSnapshot(`
-      "
-      .-z-10 {
+      ".-z-10 {
         z-index: calc(10 * -1);
       }
 
@@ -1254,8 +1005,7 @@ test('z-index', async () => {
 
       .z-auto {
         z-index: auto;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -1271,28 +1021,6 @@ test('z-index', async () => {
       '-z-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['z-auto'],
-      css`
-        @theme {
-          --z-index-auto: 42;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --z-index-auto: 42;
-    }
-
-    .z-auto {
-      z-index: var(--z-index-auto);
-    }
-    "
-  `)
 })
 
 test('order', async () => {
@@ -1307,8 +1035,7 @@ test('order', async () => {
       'order-none',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .-order-4 {
+    ".-order-4 {
       order: calc(4 * -1);
     }
 
@@ -1334,8 +1061,7 @@ test('order', async () => {
 
     .order-none {
       order: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -1355,50 +1081,6 @@ test('order', async () => {
       'order-none/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['order-first'],
-      css`
-        @theme {
-          --order-first: 1;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --order-first: 1;
-    }
-
-    .order-first {
-      order: var(--order-first);
-    }
-    "
-  `)
-
-  expect(
-    await run(
-      ['order-last'],
-      css`
-        @theme {
-          --order-last: -1;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --order-last: -1;
-    }
-
-    .order-last {
-      order: var(--order-last);
-    }
-    "
-  `)
 })
 
 test('col', async () => {
@@ -1414,8 +1096,7 @@ test('col', async () => {
       'col-span-[var(--my-variable)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .-col-12 {
+    ".-col-12 {
       grid-column: calc(12 * -1);
     }
 
@@ -1445,8 +1126,7 @@ test('col', async () => {
 
     .col-span-full {
       grid-column: 1 / -1;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -1463,55 +1143,13 @@ test('col', async () => {
       'col-span-[var(--my-variable)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['col-auto'],
-      css`
-        @theme {
-          --grid-column-auto: 5;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-column-auto: 5;
-    }
-
-    .col-auto {
-      grid-column: var(--grid-column-auto);
-    }
-    "
-  `)
 })
 
 test('col-start', async () => {
   expect(
-    await run(
-      [
-        'col-start-auto',
-        'col-start-4',
-        'col-start-99',
-        'col-start-[123]',
-        '-col-start-4',
-        'col-start-custom',
-      ],
-      css`
-        @theme {
-          --grid-column-start-custom: 1 column-start;
-        }
-        @tailwind utilities;
-      `,
-    ),
+    await run(['col-start-auto', 'col-start-4', 'col-start-99', 'col-start-[123]', '-col-start-4']),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-column-start-custom: 1 column-start;
-    }
-
-    .-col-start-4 {
+    ".-col-start-4 {
       grid-column-start: calc(4 * -1);
     }
 
@@ -1529,12 +1167,7 @@ test('col-start', async () => {
 
     .col-start-auto {
       grid-column-start: auto;
-    }
-
-    .col-start-custom {
-      grid-column-start: var(--grid-column-start-custom);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -1548,72 +1181,31 @@ test('col-start', async () => {
       '-col-start-4/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['col-start-auto'],
-      css`
-        @theme {
-          --grid-column-start-auto: 7;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-column-start-auto: 7;
-    }
-
-    .col-start-auto {
-      grid-column-start: var(--grid-column-start-auto);
-    }
-    "
-  `)
 })
 
 test('col-end', async () => {
-  expect(
-    await run(
-      ['col-end-auto', 'col-end-4', 'col-end-99', 'col-end-[123]', '-col-end-4', 'col-end-custom'],
-      css`
-        @theme {
-          --grid-column-end-custom: 1 column-end;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-column-end-custom: 1 column-end;
-    }
+  expect(await run(['col-end-auto', 'col-end-4', 'col-end-99', 'col-end-[123]', '-col-end-4']))
+    .toMatchInlineSnapshot(`
+      ".-col-end-4 {
+        grid-column-end: calc(4 * -1);
+      }
 
-    .-col-end-4 {
-      grid-column-end: calc(4 * -1);
-    }
+      .col-end-4 {
+        grid-column-end: 4;
+      }
 
-    .col-end-4 {
-      grid-column-end: 4;
-    }
+      .col-end-99 {
+        grid-column-end: 99;
+      }
 
-    .col-end-99 {
-      grid-column-end: 99;
-    }
+      .col-end-\\[123\\] {
+        grid-column-end: 123;
+      }
 
-    .col-end-\\[123\\] {
-      grid-column-end: 123;
-    }
-
-    .col-end-auto {
-      grid-column-end: auto;
-    }
-
-    .col-end-custom {
-      grid-column-end: var(--grid-column-end-custom);
-    }
-    "
-  `)
+      .col-end-auto {
+        grid-column-end: auto;
+      }"
+    `)
   expect(
     await run([
       'col-end',
@@ -1626,28 +1218,6 @@ test('col-end', async () => {
       '-col-end-4/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['col-end-auto'],
-      css`
-        @theme {
-          --grid-column-end-auto: 3;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-column-end-auto: 3;
-    }
-
-    .col-end-auto {
-      grid-column-end: var(--grid-column-end-auto);
-    }
-    "
-  `)
 })
 
 test('row', async () => {
@@ -1663,8 +1233,7 @@ test('row', async () => {
       'row-span-[var(--my-variable)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .-row-12 {
+    ".-row-12 {
       grid-row: calc(12 * -1);
     }
 
@@ -1694,8 +1263,7 @@ test('row', async () => {
 
     .row-span-full {
       grid-row: 1 / -1;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -1710,88 +1278,34 @@ test('row', async () => {
       'row-span-full/foo',
       'row-[span_123/span_123]/foo',
       'row-span-[var(--my-variable)]/foo',
-
-      // Candidates matching Object.prototype properties should not crash or
-      // produce output (see: https://github.com/tailwindlabs/tailwindcss/issues/19721)
-      'row-constructor',
-      'row-hasOwnProperty',
-      'row-toString',
-      'row-valueOf',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['row-auto'],
-      css`
-        @theme {
-          --grid-row-auto: 9;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-row-auto: 9;
-    }
-
-    .row-auto {
-      grid-row: var(--grid-row-auto);
-    }
-    "
-  `)
 })
 
 test('row-start', async () => {
   expect(
-    await run(
-      [
-        'row-start-auto',
-        'row-start-4',
-        'row-start-99',
-        'row-start-[123]',
-        '-row-start-4',
-        'row-start-custom',
-      ],
-      css`
-        @theme {
-          --grid-row-start-custom: 1 row-start;
-        }
-        @tailwind utilities;
-      `,
-    ),
+    await run(['row-start-auto', 'row-start-4', 'row-start-99', 'row-start-[123]', '-row-start-4']),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-row-start-custom: 1 row-start;
-    }
+      ".-row-start-4 {
+        grid-row-start: calc(4 * -1);
+      }
 
-    .-row-start-4 {
-      grid-row-start: calc(4 * -1);
-    }
+      .row-start-4 {
+        grid-row-start: 4;
+      }
 
-    .row-start-4 {
-      grid-row-start: 4;
-    }
+      .row-start-99 {
+        grid-row-start: 99;
+      }
 
-    .row-start-99 {
-      grid-row-start: 99;
-    }
+      .row-start-\\[123\\] {
+        grid-row-start: 123;
+      }
 
-    .row-start-\\[123\\] {
-      grid-row-start: 123;
-    }
-
-    .row-start-auto {
-      grid-row-start: auto;
-    }
-
-    .row-start-custom {
-      grid-row-start: var(--grid-row-start-custom);
-    }
-    "
-  `)
+      .row-start-auto {
+        grid-row-start: auto;
+      }"
+    `)
   expect(
     await run([
       'row-start',
@@ -1804,72 +1318,31 @@ test('row-start', async () => {
       '-row-start-4/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['row-start-auto'],
-      css`
-        @theme {
-          --grid-row-start-auto: 11;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-row-start-auto: 11;
-    }
-
-    .row-start-auto {
-      grid-row-start: var(--grid-row-start-auto);
-    }
-    "
-  `)
 })
 
 test('row-end', async () => {
-  expect(
-    await run(
-      ['row-end-auto', 'row-end-4', 'row-end-99', 'row-end-[123]', '-row-end-4', 'row-end-custom'],
-      css`
-        @theme {
-          --grid-row-end-custom: 1 row-end;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-row-end-custom: 1 row-end;
-    }
+  expect(await run(['row-end-auto', 'row-end-4', 'row-end-99', 'row-end-[123]', '-row-end-4']))
+    .toMatchInlineSnapshot(`
+      ".-row-end-4 {
+        grid-row-end: calc(4 * -1);
+      }
 
-    .-row-end-4 {
-      grid-row-end: calc(4 * -1);
-    }
+      .row-end-4 {
+        grid-row-end: 4;
+      }
 
-    .row-end-4 {
-      grid-row-end: 4;
-    }
+      .row-end-99 {
+        grid-row-end: 99;
+      }
 
-    .row-end-99 {
-      grid-row-end: 99;
-    }
+      .row-end-\\[123\\] {
+        grid-row-end: 123;
+      }
 
-    .row-end-\\[123\\] {
-      grid-row-end: 123;
-    }
-
-    .row-end-auto {
-      grid-row-end: auto;
-    }
-
-    .row-end-custom {
-      grid-row-end: var(--grid-row-end-custom);
-    }
-    "
-  `)
+      .row-end-auto {
+        grid-row-end: auto;
+      }"
+    `)
   expect(
     await run([
       'row-end',
@@ -1882,35 +1355,12 @@ test('row-end', async () => {
       '-row-end-4/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['row-end-auto'],
-      css`
-        @theme {
-          --grid-row-end-auto: 13;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-row-end-auto: 13;
-    }
-
-    .row-end-auto {
-      grid-row-end: var(--grid-row-end-auto);
-    }
-    "
-  `)
 })
 
 test('float', async () => {
   expect(await run(['float-start', 'float-end', 'float-right', 'float-left', 'float-none']))
     .toMatchInlineSnapshot(`
-      "
-      .float-end {
+      ".float-end {
         float: inline-end;
       }
 
@@ -1928,8 +1378,7 @@ test('float', async () => {
 
       .float-start {
         float: inline-start;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -1959,8 +1408,7 @@ test('clear', async () => {
       'clear-none',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .clear-both {
+    ".clear-both {
       clear: both;
     }
 
@@ -1982,8 +1430,7 @@ test('clear', async () => {
 
     .clear-start {
       clear: inline-start;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2006,18 +1453,17 @@ test('clear', async () => {
 
 test('margin', async () => {
   expect(
-    await run(
-      ['m-auto', 'm-4', 'm-[4px]', '-m-4', '-m-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['m-auto', 'm-4', 'm-[4px]', '-m-4', '-m-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -2039,8 +1485,7 @@ test('margin', async () => {
 
     .m-auto {
       margin: auto;
-    }
-    "
+    }"
   `)
   expect(
     await run(['m', 'm-auto/foo', 'm-4/foo', 'm-[4px]/foo', '-m-4/foo', '-m-[var(--value)]/foo']),
@@ -2049,7 +1494,14 @@ test('margin', async () => {
 
 test('mx', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'mx-auto',
         'mx-1',
@@ -2063,17 +1515,9 @@ test('mx', async () => {
         'mx-[var(--my-var)]',
         '-mx-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2095,7 +1539,7 @@ test('mx', async () => {
     }
 
     .mx-1 {
-      margin-inline: var(--spacing);
+      margin-inline: calc(var(--spacing) * 1);
     }
 
     .mx-4 {
@@ -2120,8 +1564,7 @@ test('mx', async () => {
 
     .mx-big {
       margin-inline: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2137,7 +1580,14 @@ test('mx', async () => {
 
 test('my', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'my-1',
         'my-99',
@@ -2151,17 +1601,9 @@ test('my', async () => {
         'my-[var(--my-var)]',
         '-my-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2187,7 +1629,7 @@ test('my', async () => {
     }
 
     .my-1 {
-      margin-block: var(--spacing);
+      margin-block: calc(var(--spacing) * 1);
     }
 
     .my-2\\.5 {
@@ -2208,8 +1650,7 @@ test('my', async () => {
 
     .my-big {
       margin-block: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2225,7 +1666,14 @@ test('my', async () => {
 
 test('mt', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'mt-1',
         'mt-99',
@@ -2239,17 +1687,9 @@ test('mt', async () => {
         'mt-[var(--my-var)]',
         '-mt-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2275,7 +1715,7 @@ test('mt', async () => {
     }
 
     .mt-1 {
-      margin-top: var(--spacing);
+      margin-top: calc(var(--spacing) * 1);
     }
 
     .mt-2\\.5 {
@@ -2296,8 +1736,7 @@ test('mt', async () => {
 
     .mt-big {
       margin-top: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2313,7 +1752,14 @@ test('mt', async () => {
 
 test('ms', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'ms-1',
         'ms-99',
@@ -2327,17 +1773,9 @@ test('ms', async () => {
         'ms-[var(--my-var)]',
         '-ms-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2363,7 +1801,7 @@ test('ms', async () => {
     }
 
     .ms-1 {
-      margin-inline-start: var(--spacing);
+      margin-inline-start: calc(var(--spacing) * 1);
     }
 
     .ms-2\\.5 {
@@ -2384,8 +1822,7 @@ test('ms', async () => {
 
     .ms-big {
       margin-inline-start: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2401,7 +1838,14 @@ test('ms', async () => {
 
 test('me', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'me-1',
         'me-99',
@@ -2415,17 +1859,9 @@ test('me', async () => {
         'me-[var(--my-var)]',
         '-me-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2451,7 +1887,7 @@ test('me', async () => {
     }
 
     .me-1 {
-      margin-inline-end: var(--spacing);
+      margin-inline-end: calc(var(--spacing) * 1);
     }
 
     .me-2\\.5 {
@@ -2472,8 +1908,7 @@ test('me', async () => {
 
     .me-big {
       margin-inline-end: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2487,185 +1922,16 @@ test('me', async () => {
   ).toEqual('')
 })
 
-test('mbs', async () => {
-  expect(
-    await run(
-      [
-        'mbs-1',
-        'mbs-99',
-        'mbs-2.5',
-        'mbs-big',
-        'mbs-[4px]',
-        '-mbs-4',
-        '-mbs-2.5',
-        '-mbs-big',
-        '-mbs-[4px]',
-        'mbs-[var(--my-var)]',
-        '-mbs-[var(--my-var)]',
-      ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing: .25rem;
-      --spacing-big: 100rem;
-    }
-
-    .-mbs-2\\.5 {
-      margin-block-start: calc(var(--spacing) * -2.5);
-    }
-
-    .-mbs-4 {
-      margin-block-start: calc(var(--spacing) * -4);
-    }
-
-    .-mbs-\\[4px\\] {
-      margin-block-start: -4px;
-    }
-
-    .-mbs-\\[var\\(--my-var\\)\\] {
-      margin-block-start: calc(var(--my-var) * -1);
-    }
-
-    .-mbs-big {
-      margin-block-start: calc(var(--spacing-big) * -1);
-    }
-
-    .mbs-1 {
-      margin-block-start: var(--spacing);
-    }
-
-    .mbs-2\\.5 {
-      margin-block-start: calc(var(--spacing) * 2.5);
-    }
-
-    .mbs-99 {
-      margin-block-start: calc(var(--spacing) * 99);
-    }
-
-    .mbs-\\[4px\\] {
-      margin-block-start: 4px;
-    }
-
-    .mbs-\\[var\\(--my-var\\)\\] {
-      margin-block-start: var(--my-var);
-    }
-
-    .mbs-big {
-      margin-block-start: var(--spacing-big);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mbs',
-      'mbs-auto/foo',
-      'mbs-4/foo',
-      'mbs-[4px]/foo',
-      '-mbs-4/foo',
-      '-mbs-[var(--value)]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mbe', async () => {
-  expect(
-    await run(
-      [
-        'mbe-1',
-        'mbe-99',
-        'mbe-2.5',
-        'mbe-big',
-        'mbe-[4px]',
-        '-mbe-4',
-        '-mbe-2.5',
-        '-mbe-big',
-        '-mbe-[4px]',
-        'mbe-[var(--my-var)]',
-        '-mbe-[var(--my-var)]',
-      ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing: .25rem;
-      --spacing-big: 100rem;
-    }
-
-    .-mbe-2\\.5 {
-      margin-block-end: calc(var(--spacing) * -2.5);
-    }
-
-    .-mbe-4 {
-      margin-block-end: calc(var(--spacing) * -4);
-    }
-
-    .-mbe-\\[4px\\] {
-      margin-block-end: -4px;
-    }
-
-    .-mbe-\\[var\\(--my-var\\)\\] {
-      margin-block-end: calc(var(--my-var) * -1);
-    }
-
-    .-mbe-big {
-      margin-block-end: calc(var(--spacing-big) * -1);
-    }
-
-    .mbe-1 {
-      margin-block-end: var(--spacing);
-    }
-
-    .mbe-2\\.5 {
-      margin-block-end: calc(var(--spacing) * 2.5);
-    }
-
-    .mbe-99 {
-      margin-block-end: calc(var(--spacing) * 99);
-    }
-
-    .mbe-\\[4px\\] {
-      margin-block-end: 4px;
-    }
-
-    .mbe-\\[var\\(--my-var\\)\\] {
-      margin-block-end: var(--my-var);
-    }
-
-    .mbe-big {
-      margin-block-end: var(--spacing-big);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mbe',
-      'mbe-auto/foo',
-      'mbe-4/foo',
-      'mbe-[4px]/foo',
-      '-mbe-4/foo',
-      '-mbe-[var(--value)]/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('mr', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'mr-1',
         'mr-99',
@@ -2679,17 +1945,9 @@ test('mr', async () => {
         'mr-[var(--my-var)]',
         '-mr-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2715,7 +1973,7 @@ test('mr', async () => {
     }
 
     .mr-1 {
-      margin-right: var(--spacing);
+      margin-right: calc(var(--spacing) * 1);
     }
 
     .mr-2\\.5 {
@@ -2736,8 +1994,7 @@ test('mr', async () => {
 
     .mr-big {
       margin-right: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2753,7 +2010,14 @@ test('mr', async () => {
 
 test('mb', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'mb-1',
         'mb-99',
@@ -2767,17 +2031,9 @@ test('mb', async () => {
         'mb-[var(--my-var)]',
         '-mb-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2803,7 +2059,7 @@ test('mb', async () => {
     }
 
     .mb-1 {
-      margin-bottom: var(--spacing);
+      margin-bottom: calc(var(--spacing) * 1);
     }
 
     .mb-2\\.5 {
@@ -2824,8 +2080,7 @@ test('mb', async () => {
 
     .mb-big {
       margin-bottom: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2841,7 +2096,14 @@ test('mb', async () => {
 
 test('ml', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --spacing-big: 100rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'ml-1',
         'ml-99',
@@ -2855,17 +2117,9 @@ test('ml', async () => {
         'ml-[var(--my-var)]',
         '-ml-[var(--my-var)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
@@ -2891,7 +2145,7 @@ test('ml', async () => {
     }
 
     .ml-1 {
-      margin-left: var(--spacing);
+      margin-left: calc(var(--spacing) * 1);
     }
 
     .ml-2\\.5 {
@@ -2912,8 +2166,7 @@ test('ml', async () => {
 
     .ml-big {
       margin-left: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2929,18 +2182,17 @@ test('ml', async () => {
 
 test('margin sort order', async () => {
   expect(
-    await run(
-      ['mb-4', 'me-4', 'mx-4', 'ml-4', 'ms-4', 'm-4', 'mr-4', 'mt-4', 'my-4'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['mb-4', 'me-4', 'mx-4', 'ml-4', 'ms-4', 'm-4', 'mr-4', 'mt-4', 'my-4'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -2978,8 +2230,7 @@ test('margin sort order', async () => {
 
     .ml-4 {
       margin-left: var(--spacing-4);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2999,15 +2250,13 @@ test('margin sort order', async () => {
 
 test('box-sizing', async () => {
   expect(await run(['box-border', 'box-content'])).toMatchInlineSnapshot(`
-    "
-    .box-border {
+    ".box-border {
       box-sizing: border-box;
     }
 
     .box-content {
       box-sizing: content-box;
-    }
-    "
+    }"
   `)
   expect(
     await run(['box', '-box-border', '-box-content', 'box-border/foo', 'box-content/foo']),
@@ -3017,8 +2266,7 @@ test('box-sizing', async () => {
 test('line-clamp', async () => {
   expect(await run(['line-clamp-4', 'line-clamp-99', 'line-clamp-[123]', 'line-clamp-none']))
     .toMatchInlineSnapshot(`
-      "
-      .line-clamp-4 {
+      ".line-clamp-4 {
         -webkit-line-clamp: 4;
         -webkit-box-orient: vertical;
         display: -webkit-box;
@@ -3044,8 +2292,7 @@ test('line-clamp', async () => {
         -webkit-box-orient: horizontal;
         display: block;
         overflow: visible;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -3062,31 +2309,6 @@ test('line-clamp', async () => {
       'line-clamp-none/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['line-clamp-none'],
-      css`
-        @theme {
-          --line-clamp-none: 0;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --line-clamp-none: 0;
-    }
-
-    .line-clamp-none {
-      -webkit-line-clamp: var(--line-clamp-none);
-      -webkit-box-orient: vertical;
-      display: -webkit-box;
-      overflow: hidden;
-    }
-    "
-  `)
 })
 
 test('display', async () => {
@@ -3115,8 +2337,7 @@ test('display', async () => {
       'hidden',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .block {
+    ".block {
       display: block;
     }
 
@@ -3198,8 +2419,7 @@ test('display', async () => {
 
     .table-row-group {
       display: table-row-group;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3251,15 +2471,13 @@ test('display', async () => {
 
 test('field-sizing', async () => {
   expect(await run(['field-sizing-content', 'field-sizing-fixed'])).toMatchInlineSnapshot(`
-    "
-    .field-sizing-content {
+    ".field-sizing-content {
       field-sizing: content;
     }
 
     .field-sizing-fixed {
       field-sizing: fixed;
-    }
-    "
+    }"
   `)
   expect(
     await run(['field-sizing-[other]', '-field-sizing-content', '-field-sizing-fixed']),
@@ -3268,18 +2486,17 @@ test('field-sizing', async () => {
 
 test('aspect-ratio', async () => {
   expect(
-    await run(
-      ['aspect-video', 'aspect-[10/9]', 'aspect-4/3', 'aspect-8.5/11'],
+    await compileCss(
       css`
         @theme {
           --aspect-video: 16 / 9;
         }
         @tailwind utilities;
       `,
+      ['aspect-video', 'aspect-[10/9]', 'aspect-4/3'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --aspect-video: 16 / 9;
     }
 
@@ -3287,18 +2504,13 @@ test('aspect-ratio', async () => {
       aspect-ratio: 4 / 3;
     }
 
-    .aspect-8\\.5\\/11 {
-      aspect-ratio: 8.5 / 11;
-    }
-
     .aspect-\\[10\\/9\\] {
       aspect-ratio: 10 / 9;
     }
 
     .aspect-video {
       aspect-ratio: var(--aspect-video);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3313,14 +2525,19 @@ test('aspect-ratio', async () => {
       'aspect--4/3',
       'aspect--4/-3',
       'aspect-4/-3',
-      'aspect-1.23/4.56',
     ]),
   ).toEqual('')
 })
 
 test('size', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'size-auto',
         'size-full',
@@ -3331,16 +2548,9 @@ test('size', async () => {
         'size-1/2',
         'size-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -3382,8 +2592,7 @@ test('size', async () => {
     .size-min {
       width: min-content;
       height: min-content;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3409,7 +2618,14 @@ test('size', async () => {
 
 test('width', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --width-xl: 36rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'w-full',
         'w-auto',
@@ -3425,17 +2641,9 @@ test('width', async () => {
         'w-1/2',
         'w-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --width-xl: 36rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --width-xl: 36rem;
     }
@@ -3490,8 +2698,7 @@ test('width', async () => {
 
     .w-xl {
       width: var(--width-xl);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3522,7 +2729,14 @@ test('width', async () => {
 
 test('min-width', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+          --container-xl: 36rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'min-w-full',
         'min-w-auto',
@@ -3533,17 +2747,9 @@ test('min-width', async () => {
         'min-w-xl',
         'min-w-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --container-xl: 36rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --container-xl: 36rem;
     }
@@ -3578,8 +2784,7 @@ test('min-width', async () => {
 
     .min-w-xl {
       min-width: var(--container-xl);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3600,8 +2805,7 @@ test('min-width', async () => {
 
 test('max-width', async () => {
   expect(
-    await run(
-      ['max-w-none', 'max-w-full', 'max-w-max', 'max-w-fit', 'max-w-4', 'max-w-xl', 'max-w-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
@@ -3609,10 +2813,10 @@ test('max-width', async () => {
         }
         @tailwind utilities;
       `,
+      ['max-w-none', 'max-w-full', 'max-w-max', 'max-w-fit', 'max-w-4', 'max-w-xl', 'max-w-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
       --container-xl: 36rem;
     }
@@ -3643,8 +2847,7 @@ test('max-width', async () => {
 
     .max-w-xl {
       max-width: var(--container-xl);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3666,7 +2869,13 @@ test('max-width', async () => {
 
 test('height', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'h-full',
         'h-auto',
@@ -3675,23 +2884,15 @@ test('height', async () => {
         'h-lvh',
         'h-dvh',
         'h-min',
-        'h-lh',
         'h-max',
         'h-fit',
         'h-4',
         'h-1/2',
         'h-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -3723,10 +2924,6 @@ test('height', async () => {
       height: 100%;
     }
 
-    .h-lh {
-      height: 1lh;
-    }
-
     .h-lvh {
       height: 100lvh;
     }
@@ -3745,8 +2942,7 @@ test('height', async () => {
 
     .h-svh {
       height: 100svh;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3764,7 +2960,6 @@ test('height', async () => {
       'h-svh/foo',
       'h-lvh/foo',
       'h-dvh/foo',
-      'h-lh/foo',
       'h-min/foo',
       'h-max/foo',
       'h-fit/foo',
@@ -3777,7 +2972,13 @@ test('height', async () => {
 
 test('min-height', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'min-h-full',
         'min-h-auto',
@@ -3786,22 +2987,14 @@ test('min-height', async () => {
         'min-h-lvh',
         'min-h-dvh',
         'min-h-min',
-        'min-h-lh',
         'min-h-max',
         'min-h-fit',
         'min-h-4',
         'min-h-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -3829,10 +3022,6 @@ test('min-height', async () => {
       min-height: 100%;
     }
 
-    .min-h-lh {
-      min-height: 1lh;
-    }
-
     .min-h-lvh {
       min-height: 100lvh;
     }
@@ -3851,8 +3040,7 @@ test('min-height', async () => {
 
     .min-h-svh {
       min-height: 100svh;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3865,7 +3053,6 @@ test('min-height', async () => {
       'min-h-svh/foo',
       'min-h-lvh/foo',
       'min-h-dvh/foo',
-      'min-h-lh/foo',
       'min-h-min/foo',
       'min-h-max/foo',
       'min-h-fit/foo',
@@ -3877,7 +3064,13 @@ test('min-height', async () => {
 
 test('max-height', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing-4: 1rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'max-h-none',
         'max-h-full',
@@ -3885,23 +3078,15 @@ test('max-height', async () => {
         'max-h-svh',
         'max-h-lvh',
         'max-h-dvh',
-        'max-h-lh',
         'max-h-min',
         'max-h-max',
         'max-h-fit',
         'max-h-4',
         'max-h-[4px]',
       ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -3925,10 +3110,6 @@ test('max-height', async () => {
       max-height: 100%;
     }
 
-    .max-h-lh {
-      max-height: 1lh;
-    }
-
     .max-h-lvh {
       max-height: 100lvh;
     }
@@ -3951,8 +3132,7 @@ test('max-height', async () => {
 
     .max-h-svh {
       max-height: 100svh;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -3966,7 +3146,6 @@ test('max-height', async () => {
       'max-h-svh/foo',
       'max-h-lvh/foo',
       'max-h-dvh/foo',
-      'max-h-lh/foo',
       'max-h-min/foo',
       'max-h-max/foo',
       'max-h-fit/foo',
@@ -3976,586 +3155,10 @@ test('max-height', async () => {
   ).toEqual('')
 })
 
-test('inline-size', async () => {
-  expect(
-    await run(
-      [
-        'inline-full',
-        'inline-auto',
-        'inline-screen',
-        'inline-svw',
-        'inline-lvw',
-        'inline-dvw',
-        'inline-min',
-        'inline-max',
-        'inline-fit',
-        'inline-4',
-        'inline-xl',
-        'inline-1/2',
-        'inline-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --container-xl: 36rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-      --container-xl: 36rem;
-    }
-
-    .inline-1\\/2 {
-      inline-size: 50%;
-    }
-
-    .inline-4 {
-      inline-size: var(--spacing-4);
-    }
-
-    .inline-\\[4px\\] {
-      inline-size: 4px;
-    }
-
-    .inline-auto {
-      inline-size: auto;
-    }
-
-    .inline-dvw {
-      inline-size: 100dvw;
-    }
-
-    .inline-fit {
-      inline-size: fit-content;
-    }
-
-    .inline-full {
-      inline-size: 100%;
-    }
-
-    .inline-lvw {
-      inline-size: 100lvw;
-    }
-
-    .inline-max {
-      inline-size: max-content;
-    }
-
-    .inline-min {
-      inline-size: min-content;
-    }
-
-    .inline-screen {
-      inline-size: 100vw;
-    }
-
-    .inline-svw {
-      inline-size: 100svw;
-    }
-
-    .inline-xl {
-      inline-size: var(--container-xl);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'inline--1',
-      'inline--1/2',
-      'inline--1/-2',
-      'inline-1/-2',
-      '-inline-4',
-      '-inline-1/2',
-      '-inline-[4px]',
-      'inline-full/foo',
-      'inline-auto/foo',
-      'inline-screen/foo',
-      'inline-svw/foo',
-      'inline-lvw/foo',
-      'inline-dvw/foo',
-      'inline-min/foo',
-      'inline-max/foo',
-      'inline-fit/foo',
-      'inline-4/foo',
-      'inline-xl/foo',
-      'inline-1/2/foo',
-      'inline-[4px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('min-inline-size', async () => {
-  expect(
-    await run(
-      [
-        'min-inline-full',
-        'min-inline-auto',
-        'min-inline-min',
-        'min-inline-max',
-        'min-inline-fit',
-        'min-inline-4',
-        'min-inline-xl',
-        'min-inline-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --container-xl: 36rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-      --container-xl: 36rem;
-    }
-
-    .min-inline-4 {
-      min-inline-size: var(--spacing-4);
-    }
-
-    .min-inline-\\[4px\\] {
-      min-inline-size: 4px;
-    }
-
-    .min-inline-auto {
-      min-inline-size: auto;
-    }
-
-    .min-inline-fit {
-      min-inline-size: fit-content;
-    }
-
-    .min-inline-full {
-      min-inline-size: 100%;
-    }
-
-    .min-inline-max {
-      min-inline-size: max-content;
-    }
-
-    .min-inline-min {
-      min-inline-size: min-content;
-    }
-
-    .min-inline-xl {
-      min-inline-size: var(--container-xl);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'min-inline',
-      '-min-inline-4',
-      '-min-inline-[4px]',
-      'min-inline-auto/foo',
-      'min-inline-full/foo',
-      'min-inline-min/foo',
-      'min-inline-max/foo',
-      'min-inline-fit/foo',
-      'min-inline-4/foo',
-      'min-inline-xl/foo',
-      'min-inline-[4px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('max-inline-size', async () => {
-  expect(
-    await run(
-      [
-        'max-inline-none',
-        'max-inline-full',
-        'max-inline-max',
-        'max-inline-fit',
-        'max-inline-4',
-        'max-inline-xl',
-        'max-inline-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-          --container-xl: 36rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-      --container-xl: 36rem;
-    }
-
-    .max-inline-4 {
-      max-inline-size: var(--spacing-4);
-    }
-
-    .max-inline-\\[4px\\] {
-      max-inline-size: 4px;
-    }
-
-    .max-inline-fit {
-      max-inline-size: fit-content;
-    }
-
-    .max-inline-full {
-      max-inline-size: 100%;
-    }
-
-    .max-inline-max {
-      max-inline-size: max-content;
-    }
-
-    .max-inline-none {
-      max-inline-size: none;
-    }
-
-    .max-inline-xl {
-      max-inline-size: var(--container-xl);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'max-inline',
-      'max-inline-auto',
-      '-max-inline-4',
-      '-max-inline-[4px]',
-      'max-inline-none/foo',
-      'max-inline-full/foo',
-      'max-inline-max/foo',
-      'max-inline-max/foo',
-      'max-inline-fit/foo',
-      'max-inline-4/foo',
-      'max-inline-xl/foo',
-      'max-inline-[4px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('block-size', async () => {
-  expect(
-    await run(
-      [
-        'block-full',
-        'block-auto',
-        'block-screen',
-        'block-svh',
-        'block-lvh',
-        'block-dvh',
-        'block-min',
-        'block-lh',
-        'block-max',
-        'block-fit',
-        'block-4',
-        'block-1/2',
-        'block-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .block-1\\/2 {
-      block-size: 50%;
-    }
-
-    .block-4 {
-      block-size: var(--spacing-4);
-    }
-
-    .block-\\[4px\\] {
-      block-size: 4px;
-    }
-
-    .block-auto {
-      block-size: auto;
-    }
-
-    .block-dvh {
-      block-size: 100dvh;
-    }
-
-    .block-fit {
-      block-size: fit-content;
-    }
-
-    .block-full {
-      block-size: 100%;
-    }
-
-    .block-lh {
-      block-size: 1lh;
-    }
-
-    .block-lvh {
-      block-size: 100lvh;
-    }
-
-    .block-max {
-      block-size: max-content;
-    }
-
-    .block-min {
-      block-size: min-content;
-    }
-
-    .block-screen {
-      block-size: 100vh;
-    }
-
-    .block-svh {
-      block-size: 100svh;
-    }
-    "
-  `)
-  expect(
-    await run([
-      '-block-4',
-      'block--1',
-      'block--1/2',
-      'block--1/-2',
-      'block-1/-2',
-      '-block-1/2',
-      '-block-[4px]',
-      'block-full/foo',
-      'block-auto/foo',
-      'block-screen/foo',
-      'block-svh/foo',
-      'block-lvh/foo',
-      'block-dvh/foo',
-      'block-lh/foo',
-      'block-min/foo',
-      'block-max/foo',
-      'block-fit/foo',
-      'block-4/foo',
-      'block-1/2/foo',
-      'block-[4px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('min-block-size', async () => {
-  expect(
-    await run(
-      [
-        'min-block-full',
-        'min-block-auto',
-        'min-block-screen',
-        'min-block-svh',
-        'min-block-lvh',
-        'min-block-dvh',
-        'min-block-min',
-        'min-block-lh',
-        'min-block-max',
-        'min-block-fit',
-        'min-block-4',
-        'min-block-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .min-block-4 {
-      min-block-size: var(--spacing-4);
-    }
-
-    .min-block-\\[4px\\] {
-      min-block-size: 4px;
-    }
-
-    .min-block-auto {
-      min-block-size: auto;
-    }
-
-    .min-block-dvh {
-      min-block-size: 100dvh;
-    }
-
-    .min-block-fit {
-      min-block-size: fit-content;
-    }
-
-    .min-block-full {
-      min-block-size: 100%;
-    }
-
-    .min-block-lh {
-      min-block-size: 1lh;
-    }
-
-    .min-block-lvh {
-      min-block-size: 100lvh;
-    }
-
-    .min-block-max {
-      min-block-size: max-content;
-    }
-
-    .min-block-min {
-      min-block-size: min-content;
-    }
-
-    .min-block-screen {
-      min-block-size: 100vh;
-    }
-
-    .min-block-svh {
-      min-block-size: 100svh;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'min-block',
-      '-min-block-4',
-      '-min-block-[4px]',
-      'min-block-auto/foo',
-      'min-block-full/foo',
-      'min-block-screen/foo',
-      'min-block-svh/foo',
-      'min-block-lvh/foo',
-      'min-block-dvh/foo',
-      'min-block-lh/foo',
-      'min-block-min/foo',
-      'min-block-max/foo',
-      'min-block-fit/foo',
-      'min-block-4/foo',
-      'min-block-[4px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('max-block-size', async () => {
-  expect(
-    await run(
-      [
-        'max-block-none',
-        'max-block-full',
-        'max-block-screen',
-        'max-block-svh',
-        'max-block-lvh',
-        'max-block-dvh',
-        'max-block-lh',
-        'max-block-min',
-        'max-block-max',
-        'max-block-fit',
-        'max-block-4',
-        'max-block-[4px]',
-      ],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .max-block-4 {
-      max-block-size: var(--spacing-4);
-    }
-
-    .max-block-\\[4px\\] {
-      max-block-size: 4px;
-    }
-
-    .max-block-dvh {
-      max-block-size: 100dvh;
-    }
-
-    .max-block-fit {
-      max-block-size: fit-content;
-    }
-
-    .max-block-full {
-      max-block-size: 100%;
-    }
-
-    .max-block-lh {
-      max-block-size: 1lh;
-    }
-
-    .max-block-lvh {
-      max-block-size: 100lvh;
-    }
-
-    .max-block-max {
-      max-block-size: max-content;
-    }
-
-    .max-block-min {
-      max-block-size: min-content;
-    }
-
-    .max-block-none {
-      max-block-size: none;
-    }
-
-    .max-block-screen {
-      max-block-size: 100vh;
-    }
-
-    .max-block-svh {
-      max-block-size: 100svh;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'max-block',
-      'max-block-auto',
-      '-max-block-4',
-      '-max-block-[4px]',
-      'max-block-none/foo',
-      'max-block-full/foo',
-      'max-block-screen/foo',
-      'max-block-svh/foo',
-      'max-block-lvh/foo',
-      'max-block-dvh/foo',
-      'max-block-lh/foo',
-      'max-block-min/foo',
-      'max-block-max/foo',
-      'max-block-fit/foo',
-      'max-block-4/foo',
-      'max-block-[4px]/foo',
-    ]),
-  ).toEqual('')
-})
-
 describe('container', () => {
   test('creates the right media queries and sorts it before width', async () => {
     expect(
-      await run(
-        ['w-1/2', 'container', 'max-w-[var(--breakpoint-sm)]'],
+      await compileCss(
         css`
           @theme {
             --breakpoint-sm: 40rem;
@@ -4566,10 +3169,10 @@ describe('container', () => {
           }
           @tailwind utilities;
         `,
+        ['w-1/2', 'container', 'max-w-[var(--breakpoint-sm)]'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --breakpoint-sm: 40rem;
       }
 
@@ -4577,31 +3180,31 @@ describe('container', () => {
         width: 100%;
       }
 
-      @media (min-width: 40rem) {
+      @media (width >= 40rem) {
         .container {
           max-width: 40rem;
         }
       }
 
-      @media (min-width: 48rem) {
+      @media (width >= 48rem) {
         .container {
           max-width: 48rem;
         }
       }
 
-      @media (min-width: 64rem) {
+      @media (width >= 64rem) {
         .container {
           max-width: 64rem;
         }
       }
 
-      @media (min-width: 80rem) {
+      @media (width >= 80rem) {
         .container {
           max-width: 80rem;
         }
       }
 
-      @media (min-width: 96rem) {
+      @media (width >= 96rem) {
         .container {
           max-width: 96rem;
         }
@@ -4613,15 +3216,13 @@ describe('container', () => {
 
       .max-w-\\[var\\(--breakpoint-sm\\)\\] {
         max-width: var(--breakpoint-sm);
-      }
-      "
+      }"
     `)
   })
 
   test('sorts breakpoints based on unit and then in ascending aOrder', async () => {
     expect(
-      await run(
-        ['container'],
+      await compileCss(
         css`
           @theme reference {
             --breakpoint-lg: 64rem;
@@ -4634,62 +3235,60 @@ describe('container', () => {
           }
           @tailwind utilities;
         `,
+        ['container'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .container {
+      ".container {
         width: 100%;
       }
 
-      @media (min-width: 40em) {
+      @media (width >= 40em) {
         .container {
           max-width: 40em;
         }
       }
 
-      @media (min-width: 48em) {
+      @media (width >= 48em) {
         .container {
           max-width: 48em;
         }
       }
 
-      @media (min-width: 30px) {
+      @media (width >= 30px) {
         .container {
           max-width: 30px;
         }
       }
 
-      @media (min-width: 1600px) {
+      @media (width >= 1600px) {
         .container {
           max-width: 1600px;
         }
       }
 
-      @media (min-width: 64rem) {
+      @media (width >= 64rem) {
         .container {
           max-width: 64rem;
         }
       }
 
-      @media (min-width: 80rem) {
+      @media (width >= 80rem) {
         .container {
           max-width: 80rem;
         }
       }
 
-      @media (min-width: 96rem) {
+      @media (width >= 96rem) {
         .container {
           max-width: 96rem;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom `@utility container` always follow the core utility ', async () => {
     expect(
-      await run(
-        ['w-1/2', 'container', 'max-w-[var(--breakpoint-sm)]'],
+      await compileCss(
         css`
           @theme {
             --breakpoint-sm: 40rem;
@@ -4709,10 +3308,10 @@ describe('container', () => {
             }
           }
         `,
+        ['w-1/2', 'container', 'max-w-[var(--breakpoint-sm)]'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+      ":root, :host {
         --breakpoint-sm: 40rem;
       }
 
@@ -4720,31 +3319,31 @@ describe('container', () => {
         width: 100%;
       }
 
-      @media (min-width: 40rem) {
+      @media (width >= 40rem) {
         .container {
           max-width: 40rem;
         }
       }
 
-      @media (min-width: 48rem) {
+      @media (width >= 48rem) {
         .container {
           max-width: 48rem;
         }
       }
 
-      @media (min-width: 64rem) {
+      @media (width >= 64rem) {
         .container {
           max-width: 64rem;
         }
       }
 
-      @media (min-width: 80rem) {
+      @media (width >= 80rem) {
         .container {
           max-width: 80rem;
         }
       }
 
-      @media (min-width: 96rem) {
+      @media (width >= 96rem) {
         .container {
           max-width: 96rem;
         }
@@ -4755,7 +3354,7 @@ describe('container', () => {
         padding-inline: 1rem;
       }
 
-      @media (min-width: 40rem) {
+      @media (width >= 40rem) {
         .container {
           padding-inline: 2rem;
         }
@@ -4767,8 +3366,7 @@ describe('container', () => {
 
       .max-w-\\[var\\(--breakpoint-sm\\)\\] {
         max-width: var(--breakpoint-sm);
-      }
-      "
+      }"
     `)
   })
 })
@@ -4785,8 +3383,7 @@ test('flex', async () => {
       'flex-[123]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .flex-1 {
+    ".flex-1 {
       flex: 1;
     }
 
@@ -4812,8 +3409,7 @@ test('flex', async () => {
 
     .flex-none {
       flex: none;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -4840,8 +3436,7 @@ test('flex', async () => {
 
 test('flex-shrink', async () => {
   expect(await run(['shrink', 'shrink-0', 'shrink-[123]'])).toMatchInlineSnapshot(`
-    "
-    .shrink {
+    ".shrink {
       flex-shrink: 1;
     }
 
@@ -4851,8 +3446,7 @@ test('flex-shrink', async () => {
 
     .shrink-\\[123\\] {
       flex-shrink: 123;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -4871,8 +3465,7 @@ test('flex-shrink', async () => {
 
 test('flex-grow', async () => {
   expect(await run(['grow', 'grow-0', 'grow-[123]'])).toMatchInlineSnapshot(`
-    "
-    .grow {
+    ".grow {
       flex-grow: 1;
     }
 
@@ -4882,8 +3475,7 @@ test('flex-grow', async () => {
 
     .grow-\\[123\\] {
       flex-grow: 123;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -4902,18 +3494,17 @@ test('flex-grow', async () => {
 
 test('flex-basis', async () => {
   expect(
-    await run(
-      ['basis-auto', 'basis-full', 'basis-xl', 'basis-11/12', 'basis-[123px]'],
+    await compileCss(
       css`
         @theme {
           --container-xl: 36rem;
         }
         @tailwind utilities;
       `,
+      ['basis-auto', 'basis-full', 'basis-xl', 'basis-11/12', 'basis-[123px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --container-xl: 36rem;
     }
 
@@ -4935,8 +3526,7 @@ test('flex-basis', async () => {
 
     .basis-xl {
       flex-basis: var(--container-xl);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -4958,15 +3548,13 @@ test('flex-basis', async () => {
 
 test('table-layout', async () => {
   expect(await run(['table-auto', 'table-fixed'])).toMatchInlineSnapshot(`
-    "
-    .table-auto {
+    ".table-auto {
       table-layout: auto;
     }
 
     .table-fixed {
       table-layout: fixed;
-    }
-    "
+    }"
   `)
   expect(await run(['-table-auto', '-table-fixed', 'table-auto/foo', 'table-fixed/foo'])).toEqual(
     '',
@@ -4975,15 +3563,13 @@ test('table-layout', async () => {
 
 test('caption-side', async () => {
   expect(await run(['caption-top', 'caption-bottom'])).toMatchInlineSnapshot(`
-    "
-    .caption-bottom {
+    ".caption-bottom {
       caption-side: bottom;
     }
 
     .caption-top {
       caption-side: top;
-    }
-    "
+    }"
   `)
   expect(
     await run(['-caption-top', '-caption-bottom', 'caption-top/foo', 'caption-bottom/foo']),
@@ -4992,15 +3578,13 @@ test('caption-side', async () => {
 
 test('border-collapse', async () => {
   expect(await run(['border-collapse', 'border-separate'])).toMatchInlineSnapshot(`
-    "
-    .border-collapse {
+    ".border-collapse {
       border-collapse: collapse;
     }
 
     .border-separate {
       border-collapse: separate;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5014,27 +3598,17 @@ test('border-collapse', async () => {
 
 test('border-spacing', async () => {
   expect(
-    await run(
-      ['border-spacing-1', 'border-spacing-[123px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-1: 0.25rem;
         }
         @tailwind utilities;
       `,
+      ['border-spacing-1', 'border-spacing-[123px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-border-spacing-x: 0;
-          --tw-border-spacing-y: 0;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --spacing-1: .25rem;
     }
 
@@ -5060,8 +3634,7 @@ test('border-spacing', async () => {
       syntax: "<length>";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5076,27 +3649,17 @@ test('border-spacing', async () => {
 
 test('border-spacing-x', async () => {
   expect(
-    await run(
-      ['border-spacing-x-1', 'border-spacing-x-[123px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-1: 0.25rem;
         }
         @tailwind utilities;
       `,
+      ['border-spacing-x-1', 'border-spacing-x-[123px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-border-spacing-x: 0;
-          --tw-border-spacing-y: 0;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --spacing-1: .25rem;
     }
 
@@ -5120,8 +3683,7 @@ test('border-spacing-x', async () => {
       syntax: "<length>";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5136,27 +3698,17 @@ test('border-spacing-x', async () => {
 
 test('border-spacing-y', async () => {
   expect(
-    await run(
-      ['border-spacing-y-1', 'border-spacing-y-[123px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-1: 0.25rem;
         }
         @tailwind utilities;
       `,
+      ['border-spacing-y-1', 'border-spacing-y-[123px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-border-spacing-x: 0;
-          --tw-border-spacing-y: 0;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --spacing-1: .25rem;
     }
 
@@ -5180,8 +3732,7 @@ test('border-spacing-y', async () => {
       syntax: "<length>";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5210,8 +3761,7 @@ test('origin', async () => {
       'origin-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .origin-\\[50px_100px\\] {
+    ".origin-\\[50px_100px\\] {
       transform-origin: 50px 100px;
     }
 
@@ -5253,8 +3803,7 @@ test('origin', async () => {
 
     .origin-top-right {
       transform-origin: 100% 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5273,28 +3822,6 @@ test('origin', async () => {
       'origin-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['origin-top'],
-      css`
-        @theme {
-          --transform-origin-top: 10px 20px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --transform-origin-top: 10px 20px;
-    }
-
-    .origin-top {
-      transform-origin: var(--transform-origin-top);
-    }
-    "
-  `)
 })
 
 test('perspective-origin', async () => {
@@ -5313,8 +3840,7 @@ test('perspective-origin', async () => {
       'perspective-origin-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .perspective-origin-\\[50px_100px\\] {
+    ".perspective-origin-\\[50px_100px\\] {
       perspective-origin: 50px 100px;
     }
 
@@ -5356,8 +3882,7 @@ test('perspective-origin', async () => {
 
     .perspective-origin-top-right {
       perspective-origin: 100% 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5376,29 +3901,6 @@ test('perspective-origin', async () => {
       'perspective-origin-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['perspective-origin-top'],
-      css`
-        @theme {
-          --perspective-origin-top: 10px 20px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --perspective-origin-top: 10px 20px;
-    }
-
-    .perspective-origin-top {
-      perspective-origin: var(--perspective-origin-top);
-      perspective: var(--perspective-origin-top);
-    }
-    "
-  `)
 })
 
 test('translate', async () => {
@@ -5411,18 +3913,7 @@ test('translate', async () => {
       '-translate-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-translate-x: 0;
-          --tw-translate-y: 0;
-          --tw-translate-z: 0;
-        }
-      }
-    }
-
-    .-translate-\\[var\\(--value\\)\\] {
+    ".-translate-\\[var\\(--value\\)\\] {
       --tw-translate-x: calc(var(--value) * -1);
       --tw-translate-y: calc(var(--value) * -1);
       translate: var(--tw-translate-x) var(--tw-translate-y);
@@ -5468,8 +3959,7 @@ test('translate', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5496,18 +3986,7 @@ test('translate-x', async () => {
       '-translate-x-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-translate-x: 0;
-          --tw-translate-y: 0;
-          --tw-translate-z: 0;
-        }
-      }
-    }
-
-    .-translate-x-\\[var\\(--value\\)\\] {
+    ".-translate-x-\\[var\\(--value\\)\\] {
       --tw-translate-x: calc(var(--value) * -1);
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
@@ -5543,8 +4022,7 @@ test('translate-x', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5561,28 +4039,17 @@ test('translate-x', async () => {
   ).toEqual('')
 
   expect(
-    await run(
-      ['translate-x-full', '-translate-x-full', 'translate-x-px', '-translate-x-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
         }
         @tailwind utilities;
       `,
+      ['translate-x-full', '-translate-x-full', 'translate-x-px', '-translate-x-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-translate-x: 0;
-          --tw-translate-y: 0;
-          --tw-translate-z: 0;
-        }
-      }
-    }
-
-    .-translate-x-\\[var\\(--value\\)\\] {
+    ".-translate-x-\\[var\\(--value\\)\\] {
       --tw-translate-x: calc(var(--value) * -1);
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
@@ -5618,8 +4085,7 @@ test('translate-x', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5644,18 +4110,7 @@ test('translate-y', async () => {
       '-translate-y-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-translate-x: 0;
-          --tw-translate-y: 0;
-          --tw-translate-z: 0;
-        }
-      }
-    }
-
-    .-translate-y-\\[var\\(--value\\)\\] {
+    ".-translate-y-\\[var\\(--value\\)\\] {
       --tw-translate-y: calc(var(--value) * -1);
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
@@ -5691,8 +4146,7 @@ test('translate-y', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5709,28 +4163,17 @@ test('translate-y', async () => {
   ).toEqual('')
 
   expect(
-    await run(
-      ['translate-y-full', '-translate-y-full', 'translate-y-px', '-translate-y-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
         }
         @tailwind utilities;
       `,
+      ['translate-y-full', '-translate-y-full', 'translate-y-px', '-translate-y-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-translate-x: 0;
-          --tw-translate-y: 0;
-          --tw-translate-z: 0;
-        }
-      }
-    }
-
-    .-translate-y-\\[var\\(--value\\)\\] {
+    ".-translate-y-\\[var\\(--value\\)\\] {
       --tw-translate-y: calc(var(--value) * -1);
       translate: var(--tw-translate-x) var(--tw-translate-y);
     }
@@ -5766,8 +4209,7 @@ test('translate-y', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5786,81 +4228,18 @@ test('translate-y', async () => {
 test('translate-z', async () => {
   expect(await run(['-translate-z-px', 'translate-z-px', '-translate-z-[var(--value)]']))
     .toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-translate-x: 0;
-            --tw-translate-y: 0;
-            --tw-translate-z: 0;
-          }
-        }
-      }
-
-      .-translate-z-\\[var\\(--value\\)\\] {
-        --tw-translate-z: calc(var(--value) * -1);
-        translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
-      }
-
-      .-translate-z-px {
-        --tw-translate-z: -1px;
-        translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
-      }
-
-      .translate-z-px {
-        --tw-translate-z: 1px;
-        translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
-      }
-
-      @property --tw-translate-x {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0;
-      }
-
-      @property --tw-translate-y {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0;
-      }
-
-      @property --tw-translate-z {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0;
-      }
-      "
-    `)
-  expect(
-    await run([
-      'translate-z',
-      'translate-z--1',
-      'translate-z--1/2',
-      'translate-z--1/-2',
-      'translate-z-1/-2',
-      'translate-z-full',
-      '-translate-z-full',
-      'translate-z-1/2',
-      'translate-y-px/foo',
-      '-translate-z-[var(--value)]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('translate-3d', async () => {
-  expect(await run(['translate-3d'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-translate-x: 0;
-          --tw-translate-y: 0;
-          --tw-translate-z: 0;
-        }
-      }
+    ".-translate-z-\\[var\\(--value\\)\\] {
+      --tw-translate-z: calc(var(--value) * -1);
+      translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
     }
 
-    .translate-3d {
+    .-translate-z-px {
+      --tw-translate-z: -1px;
+      translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
+    }
+
+    .translate-z-px {
+      --tw-translate-z: 1px;
       translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
     }
 
@@ -5880,41 +4259,58 @@ test('translate-3d', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
+    }"
+  `)
+  expect(
+    await run([
+      'translate-z',
+      'translate-z--1',
+      'translate-z--1/2',
+      'translate-z--1/-2',
+      'translate-z-1/-2',
+      'translate-z-full',
+      '-translate-z-full',
+      'translate-z-1/2',
+      'translate-y-px/foo',
+      '-translate-z-[var(--value)]/foo',
+    ]),
+  ).toEqual('')
+})
+
+test('translate-3d', async () => {
+  expect(await run(['translate-3d'])).toMatchInlineSnapshot(`
+    ".translate-3d {
+      translate: var(--tw-translate-x) var(--tw-translate-y) var(--tw-translate-z);
     }
-    "
+
+    @property --tw-translate-x {
+      syntax: "*";
+      inherits: false;
+      initial-value: 0;
+    }
+
+    @property --tw-translate-y {
+      syntax: "*";
+      inherits: false;
+      initial-value: 0;
+    }
+
+    @property --tw-translate-z {
+      syntax: "*";
+      inherits: false;
+      initial-value: 0;
+    }"
   `)
   expect(await run(['-translate-3d', 'translate-3d/foo'])).toEqual('')
 })
 
 test('rotate', async () => {
-  expect(
-    await run([
-      'rotate-45',
-      '-rotate-45',
-      'rotate-[123deg]',
-      'rotate-[0.3_0.7_1_45deg]',
-      'rotate-(--var)',
-      '-rotate-[123deg]',
-      '-rotate-(--var)',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    .-rotate-\\(--var\\) {
-      rotate: calc(var(--var) * -1);
-    }
-
-    .-rotate-45 {
+  expect(await run(['rotate-45', '-rotate-45', 'rotate-[123deg]', 'rotate-[0.3_0.7_1_45deg]']))
+    .toMatchInlineSnapshot(`
+    ".-rotate-45 {
       rotate: -45deg;
     }
 
-    .-rotate-\\[123deg\\] {
-      rotate: -123deg;
-    }
-
-    .rotate-\\(--var\\) {
-      rotate: var(--var);
-    }
-
     .rotate-45 {
       rotate: 45deg;
     }
@@ -5925,8 +4321,7 @@ test('rotate', async () => {
 
     .rotate-\\[123deg\\] {
       rotate: 123deg;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -5943,78 +4338,51 @@ test('rotate', async () => {
 })
 
 test('rotate-x', async () => {
-  expect(
-    await run([
-      'rotate-x-45',
-      '-rotate-x-45',
-      'rotate-x-[123deg]',
-      'rotate-x-(--var)',
-      '-rotate-x-(--var)',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
-      }
-    }
-
-    .-rotate-x-\\(--var\\) {
-      --tw-rotate-x: rotateX(calc(var(--var) * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
-
-    .-rotate-x-45 {
+  expect(await run(['rotate-x-45', '-rotate-x-45', 'rotate-x-[123deg]'])).toMatchInlineSnapshot(`
+    ".-rotate-x-45 {
       --tw-rotate-x: rotateX(calc(45deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
-
-    .rotate-x-\\(--var\\) {
-      --tw-rotate-x: rotateX(var(--var));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .rotate-x-45 {
       --tw-rotate-x: rotateX(45deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .rotate-x-\\[123deg\\] {
       --tw-rotate-x: rotateX(123deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     @property --tw-rotate-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateX(0);
     }
 
     @property --tw-rotate-y {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateY(0);
     }
 
     @property --tw-rotate-z {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateZ(0);
     }
 
     @property --tw-skew-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: skewX(0);
     }
 
     @property --tw-skew-y {
       syntax: "*";
-      inherits: false
-    }
-    "
+      inherits: false;
+      initial-value: skewY(0);
+    }"
   `)
   expect(
     await run([
@@ -6030,85 +4398,58 @@ test('rotate-x', async () => {
 })
 
 test('rotate-y', async () => {
-  expect(
-    await run([
-      'rotate-y-45',
-      'rotate-y-[123deg]',
-      'rotate-y-(--var)',
-      '-rotate-y-45',
-      '-rotate-y-[123deg]',
-      '-rotate-y-(--var)',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
+  expect(await run(['rotate-y-45', '-rotate-y-45', 'rotate-y-[123deg]', '-rotate-y-[123deg]']))
+    .toMatchInlineSnapshot(`
+      ".-rotate-y-45 {
+        --tw-rotate-y: rotateY(calc(45deg * -1));
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
       }
-    }
 
-    .-rotate-y-\\(--var\\) {
-      --tw-rotate-y: rotateY(calc(var(--var) * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      .-rotate-y-\\[123deg\\] {
+        --tw-rotate-y: rotateY(calc(123deg * -1));
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
+      }
 
-    .-rotate-y-45 {
-      --tw-rotate-y: rotateY(calc(45deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      .rotate-y-45 {
+        --tw-rotate-y: rotateY(45deg);
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
+      }
 
-    .-rotate-y-\\[123deg\\] {
-      --tw-rotate-y: rotateY(calc(123deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      .rotate-y-\\[123deg\\] {
+        --tw-rotate-y: rotateY(123deg);
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
+      }
 
-    .rotate-y-\\(--var\\) {
-      --tw-rotate-y: rotateY(var(--var));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      @property --tw-rotate-x {
+        syntax: "*";
+        inherits: false;
+        initial-value: rotateX(0);
+      }
 
-    .rotate-y-45 {
-      --tw-rotate-y: rotateY(45deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      @property --tw-rotate-y {
+        syntax: "*";
+        inherits: false;
+        initial-value: rotateY(0);
+      }
 
-    .rotate-y-\\[123deg\\] {
-      --tw-rotate-y: rotateY(123deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      @property --tw-rotate-z {
+        syntax: "*";
+        inherits: false;
+        initial-value: rotateZ(0);
+      }
 
-    @property --tw-rotate-x {
-      syntax: "*";
-      inherits: false
-    }
+      @property --tw-skew-x {
+        syntax: "*";
+        inherits: false;
+        initial-value: skewX(0);
+      }
 
-    @property --tw-rotate-y {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-rotate-z {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-skew-x {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-skew-y {
-      syntax: "*";
-      inherits: false
-    }
-    "
-  `)
+      @property --tw-skew-y {
+        syntax: "*";
+        inherits: false;
+        initial-value: skewY(0);
+      }"
+    `)
   expect(
     await run([
       'rotate-y',
@@ -6123,85 +4464,58 @@ test('rotate-y', async () => {
 })
 
 test('rotate-z', async () => {
-  expect(
-    await run([
-      'rotate-z-45',
-      'rotate-z-[123deg]',
-      'rotate-z-(--var)',
-      '-rotate-z-45',
-      '-rotate-z-[123deg]',
-      '-rotate-z-(--var)',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
+  expect(await run(['rotate-z-45', '-rotate-z-45', 'rotate-z-[123deg]', '-rotate-z-[123deg]']))
+    .toMatchInlineSnapshot(`
+      ".-rotate-z-45 {
+        --tw-rotate-z: rotateZ(calc(45deg * -1));
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
       }
-    }
 
-    .-rotate-z-\\(--var\\) {
-      --tw-rotate-z: rotateZ(calc(var(--var) * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      .-rotate-z-\\[123deg\\] {
+        --tw-rotate-z: rotateZ(calc(123deg * -1));
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
+      }
 
-    .-rotate-z-45 {
-      --tw-rotate-z: rotateZ(calc(45deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      .rotate-z-45 {
+        --tw-rotate-z: rotateZ(45deg);
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
+      }
 
-    .-rotate-z-\\[123deg\\] {
-      --tw-rotate-z: rotateZ(calc(123deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      .rotate-z-\\[123deg\\] {
+        --tw-rotate-z: rotateZ(123deg);
+        transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
+      }
 
-    .rotate-z-\\(--var\\) {
-      --tw-rotate-z: rotateZ(var(--var));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      @property --tw-rotate-x {
+        syntax: "*";
+        inherits: false;
+        initial-value: rotateX(0);
+      }
 
-    .rotate-z-45 {
-      --tw-rotate-z: rotateZ(45deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      @property --tw-rotate-y {
+        syntax: "*";
+        inherits: false;
+        initial-value: rotateY(0);
+      }
 
-    .rotate-z-\\[123deg\\] {
-      --tw-rotate-z: rotateZ(123deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
-    }
+      @property --tw-rotate-z {
+        syntax: "*";
+        inherits: false;
+        initial-value: rotateZ(0);
+      }
 
-    @property --tw-rotate-x {
-      syntax: "*";
-      inherits: false
-    }
+      @property --tw-skew-x {
+        syntax: "*";
+        inherits: false;
+        initial-value: skewX(0);
+      }
 
-    @property --tw-rotate-y {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-rotate-z {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-skew-x {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-skew-y {
-      syntax: "*";
-      inherits: false
-    }
-    "
-  `)
+      @property --tw-skew-y {
+        syntax: "*";
+        inherits: false;
+        initial-value: skewY(0);
+      }"
+    `)
   expect(
     await run([
       'rotate-z',
@@ -6217,62 +4531,53 @@ test('rotate-z', async () => {
 
 test('skew', async () => {
   expect(await run(['skew-6', '-skew-6', 'skew-[123deg]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
-      }
-    }
-
-    .-skew-6 {
+    ".-skew-6 {
       --tw-skew-x: skewX(calc(6deg * -1));
       --tw-skew-y: skewY(calc(6deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .skew-6 {
       --tw-skew-x: skewX(6deg);
       --tw-skew-y: skewY(6deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .skew-\\[123deg\\] {
       --tw-skew-x: skewX(123deg);
       --tw-skew-y: skewY(123deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     @property --tw-rotate-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateX(0);
     }
 
     @property --tw-rotate-y {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateY(0);
     }
 
     @property --tw-rotate-z {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateZ(0);
     }
 
     @property --tw-skew-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: skewX(0);
     }
 
     @property --tw-skew-y {
       syntax: "*";
-      inherits: false
-    }
-    "
+      inherits: false;
+      initial-value: skewY(0);
+    }"
   `)
   expect(
     await run([
@@ -6288,59 +4593,50 @@ test('skew', async () => {
 
 test('skew-x', async () => {
   expect(await run(['skew-x-6', '-skew-x-6', 'skew-x-[123deg]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
-      }
-    }
-
-    .-skew-x-6 {
+    ".-skew-x-6 {
       --tw-skew-x: skewX(calc(6deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .skew-x-6 {
       --tw-skew-x: skewX(6deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .skew-x-\\[123deg\\] {
       --tw-skew-x: skewX(123deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     @property --tw-rotate-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateX(0);
     }
 
     @property --tw-rotate-y {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateY(0);
     }
 
     @property --tw-rotate-z {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateZ(0);
     }
 
     @property --tw-skew-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: skewX(0);
     }
 
     @property --tw-skew-y {
       syntax: "*";
-      inherits: false
-    }
-    "
+      inherits: false;
+      initial-value: skewY(0);
+    }"
   `)
   expect(
     await run([
@@ -6356,59 +4652,50 @@ test('skew-x', async () => {
 
 test('skew-y', async () => {
   expect(await run(['skew-y-6', '-skew-y-6', 'skew-y-[123deg]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
-      }
-    }
-
-    .-skew-y-6 {
+    ".-skew-y-6 {
       --tw-skew-y: skewY(calc(6deg * -1));
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .skew-y-6 {
       --tw-skew-y: skewY(6deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .skew-y-\\[123deg\\] {
       --tw-skew-y: skewY(123deg);
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     @property --tw-rotate-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateX(0);
     }
 
     @property --tw-rotate-y {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateY(0);
     }
 
     @property --tw-rotate-z {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateZ(0);
     }
 
     @property --tw-skew-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: skewX(0);
     }
 
     @property --tw-skew-y {
       syntax: "*";
-      inherits: false
-    }
-    "
+      inherits: false;
+      initial-value: skewY(0);
+    }"
   `)
   expect(
     await run([
@@ -6425,18 +4712,7 @@ test('skew-y', async () => {
 test('scale', async () => {
   expect(await run(['scale-50', '-scale-50', 'scale-[2]', 'scale-[2_1.5_3]']))
     .toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-scale-x: 1;
-            --tw-scale-y: 1;
-            --tw-scale-z: 1;
-          }
-        }
-      }
-
-      .-scale-50 {
+      ".-scale-50 {
         --tw-scale-x: calc(50% * -1);
         --tw-scale-y: calc(50% * -1);
         --tw-scale-z: calc(50% * -1);
@@ -6474,8 +4750,7 @@ test('scale', async () => {
         syntax: "*";
         inherits: false;
         initial-value: 1;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -6493,18 +4768,7 @@ test('scale', async () => {
 
 test('scale-3d', async () => {
   expect(await run(['scale-3d'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scale-x: 1;
-          --tw-scale-y: 1;
-          --tw-scale-z: 1;
-        }
-      }
-    }
-
-    .scale-3d {
+    ".scale-3d {
       scale: var(--tw-scale-x) var(--tw-scale-y) var(--tw-scale-z);
     }
 
@@ -6524,26 +4788,14 @@ test('scale-3d', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 1;
-    }
-    "
+    }"
   `)
   expect(await run(['-scale-3d', 'scale-3d/foo'])).toEqual('')
 })
 
 test('scale-x', async () => {
   expect(await run(['scale-x-50', '-scale-x-50', 'scale-x-[2]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scale-x: 1;
-          --tw-scale-y: 1;
-          --tw-scale-z: 1;
-        }
-      }
-    }
-
-    .-scale-x-50 {
+    ".-scale-x-50 {
       --tw-scale-x: calc(50% * -1);
       scale: var(--tw-scale-x) var(--tw-scale-y);
     }
@@ -6574,22 +4826,10 @@ test('scale-x', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 1;
-    }
-    "
+    }"
   `)
   expect(await run(['scale-200', 'scale-x-400'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scale-x: 1;
-          --tw-scale-y: 1;
-          --tw-scale-z: 1;
-        }
-      }
-    }
-
-    .scale-200 {
+    ".scale-200 {
       --tw-scale-x: 200%;
       --tw-scale-y: 200%;
       --tw-scale-z: 200%;
@@ -6617,8 +4857,7 @@ test('scale-x', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 1;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -6637,18 +4876,7 @@ test('scale-x', async () => {
 
 test('scale-y', async () => {
   expect(await run(['scale-y-50', '-scale-y-50', 'scale-y-[2]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scale-x: 1;
-          --tw-scale-y: 1;
-          --tw-scale-z: 1;
-        }
-      }
-    }
-
-    .-scale-y-50 {
+    ".-scale-y-50 {
       --tw-scale-y: calc(50% * -1);
       scale: var(--tw-scale-x) var(--tw-scale-y);
     }
@@ -6679,8 +4907,7 @@ test('scale-y', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 1;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -6697,18 +4924,7 @@ test('scale-y', async () => {
 
 test('scale-z', async () => {
   expect(await run(['scale-z-50', '-scale-z-50', 'scale-z-[123deg]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scale-x: 1;
-          --tw-scale-y: 1;
-          --tw-scale-z: 1;
-        }
-      }
-    }
-
-    .-scale-z-50 {
+    ".-scale-z-50 {
       --tw-scale-z: calc(50% * -1);
       scale: var(--tw-scale-x) var(--tw-scale-y) var(--tw-scale-z);
     }
@@ -6739,8 +4955,7 @@ test('scale-z', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 1;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -6764,33 +4979,20 @@ test('transform', async () => {
       'transform-[scaleZ(2)_rotateY(45deg)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-rotate-x: initial;
-          --tw-rotate-y: initial;
-          --tw-rotate-z: initial;
-          --tw-skew-x: initial;
-          --tw-skew-y: initial;
-        }
-      }
-    }
-
-    .transform {
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+    ".transform {
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .transform-\\[scaleZ\\(2\\)_rotateY\\(45deg\\)\\] {
-      transform: scaleZ(2) rotateY(45deg);
+      transform: scaleZ(2)rotateY(45deg);
     }
 
     .transform-cpu {
-      transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .transform-gpu {
-      transform: translateZ(0) var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
+      transform: translateZ(0) var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y);
     }
 
     .transform-none {
@@ -6799,29 +5001,33 @@ test('transform', async () => {
 
     @property --tw-rotate-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateX(0);
     }
 
     @property --tw-rotate-y {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateY(0);
     }
 
     @property --tw-rotate-z {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: rotateZ(0);
     }
 
     @property --tw-skew-x {
       syntax: "*";
-      inherits: false
+      inherits: false;
+      initial-value: skewX(0);
     }
 
     @property --tw-skew-y {
       syntax: "*";
-      inherits: false
-    }
-    "
+      inherits: false;
+      initial-value: skewY(0);
+    }"
   `)
   expect(
     await run([
@@ -6836,44 +5042,42 @@ test('transform', async () => {
       'backface-hidden',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .backface-hidden {
-      backface-visibility: hidden;
-    }
+      ".backface-hidden {
+        backface-visibility: hidden;
+      }
 
-    .backface-visible {
-      backface-visibility: visible;
-    }
+      .backface-visible {
+        backface-visibility: visible;
+      }
 
-    .transform-3d {
-      transform-style: preserve-3d;
-    }
+      .transform-3d {
+        transform-style: preserve-3d;
+      }
 
-    .transform-border {
-      transform-box: border-box;
-    }
+      .transform-border {
+        transform-box: border-box;
+      }
 
-    .transform-content {
-      transform-box: content-box;
-    }
+      .transform-content {
+        transform-box: content-box;
+      }
 
-    .transform-fill {
-      transform-box: fill-box;
-    }
+      .transform-fill {
+        transform-box: fill-box;
+      }
 
-    .transform-flat {
-      transform-style: flat;
-    }
+      .transform-flat {
+        transform-style: flat;
+      }
 
-    .transform-stroke {
-      transform-box: stroke-box;
-    }
+      .transform-stroke {
+        transform-box: stroke-box;
+      }
 
-    .transform-view {
-      transform-box: view-box;
-    }
-    "
-  `)
+      .transform-view {
+        transform-box: view-box;
+      }"
+    `)
   expect(
     await run([
       '-transform',
@@ -6898,31 +5102,9 @@ test('transform', async () => {
   ).toEqual('')
 })
 
-test('zoom', async () => {
-  expect(await run(['zoom-50', 'zoom-100', 'zoom-[var(--zoom)]'])).toMatchInlineSnapshot(`
-    "
-    .zoom-50 {
-      zoom: 50%;
-    }
-
-    .zoom-100 {
-      zoom: 100%;
-    }
-
-    .zoom-\\[var\\(--zoom\\)\\] {
-      zoom: var(--zoom);
-    }
-    "
-  `)
-  expect(
-    await run(['zoom', '-zoom-50', 'zoom--50', 'zoom-1.5', 'zoom-unknown', 'zoom-50/foo']),
-  ).toEqual('')
-})
-
 test('perspective', async () => {
   expect(
-    await run(
-      ['perspective-normal', 'perspective-dramatic', 'perspective-none', 'perspective-[456px]'],
+    await compileCss(
       css`
         @theme {
           --perspective-dramatic: 100px;
@@ -6930,10 +5112,10 @@ test('perspective', async () => {
         }
         @tailwind utilities;
       `,
+      ['perspective-normal', 'perspective-dramatic', 'perspective-none', 'perspective-[456px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --perspective-dramatic: 100px;
       --perspective-normal: 500px;
     }
@@ -6952,8 +5134,7 @@ test('perspective', async () => {
 
     .perspective-normal {
       perspective: var(--perspective-normal);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -6967,33 +5148,17 @@ test('perspective', async () => {
       'perspective-[456px]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['perspective-none'],
-      css`
-        @theme {
-          --perspective-none: 400px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --perspective-none: 400px;
-    }
-
-    .perspective-none {
-      perspective: var(--perspective-none);
-    }
-    "
-  `)
 })
 
 test('cursor', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --cursor-custom: url(/my-cursor.png);
+        }
+        @tailwind utilities;
+      `,
       [
         'cursor-auto',
         'cursor-default',
@@ -7034,16 +5199,9 @@ test('cursor', async () => {
         'cursor-[var(--value)]',
         'cursor-custom',
       ],
-      css`
-        @theme {
-          --cursor-custom: url(/my-cursor.png);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --cursor-custom: url("/my-cursor.png");
     }
 
@@ -7197,8 +5355,7 @@ test('cursor', async () => {
 
     .cursor-zoom-out {
       cursor: zoom-out;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7285,8 +5442,7 @@ test('cursor', async () => {
 
 test('touch-action', async () => {
   expect(await run(['touch-auto', 'touch-none', 'touch-manipulation'])).toMatchInlineSnapshot(`
-    "
-    .touch-auto {
+    ".touch-auto {
       touch-action: auto;
     }
 
@@ -7296,8 +5452,7 @@ test('touch-action', async () => {
 
     .touch-none {
       touch-action: none;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7322,18 +5477,7 @@ test('touch-pan', async () => {
       'touch-pan-down',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-pan-x: initial;
-          --tw-pan-y: initial;
-          --tw-pinch-zoom: initial;
-        }
-      }
-    }
-
-    .touch-pan-left {
+    ".touch-pan-left {
       --tw-pan-x: pan-left;
       touch-action: var(--tw-pan-x, ) var(--tw-pan-y, ) var(--tw-pinch-zoom, );
     }
@@ -7376,8 +5520,7 @@ test('touch-pan', async () => {
     @property --tw-pinch-zoom {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7399,18 +5542,7 @@ test('touch-pan', async () => {
 
 test('touch-pinch-zoom', async () => {
   expect(await run(['touch-pinch-zoom'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-pan-x: initial;
-          --tw-pan-y: initial;
-          --tw-pinch-zoom: initial;
-        }
-      }
-    }
-
-    .touch-pinch-zoom {
+    ".touch-pinch-zoom {
       --tw-pinch-zoom: pinch-zoom;
       touch-action: var(--tw-pan-x, ) var(--tw-pan-y, ) var(--tw-pinch-zoom, );
     }
@@ -7428,8 +5560,7 @@ test('touch-pinch-zoom', async () => {
     @property --tw-pinch-zoom {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(await run(['-touch-pinch-zoom', 'touch-pinch-zoom/foo'])).toEqual('')
 })
@@ -7437,28 +5568,26 @@ test('touch-pinch-zoom', async () => {
 test('select', async () => {
   expect(await run(['select-none', 'select-text', 'select-all', 'select-auto']))
     .toMatchInlineSnapshot(`
-      "
-      .select-all {
-        -webkit-user-select: all;
-        user-select: all;
-      }
+    ".select-all {
+      -webkit-user-select: all;
+      user-select: all;
+    }
 
-      .select-auto {
-        -webkit-user-select: auto;
-        user-select: auto;
-      }
+    .select-auto {
+      -webkit-user-select: auto;
+      user-select: auto;
+    }
 
-      .select-none {
-        -webkit-user-select: none;
-        user-select: none;
-      }
+    .select-none {
+      -webkit-user-select: none;
+      user-select: none;
+    }
 
-      .select-text {
-        -webkit-user-select: text;
-        user-select: text;
-      }
-      "
-    `)
+    .select-text {
+      -webkit-user-select: text;
+      user-select: text;
+    }"
+  `)
   expect(
     await run([
       '-select-none',
@@ -7475,8 +5604,7 @@ test('select', async () => {
 
 test('resize', async () => {
   expect(await run(['resize-none', 'resize', 'resize-x', 'resize-y'])).toMatchInlineSnapshot(`
-    "
-    .resize {
+    ".resize {
       resize: both;
     }
 
@@ -7490,8 +5618,7 @@ test('resize', async () => {
 
     .resize-y {
       resize: vertical;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7509,16 +5636,7 @@ test('resize', async () => {
 
 test('scroll-snap-type', async () => {
   expect(await run(['snap-none', 'snap-x', 'snap-y', 'snap-both'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scroll-snap-strictness: proximity;
-        }
-      }
-    }
-
-    .snap-both {
+    ".snap-both {
       scroll-snap-type: both var(--tw-scroll-snap-strictness);
     }
 
@@ -7538,8 +5656,7 @@ test('scroll-snap-type', async () => {
       syntax: "*";
       inherits: false;
       initial-value: proximity;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7557,16 +5674,7 @@ test('scroll-snap-type', async () => {
 
 test('--tw-scroll-snap-strictness', async () => {
   expect(await run(['snap-mandatory', 'snap-proximity'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scroll-snap-strictness: proximity;
-        }
-      }
-    }
-
-    .snap-mandatory {
+    ".snap-mandatory {
       --tw-scroll-snap-strictness: mandatory;
     }
 
@@ -7578,8 +5686,7 @@ test('--tw-scroll-snap-strictness', async () => {
       syntax: "*";
       inherits: false;
       initial-value: proximity;
-    }
-    "
+    }"
   `)
   expect(
     await run(['-snap-mandatory', '-snap-proximity', 'snap-mandatory/foo', 'snap-proximity/foo']),
@@ -7589,24 +5696,22 @@ test('--tw-scroll-snap-strictness', async () => {
 test('scroll-snap-align', async () => {
   expect(await run(['snap-align-none', 'snap-start', 'snap-end', 'snap-center']))
     .toMatchInlineSnapshot(`
-      "
-      .snap-align-none {
-        scroll-snap-align: none;
-      }
+    ".snap-align-none {
+      scroll-snap-align: none;
+    }
 
-      .snap-center {
-        scroll-snap-align: center;
-      }
+    .snap-center {
+      scroll-snap-align: center;
+    }
 
-      .snap-end {
-        scroll-snap-align: end;
-      }
+    .snap-end {
+      scroll-snap-align: end;
+    }
 
-      .snap-start {
-        scroll-snap-align: start;
-      }
-      "
-    `)
+    .snap-start {
+      scroll-snap-align: start;
+    }"
+  `)
   expect(
     await run([
       '-snap-align-none',
@@ -7623,15 +5728,13 @@ test('scroll-snap-align', async () => {
 
 test('scroll-snap-stop', async () => {
   expect(await run(['snap-normal', 'snap-always'])).toMatchInlineSnapshot(`
-    "
-    .snap-always {
+    ".snap-always {
       scroll-snap-stop: always;
     }
 
     .snap-normal {
       scroll-snap-stop: normal;
-    }
-    "
+    }"
   `)
   expect(await run(['-snap-normal', '-snap-always', 'snap-normal/foo', 'snap-always/foo'])).toEqual(
     '',
@@ -7640,18 +5743,17 @@ test('scroll-snap-stop', async () => {
 
 test('scroll-m', async () => {
   expect(
-    await run(
-      ['scroll-m-4', 'scroll-m-[4px]', '-scroll-m-4', '-scroll-m-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-m-4', 'scroll-m-[4px]', '-scroll-m-4', '-scroll-m-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -7669,8 +5771,7 @@ test('scroll-m', async () => {
 
     .scroll-m-\\[4px\\] {
       scroll-margin: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7685,18 +5786,17 @@ test('scroll-m', async () => {
 
 test('scroll-mx', async () => {
   expect(
-    await run(
-      ['scroll-mx-4', 'scroll-mx-[4px]', '-scroll-mx-4', '-scroll-mx-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-mx-4', 'scroll-mx-[4px]', '-scroll-mx-4', '-scroll-mx-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -7714,8 +5814,7 @@ test('scroll-mx', async () => {
 
     .scroll-mx-\\[4px\\] {
       scroll-margin-inline: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7730,18 +5829,17 @@ test('scroll-mx', async () => {
 
 test('scroll-my', async () => {
   expect(
-    await run(
-      ['scroll-my-4', 'scroll-my-[4px]', '-scroll-my-4', '-scroll-my-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-my-4', 'scroll-my-[4px]', '-scroll-my-4', '-scroll-my-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -7759,8 +5857,7 @@ test('scroll-my', async () => {
 
     .scroll-my-\\[4px\\] {
       scroll-margin-block: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7775,18 +5872,17 @@ test('scroll-my', async () => {
 
 test('scroll-ms', async () => {
   expect(
-    await run(
-      ['scroll-ms-4', 'scroll-ms-[4px]', '-scroll-ms-4', '-scroll-ms-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-ms-4', 'scroll-ms-[4px]', '-scroll-ms-4', '-scroll-ms-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -7804,8 +5900,7 @@ test('scroll-ms', async () => {
 
     .scroll-ms-\\[4px\\] {
       scroll-margin-inline-start: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7820,18 +5915,17 @@ test('scroll-ms', async () => {
 
 test('scroll-me', async () => {
   expect(
-    await run(
-      ['scroll-me-4', 'scroll-me-[4px]', '-scroll-me-4', '-scroll-me-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-me-4', 'scroll-me-[4px]', '-scroll-me-4', '-scroll-me-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -7849,8 +5943,7 @@ test('scroll-me', async () => {
 
     .scroll-me-\\[4px\\] {
       scroll-margin-inline-end: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -7863,110 +5956,19 @@ test('scroll-me', async () => {
   ).toEqual('')
 })
 
-test('scroll-mbs', async () => {
-  expect(
-    await run(
-      ['scroll-mbs-4', 'scroll-mbs-[4px]', '-scroll-mbs-4', '-scroll-mbs-[var(--value)]'],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .-scroll-mbs-4 {
-      scroll-margin-block-start: calc(var(--spacing-4) * -1);
-    }
-
-    .-scroll-mbs-\\[var\\(--value\\)\\] {
-      scroll-margin-block-start: calc(var(--value) * -1);
-    }
-
-    .scroll-mbs-4 {
-      scroll-margin-block-start: var(--spacing-4);
-    }
-
-    .scroll-mbs-\\[4px\\] {
-      scroll-margin-block-start: 4px;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scroll-mbs',
-      'scroll-mbs-4/foo',
-      'scroll-mbs-[4px]/foo',
-      '-scroll-mbs-4/foo',
-      '-scroll-mbs-[var(--value)]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('scroll-mbe', async () => {
-  expect(
-    await run(
-      ['scroll-mbe-4', 'scroll-mbe-[4px]', '-scroll-mbe-4', '-scroll-mbe-[var(--value)]'],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .-scroll-mbe-4 {
-      scroll-margin-block-end: calc(var(--spacing-4) * -1);
-    }
-
-    .-scroll-mbe-\\[var\\(--value\\)\\] {
-      scroll-margin-block-end: calc(var(--value) * -1);
-    }
-
-    .scroll-mbe-4 {
-      scroll-margin-block-end: var(--spacing-4);
-    }
-
-    .scroll-mbe-\\[4px\\] {
-      scroll-margin-block-end: 4px;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scroll-mbe',
-      'scroll-mbe-4/foo',
-      'scroll-mbe-[4px]/foo',
-      '-scroll-mbe-4/foo',
-      '-scroll-mbe-[var(--value)]/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('scroll-mt', async () => {
   expect(
-    await run(
-      ['scroll-mt-4', 'scroll-mt-[4px]', '-scroll-mt-4', '-scroll-mt-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-mt-4', 'scroll-mt-[4px]', '-scroll-mt-4', '-scroll-mt-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -7984,8 +5986,7 @@ test('scroll-mt', async () => {
 
     .scroll-mt-\\[4px\\] {
       scroll-margin-top: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8000,18 +6001,17 @@ test('scroll-mt', async () => {
 
 test('scroll-mr', async () => {
   expect(
-    await run(
-      ['scroll-mr-4', 'scroll-mr-[4px]', '-scroll-mr-4', '-scroll-mr-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-mr-4', 'scroll-mr-[4px]', '-scroll-mr-4', '-scroll-mr-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8029,8 +6029,7 @@ test('scroll-mr', async () => {
 
     .scroll-mr-\\[4px\\] {
       scroll-margin-right: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8045,18 +6044,17 @@ test('scroll-mr', async () => {
 
 test('scroll-mb', async () => {
   expect(
-    await run(
-      ['scroll-mb-4', 'scroll-mb-[4px]', '-scroll-mb-4', '-scroll-mb-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-mb-4', 'scroll-mb-[4px]', '-scroll-mb-4', '-scroll-mb-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8074,8 +6072,7 @@ test('scroll-mb', async () => {
 
     .scroll-mb-\\[4px\\] {
       scroll-margin-bottom: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8090,18 +6087,17 @@ test('scroll-mb', async () => {
 
 test('scroll-ml', async () => {
   expect(
-    await run(
-      ['scroll-ml-4', 'scroll-ml-[4px]', '-scroll-ml-4', '-scroll-ml-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-ml-4', 'scroll-ml-[4px]', '-scroll-ml-4', '-scroll-ml-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8119,8 +6115,7 @@ test('scroll-ml', async () => {
 
     .scroll-ml-\\[4px\\] {
       scroll-margin-left: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8135,18 +6130,17 @@ test('scroll-ml', async () => {
 
 test('scroll-p', async () => {
   expect(
-    await run(
-      ['scroll-p-4', 'scroll-p-[4px]', '-scroll-p-4', '-scroll-p-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-p-4', 'scroll-p-[4px]', '-scroll-p-4', '-scroll-p-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8156,8 +6150,7 @@ test('scroll-p', async () => {
 
     .scroll-p-\\[4px\\] {
       scroll-padding: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8172,18 +6165,17 @@ test('scroll-p', async () => {
 
 test('scroll-px', async () => {
   expect(
-    await run(
-      ['scroll-px-4', 'scroll-px-[4px]', '-scroll-px-4', '-scroll-px-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-px-4', 'scroll-px-[4px]', '-scroll-px-4', '-scroll-px-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8193,8 +6185,7 @@ test('scroll-px', async () => {
 
     .scroll-px-\\[4px\\] {
       scroll-padding-inline: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8209,18 +6200,17 @@ test('scroll-px', async () => {
 
 test('scroll-py', async () => {
   expect(
-    await run(
-      ['scroll-py-4', 'scroll-py-[4px]', '-scroll-py-4', '-scroll-py-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-py-4', 'scroll-py-[4px]', '-scroll-py-4', '-scroll-py-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8230,8 +6220,7 @@ test('scroll-py', async () => {
 
     .scroll-py-\\[4px\\] {
       scroll-padding-block: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8246,18 +6235,17 @@ test('scroll-py', async () => {
 
 test('scroll-ps', async () => {
   expect(
-    await run(
-      ['scroll-ps-4', 'scroll-ps-[4px]', '-scroll-ps-4', '-scroll-ps-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-ps-4', 'scroll-ps-[4px]', '-scroll-ps-4', '-scroll-ps-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8267,8 +6255,7 @@ test('scroll-ps', async () => {
 
     .scroll-ps-\\[4px\\] {
       scroll-padding-inline-start: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8283,18 +6270,17 @@ test('scroll-ps', async () => {
 
 test('scroll-pe', async () => {
   expect(
-    await run(
-      ['scroll-pe-4', 'scroll-pe-[4px]', '-scroll-pe-4', '-scroll-pe-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-pe-4', 'scroll-pe-[4px]', '-scroll-pe-4', '-scroll-pe-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8304,8 +6290,7 @@ test('scroll-pe', async () => {
 
     .scroll-pe-\\[4px\\] {
       scroll-padding-inline-end: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8318,94 +6303,19 @@ test('scroll-pe', async () => {
   ).toEqual('')
 })
 
-test('scroll-pbs', async () => {
-  expect(
-    await run(
-      ['scroll-pbs-4', 'scroll-pbs-[4px]'],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .scroll-pbs-4 {
-      scroll-padding-block-start: var(--spacing-4);
-    }
-
-    .scroll-pbs-\\[4px\\] {
-      scroll-padding-block-start: 4px;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scroll-pbs',
-      'scroll-pbs-4/foo',
-      'scroll-pbs-[4px]/foo',
-      '-scroll-pbs-4',
-      '-scroll-pbs-[var(--value)]',
-    ]),
-  ).toEqual('')
-})
-
-test('scroll-pbe', async () => {
-  expect(
-    await run(
-      ['scroll-pbe-4', 'scroll-pbe-[4px]'],
-      css`
-        @theme {
-          --spacing-4: 1rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing-4: 1rem;
-    }
-
-    .scroll-pbe-4 {
-      scroll-padding-block-end: var(--spacing-4);
-    }
-
-    .scroll-pbe-\\[4px\\] {
-      scroll-padding-block-end: 4px;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scroll-pbe',
-      'scroll-pbe-4/foo',
-      'scroll-pbe-[4px]/foo',
-      '-scroll-pbe-4',
-      '-scroll-pbe-[var(--value)]',
-    ]),
-  ).toEqual('')
-})
-
 test('scroll-pt', async () => {
   expect(
-    await run(
-      ['scroll-pt-4', 'scroll-pt-[4px]', '-scroll-pt-4', '-scroll-pt-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-pt-4', 'scroll-pt-[4px]', '-scroll-pt-4', '-scroll-pt-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8415,8 +6325,7 @@ test('scroll-pt', async () => {
 
     .scroll-pt-\\[4px\\] {
       scroll-padding-top: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8431,18 +6340,17 @@ test('scroll-pt', async () => {
 
 test('scroll-pr', async () => {
   expect(
-    await run(
-      ['scroll-pr-4', 'scroll-pr-[4px]', '-scroll-pr-4', '-scroll-pr-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-pr-4', 'scroll-pr-[4px]', '-scroll-pr-4', '-scroll-pr-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8452,8 +6360,7 @@ test('scroll-pr', async () => {
 
     .scroll-pr-\\[4px\\] {
       scroll-padding-right: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8468,18 +6375,17 @@ test('scroll-pr', async () => {
 
 test('scroll-pb', async () => {
   expect(
-    await run(
-      ['scroll-pb-4', 'scroll-pb-[4px]', '-scroll-pb-4', '-scroll-pb-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-pb-4', 'scroll-pb-[4px]', '-scroll-pb-4', '-scroll-pb-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8489,8 +6395,7 @@ test('scroll-pb', async () => {
 
     .scroll-pb-\\[4px\\] {
       scroll-padding-bottom: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8505,18 +6410,17 @@ test('scroll-pb', async () => {
 
 test('scroll-pl', async () => {
   expect(
-    await run(
-      ['scroll-pl-4', 'scroll-pl-[4px]', '-scroll-pl-4', '-scroll-pl-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['scroll-pl-4', 'scroll-pl-[4px]', '-scroll-pl-4', '-scroll-pl-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -8526,8 +6430,7 @@ test('scroll-pl', async () => {
 
     .scroll-pl-\\[4px\\] {
       scroll-padding-left: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8542,15 +6445,13 @@ test('scroll-pl', async () => {
 
 test('list-style-position', async () => {
   expect(await run(['list-inside', 'list-outside'])).toMatchInlineSnapshot(`
-    "
-    .list-inside {
+    ".list-inside {
       list-style-position: inside;
     }
 
     .list-outside {
       list-style-position: outside;
-    }
-    "
+    }"
   `)
   expect(
     await run(['-list-inside', '-list-outside', 'list-inside/foo', 'list-outside/foo']),
@@ -8560,8 +6461,7 @@ test('list-style-position', async () => {
 test('list', async () => {
   expect(await run(['list-none', 'list-disc', 'list-decimal', 'list-[var(--value)]']))
     .toMatchInlineSnapshot(`
-      "
-      .list-\\[var\\(--value\\)\\] {
+      ".list-\\[var\\(--value\\)\\] {
         list-style-type: var(--value);
       }
 
@@ -8575,8 +6475,7 @@ test('list', async () => {
 
       .list-none {
         list-style-type: none;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -8590,41 +6489,17 @@ test('list', async () => {
       'list-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['list-none'],
-      css`
-        @theme {
-          --list-style-type-none: disc;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --list-style-type-none: disc;
-    }
-
-    .list-none {
-      list-style-type: var(--list-style-type-none);
-    }
-    "
-  `)
 })
 
 test('list-image', async () => {
   expect(await run(['list-image-none', 'list-image-[var(--value)]'])).toMatchInlineSnapshot(`
-    "
-    .list-image-\\[var\\(--value\\)\\] {
+    ".list-image-\\[var\\(--value\\)\\] {
       list-style-image: var(--value);
     }
 
     .list-image-none {
       list-style-image: none;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8635,41 +6510,17 @@ test('list-image', async () => {
       'list-image-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['list-image-none'],
-      css`
-        @theme {
-          --list-style-image-none: url(../foo.png);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --list-style-image-none: url("../foo.png");
-    }
-
-    .list-image-none {
-      list-style-image: var(--list-style-image-none);
-    }
-    "
-  `)
 })
 
 test('appearance', async () => {
   expect(await run(['appearance-none', 'appearance-auto'])).toMatchInlineSnapshot(`
-    "
-    .appearance-auto {
+    ".appearance-auto {
       appearance: auto;
     }
 
     .appearance-none {
       appearance: none;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8693,8 +6544,7 @@ test('color-scheme', async () => {
       'scheme-only-light',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .scheme-dark {
+    ".scheme-dark {
       color-scheme: dark;
     }
 
@@ -8716,8 +6566,7 @@ test('color-scheme', async () => {
 
     .scheme-only-light {
       color-scheme: light only;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8733,7 +6582,14 @@ test('color-scheme', async () => {
 
 test('columns', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --container-3xs: 16rem;
+          --container-7xl: 80rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'columns-auto',
         'columns-3xs',
@@ -8743,17 +6599,9 @@ test('columns', async () => {
         'columns-[123]',
         'columns-[var(--value)]',
       ],
-      css`
-        @theme {
-          --container-3xs: 16rem;
-          --container-7xl: 80rem;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --container-3xs: 16rem;
       --container-7xl: 80rem;
     }
@@ -8784,8 +6632,7 @@ test('columns', async () => {
 
     .columns-auto {
       columns: auto;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8804,28 +6651,6 @@ test('columns', async () => {
       'columns-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['columns-auto'],
-      css`
-        @theme {
-          --columns-auto: 3;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --columns-auto: 3;
-    }
-
-    .columns-auto {
-      columns: var(--columns-auto);
-    }
-    "
-  `)
 })
 
 test('break-before', async () => {
@@ -8841,8 +6666,7 @@ test('break-before', async () => {
       'break-before-column',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .break-before-all {
+    ".break-before-all {
       break-before: all;
     }
 
@@ -8872,8 +6696,7 @@ test('break-before', async () => {
 
     .break-before-right {
       break-before: right;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8907,8 +6730,7 @@ test('break-inside', async () => {
       'break-inside-avoid-column',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .break-inside-auto {
+    ".break-inside-auto {
       break-inside: auto;
     }
 
@@ -8922,8 +6744,7 @@ test('break-inside', async () => {
 
     .break-inside-avoid-page {
       break-inside: avoid-page;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -8953,8 +6774,7 @@ test('break-after', async () => {
       'break-after-column',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .break-after-all {
+    ".break-after-all {
       break-after: all;
     }
 
@@ -8984,8 +6804,7 @@ test('break-after', async () => {
 
     .break-after-right {
       break-after: right;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9012,29 +6831,15 @@ test('break-after', async () => {
 
 test('auto-cols', async () => {
   expect(
-    await run(
-      [
-        'auto-cols-auto',
-        'auto-cols-min',
-        'auto-cols-max',
-        'auto-cols-fr',
-        'auto-cols-[2fr]',
-        'auto-cols-12',
-      ],
-      css`
-        @tailwind utilities;
-        @theme {
-          --spacing: 0.25rem;
-        }
-      `,
-    ),
+    await run([
+      'auto-cols-auto',
+      'auto-cols-min',
+      'auto-cols-max',
+      'auto-cols-fr',
+      'auto-cols-[2fr]',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    .auto-cols-12 {
-      grid-auto-columns: calc(var(--spacing) * 12);
-    }
-
-    .auto-cols-\\[2fr\\] {
+    ".auto-cols-\\[2fr\\] {
       grid-auto-columns: 2fr;
     }
 
@@ -9052,12 +6857,7 @@ test('auto-cols', async () => {
 
     .auto-cols-min {
       grid-auto-columns: min-content;
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9071,28 +6871,6 @@ test('auto-cols', async () => {
       'auto-cols-[2fr]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['auto-cols-auto'],
-      css`
-        @theme {
-          --grid-auto-columns-auto: 2fr;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-auto-columns-auto: 2fr;
-    }
-
-    .auto-cols-auto {
-      grid-auto-columns: var(--grid-auto-columns-auto);
-    }
-    "
-  `)
 })
 
 test('grid-flow', async () => {
@@ -9105,8 +6883,7 @@ test('grid-flow', async () => {
       'grid-flow-col-dense',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .grid-flow-col {
+    ".grid-flow-col {
       grid-auto-flow: column;
     }
 
@@ -9124,8 +6901,7 @@ test('grid-flow', async () => {
 
     .grid-flow-row-dense {
       grid-auto-flow: row dense;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9146,29 +6922,15 @@ test('grid-flow', async () => {
 
 test('auto-rows', async () => {
   expect(
-    await run(
-      [
-        'auto-rows-auto',
-        'auto-rows-min',
-        'auto-rows-max',
-        'auto-rows-fr',
-        'auto-rows-[2fr]',
-        'auto-rows-12',
-      ],
-      css`
-        @tailwind utilities;
-        @theme {
-          --spacing: 0.25rem;
-        }
-      `,
-    ),
+    await run([
+      'auto-rows-auto',
+      'auto-rows-min',
+      'auto-rows-max',
+      'auto-rows-fr',
+      'auto-rows-[2fr]',
+    ]),
   ).toMatchInlineSnapshot(`
-    "
-    .auto-rows-12 {
-      grid-auto-rows: calc(var(--spacing) * 12);
-    }
-
-    .auto-rows-\\[2fr\\] {
+    ".auto-rows-\\[2fr\\] {
       grid-auto-rows: 2fr;
     }
 
@@ -9186,12 +6948,7 @@ test('auto-rows', async () => {
 
     .auto-rows-min {
       grid-auto-rows: min-content;
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9205,28 +6962,6 @@ test('auto-rows', async () => {
       'auto-rows-[2fr]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['auto-rows-auto'],
-      css`
-        @theme {
-          --grid-auto-rows-auto: 2fr;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-auto-rows-auto: 2fr;
-    }
-
-    .auto-rows-auto {
-      grid-auto-rows: var(--grid-auto-rows-auto);
-    }
-    "
-  `)
 })
 
 test('grid-cols', async () => {
@@ -9239,8 +6974,7 @@ test('grid-cols', async () => {
       'grid-cols-[123]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .grid-cols-12 {
+    ".grid-cols-12 {
       grid-template-columns: repeat(12, minmax(0, 1fr));
     }
 
@@ -9258,8 +6992,7 @@ test('grid-cols', async () => {
 
     .grid-cols-subgrid {
       grid-template-columns: subgrid;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9278,28 +7011,6 @@ test('grid-cols', async () => {
       'grid-cols-[123]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['grid-cols-none'],
-      css`
-        @theme {
-          --grid-template-columns-none: 200px 1fr;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-template-columns-none: 200px 1fr;
-    }
-
-    .grid-cols-none {
-      grid-template-columns: var(--grid-template-columns-none);
-    }
-    "
-  `)
 })
 
 test('grid-rows', async () => {
@@ -9312,8 +7023,7 @@ test('grid-rows', async () => {
       'grid-rows-[123]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .grid-rows-12 {
+    ".grid-rows-12 {
       grid-template-rows: repeat(12, minmax(0, 1fr));
     }
 
@@ -9331,8 +7041,7 @@ test('grid-rows', async () => {
 
     .grid-rows-subgrid {
       grid-template-rows: subgrid;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9351,51 +7060,27 @@ test('grid-rows', async () => {
       'grid-rows-[123]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['grid-rows-none'],
-      css`
-        @theme {
-          --grid-template-rows-none: 200px 1fr;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --grid-template-rows-none: 200px 1fr;
-    }
-
-    .grid-rows-none {
-      grid-template-rows: var(--grid-template-rows-none);
-    }
-    "
-  `)
 })
 
 test('flex-direction', async () => {
   expect(await run(['flex-row', 'flex-row-reverse', 'flex-col', 'flex-col-reverse']))
     .toMatchInlineSnapshot(`
-      "
-      .flex-col {
-        flex-direction: column;
-      }
+    ".flex-col {
+      flex-direction: column;
+    }
 
-      .flex-col-reverse {
-        flex-direction: column-reverse;
-      }
+    .flex-col-reverse {
+      flex-direction: column-reverse;
+    }
 
-      .flex-row {
-        flex-direction: row;
-      }
+    .flex-row {
+      flex-direction: row;
+    }
 
-      .flex-row-reverse {
-        flex-direction: row-reverse;
-      }
-      "
-    `)
+    .flex-row-reverse {
+      flex-direction: row-reverse;
+    }"
+  `)
   expect(
     await run([
       '-flex-row',
@@ -9412,8 +7097,7 @@ test('flex-direction', async () => {
 
 test('flex-wrap', async () => {
   expect(await run(['flex-wrap', 'flex-wrap-reverse', 'flex-nowrap'])).toMatchInlineSnapshot(`
-    "
-    .flex-nowrap {
+    ".flex-nowrap {
       flex-wrap: nowrap;
     }
 
@@ -9423,8 +7107,7 @@ test('flex-wrap', async () => {
 
     .flex-wrap-reverse {
       flex-wrap: wrap-reverse;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9453,8 +7136,7 @@ test('place-content', async () => {
       'place-content-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .place-content-around {
+    ".place-content-around {
       place-content: space-around;
     }
 
@@ -9492,8 +7174,7 @@ test('place-content', async () => {
 
     .place-content-stretch {
       place-content: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9530,8 +7211,7 @@ test('place-items', async () => {
       'place-items-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .place-items-baseline {
+    ".place-items-baseline {
       place-items: baseline;
     }
 
@@ -9557,8 +7237,7 @@ test('place-items', async () => {
 
     .place-items-stretch {
       place-items: stretch stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9593,8 +7272,7 @@ test('align-content', async () => {
       'content-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .content-around {
+    ".content-around {
       align-content: space-around;
     }
 
@@ -9636,8 +7314,7 @@ test('align-content', async () => {
 
     .content-stretch {
       align-content: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9677,8 +7354,7 @@ test('items', async () => {
       'items-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .items-baseline {
+    ".items-baseline {
       align-items: baseline;
     }
 
@@ -9708,8 +7384,7 @@ test('items', async () => {
 
     .items-stretch {
       align-items: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9745,8 +7420,7 @@ test('justify', async () => {
       'justify-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .justify-around {
+    ".justify-around {
       justify-content: space-around;
     }
 
@@ -9784,8 +7458,7 @@ test('justify', async () => {
 
     .justify-stretch {
       justify-content: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9821,8 +7494,7 @@ test('justify-items', async () => {
       'justify-items-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .justify-items-center {
+    ".justify-items-center {
       justify-items: center;
     }
 
@@ -9844,8 +7516,7 @@ test('justify-items', async () => {
 
     .justify-items-stretch {
       justify-items: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -9864,18 +7535,17 @@ test('justify-items', async () => {
 
 test('gap', async () => {
   expect(
-    await run(
-      ['gap-4', 'gap-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['gap-4', 'gap-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -9885,26 +7555,24 @@ test('gap', async () => {
 
     .gap-\\[4px\\] {
       gap: 4px;
-    }
-    "
+    }"
   `)
   expect(await run(['gap', '-gap-4', '-gap-[4px]', 'gap-4/foo', 'gap-[4px]/foo'])).toEqual('')
 })
 
 test('gap-x', async () => {
   expect(
-    await run(
-      ['gap-x-4', 'gap-x-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['gap-x-4', 'gap-x-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -9914,8 +7582,7 @@ test('gap-x', async () => {
 
     .gap-x-\\[4px\\] {
       column-gap: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run(['gap-x', '-gap-x-4', '-gap-x-[4px]', 'gap-x-4/foo', 'gap-x-[4px]/foo']),
@@ -9924,18 +7591,17 @@ test('gap-x', async () => {
 
 test('gap-y', async () => {
   expect(
-    await run(
-      ['gap-y-4', 'gap-y-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['gap-y-4', 'gap-y-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
@@ -9945,8 +7611,7 @@ test('gap-y', async () => {
 
     .gap-y-\\[4px\\] {
       row-gap: 4px;
-    }
-    "
+    }"
   `)
   expect(
     await run(['gap-y', '-gap-y-4', '-gap-y-[4px]', 'gap-y-4/foo', 'gap-y-[4px]/foo']),
@@ -9955,82 +7620,32 @@ test('gap-y', async () => {
 
 test('space-x', async () => {
   expect(
-    await run(
-      [
-        'space-x-0',
-        'space-x-[0]',
-        'space-x-[0px]',
-        '-space-x-0',
-        'space-x-[-0]',
-        'space-x-[-0px]',
-        'space-x-1',
-        '-space-x-1',
-        'space-x-4',
-        'space-x-[4px]',
-        '-space-x-4',
-      ],
+    await compileCss(
       css`
         @theme {
-          --spacing: 0.25rem;
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['space-x-4', 'space-x-[4px]', '-space-x-4'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-space-x-reverse: 0;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
-    :where(.-space-x-0 > :not(:last-child)) {
-      --tw-space-x-reverse: 0;
-      margin-inline: 0;
-    }
-
-    :where(.-space-x-1 > :not(:last-child)) {
-      --tw-space-x-reverse: 0;
-      margin-inline-start: calc(calc(var(--spacing) * -1) * var(--tw-space-x-reverse));
-      margin-inline-end: calc(calc(var(--spacing) * -1) * calc(1 - var(--tw-space-x-reverse)));
-    }
-
     :where(.-space-x-4 > :not(:last-child)) {
       --tw-space-x-reverse: 0;
       margin-inline-start: calc(calc(var(--spacing-4) * -1) * var(--tw-space-x-reverse));
       margin-inline-end: calc(calc(var(--spacing-4) * -1) * calc(1 - var(--tw-space-x-reverse)));
     }
 
-    :where(.space-x-0 > :not(:last-child)) {
-      --tw-space-x-reverse: 0;
-      margin-inline: 0;
-    }
-
-    :where(.space-x-1 > :not(:last-child)) {
-      --tw-space-x-reverse: 0;
-      margin-inline-start: calc(var(--spacing) * var(--tw-space-x-reverse));
-      margin-inline-end: calc(var(--spacing) * calc(1 - var(--tw-space-x-reverse)));
-    }
-
     :where(.space-x-4 > :not(:last-child)) {
       --tw-space-x-reverse: 0;
       margin-inline-start: calc(var(--spacing-4) * var(--tw-space-x-reverse));
       margin-inline-end: calc(var(--spacing-4) * calc(1 - var(--tw-space-x-reverse)));
     }
 
-    :where(.space-x-\\[-0\\] > :not(:last-child)), :where(.space-x-\\[-0px\\] > :not(:last-child)), :where(.space-x-\\[0\\] > :not(:last-child)), :where(.space-x-\\[0px\\] > :not(:last-child)) {
-      --tw-space-x-reverse: 0;
-      margin-inline: 0;
-    }
-
     :where(.space-x-\\[4px\\] > :not(:last-child)) {
       --tw-space-x-reverse: 0;
       margin-inline-start: calc(4px * var(--tw-space-x-reverse));
@@ -10041,90 +7656,39 @@ test('space-x', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(await run(['space-x', 'space-x-4/foo', 'space-x-[4px]/foo', '-space-x-4/foo'])).toEqual('')
 })
 
 test('space-y', async () => {
   expect(
-    await run(
-      [
-        'space-y-0',
-        'space-y-[0]',
-        'space-y-[0px]',
-        '-space-y-0',
-        'space-y-[-0]',
-        'space-y-[-0px]',
-        'space-y-1',
-        '-space-y-1',
-        'space-y-4',
-        'space-y-[4px]',
-        '-space-y-4',
-      ],
+    await compileCss(
       css`
         @theme {
-          --spacing: 0.25rem;
           --spacing-4: 1rem;
         }
         @tailwind utilities;
       `,
+      ['space-y-4', 'space-y-[4px]', '-space-y-4'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-space-y-reverse: 0;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
+    ":root, :host {
       --spacing-4: 1rem;
     }
 
-    :where(.-space-y-0 > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block: 0;
-    }
-
-    :where(.-space-y-1 > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block-start: calc(calc(var(--spacing) * -1) * var(--tw-space-y-reverse));
-      margin-block-end: calc(calc(var(--spacing) * -1) * calc(1 - var(--tw-space-y-reverse)));
-    }
-
     :where(.-space-y-4 > :not(:last-child)) {
       --tw-space-y-reverse: 0;
       margin-block-start: calc(calc(var(--spacing-4) * -1) * var(--tw-space-y-reverse));
       margin-block-end: calc(calc(var(--spacing-4) * -1) * calc(1 - var(--tw-space-y-reverse)));
     }
 
-    :where(.space-y-0 > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block: 0;
-    }
-
-    :where(.space-y-1 > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block-start: calc(var(--spacing) * var(--tw-space-y-reverse));
-      margin-block-end: calc(var(--spacing) * calc(1 - var(--tw-space-y-reverse)));
-    }
-
     :where(.space-y-4 > :not(:last-child)) {
       --tw-space-y-reverse: 0;
       margin-block-start: calc(var(--spacing-4) * var(--tw-space-y-reverse));
       margin-block-end: calc(var(--spacing-4) * calc(1 - var(--tw-space-y-reverse)));
     }
 
-    :where(.space-y-\\[-0\\] > :not(:last-child)), :where(.space-y-\\[-0px\\] > :not(:last-child)), :where(.space-y-\\[0\\] > :not(:last-child)), :where(.space-y-\\[0px\\] > :not(:last-child)) {
-      --tw-space-y-reverse: 0;
-      margin-block: 0;
-    }
-
     :where(.space-y-\\[4px\\] > :not(:last-child)) {
       --tw-space-y-reverse: 0;
       margin-block-start: calc(4px * var(--tw-space-y-reverse));
@@ -10135,24 +7699,14 @@ test('space-y', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(await run(['space-y', 'space-y-4/foo', 'space-y-[4px]/foo', '-space-y-4/foo'])).toEqual('')
 })
 
 test('space-x-reverse', async () => {
   expect(await run(['space-x-reverse'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-space-x-reverse: 0;
-        }
-      }
-    }
-
-    :where(.space-x-reverse > :not(:last-child)) {
+    ":where(.space-x-reverse > :not(:last-child)) {
       --tw-space-x-reverse: 1;
     }
 
@@ -10160,24 +7714,14 @@ test('space-x-reverse', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(await run(['-space-x-reverse', 'space-x-reverse/foo'])).toEqual('')
 })
 
 test('space-y-reverse', async () => {
   expect(await run(['space-y-reverse'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-space-y-reverse: 0;
-        }
-      }
-    }
-
-    :where(.space-y-reverse > :not(:last-child)) {
+    ":where(.space-y-reverse > :not(:last-child)) {
       --tw-space-y-reverse: 1;
     }
 
@@ -10185,73 +7729,60 @@ test('space-y-reverse', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(await run(['-space-y-reverse', 'space-y-reverse/foo'])).toEqual('')
 })
 
 test('divide-x', async () => {
-  expect(await run(['divide-x', 'divide-x-0', 'divide-x-4', 'divide-x-123', 'divide-x-[4px]']))
-    .toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-divide-x-reverse: 0;
-            --tw-border-style: solid;
-          }
-        }
-      }
+  expect(
+    await compileCss(
+      css`
+        @tailwind utilities;
+      `,
+      ['divide-x', 'divide-x-4', 'divide-x-123', 'divide-x-[4px]'],
+    ),
+  ).toMatchInlineSnapshot(`
+    ":where(.divide-x > :not(:last-child)) {
+      --tw-divide-x-reverse: 0;
+      border-inline-style: var(--tw-border-style);
+      border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
+      border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
+    }
 
-      :where(.divide-x > :not(:last-child)) {
-        --tw-divide-x-reverse: 0;
-        border-inline-style: var(--tw-border-style);
-        border-inline-start-width: calc(1px * var(--tw-divide-x-reverse));
-        border-inline-end-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
-      }
+    :where(.divide-x-4 > :not(:last-child)) {
+      --tw-divide-x-reverse: 0;
+      border-inline-style: var(--tw-border-style);
+      border-inline-start-width: calc(4px * var(--tw-divide-x-reverse));
+      border-inline-end-width: calc(4px * calc(1 - var(--tw-divide-x-reverse)));
+    }
 
-      :where(.divide-x-0 > :not(:last-child)) {
-        --tw-divide-x-reverse: 0;
-        border-inline-style: var(--tw-border-style);
-        border-inline-start-width: calc(0px * var(--tw-divide-x-reverse));
-        border-inline-end-width: calc(0px * calc(1 - var(--tw-divide-x-reverse)));
-      }
+    :where(.divide-x-123 > :not(:last-child)) {
+      --tw-divide-x-reverse: 0;
+      border-inline-style: var(--tw-border-style);
+      border-inline-start-width: calc(123px * var(--tw-divide-x-reverse));
+      border-inline-end-width: calc(123px * calc(1 - var(--tw-divide-x-reverse)));
+    }
 
-      :where(.divide-x-4 > :not(:last-child)) {
-        --tw-divide-x-reverse: 0;
-        border-inline-style: var(--tw-border-style);
-        border-inline-start-width: calc(4px * var(--tw-divide-x-reverse));
-        border-inline-end-width: calc(4px * calc(1 - var(--tw-divide-x-reverse)));
-      }
+    :where(.divide-x-\\[4px\\] > :not(:last-child)) {
+      --tw-divide-x-reverse: 0;
+      border-inline-style: var(--tw-border-style);
+      border-inline-start-width: calc(4px * var(--tw-divide-x-reverse));
+      border-inline-end-width: calc(4px * calc(1 - var(--tw-divide-x-reverse)));
+    }
 
-      :where(.divide-x-123 > :not(:last-child)) {
-        --tw-divide-x-reverse: 0;
-        border-inline-style: var(--tw-border-style);
-        border-inline-start-width: calc(123px * var(--tw-divide-x-reverse));
-        border-inline-end-width: calc(123px * calc(1 - var(--tw-divide-x-reverse)));
-      }
+    @property --tw-divide-x-reverse {
+      syntax: "*";
+      inherits: false;
+      initial-value: 0;
+    }
 
-      :where(.divide-x-\\[4px\\] > :not(:last-child)) {
-        --tw-divide-x-reverse: 0;
-        border-inline-style: var(--tw-border-style);
-        border-inline-start-width: calc(4px * var(--tw-divide-x-reverse));
-        border-inline-end-width: calc(4px * calc(1 - var(--tw-divide-x-reverse)));
-      }
-
-      @property --tw-divide-x-reverse {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0;
-      }
-
-      @property --tw-border-style {
-        syntax: "*";
-        inherits: false;
-        initial-value: solid;
-      }
-      "
-    `)
+    @property --tw-border-style {
+      syntax: "*";
+      inherits: false;
+      initial-value: solid;
+    }"
+  `)
   expect(
     await run([
       '-divide-x',
@@ -10269,27 +7800,17 @@ test('divide-x', async () => {
 
 test('divide-x with custom default border width', async () => {
   expect(
-    await run(
-      ['divide-x'],
+    await compileCss(
       css`
         @theme {
           --default-border-width: 2px;
         }
         @tailwind utilities;
       `,
+      ['divide-x'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-divide-x-reverse: 0;
-          --tw-border-style: solid;
-        }
-      }
-    }
-
-    :where(.divide-x > :not(:last-child)) {
+    ":where(.divide-x > :not(:last-child)) {
       --tw-divide-x-reverse: 0;
       border-inline-style: var(--tw-border-style);
       border-inline-start-width: calc(2px * var(--tw-divide-x-reverse));
@@ -10306,78 +7827,64 @@ test('divide-x with custom default border width', async () => {
       syntax: "*";
       inherits: false;
       initial-value: solid;
-    }
-    "
+    }"
   `)
   expect(await run(['divide-x/foo'])).toEqual('')
 })
 
 test('divide-y', async () => {
-  expect(await run(['divide-y', 'divide-y-0', 'divide-y-4', 'divide-y-123', 'divide-y-[4px]']))
-    .toMatchInlineSnapshot(`
-      "
-      @layer properties {
-        @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-          *, :before, :after, ::backdrop {
-            --tw-divide-y-reverse: 0;
-            --tw-border-style: solid;
-          }
-        }
-      }
+  expect(
+    await compileCss(
+      css`
+        @tailwind utilities;
+      `,
+      ['divide-y', 'divide-y-4', 'divide-y-123', 'divide-y-[4px]'],
+    ),
+  ).toMatchInlineSnapshot(`
+    ":where(.divide-y > :not(:last-child)) {
+      --tw-divide-y-reverse: 0;
+      border-bottom-style: var(--tw-border-style);
+      border-top-style: var(--tw-border-style);
+      border-top-width: calc(1px * var(--tw-divide-y-reverse));
+      border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
+    }
 
-      :where(.divide-y > :not(:last-child)) {
-        --tw-divide-y-reverse: 0;
-        border-bottom-style: var(--tw-border-style);
-        border-top-style: var(--tw-border-style);
-        border-top-width: calc(1px * var(--tw-divide-y-reverse));
-        border-bottom-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
-      }
+    :where(.divide-y-4 > :not(:last-child)) {
+      --tw-divide-y-reverse: 0;
+      border-bottom-style: var(--tw-border-style);
+      border-top-style: var(--tw-border-style);
+      border-top-width: calc(4px * var(--tw-divide-y-reverse));
+      border-bottom-width: calc(4px * calc(1 - var(--tw-divide-y-reverse)));
+    }
 
-      :where(.divide-y-0 > :not(:last-child)) {
-        --tw-divide-y-reverse: 0;
-        border-bottom-style: var(--tw-border-style);
-        border-top-style: var(--tw-border-style);
-        border-top-width: calc(0px * var(--tw-divide-y-reverse));
-        border-bottom-width: calc(0px * calc(1 - var(--tw-divide-y-reverse)));
-      }
+    :where(.divide-y-123 > :not(:last-child)) {
+      --tw-divide-y-reverse: 0;
+      border-bottom-style: var(--tw-border-style);
+      border-top-style: var(--tw-border-style);
+      border-top-width: calc(123px * var(--tw-divide-y-reverse));
+      border-bottom-width: calc(123px * calc(1 - var(--tw-divide-y-reverse)));
+    }
 
-      :where(.divide-y-4 > :not(:last-child)) {
-        --tw-divide-y-reverse: 0;
-        border-bottom-style: var(--tw-border-style);
-        border-top-style: var(--tw-border-style);
-        border-top-width: calc(4px * var(--tw-divide-y-reverse));
-        border-bottom-width: calc(4px * calc(1 - var(--tw-divide-y-reverse)));
-      }
+    :where(.divide-y-\\[4px\\] > :not(:last-child)) {
+      --tw-divide-y-reverse: 0;
+      border-bottom-style: var(--tw-border-style);
+      border-top-style: var(--tw-border-style);
+      border-top-width: calc(4px * var(--tw-divide-y-reverse));
+      border-bottom-width: calc(4px * calc(1 - var(--tw-divide-y-reverse)));
+    }
 
-      :where(.divide-y-123 > :not(:last-child)) {
-        --tw-divide-y-reverse: 0;
-        border-bottom-style: var(--tw-border-style);
-        border-top-style: var(--tw-border-style);
-        border-top-width: calc(123px * var(--tw-divide-y-reverse));
-        border-bottom-width: calc(123px * calc(1 - var(--tw-divide-y-reverse)));
-      }
+    @property --tw-divide-y-reverse {
+      syntax: "*";
+      inherits: false;
+      initial-value: 0;
+    }
 
-      :where(.divide-y-\\[4px\\] > :not(:last-child)) {
-        --tw-divide-y-reverse: 0;
-        border-bottom-style: var(--tw-border-style);
-        border-top-style: var(--tw-border-style);
-        border-top-width: calc(4px * var(--tw-divide-y-reverse));
-        border-bottom-width: calc(4px * calc(1 - var(--tw-divide-y-reverse)));
-      }
-
-      @property --tw-divide-y-reverse {
-        syntax: "*";
-        inherits: false;
-        initial-value: 0;
-      }
-
-      @property --tw-border-style {
-        syntax: "*";
-        inherits: false;
-        initial-value: solid;
-      }
-      "
-    `)
+    @property --tw-border-style {
+      syntax: "*";
+      inherits: false;
+      initial-value: solid;
+    }"
+  `)
   expect(
     await run([
       '-divide-y',
@@ -10395,27 +7902,17 @@ test('divide-y', async () => {
 
 test('divide-y with custom default border width', async () => {
   expect(
-    await run(
-      ['divide-y'],
+    await compileCss(
       css`
         @theme {
           --default-border-width: 2px;
         }
         @tailwind utilities;
       `,
+      ['divide-y'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-divide-y-reverse: 0;
-          --tw-border-style: solid;
-        }
-      }
-    }
-
-    :where(.divide-y > :not(:last-child)) {
+    ":where(.divide-y > :not(:last-child)) {
       --tw-divide-y-reverse: 0;
       border-bottom-style: var(--tw-border-style);
       border-top-style: var(--tw-border-style);
@@ -10433,24 +7930,14 @@ test('divide-y with custom default border width', async () => {
       syntax: "*";
       inherits: false;
       initial-value: solid;
-    }
-    "
+    }"
   `)
   expect(await run(['divide-y/foo'])).toEqual('')
 })
 
 test('divide-x-reverse', async () => {
   expect(await run(['divide-x-reverse'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-divide-x-reverse: 0;
-        }
-      }
-    }
-
-    :where(.divide-x-reverse > :not(:last-child)) {
+    ":where(.divide-x-reverse > :not(:last-child)) {
       --tw-divide-x-reverse: 1;
     }
 
@@ -10458,24 +7945,14 @@ test('divide-x-reverse', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(await run(['-divide-x-reverse', 'divide-x-reverse/foo'])).toEqual('')
 })
 
 test('divide-y-reverse', async () => {
   expect(await run(['divide-y-reverse'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-divide-y-reverse: 0;
-        }
-      }
-    }
-
-    :where(.divide-y-reverse > :not(:last-child)) {
+    ":where(.divide-y-reverse > :not(:last-child)) {
       --tw-divide-y-reverse: 1;
     }
 
@@ -10483,8 +7960,7 @@ test('divide-y-reverse', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0;
-    }
-    "
+    }"
   `)
   expect(await run(['-divide-y-reverse', 'divide-y-reverse/foo'])).toEqual('')
 })
@@ -10493,33 +7969,31 @@ test('divide-style', async () => {
   expect(
     await run(['divide-solid', 'divide-dashed', 'divide-dotted', 'divide-double', 'divide-none']),
   ).toMatchInlineSnapshot(`
-    "
-    :where(.divide-dashed > :not(:last-child)) {
-      --tw-border-style: dashed;
-      border-style: dashed;
-    }
+      ":where(.divide-dashed > :not(:last-child)) {
+        --tw-border-style: dashed;
+        border-style: dashed;
+      }
 
-    :where(.divide-dotted > :not(:last-child)) {
-      --tw-border-style: dotted;
-      border-style: dotted;
-    }
+      :where(.divide-dotted > :not(:last-child)) {
+        --tw-border-style: dotted;
+        border-style: dotted;
+      }
 
-    :where(.divide-double > :not(:last-child)) {
-      --tw-border-style: double;
-      border-style: double;
-    }
+      :where(.divide-double > :not(:last-child)) {
+        --tw-border-style: double;
+        border-style: double;
+      }
 
-    :where(.divide-none > :not(:last-child)) {
-      --tw-border-style: none;
-      border-style: none;
-    }
+      :where(.divide-none > :not(:last-child)) {
+        --tw-border-style: none;
+        border-style: none;
+      }
 
-    :where(.divide-solid > :not(:last-child)) {
-      --tw-border-style: solid;
-      border-style: solid;
-    }
-    "
-  `)
+      :where(.divide-solid > :not(:last-child)) {
+        --tw-border-style: solid;
+        border-style: solid;
+      }"
+    `)
   expect(
     await run([
       'divide',
@@ -10539,7 +8013,13 @@ test('divide-style', async () => {
 
 test('accent', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         'accent-red-500',
         'accent-red-500/50',
@@ -10548,7 +8028,6 @@ test('accent', async () => {
         'accent-red-500/2.75',
         'accent-red-500/[0.5]',
         'accent-red-500/[50%]',
-        'accent-blue-500',
         'accent-current',
         'accent-current/50',
         'accent-current/[0.5]',
@@ -10560,19 +8039,10 @@ test('accent', async () => {
         'accent-[#0088cc]/[0.5]',
         'accent-[#0088cc]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --accent-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --accent-color-blue-500: #3b82f6;
     }
 
     .accent-\\[\\#0088cc\\] {
@@ -10580,41 +8050,15 @@ test('accent', async () => {
     }
 
     .accent-\\[\\#0088cc\\]\\/50, .accent-\\[\\#0088cc\\]\\/\\[0\\.5\\], .accent-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      accent-color: oklab(59.9824% -.067 -.124 / .5);
+      accent-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .accent-blue-500 {
-      accent-color: var(--accent-color-blue-500);
-    }
-
-    .accent-current, .accent-current\\/50 {
+    .accent-current {
       accent-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-current\\/50 {
-        accent-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .accent-current\\/\\[0\\.5\\] {
-      accent-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-current\\/\\[0\\.5\\] {
-        accent-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .accent-current\\/\\[50\\%\\] {
-      accent-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-current\\/\\[50\\%\\] {
-        accent-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .accent-current\\/50, .accent-current\\/\\[0\\.5\\], .accent-current\\/\\[50\\%\\] {
+      accent-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .accent-inherit {
@@ -10626,69 +8070,24 @@ test('accent', async () => {
     }
 
     .accent-red-500\\/2\\.5 {
-      accent-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-red-500\\/2\\.5 {
-        accent-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      accent-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .accent-red-500\\/2\\.25 {
-      accent-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-red-500\\/2\\.25 {
-        accent-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      accent-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .accent-red-500\\/2\\.75 {
-      accent-color: #ef444407;
+      accent-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-red-500\\/2\\.75 {
-        accent-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .accent-red-500\\/50 {
-      accent-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-red-500\\/50 {
-        accent-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .accent-red-500\\/\\[0\\.5\\] {
-      accent-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-red-500\\/\\[0\\.5\\] {
-        accent-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .accent-red-500\\/\\[50\\%\\] {
-      accent-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .accent-red-500\\/\\[50\\%\\] {
-        accent-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .accent-red-500\\/50, .accent-red-500\\/\\[0\\.5\\], .accent-red-500\\/\\[50\\%\\] {
+      accent-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .accent-transparent {
       accent-color: #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -10729,7 +8128,13 @@ test('accent', async () => {
 
 test('caret', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         'caret-red-500',
         'caret-red-500/50',
@@ -10738,7 +8143,6 @@ test('caret', async () => {
         'caret-red-500/2.75',
         'caret-red-500/[0.5]',
         'caret-red-500/[50%]',
-        'caret-blue-500',
         'caret-current',
         'caret-current/50',
         'caret-current/[0.5]',
@@ -10750,19 +8154,10 @@ test('caret', async () => {
         'caret-[#0088cc]/[0.5]',
         'caret-[#0088cc]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --caret-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --caret-color-blue-500: #3b82f6;
     }
 
     .caret-\\[\\#0088cc\\] {
@@ -10770,41 +8165,15 @@ test('caret', async () => {
     }
 
     .caret-\\[\\#0088cc\\]\\/50, .caret-\\[\\#0088cc\\]\\/\\[0\\.5\\], .caret-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      caret-color: oklab(59.9824% -.067 -.124 / .5);
+      caret-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .caret-blue-500 {
-      caret-color: var(--caret-color-blue-500);
-    }
-
-    .caret-current, .caret-current\\/50 {
+    .caret-current {
       caret-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-current\\/50 {
-        caret-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .caret-current\\/\\[0\\.5\\] {
-      caret-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-current\\/\\[0\\.5\\] {
-        caret-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .caret-current\\/\\[50\\%\\] {
-      caret-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-current\\/\\[50\\%\\] {
-        caret-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .caret-current\\/50, .caret-current\\/\\[0\\.5\\], .caret-current\\/\\[50\\%\\] {
+      caret-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .caret-inherit {
@@ -10816,69 +8185,24 @@ test('caret', async () => {
     }
 
     .caret-red-500\\/2\\.5 {
-      caret-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-red-500\\/2\\.5 {
-        caret-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      caret-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .caret-red-500\\/2\\.25 {
-      caret-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-red-500\\/2\\.25 {
-        caret-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      caret-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .caret-red-500\\/2\\.75 {
-      caret-color: #ef444407;
+      caret-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-red-500\\/2\\.75 {
-        caret-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .caret-red-500\\/50 {
-      caret-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-red-500\\/50 {
-        caret-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .caret-red-500\\/\\[0\\.5\\] {
-      caret-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-red-500\\/\\[0\\.5\\] {
-        caret-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .caret-red-500\\/\\[50\\%\\] {
-      caret-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .caret-red-500\\/\\[50\\%\\] {
-        caret-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .caret-red-500\\/50, .caret-red-500\\/\\[0\\.5\\], .caret-red-500\\/\\[50\\%\\] {
+      caret-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .caret-transparent {
       caret-color: #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -10917,7 +8241,13 @@ test('caret', async () => {
 
 test('divide-color', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         'divide-red-500',
         'divide-red-500/50',
@@ -10926,7 +8256,6 @@ test('divide-color', async () => {
         'divide-red-500/2.75',
         'divide-red-500/[0.5]',
         'divide-red-500/[50%]',
-        'divide-best-blue',
         'divide-current',
         'divide-current/50',
         'divide-current/[0.5]',
@@ -10938,19 +8267,10 @@ test('divide-color', async () => {
         'divide-[#0088cc]/[0.5]',
         'divide-[#0088cc]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --border-color-best-blue: #6495ed;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --border-color-best-blue: #6495ed;
     }
 
     :where(.divide-\\[\\#0088cc\\] > :not(:last-child)) {
@@ -10958,41 +8278,15 @@ test('divide-color', async () => {
     }
 
     :where(.divide-\\[\\#0088cc\\]\\/50 > :not(:last-child)), :where(.divide-\\[\\#0088cc\\]\\/\\[0\\.5\\] > :not(:last-child)), :where(.divide-\\[\\#0088cc\\]\\/\\[50\\%\\] > :not(:last-child)) {
-      border-color: oklab(59.9824% -.067 -.124 / .5);
+      border-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    :where(.divide-best-blue > :not(:last-child)) {
-      border-color: var(--border-color-best-blue);
-    }
-
-    :where(.divide-current > :not(:last-child)), :where(.divide-current\\/50 > :not(:last-child)) {
+    :where(.divide-current > :not(:last-child)) {
       border-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-current\\/50 > :not(:last-child)) {
-        border-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    :where(.divide-current\\/\\[0\\.5\\] > :not(:last-child)) {
-      border-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-current\\/\\[0\\.5\\] > :not(:last-child)) {
-        border-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    :where(.divide-current\\/\\[50\\%\\] > :not(:last-child)) {
-      border-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-current\\/\\[50\\%\\] > :not(:last-child)) {
-        border-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    :where(.divide-current\\/50 > :not(:last-child)), :where(.divide-current\\/\\[0\\.5\\] > :not(:last-child)), :where(.divide-current\\/\\[50\\%\\] > :not(:last-child)) {
+      border-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     :where(.divide-inherit > :not(:last-child)) {
@@ -11004,69 +8298,24 @@ test('divide-color', async () => {
     }
 
     :where(.divide-red-500\\/2\\.5 > :not(:last-child)) {
-      border-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-red-500\\/2\\.5 > :not(:last-child)) {
-        border-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      border-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     :where(.divide-red-500\\/2\\.25 > :not(:last-child)) {
-      border-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-red-500\\/2\\.25 > :not(:last-child)) {
-        border-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      border-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     :where(.divide-red-500\\/2\\.75 > :not(:last-child)) {
-      border-color: #ef444407;
+      border-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-red-500\\/2\\.75 > :not(:last-child)) {
-        border-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    :where(.divide-red-500\\/50 > :not(:last-child)) {
-      border-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-red-500\\/50 > :not(:last-child)) {
-        border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    :where(.divide-red-500\\/\\[0\\.5\\] > :not(:last-child)) {
-      border-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-red-500\\/\\[0\\.5\\] > :not(:last-child)) {
-        border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    :where(.divide-red-500\\/\\[50\\%\\] > :not(:last-child)) {
-      border-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      :where(.divide-red-500\\/\\[50\\%\\] > :not(:last-child)) {
-        border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    :where(.divide-red-500\\/50 > :not(:last-child)), :where(.divide-red-500\\/\\[0\\.5\\] > :not(:last-child)), :where(.divide-red-500\\/\\[50\\%\\] > :not(:last-child)) {
+      border-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     :where(.divide-transparent > :not(:last-child)) {
       border-color: #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11115,8 +8364,7 @@ test('place-self', async () => {
       'place-self-stretch',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .place-self-auto {
+    ".place-self-auto {
       place-self: auto;
     }
 
@@ -11142,8 +8390,7 @@ test('place-self', async () => {
 
     .place-self-stretch {
       place-self: stretch stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11173,11 +8420,9 @@ test('self', async () => {
       'self-center-safe',
       'self-stretch',
       'self-baseline',
-      'self-baseline-last',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .self-auto {
+    ".self-auto {
       align-self: auto;
     }
 
@@ -11185,10 +8430,6 @@ test('self', async () => {
       align-self: baseline;
     }
 
-    .self-baseline-last {
-      align-self: last baseline;
-    }
-
     .self-center {
       align-self: center;
     }
@@ -11211,8 +8452,7 @@ test('self', async () => {
 
     .self-stretch {
       align-self: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11246,8 +8486,7 @@ test('justify-self', async () => {
       'justify-self-baseline',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .justify-self-auto {
+    ".justify-self-auto {
       justify-self: auto;
     }
 
@@ -11273,8 +8512,7 @@ test('justify-self', async () => {
 
     .justify-self-stretch {
       justify-self: stretch;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11305,8 +8543,7 @@ test('overflow', async () => {
       'overflow-scroll',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .overflow-auto {
+    ".overflow-auto {
       overflow: auto;
     }
 
@@ -11324,8 +8561,7 @@ test('overflow', async () => {
 
     .overflow-visible {
       overflow: visible;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11354,8 +8590,7 @@ test('overflow-x', async () => {
       'overflow-x-scroll',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .overflow-x-auto {
+    ".overflow-x-auto {
       overflow-x: auto;
     }
 
@@ -11373,8 +8608,7 @@ test('overflow-x', async () => {
 
     .overflow-x-visible {
       overflow-x: visible;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11403,8 +8637,7 @@ test('overflow-y', async () => {
       'overflow-y-scroll',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .overflow-y-auto {
+    ".overflow-y-auto {
       overflow-y: auto;
     }
 
@@ -11422,8 +8655,7 @@ test('overflow-y', async () => {
 
     .overflow-y-visible {
       overflow-y: visible;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11445,20 +8677,18 @@ test('overflow-y', async () => {
 test('overscroll', async () => {
   expect(await run(['overscroll-auto', 'overscroll-contain', 'overscroll-none']))
     .toMatchInlineSnapshot(`
-      "
-      .overscroll-auto {
-        overscroll-behavior: auto;
-      }
+    ".overscroll-auto {
+      overscroll-behavior: auto;
+    }
 
-      .overscroll-contain {
-        overscroll-behavior: contain;
-      }
+    .overscroll-contain {
+      overscroll-behavior: contain;
+    }
 
-      .overscroll-none {
-        overscroll-behavior: none;
-      }
-      "
-    `)
+    .overscroll-none {
+      overscroll-behavior: none;
+    }"
+  `)
   expect(
     await run([
       'overscroll',
@@ -11475,20 +8705,18 @@ test('overscroll', async () => {
 test('overscroll-x', async () => {
   expect(await run(['overscroll-x-auto', 'overscroll-x-contain', 'overscroll-x-none']))
     .toMatchInlineSnapshot(`
-      "
-      .overscroll-x-auto {
-        overscroll-behavior-x: auto;
-      }
+    ".overscroll-x-auto {
+      overscroll-behavior-x: auto;
+    }
 
-      .overscroll-x-contain {
-        overscroll-behavior-x: contain;
-      }
+    .overscroll-x-contain {
+      overscroll-behavior-x: contain;
+    }
 
-      .overscroll-x-none {
-        overscroll-behavior-x: none;
-      }
-      "
-    `)
+    .overscroll-x-none {
+      overscroll-behavior-x: none;
+    }"
+  `)
   expect(
     await run([
       'overscroll-x',
@@ -11505,20 +8733,18 @@ test('overscroll-x', async () => {
 test('overscroll-y', async () => {
   expect(await run(['overscroll-y-auto', 'overscroll-y-contain', 'overscroll-y-none']))
     .toMatchInlineSnapshot(`
-      "
-      .overscroll-y-auto {
-        overscroll-behavior-y: auto;
-      }
+    ".overscroll-y-auto {
+      overscroll-behavior-y: auto;
+    }
 
-      .overscroll-y-contain {
-        overscroll-behavior-y: contain;
-      }
+    .overscroll-y-contain {
+      overscroll-behavior-y: contain;
+    }
 
-      .overscroll-y-none {
-        overscroll-behavior-y: none;
-      }
-      "
-    `)
+    .overscroll-y-none {
+      overscroll-behavior-y: none;
+    }"
+  `)
   expect(
     await run([
       'overscroll-y',
@@ -11534,338 +8760,39 @@ test('overscroll-y', async () => {
 
 test('scroll-behavior', async () => {
   expect(await run(['scroll-auto', 'scroll-smooth'])).toMatchInlineSnapshot(`
-    "
-    .scroll-auto {
+    ".scroll-auto {
       scroll-behavior: auto;
     }
 
     .scroll-smooth {
       scroll-behavior: smooth;
-    }
-    "
+    }"
   `)
   expect(
     await run(['scroll', '-scroll-auto', '-scroll-smooth', 'scroll-auto/foo', 'scroll-smooth/foo']),
   ).toEqual('')
 })
 
-test('scrollbar-width', async () => {
-  expect(await run(['scrollbar-auto', 'scrollbar-thin', 'scrollbar-none'])).toMatchInlineSnapshot(`
-    "
-    .scrollbar-auto {
-      scrollbar-width: auto;
-    }
-
-    .scrollbar-none {
-      scrollbar-width: none;
-    }
-
-    .scrollbar-thin {
-      scrollbar-width: thin;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scrollbar',
-      '-scrollbar-auto',
-      '-scrollbar-thin',
-      '-scrollbar-none',
-      'scrollbar-auto/foo',
-      'scrollbar-thin/foo',
-      'scrollbar-none/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('scrollbar-gutter', async () => {
-  expect(await run(['scrollbar-gutter-auto', 'scrollbar-gutter-stable', 'scrollbar-gutter-both']))
-    .toMatchInlineSnapshot(`
-      "
-      .scrollbar-gutter-auto {
-        scrollbar-gutter: auto;
-      }
-
-      .scrollbar-gutter-both {
-        scrollbar-gutter: stable both-edges;
-      }
-
-      .scrollbar-gutter-stable {
-        scrollbar-gutter: stable;
-      }
-      "
-    `)
-  expect(
-    await run([
-      'scrollbar-gutter',
-      '-scrollbar-gutter-auto',
-      '-scrollbar-gutter-stable',
-      '-scrollbar-gutter-both',
-      'scrollbar-gutter-auto/foo',
-      'scrollbar-gutter-stable/foo',
-      'scrollbar-gutter-both/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('scrollbar-thumb', async () => {
-  expect(
-    await run(
-      [
-        'scrollbar-thumb-red-500',
-        'scrollbar-thumb-red-500/50',
-        'scrollbar-thumb-red-500/[0.5]',
-        'scrollbar-thumb-current',
-        'scrollbar-thumb-inherit',
-        'scrollbar-thumb-transparent',
-        'scrollbar-thumb-[#0088cc]',
-        'scrollbar-thumb-[#0088cc]/50',
-      ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scrollbar-thumb: #0000;
-          --tw-scrollbar-track: #0000;
-        }
-      }
-    }
-
-    :root, :host {
-      --color-red-500: #ef4444;
-    }
-
-    .scrollbar-thumb-\\[\\#0088cc\\] {
-      --tw-scrollbar-thumb: #08c;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-\\[\\#0088cc\\]\\/50 {
-      --tw-scrollbar-thumb: oklab(59.9824% -.067 -.124 / .5);
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-current {
-      --tw-scrollbar-thumb: currentcolor;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-inherit {
-      --tw-scrollbar-thumb: inherit;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-red-500 {
-      --tw-scrollbar-thumb: var(--color-red-500);
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-red-500\\/50 {
-      --tw-scrollbar-thumb: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .scrollbar-thumb-red-500\\/50 {
-        --tw-scrollbar-thumb: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .scrollbar-thumb-red-500\\/50 {
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-red-500\\/\\[0\\.5\\] {
-      --tw-scrollbar-thumb: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .scrollbar-thumb-red-500\\/\\[0\\.5\\] {
-        --tw-scrollbar-thumb: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .scrollbar-thumb-red-500\\/\\[0\\.5\\] {
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-thumb-transparent {
-      --tw-scrollbar-thumb: transparent;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    @property --tw-scrollbar-thumb {
-      syntax: "<color>";
-      inherits: false;
-      initial-value: #0000;
-    }
-
-    @property --tw-scrollbar-track {
-      syntax: "<color>";
-      inherits: false;
-      initial-value: #0000;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scrollbar-thumb',
-      '-scrollbar-thumb-red-500',
-      '-scrollbar-thumb-red-500/50',
-      'scrollbar-thumb-red-500/foo',
-      'scrollbar-thumb-[#0088cc]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('scrollbar-track', async () => {
-  expect(
-    await run(
-      [
-        'scrollbar-track-red-500',
-        'scrollbar-track-red-500/50',
-        'scrollbar-track-red-500/[0.5]',
-        'scrollbar-track-current',
-        'scrollbar-track-inherit',
-        'scrollbar-track-transparent',
-        'scrollbar-track-[#0088cc]',
-        'scrollbar-track-[#0088cc]/50',
-      ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-scrollbar-thumb: #0000;
-          --tw-scrollbar-track: #0000;
-        }
-      }
-    }
-
-    :root, :host {
-      --color-red-500: #ef4444;
-    }
-
-    .scrollbar-track-\\[\\#0088cc\\] {
-      --tw-scrollbar-track: #08c;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-\\[\\#0088cc\\]\\/50 {
-      --tw-scrollbar-track: oklab(59.9824% -.067 -.124 / .5);
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-current {
-      --tw-scrollbar-track: currentcolor;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-inherit {
-      --tw-scrollbar-track: inherit;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-red-500 {
-      --tw-scrollbar-track: var(--color-red-500);
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-red-500\\/50 {
-      --tw-scrollbar-track: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .scrollbar-track-red-500\\/50 {
-        --tw-scrollbar-track: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .scrollbar-track-red-500\\/50 {
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-red-500\\/\\[0\\.5\\] {
-      --tw-scrollbar-track: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .scrollbar-track-red-500\\/\\[0\\.5\\] {
-        --tw-scrollbar-track: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .scrollbar-track-red-500\\/\\[0\\.5\\] {
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    .scrollbar-track-transparent {
-      --tw-scrollbar-track: transparent;
-      scrollbar-color: var(--tw-scrollbar-thumb) var(--tw-scrollbar-track);
-    }
-
-    @property --tw-scrollbar-thumb {
-      syntax: "<color>";
-      inherits: false;
-      initial-value: #0000;
-    }
-
-    @property --tw-scrollbar-track {
-      syntax: "<color>";
-      inherits: false;
-      initial-value: #0000;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'scrollbar-track',
-      '-scrollbar-track-red-500',
-      '-scrollbar-track-red-500/50',
-      'scrollbar-track-red-500/foo',
-      'scrollbar-track-[#0088cc]/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('truncate', async () => {
   expect(await run(['truncate'])).toMatchInlineSnapshot(`
-    "
-    .truncate {
+    ".truncate {
       text-overflow: ellipsis;
       white-space: nowrap;
       overflow: hidden;
-    }
-    "
+    }"
   `)
   expect(await run(['-truncate', 'truncate/foo'])).toEqual('')
 })
 
 test('text-overflow', async () => {
   expect(await run(['text-ellipsis', 'text-clip'])).toMatchInlineSnapshot(`
-    "
-    .text-clip {
+    ".text-clip {
       text-overflow: clip;
     }
 
     .text-ellipsis {
       text-overflow: ellipsis;
-    }
-    "
+    }"
   `)
   expect(await run(['-text-ellipsis', '-text-clip', 'text-ellipsis/foo', 'text-clip/foo'])).toEqual(
     '',
@@ -11874,8 +8801,7 @@ test('text-overflow', async () => {
 
 test('hyphens', async () => {
   expect(await run(['hyphens-none', 'hyphens-manual', 'hyphens-auto'])).toMatchInlineSnapshot(`
-    "
-    .hyphens-auto {
+    ".hyphens-auto {
       -webkit-hyphens: auto;
       hyphens: auto;
     }
@@ -11888,8 +8814,7 @@ test('hyphens', async () => {
     .hyphens-none {
       -webkit-hyphens: none;
       hyphens: none;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11915,8 +8840,7 @@ test('whitespace', async () => {
       'whitespace-break-spaces',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .whitespace-break-spaces {
+    ".whitespace-break-spaces {
       white-space: break-spaces;
     }
 
@@ -11938,8 +8862,7 @@ test('whitespace', async () => {
 
     .whitespace-pre-wrap {
       white-space: pre-wrap;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -11960,60 +8883,25 @@ test('whitespace', async () => {
   ).toEqual('')
 })
 
-test('tab', async () => {
-  expect(await run(['tab-2', 'tab-8', 'tab-[12px]', 'tab-[3]'])).toMatchInlineSnapshot(`
-    "
-    .tab-2 {
-      tab-size: 2;
-    }
-
-    .tab-8 {
-      tab-size: 8;
-    }
-
-    .tab-\\[3\\] {
-      tab-size: 3;
-    }
-
-    .tab-\\[12px\\] {
-      tab-size: 12px;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'tab',
-      '-tab-2',
-      'tab-2.5',
-      'tab-1/2',
-      'tab-unknown',
-      'tab-2/foo',
-      'tab-[12px]/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('text-wrap', async () => {
   expect(await run(['text-wrap', 'text-nowrap', 'text-balance', 'text-pretty']))
     .toMatchInlineSnapshot(`
-      "
-      .text-balance {
-        text-wrap: balance;
-      }
+    ".text-balance {
+      text-wrap: balance;
+    }
 
-      .text-nowrap {
-        text-wrap: nowrap;
-      }
+    .text-nowrap {
+      text-wrap: nowrap;
+    }
 
-      .text-pretty {
-        text-wrap: pretty;
-      }
+    .text-pretty {
+      text-wrap: pretty;
+    }
 
-      .text-wrap {
-        text-wrap: wrap;
-      }
-      "
-    `)
+    .text-wrap {
+      text-wrap: wrap;
+    }"
+  `)
   expect(
     await run([
       '-text-wrap',
@@ -12031,8 +8919,7 @@ test('text-wrap', async () => {
 test('word-break', async () => {
   expect(await run(['break-normal', 'break-words', 'break-all', 'break-keep']))
     .toMatchInlineSnapshot(`
-      "
-      .break-normal {
+      ".break-normal {
         overflow-wrap: normal;
         word-break: normal;
       }
@@ -12047,8 +8934,7 @@ test('word-break', async () => {
 
       .break-keep {
         word-break: keep-all;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -12066,8 +8952,7 @@ test('word-break', async () => {
 
 test('overflow-wrap', async () => {
   expect(await run(['wrap-anywhere', 'wrap-break-word', 'wrap-normal'])).toMatchInlineSnapshot(`
-    "
-    .wrap-anywhere {
+    ".wrap-anywhere {
       overflow-wrap: anywhere;
     }
 
@@ -12077,8 +8962,7 @@ test('overflow-wrap', async () => {
 
     .wrap-normal {
       overflow-wrap: normal;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12094,8 +8978,7 @@ test('overflow-wrap', async () => {
 
 test('rounded', async () => {
   expect(
-    await run(
-      ['rounded', 'rounded-full', 'rounded-none', 'rounded-sm', 'rounded-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-sm: 0.125rem;
@@ -12103,10 +8986,10 @@ test('rounded', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded', 'rounded-full', 'rounded-none', 'rounded-sm', 'rounded-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-sm: .125rem;
       --radius: .25rem;
     }
@@ -12120,7 +9003,7 @@ test('rounded', async () => {
     }
 
     .rounded-full {
-      border-radius: 2147483647px;
+      border-radius: 3.40282e38px;
     }
 
     .rounded-none {
@@ -12129,60 +9012,27 @@ test('rounded', async () => {
 
     .rounded-sm {
       border-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      ['rounded-full'],
-      css`
-        @theme {
-          --radius-full: 99999px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --radius-full: 99999px;
-    }
-
-    .rounded-full {
-      border-radius: var(--radius-full);
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        '-rounded',
-        '-rounded-full',
-        '-rounded-none',
-        '-rounded-sm',
-        '-rounded-[4px]',
-        'rounded/foo',
-        'rounded-full/foo',
-        'rounded-none/foo',
-        'rounded-sm/foo',
-        'rounded-[4px]/foo',
-        'rounded-sm/[5]',
-        'rounded-sm/(--foo)',
-      ],
-      css`
-        @theme {
-          --radius-sm: 0.125rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
+    await run([
+      '-rounded',
+      '-rounded-full',
+      '-rounded-none',
+      '-rounded-sm',
+      '-rounded-[4px]',
+      'rounded/foo',
+      'rounded-full/foo',
+      'rounded-none/foo',
+      'rounded-sm/foo',
+      'rounded-[4px]/foo',
+    ]),
   ).toEqual('')
 })
 
 test('rounded-s', async () => {
   expect(
-    await run(
-      ['rounded-s', 'rounded-s-full', 'rounded-s-none', 'rounded-s-sm', 'rounded-s-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12192,10 +9042,10 @@ test('rounded-s', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-s', 'rounded-s-full', 'rounded-s-none', 'rounded-s-sm', 'rounded-s-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12225,8 +9075,7 @@ test('rounded-s', async () => {
     .rounded-s-sm {
       border-start-start-radius: var(--radius-sm);
       border-end-start-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12246,8 +9095,7 @@ test('rounded-s', async () => {
 
 test('rounded-e', async () => {
   expect(
-    await run(
-      ['rounded-e', 'rounded-e-full', 'rounded-e-none', 'rounded-e-sm', 'rounded-e-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12257,10 +9105,10 @@ test('rounded-e', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-e', 'rounded-e-full', 'rounded-e-none', 'rounded-e-sm', 'rounded-e-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12290,8 +9138,7 @@ test('rounded-e', async () => {
     .rounded-e-sm {
       border-start-end-radius: var(--radius-sm);
       border-end-end-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12311,8 +9158,7 @@ test('rounded-e', async () => {
 
 test('rounded-t', async () => {
   expect(
-    await run(
-      ['rounded-t', 'rounded-t-full', 'rounded-t-none', 'rounded-t-sm', 'rounded-t-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12322,10 +9168,10 @@ test('rounded-t', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-t', 'rounded-t-full', 'rounded-t-none', 'rounded-t-sm', 'rounded-t-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12343,11 +9189,15 @@ test('rounded-t', async () => {
     }
 
     .rounded-t-full {
+      border-top-left-radius: 3.40282e38px;
+      border-top-right-radius: 3.40282e38px;
       border-top-left-radius: var(--radius-full);
       border-top-right-radius: var(--radius-full);
     }
 
     .rounded-t-none {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
       border-top-left-radius: var(--radius-none);
       border-top-right-radius: var(--radius-none);
     }
@@ -12355,8 +9205,7 @@ test('rounded-t', async () => {
     .rounded-t-sm {
       border-top-left-radius: var(--radius-sm);
       border-top-right-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12376,8 +9225,7 @@ test('rounded-t', async () => {
 
 test('rounded-r', async () => {
   expect(
-    await run(
-      ['rounded-r', 'rounded-r-full', 'rounded-r-none', 'rounded-r-sm', 'rounded-r-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12387,10 +9235,10 @@ test('rounded-r', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-r', 'rounded-r-full', 'rounded-r-none', 'rounded-r-sm', 'rounded-r-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12408,11 +9256,15 @@ test('rounded-r', async () => {
     }
 
     .rounded-r-full {
+      border-top-right-radius: 3.40282e38px;
+      border-bottom-right-radius: 3.40282e38px;
       border-top-right-radius: var(--radius-full);
       border-bottom-right-radius: var(--radius-full);
     }
 
     .rounded-r-none {
+      border-top-right-radius: 0;
+      border-bottom-right-radius: 0;
       border-top-right-radius: var(--radius-none);
       border-bottom-right-radius: var(--radius-none);
     }
@@ -12420,8 +9272,7 @@ test('rounded-r', async () => {
     .rounded-r-sm {
       border-top-right-radius: var(--radius-sm);
       border-bottom-right-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12441,8 +9292,7 @@ test('rounded-r', async () => {
 
 test('rounded-b', async () => {
   expect(
-    await run(
-      ['rounded-b', 'rounded-b-full', 'rounded-b-none', 'rounded-b-sm', 'rounded-b-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12452,10 +9302,10 @@ test('rounded-b', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-b', 'rounded-b-full', 'rounded-b-none', 'rounded-b-sm', 'rounded-b-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12473,11 +9323,15 @@ test('rounded-b', async () => {
     }
 
     .rounded-b-full {
+      border-bottom-right-radius: 3.40282e38px;
+      border-bottom-left-radius: 3.40282e38px;
       border-bottom-right-radius: var(--radius-full);
       border-bottom-left-radius: var(--radius-full);
     }
 
     .rounded-b-none {
+      border-bottom-right-radius: 0;
+      border-bottom-left-radius: 0;
       border-bottom-right-radius: var(--radius-none);
       border-bottom-left-radius: var(--radius-none);
     }
@@ -12485,8 +9339,7 @@ test('rounded-b', async () => {
     .rounded-b-sm {
       border-bottom-right-radius: var(--radius-sm);
       border-bottom-left-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12506,8 +9359,7 @@ test('rounded-b', async () => {
 
 test('rounded-l', async () => {
   expect(
-    await run(
-      ['rounded-l', 'rounded-l-full', 'rounded-l-none', 'rounded-l-sm', 'rounded-l-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12517,10 +9369,10 @@ test('rounded-l', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-l', 'rounded-l-full', 'rounded-l-none', 'rounded-l-sm', 'rounded-l-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12538,11 +9390,15 @@ test('rounded-l', async () => {
     }
 
     .rounded-l-full {
+      border-top-left-radius: 3.40282e38px;
+      border-bottom-left-radius: 3.40282e38px;
       border-top-left-radius: var(--radius-full);
       border-bottom-left-radius: var(--radius-full);
     }
 
     .rounded-l-none {
+      border-top-left-radius: 0;
+      border-bottom-left-radius: 0;
       border-top-left-radius: var(--radius-none);
       border-bottom-left-radius: var(--radius-none);
     }
@@ -12550,8 +9406,7 @@ test('rounded-l', async () => {
     .rounded-l-sm {
       border-top-left-radius: var(--radius-sm);
       border-bottom-left-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12571,8 +9426,7 @@ test('rounded-l', async () => {
 
 test('rounded-ss', async () => {
   expect(
-    await run(
-      ['rounded-ss', 'rounded-ss-full', 'rounded-ss-none', 'rounded-ss-sm', 'rounded-ss-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12582,10 +9436,10 @@ test('rounded-ss', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-ss', 'rounded-ss-full', 'rounded-ss-none', 'rounded-ss-sm', 'rounded-ss-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12610,8 +9464,7 @@ test('rounded-ss', async () => {
 
     .rounded-ss-sm {
       border-start-start-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12631,8 +9484,7 @@ test('rounded-ss', async () => {
 
 test('rounded-se', async () => {
   expect(
-    await run(
-      ['rounded-se', 'rounded-se-full', 'rounded-se-none', 'rounded-se-sm', 'rounded-se-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12642,10 +9494,10 @@ test('rounded-se', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-se', 'rounded-se-full', 'rounded-se-none', 'rounded-se-sm', 'rounded-se-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12670,8 +9522,7 @@ test('rounded-se', async () => {
 
     .rounded-se-sm {
       border-start-end-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12691,8 +9542,7 @@ test('rounded-se', async () => {
 
 test('rounded-ee', async () => {
   expect(
-    await run(
-      ['rounded-ee', 'rounded-ee-full', 'rounded-ee-none', 'rounded-ee-sm', 'rounded-ee-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12702,10 +9552,10 @@ test('rounded-ee', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-ee', 'rounded-ee-full', 'rounded-ee-none', 'rounded-ee-sm', 'rounded-ee-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12730,8 +9580,7 @@ test('rounded-ee', async () => {
 
     .rounded-ee-sm {
       border-end-end-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12751,8 +9600,7 @@ test('rounded-ee', async () => {
 
 test('rounded-es', async () => {
   expect(
-    await run(
-      ['rounded-es', 'rounded-es-full', 'rounded-es-none', 'rounded-es-sm', 'rounded-es-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12762,10 +9610,10 @@ test('rounded-es', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-es', 'rounded-es-full', 'rounded-es-none', 'rounded-es-sm', 'rounded-es-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12790,8 +9638,7 @@ test('rounded-es', async () => {
 
     .rounded-es-sm {
       border-end-start-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12811,8 +9658,7 @@ test('rounded-es', async () => {
 
 test('rounded-tl', async () => {
   expect(
-    await run(
-      ['rounded-tl', 'rounded-tl-full', 'rounded-tl-none', 'rounded-tl-sm', 'rounded-tl-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12822,10 +9668,10 @@ test('rounded-tl', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-tl', 'rounded-tl-full', 'rounded-tl-none', 'rounded-tl-sm', 'rounded-tl-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12841,17 +9687,18 @@ test('rounded-tl', async () => {
     }
 
     .rounded-tl-full {
+      border-top-left-radius: 3.40282e38px;
       border-top-left-radius: var(--radius-full);
     }
 
     .rounded-tl-none {
+      border-top-left-radius: 0;
       border-top-left-radius: var(--radius-none);
     }
 
     .rounded-tl-sm {
       border-top-left-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12871,8 +9718,7 @@ test('rounded-tl', async () => {
 
 test('rounded-tr', async () => {
   expect(
-    await run(
-      ['rounded-tr', 'rounded-tr-full', 'rounded-tr-none', 'rounded-tr-sm', 'rounded-tr-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12882,10 +9728,10 @@ test('rounded-tr', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-tr', 'rounded-tr-full', 'rounded-tr-none', 'rounded-tr-sm', 'rounded-tr-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12901,17 +9747,18 @@ test('rounded-tr', async () => {
     }
 
     .rounded-tr-full {
+      border-top-right-radius: 3.40282e38px;
       border-top-right-radius: var(--radius-full);
     }
 
     .rounded-tr-none {
+      border-top-right-radius: 0;
       border-top-right-radius: var(--radius-none);
     }
 
     .rounded-tr-sm {
       border-top-right-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12931,8 +9778,7 @@ test('rounded-tr', async () => {
 
 test('rounded-br', async () => {
   expect(
-    await run(
-      ['rounded-br', 'rounded-br-full', 'rounded-br-none', 'rounded-br-sm', 'rounded-br-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -12942,10 +9788,10 @@ test('rounded-br', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-br', 'rounded-br-full', 'rounded-br-none', 'rounded-br-sm', 'rounded-br-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -12961,17 +9807,18 @@ test('rounded-br', async () => {
     }
 
     .rounded-br-full {
+      border-bottom-right-radius: 3.40282e38px;
       border-bottom-right-radius: var(--radius-full);
     }
 
     .rounded-br-none {
+      border-bottom-right-radius: 0;
       border-bottom-right-radius: var(--radius-none);
     }
 
     .rounded-br-sm {
       border-bottom-right-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -12991,8 +9838,7 @@ test('rounded-br', async () => {
 
 test('rounded-bl', async () => {
   expect(
-    await run(
-      ['rounded-bl', 'rounded-bl-full', 'rounded-bl-none', 'rounded-bl-sm', 'rounded-bl-[4px]'],
+    await compileCss(
       css`
         @theme {
           --radius-none: 0px;
@@ -13002,10 +9848,10 @@ test('rounded-bl', async () => {
         }
         @tailwind utilities;
       `,
+      ['rounded-bl', 'rounded-bl-full', 'rounded-bl-none', 'rounded-bl-sm', 'rounded-bl-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --radius-none: 0px;
       --radius-full: 9999px;
       --radius-sm: .125rem;
@@ -13021,17 +9867,18 @@ test('rounded-bl', async () => {
     }
 
     .rounded-bl-full {
+      border-bottom-left-radius: 3.40282e38px;
       border-bottom-left-radius: var(--radius-full);
     }
 
     .rounded-bl-none {
+      border-bottom-left-radius: 0;
       border-bottom-left-radius: var(--radius-none);
     }
 
     .rounded-bl-sm {
       border-bottom-left-radius: var(--radius-sm);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -13060,8 +9907,7 @@ test('border-style', async () => {
       'border-none',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .border-dashed {
+    ".border-dashed {
       --tw-border-style: dashed;
       border-style: dashed;
     }
@@ -13089,8 +9935,7 @@ test('border-style', async () => {
     .border-solid {
       --tw-border-style: solid;
       border-style: solid;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -13118,8 +9963,6 @@ const prefixes = [
   'border-y',
   'border-s',
   'border-e',
-  'border-bs',
-  'border-be',
   'border-t',
   'border-r',
   'border-b',
@@ -13155,7 +9998,6 @@ for (let prefix of prefixes) {
     classes.push(`${prefix}-red-500/2.25`)
     classes.push(`${prefix}-red-500/2.5`)
     classes.push(`${prefix}-red-500/2.75`)
-    classes.push(`${prefix}-blue-500`)
     classes.push(`${prefix}-[#0088cc]`)
     classes.push(`${prefix}-[#0088cc]/50`)
     classes.push(`${prefix}-current`)
@@ -13170,18 +10012,17 @@ for (let prefix of prefixes) {
     classes.push(`${prefix}-[color:var(--my-color)]/50`)
 
     expect(
-      await run(
-        classes,
+      await compileCss(
         css`
           @theme {
             --radius-none: 0px;
             --radius-full: 9999px;
             --radius-sm: 0.125rem;
             --color-red-500: #ef4444;
-            --border-color-blue-500: #3b82f6;
           }
           @tailwind utilities;
         `,
+        classes,
       ),
     ).toMatchSnapshot()
 
@@ -13207,26 +10048,17 @@ for (let prefix of prefixes) {
 
 test('border with custom default border width', async () => {
   expect(
-    await run(
-      ['border'],
+    await compileCss(
       css`
         @theme {
           --default-border-width: 2px;
         }
         @tailwind utilities;
       `,
+      ['border'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-border-style: solid;
-        }
-      }
-    }
-
-    .border {
+    ".border {
       border-style: var(--tw-border-style);
       border-width: 2px;
     }
@@ -13235,15 +10067,20 @@ test('border with custom default border width', async () => {
       syntax: "*";
       inherits: false;
       initial-value: solid;
-    }
-    "
+    }"
   `)
   expect(await run(['-border', 'border/foo'])).toEqual('')
 })
 
 test('bg', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // background-color
         'bg-red-500',
@@ -13253,9 +10090,6 @@ test('bg', async () => {
         'bg-red-500/2.75',
         'bg-red-500/[0.5]',
         'bg-red-500/[50%]',
-        'bg-red-500/100',
-        'bg-red-500/[100%]',
-        'bg-blue-500',
         'bg-current',
         'bg-current/50',
         'bg-current/[0.5]',
@@ -13356,26 +10190,20 @@ test('bg', async () => {
         'bg-scroll',
 
         // background-position
-        'bg-top',
-        'bg-top-left',
-        'bg-top-right',
-        'bg-bottom',
-        'bg-bottom-left',
-        'bg-bottom-right',
-        'bg-left',
-        'bg-right',
         'bg-center',
+        'bg-top',
+        'bg-right-top',
+        'bg-right-bottom',
+        'bg-bottom',
+        'bg-left-bottom',
+        'bg-left',
+        'bg-left-top',
         'bg-[50%]',
         'bg-[120px]',
         'bg-[120px_120px]',
         'bg-[length:120px_120px]',
         'bg-[position:120px_120px]',
         'bg-[size:120px_120px]',
-        // Legacy versions in v4.0 and earlier
-        'bg-right-top',
-        'bg-right-bottom',
-        'bg-left-bottom',
-        'bg-left-top',
 
         // background-repeat
         'bg-repeat',
@@ -13385,19 +10213,10 @@ test('bg', async () => {
         'bg-repeat-round',
         'bg-repeat-space',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --background-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --background-color-blue-500: #3b82f6;
     }
 
     .bg-\\[\\#0088cc\\] {
@@ -13405,111 +10224,35 @@ test('bg', async () => {
     }
 
     .bg-\\[\\#0088cc\\]\\/50, .bg-\\[\\#0088cc\\]\\/\\[0\\.5\\], .bg-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      background-color: oklab(59.9824% -.067 -.124 / .5);
+      background-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .bg-\\[color\\:var\\(--some-var\\)\\], .bg-\\[color\\:var\\(--some-var\\)\\]\\/50 {
+    .bg-\\[color\\:var\\(--some-var\\)\\] {
       background-color: var(--some-var);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-\\[color\\:var\\(--some-var\\)\\]\\/50 {
-        background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
-      }
+    .bg-\\[color\\:var\\(--some-var\\)\\]\\/50, .bg-\\[color\\:var\\(--some-var\\)\\]\\/\\[0\\.5\\], .bg-\\[color\\:var\\(--some-var\\)\\]\\/\\[50\\%\\] {
+      background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
     }
 
-    .bg-\\[color\\:var\\(--some-var\\)\\]\\/\\[0\\.5\\] {
+    .bg-\\[var\\(--some-var\\)\\] {
       background-color: var(--some-var);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-\\[color\\:var\\(--some-var\\)\\]\\/\\[0\\.5\\] {
-        background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
-      }
+    .bg-\\[var\\(--some-var\\)\\]\\/50, .bg-\\[var\\(--some-var\\)\\]\\/\\[0\\.5\\], .bg-\\[var\\(--some-var\\)\\]\\/\\[50\\%\\] {
+      background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
     }
 
-    .bg-\\[color\\:var\\(--some-var\\)\\]\\/\\[50\\%\\] {
-      background-color: var(--some-var);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-\\[color\\:var\\(--some-var\\)\\]\\/\\[50\\%\\] {
-        background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
-      }
-    }
-
-    .bg-\\[var\\(--some-var\\)\\], .bg-\\[var\\(--some-var\\)\\]\\/50 {
-      background-color: var(--some-var);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-\\[var\\(--some-var\\)\\]\\/50 {
-        background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
-      }
-    }
-
-    .bg-\\[var\\(--some-var\\)\\]\\/\\[0\\.5\\] {
-      background-color: var(--some-var);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-\\[var\\(--some-var\\)\\]\\/\\[0\\.5\\] {
-        background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
-      }
-    }
-
-    .bg-\\[var\\(--some-var\\)\\]\\/\\[50\\%\\] {
-      background-color: var(--some-var);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-\\[var\\(--some-var\\)\\]\\/\\[50\\%\\] {
-        background-color: color-mix(in oklab, var(--some-var) 50%, transparent);
-      }
-    }
-
-    .bg-blue-500 {
-      background-color: var(--background-color-blue-500);
-    }
-
-    .bg-current, .bg-current\\/50 {
+    .bg-current {
       background-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-current\\/50 {
-        background-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .bg-current\\/\\[0\\.5\\] {
-      background-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-current\\/\\[0\\.5\\] {
-        background-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .bg-current\\/\\[50\\%\\] {
-      background-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-current\\/\\[50\\%\\] {
-        background-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .bg-current\\/50, .bg-current\\/\\[0\\.5\\], .bg-current\\/\\[50\\%\\] {
+      background-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .bg-current\\/\\[var\\(--bg-opacity\\)\\] {
-      background-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-current\\/\\[var\\(--bg-opacity\\)\\] {
-        background-color: color-mix(in oklab, currentcolor var(--bg-opacity), transparent);
-      }
+      background-color: color-mix(in oklab, currentColor var(--bg-opacity), transparent);
     }
 
     .bg-inherit {
@@ -13521,418 +10264,35 @@ test('bg', async () => {
     }
 
     .bg-red-500\\/2\\.5 {
-      background-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-red-500\\/2\\.5 {
-        background-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      background-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .bg-red-500\\/2\\.25 {
-      background-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-red-500\\/2\\.25 {
-        background-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      background-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .bg-red-500\\/2\\.75 {
-      background-color: #ef444407;
+      background-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-red-500\\/2\\.75 {
-        background-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .bg-red-500\\/50 {
-      background-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-red-500\\/50 {
-        background-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .bg-red-500\\/100 {
-      background-color: var(--color-red-500);
-    }
-
-    .bg-red-500\\/\\[0\\.5\\] {
-      background-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-red-500\\/\\[0\\.5\\] {
-        background-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .bg-red-500\\/\\[50\\%\\] {
-      background-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-red-500\\/\\[50\\%\\] {
-        background-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .bg-red-500\\/\\[100\\%\\] {
-      background-color: var(--color-red-500);
+    .bg-red-500\\/50, .bg-red-500\\/\\[0\\.5\\], .bg-red-500\\/\\[50\\%\\] {
+      background-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .bg-transparent {
       background-color: #0000;
     }
 
-    .-bg-linear-45 {
-      --tw-gradient-position: calc(45deg * -1);
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .-bg-linear-45 {
-        --tw-gradient-position: calc(45deg * -1) in oklab;
-      }
-    }
-
-    .-bg-linear-45 {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .-bg-linear-45\\/oklab {
-      --tw-gradient-position: calc(45deg * -1);
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .-bg-linear-45\\/oklab {
-        --tw-gradient-position: calc(45deg * -1) in oklab;
-      }
-    }
-
-    .-bg-linear-45\\/oklab {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-45 {
-      --tw-gradient-position: 45deg;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-45 {
-        --tw-gradient-position: 45deg in oklab;
-      }
-    }
-
-    .bg-linear-45 {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-45\\/\\[in_hsl_longer_hue\\] {
-      --tw-gradient-position: 45deg;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-45\\/\\[in_hsl_longer_hue\\] {
-        --tw-gradient-position: 45deg in hsl longer hue;
-      }
-    }
-
-    .bg-linear-45\\/\\[in_hsl_longer_hue\\] {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-45\\/oklab {
-      --tw-gradient-position: 45deg;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-45\\/oklab {
-        --tw-gradient-position: 45deg in oklab;
-      }
-    }
-
-    .bg-linear-45\\/oklab {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-45\\/shorter {
-      --tw-gradient-position: 45deg;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-45\\/shorter {
-        --tw-gradient-position: 45deg in oklch shorter hue;
-      }
-    }
-
-    .bg-linear-45\\/shorter {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-b {
-      --tw-gradient-position: to bottom;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-b {
-        --tw-gradient-position: to bottom in oklab;
-      }
-    }
-
-    .bg-linear-to-b {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-bl {
-      --tw-gradient-position: to bottom left;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-bl {
-        --tw-gradient-position: to bottom left in oklab;
-      }
-    }
-
-    .bg-linear-to-bl {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-br {
-      --tw-gradient-position: to bottom right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-br {
-        --tw-gradient-position: to bottom right in oklab;
-      }
-    }
-
-    .bg-linear-to-br {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-l {
-      --tw-gradient-position: to left;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-l {
-        --tw-gradient-position: to left in oklab;
-      }
-    }
-
-    .bg-linear-to-l {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r {
-        --tw-gradient-position: to right in oklab;
-      }
-    }
-
-    .bg-linear-to-r {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/\\[in_hsl_longer_hue\\] {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/\\[in_hsl_longer_hue\\] {
-        --tw-gradient-position: to right in hsl longer hue;
-      }
-    }
-
-    .bg-linear-to-r\\/\\[in_hsl_longer_hue\\] {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/\\[longer\\] {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/\\[longer\\] {
-        --tw-gradient-position: to right longer;
-      }
-    }
-
-    .bg-linear-to-r\\/\\[longer\\] {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/decreasing {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/decreasing {
-        --tw-gradient-position: to right in oklch decreasing hue;
-      }
-    }
-
-    .bg-linear-to-r\\/decreasing {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/hsl {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/hsl {
-        --tw-gradient-position: to right in hsl;
-      }
-    }
-
-    .bg-linear-to-r\\/hsl {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/increasing {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/increasing {
-        --tw-gradient-position: to right in oklch increasing hue;
-      }
-    }
-
-    .bg-linear-to-r\\/increasing {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/longer {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/longer {
-        --tw-gradient-position: to right in oklch longer hue;
-      }
-    }
-
-    .bg-linear-to-r\\/longer {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/oklab {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/oklab {
-        --tw-gradient-position: to right in oklab;
-      }
-    }
-
-    .bg-linear-to-r\\/oklab {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/oklch {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/oklch {
-        --tw-gradient-position: to right in oklch;
-      }
-    }
-
-    .bg-linear-to-r\\/oklch {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/shorter {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/shorter {
-        --tw-gradient-position: to right in oklch shorter hue;
-      }
-    }
-
-    .bg-linear-to-r\\/shorter {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-r\\/srgb {
-      --tw-gradient-position: to right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-r\\/srgb {
-        --tw-gradient-position: to right in srgb;
-      }
-    }
-
-    .bg-linear-to-r\\/srgb {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-t {
-      --tw-gradient-position: to top;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-t {
-        --tw-gradient-position: to top in oklab;
-      }
-    }
-
-    .bg-linear-to-t {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-tl {
-      --tw-gradient-position: to top left;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-tl {
-        --tw-gradient-position: to top left in oklab;
-      }
-    }
-
-    .bg-linear-to-tl {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
-    .bg-linear-to-tr {
-      --tw-gradient-position: to top right;
-    }
-
-    @supports (background-image: linear-gradient(in lab, red, red)) {
-      .bg-linear-to-tr {
-        --tw-gradient-position: to top right in oklab;
-      }
-    }
-
-    .bg-linear-to-tr {
-      background-image: linear-gradient(var(--tw-gradient-stops));
-    }
-
     .-bg-conic-45\\/oklab {
       --tw-gradient-position: from calc(45deg * -1) in oklab;
       background-image: conic-gradient(var(--tw-gradient-stops));
     }
 
+    .-bg-linear-45, .-bg-linear-45\\/oklab {
+      --tw-gradient-position: calc(45deg * -1) in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
     .-bg-linear-\\[1\\.3rad\\] {
       --tw-gradient-position: calc(74.4845deg * -1);
       background-image: linear-gradient(var(--tw-gradient-stops, calc(74.4845deg * -1)));
@@ -14003,6 +10363,26 @@ test('bg', async () => {
       background-image: conic-gradient(var(--tw-gradient-stops));
     }
 
+    .bg-linear-45 {
+      --tw-gradient-position: 45deg in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-45\\/\\[in_hsl_longer_hue\\] {
+      --tw-gradient-position: 45deg in hsl longer hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-45\\/oklab {
+      --tw-gradient-position: 45deg in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-45\\/shorter {
+      --tw-gradient-position: 45deg in oklch shorter hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
     .bg-linear-\\[1\\.3rad\\] {
       --tw-gradient-position: 74.4845deg;
       background-image: linear-gradient(var(--tw-gradient-stops, 74.4845deg));
@@ -14018,6 +10398,96 @@ test('bg', async () => {
       background-image: linear-gradient(var(--tw-gradient-stops, to bottom));
     }
 
+    .bg-linear-to-b {
+      --tw-gradient-position: to bottom in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-bl {
+      --tw-gradient-position: to bottom left in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-br {
+      --tw-gradient-position: to bottom right in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-l {
+      --tw-gradient-position: to left in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r {
+      --tw-gradient-position: to right in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/\\[in_hsl_longer_hue\\] {
+      --tw-gradient-position: to right in hsl longer hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/\\[longer\\] {
+      --tw-gradient-position: to right longer;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/decreasing {
+      --tw-gradient-position: to right in oklch decreasing hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/hsl {
+      --tw-gradient-position: to right in hsl;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/increasing {
+      --tw-gradient-position: to right in oklch increasing hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/longer {
+      --tw-gradient-position: to right in oklch longer hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/oklab {
+      --tw-gradient-position: to right in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/oklch {
+      --tw-gradient-position: to right in oklch;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/shorter {
+      --tw-gradient-position: to right in oklch shorter hue;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-r\\/srgb {
+      --tw-gradient-position: to right in srgb;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-t {
+      --tw-gradient-position: to top in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-tl {
+      --tw-gradient-position: to top left in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
+    .bg-linear-to-tr {
+      --tw-gradient-position: to top right in oklab;
+      background-image: linear-gradient(var(--tw-gradient-stops));
+    }
+
     .bg-radial-\\[circle_at_center\\] {
       --tw-gradient-position: circle at center;
       background-image: radial-gradient(var(--tw-gradient-stops, circle at center));
@@ -14140,14 +10610,6 @@ test('bg', async () => {
       background-position: bottom;
     }
 
-    .bg-bottom-left {
-      background-position: 0 100%;
-    }
-
-    .bg-bottom-right {
-      background-position: 100% 100%;
-    }
-
     .bg-center {
       background-position: center;
     }
@@ -14164,10 +10626,6 @@ test('bg', async () => {
       background-position: 0 0;
     }
 
-    .bg-right {
-      background-position: 100%;
-    }
-
     .bg-right-bottom {
       background-position: 100% 100%;
     }
@@ -14180,14 +10638,6 @@ test('bg', async () => {
       background-position: top;
     }
 
-    .bg-top-left {
-      background-position: 0 0;
-    }
-
-    .bg-top-right {
-      background-position: 100% 0;
-    }
-
     .bg-no-repeat {
       background-repeat: no-repeat;
     }
@@ -14210,8 +10660,7 @@ test('bg', async () => {
 
     .bg-repeat-y {
       background-repeat: repeat-y;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -14309,8 +10758,7 @@ test('bg', async () => {
   ).toEqual('')
 
   expect(
-    await run(
-      ['bg-current/half', 'bg-current/custom', '[color:red]/half'],
+    await compileCss(
       css`
         @theme reference {
           --opacity-half: 0.5;
@@ -14318,127 +10766,32 @@ test('bg', async () => {
         }
         @tailwind utilities;
       `,
+      ['bg-current/half', 'bg-current/custom', '[color:red]/half'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    .bg-current\\/custom {
-      background-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-current\\/custom {
-        background-color: color-mix(in oklab, currentcolor var(--opacity-custom, var(--custom-opacity)), transparent);
-      }
+    ".bg-current\\/custom {
+      background-color: color-mix(in oklab, currentColor var(--opacity-custom, var(--custom-opacity)), transparent);
     }
 
     .bg-current\\/half {
-      background-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .bg-current\\/half {
-        background-color: color-mix(in oklab, currentcolor var(--opacity-half, .5), transparent);
-      }
+      background-color: color-mix(in oklab, currentColor var(--opacity-half, .5), transparent);
     }
 
     .\\[color\\:red\\]\\/half {
-      color: color-mix(in srgb, red .5, transparent);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .\\[color\\:red\\]\\/half {
-        color: color-mix(in oklab, red var(--opacity-half, .5), transparent);
-      }
-    }
-    "
+      color: color-mix(in oklab, red var(--opacity-half, .5), transparent);
+    }"
   `)
 })
 
-test('bg-position', async () => {
-  expect(
-    await run(
-      ['bg-position-[120px]', 'bg-position-[120px_120px]', 'bg-position-[var(--some-var)]'],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .bg-position-\\[120px\\] {
-      background-position: 120px;
-    }
-
-    .bg-position-\\[120px_120px\\] {
-      background-position: 120px 120px;
-    }
-
-    .bg-position-\\[var\\(--some-var\\)\\] {
-      background-position: var(--some-var);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'bg-position',
-      'bg-position/foo',
-      '-bg-position',
-      '-bg-position/foo',
-
-      'bg-position-[120px_120px]/foo',
-
-      '-bg-position-[120px_120px]',
-      '-bg-position-[120px_120px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('bg-size', async () => {
-  expect(
-    await run(
-      ['bg-size-[120px]', 'bg-size-[120px_120px]', 'bg-size-[var(--some-var)]'],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .bg-size-\\[120px\\] {
-      background-size: 120px;
-    }
-
-    .bg-size-\\[120px_120px\\] {
-      background-size: 120px 120px;
-    }
-
-    .bg-size-\\[var\\(--some-var\\)\\] {
-      background-size: var(--some-var);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'bg-size',
-      'bg-size/foo',
-      '-bg-size',
-      '-bg-size/foo',
-
-      'bg-size-[120px_120px]/foo',
-
-      '-bg-size-[120px_120px]',
-      '-bg-size-[120px_120px]/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('from', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // --tw-gradient-from
         'from-red-500',
@@ -14473,32 +10826,9 @@ test('from', async () => {
         'from-[length:var(--my-position)]',
         'from-[percentage:var(--my-position)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-gradient-position: initial;
-          --tw-gradient-from: #0000;
-          --tw-gradient-via: #0000;
-          --tw-gradient-to: #0000;
-          --tw-gradient-stops: initial;
-          --tw-gradient-via-stops: initial;
-          --tw-gradient-from-position: 0%;
-          --tw-gradient-via-position: 50%;
-          --tw-gradient-to-position: 100%;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
     }
 
@@ -14508,7 +10838,7 @@ test('from', async () => {
     }
 
     .from-\\[\\#0088cc\\]\\/50, .from-\\[\\#0088cc\\]\\/\\[0\\.5\\], .from-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-gradient-from: oklab(59.9824% -.067 -.124 / .5);
+      --tw-gradient-from: oklab(59.9824% -.06725 -.12414 / .5);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -14517,45 +10847,8 @@ test('from', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .from-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-from: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .from-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-from: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-gradient-from: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+    .from-\\[color\\:var\\(--my-color\\)\\]\\/50, .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .from-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -14564,92 +10857,18 @@ test('from', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .from-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-from: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-\\[var\\(--my-color\\)\\]\\/50 {
-        --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .from-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-from: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .from-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-gradient-from: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .from-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+    .from-\\[var\\(--my-color\\)\\]\\/50, .from-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .from-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-gradient-from: color-mix(in oklab, var(--my-color) 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
     .from-current {
-      --tw-gradient-from: currentcolor;
+      --tw-gradient-from: currentColor;
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .from-current\\/50 {
-      --tw-gradient-from: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-current\\/50 {
-        --tw-gradient-from: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .from-current\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-current\\/\\[0\\.5\\] {
-      --tw-gradient-from: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-current\\/\\[0\\.5\\] {
-        --tw-gradient-from: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .from-current\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-current\\/\\[50\\%\\] {
-      --tw-gradient-from: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-current\\/\\[50\\%\\] {
-        --tw-gradient-from: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .from-current\\/\\[50\\%\\] {
+    .from-current\\/50, .from-current\\/\\[0\\.5\\], .from-current\\/\\[50\\%\\] {
+      --tw-gradient-from: color-mix(in oklab, currentColor 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -14663,45 +10882,8 @@ test('from', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .from-red-500\\/50 {
-      --tw-gradient-from: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-red-500\\/50 {
-        --tw-gradient-from: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .from-red-500\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-red-500\\/\\[0\\.5\\] {
-      --tw-gradient-from: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-red-500\\/\\[0\\.5\\] {
-        --tw-gradient-from: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .from-red-500\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .from-red-500\\/\\[50\\%\\] {
-      --tw-gradient-from: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .from-red-500\\/\\[50\\%\\] {
-        --tw-gradient-from: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .from-red-500\\/\\[50\\%\\] {
+    .from-red-500\\/50, .from-red-500\\/\\[0\\.5\\], .from-red-500\\/\\[50\\%\\] {
+      --tw-gradient-from: color-mix(in oklab, var(--color-red-500) 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -14783,8 +10965,7 @@ test('from', async () => {
       syntax: "<length-percentage>";
       inherits: false;
       initial-value: 100%;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -14823,7 +11004,13 @@ test('from', async () => {
 
 test('via', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // --tw-gradient-stops
         'via-red-500',
@@ -14858,32 +11045,9 @@ test('via', async () => {
         'via-[length:var(--my-position)]',
         'via-[percentage:var(--my-position)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-gradient-position: initial;
-          --tw-gradient-from: #0000;
-          --tw-gradient-via: #0000;
-          --tw-gradient-to: #0000;
-          --tw-gradient-stops: initial;
-          --tw-gradient-via-stops: initial;
-          --tw-gradient-from-position: 0%;
-          --tw-gradient-via-position: 50%;
-          --tw-gradient-to-position: 100%;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
     }
 
@@ -14894,7 +11058,7 @@ test('via', async () => {
     }
 
     .via-\\[\\#0088cc\\]\\/50, .via-\\[\\#0088cc\\]\\/\\[0\\.5\\], .via-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-gradient-via: oklab(59.9824% -.067 -.124 / .5);
+      --tw-gradient-via: oklab(59.9824% -.06725 -.12414 / .5);
       --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
@@ -14905,47 +11069,8 @@ test('via', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
 
-    .via-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-via: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .via-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-via: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-gradient-via: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+    .via-\\[color\\:var\\(--my-color\\)\\]\\/50, .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .via-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
       --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
@@ -14956,98 +11081,20 @@ test('via', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
 
-    .via-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-via: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-\\[var\\(--my-color\\)\\]\\/50 {
-        --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .via-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-via: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .via-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-gradient-via: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .via-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+    .via-\\[var\\(--my-color\\)\\]\\/50, .via-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .via-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-gradient-via: color-mix(in oklab, var(--my-color) 50%, transparent);
       --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
 
     .via-current {
-      --tw-gradient-via: currentcolor;
+      --tw-gradient-via: currentColor;
       --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
 
-    .via-current\\/50 {
-      --tw-gradient-via: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-current\\/50 {
-        --tw-gradient-via: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .via-current\\/50 {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-current\\/\\[0\\.5\\] {
-      --tw-gradient-via: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-current\\/\\[0\\.5\\] {
-        --tw-gradient-via: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .via-current\\/\\[0\\.5\\] {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-current\\/\\[50\\%\\] {
-      --tw-gradient-via: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-current\\/\\[50\\%\\] {
-        --tw-gradient-via: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .via-current\\/\\[50\\%\\] {
+    .via-current\\/50, .via-current\\/\\[0\\.5\\], .via-current\\/\\[50\\%\\] {
+      --tw-gradient-via: color-mix(in oklab, currentColor 50%, transparent);
       --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
@@ -15064,47 +11111,8 @@ test('via', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
 
-    .via-red-500\\/50 {
-      --tw-gradient-via: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-red-500\\/50 {
-        --tw-gradient-via: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .via-red-500\\/50 {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-red-500\\/\\[0\\.5\\] {
-      --tw-gradient-via: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-red-500\\/\\[0\\.5\\] {
-        --tw-gradient-via: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .via-red-500\\/\\[0\\.5\\] {
-      --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
-      --tw-gradient-stops: var(--tw-gradient-via-stops);
-    }
-
-    .via-red-500\\/\\[50\\%\\] {
-      --tw-gradient-via: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .via-red-500\\/\\[50\\%\\] {
-        --tw-gradient-via: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .via-red-500\\/\\[50\\%\\] {
+    .via-red-500\\/50, .via-red-500\\/\\[0\\.5\\], .via-red-500\\/\\[50\\%\\] {
+      --tw-gradient-via: color-mix(in oklab, var(--color-red-500) 50%, transparent);
       --tw-gradient-via-stops: var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-via) var(--tw-gradient-via-position), var(--tw-gradient-to) var(--tw-gradient-to-position);
       --tw-gradient-stops: var(--tw-gradient-via-stops);
     }
@@ -15188,8 +11196,7 @@ test('via', async () => {
       syntax: "<length-percentage>";
       inherits: false;
       initial-value: 100%;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -15226,7 +11233,13 @@ test('via', async () => {
 
 test('to', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // --tw-gradient-to
         'to-red-500',
@@ -15261,32 +11274,9 @@ test('to', async () => {
         'to-[length:var(--my-position)]',
         'to-[percentage:var(--my-position)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-gradient-position: initial;
-          --tw-gradient-from: #0000;
-          --tw-gradient-via: #0000;
-          --tw-gradient-to: #0000;
-          --tw-gradient-stops: initial;
-          --tw-gradient-via-stops: initial;
-          --tw-gradient-from-position: 0%;
-          --tw-gradient-via-position: 50%;
-          --tw-gradient-to-position: 100%;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
     }
 
@@ -15296,7 +11286,7 @@ test('to', async () => {
     }
 
     .to-\\[\\#0088cc\\]\\/50, .to-\\[\\#0088cc\\]\\/\\[0\\.5\\], .to-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-gradient-to: oklab(59.9824% -.067 -.124 / .5);
+      --tw-gradient-to: oklab(59.9824% -.06725 -.12414 / .5);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -15305,45 +11295,8 @@ test('to', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .to-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-to: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .to-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-to: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-gradient-to: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+    .to-\\[color\\:var\\(--my-color\\)\\]\\/50, .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .to-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -15352,92 +11305,18 @@ test('to', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .to-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-to: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-\\[var\\(--my-color\\)\\]\\/50 {
-        --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .to-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-to: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .to-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-gradient-to: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .to-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+    .to-\\[var\\(--my-color\\)\\]\\/50, .to-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .to-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-gradient-to: color-mix(in oklab, var(--my-color) 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
     .to-current {
-      --tw-gradient-to: currentcolor;
+      --tw-gradient-to: currentColor;
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .to-current\\/50 {
-      --tw-gradient-to: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-current\\/50 {
-        --tw-gradient-to: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .to-current\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-current\\/\\[0\\.5\\] {
-      --tw-gradient-to: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-current\\/\\[0\\.5\\] {
-        --tw-gradient-to: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .to-current\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-current\\/\\[50\\%\\] {
-      --tw-gradient-to: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-current\\/\\[50\\%\\] {
-        --tw-gradient-to: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .to-current\\/\\[50\\%\\] {
+    .to-current\\/50, .to-current\\/\\[0\\.5\\], .to-current\\/\\[50\\%\\] {
+      --tw-gradient-to: color-mix(in oklab, currentColor 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -15451,45 +11330,8 @@ test('to', async () => {
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
-    .to-red-500\\/50 {
-      --tw-gradient-to: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-red-500\\/50 {
-        --tw-gradient-to: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .to-red-500\\/50 {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-red-500\\/\\[0\\.5\\] {
-      --tw-gradient-to: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-red-500\\/\\[0\\.5\\] {
-        --tw-gradient-to: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .to-red-500\\/\\[0\\.5\\] {
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
-    }
-
-    .to-red-500\\/\\[50\\%\\] {
-      --tw-gradient-to: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .to-red-500\\/\\[50\\%\\] {
-        --tw-gradient-to: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .to-red-500\\/\\[50\\%\\] {
+    .to-red-500\\/50, .to-red-500\\/\\[0\\.5\\], .to-red-500\\/\\[50\\%\\] {
+      --tw-gradient-to: color-mix(in oklab, var(--color-red-500) 50%, transparent);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
     }
 
@@ -15571,8 +11413,7 @@ test('to', async () => {
       syntax: "<length-percentage>";
       inherits: false;
       initial-value: 100%;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -15607,5831 +11448,9 @@ test('to', async () => {
   ).toEqual('')
 })
 
-test('mask', async () => {
-  expect(
-    await run(
-      [
-        // mask-image
-        'mask-none',
-        'mask-[linear-gradient(#ffff,#0000)]',
-        'mask-[url(http://example.com)]',
-        'mask-[var(--some-var)]',
-        'mask-[image:var(--some-var)]',
-        'mask-[url:var(--some-var)]',
-
-        // mask-composite
-        'mask-add',
-        'mask-subtract',
-        'mask-intersect',
-        'mask-exclude',
-
-        // mask-mode
-        'mask-alpha',
-        'mask-luminance',
-        'mask-match',
-
-        // mask-type
-        'mask-type-alpha',
-        'mask-type-luminance',
-
-        // mask-size
-        'mask-auto',
-        'mask-cover',
-        'mask-contain',
-        'mask-[cover]',
-        'mask-[contain]',
-        'mask-[size:120px_120px]',
-
-        // mask-position
-        'mask-center',
-        'mask-top',
-        'mask-top-right',
-        'mask-top-left',
-        'mask-bottom',
-        'mask-bottom-right',
-        'mask-bottom-left',
-        'mask-left',
-        'mask-right',
-        'mask-center',
-        'mask-[50%]',
-        'mask-[120px]',
-        'mask-[120px_120px]',
-        'mask-[length:120px_120px]',
-        'mask-[position:120px_120px]',
-
-        // mask-repeat
-        'mask-repeat',
-        'mask-no-repeat',
-        'mask-repeat-x',
-        'mask-repeat-y',
-        'mask-repeat-round',
-        'mask-repeat-space',
-      ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .mask-\\[image\\:var\\(--some-var\\)\\] {
-      -webkit-mask-image: var(--some-var);
-      -webkit-mask-image: var(--some-var);
-      mask-image: var(--some-var);
-    }
-
-    .mask-\\[linear-gradient\\(\\#ffff\\,\\#0000\\)\\] {
-      -webkit-mask-image: linear-gradient(#fff, #0000);
-      mask-image: linear-gradient(#fff, #0000);
-    }
-
-    .mask-\\[url\\(http\\:\\/\\/example\\.com\\)\\] {
-      -webkit-mask-image: url("http://example.com");
-      mask-image: url("http://example.com");
-    }
-
-    .mask-\\[url\\:var\\(--some-var\\)\\], .mask-\\[var\\(--some-var\\)\\] {
-      -webkit-mask-image: var(--some-var);
-      -webkit-mask-image: var(--some-var);
-      mask-image: var(--some-var);
-    }
-
-    .mask-none {
-      -webkit-mask-image: none;
-      mask-image: none;
-    }
-
-    .mask-add {
-      -webkit-mask-composite: source-over;
-      -webkit-mask-composite: source-over;
-      mask-composite: add;
-    }
-
-    .mask-exclude {
-      -webkit-mask-composite: xor;
-      -webkit-mask-composite: xor;
-      mask-composite: exclude;
-    }
-
-    .mask-intersect {
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-subtract {
-      -webkit-mask-composite: source-out;
-      -webkit-mask-composite: source-out;
-      mask-composite: subtract;
-    }
-
-    .mask-alpha {
-      -webkit-mask-source-type: alpha;
-      -webkit-mask-source-type: alpha;
-      mask-mode: alpha;
-    }
-
-    .mask-luminance {
-      -webkit-mask-source-type: luminance;
-      -webkit-mask-source-type: luminance;
-      mask-mode: luminance;
-    }
-
-    .mask-match {
-      -webkit-mask-source-type: auto;
-      -webkit-mask-source-type: auto;
-      mask-mode: match-source;
-    }
-
-    .mask-type-alpha {
-      mask-type: alpha;
-    }
-
-    .mask-type-luminance {
-      mask-type: luminance;
-    }
-
-    .mask-\\[contain\\] {
-      -webkit-mask-size: contain;
-      mask-size: contain;
-    }
-
-    .mask-\\[cover\\] {
-      -webkit-mask-size: cover;
-      mask-size: cover;
-    }
-
-    .mask-\\[length\\:120px_120px\\], .mask-\\[size\\:120px_120px\\] {
-      -webkit-mask-size: 120px 120px;
-      mask-size: 120px 120px;
-    }
-
-    .mask-auto {
-      -webkit-mask-size: auto;
-      mask-size: auto;
-    }
-
-    .mask-contain {
-      -webkit-mask-size: contain;
-      mask-size: contain;
-    }
-
-    .mask-cover {
-      -webkit-mask-size: cover;
-      mask-size: cover;
-    }
-
-    .mask-\\[50\\%\\] {
-      -webkit-mask-position: 50%;
-      mask-position: 50%;
-    }
-
-    .mask-\\[120px\\] {
-      -webkit-mask-position: 120px;
-      mask-position: 120px;
-    }
-
-    .mask-\\[120px_120px\\], .mask-\\[position\\:120px_120px\\] {
-      -webkit-mask-position: 120px 120px;
-      mask-position: 120px 120px;
-    }
-
-    .mask-bottom {
-      -webkit-mask-position: bottom;
-      mask-position: bottom;
-    }
-
-    .mask-bottom-left {
-      -webkit-mask-position: 0 100%;
-      mask-position: 0 100%;
-    }
-
-    .mask-bottom-right {
-      -webkit-mask-position: 100% 100%;
-      mask-position: 100% 100%;
-    }
-
-    .mask-center {
-      -webkit-mask-position: center;
-      mask-position: center;
-    }
-
-    .mask-left {
-      -webkit-mask-position: 0;
-      mask-position: 0;
-    }
-
-    .mask-right {
-      -webkit-mask-position: 100%;
-      mask-position: 100%;
-    }
-
-    .mask-top {
-      -webkit-mask-position: top;
-      mask-position: top;
-    }
-
-    .mask-top-left {
-      -webkit-mask-position: 0 0;
-      mask-position: 0 0;
-    }
-
-    .mask-top-right {
-      -webkit-mask-position: 100% 0;
-      mask-position: 100% 0;
-    }
-
-    .mask-no-repeat {
-      -webkit-mask-repeat: no-repeat;
-      mask-repeat: no-repeat;
-    }
-
-    .mask-repeat {
-      -webkit-mask-repeat: repeat;
-      mask-repeat: repeat;
-    }
-
-    .mask-repeat-round {
-      -webkit-mask-repeat: round;
-      mask-repeat: round;
-    }
-
-    .mask-repeat-space {
-      -webkit-mask-repeat: space;
-      mask-repeat: space;
-    }
-
-    .mask-repeat-x {
-      -webkit-mask-repeat: repeat-x;
-      mask-repeat: repeat-x;
-    }
-
-    .mask-repeat-y {
-      -webkit-mask-repeat: repeat-y;
-      mask-repeat: repeat-y;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask',
-      'mask-unknown',
-
-      // mask-image
-      '-mask-none',
-      'mask-none/foo',
-      '-mask-[var(--some-var)]',
-      'mask-[var(--some-var)]/foo',
-      '-mask-[image:var(--some-var)]',
-      'mask-[image:var(--some-var)]/foo',
-      '-mask-[url:var(--some-var)]',
-      'mask-[url:var(--some-var)]/foo',
-
-      // mask-composite
-      '-mask-add',
-      '-mask-subtract',
-      '-mask-intersect',
-      '-mask-exclude',
-      'mask-add/foo',
-      'mask-subtract/foo',
-      'mask-intersect/foo',
-      'mask-exclude/foo',
-
-      // mask-mode
-      '-mask-alpha',
-      '-mask-luminance',
-      '-mask-match',
-      'mask-alpha/foo',
-      'mask-luminance/foo',
-      'mask-match/foo',
-
-      // mask-type
-      '-mask-type-alpha',
-      '-mask-type-luminance',
-      'mask-type-alpha/foo',
-      'mask-type-luminance/foo',
-
-      // mask-size
-      '-mask-auto',
-      '-mask-cover',
-      '-mask-contain',
-      '-mask-auto/foo',
-      '-mask-cover/foo',
-      '-mask-contain/foo',
-
-      // mask-position
-      '-mask-center',
-      '-mask-top',
-      '-mask-right-top',
-      '-mask-right-bottom',
-      '-mask-bottom',
-      '-mask-left-bottom',
-      '-mask-left',
-      '-mask-left-top',
-      '-mask-center/foo',
-      '-mask-top/foo',
-      '-mask-right-top/foo',
-      '-mask-right-bottom/foo',
-      '-mask-bottom/foo',
-      '-mask-left-bottom/foo',
-      '-mask-left/foo',
-      '-mask-left-top/foo',
-
-      // mask-repeat
-      'mask-repeat/foo',
-      'mask-no-repeat/foo',
-      'mask-repeat-x/foo',
-      'mask-repeat-y/foo',
-      'mask-round/foo',
-      'mask-space/foo',
-      '-mask-repeat',
-      '-mask-no-repeat',
-      '-mask-repeat-x',
-      '-mask-repeat-y',
-      '-mask-round',
-      '-mask-space',
-      '-mask-repeat/foo',
-      '-mask-no-repeat/foo',
-      '-mask-repeat-x/foo',
-      '-mask-repeat-y/foo',
-      '-mask-round/foo',
-      '-mask-space/foo',
-    ]),
-  ).toEqual('')
-
-  expect(
-    await run(
-      ['mask-current/half', 'mask-current/custom', '[color:red]/half'],
-      css`
-        @theme reference {
-          --opacity-half: 0.5;
-          --opacity-custom: var(--custom-opacity);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .\\[color\\:red\\]\\/half {
-      color: color-mix(in srgb, red .5, transparent);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .\\[color\\:red\\]\\/half {
-        color: color-mix(in oklab, red var(--opacity-half, .5), transparent);
-      }
-    }
-    "
-  `)
-})
-
-test('mask-position', async () => {
-  expect(
-    await run(
-      ['mask-position-[120px]', 'mask-position-[120px_120px]', 'mask-position-[var(--some-var)]'],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .mask-position-\\[120px\\] {
-      -webkit-mask-position: 120px;
-      mask-position: 120px;
-    }
-
-    .mask-position-\\[120px_120px\\] {
-      -webkit-mask-position: 120px 120px;
-      mask-position: 120px 120px;
-    }
-
-    .mask-position-\\[var\\(--some-var\\)\\] {
-      -webkit-mask-position: var(--some-var);
-      -webkit-mask-position: var(--some-var);
-      mask-position: var(--some-var);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-position',
-      'mask-position/foo',
-      '-mask-position',
-      '-mask-position/foo',
-
-      'mask-position-[120px_120px]/foo',
-
-      '-mask-position-[120px_120px]',
-      '-mask-position-[120px_120px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-size', async () => {
-  expect(
-    await run(
-      ['mask-size-[120px]', 'mask-size-[120px_120px]', 'mask-size-[var(--some-var)]'],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .mask-size-\\[120px\\] {
-      -webkit-mask-size: 120px;
-      mask-size: 120px;
-    }
-
-    .mask-size-\\[120px_120px\\] {
-      -webkit-mask-size: 120px 120px;
-      mask-size: 120px 120px;
-    }
-
-    .mask-size-\\[var\\(--some-var\\)\\] {
-      -webkit-mask-size: var(--some-var);
-      -webkit-mask-size: var(--some-var);
-      mask-size: var(--some-var);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-size',
-      'mask-size/foo',
-      '-mask-size',
-      '-mask-size/foo',
-
-      'mask-size-[120px_120px]/foo',
-
-      '-mask-size-[120px_120px]',
-      '-mask-size-[120px_120px]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-t-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-t-from-0',
-        'mask-t-from-1.5',
-        'mask-t-from-2',
-        'mask-t-from-0%',
-        'mask-t-from-2%',
-        'mask-t-from-[0px]',
-        'mask-t-from-[0%]',
-        'mask-t-from-(--my-var)',
-        'mask-t-from-(color:--my-var)',
-        'mask-t-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-top-from-position: 0%;
-          --tw-mask-top-to-position: 100%;
-          --tw-mask-top-from-color: black;
-          --tw-mask-top-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-t-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-\\(--my-var\\), .mask-t-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-top-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-top-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-top-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-t-from',
-        'mask-t-from-2.8175',
-        'mask-t-from--1.5',
-        'mask-t-from--2',
-
-        'mask-t-from-2.5%',
-        'mask-t-from--5%',
-        'mask-t-from-unknown',
-        'mask-t-from-unknown%',
-
-        '-mask-t-from-0',
-        '-mask-t-from-1.5',
-        '-mask-t-from-2',
-        '-mask-t-from-0%',
-        '-mask-t-from-2%',
-        '-mask-t-from-[0px]',
-        '-mask-t-from-[0%]',
-
-        '-mask-t-from-(--my-var)',
-        '-mask-t-from-(color:--my-var)',
-        '-mask-t-from-(length:--my-var)',
-
-        'mask-l-from-[-25%]',
-        'mask-l-from-[25%]/foo',
-        'mask-l-from-[-25%]/foo',
-        '-mask-l-from-[-25%]',
-        '-mask-l-from-[25%]/foo',
-        '-mask-l-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-t-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-t-to-0',
-        'mask-t-to-1.5',
-        'mask-t-to-2',
-        'mask-t-to-0%',
-        'mask-t-to-2%',
-        'mask-t-to-[0px]',
-        'mask-t-to-[0%]',
-        'mask-t-to-(--my-var)',
-        'mask-t-to-(color:--my-var)',
-        'mask-t-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-top-from-position: 0%;
-          --tw-mask-top-to-position: 100%;
-          --tw-mask-top-from-color: black;
-          --tw-mask-top-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-t-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-\\(--my-var\\), .mask-t-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-t-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-top-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-top-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-top-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-t-to',
-        'mask-t-to-2.8175',
-        'mask-t-to--1.5',
-        'mask-t-to--2',
-
-        'mask-t-to-2.5%',
-        'mask-t-to--5%',
-        'mask-t-to-unknown',
-        'mask-t-to-unknown%',
-
-        '-mask-t-to-0',
-        '-mask-t-to-1.5',
-        '-mask-t-to-2',
-        '-mask-t-to-0%',
-        '-mask-t-to-2%',
-        '-mask-t-to-[0px]',
-        '-mask-t-to-[0%]',
-
-        '-mask-t-to-(--my-var)',
-        '-mask-t-to-(color:--my-var)',
-        '-mask-t-to-(length:--my-var)',
-
-        'mask-l-from-[-25%]',
-        'mask-l-from-[25%]/foo',
-        'mask-l-from-[-25%]/foo',
-        '-mask-l-from-[-25%]',
-        '-mask-l-from-[25%]/foo',
-        '-mask-l-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-r-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-r-from-0',
-        'mask-r-from-1.5',
-        'mask-r-from-2',
-        'mask-r-from-0%',
-        'mask-r-from-2%',
-        'mask-r-from-[0px]',
-        'mask-r-from-[0%]',
-
-        'mask-r-from-(--my-var)',
-        'mask-r-from-(color:--my-var)',
-        'mask-r-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-right-from-position: 0%;
-          --tw-mask-right-to-position: 100%;
-          --tw-mask-right-from-color: black;
-          --tw-mask-right-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-r-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-\\(--my-var\\), .mask-r-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-right-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-right-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-right-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-r-from',
-        'mask-r-from-2.8175',
-        'mask-r-from--1.5',
-        'mask-r-from--2',
-
-        'mask-r-from-2.5%',
-        'mask-r-from--5%',
-        'mask-r-from-unknown',
-        'mask-r-from-unknown%',
-
-        '-mask-r-from-0',
-        '-mask-r-from-1.5',
-        '-mask-r-from-2',
-        '-mask-r-from-0%',
-        '-mask-r-from-2%',
-        '-mask-r-from-[0px]',
-        '-mask-r-from-[0%]',
-
-        '-mask-r-from-(--my-var)',
-        '-mask-r-from-(color:--my-var)',
-        '-mask-r-from-(length:--my-var)',
-
-        'mask-r-from-[-25%]',
-        'mask-r-from-[25%]/foo',
-        'mask-r-from-[-25%]/foo',
-        '-mask-r-from-[-25%]',
-        '-mask-r-from-[25%]/foo',
-        '-mask-r-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-r-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-r-to-0',
-        'mask-r-to-1.5',
-        'mask-r-to-2',
-        'mask-r-to-0%',
-        'mask-r-to-2%',
-        'mask-r-to-[0px]',
-        'mask-r-to-[0%]',
-
-        'mask-r-to-(--my-var)',
-        'mask-r-to-(color:--my-var)',
-        'mask-r-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-right-from-position: 0%;
-          --tw-mask-right-to-position: 100%;
-          --tw-mask-right-from-color: black;
-          --tw-mask-right-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-r-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-\\(--my-var\\), .mask-r-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-r-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-right-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-right-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-right-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-r-to',
-        'mask-r-to-2.8175',
-        'mask-r-to--1.5',
-        'mask-r-to--2',
-
-        'mask-r-to-2.5%',
-        'mask-r-to--5%',
-        'mask-r-to-unknown',
-        'mask-r-to-unknown%',
-
-        '-mask-r-to-0',
-        '-mask-r-to-1.5',
-        '-mask-r-to-2',
-        '-mask-r-to-0%',
-        '-mask-r-to-2%',
-        '-mask-r-to-[0px]',
-        '-mask-r-to-[0%]',
-
-        '-mask-r-to-(--my-var)',
-        '-mask-r-to-(color:--my-var)',
-        '-mask-r-to-(length:--my-var)',
-
-        'mask-r-to-[-25%]',
-        'mask-r-to-[25%]/foo',
-        'mask-r-to-[-25%]/foo',
-        '-mask-r-to-[-25%]',
-        '-mask-r-to-[25%]/foo',
-        '-mask-r-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-b-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-b-from-0',
-        'mask-b-from-1.5',
-        'mask-b-from-2',
-        'mask-b-from-0%',
-        'mask-b-from-2%',
-        'mask-b-from-[0px]',
-        'mask-b-from-[0%]',
-
-        'mask-b-from-(--my-var)',
-        'mask-b-from-(color:--my-var)',
-        'mask-b-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-bottom-from-position: 0%;
-          --tw-mask-bottom-to-position: 100%;
-          --tw-mask-bottom-from-color: black;
-          --tw-mask-bottom-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-b-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-\\(--my-var\\), .mask-b-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-bottom-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-bottom-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-bottom-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-b-from',
-        'mask-b-from-2.8175',
-        'mask-b-from--1.5',
-        'mask-b-from--2',
-
-        'mask-b-from-2.5%',
-        'mask-b-from--5%',
-        'mask-b-from-unknown',
-        'mask-b-from-unknown%',
-
-        '-mask-b-from-0',
-        '-mask-b-from-1.5',
-        '-mask-b-from-2',
-        '-mask-b-from-0%',
-        '-mask-b-from-2%',
-        '-mask-b-from-[0px]',
-        '-mask-b-from-[0%]',
-
-        '-mask-b-from-(--my-var)',
-        '-mask-b-from-(color:--my-var)',
-        '-mask-b-from-(length:--my-var)',
-
-        'mask-b-from-[-25%]',
-        'mask-b-from-[25%]/foo',
-        'mask-b-from-[-25%]/foo',
-        '-mask-b-from-[-25%]',
-        '-mask-b-from-[25%]/foo',
-        '-mask-b-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-b-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-b-to-0',
-        'mask-b-to-1.5',
-        'mask-b-to-2',
-        'mask-b-to-0%',
-        'mask-b-to-2%',
-        'mask-b-to-[0px]',
-        'mask-b-to-[0%]',
-
-        'mask-b-to-(--my-var)',
-        'mask-b-to-(color:--my-var)',
-        'mask-b-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-bottom-from-position: 0%;
-          --tw-mask-bottom-to-position: 100%;
-          --tw-mask-bottom-from-color: black;
-          --tw-mask-bottom-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-b-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-\\(--my-var\\), .mask-b-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-b-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-bottom-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-bottom-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-bottom-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-b-to',
-        'mask-b-to-2.8175',
-        'mask-b-to--1.5',
-        'mask-b-to--2',
-
-        'mask-b-to-2.5%',
-        'mask-b-to--5%',
-        'mask-b-to-unknown',
-        'mask-b-to-unknown%',
-
-        '-mask-b-to-0',
-        '-mask-b-to-1.5',
-        '-mask-b-to-2',
-        '-mask-b-to-0%',
-        '-mask-b-to-2%',
-        '-mask-b-to-[0px]',
-        '-mask-b-to-[0%]',
-
-        '-mask-b-to-(--my-var)',
-        '-mask-b-to-(color:--my-var)',
-        '-mask-b-to-(length:--my-var)',
-
-        'mask-b-to-[-25%]',
-        'mask-b-to-[25%]/foo',
-        'mask-b-to-[-25%]/foo',
-        '-mask-b-to-[-25%]',
-        '-mask-b-to-[25%]/foo',
-        '-mask-b-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-l-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-l-from-0',
-        'mask-l-from-1.5',
-        'mask-l-from-2',
-        'mask-l-from-0%',
-        'mask-l-from-2%',
-        'mask-l-from-[0px]',
-        'mask-l-from-[0%]',
-
-        'mask-l-from-(--my-var)',
-        'mask-l-from-(color:--my-var)',
-        'mask-l-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-left-from-position: 0%;
-          --tw-mask-left-to-position: 100%;
-          --tw-mask-left-from-color: black;
-          --tw-mask-left-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-l-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-\\(--my-var\\), .mask-l-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-left-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-left-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-left-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-l-from',
-        'mask-l-from-2.8175',
-        'mask-l-from--1.5',
-        'mask-l-from--2',
-
-        'mask-l-from-2.5%',
-        'mask-l-from--5%',
-        'mask-l-from-unknown',
-        'mask-l-from-unknown%',
-
-        '-mask-l-from-0',
-        '-mask-l-from-1.5',
-        '-mask-l-from-2',
-        '-mask-l-from-0%',
-        '-mask-l-from-2%',
-        '-mask-l-from-[0px]',
-        '-mask-l-from-[0%]',
-
-        '-mask-l-from-(--my-var)',
-        '-mask-l-from-(color:--my-var)',
-        '-mask-l-from-(length:--my-var)',
-
-        'mask-l-from-[-25%]',
-        'mask-l-from-[25%]/foo',
-        'mask-l-from-[-25%]/foo',
-        '-mask-l-from-[-25%]',
-        '-mask-l-from-[25%]/foo',
-        '-mask-l-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-l-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-l-to-0',
-        'mask-l-to-1.5',
-        'mask-l-to-2',
-        'mask-l-to-0%',
-        'mask-l-to-2%',
-        'mask-l-to-[0px]',
-        'mask-l-to-[0%]',
-
-        'mask-l-to-(--my-var)',
-        'mask-l-to-(color:--my-var)',
-        'mask-l-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-left-from-position: 0%;
-          --tw-mask-left-to-position: 100%;
-          --tw-mask-left-from-color: black;
-          --tw-mask-left-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-l-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-\\(--my-var\\), .mask-l-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-l-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-left-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-left-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-left-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-l-to',
-        'mask-l-to-2.8175',
-        'mask-l-to--1.5',
-        'mask-l-to--2',
-
-        'mask-l-to-2.5%',
-        'mask-l-to--5%',
-        'mask-l-to-unknown',
-        'mask-l-to-unknown%',
-
-        '-mask-l-to-0',
-        '-mask-l-to-1.5',
-        '-mask-l-to-2',
-        '-mask-l-to-0%',
-        '-mask-l-to-2%',
-        '-mask-l-to-[0px]',
-        '-mask-l-to-[0%]',
-
-        '-mask-l-to-(--my-var)',
-        '-mask-l-to-(color:--my-var)',
-        '-mask-l-to-(length:--my-var)',
-
-        'mask-l-to-[-25%]',
-        'mask-l-to-[25%]/foo',
-        'mask-l-to-[-25%]/foo',
-        '-mask-l-to-[-25%]',
-        '-mask-l-to-[25%]/foo',
-        '-mask-l-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-x-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-x-from-0',
-        'mask-x-from-1.5',
-        'mask-x-from-2',
-        'mask-x-from-0%',
-        'mask-x-from-2%',
-        'mask-x-from-[0px]',
-        'mask-x-from-[0%]',
-
-        'mask-x-from-(--my-var)',
-        'mask-x-from-(color:--my-var)',
-        'mask-x-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-right-from-position: 0%;
-          --tw-mask-right-to-position: 100%;
-          --tw-mask-right-from-color: black;
-          --tw-mask-right-to-color: transparent;
-          --tw-mask-left-from-position: 0%;
-          --tw-mask-left-to-position: 100%;
-          --tw-mask-left-from-color: black;
-          --tw-mask-left-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-x-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-color: var(--my-var);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-\\(--my-var\\), .mask-x-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: var(--my-var);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0px;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0%;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: calc(var(--spacing) * 1.5);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: calc(var(--spacing) * 2);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 2%;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0%;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-from-position: 0px;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-right-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-right-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-right-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-left-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-left-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-left-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-left-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-x-from',
-        'mask-x-from-2.8175',
-        'mask-x-from--1.5',
-        'mask-x-from--2',
-
-        'mask-x-from-2.5%',
-        'mask-x-from--5%',
-        'mask-x-from-unknown',
-        'mask-x-from-unknown%',
-
-        '-mask-x-from-0',
-        '-mask-x-from-1.5',
-        '-mask-x-from-2',
-        '-mask-x-from-0%',
-        '-mask-x-from-2%',
-        '-mask-x-from-[0px]',
-        '-mask-x-from-[0%]',
-
-        '-mask-x-from-(--my-var)',
-        '-mask-x-from-(color:--my-var)',
-        '-mask-x-from-(length:--my-var)',
-
-        'mask-x-from-[-25%]',
-        'mask-x-from-[25%]/foo',
-        'mask-x-from-[-25%]/foo',
-        '-mask-x-from-[-25%]',
-        '-mask-x-from-[25%]/foo',
-        '-mask-x-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-x-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-x-to-0',
-        'mask-x-to-1.5',
-        'mask-x-to-2',
-        'mask-x-to-0%',
-        'mask-x-to-2%',
-        'mask-x-to-[0px]',
-        'mask-x-to-[0%]',
-
-        'mask-x-to-(--my-var)',
-        'mask-x-to-(color:--my-var)',
-        'mask-x-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-right-from-position: 0%;
-          --tw-mask-right-to-position: 100%;
-          --tw-mask-right-from-color: black;
-          --tw-mask-right-to-color: transparent;
-          --tw-mask-left-from-position: 0%;
-          --tw-mask-left-to-position: 100%;
-          --tw-mask-left-from-color: black;
-          --tw-mask-left-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-x-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-color: var(--my-var);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-\\(--my-var\\), .mask-x-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: var(--my-var);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0px;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0%;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: calc(var(--spacing) * 1.5);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: calc(var(--spacing) * 2);
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 2%;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0%;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-x-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-right: linear-gradient(to right, var(--tw-mask-right-from-color) var(--tw-mask-right-from-position), var(--tw-mask-right-to-color) var(--tw-mask-right-to-position));
-      --tw-mask-right-to-position: 0px;
-      --tw-mask-left: linear-gradient(to left, var(--tw-mask-left-from-color) var(--tw-mask-left-from-position), var(--tw-mask-left-to-color) var(--tw-mask-left-to-position));
-      --tw-mask-left-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-right-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-right-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-right-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-left-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-left-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-left-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-left-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-x-to',
-        'mask-x-to-2.8175',
-        'mask-x-to--1.5',
-        'mask-x-to--2',
-
-        'mask-x-to-2.5%',
-        'mask-x-to--5%',
-        'mask-x-to-unknown',
-        'mask-x-to-unknown%',
-
-        '-mask-x-to-0',
-        '-mask-x-to-1.5',
-        '-mask-x-to-2',
-        '-mask-x-to-0%',
-        '-mask-x-to-2%',
-        '-mask-x-to-[0px]',
-        '-mask-x-to-[0%]',
-
-        '-mask-x-to-(--my-var)',
-        '-mask-x-to-(color:--my-var)',
-        '-mask-x-to-(length:--my-var)',
-
-        'mask-x-to-[-25%]',
-        'mask-x-to-[25%]/foo',
-        'mask-x-to-[-25%]/foo',
-        '-mask-x-to-[-25%]',
-        '-mask-x-to-[25%]/foo',
-        '-mask-x-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-y-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-y-from-0',
-        'mask-y-from-1.5',
-        'mask-y-from-2',
-        'mask-y-from-0%',
-        'mask-y-from-2%',
-        'mask-y-from-[0px]',
-        'mask-y-from-[0%]',
-
-        'mask-y-from-(--my-var)',
-        'mask-y-from-(color:--my-var)',
-        'mask-y-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-top-from-position: 0%;
-          --tw-mask-top-to-position: 100%;
-          --tw-mask-top-from-color: black;
-          --tw-mask-top-to-color: transparent;
-          --tw-mask-bottom-from-position: 0%;
-          --tw-mask-bottom-to-position: 100%;
-          --tw-mask-bottom-from-color: black;
-          --tw-mask-bottom-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-y-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-color: var(--my-var);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-\\(--my-var\\), .mask-y-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: var(--my-var);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0px;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0%;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: calc(var(--spacing) * 1.5);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: calc(var(--spacing) * 2);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 2%;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0%;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-from-position: 0px;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-top-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-top-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-top-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-bottom-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-bottom-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-bottom-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-bottom-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-y-from',
-        'mask-y-from-2.8175',
-        'mask-y-from--1.5',
-        'mask-y-from--2',
-
-        'mask-y-from-2.5%',
-        'mask-y-from--5%',
-        'mask-y-from-unknown',
-        'mask-y-from-unknown%',
-
-        '-mask-y-from-0',
-        '-mask-y-from-1.5',
-        '-mask-y-from-2',
-        '-mask-y-from-0%',
-        '-mask-y-from-2%',
-        '-mask-y-from-[0px]',
-        '-mask-y-from-[0%]',
-
-        '-mask-y-from-(--my-var)',
-        '-mask-y-from-(color:--my-var)',
-        '-mask-y-from-(length:--my-var)',
-
-        'mask-y-from-[-25%]',
-        'mask-y-from-[25%]/foo',
-        'mask-y-from-[-25%]/foo',
-        '-mask-y-from-[-25%]',
-        '-mask-y-from-[25%]/foo',
-        '-mask-y-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-y-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-y-to-0',
-        'mask-y-to-1.5',
-        'mask-y-to-2',
-        'mask-y-to-0%',
-        'mask-y-to-2%',
-        'mask-y-to-[0px]',
-        'mask-y-to-[0%]',
-
-        'mask-y-to-(--my-var)',
-        'mask-y-to-(color:--my-var)',
-        'mask-y-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-left: linear-gradient(#fff, #fff);
-          --tw-mask-right: linear-gradient(#fff, #fff);
-          --tw-mask-bottom: linear-gradient(#fff, #fff);
-          --tw-mask-top: linear-gradient(#fff, #fff);
-          --tw-mask-top-from-position: 0%;
-          --tw-mask-top-to-position: 100%;
-          --tw-mask-top-from-color: black;
-          --tw-mask-top-to-color: transparent;
-          --tw-mask-bottom-from-position: 0%;
-          --tw-mask-bottom-to-position: 100%;
-          --tw-mask-bottom-from-color: black;
-          --tw-mask-bottom-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-y-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-color: var(--my-var);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-\\(--my-var\\), .mask-y-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: var(--my-var);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0px;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0%;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: calc(var(--spacing) * 1.5);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: calc(var(--spacing) * 2);
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 2%;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0%;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-y-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top);
-      --tw-mask-top: linear-gradient(to top, var(--tw-mask-top-from-color) var(--tw-mask-top-from-position), var(--tw-mask-top-to-color) var(--tw-mask-top-to-position));
-      --tw-mask-top-to-position: 0px;
-      --tw-mask-bottom: linear-gradient(to bottom, var(--tw-mask-bottom-from-color) var(--tw-mask-bottom-from-position), var(--tw-mask-bottom-to-color) var(--tw-mask-bottom-to-position));
-      --tw-mask-bottom-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-left {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-right {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-bottom {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-top-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-top-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-top-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-top-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-bottom-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-bottom-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-bottom-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-bottom-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-y-to',
-        'mask-y-to-2.8175',
-        'mask-y-to--1.5',
-        'mask-y-to--2',
-
-        'mask-y-to-2.5%',
-        'mask-y-to--5%',
-        'mask-y-to-unknown',
-        'mask-y-to-unknown%',
-
-        '-mask-y-to-0',
-        '-mask-y-to-1.5',
-        '-mask-y-to-2',
-        '-mask-y-to-0%',
-        '-mask-y-to-2%',
-        '-mask-y-to-[0px]',
-        '-mask-y-to-[0%]',
-
-        '-mask-y-to-(--my-var)',
-        '-mask-y-to-(color:--my-var)',
-        '-mask-y-to-(length:--my-var)',
-
-        'mask-y-to-[-25%]',
-        'mask-y-to-[25%]/foo',
-        'mask-y-to-[-25%]/foo',
-        '-mask-y-to-[-25%]',
-        '-mask-y-to-[25%]/foo',
-        '-mask-y-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-linear', async () => {
-  expect(
-    await run([
-      'mask-linear-0',
-      'mask-linear-1',
-      '-mask-linear-1',
-      'mask-linear-45',
-      'mask-linear-[3rad]',
-      '-mask-linear-45',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-linear-position: 0deg;
-          --tw-mask-linear-from-position: 0%;
-          --tw-mask-linear-to-position: 100%;
-          --tw-mask-linear-from-color: black;
-          --tw-mask-linear-to-color: transparent;
-        }
-      }
-    }
-
-    .-mask-linear-1 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)));
-      --tw-mask-linear-position: -1deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .-mask-linear-45 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)));
-      --tw-mask-linear-position: calc(1deg * -45);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)));
-      --tw-mask-linear-position: 0deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-1 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)));
-      --tw-mask-linear-position: 1deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-45 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)));
-      --tw-mask-linear-position: calc(1deg * 45);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-\\[3rad\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)));
-      --tw-mask-linear-position: 171.887deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-linear-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0deg;
-    }
-
-    @property --tw-mask-linear-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-linear-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-linear-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-linear-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-linear',
-      '-mask-linear',
-
-      'mask-linear--75',
-      'mask-linear-unknown',
-      'mask-linear--75/foo',
-      'mask-linear-unknown/foo',
-
-      'mask-linear-45/foo',
-      '-mask-linear-45/foo',
-
-      'mask-linear-[3rad]/foo',
-      '-mask-linear-[3rad]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-linear-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-linear-from-0',
-        'mask-linear-from-1.5',
-        'mask-linear-from-2',
-        'mask-linear-from-0%',
-        'mask-linear-from-2%',
-        'mask-linear-from-[0px]',
-        'mask-linear-from-[0%]',
-
-        'mask-linear-from-(--my-var)',
-        'mask-linear-from-(color:--my-var)',
-        'mask-linear-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-linear-position: 0deg;
-          --tw-mask-linear-from-position: 0%;
-          --tw-mask-linear-to-position: 100%;
-          --tw-mask-linear-from-color: black;
-          --tw-mask-linear-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-linear-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-\\(--my-var\\), .mask-linear-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-linear-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0deg;
-    }
-
-    @property --tw-mask-linear-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-linear-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-linear-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-linear-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-linear-from',
-        'mask-linear-from-2.8175',
-        'mask-linear-from--1.5',
-        'mask-linear-from--2',
-
-        'mask-linear-from-2.5%',
-        'mask-linear-from--5%',
-        'mask-linear-from-unknown',
-        'mask-linear-from-unknown%',
-
-        '-mask-linear-from-0',
-        '-mask-linear-from-1.5',
-        '-mask-linear-from-2',
-        '-mask-linear-from-0%',
-        '-mask-linear-from-2%',
-        '-mask-linear-from-[0px]',
-        '-mask-linear-from-[0%]',
-
-        '-mask-linear-from-(--my-var)',
-        '-mask-linear-from-(color:--my-var)',
-        '-mask-linear-from-(length:--my-var)',
-
-        'mask-linear-from-[-25%]',
-        'mask-linear-from-[25%]/foo',
-        'mask-linear-from-[-25%]/foo',
-        '-mask-linear-from-[-25%]',
-        '-mask-linear-from-[25%]/foo',
-        '-mask-linear-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-linear-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-linear-to-0',
-        'mask-linear-to-1.5',
-        'mask-linear-to-2',
-        'mask-linear-to-0%',
-        'mask-linear-to-2%',
-        'mask-linear-to-[0px]',
-        'mask-linear-to-[0%]',
-
-        'mask-linear-to-(--my-var)',
-        'mask-linear-to-(color:--my-var)',
-        'mask-linear-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-linear-position: 0deg;
-          --tw-mask-linear-from-position: 0%;
-          --tw-mask-linear-to-position: 100%;
-          --tw-mask-linear-from-color: black;
-          --tw-mask-linear-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-linear-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-\\(--my-var\\), .mask-linear-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-linear-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-linear-stops: var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position);
-      --tw-mask-linear: linear-gradient(var(--tw-mask-linear-stops));
-      --tw-mask-linear-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-linear-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0deg;
-    }
-
-    @property --tw-mask-linear-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-linear-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-linear-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-linear-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-linear-to',
-        'mask-linear-to-2.8175',
-        'mask-linear-to--1.5',
-        'mask-linear-to--2',
-
-        'mask-linear-to-2.5%',
-        'mask-linear-to--5%',
-        'mask-linear-to-unknown',
-        'mask-linear-to-unknown%',
-
-        '-mask-linear-to-0',
-        '-mask-linear-to-1.5',
-        '-mask-linear-to-2',
-        '-mask-linear-to-0%',
-        '-mask-linear-to-2%',
-        '-mask-linear-to-[0px]',
-        '-mask-linear-to-[0%]',
-
-        '-mask-linear-to-(--my-var)',
-        '-mask-linear-to-(color:--my-var)',
-        '-mask-linear-to-(length:--my-var)',
-
-        'mask-linear-to-[-25%]',
-        'mask-linear-to-[25%]/foo',
-        'mask-linear-to-[-25%]/foo',
-        '-mask-linear-to-[-25%]',
-        '-mask-linear-to-[25%]/foo',
-        '-mask-linear-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-radial', async () => {
-  expect(
-    await run([
-      'mask-circle',
-      'mask-ellipse',
-      'mask-radial-closest-side',
-      'mask-radial-farthest-side',
-      'mask-radial-closest-corner',
-      'mask-radial-farthest-corner',
-      'mask-radial-[25%_25%]',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-radial-from-position: 0%;
-          --tw-mask-radial-to-position: 100%;
-          --tw-mask-radial-from-color: black;
-          --tw-mask-radial-to-color: transparent;
-          --tw-mask-radial-shape: ellipse;
-          --tw-mask-radial-size: farthest-corner;
-          --tw-mask-radial-position: center;
-        }
-      }
-    }
-
-    .mask-radial-\\[25\\%_25\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops, var(--tw-mask-radial-size)));
-      --tw-mask-radial-size: 25% 25%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-circle {
-      --tw-mask-radial-shape: circle;
-    }
-
-    .mask-ellipse {
-      --tw-mask-radial-shape: ellipse;
-    }
-
-    .mask-radial-closest-corner {
-      --tw-mask-radial-size: closest-corner;
-    }
-
-    .mask-radial-closest-side {
-      --tw-mask-radial-size: closest-side;
-    }
-
-    .mask-radial-farthest-corner {
-      --tw-mask-radial-size: farthest-corner;
-    }
-
-    .mask-radial-farthest-side {
-      --tw-mask-radial-size: farthest-side;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-radial-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-radial-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-radial-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-radial-shape {
-      syntax: "*";
-      inherits: false;
-      initial-value: ellipse;
-    }
-
-    @property --tw-mask-radial-size {
-      syntax: "*";
-      inherits: false;
-      initial-value: farthest-corner;
-    }
-
-    @property --tw-mask-radial-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: center;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-radial',
-      'mask-radial-[25%_25%]/foo',
-      'mask-radial/foo',
-      '-mask-radial',
-      '-mask-radial-[25%_25%]',
-      '-mask-radial/foo',
-      '-mask-radial-[25%_25%]/foo',
-
-      'mask-radial-from-[-25%]',
-      'mask-radial-from-[25%]/foo',
-      'mask-radial-from-[-25%]/foo',
-      '-mask-radial-from-[-25%]',
-      '-mask-radial-from-[25%]/foo',
-      '-mask-radial-from-[-25%]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-radial-at', async () => {
-  expect(
-    await run(
-      [
-        'mask-radial-at-top',
-        'mask-radial-at-top-left',
-        'mask-radial-at-top-right',
-        'mask-radial-at-bottom',
-        'mask-radial-at-bottom-left',
-        'mask-radial-at-bottom-right',
-        'mask-radial-at-left',
-        'mask-radial-at-right',
-        'mask-radial-at-[25%]',
-      ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    .mask-radial-at-\\[25\\%\\] {
-      --tw-mask-radial-position: 25%;
-    }
-
-    .mask-radial-at-bottom {
-      --tw-mask-radial-position: bottom;
-    }
-
-    .mask-radial-at-bottom-left {
-      --tw-mask-radial-position: bottom left;
-    }
-
-    .mask-radial-at-bottom-right {
-      --tw-mask-radial-position: bottom right;
-    }
-
-    .mask-radial-at-left {
-      --tw-mask-radial-position: left;
-    }
-
-    .mask-radial-at-right {
-      --tw-mask-radial-position: right;
-    }
-
-    .mask-radial-at-top {
-      --tw-mask-radial-position: top;
-    }
-
-    .mask-radial-at-top-left {
-      --tw-mask-radial-position: top left;
-    }
-
-    .mask-radial-at-top-right {
-      --tw-mask-radial-position: top right;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-radial-at',
-      'mask-radial-at/foo',
-      'mask-radial-at-25',
-      'mask-radial-at-unknown',
-      'mask-radial-at-[25%]/foo',
-      'mask-radial-at-top/foo',
-      'mask-radial-at-top-left/foo',
-      'mask-radial-at-top-right/foo',
-      'mask-radial-at-bottom/foo',
-      'mask-radial-at-bottom-left/foo',
-      'mask-radial-at-bottom-right/foo',
-      'mask-radial-at-left/foo',
-      'mask-radial-at-right/foo',
-
-      '-mask-radial-at',
-      '-mask-radial-at/foo',
-      '-mask-radial-at-25',
-      '-mask-radial-at-unknown',
-      '-mask-radial-at-[25%]',
-      '-mask-radial-at-[25%]/foo',
-
-      '-mask-radial-at-top',
-      '-mask-radial-at-top-left',
-      '-mask-radial-at-top-right',
-      '-mask-radial-at-bottom',
-      '-mask-radial-at-bottom-left',
-      '-mask-radial-at-bottom-right',
-      '-mask-radial-at-left',
-      '-mask-radial-at-right',
-
-      'mask-radial-at-[25%]/foo',
-      'mask-radial-at-[-25%]/foo',
-      '-mask-radial-at-[-25%]',
-      '-mask-radial-at-[25%]/foo',
-      '-mask-radial-at-[-25%]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-radial-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-radial-from-0',
-        'mask-radial-from-1.5',
-        'mask-radial-from-2',
-        'mask-radial-from-0%',
-        'mask-radial-from-2%',
-        'mask-radial-from-[0px]',
-        'mask-radial-from-[0%]',
-
-        'mask-radial-from-(--my-var)',
-        'mask-radial-from-(color:--my-var)',
-        'mask-radial-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-radial-from-position: 0%;
-          --tw-mask-radial-to-position: 100%;
-          --tw-mask-radial-from-color: black;
-          --tw-mask-radial-to-color: transparent;
-          --tw-mask-radial-shape: ellipse;
-          --tw-mask-radial-size: farthest-corner;
-          --tw-mask-radial-position: center;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-radial-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-\\(--my-var\\), .mask-radial-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-radial-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-radial-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-radial-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-radial-shape {
-      syntax: "*";
-      inherits: false;
-      initial-value: ellipse;
-    }
-
-    @property --tw-mask-radial-size {
-      syntax: "*";
-      inherits: false;
-      initial-value: farthest-corner;
-    }
-
-    @property --tw-mask-radial-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: center;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-radial-from',
-        'mask-radial-from-2.8175',
-        'mask-radial-from--1.5',
-        'mask-radial-from--2',
-
-        'mask-radial-from-2.5%',
-        'mask-radial-from--5%',
-        'mask-radial-from-unknown',
-        'mask-radial-from-unknown%',
-
-        '-mask-radial-from-0',
-        '-mask-radial-from-1.5',
-        '-mask-radial-from-2',
-        '-mask-radial-from-0%',
-        '-mask-radial-from-2%',
-        '-mask-radial-from-[0px]',
-        '-mask-radial-from-[0%]',
-
-        '-mask-radial-from-(--my-var)',
-        '-mask-radial-from-(color:--my-var)',
-        '-mask-radial-from-(length:--my-var)',
-
-        'mask-radial-from-[-25%]',
-        'mask-radial-from-[25%]/foo',
-        'mask-radial-from-[-25%]/foo',
-        '-mask-radial-from-[-25%]',
-        '-mask-radial-from-[25%]/foo',
-        '-mask-radial-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-radial-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-radial-to-0',
-        'mask-radial-to-1.5',
-        'mask-radial-to-2',
-        'mask-radial-to-0%',
-        'mask-radial-to-2%',
-        'mask-radial-to-[0px]',
-        'mask-radial-to-[0%]',
-
-        'mask-radial-to-(--my-var)',
-        'mask-radial-to-(color:--my-var)',
-        'mask-radial-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-radial-from-position: 0%;
-          --tw-mask-radial-to-position: 100%;
-          --tw-mask-radial-from-color: black;
-          --tw-mask-radial-to-color: transparent;
-          --tw-mask-radial-shape: ellipse;
-          --tw-mask-radial-size: farthest-corner;
-          --tw-mask-radial-position: center;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-radial-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-\\(--my-var\\), .mask-radial-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-radial-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-radial-stops: var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position);
-      --tw-mask-radial: radial-gradient(var(--tw-mask-radial-stops));
-      --tw-mask-radial-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-radial-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-radial-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-radial-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-
-    @property --tw-mask-radial-shape {
-      syntax: "*";
-      inherits: false;
-      initial-value: ellipse;
-    }
-
-    @property --tw-mask-radial-size {
-      syntax: "*";
-      inherits: false;
-      initial-value: farthest-corner;
-    }
-
-    @property --tw-mask-radial-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: center;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-radial-to',
-        'mask-radial-to-2.8175',
-        'mask-radial-to--1.5',
-        'mask-radial-to--2',
-
-        'mask-radial-to-2.5%',
-        'mask-radial-to--5%',
-        'mask-radial-to-unknown',
-        'mask-radial-to-unknown%',
-
-        '-mask-radial-to-0',
-        '-mask-radial-to-1.5',
-        '-mask-radial-to-2',
-        '-mask-radial-to-0%',
-        '-mask-radial-to-2%',
-        '-mask-radial-to-[0px]',
-        '-mask-radial-to-[0%]',
-
-        '-mask-radial-to-(--my-var)',
-        '-mask-radial-to-(color:--my-var)',
-        '-mask-radial-to-(length:--my-var)',
-
-        'mask-radial-to-[-25%]',
-        'mask-radial-to-[25%]/foo',
-        'mask-radial-to-[-25%]/foo',
-        '-mask-radial-to-[-25%]',
-        '-mask-radial-to-[25%]/foo',
-        '-mask-radial-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-conic', async () => {
-  expect(
-    await run([
-      'mask-conic-0',
-      'mask-conic-1',
-      '-mask-conic-1',
-      'mask-conic-45',
-      'mask-conic-[3rad]',
-      '-mask-conic-45',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-conic-position: 0deg;
-          --tw-mask-conic-from-position: 0%;
-          --tw-mask-conic-to-position: 100%;
-          --tw-mask-conic-from-color: black;
-          --tw-mask-conic-to-color: transparent;
-        }
-      }
-    }
-
-    .-mask-conic-1 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)));
-      --tw-mask-conic-position: -1deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .-mask-conic-45 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)));
-      --tw-mask-conic-position: calc(1deg * -45);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)));
-      --tw-mask-conic-position: 0deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-1 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)));
-      --tw-mask-conic-position: 1deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-45 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)));
-      --tw-mask-conic-position: calc(1deg * 45);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-\\[3rad\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)));
-      --tw-mask-conic-position: 171.887deg;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0deg;
-    }
-
-    @property --tw-mask-conic-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-conic-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-conic-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-conic-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-conic',
-      '-mask-conic',
-
-      'mask-conic--75',
-      'mask-conic-unknown',
-      'mask-conic--75/foo',
-      'mask-conic-unknown/foo',
-
-      'mask-conic-45/foo',
-      '-mask-conic-45/foo',
-
-      'mask-conic-[3rad]/foo',
-      '-mask-conic-[3rad]/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-conic-from', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-conic-from-0',
-        'mask-conic-from-1.5',
-        'mask-conic-from-2',
-        'mask-conic-from-0%',
-        'mask-conic-from-2%',
-        'mask-conic-from-[0px]',
-        'mask-conic-from-[0%]',
-
-        'mask-conic-from-(--my-var)',
-        'mask-conic-from-(color:--my-var)',
-        'mask-conic-from-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-conic-position: 0deg;
-          --tw-mask-conic-from-position: 0%;
-          --tw-mask-conic-to-position: 100%;
-          --tw-mask-conic-from-color: black;
-          --tw-mask-conic-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-conic-from-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-\\(--my-var\\), .mask-conic-from-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-from-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-from-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0deg;
-    }
-
-    @property --tw-mask-conic-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-conic-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-conic-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-conic-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-conic-from',
-        'mask-conic-from-2.8175',
-        'mask-conic-from--1.5',
-        'mask-conic-from--2',
-
-        'mask-conic-from-2.5%',
-        'mask-conic-from--5%',
-        'mask-conic-from-unknown',
-        'mask-conic-from-unknown%',
-
-        '-mask-conic-from-0',
-        '-mask-conic-from-1.5',
-        '-mask-conic-from-2',
-        '-mask-conic-from-0%',
-        '-mask-conic-from-2%',
-        '-mask-conic-from-[0px]',
-        '-mask-conic-from-[0%]',
-
-        '-mask-conic-from-(--my-var)',
-        '-mask-conic-from-(color:--my-var)',
-        '-mask-conic-from-(length:--my-var)',
-
-        'mask-conic-from-[-25%]',
-        'mask-conic-from-[25%]/foo',
-        'mask-conic-from-[-25%]/foo',
-        '-mask-conic-from-[-25%]',
-        '-mask-conic-from-[25%]/foo',
-        '-mask-conic-from-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
-test('mask-conic-to', async () => {
-  let input = css`
-    @theme {
-      --spacing: 0.25rem;
-    }
-    @tailwind utilities;
-  `
-
-  expect(
-    await run(
-      [
-        'mask-conic-to-0',
-        'mask-conic-to-1.5',
-        'mask-conic-to-2',
-        'mask-conic-to-0%',
-        'mask-conic-to-2%',
-        'mask-conic-to-[0px]',
-        'mask-conic-to-[0%]',
-
-        'mask-conic-to-(--my-var)',
-        'mask-conic-to-(color:--my-var)',
-        'mask-conic-to-(length:--my-var)',
-      ],
-      input,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-mask-linear: linear-gradient(#fff, #fff);
-          --tw-mask-radial: linear-gradient(#fff, #fff);
-          --tw-mask-conic: linear-gradient(#fff, #fff);
-          --tw-mask-conic-position: 0deg;
-          --tw-mask-conic-from-position: 0%;
-          --tw-mask-conic-to-position: 100%;
-          --tw-mask-conic-from-color: black;
-          --tw-mask-conic-to-color: transparent;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
-    }
-
-    .mask-conic-to-\\(color\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-color: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-\\(--my-var\\), .mask-conic-to-\\(length\\:--my-var\\) {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: var(--my-var);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-0 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-0\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-1\\.5 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: calc(var(--spacing) * 1.5);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-2 {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: calc(var(--spacing) * 2);
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-2\\% {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: 2%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-\\[0\\%\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: 0%;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    .mask-conic-to-\\[0px\\] {
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      -webkit-mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      mask-image: var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic);
-      --tw-mask-conic-stops: from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position);
-      --tw-mask-conic: conic-gradient(var(--tw-mask-conic-stops));
-      --tw-mask-conic-to-position: 0px;
-      -webkit-mask-composite: source-in;
-      -webkit-mask-composite: source-in;
-      mask-composite: intersect;
-    }
-
-    @property --tw-mask-linear {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-radial {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic {
-      syntax: "*";
-      inherits: false;
-      initial-value: linear-gradient(#fff, #fff);
-    }
-
-    @property --tw-mask-conic-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0deg;
-    }
-
-    @property --tw-mask-conic-from-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 0%;
-    }
-
-    @property --tw-mask-conic-to-position {
-      syntax: "*";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-mask-conic-from-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: black;
-    }
-
-    @property --tw-mask-conic-to-color {
-      syntax: "*";
-      inherits: false;
-      initial-value: transparent;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        'mask-conic-to',
-        'mask-conic-to-2.8175',
-        'mask-conic-to--1.5',
-        'mask-conic-to--2',
-
-        'mask-conic-to-2.5%',
-        'mask-conic-to--5%',
-        'mask-conic-to-unknown',
-        'mask-conic-to-unknown%',
-
-        '-mask-conic-to-0',
-        '-mask-conic-to-1.5',
-        '-mask-conic-to-2',
-        '-mask-conic-to-0%',
-        '-mask-conic-to-2%',
-        '-mask-conic-to-[0px]',
-        '-mask-conic-to-[0%]',
-
-        '-mask-conic-to-(--my-var)',
-        '-mask-conic-to-(color:--my-var)',
-        '-mask-conic-to-(length:--my-var)',
-
-        'mask-conic-to-[-25%]',
-        'mask-conic-to-[25%]/foo',
-        'mask-conic-to-[-25%]/foo',
-        '-mask-conic-to-[-25%]',
-        '-mask-conic-to-[25%]/foo',
-        '-mask-conic-to-[-25%]/foo',
-      ],
-      input,
-    ),
-  ).toEqual('')
-})
-
 test('box-decoration', async () => {
   expect(await run(['box-decoration-slice', 'box-decoration-clone'])).toMatchInlineSnapshot(`
-    "
-    .box-decoration-clone {
+    ".box-decoration-clone {
       -webkit-box-decoration-break: clone;
       box-decoration-break: clone;
     }
@@ -21439,8 +11458,7 @@ test('box-decoration', async () => {
     .box-decoration-slice {
       -webkit-box-decoration-break: slice;
       box-decoration-break: slice;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -21457,8 +11475,7 @@ test('box-decoration', async () => {
 test('bg-clip', async () => {
   expect(await run(['bg-clip-border', 'bg-clip-padding', 'bg-clip-content', 'bg-clip-text']))
     .toMatchInlineSnapshot(`
-      "
-      .bg-clip-border {
+      ".bg-clip-border {
         background-clip: border-box;
       }
 
@@ -21473,8 +11490,7 @@ test('bg-clip', async () => {
       .bg-clip-text {
         -webkit-background-clip: text;
         background-clip: text;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -21494,20 +11510,18 @@ test('bg-clip', async () => {
 test('bg-origin', async () => {
   expect(await run(['bg-origin-border', 'bg-origin-padding', 'bg-origin-content']))
     .toMatchInlineSnapshot(`
-      "
-      .bg-origin-border {
-        background-origin: border-box;
-      }
+    ".bg-origin-border {
+      background-origin: border-box;
+    }
 
-      .bg-origin-content {
-        background-origin: content-box;
-      }
+    .bg-origin-content {
+      background-origin: content-box;
+    }
 
-      .bg-origin-padding {
-        background-origin: padding-box;
-      }
-      "
-    `)
+    .bg-origin-padding {
+      background-origin: padding-box;
+    }"
+  `)
   expect(
     await run([
       'bg-origin',
@@ -21521,138 +11535,6 @@ test('bg-origin', async () => {
   ).toEqual('')
 })
 
-test('mask-clip', async () => {
-  expect(
-    await run([
-      'mask-clip-border',
-      'mask-clip-padding',
-      'mask-clip-content',
-      'mask-clip-fill',
-      'mask-clip-stroke',
-      'mask-clip-view',
-      'mask-no-clip',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    .mask-clip-border {
-      -webkit-mask-clip: border-box;
-      mask-clip: border-box;
-    }
-
-    .mask-clip-content {
-      -webkit-mask-clip: content-box;
-      mask-clip: content-box;
-    }
-
-    .mask-clip-fill {
-      -webkit-mask-clip: fill-box;
-      mask-clip: fill-box;
-    }
-
-    .mask-clip-padding {
-      -webkit-mask-clip: padding-box;
-      mask-clip: padding-box;
-    }
-
-    .mask-clip-stroke {
-      -webkit-mask-clip: stroke-box;
-      mask-clip: stroke-box;
-    }
-
-    .mask-clip-view {
-      -webkit-mask-clip: view-box;
-      mask-clip: view-box;
-    }
-
-    .mask-no-clip {
-      -webkit-mask-clip: no-clip;
-      mask-clip: no-clip;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-clip',
-      '-mask-clip-border',
-      '-mask-clip-padding',
-      '-mask-clip-content',
-      '-mask-clip-fill',
-      '-mask-clip-stroke',
-      '-mask-clip-view',
-      '-mask-no-clip',
-      'mask-clip-border/foo',
-      'mask-clip-padding/foo',
-      'mask-clip-content/foo',
-      'mask-clip-fill/foo',
-      'mask-clip-stroke/foo',
-      'mask-clip-view/foo',
-      'mask-no-clip/foo',
-    ]),
-  ).toEqual('')
-})
-
-test('mask-origin', async () => {
-  expect(
-    await run([
-      'mask-origin-border',
-      'mask-origin-padding',
-      'mask-origin-content',
-      'mask-origin-fill',
-      'mask-origin-stroke',
-      'mask-origin-view',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    .mask-origin-border {
-      -webkit-mask-origin: border-box;
-      mask-origin: border-box;
-    }
-
-    .mask-origin-content {
-      -webkit-mask-origin: content-box;
-      mask-origin: content-box;
-    }
-
-    .mask-origin-fill {
-      -webkit-mask-origin: fill-box;
-      mask-origin: fill-box;
-    }
-
-    .mask-origin-padding {
-      -webkit-mask-origin: padding-box;
-      mask-origin: padding-box;
-    }
-
-    .mask-origin-stroke {
-      -webkit-mask-origin: stroke-box;
-      mask-origin: stroke-box;
-    }
-
-    .mask-origin-view {
-      -webkit-mask-origin: view-box;
-      mask-origin: view-box;
-    }
-    "
-  `)
-  expect(
-    await run([
-      'mask-origin',
-      '-mask-origin-border',
-      '-mask-origin-padding',
-      '-mask-origin-content',
-      '-mask-origin-fill',
-      '-mask-origin-stroke',
-      '-mask-origin-view',
-      'mask-origin-border/foo',
-      'mask-origin-padding/foo',
-      'mask-origin-content/foo',
-      'mask-origin-fill/foo',
-      'mask-origin-stroke/foo',
-      'mask-origin-view/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('bg-blend', async () => {
   expect(
     await run([
@@ -21674,8 +11556,7 @@ test('bg-blend', async () => {
       'bg-blend-luminosity',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .bg-blend-color {
+    ".bg-blend-color {
       background-blend-mode: color;
     }
 
@@ -21737,8 +11618,7 @@ test('bg-blend', async () => {
 
     .bg-blend-soft-light {
       background-blend-mode: soft-light;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -21802,8 +11682,7 @@ test('mix-blend', async () => {
       'mix-blend-plus-lighter',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .mix-blend-color {
+    ".mix-blend-color {
       mix-blend-mode: color;
     }
 
@@ -21873,8 +11752,7 @@ test('mix-blend', async () => {
 
     .mix-blend-soft-light {
       mix-blend-mode: soft-light;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -21920,7 +11798,13 @@ test('mix-blend', async () => {
 
 test('fill', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         'fill-red-500',
         'fill-red-500/50',
@@ -21929,7 +11813,6 @@ test('fill', async () => {
         'fill-red-500/2.75',
         'fill-red-500/[0.5]',
         'fill-red-500/[50%]',
-        'fill-blue-500',
         'fill-current',
         'fill-current/50',
         'fill-current/[0.5]',
@@ -21941,19 +11824,10 @@ test('fill', async () => {
         'fill-[#0088cc]/[0.5]',
         'fill-[#0088cc]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --fill-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --fill-blue-500: #3b82f6;
     }
 
     .fill-\\[\\#0088cc\\] {
@@ -21961,41 +11835,15 @@ test('fill', async () => {
     }
 
     .fill-\\[\\#0088cc\\]\\/50, .fill-\\[\\#0088cc\\]\\/\\[0\\.5\\], .fill-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      fill: oklab(59.9824% -.067 -.124 / .5);
+      fill: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .fill-blue-500 {
-      fill: var(--fill-blue-500);
-    }
-
-    .fill-current, .fill-current\\/50 {
+    .fill-current {
       fill: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-current\\/50 {
-        fill: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .fill-current\\/\\[0\\.5\\] {
-      fill: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-current\\/\\[0\\.5\\] {
-        fill: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .fill-current\\/\\[50\\%\\] {
-      fill: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-current\\/\\[50\\%\\] {
-        fill: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .fill-current\\/50, .fill-current\\/\\[0\\.5\\], .fill-current\\/\\[50\\%\\] {
+      fill: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .fill-inherit {
@@ -22007,69 +11855,24 @@ test('fill', async () => {
     }
 
     .fill-red-500\\/2\\.5 {
-      fill: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-red-500\\/2\\.5 {
-        fill: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      fill: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .fill-red-500\\/2\\.25 {
-      fill: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-red-500\\/2\\.25 {
-        fill: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      fill: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .fill-red-500\\/2\\.75 {
-      fill: #ef444407;
+      fill: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-red-500\\/2\\.75 {
-        fill: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .fill-red-500\\/50 {
-      fill: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-red-500\\/50 {
-        fill: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .fill-red-500\\/\\[0\\.5\\] {
-      fill: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-red-500\\/\\[0\\.5\\] {
-        fill: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .fill-red-500\\/\\[50\\%\\] {
-      fill: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .fill-red-500\\/\\[50\\%\\] {
-        fill: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .fill-red-500\\/50, .fill-red-500\\/\\[0\\.5\\], .fill-red-500\\/\\[50\\%\\] {
+      fill: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .fill-transparent {
       fill: #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -22095,7 +11898,13 @@ test('fill', async () => {
 
 test('stroke', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // Color
         'stroke-red-500',
@@ -22105,7 +11914,6 @@ test('stroke', async () => {
         'stroke-red-500/2.75',
         'stroke-red-500/[0.5]',
         'stroke-red-500/[50%]',
-        'stroke-blue-500',
         'stroke-current',
         'stroke-current/50',
         'stroke-current/[0.5]',
@@ -22137,19 +11945,10 @@ test('stroke', async () => {
         'stroke-[length:var(--my-width)]',
         'stroke-[percentage:var(--my-width)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --stroke-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --stroke-blue-500: #3b82f6;
     }
 
     .stroke-\\[\\#0088cc\\] {
@@ -22157,101 +11956,31 @@ test('stroke', async () => {
     }
 
     .stroke-\\[\\#0088cc\\]\\/50, .stroke-\\[\\#0088cc\\]\\/\\[0\\.5\\], .stroke-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      stroke: oklab(59.9824% -.067 -.124 / .5);
+      stroke: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .stroke-\\[color\\:var\\(--my-color\\)\\], .stroke-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+    .stroke-\\[color\\:var\\(--my-color\\)\\] {
       stroke: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .stroke-\\[color\\:var\\(--my-color\\)\\]\\/50, .stroke-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .stroke-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .stroke-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
+    .stroke-\\[var\\(--my-color\\)\\] {
       stroke: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .stroke-\\[var\\(--my-color\\)\\]\\/50, .stroke-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .stroke-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .stroke-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      stroke: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .stroke-\\[var\\(--my-color\\)\\], .stroke-\\[var\\(--my-color\\)\\]\\/50 {
-      stroke: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-\\[var\\(--my-color\\)\\]\\/50 {
-        stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .stroke-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      stroke: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .stroke-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      stroke: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        stroke: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .stroke-blue-500 {
-      stroke: var(--stroke-blue-500);
-    }
-
-    .stroke-current, .stroke-current\\/50 {
+    .stroke-current {
       stroke: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-current\\/50 {
-        stroke: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .stroke-current\\/\\[0\\.5\\] {
-      stroke: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-current\\/\\[0\\.5\\] {
-        stroke: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .stroke-current\\/\\[50\\%\\] {
-      stroke: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-current\\/\\[50\\%\\] {
-        stroke: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .stroke-current\\/50, .stroke-current\\/\\[0\\.5\\], .stroke-current\\/\\[50\\%\\] {
+      stroke: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .stroke-inherit {
@@ -22267,63 +11996,19 @@ test('stroke', async () => {
     }
 
     .stroke-red-500\\/2\\.5 {
-      stroke: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-red-500\\/2\\.5 {
-        stroke: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      stroke: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .stroke-red-500\\/2\\.25 {
-      stroke: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-red-500\\/2\\.25 {
-        stroke: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      stroke: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .stroke-red-500\\/2\\.75 {
-      stroke: #ef444407;
+      stroke: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-red-500\\/2\\.75 {
-        stroke: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .stroke-red-500\\/50 {
-      stroke: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-red-500\\/50 {
-        stroke: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .stroke-red-500\\/\\[0\\.5\\] {
-      stroke: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-red-500\\/\\[0\\.5\\] {
-        stroke: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .stroke-red-500\\/\\[50\\%\\] {
-      stroke: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .stroke-red-500\\/\\[50\\%\\] {
-        stroke: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .stroke-red-500\\/50, .stroke-red-500\\/\\[0\\.5\\], .stroke-red-500\\/\\[50\\%\\] {
+      stroke: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .stroke-transparent {
@@ -22356,8 +12041,7 @@ test('stroke', async () => {
 
     .stroke-\\[length\\:var\\(--my-width\\)\\], .stroke-\\[number\\:var\\(--my-width\\)\\], .stroke-\\[percentage\\:var\\(--my-width\\)\\] {
       stroke-width: var(--my-width);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -22383,11 +12067,6 @@ test('stroke', async () => {
       // Width
       '-stroke-0',
       'stroke--1',
-      'stroke-0/foo',
-      'stroke-1/50',
-      'stroke-2/[0.5]',
-      'stroke-2/(--my-opacity)',
-      'stroke-[12px]/foo',
     ]),
   ).toEqual('')
 })
@@ -22404,25 +12083,18 @@ test('object', async () => {
 
       // object-position
       'object-[var(--value)]',
-      'object-top',
-      'object-top-left',
-      'object-top-right',
       'object-bottom',
-      'object-bottom-left',
-      'object-bottom-right',
-      'object-left',
-      'object-right',
       'object-center',
-
-      // Legacy versions in v4.0 and earlier
+      'object-left',
       'object-left-bottom',
       'object-left-top',
+      'object-right',
       'object-right-bottom',
       'object-right-top',
+      'object-top',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .object-contain {
+    ".object-contain {
       object-fit: contain;
     }
 
@@ -22450,14 +12122,6 @@ test('object', async () => {
       object-position: bottom;
     }
 
-    .object-bottom-left {
-      object-position: left bottom;
-    }
-
-    .object-bottom-right {
-      object-position: right bottom;
-    }
-
     .object-center {
       object-position: center;
     }
@@ -22488,16 +12152,7 @@ test('object', async () => {
 
     .object-top {
       object-position: top;
-    }
-
-    .object-top-left {
-      object-position: left top;
-    }
-
-    .object-top-right {
-      object-position: right top;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -22530,34 +12185,11 @@ test('object', async () => {
       'object-top/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['object-center'],
-      css`
-        @theme {
-          --object-position-center: top left;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --object-position-center: top left;
-    }
-
-    .object-center {
-      object-position: var(--object-position-center);
-    }
-    "
-  `)
 })
 
 test('p', async () => {
   expect(
-    await run(
-      ['p-1', 'p-4', 'p-99', 'p-big', 'p-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22565,16 +12197,16 @@ test('p', async () => {
         }
         @tailwind utilities;
       `,
+      ['p-1', 'p-4', 'p-99', 'p-big', 'p-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .p-1 {
-      padding: var(--spacing);
+      padding: calc(var(--spacing) * 1);
     }
 
     .p-4 {
@@ -22591,16 +12223,14 @@ test('p', async () => {
 
     .p-big {
       padding: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['p', '-p-4', '-p-[4px]', 'p-4/foo', 'p-[4px]/foo'])).toEqual('')
 })
 
 test('px', async () => {
   expect(
-    await run(
-      ['px-1', 'px-99', 'px-2.5', 'px-big', 'px-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22608,16 +12238,16 @@ test('px', async () => {
         }
         @tailwind utilities;
       `,
+      ['px-1', 'px-99', 'px-2.5', 'px-big', 'px-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .px-1 {
-      padding-inline: var(--spacing);
+      padding-inline: calc(var(--spacing) * 1);
     }
 
     .px-2\\.5 {
@@ -22634,16 +12264,14 @@ test('px', async () => {
 
     .px-big {
       padding-inline: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['px', '-px-4', '-px-[4px]', 'px-4/foo', 'px-[4px]/foo'])).toEqual('')
 })
 
 test('py', async () => {
   expect(
-    await run(
-      ['py-1', 'py-4', 'py-99', 'py-big', 'py-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22651,16 +12279,16 @@ test('py', async () => {
         }
         @tailwind utilities;
       `,
+      ['py-1', 'py-4', 'py-99', 'py-big', 'py-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .py-1 {
-      padding-block: var(--spacing);
+      padding-block: calc(var(--spacing) * 1);
     }
 
     .py-4 {
@@ -22677,16 +12305,14 @@ test('py', async () => {
 
     .py-big {
       padding-block: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['py', '-py-4', '-py-[4px]', 'py-4/foo', 'py-[4px]/foo'])).toEqual('')
 })
 
 test('pt', async () => {
   expect(
-    await run(
-      ['pt-1', 'pt-4', 'pt-99', 'pt-big', 'pt-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22694,16 +12320,16 @@ test('pt', async () => {
         }
         @tailwind utilities;
       `,
+      ['pt-1', 'pt-4', 'pt-99', 'pt-big', 'pt-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .pt-1 {
-      padding-top: var(--spacing);
+      padding-top: calc(var(--spacing) * 1);
     }
 
     .pt-4 {
@@ -22720,16 +12346,14 @@ test('pt', async () => {
 
     .pt-big {
       padding-top: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['pt', '-pt-4', '-pt-[4px]', 'pt-4/foo', 'pt-[4px]/foo'])).toEqual('')
 })
 
 test('ps', async () => {
   expect(
-    await run(
-      ['ps-1', 'ps-4', 'ps-99', 'ps-big', 'ps-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22737,16 +12361,16 @@ test('ps', async () => {
         }
         @tailwind utilities;
       `,
+      ['ps-1', 'ps-4', 'ps-99', 'ps-big', 'ps-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .ps-1 {
-      padding-inline-start: var(--spacing);
+      padding-inline-start: calc(var(--spacing) * 1);
     }
 
     .ps-4 {
@@ -22763,16 +12387,14 @@ test('ps', async () => {
 
     .ps-big {
       padding-inline-start: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['ps', '-ps-4', '-ps-[4px]', 'ps-4/foo', 'ps-[4px]/foo'])).toEqual('')
 })
 
 test('pe', async () => {
   expect(
-    await run(
-      ['pe-1', 'pe-4', 'pe-99', 'pe-big', 'pe-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22780,16 +12402,16 @@ test('pe', async () => {
         }
         @tailwind utilities;
       `,
+      ['pe-1', 'pe-4', 'pe-99', 'pe-big', 'pe-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .pe-1 {
-      padding-inline-end: var(--spacing);
+      padding-inline-end: calc(var(--spacing) * 1);
     }
 
     .pe-4 {
@@ -22806,102 +12428,14 @@ test('pe', async () => {
 
     .pe-big {
       padding-inline-end: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['pe', '-pe-4', '-pe-[4px]', 'pe-4/foo', 'pe-[4px]/foo'])).toEqual('')
 })
 
-test('pbs', async () => {
-  expect(
-    await run(
-      ['pbs-1', 'pbs-4', 'pbs-99', 'pbs-big', 'pbs-[4px]'],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing: .25rem;
-      --spacing-big: 100rem;
-    }
-
-    .pbs-1 {
-      padding-block-start: var(--spacing);
-    }
-
-    .pbs-4 {
-      padding-block-start: calc(var(--spacing) * 4);
-    }
-
-    .pbs-99 {
-      padding-block-start: calc(var(--spacing) * 99);
-    }
-
-    .pbs-\\[4px\\] {
-      padding-block-start: 4px;
-    }
-
-    .pbs-big {
-      padding-block-start: var(--spacing-big);
-    }
-    "
-  `)
-  expect(await run(['pbs', '-pbs-4', '-pbs-[4px]', 'pbs-4/foo', 'pbs-[4px]/foo'])).toEqual('')
-})
-
-test('pbe', async () => {
-  expect(
-    await run(
-      ['pbe-1', 'pbe-4', 'pbe-99', 'pbe-big', 'pbe-[4px]'],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --spacing-big: 100rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --spacing: .25rem;
-      --spacing-big: 100rem;
-    }
-
-    .pbe-1 {
-      padding-block-end: var(--spacing);
-    }
-
-    .pbe-4 {
-      padding-block-end: calc(var(--spacing) * 4);
-    }
-
-    .pbe-99 {
-      padding-block-end: calc(var(--spacing) * 99);
-    }
-
-    .pbe-\\[4px\\] {
-      padding-block-end: 4px;
-    }
-
-    .pbe-big {
-      padding-block-end: var(--spacing-big);
-    }
-    "
-  `)
-  expect(await run(['pbe', '-pbe-4', '-pbe-[4px]', 'pbe-4/foo', 'pbe-[4px]/foo'])).toEqual('')
-})
-
 test('pr', async () => {
   expect(
-    await run(
-      ['pr-1', 'pr-4', 'pr-99', 'pr-big', 'pr-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22909,16 +12443,16 @@ test('pr', async () => {
         }
         @tailwind utilities;
       `,
+      ['pr-1', 'pr-4', 'pr-99', 'pr-big', 'pr-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .pr-1 {
-      padding-right: var(--spacing);
+      padding-right: calc(var(--spacing) * 1);
     }
 
     .pr-4 {
@@ -22935,16 +12469,14 @@ test('pr', async () => {
 
     .pr-big {
       padding-right: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['pr', '-pr-4', '-pr-[4px]', 'pr-4/foo', 'pr-[4px]/foo'])).toEqual('')
 })
 
 test('pb', async () => {
   expect(
-    await run(
-      ['pb-1', 'pb-4', 'pb-99', 'pb-big', 'pb-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22952,16 +12484,16 @@ test('pb', async () => {
         }
         @tailwind utilities;
       `,
+      ['pb-1', 'pb-4', 'pb-99', 'pb-big', 'pb-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .pb-1 {
-      padding-bottom: var(--spacing);
+      padding-bottom: calc(var(--spacing) * 1);
     }
 
     .pb-4 {
@@ -22978,16 +12510,14 @@ test('pb', async () => {
 
     .pb-big {
       padding-bottom: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['pb', '-pb-4', '-pb-[4px]', 'pb-4/foo', 'pb-[4px]/foo'])).toEqual('')
 })
 
 test('pl', async () => {
   expect(
-    await run(
-      ['pl-1', 'pl-4', 'pl-99', 'pl-big', 'pl-[4px]'],
+    await compileCss(
       css`
         @theme {
           --spacing: 0.25rem;
@@ -22995,16 +12525,16 @@ test('pl', async () => {
         }
         @tailwind utilities;
       `,
+      ['pl-1', 'pl-4', 'pl-99', 'pl-big', 'pl-[4px]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --spacing-big: 100rem;
     }
 
     .pl-1 {
-      padding-left: var(--spacing);
+      padding-left: calc(var(--spacing) * 1);
     }
 
     .pl-4 {
@@ -23021,8 +12551,7 @@ test('pl', async () => {
 
     .pl-big {
       padding-left: var(--spacing-big);
-    }
-    "
+    }"
   `)
   expect(await run(['pl', '-pl-4', '-pl-[4px]', 'pl-4/foo', 'pl-[4px]/foo'])).toEqual('')
 })
@@ -23031,8 +12560,7 @@ test('text-align', async () => {
   expect(
     await run(['text-left', 'text-center', 'text-right', 'text-justify', 'text-start', 'text-end']),
   ).toMatchInlineSnapshot(`
-    "
-    .text-center {
+    ".text-center {
       text-align: center;
     }
 
@@ -23054,8 +12582,7 @@ test('text-align', async () => {
 
     .text-start {
       text-align: start;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -23077,15 +12604,13 @@ test('text-align', async () => {
 
 test('indent', async () => {
   expect(await run(['indent-[4px]', '-indent-[4px]'])).toMatchInlineSnapshot(`
-    "
-    .-indent-\\[4px\\] {
+    ".-indent-\\[4px\\] {
       text-indent: -4px;
     }
 
     .indent-\\[4px\\] {
       text-indent: 4px;
-    }
-    "
+    }"
   `)
   expect(await run(['indent', 'indent-[4px]/foo', '-indent-[4px]/foo'])).toEqual('')
 })
@@ -23105,8 +12630,7 @@ test('align', async () => {
       'align-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .align-\\[var\\(--value\\)\\] {
+    ".align-\\[var\\(--value\\)\\] {
       vertical-align: var(--value);
     }
 
@@ -23140,8 +12664,7 @@ test('align', async () => {
 
     .align-top {
       vertical-align: top;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -23172,7 +12695,16 @@ test('align', async () => {
 
 test('font', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --font-sans:
+            ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+            'Segoe UI Symbol', 'Noto Color Emoji';
+          --font-weight-bold: 650;
+        }
+        @tailwind utilities;
+      `,
       [
         // font-family
         'font-sans',
@@ -23187,29 +12719,10 @@ test('font', async () => {
         'font-[100]',
         'font-[number:var(--my-weight)]',
       ],
-      css`
-        @theme {
-          --font-sans:
-            ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-            'Segoe UI Symbol', 'Noto Color Emoji';
-          --font-weight-bold: 650;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-font-weight: initial;
-        }
-      }
-    }
-
-    :root, :host {
-      --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
-                "Segoe UI Symbol", "Noto Color Emoji";
+    ":root, :host {
+      --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
       --font-weight-bold: 650;
     }
 
@@ -23252,11 +12765,19 @@ test('font', async () => {
     @property --tw-font-weight {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme reference {
+          --font-sans:
+            ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
+            'Segoe UI Symbol', 'Noto Color Emoji';
+          --font-weight-bold: 650;
+        }
+        @tailwind utilities;
+      `,
       [
         'font',
         // font-family
@@ -23276,60 +12797,13 @@ test('font', async () => {
         'font-[100]/foo',
         'font-[number:var(--my-weight)]/foo',
       ],
-      css`
-        @theme reference {
-          --font-sans:
-            ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
-            'Segoe UI Symbol', 'Noto Color Emoji';
-          --font-weight-bold: 650;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
-test('font-features', async () => {
-  expect(
-    await run([
-      'font-features-["smcp"]',
-      'font-features-["c2sc","smcp"]',
-      'font-features-[var(--my-features)]',
-      'font-features-(--my-features)',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    .font-features-\\(--my-features\\) {
-      font-feature-settings: var(--my-features);
-    }
-
-    .font-features-\\[\\"c2sc\\"\\,\\"smcp\\"\\] {
-      font-feature-settings: "c2sc","smcp";
-    }
-
-    .font-features-\\[\\"smcp\\"\\] {
-      font-feature-settings: "smcp";
-    }
-
-    .font-features-\\[var\\(--my-features\\)\\] {
-      font-feature-settings: var(--my-features);
-    }
-    "
-  `)
-  expect(
-    await run([
-      'font-features',
-      '-font-features-["smcp"]',
-      'font-features-smcp',
-      'font-features-["smcp"]/foo',
-    ]),
-  ).toEqual('')
-})
-
 test('text-transform', async () => {
   expect(await run(['uppercase', 'lowercase', 'capitalize', 'normal-case'])).toMatchInlineSnapshot(`
-    "
-    .capitalize {
+    ".capitalize {
       text-transform: capitalize;
     }
 
@@ -23343,8 +12817,7 @@ test('text-transform', async () => {
 
     .uppercase {
       text-transform: uppercase;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -23362,15 +12835,13 @@ test('text-transform', async () => {
 
 test('font-style', async () => {
   expect(await run(['italic', 'not-italic'])).toMatchInlineSnapshot(`
-    "
-    .italic {
+    ".italic {
       font-style: italic;
     }
 
     .not-italic {
       font-style: normal;
-    }
-    "
+    }"
   `)
   expect(await run(['-italic', '-not-italic', 'italic/foo', 'not-italic/foo'])).toEqual('')
 })
@@ -23378,8 +12849,7 @@ test('font-style', async () => {
 test('font-stretch', async () => {
   expect(await run(['font-stretch-ultra-expanded', 'font-stretch-50%', 'font-stretch-200%']))
     .toMatchInlineSnapshot(`
-      "
-      .font-stretch-50\\% {
+      ".font-stretch-50\\% {
         font-stretch: 50%;
       }
 
@@ -23389,8 +12859,7 @@ test('font-stretch', async () => {
 
       .font-stretch-ultra-expanded {
         font-stretch: ultra-expanded;
-      }
-      "
+      }"
     `)
   expect(
     await run([
@@ -23410,24 +12879,22 @@ test('font-stretch', async () => {
 test('text-decoration-line', async () => {
   expect(await run(['underline', 'overline', 'line-through', 'no-underline']))
     .toMatchInlineSnapshot(`
-      "
-      .line-through {
-        text-decoration-line: line-through;
-      }
+    ".line-through {
+      text-decoration-line: line-through;
+    }
 
-      .no-underline {
-        text-decoration-line: none;
-      }
+    .no-underline {
+      text-decoration-line: none;
+    }
 
-      .overline {
-        text-decoration-line: overline;
-      }
+    .overline {
+      text-decoration-line: overline;
+    }
 
-      .underline {
-        text-decoration-line: underline;
-      }
-      "
-    `)
+    .underline {
+      text-decoration-line: underline;
+    }"
+  `)
   expect(
     await run([
       '-underline',
@@ -23444,7 +12911,13 @@ test('text-decoration-line', async () => {
 
 test('placeholder', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         'placeholder-red-500',
         'placeholder-red-500/50',
@@ -23464,16 +12937,9 @@ test('placeholder', async () => {
         'placeholder-[#0088cc]/[0.5]',
         'placeholder-[#0088cc]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
     }
 
@@ -23482,37 +12948,15 @@ test('placeholder', async () => {
     }
 
     .placeholder-\\[\\#0088cc\\]\\/50::placeholder, .placeholder-\\[\\#0088cc\\]\\/\\[0\\.5\\]::placeholder, .placeholder-\\[\\#0088cc\\]\\/\\[50\\%\\]::placeholder {
-      color: oklab(59.9824% -.067 -.124 / .5);
+      color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .placeholder-current::placeholder, .placeholder-current\\/50::placeholder {
+    .placeholder-current::placeholder {
       color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-current\\/50::placeholder {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .placeholder-current\\/\\[0\\.5\\]::placeholder {
-      color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-current\\/\\[0\\.5\\]::placeholder {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .placeholder-current\\/\\[50\\%\\]::placeholder {
-      color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-current\\/\\[50\\%\\]::placeholder {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .placeholder-current\\/50::placeholder, .placeholder-current\\/\\[0\\.5\\]::placeholder, .placeholder-current\\/\\[50\\%\\]::placeholder {
+      color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .placeholder-inherit::placeholder {
@@ -23524,69 +12968,24 @@ test('placeholder', async () => {
     }
 
     .placeholder-red-500\\/2\\.5::placeholder {
-      color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-red-500\\/2\\.5::placeholder {
-        color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .placeholder-red-500\\/2\\.25::placeholder {
-      color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-red-500\\/2\\.25::placeholder {
-        color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .placeholder-red-500\\/2\\.75::placeholder {
-      color: #ef444407;
+      color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-red-500\\/2\\.75::placeholder {
-        color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .placeholder-red-500\\/50::placeholder {
-      color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-red-500\\/50::placeholder {
-        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .placeholder-red-500\\/\\[0\\.5\\]::placeholder {
-      color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-red-500\\/\\[0\\.5\\]::placeholder {
-        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .placeholder-red-500\\/\\[50\\%\\]::placeholder {
-      color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .placeholder-red-500\\/\\[50\\%\\]::placeholder {
-        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .placeholder-red-500\\/50::placeholder, .placeholder-red-500\\/\\[0\\.5\\]::placeholder, .placeholder-red-500\\/\\[50\\%\\]::placeholder {
+      color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .placeholder-transparent::placeholder {
       color: #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -23611,14 +13010,19 @@ test('placeholder', async () => {
 
 test('decoration', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // text-decoration-color
         'decoration-red-500',
         'decoration-red-500/50',
         'decoration-red-500/[0.5]',
         'decoration-red-500/[50%]',
-        'decoration-blue-500',
         'decoration-current',
         'decoration-current/50',
         'decoration-current/[0.5]',
@@ -23658,19 +13062,10 @@ test('decoration', async () => {
         'decoration-[length:var(--my-thickness)]',
         'decoration-[percentage:var(--my-thickness)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --text-decoration-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --text-decoration-color-blue-500: #3b82f6;
     }
 
     .decoration-\\[\\#0088cc\\] {
@@ -23678,133 +13073,41 @@ test('decoration', async () => {
     }
 
     .decoration-\\[\\#0088cc\\]\\/50, .decoration-\\[\\#0088cc\\]\\/\\[0\\.5\\], .decoration-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      text-decoration-color: oklab(59.9824% -.067 -.124 / .5);
+      text-decoration-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .decoration-\\[color\\:var\\(--my-color\\)\\], .decoration-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+    .decoration-\\[color\\:var\\(--my-color\\)\\] {
       -webkit-text-decoration-color: var(--my-color);
       -webkit-text-decoration-color: var(--my-color);
       text-decoration-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .decoration-\\[color\\:var\\(--my-color\\)\\]\\/50, .decoration-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .decoration-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
+      -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
+      text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .decoration-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
+    .decoration-\\[var\\(--my-color\\)\\] {
       -webkit-text-decoration-color: var(--my-color);
       -webkit-text-decoration-color: var(--my-color);
       text-decoration-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .decoration-\\[var\\(--my-color\\)\\]\\/50, .decoration-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .decoration-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
+      -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
+      text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .decoration-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      -webkit-text-decoration-color: var(--my-color);
-      -webkit-text-decoration-color: var(--my-color);
-      text-decoration-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .decoration-\\[var\\(--my-color\\)\\], .decoration-\\[var\\(--my-color\\)\\]\\/50 {
-      -webkit-text-decoration-color: var(--my-color);
-      -webkit-text-decoration-color: var(--my-color);
-      text-decoration-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-\\[var\\(--my-color\\)\\]\\/50 {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .decoration-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      -webkit-text-decoration-color: var(--my-color);
-      -webkit-text-decoration-color: var(--my-color);
-      text-decoration-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .decoration-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      -webkit-text-decoration-color: var(--my-color);
-      -webkit-text-decoration-color: var(--my-color);
-      text-decoration-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .decoration-blue-500 {
-      -webkit-text-decoration-color: var(--text-decoration-color-blue-500);
-      -webkit-text-decoration-color: var(--text-decoration-color-blue-500);
-      text-decoration-color: var(--text-decoration-color-blue-500);
-    }
-
-    .decoration-current, .decoration-current\\/50 {
+    .decoration-current {
       text-decoration-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-current\\/50 {
-        -webkit-text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-        text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .decoration-current\\/\\[0\\.5\\] {
-      text-decoration-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-current\\/\\[0\\.5\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-        text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .decoration-current\\/\\[50\\%\\] {
-      text-decoration-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-current\\/\\[50\\%\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-        text-decoration-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .decoration-current\\/50, .decoration-current\\/\\[0\\.5\\], .decoration-current\\/\\[50\\%\\] {
+      -webkit-text-decoration-color: color-mix(in oklab, currentColor 50%, transparent);
+      -webkit-text-decoration-color: color-mix(in oklab, currentColor 50%, transparent);
+      text-decoration-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .decoration-inherit {
@@ -23819,40 +13122,10 @@ test('decoration', async () => {
       text-decoration-color: var(--color-red-500);
     }
 
-    .decoration-red-500\\/50 {
-      text-decoration-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-red-500\\/50 {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .decoration-red-500\\/\\[0\\.5\\] {
-      text-decoration-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-red-500\\/\\[0\\.5\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .decoration-red-500\\/\\[50\\%\\] {
-      text-decoration-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .decoration-red-500\\/\\[50\\%\\] {
-        -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-        text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .decoration-red-500\\/50, .decoration-red-500\\/\\[0\\.5\\], .decoration-red-500\\/\\[50\\%\\] {
+      -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
+      -webkit-text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
+      text-decoration-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .decoration-transparent {
@@ -23917,8 +13190,7 @@ test('decoration', async () => {
 
     .decoration-from-font {
       text-decoration-thickness: from-font;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -23977,18 +13249,17 @@ test('decoration', async () => {
 
 test('animate', async () => {
   expect(
-    await run(
-      ['animate-spin', 'animate-none', 'animate-[bounce_1s_infinite]', 'animate-not-found'],
+    await compileCss(
       css`
         @theme {
           --animate-spin: spin 1s linear infinite;
         }
         @tailwind utilities;
       `,
+      ['animate-spin', 'animate-none', 'animate-[bounce_1s_infinite]', 'animate-not-found'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --animate-spin: spin 1s linear infinite;
     }
 
@@ -24002,8 +13273,7 @@ test('animate', async () => {
 
     .animate-spin {
       animation: var(--animate-spin);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -24018,33 +13288,19 @@ test('animate', async () => {
       'animate-not-found/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['animate-none'],
-      css`
-        @theme {
-          --animate-none: bounce 1s infinite;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --animate-none: bounce 1s infinite;
-    }
-
-    .animate-none {
-      animation: var(--animate-none);
-    }
-    "
-  `)
 })
 
 test('filter', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --blur-xl: 24px;
+          --drop-shadow: 0 1px 1px rgb(0 0 0 / 0.05);
+          --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
+        }
+        @tailwind utilities;
+      `,
       [
         'filter',
         'filter-none',
@@ -24067,16 +13323,8 @@ test('filter', async () => {
         'invert-0',
         'invert-[var(--value)]',
         'drop-shadow',
-        'drop-shadow/25',
-        'drop-shadow/12.5',
         'drop-shadow-xl',
-        'drop-shadow-multi',
         'drop-shadow-[0_0_red]',
-        'drop-shadow-red-500',
-        'drop-shadow-red-500/50',
-        'drop-shadow-none',
-        'drop-shadow-inherit',
-        'drop-shadow-calc',
         'saturate-0',
         'saturate-[1.75]',
         'saturate-[var(--value)]',
@@ -24085,50 +13333,12 @@ test('filter', async () => {
         'sepia-[50%]',
         'sepia-[var(--value)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --blur-xl: 24px;
-          --color-red-500: #ef4444;
-          --drop-shadow: 0 1px 1px rgb(0 0 0 / 0.05);
-          --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
-          --drop-shadow-calc: 0 0 calc(1 * var(--spacing)) black;
-        }
-        @theme inline {
-          --drop-shadow-multi: 0 1px 1px rgb(0 0 0 / 0.05), 0 9px 7px rgb(0 0 0 / 0.1);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-blur: initial;
-          --tw-brightness: initial;
-          --tw-contrast: initial;
-          --tw-grayscale: initial;
-          --tw-hue-rotate: initial;
-          --tw-invert: initial;
-          --tw-opacity: initial;
-          --tw-saturate: initial;
-          --tw-sepia: initial;
-          --tw-drop-shadow: initial;
-          --tw-drop-shadow-color: initial;
-          --tw-drop-shadow-alpha: 100%;
-          --tw-drop-shadow-size: initial;
-        }
-      }
-    }
-
-    :root, :host {
-      --spacing: .25rem;
+    ":root, :host {
       --blur-xl: 24px;
-      --color-red-500: #ef4444;
       --drop-shadow: 0 1px 1px #0000000d;
       --drop-shadow-xl: 0 9px 7px #0000001a;
-      --drop-shadow-calc: 0 0 calc(1 * var(--spacing)) black;
     }
 
     .blur-\\[4px\\] {
@@ -24137,7 +13347,7 @@ test('filter', async () => {
     }
 
     .blur-none {
-      --tw-blur:  ;
+      --tw-blur: ;
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
     }
 
@@ -24166,88 +13376,21 @@ test('filter', async () => {
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
     }
 
-    .drop-shadow\\/12\\.5 {
-      --tw-drop-shadow-alpha: 12.5%;
-      --tw-drop-shadow-size: drop-shadow(0 1px 1px var(--tw-drop-shadow-color, oklab(0% 0 0 / .125)));
-      --tw-drop-shadow: drop-shadow(var(--drop-shadow));
-      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
-    }
-
-    .drop-shadow\\/25 {
-      --tw-drop-shadow-alpha: 25%;
-      --tw-drop-shadow-size: drop-shadow(0 1px 1px var(--tw-drop-shadow-color, oklab(0% 0 0 / .25)));
-      --tw-drop-shadow: drop-shadow(var(--drop-shadow));
-      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
-    }
-
     .drop-shadow {
-      --tw-drop-shadow-size: drop-shadow(0 1px 1px var(--tw-drop-shadow-color, #0000000d));
       --tw-drop-shadow: drop-shadow(var(--drop-shadow));
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
     }
 
     .drop-shadow-\\[0_0_red\\] {
-      --tw-drop-shadow-size: drop-shadow(0 0 var(--tw-drop-shadow-color, red));
-      --tw-drop-shadow: var(--tw-drop-shadow-size);
-      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
-    }
-
-    .drop-shadow-calc {
-      --tw-drop-shadow-size: drop-shadow(0 0 calc(1 * var(--spacing)) var(--tw-drop-shadow-color, black));
-      --tw-drop-shadow: drop-shadow(var(--drop-shadow-calc));
-      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
-    }
-
-    .drop-shadow-multi {
-      --tw-drop-shadow-size: drop-shadow(0 1px 1px var(--tw-drop-shadow-color, #0000000d)) drop-shadow(0 9px 7px var(--tw-drop-shadow-color, #0000001a));
-      --tw-drop-shadow: drop-shadow(0 1px 1px #0000000d) drop-shadow(0 9px 7px #0000001a);
+      --tw-drop-shadow: drop-shadow(0 0 red);
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
     }
 
     .drop-shadow-xl {
-      --tw-drop-shadow-size: drop-shadow(0 9px 7px var(--tw-drop-shadow-color, #0000001a));
       --tw-drop-shadow: drop-shadow(var(--drop-shadow-xl));
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
     }
 
-    .drop-shadow-none {
-      --tw-drop-shadow:  ;
-      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
-    }
-
-    .drop-shadow-inherit {
-      --tw-drop-shadow-color: inherit;
-      --tw-drop-shadow: var(--tw-drop-shadow-size);
-    }
-
-    .drop-shadow-red-500 {
-      --tw-drop-shadow-color: #ef4444;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .drop-shadow-red-500 {
-        --tw-drop-shadow-color: color-mix(in oklab, var(--color-red-500) var(--tw-drop-shadow-alpha), transparent);
-      }
-    }
-
-    .drop-shadow-red-500 {
-      --tw-drop-shadow: var(--tw-drop-shadow-size);
-    }
-
-    .drop-shadow-red-500\\/50 {
-      --tw-drop-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .drop-shadow-red-500\\/50 {
-        --tw-drop-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-drop-shadow-alpha), transparent);
-      }
-    }
-
-    .drop-shadow-red-500\\/50 {
-      --tw-drop-shadow: var(--tw-drop-shadow-size);
-    }
-
     .grayscale {
       --tw-grayscale: grayscale(100%);
       filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
@@ -24393,225 +13536,88 @@ test('filter', async () => {
     @property --tw-drop-shadow {
       syntax: "*";
       inherits: false
-    }
-
-    @property --tw-drop-shadow-color {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-drop-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-drop-shadow-size {
-      syntax: "*";
-      inherits: false
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      [
-        '-filter',
-        '-filter-none',
-        '-filter-[var(--value)]',
-        '-blur-xl',
-        '-blur-[4px]',
-        'brightness--50',
-        '-brightness-50',
-        '-brightness-[1.23]',
-        'brightness-unknown',
-        'contrast--50',
-        '-contrast-50',
-        '-contrast-[1.23]',
-        'contrast-unknown',
-        '-grayscale',
-        '-grayscale-0',
-        'grayscale--1',
-        '-grayscale-[var(--value)]',
-        'grayscale-unknown',
-        'hue-rotate--5',
-        'hue-rotate-unknown',
-        '-invert',
-        'invert--5',
-        '-invert-0',
-        '-invert-[var(--value)]',
-        'invert-unknown',
-        '-drop-shadow-xl',
-        '-drop-shadow-[0_0_red]',
-
-        'drop-shadow/foo',
-        '-drop-shadow/foo',
-        '-drop-shadow/25',
-        '-drop-shadow-red-500',
-        'drop-shadow-red-500/foo',
-        '-drop-shadow-red-500/foo',
-        '-drop-shadow-red-500/50',
-
-        '-saturate-0',
-        'saturate--5',
-        '-saturate-[1.75]',
-        '-saturate-[var(--value)]',
-        'saturate-saturate',
-        '-sepia',
-        'sepia--50',
-        '-sepia-0',
-        '-sepia-[50%]',
-        '-sepia-[var(--value)]',
-        'sepia-unknown',
-        'filter/foo',
-        'filter-none/foo',
-        'filter-[var(--value)]/foo',
-        'blur-xl/foo',
-        'blur-none/foo',
-        'blur-[4px]/foo',
-        'brightness-50/foo',
-        'brightness-[1.23]/foo',
-        'contrast-50/foo',
-        'contrast-[1.23]/foo',
-        'grayscale/foo',
-        'grayscale-0/foo',
-        'grayscale-[var(--value)]/foo',
-        'hue-rotate-15/foo',
-        'hue-rotate-[45deg]/foo',
-        'invert/foo',
-        'invert-0/foo',
-        'invert-[var(--value)]/foo',
-        'drop-shadow-xl/foo',
-        'drop-shadow-[0_0_red]/foo',
-        'saturate-0/foo',
-        'saturate-[1.75]/foo',
-        'saturate-[var(--value)]/foo',
-        'sepia/foo',
-        'sepia-0/foo',
-        'sepia-[50%]/foo',
-        'sepia-[var(--value)]/foo',
-      ],
-      css`
-        @theme {
-          --drop-shadow: 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
-    ),
+    await run([
+      '-filter',
+      '-filter-none',
+      '-filter-[var(--value)]',
+      '-blur-xl',
+      '-blur-[4px]',
+      'brightness--50',
+      '-brightness-50',
+      '-brightness-[1.23]',
+      'brightness-unknown',
+      'contrast--50',
+      '-contrast-50',
+      '-contrast-[1.23]',
+      'contrast-unknown',
+      '-grayscale',
+      '-grayscale-0',
+      'grayscale--1',
+      '-grayscale-[var(--value)]',
+      'grayscale-unknown',
+      'hue-rotate--5',
+      'hue-rotate-unknown',
+      '-invert',
+      'invert--5',
+      '-invert-0',
+      '-invert-[var(--value)]',
+      'invert-unknown',
+      '-drop-shadow-xl',
+      '-drop-shadow-[0_0_red]',
+      '-saturate-0',
+      'saturate--5',
+      '-saturate-[1.75]',
+      '-saturate-[var(--value)]',
+      'saturate-saturate',
+      '-sepia',
+      'sepia--50',
+      '-sepia-0',
+      '-sepia-[50%]',
+      '-sepia-[var(--value)]',
+      'sepia-unknown',
+      'filter/foo',
+      'filter-none/foo',
+      'filter-[var(--value)]/foo',
+      'blur-xl/foo',
+      'blur-none/foo',
+      'blur-[4px]/foo',
+      'brightness-50/foo',
+      'brightness-[1.23]/foo',
+      'contrast-50/foo',
+      'contrast-[1.23]/foo',
+      'grayscale/foo',
+      'grayscale-0/foo',
+      'grayscale-[var(--value)]/foo',
+      'hue-rotate-15/foo',
+      'hue-rotate-[45deg]/foo',
+      'invert/foo',
+      'invert-0/foo',
+      'invert-[var(--value)]/foo',
+      'drop-shadow-xl/foo',
+      'drop-shadow-[0_0_red]/foo',
+      'saturate-0/foo',
+      'saturate-[1.75]/foo',
+      'saturate-[var(--value)]/foo',
+      'sepia/foo',
+      'sepia-0/foo',
+      'sepia-[50%]/foo',
+      'sepia-[var(--value)]/foo',
+    ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['blur-none'],
-      css`
-        @theme {
-          --blur-none: 2px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-blur: initial;
-          --tw-brightness: initial;
-          --tw-contrast: initial;
-          --tw-grayscale: initial;
-          --tw-hue-rotate: initial;
-          --tw-invert: initial;
-          --tw-opacity: initial;
-          --tw-saturate: initial;
-          --tw-sepia: initial;
-          --tw-drop-shadow: initial;
-          --tw-drop-shadow-color: initial;
-          --tw-drop-shadow-alpha: 100%;
-          --tw-drop-shadow-size: initial;
-        }
-      }
-    }
-
-    :root, :host {
-      --blur-none: 2px;
-    }
-
-    .blur-none {
-      --tw-blur: blur(var(--blur-none));
-      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
-    }
-
-    @property --tw-blur {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-brightness {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-contrast {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-grayscale {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-hue-rotate {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-invert {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-opacity {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-saturate {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-sepia {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-drop-shadow {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-drop-shadow-color {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-drop-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
-    @property --tw-drop-shadow-size {
-      syntax: "*";
-      inherits: false
-    }
-    "
-  `)
 })
 
 test('backdrop-filter', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --blur-xl: 24px;
+        }
+        @tailwind utilities;
+      `,
       [
         'backdrop-filter',
         'backdrop-filter-none',
@@ -24647,32 +13653,9 @@ test('backdrop-filter', async () => {
         'backdrop-sepia-[50%]',
         'backdrop-sepia-[var(--value)]',
       ],
-      css`
-        @theme {
-          --blur-xl: 24px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-backdrop-blur: initial;
-          --tw-backdrop-brightness: initial;
-          --tw-backdrop-contrast: initial;
-          --tw-backdrop-grayscale: initial;
-          --tw-backdrop-hue-rotate: initial;
-          --tw-backdrop-invert: initial;
-          --tw-backdrop-opacity: initial;
-          --tw-backdrop-saturate: initial;
-          --tw-backdrop-sepia: initial;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --blur-xl: 24px;
     }
 
@@ -24683,7 +13666,7 @@ test('backdrop-filter', async () => {
     }
 
     .backdrop-blur-none {
-      --tw-backdrop-blur:  ;
+      --tw-backdrop-blur: ;
       -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
       backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
     }
@@ -24914,8 +13897,7 @@ test('backdrop-filter', async () => {
     @property --tw-backdrop-sepia {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -24989,106 +13971,11 @@ test('backdrop-filter', async () => {
       'backdrop-sepia-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['backdrop-blur-none'],
-      css`
-        @theme {
-          --backdrop-blur-none: 2px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-backdrop-blur: initial;
-          --tw-backdrop-brightness: initial;
-          --tw-backdrop-contrast: initial;
-          --tw-backdrop-grayscale: initial;
-          --tw-backdrop-hue-rotate: initial;
-          --tw-backdrop-invert: initial;
-          --tw-backdrop-opacity: initial;
-          --tw-backdrop-saturate: initial;
-          --tw-backdrop-sepia: initial;
-        }
-      }
-    }
-
-    :root, :host {
-      --backdrop-blur-none: 2px;
-    }
-
-    .backdrop-blur-none {
-      --tw-backdrop-blur: blur(var(--backdrop-blur-none));
-      -webkit-backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
-      backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
-    }
-
-    @property --tw-backdrop-blur {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-brightness {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-contrast {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-grayscale {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-hue-rotate {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-invert {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-opacity {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-saturate {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-backdrop-sepia {
-      syntax: "*";
-      inherits: false
-    }
-    "
-  `)
 })
 
 test('transition', async () => {
   expect(
-    await run(
-      [
-        'transition',
-        'transition-none',
-        'transition-all',
-        'transition-transform',
-        'transition-shadow',
-        'transition-colors',
-        'transition-opacity',
-        'transition-[var(--value)]',
-      ],
+    await compileCss(
       css`
         @theme {
           --default-transition-timing-function: ease;
@@ -25100,17 +13987,26 @@ test('transition', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'transition',
+        'transition-none',
+        'transition-all',
+        'transition-transform',
+        'transition-shadow',
+        'transition-colors',
+        'transition-opacity',
+        'transition-[var(--value)]',
+      ],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --default-transition-timing-function: ease;
       --default-transition-duration: .1s;
       --transition-property-opacity: opacity;
     }
 
     .transition {
-      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
+      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
       transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
       transition-duration: var(--tw-duration, var(--default-transition-duration));
     }
@@ -25134,6 +14030,9 @@ test('transition', async () => {
     }
 
     .transition-opacity {
+      transition-property: opacity;
+      transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+      transition-duration: var(--tw-duration, var(--default-transition-duration));
       transition-property: var(--transition-property-opacity);
       transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
       transition-duration: var(--tw-duration, var(--default-transition-duration));
@@ -25153,13 +14052,11 @@ test('transition', async () => {
 
     .transition-none {
       transition-property: none;
-    }
-    "
+    }"
   `)
 
   expect(
-    await run(
-      ['transition', 'transition-all', 'transition-colors'],
+    await compileCss(
       css`
         @theme inline {
           --default-transition-timing-function: ease;
@@ -25167,11 +14064,11 @@ test('transition', async () => {
         }
         @tailwind utilities;
       `,
+      ['transition', 'transition-all', 'transition-colors'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    .transition {
-      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
+    ".transition {
+      transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter;
       transition-timing-function: var(--tw-ease, ease);
       transition-duration: var(--tw-duration, .1s);
     }
@@ -25186,18 +14083,22 @@ test('transition', async () => {
       transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
       transition-timing-function: var(--tw-ease, ease);
       transition-duration: var(--tw-duration, .1s);
-    }
-    "
+    }"
   `)
 
-  expect(await run(['transition-all'])).toMatchInlineSnapshot(`
-    "
-    .transition-all {
+  expect(
+    await compileCss(
+      css`
+        @tailwind utilities;
+      `,
+      ['transition-all'],
+    ),
+  ).toMatchInlineSnapshot(`
+    ".transition-all {
       transition-property: all;
       transition-timing-function: var(--tw-ease, ease);
       transition-duration: var(--tw-duration, 0s);
-    }
-    "
+    }"
   `)
 
   expect(
@@ -25217,43 +14118,17 @@ test('transition', async () => {
       'transition-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['transition-colors'],
-      css`
-        @theme {
-          --transition-property-colors: transform;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --transition-property-colors: transform;
-    }
-
-    .transition-colors {
-      transition-property: var(--transition-property-colors);
-      transition-timing-function: var(--tw-ease, ease);
-      transition-duration: var(--tw-duration, 0s);
-    }
-    "
-  `)
 })
 
 test('transition-behavior', async () => {
   expect(await run(['transition-discrete', 'transition-normal'])).toMatchInlineSnapshot(`
-    "
-    .transition-discrete {
+    ".transition-discrete {
       transition-behavior: allow-discrete;
     }
 
     .transition-normal {
       transition-behavior: normal;
-    }
-    "
+    }"
   `)
 
   expect(await run(['-transition-discrete', '-transition-normal'])).toEqual('')
@@ -25261,8 +14136,7 @@ test('transition-behavior', async () => {
 
 test('delay', async () => {
   expect(await run(['delay-123', 'delay-200', 'delay-[300ms]'])).toMatchInlineSnapshot(`
-    "
-    .delay-123 {
+    ".delay-123 {
       transition-delay: .123s;
     }
 
@@ -25272,8 +14146,7 @@ test('delay', async () => {
 
     .delay-\\[300ms\\] {
       transition-delay: .3s;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25291,16 +14164,7 @@ test('delay', async () => {
 
 test('duration', async () => {
   expect(await run(['duration-123', 'duration-200', 'duration-[300ms]'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-duration: initial;
-        }
-      }
-    }
-
-    .duration-123 {
+    ".duration-123 {
       --tw-duration: .123s;
       transition-duration: .123s;
     }
@@ -25318,8 +14182,7 @@ test('duration', async () => {
     @property --tw-duration {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25336,8 +14199,7 @@ test('duration', async () => {
 
 test('ease', async () => {
   expect(
-    await run(
-      ['ease-in', 'ease-out', 'ease-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --ease-in: cubic-bezier(0.4, 0, 1, 1);
@@ -25345,18 +14207,10 @@ test('ease', async () => {
         }
         @tailwind utilities;
       `,
+      ['ease-in', 'ease-out', 'ease-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-ease: initial;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --ease-in: cubic-bezier(.4, 0, 1, 1);
       --ease-out: cubic-bezier(0, 0, .2, 1);
     }
@@ -25379,8 +14233,7 @@ test('ease', async () => {
     @property --tw-ease {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25392,42 +14245,6 @@ test('ease', async () => {
       'ease-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['ease-linear'],
-      css`
-        @theme {
-          --ease-linear: steps(4);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-ease: initial;
-        }
-      }
-    }
-
-    :root, :host {
-      --ease-linear: steps(4);
-    }
-
-    .ease-linear {
-      --tw-ease: var(--ease-linear);
-      transition-timing-function: var(--ease-linear);
-    }
-
-    @property --tw-ease {
-      syntax: "*";
-      inherits: false
-    }
-    "
-  `)
 })
 
 test('will-change', async () => {
@@ -25440,8 +14257,7 @@ test('will-change', async () => {
       'will-change-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .will-change-\\[var\\(--value\\)\\] {
+    ".will-change-\\[var\\(--value\\)\\] {
       will-change: var(--value);
     }
 
@@ -25459,8 +14275,7 @@ test('will-change', async () => {
 
     .will-change-transform {
       will-change: transform;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25493,19 +14308,7 @@ test('contain', async () => {
       'contain-[unset]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-contain-size: initial;
-          --tw-contain-layout: initial;
-          --tw-contain-paint: initial;
-          --tw-contain-style: initial;
-        }
-      }
-    }
-
-    .contain-inline-size {
+    ".contain-inline-size {
       --tw-contain-size: inline-size;
       contain: var(--tw-contain-size, ) var(--tw-contain-layout, ) var(--tw-contain-paint, ) var(--tw-contain-style, );
     }
@@ -25564,8 +14367,7 @@ test('contain', async () => {
     @property --tw-contain-style {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25583,46 +14385,17 @@ test('contain', async () => {
 })
 
 test('content', async () => {
-  expect(
-    await run(
-      ['content-slash', 'content-["hello_world"]'],
-      css`
-        @theme {
-          --content-slash: '/';
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-content: "";
-        }
-      }
-    }
-
-    :root, :host {
-      --content-slash: "/";
-    }
-
-    .content-\\[\\"hello_world\\"\\] {
+  expect(await run(['content-["hello_world"]'])).toMatchInlineSnapshot(`
+    ".content-\\[\\"hello_world\\"\\] {
       --tw-content: "hello world";
       content: var(--tw-content);
     }
 
-    .content-slash {
-      --tw-content: var(--content-slash);
-      content: var(--tw-content);
-    }
-
     @property --tw-content {
       syntax: "*";
       inherits: false;
       initial-value: "";
-    }
-    "
+    }"
   `)
   expect(await run(['content', '-content-["hello_world"]', 'content-["hello_world"]/foo'])).toEqual(
     '',
@@ -25632,16 +14405,14 @@ test('content', async () => {
 test('forced-color-adjust', async () => {
   expect(await run(['forced-color-adjust-none', 'forced-color-adjust-auto']))
     .toMatchInlineSnapshot(`
-      "
-      .forced-color-adjust-auto {
-        forced-color-adjust: auto;
-      }
+    ".forced-color-adjust-auto {
+      forced-color-adjust: auto;
+    }
 
-      .forced-color-adjust-none {
-        forced-color-adjust: none;
-      }
-      "
-    `)
+    .forced-color-adjust-none {
+      forced-color-adjust: none;
+    }"
+  `)
   expect(
     await run([
       'forced',
@@ -25657,8 +14428,7 @@ test('forced-color-adjust', async () => {
 
 test('leading', async () => {
   expect(
-    await run(
-      ['leading-tight', 'leading-6', 'leading-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --leading-tight: 1.25;
@@ -25666,18 +14436,10 @@ test('leading', async () => {
         }
         @tailwind utilities;
       `,
+      ['leading-tight', 'leading-6', 'leading-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-leading: initial;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --leading-tight: 1.25;
       --leading-6: 1.5rem;
     }
@@ -25700,8 +14462,7 @@ test('leading', async () => {
     @property --tw-leading {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25714,48 +14475,11 @@ test('leading', async () => {
       'leading-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['leading-none'],
-      css`
-        @theme {
-          --leading-none: 2;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-leading: initial;
-        }
-      }
-    }
-
-    :root, :host {
-      --leading-none: 2;
-    }
-
-    .leading-none {
-      --tw-leading: var(--leading-none);
-      line-height: var(--leading-none);
-    }
-
-    @property --tw-leading {
-      syntax: "*";
-      inherits: false
-    }
-    "
-  `)
 })
 
 test('tracking', async () => {
   expect(
-    await run(
-      ['tracking-normal', 'tracking-wide', 'tracking-[var(--value)]', '-tracking-[var(--value)]'],
+    await compileCss(
       css`
         @theme {
           --tracking-normal: 0em;
@@ -25763,18 +14487,10 @@ test('tracking', async () => {
         }
         @tailwind utilities;
       `,
+      ['tracking-normal', 'tracking-wide', 'tracking-[var(--value)]', '-tracking-[var(--value)]'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-tracking: initial;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --tracking-normal: 0em;
       --tracking-wide: .025em;
     }
@@ -25802,8 +14518,7 @@ test('tracking', async () => {
     @property --tw-tracking {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25818,8 +14533,7 @@ test('tracking', async () => {
 
 test('font-smoothing', async () => {
   expect(await run(['antialiased', 'subpixel-antialiased'])).toMatchInlineSnapshot(`
-    "
-    .antialiased {
+    ".antialiased {
       -webkit-font-smoothing: antialiased;
       -moz-osx-font-smoothing: grayscale;
     }
@@ -25827,8 +14541,7 @@ test('font-smoothing', async () => {
     .subpixel-antialiased {
       -webkit-font-smoothing: auto;
       -moz-osx-font-smoothing: auto;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25854,20 +14567,7 @@ test('font-variant-numeric', async () => {
       'stacked-fractions',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-ordinal: initial;
-          --tw-slashed-zero: initial;
-          --tw-numeric-figure: initial;
-          --tw-numeric-spacing: initial;
-          --tw-numeric-fraction: initial;
-        }
-      }
-    }
-
-    .diagonal-fractions {
+    ".diagonal-fractions {
       --tw-numeric-fraction: diagonal-fractions;
       font-variant-numeric: var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, );
     }
@@ -25934,8 +14634,7 @@ test('font-variant-numeric', async () => {
     @property --tw-numeric-fraction {
       syntax: "*";
       inherits: false
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -25963,7 +14662,13 @@ test('font-variant-numeric', async () => {
 
 test('outline', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         'outline',
         'outline-hidden',
@@ -25980,7 +14685,6 @@ test('outline', async () => {
         'outline-red-500/50',
         'outline-red-500/[0.5]',
         'outline-red-500/[50%]',
-        'outline-blue-500',
         'outline-current',
         'outline-current/50',
         'outline-current/[0.5]',
@@ -26013,27 +14717,10 @@ test('outline', async () => {
         'outline-[length:var(--my-width)]',
         'outline-[percentage:var(--my-width)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --outline-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-outline-style: solid;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --outline-color-blue-500: #3b82f6;
     }
 
     .outline-hidden {
@@ -26083,7 +14770,7 @@ test('outline', async () => {
     }
 
     .outline-\\[\\#0088cc\\]\\/50, .outline-\\[\\#0088cc\\]\\/\\[0\\.5\\], .outline-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      outline-color: oklab(59.9824% -.067 -.124 / .5);
+      outline-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
     .outline-\\[black\\] {
@@ -26102,98 +14789,28 @@ test('outline', async () => {
       outline-color: oklab(0% none none / .5);
     }
 
-    .outline-\\[color\\:var\\(--value\\)\\], .outline-\\[color\\:var\\(--value\\)\\]\\/50 {
+    .outline-\\[color\\:var\\(--value\\)\\] {
       outline-color: var(--value);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-\\[color\\:var\\(--value\\)\\]\\/50 {
-        outline-color: color-mix(in oklab, var(--value) 50%, transparent);
-      }
+    .outline-\\[color\\:var\\(--value\\)\\]\\/50, .outline-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\], .outline-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
+      outline-color: color-mix(in oklab, var(--value) 50%, transparent);
     }
 
-    .outline-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
+    .outline-\\[var\\(--value\\)\\] {
       outline-color: var(--value);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-        outline-color: color-mix(in oklab, var(--value) 50%, transparent);
-      }
+    .outline-\\[var\\(--value\\)\\]\\/50, .outline-\\[var\\(--value\\)\\]\\/\\[0\\.5\\], .outline-\\[var\\(--value\\)\\]\\/\\[50\\%\\] {
+      outline-color: color-mix(in oklab, var(--value) 50%, transparent);
     }
 
-    .outline-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-      outline-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-        outline-color: color-mix(in oklab, var(--value) 50%, transparent);
-      }
-    }
-
-    .outline-\\[var\\(--value\\)\\], .outline-\\[var\\(--value\\)\\]\\/50 {
-      outline-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-\\[var\\(--value\\)\\]\\/50 {
-        outline-color: color-mix(in oklab, var(--value) 50%, transparent);
-      }
-    }
-
-    .outline-\\[var\\(--value\\)\\]\\/\\[0\\.5\\] {
-      outline-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-\\[var\\(--value\\)\\]\\/\\[0\\.5\\] {
-        outline-color: color-mix(in oklab, var(--value) 50%, transparent);
-      }
-    }
-
-    .outline-\\[var\\(--value\\)\\]\\/\\[50\\%\\] {
-      outline-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-\\[var\\(--value\\)\\]\\/\\[50\\%\\] {
-        outline-color: color-mix(in oklab, var(--value) 50%, transparent);
-      }
-    }
-
-    .outline-blue-500 {
-      outline-color: var(--outline-color-blue-500);
-    }
-
-    .outline-current, .outline-current\\/50 {
+    .outline-current {
       outline-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-current\\/50 {
-        outline-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .outline-current\\/\\[0\\.5\\] {
-      outline-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-current\\/\\[0\\.5\\] {
-        outline-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .outline-current\\/\\[50\\%\\] {
-      outline-color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-current\\/\\[50\\%\\] {
-        outline-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .outline-current\\/50, .outline-current\\/\\[0\\.5\\], .outline-current\\/\\[50\\%\\] {
+      outline-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .outline-inherit {
@@ -26204,34 +14821,8 @@ test('outline', async () => {
       outline-color: var(--color-red-500);
     }
 
-    .outline-red-500\\/50 {
-      outline-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-red-500\\/50 {
-        outline-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .outline-red-500\\/\\[0\\.5\\] {
-      outline-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-red-500\\/\\[0\\.5\\] {
-        outline-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .outline-red-500\\/\\[50\\%\\] {
-      outline-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .outline-red-500\\/\\[50\\%\\] {
-        outline-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .outline-red-500\\/50, .outline-red-500\\/\\[0\\.5\\], .outline-red-500\\/\\[50\\%\\] {
+      outline-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .outline-transparent {
@@ -26267,30 +14858,20 @@ test('outline', async () => {
       syntax: "*";
       inherits: false;
       initial-value: solid;
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      ['outline'],
+    await compileCss(
       css`
         @theme {
           --default-outline-width: 2px;
         }
         @tailwind utilities;
       `,
+      ['outline'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-outline-style: solid;
-        }
-      }
-    }
-
-    .outline {
+    ".outline {
       outline-style: var(--tw-outline-style);
       outline-width: 2px;
     }
@@ -26299,8 +14880,7 @@ test('outline', async () => {
       syntax: "*";
       inherits: false;
       initial-value: solid;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -26352,8 +14932,7 @@ test('outline-offset', async () => {
       '-outline-offset-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .-outline-offset-4 {
+    ".-outline-offset-4 {
       outline-offset: calc(4px * -1);
     }
 
@@ -26367,8 +14946,7 @@ test('outline-offset', async () => {
 
     .outline-offset-\\[var\\(--value\\)\\] {
       outline-offset: var(--value);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -26393,8 +14971,7 @@ test('opacity', async () => {
       'opacity-[var(--value)]',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .opacity-2\\.5 {
+    ".opacity-2\\.5 {
       opacity: .025;
     }
 
@@ -26412,8 +14989,7 @@ test('opacity', async () => {
 
     .opacity-\\[var\\(--value\\)\\] {
       opacity: var(--value);
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -26431,7 +15007,12 @@ test('opacity', async () => {
 
 test('underline-offset', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+        }
+        @tailwind utilities;
+      `,
       [
         'underline-offset-auto',
         'underline-offset-4',
@@ -26441,15 +15022,9 @@ test('underline-offset', async () => {
         'underline-offset-[var(--value)]',
         '-underline-offset-[var(--value)]',
       ],
-      css`
-        @theme {
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    .-underline-offset-4 {
+    ".-underline-offset-4 {
       text-underline-offset: calc(4px * -1);
     }
 
@@ -26475,8 +15050,7 @@ test('underline-offset', async () => {
 
     .underline-offset-auto {
       text-underline-offset: auto;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -26493,33 +15067,21 @@ test('underline-offset', async () => {
       '-underline-offset-[var(--value)]/foo',
     ]),
   ).toEqual('')
-
-  expect(
-    await run(
-      ['underline-offset-auto'],
-      css`
-        @theme {
-          --text-underline-offset-auto: 4px;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
-      --text-underline-offset-auto: 4px;
-    }
-
-    .underline-offset-auto {
-      text-underline-offset: var(--text-underline-offset-auto);
-    }
-    "
-  `)
 })
 
 test('text', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --spacing: 0.25rem;
+          --color-red-500: #ef4444;
+          --text-sm: 0.875rem;
+          --text-sm--line-height: 1.25rem;
+          --leading-snug: 1.375;
+        }
+        @tailwind utilities;
+      `,
       [
         // color
         'text-red-500',
@@ -26529,7 +15091,6 @@ test('text', async () => {
         'text-red-500/2.75',
         'text-red-500/[0.5]',
         'text-red-500/[50%]',
-        'text-blue-500',
         'text-current',
         'text-current/50',
         'text-current/[0.5]',
@@ -26549,18 +15110,15 @@ test('text', async () => {
         'text-[color:var(--my-color)]/50',
         'text-[color:var(--my-color)]/[0.5]',
         'text-[color:var(--my-color)]/[50%]',
-        'text-[--alpha(red/20%)]',
 
         // font-size / line-height / letter-spacing / font-weight
         'text-sm',
-        'text-sm/0',
         'text-sm/6',
         'text-sm/none',
         'text-[10px]/none',
         'text-sm/snug',
         'text-sm/[4px]',
         'text-[12px]',
-        'text-[12px]/0',
         'text-[12px]/6',
         'text-[50%]',
         'text-[50%]/6',
@@ -26575,26 +15133,12 @@ test('text', async () => {
         'text-[clamp(1rem,2rem,3rem)]',
         'text-[clamp(1rem,var(--size),3rem)]',
         'text-[clamp(1rem,var(--size),3rem)]/9',
-        'text-[--spacing(2)]',
       ],
-      css`
-        @theme {
-          --spacing: 0.25rem;
-          --color-red-500: #ef4444;
-          --text-color-blue-500: #3b82f6;
-          --text-sm: 0.875rem;
-          --text-sm--line-height: 1.25rem;
-          --leading-snug: 1.375;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --spacing: .25rem;
       --color-red-500: #ef4444;
-      --text-color-blue-500: #3b82f6;
       --text-sm: .875rem;
       --text-sm--line-height: 1.25rem;
       --leading-snug: 1.375;
@@ -26605,11 +15149,6 @@ test('text', async () => {
       line-height: 1;
     }
 
-    .text-\\[12px\\]\\/0 {
-      font-size: 12px;
-      line-height: 0;
-    }
-
     .text-\\[12px\\]\\/6 {
       font-size: 12px;
       line-height: calc(var(--spacing) * 6);
@@ -26640,11 +15179,6 @@ test('text', async () => {
       line-height: var(--tw-leading, var(--text-sm--line-height));
     }
 
-    .text-sm\\/0 {
-      font-size: var(--text-sm);
-      line-height: 0;
-    }
-
     .text-sm\\/6 {
       font-size: var(--text-sm);
       line-height: calc(var(--spacing) * 6);
@@ -26665,10 +15199,6 @@ test('text', async () => {
       line-height: var(--leading-snug);
     }
 
-    .text-\\[--spacing\\(2\\)\\] {
-      font-size: calc(var(--spacing) * 2);
-    }
-
     .text-\\[12px\\] {
       font-size: 12px;
     }
@@ -26706,105 +15236,31 @@ test('text', async () => {
     }
 
     .text-\\[\\#0088cc\\]\\/50, .text-\\[\\#0088cc\\]\\/\\[0\\.5\\], .text-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      color: oklab(59.9824% -.067 -.124 / .5);
+      color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .text-\\[--alpha\\(red\\/20\\%\\)\\] {
-      color: oklab(62.7955% .224 .125 / .2);
-    }
-
-    .text-\\[color\\:var\\(--my-color\\)\\], .text-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+    .text-\\[color\\:var\\(--my-color\\)\\] {
       color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .text-\\[color\\:var\\(--my-color\\)\\]\\/50, .text-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .text-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .text-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
+    .text-\\[var\\(--my-color\\)\\] {
       color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .text-\\[var\\(--my-color\\)\\]\\/50, .text-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .text-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .text-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .text-\\[var\\(--my-color\\)\\], .text-\\[var\\(--my-color\\)\\]\\/50 {
-      color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-\\[var\\(--my-color\\)\\]\\/50 {
-        color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .text-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .text-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .text-blue-500 {
-      color: var(--text-color-blue-500);
-    }
-
-    .text-current, .text-current\\/50 {
+    .text-current {
       color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-current\\/50 {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .text-current\\/\\[0\\.5\\] {
-      color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-current\\/\\[0\\.5\\] {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .text-current\\/\\[50\\%\\] {
-      color: currentColor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-current\\/\\[50\\%\\] {
-        color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .text-current\\/50, .text-current\\/\\[0\\.5\\], .text-current\\/\\[50\\%\\] {
+      color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .text-inherit {
@@ -26816,72 +15272,33 @@ test('text', async () => {
     }
 
     .text-red-500\\/2\\.5 {
-      color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-red-500\\/2\\.5 {
-        color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .text-red-500\\/2\\.25 {
-      color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-red-500\\/2\\.25 {
-        color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .text-red-500\\/2\\.75 {
-      color: #ef444407;
+      color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-red-500\\/2\\.75 {
-        color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .text-red-500\\/50 {
-      color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-red-500\\/50 {
-        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .text-red-500\\/\\[0\\.5\\] {
-      color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-red-500\\/\\[0\\.5\\] {
-        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .text-red-500\\/\\[50\\%\\] {
-      color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-red-500\\/\\[50\\%\\] {
-        color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .text-red-500\\/50, .text-red-500\\/\\[0\\.5\\], .text-red-500\\/\\[50\\%\\] {
+      color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .text-transparent {
       color: #0000;
-    }
-    "
+    }"
   `)
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme inline reference {
+          --text-sm: 0.875rem;
+        }
+        @tailwind utilities;
+      `,
       [
         'text',
         // color
@@ -26907,418 +15324,31 @@ test('text', async () => {
         '-text-sm/[4px]',
         'text-[10px]/foo',
       ],
-      css`
-        @theme inline reference {
-          --text-sm: 0.875rem;
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toEqual('')
-})
-
-test('text-shadow', async () => {
-  expect(
-    await run(
-      [
-        // Shadows
-        'text-shadow-2xs',
-        'text-shadow-sm',
-        'text-shadow-none',
-        'text-shadow-[12px_12px_#0088cc]',
-        'text-shadow-[12px_12px_var(--value)]',
-        'text-shadow-[10px_10px]',
-        'text-shadow-[var(--value)]',
-        'text-shadow-[shadow:var(--value)]',
-
-        'text-shadow-sm/25',
-        'text-shadow-sm/12.5',
-        'text-shadow-[12px_12px_#0088cc]/25',
-        'text-shadow-[12px_12px_var(--value)]/25',
-        'text-shadow-[10px_10px]/25',
-
-        // Colors
-        'text-shadow-red-500',
-        'text-shadow-red-500/50',
-        'text-shadow-red-500/2.25',
-        'text-shadow-red-500/2.5',
-        'text-shadow-red-500/2.75',
-        'text-shadow-red-500/[0.5]',
-        'text-shadow-red-500/[50%]',
-        'text-shadow-current',
-        'text-shadow-current/50',
-        'text-shadow-current/[0.5]',
-        'text-shadow-current/[50%]',
-        'text-shadow-inherit',
-        'text-shadow-transparent',
-        'text-shadow-[#0088cc]',
-        'text-shadow-[#0088cc]/50',
-        'text-shadow-[#0088cc]/[0.5]',
-        'text-shadow-[#0088cc]/[50%]',
-        'text-shadow-[color:var(--value)]',
-        'text-shadow-[color:var(--value)]/50',
-        'text-shadow-[color:var(--value)]/[0.5]',
-        'text-shadow-[color:var(--value)]/[50%]',
-      ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.1);
-          --text-shadow-sm: 0px 1px 2px rgb(0 0 0 / 0.06), 0px 2px 2px rgb(0 0 0 / 0.06);
-        }
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-text-shadow-color: initial;
-          --tw-text-shadow-alpha: 100%;
-        }
-      }
-    }
-
-    :root, :host {
-      --color-red-500: #ef4444;
-    }
-
-    .text-shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-      --tw-text-shadow-alpha: 25%;
-      text-shadow: 12px 12px var(--tw-text-shadow-color, var(--value));
-    }
-
-    @supports (color: lab(from red l a b)) {
-      .text-shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-        text-shadow: 12px 12px var(--tw-text-shadow-color, oklab(from var(--value) l a b / 25%));
-      }
-    }
-
-    .text-shadow-\\[10px_10px\\]\\/25 {
-      --tw-text-shadow-alpha: 25%;
-      text-shadow: 10px 10px var(--tw-text-shadow-color, currentcolor);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[10px_10px\\]\\/25 {
-        text-shadow: 10px 10px var(--tw-text-shadow-color, color-mix(in oklab, currentcolor 25%, transparent));
-      }
-    }
-
-    .text-shadow-\\[12px_12px_\\#0088cc\\]\\/25 {
-      --tw-text-shadow-alpha: 25%;
-      text-shadow: 12px 12px var(--tw-text-shadow-color, oklab(59.9824% -.067 -.124 / .25));
-    }
-
-    .text-shadow-sm\\/12\\.5 {
-      --tw-text-shadow-alpha: 12.5%;
-      text-shadow: 0px 1px 2px var(--tw-text-shadow-color, oklab(0% 0 0 / .125)), 0px 2px 2px var(--tw-text-shadow-color, oklab(0% 0 0 / .125));
-    }
-
-    .text-shadow-sm\\/25 {
-      --tw-text-shadow-alpha: 25%;
-      text-shadow: 0px 1px 2px var(--tw-text-shadow-color, oklab(0% 0 0 / .25)), 0px 2px 2px var(--tw-text-shadow-color, oklab(0% 0 0 / .25));
-    }
-
-    .text-shadow-2xs {
-      text-shadow: 0px 1px 0px var(--tw-text-shadow-color, #0000001a);
-    }
-
-    .text-shadow-\\[\\#0088cc\\] {
-      --tw-text-shadow-color: #08c;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[\\#0088cc\\] {
-        --tw-text-shadow-color: color-mix(in oklab, #08c var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[\\#0088cc\\]\\/50 {
-      --tw-text-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[\\#0088cc\\]\\/50 {
-        --tw-text-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\] {
-      --tw-text-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\] {
-        --tw-text-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-text-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-        --tw-text-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[10px_10px\\] {
-      text-shadow: 10px 10px var(--tw-text-shadow-color, currentcolor);
-    }
-
-    .text-shadow-\\[12px_12px_\\#0088cc\\] {
-      text-shadow: 12px 12px var(--tw-text-shadow-color, #08c);
-    }
-
-    .text-shadow-\\[12px_12px_var\\(--value\\)\\] {
-      text-shadow: 12px 12px var(--tw-text-shadow-color, var(--value));
-    }
-
-    .text-shadow-\\[color\\:var\\(--value\\)\\] {
-      --tw-text-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[color\\:var\\(--value\\)\\] {
-        --tw-text-shadow-color: color-mix(in oklab, var(--value) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[color\\:var\\(--value\\)\\]\\/50 {
-      --tw-text-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[color\\:var\\(--value\\)\\]\\/50 {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-      --tw-text-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-      --tw-text-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-\\[shadow\\:var\\(--value\\)\\], .text-shadow-\\[var\\(--value\\)\\] {
-      text-shadow: var(--value);
-    }
-
-    .text-shadow-current {
-      --tw-text-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-current {
-        --tw-text-shadow-color: color-mix(in oklab, currentcolor var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-current\\/50 {
-      --tw-text-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-current\\/50 {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-current\\/\\[0\\.5\\] {
-      --tw-text-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-current\\/\\[0\\.5\\] {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-current\\/\\[50\\%\\] {
-      --tw-text-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-current\\/\\[50\\%\\] {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-inherit {
-      --tw-text-shadow-color: inherit;
-    }
-
-    .text-shadow-none {
-      text-shadow: none;
-    }
-
-    .text-shadow-red-500 {
-      --tw-text-shadow-color: #ef4444;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500 {
-        --tw-text-shadow-color: color-mix(in oklab, var(--color-red-500) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-red-500\\/2\\.5 {
-      --tw-text-shadow-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500\\/2\\.5 {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.5%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-red-500\\/2\\.25 {
-      --tw-text-shadow-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500\\/2\\.25 {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.25%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-red-500\\/2\\.75 {
-      --tw-text-shadow-color: #ef444407;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500\\/2\\.75 {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.75%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-red-500\\/50 {
-      --tw-text-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500\\/50 {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-red-500\\/\\[0\\.5\\] {
-      --tw-text-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500\\/\\[0\\.5\\] {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-red-500\\/\\[50\\%\\] {
-      --tw-text-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-red-500\\/\\[50\\%\\] {
-        --tw-text-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    .text-shadow-sm {
-      text-shadow: 0px 1px 2px var(--tw-text-shadow-color, #0000000f), 0px 2px 2px var(--tw-text-shadow-color, #0000000f);
-    }
-
-    .text-shadow-transparent {
-      --tw-text-shadow-color: transparent;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .text-shadow-transparent {
-        --tw-text-shadow-color: color-mix(in oklab, transparent var(--tw-text-shadow-alpha), transparent);
-      }
-    }
-
-    @property --tw-text-shadow-color {
-      syntax: "*";
-      inherits: false
-    }
-
-    @property --tw-text-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-    "
-  `)
-  expect(
-    await run(
-      [
-        '-text-shadow-sm',
-        '-text-shadow-none',
-        '-text-shadow-red-500',
-        '-text-shadow-red-500/50',
-        '-text-shadow-red-500/[0.5]',
-        '-text-shadow-red-500/[50%]',
-        '-text-shadow-current',
-        '-text-shadow-current/50',
-        '-text-shadow-current/[0.5]',
-        '-text-shadow-current/[50%]',
-        '-text-shadow-inherit',
-        '-text-shadow-transparent',
-        '-text-shadow-[#0088cc]',
-        '-text-shadow-[#0088cc]/50',
-        '-text-shadow-[#0088cc]/[0.5]',
-        '-text-shadow-[#0088cc]/[50%]',
-        '-text-shadow-[var(--value)]',
-        'text-shadow/foo',
-        'text-shadow-sm/foo',
-      ],
-      css`
-        @theme {
-          --text-shadow: 0 1px 1px rgb(0 0 0 / 0.05);
-          --text-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toEqual('')
 })
 
 test('shadow', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+          --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
+          --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+        }
+        @tailwind utilities;
+      `,
       [
         // Shadows
         'shadow-sm',
         'shadow-xl',
         'shadow-none',
         'shadow-[12px_12px_#0088cc]',
-        'shadow-[12px_12px_var(--value)]',
         'shadow-[10px_10px]',
         'shadow-[var(--value)]',
         'shadow-[shadow:var(--value)]',
 
-        'shadow-sm/25',
-        'shadow-sm/12.5',
-        'shadow-[12px_12px_#0088cc]/25',
-        'shadow-[12px_12px_var(--value)]/25',
-        'shadow-[10px_10px]/25',
-
         // Colors
         'shadow-red-500',
         'shadow-red-500/50',
@@ -27327,7 +15357,6 @@ test('shadow', async () => {
         'shadow-red-500/2.75',
         'shadow-red-500/[0.5]',
         'shadow-red-500/[50%]',
-        'shadow-blue-500',
         'shadow-current',
         'shadow-current/50',
         'shadow-current/[0.5]',
@@ -27343,90 +15372,10 @@ test('shadow', async () => {
         'shadow-[color:var(--value)]/[0.5]',
         'shadow-[color:var(--value)]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --box-shadow-color-blue-500: #3b82f6;
-          --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-          --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-shadow: 0 0 #0000;
-          --tw-shadow-color: initial;
-          --tw-shadow-alpha: 100%;
-          --tw-inset-shadow: 0 0 #0000;
-          --tw-inset-shadow-color: initial;
-          --tw-inset-shadow-alpha: 100%;
-          --tw-ring-color: initial;
-          --tw-ring-shadow: 0 0 #0000;
-          --tw-inset-ring-color: initial;
-          --tw-inset-ring-shadow: 0 0 #0000;
-          --tw-ring-inset: initial;
-          --tw-ring-offset-width: 0px;
-          --tw-ring-offset-color: #fff;
-          --tw-ring-offset-shadow: 0 0 #0000;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --box-shadow-color-blue-500: #3b82f6;
-    }
-
-    .shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-      --tw-shadow-alpha: 25%;
-      --tw-shadow: 12px 12px var(--tw-shadow-color, var(--value));
-    }
-
-    @supports (color: lab(from red l a b)) {
-      .shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-        --tw-shadow: 12px 12px var(--tw-shadow-color, oklab(from var(--value) l a b / 25%));
-      }
-    }
-
-    .shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .shadow-\\[10px_10px\\]\\/25 {
-      --tw-shadow-alpha: 25%;
-      --tw-shadow: 10px 10px var(--tw-shadow-color, currentcolor);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[10px_10px\\]\\/25 {
-        --tw-shadow: 10px 10px var(--tw-shadow-color, color-mix(in oklab, currentcolor 25%, transparent));
-      }
-    }
-
-    .shadow-\\[10px_10px\\]\\/25 {
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .shadow-\\[12px_12px_\\#0088cc\\]\\/25 {
-      --tw-shadow-alpha: 25%;
-      --tw-shadow: 12px 12px var(--tw-shadow-color, oklab(59.9824% -.067 -.124 / .25));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .shadow-sm\\/12\\.5 {
-      --tw-shadow-alpha: 12.5%;
-      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, oklab(0% 0 0 / .125)), 0 1px 2px -1px var(--tw-shadow-color, oklab(0% 0 0 / .125));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .shadow-sm\\/25 {
-      --tw-shadow-alpha: 25%;
-      --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, oklab(0% 0 0 / .25)), 0 1px 2px -1px var(--tw-shadow-color, oklab(0% 0 0 / .25));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .shadow-\\[10px_10px\\] {
@@ -27439,11 +15388,6 @@ test('shadow', async () => {
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
-    .shadow-\\[12px_12px_var\\(--value\\)\\] {
-      --tw-shadow: 12px 12px var(--tw-shadow-color, var(--value));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
     .shadow-\\[shadow\\:var\\(--value\\)\\], .shadow-\\[var\\(--value\\)\\] {
       --tw-shadow: var(--value);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -27468,130 +15412,24 @@ test('shadow', async () => {
       --tw-shadow-color: #08c;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[\\#0088cc\\] {
-        --tw-shadow-color: color-mix(in oklab, #08c var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-\\[\\#0088cc\\]\\/50 {
-      --tw-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[\\#0088cc\\]\\/50 {
-        --tw-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\] {
-      --tw-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\] {
-        --tw-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-        --tw-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-shadow-alpha), transparent);
-      }
+    .shadow-\\[\\#0088cc\\]\\/50, .shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\], .shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
+      --tw-shadow-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
     .shadow-\\[color\\:var\\(--value\\)\\] {
       --tw-shadow-color: var(--value);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[color\\:var\\(--value\\)\\] {
-        --tw-shadow-color: color-mix(in oklab, var(--value) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-\\[color\\:var\\(--value\\)\\]\\/50 {
-      --tw-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[color\\:var\\(--value\\)\\]\\/50 {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-      --tw-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-      --tw-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-blue-500 {
-      --tw-shadow-color: #3b82f6;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-blue-500 {
-        --tw-shadow-color: color-mix(in oklab, var(--box-shadow-color-blue-500) var(--tw-shadow-alpha), transparent);
-      }
+    .shadow-\\[color\\:var\\(--value\\)\\]\\/50, .shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\], .shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
+      --tw-shadow-color: color-mix(in oklab, var(--value) 50%, transparent);
     }
 
     .shadow-current {
-      --tw-shadow-color: currentcolor;
+      --tw-shadow-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-current {
-        --tw-shadow-color: color-mix(in oklab, currentcolor var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-current\\/50 {
-      --tw-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-current\\/50 {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-current\\/\\[0\\.5\\] {
-      --tw-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-current\\/\\[0\\.5\\] {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-current\\/\\[50\\%\\] {
-      --tw-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-current\\/\\[50\\%\\] {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
+    .shadow-current\\/50, .shadow-current\\/\\[0\\.5\\], .shadow-current\\/\\[50\\%\\] {
+      --tw-shadow-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .shadow-inherit {
@@ -27599,85 +15437,29 @@ test('shadow', async () => {
     }
 
     .shadow-red-500 {
-      --tw-shadow-color: #ef4444;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500 {
-        --tw-shadow-color: color-mix(in oklab, var(--color-red-500) var(--tw-shadow-alpha), transparent);
-      }
+      --tw-shadow-color: var(--color-red-500);
     }
 
     .shadow-red-500\\/2\\.5 {
-      --tw-shadow-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500\\/2\\.5 {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.5%, transparent) var(--tw-shadow-alpha), transparent);
-      }
+      --tw-shadow-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .shadow-red-500\\/2\\.25 {
-      --tw-shadow-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500\\/2\\.25 {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.25%, transparent) var(--tw-shadow-alpha), transparent);
-      }
+      --tw-shadow-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .shadow-red-500\\/2\\.75 {
-      --tw-shadow-color: #ef444407;
+      --tw-shadow-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500\\/2\\.75 {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.75%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-red-500\\/50 {
-      --tw-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500\\/50 {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-red-500\\/\\[0\\.5\\] {
-      --tw-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500\\/\\[0\\.5\\] {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
-    }
-
-    .shadow-red-500\\/\\[50\\%\\] {
-      --tw-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-red-500\\/\\[50\\%\\] {
-        --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-shadow-alpha), transparent);
-      }
+    .shadow-red-500\\/50, .shadow-red-500\\/\\[0\\.5\\], .shadow-red-500\\/\\[50\\%\\] {
+      --tw-shadow-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .shadow-transparent {
       --tw-shadow-color: transparent;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .shadow-transparent {
-        --tw-shadow-color: color-mix(in oklab, transparent var(--tw-shadow-alpha), transparent);
-      }
-    }
-
     @property --tw-shadow {
       syntax: "*";
       inherits: false;
@@ -27689,12 +15471,6 @@ test('shadow', async () => {
       inherits: false
     }
 
-    @property --tw-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-inset-shadow {
       syntax: "*";
       inherits: false;
@@ -27706,12 +15482,6 @@ test('shadow', async () => {
       inherits: false
     }
 
-    @property --tw-inset-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-ring-color {
       syntax: "*";
       inherits: false
@@ -27755,66 +15525,51 @@ test('shadow', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0 0 #0000;
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      [
-        '-shadow-sm',
-        '-shadow-none',
-        '-shadow-red-500',
-        '-shadow-red-500/50',
-        '-shadow-red-500/[0.5]',
-        '-shadow-red-500/[50%]',
-        '-shadow-current',
-        '-shadow-current/50',
-        '-shadow-current/[0.5]',
-        '-shadow-current/[50%]',
-        '-shadow-inherit',
-        '-shadow-transparent',
-        '-shadow-[#0088cc]',
-        '-shadow-[#0088cc]/50',
-        '-shadow-[#0088cc]/[0.5]',
-        '-shadow-[#0088cc]/[50%]',
-        '-shadow-[var(--value)]',
-        'shadow/foo',
-        'shadow-sm/foo',
-        'shadow-[10px_10px]/foo',
-        'shadow-[#0088cc]/foo',
-      ],
-      css`
-        @theme {
-          --shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
-          --shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
-        }
-        @tailwind utilities;
-      `,
-    ),
+    await run([
+      '-shadow-xl',
+      '-shadow-none',
+      '-shadow-red-500',
+      '-shadow-red-500/50',
+      '-shadow-red-500/[0.5]',
+      '-shadow-red-500/[50%]',
+      '-shadow-current',
+      '-shadow-current/50',
+      '-shadow-current/[0.5]',
+      '-shadow-current/[50%]',
+      '-shadow-inherit',
+      '-shadow-transparent',
+      '-shadow-[#0088cc]',
+      '-shadow-[#0088cc]/50',
+      '-shadow-[#0088cc]/[0.5]',
+      '-shadow-[#0088cc]/[50%]',
+      '-shadow-[var(--value)]',
+    ]),
   ).toEqual('')
 })
 
 test('inset-shadow', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+          --inset-shadow: inset 0 2px 4px rgb(0 0 0 / 0.05);
+          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
+        }
+        @tailwind utilities;
+      `,
       [
         // Shadows
         'inset-shadow',
         'inset-shadow-sm',
         'inset-shadow-none',
         'inset-shadow-[12px_12px_#0088cc]',
-        'inset-shadow-[12px_12px_var(--value)]',
         'inset-shadow-[10px_10px]',
         'inset-shadow-[var(--value)]',
         'inset-shadow-[shadow:var(--value)]',
-        'inset-shadow-[12px_12px_#0088cc,12px_12px_var(--value,#0088cc)]',
-
-        'inset-shadow-sm/25',
-        'inset-shadow-sm/12.5',
-        'inset-shadow-[12px_12px_#0088cc]/25',
-        'inset-shadow-[12px_12px_var(--value)]/25',
-        'inset-shadow-[10px_10px]/25',
-        'inset-shadow-[12px_12px_#0088cc,12px_12px_var(--value,#0088cc)]/25',
 
         // Colors
         'inset-shadow-red-500',
@@ -27839,105 +15594,12 @@ test('inset-shadow', async () => {
         'inset-shadow-[color:var(--value)]/[0.5]',
         'inset-shadow-[color:var(--value)]/[50%]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --inset-shadow: inset 0 2px 4px rgb(0 0 0 / 0.05);
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-shadow: 0 0 #0000;
-          --tw-shadow-color: initial;
-          --tw-shadow-alpha: 100%;
-          --tw-inset-shadow: 0 0 #0000;
-          --tw-inset-shadow-color: initial;
-          --tw-inset-shadow-alpha: 100%;
-          --tw-ring-color: initial;
-          --tw-ring-shadow: 0 0 #0000;
-          --tw-inset-ring-color: initial;
-          --tw-inset-ring-shadow: 0 0 #0000;
-          --tw-ring-inset: initial;
-          --tw-ring-offset-width: 0px;
-          --tw-ring-offset-color: #fff;
-          --tw-ring-offset-shadow: 0 0 #0000;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
     }
 
-    .inset-shadow-\\[12px_12px_\\#0088cc\\,12px_12px_var\\(--value\\,\\#0088cc\\)\\]\\/25 {
-      --tw-inset-shadow-alpha: 25%;
-      --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, #08c), inset 12px 12px var(--tw-inset-shadow-color, var(--value, #08c));
-    }
-
-    @supports (color: lab(from red l a b)) {
-      .inset-shadow-\\[12px_12px_\\#0088cc\\,12px_12px_var\\(--value\\,\\#0088cc\\)\\]\\/25 {
-        --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, oklab(59.9824% -.067 -.124 / .25)), inset 12px 12px var(--tw-inset-shadow-color, oklab(from var(--value, #08c) l a b / 25%));
-      }
-    }
-
-    .inset-shadow-\\[12px_12px_\\#0088cc\\,12px_12px_var\\(--value\\,\\#0088cc\\)\\]\\/25 {
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .inset-shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-      --tw-inset-shadow-alpha: 25%;
-      --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, var(--value));
-    }
-
-    @supports (color: lab(from red l a b)) {
-      .inset-shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-        --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, oklab(from var(--value) l a b / 25%));
-      }
-    }
-
-    .inset-shadow-\\[12px_12px_var\\(--value\\)\\]\\/25 {
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .inset-shadow-\\[10px_10px\\]\\/25 {
-      --tw-inset-shadow-alpha: 25%;
-      --tw-inset-shadow: inset 10px 10px var(--tw-inset-shadow-color, currentcolor);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[10px_10px\\]\\/25 {
-        --tw-inset-shadow: inset 10px 10px var(--tw-inset-shadow-color, color-mix(in oklab, currentcolor 25%, transparent));
-      }
-    }
-
-    .inset-shadow-\\[10px_10px\\]\\/25 {
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .inset-shadow-\\[12px_12px_\\#0088cc\\]\\/25 {
-      --tw-inset-shadow-alpha: 25%;
-      --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, oklab(59.9824% -.067 -.124 / .25));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .inset-shadow-sm\\/12\\.5 {
-      --tw-inset-shadow-alpha: 12.5%;
-      --tw-inset-shadow: inset 0 1px 1px var(--tw-inset-shadow-color, oklab(0% 0 0 / .125));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
-    .inset-shadow-sm\\/25 {
-      --tw-inset-shadow-alpha: 25%;
-      --tw-inset-shadow: inset 0 1px 1px var(--tw-inset-shadow-color, oklab(0% 0 0 / .25));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
     .inset-shadow {
       --tw-inset-shadow: inset 0 2px 4px var(--tw-inset-shadow-color, #0000000d);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -27948,28 +15610,18 @@ test('inset-shadow', async () => {
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
-    .inset-shadow-\\[12px_12px_\\#0088cc\\,12px_12px_var\\(--value\\,\\#0088cc\\)\\] {
-      --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, #08c), inset 12px 12px var(--tw-inset-shadow-color, var(--value, #08c));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
     .inset-shadow-\\[12px_12px_\\#0088cc\\] {
       --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, #08c);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
-    .inset-shadow-\\[12px_12px_var\\(--value\\)\\] {
-      --tw-inset-shadow: inset 12px 12px var(--tw-inset-shadow-color, var(--value));
-      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
-    }
-
     .inset-shadow-\\[shadow\\:var\\(--value\\)\\], .inset-shadow-\\[var\\(--value\\)\\] {
       --tw-inset-shadow: inset var(--value);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-shadow-none {
-      --tw-inset-shadow: inset 0 0 #0000;
+      --tw-inset-shadow: 0 0 #0000;
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
@@ -27982,120 +15634,24 @@ test('inset-shadow', async () => {
       --tw-inset-shadow-color: #08c;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[\\#0088cc\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, #08c var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-\\[\\#0088cc\\]\\/50 {
-      --tw-inset-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[\\#0088cc\\]\\/50 {
-        --tw-inset-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\] {
-      --tw-inset-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-inset-shadow-color: #0088cc80;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, oklab(59.9824% -.067 -.124 / .5) var(--tw-inset-shadow-alpha), transparent);
-      }
+    .inset-shadow-\\[\\#0088cc\\]\\/50, .inset-shadow-\\[\\#0088cc\\]\\/\\[0\\.5\\], .inset-shadow-\\[\\#0088cc\\]\\/\\[50\\%\\] {
+      --tw-inset-shadow-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
     .inset-shadow-\\[color\\:var\\(--value\\)\\] {
       --tw-inset-shadow-color: var(--value);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[color\\:var\\(--value\\)\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, var(--value) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/50 {
-      --tw-inset-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/50 {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-      --tw-inset-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-      --tw-inset-shadow-color: var(--value);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--value) 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
+    .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/50, .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[0\\.5\\], .inset-shadow-\\[color\\:var\\(--value\\)\\]\\/\\[50\\%\\] {
+      --tw-inset-shadow-color: color-mix(in oklab, var(--value) 50%, transparent);
     }
 
     .inset-shadow-current {
-      --tw-inset-shadow-color: currentcolor;
+      --tw-inset-shadow-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-current {
-        --tw-inset-shadow-color: color-mix(in oklab, currentcolor var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-current\\/50 {
-      --tw-inset-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-current\\/50 {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-current\\/\\[0\\.5\\] {
-      --tw-inset-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-current\\/\\[0\\.5\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-current\\/\\[50\\%\\] {
-      --tw-inset-shadow-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-current\\/\\[50\\%\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, currentcolor 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
+    .inset-shadow-current\\/50, .inset-shadow-current\\/\\[0\\.5\\], .inset-shadow-current\\/\\[50\\%\\] {
+      --tw-inset-shadow-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .inset-shadow-inherit {
@@ -28103,85 +15659,29 @@ test('inset-shadow', async () => {
     }
 
     .inset-shadow-red-500 {
-      --tw-inset-shadow-color: #ef4444;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500 {
-        --tw-inset-shadow-color: color-mix(in oklab, var(--color-red-500) var(--tw-inset-shadow-alpha), transparent);
-      }
+      --tw-inset-shadow-color: var(--color-red-500);
     }
 
     .inset-shadow-red-500\\/2\\.5 {
-      --tw-inset-shadow-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500\\/2\\.5 {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.5%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
+      --tw-inset-shadow-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .inset-shadow-red-500\\/2\\.25 {
-      --tw-inset-shadow-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500\\/2\\.25 {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.25%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
+      --tw-inset-shadow-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .inset-shadow-red-500\\/2\\.75 {
-      --tw-inset-shadow-color: #ef444407;
+      --tw-inset-shadow-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500\\/2\\.75 {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 2.75%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-red-500\\/50 {
-      --tw-inset-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500\\/50 {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-red-500\\/\\[0\\.5\\] {
-      --tw-inset-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500\\/\\[0\\.5\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
-    .inset-shadow-red-500\\/\\[50\\%\\] {
-      --tw-inset-shadow-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-red-500\\/\\[50\\%\\] {
-        --tw-inset-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--color-red-500) 50%, transparent) var(--tw-inset-shadow-alpha), transparent);
-      }
+    .inset-shadow-red-500\\/50, .inset-shadow-red-500\\/\\[0\\.5\\], .inset-shadow-red-500\\/\\[50\\%\\] {
+      --tw-inset-shadow-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .inset-shadow-transparent {
       --tw-inset-shadow-color: transparent;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-shadow-transparent {
-        --tw-inset-shadow-color: color-mix(in oklab, transparent var(--tw-inset-shadow-alpha), transparent);
-      }
-    }
-
     @property --tw-shadow {
       syntax: "*";
       inherits: false;
@@ -28193,12 +15693,6 @@ test('inset-shadow', async () => {
       inherits: false
     }
 
-    @property --tw-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-inset-shadow {
       syntax: "*";
       inherits: false;
@@ -28210,12 +15704,6 @@ test('inset-shadow', async () => {
       inherits: false
     }
 
-    @property --tw-inset-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-ring-color {
       syntax: "*";
       inherits: false
@@ -28259,47 +15747,40 @@ test('inset-shadow', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0 0 #0000;
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      [
-        '-inset-shadow-sm',
-        '-inset-shadow-none',
-        '-inset-shadow-red-500',
-        '-inset-shadow-red-500/50',
-        '-inset-shadow-red-500/[0.5]',
-        '-inset-shadow-red-500/[50%]',
-        '-inset-shadow-current',
-        '-inset-shadow-current/50',
-        '-inset-shadow-current/[0.5]',
-        '-inset-shadow-current/[50%]',
-        '-inset-shadow-inherit',
-        '-inset-shadow-transparent',
-        '-inset-shadow-[#0088cc]',
-        '-inset-shadow-[#0088cc]/50',
-        '-inset-shadow-[#0088cc]/[0.5]',
-        '-inset-shadow-[#0088cc]/[50%]',
-        '-inset-shadow-[var(--value)]',
-        'inset-shadow/foo',
-        'inset-shadow-sm/foo',
-        'inset-shadow-[10px_10px]/foo',
-      ],
-      css`
-        @theme {
-          --inset-shadow: inset 0 1px 3px 0 rgb(0 0 0 / 0.1);
-          --inset-shadow-sm: inset 0 1px 1px rgb(0 0 0 / 0.05);
-        }
-        @tailwind utilities;
-      `,
-    ),
+    await run([
+      '-inset-shadow-sm',
+      '-inset-shadow-none',
+      '-inset-shadow-red-500',
+      '-inset-shadow-red-500/50',
+      '-inset-shadow-red-500/[0.5]',
+      '-inset-shadow-red-500/[50%]',
+      '-inset-shadow-current',
+      '-inset-shadow-current/50',
+      '-inset-shadow-current/[0.5]',
+      '-inset-shadow-current/[50%]',
+      '-inset-shadow-inherit',
+      '-inset-shadow-transparent',
+      '-inset-shadow-[#0088cc]',
+      '-inset-shadow-[#0088cc]/50',
+      '-inset-shadow-[#0088cc]/[0.5]',
+      '-inset-shadow-[#0088cc]/[50%]',
+      '-inset-shadow-[var(--value)]',
+    ]),
   ).toEqual('')
 })
 
 test('ring', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // ring color
         'ring-inset',
@@ -28310,7 +15791,6 @@ test('ring', async () => {
         'ring-red-500/2.75',
         'ring-red-500/[0.5]',
         'ring-red-500/[50%]',
-        'ring-blue-500',
         'ring-current',
         'ring-current/50',
         'ring-current/[0.5]',
@@ -28339,74 +15819,44 @@ test('ring', async () => {
         'ring-[12px]',
         'ring-[length:var(--my-width)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --ring-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-shadow: 0 0 #0000;
-          --tw-shadow-color: initial;
-          --tw-shadow-alpha: 100%;
-          --tw-inset-shadow: 0 0 #0000;
-          --tw-inset-shadow-color: initial;
-          --tw-inset-shadow-alpha: 100%;
-          --tw-ring-color: initial;
-          --tw-ring-shadow: 0 0 #0000;
-          --tw-inset-ring-color: initial;
-          --tw-inset-ring-shadow: 0 0 #0000;
-          --tw-ring-inset: initial;
-          --tw-ring-offset-width: 0px;
-          --tw-ring-offset-color: #fff;
-          --tw-ring-offset-shadow: 0 0 #0000;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --ring-color-blue-500: #3b82f6;
     }
 
     .ring {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .ring-0 {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .ring-1 {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .ring-2 {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .ring-4 {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .ring-\\[12px\\] {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(12px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(12px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .ring-\\[length\\:var\\(--my-width\\)\\] {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(var(--my-width) + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(var(--my-width)  + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
@@ -28415,101 +15865,31 @@ test('ring', async () => {
     }
 
     .ring-\\[\\#0088cc\\]\\/50, .ring-\\[\\#0088cc\\]\\/\\[0\\.5\\], .ring-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-ring-color: oklab(59.9824% -.067 -.124 / .5);
+      --tw-ring-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .ring-\\[color\\:var\\(--my-color\\)\\], .ring-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+    .ring-\\[color\\:var\\(--my-color\\)\\] {
       --tw-ring-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .ring-\\[color\\:var\\(--my-color\\)\\]\\/50, .ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
+    .ring-\\[var\\(--my-color\\)\\] {
       --tw-ring-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .ring-\\[var\\(--my-color\\)\\]\\/50, .ring-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .ring-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-ring-color: var(--my-color);
+    .ring-current {
+      --tw-ring-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-\\[var\\(--my-color\\)\\], .ring-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-ring-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-\\[var\\(--my-color\\)\\]\\/50 {
-        --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-ring-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-ring-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-blue-500 {
-      --tw-ring-color: var(--ring-color-blue-500);
-    }
-
-    .ring-current, .ring-current\\/50 {
-      --tw-ring-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-current\\/50 {
-        --tw-ring-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .ring-current\\/\\[0\\.5\\] {
-      --tw-ring-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-current\\/\\[0\\.5\\] {
-        --tw-ring-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .ring-current\\/\\[50\\%\\] {
-      --tw-ring-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-current\\/\\[50\\%\\] {
-        --tw-ring-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .ring-current\\/50, .ring-current\\/\\[0\\.5\\], .ring-current\\/\\[50\\%\\] {
+      --tw-ring-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .ring-inherit {
@@ -28521,63 +15901,19 @@ test('ring', async () => {
     }
 
     .ring-red-500\\/2\\.5 {
-      --tw-ring-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-red-500\\/2\\.5 {
-        --tw-ring-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      --tw-ring-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .ring-red-500\\/2\\.25 {
-      --tw-ring-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-red-500\\/2\\.25 {
-        --tw-ring-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      --tw-ring-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .ring-red-500\\/2\\.75 {
-      --tw-ring-color: #ef444407;
+      --tw-ring-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-red-500\\/2\\.75 {
-        --tw-ring-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .ring-red-500\\/50 {
-      --tw-ring-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-red-500\\/50 {
-        --tw-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .ring-red-500\\/\\[0\\.5\\] {
-      --tw-ring-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-red-500\\/\\[0\\.5\\] {
-        --tw-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .ring-red-500\\/\\[50\\%\\] {
-      --tw-ring-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-red-500\\/\\[50\\%\\] {
-        --tw-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .ring-red-500\\/50, .ring-red-500\\/\\[0\\.5\\], .ring-red-500\\/\\[50\\%\\] {
+      --tw-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .ring-transparent {
@@ -28599,12 +15935,6 @@ test('ring', async () => {
       inherits: false
     }
 
-    @property --tw-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-inset-shadow {
       syntax: "*";
       inherits: false;
@@ -28616,12 +15946,6 @@ test('ring', async () => {
       inherits: false
     }
 
-    @property --tw-inset-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-ring-color {
       syntax: "*";
       inherits: false
@@ -28665,44 +15989,21 @@ test('ring', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0 0 #0000;
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      ['ring'],
+    await compileCss(
       css`
         @theme {
           --default-ring-width: 2px;
         }
         @tailwind utilities;
       `,
+      ['ring'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-shadow: 0 0 #0000;
-          --tw-shadow-color: initial;
-          --tw-shadow-alpha: 100%;
-          --tw-inset-shadow: 0 0 #0000;
-          --tw-inset-shadow-color: initial;
-          --tw-inset-shadow-alpha: 100%;
-          --tw-ring-color: initial;
-          --tw-ring-shadow: 0 0 #0000;
-          --tw-inset-ring-color: initial;
-          --tw-inset-ring-shadow: 0 0 #0000;
-          --tw-ring-inset: initial;
-          --tw-ring-offset-width: 0px;
-          --tw-ring-offset-color: #fff;
-          --tw-ring-offset-shadow: 0 0 #0000;
-        }
-      }
-    }
-
-    .ring {
-      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
+    ".ring {
+      --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
@@ -28717,12 +16018,6 @@ test('ring', async () => {
       inherits: false
     }
 
-    @property --tw-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-inset-shadow {
       syntax: "*";
       inherits: false;
@@ -28734,12 +16029,6 @@ test('ring', async () => {
       inherits: false
     }
 
-    @property --tw-inset-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-ring-color {
       syntax: "*";
       inherits: false
@@ -28783,8 +16072,7 @@ test('ring', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0 0 #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -28826,7 +16114,13 @@ test('ring', async () => {
 
 test('inset-ring', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // ring color
         'inset-ring-red-500',
@@ -28864,72 +16158,44 @@ test('inset-ring', async () => {
         'inset-ring-[12px]',
         'inset-ring-[length:var(--my-width)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-shadow: 0 0 #0000;
-          --tw-shadow-color: initial;
-          --tw-shadow-alpha: 100%;
-          --tw-inset-shadow: 0 0 #0000;
-          --tw-inset-shadow-color: initial;
-          --tw-inset-shadow-alpha: 100%;
-          --tw-ring-color: initial;
-          --tw-ring-shadow: 0 0 #0000;
-          --tw-inset-ring-color: initial;
-          --tw-inset-ring-shadow: 0 0 #0000;
-          --tw-ring-inset: initial;
-          --tw-ring-offset-width: 0px;
-          --tw-ring-offset-color: #fff;
-          --tw-ring-offset-shadow: 0 0 #0000;
-        }
-      }
-    }
-
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
     }
 
     .inset-ring {
-      --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-ring-0 {
-      --tw-inset-ring-shadow: inset 0 0 0 0px var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 0px var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-ring-1 {
-      --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 1px var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-ring-2 {
-      --tw-inset-ring-shadow: inset 0 0 0 2px var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 2px var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-ring-4 {
-      --tw-inset-ring-shadow: inset 0 0 0 4px var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 4px var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-ring-\\[12px\\] {
-      --tw-inset-ring-shadow: inset 0 0 0 12px var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 12px var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
     .inset-ring-\\[length\\:var\\(--my-width\\)\\] {
-      --tw-inset-ring-shadow: inset 0 0 0 var(--my-width) var(--tw-inset-ring-color, currentcolor);
+      --tw-inset-ring-shadow: inset 0 0 0 var(--my-width) var(--tw-inset-ring-color, currentColor);
       box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
     }
 
@@ -28938,97 +16204,31 @@ test('inset-ring', async () => {
     }
 
     .inset-ring-\\[\\#0088cc\\]\\/50, .inset-ring-\\[\\#0088cc\\]\\/\\[0\\.5\\], .inset-ring-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-inset-ring-color: oklab(59.9824% -.067 -.124 / .5);
+      --tw-inset-ring-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .inset-ring-\\[color\\:var\\(--my-color\\)\\], .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+    .inset-ring-\\[color\\:var\\(--my-color\\)\\] {
       --tw-inset-ring-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/50, .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
+    .inset-ring-\\[var\\(--my-color\\)\\] {
       --tw-inset-ring-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .inset-ring-\\[var\\(--my-color\\)\\]\\/50, .inset-ring-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .inset-ring-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-inset-ring-color: var(--my-color);
+    .inset-ring-current {
+      --tw-inset-ring-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .inset-ring-\\[var\\(--my-color\\)\\], .inset-ring-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-inset-ring-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-\\[var\\(--my-color\\)\\]\\/50 {
-        --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .inset-ring-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-inset-ring-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .inset-ring-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-inset-ring-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-inset-ring-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .inset-ring-current, .inset-ring-current\\/50 {
-      --tw-inset-ring-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-current\\/50 {
-        --tw-inset-ring-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .inset-ring-current\\/\\[0\\.5\\] {
-      --tw-inset-ring-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-current\\/\\[0\\.5\\] {
-        --tw-inset-ring-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .inset-ring-current\\/\\[50\\%\\] {
-      --tw-inset-ring-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-current\\/\\[50\\%\\] {
-        --tw-inset-ring-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .inset-ring-current\\/50, .inset-ring-current\\/\\[0\\.5\\], .inset-ring-current\\/\\[50\\%\\] {
+      --tw-inset-ring-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .inset-ring-inherit {
@@ -29040,63 +16240,19 @@ test('inset-ring', async () => {
     }
 
     .inset-ring-red-500\\/2\\.5 {
-      --tw-inset-ring-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-red-500\\/2\\.5 {
-        --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
-      }
+      --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 2.5%, transparent);
     }
 
     .inset-ring-red-500\\/2\\.25 {
-      --tw-inset-ring-color: #ef444406;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-red-500\\/2\\.25 {
-        --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
-      }
+      --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 2.25%, transparent);
     }
 
     .inset-ring-red-500\\/2\\.75 {
-      --tw-inset-ring-color: #ef444407;
+      --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-red-500\\/2\\.75 {
-        --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 2.75%, transparent);
-      }
-    }
-
-    .inset-ring-red-500\\/50 {
-      --tw-inset-ring-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-red-500\\/50 {
-        --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .inset-ring-red-500\\/\\[0\\.5\\] {
-      --tw-inset-ring-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-red-500\\/\\[0\\.5\\] {
-        --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .inset-ring-red-500\\/\\[50\\%\\] {
-      --tw-inset-ring-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .inset-ring-red-500\\/\\[50\\%\\] {
-        --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .inset-ring-red-500\\/50, .inset-ring-red-500\\/\\[0\\.5\\], .inset-ring-red-500\\/\\[50\\%\\] {
+      --tw-inset-ring-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .inset-ring-transparent {
@@ -29114,12 +16270,6 @@ test('inset-ring', async () => {
       inherits: false
     }
 
-    @property --tw-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-inset-shadow {
       syntax: "*";
       inherits: false;
@@ -29131,12 +16281,6 @@ test('inset-ring', async () => {
       inherits: false
     }
 
-    @property --tw-inset-shadow-alpha {
-      syntax: "<percentage>";
-      inherits: false;
-      initial-value: 100%;
-    }
-
     @property --tw-ring-color {
       syntax: "*";
       inherits: false
@@ -29180,8 +16324,7 @@ test('inset-ring', async () => {
       syntax: "*";
       inherits: false;
       initial-value: 0 0 #0000;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -29222,7 +16365,13 @@ test('inset-ring', async () => {
 
 test('ring-offset', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --color-red-500: #ef4444;
+        }
+        @tailwind utilities;
+      `,
       [
         // ring color
         'ring-offset-inset',
@@ -29230,7 +16379,6 @@ test('ring-offset', async () => {
         'ring-offset-red-500/50',
         'ring-offset-red-500/[0.5]',
         'ring-offset-red-500/[50%]',
-        'ring-offset-blue-500',
         'ring-offset-current',
         'ring-offset-current/50',
         'ring-offset-current/[0.5]',
@@ -29259,19 +16407,10 @@ test('ring-offset', async () => {
         'ring-offset-[12px]',
         'ring-offset-[length:var(--my-width)]',
       ],
-      css`
-        @theme {
-          --color-red-500: #ef4444;
-          --ring-offset-color-blue-500: #3b82f6;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :root, :host {
+    ":root, :host {
       --color-red-500: #ef4444;
-      --ring-offset-color-blue-500: #3b82f6;
     }
 
     .ring-offset-0 {
@@ -29309,101 +16448,31 @@ test('ring-offset', async () => {
     }
 
     .ring-offset-\\[\\#0088cc\\]\\/50, .ring-offset-\\[\\#0088cc\\]\\/\\[0\\.5\\], .ring-offset-\\[\\#0088cc\\]\\/\\[50\\%\\] {
-      --tw-ring-offset-color: oklab(59.9824% -.067 -.124 / .5);
+      --tw-ring-offset-color: oklab(59.9824% -.06725 -.12414 / .5);
     }
 
-    .ring-offset-\\[color\\:var\\(--my-color\\)\\], .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/50 {
+    .ring-offset-\\[color\\:var\\(--my-color\\)\\] {
       --tw-ring-offset-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/50 {
-        --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/50, .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\], .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
+    .ring-offset-\\[var\\(--my-color\\)\\] {
       --tw-ring-offset-color: var(--my-color);
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
+    .ring-offset-\\[var\\(--my-color\\)\\]\\/50, .ring-offset-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\], .ring-offset-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
+      --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
     }
 
-    .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-ring-offset-color: var(--my-color);
+    .ring-offset-current {
+      --tw-ring-offset-color: currentColor;
     }
 
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-\\[color\\:var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-offset-\\[var\\(--my-color\\)\\], .ring-offset-\\[var\\(--my-color\\)\\]\\/50 {
-      --tw-ring-offset-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-\\[var\\(--my-color\\)\\]\\/50 {
-        --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-offset-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-      --tw-ring-offset-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-\\[var\\(--my-color\\)\\]\\/\\[0\\.5\\] {
-        --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-offset-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-      --tw-ring-offset-color: var(--my-color);
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-\\[var\\(--my-color\\)\\]\\/\\[50\\%\\] {
-        --tw-ring-offset-color: color-mix(in oklab, var(--my-color) 50%, transparent);
-      }
-    }
-
-    .ring-offset-blue-500 {
-      --tw-ring-offset-color: var(--ring-offset-color-blue-500);
-    }
-
-    .ring-offset-current, .ring-offset-current\\/50 {
-      --tw-ring-offset-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-current\\/50 {
-        --tw-ring-offset-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .ring-offset-current\\/\\[0\\.5\\] {
-      --tw-ring-offset-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-current\\/\\[0\\.5\\] {
-        --tw-ring-offset-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
-    }
-
-    .ring-offset-current\\/\\[50\\%\\] {
-      --tw-ring-offset-color: currentcolor;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-current\\/\\[50\\%\\] {
-        --tw-ring-offset-color: color-mix(in oklab, currentcolor 50%, transparent);
-      }
+    .ring-offset-current\\/50, .ring-offset-current\\/\\[0\\.5\\], .ring-offset-current\\/\\[50\\%\\] {
+      --tw-ring-offset-color: color-mix(in oklab, currentColor 50%, transparent);
     }
 
     .ring-offset-inherit {
@@ -29414,40 +16483,13 @@ test('ring-offset', async () => {
       --tw-ring-offset-color: var(--color-red-500);
     }
 
-    .ring-offset-red-500\\/50 {
-      --tw-ring-offset-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-red-500\\/50 {
-        --tw-ring-offset-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .ring-offset-red-500\\/\\[0\\.5\\] {
-      --tw-ring-offset-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-red-500\\/\\[0\\.5\\] {
-        --tw-ring-offset-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
-    }
-
-    .ring-offset-red-500\\/\\[50\\%\\] {
-      --tw-ring-offset-color: #ef444480;
-    }
-
-    @supports (color: color-mix(in lab, red, red)) {
-      .ring-offset-red-500\\/\\[50\\%\\] {
-        --tw-ring-offset-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
-      }
+    .ring-offset-red-500\\/50, .ring-offset-red-500\\/\\[0\\.5\\], .ring-offset-red-500\\/\\[50\\%\\] {
+      --tw-ring-offset-color: color-mix(in oklab, var(--color-red-500) 50%, transparent);
     }
 
     .ring-offset-transparent {
       --tw-ring-offset-color: transparent;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -29493,17 +16535,16 @@ test('@container', async () => {
       '@container-normal',
       '@container/sidebar',
       '@container-normal/sidebar',
-      '@container-size',
-      '@container-size/sidebar',
+      '@container-[size]',
+      '@container-[size]/sidebar',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .\\@container-normal\\/sidebar {
-      container: sidebar;
+    ".\\@container-\\[size\\]\\/sidebar {
+      container: sidebar / size;
     }
 
-    .\\@container-size\\/sidebar {
-      container: sidebar / size;
+    .\\@container-normal\\/sidebar {
+      container: sidebar;
     }
 
     .\\@container\\/sidebar {
@@ -29514,14 +16555,13 @@ test('@container', async () => {
       container-type: inline-size;
     }
 
-    .\\@container-normal {
-      container-type: normal;
-    }
-
-    .\\@container-size {
+    .\\@container-\\[size\\] {
       container-type: size;
     }
-    "
+
+    .\\@container-normal {
+      container-type: normal;
+    }"
   `)
   expect(
     await run([
@@ -29529,77 +16569,66 @@ test('@container', async () => {
       '-@container-normal',
       '-@container/sidebar',
       '-@container-normal/sidebar',
-      '-@container-size',
-      '-@container-size/sidebar',
+      '-@container-[size]',
+      '-@container-[size]/sidebar',
     ]),
   ).toEqual('')
 })
 
 describe('spacing utilities', () => {
   test('`--spacing: initial` disables the spacing multiplier', async () => {
-    expect(
-      await run(
-        ['px-1', 'px-4'],
-        css`
-          @theme {
-            --spacing: initial;
-            --spacing-4: 1rem;
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let { build } = await compile(css`
+      @theme {
+        --spacing: initial;
+        --spacing-4: 1rem;
+      }
+      @tailwind utilities;
+    `)
+    let compiled = build(['px-1', 'px-4'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --spacing-4: 1rem;
       }
 
       .px-4 {
         padding-inline: var(--spacing-4);
-      }
-      "
+      }"
     `)
   })
 
   test('`--spacing-*: initial` disables the spacing multiplier', async () => {
-    expect(
-      await run(
-        ['px-1', 'px-4'],
-        css`
-          @theme {
-            --spacing-*: initial;
-            --spacing-4: 1rem;
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let { build } = await compile(css`
+      @theme {
+        --spacing-*: initial;
+        --spacing-4: 1rem;
+      }
+      @tailwind utilities;
+    `)
+    let compiled = build(['px-1', 'px-4'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --spacing-4: 1rem;
       }
 
       .px-4 {
         padding-inline: var(--spacing-4);
-      }
-      "
+      }"
     `)
   })
 
   test('only multiples of 0.25 with no trailing zeroes are supported with the spacing multiplier', async () => {
-    expect(
-      await run(
-        ['px-0.25', 'px-1.5', 'px-2.75', 'px-0.375', 'px-2.50', 'px-.75'],
-        css`
-          @theme {
-            --spacing: 4px;
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let { build } = await compile(css`
+      @theme {
+        --spacing: 4px;
+      }
+      @tailwind utilities;
+    `)
+    let compiled = build(['px-0.25', 'px-1.5', 'px-2.75', 'px-0.375', 'px-2.50', 'px-.75'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --spacing: 4px;
       }
 
@@ -29613,40 +16642,34 @@ describe('spacing utilities', () => {
 
       .px-2\\.75 {
         padding-inline: calc(var(--spacing) * 2.75);
-      }
-      "
+      }"
     `)
   })
 
   test('spacing utilities must have a value', async () => {
-    expect(
-      await run(
-        ['px'],
-        css`
-          @theme reference {
-            --spacing: 4px;
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toEqual('')
+    let { build } = await compile(css`
+      @theme reference {
+        --spacing: 4px;
+      }
+      @tailwind utilities;
+    `)
+    let compiled = build(['px'])
+
+    expect(optimizeCss(compiled).trim()).toEqual('')
   })
 
   test('--spacing-* variables take precedence over --container-* variables', async () => {
-    expect(
-      await run(
-        ['w-sm', 'max-w-sm', 'min-w-sm', 'basis-sm'],
-        css`
-          @theme {
-            --spacing-sm: 8px;
-            --container-sm: 256px;
-          }
-          @tailwind utilities;
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
-      :root, :host {
+    let { build } = await compile(css`
+      @theme {
+        --spacing-sm: 8px;
+        --container-sm: 256px;
+      }
+      @tailwind utilities;
+    `)
+    let compiled = build(['w-sm', 'max-w-sm', 'min-w-sm', 'basis-sm'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      ":root, :host {
         --spacing-sm: 8px;
       }
 
@@ -29664,95 +16687,48 @@ describe('spacing utilities', () => {
 
       .basis-sm {
         flex-basis: var(--spacing-sm);
-      }
-      "
+      }"
     `)
   })
 })
 
 describe('custom utilities', () => {
-  test.each([
-    ['foo', true], // Simple name
-    ['foo-123', true], // Ending with a number is valid
-    ['foo-2.5', true], // Dots are valid when surrounded by numbers
-    ['-foo', true], // Simple name with negative sign
-    ['foo-bar', true], // With dashes
-    ['foo_bar', true], // With underscores
-    ['foo-50%', true], // Bare value with percentage
-    ['foo-1/2', true], // Bare value with fraction
-    ['foo-sm/8', true], // Bare value with number modifier
-    ['foo-4/snug', true], // Bare value with named modifier
-    ['foo_', true], // This is supported today, so let's not break it
-    ['foo/bar', true], // A slash to separate the modifier is valid.
-
-    ['Foo', false], // Starting with uppercase letter is invalid
-    ['-Foo', false], // Starting with uppercase letter is invalid (negative)
-    ['foo-', false], // Should not end with a dash
-    ['foo-1/', false], // Invalid fraction/modifier
-    ['foo-p%', false], // Invalid percentage
-    ['foo.bar', false], // Dots are only valid when surrounded by numbers
-    ['foo-1..5', false], // Double dots are invalid
-    ['foo..bar', false], // Double dots are invalid definitely without numbers
-    ['foo/bar/baz', false], // Multiple slashes are invalid
-  ])('valid static utility name "%s" (%s)', (name, valid) => {
-    expect(isValidStaticUtilityName(name)).toBe(valid)
-  })
-
-  test.each([
-    ['foo', false], // Simple name, missing '-*' suffix
-    ['foo-*', true], // Simple name
-    ['foo--*', true], // Root ending in `-` is valid (e.g. `border--*`)
-    ['-foo-*', true], // Simple name (negative)
-    ['foo-bar-*', true], // With dashes
-    ['foo_bar-*', true], // With underscores
-    ['Foo-*', false], // Starting with uppercase letter is invalid
-    ['-Foo-*', false], // Starting with uppercase letter is invalid
-    ['foo!-*', false], // Invalid special character
-    ['foo-[…]', false], // Invalid special character
-  ])('valid functional name "%s" (%s)', (name, valid) => {
-    expect(isValidFunctionalUtilityName(name)).toBe(valid)
-  })
-
   test('custom static utility', async () => {
-    expect(
-      await run(
-        ['text-trim', 'lg:text-trim'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @theme reference {
-            --breakpoint-lg: 1024px;
-          }
-
-          @utility text-trim {
-            text-box-trim: both;
-            text-box-edge: cap alphabetic;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @theme reference {
+        --breakpoint-lg: 1024px;
+      }
+
+      @utility text-trim {
+        text-box-trim: both;
+        text-box-edge: cap alphabetic;
+      }
+    `)
+    let compiled = build(['text-trim', 'lg:text-trim'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .text-trim {
           text-box-trim: both;
           text-box-edge: cap alphabetic;
         }
 
-        @media (min-width: 1024px) {
+        @media (width >= 1024px) {
           .lg\\:text-trim {
             text-box-trim: both;
             text-box-edge: cap alphabetic;
           }
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom static utility emit CSS variables if the utility is used', async () => {
-    let input = css`
+    let { build } = await compile(css`
       @layer utilities {
         @tailwind utilities;
       }
@@ -29764,19 +16740,16 @@ describe('custom utilities', () => {
       @utility foo {
         value: var(--example-foo);
       }
-    `
+    `)
+    let compiled = build([])
 
     // `foo` is not used yet:
-    expect(await compileCss(input)).toMatchInlineSnapshot(`
-      "
-      @layer utilities;
-      "
-    `)
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`"@layer utilities;"`)
 
     // `foo` is used, and the CSS variable is emitted:
-    expect(await run(['foo'], input)).toMatchInlineSnapshot(`
-      "
-      @layer utilities {
+    compiled = build(['foo'])
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .foo {
           value: var(--example-foo);
         }
@@ -29784,153 +16757,133 @@ describe('custom utilities', () => {
 
       :root, :host {
         --example-foo: 123px;
-      }
-      "
+      }"
     `)
   })
 
   test('custom static utility (negative)', async () => {
-    expect(
-      await run(
-        ['-example', 'lg:-example'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @utility -example {
-            value: -1;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @utility -example {
+        value: -1;
+      }
+    `)
+    let compiled = build(['-example', 'lg:-example'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .-example {
           value: -1;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('Multiple static utilities are merged', async () => {
-    expect(
-      await run(
-        ['really-round'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @utility really-round {
-            --custom-prop: hi;
-            border-radius: 50rem;
-          }
-
-          @utility really-round {
-            border-radius: 30rem;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @utility really-round {
+        --custom-prop: hi;
+        border-radius: 50rem;
+      }
+
+      @utility really-round {
+        border-radius: 30rem;
+      }
+    `)
+    let compiled = build(['really-round'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .really-round {
           --custom-prop: hi;
           border-radius: 30rem;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom utilities support some special characters', async () => {
-    expect(
-      await run(
-        ['push-1/2', 'push-50%'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @utility push-1/2 {
-            right: 50%;
-          }
-
-          @utility push-50% {
-            right: 50%;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @utility push-1/2 {
+        right: 50%;
+      }
+
+      @utility push-50% {
+        right: 50%;
+      }
+    `)
+    let compiled = build(['push-1/2', 'push-50%'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .push-1\\/2, .push-50\\% {
           right: 50%;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('can override specific versions of a functional utility with a static utility', async () => {
-    expect(
-      await run(
-        ['text-sm'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @theme reference {
-            --text-sm: 0.875rem;
-            --text-sm--line-height: 1.25rem;
-          }
-
-          @utility text-sm {
-            font-size: var(--text-sm, 0.8755rem);
-            line-height: var(--text-sm--line-height, 1.255rem);
-            text-rendering: optimizeLegibility;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @theme reference {
+        --text-sm: 0.875rem;
+        --text-sm--line-height: 1.25rem;
+      }
+
+      @utility text-sm {
+        font-size: var(--text-sm, 0.8755rem);
+        line-height: var(--text-sm--line-height, 1.255rem);
+        text-rendering: optimizeLegibility;
+      }
+    `)
+    let compiled = build(['text-sm'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .text-sm {
           font-size: var(--text-sm, .8755rem);
           line-height: var(--text-sm--line-height, 1.255rem);
-          text-rendering: optimizelegibility;
+          text-rendering: optimizeLegibility;
           font-size: var(--text-sm, .875rem);
           line-height: var(--tw-leading, var(--text-sm--line-height, 1.25rem));
         }
-      }
-      "
+      }"
     `)
   })
 
   test('can override the default value of a functional utility', async () => {
-    expect(
-      await run(
-        ['rounded', 'rounded-xl', 'rounded-[33px]'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @theme reference {
-            --radius-xl: 16px;
-          }
-
-          @utility rounded {
-            border-radius: 50rem;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @theme reference {
+        --radius-xl: 16px;
+      }
+
+      @utility rounded {
+        border-radius: 50rem;
+      }
+    `)
+    let compiled = build(['rounded', 'rounded-xl', 'rounded-[33px]'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .rounded {
           border-radius: 50rem;
         }
@@ -29942,28 +16895,24 @@ describe('custom utilities', () => {
         .rounded-xl {
           border-radius: var(--radius-xl, 16px);
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom utilities are sorted by used properties', async () => {
-    expect(
-      await run(
-        ['top-[100px]', 'push-left', 'right-[100px]', 'bottom-[100px]'],
-        css`
-          @layer utilities {
-            @tailwind utilities;
-          }
-
-          @utility push-left {
-            right: 100%;
-          }
-        `,
-      ),
-    ).toMatchInlineSnapshot(`
-      "
+    let { build } = await compile(css`
       @layer utilities {
+        @tailwind utilities;
+      }
+
+      @utility push-left {
+        right: 100%;
+      }
+    `)
+    let compiled = build(['top-[100px]', 'push-left', 'right-[100px]', 'bottom-[100px]'])
+
+    expect(optimizeCss(compiled).trim()).toMatchInlineSnapshot(`
+      "@layer utilities {
         .top-\\[100px\\] {
           top: 100px;
         }
@@ -29979,8 +16928,7 @@ describe('custom utilities', () => {
         .bottom-\\[100px\\] {
           bottom: 100px;
         }
-      }
-      "
+      }"
     `)
   })
 
@@ -29991,7 +16939,7 @@ describe('custom utilities', () => {
           right: 100%;
         }
       `),
-    ).rejects.toThrow(/should be alphanumeric/)
+    ).rejects.toThrowError(/should be alphanumeric/)
 
     await expect(() =>
       compile(css`
@@ -29999,7 +16947,7 @@ describe('custom utilities', () => {
           right: 100%;
         }
       `),
-    ).rejects.toThrow(/should be alphanumeric/)
+    ).rejects.toThrowError(/should be alphanumeric/)
 
     await expect(() =>
       compile(css`
@@ -30007,13 +16955,12 @@ describe('custom utilities', () => {
           right: 100%;
         }
       `),
-    ).rejects.toThrow(/should be alphanumeric/)
+    ).rejects.toThrowError(/should be alphanumeric/)
   })
 
   test('custom utilities work with `@apply`', async () => {
     expect(
-      await run(
-        ['foo', 'hover:foo', 'bar'],
+      await compileCss(
         css`
           @utility foo {
             @apply flex flex-col underline;
@@ -30029,10 +16976,10 @@ describe('custom utilities', () => {
 
           @tailwind utilities;
         `,
+        ['foo', 'hover:foo', 'bar'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bar {
+      ".bar {
         z-index: 10;
       }
 
@@ -30052,15 +16999,13 @@ describe('custom utilities', () => {
           text-decoration-line: underline;
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('referencing custom utilities in custom utilities via `@apply` should work', async () => {
     expect(
-      await run(
-        ['bar'],
+      await compileCss(
         css`
           @utility foo {
             @apply flex flex-col underline;
@@ -30072,10 +17017,10 @@ describe('custom utilities', () => {
 
           @tailwind utilities;
         `,
+        ['bar'],
       ),
     ).toMatchInlineSnapshot(`
-      "
-      .bar {
+      ".bar {
         flex-wrap: wrap;
       }
 
@@ -30085,15 +17030,13 @@ describe('custom utilities', () => {
           text-decoration-line: underline;
           display: flex;
         }
-      }
-      "
+      }"
     `)
   })
 
   test('custom utilities with `@apply` causing circular dependencies should error', async () => {
     await expect(() =>
-      run(
-        ['foo', 'bar'],
+      compileCss(
         css`
           @utility foo {
             @apply flex-wrap hover:bar;
@@ -30105,6 +17048,7 @@ describe('custom utilities', () => {
 
           @tailwind utilities;
         `,
+        ['foo', 'bar'],
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
       `[Error: You cannot \`@apply\` the \`hover:bar\` utility here because it creates a circular dependency.]`,
@@ -30113,8 +17057,7 @@ describe('custom utilities', () => {
 
   test('custom utilities with `@apply` causing circular dependencies should error (deeply nesting)', async () => {
     await expect(() =>
-      run(
-        ['foo', 'bar'],
+      compileCss(
         css`
           @utility foo {
             .bar {
@@ -30136,6 +17079,7 @@ describe('custom utilities', () => {
 
           @tailwind utilities;
         `,
+        ['foo', 'bar'],
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
       `[Error: You cannot \`@apply\` the \`hover:bar\` utility here because it creates a circular dependency.]`,
@@ -30144,8 +17088,7 @@ describe('custom utilities', () => {
 
   test('custom utilities with `@apply` causing circular dependencies should error (multiple levels)', async () => {
     await expect(() =>
-      run(
-        ['foo', 'bar'],
+      compileCss(
         css`
           body {
             @apply foo;
@@ -30165,6 +17108,7 @@ describe('custom utilities', () => {
 
           @tailwind utilities;
         `,
+        ['foo', 'bar'],
       ),
     ).rejects.toThrowErrorMatchingInlineSnapshot(
       `[Error: You cannot \`@apply\` the \`hover:bar\` utility here because it creates a circular dependency.]`,
@@ -30172,268 +17116,161 @@ describe('custom utilities', () => {
   })
 
   describe('functional utilities', () => {
-    test('functional utilities require a `--value(…)`', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: 4;
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example', 'example-foo'], input)).toEqual('')
-    })
-
-    test('functional utilities must resolve at least one `--value(…)`', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: --value(integer);
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example-1', 'example-2'], input)).toMatchInlineSnapshot(`
-        "
-        .example-1 {
-          --resolved-value: 1;
-        }
-
-        .example-2 {
-          --resolved-value: 2;
-        }
-        "
-      `)
-
-      expect(await run(['example', 'example-foo', 'example-2.5'], input)).toEqual('')
-    })
-
     test('resolving values from `@theme`', async () => {
       let input = css`
         @theme reference {
-          --example-1: 1;
-          --example-2: 2;
-          --example-4: 4;
-          --example-a: 8;
+          --tab-size-1: 1;
+          --tab-size-2: 2;
+          --tab-size-4: 4;
+          --tab-size-github: 8;
         }
 
-        @utility example-* {
-          --resolved-value: --value(--example);
+        @utility tab-* {
+          tab-size: --value(--tab-size);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-1', 'example-2', 'example-4', 'example-a'], input))
+      expect(await compileCss(input, ['tab-1', 'tab-2', 'tab-4', 'tab-github']))
         .toMatchInlineSnapshot(`
-          "
-          .example-1 {
-            --resolved-value: var(--example-1, 1);
+          ".tab-1 {
+            tab-size: var(--tab-size-1, 1);
           }
 
-          .example-2 {
-            --resolved-value: var(--example-2, 2);
+          .tab-2 {
+            tab-size: var(--tab-size-2, 2);
           }
 
-          .example-4 {
-            --resolved-value: var(--example-4, 4);
+          .tab-4 {
+            tab-size: var(--tab-size-4, 4);
           }
 
-          .example-a {
-            --resolved-value: var(--example-a, 8);
-          }
-          "
+          .tab-github {
+            tab-size: var(--tab-size-github, 8);
+          }"
         `)
-      expect(await run(['example-3', 'example-gitlab'], input)).toEqual('')
+      expect(await compileCss(input, ['tab-3', 'tab-gitlab'])).toEqual('')
     })
 
-    test('functional utility with double-dash separator', async () => {
-      let input = css`
-        @theme reference {
-          --color-border-0: #e5e7eb;
-          --color-border-1: #d1d5db;
-          --color-border-2: #9ca3af;
-        }
-
-        @utility border--* {
-          border-color: --value(--color-border-*, [color]);
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['border--0', 'border--1', 'border--2'], input)).toMatchInlineSnapshot(`
-        "
-        .border--0 {
-          border-color: var(--color-border-0, #e5e7eb);
-        }
-
-        .border--1 {
-          border-color: var(--color-border-1, #d1d5db);
-        }
-
-        .border--2 {
-          border-color: var(--color-border-2, #9ca3af);
-        }
-        "
-      `)
-      expect(await run(['border--3'], input)).toEqual('')
-    })
-
-    test('resolving values from `@theme`, with `--example-*` syntax', async () => {
+    test('resolving values from `@theme`, with `--tab-size-*` syntax', async () => {
       let input =
         // Explicitly not using the css tagged template literal so that
-        // Prettier doesn't format the `value(--example-*)` as
-        // `value(--example- *)`
+        // Prettier doesn't format the `value(--tab-size-*)` as
+        // `value(--tab-size- *)`
         `
           @theme reference {
-            --example-1: 1;
-            --example-2: 2;
-            --example-4: 4;
-            --example-a: 8;
+            --tab-size-1: 1;
+            --tab-size-2: 2;
+            --tab-size-4: 4;
+            --tab-size-github: 8;
           }
 
-          @utility example-* {
-            --resolved-value: --value(--example-*);
+          @utility tab-* {
+            tab-size: --value(--tab-size-*);
           }
 
           @tailwind utilities;
         `
 
-      expect(await run(['example-1', 'example-2', 'example-4', 'example-a'], input))
+      expect(await compileCss(input, ['tab-1', 'tab-2', 'tab-4', 'tab-github']))
         .toMatchInlineSnapshot(`
-          "
-          .example-1 {
-            --resolved-value: var(--example-1, 1);
+          ".tab-1 {
+            tab-size: var(--tab-size-1, 1);
           }
 
-          .example-2 {
-            --resolved-value: var(--example-2, 2);
+          .tab-2 {
+            tab-size: var(--tab-size-2, 2);
           }
 
-          .example-4 {
-            --resolved-value: var(--example-4, 4);
+          .tab-4 {
+            tab-size: var(--tab-size-4, 4);
           }
 
-          .example-a {
-            --resolved-value: var(--example-a, 8);
-          }
-          "
+          .tab-github {
+            tab-size: var(--tab-size-github, 8);
+          }"
         `)
-      expect(await run(['example-3', 'example-gitlab'], input)).toEqual('')
+      expect(await compileCss(input, ['tab-3', 'tab-gitlab'])).toEqual('')
     })
 
-    test('resolving values from `@theme`, with `--example-\\*` syntax (prettier friendly)', async () => {
+    test('resolving values from `@theme`, with `--tab-size-\\*` syntax (prettier friendly)', async () => {
       let input = css`
         @theme reference {
-          --example-1: 1;
-          --example-2: 2;
-          --example-4: 4;
-          --example-a: 8;
+          --tab-size-1: 1;
+          --tab-size-2: 2;
+          --tab-size-4: 4;
+          --tab-size-github: 8;
         }
 
-        @utility example-* {
-          --resolved-value: --value(--example-\*);
+        @utility tab-* {
+          tab-size: --value(--tab-size-\*);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-1', 'example-2', 'example-4', 'example-a'], input))
+      expect(await compileCss(input, ['tab-1', 'tab-2', 'tab-4', 'tab-github']))
         .toMatchInlineSnapshot(`
-          "
-          .example-1 {
-            --resolved-value: var(--example-1, 1);
+          ".tab-1 {
+            tab-size: var(--tab-size-1, 1);
           }
 
-          .example-2 {
-            --resolved-value: var(--example-2, 2);
+          .tab-2 {
+            tab-size: var(--tab-size-2, 2);
           }
 
-          .example-4 {
-            --resolved-value: var(--example-4, 4);
+          .tab-4 {
+            tab-size: var(--tab-size-4, 4);
           }
 
-          .example-a {
-            --resolved-value: var(--example-a, 8);
-          }
-          "
+          .tab-github {
+            tab-size: var(--tab-size-github, 8);
+          }"
         `)
-      expect(await run(['example-3', 'example-gitlab'], input)).toEqual('')
+      expect(await compileCss(input, ['tab-3', 'tab-gitlab'])).toEqual('')
     })
 
     test('resolving bare values', async () => {
       let input = css`
-        @utility example-* {
-          --resolved-value: --value(integer);
+        @utility tab-* {
+          tab-size: --value(integer);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-1', 'example-76', 'example-971'], input)).toMatchInlineSnapshot(`
-        "
-        .example-1 {
-          --resolved-value: 1;
+      expect(await compileCss(input, ['tab-1', 'tab-76', 'tab-971'])).toMatchInlineSnapshot(`
+        ".tab-1 {
+          tab-size: 1;
         }
 
-        .example-76 {
-          --resolved-value: 76;
+        .tab-76 {
+          tab-size: 76;
         }
 
-        .example-971 {
-          --resolved-value: 971;
-        }
-        "
-      `)
-      expect(await run(['example-foo'], input)).toEqual('')
-    })
-
-    test('bare values with unsupported data types should result in a warning', async () => {
-      using spy = vi.spyOn(console, 'warn').mockImplementation(() => {})
-      let input = css`
-        @utility paint-* {
-          paint: --value([color], color);
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['paint-#0088cc', 'paint-red'], input)).toEqual('')
-      expect(spy.mock.calls).toMatchInlineSnapshot(`
-        [
-          [
-            "Unsupported bare value data type: "color".
-        Only valid data types are: "number", "integer", "ratio", "percentage".
-        ",
-          ],
-          [
-            "\`\`\`css
-        --value([color],color)
-                        ^^^^^
-        \`\`\`",
-          ],
-        ]
+        .tab-971 {
+          tab-size: 971;
+        }"
       `)
+      expect(await compileCss(input, ['tab-foo'])).toEqual('')
     })
 
     test('resolve literal values', async () => {
       let input = css`
-        @utility example-* {
-          --resolved-value: --value('revert');
+        @utility tab-* {
+          tab-size: --value('revert');
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-revert'], input)).toMatchInlineSnapshot(`
-        "
-        .example-revert {
-          --resolved-value: revert;
-        }
-        "
+      expect(await compileCss(input, ['tab-revert'])).toMatchInlineSnapshot(`
+        ".tab-revert {
+          tab-size: revert;
+        }"
       `)
-      expect(await run(['example-initial'], input)).toEqual('')
+      expect(await compileCss(input, ['tab-initial'])).toEqual('')
     })
 
     test('resolving bare values with constraints for integer, percentage, and ratio', async () => {
@@ -30447,283 +17284,242 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-1', 'example-0.5', 'example-20%', 'example-2/3'], input))
+      expect(await compileCss(input, ['example-1', 'example-0.5', 'example-20%', 'example-2/3']))
         .toMatchInlineSnapshot(`
-          "
-          .example-0\\.5 {
-            --value-as-number: .5;
-          }
+        ".example-0\\.5 {
+          --value-as-number: .5;
+        }
 
-          .example-1 {
-            --value-as-number: 1;
-          }
+        .example-1 {
+          --value-as-number: 1;
+        }
 
-          .example-2\\/3 {
-            --value-as-ratio: 2 / 3;
-          }
+        .example-2\\/3 {
+          --value-as-ratio: 2 / 3;
+        }
 
-          .example-20\\% {
-            --value-as-percentage: 20%;
-          }
-          "
-        `)
+        .example-20\\% {
+          --value-as-percentage: 20%;
+        }"
+      `)
       expect(
-        await run(
-          ['example-1.23', 'example-12.34%', 'example-1.2/3', 'example-1/2.3', 'example-1.2/3.4'],
-          input,
-        ),
+        await compileCss(input, [
+          'example-1.23',
+          'example-12.34%',
+          'example-1.2/3',
+          'example-1/2.3',
+          'example-1.2/3.4',
+        ]),
       ).toEqual('')
     })
 
     test('resolving unsupported bare values', async () => {
-      using spy = vi.spyOn(console, 'warn').mockImplementation(() => {})
       let input = css`
-        @utility example-* {
-          --resolved-value: --value(color);
+        @utility tab-* {
+          tab-size: --value(color);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-#0088cc', 'example-foo'], input)).toEqual('')
-      expect(
-        `\n${spy.mock.calls
-          .map((c) => c.join(' '))
-          .join('\n')
-          .trim()}\n`,
-      ).toMatchInlineSnapshot(`
-        "
-        Unsupported bare value data type: "color".
-        Only valid data types are: "number", "integer", "ratio", "percentage".
-
-        \`\`\`css
-        --value(color)
-                ^^^^^
-        \`\`\`
-        "
-      `)
+      expect(await compileCss(input, ['tab-#0088cc', 'tab-foo'])).toEqual('')
     })
 
     test('resolving arbitrary values', async () => {
       let input = css`
-        @utility example-* {
-          --resolved-value: --value([integer]);
+        @utility tab-* {
+          tab-size: --value([integer]);
         }
 
         @tailwind utilities;
       `
 
       expect(
-        await run(
-          [
-            'example-[1]',
-            'example-[76]',
-            'example-[971]',
-            'example-[integer:var(--my-value)]',
-            'example-(integer:my-value)',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'tab-[1]',
+          'tab-[76]',
+          'tab-[971]',
+          'tab-[integer:var(--my-value)]',
+          'tab-(integer:my-value)',
+        ]),
       ).toMatchInlineSnapshot(`
-        "
-        .example-\\[1\\] {
-          --resolved-value: 1;
+        ".tab-\\[1\\] {
+          tab-size: 1;
         }
 
-        .example-\\[76\\] {
-          --resolved-value: 76;
+        .tab-\\[76\\] {
+          tab-size: 76;
         }
 
-        .example-\\[971\\] {
-          --resolved-value: 971;
+        .tab-\\[971\\] {
+          tab-size: 971;
         }
 
-        .example-\\[integer\\:var\\(--my-value\\)\\] {
-          --resolved-value: var(--my-value);
-        }
-        "
+        .tab-\\[integer\\:var\\(--my-value\\)\\] {
+          tab-size: var(--my-value);
+        }"
       `)
       expect(
-        await run(
-          [
-            'example-[#0088cc]',
-            'example-[1px]',
-            'example-[var(--my-value)]',
-            'example-(--my-value)',
-            'example-[color:var(--my-value)]',
-            'example-(color:--my-value)',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'tab-[#0088cc]',
+          'tab-[1px]',
+          'tab-[var(--my-value)]',
+          'tab-(--my-value)',
+          'tab-[color:var(--my-value)]',
+          'tab-(color:--my-value)',
+        ]),
       ).toEqual('')
     })
 
     test('resolving any arbitrary values', async () => {
       let input = css`
-        @utility example-* {
-          --resolved-value: --value([*]);
+        @utility tab-* {
+          tab-size: --value([ *]);
         }
 
         @tailwind utilities;
       `
 
       expect(
-        await run(
-          [
-            'example-[1]',
-            'example-[76]',
-            'example-[971]',
-            'example-[var(--my-value)]',
-            'example-(--my-value)',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'tab-[1]',
+          'tab-[76]',
+          'tab-[971]',
+          'tab-[var(--my-value)]',
+          'tab-(--my-value)',
+        ]),
       ).toMatchInlineSnapshot(`
-        "
-        .example-\\(--my-value\\) {
-          --resolved-value: var(--my-value);
+        ".tab-\\(--my-value\\) {
+          tab-size: var(--my-value);
         }
 
-        .example-\\[1\\] {
-          --resolved-value: 1;
+        .tab-\\[1\\] {
+          tab-size: 1;
         }
 
-        .example-\\[76\\] {
-          --resolved-value: 76;
+        .tab-\\[76\\] {
+          tab-size: 76;
         }
 
-        .example-\\[971\\] {
-          --resolved-value: 971;
+        .tab-\\[971\\] {
+          tab-size: 971;
         }
 
-        .example-\\[var\\(--my-value\\)\\] {
-          --resolved-value: var(--my-value);
-        }
-        "
+        .tab-\\[var\\(--my-value\\)\\] {
+          tab-size: var(--my-value);
+        }"
       `)
     })
 
     test('resolving any arbitrary values (without space)', async () => {
       let input = `
-        @utility example-* {
-          --resolved-value: --value([*]);
+        @utility tab-* {
+          tab-size: --value([*]);
         }
 
         @tailwind utilities;
       `
 
       expect(
-        await run(
-          [
-            'example-[1]',
-            'example-[76]',
-            'example-[971]',
-            'example-[var(--my-value)]',
-            'example-(--my-value)',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'tab-[1]',
+          'tab-[76]',
+          'tab-[971]',
+          'tab-[var(--my-value)]',
+          'tab-(--my-value)',
+        ]),
       ).toMatchInlineSnapshot(`
-        "
-        .example-\\(--my-value\\) {
-          --resolved-value: var(--my-value);
+        ".tab-\\(--my-value\\) {
+          tab-size: var(--my-value);
         }
 
-        .example-\\[1\\] {
-          --resolved-value: 1;
+        .tab-\\[1\\] {
+          tab-size: 1;
         }
 
-        .example-\\[76\\] {
-          --resolved-value: 76;
+        .tab-\\[76\\] {
+          tab-size: 76;
         }
 
-        .example-\\[971\\] {
-          --resolved-value: 971;
+        .tab-\\[971\\] {
+          tab-size: 971;
         }
 
-        .example-\\[var\\(--my-value\\)\\] {
-          --resolved-value: var(--my-value);
-        }
-        "
+        .tab-\\[var\\(--my-value\\)\\] {
+          tab-size: var(--my-value);
+        }"
       `)
     })
 
     test('resolving any arbitrary values (with escaped `*`)', async () => {
       let input = css`
-        @utility example-* {
-          --resolved-value: --value([\*]);
+        @utility tab-* {
+          tab-size: --value([\*]);
         }
 
         @tailwind utilities;
       `
 
       expect(
-        await run(
-          [
-            'example-[1]',
-            'example-[76]',
-            'example-[971]',
-            'example-[var(--my-value)]',
-            'example-(--my-value)',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'tab-[1]',
+          'tab-[76]',
+          'tab-[971]',
+          'tab-[var(--my-value)]',
+          'tab-(--my-value)',
+        ]),
       ).toMatchInlineSnapshot(`
-        "
-        .example-\\(--my-value\\) {
-          --resolved-value: var(--my-value);
+        ".tab-\\(--my-value\\) {
+          tab-size: var(--my-value);
         }
 
-        .example-\\[1\\] {
-          --resolved-value: 1;
+        .tab-\\[1\\] {
+          tab-size: 1;
         }
 
-        .example-\\[76\\] {
-          --resolved-value: 76;
+        .tab-\\[76\\] {
+          tab-size: 76;
         }
 
-        .example-\\[971\\] {
-          --resolved-value: 971;
+        .tab-\\[971\\] {
+          tab-size: 971;
         }
 
-        .example-\\[var\\(--my-value\\)\\] {
-          --resolved-value: var(--my-value);
-        }
-        "
+        .tab-\\[var\\(--my-value\\)\\] {
+          tab-size: var(--my-value);
+        }"
       `)
     })
 
     test('resolving theme, bare and arbitrary values all at once', async () => {
       let input = css`
         @theme reference {
-          --example-a: 8;
+          --tab-size-github: 8;
         }
 
-        @utility example-* {
-          --resolved-value: --value([integer]);
-          --resolved-value: --value(integer);
-          --resolved-value: --value(--example);
+        @utility tab-* {
+          tab-size: --value([integer]);
+          tab-size: --value(integer);
+          tab-size: --value(--tab-size);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-a', 'example-76', 'example-[123]'], input)).toMatchInlineSnapshot(`
-        "
-        .example-76 {
-          --resolved-value: 76;
+      expect(await compileCss(input, ['tab-github', 'tab-76', 'tab-[123]'])).toMatchInlineSnapshot(`
+        ".tab-76 {
+          tab-size: 76;
         }
 
-        .example-\\[123\\] {
-          --resolved-value: 123;
+        .tab-\\[123\\] {
+          tab-size: 123;
         }
 
-        .example-a {
-          --resolved-value: var(--example-a, 8);
-        }
-        "
+        .tab-github {
+          tab-size: var(--tab-size-github, 8);
+        }"
       `)
-      expect(await run(['example-[#0088cc]', 'example-[1px]'], input)).toEqual('')
+      expect(await compileCss(input, ['tab-[#0088cc]', 'tab-[1px]'])).toEqual('')
     })
 
     test('in combination with calc to produce different data types of values', async () => {
@@ -30733,64 +17529,87 @@ describe('custom utilities', () => {
         }
 
         @utility example-* {
-          --resolved-value: --value([percentage]);
-          --resolved-value: calc(--value(integer) * 1%);
-          --resolved-value: --value(--example);
+          --value: --value([percentage]);
+          --value: calc(--value(integer) * 1%);
+          --value: --value(--example);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-full', 'example-12', 'example-[20%]'], input))
+      expect(await compileCss(input, ['example-full', 'example-12', 'example-[20%]']))
         .toMatchInlineSnapshot(`
-          "
-          .example-12 {
-            --resolved-value: calc(12 * 1%);
+          ".example-12 {
+            --value: calc(12 * 1%);
           }
 
           .example-\\[20\\%\\] {
-            --resolved-value: 20%;
+            --value: 20%;
           }
 
           .example-full {
-            --resolved-value: var(--example-full, 100%);
-          }
-          "
+            --value: var(--example-full, 100%);
+          }"
         `)
-      expect(await run(['example-half', 'example-[#0088cc]'], input)).toEqual('')
+      expect(await compileCss(input, ['example-half', 'example-[#0088cc]'])).toEqual('')
     })
 
     test('shorthand if resulting values are of the same type', async () => {
       let input = css`
         @theme reference {
+          --tab-size-github: 8;
           --example-full: 100%;
         }
 
+        @utility tab-* {
+          tab-size: --value(--tab-size, integer, [integer]);
+        }
+
         @utility example-* {
-          --resolved-value: calc(--value(integer) * 1%);
-          --resolved-value: --value(--example, [percentage]);
+          --value: calc(--value(integer) * 1%);
+          --value: --value(--example, [percentage]);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-37', 'example-[50%]', 'example-full'], input))
-        .toMatchInlineSnapshot(`
-          "
-          .example-37 {
-            --resolved-value: calc(37 * 1%);
-          }
+      expect(
+        await compileCss(input, [
+          'tab-github',
+          'tab-76',
+          'tab-[123]',
+          'example-37',
+          'example-[50%]',
+          'example-full',
+        ]),
+      ).toMatchInlineSnapshot(`
+        ".example-37 {
+          --value: calc(37 * 1%);
+        }
 
-          .example-\\[50\\%\\] {
-            --resolved-value: 50%;
-          }
+        .example-\\[50\\%\\] {
+          --value: 50%;
+        }
 
-          .example-full {
-            --resolved-value: var(--example-full, 100%);
-          }
-          "
-        `)
-      expect(await run(['example-foo', 'example-[13px]'], input)).toEqual('')
+        .example-full {
+          --value: var(--example-full, 100%);
+        }
+
+        .tab-76 {
+          tab-size: 76;
+        }
+
+        .tab-\\[123\\] {
+          tab-size: 123;
+        }
+
+        .tab-github {
+          tab-size: var(--tab-size-github, 8);
+        }"
+      `)
+      expect(
+        await compileCss(input, ['tab-[#0088cc]', 'tab-[1px]', 'example-foo', 'example-[13px]']),
+      ).toEqual('')
     })
 
     test('negative values', async () => {
@@ -30800,75 +17619,66 @@ describe('custom utilities', () => {
         }
 
         @utility example-* {
-          --resolved-value: --value(--example, [percentage], [length]);
+          --value: --value(--example, [percentage], [length]);
         }
 
         @utility -example-* {
-          --resolved-value: calc(--value(--example, [percentage], [length]) * -1);
+          --value: calc(--value(--example, [percentage], [length]) * -1);
         }
 
         @tailwind utilities;
       `
 
       expect(
-        await run(
-          [
-            'example-full',
-            '-example-full',
-            'example-[10px]',
-            '-example-[10px]',
-            'example-[20%]',
-            '-example-[20%]',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'example-full',
+          '-example-full',
+          'example-[10px]',
+          '-example-[10px]',
+          'example-[20%]',
+          '-example-[20%]',
+        ]),
       ).toMatchInlineSnapshot(`
-        "
-        .-example-\\[10px\\] {
-          --resolved-value: calc(10px * -1);
+        ".-example-\\[10px\\] {
+          --value: calc(10px * -1);
         }
 
         .-example-\\[20\\%\\] {
-          --resolved-value: calc(20% * -1);
+          --value: calc(20% * -1);
         }
 
         .-example-full {
-          --resolved-value: calc(var(--example-full, 100%) * -1);
+          --value: calc(var(--example-full, 100%) * -1);
         }
 
         .example-\\[10px\\] {
-          --resolved-value: 10px;
+          --value: 10px;
         }
 
         .example-\\[20\\%\\] {
-          --resolved-value: 20%;
+          --value: 20%;
         }
 
         .example-full {
-          --resolved-value: var(--example-full, 100%);
-        }
-        "
+          --value: var(--example-full, 100%);
+        }"
       `)
-      expect(await run(['example-10'], input)).toEqual('')
+      expect(await compileCss(input, ['example-10'])).toEqual('')
     })
 
     test('using the same value multiple times', async () => {
       let input = css`
         @utility example-* {
-          --resolved-value: calc(var(--spacing) * --value(number))
-            calc(var(--spacing) * --value(number));
+          --value: calc(var(--spacing) * --value(number)) calc(var(--spacing) * --value(number));
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-12'], input)).toMatchInlineSnapshot(`
-        "
-        .example-12 {
-          --resolved-value: calc(var(--spacing) * 12)
-                    calc(var(--spacing) * 12);
-        }
-        "
+      expect(await compileCss(input, ['example-12'])).toMatchInlineSnapshot(`
+        ".example-12 {
+          --value: calc(var(--spacing) * 12) calc(var(--spacing) * 12);
+        }"
       `)
     })
 
@@ -30885,16 +17695,14 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-12'], input)).toMatchInlineSnapshot(`
-        "
-        :root, :host {
+      expect(await compileCss(input, ['example-12'])).toMatchInlineSnapshot(`
+        ":root, :host {
           --spacing: 4px;
         }
 
         .example-12 {
           margin: calc(var(--spacing) * 12);
-        }
-        "
+        }"
       `)
     })
 
@@ -30911,179 +17719,10 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-12'], input)).toMatchInlineSnapshot(`
-        "
-        .example-12 {
+      expect(await compileCss(input, ['example-12'])).toMatchInlineSnapshot(`
+        ".example-12 {
           margin: 48px;
-        }
-        "
-      `)
-    })
-
-    test('functional utilities can use `--default(…)` in `--value(…)`', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: --value(integer, --default(4));
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example', 'example-123'], input)).toMatchInlineSnapshot(`
-        "
-        .example {
-          --resolved-value: 4;
-        }
-
-        .example-123 {
-          --resolved-value: 123;
-        }
-        "
-      `)
-
-      expect(await run(['example-foo'], input)).toEqual('')
-    })
-
-    test('functional utilities can use `--default(…)` in complex expressions', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: calc(--value(integer, --default(4)) * 2);
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example', 'example-123'], input)).toMatchInlineSnapshot(`
-        "
-        .example {
-          --resolved-value: calc(4 * 2);
-        }
-
-        .example-123 {
-          --resolved-value: calc(123 * 2);
-        }
-        "
-      `)
-
-      expect(await run(['example-foo'], input)).toEqual('')
-    })
-
-    test('functional utilities can use `--default(…)` with `--modifier(…)`', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: --value(integer, --default(4));
-          --resolved-modifier: --modifier(integer);
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example', 'example/25'], input)).toMatchInlineSnapshot(`
-        "
-        .example\\/25 {
-          --resolved-value: 4;
-          --resolved-modifier: 25;
-        }
-
-        .example {
-          --resolved-value: 4;
-        }
-        "
-      `)
-
-      expect(await run(['example/foo'], input)).toEqual('')
-    })
-
-    test('functional utilities can use `--default(…)` in `--modifier(…)`', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: --value(integer);
-          --resolved-modifier: --modifier(integer, --default(1));
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example-123', 'example-123/25'], input)).toMatchInlineSnapshot(`
-        "
-        .example-123 {
-          --resolved-value: 123;
-          --resolved-modifier: 1;
-        }
-
-        .example-123\\/25 {
-          --resolved-value: 123;
-          --resolved-modifier: 25;
-        }
-        "
-      `)
-
-      expect(await run(['example-123/foo'], input)).toEqual('')
-    })
-
-    test('functional utilities can use `--default(…)` in `--value(…)` and `--modifier(…)`', async () => {
-      let input = css`
-        @utility example-* {
-          --resolved-value: --value(integer, --default(12));
-          --resolved-modifier: --modifier(integer, --default(34));
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['example', 'example/1', 'example-1', 'example-1/1'], input))
-        .toMatchInlineSnapshot(`
-          "
-          .example {
-            --resolved-value: 12;
-            --resolved-modifier: 34;
-          }
-
-          .example-1 {
-            --resolved-value: 1;
-            --resolved-modifier: 34;
-          }
-
-          .example-1\\/1 {
-            --resolved-value: 1;
-            --resolved-modifier: 1;
-          }
-
-          .example\\/1 {
-            --resolved-value: 12;
-            --resolved-modifier: 1;
-          }
-          "
-        `)
-
-      expect(await run(['example-123/foo'], input)).toEqual('')
-    })
-
-    test('the value of `--default(…)` is emitted as-is', async () => {
-      let input = css`
-        @theme reference {
-          --text-box-trim-trim-both: trim-both;
-          --text-box-edge-cap: cap alphabetic;
-        }
-
-        @utility trim-* {
-          text-box: --value(--text-box-trim-*)
-            --modifier(--text-box-edge-*, --default(box alphabetic));
-        }
-
-        @tailwind utilities;
-      `
-
-      expect(await run(['trim-trim-both', 'trim-trim-both/cap'], input)).toMatchInlineSnapshot(`
-        "
-        .trim-trim-both {
-          text-box: var(--text-box-trim-trim-both, trim-both) box alphabetic;
-        }
-
-        .trim-trim-both\\/cap {
-          text-box: var(--text-box-trim-trim-both, trim-both) var(--text-box-edge-cap, cap alphabetic);
-        }
-        "
+        }"
       `)
     })
 
@@ -31095,65 +17734,62 @@ describe('custom utilities', () => {
         }
 
         @utility example-* {
-          --resolved-value: --value(--value, [length]);
-          --resolved-modifier: --modifier(--modifier, [length]);
-          --resolved-modifier-with-calc: calc(--modifier(--modifier, [length]) * 2);
-          --resolved-modifier-literals: --modifier('literal', 'literal-2');
+          --value: --value(--value, [length]);
+          --modifier: --modifier(--modifier, [length]);
+          --modifier-with-calc: calc(--modifier(--modifier, [length]) * 2);
+          --modifier-literals: --modifier('literal', 'literal-2');
         }
 
         @tailwind utilities;
       `
 
       expect(
-        await run(
-          [
-            'example-sm',
-            'example-sm/7',
-            'example-[12px]',
-            'example-[12px]/[16px]',
-            'example-sm/literal',
-            'example-sm/literal-2',
-          ],
-          input,
-        ),
+        await compileCss(input, [
+          'example-sm',
+          'example-sm/7',
+          'example-[12px]',
+          'example-[12px]/[16px]',
+          'example-sm/literal',
+          'example-sm/literal-2',
+        ]),
       ).toMatchInlineSnapshot(`
-        "
-        .example-\\[12px\\]\\/\\[16px\\] {
-          --resolved-value: 12px;
-          --resolved-modifier: 16px;
-          --resolved-modifier-with-calc: calc(16px * 2);
+        ".example-\\[12px\\]\\/\\[16px\\] {
+          --value: 12px;
+          --modifier: 16px;
+          --modifier-with-calc: calc(16px * 2);
         }
 
         .example-sm\\/7 {
-          --resolved-value: var(--value-sm, 14px);
-          --resolved-modifier: var(--modifier-7, 28px);
-          --resolved-modifier-with-calc: calc(var(--modifier-7, 28px) * 2);
+          --value: var(--value-sm, 14px);
+          --modifier: var(--modifier-7, 28px);
+          --modifier-with-calc: calc(var(--modifier-7, 28px) * 2);
         }
 
         .example-sm\\/literal {
-          --resolved-value: var(--value-sm, 14px);
-          --resolved-modifier-literals: literal;
+          --value: var(--value-sm, 14px);
+          --modifier-literals: literal;
         }
 
         .example-sm\\/literal-2 {
-          --resolved-value: var(--value-sm, 14px);
-          --resolved-modifier-literals: literal-2;
+          --value: var(--value-sm, 14px);
+          --modifier-literals: literal-2;
         }
 
         .example-\\[12px\\] {
-          --resolved-value: 12px;
+          --value: 12px;
         }
 
         .example-sm {
-          --resolved-value: var(--value-sm, 14px);
-        }
-        "
+          --value: var(--value-sm, 14px);
+        }"
       `)
       expect(
-        await run(
-          ['example-foo', 'example-foo/[12px]', 'example-foo/12', 'example-sm/unknown-literal'],
-          input,
-        ),
+        await compileCss(input, [
+          'example-foo',
+          'example-foo/[12px]',
+          'example-foo/12',
+          'example-sm/unknown-literal',
+        ]),
       ).toEqual('')
     })
 
@@ -31164,29 +17800,27 @@ describe('custom utilities', () => {
         }
 
         @utility example-* {
-          --resolved-value: --value(--example, ratio, [ratio]);
+          --value: --value(--example, ratio, [ratio]);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-video', 'example-1/1', 'example-[7/9]'], input))
+      expect(await compileCss(input, ['example-video', 'example-1/1', 'example-[7/9]']))
         .toMatchInlineSnapshot(`
-          "
-          .example-1\\/1 {
-            --resolved-value: 1 / 1;
+          ".example-1\\/1 {
+            --value: 1 / 1;
           }
 
           .example-\\[7\\/9\\] {
-            --resolved-value: 7/9;
+            --value: 7 / 9;
           }
 
           .example-video {
-            --resolved-value: var(--example-video, 16 / 9);
-          }
-          "
+            --value: var(--example-video, 16 / 9);
+          }"
         `)
-      expect(await run(['example-foo'], input)).toEqual('')
+      expect(await compileCss(input, ['example-foo'])).toEqual('')
     })
 
     test('resolve theme values with sub-namespace (--text- * --line-height)', async () => {
@@ -31198,16 +17832,15 @@ describe('custom utilities', () => {
 
         @utility example-* {
           font-size: --value(--text);
-          line-height: --value(--text-* --line-height);
+          line-height: --value(--text- * --line-height);
           line-height: --modifier(number);
         }
 
         @tailwind utilities;
       `
 
-      expect(await run(['example-xs', 'example-xs/6'], input)).toMatchInlineSnapshot(`
-        "
-        .example-xs\\/6 {
+      expect(await compileCss(input, ['example-xs', 'example-xs/6'])).toMatchInlineSnapshot(`
+        ".example-xs\\/6 {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
           line-height: 6;
@@ -31216,10 +17849,9 @@ describe('custom utilities', () => {
         .example-xs {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
-        }
-        "
+        }"
       `)
-      expect(await run(['example-foo', 'example-xs/foo'], input)).toEqual('')
+      expect(await compileCss(input, ['example-foo', 'example-xs/foo'])).toEqual('')
     })
 
     test('resolve theme values with sub-namespace (--text-\\* --line-height)', async () => {
@@ -31238,9 +17870,8 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-xs', 'example-xs/6'], input)).toMatchInlineSnapshot(`
-        "
-        .example-xs\\/6 {
+      expect(await compileCss(input, ['example-xs', 'example-xs/6'])).toMatchInlineSnapshot(`
+        ".example-xs\\/6 {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
           line-height: 6;
@@ -31249,10 +17880,9 @@ describe('custom utilities', () => {
         .example-xs {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
-        }
-        "
+        }"
       `)
-      expect(await run(['example-foo', 'example-xs/foo'], input)).toEqual('')
+      expect(await compileCss(input, ['example-foo', 'example-xs/foo'])).toEqual('')
     })
 
     test('resolve theme values with sub-namespace (--value(--text --line-height))', async () => {
@@ -31271,9 +17901,8 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-xs', 'example-xs/6'], input)).toMatchInlineSnapshot(`
-        "
-        .example-xs\\/6 {
+      expect(await compileCss(input, ['example-xs', 'example-xs/6'])).toMatchInlineSnapshot(`
+        ".example-xs\\/6 {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
           line-height: 6;
@@ -31282,10 +17911,9 @@ describe('custom utilities', () => {
         .example-xs {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
-        }
-        "
+        }"
       `)
-      expect(await run(['example-foo', 'example-xs/foo'], input)).toEqual('')
+      expect(await compileCss(input, ['example-foo', 'example-xs/foo'])).toEqual('')
     })
 
     test('resolve theme values with sub-namespace (--value(--text-*--line-height))', async () => {
@@ -31304,9 +17932,8 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-xs', 'example-xs/6'], input)).toMatchInlineSnapshot(`
-        "
-        .example-xs\\/6 {
+      expect(await compileCss(input, ['example-xs', 'example-xs/6'])).toMatchInlineSnapshot(`
+        ".example-xs\\/6 {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
           line-height: 6;
@@ -31315,10 +17942,9 @@ describe('custom utilities', () => {
         .example-xs {
           font-size: var(--text-xs, .75rem);
           line-height: var(--text-xs--line-height, calc(1 / .75));
-        }
-        "
+        }"
       `)
-      expect(await run(['example-foo', 'example-xs/foo'], input)).toEqual('')
+      expect(await compileCss(input, ['example-foo', 'example-xs/foo'])).toEqual('')
     })
 
     test('variables used in `@utility` will not be emitted if the utility is not used', async () => {
@@ -31336,12 +17962,10 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['flex'], input)).toMatchInlineSnapshot(`
-        "
-        .flex {
+      expect(await compileCss(input, ['flex'])).toMatchInlineSnapshot(`
+        ".flex {
           display: flex;
-        }
-        "
+        }"
       `)
     })
 
@@ -31360,9 +17984,8 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['example-foo'], input)).toMatchInlineSnapshot(`
-        "
-        :root, :host {
+      expect(await compileCss(input, ['example-foo'])).toMatchInlineSnapshot(`
+        ":root, :host {
           --example-foo: red;
           --color-red-500: red;
         }
@@ -31370,8 +17993,7 @@ describe('custom utilities', () => {
         .example-foo {
           color: var(--color-red-500);
           background-color: var(--example-foo);
-        }
-        "
+        }"
       `)
     })
 
@@ -31397,15 +18019,13 @@ describe('custom utilities', () => {
         @tailwind utilities;
       `
 
-      expect(await run(['mask-r-20%'], input)).toMatchInlineSnapshot(`
-        "
-        .mask-r-20\\% {
+      expect(await compileCss(input, ['mask-r-20%'])).toMatchInlineSnapshot(`
+        ".mask-r-20\\% {
           --mask-right: linear-gradient(to left, transparent, black 20%);
           -webkit-mask-image: var(--mask-linear), var(--mask-radial), var(--mask-conic);
           -webkit-mask-image: var(--mask-linear), var(--mask-radial), var(--mask-conic);
           mask-image: var(--mask-linear), var(--mask-radial), var(--mask-conic);
-        }
-        "
+        }"
       `)
     })
   })
@@ -31413,92 +18033,84 @@ describe('custom utilities', () => {
   test('resolve value based on `@theme`', async () => {
     let input = css`
       @theme {
-        --example-a: 8;
+        --tab-size-github: 8;
       }
 
-      @utility example-* {
-        --resolved-value: --value(--example);
+      @utility tab-* {
+        tab-size: --value(--tab-size);
       }
 
       @tailwind utilities;
     `
 
-    expect(await run(['example-a'], input)).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --example-a: 8;
+    expect(await compileCss(input, ['tab-github'])).toMatchInlineSnapshot(`
+      ":root, :host {
+        --tab-size-github: 8;
       }
 
-      .example-a {
-        --resolved-value: var(--example-a);
-      }
-      "
+      .tab-github {
+        tab-size: var(--tab-size-github);
+      }"
     `)
   })
 
   test('resolve value based on `@theme reference`', async () => {
     let input = css`
       @theme reference {
-        --example-a: 8;
+        --tab-size-github: 8;
       }
 
-      @utility example-* {
-        --resolved-value: --value(--example);
+      @utility tab-* {
+        tab-size: --value(--tab-size);
       }
 
       @tailwind utilities;
     `
 
-    expect(await run(['example-a'], input)).toMatchInlineSnapshot(`
-      "
-      .example-a {
-        --resolved-value: var(--example-a, 8);
-      }
-      "
+    expect(await compileCss(input, ['tab-github'])).toMatchInlineSnapshot(`
+      ".tab-github {
+        tab-size: var(--tab-size-github, 8);
+      }"
     `)
   })
 
   test('resolve value based on `@theme inline`', async () => {
     let input = css`
       @theme inline {
-        --example-a: 8;
+        --tab-size-github: 8;
       }
 
-      @utility example-* {
-        --resolved-value: --value(--example);
+      @utility tab-* {
+        tab-size: --value(--tab-size);
       }
 
       @tailwind utilities;
     `
 
-    expect(await run(['example-a'], input)).toMatchInlineSnapshot(`
-      "
-      .example-a {
-        --resolved-value: 8;
-      }
-      "
+    expect(await compileCss(input, ['tab-github'])).toMatchInlineSnapshot(`
+      ".tab-github {
+        tab-size: 8;
+      }"
     `)
   })
 
   test('resolve value based on `@theme inline reference`', async () => {
     let input = css`
       @theme inline reference {
-        --example-a: 8;
+        --tab-size-github: 8;
       }
 
-      @utility example-* {
-        --resolved-value: --value(--example);
+      @utility tab-* {
+        tab-size: --value(--tab-size);
       }
 
       @tailwind utilities;
     `
 
-    expect(await run(['example-a'], input)).toMatchInlineSnapshot(`
-      "
-      .example-a {
-        --resolved-value: 8;
-      }
-      "
+    expect(await compileCss(input, ['tab-github'])).toMatchInlineSnapshot(`
+      ".tab-github {
+        tab-size: 8;
+      }"
     `)
   })
 
@@ -31520,13 +18132,11 @@ describe('custom utilities', () => {
       @tailwind utilities;
     `
 
-    expect(await run(['example-xs'], input)).toMatchInlineSnapshot(`
-      "
-      .example-xs {
+    expect(await compileCss(input, ['example-xs'])).toMatchInlineSnapshot(`
+      ".example-xs {
         font-size: var(--text-xs, .75rem);
         line-height: 1.33333;
-      }
-      "
+      }"
     `)
   })
 
@@ -31548,49 +18158,11 @@ describe('custom utilities', () => {
       @tailwind utilities;
     `
 
-    expect(await run(['example-xs'], input)).toMatchInlineSnapshot(`
-      "
-      .example-xs {
+    expect(await compileCss(input, ['example-xs'])).toMatchInlineSnapshot(`
+      ".example-xs {
         font-size: .75rem;
         line-height: var(--text-xs--line-height, calc(1 / .75));
-      }
-      "
-    `)
-  })
-
-  test('multiple @utility definitions with the same name but different value types', async () => {
-    let input = css`
-      @theme {
-        --color-red-500: #ef4444;
-        --spacing: 0.25rem;
-      }
-
-      @utility foo-* {
-        color: --value(--color-*);
-      }
-
-      @utility foo-* {
-        font-size: --spacing(--value(number));
-      }
-
-      @tailwind utilities;
-    `
-
-    expect(await run(['foo-red-500', 'foo-123'], input)).toMatchInlineSnapshot(`
-      "
-      :root, :host {
-        --color-red-500: #ef4444;
-        --spacing: .25rem;
-      }
-
-      .foo-123 {
-        font-size: calc(var(--spacing) * 123);
-      }
-
-      .foo-red-500 {
-        color: var(--color-red-500);
-      }
-      "
+      }"
     `)
   })
 })
diff --git a/packages/tailwindcss/src/utilities.ts b/packages/tailwindcss/src/utilities.ts
index 477559d7e..84b5d61c6 100644
--- a/packages/tailwindcss/src/utilities.ts
+++ b/packages/tailwindcss/src/utilities.ts
@@ -1,10 +1,9 @@
 import {
   atRoot,
   atRule,
-  cloneAstNode,
   decl,
-  rule,
   styleRule,
+  walk,
   type AstNode,
   type AtRule,
   type Declaration,
@@ -12,24 +11,23 @@ import {
 } from './ast'
 import type { Candidate, CandidateModifier, NamedUtilityValue } from './candidate'
 import type { DesignSystem } from './design-system'
+import { enableBaselineLast, enableSafeAlignment, enableWrapAnywhere } from './feature-flags'
 import type { Theme, ThemeKey } from './theme'
 import { compareBreakpoints } from './utils/compare-breakpoints'
 import { DefaultMap } from './utils/default-map'
-import { dimensions } from './utils/dimensions'
-import { unescape } from './utils/escape'
 import {
   inferDataType,
-  isLength,
   isPositiveInteger,
   isStrictPositiveInteger,
   isValidOpacityValue,
   isValidSpacingMultiplier,
 } from './utils/infer-data-type'
-import { addWhitespaceAroundMathOperators } from './utils/math-operators'
 import { replaceShadowColors } from './utils/replace-shadow-colors'
 import { segment } from './utils/segment'
 import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
+
+const IS_VALID_STATIC_UTILITY_NAME = /^-?[a-z][a-zA-Z0-9/%._-]*$/
+const IS_VALID_FUNCTIONAL_UTILITY_NAME = /^-?[a-z][a-zA-Z0-9/%._-]*-\*$/
 
 const DEFAULT_SPACING_SUGGESTIONS = [
   '0',
@@ -122,22 +120,13 @@ export class Utilities {
   }
 
   getCompletions(name: string): SuggestionGroup[] {
-    if (this.has(name, 'static')) {
-      return (
-        this.completions.get(name)?.() ?? [{ supportsNegative: false, values: [], modifiers: [] }]
-      )
-    }
-
     return this.completions.get(name)?.() ?? []
   }
 
   suggest(name: string, groups: () => SuggestionGroup[]) {
-    let existingGroups = this.completions.get(name)
-    if (existingGroups) {
-      this.completions.set(name, () => [...existingGroups?.(), ...groups?.()])
-    } else {
-      this.completions.set(name, groups)
-    }
+    // TODO: We are calling this multiple times on purpose but ideally only ever
+    // once per utility root.
+    this.completions.set(name, groups)
   }
 
   keys(kind: 'static' | 'functional') {
@@ -184,29 +173,9 @@ export function withAlpha(value: string, alpha: string): string {
     alpha = `${alphaAsNumber * 100}%`
   }
 
-  // No need for `color-mix` if the alpha is `100%`
-  if (alpha === '100%') {
-    return value
-  }
-
   return `color-mix(in oklab, ${value} ${alpha}, transparent)`
 }
 
-/**
- * Replace the opacity in a color using relative color syntax.
- */
-export function replaceAlpha(value: string, alpha: string): string {
-  // Convert numeric values (like `0.5`) to percentages (like `50%`) so they
-  // work properly with `color-mix`. Assume anything that isn't a number is
-  // safe to pass through as-is, like `var(--my-opacity)`.
-  let alphaAsNumber = Number(alpha)
-  if (!Number.isNaN(alphaAsNumber)) {
-    alpha = `${alphaAsNumber * 100}%`
-  }
-
-  return `oklab(from ${value} l a b / ${alpha})`
-}
-
 /**
  * Resolve a color value + optional opacity modifier to a final color.
  */
@@ -270,7 +239,7 @@ function resolveThemeColor<T extends ThemeKey>(
       break
     }
     case 'current': {
-      value = 'currentcolor'
+      value = 'currentColor'
       break
     }
     default: {
@@ -282,15 +251,6 @@ function resolveThemeColor<T extends ThemeKey>(
   return value ? asColor(value, candidate.modifier, theme) : null
 }
 
-/**
- * The alpha and beta releases used `_` in theme keys to represent a `.`. This meant we used
- * `--leading-1_5` instead of `--leading-1\.5` to add utilities like `leading-1.5`.
- *
- * We prefer the use of the escaped dot now but still want to make sure suggestions for the
- * legacy key format still works as expected when surrounded by numbers.
- */
-const LEGACY_NUMERIC_KEY = /(\d+)_(\d+)/g
-
 export function createUtilities(theme: Theme) {
   let utilities = new Utilities()
 
@@ -298,6 +258,15 @@ export function createUtilities(theme: Theme) {
    * Register list of suggestions for a class
    */
   function suggest(classRoot: string, defns: () => SuggestionDefinition[]) {
+    /**
+     * The alpha and beta releases used `_` in theme keys to represent a `.`. This meant we used
+     * `--leading-1_5` instead of `--leading-1\.5` to add utilities like `leading-1.5`.
+     *
+     * We prefer the use of the escaped dot now but still want to make sure suggestions for the
+     * legacy key format still works as expected when surrounded by numbers.
+     */
+    const LEGACY_NUMERIC_KEY = /(\d+)_(\d+)/g
+
     function* resolve(themeKeys: ThemeKey[]) {
       for (let value of theme.keysInNamespaces(themeKeys)) {
         yield value.replace(LEGACY_NUMERIC_KEY, (_, a, b) => {
@@ -382,10 +351,9 @@ export function createUtilities(theme: Theme) {
     supportsFractions?: boolean
     themeKeys?: ThemeKey[]
     defaultValue?: string | null
-    staticValues?: Record<string, AstNode[]>
     handleBareValue?: (value: NamedUtilityValue) => string | null
     handleNegativeBareValue?: (value: NamedUtilityValue) => string | null
-    handle: (value: string, dataType: string | null) => AstNode[] | undefined
+    handle: (value: string) => AstNode[] | undefined
   }
 
   /**
@@ -393,12 +361,9 @@ export function createUtilities(theme: Theme) {
    * user's theme.
    */
   function functionalUtility(classRoot: string, desc: UtilityDescription) {
-    if (desc.staticValues) desc.staticValues = Object.assign(Object.create(null), desc.staticValues)
-
     function handleFunctionalUtility({ negative }: { negative: boolean }) {
       return (candidate: Extract<Candidate, { kind: 'functional' }>) => {
         let value: string | null = null
-        let dataType: string | null = null
 
         if (!candidate.value) {
           if (candidate.modifier) return
@@ -414,26 +379,18 @@ export function createUtilities(theme: Theme) {
         } else if (candidate.value.kind === 'arbitrary') {
           if (candidate.modifier) return
           value = candidate.value.value
-          dataType = candidate.value.dataType
         } else {
           value = theme.resolve(
             candidate.value.fraction ?? candidate.value.value,
             desc.themeKeys ?? [],
           )
 
-          // If the theme value resolved without consuming the modifier, then
-          // the modifier would be silently ignored and `w-4` and `w-4/foo`
-          // would generate the same CSS.
-          //
-          // The modifier would be consumed if it's a fraction, e.g.: `w-1/2`
-          if (value !== null && candidate.modifier && !candidate.value.fraction) return
-
           // Automatically handle things like `w-1/2` without requiring `1/2` to
           // exist as a theme value.
           if (value === null && desc.supportsFractions && candidate.value.fraction) {
             let [lhs, rhs] = segment(candidate.value.fraction, '/')
             if (!isPositiveInteger(lhs) || !isPositiveInteger(rhs)) return
-            value = `calc(${lhs} / ${rhs} * 100%)`
+            value = `calc(${candidate.value.fraction} * 100%)`
           }
 
           // If there is still no value but the utility supports bare values,
@@ -441,28 +398,20 @@ export function createUtilities(theme: Theme) {
           if (value === null && negative && desc.handleNegativeBareValue) {
             value = desc.handleNegativeBareValue(candidate.value)
             if (!value?.includes('/') && candidate.modifier) return
-            if (value !== null) return desc.handle(value, null)
+            if (value !== null) return desc.handle(value)
           }
 
           if (value === null && desc.handleBareValue) {
             value = desc.handleBareValue(candidate.value)
             if (!value?.includes('/') && candidate.modifier) return
           }
-
-          if (value === null && !negative && desc.staticValues && !candidate.modifier) {
-            let fallback = desc.staticValues[candidate.value.value]
-            if (fallback) return fallback.map(cloneAstNode)
-          }
         }
 
         // If there is no value, don't generate any rules.
         if (value === null) return
 
         // Negate the value if the candidate has a negative prefix.
-        return desc.handle(
-          negative ? addWhitespaceAroundMathOperators(`calc(${value} * -1)`) : value,
-          dataType,
-        )
+        return desc.handle(negative ? `calc(${value} * -1)` : value)
       }
     }
 
@@ -479,13 +428,6 @@ export function createUtilities(theme: Theme) {
         supportsFractions: desc.supportsFractions,
       },
     ])
-
-    // Also suggest any staticValues automatically so callers don't need to
-    // manually add suggestion groups for e.g. `auto`, `none`, `full`, etc.
-    if (desc.staticValues && Object.keys(desc.staticValues).length > 0) {
-      let values = Object.keys(desc.staticValues)
-      suggest(classRoot, () => [{ values }])
-    }
   }
 
   type ColorUtilityDescription = {
@@ -526,7 +468,6 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: desc.themeKeys,
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
       },
     ])
@@ -539,11 +480,9 @@ export function createUtilities(theme: Theme) {
     {
       supportsNegative = false,
       supportsFractions = false,
-      staticValues,
     }: {
       supportsNegative?: boolean
       supportsFractions?: boolean
-      staticValues?: Record<string, AstNode[]>
     } = {},
   ) {
     if (supportsNegative) {
@@ -560,17 +499,16 @@ export function createUtilities(theme: Theme) {
         if (!multiplier) return null
         if (!isValidSpacingMultiplier(value)) return null
 
-        return `--spacing(${value})`
+        return `calc(${multiplier} * ${value})`
       },
       handleNegativeBareValue: ({ value }) => {
         let multiplier = theme.resolve(null, ['--spacing'])
         if (!multiplier) return null
         if (!isValidSpacingMultiplier(value)) return null
 
-        return `--spacing(-${value})`
+        return `calc(${multiplier} * -${value})`
       },
       handle,
-      staticValues,
     })
 
     suggest(name, () => [
@@ -596,7 +534,7 @@ export function createUtilities(theme: Theme) {
     ['padding', '0'],
     ['margin', '-1px'],
     ['overflow', 'hidden'],
-    ['clip-path', 'inset(50%)'],
+    ['clip', 'rect(0, 0, 0, 0)'],
     ['white-space', 'nowrap'],
     ['border-width', '0'],
   ])
@@ -607,7 +545,7 @@ export function createUtilities(theme: Theme) {
     ['padding', '0'],
     ['margin', '0'],
     ['overflow', 'visible'],
-    ['clip-path', 'none'],
+    ['clip', 'auto'],
     ['white-space', 'normal'],
   ])
 
@@ -640,10 +578,8 @@ export function createUtilities(theme: Theme) {
     ['inset', 'inset'],
     ['inset-x', 'inset-inline'],
     ['inset-y', 'inset-block'],
-    ['inset-s', 'inset-inline-start'],
-    ['inset-e', 'inset-inline-end'],
-    ['inset-bs', 'inset-block-start'],
-    ['inset-be', 'inset-block-end'],
+    ['start', 'inset-inline-start'],
+    ['end', 'inset-inline-end'],
     ['top', 'top'],
     ['right', 'right'],
     ['bottom', 'bottom'],
@@ -667,6 +603,7 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `z-index`
    */
+  staticUtility('z-auto', [['z-index', 'auto']])
   functionalUtility('z', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -675,9 +612,6 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--z-index'],
     handle: (value) => [decl('z-index', value)],
-    staticValues: {
-      auto: [decl('z-index', 'auto')],
-    },
   })
 
   suggest('z', () => [
@@ -691,6 +625,9 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `order`
    */
+  staticUtility('order-first', [['order', '-9999']])
+  staticUtility('order-last', [['order', '9999']])
+  staticUtility('order-none', [['order', '0']])
   functionalUtility('order', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -699,10 +636,6 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--order'],
     handle: (value) => [decl('order', value)],
-    staticValues: {
-      first: [decl('order', '-9999')],
-      last: [decl('order', '9999')],
-    },
   })
 
   suggest('order', () => [
@@ -716,6 +649,7 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `grid-column`
    */
+  staticUtility('col-auto', [['grid-column', 'auto']])
   functionalUtility('col', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -724,25 +658,20 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--grid-column'],
     handle: (value) => [decl('grid-column', value)],
-    staticValues: {
-      auto: [decl('grid-column', 'auto')],
-    },
   })
-
+  staticUtility('col-span-full', [['grid-column', '1 / -1']])
   functionalUtility('col-span', {
     handleBareValue: ({ value }) => {
       if (!isPositiveInteger(value)) return null
       return value
     },
     handle: (value) => [decl('grid-column', `span ${value} / span ${value}`)],
-    staticValues: {
-      full: [decl('grid-column', '1 / -1')],
-    },
   })
 
   /**
    * @css `grid-column-start`
    */
+  staticUtility('col-start-auto', [['grid-column-start', 'auto']])
   functionalUtility('col-start', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -751,14 +680,12 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--grid-column-start'],
     handle: (value) => [decl('grid-column-start', value)],
-    staticValues: {
-      auto: [decl('grid-column-start', 'auto')],
-    },
   })
 
   /**
    * @css `grid-column-end`
    */
+  staticUtility('col-end-auto', [['grid-column-end', 'auto']])
   functionalUtility('col-end', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -767,9 +694,6 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--grid-column-end'],
     handle: (value) => [decl('grid-column-end', value)],
-    staticValues: {
-      auto: [decl('grid-column-end', 'auto')],
-    },
   })
 
   suggest('col-span', () => [
@@ -798,6 +722,7 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `grid-row`
    */
+  staticUtility('row-auto', [['grid-row', 'auto']])
   functionalUtility('row', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -806,11 +731,8 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--grid-row'],
     handle: (value) => [decl('grid-row', value)],
-    staticValues: {
-      auto: [decl('grid-row', 'auto')],
-    },
   })
-
+  staticUtility('row-span-full', [['grid-row', '1 / -1']])
   functionalUtility('row-span', {
     themeKeys: [],
     handleBareValue: ({ value }) => {
@@ -818,14 +740,12 @@ export function createUtilities(theme: Theme) {
       return value
     },
     handle: (value) => [decl('grid-row', `span ${value} / span ${value}`)],
-    staticValues: {
-      full: [decl('grid-row', '1 / -1')],
-    },
   })
 
   /**
    * @css `grid-row-start`
    */
+  staticUtility('row-start-auto', [['grid-row-start', 'auto']])
   functionalUtility('row-start', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -834,14 +754,12 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--grid-row-start'],
     handle: (value) => [decl('grid-row-start', value)],
-    staticValues: {
-      auto: [decl('grid-row-start', 'auto')],
-    },
   })
 
   /**
    * @css `grid-row-end`
    */
+  staticUtility('row-end-auto', [['grid-row-end', 'auto']])
   functionalUtility('row-end', {
     supportsNegative: true,
     handleBareValue: ({ value }) => {
@@ -850,9 +768,6 @@ export function createUtilities(theme: Theme) {
     },
     themeKeys: ['--grid-row-end'],
     handle: (value) => [decl('grid-row-end', value)],
-    staticValues: {
-      auto: [decl('grid-row-end', 'auto')],
-    },
   })
 
   suggest('row-span', () => [
@@ -906,8 +821,6 @@ export function createUtilities(theme: Theme) {
     ['my', 'margin-block'],
     ['ms', 'margin-inline-start'],
     ['me', 'margin-inline-end'],
-    ['mbs', 'margin-block-start'],
-    ['mbe', 'margin-block-end'],
     ['mt', 'margin-top'],
     ['mr', 'margin-right'],
     ['mb', 'margin-bottom'],
@@ -928,6 +841,12 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `line-clamp`
    */
+  staticUtility('line-clamp-none', [
+    ['overflow', 'visible'],
+    ['display', 'block'],
+    ['-webkit-box-orient', 'horizontal'],
+    ['-webkit-line-clamp', 'unset'],
+  ])
   functionalUtility('line-clamp', {
     themeKeys: ['--line-clamp'],
     handleBareValue: ({ value }) => {
@@ -940,14 +859,6 @@ export function createUtilities(theme: Theme) {
       decl('-webkit-box-orient', 'vertical'),
       decl('-webkit-line-clamp', value),
     ],
-    staticValues: {
-      none: [
-        decl('overflow', 'visible'),
-        decl('display', 'block'),
-        decl('-webkit-box-orient', 'horizontal'),
-        decl('-webkit-line-clamp', 'unset'),
-      ],
-    },
   })
 
   suggest('line-clamp', () => [
@@ -992,19 +903,17 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `aspect-ratio`
    */
+  staticUtility('aspect-auto', [['aspect-ratio', 'auto']])
+  staticUtility('aspect-square', [['aspect-ratio', '1 / 1']])
   functionalUtility('aspect', {
     themeKeys: ['--aspect'],
     handleBareValue: ({ fraction }) => {
       if (fraction === null) return null
       let [lhs, rhs] = segment(fraction, '/')
-      if (!isValidSpacingMultiplier(lhs) || !isValidSpacingMultiplier(rhs)) return null
+      if (!isPositiveInteger(lhs) || !isPositiveInteger(rhs)) return null
       return fraction
     },
     handle: (value) => [decl('aspect-ratio', value)],
-    staticValues: {
-      auto: [decl('aspect-ratio', 'auto')],
-      square: [decl('aspect-ratio', '1 / 1')],
-    },
   })
 
   /**
@@ -1017,6 +926,7 @@ export function createUtilities(theme: Theme) {
    * @css `max-height`
    */
   for (let [key, value] of [
+    ['auto', 'auto'],
     ['full', '100%'],
     ['svw', '100svw'],
     ['lvw', '100lvw'],
@@ -1037,24 +947,12 @@ export function createUtilities(theme: Theme) {
     staticUtility(`h-${key}`, [['height', value]])
     staticUtility(`min-w-${key}`, [['min-width', value]])
     staticUtility(`min-h-${key}`, [['min-height', value]])
-    staticUtility(`max-w-${key}`, [['max-width', value]])
-    staticUtility(`max-h-${key}`, [['max-height', value]])
+    if (key !== 'auto') {
+      staticUtility(`max-w-${key}`, [['max-width', value]])
+      staticUtility(`max-h-${key}`, [['max-height', value]])
+    }
   }
 
-  staticUtility(`size-auto`, [
-    ['--tw-sort', 'size'],
-    ['width', 'auto'],
-    ['height', 'auto'],
-  ])
-  staticUtility(`w-auto`, [['width', 'auto']])
-  staticUtility(`h-auto`, [['height', 'auto']])
-  staticUtility(`min-w-auto`, [['min-width', 'auto']])
-  staticUtility(`min-h-auto`, [['min-height', 'auto']])
-
-  staticUtility(`h-lh`, [['height', '1lh']])
-  staticUtility(`min-h-lh`, [['min-height', '1lh']])
-  staticUtility(`max-h-lh`, [['max-height', '1lh']])
-
   staticUtility(`w-screen`, [['width', '100vw']])
   staticUtility(`min-w-screen`, [['min-width', '100vw']])
   staticUtility(`max-w-screen`, [['max-width', '100vw']])
@@ -1087,82 +985,6 @@ export function createUtilities(theme: Theme) {
     })
   }
 
-  /**
-   * @css `inline-size`
-   * @css `min-inline-size`
-   * @css `max-inline-size`
-   * @css `block-size`
-   * @css `min-block-size`
-   * @css `max-block-size`
-   */
-  for (let [key, value] of [
-    ['full', '100%'],
-    ['min', 'min-content'],
-    ['max', 'max-content'],
-    ['fit', 'fit-content'],
-  ]) {
-    staticUtility(`inline-${key}`, [['inline-size', value]])
-    staticUtility(`block-${key}`, [['block-size', value]])
-    staticUtility(`min-inline-${key}`, [['min-inline-size', value]])
-    staticUtility(`min-block-${key}`, [['min-block-size', value]])
-    staticUtility(`max-inline-${key}`, [['max-inline-size', value]])
-    staticUtility(`max-block-${key}`, [['max-block-size', value]])
-  }
-
-  // inline-size viewport units (like width)
-  for (let [key, value] of [
-    ['svw', '100svw'],
-    ['lvw', '100lvw'],
-    ['dvw', '100dvw'],
-  ]) {
-    staticUtility(`inline-${key}`, [['inline-size', value]])
-    staticUtility(`min-inline-${key}`, [['min-inline-size', value]])
-    staticUtility(`max-inline-${key}`, [['max-inline-size', value]])
-  }
-
-  // block-size viewport units (like height)
-  for (let [key, value] of [
-    ['svh', '100svh'],
-    ['lvh', '100lvh'],
-    ['dvh', '100dvh'],
-  ]) {
-    staticUtility(`block-${key}`, [['block-size', value]])
-    staticUtility(`min-block-${key}`, [['min-block-size', value]])
-    staticUtility(`max-block-${key}`, [['max-block-size', value]])
-  }
-
-  staticUtility(`inline-auto`, [['inline-size', 'auto']])
-  staticUtility(`block-auto`, [['block-size', 'auto']])
-  staticUtility(`min-inline-auto`, [['min-inline-size', 'auto']])
-  staticUtility(`min-block-auto`, [['min-block-size', 'auto']])
-
-  staticUtility(`block-lh`, [['block-size', '1lh']])
-  staticUtility(`min-block-lh`, [['min-block-size', '1lh']])
-  staticUtility(`max-block-lh`, [['max-block-size', '1lh']])
-
-  staticUtility(`inline-screen`, [['inline-size', '100vw']])
-  staticUtility(`min-inline-screen`, [['min-inline-size', '100vw']])
-  staticUtility(`max-inline-screen`, [['max-inline-size', '100vw']])
-  staticUtility(`block-screen`, [['block-size', '100vh']])
-  staticUtility(`min-block-screen`, [['min-block-size', '100vh']])
-  staticUtility(`max-block-screen`, [['max-block-size', '100vh']])
-
-  staticUtility(`max-inline-none`, [['max-inline-size', 'none']])
-  staticUtility(`max-block-none`, [['max-block-size', 'none']])
-
-  for (let [name, namespaces, property] of [
-    ['inline', ['--spacing', '--container'], 'inline-size'],
-    ['min-inline', ['--spacing', '--container'], 'min-inline-size'],
-    ['max-inline', ['--spacing', '--container'], 'max-inline-size'],
-    ['block', ['--spacing'], 'block-size'],
-    ['min-block', ['--spacing'], 'min-block-size'],
-    ['max-block', ['--spacing'], 'max-block-size'],
-  ] as [string, ThemeKey[], string][]) {
-    spacingUtility(name, namespaces, (value) => [decl(property, value)], {
-      supportsFractions: true,
-    })
-  }
-
   utilities.static('container', () => {
     let breakpoints = [...theme.namespace('--breakpoint').values()]
     breakpoints.sort((a, z) => compareBreakpoints(a, z, 'asc'))
@@ -1205,10 +1027,7 @@ export function createUtilities(theme: Theme) {
     }
   })
 
-  suggest('flex', () => [
-    { supportsFractions: true },
-    { values: Array.from({ length: 12 }, (_, i) => `${i + 1}`) },
-  ])
+  suggest('flex', () => [{ supportsFractions: true }])
 
   /**
    * @css `flex-shrink`
@@ -1313,47 +1132,41 @@ export function createUtilities(theme: Theme) {
   /**
    * @css `transform-origin`
    */
+  staticUtility('origin-center', [['transform-origin', 'center']])
+  staticUtility('origin-top', [['transform-origin', 'top']])
+  staticUtility('origin-top-right', [['transform-origin', 'top right']])
+  staticUtility('origin-right', [['transform-origin', 'right']])
+  staticUtility('origin-bottom-right', [['transform-origin', 'bottom right']])
+  staticUtility('origin-bottom', [['transform-origin', 'bottom']])
+  staticUtility('origin-bottom-left', [['transform-origin', 'bottom left']])
+  staticUtility('origin-left', [['transform-origin', 'left']])
+  staticUtility('origin-top-left', [['transform-origin', 'top left']])
   functionalUtility('origin', {
     themeKeys: ['--transform-origin'],
     handle: (value) => [decl('transform-origin', value)],
-    staticValues: {
-      center: [decl('transform-origin', 'center')],
-      top: [decl('transform-origin', 'top')],
-      'top-right': [decl('transform-origin', '100% 0')],
-      right: [decl('transform-origin', '100%')],
-      'bottom-right': [decl('transform-origin', '100% 100%')],
-      bottom: [decl('transform-origin', 'bottom')],
-      'bottom-left': [decl('transform-origin', '0 100%')],
-      left: [decl('transform-origin', '0')],
-      'top-left': [decl('transform-origin', '0 0')],
-    },
   })
 
+  staticUtility('perspective-origin-center', [['perspective-origin', 'center']])
+  staticUtility('perspective-origin-top', [['perspective-origin', 'top']])
+  staticUtility('perspective-origin-top-right', [['perspective-origin', 'top right']])
+  staticUtility('perspective-origin-right', [['perspective-origin', 'right']])
+  staticUtility('perspective-origin-bottom-right', [['perspective-origin', 'bottom right']])
+  staticUtility('perspective-origin-bottom', [['perspective-origin', 'bottom']])
+  staticUtility('perspective-origin-bottom-left', [['perspective-origin', 'bottom left']])
+  staticUtility('perspective-origin-left', [['perspective-origin', 'left']])
+  staticUtility('perspective-origin-top-left', [['perspective-origin', 'top left']])
   functionalUtility('perspective-origin', {
     themeKeys: ['--perspective-origin'],
     handle: (value) => [decl('perspective-origin', value)],
-    staticValues: {
-      center: [decl('perspective-origin', 'center')],
-      top: [decl('perspective-origin', 'top')],
-      'top-right': [decl('perspective-origin', '100% 0')],
-      right: [decl('perspective-origin', '100%')],
-      'bottom-right': [decl('perspective-origin', '100% 100%')],
-      bottom: [decl('perspective-origin', 'bottom')],
-      'bottom-left': [decl('perspective-origin', '0 100%')],
-      left: [decl('perspective-origin', '0')],
-      'top-left': [decl('perspective-origin', '0 0')],
-    },
   })
 
   /**
    * @css `perspective`
    */
+  staticUtility('perspective-none', [['perspective', 'none']])
   functionalUtility('perspective', {
     themeKeys: ['--perspective'],
     handle: (value) => [decl('perspective', value)],
-    staticValues: {
-      none: [decl('perspective', 'none')],
-    },
   })
 
   let translateProperties = () =>
@@ -1454,7 +1267,6 @@ export function createUtilities(theme: Theme) {
       let value
       if (candidate.value.kind === 'arbitrary') {
         value = candidate.value.value
-        value = negative ? `calc(${value} * -1)` : value
         return [decl('scale', value)]
       } else {
         value = theme.resolve(candidate.value.value, ['--scale'])
@@ -1542,7 +1354,7 @@ export function createUtilities(theme: Theme) {
         if (type === 'vector') {
           return [decl('rotate', `${value} var(--tw-rotate)`)]
         } else if (type !== 'angle') {
-          return [decl('rotate', negative ? `calc(${value} * -1)` : value)]
+          return [decl('rotate', value)]
         }
       } else {
         value = theme.resolve(candidate.value.value, ['--rotate'])
@@ -1568,20 +1380,20 @@ export function createUtilities(theme: Theme) {
 
   {
     let transformValue = [
-      'var(--tw-rotate-x, )',
-      'var(--tw-rotate-y, )',
-      'var(--tw-rotate-z, )',
-      'var(--tw-skew-x, )',
-      'var(--tw-skew-y, )',
+      'var(--tw-rotate-x)',
+      'var(--tw-rotate-y)',
+      'var(--tw-rotate-z)',
+      'var(--tw-skew-x)',
+      'var(--tw-skew-y)',
     ].join(' ')
 
     let transformProperties = () =>
       atRoot([
-        property('--tw-rotate-x'),
-        property('--tw-rotate-y'),
-        property('--tw-rotate-z'),
-        property('--tw-skew-x'),
-        property('--tw-skew-y'),
+        property('--tw-rotate-x', 'rotateX(0)'),
+        property('--tw-rotate-y', 'rotateY(0)'),
+        property('--tw-rotate-z', 'rotateZ(0)'),
+        property('--tw-skew-x', 'skewX(0)'),
+        property('--tw-skew-y', 'skewY(0)'),
       ])
 
     for (let axis of ['x', 'y', 'z']) {
@@ -1715,21 +1527,6 @@ export function createUtilities(theme: Theme) {
     staticUtility('transform-none', [['transform', 'none']])
   }
 
-  /**
-   * @css `zoom`
-   */
-  functionalUtility('zoom', {
-    handleBareValue: ({ value }) => {
-      if (!isPositiveInteger(value)) return null
-      return `${value}%`
-    },
-    handle: (value) => [decl('zoom', value)],
-  })
-
-  suggest('zoom', () => [
-    { values: ['50', '75', '90', '95', '100', '105', '110', '125', '150', '200'] },
-  ])
-
   /**
    * @css `transform-style`
    */
@@ -1814,7 +1611,7 @@ export function createUtilities(theme: Theme) {
     staticUtility(`touch-pan-${value}`, [
       touchProperties,
       ['--tw-pan-x', `pan-${value}`],
-      ['touch-action', 'var(--tw-pan-x, ) var(--tw-pan-y, ) var(--tw-pinch-zoom, )'],
+      ['touch-action', 'var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,)'],
     ])
   }
 
@@ -1822,14 +1619,14 @@ export function createUtilities(theme: Theme) {
     staticUtility(`touch-pan-${value}`, [
       touchProperties,
       ['--tw-pan-y', `pan-${value}`],
-      ['touch-action', 'var(--tw-pan-x, ) var(--tw-pan-y, ) var(--tw-pinch-zoom, )'],
+      ['touch-action', 'var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,)'],
     ])
   }
 
   staticUtility('touch-pinch-zoom', [
     touchProperties,
     ['--tw-pinch-zoom', `pinch-zoom`],
-    ['touch-action', 'var(--tw-pan-x, ) var(--tw-pan-y, ) var(--tw-pinch-zoom, )'],
+    ['touch-action', 'var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,)'],
   ])
 
   /**
@@ -1885,8 +1682,6 @@ export function createUtilities(theme: Theme) {
     ['scroll-my', 'scroll-margin-block'],
     ['scroll-ms', 'scroll-margin-inline-start'],
     ['scroll-me', 'scroll-margin-inline-end'],
-    ['scroll-mbs', 'scroll-margin-block-start'],
-    ['scroll-mbe', 'scroll-margin-block-end'],
     ['scroll-mt', 'scroll-margin-top'],
     ['scroll-mr', 'scroll-margin-right'],
     ['scroll-mb', 'scroll-margin-bottom'],
@@ -1911,8 +1706,6 @@ export function createUtilities(theme: Theme) {
     ['scroll-py', 'scroll-padding-block'],
     ['scroll-ps', 'scroll-padding-inline-start'],
     ['scroll-pe', 'scroll-padding-inline-end'],
-    ['scroll-pbs', 'scroll-padding-block-start'],
-    ['scroll-pbe', 'scroll-padding-block-end'],
     ['scroll-pt', 'scroll-padding-top'],
     ['scroll-pr', 'scroll-padding-right'],
     ['scroll-pb', 'scroll-padding-bottom'],
@@ -1924,24 +1717,23 @@ export function createUtilities(theme: Theme) {
   staticUtility('list-inside', [['list-style-position', 'inside']])
   staticUtility('list-outside', [['list-style-position', 'outside']])
 
+  /**
+   * @css `list-style-type`
+   */
+  staticUtility('list-none', [['list-style-type', 'none']])
+  staticUtility('list-disc', [['list-style-type', 'disc']])
+  staticUtility('list-decimal', [['list-style-type', 'decimal']])
   functionalUtility('list', {
     themeKeys: ['--list-style-type'],
     handle: (value) => [decl('list-style-type', value)],
-    staticValues: {
-      none: [decl('list-style-type', 'none')],
-      disc: [decl('list-style-type', 'disc')],
-      decimal: [decl('list-style-type', 'decimal')],
-    },
   })
 
   // list-image-*
 
+  staticUtility('list-image-none', [['list-style-image', 'none']])
   functionalUtility('list-image', {
     themeKeys: ['--list-style-image'],
     handle: (value) => [decl('list-style-image', value)],
-    staticValues: {
-      none: [decl('list-style-image', 'none')],
-    },
   })
 
   staticUtility('appearance-none', [['appearance', 'none']])
@@ -1954,6 +1746,9 @@ export function createUtilities(theme: Theme) {
   staticUtility('scheme-only-dark', [['color-scheme', 'only dark']])
   staticUtility('scheme-only-light', [['color-scheme', 'only light']])
 
+  // columns-*
+  staticUtility('columns-auto', [['columns', 'auto']])
+
   functionalUtility('columns', {
     themeKeys: ['--columns', '--container'],
     handleBareValue: ({ value }) => {
@@ -1961,9 +1756,6 @@ export function createUtilities(theme: Theme) {
       return value
     },
     handle: (value) => [decl('columns', value)],
-    staticValues: {
-      auto: [decl('columns', 'auto')],
-    },
   })
 
   suggest('columns', () => [
@@ -1991,38 +1783,26 @@ export function createUtilities(theme: Theme) {
   staticUtility('grid-flow-row-dense', [['grid-auto-flow', 'row dense']])
   staticUtility('grid-flow-col-dense', [['grid-auto-flow', 'column dense']])
 
+  staticUtility('auto-cols-auto', [['grid-auto-columns', 'auto']])
+  staticUtility('auto-cols-min', [['grid-auto-columns', 'min-content']])
+  staticUtility('auto-cols-max', [['grid-auto-columns', 'max-content']])
+  staticUtility('auto-cols-fr', [['grid-auto-columns', 'minmax(0, 1fr)']])
   functionalUtility('auto-cols', {
     themeKeys: ['--grid-auto-columns'],
-    handleBareValue: ({ value }) => {
-      if (!theme.resolve(null, ['--spacing'])) return null
-      if (!isValidSpacingMultiplier(value)) return null
-      return `--spacing(${value})`
-    },
     handle: (value) => [decl('grid-auto-columns', value)],
-    staticValues: {
-      auto: [decl('grid-auto-columns', 'auto')],
-      min: [decl('grid-auto-columns', 'min-content')],
-      max: [decl('grid-auto-columns', 'max-content')],
-      fr: [decl('grid-auto-columns', 'minmax(0, 1fr)')],
-    },
   })
 
+  staticUtility('auto-rows-auto', [['grid-auto-rows', 'auto']])
+  staticUtility('auto-rows-min', [['grid-auto-rows', 'min-content']])
+  staticUtility('auto-rows-max', [['grid-auto-rows', 'max-content']])
+  staticUtility('auto-rows-fr', [['grid-auto-rows', 'minmax(0, 1fr)']])
   functionalUtility('auto-rows', {
     themeKeys: ['--grid-auto-rows'],
-    handleBareValue: ({ value }) => {
-      if (!theme.resolve(null, ['--spacing'])) return null
-      if (!isValidSpacingMultiplier(value)) return null
-      return `--spacing(${value})`
-    },
     handle: (value) => [decl('grid-auto-rows', value)],
-    staticValues: {
-      auto: [decl('grid-auto-rows', 'auto')],
-      min: [decl('grid-auto-rows', 'min-content')],
-      max: [decl('grid-auto-rows', 'max-content')],
-      fr: [decl('grid-auto-rows', 'minmax(0, 1fr)')],
-    },
   })
 
+  staticUtility('grid-cols-none', [['grid-template-columns', 'none']])
+  staticUtility('grid-cols-subgrid', [['grid-template-columns', 'subgrid']])
   functionalUtility('grid-cols', {
     themeKeys: ['--grid-template-columns'],
     handleBareValue: ({ value }) => {
@@ -2030,12 +1810,10 @@ export function createUtilities(theme: Theme) {
       return `repeat(${value}, minmax(0, 1fr))`
     },
     handle: (value) => [decl('grid-template-columns', value)],
-    staticValues: {
-      none: [decl('grid-template-columns', 'none')],
-      subgrid: [decl('grid-template-columns', 'subgrid')],
-    },
   })
 
+  staticUtility('grid-rows-none', [['grid-template-rows', 'none']])
+  staticUtility('grid-rows-subgrid', [['grid-template-rows', 'subgrid']])
   functionalUtility('grid-rows', {
     themeKeys: ['--grid-template-rows'],
     handleBareValue: ({ value }) => {
@@ -2043,10 +1821,6 @@ export function createUtilities(theme: Theme) {
       return `repeat(${value}, minmax(0, 1fr))`
     },
     handle: (value) => [decl('grid-template-rows', value)],
-    staticValues: {
-      none: [decl('grid-template-rows', 'none')],
-      subgrid: [decl('grid-template-rows', 'subgrid')],
-    },
   })
 
   suggest('grid-cols', () => [
@@ -2075,8 +1849,10 @@ export function createUtilities(theme: Theme) {
   staticUtility('place-content-center', [['place-content', 'center']])
   staticUtility('place-content-start', [['place-content', 'start']])
   staticUtility('place-content-end', [['place-content', 'end']])
-  staticUtility('place-content-center-safe', [['place-content', 'safe center']])
-  staticUtility('place-content-end-safe', [['place-content', 'safe end']])
+  if (enableSafeAlignment) {
+    staticUtility('place-content-center-safe', [['place-content', 'safe center']])
+    staticUtility('place-content-end-safe', [['place-content', 'safe end']])
+  }
   staticUtility('place-content-between', [['place-content', 'space-between']])
   staticUtility('place-content-around', [['place-content', 'space-around']])
   staticUtility('place-content-evenly', [['place-content', 'space-evenly']])
@@ -2086,8 +1862,10 @@ export function createUtilities(theme: Theme) {
   staticUtility('place-items-center', [['place-items', 'center']])
   staticUtility('place-items-start', [['place-items', 'start']])
   staticUtility('place-items-end', [['place-items', 'end']])
-  staticUtility('place-items-center-safe', [['place-items', 'safe center']])
-  staticUtility('place-items-end-safe', [['place-items', 'safe end']])
+  if (enableSafeAlignment) {
+    staticUtility('place-items-center-safe', [['place-items', 'safe center']])
+    staticUtility('place-items-end-safe', [['place-items', 'safe end']])
+  }
   staticUtility('place-items-baseline', [['place-items', 'baseline']])
   staticUtility('place-items-stretch', [['place-items', 'stretch']])
 
@@ -2095,8 +1873,10 @@ export function createUtilities(theme: Theme) {
   staticUtility('content-center', [['align-content', 'center']])
   staticUtility('content-start', [['align-content', 'flex-start']])
   staticUtility('content-end', [['align-content', 'flex-end']])
-  staticUtility('content-center-safe', [['align-content', 'safe center']])
-  staticUtility('content-end-safe', [['align-content', 'safe flex-end']])
+  if (enableSafeAlignment) {
+    staticUtility('content-center-safe', [['align-content', 'safe center']])
+    staticUtility('content-end-safe', [['align-content', 'safe flex-end']])
+  }
   staticUtility('content-between', [['align-content', 'space-between']])
   staticUtility('content-around', [['align-content', 'space-around']])
   staticUtility('content-evenly', [['align-content', 'space-evenly']])
@@ -2106,18 +1886,24 @@ export function createUtilities(theme: Theme) {
   staticUtility('items-center', [['align-items', 'center']])
   staticUtility('items-start', [['align-items', 'flex-start']])
   staticUtility('items-end', [['align-items', 'flex-end']])
-  staticUtility('items-center-safe', [['align-items', 'safe center']])
-  staticUtility('items-end-safe', [['align-items', 'safe flex-end']])
+  if (enableSafeAlignment) {
+    staticUtility('items-center-safe', [['align-items', 'safe center']])
+    staticUtility('items-end-safe', [['align-items', 'safe flex-end']])
+  }
   staticUtility('items-baseline', [['align-items', 'baseline']])
-  staticUtility('items-baseline-last', [['align-items', 'last baseline']])
+  if (enableBaselineLast) {
+    staticUtility('items-baseline-last', [['align-items', 'last baseline']])
+  }
   staticUtility('items-stretch', [['align-items', 'stretch']])
 
   staticUtility('justify-normal', [['justify-content', 'normal']])
   staticUtility('justify-center', [['justify-content', 'center']])
   staticUtility('justify-start', [['justify-content', 'flex-start']])
   staticUtility('justify-end', [['justify-content', 'flex-end']])
-  staticUtility('justify-center-safe', [['justify-content', 'safe center']])
-  staticUtility('justify-end-safe', [['justify-content', 'safe flex-end']])
+  if (enableSafeAlignment) {
+    staticUtility('justify-center-safe', [['justify-content', 'safe center']])
+    staticUtility('justify-end-safe', [['justify-content', 'safe flex-end']])
+  }
   staticUtility('justify-between', [['justify-content', 'space-between']])
   staticUtility('justify-around', [['justify-content', 'space-around']])
   staticUtility('justify-evenly', [['justify-content', 'space-evenly']])
@@ -2128,8 +1914,10 @@ export function createUtilities(theme: Theme) {
   staticUtility('justify-items-center', [['justify-items', 'center']])
   staticUtility('justify-items-start', [['justify-items', 'start']])
   staticUtility('justify-items-end', [['justify-items', 'end']])
-  staticUtility('justify-items-center-safe', [['justify-items', 'safe center']])
-  staticUtility('justify-items-end-safe', [['justify-items', 'safe end']])
+  if (enableSafeAlignment) {
+    staticUtility('justify-items-center-safe', [['justify-items', 'safe center']])
+    staticUtility('justify-items-end-safe', [['justify-items', 'safe end']])
+  }
   staticUtility('justify-items-stretch', [['justify-items', 'stretch']])
 
   spacingUtility('gap', ['--gap', '--spacing'], (value) => [decl('gap', value)])
@@ -2139,65 +1927,31 @@ export function createUtilities(theme: Theme) {
   spacingUtility(
     'space-x',
     ['--space', '--spacing'],
-    (value) => {
-      let zero = (() => {
-        if (value === '--spacing(0)') return true
-        if (value === '--spacing(-0)') return true
+    (value) => [
+      atRoot([property('--tw-space-x-reverse', '0')]),
 
-        let parsed = dimensions.get(value)
-        if (parsed && parsed[0] === 0 && (parsed[1] === null || isLength(value))) {
-          return true
-        }
-
-        return false
-      })()
-
-      return [
-        atRoot([property('--tw-space-x-reverse', '0')]),
-
-        styleRule(':where(& > :not(:last-child))', [
-          decl('--tw-sort', 'row-gap'),
-          decl('--tw-space-x-reverse', '0'),
-          decl('margin-inline-start', zero ? '0' : `calc(${value} * var(--tw-space-x-reverse))`),
-          decl(
-            'margin-inline-end',
-            zero ? '0' : `calc(${value} * calc(1 - var(--tw-space-x-reverse)))`,
-          ),
-        ]),
-      ]
-    },
+      styleRule(':where(& > :not(:last-child))', [
+        decl('--tw-sort', 'row-gap'),
+        decl('--tw-space-x-reverse', '0'),
+        decl('margin-inline-start', `calc(${value} * var(--tw-space-x-reverse))`),
+        decl('margin-inline-end', `calc(${value} * calc(1 - var(--tw-space-x-reverse)))`),
+      ]),
+    ],
     { supportsNegative: true },
   )
 
   spacingUtility(
     'space-y',
     ['--space', '--spacing'],
-    (value) => {
-      let zero = (() => {
-        if (value === '--spacing(0)') return true
-        if (value === '--spacing(-0)') return true
-
-        let parsed = dimensions.get(value)
-        if (parsed && parsed[0] === 0 && (parsed[1] === null || isLength(value))) {
-          return true
-        }
-
-        return false
-      })()
-
-      return [
-        atRoot([property('--tw-space-y-reverse', '0')]),
-        styleRule(':where(& > :not(:last-child))', [
-          decl('--tw-sort', 'column-gap'),
-          decl('--tw-space-y-reverse', '0'),
-          decl('margin-block-start', zero ? '0' : `calc(${value} * var(--tw-space-y-reverse))`),
-          decl(
-            'margin-block-end',
-            zero ? '0' : `calc(${value} * calc(1 - var(--tw-space-y-reverse)))`,
-          ),
-        ]),
-      ]
-    },
+    (value) => [
+      atRoot([property('--tw-space-y-reverse', '0')]),
+      styleRule(':where(& > :not(:last-child))', [
+        decl('--tw-sort', 'column-gap'),
+        decl('--tw-space-y-reverse', '0'),
+        decl('margin-block-start', `calc(${value} * var(--tw-space-y-reverse))`),
+        decl('margin-block-end', `calc(${value} * calc(1 - var(--tw-space-y-reverse)))`),
+      ]),
+    ],
     { supportsNegative: true },
   )
 
@@ -2231,7 +1985,7 @@ export function createUtilities(theme: Theme) {
   })
 
   colorUtility('divide', {
-    themeKeys: ['--divide-color', '--border-color', '--color'],
+    themeKeys: ['--divide-color', '--color'],
     handle: (value) => [
       styleRule(':where(& > :not(:last-child))', [
         decl('--tw-sort', 'divide-color'),
@@ -2244,26 +1998,31 @@ export function createUtilities(theme: Theme) {
   staticUtility('place-self-start', [['place-self', 'start']])
   staticUtility('place-self-end', [['place-self', 'end']])
   staticUtility('place-self-center', [['place-self', 'center']])
-  staticUtility('place-self-end-safe', [['place-self', 'safe end']])
-  staticUtility('place-self-center-safe', [['place-self', 'safe center']])
+  if (enableSafeAlignment) {
+    staticUtility('place-self-end-safe', [['place-self', 'safe end']])
+    staticUtility('place-self-center-safe', [['place-self', 'safe center']])
+  }
   staticUtility('place-self-stretch', [['place-self', 'stretch']])
 
   staticUtility('self-auto', [['align-self', 'auto']])
   staticUtility('self-start', [['align-self', 'flex-start']])
   staticUtility('self-end', [['align-self', 'flex-end']])
   staticUtility('self-center', [['align-self', 'center']])
-  staticUtility('self-end-safe', [['align-self', 'safe flex-end']])
-  staticUtility('self-center-safe', [['align-self', 'safe center']])
+  if (enableSafeAlignment) {
+    staticUtility('self-end-safe', [['align-self', 'safe flex-end']])
+    staticUtility('self-center-safe', [['align-self', 'safe center']])
+  }
   staticUtility('self-stretch', [['align-self', 'stretch']])
   staticUtility('self-baseline', [['align-self', 'baseline']])
-  staticUtility('self-baseline-last', [['align-self', 'last baseline']])
 
   staticUtility('justify-self-auto', [['justify-self', 'auto']])
   staticUtility('justify-self-start', [['justify-self', 'flex-start']])
   staticUtility('justify-self-end', [['justify-self', 'flex-end']])
   staticUtility('justify-self-center', [['justify-self', 'center']])
-  staticUtility('justify-self-end-safe', [['justify-self', 'safe flex-end']])
-  staticUtility('justify-self-center-safe', [['justify-self', 'safe center']])
+  if (enableSafeAlignment) {
+    staticUtility('justify-self-end-safe', [['justify-self', 'safe flex-end']])
+    staticUtility('justify-self-center-safe', [['justify-self', 'safe center']])
+  }
   staticUtility('justify-self-stretch', [['justify-self', 'stretch']])
 
   for (let value of ['auto', 'hidden', 'clip', 'visible', 'scroll']) {
@@ -2281,41 +2040,6 @@ export function createUtilities(theme: Theme) {
   staticUtility('scroll-auto', [['scroll-behavior', 'auto']])
   staticUtility('scroll-smooth', [['scroll-behavior', 'smooth']])
 
-  staticUtility('scrollbar-auto', [['scrollbar-width', 'auto']])
-  staticUtility('scrollbar-thin', [['scrollbar-width', 'thin']])
-  staticUtility('scrollbar-none', [['scrollbar-width', 'none']])
-
-  {
-    let scrollbarColorProperties = () => {
-      return atRoot([
-        property('--tw-scrollbar-thumb', '#0000', '<color>'),
-        property('--tw-scrollbar-track', '#0000', '<color>'),
-      ])
-    }
-
-    colorUtility('scrollbar-thumb', {
-      themeKeys: ['--color'],
-      handle: (value) => [
-        scrollbarColorProperties(),
-        decl('--tw-scrollbar-thumb', value),
-        decl('scrollbar-color', 'var(--tw-scrollbar-thumb) var(--tw-scrollbar-track)'),
-      ],
-    })
-
-    colorUtility('scrollbar-track', {
-      themeKeys: ['--color'],
-      handle: (value) => [
-        scrollbarColorProperties(),
-        decl('--tw-scrollbar-track', value),
-        decl('scrollbar-color', 'var(--tw-scrollbar-thumb) var(--tw-scrollbar-track)'),
-      ],
-    })
-  }
-
-  staticUtility('scrollbar-gutter-auto', [['scrollbar-gutter', 'auto']])
-  staticUtility('scrollbar-gutter-stable', [['scrollbar-gutter', 'stable']])
-  staticUtility('scrollbar-gutter-both', [['scrollbar-gutter', 'stable both-edges']])
-
   staticUtility('truncate', [
     ['overflow', 'hidden'],
     ['text-overflow', 'ellipsis'],
@@ -2345,16 +2069,6 @@ export function createUtilities(theme: Theme) {
   staticUtility('whitespace-pre-wrap', [['white-space', 'pre-wrap']])
   staticUtility('whitespace-break-spaces', [['white-space', 'break-spaces']])
 
-  functionalUtility('tab', {
-    handleBareValue: ({ value }) => {
-      if (!isPositiveInteger(value)) return null
-      return value
-    },
-    handle: (value) => [decl('tab-size', value)],
-  })
-
-  suggest('tab', () => [{ values: ['2', '4', '8'] }])
-
   staticUtility('text-wrap', [['text-wrap', 'wrap']])
   staticUtility('text-nowrap', [['text-wrap', 'nowrap']])
   staticUtility('text-balance', [['text-wrap', 'balance']])
@@ -2363,12 +2077,15 @@ export function createUtilities(theme: Theme) {
     ['overflow-wrap', 'normal'],
     ['word-break', 'normal'],
   ])
+  staticUtility('break-words', [['overflow-wrap', 'break-word']])
   staticUtility('break-all', [['word-break', 'break-all']])
   staticUtility('break-keep', [['word-break', 'keep-all']])
 
-  staticUtility('wrap-anywhere', [['overflow-wrap', 'anywhere']])
-  staticUtility('wrap-break-word', [['overflow-wrap', 'break-word']])
-  staticUtility('wrap-normal', [['overflow-wrap', 'normal']])
+  if (enableWrapAnywhere) {
+    staticUtility('wrap-anywhere', [['overflow-wrap', 'anywhere']])
+    staticUtility('wrap-break-word', [['overflow-wrap', 'break-word']])
+    staticUtility('wrap-normal', [['overflow-wrap', 'normal']])
+  }
 
   {
     // border-radius
@@ -2389,13 +2106,17 @@ export function createUtilities(theme: Theme) {
       ['rounded-br', ['border-bottom-right-radius']],
       ['rounded-bl', ['border-bottom-left-radius']],
     ] as const) {
+      staticUtility(
+        `${root}-none`,
+        properties.map((property) => [property, '0']),
+      )
+      staticUtility(
+        `${root}-full`,
+        properties.map((property) => [property, 'calc(infinity * 1px)']),
+      )
       functionalUtility(root, {
         themeKeys: ['--radius'],
         handle: (value) => properties.map((property) => decl(property, value)),
-        staticValues: {
-          none: properties.map((property) => decl(property, '0')),
-          full: properties.map((property) => decl(property, 'calc(infinity * 1px)')),
-        },
       })
     }
   }
@@ -2498,7 +2219,6 @@ export function createUtilities(theme: Theme) {
         {
           values: ['current', 'inherit', 'transparent'],
           valueThemeKeys: ['--border-color', '--color'],
-          modifierThemeKeys: ['--opacity'],
           modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
           hasDefaultValue: true,
         },
@@ -2549,22 +2269,6 @@ export function createUtilities(theme: Theme) {
       color: (value) => [decl('border-inline-end-color', value)],
     })
 
-    borderSideUtility('border-bs', {
-      width: (value) => [
-        decl('border-block-start-style', 'var(--tw-border-style)'),
-        decl('border-block-start-width', value),
-      ],
-      color: (value) => [decl('border-block-start-color', value)],
-    })
-
-    borderSideUtility('border-be', {
-      width: (value) => [
-        decl('border-block-end-style', 'var(--tw-border-style)'),
-        decl('border-block-end-width', value),
-      ],
-      color: (value) => [decl('border-block-end-color', value)],
-    })
-
     borderSideUtility('border-t', {
       width: (value) => [
         decl('border-top-style', 'var(--tw-border-style)'),
@@ -2681,32 +2385,20 @@ export function createUtilities(theme: Theme) {
   staticUtility('bg-auto', [['background-size', 'auto']])
   staticUtility('bg-cover', [['background-size', 'cover']])
   staticUtility('bg-contain', [['background-size', 'contain']])
-  functionalUtility('bg-size', {
-    handle(value) {
-      if (!value) return
-      return [decl('background-size', value)]
-    },
-  })
 
   staticUtility('bg-fixed', [['background-attachment', 'fixed']])
   staticUtility('bg-local', [['background-attachment', 'local']])
   staticUtility('bg-scroll', [['background-attachment', 'scroll']])
 
-  staticUtility('bg-top', [['background-position', 'top']])
-  staticUtility('bg-top-left', [['background-position', 'left top']])
-  staticUtility('bg-top-right', [['background-position', 'right top']])
-  staticUtility('bg-bottom', [['background-position', 'bottom']])
-  staticUtility('bg-bottom-left', [['background-position', 'left bottom']])
-  staticUtility('bg-bottom-right', [['background-position', 'right bottom']])
-  staticUtility('bg-left', [['background-position', 'left']])
-  staticUtility('bg-right', [['background-position', 'right']])
   staticUtility('bg-center', [['background-position', 'center']])
-  functionalUtility('bg-position', {
-    handle(value) {
-      if (!value) return
-      return [decl('background-position', value)]
-    },
-  })
+  staticUtility('bg-top', [['background-position', 'top']])
+  staticUtility('bg-right-top', [['background-position', 'right top']])
+  staticUtility('bg-right', [['background-position', 'right']])
+  staticUtility('bg-right-bottom', [['background-position', 'right bottom']])
+  staticUtility('bg-bottom', [['background-position', 'bottom']])
+  staticUtility('bg-left-bottom', [['background-position', 'left bottom']])
+  staticUtility('bg-left', [['background-position', 'left']])
+  staticUtility('bg-left-top', [['background-position', 'left top']])
 
   staticUtility('bg-repeat', [['background-repeat', 'repeat']])
   staticUtility('bg-no-repeat', [['background-repeat', 'no-repeat']])
@@ -2804,10 +2496,7 @@ export function createUtilities(theme: Theme) {
         let interpolationMethod = resolveInterpolationModifier(candidate.modifier)
 
         return [
-          decl('--tw-gradient-position', `${value}`),
-          rule('@supports (background-image: linear-gradient(in lab, red, red))', [
-            decl('--tw-gradient-position', `${value} ${interpolationMethod}`),
-          ]),
+          decl('--tw-gradient-position', `${value} ${interpolationMethod}`),
           decl('background-image', `linear-gradient(var(--tw-gradient-stops))`),
         ]
       }
@@ -2969,7 +2658,6 @@ export function createUtilities(theme: Theme) {
     {
       values: ['current', 'inherit', 'transparent'],
       valueThemeKeys: ['--background-color', '--color'],
-      modifierThemeKeys: ['--opacity'],
       modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
     },
     {
@@ -3049,7 +2737,6 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: ['--background-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
       },
       {
@@ -3098,695 +2785,6 @@ export function createUtilities(theme: Theme) {
     position: (value) => [gradientStopProperties(), decl('--tw-gradient-to-position', value)],
   })
 
-  /**
-   * @css `mask-image`
-   */
-
-  staticUtility('mask-none', [['mask-image', 'none']])
-
-  utilities.functional('mask', (candidate) => {
-    if (!candidate.value) return
-    if (candidate.modifier) return
-    if (candidate.value.kind !== 'arbitrary') return
-
-    // Arbitrary values
-    let value: string | null = candidate.value.value
-    let type =
-      candidate.value.dataType ??
-      inferDataType(value, ['image', 'percentage', 'position', 'bg-size', 'length', 'url'])
-
-    switch (type) {
-      case 'percentage':
-      case 'position': {
-        if (candidate.modifier) return
-        return [decl('mask-position', value)]
-      }
-      case 'bg-size':
-      case 'length':
-      case 'size': {
-        return [decl('mask-size', value)]
-      }
-      case 'image':
-      case 'url':
-      default: {
-        return [decl('mask-image', value)]
-      }
-    }
-  })
-
-  /**
-   * @css `mask-composite`
-   */
-
-  staticUtility('mask-add', [['mask-composite', 'add']])
-  staticUtility('mask-subtract', [['mask-composite', 'subtract']])
-  staticUtility('mask-intersect', [['mask-composite', 'intersect']])
-  staticUtility('mask-exclude', [['mask-composite', 'exclude']])
-
-  /**
-   * @css `mask-mode`
-   *
-   * Sets the "mode" of the mask given by mask-image
-   */
-
-  staticUtility('mask-alpha', [['mask-mode', 'alpha']])
-  staticUtility('mask-luminance', [['mask-mode', 'luminance']])
-  staticUtility('mask-match', [['mask-mode', 'match-source']])
-
-  /**
-   * @css `mask-type`
-   *
-   * Sets the "mode" of the current `<mask>` element
-   * Is overridden by `mask-mode` if used
-   */
-  staticUtility('mask-type-alpha', [['mask-type', 'alpha']])
-  staticUtility('mask-type-luminance', [['mask-type', 'luminance']])
-
-  /**
-   * @css `mask-size`
-   */
-
-  staticUtility('mask-auto', [['mask-size', 'auto']])
-  staticUtility('mask-cover', [['mask-size', 'cover']])
-  staticUtility('mask-contain', [['mask-size', 'contain']])
-  functionalUtility('mask-size', {
-    handle(value) {
-      if (!value) return
-      return [decl('mask-size', value)]
-    },
-  })
-
-  /**
-   * @css `mask-position`
-   */
-
-  staticUtility('mask-top', [['mask-position', 'top']])
-  staticUtility('mask-top-left', [['mask-position', 'left top']])
-  staticUtility('mask-top-right', [['mask-position', 'right top']])
-  staticUtility('mask-bottom', [['mask-position', 'bottom']])
-  staticUtility('mask-bottom-left', [['mask-position', 'left bottom']])
-  staticUtility('mask-bottom-right', [['mask-position', 'right bottom']])
-  staticUtility('mask-left', [['mask-position', 'left']])
-  staticUtility('mask-right', [['mask-position', 'right']])
-  staticUtility('mask-center', [['mask-position', 'center']])
-  functionalUtility('mask-position', {
-    handle(value) {
-      if (!value) return
-      return [decl('mask-position', value)]
-    },
-  })
-
-  /**
-   * @css `mask-repeat`
-   */
-
-  staticUtility('mask-repeat', [['mask-repeat', 'repeat']])
-  staticUtility('mask-no-repeat', [['mask-repeat', 'no-repeat']])
-  staticUtility('mask-repeat-x', [['mask-repeat', 'repeat-x']])
-  staticUtility('mask-repeat-y', [['mask-repeat', 'repeat-y']])
-  staticUtility('mask-repeat-round', [['mask-repeat', 'round']])
-  staticUtility('mask-repeat-space', [['mask-repeat', 'space']])
-
-  /**
-   * @css `mask-clip`
-   */
-
-  staticUtility('mask-clip-border', [['mask-clip', 'border-box']])
-  staticUtility('mask-clip-padding', [['mask-clip', 'padding-box']])
-  staticUtility('mask-clip-content', [['mask-clip', 'content-box']])
-  staticUtility('mask-clip-fill', [['mask-clip', 'fill-box']])
-  staticUtility('mask-clip-stroke', [['mask-clip', 'stroke-box']])
-  staticUtility('mask-clip-view', [['mask-clip', 'view-box']])
-  staticUtility('mask-no-clip', [['mask-clip', 'no-clip']])
-
-  /**
-   * @css `mask-origin`
-   */
-
-  staticUtility('mask-origin-border', [['mask-origin', 'border-box']])
-  staticUtility('mask-origin-padding', [['mask-origin', 'padding-box']])
-  staticUtility('mask-origin-content', [['mask-origin', 'content-box']])
-  staticUtility('mask-origin-fill', [['mask-origin', 'fill-box']])
-  staticUtility('mask-origin-stroke', [['mask-origin', 'stroke-box']])
-  staticUtility('mask-origin-view', [['mask-origin', 'view-box']])
-
-  /**
-   * @css `mask-image` gradients
-   */
-
-  let maskPropertiesGradient = () =>
-    atRoot([
-      property('--tw-mask-linear', 'linear-gradient(#fff, #fff)'),
-      property('--tw-mask-radial', 'linear-gradient(#fff, #fff)'),
-      property('--tw-mask-conic', 'linear-gradient(#fff, #fff)'),
-    ])
-
-  type MaskStopDescription = {
-    color: (value: string) => AstNode[] | undefined
-    position: (value: string) => AstNode[] | undefined
-  }
-
-  function maskStopUtility(classRoot: string, desc: MaskStopDescription) {
-    utilities.functional(classRoot, (candidate) => {
-      if (!candidate.value) return
-
-      // Arbitrary values
-      if (candidate.value.kind === 'arbitrary') {
-        let value: string | null = candidate.value.value
-        let type =
-          candidate.value.dataType ?? inferDataType(value, ['length', 'percentage', 'color'])
-
-        switch (type) {
-          case 'color': {
-            value = asColor(value, candidate.modifier, theme)
-            if (value === null) return
-
-            return desc.color(value)
-          }
-          case 'percentage': {
-            if (candidate.modifier) return
-            if (!isPositiveInteger(value.slice(0, -1))) return
-
-            return desc.position(value)
-          }
-          default: {
-            if (candidate.modifier) return
-
-            return desc.position(value)
-          }
-        }
-      }
-
-      // Known values: Color Stops
-      {
-        let value = resolveThemeColor(candidate, theme, ['--background-color', '--color'])
-        if (value) {
-          return desc.color(value)
-        }
-      }
-
-      // Known values: Positions
-      {
-        if (candidate.modifier) return
-
-        let type = inferDataType(candidate.value.value, ['number', 'percentage'])
-        if (!type) return
-
-        switch (type) {
-          case 'number': {
-            let multiplier = theme.resolve(null, ['--spacing'])
-            if (!multiplier) return
-            if (!isValidSpacingMultiplier(candidate.value.value)) return
-
-            return desc.position(`--spacing(${candidate.value.value})`)
-          }
-
-          case 'percentage': {
-            if (!isPositiveInteger(candidate.value.value.slice(0, -1))) return
-            return desc.position(candidate.value.value)
-          }
-
-          default: {
-            return
-          }
-        }
-      }
-    })
-
-    suggest(classRoot, () => [
-      {
-        values: ['current', 'inherit', 'transparent'],
-        valueThemeKeys: ['--background-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
-        modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-      },
-      {
-        values: Array.from({ length: 21 }, (_, index) => `${index * 5}%`),
-        valueThemeKeys: ['--gradient-color-stop-positions'],
-      },
-    ])
-
-    suggest(classRoot, () => [
-      // Percentages
-      {
-        values: Array.from({ length: 21 }, (_, index) => `${index * 5}%`),
-      },
-
-      // Spacing Scale
-      {
-        values: theme.get(['--spacing']) ? DEFAULT_SPACING_SUGGESTIONS : [],
-      },
-
-      // Colors
-      {
-        values: ['current', 'inherit', 'transparent'],
-        valueThemeKeys: ['--background-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
-        modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-      },
-    ])
-  }
-
-  /**
-   * Edge masks
-   */
-
-  let maskPropertiesEdge = () =>
-    atRoot([
-      property('--tw-mask-left', 'linear-gradient(#fff, #fff)'),
-      property('--tw-mask-right', 'linear-gradient(#fff, #fff)'),
-      property('--tw-mask-bottom', 'linear-gradient(#fff, #fff)'),
-      property('--tw-mask-top', 'linear-gradient(#fff, #fff)'),
-    ])
-
-  type MaskEdge = 'top' | 'right' | 'bottom' | 'left'
-  type MaskStop = 'from' | 'to'
-
-  function maskEdgeUtility(name: string, stop: MaskStop, edges: Record<MaskEdge, boolean>) {
-    maskStopUtility(name, {
-      color(value) {
-        let nodes: AstNode[] = [
-          // Common @property declarations
-          maskPropertiesGradient(),
-          maskPropertiesEdge(),
-
-          // Common properties to all edge utilities
-          decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-          decl('mask-composite', 'intersect'),
-          decl(
-            '--tw-mask-linear',
-            'var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top)',
-          ),
-        ]
-
-        for (let edge of ['top', 'right', 'bottom', 'left'] as const) {
-          if (!edges[edge]) continue
-
-          nodes.push(
-            decl(
-              `--tw-mask-${edge}`,
-              `linear-gradient(to ${edge}, var(--tw-mask-${edge}-from-color) var(--tw-mask-${edge}-from-position), var(--tw-mask-${edge}-to-color) var(--tw-mask-${edge}-to-position))`,
-            ),
-          )
-
-          nodes.push(
-            atRoot([
-              property(`--tw-mask-${edge}-from-position`, '0%'),
-              property(`--tw-mask-${edge}-to-position`, '100%'),
-              property(`--tw-mask-${edge}-from-color`, 'black'),
-              property(`--tw-mask-${edge}-to-color`, 'transparent'),
-            ]),
-          )
-
-          nodes.push(decl(`--tw-mask-${edge}-${stop}-color`, value))
-        }
-
-        return nodes
-      },
-      position(value) {
-        let nodes: AstNode[] = [
-          // Common @property declarations
-          maskPropertiesGradient(),
-          maskPropertiesEdge(),
-
-          // Common properties to all edge utilities
-          decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-          decl('mask-composite', 'intersect'),
-          decl(
-            '--tw-mask-linear',
-            'var(--tw-mask-left), var(--tw-mask-right), var(--tw-mask-bottom), var(--tw-mask-top)',
-          ),
-        ]
-
-        for (let edge of ['top', 'right', 'bottom', 'left'] as const) {
-          if (!edges[edge]) continue
-
-          nodes.push(
-            decl(
-              `--tw-mask-${edge}`,
-              `linear-gradient(to ${edge}, var(--tw-mask-${edge}-from-color) var(--tw-mask-${edge}-from-position), var(--tw-mask-${edge}-to-color) var(--tw-mask-${edge}-to-position))`,
-            ),
-          )
-
-          nodes.push(
-            atRoot([
-              property(`--tw-mask-${edge}-from-position`, '0%'),
-              property(`--tw-mask-${edge}-to-position`, '100%'),
-              property(`--tw-mask-${edge}-from-color`, 'black'),
-              property(`--tw-mask-${edge}-to-color`, 'transparent'),
-            ]),
-          )
-
-          nodes.push(decl(`--tw-mask-${edge}-${stop}-position`, value))
-        }
-
-        return nodes
-      },
-    })
-  }
-
-  maskEdgeUtility('mask-x-from', 'from', { top: false, right: true, bottom: false, left: true })
-  maskEdgeUtility('mask-x-to', 'to', { top: false, right: true, bottom: false, left: true })
-  maskEdgeUtility('mask-y-from', 'from', { top: true, right: false, bottom: true, left: false })
-  maskEdgeUtility('mask-y-to', 'to', { top: true, right: false, bottom: true, left: false })
-  maskEdgeUtility('mask-t-from', 'from', { top: true, right: false, bottom: false, left: false })
-  maskEdgeUtility('mask-t-to', 'to', { top: true, right: false, bottom: false, left: false })
-  maskEdgeUtility('mask-r-from', 'from', { top: false, right: true, bottom: false, left: false })
-  maskEdgeUtility('mask-r-to', 'to', { top: false, right: true, bottom: false, left: false })
-  maskEdgeUtility('mask-b-from', 'from', { top: false, right: false, bottom: true, left: false })
-  maskEdgeUtility('mask-b-to', 'to', { top: false, right: false, bottom: true, left: false })
-  maskEdgeUtility('mask-l-from', 'from', { top: false, right: false, bottom: false, left: true })
-  maskEdgeUtility('mask-l-to', 'to', { top: false, right: false, bottom: false, left: true })
-
-  /**
-   *  Linear Masks
-   */
-
-  let maskPropertiesLinear = () =>
-    atRoot([
-      property('--tw-mask-linear-position', '0deg'),
-      property('--tw-mask-linear-from-position', '0%'),
-      property('--tw-mask-linear-to-position', '100%'),
-      property('--tw-mask-linear-from-color', 'black'),
-      property('--tw-mask-linear-to-color', 'transparent'),
-    ])
-
-  functionalUtility('mask-linear', {
-    defaultValue: null,
-    supportsNegative: true,
-    supportsFractions: false,
-    handleBareValue({ value }) {
-      if (!isPositiveInteger(value)) return null
-      let valueAsNumber = Number(value)
-      if (valueAsNumber === 0) return '0deg'
-      if (valueAsNumber === 1) return '1deg'
-      return `calc(1deg * ${value})`
-    },
-    handleNegativeBareValue({ value }) {
-      if (!isPositiveInteger(value)) return null
-      let valueAsNumber = Number(value)
-      if (valueAsNumber === 0) return '0deg'
-      if (valueAsNumber === 1) return '-1deg'
-      return `calc(1deg * -${value})`
-    },
-    handle: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesLinear(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-linear',
-        `linear-gradient(var(--tw-mask-linear-stops, var(--tw-mask-linear-position)))`,
-      ),
-      decl('--tw-mask-linear-position', value),
-    ],
-  })
-
-  suggest('mask-linear', () => [
-    {
-      supportsNegative: true,
-      values: ['0', '1', '2', '3', '6', '12', '45', '90', '180'],
-    },
-  ])
-
-  maskStopUtility('mask-linear-from', {
-    color: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesLinear(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-linear-stops',
-        'var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position)',
-      ),
-      decl('--tw-mask-linear', 'linear-gradient(var(--tw-mask-linear-stops))'),
-      decl('--tw-mask-linear-from-color', value),
-    ],
-    position: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesLinear(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-linear-stops',
-        'var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position)',
-      ),
-      decl('--tw-mask-linear', 'linear-gradient(var(--tw-mask-linear-stops))'),
-      decl('--tw-mask-linear-from-position', value),
-    ],
-  })
-
-  maskStopUtility('mask-linear-to', {
-    color: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesLinear(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-linear-stops',
-        'var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position)',
-      ),
-      decl('--tw-mask-linear', 'linear-gradient(var(--tw-mask-linear-stops))'),
-      decl('--tw-mask-linear-to-color', value),
-    ],
-    position: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesLinear(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-linear-stops',
-        'var(--tw-mask-linear-position), var(--tw-mask-linear-from-color) var(--tw-mask-linear-from-position), var(--tw-mask-linear-to-color) var(--tw-mask-linear-to-position)',
-      ),
-      decl('--tw-mask-linear', 'linear-gradient(var(--tw-mask-linear-stops))'),
-      decl('--tw-mask-linear-to-position', value),
-    ],
-  })
-
-  /**
-   * Radial masks
-   */
-
-  let maskPropertiesRadial = () =>
-    atRoot([
-      property('--tw-mask-radial-from-position', '0%'),
-      property('--tw-mask-radial-to-position', '100%'),
-      property('--tw-mask-radial-from-color', 'black'),
-      property('--tw-mask-radial-to-color', 'transparent'),
-      property('--tw-mask-radial-shape', 'ellipse'),
-      property('--tw-mask-radial-size', 'farthest-corner'),
-      property('--tw-mask-radial-position', 'center'),
-    ])
-
-  staticUtility('mask-circle', [['--tw-mask-radial-shape', 'circle']])
-  staticUtility('mask-ellipse', [['--tw-mask-radial-shape', 'ellipse']])
-  staticUtility('mask-radial-closest-side', [['--tw-mask-radial-size', 'closest-side']])
-  staticUtility('mask-radial-farthest-side', [['--tw-mask-radial-size', 'farthest-side']])
-  staticUtility('mask-radial-closest-corner', [['--tw-mask-radial-size', 'closest-corner']])
-  staticUtility('mask-radial-farthest-corner', [['--tw-mask-radial-size', 'farthest-corner']])
-  staticUtility('mask-radial-at-top', [['--tw-mask-radial-position', 'top']])
-  staticUtility('mask-radial-at-top-left', [['--tw-mask-radial-position', 'top left']])
-  staticUtility('mask-radial-at-top-right', [['--tw-mask-radial-position', 'top right']])
-  staticUtility('mask-radial-at-bottom', [['--tw-mask-radial-position', 'bottom']])
-  staticUtility('mask-radial-at-bottom-left', [['--tw-mask-radial-position', 'bottom left']])
-  staticUtility('mask-radial-at-bottom-right', [['--tw-mask-radial-position', 'bottom right']])
-  staticUtility('mask-radial-at-left', [['--tw-mask-radial-position', 'left']])
-  staticUtility('mask-radial-at-right', [['--tw-mask-radial-position', 'right']])
-  staticUtility('mask-radial-at-center', [['--tw-mask-radial-position', 'center']])
-  functionalUtility('mask-radial-at', {
-    defaultValue: null,
-    supportsNegative: false,
-    supportsFractions: false,
-    handle: (value) => [decl('--tw-mask-radial-position', value)],
-  })
-
-  /*
-      This can be used to set just the size in conjunction with `mask-radial-from-*` et al,
-      or can set the whole gradient if it's the only utility you use.
-
-      For example:
-      `mask-radial-[40px_80px] mask-radial-from-50%`
-      `mask-radial-[96px_at_top,black_40%,transparent_80%,black_90%]`
-
-      This will produce nonsense though and break, which is fine:
-      `mask-radial-[96px_at_top,black_40%,transparent_80%,black_90%]  mask-radial-from-50%`
-    */
-  functionalUtility('mask-radial', {
-    defaultValue: null,
-    supportsNegative: false,
-    supportsFractions: false,
-    handle: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesRadial(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-radial',
-        'radial-gradient(var(--tw-mask-radial-stops, var(--tw-mask-radial-size)))',
-      ),
-      decl('--tw-mask-radial-size', value),
-    ],
-  })
-
-  maskStopUtility('mask-radial-from', {
-    color: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesRadial(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-radial-stops',
-        'var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position)',
-      ),
-      decl('--tw-mask-radial', 'radial-gradient(var(--tw-mask-radial-stops))'),
-      decl('--tw-mask-radial-from-color', value),
-    ],
-    position: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesRadial(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-radial-stops',
-        'var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position)',
-      ),
-      decl('--tw-mask-radial', 'radial-gradient(var(--tw-mask-radial-stops))'),
-      decl('--tw-mask-radial-from-position', value),
-    ],
-  })
-
-  maskStopUtility('mask-radial-to', {
-    color: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesRadial(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-radial-stops',
-        'var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position)',
-      ),
-      decl('--tw-mask-radial', 'radial-gradient(var(--tw-mask-radial-stops))'),
-      decl('--tw-mask-radial-to-color', value),
-    ],
-    position: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesRadial(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-radial-stops',
-        'var(--tw-mask-radial-shape) var(--tw-mask-radial-size) at var(--tw-mask-radial-position), var(--tw-mask-radial-from-color) var(--tw-mask-radial-from-position), var(--tw-mask-radial-to-color) var(--tw-mask-radial-to-position)',
-      ),
-      decl('--tw-mask-radial', 'radial-gradient(var(--tw-mask-radial-stops))'),
-      decl('--tw-mask-radial-to-position', value),
-    ],
-  })
-
-  /**
-   * Conic masks
-   */
-
-  let maskPropertiesConic = () =>
-    atRoot([
-      property('--tw-mask-conic-position', '0deg'),
-      property('--tw-mask-conic-from-position', '0%'),
-      property('--tw-mask-conic-to-position', '100%'),
-      property('--tw-mask-conic-from-color', 'black'),
-      property('--tw-mask-conic-to-color', 'transparent'),
-    ])
-
-  functionalUtility('mask-conic', {
-    defaultValue: null,
-    supportsNegative: true,
-    supportsFractions: false,
-    handleBareValue({ value }) {
-      if (!isPositiveInteger(value)) return null
-      let valueAsNumber = Number(value)
-      if (valueAsNumber === 0) return '0deg'
-      if (valueAsNumber === 1) return '1deg'
-      return `calc(1deg * ${value})`
-    },
-    handleNegativeBareValue({ value }) {
-      if (!isPositiveInteger(value)) return null
-      let valueAsNumber = Number(value)
-      if (valueAsNumber === 0) return '0deg'
-      if (valueAsNumber === 1) return '-1deg'
-      return `calc(1deg * -${value})`
-    },
-    handle: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesConic(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-conic',
-        'conic-gradient(var(--tw-mask-conic-stops, var(--tw-mask-conic-position)))',
-      ),
-      decl('--tw-mask-conic-position', value),
-    ],
-  })
-
-  suggest('mask-conic', () => [
-    {
-      supportsNegative: true,
-      values: ['0', '1', '2', '3', '6', '12', '45', '90', '180'],
-    },
-  ])
-
-  maskStopUtility('mask-conic-from', {
-    color: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesConic(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-conic-stops',
-        'from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position)',
-      ),
-      decl('--tw-mask-conic', 'conic-gradient(var(--tw-mask-conic-stops))'),
-      decl('--tw-mask-conic-from-color', value),
-    ],
-    position: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesConic(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-conic-stops',
-        'from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position)',
-      ),
-      decl('--tw-mask-conic', 'conic-gradient(var(--tw-mask-conic-stops))'),
-      decl('--tw-mask-conic-from-position', value),
-    ],
-  })
-
-  maskStopUtility('mask-conic-to', {
-    color: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesConic(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-conic-stops',
-        'from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position)',
-      ),
-      decl('--tw-mask-conic', 'conic-gradient(var(--tw-mask-conic-stops))'),
-      decl('--tw-mask-conic-to-color', value),
-    ],
-    position: (value) => [
-      maskPropertiesGradient(),
-      maskPropertiesConic(),
-      decl('mask-image', 'var(--tw-mask-linear), var(--tw-mask-radial), var(--tw-mask-conic)'),
-      decl('mask-composite', 'intersect'),
-      decl(
-        '--tw-mask-conic-stops',
-        'from var(--tw-mask-conic-position), var(--tw-mask-conic-from-color) var(--tw-mask-conic-from-position), var(--tw-mask-conic-to-color) var(--tw-mask-conic-to-position)',
-      ),
-      decl('--tw-mask-conic', 'conic-gradient(var(--tw-mask-conic-stops))'),
-      decl('--tw-mask-conic-to-position', value),
-    ],
-  })
-
   /**
    * @css `box-decoration-break`
    */
@@ -3856,7 +2854,6 @@ export function createUtilities(theme: Theme) {
     {
       values: ['current', 'inherit', 'transparent'],
       valueThemeKeys: ['--fill', '--color'],
-      modifierThemeKeys: ['--opacity'],
       modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
     },
   ])
@@ -3895,10 +2892,6 @@ export function createUtilities(theme: Theme) {
     }
 
     {
-      // A modifier is only valid as the opacity of a stroke color. The value
-      // did not resolve to a color, so a modifier would be silently ignored.
-      if (candidate.modifier) return
-
       let value = theme.resolve(candidate.value.value, ['--stroke-width'])
       if (value) {
         return [decl('stroke-width', value)]
@@ -3912,7 +2905,6 @@ export function createUtilities(theme: Theme) {
     {
       values: ['current', 'inherit', 'transparent'],
       valueThemeKeys: ['--stroke', '--color'],
-      modifierThemeKeys: ['--opacity'],
       modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
     },
     {
@@ -3927,20 +2919,18 @@ export function createUtilities(theme: Theme) {
   staticUtility('object-none', [['object-fit', 'none']])
   staticUtility('object-scale-down', [['object-fit', 'scale-down']])
 
+  staticUtility('object-bottom', [['object-position', 'bottom']])
+  staticUtility('object-center', [['object-position', 'center']])
+  staticUtility('object-left', [['object-position', 'left']])
+  staticUtility('object-left-bottom', [['object-position', 'left bottom']])
+  staticUtility('object-left-top', [['object-position', 'left top']])
+  staticUtility('object-right', [['object-position', 'right']])
+  staticUtility('object-right-bottom', [['object-position', 'right bottom']])
+  staticUtility('object-right-top', [['object-position', 'right top']])
+  staticUtility('object-top', [['object-position', 'top']])
   functionalUtility('object', {
     themeKeys: ['--object-position'],
     handle: (value) => [decl('object-position', value)],
-    staticValues: {
-      top: [decl('object-position', 'top')],
-      'top-left': [decl('object-position', 'left top')],
-      'top-right': [decl('object-position', 'right top')],
-      bottom: [decl('object-position', 'bottom')],
-      'bottom-left': [decl('object-position', 'left bottom')],
-      'bottom-right': [decl('object-position', 'right bottom')],
-      left: [decl('object-position', 'left')],
-      right: [decl('object-position', 'right')],
-      center: [decl('object-position', 'center')],
-    },
   })
 
   for (let [name, property] of [
@@ -3949,8 +2939,6 @@ export function createUtilities(theme: Theme) {
     ['py', 'padding-block'],
     ['ps', 'padding-inline-start'],
     ['pe', 'padding-inline-end'],
-    ['pbs', 'padding-block-start'],
-    ['pbe', 'padding-block-end'],
     ['pt', 'padding-top'],
     ['pr', 'padding-right'],
     ['pb', 'padding-bottom'],
@@ -4052,14 +3040,6 @@ export function createUtilities(theme: Theme) {
     },
   ])
 
-  /**
-   * @css `font-feature-settings`
-   */
-  functionalUtility('font-features', {
-    themeKeys: [],
-    handle: (value) => [decl('font-feature-settings', value)],
-  })
-
   staticUtility('uppercase', [['text-transform', 'uppercase']])
   staticUtility('lowercase', [['text-transform', 'lowercase']])
   staticUtility('capitalize', [['text-transform', 'capitalize']])
@@ -4100,7 +3080,7 @@ export function createUtilities(theme: Theme) {
   ])
 
   colorUtility('placeholder', {
-    themeKeys: ['--placeholder-color', '--color'],
+    themeKeys: ['--background-color', '--color'],
     handle: (value) => [
       styleRule('&::placeholder', [decl('--tw-sort', 'placeholder-color'), decl('color', value)]),
     ],
@@ -4170,7 +3150,6 @@ export function createUtilities(theme: Theme) {
     {
       values: ['current', 'inherit', 'transparent'],
       valueThemeKeys: ['--text-decoration-color', '--color'],
-      modifierThemeKeys: ['--opacity'],
       modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
     },
     {
@@ -4179,37 +3158,35 @@ export function createUtilities(theme: Theme) {
     },
   ])
 
+  staticUtility('animate-none', [['animation', 'none']])
   functionalUtility('animate', {
     themeKeys: ['--animate'],
     handle: (value) => [decl('animation', value)],
-    staticValues: {
-      none: [decl('animation', 'none')],
-    },
   })
 
   {
     let cssFilterValue = [
-      'var(--tw-blur, )',
-      'var(--tw-brightness, )',
-      'var(--tw-contrast, )',
-      'var(--tw-grayscale, )',
-      'var(--tw-hue-rotate, )',
-      'var(--tw-invert, )',
-      'var(--tw-saturate, )',
-      'var(--tw-sepia, )',
-      'var(--tw-drop-shadow, )',
+      'var(--tw-blur,)',
+      'var(--tw-brightness,)',
+      'var(--tw-contrast,)',
+      'var(--tw-grayscale,)',
+      'var(--tw-hue-rotate,)',
+      'var(--tw-invert,)',
+      'var(--tw-saturate,)',
+      'var(--tw-sepia,)',
+      'var(--tw-drop-shadow,)',
     ].join(' ')
 
     let cssBackdropFilterValue = [
-      'var(--tw-backdrop-blur, )',
-      'var(--tw-backdrop-brightness, )',
-      'var(--tw-backdrop-contrast, )',
-      'var(--tw-backdrop-grayscale, )',
-      'var(--tw-backdrop-hue-rotate, )',
-      'var(--tw-backdrop-invert, )',
-      'var(--tw-backdrop-opacity, )',
-      'var(--tw-backdrop-saturate, )',
-      'var(--tw-backdrop-sepia, )',
+      'var(--tw-backdrop-blur,)',
+      'var(--tw-backdrop-brightness,)',
+      'var(--tw-backdrop-contrast,)',
+      'var(--tw-backdrop-grayscale,)',
+      'var(--tw-backdrop-hue-rotate,)',
+      'var(--tw-backdrop-invert,)',
+      'var(--tw-backdrop-opacity,)',
+      'var(--tw-backdrop-saturate,)',
+      'var(--tw-backdrop-sepia,)',
     ].join(' ')
 
     let filterProperties = () => {
@@ -4224,9 +3201,6 @@ export function createUtilities(theme: Theme) {
         property('--tw-saturate'),
         property('--tw-sepia'),
         property('--tw-drop-shadow'),
-        property('--tw-drop-shadow-color'),
-        property('--tw-drop-shadow-alpha', '100%', '<percentage>'),
-        property('--tw-drop-shadow-size'),
       ])
     }
 
@@ -4292,11 +3266,10 @@ export function createUtilities(theme: Theme) {
         decl('--tw-blur', `blur(${value})`),
         decl('filter', cssFilterValue),
       ],
-      staticValues: {
-        none: [filterProperties(), decl('--tw-blur', ' '), decl('filter', cssFilterValue)],
-      },
     })
 
+    staticUtility('blur-none', [filterProperties, ['--tw-blur', ' '], ['filter', cssFilterValue]])
+
     functionalUtility('backdrop-blur', {
       themeKeys: ['--backdrop-blur', '--blur'],
       handle: (value) => [
@@ -4305,16 +3278,15 @@ export function createUtilities(theme: Theme) {
         decl('-webkit-backdrop-filter', cssBackdropFilterValue),
         decl('backdrop-filter', cssBackdropFilterValue),
       ],
-      staticValues: {
-        none: [
-          backdropFilterProperties(),
-          decl('--tw-backdrop-blur', ' '),
-          decl('-webkit-backdrop-filter', cssBackdropFilterValue),
-          decl('backdrop-filter', cssBackdropFilterValue),
-        ],
-      },
     })
 
+    staticUtility('backdrop-blur-none', [
+      backdropFilterProperties,
+      ['--tw-backdrop-blur', ' '],
+      ['-webkit-backdrop-filter', cssBackdropFilterValue],
+      ['backdrop-filter', cssBackdropFilterValue],
+    ])
+
     functionalUtility('brightness', {
       themeKeys: ['--brightness'],
       handleBareValue: ({ value }) => {
@@ -4621,153 +3593,20 @@ export function createUtilities(theme: Theme) {
       ['--tw-drop-shadow', ' '],
       ['filter', cssFilterValue],
     ])
-
-    utilities.functional('drop-shadow', (candidate) => {
-      let alpha: string | undefined
-
-      if (candidate.modifier) {
-        if (candidate.modifier.kind === 'arbitrary') {
-          alpha = candidate.modifier.value
-        } else {
-          if (isValidOpacityValue(candidate.modifier.value)) {
-            alpha = `${candidate.modifier.value}%`
-          }
-        }
-      }
-
-      if (!candidate.value) {
-        let value = theme.get(['--drop-shadow'])
-        let resolved = theme.resolve(null, ['--drop-shadow'])
-        if (value === null || resolved === null) return
-        if (candidate.modifier && !alpha) return
-
-        return [
-          filterProperties(),
-          decl('--tw-drop-shadow-alpha', alpha),
-          ...alphaReplacedDropShadowProperties(
-            '--tw-drop-shadow-size',
-            value,
-            alpha,
-            (color) => `var(--tw-drop-shadow-color, ${color})`,
-          ),
-          decl(
-            '--tw-drop-shadow',
-            segment(resolved, ',')
-              .map((value) => `drop-shadow(${value})`)
-              .join(' '),
-          ),
-          decl('filter', cssFilterValue),
-        ]
-      }
-
-      if (candidate.value.kind === 'arbitrary') {
-        let value: string | null = candidate.value.value
-        let type = candidate.value.dataType ?? inferDataType(value, ['color'])
-
-        switch (type) {
-          case 'color': {
-            value = asColor(value, candidate.modifier, theme)
-            if (value === null) return
-            return [
-              filterProperties(),
-              decl('--tw-drop-shadow-color', withAlpha(value, 'var(--tw-drop-shadow-alpha)')),
-              decl('--tw-drop-shadow', `var(--tw-drop-shadow-size)`),
-            ]
-          }
-          default: {
-            if (candidate.modifier && !alpha) return
-
-            return [
-              filterProperties(),
-              decl('--tw-drop-shadow-alpha', alpha),
-              ...alphaReplacedDropShadowProperties(
-                '--tw-drop-shadow-size',
-                value,
-                alpha,
-                (color) => `var(--tw-drop-shadow-color, ${color})`,
-              ),
-              decl('--tw-drop-shadow', `var(--tw-drop-shadow-size)`),
-              decl('filter', cssFilterValue),
-            ]
-          }
-        }
-      }
-
-      // Shadow size
-      {
-        let value = theme.get([`--drop-shadow-${candidate.value.value}`])
-        let resolved = theme.resolve(candidate.value.value, ['--drop-shadow'])
-        if (value && resolved) {
-          if (candidate.modifier && !alpha) return
-
-          if (alpha) {
-            return [
-              filterProperties(),
-              decl('--tw-drop-shadow-alpha', alpha),
-              ...alphaReplacedDropShadowProperties(
-                '--tw-drop-shadow-size',
-                value,
-                alpha,
-                (color) => `var(--tw-drop-shadow-color, ${color})`,
-              ),
-              decl('--tw-drop-shadow', `var(--tw-drop-shadow-size)`),
-              decl('filter', cssFilterValue),
-            ]
-          }
-
-          return [
-            filterProperties(),
-            decl('--tw-drop-shadow-alpha', alpha),
-            ...alphaReplacedDropShadowProperties(
-              '--tw-drop-shadow-size',
-              value,
-              alpha,
-              (color) => `var(--tw-drop-shadow-color, ${color})`,
-            ),
-            decl(
-              '--tw-drop-shadow',
-              segment(resolved, ',')
-                .map((value) => `drop-shadow(${value})`)
-                .join(' '),
-            ),
-            decl('filter', cssFilterValue),
-          ]
-        }
-      }
-
-      // Shadow color
-      {
-        let value = resolveThemeColor(candidate, theme, ['--drop-shadow-color', '--color'])
-        if (value) {
-          if (value === 'inherit') {
-            return [
-              filterProperties(),
-              decl('--tw-drop-shadow-color', 'inherit'),
-              decl('--tw-drop-shadow', `var(--tw-drop-shadow-size)`),
-            ]
-          }
-
-          return [
-            filterProperties(),
-            decl('--tw-drop-shadow-color', withAlpha(value, 'var(--tw-drop-shadow-alpha)')),
-            decl('--tw-drop-shadow', `var(--tw-drop-shadow-size)`),
-          ]
-        }
-      }
+    functionalUtility('drop-shadow', {
+      themeKeys: ['--drop-shadow'],
+      handle: (value) => [
+        filterProperties(),
+        decl(
+          '--tw-drop-shadow',
+          segment(value, ',')
+            .map((v) => `drop-shadow(${v})`)
+            .join(' '),
+        ),
+        decl('filter', cssFilterValue),
+      ],
     })
 
-    suggest('drop-shadow', () => [
-      {
-        values: ['current', 'inherit', 'transparent'],
-        valueThemeKeys: ['--drop-shadow-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
-        modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-      },
-      {
-        valueThemeKeys: ['--drop-shadow'],
-      },
-    ])
-
     functionalUtility('backdrop-opacity', {
       themeKeys: ['--backdrop-opacity', '--opacity'],
       handleBareValue: ({ value }) => {
@@ -4794,46 +3633,45 @@ export function createUtilities(theme: Theme) {
     let defaultTimingFunction = `var(--tw-ease, ${theme.resolve(null, ['--default-transition-timing-function']) ?? 'ease'})`
     let defaultDuration = `var(--tw-duration, ${theme.resolve(null, ['--default-transition-duration']) ?? '0s'})`
 
+    staticUtility('transition-none', [['transition-property', 'none']])
+    staticUtility('transition-all', [
+      ['transition-property', 'all'],
+      ['transition-timing-function', defaultTimingFunction],
+      ['transition-duration', defaultDuration],
+    ])
+    staticUtility('transition-colors', [
+      [
+        'transition-property',
+        'color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to',
+      ],
+      ['transition-timing-function', defaultTimingFunction],
+      ['transition-duration', defaultDuration],
+    ])
+    staticUtility('transition-opacity', [
+      ['transition-property', 'opacity'],
+      ['transition-timing-function', defaultTimingFunction],
+      ['transition-duration', defaultDuration],
+    ])
+    staticUtility('transition-shadow', [
+      ['transition-property', 'box-shadow'],
+      ['transition-timing-function', defaultTimingFunction],
+      ['transition-duration', defaultDuration],
+    ])
+    staticUtility('transition-transform', [
+      ['transition-property', 'transform, translate, scale, rotate'],
+      ['transition-timing-function', defaultTimingFunction],
+      ['transition-duration', defaultDuration],
+    ])
+
     functionalUtility('transition', {
       defaultValue:
-        'color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events',
+        'color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter',
       themeKeys: ['--transition-property'],
       handle: (value) => [
         decl('transition-property', value),
         decl('transition-timing-function', defaultTimingFunction),
         decl('transition-duration', defaultDuration),
       ],
-      staticValues: {
-        none: [decl('transition-property', 'none')],
-        all: [
-          decl('transition-property', 'all'),
-          decl('transition-timing-function', defaultTimingFunction),
-          decl('transition-duration', defaultDuration),
-        ],
-        colors: [
-          decl(
-            'transition-property',
-            'color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to',
-          ),
-          decl('transition-timing-function', defaultTimingFunction),
-          decl('transition-duration', defaultDuration),
-        ],
-        opacity: [
-          decl('transition-property', 'opacity'),
-          decl('transition-timing-function', defaultTimingFunction),
-          decl('transition-duration', defaultDuration),
-        ],
-        shadow: [
-          decl('transition-property', 'box-shadow'),
-          decl('transition-timing-function', defaultTimingFunction),
-          decl('transition-duration', defaultDuration),
-        ],
-        transform: [
-          decl('transition-property', 'transform, translate, scale, rotate'),
-          decl('transition-timing-function', defaultTimingFunction),
-          decl('transition-duration', defaultDuration),
-        ],
-      },
     })
 
     staticUtility('transition-discrete', [['transition-behavior', 'allow-discrete']])
@@ -4909,6 +3747,12 @@ export function createUtilities(theme: Theme) {
       return atRoot([property('--tw-ease')])
     }
 
+    staticUtility('ease-initial', [transitionTimingFunctionProperty, ['--tw-ease', 'initial']])
+    staticUtility('ease-linear', [
+      transitionTimingFunctionProperty,
+      ['--tw-ease', 'linear'],
+      ['transition-timing-function', 'linear'],
+    ])
     functionalUtility('ease', {
       themeKeys: ['--ease'],
       handle: (value) => [
@@ -4916,14 +3760,6 @@ export function createUtilities(theme: Theme) {
         decl('--tw-ease', value),
         decl('transition-timing-function', value),
       ],
-      staticValues: {
-        initial: [transitionTimingFunctionProperty(), decl('--tw-ease', 'initial')],
-        linear: [
-          transitionTimingFunctionProperty(),
-          decl('--tw-ease', 'linear'),
-          decl('transition-timing-function', 'linear'),
-        ],
-      },
     })
   }
 
@@ -4941,9 +3777,7 @@ export function createUtilities(theme: Theme) {
     ['content', 'none'],
   ])
   functionalUtility('content', {
-    // BC: We only read from the `--content` theme key for compatibility reasons. It's recommended
-    // to use the utility with arbitrary values instead.
-    themeKeys: ['--content'],
+    themeKeys: [],
     handle: (value) => [
       atRoot([property('--tw-content', '""')]),
       decl('--tw-content', value),
@@ -4953,7 +3787,7 @@ export function createUtilities(theme: Theme) {
 
   {
     let cssContainValue =
-      'var(--tw-contain-size, ) var(--tw-contain-layout, ) var(--tw-contain-paint, ) var(--tw-contain-style, )'
+      'var(--tw-contain-size,) var(--tw-contain-layout,) var(--tw-contain-paint,) var(--tw-contain-style,)'
     let cssContainProperties = () => {
       return atRoot([
         property('--tw-contain-size'),
@@ -5006,24 +3840,16 @@ export function createUtilities(theme: Theme) {
   staticUtility('forced-color-adjust-none', [['forced-color-adjust', 'none']])
   staticUtility('forced-color-adjust-auto', [['forced-color-adjust', 'auto']])
 
-  spacingUtility(
-    'leading',
-    ['--leading', '--spacing'],
-    (value) => [
-      atRoot([property('--tw-leading')]),
-      decl('--tw-leading', value),
-      decl('line-height', value),
-    ],
-    {
-      staticValues: {
-        none: [
-          atRoot([property('--tw-leading')]),
-          decl('--tw-leading', '1'),
-          decl('line-height', '1'),
-        ],
-      },
-    },
-  )
+  staticUtility('leading-none', [
+    () => atRoot([property('--tw-leading')]),
+    ['--tw-leading', '1'],
+    ['line-height', '1'],
+  ])
+  spacingUtility('leading', ['--leading', '--spacing'], (value) => [
+    atRoot([property('--tw-leading')]),
+    decl('--tw-leading', value),
+    decl('line-height', value),
+  ])
 
   functionalUtility('tracking', {
     supportsNegative: true,
@@ -5047,7 +3873,7 @@ export function createUtilities(theme: Theme) {
 
   {
     let cssFontVariantNumericValue =
-      'var(--tw-ordinal, ) var(--tw-slashed-zero, ) var(--tw-numeric-figure, ) var(--tw-numeric-spacing, ) var(--tw-numeric-fraction, )'
+      'var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)'
     let fontVariantNumericProperties = () => {
       return atRoot([
         property('--tw-ordinal'),
@@ -5218,7 +4044,6 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: ['--outline-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
         hasDefaultValue: true,
       },
@@ -5263,6 +4088,7 @@ export function createUtilities(theme: Theme) {
     },
   ])
 
+  staticUtility('underline-offset-auto', [['text-underline-offset', 'auto']])
   functionalUtility('underline-offset', {
     supportsNegative: true,
     themeKeys: ['--text-underline-offset'],
@@ -5271,9 +4097,6 @@ export function createUtilities(theme: Theme) {
       return `${value}px`
     },
     handle: (value) => [decl('text-underline-offset', value)],
-    staticValues: {
-      auto: [decl('text-underline-offset', 'auto')],
-    },
   })
 
   suggest('underline-offset', () => [
@@ -5308,7 +4131,7 @@ export function createUtilities(theme: Theme) {
             if (!modifier && isValidSpacingMultiplier(candidate.modifier.value)) {
               let multiplier = theme.resolve(null, ['--spacing'])
               if (!multiplier) return null
-              modifier = `--spacing(${candidate.modifier.value})`
+              modifier = `calc(${multiplier} * ${candidate.modifier.value})`
             }
 
             // Shorthand for `leading-none`
@@ -5361,7 +4184,7 @@ export function createUtilities(theme: Theme) {
           if (!modifier && isValidSpacingMultiplier(candidate.modifier.value)) {
             let multiplier = theme.resolve(null, ['--spacing'])
             if (!multiplier) return null
-            modifier = `--spacing(${candidate.modifier.value})`
+            modifier = `calc(${multiplier} * ${candidate.modifier.value})`
           }
 
           // Shorthand for `leading-none`
@@ -5409,7 +4232,6 @@ export function createUtilities(theme: Theme) {
     {
       values: ['current', 'inherit', 'transparent'],
       valueThemeKeys: ['--text-color', '--color'],
-      modifierThemeKeys: ['--opacity'],
       modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
     },
     {
@@ -5420,136 +4242,6 @@ export function createUtilities(theme: Theme) {
     },
   ])
 
-  let textShadowProperties = () => {
-    return atRoot([
-      property('--tw-text-shadow-color'),
-      property('--tw-text-shadow-alpha', '100%', '<percentage>'),
-    ])
-  }
-
-  staticUtility('text-shadow-initial', [
-    textShadowProperties,
-    ['--tw-text-shadow-color', 'initial'],
-  ])
-
-  utilities.functional('text-shadow', (candidate) => {
-    let alpha: string | undefined
-
-    if (candidate.modifier) {
-      if (candidate.modifier.kind === 'arbitrary') {
-        alpha = candidate.modifier.value
-      } else {
-        if (isValidOpacityValue(candidate.modifier.value)) {
-          alpha = `${candidate.modifier.value}%`
-        }
-      }
-    }
-
-    if (!candidate.value) {
-      let value = theme.get(['--text-shadow'])
-      if (value === null) return
-      if (candidate.modifier && !alpha) return
-
-      return [
-        textShadowProperties(),
-        decl('--tw-text-shadow-alpha', alpha),
-        ...alphaReplacedShadowProperties(
-          'text-shadow',
-          value,
-          alpha,
-          (color) => `var(--tw-text-shadow-color, ${color})`,
-        ),
-      ]
-    }
-
-    if (candidate.value.kind === 'arbitrary') {
-      let value: string | null = candidate.value.value
-      let type = candidate.value.dataType ?? inferDataType(value, ['color'])
-
-      switch (type) {
-        case 'color': {
-          value = asColor(value, candidate.modifier, theme)
-          if (value === null) return
-          return [
-            textShadowProperties(),
-            decl('--tw-text-shadow-color', withAlpha(value, 'var(--tw-text-shadow-alpha)')),
-          ]
-        }
-        default: {
-          if (candidate.modifier && !alpha) return
-
-          return [
-            textShadowProperties(),
-            decl('--tw-text-shadow-alpha', alpha),
-            ...alphaReplacedShadowProperties(
-              'text-shadow',
-              value,
-              alpha,
-              (color) => `var(--tw-text-shadow-color, ${color})`,
-            ),
-          ]
-        }
-      }
-    }
-
-    switch (candidate.value.value) {
-      case 'none':
-        if (candidate.modifier) return
-        return [textShadowProperties(), decl('text-shadow', 'none')]
-
-      case 'inherit':
-        if (candidate.modifier) return
-        return [textShadowProperties(), decl('--tw-text-shadow-color', 'inherit')]
-    }
-
-    // Shadow size
-    {
-      let value = theme.get([`--text-shadow-${candidate.value.value}`])
-      if (value) {
-        if (candidate.modifier && !alpha) return
-
-        return [
-          textShadowProperties(),
-          decl('--tw-text-shadow-alpha', alpha),
-          ...alphaReplacedShadowProperties(
-            'text-shadow',
-            value,
-            alpha,
-            (color) => `var(--tw-text-shadow-color, ${color})`,
-          ),
-        ]
-      }
-    }
-
-    // Shadow color
-    {
-      let value = resolveThemeColor(candidate, theme, ['--text-shadow-color', '--color'])
-      if (value) {
-        return [
-          textShadowProperties(),
-          decl('--tw-text-shadow-color', withAlpha(value, 'var(--tw-text-shadow-alpha)')),
-        ]
-      }
-    }
-  })
-
-  suggest('text-shadow', () => [
-    {
-      values: ['current', 'inherit', 'transparent'],
-      valueThemeKeys: ['--text-shadow-color', '--color'],
-      modifierThemeKeys: ['--opacity'],
-      modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-    },
-    {
-      values: ['none'],
-    },
-    {
-      valueThemeKeys: ['--text-shadow'],
-      modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-      hasDefaultValue: theme.get(['--text-shadow']) !== null,
-    },
-  ])
-
   {
     let cssBoxShadowValue = [
       'var(--tw-inset-shadow)',
@@ -5564,10 +4256,8 @@ export function createUtilities(theme: Theme) {
       return atRoot([
         property('--tw-shadow', nullShadow),
         property('--tw-shadow-color'),
-        property('--tw-shadow-alpha', '100%', '<percentage>'),
         property('--tw-inset-shadow', nullShadow),
         property('--tw-inset-shadow-color'),
-        property('--tw-inset-shadow-alpha', '100%', '<percentage>'),
         property('--tw-ring-color'),
         property('--tw-ring-shadow', nullShadow),
         property('--tw-inset-ring-color'),
@@ -5584,31 +4274,15 @@ export function createUtilities(theme: Theme) {
     staticUtility('shadow-initial', [boxShadowProperties, ['--tw-shadow-color', 'initial']])
 
     utilities.functional('shadow', (candidate) => {
-      let alpha: string | undefined
-
-      if (candidate.modifier) {
-        if (candidate.modifier.kind === 'arbitrary') {
-          alpha = candidate.modifier.value
-        } else {
-          if (isValidOpacityValue(candidate.modifier.value)) {
-            alpha = `${candidate.modifier.value}%`
-          }
-        }
-      }
-
       if (!candidate.value) {
         let value = theme.get(['--shadow'])
         if (value === null) return
-        if (candidate.modifier && !alpha) return
 
         return [
           boxShadowProperties(),
-          decl('--tw-shadow-alpha', alpha),
-          ...alphaReplacedShadowProperties(
+          decl(
             '--tw-shadow',
-            value,
-            alpha,
-            (color) => `var(--tw-shadow-color, ${color})`,
+            replaceShadowColors(value, (color) => `var(--tw-shadow-color, ${color})`),
           ),
           decl('box-shadow', cssBoxShadowValue),
         ]
@@ -5623,22 +4297,14 @@ export function createUtilities(theme: Theme) {
             value = asColor(value, candidate.modifier, theme)
             if (value === null) return
 
-            return [
-              boxShadowProperties(),
-              decl('--tw-shadow-color', withAlpha(value, 'var(--tw-shadow-alpha)')),
-            ]
+            return [boxShadowProperties(), decl('--tw-shadow-color', value)]
           }
           default: {
-            if (candidate.modifier && !alpha) return
-
             return [
               boxShadowProperties(),
-              decl('--tw-shadow-alpha', alpha),
-              ...alphaReplacedShadowProperties(
+              decl(
                 '--tw-shadow',
-                value,
-                alpha,
-                (color) => `var(--tw-shadow-color, ${color})`,
+                replaceShadowColors(value, (color) => `var(--tw-shadow-color, ${color})`),
               ),
               decl('box-shadow', cssBoxShadowValue),
             ]
@@ -5654,26 +4320,18 @@ export function createUtilities(theme: Theme) {
             decl('--tw-shadow', nullShadow),
             decl('box-shadow', cssBoxShadowValue),
           ]
-
-        case 'inherit':
-          if (candidate.modifier) return
-          return [boxShadowProperties(), decl('--tw-shadow-color', 'inherit')]
       }
 
       // Shadow size
       {
         let value = theme.get([`--shadow-${candidate.value.value}`])
         if (value) {
-          if (candidate.modifier && !alpha) return
-
+          if (candidate.modifier) return
           return [
             boxShadowProperties(),
-            decl('--tw-shadow-alpha', alpha),
-            ...alphaReplacedShadowProperties(
+            decl(
               '--tw-shadow',
-              value,
-              alpha,
-              (color) => `var(--tw-shadow-color, ${color})`,
+              replaceShadowColors(value, (color) => `var(--tw-shadow-color, ${color})`),
             ),
             decl('box-shadow', cssBoxShadowValue),
           ]
@@ -5684,10 +4342,7 @@ export function createUtilities(theme: Theme) {
       {
         let value = resolveThemeColor(candidate, theme, ['--box-shadow-color', '--color'])
         if (value) {
-          return [
-            boxShadowProperties(),
-            decl('--tw-shadow-color', withAlpha(value, 'var(--tw-shadow-alpha)')),
-          ]
+          return [boxShadowProperties(), decl('--tw-shadow-color', value)]
         }
       }
     })
@@ -5696,16 +4351,12 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: ['--box-shadow-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
       },
       {
         values: ['none'],
-      },
-      {
         valueThemeKeys: ['--shadow'],
-        modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-        hasDefaultValue: theme.get(['--shadow']) !== null,
+        hasDefaultValue: true,
       },
     ])
 
@@ -5715,31 +4366,15 @@ export function createUtilities(theme: Theme) {
     ])
 
     utilities.functional('inset-shadow', (candidate) => {
-      let alpha: string | undefined
-
-      if (candidate.modifier) {
-        if (candidate.modifier.kind === 'arbitrary') {
-          alpha = candidate.modifier.value
-        } else {
-          if (isValidOpacityValue(candidate.modifier.value)) {
-            alpha = `${candidate.modifier.value}%`
-          }
-        }
-      }
-
       if (!candidate.value) {
         let value = theme.get(['--inset-shadow'])
         if (value === null) return
-        if (candidate.modifier && !alpha) return
 
         return [
           boxShadowProperties(),
-          decl('--tw-inset-shadow-alpha', alpha),
-          ...alphaReplacedShadowProperties(
+          decl(
             '--tw-inset-shadow',
-            value,
-            alpha,
-            (color) => `var(--tw-inset-shadow-color, ${color})`,
+            replaceShadowColors(value, (color) => `var(--tw-inset-shadow-color, ${color})`),
           ),
           decl('box-shadow', cssBoxShadowValue),
         ]
@@ -5754,23 +4389,14 @@ export function createUtilities(theme: Theme) {
             value = asColor(value, candidate.modifier, theme)
             if (value === null) return
 
-            return [
-              boxShadowProperties(),
-              decl('--tw-inset-shadow-color', withAlpha(value, 'var(--tw-inset-shadow-alpha)')),
-            ]
+            return [boxShadowProperties(), decl('--tw-inset-shadow-color', value)]
           }
           default: {
-            if (candidate.modifier && !alpha) return
-
             return [
               boxShadowProperties(),
-              decl('--tw-inset-shadow-alpha', alpha),
-              ...alphaReplacedShadowProperties(
+              decl(
                 '--tw-inset-shadow',
-                value,
-                alpha,
-                (color) => `var(--tw-inset-shadow-color, ${color})`,
-                'inset',
+                `inset ${replaceShadowColors(value, (color) => `var(--tw-inset-shadow-color, ${color})`)}`,
               ),
               decl('box-shadow', cssBoxShadowValue),
             ]
@@ -5783,13 +4409,9 @@ export function createUtilities(theme: Theme) {
           if (candidate.modifier) return
           return [
             boxShadowProperties(),
-            decl('--tw-inset-shadow', `inset ${nullShadow}`),
+            decl('--tw-inset-shadow', nullShadow),
             decl('box-shadow', cssBoxShadowValue),
           ]
-
-        case 'inherit':
-          if (candidate.modifier) return
-          return [boxShadowProperties(), decl('--tw-inset-shadow-color', 'inherit')]
       }
 
       // Shadow size
@@ -5797,16 +4419,12 @@ export function createUtilities(theme: Theme) {
         let value = theme.get([`--inset-shadow-${candidate.value.value}`])
 
         if (value) {
-          if (candidate.modifier && !alpha) return
-
+          if (candidate.modifier) return
           return [
             boxShadowProperties(),
-            decl('--tw-inset-shadow-alpha', alpha),
-            ...alphaReplacedShadowProperties(
+            decl(
               '--tw-inset-shadow',
-              value,
-              alpha,
-              (color) => `var(--tw-inset-shadow-color, ${color})`,
+              replaceShadowColors(value, (color) => `var(--tw-inset-shadow-color, ${color})`),
             ),
             decl('box-shadow', cssBoxShadowValue),
           ]
@@ -5817,10 +4435,7 @@ export function createUtilities(theme: Theme) {
       {
         let value = resolveThemeColor(candidate, theme, ['--box-shadow-color', '--color'])
         if (value) {
-          return [
-            boxShadowProperties(),
-            decl('--tw-inset-shadow-color', withAlpha(value, 'var(--tw-inset-shadow-alpha)')),
-          ]
+          return [boxShadowProperties(), decl('--tw-inset-shadow-color', value)]
         }
       }
     })
@@ -5829,24 +4444,20 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: ['--box-shadow-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
       },
       {
-        values: ['none'],
-      },
-      {
+        values: [],
         valueThemeKeys: ['--inset-shadow'],
-        modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
-        hasDefaultValue: theme.get(['--inset-shadow']) !== null,
+        hasDefaultValue: true,
       },
     ])
 
     staticUtility('ring-inset', [boxShadowProperties, ['--tw-ring-inset', 'inset']])
 
-    let defaultRingColor = theme.get(['--default-ring-color']) ?? 'currentcolor'
+    let defaultRingColor = theme.get(['--default-ring-color']) ?? 'currentColor'
     function ringShadowValue(value: string) {
-      return `var(--tw-ring-inset, ) 0 0 0 calc(${value} + var(--tw-ring-offset-width)) var(--tw-ring-color, ${defaultRingColor})`
+      return `var(--tw-ring-inset,) 0 0 0 calc(${value} + var(--tw-ring-offset-width)) var(--tw-ring-color, ${defaultRingColor})`
     }
     utilities.functional('ring', (candidate) => {
       if (!candidate.value) {
@@ -5910,7 +4521,6 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: ['--ring-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
       },
       {
@@ -5921,7 +4531,7 @@ export function createUtilities(theme: Theme) {
     ])
 
     function insetRingShadowValue(value: string) {
-      return `inset 0 0 0 ${value} var(--tw-inset-ring-color, currentcolor)`
+      return `inset 0 0 0 ${value} var(--tw-inset-ring-color, currentColor)`
     }
     utilities.functional('inset-ring', (candidate) => {
       if (!candidate.value) {
@@ -5984,7 +4594,6 @@ export function createUtilities(theme: Theme) {
       {
         values: ['current', 'inherit', 'transparent'],
         valueThemeKeys: ['--ring-color', '--color'],
-        modifierThemeKeys: ['--opacity'],
         modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
       },
       {
@@ -5995,7 +4604,7 @@ export function createUtilities(theme: Theme) {
     ])
 
     let ringOffsetShadowValue =
-      'var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)'
+      'var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)'
     utilities.functional('ring-offset', (candidate) => {
       if (!candidate.value) return
 
@@ -6052,7 +4661,6 @@ export function createUtilities(theme: Theme) {
     {
       values: ['current', 'inherit', 'transparent'],
       valueThemeKeys: ['--ring-offset-color', '--color'],
-      modifierThemeKeys: ['--opacity'],
       modifiers: Array.from({ length: 21 }, (_, index) => `${index * 5}`),
     },
     {
@@ -6069,8 +4677,6 @@ export function createUtilities(theme: Theme) {
       value = candidate.value.value
     } else if (candidate.value.kind === 'named' && candidate.value.value === 'normal') {
       value = 'normal'
-    } else if (candidate.value.kind === 'named' && candidate.value.value === 'size') {
-      value = 'size'
     }
 
     if (value === null) return
@@ -6093,33 +4699,17 @@ export function createUtilities(theme: Theme) {
   return utilities
 }
 
-// Only allowed bare value data types, to prevent creating new syntax that we
-// typically don't support right now. E.g.: `--value(color)` would allow you to
-// use `text-#0088cc` as a valid utility, which is not what we want.
-export const BARE_VALUE_DATA_TYPES = [
-  'number', // 2.5
-  'integer', // 8
-  'ratio', // 2/3
-  'percentage', // 25%
-]
-
 export function createCssUtility(node: AtRule) {
-  // Allow escaped characters in the name for compatibility with formatters and
-  // other parsers, to ensure valid CSS syntax. E.g.: `@utility foo-1\/2`.
-  //
-  // Note: the actual utility will be `foo-1/2`
-  let name = unescape(node.params)
+  let name = node.params
 
   // Functional utilities. E.g.: `tab-size-*`
-  if (isValidFunctionalUtilityName(name)) {
+  if (IS_VALID_FUNCTIONAL_UTILITY_NAME.test(name)) {
     // API:
     //
     // - `--value('literal')`         resolves a literal named value
     // - `--value(number)`            resolves a bare value of type number
     // - `--value([number])`          resolves an arbitrary value of type number
     // - `--value(--color)`           resolves a theme value in the `color` namespace
-    // - `--value(--default(4))`      resolves to a default value when only the
-    //                                root of the functional utility was used.
     // - `--value(number, [number])`  resolves a bare value of type number or an
     //                                arbitrary value of type number in order.
     //
@@ -6179,7 +4769,7 @@ export function createCssUtility(node: AtRule) {
         //
         // Once Prettier / Biome handle these better (e.g.: not crashing without
         // `\\*` or not inserting whitespace) then most of these can go away.
-        walk(declarationValueAst, (fn) => {
+        ValueParser.walk(declarationValueAst, (fn) => {
           if (fn.kind !== 'function') return
 
           // Track usage of `--spacing(…)`
@@ -6189,7 +4779,7 @@ export function createCssUtility(node: AtRule) {
             // using the full `--spacing` theme scale.
             !(storage['--modifier'].usedSpacingNumber && storage['--value'].usedSpacingNumber)
           ) {
-            walk(fn.nodes, (node) => {
+            ValueParser.walk(fn.nodes, (node) => {
               if (node.kind !== 'function') return
               if (node.value !== '--value' && node.value !== '--modifier') return
               const key = node.value
@@ -6208,27 +4798,18 @@ export function createCssUtility(node: AtRule) {
                     storage['--modifier'].usedSpacingNumber &&
                     storage['--value'].usedSpacingNumber
                   ) {
-                    return WalkAction.Stop
+                    return ValueParser.ValueWalkAction.Stop
                   }
                 }
               }
             })
-            return WalkAction.Continue
+            return ValueParser.ValueWalkAction.Continue
           }
 
           if (fn.value !== '--value' && fn.value !== '--modifier') return
 
           let args = segment(ValueParser.toCss(fn.nodes), ',')
           for (let [idx, arg] of args.entries()) {
-            arg = arg.trim()
-
-            // The value of `--default(…)` is emitted as-is, so it should not be
-            // normalized.
-            if (arg.startsWith('--default(')) {
-              args[idx] = arg
-              continue
-            }
-
             // Transform escaped `\\*` -> `*`
             arg = arg.replace(/\\\*/g, '*')
 
@@ -6242,7 +4823,7 @@ export function createCssUtility(node: AtRule) {
             arg = arg.replace(/(-\*){2,}/g, '-*')
 
             // Ensure trailing `-*` exists if `-*` isn't present yet
-            if (arg[0] === '-' && arg[1] === '-' && !arg.includes('(') && !arg.includes('-*')) {
+            if (arg[0] === '-' && arg[1] === '-' && !arg.includes('-*')) {
               arg += '-*'
             }
 
@@ -6250,6 +4831,7 @@ export function createCssUtility(node: AtRule) {
           }
           fn.nodes = ValueParser.parse(args.join(','))
 
+          // Track information for suggestions
           for (let node of fn.nodes) {
             // Track literal values
             if (
@@ -6266,36 +4848,6 @@ export function createCssUtility(node: AtRule) {
               let value = node.value.replace(/-\*.*$/g, '') as `--${string}`
               storage[fn.value].themeKeys.add(value)
             }
-
-            // Validate bare value data types
-            else if (
-              node.kind === 'word' &&
-              !(node.value[0] === '[' && node.value[node.value.length - 1] === ']') && // Ignore arbitrary values
-              !BARE_VALUE_DATA_TYPES.includes(node.value)
-            ) {
-              console.warn(
-                `Unsupported bare value data type: "${node.value}".\nOnly valid data types are: ${BARE_VALUE_DATA_TYPES.map((x) => `"${x}"`).join(', ')}.\n`,
-              )
-              // TODO: Once we properly track the location of the node, we can
-              //       clean this up in a better way.
-              let dataType = node.value
-              let copy = structuredClone(fn)
-              let sentinelValue = '¶'
-              walk(copy.nodes, (node) => {
-                if (node.kind === 'word' && node.value === dataType) {
-                  return WalkAction.ReplaceSkip({ kind: 'word', value: sentinelValue } as const)
-                }
-              })
-              let underline = '^'.repeat(ValueParser.toCss([node]).length)
-              let offset = ValueParser.toCss([copy]).indexOf(sentinelValue)
-              let output = [
-                '```css',
-                ValueParser.toCss([fn]),
-                ' '.repeat(offset) + underline,
-                '```',
-              ].join('\n')
-              console.warn(output)
-            }
           }
         })
 
@@ -6303,13 +4855,14 @@ export function createCssUtility(node: AtRule) {
       })
 
       designSystem.utilities.functional(name.slice(0, -2), (candidate) => {
-        let atRule = cloneAstNode(node)
+        let atRule = structuredClone(node)
 
         let value = candidate.value
         let modifier = candidate.modifier
 
-        // Functional CSS utilities must resolve at least one `--value(…)`.
-        // Use `--default(…)` inside `--value(…)` for the omitted-value case.
+        // A value is required for functional utilities, if you want to accept
+        // just `tab-size`, you'd have to use a static utility.
+        if (value === null) return
 
         // Whether `--value(…)` was used
         let usedValueFn = false
@@ -6341,67 +4894,73 @@ export function createCssUtility(node: AtRule) {
         // Whether `--value(ratio)` was resolved
         let resolvedRatioValue = false
 
-        walk<AstNode>([atRule], (node, ctx) => {
-          let parent = ctx.parent
+        walk([atRule], (node, { parent, replaceWith: replaceDeclarationWith }) => {
           if (parent?.kind !== 'rule' && parent?.kind !== 'at-rule') return
           if (node.kind !== 'declaration') return
           if (!node.value) return
 
-          let shouldRemoveDeclaration = false
-
           let valueAst = ValueParser.parse(node.value)
-          walk(valueAst, (fnNode) => {
-            if (fnNode.kind !== 'function') return
+          let result =
+            ValueParser.walk(valueAst, (valueNode, { replaceWith }) => {
+              if (valueNode.kind !== 'function') return
 
-            // Value function, e.g.: `--value(integer)`
-            if (fnNode.value === '--value') {
-              usedValueFn = true
+              // Value function, e.g.: `--value(integer)`
+              if (valueNode.value === '--value') {
+                usedValueFn = true
 
-              let resolved = resolveValueFunction(value, fnNode, designSystem)
-              if (resolved) {
-                resolvedValueFn = true
-                if (resolved.ratio) {
-                  resolvedRatioValue = true
-                } else {
-                  resolvedDeclarations.set(node, parent)
+                let resolved = resolveValueFunction(value, valueNode, designSystem)
+                if (resolved) {
+                  resolvedValueFn = true
+                  if (resolved.ratio) {
+                    resolvedRatioValue = true
+                  } else {
+                    resolvedDeclarations.set(node, parent)
+                  }
+                  replaceWith(resolved.nodes)
+                  return ValueParser.ValueWalkAction.Skip
                 }
-                return WalkAction.ReplaceSkip(resolved.nodes)
+
+                // Drop the declaration in case we couldn't resolve the value
+                usedValueFn ||= false
+                replaceDeclarationWith([])
+                return ValueParser.ValueWalkAction.Stop
               }
 
-              // Drop the declaration in case we couldn't resolve the value
-              shouldRemoveDeclaration = true
-              return WalkAction.Stop
-            }
+              // Modifier function, e.g.: `--modifier(integer)`
+              else if (valueNode.value === '--modifier') {
+                // If there is no modifier present in the candidate, then the
+                // declaration can be removed.
+                if (modifier === null) {
+                  replaceDeclarationWith([])
+                  return ValueParser.ValueWalkAction.Stop
+                }
 
-            // Modifier function, e.g.: `--modifier(integer)`
-            else if (fnNode.value === '--modifier') {
-              usedModifierFn = true
+                usedModifierFn = true
 
-              let resolved = resolveValueFunction(modifier, fnNode, designSystem)
-              if (resolved) {
-                resolvedModifierFn = true
-                return WalkAction.ReplaceSkip(resolved.nodes)
+                let replacement = resolveValueFunction(modifier, valueNode, designSystem)
+                if (replacement) {
+                  resolvedModifierFn = true
+                  replaceWith(replacement.nodes)
+                  return ValueParser.ValueWalkAction.Skip
+                }
+
+                // Drop the declaration in case we couldn't resolve the value
+                usedModifierFn ||= false
+                replaceDeclarationWith([])
+                return ValueParser.ValueWalkAction.Stop
               }
+            }) ?? ValueParser.ValueWalkAction.Continue
 
-              // Drop the declaration in case we couldn't resolve the value
-              shouldRemoveDeclaration = true
-              return WalkAction.Stop
-            }
-          })
-
-          if (shouldRemoveDeclaration) {
-            return WalkAction.ReplaceSkip([])
+          if (result === ValueParser.ValueWalkAction.Continue) {
+            node.value = ValueParser.toCss(valueAst)
           }
-
-          node.value = ValueParser.toCss(valueAst)
         })
 
-        // Functional CSS utilities require `--value(…)`, and one of those
-        // branches must resolve for the candidate to be valid.
-        if (!usedValueFn || !resolvedValueFn) return null
+        // Used `--value(…)` but nothing resolved
+        if (usedValueFn && !resolvedValueFn) return null
 
         // Used `--modifier(…)` but nothing resolved
-        if (usedModifierFn && !resolvedModifierFn && modifier !== null) return null
+        if (usedModifierFn && !resolvedModifierFn) return null
 
         // Resolved `--value(ratio)` and `--modifier(…)`, which is invalid
         if (resolvedRatioValue && resolvedModifierFn) return null
@@ -6449,11 +5008,7 @@ export function createCssUtility(node: AtRule) {
 
           // Suggest theme values. E.g.: `--value(--color-*)`
           for (let value of designSystem.theme.keysInNamespaces(themeKeys)) {
-            target.push(
-              value.replace(LEGACY_NUMERIC_KEY, (_, a, b) => {
-                return `${a}.${b}`
-              }),
-            )
+            target.push(value)
           }
         }
 
@@ -6462,9 +5017,9 @@ export function createCssUtility(node: AtRule) {
     }
   }
 
-  if (isValidStaticUtilityName(name)) {
+  if (IS_VALID_STATIC_UTILITY_NAME.test(name)) {
     return (designSystem: DesignSystem) => {
-      designSystem.utilities.static(name, () => node.nodes.map(cloneAstNode))
+      designSystem.utilities.static(name, () => structuredClone(node.nodes))
     }
   }
 
@@ -6472,23 +5027,13 @@ export function createCssUtility(node: AtRule) {
 }
 
 function resolveValueFunction(
-  value:
+  value: NonNullable<
     | Extract<Candidate, { kind: 'functional' }>['value']
-    | Extract<Candidate, { kind: 'functional' }>['modifier'],
+    | Extract<Candidate, { kind: 'functional' }>['modifier']
+  >,
   fn: ValueParser.ValueFunctionNode,
   designSystem: DesignSystem,
 ): { nodes: ValueParser.ValueAstNode[]; ratio?: boolean } | undefined {
-  // No value provided, we can try `--default(…)`
-  if (value === null) {
-    for (let arg of fn.nodes) {
-      // Resolve default value, e.g.: `--default(…)`
-      if (arg.kind === 'function' && arg.value === '--default') {
-        return { nodes: arg.nodes }
-      }
-    }
-    return
-  }
-
   for (let arg of fn.nodes) {
     // Resolve literal value, e.g.: `--modifier('closest-side')`
     if (
@@ -6546,7 +5091,12 @@ function resolveValueFunction(
       // Limit the bare value types, to prevent new syntax that we
       // don't want to support. E.g.: `text-#000` is something we
       // don't want to support, but could be built this way.
-      if (!BARE_VALUE_DATA_TYPES.includes(arg.value)) {
+      if (
+        arg.value !== 'number' &&
+        arg.value !== 'integer' &&
+        arg.value !== 'ratio' &&
+        arg.value !== 'percentage'
+      ) {
         continue
       }
 
@@ -6558,7 +5108,7 @@ function resolveValueFunction(
 
       // Ratio must be a valid fraction, e.g.: <integer>/<integer>
       if (type === 'ratio') {
-        let [lhs, rhs] = segment(resolved, '/').map(Number)
+        let [lhs, rhs] = segment(resolved, '/')
         if (!isPositiveInteger(lhs) || !isPositiveInteger(rhs)) continue
       }
 
@@ -6573,12 +5123,7 @@ function resolveValueFunction(
         continue
       }
 
-      if (type === 'ratio') {
-        let [lhs, rhs] = segment(resolved, '/')
-        return { nodes: ValueParser.parse(`${lhs.trim()} / ${rhs.trim()}`), ratio: true }
-      }
-
-      return { nodes: ValueParser.parse(resolved), ratio: false }
+      return { nodes: ValueParser.parse(resolved), ratio: type === 'ratio' }
     }
 
     // Arbitrary value, e.g.: `--value([integer])`
@@ -6624,240 +5169,3 @@ function resolveValueFunction(
     }
   }
 }
-
-function alphaReplacedShadowProperties(
-  property: string,
-  value: string,
-  alpha: string | null | undefined,
-  varInjector: (color: string) => string,
-  prefix: string = '',
-): AstNode[] {
-  let requiresFallback = false
-  let replacedValue = replaceShadowColors(value, (color) => {
-    if (alpha == null) {
-      return varInjector(color)
-    }
-
-    // When the input is currentcolor, we use our existing `color-mix(…)` approach to increase
-    // browser support. Note that the fallback of this is handled more generically in
-    // post-processing.
-    if (color.startsWith('current')) {
-      return varInjector(withAlpha(color, alpha))
-    }
-
-    // If any dynamic values are needed for the relative color syntax, we need to insert a
-    // replacement as lightningcss won't be able to resolve them statically.
-    if (color.startsWith('var(') || alpha.startsWith('var(')) {
-      requiresFallback = true
-    }
-
-    return varInjector(replaceAlpha(color, alpha))
-  })
-
-  function applyPrefix(x: string) {
-    if (!prefix) return x
-    return segment(x, ',')
-      .map((value) => prefix.trim() + ' ' + value.trim())
-      .join(', ')
-  }
-
-  if (requiresFallback) {
-    return [
-      decl(property, applyPrefix(replaceShadowColors(value, varInjector))),
-      rule('@supports (color: lab(from red l a b))', [decl(property, applyPrefix(replacedValue))]),
-    ]
-  } else {
-    return [decl(property, applyPrefix(replacedValue))]
-  }
-}
-
-function alphaReplacedDropShadowProperties(
-  property: string,
-  value: string,
-  alpha: string | null | undefined,
-  varInjector: (color: string) => string,
-  prefix: string = '',
-): AstNode[] {
-  let requiresFallback = false
-
-  let replacedValue = segment(value, ',')
-    .map((value) =>
-      replaceShadowColors(value, (color) => {
-        if (alpha == null) {
-          return varInjector(color)
-        }
-
-        // When the input is currentcolor, we use our existing `color-mix(…)` approach to increase
-        // browser support. Note that the fallback of this is handled more generically in
-        // post-processing.
-        if (color.startsWith('current')) {
-          return varInjector(withAlpha(color, alpha))
-        }
-
-        // If any dynamic values are needed for the relative color syntax, we need to insert a
-        // replacement as lightningcss won't be able to resolve them statically.
-        if (color.startsWith('var(') || alpha.startsWith('var(')) {
-          requiresFallback = true
-        }
-
-        return varInjector(replaceAlpha(color, alpha))
-      }),
-    )
-    .map((value) => `drop-shadow(${value})`)
-    .join(' ')
-
-  if (requiresFallback) {
-    return [
-      decl(
-        property,
-        prefix +
-          segment(value, ',')
-            .map((value) => `drop-shadow(${replaceShadowColors(value, varInjector)})`)
-            .join(' '),
-      ),
-      rule('@supports (color: lab(from red l a b))', [decl(property, prefix + replacedValue)]),
-    ]
-  } else {
-    return [decl(property, prefix + replacedValue)]
-  }
-}
-
-const UTILITY_ROOT = /^-?[a-z][a-zA-Z0-9_-]*/
-
-const PERCENT = 37
-const SLASH = 47
-const DOT = 46
-const LOWER_A = 97
-const LOWER_Z = 122
-const UPPER_A = 65
-const UPPER_Z = 90
-const ZERO = 48
-const NINE = 57
-const UNDERSCORE = 95
-const DASH = 45
-
-export function isValidStaticUtilityName(name: string): boolean {
-  let match = UTILITY_ROOT.exec(name)
-  if (match === null) return false // Invalid root
-
-  let root = match[0]
-  let value = name.slice(root.length)
-
-  // Root should not end in `-` if there is no value
-  //
-  // `tab-size-`
-  //  ---------     Root
-  if (value.length === 0 && root.endsWith('-')) {
-    return false
-  }
-
-  // No remaining value is valid
-  //
-  // `tab-size`
-  //  --------    Root
-  if (value.length === 0) {
-    return true
-  }
-
-  // Any valid (static) utility should be valid including:
-  // - Bare values with `.`: `p-1.5`
-  // - Bare values with `%`: `w-50%`
-  // - With an embedded modifier: `text-xs/8`
-
-  let seenSlash = false
-  for (let i = 0; i < value.length; i++) {
-    let charCode = value.charCodeAt(i)
-    switch (charCode) {
-      case PERCENT: {
-        // A percentage is only valid at the end of the value
-        if (i !== value.length - 1) return false
-
-        // A percent is only valid when preceded by a digit. E.g.: `w-%` is invalid
-        let previousChar = value[i - 1] || root[root.length - 1] || ''
-        let previousCharCode = previousChar.charCodeAt(0)
-        if (previousCharCode < ZERO || previousCharCode > NINE) return false
-        break
-      }
-
-      case SLASH: {
-        // A slash must be followed by at least 1 character. E.g.: `foo/` is invalid
-        if (i === value.length - 1) return false
-
-        // A slash can only appear once. E.g.: `foo/bar/baz` is invalid
-        if (seenSlash) return false
-        seenSlash = true
-        break
-      }
-
-      case DOT: {
-        // Dots are only allowed between digits. E.g.: `p-1.a` is invalid
-        let previousChar = value[i - 1] || root[root.length - 1] || ''
-        let previousCharCode = previousChar.charCodeAt(0)
-        if (previousCharCode < ZERO || previousCharCode > NINE) return false
-
-        let nextChar = value[i + 1] || ''
-        let nextCharCode = nextChar.charCodeAt(0)
-        if (nextCharCode < ZERO || nextCharCode > NINE) return false
-        break
-      }
-
-      // Allowed special characters
-      case UNDERSCORE:
-      case DASH: {
-        continue
-      }
-
-      default: {
-        if (
-          (charCode >= LOWER_A && charCode <= LOWER_Z) || // Allow a-z
-          (charCode >= UPPER_A && charCode <= UPPER_Z) || // Allow A-Z
-          (charCode >= ZERO && charCode <= NINE) // Allow 0-9
-        ) {
-          continue
-        }
-
-        // Everything else is invalid
-        return false
-      }
-    }
-  }
-
-  return true
-}
-
-export function isValidFunctionalUtilityName(name: string): boolean {
-  if (!name.endsWith('-*')) return false // Missing '-*' suffix
-  name = name.slice(0, -2)
-
-  let match = UTILITY_ROOT.exec(name)
-  if (match === null) return false // Invalid root
-
-  let root = match[0]
-  let value = name.slice(root.length)
-
-  // No remaining value is valid
-  //
-  // `tab-size-*`
-  //  --------    Root
-  //          --  Suffix
-  //
-  // Backwards compatibility: a root ending in `-` was valid and correctly
-  // scanned by Oxide. This means that custom utilities can result in candidates
-  // such as `foo--bar`.
-  //
-  // We might want to revisit this for Tailwind CSS v5, but for now we have to
-  // make it backwards compatible.
-  //
-  // PR: https://github.com/tailwindlabs/tailwindcss/pull/19696
-  //
-  if (value.length === 0) {
-    return true
-  }
-
-  // But if there is a value remaining, it's invalid.
-  //
-  // E.g.: `tab-size-[…]-*`
-  //
-  // If we allow more characters, we can extend the validation here
-  return false
-}
diff --git a/packages/tailwindcss/src/utils/brace-expansion.test.ts b/packages/tailwindcss/src/utils/brace-expansion.test.ts
index bab93ac43..f6d3d12f1 100644
--- a/packages/tailwindcss/src/utils/brace-expansion.test.ts
+++ b/packages/tailwindcss/src/utils/brace-expansion.test.ts
@@ -14,14 +14,13 @@ describe('expand(…)', () => {
     ['a/{0..5}/b', ['a/0/b', 'a/1/b', 'a/2/b', 'a/3/b', 'a/4/b', 'a/5/b']],
     ['a/{-5..0}/b', ['a/-5/b', 'a/-4/b', 'a/-3/b', 'a/-2/b', 'a/-1/b', 'a/0/b']],
     ['a/{0..-5}/b', ['a/0/b', 'a/-1/b', 'a/-2/b', 'a/-3/b', 'a/-4/b', 'a/-5/b']],
-    ['a/{0..10..5}/b', ['a/0/b', 'a/5/b', 'a/10/b']],
-    ['a/{0..10..-5}/b', ['a/10/b', 'a/5/b', 'a/0/b']],
-    ['a/{10..0..5}/b', ['a/10/b', 'a/5/b', 'a/0/b']],
-    ['a/{10..0..-5}/b', ['a/0/b', 'a/5/b', 'a/10/b']],
 
-    // Numeric range with padding (we do not support padding)
-    ['a/{00..05}/b', ['a/0/b', 'a/1/b', 'a/2/b', 'a/3/b', 'a/4/b', 'a/5/b']],
-    ['a{001..9}b', ['a1b', 'a2b', 'a3b', 'a4b', 'a5b', 'a6b', 'a7b', 'a8b', 'a9b']],
+    // Numeric range with padding
+    ['a/{00..05}/b', ['a/00/b', 'a/01/b', 'a/02/b', 'a/03/b', 'a/04/b', 'a/05/b']],
+    [
+      'a{001..9}b',
+      ['a001b', 'a002b', 'a003b', 'a004b', 'a005b', 'a006b', 'a007b', 'a008b', 'a009b'],
+    ],
 
     // Numeric range with step
     ['a/{0..5..2}/b', ['a/0/b', 'a/2/b', 'a/4/b']],
@@ -63,7 +62,7 @@ describe('expand(…)', () => {
 
     // Should not try to expand ranges with decimals
     ['{1.1..2.2}', ['1.1..2.2']],
-  ])('should expand %s (%#)', (input, expected) => {
+  ])('should expand %s', (input, expected) => {
     expect(expand(input).sort()).toEqual(expected.sort())
   })
 
diff --git a/packages/tailwindcss/src/utils/brace-expansion.ts b/packages/tailwindcss/src/utils/brace-expansion.ts
index ee382cd82..95431d4c6 100644
--- a/packages/tailwindcss/src/utils/brace-expansion.ts
+++ b/packages/tailwindcss/src/utils/brace-expansion.ts
@@ -72,19 +72,31 @@ function expandSequence(seq: string): string[] {
     let startNum = parseInt(start, 10)
     let endNum = parseInt(end, 10)
 
+    // Determine padding length (if any) but don't count the sign as length
+    let padLength = Math.max(start.replace(/^-/, '').length, end.replace(/^-/, '').length)
+
     if (step === undefined) {
       step = startNum <= endNum ? 1 : -1
     }
     if (step === 0) {
       throw new Error('Step cannot be zero in sequence expansion.')
     }
-
-    let increasing = startNum < endNum
-    if (increasing && step < 0) step = -step
-    if (!increasing && step > 0) step = -step
-
-    for (let i = startNum; increasing ? i <= endNum : i >= endNum; i += step) {
-      result.push(i.toString())
+    if (step > 0) {
+      for (let i = startNum; i <= endNum; i += step) {
+        let numStr = i.toString()
+        if (numStr.length < padLength) {
+          numStr = numStr.padStart(padLength, '0')
+        }
+        result.push(numStr)
+      }
+    } else {
+      for (let i = startNum; i >= endNum; i += step) {
+        let numStr = i.toString()
+        if (numStr.length < padLength) {
+          numStr = numStr.padStart(padLength, '0')
+        }
+        result.push(numStr)
+      }
     }
   }
   return result
diff --git a/packages/tailwindcss/src/utils/compare-breakpoints.ts b/packages/tailwindcss/src/utils/compare-breakpoints.ts
index 4eb562764..08e97998e 100644
--- a/packages/tailwindcss/src/utils/compare-breakpoints.ts
+++ b/packages/tailwindcss/src/utils/compare-breakpoints.ts
@@ -25,7 +25,7 @@ export function compareBreakpoints(a: string, z: string, direction: 'asc' | 'des
     // Compare by bucket name
     (aBucket === zBucket ? 0 : aBucket < zBucket ? -1 : 1) ||
     // If bucket names are the same, compare by value
-    (direction === 'asc' ? parseFloat(a) - parseFloat(z) : parseFloat(z) - parseFloat(a))
+    (direction === 'asc' ? parseInt(a) - parseInt(z) : parseInt(z) - parseInt(a))
 
   // If the groups are the same, and the contents are not numbers, the
   // `order` will result in `NaN`. In this case, we want to make sorting
diff --git a/packages/tailwindcss/src/utils/decode-arbitrary-value.test.ts b/packages/tailwindcss/src/utils/decode-arbitrary-value.test.ts
index 0bc4d425c..2dccd897f 100644
--- a/packages/tailwindcss/src/utils/decode-arbitrary-value.test.ts
+++ b/packages/tailwindcss/src/utils/decode-arbitrary-value.test.ts
@@ -84,28 +84,6 @@ describe('adds spaces around math operators', () => {
     ['calc(theme(spacing.foo-2))', 'calc(theme(spacing.foo-2))'],
     ['calc(theme(spacing.foo-bar))', 'calc(theme(spacing.foo-bar))'],
 
-    // With percentages
-    ['calc(100%-var(--foo))', 'calc(100% - var(--foo))'],
-
-    // With uppercase units
-    ['calc(100PX-theme(spacing.1))', 'calc(100PX - theme(spacing.1))'],
-
-    // Preserving CSS keyword tokens like fit-content without splitting around hyphens in complex expressions
-    ['min(fit-content,calc(100dvh-4rem))', 'min(fit-content, calc(100dvh - 4rem))'],
-    [
-      'min(theme(spacing.foo-bar),fit-content,calc(20*calc(40-30)))',
-      'min(theme(spacing.foo-bar), fit-content, calc(20 * calc(40 - 30)))',
-    ],
-    [
-      'min(fit-content,calc(100dvh-4rem)-calc(50dvh--2px))',
-      'min(fit-content, calc(100dvh - 4rem) - calc(50dvh - -2px))',
-    ],
-    ['min(-3.4e-2-var(--foo),calc-size(auto))', 'min(-3.4e-2 - var(--foo), calc-size(auto))'],
-    [
-      'clamp(-10e3-var(--foo),calc-size(max-content),var(--foo)+-10e3)',
-      'clamp(-10e3 - var(--foo), calc-size(max-content), var(--foo) + -10e3)',
-    ],
-
     // A negative number immediately after a `,` should not have spaces inserted
     ['clamp(-3px+4px,-3px+4px,-3px+4px)', 'clamp(-3px + 4px, -3px + 4px, -3px + 4px)'],
 
@@ -115,12 +93,6 @@ describe('adds spaces around math operators', () => {
     // Prevent formatting inside `env()` functions
     ['calc(env(safe-area-inset-bottom)*2)', 'calc(env(safe-area-inset-bottom) * 2)'],
 
-    // Handle dashed functions that look like known dashed idents
-    [
-      'fit-content(min(max-content,max(min-content,calc(20px+1em))))',
-      'fit-content(min(max-content, max(min-content, calc(20px + 1em))))',
-    ],
-
     // Should format inside `calc()` nested in `env()`
     [
       'env(safe-area-inset-bottom,calc(10px+20px))',
@@ -150,7 +122,7 @@ describe('adds spaces around math operators', () => {
 
     // round(…) function
     ['round(1+2,1+3)', 'round(1 + 2, 1 + 3)'],
-    ['round(to-zero,1+2,1+3)', 'round(to-zero, 1 + 2, 1 + 3)'],
+    ['round(to-zero,1+2,1+3)', 'round(to-zero,1 + 2, 1 + 3)'],
 
     // Nested parens in non-math functions don't format their contents
     ['env((safe-area-inset-bottom))', 'env((safe-area-inset-bottom))'],
diff --git a/packages/tailwindcss/src/utils/dimensions.ts b/packages/tailwindcss/src/utils/dimensions.ts
deleted file mode 100644
index 7d647ffe0..000000000
--- a/packages/tailwindcss/src/utils/dimensions.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import { DefaultMap } from '../../../tailwindcss/src/utils/default-map'
-
-const DIMENSION_REGEX = /^(?<value>[-+]?(?:\d*\.)?\d+)(?<unit>[a-z]+|%)?$/i
-
-// Parse a dimension such as `64rem` into `[64, 'rem']`.
-export const dimensions = new DefaultMap((input) => {
-  let match = DIMENSION_REGEX.exec(input)
-  if (!match) return null
-
-  let value = match.groups?.value
-  if (value === undefined) return null
-
-  let valueAsNumber = Number(value)
-  if (Number.isNaN(valueAsNumber)) return null
-
-  let unit = match.groups?.unit
-  if (unit === undefined) return [valueAsNumber, null] as const
-
-  return [valueAsNumber, unit] as const
-})
diff --git a/packages/tailwindcss/src/utils/escape.test.ts b/packages/tailwindcss/src/utils/escape.test.ts
index f4c8e1192..ff7715b9d 100644
--- a/packages/tailwindcss/src/utils/escape.test.ts
+++ b/packages/tailwindcss/src/utils/escape.test.ts
@@ -11,14 +11,4 @@ describe('unescape', () => {
   test('removes backslashes', () => {
     expect(unescape(String.raw`red-1\/2`)).toMatchInlineSnapshot(`"red-1/2"`)
   })
-
-  test('replaces out-of-range escaped code points', () => {
-    expect(
-      unescape(
-        String.raw`--Coding-Projects-CharacterMapper-Master-Workspace\d8819554-4725-4235-9d22-2d0ed572e924`,
-      ),
-    ).toMatchInlineSnapshot(
-      `"--Coding-Projects-CharacterMapper-Master-Workspace�54-4725-4235-9d22-2d0ed572e924"`,
-    )
-  })
 })
diff --git a/packages/tailwindcss/src/utils/escape.ts b/packages/tailwindcss/src/utils/escape.ts
index c430e4ad4..cbcfa62a0 100644
--- a/packages/tailwindcss/src/utils/escape.ts
+++ b/packages/tailwindcss/src/utils/escape.ts
@@ -74,24 +74,8 @@ export function escape(value: string) {
 
 export function unescape(escaped: string) {
   return escaped.replace(/\\([\dA-Fa-f]{1,6}[\t\n\f\r ]?|[\S\s])/g, (match) => {
-    if (match.length <= 2) {
-      return match[1]
-    }
-
-    let codePoint = Number.parseInt(match.slice(1).trim(), 16)
-
-    if (
-      // Invalid codepoint: https://infra.spec.whatwg.org/#code-point
-      codePoint === 0x0000 ||
-      codePoint > 0x10ffff ||
-      // Is surrogate: https://infra.spec.whatwg.org/#leading-surrogate
-      //  - A leading surrogate is a code point that is in the range U+D800 to U+DBFF, inclusive.
-      //  - A trailing surrogate is a code point that is in the range U+DC00 to U+DFFF, inclusive.
-      (codePoint >= 0xd800 && codePoint <= 0xdfff)
-    ) {
-      return '\uFFFD'
-    }
-
-    return String.fromCodePoint(codePoint)
+    return match.length > 2
+      ? String.fromCodePoint(Number.parseInt(match.slice(1).trim(), 16))
+      : match[1]
   })
 }
diff --git a/packages/tailwindcss/src/utils/infer-data-type.ts b/packages/tailwindcss/src/utils/infer-data-type.ts
index 3317572f3..85b99c6da 100644
--- a/packages/tailwindcss/src/utils/infer-data-type.ts
+++ b/packages/tailwindcss/src/utils/infer-data-type.ts
@@ -184,7 +184,7 @@ function isPercentage(value: string): boolean {
 
 /* -------------------------------------------------------------------------- */
 
-const IS_FRACTION = new RegExp(`^${HAS_NUMBER.source}\\s*/\\s*${HAS_NUMBER.source}$`)
+const IS_FRACTION = new RegExp(`^${HAS_NUMBER.source}\s*/\s*${HAS_NUMBER.source}$`)
 
 function isFraction(value: string): boolean {
   return IS_FRACTION.test(value) || hasMathFn(value)
@@ -232,10 +232,9 @@ const LENGTH_UNITS = [
 ]
 
 const IS_LENGTH = new RegExp(`^${HAS_NUMBER.source}(${LENGTH_UNITS.join('|')})$`)
-const IS_LENGTH_FN = /^(--spacing)\(/i
 
-export function isLength(value: string): boolean {
-  return IS_LENGTH.test(value) || IS_LENGTH_FN.test(value) || hasMathFn(value)
+function isLength(value: string): boolean {
+  return IS_LENGTH.test(value) || hasMathFn(value)
 }
 
 /* -------------------------------------------------------------------------- */
diff --git a/packages/tailwindcss/src/utils/is-color.ts b/packages/tailwindcss/src/utils/is-color.ts
index de7c4cbd4..e3501aa86 100644
--- a/packages/tailwindcss/src/utils/is-color.ts
+++ b/packages/tailwindcss/src/utils/is-color.ts
@@ -195,14 +195,10 @@ const NAMED_COLORS = new Set([
   'accentcolortext',
 ])
 
-const IS_COLOR_FN = /^(rgba?|hsla?|hwb|color|(ok)?(lab|lch)|light-dark|color-mix|--alpha)\(/i
+const IS_COLOR_FN = /^(rgba?|hsla?|hwb|color|(ok)?(lab|lch)|light-dark|color-mix)\(/i
 
 export function isColor(value: string): boolean {
   return (
     value.charCodeAt(0) === HASH || IS_COLOR_FN.test(value) || NAMED_COLORS.has(value.toLowerCase())
   )
 }
-
-export function isNamedColor(value: string): boolean {
-  return NAMED_COLORS.has(value.toLowerCase())
-}
diff --git a/packages/tailwindcss/src/utils/is-valid-arbitrary.ts b/packages/tailwindcss/src/utils/is-valid-arbitrary.ts
deleted file mode 100644
index 2ee433e48..000000000
--- a/packages/tailwindcss/src/utils/is-valid-arbitrary.ts
+++ /dev/null
@@ -1,93 +0,0 @@
-const BACKSLASH = 0x5c
-const OPEN_CURLY = 0x7b
-const CLOSE_CURLY = 0x7d
-const OPEN_PAREN = 0x28
-const CLOSE_PAREN = 0x29
-const OPEN_BRACKET = 0x5b
-const CLOSE_BRACKET = 0x5d
-const DOUBLE_QUOTE = 0x22
-const SINGLE_QUOTE = 0x27
-const SEMICOLON = 0x3b
-
-// This is a shared buffer that is used to keep track of the current nesting level
-// of parens, brackets, and braces. It is used to determine if a character is at
-// the top-level of a string. This is a performance optimization to avoid memory
-// allocations on every call to `segment`.
-const closingBracketStack = new Uint8Array(256)
-
-/**
- * Determine if a given string might be a valid arbitrary value.
- *
- * Unbalanced parens, brackets, and braces are not allowed. Additionally, a
- * top-level `;` is not allowed.
- *
- * This function is very similar to `segment` but `segment` cannot be used
- * because we'd need to split on a bracket stack character.
- */
-export function isValidArbitrary(input: string) {
-  // SAFETY: We can use an index into a shared buffer because this function is
-  // synchronous, non-recursive, and runs in a single-threaded environment.
-  let stackPos = 0
-  let len = input.length
-
-  for (let idx = 0; idx < len; idx++) {
-    let char = input.charCodeAt(idx)
-
-    switch (char) {
-      case BACKSLASH:
-        // The next character is escaped, so we skip it.
-        idx += 1
-        break
-      // Strings should be handled as-is until the end of the string. No need to
-      // worry about balancing parens, brackets, or curlies inside a string.
-      case SINGLE_QUOTE:
-      case DOUBLE_QUOTE:
-        // Ensure we don't go out of bounds.
-        while (++idx < len) {
-          let nextChar = input.charCodeAt(idx)
-
-          // The next character is escaped, so we skip it.
-          if (nextChar === BACKSLASH) {
-            idx += 1
-            continue
-          }
-
-          if (nextChar === char) {
-            break
-          }
-        }
-        break
-      case OPEN_PAREN:
-        closingBracketStack[stackPos] = CLOSE_PAREN
-        stackPos++
-        break
-      case OPEN_BRACKET:
-        closingBracketStack[stackPos] = CLOSE_BRACKET
-        stackPos++
-        break
-      case OPEN_CURLY:
-        // NOTE: We intentionally do not consider `{` to move the stack pointer
-        // because a candidate like `[&{color:red}]:flex` should not be valid.
-        break
-      case CLOSE_BRACKET:
-      case CLOSE_CURLY:
-      case CLOSE_PAREN:
-        if (stackPos === 0) return false
-
-        if (stackPos > 0 && char === closingBracketStack[stackPos - 1]) {
-          // SAFETY: The buffer does not need to be mutated because the stack is
-          // only ever read from or written to its current position. Its current
-          // position is only ever incremented after writing to it. Meaning that
-          // the buffer can be dirty for the next use and still be correct since
-          // reading/writing always starts at position `0`.
-          stackPos--
-        }
-        break
-      case SEMICOLON:
-        if (stackPos === 0) return false
-        break
-    }
-  }
-
-  return true
-}
diff --git a/packages/tailwindcss/src/utils/math-operators.ts b/packages/tailwindcss/src/utils/math-operators.ts
index d31cc3c52..e6e83fe79 100644
--- a/packages/tailwindcss/src/utils/math-operators.ts
+++ b/packages/tailwindcss/src/utils/math-operators.ts
@@ -1,21 +1,3 @@
-const LOWER_A = 0x61
-const LOWER_Z = 0x7a
-const UPPER_A = 0x41
-const UPPER_Z = 0x5a
-const LOWER_E = 0x65
-const UPPER_E = 0x45
-const ZERO = 0x30
-const NINE = 0x39
-const ADD = 0x2b
-const SUB = 0x2d
-const MUL = 0x2a
-const DIV = 0x2f
-const OPEN_PAREN = 0x28
-const CLOSE_PAREN = 0x29
-const COMMA = 0x2c
-const SPACE = 0x20
-const PERCENT = 0x25
-
 const MATH_FUNCTIONS = [
   'calc',
   'min',
@@ -38,6 +20,9 @@ const MATH_FUNCTIONS = [
   'round',
 ]
 
+const KNOWN_DASHED_FUNCTIONS = ['anchor-size']
+const DASHED_FUNCTIONS_REGEX = new RegExp(`(${KNOWN_DASHED_FUNCTIONS.join('|')})\\(`, 'g')
+
 export function hasMathFn(input: string) {
   return input.indexOf('(') !== -1 && MATH_FUNCTIONS.some((fn) => input.includes(`${fn}(`))
 }
@@ -48,41 +33,25 @@ export function addWhitespaceAroundMathOperators(input: string) {
     return input
   }
 
+  // Replace known functions with a placeholder
+  let hasKnownFunctions = false
+  if (KNOWN_DASHED_FUNCTIONS.some((fn) => input.includes(fn))) {
+    DASHED_FUNCTIONS_REGEX.lastIndex = 0
+    input = input.replace(DASHED_FUNCTIONS_REGEX, (_, fn) => {
+      hasKnownFunctions = true
+      return `$${KNOWN_DASHED_FUNCTIONS.indexOf(fn)}$(`
+    })
+  }
+
   let result = ''
   let formattable: boolean[] = []
 
-  let valuePos = null
-  let lastValuePos = null
-
   for (let i = 0; i < input.length; i++) {
-    let char = input.charCodeAt(i)
-
-    // Track if we see a number followed by a unit, then we know for sure that
-    // this is not a function call.
-    if (char >= ZERO && char <= NINE) {
-      valuePos = i
-    }
-
-    // If we saw a number before, and we see normal a-z character, then we
-    // assume this is a value such as `123px`
-    else if (
-      valuePos !== null &&
-      (char === PERCENT ||
-        (char >= LOWER_A && char <= LOWER_Z) ||
-        (char >= UPPER_A && char <= UPPER_Z))
-    ) {
-      valuePos = i
-    }
-
-    // Once we see something else, we reset the value position
-    else {
-      lastValuePos = valuePos
-      valuePos = null
-    }
+    let char = input[i]
 
     // Determine if we're inside a math function
-    if (char === OPEN_PAREN) {
-      result += input[i]
+    if (char === '(') {
+      result += char
 
       // Scan backwards to determine the function name. This assumes math
       // functions are named with lowercase alphanumeric characters.
@@ -91,9 +60,9 @@ export function addWhitespaceAroundMathOperators(input: string) {
       for (let j = i - 1; j >= 0; j--) {
         let inner = input.charCodeAt(j)
 
-        if (inner >= ZERO && inner <= NINE) {
+        if (inner >= 48 && inner <= 57) {
           start = j // 0-9
-        } else if (inner >= LOWER_A && inner <= LOWER_Z) {
+        } else if (inner >= 97 && inner <= 122) {
           start = j // a-z
         } else {
           break
@@ -122,84 +91,76 @@ export function addWhitespaceAroundMathOperators(input: string) {
 
     // We've exited the function so format according to the parent function's
     // type.
-    else if (char === CLOSE_PAREN) {
-      result += input[i]
+    else if (char === ')') {
+      result += char
       formattable.shift()
     }
 
     // Add spaces after commas in math functions
-    else if (char === COMMA && formattable[0]) {
+    else if (char === ',' && formattable[0]) {
       result += `, `
       continue
     }
 
     // Skip over consecutive whitespace
-    else if (char === SPACE && formattable[0] && result.charCodeAt(result.length - 1) === SPACE) {
+    else if (char === ' ' && formattable[0] && result[result.length - 1] === ' ') {
       continue
     }
 
     // Add whitespace around operators inside math functions
-    else if ((char === ADD || char === MUL || char === DIV || char === SUB) && formattable[0]) {
+    else if ((char === '+' || char === '*' || char === '/' || char === '-') && formattable[0]) {
       let trimmed = result.trimEnd()
-      let prev = trimmed.charCodeAt(trimmed.length - 1)
-      let prevPrev = trimmed.charCodeAt(trimmed.length - 2)
-      let next = input.charCodeAt(i + 1)
-
-      // Do not add spaces for scientific notation, e.g.: `-3.4e-2`
-      if ((prev === LOWER_E || prev === UPPER_E) && prevPrev >= ZERO && prevPrev <= NINE) {
-        result += input[i]
-        continue
-      }
+      let prev = trimmed[trimmed.length - 1]
 
       // If we're preceded by an operator don't add spaces
-      else if (prev === ADD || prev === MUL || prev === DIV || prev === SUB) {
-        result += input[i]
+      if (prev === '+' || prev === '*' || prev === '/' || prev === '-') {
+        result += char
         continue
       }
 
       // If we're at the beginning of an argument don't add spaces
-      else if (prev === OPEN_PAREN || prev === COMMA) {
-        result += input[i]
+      else if (prev === '(' || prev === ',') {
+        result += char
         continue
       }
 
       // Add spaces only after the operator if we already have spaces before it
-      else if (input.charCodeAt(i - 1) === SPACE) {
-        result += `${input[i]} `
+      else if (input[i - 1] === ' ') {
+        result += `${char} `
       }
 
-      // Add spaces around the operator, if...
-      else if (
-        // Previous is a digit
-        (prev >= ZERO && prev <= NINE) ||
-        // Next is a digit
-        (next >= ZERO && next <= NINE) ||
-        // Previous is end of a function call (or parenthesized expression)
-        prev === CLOSE_PAREN ||
-        // Next is start of a parenthesized expression
-        next === OPEN_PAREN ||
-        // Next is an operator
-        next === ADD ||
-        next === MUL ||
-        next === DIV ||
-        next === SUB ||
-        // Previous position was a value (+ unit)
-        (lastValuePos !== null && lastValuePos === i - 1)
-      ) {
-        result += ` ${input[i]} `
-      }
-
-      // Everything else
+      // Add spaces around the operator
       else {
-        result += input[i]
+        result += ` ${char} `
       }
     }
 
+    // Skip over `to-zero` when in a math function.
+    //
+    // This is specifically to handle this value in the round(…) function:
+    //
+    // ```
+    // round(to-zero, 1px)
+    //       ^^^^^^^
+    // ```
+    //
+    // This is because the first argument is optionally a keyword and `to-zero`
+    // contains a hyphen and we want to avoid adding spaces inside it.
+    else if (formattable[0] && input.startsWith('to-zero', i)) {
+      let start = i
+      i += 7
+      result += input.slice(start, i + 1)
+    }
+
     // Handle all other characters
     else {
-      result += input[i]
+      result += char
     }
   }
 
+  if (hasKnownFunctions) {
+    return result.replace(/\$(\d+)\$/g, (fn, idx) => KNOWN_DASHED_FUNCTIONS[idx] ?? fn)
+  }
+
   return result
 }
diff --git a/packages/tailwindcss/src/utils/replace-object.ts b/packages/tailwindcss/src/utils/replace-object.ts
deleted file mode 100644
index b4fc993fa..000000000
--- a/packages/tailwindcss/src/utils/replace-object.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export function replaceObject<T extends object, U extends object | null>(target: T, source: U): U {
-  // Clear out the target object, otherwise inspecting the final object will
-  // look very confusing.
-  for (let key in target) delete target[key]
-
-  return Object.assign(target, source)
-}
diff --git a/packages/tailwindcss/src/utils/replace-shadow-colors.test.ts b/packages/tailwindcss/src/utils/replace-shadow-colors.test.ts
index 701e80f05..3b1e90ba6 100644
--- a/packages/tailwindcss/src/utils/replace-shadow-colors.test.ts
+++ b/packages/tailwindcss/src/utils/replace-shadow-colors.test.ts
@@ -1,141 +1,49 @@
-import { describe, expect, it } from 'vitest'
-import { cartesian } from '../cartesian'
-import { replaceAlpha } from '../utilities'
+import { expect, it } from 'vitest'
 import { replaceShadowColors } from './replace-shadow-colors'
 
-describe('without replacer', () => {
-  let replacer = (color: string) => `var(--tw-shadow-color, ${color})`
+const table = [
+  {
+    input: 'var(--my-shadow)',
+    output: 'var(--my-shadow)',
+  },
+  {
+    input: '1px var(--my-shadow)',
+    output: '1px var(--my-shadow)',
+  },
+  {
+    input: '1px 1px var(--my-color)',
+    output: '1px 1px var(--tw-shadow-color, var(--my-color))',
+  },
+  {
+    input: '0 0 0 var(--my-color)',
+    output: '0 0 0 var(--tw-shadow-color, var(--my-color))',
+  },
+  {
+    input: '1px 2px',
+    output: '1px 2px var(--tw-shadow-color, currentcolor)',
+  },
+  {
+    input: '1px 2px 3px',
+    output: '1px 2px 3px var(--tw-shadow-color, currentcolor)',
+  },
+  {
+    input: '1px 2px 3px 4px',
+    output: '1px 2px 3px 4px var(--tw-shadow-color, currentcolor)',
+  },
+  {
+    input: ['var(--my-shadow)', '1px 1px var(--my-color)', '0 0 1px var(--my-color)'].join(', '),
+    output: [
+      'var(--my-shadow)',
+      '1px 1px var(--tw-shadow-color, var(--my-color))',
+      '0 0 1px var(--tw-shadow-color, var(--my-color))',
+    ].join(', '),
+  },
+]
 
-  it('should handle var shadow', () => {
-    let parsed = replaceShadowColors('var(--my-shadow)', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"var(--my-shadow)"`)
-  })
-
-  it('should handle var shadow with offset', () => {
-    let parsed = replaceShadowColors('1px var(--my-shadow)', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"1px var(--my-shadow)"`)
-  })
-
-  it('should handle var color with offsets', () => {
-    let parsed = replaceShadowColors('1px 1px var(--my-color)', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"1px 1px var(--tw-shadow-color, var(--my-color))"`)
-  })
-
-  it('should handle var color with zero offsets', () => {
-    let parsed = replaceShadowColors('0 0 0 var(--my-color)', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"0 0 0 var(--tw-shadow-color, var(--my-color))"`)
-  })
-
-  it('should handle two values with currentcolor', () => {
-    let parsed = replaceShadowColors('1px 2px', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"1px 2px var(--tw-shadow-color, currentcolor)"`)
-  })
-
-  it('should handle three values with currentcolor', () => {
-    let parsed = replaceShadowColors('1px 2px 3px', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"1px 2px 3px var(--tw-shadow-color, currentcolor)"`)
-  })
-
-  it('should handle four values with currentcolor', () => {
-    let parsed = replaceShadowColors('1px 2px 3px 4px', replacer)
-    expect(parsed).toMatchInlineSnapshot(`"1px 2px 3px 4px var(--tw-shadow-color, currentcolor)"`)
-  })
-
-  it('should find the color regardless of its position', () => {
-    for (let [x, y, blur, spread, color] of cartesian(
-      ['calc(var(--spacing) * 1)', '1', '--spacing(1)'], // x
-      ['calc(var(--spacing) * 2)', '2', '--spacing(2)'], // y
-      ['calc(var(--spacing) * 3)', '3', '--spacing(3)'], // blur
-      ['calc(var(--spacing) * 4)', '4', '--spacing(4)'], // spread
-      ['black', 'rgb(0, 0, 0)', '#000', '--alpha(var(--color) / 50%)', 'var(--uknown-color)'], // color
-    )) {
-      let expectedColor = `var(--tw-shadow-color, ${color})`
-
-      {
-        let input = `${x} ${color} ${y} ${blur} ${spread}`
-        expect(replaceShadowColors(input, replacer)).toEqual(input.replace(color, expectedColor))
-      }
-
-      {
-        let input = `${x} ${y} ${color} ${blur} ${spread}`
-        expect(replaceShadowColors(input, replacer)).toEqual(input.replace(color, expectedColor))
-      }
-
-      {
-        let input = `${x} ${y} ${blur} ${color} ${spread}`
-        expect(replaceShadowColors(input, replacer)).toEqual(input.replace(color, expectedColor))
-      }
-    }
-  })
-
-  // When using `var(…)`, we don't know the types of the used variables, but we
-  // might be able to find the color itself.
-  it.each([
-    'black', // Named color
-    '#000', // Hex color
-    'rgb(0, 0, 0)', // Color functions
-    '--alpha(var(--color) / 50%)', // Known custom functions
-  ])('should find the color (%s)', (color) => {
-    let expectedColor = `var(--tw-shadow-color, ${color})`
-
-    {
-      let input = `var(--x) var(--y) ${color}`
-      expect(replaceShadowColors(input, replacer)).toEqual(input.replace(color, expectedColor))
-    }
-
-    {
-      let input = `var(--x) var(--y) var(--blur) ${color}`
-      expect(replaceShadowColors(input, replacer)).toEqual(input.replace(color, expectedColor))
-    }
-
-    {
-      let input = `var(--x) var(--y) var(--blur) var(--spread) ${color}`
-      expect(replaceShadowColors(input, replacer)).toEqual(input.replace(color, expectedColor))
-    }
-  })
-
-  it('should handle multiple shadows', () => {
-    let parsed = replaceShadowColors(
-      ['var(--my-shadow)', '1px 1px var(--my-color)', '0 0 1px var(--my-color)'].join(', '),
-      replacer,
-    )
-    expect(parsed).toMatchInlineSnapshot(
-      `"var(--my-shadow), 1px 1px var(--tw-shadow-color, var(--my-color)), 0 0 1px var(--tw-shadow-color, var(--my-color))"`,
-    )
-  })
-})
-
-describe('with replacer', () => {
-  let replacer = (color: string) => `var(--tw-shadow-color, ${replaceAlpha(color, '50%')})`
-
-  it('should handle var color with intensity', () => {
-    let parsed = replaceShadowColors('1px 1px var(--my-color)', replacer)
-    expect(parsed).toMatchInlineSnapshot(
-      `"1px 1px var(--tw-shadow-color, oklab(from var(--my-color) l a b / 50%))"`,
-    )
-  })
-
-  it('should handle box-shadow with intensity', () => {
-    let parsed = replaceShadowColors('1px 1px var(--my-color)', replacer)
-    expect(parsed).toMatchInlineSnapshot(
-      `"1px 1px var(--tw-shadow-color, oklab(from var(--my-color) l a b / 50%))"`,
-    )
-  })
-
-  it('should handle four values with intensity and no color value', () => {
-    let parsed = replaceShadowColors('1px 2px 3px 4px', replacer)
-    expect(parsed).toMatchInlineSnapshot(
-      `"1px 2px 3px 4px var(--tw-shadow-color, oklab(from currentcolor l a b / 50%))"`,
-    )
-  })
-
-  it('should handle multiple shadows with intensity', () => {
-    let parsed = replaceShadowColors(
-      ['var(--my-shadow)', '1px 1px var(--my-color)', '0 0 1px var(--my-color)'].join(', '),
-      replacer,
-    )
-    expect(parsed).toMatchInlineSnapshot(
-      `"var(--my-shadow), 1px 1px var(--tw-shadow-color, oklab(from var(--my-color) l a b / 50%)), 0 0 1px var(--tw-shadow-color, oklab(from var(--my-color) l a b / 50%))"`,
-    )
-  })
-})
+it.each(table)(
+  'should replace the color of box-shadow $input with $output',
+  ({ input, output }) => {
+    let parsed = replaceShadowColors(input, (color) => `var(--tw-shadow-color, ${color})`)
+    expect(parsed).toEqual(output)
+  },
+)
diff --git a/packages/tailwindcss/src/utils/replace-shadow-colors.ts b/packages/tailwindcss/src/utils/replace-shadow-colors.ts
index 5f9e0264c..e51f9c2a0 100644
--- a/packages/tailwindcss/src/utils/replace-shadow-colors.ts
+++ b/packages/tailwindcss/src/utils/replace-shadow-colors.ts
@@ -1,134 +1,47 @@
-import * as ValueParser from '../value-parser'
-import { walk, WalkAction } from '../walk'
-import { isNamedColor } from './is-color'
 import { segment } from './segment'
 
 const KEYWORDS = new Set(['inset', 'inherit', 'initial', 'revert', 'unset'])
-const LENGTH_FUNCTIONS = new Set(['calc', 'clamp', 'max', 'min', '--spacing'])
-const COLOR_FUNCTIONS = new Set([
-  'color',
-  'color-mix',
-  'contrast-color',
-  'device-cmyk',
-  'hsl',
-  'hsla',
-  'hwb',
-  'lab',
-  'lch',
-  'light-dark',
-  'oklab',
-  'oklch',
-  'rgb',
-  'rgba',
-  '--alpha',
-])
-const LENGTH = /^-?(\d+|\.\d+)(.*?)$/
+const LENGTH = /^-?(\d+|\.\d+)(.*?)$/g
 
 export function replaceShadowColors(input: string, replacement: (color: string) => string) {
-  function replaceAst(node: ValueParser.ValueAstNode): ValueParser.ValueAstNode[] {
-    let color = ValueParser.toCss([node])
-    let updatedColor = replacement(color)
-    let ast = ValueParser.parse(updatedColor)
-    return ast
-  }
-
   let shadows = segment(input, ',').map((shadow) => {
     shadow = shadow.trim()
-    let ast = ValueParser.parse(shadow)
+    let parts = segment(shadow, ' ').filter((part) => part.trim() !== '')
+    let color = null
+    let offsetX = null
+    let offsetY = null
 
-    let unknown: ValueParser.ValueAstNode | null = null
-    let unknowns = 0
-    let lengths = 0
-    let replaced = false
-
-    walk(ast, (node) => {
-      switch (node.kind) {
-        case 'word': {
-          // Skip known keywords
-          if (KEYWORDS.has(node.value.toLowerCase())) {
-            return WalkAction.Continue
-          }
-
-          // Must be a length
-          if (LENGTH.test(node.value.toLowerCase())) {
-            lengths++
-            return WalkAction.Continue
-          }
-
-          // Must be a color
-          if (node.value[0] === '#' || isNamedColor(node.value)) {
-            replaced = true
-            return WalkAction.ReplaceStop(replaceAst(node))
-          }
-
-          // We're not sure yet
-          unknown = node
-          unknowns++
-          break
+    for (let part of parts) {
+      if (KEYWORDS.has(part)) {
+        continue
+      } else if (LENGTH.test(part)) {
+        if (offsetX === null) {
+          offsetX = part
+        } else if (offsetY === null) {
+          offsetY = part
         }
 
-        case 'function': {
-          // Must be a color
-          if (COLOR_FUNCTIONS.has(node.value.toLowerCase())) {
-            replaced = true
-            return WalkAction.ReplaceStop(replaceAst(node))
-          }
-
-          // Must be a length
-          if (LENGTH_FUNCTIONS.has(node.value.toLowerCase())) {
-            lengths++
-            return WalkAction.Skip
-          }
-
-          // We're not sure yet
-          unknown = node
-          unknowns++
-
-          // We're not interested in the arguments of the function
-          return WalkAction.Skip
-        }
-
-        // Ignore separators
-        case 'separator':
-          return WalkAction.Continue
-
-        default:
-          node satisfies never
+        // Reset index, since the regex is stateful.
+        LENGTH.lastIndex = 0
+      } else if (color === null) {
+        color = part
       }
-    })
-
-    // We definitely found a color, nothing else to do
-    if (replaced) {
-      return ValueParser.toCss(ast)
     }
 
     // If the x and y offsets were not detected, the shadow is either invalid or
     // using a variable to represent more than one field in the shadow value, so
     // we can't know what to replace.
-    if (lengths < 2) {
-      return shadow
-    }
+    if (offsetX === null || offsetY === null) return shadow
 
+    let replacementColor = replacement(color ?? 'currentcolor')
+
+    if (color !== null) {
+      // If a color was found, replace the color.
+      return shadow.replace(color, replacementColor)
+    }
     // If no color was found, assume the shadow is relying on the browser
     // default shadow color and append the replacement color.
-    if (unknowns === 0) {
-      return `${shadow} ${replacement('currentcolor')}`
-    }
-
-    // A single left-over, we assume that this is the color
-    if (unknowns === 1) {
-      walk(ast, (node) => {
-        if (node === unknown) {
-          replaced = true
-          return WalkAction.ReplaceStop(replaceAst(node))
-        }
-
-        // Keep the walk top-level only, no need to go into functions
-        return WalkAction.Skip
-      })
-    }
-
-    return replaced ? ValueParser.toCss(ast) : shadow
+    return `${shadow} ${replacementColor}`
   })
 
   return shadows.join(', ')
diff --git a/packages/tailwindcss/src/utils/topological-sort.ts b/packages/tailwindcss/src/utils/topological-sort.ts
deleted file mode 100644
index ae20da4aa..000000000
--- a/packages/tailwindcss/src/utils/topological-sort.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-export function topologicalSort<Key>(
-  graph: Map<Key, Set<Key>>,
-  options: { onCircularDependency: (path: Key[], start: Key) => void },
-): Key[] {
-  let seen = new Set<Key>()
-  let wip = new Set<Key>()
-
-  let sorted: Key[] = []
-
-  function visit(node: Key, path: Key[] = []) {
-    if (!graph.has(node)) return
-    if (seen.has(node)) return
-
-    // Circular dependency detected
-    if (wip.has(node)) options.onCircularDependency?.(path, node)
-
-    wip.add(node)
-
-    for (let dependency of graph.get(node) ?? []) {
-      path.push(node)
-      visit(dependency, path)
-      path.pop()
-    }
-
-    seen.add(node)
-    wip.delete(node)
-
-    sorted.push(node)
-  }
-
-  for (let node of graph.keys()) {
-    visit(node)
-  }
-
-  return sorted
-}
diff --git a/packages/tailwindcss/src/utils/variables.ts b/packages/tailwindcss/src/utils/variables.ts
index b72987565..d19743413 100644
--- a/packages/tailwindcss/src/utils/variables.ts
+++ b/packages/tailwindcss/src/utils/variables.ts
@@ -1,23 +1,17 @@
 import * as ValueParser from '../value-parser'
-import { walk, WalkAction } from '../walk'
-import { DefaultMap } from './default-map'
 
-let extractUsedVariablesCache = new DefaultMap((raw) => {
+export function extractUsedVariables(raw: string): string[] {
   let variables: string[] = []
-  walk(ValueParser.parse(raw), (node) => {
+  ValueParser.walk(ValueParser.parse(raw), (node) => {
     if (node.kind !== 'function' || node.value !== 'var') return
 
-    walk(node.nodes, (child) => {
+    ValueParser.walk(node.nodes, (child) => {
       if (child.kind !== 'word' || child.value[0] !== '-' || child.value[1] !== '-') return
 
       variables.push(child.value)
     })
 
-    return WalkAction.Skip
+    return ValueParser.ValueWalkAction.Skip
   })
   return variables
-})
-
-export function extractUsedVariables(raw: string): string[] {
-  return extractUsedVariablesCache.get(raw)
 }
diff --git a/packages/tailwindcss/src/value-parser.test.ts b/packages/tailwindcss/src/value-parser.test.ts
index f12949505..e1e64832c 100644
--- a/packages/tailwindcss/src/value-parser.test.ts
+++ b/packages/tailwindcss/src/value-parser.test.ts
@@ -1,6 +1,5 @@
 import { describe, expect, it } from 'vitest'
-import { parse, toCss } from './value-parser'
-import { walk, WalkAction } from './walk'
+import { parse, toCss, walk } from './value-parser'
 
 describe('parse', () => {
   it('should parse a value', () => {
@@ -90,7 +89,7 @@ describe('parse', () => {
         value: 'theme',
         nodes: [
           { kind: 'word', value: 'colors.red.500' },
-          { kind: 'word', value: '/' },
+          { kind: 'separator', value: '/' },
           { kind: 'function', value: 'var', nodes: [{ kind: 'word', value: '--opacity' }] },
         ],
       },
@@ -166,22 +165,6 @@ describe('parse', () => {
       },
     ])
   })
-
-  it('should not error when extra `)` was passed', () => {
-    expect(parse('calc(1 + 2))')).toEqual([
-      {
-        kind: 'function',
-        value: 'calc',
-        nodes: [
-          { kind: 'word', value: '1' },
-          { kind: 'separator', value: ' ' },
-          { kind: 'word', value: '+' },
-          { kind: 'separator', value: ' ' },
-          { kind: 'word', value: '2' },
-        ],
-      },
-    ])
-  })
 })
 
 describe('toCss', () => {
@@ -208,9 +191,9 @@ describe('walk', () => {
   it('can be used to replace a function call', () => {
     const ast = parse('(min-width: 600px) and (max-width: theme(lg))')
 
-    walk(ast, (node) => {
+    walk(ast, (node, { replaceWith }) => {
       if (node.kind === 'function' && node.value === 'theme') {
-        return WalkAction.Replace({ kind: 'word', value: '64rem' } as const)
+        replaceWith({ kind: 'word', value: '64rem' })
       }
     })
 
diff --git a/packages/tailwindcss/src/value-parser.ts b/packages/tailwindcss/src/value-parser.ts
index c9f41f809..5d111bce2 100644
--- a/packages/tailwindcss/src/value-parser.ts
+++ b/packages/tailwindcss/src/value-parser.ts
@@ -15,8 +15,9 @@ export type ValueSeparatorNode = {
 }
 
 export type ValueAstNode = ValueWordNode | ValueFunctionNode | ValueSeparatorNode
+type ValueParentNode = ValueFunctionNode | null
 
-export function word(value: string): ValueWordNode {
+function word(value: string): ValueWordNode {
   return {
     kind: 'word',
     value,
@@ -38,6 +39,82 @@ function separator(value: string): ValueSeparatorNode {
   }
 }
 
+export const enum ValueWalkAction {
+  /** Continue walking, which is the default */
+  Continue,
+
+  /** Skip visiting the children of this node */
+  Skip,
+
+  /** Stop the walk entirely */
+  Stop,
+}
+
+export function walk(
+  ast: ValueAstNode[],
+  visit: (
+    node: ValueAstNode,
+    utils: {
+      parent: ValueParentNode
+      replaceWith(newNode: ValueAstNode | ValueAstNode[]): void
+    },
+  ) => void | ValueWalkAction,
+  parent: ValueParentNode = null,
+) {
+  for (let i = 0; i < ast.length; i++) {
+    let node = ast[i]
+    let replacedNode = false
+    let replacedNodeOffset = 0
+    let status =
+      visit(node, {
+        parent,
+        replaceWith(newNode) {
+          if (replacedNode) return
+          replacedNode = true
+
+          if (Array.isArray(newNode)) {
+            if (newNode.length === 0) {
+              ast.splice(i, 1)
+              replacedNodeOffset = 0
+            } else if (newNode.length === 1) {
+              ast[i] = newNode[0]
+              replacedNodeOffset = 1
+            } else {
+              ast.splice(i, 1, ...newNode)
+              replacedNodeOffset = newNode.length
+            }
+          } else {
+            ast[i] = newNode
+          }
+        },
+      }) ?? ValueWalkAction.Continue
+
+    // We want to visit or skip the newly replaced node(s), which start at the
+    // current index (i). By decrementing the index here, the next loop will
+    // process this position (containing the replaced node) again.
+    if (replacedNode) {
+      if (status === ValueWalkAction.Continue) {
+        i--
+      } else {
+        i += replacedNodeOffset - 1
+      }
+      continue
+    }
+
+    // Stop the walk entirely
+    if (status === ValueWalkAction.Stop) return ValueWalkAction.Stop
+
+    // Skip visiting the children of this node
+    if (status === ValueWalkAction.Skip) continue
+
+    if (node.kind === 'function') {
+      if (walk(node.nodes, visit, node) === ValueWalkAction.Stop) {
+        return ValueWalkAction.Stop
+      }
+    }
+  }
+}
+
 export function toCss(ast: ValueAstNode[]) {
   let css = ''
   for (const node of ast) {
@@ -95,33 +172,6 @@ export function parse(input: string) {
         break
       }
 
-      // Typically for math operators, they have to have spaces around them. But
-      // there are situations in `theme(colors.red.500/10)` where we use `/`
-      // without spaces. Let's make sure this is a separate word as well.
-      case SLASH: {
-        // 1. Handle everything before the separator as a word
-        // Handle everything before the closing paren as a word
-        if (buffer.length > 0) {
-          let node = word(buffer)
-          if (parent) {
-            parent.nodes.push(node)
-          } else {
-            ast.push(node)
-          }
-          buffer = ''
-        }
-
-        // 2. Track the `/` as a word on its own
-        let node = word(input[i])
-        if (parent) {
-          parent.nodes.push(node)
-        } else {
-          ast.push(node)
-        }
-
-        break
-      }
-
       // Space and commas are bundled into separators
       //
       // E.g.:
@@ -136,6 +186,7 @@ export function parse(input: string) {
       case GREATER_THAN:
       case LESS_THAN:
       case NEWLINE:
+      case SLASH:
       case SPACE:
       case TAB: {
         // 1. Handle everything before the separator as a word
@@ -162,6 +213,7 @@ export function parse(input: string) {
             peekChar !== GREATER_THAN &&
             peekChar !== LESS_THAN &&
             peekChar !== NEWLINE &&
+            peekChar !== SLASH &&
             peekChar !== SPACE &&
             peekChar !== TAB
           ) {
@@ -250,7 +302,7 @@ export function parse(input: string) {
         // Handle everything before the closing paren a word
         if (buffer.length > 0) {
           let node = word(buffer)
-          tail?.nodes.push(node)
+          tail!.nodes.push(node)
           buffer = ''
         }
 
diff --git a/packages/tailwindcss/src/variants.test.ts b/packages/tailwindcss/src/variants.test.ts
index 37f9ebbea..5f4f2401c 100644
--- a/packages/tailwindcss/src/variants.test.ts
+++ b/packages/tailwindcss/src/variants.test.ts
@@ -1,148 +1,112 @@
+import dedent from 'dedent'
 import { expect, test } from 'vitest'
 import createPlugin from './plugin'
-import { run } from './test-utils/run'
+import { compileCss, run } from './test-utils/run'
 import { Compounds, compoundsForSelectors } from './variants'
 
 const css = String.raw
 
 test('*', async () => {
   expect(await run(['*:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(.\\*\\:flex > *) {
+    ":is(.\\*\\:flex > *) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['*/foo:flex'])).toEqual('')
 })
 
 test('**', async () => {
   expect(await run(['**:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(.\\*\\*\\:flex *) {
+    ":is(.\\*\\*\\:flex *) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['**/foo:flex'])).toEqual('')
 })
 
 test('first-letter', async () => {
   expect(await run(['first-letter:flex'])).toMatchInlineSnapshot(`
-    "
-    .first-letter\\:flex:first-letter {
+    ".first-letter\\:flex:first-letter {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['first-letter/foo:flex'])).toEqual('')
 })
 
 test('first-line', async () => {
   expect(await run(['first-line:flex'])).toMatchInlineSnapshot(`
-    "
-    .first-line\\:flex:first-line {
+    ".first-line\\:flex:first-line {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['first-line/foo:flex'])).toEqual('')
 })
 
 test('marker', async () => {
   expect(await run(['marker:flex'])).toMatchInlineSnapshot(`
-    "
-    .marker\\:flex ::marker {
+    ".marker\\:flex ::marker {
       display: flex;
     }
 
     .marker\\:flex::marker {
       display: flex;
-    }
-
-    .marker\\:flex ::-webkit-details-marker {
-      display: flex;
-    }
-
-    .marker\\:flex::-webkit-details-marker {
-      display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['marker/foo:flex'])).toEqual('')
 })
 
 test('selection', async () => {
   expect(await run(['selection:flex'])).toMatchInlineSnapshot(`
-    "
-    .selection\\:flex ::selection {
+    ".selection\\:flex ::selection {
       display: flex;
     }
 
     .selection\\:flex::selection {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['selection/foo:flex'])).toEqual('')
 })
 
 test('file', async () => {
   expect(await run(['file:flex'])).toMatchInlineSnapshot(`
-    "
-    .file\\:flex::file-selector-button {
+    ".file\\:flex::file-selector-button {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['file/foo:flex'])).toEqual('')
 })
 
 test('placeholder', async () => {
   expect(await run(['placeholder:flex'])).toMatchInlineSnapshot(`
-    "
-    .placeholder\\:flex::placeholder {
+    ".placeholder\\:flex::placeholder {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['placeholder/foo:flex'])).toEqual('')
 })
 
 test('backdrop', async () => {
   expect(await run(['backdrop:flex'])).toMatchInlineSnapshot(`
-    "
-    .backdrop\\:flex::backdrop {
+    ".backdrop\\:flex::backdrop {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['backdrop/foo:flex'])).toEqual('')
 })
 
 test('details-content', async () => {
   expect(await run(['details-content:flex'])).toMatchInlineSnapshot(`
-    "
-    .details-content\\:flex::details-content {
+    ".details-content\\:flex::details-content {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['details-content/foo:flex'])).toEqual('')
 })
 
 test('before', async () => {
   expect(await run(['before:flex'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-content: "";
-        }
-      }
-    }
-
-    .before\\:flex:before {
+    ".before\\:flex:before {
       content: var(--tw-content);
       display: flex;
     }
@@ -151,24 +115,14 @@ test('before', async () => {
       syntax: "*";
       inherits: false;
       initial-value: "";
-    }
-    "
+    }"
   `)
   expect(await run(['before/foo:flex'])).toEqual('')
 })
 
 test('after', async () => {
   expect(await run(['after:flex'])).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-content: "";
-        }
-      }
-    }
-
-    .after\\:flex:after {
+    ".after\\:flex:after {
       content: var(--tw-content);
       display: flex;
     }
@@ -177,63 +131,52 @@ test('after', async () => {
       syntax: "*";
       inherits: false;
       initial-value: "";
-    }
-    "
+    }"
   `)
   expect(await run(['after/foo:flex'])).toEqual('')
 })
 
 test('first', async () => {
   expect(await run(['first:flex', 'group-first:flex', 'peer-first:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):first-child .group-first\\:flex), :is(:where(.peer):first-child ~ .peer-first\\:flex), .first\\:flex:first-child {
+    ".group-first\\:flex:is(:where(.group):first-child *), .peer-first\\:flex:is(:where(.peer):first-child ~ *), .first\\:flex:first-child {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['first/foo:flex'])).toEqual('')
 })
 
 test('last', async () => {
   expect(await run(['last:flex', 'group-last:flex', 'peer-last:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):last-child .group-last\\:flex), :is(:where(.peer):last-child ~ .peer-last\\:flex), .last\\:flex:last-child {
+    ".group-last\\:flex:is(:where(.group):last-child *), .peer-last\\:flex:is(:where(.peer):last-child ~ *), .last\\:flex:last-child {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['last/foo:flex'])).toEqual('')
 })
 
 test('only', async () => {
   expect(await run(['only:flex', 'group-only:flex', 'peer-only:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):only-child .group-only\\:flex), :is(:where(.peer):only-child ~ .peer-only\\:flex), .only\\:flex:only-child {
+    ".group-only\\:flex:is(:where(.group):only-child *), .peer-only\\:flex:is(:where(.peer):only-child ~ *), .only\\:flex:only-child {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['only/foo:flex'])).toEqual('')
 })
 
 test('odd', async () => {
   expect(await run(['odd:flex', 'group-odd:flex', 'peer-odd:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):nth-child(odd) .group-odd\\:flex), :is(:where(.peer):nth-child(odd) ~ .peer-odd\\:flex), .odd\\:flex:nth-child(odd) {
+    ".group-odd\\:flex:is(:where(.group):nth-child(odd) *), .peer-odd\\:flex:is(:where(.peer):nth-child(odd) ~ *), .odd\\:flex:nth-child(odd) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['odd/foo:flex'])).toEqual('')
 })
 
 test('even', async () => {
   expect(await run(['even:flex', 'group-even:flex', 'peer-even:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):nth-child(2n) .group-even\\:flex), :is(:where(.peer):nth-child(2n) ~ .peer-even\\:flex), .even\\:flex:nth-child(2n) {
+    ".group-even\\:flex:is(:where(.group):nth-child(2n) *), .peer-even\\:flex:is(:where(.peer):nth-child(2n) ~ *), .even\\:flex:nth-child(2n) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['even/foo:flex'])).toEqual('')
 })
@@ -241,11 +184,9 @@ test('even', async () => {
 test('first-of-type', async () => {
   expect(await run(['first-of-type:flex', 'group-first-of-type:flex', 'peer-first-of-type:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):first-of-type .group-first-of-type\\:flex), :is(:where(.peer):first-of-type ~ .peer-first-of-type\\:flex), .first-of-type\\:flex:first-of-type {
+      ".group-first-of-type\\:flex:is(:where(.group):first-of-type *), .peer-first-of-type\\:flex:is(:where(.peer):first-of-type ~ *), .first-of-type\\:flex:first-of-type {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['first-of-type/foo:flex'])).toEqual('')
 })
@@ -253,11 +194,9 @@ test('first-of-type', async () => {
 test('last-of-type', async () => {
   expect(await run(['last-of-type:flex', 'group-last-of-type:flex', 'peer-last-of-type:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):last-of-type .group-last-of-type\\:flex), :is(:where(.peer):last-of-type ~ .peer-last-of-type\\:flex), .last-of-type\\:flex:last-of-type {
+      ".group-last-of-type\\:flex:is(:where(.group):last-of-type *), .peer-last-of-type\\:flex:is(:where(.peer):last-of-type ~ *), .last-of-type\\:flex:last-of-type {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['last-of-type/foo:flex'])).toEqual('')
 })
@@ -265,11 +204,9 @@ test('last-of-type', async () => {
 test('only-of-type', async () => {
   expect(await run(['only-of-type:flex', 'group-only-of-type:flex', 'peer-only-of-type:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):only-of-type .group-only-of-type\\:flex), :is(:where(.peer):only-of-type ~ .peer-only-of-type\\:flex), .only-of-type\\:flex:only-of-type {
+      ".group-only-of-type\\:flex:is(:where(.group):only-of-type *), .peer-only-of-type\\:flex:is(:where(.peer):only-of-type ~ *), .only-of-type\\:flex:only-of-type {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['only-of-type/foo:flex'])).toEqual('')
 })
@@ -277,11 +214,9 @@ test('only-of-type', async () => {
 test('visited', async () => {
   expect(await run(['visited:flex', 'group-visited:flex', 'peer-visited:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):visited .group-visited\\:flex), :is(:where(.peer):visited ~ .peer-visited\\:flex), .visited\\:flex:visited {
+      ".group-visited\\:flex:is(:where(.group):visited *), .peer-visited\\:flex:is(:where(.peer):visited ~ *), .visited\\:flex:visited {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['visited/foo:flex'])).toEqual('')
 })
@@ -289,11 +224,9 @@ test('visited', async () => {
 test('target', async () => {
   expect(await run(['target:flex', 'group-target:flex', 'peer-target:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):target .group-target\\:flex), :is(:where(.peer):target ~ .peer-target\\:flex), .target\\:flex:target {
+      ".group-target\\:flex:is(:where(.group):target *), .peer-target\\:flex:is(:where(.peer):target ~ *), .target\\:flex:target {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['target/foo:flex'])).toEqual('')
 })
@@ -301,11 +234,9 @@ test('target', async () => {
 test('open', async () => {
   expect(await run(['open:flex', 'group-open:flex', 'peer-open:flex', 'not-open:flex']))
     .toMatchInlineSnapshot(`
-      "
-      .not-open\\:flex:not(:is([open], :popover-open, :open)), :is(:where(.group):is([open], :popover-open, :open) .group-open\\:flex), :is(:where(.peer):is([open], :popover-open, :open) ~ .peer-open\\:flex), .open\\:flex:is([open], :popover-open, :open) {
+      ".not-open\\:flex:not(:is([open], :popover-open, :open)), .group-open\\:flex:is(:where(.group):is([open], :popover-open, :open) *), .peer-open\\:flex:is(:where(.peer):is([open], :popover-open, :open) ~ *), .open\\:flex:is([open], :popover-open, :open) {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['open/foo:flex'])).toEqual('')
 })
@@ -313,11 +244,9 @@ test('open', async () => {
 test('default', async () => {
   expect(await run(['default:flex', 'group-default:flex', 'peer-default:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):default .group-default\\:flex), :is(:where(.peer):default ~ .peer-default\\:flex), .default\\:flex:default {
+      ".group-default\\:flex:is(:where(.group):default *), .peer-default\\:flex:is(:where(.peer):default ~ *), .default\\:flex:default {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['default/foo:flex'])).toEqual('')
 })
@@ -325,11 +254,9 @@ test('default', async () => {
 test('checked', async () => {
   expect(await run(['checked:flex', 'group-checked:flex', 'peer-checked:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):checked .group-checked\\:flex), :is(:where(.peer):checked ~ .peer-checked\\:flex), .checked\\:flex:checked {
+      ".group-checked\\:flex:is(:where(.group):checked *), .peer-checked\\:flex:is(:where(.peer):checked ~ *), .checked\\:flex:checked {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['checked/foo:flex'])).toEqual('')
 })
@@ -337,11 +264,9 @@ test('checked', async () => {
 test('indeterminate', async () => {
   expect(await run(['indeterminate:flex', 'group-indeterminate:flex', 'peer-indeterminate:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):indeterminate .group-indeterminate\\:flex), :is(:where(.peer):indeterminate ~ .peer-indeterminate\\:flex), .indeterminate\\:flex:indeterminate {
+      ".group-indeterminate\\:flex:is(:where(.group):indeterminate *), .peer-indeterminate\\:flex:is(:where(.peer):indeterminate ~ *), .indeterminate\\:flex:indeterminate {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['indeterminate/foo:flex'])).toEqual('')
 })
@@ -354,11 +279,9 @@ test('placeholder-shown', async () => {
       'peer-placeholder-shown:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):placeholder-shown .group-placeholder-shown\\:flex), :is(:where(.peer):placeholder-shown ~ .peer-placeholder-shown\\:flex), .placeholder-shown\\:flex:placeholder-shown {
+    ".group-placeholder-shown\\:flex:is(:where(.group):placeholder-shown *), .peer-placeholder-shown\\:flex:is(:where(.peer):placeholder-shown ~ *), .placeholder-shown\\:flex:placeholder-shown {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['placeholder-shown/foo:flex'])).toEqual('')
 })
@@ -366,15 +289,9 @@ test('placeholder-shown', async () => {
 test('autofill', async () => {
   expect(await run(['autofill:flex', 'group-autofill:flex', 'peer-autofill:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):autofill .group-autofill\\:flex), :is(:where(.peer):autofill ~ .peer-autofill\\:flex) {
+      ".group-autofill\\:flex:is(:where(.group):autofill *), .peer-autofill\\:flex:is(:where(.peer):autofill ~ *), .autofill\\:flex:autofill {
         display: flex;
-      }
-
-      .autofill\\:flex:autofill {
-        display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['autofill/foo:flex'])).toEqual('')
 })
@@ -382,11 +299,9 @@ test('autofill', async () => {
 test('optional', async () => {
   expect(await run(['optional:flex', 'group-optional:flex', 'peer-optional:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):optional .group-optional\\:flex), :is(:where(.peer):optional ~ .peer-optional\\:flex), .optional\\:flex:optional {
+      ".group-optional\\:flex:is(:where(.group):optional *), .peer-optional\\:flex:is(:where(.peer):optional ~ *), .optional\\:flex:optional {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['optional/foo:flex'])).toEqual('')
 })
@@ -394,22 +309,18 @@ test('optional', async () => {
 test('required', async () => {
   expect(await run(['required:flex', 'group-required:flex', 'peer-required:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):required .group-required\\:flex), :is(:where(.peer):required ~ .peer-required\\:flex), .required\\:flex:required {
+      ".group-required\\:flex:is(:where(.group):required *), .peer-required\\:flex:is(:where(.peer):required ~ *), .required\\:flex:required {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['required/foo:flex'])).toEqual('')
 })
 
 test('valid', async () => {
   expect(await run(['valid:flex', 'group-valid:flex', 'peer-valid:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):valid .group-valid\\:flex), :is(:where(.peer):valid ~ .peer-valid\\:flex), .valid\\:flex:valid {
+    ".group-valid\\:flex:is(:where(.group):valid *), .peer-valid\\:flex:is(:where(.peer):valid ~ *), .valid\\:flex:valid {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['valid/foo:flex'])).toEqual('')
 })
@@ -417,11 +328,9 @@ test('valid', async () => {
 test('invalid', async () => {
   expect(await run(['invalid:flex', 'group-invalid:flex', 'peer-invalid:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):invalid .group-invalid\\:flex), :is(:where(.peer):invalid ~ .peer-invalid\\:flex), .invalid\\:flex:invalid {
+      ".group-invalid\\:flex:is(:where(.group):invalid *), .peer-invalid\\:flex:is(:where(.peer):invalid ~ *), .invalid\\:flex:invalid {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['invalid/foo:flex'])).toEqual('')
 })
@@ -429,15 +338,13 @@ test('invalid', async () => {
 test('user-valid', async () => {
   expect(await run(['user-valid:flex', 'group-user-valid:flex', 'peer-user-valid:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):user-valid .group-user-valid\\:flex), :is(:where(.peer):user-valid ~ .peer-user-valid\\:flex) {
+      ".group-user-valid\\:flex:is(:where(.group):user-valid *), .peer-user-valid\\:flex:is(:where(.peer):user-valid ~ *) {
         display: flex;
       }
 
       .user-valid\\:flex:user-valid {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['user-valid/foo:flex'])).toEqual('')
 })
@@ -445,27 +352,23 @@ test('user-valid', async () => {
 test('user-invalid', async () => {
   expect(await run(['user-invalid:flex', 'group-user-invalid:flex', 'peer-user-invalid:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):user-invalid .group-user-invalid\\:flex), :is(:where(.peer):user-invalid ~ .peer-user-invalid\\:flex) {
+      ".group-user-invalid\\:flex:is(:where(.group):user-invalid *), .peer-user-invalid\\:flex:is(:where(.peer):user-invalid ~ *) {
         display: flex;
       }
 
       .user-invalid\\:flex:user-invalid {
         display: flex;
-      }
-      "
+      }"
     `)
-  expect(await run(['user-invalid/foo:flex'])).toEqual('')
+  expect(await run(['invalid/foo:flex'])).toEqual('')
 })
 
 test('in-range', async () => {
   expect(await run(['in-range:flex', 'group-in-range:flex', 'peer-in-range:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):in-range .group-in-range\\:flex), :is(:where(.peer):in-range ~ .peer-in-range\\:flex), .in-range\\:flex:in-range {
+      ".group-in-range\\:flex:is(:where(.group):in-range *), .peer-in-range\\:flex:is(:where(.peer):in-range ~ *), .in-range\\:flex:in-range {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['in-range/foo:flex'])).toEqual('')
 })
@@ -473,11 +376,9 @@ test('in-range', async () => {
 test('out-of-range', async () => {
   expect(await run(['out-of-range:flex', 'group-out-of-range:flex', 'peer-out-of-range:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):out-of-range .group-out-of-range\\:flex), :is(:where(.peer):out-of-range ~ .peer-out-of-range\\:flex), .out-of-range\\:flex:out-of-range {
+      ".group-out-of-range\\:flex:is(:where(.group):out-of-range *), .peer-out-of-range\\:flex:is(:where(.peer):out-of-range ~ *), .out-of-range\\:flex:out-of-range {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['out-of-range/foo:flex'])).toEqual('')
 })
@@ -485,22 +386,18 @@ test('out-of-range', async () => {
 test('read-only', async () => {
   expect(await run(['read-only:flex', 'group-read-only:flex', 'peer-read-only:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):read-only .group-read-only\\:flex), :is(:where(.peer):read-only ~ .peer-read-only\\:flex), .read-only\\:flex:read-only {
+      ".group-read-only\\:flex:is(:where(.group):read-only *), .peer-read-only\\:flex:is(:where(.peer):read-only ~ *), .read-only\\:flex:read-only {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['read-only/foo:flex'])).toEqual('')
 })
 
 test('empty', async () => {
   expect(await run(['empty:flex', 'group-empty:flex', 'peer-empty:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):empty .group-empty\\:flex), :is(:where(.peer):empty ~ .peer-empty\\:flex), .empty\\:flex:empty {
+    ".group-empty\\:flex:is(:where(.group):empty *), .peer-empty\\:flex:is(:where(.peer):empty ~ *), .empty\\:flex:empty {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['empty/foo:flex'])).toEqual('')
 })
@@ -508,89 +405,64 @@ test('empty', async () => {
 test('focus-within', async () => {
   expect(await run(['focus-within:flex', 'group-focus-within:flex', 'peer-focus-within:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):focus-within .group-focus-within\\:flex), :is(:where(.peer):focus-within ~ .peer-focus-within\\:flex), .focus-within\\:flex:focus-within {
+      ".group-focus-within\\:flex:is(:where(.group):focus-within *), .peer-focus-within\\:flex:is(:where(.peer):focus-within ~ *), .focus-within\\:flex:focus-within {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['focus-within/foo:flex'])).toEqual('')
 })
 
 test('hover', async () => {
   expect(await run(['hover:flex', 'group-hover:flex', 'peer-hover:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (hover: hover) {
-      :is(:where(.group):hover .group-hover\\:flex), :is(:where(.peer):hover ~ .peer-hover\\:flex), .hover\\:flex:hover {
+    "@media (hover: hover) {
+      .group-hover\\:flex:is(:where(.group):hover *), .peer-hover\\:flex:is(:where(.peer):hover ~ *), .hover\\:flex:hover {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['hover/foo:flex'])).toEqual('')
 })
 
 test('focus', async () => {
   expect(await run(['focus:flex', 'group-focus:flex', 'peer-focus:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):focus .group-focus\\:flex), :is(:where(.peer):focus ~ .peer-focus\\:flex), .focus\\:flex:focus {
+    ".group-focus\\:flex:is(:where(.group):focus *), .peer-focus\\:flex:is(:where(.peer):focus ~ *), .focus\\:flex:focus {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['focus/foo:flex'])).toEqual('')
 })
 
 test('group-hover group-focus sorting', async () => {
   expect(await run(['group-hover:flex', 'group-focus:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (hover: hover) {
-      :is(:where(.group):hover .group-hover\\:flex) {
+    "@media (hover: hover) {
+      .group-hover\\:flex:is(:where(.group):hover *) {
         display: flex;
       }
     }
 
-    :is(:where(.group):focus .group-focus\\:flex) {
+    .group-focus\\:flex:is(:where(.group):focus *) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['group-focus:flex', 'group-hover:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (hover: hover) {
-      :is(:where(.group):hover .group-hover\\:flex) {
+    "@media (hover: hover) {
+      .group-hover\\:flex:is(:where(.group):hover *) {
         display: flex;
       }
     }
 
-    :is(:where(.group):focus .group-focus\\:flex) {
+    .group-focus\\:flex:is(:where(.group):focus *) {
       display: flex;
-    }
-    "
+    }"
   `)
 })
 
-test('stacking group and peer variants does not duplicate the target selector', async () => {
-  let candidate = Array.from(
-    { length: 12 },
-    (_, i) => `${i % 2 === 0 ? 'group' : 'peer'}-data-active/name${i}`,
-  ).join(':')
-
-  let output = await run([`${candidate}:flex`])
-  expect(output).toContain('display: flex')
-  // Repeating `&` in each variant makes the generated selector grow
-  // exponentially. This many variants should still produce a small rule.
-  expect(output.length).toBeLessThan(2_000)
-})
-
 test('focus-visible', async () => {
   expect(await run(['focus-visible:flex', 'group-focus-visible:flex', 'peer-focus-visible:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):focus-visible .group-focus-visible\\:flex), :is(:where(.peer):focus-visible ~ .peer-focus-visible\\:flex), .focus-visible\\:flex:focus-visible {
+      ".group-focus-visible\\:flex:is(:where(.group):focus-visible *), .peer-focus-visible\\:flex:is(:where(.peer):focus-visible ~ *), .focus-visible\\:flex:focus-visible {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['focus-visible/foo:flex'])).toEqual('')
 })
@@ -598,11 +470,9 @@ test('focus-visible', async () => {
 test('active', async () => {
   expect(await run(['active:flex', 'group-active:flex', 'peer-active:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):active .group-active\\:flex), :is(:where(.peer):active ~ .peer-active\\:flex), .active\\:flex:active {
+      ".group-active\\:flex:is(:where(.group):active *), .peer-active\\:flex:is(:where(.peer):active ~ *), .active\\:flex:active {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['active/foo:flex'])).toEqual('')
 })
@@ -610,11 +480,9 @@ test('active', async () => {
 test('enabled', async () => {
   expect(await run(['enabled:flex', 'group-enabled:flex', 'peer-enabled:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):enabled .group-enabled\\:flex), :is(:where(.peer):enabled ~ .peer-enabled\\:flex), .enabled\\:flex:enabled {
+      ".group-enabled\\:flex:is(:where(.group):enabled *), .peer-enabled\\:flex:is(:where(.peer):enabled ~ *), .enabled\\:flex:enabled {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['enabled/foo:flex'])).toEqual('')
 })
@@ -622,22 +490,18 @@ test('enabled', async () => {
 test('disabled', async () => {
   expect(await run(['disabled:flex', 'group-disabled:flex', 'peer-disabled:flex']))
     .toMatchInlineSnapshot(`
-      "
-      :is(:where(.group):disabled .group-disabled\\:flex), :is(:where(.peer):disabled ~ .peer-disabled\\:flex), .disabled\\:flex:disabled {
+      ".group-disabled\\:flex:is(:where(.group):disabled *), .peer-disabled\\:flex:is(:where(.peer):disabled ~ *), .disabled\\:flex:disabled {
         display: flex;
-      }
-      "
+      }"
     `)
   expect(await run(['disabled/foo:flex'])).toEqual('')
 })
 
 test('inert', async () => {
   expect(await run(['inert:flex', 'group-inert:flex', 'peer-inert:flex'])).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):is([inert], [inert] *) .group-inert\\:flex), :is(:where(.peer):is([inert], [inert] *) ~ .peer-inert\\:flex), .inert\\:flex:is([inert], [inert] *) {
+    ".group-inert\\:flex:is(:where(.group):is([inert], [inert] *) *), .peer-inert\\:flex:is(:where(.peer):is([inert], [inert] *) ~ *), .inert\\:flex:is([inert], [inert] *) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['inert/foo:flex'])).toEqual('')
 })
@@ -652,46 +516,36 @@ test('group-[...]', async () => {
       'group-[&:hover]:group-[&_p]:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group) p .group-\\[\\&_p\\]\\:flex), :is(:where(.group) p :is(:where(.group):hover .group-\\[\\&\\:hover\\]\\:group-\\[\\&_p\\]\\:flex)) {
+    ".group-\\[\\&_p\\]\\:flex:is(:where(.group) p *), .group-\\[\\&\\:hover\\]\\:group-\\[\\&_p\\]\\:flex:is(:where(.group):hover *):is(:where(.group) p *) {
       display: flex;
     }
 
     @media (hover: hover) {
-      :is(:where(.group) p .group-\\[\\&_p\\]\\:hover\\:flex):hover, :is(:where(.group) p .hover\\:group-\\[\\&_p\\]\\:flex:hover) {
+      .group-\\[\\&_p\\]\\:hover\\:flex:is(:where(.group) p *):hover, .hover\\:group-\\[\\&_p\\]\\:flex:hover:is(:where(.group) p *) {
         display: flex;
       }
 
       @media (hover: hover) {
-        :is(:where(.group) p .hover\\:group-\\[\\&_p\\]\\:hover\\:flex:hover):hover {
+        .hover\\:group-\\[\\&_p\\]\\:hover\\:flex:hover:is(:where(.group) p *):hover {
           display: flex;
         }
       }
-    }
-    "
+    }"
   `)
 
   expect(
-    await run([
-      'group-[]:flex',
-      'group-hover/[]:flex',
-      'group-[@media_foo]:flex',
-      'group-[>img]:flex',
-    ]),
+    await compileCss(
+      css`
+        @tailwind utilities;
+      `,
+      ['group-[]:flex', 'group-hover/[]:flex', 'group-[@media_foo]:flex', 'group-[>img]:flex'],
+    ),
   ).toEqual('')
 })
 
 test('group-*', async () => {
   expect(
-    await run(
-      [
-        'group-hover:flex',
-        'group-focus:flex',
-        'group-hocus:flex',
-
-        'group-hover:group-focus:flex',
-        'group-focus:group-hover:flex',
-      ],
+    await compileCss(
       css`
         @custom-variant hocus {
           &:hover,
@@ -701,34 +555,39 @@ test('group-*', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'group-hover:flex',
+        'group-focus:flex',
+        'group-hocus:flex',
+
+        'group-hover:group-focus:flex',
+        'group-focus:group-hover:flex',
+      ],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (hover: hover) {
-      :is(:where(.group):hover .group-hover\\:flex) {
+    "@media (hover: hover) {
+      .group-hover\\:flex:is(:where(.group):hover *) {
         display: flex;
       }
     }
 
-    :is(:where(.group):focus .group-focus\\:flex) {
+    .group-focus\\:flex:is(:where(.group):focus *) {
       display: flex;
     }
 
     @media (hover: hover) {
-      :is(:where(.group):hover :is(:where(.group):focus .group-focus\\:group-hover\\:flex)), :is(:where(.group):focus :is(:where(.group):hover .group-hover\\:group-focus\\:flex)) {
+      .group-focus\\:group-hover\\:flex:is(:where(.group):focus *):is(:where(.group):hover *), .group-hover\\:group-focus\\:flex:is(:where(.group):hover *):is(:where(.group):focus *) {
         display: flex;
       }
     }
 
-    :is(:is(:where(.group):hover, :where(.group):focus) .group-hocus\\:flex) {
+    .group-hocus\\:flex:is(:is(:where(.group):hover, :where(.group):focus) *) {
       display: flex;
-    }
-    "
+    }"
   `)
 
   expect(
-    await run(
-      ['group-custom-at-rule:flex', 'group-nested-selectors:flex'],
+    await compileCss(
       css`
         @custom-variant custom-at-rule (@media foo);
         @custom-variant nested-selectors {
@@ -740,6 +599,7 @@ test('group-*', async () => {
         }
         @tailwind utilities;
       `,
+      ['group-custom-at-rule:flex', 'group-nested-selectors:flex'],
     ),
   ).toEqual('')
 })
@@ -754,34 +614,30 @@ test('peer-[...]', async () => {
       'peer-[&:hover]:peer-[&_p]:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    :is(:where(.peer) p ~ .peer-\\[\\&_p\\]\\:flex), :is(:where(.peer) p ~ :is(:where(.peer):hover ~ .peer-\\[\\&\\:hover\\]\\:peer-\\[\\&_p\\]\\:flex)) {
+    ".peer-\\[\\&_p\\]\\:flex:is(:where(.peer) p ~ *), .peer-\\[\\&\\:hover\\]\\:peer-\\[\\&_p\\]\\:flex:is(:where(.peer):hover ~ *):is(:where(.peer) p ~ *) {
       display: flex;
     }
 
     @media (hover: hover) {
-      :is(:where(.peer) p ~ .hover\\:peer-\\[\\&_p\\]\\:flex:hover), :is(:where(.peer) p ~ .peer-\\[\\&_p\\]\\:hover\\:flex):hover, :is(:where(.peer) p ~ .hover\\:peer-\\[\\&_p\\]\\:focus\\:flex:hover):focus {
+      .hover\\:peer-\\[\\&_p\\]\\:flex:hover:is(:where(.peer) p ~ *), .peer-\\[\\&_p\\]\\:hover\\:flex:is(:where(.peer) p ~ *):hover, .hover\\:peer-\\[\\&_p\\]\\:focus\\:flex:hover:is(:where(.peer) p ~ *):focus {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 
   expect(
-    await run(['peer-[]:flex', 'peer-hover/[]:flex', 'peer-[@media_foo]:flex', 'peer-[>img]:flex']),
+    await compileCss(
+      css`
+        @tailwind utilities;
+      `,
+      ['peer-[]:flex', 'peer-hover/[]:flex', 'peer-[@media_foo]:flex', 'peer-[>img]:flex'],
+    ),
   ).toEqual('')
 })
 
 test('peer-*', async () => {
   expect(
-    await run(
-      [
-        'peer-hover:flex',
-        'peer-focus:flex',
-        'peer-hocus:flex',
-        'peer-hover:peer-focus:flex',
-        'peer-focus:peer-hover:flex',
-      ],
+    await compileCss(
       css`
         @custom-variant hocus {
           &:hover,
@@ -791,34 +647,38 @@ test('peer-*', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'peer-hover:flex',
+        'peer-focus:flex',
+        'peer-hocus:flex',
+        'peer-hover:peer-focus:flex',
+        'peer-focus:peer-hover:flex',
+      ],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (hover: hover) {
-      :is(:where(.peer):hover ~ .peer-hover\\:flex) {
+    "@media (hover: hover) {
+      .peer-hover\\:flex:is(:where(.peer):hover ~ *) {
         display: flex;
       }
     }
 
-    :is(:where(.peer):focus ~ .peer-focus\\:flex) {
+    .peer-focus\\:flex:is(:where(.peer):focus ~ *) {
       display: flex;
     }
 
     @media (hover: hover) {
-      :is(:where(.peer):hover ~ :is(:where(.peer):focus ~ .peer-focus\\:peer-hover\\:flex)), :is(:where(.peer):focus ~ :is(:where(.peer):hover ~ .peer-hover\\:peer-focus\\:flex)) {
+      .peer-focus\\:peer-hover\\:flex:is(:where(.peer):focus ~ *):is(:where(.peer):hover ~ *), .peer-hover\\:peer-focus\\:flex:is(:where(.peer):hover ~ *):is(:where(.peer):focus ~ *) {
         display: flex;
       }
     }
 
-    :is(:is(:where(.peer):hover, :where(.peer):focus) ~ .peer-hocus\\:flex) {
+    .peer-hocus\\:flex:is(:is(:where(.peer):hover, :where(.peer):focus) ~ *) {
       display: flex;
-    }
-    "
+    }"
   `)
 
   expect(
-    await run(
-      ['peer-custom-at-rule:flex', 'peer-nested-selectors:flex'],
+    await compileCss(
       css`
         @custom-variant custom-at-rule (@media foo);
         @custom-variant nested-selectors {
@@ -830,101 +690,87 @@ test('peer-*', async () => {
         }
         @tailwind utilities;
       `,
+      ['peer-custom-at-rule:flex', 'peer-nested-selectors:flex'],
     ),
   ).toEqual('')
 })
 
 test('ltr', async () => {
   expect(await run(['ltr:flex'])).toMatchInlineSnapshot(`
-    "
-    .ltr\\:flex:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
+    ".ltr\\:flex:where(:dir(ltr), [dir="ltr"], [dir="ltr"] *) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['ltr/foo:flex'])).toEqual('')
 })
 
 test('rtl', async () => {
   expect(await run(['rtl:flex'])).toMatchInlineSnapshot(`
-    "
-    .rtl\\:flex:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
+    ".rtl\\:flex:where(:dir(rtl), [dir="rtl"], [dir="rtl"] *) {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['rtl/foo:flex'])).toEqual('')
 })
 
 test('motion-safe', async () => {
   expect(await run(['motion-safe:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (prefers-reduced-motion: no-preference) {
+    "@media (prefers-reduced-motion: no-preference) {
       .motion-safe\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['motion-safe/foo:flex'])).toEqual('')
 })
 
 test('motion-reduce', async () => {
   expect(await run(['motion-reduce:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (prefers-reduced-motion: reduce) {
+    "@media (prefers-reduced-motion: reduce) {
       .motion-reduce\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['motion-reduce/foo:flex'])).toEqual('')
 })
 
 test('dark', async () => {
   expect(await run(['dark:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (prefers-color-scheme: dark) {
+    "@media (prefers-color-scheme: dark) {
       .dark\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['dark/foo:flex'])).toEqual('')
 })
 
 test('starting', async () => {
   expect(await run(['starting:opacity-0'])).toMatchInlineSnapshot(`
-    "
-    @starting-style {
+    "@starting-style {
       .starting\\:opacity-0 {
         opacity: 0;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['starting/foo:flex'])).toEqual('')
 })
 
 test('print', async () => {
   expect(await run(['print:flex'])).toMatchInlineSnapshot(`
-    "
-    @media print {
+    "@media print {
       .print\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['print/foo:flex'])).toEqual('')
 })
 
 test('default breakpoints', async () => {
   expect(
-    await run(
-      ['sm:flex', 'md:flex', 'lg:flex', 'xl:flex', '2xl:flex'],
+    await compileCss(
       css`
         @theme {
           /* Breakpoints */
@@ -936,43 +782,41 @@ test('default breakpoints', async () => {
         }
         @tailwind utilities;
       `,
+      ['sm:flex', 'md:flex', 'lg:flex', 'xl:flex', '2xl:flex'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 640px) {
+    "@media (width >= 640px) {
       .sm\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 768px) {
+    @media (width >= 768px) {
       .md\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1024px) {
+    @media (width >= 1024px) {
       .lg\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1280px) {
+    @media (width >= 1280px) {
       .xl\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1536px) {
+    @media (width >= 1536px) {
       .\\32 xl\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      ['sm/foo:flex', 'md/foo:flex', 'lg/foo:flex', 'xl/foo:flex', '2xl/foo:flex'],
+    await compileCss(
       css`
         @theme reference {
           /* Breakpoints */
@@ -984,36 +828,34 @@ test('default breakpoints', async () => {
         }
         @tailwind utilities;
       `,
+      ['sm/foo:flex', 'md/foo:flex', 'lg/foo:flex', 'xl/foo:flex', '2xl/foo:flex'],
     ),
   ).toEqual('')
 })
 
 test('custom breakpoint', async () => {
   expect(
-    await run(
-      ['10xl:flex'],
+    await compileCss(
       css`
         @theme {
           --breakpoint-10xl: 5000px;
         }
         @tailwind utilities;
       `,
+      ['10xl:flex'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 5000px) {
+    "@media (width >= 5000px) {
       .\\31 0xl\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('max-*', async () => {
   expect(
-    await run(
-      ['max-lg:flex', 'max-sm:flex', 'max-md:flex'],
+    await compileCss(
       css`
         @theme {
           /* Explicitly ordered in a strange way */
@@ -1023,31 +865,29 @@ test('max-*', async () => {
         }
         @tailwind utilities;
       `,
+      ['max-lg:flex', 'max-sm:flex', 'max-md:flex'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media not all and (min-width: 1024px) {
+    "@media (width < 1024px) {
       .max-lg\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 768px) {
+    @media (width < 768px) {
       .max-md\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 640px) {
+    @media (width < 640px) {
       .max-sm\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      ['max-lg/foo:flex', 'max-sm/foo:flex', 'max-md/foo:flex'],
+    await compileCss(
       css`
         @theme reference {
           /* Explicitly ordered in a strange way */
@@ -1057,14 +897,14 @@ test('max-*', async () => {
         }
         @tailwind utilities;
       `,
+      ['max-lg/foo:flex', 'max-sm/foo:flex', 'max-md/foo:flex'],
     ),
   ).toEqual('')
 })
 
 test('min-*', async () => {
   expect(
-    await run(
-      ['min-lg:flex', 'min-sm:flex', 'min-md:flex'],
+    await compileCss(
       css`
         @theme {
           /* Explicitly ordered in a strange way */
@@ -1074,31 +914,29 @@ test('min-*', async () => {
         }
         @tailwind utilities;
       `,
+      ['min-lg:flex', 'min-sm:flex', 'min-md:flex'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 640px) {
+    "@media (width >= 640px) {
       .min-sm\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 768px) {
+    @media (width >= 768px) {
       .min-md\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1024px) {
+    @media (width >= 1024px) {
       .min-lg\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(
-    await run(
-      ['min-lg/foo:flex', 'min-sm/foo:flex', 'min-md/foo:flex'],
+    await compileCss(
       css`
         @theme reference {
           /* Explicitly ordered in a strange way */
@@ -1108,14 +946,14 @@ test('min-*', async () => {
         }
         @tailwind utilities;
       `,
+      ['min-lg/foo:flex', 'min-sm/foo:flex', 'min-md/foo:flex'],
     ),
   ).toEqual('')
 })
 
 test('sorting stacked min-* and max-* variants', async () => {
   expect(
-    await run(
-      ['min-sm:max-lg:flex', 'min-sm:max-xl:flex', 'min-md:max-lg:flex', 'min-xs:max-sm:flex'],
+    await compileCss(
       css`
         @theme {
           /* Explicitly ordered in a strange way */
@@ -1127,46 +965,44 @@ test('sorting stacked min-* and max-* variants', async () => {
         }
         @tailwind utilities;
       `,
+      ['min-sm:max-lg:flex', 'min-sm:max-xl:flex', 'min-md:max-lg:flex', 'min-xs:max-sm:flex'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 280px) {
-      @media not all and (min-width: 640px) {
+    "@media (width >= 280px) {
+      @media (width < 640px) {
         .min-xs\\:max-sm\\:flex {
           display: flex;
         }
       }
     }
 
-    @media (min-width: 640px) {
-      @media not all and (min-width: 1280px) {
+    @media (width >= 640px) {
+      @media (width < 1280px) {
         .min-sm\\:max-xl\\:flex {
           display: flex;
         }
       }
 
-      @media not all and (min-width: 1024px) {
+      @media (width < 1024px) {
         .min-sm\\:max-lg\\:flex {
           display: flex;
         }
       }
     }
 
-    @media (min-width: 768px) {
-      @media not all and (min-width: 1024px) {
+    @media (width >= 768px) {
+      @media (width < 1024px) {
         .min-md\\:max-lg\\:flex {
           display: flex;
         }
       }
-    }
-    "
+    }"
   `)
 })
 
 test('stacked min-* and max-* variants should come after unprefixed variants', async () => {
   expect(
-    await run(
-      ['sm:flex', 'min-sm:max-lg:flex', 'md:flex', 'min-md:max-lg:flex'],
+    await compileCss(
       css`
         @theme {
           /* Explicitly ordered in a strange way */
@@ -1176,39 +1012,47 @@ test('stacked min-* and max-* variants should come after unprefixed variants', a
         }
         @tailwind utilities;
       `,
+      ['sm:flex', 'min-sm:max-lg:flex', 'md:flex', 'min-md:max-lg:flex'],
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media (min-width: 640px) {
+    "@media (width >= 640px) {
       .sm\\:flex {
         display: flex;
       }
 
-      @media not all and (min-width: 1024px) {
+      @media (width < 1024px) {
         .min-sm\\:max-lg\\:flex {
           display: flex;
         }
       }
     }
 
-    @media (min-width: 768px) {
+    @media (width >= 768px) {
       .md\\:flex {
         display: flex;
       }
 
-      @media not all and (min-width: 1024px) {
+      @media (width < 1024px) {
         .min-md\\:max-lg\\:flex {
           display: flex;
         }
       }
-    }
-    "
+    }"
   `)
 })
 
 test('min, max and unprefixed breakpoints', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          /* Explicitly ordered in a strange way */
+          --breakpoint-sm: 640px;
+          --breakpoint-lg: 1024px;
+          --breakpoint-md: 768px;
+        }
+        @tailwind utilities;
+      `,
       [
         'max-lg-sm-potato:flex',
         'min-lg-sm-potato:flex',
@@ -1225,66 +1069,55 @@ test('min, max and unprefixed breakpoints', async () => {
         'sm:flex',
         'lg:flex',
       ],
-      css`
-        @theme {
-          /* Explicitly ordered in a strange way */
-          --breakpoint-sm: 640px;
-          --breakpoint-lg: 1024px;
-          --breakpoint-md: 768px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @media not all and (min-width: 1024px) {
+    "@media (width < 1024px) {
       .max-lg\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 1000px) {
+    @media (width < 1000px) {
       .max-\\[1000px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 768px) {
+    @media (width < 768px) {
       .max-md\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 640px) {
+    @media (width < 640px) {
       .max-sm\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 640px) {
+    @media (width >= 640px) {
       .min-sm\\:flex, .sm\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 700px) {
+    @media (width >= 700px) {
       .min-\\[700px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 768px) {
+    @media (width >= 768px) {
       .md\\:flex, .min-md\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1024px) {
+    @media (width >= 1024px) {
       .lg\\:flex, .min-lg\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
@@ -1313,201 +1146,125 @@ test('sorting `min` and `max` should sort by unit, then by value, then alphabeti
       'max-[12vh]:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @media not all and (min-width: calc(1000px + 12em)) {
+    "@media (width < calc(1000px + 12em)) {
       .max-\\[calc\\(1000px\\+12em\\)\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: calc(50vh + 12em)) {
+    @media (width < calc(50vh + 12em)) {
       .max-\\[calc\\(50vh\\+12em\\)\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 12em) {
+    @media (width < 12em) {
       .max-\\[12em\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 10em) {
+    @media (width < 10em) {
       .max-\\[10em\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 12px) {
+    @media (width < 12px) {
       .max-\\[12px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 10px) {
+    @media (width < 10px) {
       .max-\\[10px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 12rem) {
+    @media (width < 12rem) {
       .max-\\[12rem\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 10rem) {
+    @media (width < 10rem) {
       .max-\\[10rem\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 12vh) {
+    @media (width < 12vh) {
       .max-\\[12vh\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 10vh) {
+    @media (width < 10vh) {
       .max-\\[10vh\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: calc(1000px + 12em)) {
+    @media (width >= calc(1000px + 12em)) {
       .min-\\[calc\\(1000px\\+12em\\)\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: calc(50vh + 12em)) {
+    @media (width >= calc(50vh + 12em)) {
       .min-\\[calc\\(50vh\\+12em\\)\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 10em) {
+    @media (width >= 10em) {
       .min-\\[10em\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 12em) {
+    @media (width >= 12em) {
       .min-\\[12em\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 10px) {
+    @media (width >= 10px) {
       .min-\\[10px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 12px) {
+    @media (width >= 12px) {
       .min-\\[12px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 10rem) {
+    @media (width >= 10rem) {
       .min-\\[10rem\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 12rem) {
+    @media (width >= 12rem) {
       .min-\\[12rem\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 10vh) {
+    @media (width >= 10vh) {
       .min-\\[10vh\\]\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 12vh) {
+    @media (width >= 12vh) {
       .min-\\[12vh\\]\\:flex {
         display: flex;
       }
-    }
-    "
-  `)
-})
-
-test('sorting `min` and `max` should compare decimal values numerically', async () => {
-  expect(
-    await run([
-      'min-[40.5rem]:flex',
-      'min-[40.25rem]:flex',
-      'max-[40.25rem]:flex',
-      'max-[40.5rem]:flex',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @media not all and (min-width: 40.5rem) {
-      .max-\\[40\\.5rem\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @media not all and (min-width: 40.25rem) {
-      .max-\\[40\\.25rem\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @media (min-width: 40.25rem) {
-      .min-\\[40\\.25rem\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @media (min-width: 40.5rem) {
-      .min-\\[40\\.5rem\\]\\:flex {
-        display: flex;
-      }
-    }
-    "
-  `)
-})
-
-test('sorting `@min` and `@max` should compare decimal values numerically', async () => {
-  expect(
-    await run([
-      '@min-[40.5rem]:flex',
-      '@min-[40.25rem]:flex',
-      '@max-[40.25rem]:flex',
-      '@max-[40.5rem]:flex',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    @container not (min-width: 40.5rem) {
-      .\\@max-\\[40\\.5rem\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @container not (min-width: 40.25rem) {
-      .\\@max-\\[40\\.25rem\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @container (min-width: 40.25rem) {
-      .\\@min-\\[40\\.25rem\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @container (min-width: 40.5rem) {
-      .\\@min-\\[40\\.5rem\\]\\:flex {
-        display: flex;
-      }
-    }
-    "
+    }"
   `)
 })
 
@@ -1522,44 +1279,20 @@ test('supports', async () => {
       'supports-[font-tech(color-COLRv1)]:flex',
       'supports-[var(--test)]:flex',
       'supports-[--test]:flex',
-
-      // Only top-level and/or/not should have spaces around them. We should
-      // ignore and/or/not inside of `selector(…)`
-      'supports-[selector(a:not(.foo))]:flex',
-      'supports-[selector(a:is(.and,.or))]:flex',
-      'supports-[(display:grid)or(display:flex)]:grid',
-      'supports-[not(display:grid)]:flex',
-      'supports-[foo-not(display:grid)]:flex',
-      'supports-[selector([data-foo="("])or(display:grid)]:flex',
-      'supports-[selector(.foo\\(bar)or(display:grid)]:flex',
-      'supports-[((display:grid)or(display:flex))]:grid',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    @supports (gap: var(--tw)) {
+    "@supports (gap: var(--tw)) {
       .supports-gap\\:grid {
         display: grid;
       }
     }
 
-    @supports (display: grid) or (display: flex) {
-      .supports-\\[\\(\\(display\\:grid\\)or\\(display\\:flex\\)\\)\\]\\:grid {
-        display: grid;
-      }
-    }
-
     @supports (display: grid) and font-format(opentype) {
       .supports-\\[\\(display\\:grid\\)_and_font-format\\(opentype\\)\\]\\:grid {
         display: grid;
       }
     }
 
-    @supports (display: grid) or (display: flex) {
-      .supports-\\[\\(display\\:grid\\)or\\(display\\:flex\\)\\]\\:grid {
-        display: grid;
-      }
-    }
-
     @supports (--test: var(--tw)) {
       .supports-\\[--test\\]\\:flex {
         display: flex;
@@ -1584,54 +1317,17 @@ test('supports', async () => {
       }
     }
 
-    @supports foo-not(display:grid) {
-      .supports-\\[foo-not\\(display\\:grid\\)\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @supports not (display: grid) {
-      .supports-\\[not\\(display\\:grid\\)\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @supports selector(.foo\\(bar) or (display: grid) {
-      .supports-\\[selector\\(\\.foo\\\\\\(bar\\)or\\(display\\:grid\\)\\]\\:flex {
-        display: flex;
-      }
-    }
-
     @supports selector(A > B) {
       .supports-\\[selector\\(A_\\>_B\\)\\]\\:flex {
         display: flex;
       }
     }
 
-    @supports selector([data-foo="("]) or (display: grid) {
-      .supports-\\[selector\\(\\[data-foo\\=\\"\\(\\"\\]\\)or\\(display\\:grid\\)\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @supports selector(a:is(.and,.or)) {
-      .supports-\\[selector\\(a\\:is\\(\\.and\\,\\.or\\)\\)\\]\\:flex {
-        display: flex;
-      }
-    }
-
-    @supports selector(a:not(.foo)) {
-      .supports-\\[selector\\(a\\:not\\(\\.foo\\)\\)\\]\\:flex {
-        display: flex;
-      }
-    }
-
     @supports var(--test) {
       .supports-\\[var\\(--test\\)\\]\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -1648,7 +1344,30 @@ test('supports', async () => {
 
 test('not', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @custom-variant hocus {
+          &:hover,
+          &:focus {
+            @slot;
+          }
+        }
+
+        @custom-variant device-hocus {
+          @media (hover: hover) {
+            &:hover,
+            &:focus {
+              @slot;
+            }
+          }
+        }
+
+        @theme {
+          --breakpoint-sm: 640px;
+        }
+
+        @tailwind utilities;
+      `,
       [
         'not-[:checked]:flex',
         'not-[@media_print]:flex',
@@ -1722,7 +1441,6 @@ test('not', async () => {
         'not-contrast-less:flex',
         'not-forced-colors:flex',
         'not-nth-2:flex',
-        'not-noscript:flex',
 
         'not-sm:flex',
         'not-min-sm:flex',
@@ -1730,45 +1448,13 @@ test('not', async () => {
         'not-max-sm:flex',
         'not-max-[130px]:flex',
       ],
-      css`
-        @custom-variant hocus {
-          &:hover,
-          &:focus {
-            @slot;
-          }
-        }
-
-        @custom-variant device-hocus {
-          @media (hover: hover) {
-            &:hover,
-            &:focus {
-              @slot;
-            }
-          }
-        }
-
-        @theme {
-          --breakpoint-sm: 640px;
-        }
-
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    .not-first\\:flex:not(:first-child), .not-last\\:flex:not(:last-child), .not-only\\:flex:not(:only-child), .not-odd\\:flex:not(:nth-child(odd)), .not-even\\:flex:not(:nth-child(2n)), .not-first-of-type\\:flex:not(:first-of-type), .not-last-of-type\\:flex:not(:last-of-type), .not-only-of-type\\:flex:not(:only-of-type), .not-visited\\:flex:not(:visited), .not-target\\:flex:not(:target), .not-open\\:flex:not(:is([open], :popover-open, :open)), .not-default\\:flex:not(:default), .not-checked\\:flex:not(:checked), .not-indeterminate\\:flex:not(:indeterminate), .not-placeholder-shown\\:flex:not(:placeholder-shown) {
+    ".not-first\\:flex:not(:first-child), .not-last\\:flex:not(:last-child), .not-only\\:flex:not(:only-child), .not-odd\\:flex:not(:nth-child(odd)), .not-even\\:flex:not(:nth-child(2n)), .not-first-of-type\\:flex:not(:first-of-type), .not-last-of-type\\:flex:not(:last-of-type), .not-only-of-type\\:flex:not(:only-of-type), .not-visited\\:flex:not(:visited), .not-target\\:flex:not(:target), .not-open\\:flex:not(:is([open], :popover-open, :open)), .not-default\\:flex:not(:default), .not-checked\\:flex:not(:checked), .not-indeterminate\\:flex:not(:indeterminate), .not-placeholder-shown\\:flex:not(:placeholder-shown), .not-autofill\\:flex:not(:autofill), .not-optional\\:flex:not(:optional), .not-required\\:flex:not(:required), .not-valid\\:flex:not(:valid), .not-invalid\\:flex:not(:invalid), .not-in-range\\:flex:not(:in-range), .not-out-of-range\\:flex:not(:out-of-range), .not-read-only\\:flex:not(:read-only), .not-empty\\:flex:not(:empty), .not-focus-within\\:flex:not(:focus-within), .not-hover\\:flex:not(:hover) {
       display: flex;
     }
 
-    .not-autofill\\:flex:not(:autofill) {
-      display: flex;
-    }
-
-    .not-optional\\:flex:not(:optional), .not-required\\:flex:not(:required), .not-valid\\:flex:not(:valid), .not-invalid\\:flex:not(:invalid), .not-in-range\\:flex:not(:in-range), .not-out-of-range\\:flex:not(:out-of-range), .not-read-only\\:flex:not(:read-only), .not-empty\\:flex:not(:empty), .not-focus-within\\:flex:not(:focus-within), .not-hover\\:flex:not(:hover) {
-      display: flex;
-    }
-
-    @media not all and (hover: hover) {
+    @media not (hover: hover) {
       .not-hover\\:flex {
         display: flex;
       }
@@ -1784,61 +1470,61 @@ test('not', async () => {
       }
     }
 
-    @media not all and (prefers-reduced-motion: no-preference) {
+    @media not (prefers-reduced-motion: no-preference) {
       .not-motion-safe\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (prefers-reduced-motion: reduce) {
+    @media not (prefers-reduced-motion: reduce) {
       .not-motion-reduce\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (prefers-contrast: more) {
+    @media not (prefers-contrast: more) {
       .not-contrast-more\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (prefers-contrast: less) {
+    @media not (prefers-contrast: less) {
       .not-contrast-less\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 640px) {
+    @media (width >= 640px) {
       .not-max-sm\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 130px) {
+    @media (width >= 130px) {
       .not-max-\\[130px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 130px) {
+    @media (width < 130px) {
       .not-min-\\[130px\\]\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (min-width: 640px) {
+    @media (width < 640px) {
       .not-min-sm\\:flex, .not-sm\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (orientation: portrait) {
+    @media not (orientation: portrait) {
       .not-portrait\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (orientation: landscape) {
+    @media not (orientation: landscape) {
       .not-landscape\\:flex {
         display: flex;
       }
@@ -1848,7 +1534,7 @@ test('not', async () => {
       display: flex;
     }
 
-    @media not all and (prefers-color-scheme: dark) {
+    @media not (prefers-color-scheme: dark) {
       .not-dark\\:flex {
         display: flex;
       }
@@ -1860,23 +1546,17 @@ test('not', async () => {
       }
     }
 
-    @media not all and (forced-colors: active) {
+    @media not (forced-colors: active) {
       .not-forced-colors\\:flex {
         display: flex;
       }
     }
 
-    @media not all and (scripting: none) {
-      .not-noscript\\:flex {
-        display: flex;
-      }
-    }
-
     .not-hocus\\:flex:not(:hover, :focus), .not-device-hocus\\:flex:not(:hover, :focus) {
       display: flex;
     }
 
-    @media not all and (hover: hover) {
+    @media not (hover: hover) {
       .not-device-hocus\\:flex {
         display: flex;
       }
@@ -1886,7 +1566,7 @@ test('not', async () => {
       display: flex;
     }
 
-    @media not all and (orientation: landscape) {
+    @media not (orientation: landscape) {
       .not-\\[\\@media_\\(orientation\\:landscape\\)\\]\\:flex {
         display: flex;
       }
@@ -1904,122 +1584,19 @@ test('not', async () => {
       }
     }
 
-    @media not all and (orientation: portrait) {
+    @media not (orientation: portrait) {
       .not-\\[\\@media\\(orientation\\:portrait\\)\\]\\:flex {
         display: flex;
       }
     }
 
-    :is(:where(.group):not(:checked) .group-not-checked\\:flex), :is(:where(.group):not(:hover, :focus) .group-not-hocus\\:flex), :is(:where(.group\\/parent-name):not(:hover, :focus) .group-not-hocus\\/parent-name\\:flex), :is(:where(.group):not(:checked) .group-not-\\[\\:checked\\]\\:flex), :is(:where(.group\\/parent-name):not(:checked) .group-not-\\[\\:checked\\]\\/parent-name\\:flex), :is(:where(.peer):not(:checked) ~ .peer-not-checked\\:flex), :is(:where(.peer):not(:hover, :focus) ~ .peer-not-hocus\\:flex), :is(:where(.peer\\/sibling-name):not(:hover, :focus) ~ .peer-not-hocus\\/sibling-name\\:flex), :is(:where(.peer):not(:checked) ~ .peer-not-\\[\\:checked\\]\\:flex), :is(:where(.peer\\/sibling-name):not(:checked) ~ .peer-not-\\[\\:checked\\]\\/sibling-name\\:flex) {
+    .group-not-checked\\:flex:is(:where(.group):not(:checked) *), .group-not-hocus\\:flex:is(:where(.group):not(:hover, :focus) *), .group-not-hocus\\/parent-name\\:flex:is(:where(.group\\/parent-name):not(:hover, :focus) *), .group-not-\\[\\:checked\\]\\:flex:is(:where(.group):not(:checked) *), .group-not-\\[\\:checked\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name):not(:checked) *), .peer-not-checked\\:flex:is(:where(.peer):not(:checked) ~ *), .peer-not-hocus\\:flex:is(:where(.peer):not(:hover, :focus) ~ *), .peer-not-hocus\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):not(:hover, :focus) ~ *), .peer-not-\\[\\:checked\\]\\:flex:is(:where(.peer):not(:checked) ~ *), .peer-not-\\[\\:checked\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):not(:checked) ~ *) {
       display: flex;
-    }
-    "
-  `)
-
-  // https://github.com/tailwindlabs/tailwindcss/issues/20058
-  expect(
-    await run(
-      ['not-has-a:flex', 'not-has-b:flex', 'not-has-c:flex', 'not-has-d:flex'],
-      css`
-        @custom-variant has-a {
-          @container style(--a) {
-            @slot;
-          }
-        }
-
-        /* Already negated case */
-        @custom-variant has-b {
-          @container not style(--b) {
-            @slot;
-          }
-        }
-
-        /* Named @container */
-        @custom-variant has-c {
-          @container foo style(--c) {
-            @slot;
-          }
-        }
-
-        /* Named @container, that's already negated case */
-        @custom-variant has-d {
-          @container bar not style(--d) {
-            @slot;
-          }
-        }
-
-        @tailwind utilities;
-      `,
-    ),
-  ).toMatchInlineSnapshot(`
-    "
-    @container not style(--a) {
-      .not-has-a\\:flex {
-        display: flex;
-      }
-    }
-
-    @container style(--b) {
-      .not-has-b\\:flex {
-        display: flex;
-      }
-    }
-
-    @container foo not style(--c) {
-      .not-has-c\\:flex {
-        display: flex;
-      }
-    }
-
-    @container bar style(--d) {
-      .not-has-d\\:flex {
-        display: flex;
-      }
-    }
-    "
+    }"
   `)
 
   expect(
-    await run(
-      [
-        'not-[>img]:flex',
-        'not-[+img]:flex',
-        'not-[~img]:flex',
-        'not-[:checked]/foo:flex',
-        'not-[@media_screen,print]:flex',
-        'not-[@media_not_screen,print]:flex',
-        'not-[@media_not_screen,not_print]:flex',
-
-        'not-nested-at-rules:flex',
-        'not-nested-style-rules:flex',
-        'not-multiple-media-conditions:flex',
-        'not-starting:flex',
-
-        'not-parallel-style-rules:flex',
-        'not-parallel-at-rules:flex',
-        'not-parallel-mixed-rules:flex',
-
-        // The following built-in variants don't have not-* versions because
-        // there is no sensible negative version of them.
-
-        // These just don't make sense as not-*
-        'not-force:flex',
-        'not-*:flex',
-
-        // These contain pseudo-elements
-        'not-first-letter:flex',
-        'not-first-line:flex',
-        'not-marker:flex',
-        'not-selection:flex',
-        'not-file:flex',
-        'not-placeholder:flex',
-        'not-backdrop:flex',
-        'not-before:flex',
-        'not-after:flex',
-
-        // This is not a conditional at rule
-        'not-starting:flex',
-      ],
+    await compileCss(
       css`
         @custom-variant nested-at-rules {
           @media foo {
@@ -2066,6 +1643,45 @@ test('not', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'not-[>img]:flex',
+        'not-[+img]:flex',
+        'not-[~img]:flex',
+        'not-[:checked]/foo:flex',
+        'not-[@media_screen,print]:flex',
+        'not-[@media_not_screen,print]:flex',
+        'not-[@media_not_screen,not_print]:flex',
+
+        'not-nested-at-rules:flex',
+        'not-nested-style-rules:flex',
+        'not-multiple-media-conditions:flex',
+        'not-starting:flex',
+
+        'not-parallel-style-rules:flex',
+        'not-parallel-at-rules:flex',
+        'not-parallel-mixed-rules:flex',
+
+        // The following built-in variants don't have not-* versions because
+        // there is no sensible negative version of them.
+
+        // These just don't make sense as not-*
+        'not-force:flex',
+        'not-*:flex',
+
+        // These contain pseudo-elements
+        'not-first-letter:flex',
+        'not-first-line:flex',
+        'not-marker:flex',
+        'not-selection:flex',
+        'not-file:flex',
+        'not-placeholder:flex',
+        'not-backdrop:flex',
+        'not-before:flex',
+        'not-after:flex',
+
+        // This is not a conditional at rule
+        'not-starting:flex',
+      ],
     ),
   ).toEqual('')
 })
@@ -2080,18 +1696,25 @@ test('in', async () => {
       'in-data-visible:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .not-in-\\[\\.group\\]\\:flex:not(:where(.group) *), .not-in-\\[p\\]\\:flex:not(:where(:is(p)) *), :where([data-visible]) .in-data-visible\\:flex, :where(.group) .in-\\[\\.group\\]\\:flex, :where(:is(p)) .in-\\[p\\]\\:flex {
+    ".not-in-\\[\\.group\\]\\:flex:not(:where(.group) *), .not-in-\\[p\\]\\:flex:not(:where(:is(p)) *), :where([data-visible]) .in-data-visible\\:flex, :where(.group) .in-\\[\\.group\\]\\:flex, :where(:is(p)) .in-\\[p\\]\\:flex {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['in-p:flex', 'in-foo-bar:flex'])).toEqual('')
 })
 
 test('has', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @custom-variant hocus {
+          &:hover,
+          &:focus {
+            @slot;
+          }
+        }
+        @tailwind utilities;
+      `,
       [
         'has-checked:flex',
         'has-[:checked]:flex',
@@ -2127,32 +1750,15 @@ test('has', async () => {
         'peer-has-hocus:flex',
         'peer-has-hocus/sibling-name:flex',
       ],
-      css`
-        @custom-variant hocus {
-          &:hover,
-          &:focus {
-            @slot;
-          }
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group):has(:checked) .group-has-checked\\:flex), :is(:where(.group\\/parent-name):has(:checked) .group-has-checked\\/parent-name\\:flex), :is(:where(.group):has(:hover, :focus) .group-has-hocus\\:flex), :is(:where(.group\\/parent-name):has(:hover, :focus) .group-has-hocus\\/parent-name\\:flex), :is(:where(.group):has(:checked) .group-has-\\[\\:checked\\]\\:flex), :is(:where(.group\\/parent-name):has(:checked) .group-has-\\[\\:checked\\]\\/parent-name\\:flex), :is(:where(.group):has(* > img) .group-has-\\[\\&\\>img\\]\\:flex), :is(:where(.group\\/parent-name):has(* > img) .group-has-\\[\\&\\>img\\]\\/parent-name\\:flex), :is(:where(.group):has( + img) .group-has-\\[\\+img\\]\\:flex), :is(:where(.group):has( > img) .group-has-\\[\\>img\\]\\:flex), :is(:where(.group\\/parent-name):has( > img) .group-has-\\[\\>img\\]\\/parent-name\\:flex), :is(:where(.group):has( ~ img) .group-has-\\[\\~img\\]\\:flex), :is(:where(.peer):has(:checked) ~ .peer-has-checked\\:flex), :is(:where(.peer\\/sibling-name):has(:checked) ~ .peer-has-checked\\/sibling-name\\:flex), :is(:where(.peer):has(:hover, :focus) ~ .peer-has-hocus\\:flex), :is(:where(.peer\\/sibling-name):has(:hover, :focus) ~ .peer-has-hocus\\/sibling-name\\:flex), :is(:where(.peer):has(:checked) ~ .peer-has-\\[\\:checked\\]\\:flex), :is(:where(.peer\\/sibling-name):has(:checked) ~ .peer-has-\\[\\:checked\\]\\/sibling-name\\:flex), :is(:where(.peer):has(* > img) ~ .peer-has-\\[\\&\\>img\\]\\:flex), :is(:where(.peer\\/sibling-name):has(* > img) ~ .peer-has-\\[\\&\\>img\\]\\/sibling-name\\:flex), :is(:where(.peer):has( + img) ~ .peer-has-\\[\\+img\\]\\:flex), :is(:where(.peer):has( > img) ~ .peer-has-\\[\\>img\\]\\:flex), :is(:where(.peer\\/sibling-name):has( > img) ~ .peer-has-\\[\\>img\\]\\/sibling-name\\:flex), :is(:where(.peer):has( ~ img) ~ .peer-has-\\[\\~img\\]\\:flex), .has-checked\\:flex:has(:checked), .has-hocus\\:flex:has(:hover, :focus), .has-\\[\\:checked\\]\\:flex:has(:checked), .has-\\[\\&\\>img\\]\\:flex:has(* > img), .has-\\[\\+img\\]\\:flex:has( + img), .has-\\[\\>img\\]\\:flex:has( > img), .has-\\[\\~img\\]\\:flex:has( ~ img) {
+    ".group-has-checked\\:flex:is(:where(.group):has(:checked) *), .group-has-checked\\/parent-name\\:flex:is(:where(.group\\/parent-name):has(:checked) *), .group-has-hocus\\:flex:is(:where(.group):has(:hover, :focus) *), .group-has-hocus\\/parent-name\\:flex:is(:where(.group\\/parent-name):has(:hover, :focus) *), .group-has-\\[\\:checked\\]\\:flex:is(:where(.group):has(:checked) *), .group-has-\\[\\:checked\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name):has(:checked) *), .group-has-\\[\\&\\>img\\]\\:flex:is(:where(.group):has(* > img) *), .group-has-\\[\\&\\>img\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name):has(* > img) *), .group-has-\\[\\+img\\]\\:flex:is(:where(.group):has( + img) *), .group-has-\\[\\>img\\]\\:flex:is(:where(.group):has( > img) *), .group-has-\\[\\>img\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name):has( > img) *), .group-has-\\[\\~img\\]\\:flex:is(:where(.group):has( ~ img) *), .peer-has-checked\\:flex:is(:where(.peer):has(:checked) ~ *), .peer-has-checked\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):has(:checked) ~ *), .peer-has-hocus\\:flex:is(:where(.peer):has(:hover, :focus) ~ *), .peer-has-hocus\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):has(:hover, :focus) ~ *), .peer-has-\\[\\:checked\\]\\:flex:is(:where(.peer):has(:checked) ~ *), .peer-has-\\[\\:checked\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):has(:checked) ~ *), .peer-has-\\[\\&\\>img\\]\\:flex:is(:where(.peer):has(* > img) ~ *), .peer-has-\\[\\&\\>img\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):has(* > img) ~ *), .peer-has-\\[\\+img\\]\\:flex:is(:where(.peer):has( + img) ~ *), .peer-has-\\[\\>img\\]\\:flex:is(:where(.peer):has( > img) ~ *), .peer-has-\\[\\>img\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name):has( > img) ~ *), .peer-has-\\[\\~img\\]\\:flex:is(:where(.peer):has( ~ img) ~ *), .has-checked\\:flex:has(:checked), .has-hocus\\:flex:has(:hover, :focus), .has-\\[\\:checked\\]\\:flex:has(:checked), .has-\\[\\&\\>img\\]\\:flex:has(* > img), .has-\\[\\+img\\]\\:flex:has( + img), .has-\\[\\>img\\]\\:flex:has( > img), .has-\\[\\~img\\]\\:flex:has( ~ img) {
       display: flex;
-    }
-    "
+    }"
   `)
 
   expect(
-    await run(
-      [
-        'has-[:checked]/foo:flex',
-        'has-[@media_print]:flex',
-        'has-custom-at-rule:flex',
-        'has-nested-selectors:flex',
-      ],
+    await compileCss(
       css`
         @custom-variant custom-at-rule (@media foo);
         @custom-variant nested-selectors {
@@ -2164,6 +1770,12 @@ test('has', async () => {
         }
         @tailwind utilities;
       `,
+      [
+        'has-[:checked]/foo:flex',
+        'has-[@media_print]:flex',
+        'has-custom-at-rule:flex',
+        'has-nested-selectors:flex',
+      ],
     ),
   ).toEqual('')
 })
@@ -2191,11 +1803,9 @@ test('aria', async () => {
       'peer-aria-[valuenow=1]/sibling-name:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group)[aria-checked="true"] .group-aria-checked\\:flex), :is(:where(.group\\/parent-name)[aria-checked="true"] .group-aria-checked\\/parent-name\\:flex), :is(:where(.group)[aria-modal] .group-aria-\\[modal\\]\\:flex), :is(:where(.group\\/parent-name)[aria-modal] .group-aria-\\[modal\\]\\/parent-name\\:flex), :is(:where(.group)[aria-valuenow="1"] .group-aria-\\[valuenow\\=1\\]\\:flex), :is(:where(.group\\/parent-name)[aria-valuenow="1"] .group-aria-\\[valuenow\\=1\\]\\/parent-name\\:flex), :is(:where(.peer)[aria-checked="true"] ~ .peer-aria-checked\\:flex), :is(:where(.peer\\/sibling-name)[aria-checked="true"] ~ .peer-aria-checked\\/sibling-name\\:flex), :is(:where(.peer)[aria-modal] ~ .peer-aria-\\[modal\\]\\:flex), :is(:where(.peer\\/sibling-name)[aria-modal] ~ .peer-aria-\\[modal\\]\\/sibling-name\\:flex), :is(:where(.peer)[aria-valuenow="1"] ~ .peer-aria-\\[valuenow\\=1\\]\\:flex), :is(:where(.peer\\/sibling-name)[aria-valuenow="1"] ~ .peer-aria-\\[valuenow\\=1\\]\\/sibling-name\\:flex), .aria-checked\\:flex[aria-checked="true"], .aria-\\[invalid\\=spelling\\]\\:flex[aria-invalid="spelling"], .aria-\\[valuenow_\\=_\\"1\\"\\]\\:flex[aria-valuenow="1"], .aria-\\[valuenow\\=1\\]\\:flex[aria-valuenow="1"] {
+    ".group-aria-checked\\:flex:is(:where(.group)[aria-checked="true"] *), .group-aria-checked\\/parent-name\\:flex:is(:where(.group\\/parent-name)[aria-checked="true"] *), .group-aria-\\[modal\\]\\:flex:is(:where(.group)[aria-modal] *), .group-aria-\\[modal\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[aria-modal] *), .group-aria-\\[valuenow\\=1\\]\\:flex:is(:where(.group)[aria-valuenow="1"] *), .group-aria-\\[valuenow\\=1\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[aria-valuenow="1"] *), .peer-aria-checked\\:flex:is(:where(.peer)[aria-checked="true"] ~ *), .peer-aria-checked\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[aria-checked="true"] ~ *), .peer-aria-\\[modal\\]\\:flex:is(:where(.peer)[aria-modal] ~ *), .peer-aria-\\[modal\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[aria-modal] ~ *), .peer-aria-\\[valuenow\\=1\\]\\:flex:is(:where(.peer)[aria-valuenow="1"] ~ *), .peer-aria-\\[valuenow\\=1\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[aria-valuenow="1"] ~ *), .aria-checked\\:flex[aria-checked="true"], .aria-\\[invalid\\=spelling\\]\\:flex[aria-invalid="spelling"], .aria-\\[valuenow_\\=_\\"1\\"\\]\\:flex[aria-valuenow="1"], .aria-\\[valuenow\\=1\\]\\:flex[aria-valuenow="1"] {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(await run(['aria-checked/foo:flex', 'aria-[invalid=spelling]/foo:flex'])).toEqual('')
 })
@@ -2230,11 +1840,9 @@ test('data', async () => {
       'peer-data-[foo$=bar_baz_i]/sibling-name:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    :is(:where(.group)[data-disabled] .group-data-\\[disabled\\]\\:flex), :is(:where(.group\\/parent-name)[data-disabled] .group-data-\\[disabled\\]\\/parent-name\\:flex), :is(:where(.group\\/parent-name)[data-foo$="bar" i] .group-data-\\[foo\\$\\=\\'bar\\'_i\\]\\/parent-name\\:flex), :is(:where(.group\\/parent-name)[data-foo$="bar baz" i] .group-data-\\[foo\\$\\=bar_baz_i\\]\\/parent-name\\:flex), :is(:where(.group)[data-foo="1"] .group-data-\\[foo\\=1\\]\\:flex), :is(:where(.group\\/parent-name)[data-foo="1"] .group-data-\\[foo\\=1\\]\\/parent-name\\:flex), :is(:where(.group\\/parent-name)[data-foo="bar baz"] .group-data-\\[foo\\=bar\\ baz\\]\\/parent-name\\:flex), :is(:where(.peer)[data-disabled] ~ .peer-data-\\[disabled\\]\\:flex), :is(:where(.peer\\/sibling-name)[data-disabled] ~ .peer-data-\\[disabled\\]\\/sibling-name\\:flex), :is(:where(.peer\\/sibling-name)[data-foo$="bar" i] ~ .peer-data-\\[foo\\$\\=\\'bar\\'_i\\]\\/sibling-name\\:flex), :is(:where(.peer\\/sibling-name)[data-foo$="bar baz" i] ~ .peer-data-\\[foo\\$\\=bar_baz_i\\]\\/sibling-name\\:flex), :is(:where(.peer)[data-foo="1"] ~ .peer-data-\\[foo\\=1\\]\\:flex), :is(:where(.peer\\/sibling-name)[data-foo="1"] ~ .peer-data-\\[foo\\=1\\]\\/sibling-name\\:flex), :is(:where(.peer\\/sibling-name)[data-foo="bar baz"] ~ .peer-data-\\[foo\\=bar\\ baz\\]\\/sibling-name\\:flex), .data-disabled\\:flex[data-disabled], .data-\\[foo\\$\\=\\'bar\\'_i\\]\\:flex[data-foo$="bar" i], .data-\\[foo\\$\\=bar_baz_i\\]\\:flex[data-foo$="bar baz" i], .data-\\[foo\\=1\\]\\:flex[data-foo="1"], .data-\\[foo\\=bar_baz\\]\\:flex[data-foo="bar baz"], .data-\\[potato_\\=_\\"salad\\"\\]\\:flex[data-potato="salad"], .data-\\[potato_\\^\\=_\\"salad\\"\\]\\:flex[data-potato^="salad"], .data-\\[potato\\=\\"\\^_\\=\\"\\]\\:flex[data-potato="^ ="], .data-\\[potato\\=salad\\]\\:flex[data-potato="salad"] {
+    ".group-data-\\[disabled\\]\\:flex:is(:where(.group)[data-disabled] *), .group-data-\\[disabled\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[data-disabled] *), .group-data-\\[foo\\$\\=\\'bar\\'_i\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[data-foo$="bar" i] *), .group-data-\\[foo\\$\\=bar_baz_i\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[data-foo$="bar baz" i] *), .group-data-\\[foo\\=1\\]\\:flex:is(:where(.group)[data-foo="1"] *), .group-data-\\[foo\\=1\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[data-foo="1"] *), .group-data-\\[foo\\=bar\\ baz\\]\\/parent-name\\:flex:is(:where(.group\\/parent-name)[data-foo="bar baz"] *), .peer-data-\\[disabled\\]\\:flex:is(:where(.peer)[data-disabled] ~ *), .peer-data-\\[disabled\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[data-disabled] ~ *), .peer-data-\\[foo\\$\\=\\'bar\\'_i\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[data-foo$="bar" i] ~ *), .peer-data-\\[foo\\$\\=bar_baz_i\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[data-foo$="bar baz" i] ~ *), .peer-data-\\[foo\\=1\\]\\:flex:is(:where(.peer)[data-foo="1"] ~ *), .peer-data-\\[foo\\=1\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[data-foo="1"] ~ *), .peer-data-\\[foo\\=bar\\ baz\\]\\/sibling-name\\:flex:is(:where(.peer\\/sibling-name)[data-foo="bar baz"] ~ *), .data-disabled\\:flex[data-disabled], .data-\\[foo\\$\\=\\'bar\\'_i\\]\\:flex[data-foo$="bar" i], .data-\\[foo\\$\\=bar_baz_i\\]\\:flex[data-foo$="bar baz" i], .data-\\[foo\\=1\\]\\:flex[data-foo="1"], .data-\\[foo\\=bar_baz\\]\\:flex[data-foo="bar baz"], .data-\\[potato_\\=_\\"salad\\"\\]\\:flex[data-potato="salad"], .data-\\[potato_\\^\\=_\\"salad\\"\\]\\:flex[data-potato^="salad"], .data-\\[potato\\=\\"\\^_\\=\\"\\]\\:flex[data-potato="^ ="], .data-\\[potato\\=salad\\]\\:flex[data-potato="salad"] {
       display: flex;
-    }
-    "
+    }"
   `)
   expect(
     await run([
@@ -2244,175 +1852,160 @@ test('data', async () => {
       'data-[potato=salad]/foo:flex',
     ]),
   ).toEqual('')
-
-  // Non-ASCII code points are valid in attribute names
-  expect(await run(['data-[état]:flex', 'aria-[état]:flex'])).toMatchInlineSnapshot(`
-    "
-    .aria-\\[état\\]\\:flex[aria-état], .data-\\[état\\]\\:flex[data-état] {
-      display: flex;
-    }
-    "
-  `)
 })
 
 test('portrait', async () => {
   expect(await run(['portrait:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (orientation: portrait) {
+    "@media (orientation: portrait) {
       .portrait\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['portrait/foo:flex'])).toEqual('')
 })
 
 test('landscape', async () => {
   expect(await run(['landscape:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (orientation: landscape) {
+    "@media (orientation: landscape) {
       .landscape\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['landscape/foo:flex'])).toEqual('')
 })
 
 test('contrast-more', async () => {
   expect(await run(['contrast-more:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (prefers-contrast: more) {
+    "@media (prefers-contrast: more) {
       .contrast-more\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['contrast-more/foo:flex'])).toEqual('')
 })
 
 test('contrast-less', async () => {
   expect(await run(['contrast-less:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (prefers-contrast: less) {
+    "@media (prefers-contrast: less) {
       .contrast-less\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['contrast-less/foo:flex'])).toEqual('')
 })
 
 test('forced-colors', async () => {
   expect(await run(['forced-colors:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (forced-colors: active) {
+    "@media (forced-colors: active) {
       .forced-colors\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
   expect(await run(['forced-colors/foo:flex'])).toEqual('')
 })
 
 test('inverted-colors', async () => {
   expect(await run(['inverted-colors:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (inverted-colors: inverted) {
+    "@media (inverted-colors: inverted) {
       .inverted-colors\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('pointer-none', async () => {
   expect(await run(['pointer-none:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (pointer: none) {
+    "@media (pointer: none) {
       .pointer-none\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('pointer-coarse', async () => {
   expect(await run(['pointer-coarse:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (pointer: coarse) {
+    "@media (pointer: coarse) {
       .pointer-coarse\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('pointer-fine', async () => {
   expect(await run(['pointer-fine:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (pointer: fine) {
+    "@media (pointer: fine) {
       .pointer-fine\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('any-pointer-none', async () => {
   expect(await run(['any-pointer-none:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (any-pointer: none) {
+    "@media (any-pointer: none) {
       .any-pointer-none\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('any-pointer-coarse', async () => {
   expect(await run(['any-pointer-coarse:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (any-pointer: coarse) {
+    "@media (any-pointer: coarse) {
       .any-pointer-coarse\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
   `)
 })
 
 test('any-pointer-fine', async () => {
   expect(await run(['any-pointer-fine:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (any-pointer: fine) {
+    "@media (any-pointer: fine) {
       .any-pointer-fine\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
+  `)
+})
+
+test('scripting-initial', async () => {
+  expect(await run(['scripting-initial:flex'])).toMatchInlineSnapshot(`
+    "@media (scripting: initial-only) {
+      .scripting-initial\\:flex {
+        display: flex;
+      }
+    }"
   `)
 })
 
 test('scripting-none', async () => {
-  expect(await run(['noscript:flex'])).toMatchInlineSnapshot(`
-    "
-    @media (scripting: none) {
-      .noscript\\:flex {
+  expect(await run(['scripting-none:flex'])).toMatchInlineSnapshot(`
+    "@media (scripting: none) {
+      .scripting-none\\:flex {
         display: flex;
       }
-    }
-    "
+    }"
+  `)
+})
+
+test('scripting', async () => {
+  expect(await run(['scripting:flex'])).toMatchInlineSnapshot(`
+    "@media (scripting: enabled) {
+      .scripting\\:flex {
+        display: flex;
+      }
+    }"
   `)
 })
 
@@ -2431,11 +2024,9 @@ test('nth', async () => {
       'nth-last-of-type-[2n+1]:flex',
     ]),
   ).toMatchInlineSnapshot(`
-    "
-    .nth-3\\:flex:nth-child(3), .nth-\\[2n\\+1\\]\\:flex:nth-child(odd), .nth-\\[2n\\+1_of_\\.foo\\]\\:flex:nth-child(odd of .foo), .nth-last-3\\:flex:nth-last-child(3), .nth-last-\\[2n\\+1\\]\\:flex:nth-last-child(odd), .nth-last-\\[2n\\+1_of_\\.foo\\]\\:flex:nth-last-child(odd of .foo), .nth-of-type-3\\:flex:nth-of-type(3), .nth-of-type-\\[2n\\+1\\]\\:flex:nth-of-type(odd), .nth-last-of-type-3\\:flex:nth-last-of-type(3), .nth-last-of-type-\\[2n\\+1\\]\\:flex:nth-last-of-type(odd) {
+    ".nth-3\\:flex:nth-child(3), .nth-\\[2n\\+1\\]\\:flex:nth-child(odd), .nth-\\[2n\\+1_of_\\.foo\\]\\:flex:nth-child(odd of .foo), .nth-last-3\\:flex:nth-last-child(3), .nth-last-\\[2n\\+1\\]\\:flex:nth-last-child(odd), .nth-last-\\[2n\\+1_of_\\.foo\\]\\:flex:nth-last-child(odd of .foo), .nth-of-type-3\\:flex:nth-of-type(3), .nth-of-type-\\[2n\\+1\\]\\:flex:nth-of-type(odd), .nth-last-of-type-3\\:flex:nth-last-of-type(3), .nth-last-of-type-\\[2n\\+1\\]\\:flex:nth-last-of-type(odd) {
       display: flex;
-    }
-    "
+    }"
   `)
 
   expect(
@@ -2467,171 +2058,107 @@ test('nth', async () => {
 })
 
 test('container queries', async () => {
-  let input = css`
-    @theme {
-      --container-lg: 1024px;
-      --container-foo-bar: 1440px;
-    }
-    @tailwind utilities;
-  `
-
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --container-lg: 1024px;
+        }
+        @tailwind utilities;
+      `,
       [
         '@lg:flex',
         '@lg/name:flex',
         '@[123px]:flex',
         '@[456px]/name:flex',
-        '@foo-bar:flex',
-        '@foo-bar/name:flex',
 
         '@min-lg:flex',
         '@min-lg/name:flex',
         '@min-[123px]:flex',
         '@min-[456px]/name:flex',
-        '@min-foo-bar:flex',
-        '@min-foo-bar/name:flex',
 
         '@max-lg:flex',
         '@max-lg/name:flex',
         '@max-[123px]:flex',
         '@max-[456px]/name:flex',
-        '@max-foo-bar:flex',
-        '@max-foo-bar/name:flex',
       ],
-      input,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @container name not (min-width: 1440px) {
-      .\\@max-foo-bar\\/name\\:flex {
-        display: flex;
-      }
-    }
-
-    @container not (min-width: 1440px) {
-      .\\@max-foo-bar\\:flex {
-        display: flex;
-      }
-    }
-
-    @container name not (min-width: 1024px) {
+    "@container name (width < 1024px) {
       .\\@max-lg\\/name\\:flex {
         display: flex;
       }
     }
 
-    @container not (min-width: 1024px) {
+    @container (width < 1024px) {
       .\\@max-lg\\:flex {
         display: flex;
       }
     }
 
-    @container name not (min-width: 456px) {
+    @container name (width < 456px) {
       .\\@max-\\[456px\\]\\/name\\:flex {
         display: flex;
       }
     }
 
-    @container not (min-width: 123px) {
+    @container (width < 123px) {
       .\\@max-\\[123px\\]\\:flex {
         display: flex;
       }
     }
 
-    @container (min-width: 123px) {
+    @container (width >= 123px) {
       .\\@\\[123px\\]\\:flex, .\\@min-\\[123px\\]\\:flex {
         display: flex;
       }
     }
 
-    @container name (min-width: 456px) {
+    @container name (width >= 456px) {
       .\\@\\[456px\\]\\/name\\:flex, .\\@min-\\[456px\\]\\/name\\:flex {
         display: flex;
       }
     }
 
-    @container name (min-width: 1024px) {
+    @container name (width >= 1024px) {
       .\\@lg\\/name\\:flex {
         display: flex;
       }
     }
 
-    @container (min-width: 1024px) {
+    @container (width >= 1024px) {
       .\\@lg\\:flex {
         display: flex;
       }
     }
 
-    @container name (min-width: 1024px) {
+    @container name (width >= 1024px) {
       .\\@min-lg\\/name\\:flex {
         display: flex;
       }
     }
 
-    @container (min-width: 1024px) {
+    @container (width >= 1024px) {
       .\\@min-lg\\:flex {
         display: flex;
       }
-    }
-
-    @container name (min-width: 1440px) {
-      .\\@foo-bar\\/name\\:flex {
-        display: flex;
-      }
-    }
-
-    @container (min-width: 1440px) {
-      .\\@foo-bar\\:flex {
-        display: flex;
-      }
-    }
-
-    @container name (min-width: 1440px) {
-      .\\@min-foo-bar\\/name\\:flex {
-        display: flex;
-      }
-    }
-
-    @container (min-width: 1440px) {
-      .\\@min-foo-bar\\:flex {
-        display: flex;
-      }
-    }
-    "
+    }"
   `)
-  expect(
-    await run(
-      [
-        '@-lg:flex',
-        '@-lg/name:flex',
-        '@-[123px]:flex',
-        '@-[456px]/name:flex',
-        '@-foo-bar:flex',
-        '@-foo-bar/name:flex',
-
-        '@-min-lg:flex',
-        '@-min-lg/name:flex',
-        '@-min-[123px]:flex',
-        '@-min-[456px]/name:flex',
-        '@-min-foo-bar:flex',
-        '@-min-foo-bar/name:flex',
-
-        '@-max-lg:flex',
-        '@-max-lg/name:flex',
-        '@-max-[123px]:flex',
-        '@-max-[456px]/name:flex',
-        '@-max-foo-bar:flex',
-        '@-max-foo-bar/name:flex',
-      ],
-      input,
-    ),
-  ).toEqual('')
 })
 
 test('variant order', async () => {
   expect(
-    await run(
+    await compileCss(
+      css`
+        @theme {
+          --breakpoint-sm: 640px;
+          --breakpoint-md: 768px;
+          --breakpoint-lg: 1024px;
+          --breakpoint-xl: 1280px;
+          --breakpoint-2xl: 1536px;
+        }
+        @tailwind utilities;
+      `,
       [
         '[&_p]:flex',
         '2xl:flex',
@@ -2708,29 +2235,10 @@ test('variant order', async () => {
         'visited:flex',
         'xl:flex',
       ],
-      css`
-        @theme {
-          --breakpoint-sm: 640px;
-          --breakpoint-md: 768px;
-          --breakpoint-lg: 1024px;
-          --breakpoint-xl: 1280px;
-          --breakpoint-2xl: 1536px;
-        }
-        @tailwind utilities;
-      `,
     ),
   ).toMatchInlineSnapshot(`
-    "
-    @layer properties {
-      @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
-        *, :before, :after, ::backdrop {
-          --tw-content: "";
-        }
-      }
-    }
-
-    @media (hover: hover) {
-      :is(:where(.group):hover .group-hover\\:flex), :is(:where(.peer):hover ~ .peer-hover\\:flex) {
+    "@media (hover: hover) {
+      .group-hover\\:flex:is(:where(.group):hover *), .peer-hover\\:flex:is(:where(.peer):hover ~ *) {
         display: flex;
       }
     }
@@ -2747,14 +2255,6 @@ test('variant order', async () => {
       display: flex;
     }
 
-    .marker\\:flex ::-webkit-details-marker {
-      display: flex;
-    }
-
-    .marker\\:flex::-webkit-details-marker {
-      display: flex;
-    }
-
     .selection\\:flex ::selection {
       display: flex;
     }
@@ -2780,15 +2280,7 @@ test('variant order', async () => {
       display: flex;
     }
 
-    .first\\:flex:first-child, .last\\:flex:last-child, .only\\:flex:only-child, .odd\\:flex:nth-child(odd), .even\\:flex:nth-child(2n), .first-of-type\\:flex:first-of-type, .last-of-type\\:flex:last-of-type, .only-of-type\\:flex:only-of-type, .visited\\:flex:visited, .target\\:flex:target, .open\\:flex:is([open], :popover-open, :open), .default\\:flex:default, .checked\\:flex:checked, .indeterminate\\:flex:indeterminate, .placeholder-shown\\:flex:placeholder-shown {
-      display: flex;
-    }
-
-    .autofill\\:flex:autofill {
-      display: flex;
-    }
-
-    .optional\\:flex:optional, .required\\:flex:required, .valid\\:flex:valid, .invalid\\:flex:invalid, .in-range\\:flex:in-range, .out-of-range\\:flex:out-of-range, .read-only\\:flex:read-only, .empty\\:flex:empty, .focus-within\\:flex:focus-within {
+    .first\\:flex:first-child, .last\\:flex:last-child, .only\\:flex:only-child, .odd\\:flex:nth-child(odd), .even\\:flex:nth-child(2n), .first-of-type\\:flex:first-of-type, .last-of-type\\:flex:last-of-type, .only-of-type\\:flex:only-of-type, .visited\\:flex:visited, .target\\:flex:target, .open\\:flex:is([open], :popover-open, :open), .default\\:flex:default, .checked\\:flex:checked, .indeterminate\\:flex:indeterminate, .placeholder-shown\\:flex:placeholder-shown, .autofill\\:flex:autofill, .optional\\:flex:optional, .required\\:flex:required, .valid\\:flex:valid, .invalid\\:flex:invalid, .in-range\\:flex:in-range, .out-of-range\\:flex:out-of-range, .read-only\\:flex:read-only, .empty\\:flex:empty, .focus-within\\:flex:focus-within {
       display: flex;
     }
 
@@ -2832,31 +2324,31 @@ test('variant order', async () => {
       }
     }
 
-    @media (min-width: 640px) {
+    @media (width >= 640px) {
       .sm\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 768px) {
+    @media (width >= 768px) {
       .md\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1024px) {
+    @media (width >= 1024px) {
       .lg\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1280px) {
+    @media (width >= 1280px) {
       .xl\\:flex {
         display: flex;
       }
     }
 
-    @media (min-width: 1536px) {
+    @media (width >= 1536px) {
       .\\32 xl\\:flex {
         display: flex;
       }
@@ -2904,8 +2396,7 @@ test('variant order', async () => {
       syntax: "*";
       inherits: false;
       initial-value: "";
-    }
-    "
+    }"
   `)
 })
 
@@ -2931,13 +2422,15 @@ test('variants with the same root are sorted deterministically', async () => {
   ])
 
   for (let classList of classLists) {
-    expect(await run(classList)).toMatchInlineSnapshot(`
-      "
-      .data-active\\:flex[data-active], .data-focus\\:flex[data-focus], .data-hover\\:flex[data-hover], .data-\\[bar\\]\\:flex[data-bar], .data-\\[baz\\]\\:flex[data-baz], .data-\\[foo\\]\\:flex[data-foo] {
-        display: flex;
-      }
-      "
-    `)
+    let output = await compileCss('@tailwind utilities;', classList)
+
+    expect(output.trim()).toEqual(
+      dedent(`
+        .data-active\\:flex[data-active], .data-focus\\:flex[data-focus], .data-hover\\:flex[data-hover], .data-\\[bar\\]\\:flex[data-bar], .data-\\[baz\\]\\:flex[data-baz], .data-\\[foo\\]\\:flex[data-foo] {
+          display: flex;
+        }
+      `),
+    )
   }
 })
 
@@ -2962,54 +2455,33 @@ test('matchVariant sorts deterministically', async () => {
   ])
 
   for (let classList of classLists) {
-    expect(
-      await run(classList, '@tailwind utilities; @plugin "./plugin.js";', {
-        async loadModule(_id: string) {
-          return {
-            path: '',
-            base: '/',
-            module: createPlugin(({ matchVariant }) => {
-              matchVariant('is-data', (value) => `&:is([data-${value}])`, {
-                values: {
-                  DEFAULT: 'default',
-                  foo: 'foo',
-                  bar: 'bar',
-                },
-              })
-            }),
-          }
-        },
-      }),
-    ).toMatchInlineSnapshot(`
-      "
-      .is-data\\:flex[data-default], .is-data-foo\\:flex[data-foo], .is-data-bar\\:flex[data-bar], .is-data-\\[potato\\]\\:flex[data-potato], .is-data-\\[sandwich\\]\\:flex[data-sandwich] {
-        display: flex;
-      }
-      "
-    `)
+    let output = await compileCss('@tailwind utilities; @plugin "./plugin.js";', classList, {
+      loadModule(id: string) {
+        return {
+          base: '/',
+          module: createPlugin(({ matchVariant }) => {
+            matchVariant('is-data', (value) => `&:is([data-${value}])`, {
+              values: {
+                DEFAULT: 'default',
+                foo: 'foo',
+                bar: 'bar',
+              },
+            })
+          }),
+        }
+      },
+    })
+
+    expect(output.trim()).toEqual(
+      dedent(`
+        .is-data\\:flex[data-default], .is-data-foo\\:flex[data-foo], .is-data-bar\\:flex[data-bar], .is-data-\\[potato\\]\\:flex[data-potato], .is-data-\\[sandwich\\]\\:flex[data-sandwich] {
+          display: flex;
+        }
+      `),
+    )
   }
 })
 
-test('move modifier of compound variant to sub-variant if its also a compound variant', async () => {
-  expect(
-    await run([
-      'not-group-focus/name:flex',
-      'has-group-focus/name:flex',
-      'in-group-focus/name:flex',
-
-      // Keep the `name` on the `group`, don't move it to the `peer` because
-      // that would be a breaking change.
-      'group-peer-focus/name:flex',
-    ]),
-  ).toMatchInlineSnapshot(`
-    "
-    .not-group-focus\\/name\\:flex:not(:is(:where(.group\\/name):focus *)), :is(:is(:where(.peer):focus ~ :where(.group\\/name)) .group-peer-focus\\/name\\:flex), :where(:is(:where(.group\\/name):focus *)) .in-group-focus\\/name\\:flex, .has-group-focus\\/name\\:flex:has(:is(:where(.group\\/name):focus *)) {
-      display: flex;
-    }
-    "
-  `)
-})
-
 test.each([
   // These are style rules
   [['.foo'], Compounds.StyleRules],
diff --git a/packages/tailwindcss/src/variants.ts b/packages/tailwindcss/src/variants.ts
index d2695b4d2..c428b3a1a 100644
--- a/packages/tailwindcss/src/variants.ts
+++ b/packages/tailwindcss/src/variants.ts
@@ -1,30 +1,31 @@
-import { Features } from '.'
 import {
+  WalkAction,
   atRoot,
   atRule,
-  cloneAstNode,
-  context,
   decl,
   rule,
   styleRule,
+  walk,
   type AstNode,
   type AtRule,
   type Rule,
   type StyleRule,
 } from './ast'
-import * as AttributeSelectorParser from './attribute-selector-parser'
 import { type Variant } from './candidate'
-import { applyVariant } from './compile'
-import type { DesignSystem } from './design-system'
+import {
+  enableDetailsContent,
+  enableInvertedColors,
+  enablePointerVariants,
+  enableScripting,
+  enableUserValid,
+} from './feature-flags'
 import type { Theme } from './theme'
 import { compareBreakpoints } from './utils/compare-breakpoints'
 import { DefaultMap } from './utils/default-map'
 import { isPositiveInteger } from './utils/infer-data-type'
 import { segment } from './utils/segment'
-import * as ValueParser from './value-parser'
-import { walk, WalkAction } from './walk'
 
-export const IS_VALID_VARIANT_NAME = /^@?[a-z0-9][a-zA-Z0-9_-]*(?<![_-])$/
+export const IS_VALID_VARIANT_NAME = /^@?[a-zA-Z0-9_-]*$/
 
 type VariantFn<T extends Variant['kind']> = (
   rule: Rule,
@@ -86,18 +87,13 @@ export class Variants {
     })
   }
 
-  fromAst(name: string, ast: AstNode[], designSystem: DesignSystem) {
+  fromAst(name: string, ast: AstNode[]) {
     let selectors: string[] = []
 
-    let usesAtVariant = false
-    let usesAtScope = false
     walk(ast, (node) => {
       if (node.kind === 'rule') {
         selectors.push(node.selector)
-      } else if (node.kind === 'at-rule' && node.name === '@variant') {
-        usesAtVariant = true
       } else if (node.kind === 'at-rule' && node.name !== '@slot') {
-        if (node.name === '@scope') usesAtScope = true
         selectors.push(`${node.name} ${node.params}`)
       }
     })
@@ -105,18 +101,13 @@ export class Variants {
     this.static(
       name,
       (r) => {
-        let body = ast.map(cloneAstNode)
-        if (usesAtVariant) substituteAtVariant(body, designSystem)
-
-        if (usesAtScope) {
-          substituteAtSlot(body, [context({ source: 'user' }, r.nodes)])
-          r.nodes = [context({ source: 'variant' }, body)]
-        } else {
-          substituteAtSlot(body, r.nodes)
-          r.nodes = body
-        }
+        let body = structuredClone(ast)
+        substituteAtSlot(body, r.nodes)
+        r.nodes = body
+      },
+      {
+        compounds: compoundsForSelectors(selectors),
       },
-      { compounds: compoundsForSelectors(selectors) },
     )
   }
 
@@ -386,83 +377,35 @@ export function createVariants(theme: Theme): Variants {
 
   function negateConditions(ruleName: string, conditions: string[]) {
     return conditions.map((condition) => {
-      switch (ruleName) {
-        case '@container': {
-          let ast = ValueParser.parse(condition.trim())
+      condition = condition.trim()
 
-          // @container {query}
-          //            ^^^^^^^
-          // ast        0
-          if (ast.length >= 1 && ast[0].kind === 'function') {
-            return `not ${condition}`
-          }
+      let parts = segment(condition, ' ')
 
-          // @container not   {query}
-          //            ^^^ ^ ^^^^^^^
-          // ast        0   1 2
-          else if (
-            ast.length >= 3 &&
-            ast[0].kind === 'word' &&
-            ast[0].value === 'not' &&
-            ast[2].kind === 'function'
-          ) {
-            // Drop the leading `not` (ast[0]) and separator (ast[1])
-            ast.splice(0, 2)
-
-            return ValueParser.toCss(ast)
-          }
-
-          // @container {name}   not   {query}
-          //            ^^^^^^ ^ ^^^ ^ ^^^^^^^
-          // ast        0      1 2   3 4
-          else if (
-            ast.length >= 5 &&
-            ast[0].kind === 'word' &&
-            ast[2].kind === 'word' &&
-            ast[2].value === 'not' &&
-            ast[4].kind === 'function'
-          ) {
-            // Drop the `not` (ast[2]) and separator (ast[3])
-            ast.splice(2, 2)
-
-            return ValueParser.toCss(ast)
-          }
-
-          // @container {name}   {query}
-          //            ^^^^^^ ^ ^^^^^^^
-          // ast        0      1 2
-          else if (
-            ast.length >= 3 &&
-            ast[0].kind === 'word' &&
-            ast[0].value !== 'not' &&
-            ast[2].kind === 'function'
-          ) {
-            // Inject a separator and a `not`, after the `name` (ast[0])
-            ast.splice(1, 0, { kind: 'separator', value: ' ' }, { kind: 'word', value: 'not' })
-
-            return ValueParser.toCss(ast)
-          }
-
-          // Fallback
-          else {
-            return `not ${condition}`
-          }
-        }
-
-        default: {
-          condition = condition.trim()
-
-          let parts = segment(condition, ' ')
-
-          // @media not {query}
-          // @supports not {query}
-          if (parts[0] === 'not') {
-            return parts.slice(1).join(' ')
-          }
+      // @media not {query}
+      // @supports not {query}
+      // @container not {query}
+      if (parts[0] === 'not') {
+        return parts.slice(1).join(' ')
+      }
 
+      if (ruleName === '@container') {
+        // @container {query}
+        if (parts[0][0] === '(') {
           return `not ${condition}`
         }
+
+        // @container {name} not {query}
+        else if (parts[1] === 'not') {
+          return `${parts[0]} ${parts.slice(2).join(' ')}`
+        }
+
+        // @container {name} {query}
+        else {
+          return `${parts[0]} not ${parts.slice(1).join(' ')}`
+        }
       }
+
+      return `not ${condition}`
     })
   }
 
@@ -507,7 +450,7 @@ export function createVariants(theme: Theme): Variants {
 
     let didApply = false
 
-    walk([ruleNode], (node, ctx) => {
+    walk([ruleNode], (node, { path }) => {
       if (node.kind !== 'rule' && node.kind !== 'at-rule') return WalkAction.Continue
       if (node.nodes.length > 0) return WalkAction.Continue
 
@@ -515,14 +458,11 @@ export function createVariants(theme: Theme): Variants {
       let atRules: AtRule[] = []
       let styleRules: StyleRule[] = []
 
-      let path = ctx.path()
-      path.push(node)
-
-      for (let node of path) {
-        if (node.kind === 'at-rule') {
-          atRules.push(node)
-        } else if (node.kind === 'rule') {
-          styleRules.push(node)
+      for (let parent of path) {
+        if (parent.kind === 'at-rule') {
+          atRules.push(parent)
+        } else if (parent.kind === 'rule') {
+          styleRules.push(parent)
         }
       }
 
@@ -586,11 +526,11 @@ export function createVariants(theme: Theme): Variants {
 
     let didApply = false
 
-    walk([ruleNode], (node, ctx) => {
+    walk([ruleNode], (node, { path }) => {
       if (node.kind !== 'rule') return WalkAction.Continue
 
       // Throw out any candidates with variants using nested style rules
-      for (let parent of ctx.path()) {
+      for (let parent of path.slice(0, -1)) {
         if (parent.kind !== 'rule') continue
 
         didApply = false
@@ -610,13 +550,7 @@ export function createVariants(theme: Theme): Variants {
         selector = `:is(${selector})`
       }
 
-      // Put the target inside `:is` so browsers can limit style invalidation to
-      // it when the group changes. Keep `&` instead of the candidate's class so
-      // this also works with `@apply` and variants that change the target.
-      //
-      // The `:is` wrapper also keeps `has-group-*` from anchoring the group
-      // itself to the element carrying the utility.
-      node.selector = `:is(${selector} &)`
+      node.selector = `&:is(${selector} *)`
 
       // Track that the variant was actually applied
       didApply = true
@@ -644,11 +578,11 @@ export function createVariants(theme: Theme): Variants {
 
     let didApply = false
 
-    walk([ruleNode], (node, ctx) => {
+    walk([ruleNode], (node, { path }) => {
       if (node.kind !== 'rule') return WalkAction.Continue
 
       // Throw out any candidates with variants using nested style rules
-      for (let parent of ctx.path()) {
+      for (let parent of path.slice(0, -1)) {
         if (parent.kind !== 'rule') continue
 
         didApply = false
@@ -657,7 +591,7 @@ export function createVariants(theme: Theme): Variants {
 
       // For most variants we rely entirely on CSS nesting to build-up the final
       // selector, but there is no way to use CSS nesting to make `&` refer to
-      // just the `.peer` class the way we'd need to for these variants, so we
+      // just the `.group` class the way we'd need to for these variants, so we
       // need to replace it in the selector ourselves.
       let selector = node.selector.replaceAll('&', variantSelector)
 
@@ -668,8 +602,7 @@ export function createVariants(theme: Theme): Variants {
         selector = `:is(${selector})`
       }
 
-      // As with `group`, constrain the target without repeating its selector.
-      node.selector = `:is(${selector} ~ &)`
+      node.selector = `&:is(${selector} ~ *)`
 
       // Track that the variant was actually applied
       didApply = true
@@ -689,18 +622,16 @@ export function createVariants(theme: Theme): Variants {
   staticVariant('first-letter', ['&::first-letter'])
   staticVariant('first-line', ['&::first-line'])
 
-  staticVariant('marker', [
-    '& *::marker',
-    '&::marker',
-    '& *::-webkit-details-marker',
-    '&::-webkit-details-marker',
-  ])
+  // TODO: Remove alpha vars or no?
+  staticVariant('marker', ['& *::marker', '&::marker'])
 
   staticVariant('selection', ['& *::selection', '&::selection'])
   staticVariant('file', ['&::file-selector-button'])
   staticVariant('placeholder', ['&::placeholder'])
   staticVariant('backdrop', ['&::backdrop'])
-  staticVariant('details-content', ['&::details-content'])
+  if (enableDetailsContent) {
+    staticVariant('details-content', ['&::details-content'])
+  }
 
   {
     function contentProperties() {
@@ -766,8 +697,10 @@ export function createVariants(theme: Theme): Variants {
   staticVariant('required', ['&:required'])
   staticVariant('valid', ['&:valid'])
   staticVariant('invalid', ['&:invalid'])
-  staticVariant('user-valid', ['&:user-valid'])
-  staticVariant('user-invalid', ['&:user-invalid'])
+  if (enableUserValid) {
+    staticVariant('user-valid', ['&:user-valid'])
+    staticVariant('user-invalid', ['&:user-invalid'])
+  }
   staticVariant('in-range', ['&:in-range'])
   staticVariant('out-of-range', ['&:out-of-range'])
   staticVariant('read-only', ['&:read-only'])
@@ -793,11 +726,11 @@ export function createVariants(theme: Theme): Variants {
 
     let didApply = false
 
-    walk([ruleNode], (node, ctx) => {
+    walk([ruleNode], (node, { path }) => {
       if (node.kind !== 'rule') return WalkAction.Continue
 
       // Throw out any candidates with variants using nested style rules
-      for (let parent of ctx.path()) {
+      for (let parent of path.slice(0, -1)) {
         if (parent.kind !== 'rule') continue
 
         didApply = false
@@ -828,11 +761,11 @@ export function createVariants(theme: Theme): Variants {
 
     let didApply = false
 
-    walk([ruleNode], (node, ctx) => {
+    walk([ruleNode], (node, { path }) => {
       if (node.kind !== 'rule') return WalkAction.Continue
 
       // Throw out any candidates with variants using nested style rules
-      for (let parent of ctx.path()) {
+      for (let parent of path.slice(0, -1)) {
         if (parent.kind !== 'rule') continue
 
         didApply = false
@@ -862,15 +795,11 @@ export function createVariants(theme: Theme): Variants {
     if (!variant.value || variant.modifier) return null
 
     if (variant.value.kind === 'arbitrary') {
-      let selector = `[aria-${quoteAttributeValue(variant.value.value)}]`
-      let parsed = AttributeSelectorParser.parse(selector)
-      if (parsed === null) return null
-      ruleNode.nodes = [styleRule(`&${selector}`, ruleNode.nodes)]
+      ruleNode.nodes = [
+        styleRule(`&[aria-${quoteAttributeValue(variant.value.value)}]`, ruleNode.nodes),
+      ]
     } else {
-      let selector = `[aria-${variant.value.value}="true"]`
-      let parsed = AttributeSelectorParser.parse(selector)
-      if (parsed === null) return null
-      ruleNode.nodes = [styleRule(`&${selector}`, ruleNode.nodes)]
+      ruleNode.nodes = [styleRule(`&[aria-${variant.value.value}="true"]`, ruleNode.nodes)]
     }
   })
 
@@ -889,11 +818,9 @@ export function createVariants(theme: Theme): Variants {
   variants.functional('data', (ruleNode, variant) => {
     if (!variant.value || variant.modifier) return null
 
-    let selector = `[data-${quoteAttributeValue(variant.value.value)}]`
-    let parsed = AttributeSelectorParser.parse(selector)
-    if (parsed === null) return null
-
-    ruleNode.nodes = [styleRule(`&${selector}`, ruleNode.nodes)]
+    ruleNode.nodes = [
+      styleRule(`&[data-${quoteAttributeValue(variant.value.value)}]`, ruleNode.nodes),
+    ]
   })
 
   variants.functional('nth', (ruleNode, variant) => {
@@ -945,22 +872,7 @@ export function createVariants(theme: Theme): Variants {
       if (/^[\w-]*\s*\(/.test(value)) {
         // Chrome has a bug where `(condition1)or(condition2)` is not valid, but
         // `(condition1) or (condition2)` is supported.
-        let changed = false
-        let ast = ValueParser.parse(value)
-        walk(ast, (node) => {
-          if (node.kind !== 'function') return
-
-          // Leave selectors as-is, they could contain `selector(a:not(b))`, and
-          // in this case we don't want the space around the `not`.
-          if (node.value === 'selector') return WalkAction.Skip
-
-          if (node.value === 'and' || node.value === 'or' || node.value === 'not') {
-            changed = true
-            node.value = ` ${node.value} `
-          }
-        })
-
-        let query = changed ? ValueParser.toCss(ast) : value
+        let query = value.replace(/\b(and|or|not)\b/g, ' $1 ')
 
         ruleNode.nodes = [atRule('@supports', query, ruleNode.nodes)]
         return
@@ -1235,16 +1147,24 @@ export function createVariants(theme: Theme): Variants {
 
   staticVariant('forced-colors', ['@media (forced-colors: active)'])
 
-  staticVariant('inverted-colors', ['@media (inverted-colors: inverted)'])
+  if (enableInvertedColors) {
+    staticVariant('inverted-colors', ['@media (inverted-colors: inverted)'])
+  }
 
-  staticVariant('pointer-none', ['@media (pointer: none)'])
-  staticVariant('pointer-coarse', ['@media (pointer: coarse)'])
-  staticVariant('pointer-fine', ['@media (pointer: fine)'])
-  staticVariant('any-pointer-none', ['@media (any-pointer: none)'])
-  staticVariant('any-pointer-coarse', ['@media (any-pointer: coarse)'])
-  staticVariant('any-pointer-fine', ['@media (any-pointer: fine)'])
+  if (enablePointerVariants) {
+    staticVariant('pointer-none', ['@media (pointer: none)'])
+    staticVariant('pointer-coarse', ['@media (pointer: coarse)'])
+    staticVariant('pointer-fine', ['@media (pointer: fine)'])
+    staticVariant('any-pointer-none', ['@media (any-pointer: none)'])
+    staticVariant('any-pointer-coarse', ['@media (any-pointer: coarse)'])
+    staticVariant('any-pointer-fine', ['@media (any-pointer: fine)'])
+  }
 
-  staticVariant('noscript', ['@media (scripting: none)'])
+  if (enableScripting) {
+    staticVariant('scripting-initial', ['@media (scripting: initial-only)'])
+    staticVariant('scripting-none', ['@media (scripting: none)'])
+    staticVariant('scripting', ['@media (scripting: enabled)'])
+  }
 
   return variants
 }
@@ -1280,10 +1200,10 @@ function quoteAttributeValue(input: string) {
 }
 
 export function substituteAtSlot(ast: AstNode[], nodes: AstNode[]) {
-  walk(ast, (node) => {
+  walk(ast, (node, { replaceWith }) => {
     // Replace `@slot` with rule nodes
     if (node.kind === 'at-rule' && node.name === '@slot') {
-      return WalkAction.ReplaceSkip(nodes)
+      replaceWith(nodes)
     }
 
     // Wrap `@keyframes` and `@property` in `AtRoot` nodes
@@ -1293,56 +1213,3 @@ export function substituteAtSlot(ast: AstNode[], nodes: AstNode[]) {
     }
   })
 }
-
-export function substituteAtVariant(ast: AstNode[], designSystem: DesignSystem): Features {
-  let features = Features.None
-  walk(ast, (variantNode) => {
-    if (variantNode.kind !== 'at-rule' || variantNode.name !== '@variant') return
-
-    let nodes: AstNode[] = []
-    let compoundVariants = segment(variantNode.params, ',')
-    for (let [idx, compoundVariant] of compoundVariants.entries()) {
-      // Starting with the `&` rule node
-      //
-      // Only clone the nodes when we have multiple compound variants to deal
-      // with. The last one can use the original nodes. We do need unique AST
-      // nodes for sourcemap `dst` location information.
-      let node = styleRule(
-        '&',
-        idx === compoundVariants.length - 1
-          ? variantNode.nodes
-          : variantNode.nodes.map(cloneAstNode),
-      )
-
-      let stackedVariants = segment(compoundVariant, ':')
-      for (let i = stackedVariants.length - 1; i >= 0; --i) {
-        let variant = stackedVariants[i].trim()
-
-        if (!variant) {
-          throw new Error(`Cannot use \`@variant\` with empty variant`)
-        }
-
-        let variantAst = designSystem.parseVariant(variant)
-        if (variantAst === null) {
-          throw new Error(`Cannot use \`@variant\` with unknown variant: ${variant}`)
-        }
-
-        let result = applyVariant(node, variantAst, designSystem.variants)
-        if (result === null) {
-          throw new Error(`Cannot use \`@variant\` with variant: ${variant}`)
-        }
-      }
-
-      if (node.selector === '&') {
-        nodes.push(...node.nodes)
-      } else {
-        nodes.push(node)
-      }
-    }
-
-    // Update the variant at-rule node, to be the `&` rule node
-    features |= Features.Variants
-    return WalkAction.Replace(nodes)
-  })
-  return features
-}
diff --git a/packages/tailwindcss/src/walk.test.ts b/packages/tailwindcss/src/walk.test.ts
deleted file mode 100644
index 794d7e629..000000000
--- a/packages/tailwindcss/src/walk.test.ts
+++ /dev/null
@@ -1,1598 +0,0 @@
-import { describe, expect, test } from 'vitest'
-import { decl, rule, toCss, type AstNode as CSSAstNode } from './ast'
-import { walk, WalkAction } from './walk'
-
-type AstNode = { kind: string } | { kind: string; nodes: AstNode[] }
-
-describe('AST Enter (function)', () => {
-  test('visit all nodes in an AST', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'])
-  })
-
-  test('visit all nodes in an AST and calculate their path', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let paths: string[] = []
-    walk(ast, (node, ctx) => {
-      let path = ctx.path().map((n) => n.kind)
-      if (path.length === 0) path.unshift('ø')
-      path.push(node.kind)
-
-      paths.push(path.join(' → ') || 'ø')
-    })
-
-    expect(`\n${paths.join('\n')}\n`).toMatchInlineSnapshot(`
-      "
-      ø → a
-      a → b
-      a → b → c
-      a → d
-      a → d → e
-      a → d → e → f
-      a → g
-      a → g → h
-      ø → i
-      "
-    `)
-  })
-
-  test("skip a node's children (first node)", () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'b') {
-        return WalkAction.Skip
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'd', 'e', 'f', 'g', 'h', 'i'])
-  })
-
-  test("skip a node's children (middle node)", () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'd') {
-        return WalkAction.Skip
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'g', 'h', 'i'])
-  })
-
-  test("skip a node's children (last node)", () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'g') {
-        return WalkAction.Skip
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'i'])
-  })
-
-  test('stop entirely', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'd') {
-        return WalkAction.Stop
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd'])
-  })
-
-  test('replace a node, and visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'd') {
-        return WalkAction.Replace([
-          { kind: 'e1', nodes: [{ kind: 'f1' }] },
-          { kind: 'e2', nodes: [{ kind: 'f2' }] },
-        ])
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-
-  test('replace a node, and not visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'd') {
-        return WalkAction.ReplaceSkip([
-          { kind: 'e1', nodes: [{ kind: 'f1' }] },
-          { kind: 'e2', nodes: [{ kind: 'f2' }] },
-        ])
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'g', 'h', 'i'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-
-  test('replace a leaf node, and visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'f') {
-        return WalkAction.Replace([
-          { kind: 'foo1', nodes: [{ kind: 'bar1' }] },
-          { kind: 'foo2', nodes: [{ kind: 'bar2' }] },
-        ])
-      }
-    })
-
-    expect(visited).toEqual([
-      'a',
-      'b',
-      'c',
-      'd',
-      'e',
-      'f',
-      'foo1',
-      'bar1',
-      'foo2',
-      'bar2',
-      'g',
-      'h',
-      'i',
-    ])
-  })
-
-  test('replace a leaf node, and not visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'f') {
-        return WalkAction.ReplaceSkip([
-          { kind: 'foo1', nodes: [{ kind: 'bar1' }] },
-          { kind: 'foo2', nodes: [{ kind: 'bar2' }] },
-        ])
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual([
-      'a',
-      'b',
-      'c',
-      'd',
-      'e',
-      'foo1',
-      'bar1',
-      'foo2',
-      'bar2',
-      'g',
-      'h',
-      'i',
-    ])
-  })
-
-  test('replace a node, and stop the walk entirely', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, (node) => {
-      visited.push(node.kind)
-
-      if (node.kind === 'd') {
-        return WalkAction.ReplaceStop([
-          { kind: 'e1', nodes: [{ kind: 'f1' }] },
-          { kind: 'e2', nodes: [{ kind: 'f2' }] },
-        ])
-      }
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-})
-
-describe('AST Enter (obj)', () => {
-  test('visit all nodes in an AST', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'])
-  })
-
-  test('visit all nodes in an AST and calculate their path', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let paths: string[] = []
-    walk(ast, {
-      enter(node, ctx) {
-        let path = ctx.path().map((n) => n.kind)
-        if (path.length === 0) path.unshift('ø')
-        path.push(node.kind)
-
-        paths.push(path.join(' → ') || 'ø')
-      },
-    })
-
-    expect(`\n${paths.join('\n')}\n`).toMatchInlineSnapshot(`
-      "
-      ø → a
-      a → b
-      a → b → c
-      a → d
-      a → d → e
-      a → d → e → f
-      a → g
-      a → g → h
-      ø → i
-      "
-    `)
-  })
-
-  test("skip a node's children (first node)", () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'b') {
-          return WalkAction.Skip
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'd', 'e', 'f', 'g', 'h', 'i'])
-  })
-
-  test("skip a node's children (middle node)", () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.Skip
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'g', 'h', 'i'])
-  })
-
-  test("skip a node's children (last node)", () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'g') {
-          return WalkAction.Skip
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'i'])
-  })
-
-  test('stop entirely', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.Stop
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd'])
-  })
-
-  test('replace a node, and visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.Replace([
-            { kind: 'e1', nodes: [{ kind: 'f1' }] },
-            { kind: 'e2', nodes: [{ kind: 'f2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-
-  test('replace a node, and not visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.ReplaceSkip([
-            { kind: 'e1', nodes: [{ kind: 'f1' }] },
-            { kind: 'e2', nodes: [{ kind: 'f2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'g', 'h', 'i'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-
-  test('replace a leaf node, and visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'f') {
-          return WalkAction.Replace([
-            { kind: 'foo1', nodes: [{ kind: 'bar1' }] },
-            { kind: 'foo2', nodes: [{ kind: 'bar2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual([
-      'a',
-      'b',
-      'c',
-      'd',
-      'e',
-      'f',
-      'foo1',
-      'bar1',
-      'foo2',
-      'bar2',
-      'g',
-      'h',
-      'i',
-    ])
-  })
-
-  test('replace a leaf node, and not visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'f') {
-          return WalkAction.ReplaceSkip([
-            { kind: 'foo1', nodes: [{ kind: 'bar1' }] },
-            { kind: 'foo2', nodes: [{ kind: 'bar2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual([
-      'a',
-      'b',
-      'c',
-      'd',
-      'e',
-      'foo1',
-      'bar1',
-      'foo2',
-      'bar2',
-      'g',
-      'h',
-      'i',
-    ])
-  })
-
-  test('replace a node, and stop the walk entirely', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.ReplaceStop([
-            { kind: 'e1', nodes: [{ kind: 'f1' }] },
-            { kind: 'e2', nodes: [{ kind: 'f2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-})
-
-describe('AST Exit (obj)', () => {
-  test('visit all nodes in an AST', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      exit(node) {
-        visited.push(node.kind)
-      },
-    })
-
-    expect(visited).toEqual(['c', 'b', 'f', 'e', 'd', 'h', 'g', 'a', 'i'])
-  })
-
-  test('visit all nodes in an AST and calculate their path', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let paths: string[] = []
-    walk(ast, {
-      exit(node, ctx) {
-        let path = ctx.path().map((n) => n.kind)
-        if (path.length === 0) path.unshift('ø')
-        path.push(node.kind)
-
-        paths.push(path.join(' → ') || 'ø')
-      },
-    })
-
-    expect(`\n${paths.join('\n')}\n`).toMatchInlineSnapshot(`
-      "
-      a → b → c
-      a → b
-      a → d → e → f
-      a → d → e
-      a → d
-      a → g → h
-      a → g
-      ø → a
-      ø → i
-      "
-    `)
-  })
-
-  test('stop entirely', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      exit(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.Stop
-        }
-      },
-    })
-
-    expect(visited).toEqual(['c', 'b', 'f', 'e', 'd'])
-  })
-
-  test('replace a node, and not visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      exit(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.Replace([
-            { kind: 'e1', nodes: [{ kind: 'f1' }] },
-            { kind: 'e2', nodes: [{ kind: 'f2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['c', 'b', 'f', 'e', 'd', 'h', 'g', 'a', 'i'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-
-  test('replace a leaf node, and not visit the replacements', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      exit(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'f') {
-          return WalkAction.Replace([{ kind: 'f1' }, { kind: 'f2' }])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['c', 'b', 'f', 'e', 'd', 'h', 'g', 'a', 'i'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f1', 'f2', 'g', 'h', 'i'])
-  })
-
-  test('replace a node, and stop the walk entirely', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      exit(node) {
-        visited.push(node.kind)
-
-        if (node.kind === 'd') {
-          return WalkAction.ReplaceStop([
-            { kind: 'e1', nodes: [{ kind: 'f1' }] },
-            { kind: 'e2', nodes: [{ kind: 'f2' }] },
-          ])
-        }
-      },
-    })
-
-    expect(visited).toEqual(['c', 'b', 'f', 'e', 'd'])
-
-    // Let's walk the mutated AST again, to ensure that we properly replaced the
-    // node with new nodes.
-    visited.splice(0)
-    walk(ast, (node) => {
-      visited.push(node.kind)
-    })
-
-    expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-  })
-})
-
-describe('AST Enter & Exit', () => {
-  test('visit all nodes in an AST', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let visited: string[] = []
-    walk(ast, {
-      enter(node, ctx) {
-        expect(ctx.index).toEqual(ctx.siblings.indexOf(node))
-        visited.push(`${'  '.repeat(ctx.depth)} Enter(${node.kind} @ ${ctx.index})`)
-      },
-      exit(node, ctx) {
-        expect(ctx.index).toEqual(ctx.siblings.indexOf(node))
-        visited.push(`${'  '.repeat(ctx.depth)} Exit(${node.kind} @ ${ctx.index})`)
-      },
-    })
-
-    expect(`\n${visited.join('\n')}\n`).toMatchInlineSnapshot(`
-      "
-       Enter(a @ 0)
-         Enter(b @ 0)
-           Enter(c @ 0)
-           Exit(c @ 0)
-         Exit(b @ 0)
-         Enter(d @ 1)
-           Enter(e @ 0)
-             Enter(f @ 0)
-             Exit(f @ 0)
-           Exit(e @ 0)
-         Exit(d @ 1)
-         Enter(g @ 2)
-           Enter(h @ 0)
-           Exit(h @ 0)
-         Exit(g @ 2)
-       Exit(a @ 0)
-       Enter(i @ 1)
-       Exit(i @ 1)
-      "
-    `)
-  })
-
-  test('visit all nodes in an AST and calculate their path', () => {
-    let ast: AstNode[] = [
-      {
-        kind: 'a',
-        nodes: [
-          { kind: 'b', nodes: [{ kind: 'c' }] },
-          { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-          { kind: 'g', nodes: [{ kind: 'h' }] },
-        ],
-      },
-      { kind: 'i' },
-    ]
-
-    let paths: string[] = []
-    walk(ast, {
-      enter(node, ctx) {
-        let path = ctx.path().map((n) => n.kind)
-        if (path.length === 0) path.unshift('ø')
-        path.push(node.kind)
-
-        paths.push(`Enter(${path.join(' → ') || 'ø'})`)
-      },
-      exit(node, ctx) {
-        let path = ctx.path().map((n) => n.kind)
-        if (path.length === 0) path.unshift('ø')
-        path.push(node.kind)
-
-        paths.push(`Exit(${path.join(' → ') || 'ø'})`)
-      },
-    })
-
-    expect(`\n${paths.join('\n')}\n`).toMatchInlineSnapshot(`
-      "
-      Enter(ø → a)
-      Enter(a → b)
-      Enter(a → b → c)
-      Exit(a → b → c)
-      Exit(a → b)
-      Enter(a → d)
-      Enter(a → d → e)
-      Enter(a → d → e → f)
-      Exit(a → d → e → f)
-      Exit(a → d → e)
-      Exit(a → d)
-      Enter(a → g)
-      Enter(a → g → h)
-      Exit(a → g → h)
-      Exit(a → g)
-      Exit(ø → a)
-      Enter(ø → i)
-      Exit(ø → i)
-      "
-    `)
-  })
-
-  test('"real" world use case', () => {
-    let ast: CSSAstNode[] = [
-      rule('.example', [
-        decl('margin-top', '12px'),
-        decl('padding', '8px'),
-        decl('margin', '16px 18px'),
-        decl('colors', 'red'),
-      ]),
-    ]
-
-    walk(ast, {
-      enter(node) {
-        // Expand `margin` shorthand into multiple properties
-        if (node.kind === 'declaration' && node.property === 'margin' && node.value) {
-          let [y, x] = node.value.split(' ')
-          return WalkAction.Replace([
-            decl('margin-top', y),
-            decl('margin-bottom', y),
-            decl('margin-left', x),
-            decl('margin-right', x),
-          ])
-        }
-
-        // These properties should not be uppercased, so skip them
-        else if (node.kind === 'declaration' && node.property === 'colors' && node.value) {
-          return WalkAction.ReplaceSkip([
-            decl('color', node.value),
-            decl('background-color', node.value),
-            decl('border-color', node.value),
-          ])
-        }
-
-        // Make all properties uppercase (this should see the expanded margin properties as well)
-        // but it should not see the `color` property as we skipped it above.
-        else if (node.kind === 'declaration') {
-          node.property = node.property.toUpperCase()
-        }
-      },
-
-      exit(node) {
-        // Sort declarations alphabetically within a rule (this should see the
-        // nodes after transformations in `enter` phase)
-        if (node.kind === 'rule') {
-          node.nodes.sort((a, z) => {
-            if (a.kind === 'declaration' && z.kind === 'declaration') {
-              return a.property.localeCompare(z.property)
-            }
-
-            // Stable sort
-            return 0
-          })
-        }
-      },
-    })
-
-    expect(toCss(ast)).toMatchInlineSnapshot(`
-      ".example {
-        background-color: red;
-        border-color: red;
-        color: red;
-        MARGIN-BOTTOM: 16px;
-        MARGIN-LEFT: 18px;
-        MARGIN-RIGHT: 18px;
-        MARGIN-TOP: 12px;
-        MARGIN-TOP: 16px;
-        PADDING: 8px;
-      }
-      "
-    `)
-  })
-
-  describe('enter phase', () => {
-    test('visit all nodes in an AST', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'])
-    })
-
-    test("skip a node's children (first node)", () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'b') {
-            return WalkAction.Skip
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'd', 'e', 'f', 'g', 'h', 'i'])
-    })
-
-    test("skip a node's children (middle node)", () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.Skip
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd', 'g', 'h', 'i'])
-    })
-
-    test("skip a node's children (last node)", () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'g') {
-            return WalkAction.Skip
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'i'])
-    })
-
-    test('stop entirely', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.Stop
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd'])
-    })
-
-    test('replace a node, and visit the replacements', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.Replace([
-              { kind: 'e1', nodes: [{ kind: 'f1' }] },
-              { kind: 'e2', nodes: [{ kind: 'f2' }] },
-            ])
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-    })
-
-    test('replace a node, and not visit the replacements', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.ReplaceSkip([
-              { kind: 'e1', nodes: [{ kind: 'f1' }] },
-              { kind: 'e2', nodes: [{ kind: 'f2' }] },
-            ])
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd', 'g', 'h', 'i'])
-
-      // Let's walk the mutated AST again, to ensure that we properly replaced the
-      // node with new nodes.
-      visited.splice(0)
-      walk(ast, (node) => {
-        visited.push(node.kind)
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-    })
-
-    test('replace a leaf node, and visit the replacements', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'f') {
-            return WalkAction.Replace([
-              { kind: 'foo1', nodes: [{ kind: 'bar1' }] },
-              { kind: 'foo2', nodes: [{ kind: 'bar2' }] },
-            ])
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual([
-        'a',
-        'b',
-        'c',
-        'd',
-        'e',
-        'f',
-        'foo1',
-        'bar1',
-        'foo2',
-        'bar2',
-        'g',
-        'h',
-        'i',
-      ])
-    })
-
-    test('replace a leaf node, and not visit the replacements', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'f') {
-            return WalkAction.ReplaceSkip([
-              { kind: 'foo1', nodes: [{ kind: 'bar1' }] },
-              { kind: 'foo2', nodes: [{ kind: 'bar2' }] },
-            ])
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'])
-
-      // Let's walk the mutated AST again, to ensure that we properly replaced the
-      // node with new nodes.
-      visited.splice(0)
-      walk(ast, (node) => {
-        visited.push(node.kind)
-      })
-
-      expect(visited).toEqual([
-        'a',
-        'b',
-        'c',
-        'd',
-        'e',
-        'foo1',
-        'bar1',
-        'foo2',
-        'bar2',
-        'g',
-        'h',
-        'i',
-      ])
-    })
-
-    test('replace a node, and stop the walk entirely', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.ReplaceStop([
-              { kind: 'e1', nodes: [{ kind: 'f1' }] },
-              { kind: 'e2', nodes: [{ kind: 'f2' }] },
-            ])
-          }
-        },
-        exit() {},
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'd'])
-
-      // Let's walk the mutated AST again, to ensure that we properly replaced the
-      // node with new nodes.
-      visited.splice(0)
-      walk(ast, (node) => {
-        visited.push(node.kind)
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-    })
-  })
-
-  describe('exit phase', () => {
-    test('visit all nodes in an AST', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter() {},
-        exit(node) {
-          visited.push(node.kind)
-        },
-      })
-
-      expect(visited).toEqual(['c', 'b', 'f', 'e', 'd', 'h', 'g', 'a', 'i'])
-    })
-
-    test('stop entirely', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter() {},
-        exit(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.Stop
-          }
-        },
-      })
-
-      expect(visited).toEqual(['c', 'b', 'f', 'e', 'd'])
-    })
-
-    test('replace a node, and not visit the replacements', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter() {},
-        exit(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.Replace([
-              { kind: 'e1', nodes: [{ kind: 'f1' }] },
-              { kind: 'e2', nodes: [{ kind: 'f2' }] },
-            ])
-          }
-        },
-      })
-
-      expect(visited).toEqual(['c', 'b', 'f', 'e', 'd', 'h', 'g', 'a', 'i'])
-
-      // Let's walk the mutated AST again, to ensure that we properly replaced the
-      // node with new nodes.
-      visited.splice(0)
-      walk(ast, (node) => {
-        visited.push(node.kind)
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-    })
-
-    test('replace a node, and stop the walk entirely', () => {
-      let ast: AstNode[] = [
-        {
-          kind: 'a',
-          nodes: [
-            { kind: 'b', nodes: [{ kind: 'c' }] },
-            { kind: 'd', nodes: [{ kind: 'e', nodes: [{ kind: 'f' }] }] },
-            { kind: 'g', nodes: [{ kind: 'h' }] },
-          ],
-        },
-        { kind: 'i' },
-      ]
-
-      let visited: string[] = []
-      walk(ast, {
-        enter() {},
-        exit(node) {
-          visited.push(node.kind)
-
-          if (node.kind === 'd') {
-            return WalkAction.ReplaceStop([
-              { kind: 'e1', nodes: [{ kind: 'f1' }] },
-              { kind: 'e2', nodes: [{ kind: 'f2' }] },
-            ])
-          }
-        },
-      })
-
-      expect(visited).toEqual(['c', 'b', 'f', 'e', 'd'])
-
-      // Let's walk the mutated AST again, to ensure that we properly replaced the
-      // node with new nodes.
-      visited.splice(0)
-      walk(ast, (node) => {
-        visited.push(node.kind)
-      })
-
-      expect(visited).toEqual(['a', 'b', 'c', 'e1', 'f1', 'e2', 'f2', 'g', 'h', 'i'])
-    })
-  })
-})
diff --git a/packages/tailwindcss/src/walk.ts b/packages/tailwindcss/src/walk.ts
deleted file mode 100644
index 2c268a7bd..000000000
--- a/packages/tailwindcss/src/walk.ts
+++ /dev/null
@@ -1,204 +0,0 @@
-const enum WalkKind {
-  Continue,
-  Skip,
-  Stop,
-  Replace,
-  ReplaceSkip,
-  ReplaceStop,
-}
-
-export const WalkAction = {
-  Continue: { kind: WalkKind.Continue } as const,
-  Skip: { kind: WalkKind.Skip } as const,
-  Stop: { kind: WalkKind.Stop } as const,
-  Replace: <T>(nodes: T | T[]) =>
-    ({ kind: WalkKind.Replace, nodes: Array.isArray(nodes) ? nodes : [nodes] }) as const,
-  ReplaceSkip: <T>(nodes: T | T[]) =>
-    ({ kind: WalkKind.ReplaceSkip, nodes: Array.isArray(nodes) ? nodes : [nodes] }) as const,
-  ReplaceStop: <T>(nodes: T | T[]) =>
-    ({ kind: WalkKind.ReplaceStop, nodes: Array.isArray(nodes) ? nodes : [nodes] }) as const,
-} as const
-
-type WalkAction = typeof WalkAction
-type WalkResult<T> =
-  | WalkAction['Continue']
-  | WalkAction['Skip']
-  | WalkAction['Stop']
-  | ReturnType<typeof WalkAction.Replace<T>>
-  | ReturnType<typeof WalkAction.ReplaceSkip<T>>
-  | ReturnType<typeof WalkAction.ReplaceStop<T>>
-
-type EnterResult<T> = WalkResult<T>
-type ExitResult<T> = Exclude<WalkResult<T>, { kind: WalkKind.Skip }>
-
-type Parent<T> = T & { nodes: T[] }
-
-export interface VisitContext<T> {
-  parent: Parent<T> | null
-  depth: number
-  index: number
-  siblings: T[]
-  path: () => T[]
-}
-
-export function walk<T extends object>(
-  ast: T[],
-  hooks:
-    | ((node: T, ctx: VisitContext<T>) => EnterResult<T> | void) // Old API, enter only
-    | {
-        enter?: (node: T, ctx: VisitContext<T>) => EnterResult<T> | void
-        exit?: (node: T, ctx: VisitContext<T>) => ExitResult<T> | void
-      },
-): void {
-  if (typeof hooks === 'function') walkImplementation(ast, hooks)
-  else walkImplementation(ast, hooks.enter, hooks.exit)
-}
-
-interface Stack<T> {
-  value: T
-  prev: Stack<T> | null
-}
-
-function walkImplementation<T extends { nodes?: T[] }>(
-  ast: T[],
-  enter: (node: T, ctx: VisitContext<T>) => EnterResult<T> | void = () => WalkAction.Continue,
-  exit: (node: T, ctx: VisitContext<T>) => ExitResult<T> | void = () => WalkAction.Continue,
-) {
-  type StackFrame = [nodes: T[], offset: number, parent: Parent<T> | null]
-  let stack: Stack<StackFrame> | null = { value: [ast, 0, null], prev: null }
-
-  let ctx: VisitContext<T> = {
-    parent: null,
-    depth: 0,
-    index: 0,
-    siblings: ast,
-    path() {
-      let path: T[] = []
-
-      let frames: Stack<StackFrame> | null = stack
-
-      while (frames) {
-        let parent = frames.value[2]
-        if (parent) path.push(parent)
-        frames = frames.prev
-      }
-
-      path.reverse()
-
-      return path
-    },
-  }
-
-  while (stack !== null) {
-    let frame = stack.value
-    let nodes = frame[0]
-    let offset = frame[1]
-    let parent = frame[2]
-
-    // Done with this level
-    if (offset >= nodes.length) {
-      stack = stack.prev
-      ctx.depth -= 1
-      continue
-    }
-
-    ctx.parent = parent
-    ctx.siblings = nodes
-
-    // Enter phase (offsets are positive)
-    if (offset >= 0) {
-      ctx.index = offset
-
-      let node = nodes[offset]
-      let result = enter(node, ctx) ?? WalkAction.Continue
-
-      switch (result.kind) {
-        case WalkKind.Continue: {
-          if (node.nodes && node.nodes.length > 0) {
-            ctx.depth += 1
-            stack = {
-              value: [node.nodes, 0, node as Parent<T>],
-              prev: stack,
-            }
-          }
-
-          frame[1] = ~offset // Prepare for exit phase, same offset
-          continue
-        }
-
-        case WalkKind.Stop:
-          return // Stop immediately
-
-        case WalkKind.Skip: {
-          frame[1] = ~offset // Prepare for exit phase, same offset
-          continue
-        }
-
-        case WalkKind.Replace: {
-          nodes.splice(offset, 1, ...result.nodes)
-          continue // Re-process at same offset
-        }
-
-        case WalkKind.ReplaceStop: {
-          nodes.splice(offset, 1, ...result.nodes)
-          return // Stop immediately
-        }
-
-        case WalkKind.ReplaceSkip: {
-          nodes.splice(offset, 1, ...result.nodes)
-          frame[1] += result.nodes.length // Advance to next sibling past replacements
-          continue
-        }
-
-        default: {
-          result satisfies never
-          throw new Error(
-            // @ts-expect-error enterResult.kind may be invalid
-            `Invalid \`WalkAction.${WalkKind[result.kind] ?? `Unknown(${result.kind})`}\` in enter.`,
-          )
-        }
-      }
-    }
-
-    // Exit phase for nodes[~offset]
-    let index = ~offset // Two's complement to get original offset
-    ctx.index = index
-    let node = nodes[index]
-
-    let result = exit(node, ctx) ?? WalkAction.Continue
-
-    switch (result.kind) {
-      case WalkKind.Continue:
-        frame[1] = index + 1 // Advance to next sibling
-        continue
-
-      case WalkKind.Stop:
-        return // Stop immediately
-
-      case WalkKind.Replace: {
-        nodes.splice(index, 1, ...result.nodes)
-        frame[1] = index + result.nodes.length // Advance to next sibling past replacements
-        continue
-      }
-
-      case WalkKind.ReplaceStop: {
-        nodes.splice(index, 1, ...result.nodes)
-        return // Stop immediately
-      }
-
-      case WalkKind.ReplaceSkip: {
-        nodes.splice(index, 1, ...result.nodes)
-        frame[1] = index + result.nodes.length // Advance to next sibling past replacements
-        continue
-      }
-
-      default: {
-        result satisfies never
-        throw new Error(
-          // @ts-expect-error `result.kind` could still be filled with an invalid value
-          `Invalid \`WalkAction.${WalkKind[result.kind] ?? `Unknown(${result.kind})`}\` in exit.`,
-        )
-      }
-    }
-  }
-}
diff --git a/packages/tailwindcss/tests/ui.spec.ts b/packages/tailwindcss/tests/ui.spec.ts
index e5da091d8..64057877b 100644
--- a/packages/tailwindcss/tests/ui.spec.ts
+++ b/packages/tailwindcss/tests/ui.spec.ts
@@ -2,9 +2,8 @@ import { expect, test, type Page } from '@playwright/test'
 import { Scanner } from '@tailwindcss/oxide'
 import fs from 'node:fs'
 import path from 'node:path'
-import { optimize } from '../../@tailwindcss-node/src/optimize'
 import { compile } from '../src'
-import { segment } from '../src/utils/segment'
+import { optimizeCss } from '../src/test-utils/run'
 
 const html = String.raw
 const css = String.raw
@@ -173,1305 +172,6 @@ for (let [classes, expected] of [
   })
 }
 
-/**
- * Edge mask utilities
- */
-for (let [classes, expected] of [
-  //
-  // Single values (from)
-  //
-  [
-    'mask-x-from-20%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-y-from-20%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(to top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-t-from-20%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(to top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-r-from-20%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(to right, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-b-from-20%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-l-from-20%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Single values (to)
-  //
-  [
-    'mask-x-to-80%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-y-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(to top, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-t-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(to top, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-r-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(to right, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-b-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-l-to-80%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Multiple values (from + to)
-  //
-  [
-    'mask-x-from-20% mask-x-to-80%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-y-from-20% mask-y-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(to top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-t-from-20% mask-t-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(to top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-r-from-20% mask-r-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(to right, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-b-from-20% mask-b-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-l-from-20% mask-l-to-80%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Multiple edges
-  //
-  [
-    'mask-t-from-10% mask-t-to-20% mask-r-from-30% mask-r-to-40% mask-b-from-50% mask-b-to-60% mask-l-from-70% mask-l-to-80%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%)',
-      'linear-gradient(rgb(0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%)',
-      'linear-gradient(to top, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-x-from-10% mask-x-to-20% mask-y-from-30% mask-y-to-40%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%)',
-      'linear-gradient(rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%)',
-      'linear-gradient(to top, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Multiple edges
-  // TRBL takes precedence over XY
-  //
-  [
-    'mask-x-from-20% mask-x-to-80% mask-l-from-30% mask-r-to-70%',
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 80%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 70%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-y-from-20% mask-y-to-80% mask-t-from-30% mask-b-to-70%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 70%)',
-      'linear-gradient(to top, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0) 80%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-]) {
-  test(`mask edges, "${classes}"`, async ({ page }) => {
-    let { getPropertyValue } = await render(
-      page,
-      html`<div id="x" class="${classes}">Hello world</div>`,
-    )
-
-    if (Array.isArray(expected)) {
-      expect(expected).toContain(await getPropertyValue('#x', 'mask-image'))
-    } else {
-      expect(await getPropertyValue('#x', 'mask-image')).toEqual(expected)
-    }
-  })
-}
-
-/**
- * Linear mask utilities
- */
-for (let [classes, expected] of [
-  //
-  // Single values (from, to)
-  //
-  [
-    'mask-linear-45 mask-linear-from-20%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(45deg, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(calc(45deg), rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-    ],
-  ],
-  [
-    'mask-linear-45 mask-linear-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(45deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(calc(45deg), rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-    ],
-  ],
-
-  //
-  // Multiple values
-  //
-  [
-    'mask-linear-45 mask-linear-from-20% mask-linear-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(45deg, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(calc(45deg), rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-    ],
-  ],
-]) {
-  test(`mask linear, "${classes}"`, async ({ page }) => {
-    let { getPropertyValue } = await render(
-      page,
-      html`<div id="x" class="${classes}">Hello world</div>`,
-    )
-
-    if (Array.isArray(expected)) {
-      expect(expected).toContain(await getPropertyValue('#x', 'mask-image'))
-    } else {
-      expect(await getPropertyValue('#x', 'mask-image')).toEqual(expected)
-    }
-  })
-}
-
-/**
- * Radial mask utilities
- */
-for (let [classes, expected] of [
-  //
-  // Single values (from, to)
-  //
-  [
-    'mask-radial-from-20%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-radial-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Multiple values (from, to)
-  //
-  [
-    'mask-radial-from-20% mask-radial-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Shapes
-  //
-  [
-    'mask-circle mask-radial-from-20% mask-radial-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(circle, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-  [
-    'mask-ellipse mask-radial-from-20% mask-radial-to-80%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Positions
-  //
-  [
-    'mask-radial-at-top-left mask-radial-from-20% mask-radial-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'radial-gradient(at 0% 0%, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'radial-gradient(at left top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-    ],
-  ],
-  [
-    'mask-circle mask-radial-at-top-left mask-radial-from-20% mask-radial-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'radial-gradient(circle at 0% 0%, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'radial-gradient(circle at left top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-    ],
-  ],
-
-  //
-  // Sizes
-  //
-  [
-    'mask-radial-[100%_100%] mask-radial-from-20%',
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(100% 100%, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ],
-
-  //
-  // Complicated radial gradient
-  //
-  [
-    'mask-radial-[25%_150%] mask-radial-at-top mask-ellipse mask-radial-from-20% mask-radial-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'radial-gradient(25% 150% at 50% 0%, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'radial-gradient(25% 150% at center top, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      ].join(', '),
-    ],
-  ],
-]) {
-  test(`mask radial, "${classes}"`, async ({ page }) => {
-    let { getPropertyValue } = await render(
-      page,
-      html`<div id="x" class="${classes}">Hello world</div>`,
-    )
-
-    if (Array.isArray(expected)) {
-      expect(expected).toContain(await getPropertyValue('#x', 'mask-image'))
-    } else {
-      expect(await getPropertyValue('#x', 'mask-image')).toEqual(expected)
-    }
-  })
-}
-
-/**
- * Conic mask utilities
- */
-for (let [classes, expected] of [
-  //
-  // Single values (from, to)
-  //
-  [
-    'mask-conic-45 mask-conic-from-20%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'conic-gradient(from 45deg, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'conic-gradient(from calc(45deg), rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      ].join(', '),
-    ],
-  ],
-  [
-    'mask-conic-45 mask-conic-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'conic-gradient(from 45deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'conic-gradient(from calc(45deg), rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 80%)',
-      ].join(', '),
-    ],
-  ],
-
-  //
-  // Multiple values
-  //
-  [
-    'mask-conic-45 mask-conic-from-20% mask-conic-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'conic-gradient(from 45deg, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Radial
-        'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-        // Conic
-        'conic-gradient(from calc(45deg), rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 80%)',
-      ].join(', '),
-    ],
-  ],
-]) {
-  test(`mask conic, "${classes}"`, async ({ page }) => {
-    let { getPropertyValue } = await render(
-      page,
-      html`<div id="x" class="${classes}">Hello world</div>`,
-    )
-
-    if (Array.isArray(expected)) {
-      expect(expected).toContain(await getPropertyValue('#x', 'mask-image'))
-    } else {
-      expect(await getPropertyValue('#x', 'mask-image')).toEqual(expected)
-    }
-  })
-}
-
-/**
- * Multiple masks
- */
-for (let [classes, expected] of [
-  //
-  // Single values (from, to)
-  //
-  [
-    'mask-conic-45 mask-conic-from-20% mask-linear-30 mask-linear-to-70% mask-circle mask-radial-from-40% mask-radial-to-80%',
-    [
-      // WebKit / Firefox
-      [
-        // Linear
-        'linear-gradient(30deg, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 70%)',
-        // Radial
-        'radial-gradient(circle, rgb(0, 0, 0) 40%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'conic-gradient(from 45deg, rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      ].join(', '),
-
-      // Chromium
-      [
-        // Linear
-        'linear-gradient(calc(30deg), rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0) 70%)',
-        // Radial
-        'radial-gradient(circle, rgb(0, 0, 0) 40%, rgba(0, 0, 0, 0) 80%)',
-        // Conic
-        'conic-gradient(from calc(45deg), rgb(0, 0, 0) 20%, rgba(0, 0, 0, 0) 100%)',
-      ].join(', '),
-    ],
-  ],
-]) {
-  test(`mask multiple, "${classes}"`, async ({ page }) => {
-    let { getPropertyValue } = await render(
-      page,
-      html`<div id="x" class="${classes}">Hello world</div>`,
-    )
-
-    if (Array.isArray(expected)) {
-      expect(expected).toContain(await getPropertyValue('#x', 'mask-image'))
-    } else {
-      expect(await getPropertyValue('#x', 'mask-image')).toEqual(expected)
-    }
-  })
-}
-
-test('mask edges can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html` <div id="x" class="mask-x-from-25% hover:mask-x-to-75%">Hello world</div> `,
-  )
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-
-  await page.locator('#x').hover()
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-})
-
-test('mask edge colors can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-x-from-25% hover:mask-x-from-transparent hover:mask-x-to-black">
-        Hello world
-      </div>
-    `,
-  )
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(to left, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(to right, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-
-  await page.locator('#x').hover()
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(to left, rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-      'linear-gradient(to right, rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-})
-
-test('linear mask direction can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-linear-15 mask-linear-from-25% hover:mask-linear-45">Hello world</div>
-    `,
-  )
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-
-  await page.locator('#x').hover()
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(45deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(calc(45deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-})
-
-test('linear mask position can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-linear-15 mask-linear-from-25% hover:mask-linear-to-75%">
-        Hello world
-      </div>
-    `,
-  )
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-
-  await page.locator('#x').hover()
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-})
-
-test('linear mask colors can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div
-        id="x"
-        class="mask-linear-15 mask-linear-from-25% hover:mask-linear-from-transparent hover:mask-linear-to-black"
-      >
-        Hello world
-      </div>
-    `,
-  )
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-
-  await page.locator('#x').hover()
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(15deg, rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(calc(15deg), rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-})
-
-test('radial mask size can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-radial-[50%_50%] mask-radial-from-25% hover:mask-radial-[125%_25%]">
-        Hello world
-      </div>
-    `,
-  )
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(50% 50%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-
-  await page.locator('#x').hover()
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(125% 25%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-})
-
-test('radial mask position can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-radial-[50%_50%] mask-radial-from-25% hover:mask-radial-to-75%">
-        Hello world
-      </div>
-    `,
-  )
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(50% 50%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-
-  await page.locator('#x').hover()
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(50% 50%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-})
-
-test('radial mask color can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div
-        id="x"
-        class="mask-radial-[50%_50%] mask-radial-from-25% hover:mask-radial-from-transparent hover:mask-radial-to-black"
-      >
-        Hello world
-      </div>
-    `,
-  )
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(50% 50%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-
-  await page.locator('#x').hover()
-
-  expect(await getPropertyValue('#x', 'mask-image')).toEqual(
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'radial-gradient(50% 50%, rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-      // Conic
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-    ].join(', '),
-  )
-})
-
-test('conic mask direction can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-conic-15 mask-conic-from-25% hover:mask-conic-45">Hello world</div>
-    `,
-  )
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from 15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-
-  await page.locator('#x').hover()
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from 45deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from calc(45deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-})
-
-test('conic mask position can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="x" class="mask-conic-15 mask-conic-from-25% hover:mask-conic-to-75%">
-        Hello world
-      </div>
-    `,
-  )
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from 15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-
-  await page.locator('#x').hover()
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from 15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 75%)',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-})
-
-test('conic mask color can be changed on hover', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div
-        id="x"
-        class="mask-conic-15 mask-conic-from-25% hover:mask-conic-from-transparent hover:mask-conic-to-black"
-      >
-        Hello world
-      </div>
-    `,
-  )
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from 15deg, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from calc(15deg), rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0) 100%)',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-
-  await page.locator('#x').hover()
-
-  expect([
-    // WebKit / Firefox
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from 15deg, rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-    ].join(', '),
-
-    // Chromium
-    [
-      // Linear
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Radial
-      'linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255))',
-      // Conic
-      'conic-gradient(from calc(15deg), rgba(0, 0, 0, 0) 25%, rgb(0, 0, 0) 100%)',
-    ].join(', '),
-  ]).toContain(await getPropertyValue('#x', 'mask-image'))
-})
-
 test("::backdrop can receive a border with just the 'border' utility", async ({ page }) => {
   let { getPropertyValue } = await render(
     page,
@@ -1514,7 +214,7 @@ test.skip("::file-selector-button can receive a border with just the 'border' ut
 })
 
 test('composing shadow, inset shadow, ring, and inset ring', async ({ page }) => {
-  let { getPropertyList } = await render(
+  let { getPropertyValue } = await render(
     page,
     html`<div
       id="x"
@@ -1522,19 +222,19 @@ test('composing shadow, inset shadow, ring, and inset ring', async ({ page }) =>
     ></div>`,
   )
 
-  expect(await getPropertyList('#x', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.866\d+ -0.233\d+ 0.179\d+\) 0px 2px 4px 0px inset/), // inset-shadow
-    'rgb(0, 0, 255) 0px 0px 0px 1px inset', // inset-ring
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px', // ring-offset (disabled)
-    'rgb(255, 255, 255) 0px 0px 0px 1px', // ring
-
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 3px 0px/), // shadow
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 2px -1px/), // shadow
-  ])
+  expect(await getPropertyValue('#x', 'box-shadow')).toEqual(
+    [
+      'rgb(0, 255, 0) 0px 2px 4px 0px inset', // inset-shadow
+      'rgb(0, 0, 255) 0px 0px 0px 1px inset', // inset-ring
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px', // ring-offset (disabled)
+      'rgb(255, 255, 255) 0px 0px 0px 1px', // ring
+      'rgb(255, 0, 0) 0px 1px 3px 0px, rgb(255, 0, 0) 0px 1px 2px -1px', // shadow
+    ].join(', '),
+  )
 })
 
 test('shadow colors', async ({ page }) => {
-  let { getPropertyList } = await render(
+  let { getPropertyValue } = await render(
     page,
     html`
       <div id="a" class="shadow-sm shadow-red"></div>
@@ -1544,111 +244,84 @@ test('shadow colors', async ({ page }) => {
       <div id="e" class="shadow-sm shadow-red hover:shadow-xl hover:shadow-initial">
         Hello world
       </div>
-
-      <div id="f" class="shadow-xs/75">Hello world</div>
-      <div id="g" class="shadow-xs/75 shadow-red/75">Hello world</div>
     `,
   )
 
-  expect(await getPropertyList('#a', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+  expect(await getPropertyValue('#a', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgb(255, 0, 0) 0px 1px 3px 0px, rgb(255, 0, 0) 0px 1px 2px -1px',
+    ].join(', '),
+  )
+  expect(await getPropertyValue('#b', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgb(255, 0, 0) 0px 20px 25px -5px, rgb(255, 0, 0) 0px 8px 10px -6px',
+    ].join(', '),
+  )
+  expect(await getPropertyValue('#c', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgb(255, 0, 0) 0px 2px 4px 0px',
+    ].join(', '),
+  )
 
-    //
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 3px 0px/),
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 2px -1px/),
-  ])
-
-  expect(await getPropertyList('#b', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-
-    //
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 20px 25px -5px/),
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 8px 10px -6px/),
-  ])
-
-  expect(await getPropertyList('#c', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-
-    //
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 2px 4px 0px/),
-  ])
-
-  expect(await getPropertyList('#d', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-
-    //
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 3px 0px/),
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 2px -1px/),
-  ])
-
-  expect(await getPropertyList('#f', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'oklab(0 0 0 / 0.75) 0px 1px 2px 0px',
-  ])
-
-  expect(await getPropertyList('#g', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+ \/ 0.56\d+\) 0px 1px 2px 0px/),
-  ])
+  expect(await getPropertyValue('#d', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgb(255, 0, 0) 0px 1px 3px 0px, rgb(255, 0, 0) 0px 1px 2px -1px',
+    ].join(', '),
+  )
 
   await page.locator('#d').hover()
 
-  expect(await getPropertyList('#d', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+  expect(await getPropertyValue('#d', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgb(255, 0, 0) 0px 20px 25px -5px, rgb(255, 0, 0) 0px 8px 10px -6px',
+    ].join(', '),
+  )
 
-    //
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 20px 25px -5px/),
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 8px 10px -6px/),
-  ])
-
-  expect(await getPropertyList('#e', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-
-    //
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 3px 0px/),
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 2px -1px/),
-  ])
+  expect(await getPropertyValue('#e', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgb(255, 0, 0) 0px 1px 3px 0px, rgb(255, 0, 0) 0px 1px 2px -1px',
+    ].join(', '),
+  )
 
   await page.locator('#e').hover()
 
-  expect(await getPropertyList('#e', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-
-    //
-    'rgba(0, 0, 0, 0.1) 0px 20px 25px -5px',
-    'rgba(0, 0, 0, 0.1) 0px 8px 10px -6px',
-  ])
+  expect(await getPropertyValue('#e', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.1) 0px 8px 10px -6px',
+    ].join(', '),
+  )
 })
 
 test('inset shadow colors', async ({ page }) => {
-  let { getPropertyList } = await render(
+  let { getPropertyValue } = await render(
     page,
     html`
       <div id="a" class="inset-shadow-xs inset-shadow-red"></div>
@@ -1661,139 +334,79 @@ test('inset shadow colors', async ({ page }) => {
       >
         Hello world
       </div>
-
-      <div id="f" class="inset-shadow-xs/75">Hello world</div>
-      <div id="g" class="inset-shadow-xs/75 inset-shadow-red/75">Hello world</div>
     `,
   )
 
-  expect(await getPropertyList('#a', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 1px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-  expect(await getPropertyList('#b', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 2px 4px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-  expect(await getPropertyList('#c', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 3px 6px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-
-  expect(await getPropertyList('#d', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 1px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-
-  expect(await getPropertyList('#f', 'box-shadow')).toEqual([
-    'oklab(0 0 0 / 0.75) 0px 1px 1px 0px inset',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-
-  expect(await getPropertyList('#g', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+ \/ 0.56\d+\) 0px 1px 1px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-
-  await page.locator('#d').hover()
-
-  expect(await getPropertyList('#d', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 2px 4px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-
-  expect(await getPropertyList('#e', 'box-shadow')).toEqual([
-    expect.stringMatching(/oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 1px 0px inset/),
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-
-  await page.locator('#e').hover()
-
-  expect(await getPropertyList('#e', 'box-shadow')).toEqual([
-    'rgba(0, 0, 0, 0.05) 0px 2px 4px 0px inset',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-    'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
-  ])
-})
-
-test('text shadow colors', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="a" class="text-shadow-xs text-shadow-red"></div>
-      <div id="b" class="text-shadow-lg text-shadow-red"></div>
-      <div id="c" class="text-shadow-[0px_2px_4px] text-shadow-red"></div>
-      <div id="d" class="text-shadow-xs text-shadow-red hover:text-shadow-lg">Hello world</div>
-      <div
-        id="e"
-        class="text-shadow-xs text-shadow-red hover:text-shadow-lg hover:text-shadow-initial"
-      >
-        Hello world
-      </div>
-
-      <div id="f" class="text-shadow-xs/75">Hello world</div>
-      <div id="g" class="text-shadow-xs/75 text-shadow-red/75">Hello world</div>
-    `,
+  expect(await getPropertyValue('#a', 'box-shadow')).toEqual(
+    [
+      'rgb(255, 0, 0) 0px 1px 1px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
+  )
+  expect(await getPropertyValue('#b', 'box-shadow')).toEqual(
+    [
+      'rgb(255, 0, 0) 0px 2px 4px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
+  )
+  expect(await getPropertyValue('#c', 'box-shadow')).toEqual(
+    [
+      'rgb(255, 0, 0) 0px 3px 6px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
   )
 
-  expect(await getPropertyValue('#a', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 1px/,
-  )
-  expect(await getPropertyValue('#b', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 2px, oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 3px 2px, oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 4px 8px/,
-  )
-  expect(await getPropertyValue('#c', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 2px 4px/,
-  )
-  expect(await getPropertyValue('#d', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 1px/,
-  )
-
-  expect(await getPropertyValue('#f', 'text-shadow')).toEqual('oklab(0 0 0 / 0.75) 0px 1px 1px')
-  expect(await getPropertyValue('#g', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+ \/ 0.56\d+\) 0px 1px 1px/,
+  expect(await getPropertyValue('#d', 'box-shadow')).toEqual(
+    [
+      'rgb(255, 0, 0) 0px 1px 1px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
   )
 
   await page.locator('#d').hover()
 
-  expect(await getPropertyValue('#d', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 2px, oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 3px 2px, oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 4px 8px/,
+  expect(await getPropertyValue('#d', 'box-shadow')).toEqual(
+    [
+      'rgb(255, 0, 0) 0px 2px 4px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
   )
 
-  expect(await getPropertyValue('#e', 'text-shadow')).toMatch(
-    /oklab\(0.627\d+ 0.224\d+ 0.125\d+\) 0px 1px 1px/,
+  expect(await getPropertyValue('#e', 'box-shadow')).toEqual(
+    [
+      'rgb(255, 0, 0) 0px 1px 1px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
   )
 
   await page.locator('#e').hover()
 
-  expect(await getPropertyValue('#e', 'text-shadow')).toEqual(
-    'rgba(0, 0, 0, 0.1) 0px 1px 2px, rgba(0, 0, 0, 0.1) 0px 3px 2px, rgba(0, 0, 0, 0.1) 0px 4px 8px',
+  expect(await getPropertyValue('#e', 'box-shadow')).toEqual(
+    [
+      'rgba(0, 0, 0, 0.05) 0px 2px 4px 0px inset',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+      'rgba(0, 0, 0, 0) 0px 0px 0px 0px',
+    ].join(', '),
   )
 })
 
@@ -1826,92 +439,13 @@ test('filter', async ({ page }) => {
   expect(await getPropertyValue('#b', 'filter')).toEqual('contrast(1)')
 })
 
-test('drop shadow colors', async ({ page }) => {
-  let { getPropertyList } = await render(
-    page,
-    html`
-      <div id="a" class="drop-shadow-md"></div>
-      <div id="b" class="drop-shadow-md drop-shadow-red"></div>
-      <div id="c" class="drop-shadow-md/50"></div>
-      <div id="d" class="drop-shadow-md/50 drop-shadow-red"></div>
-      <div id="e" class="drop-shadow-md/50 drop-shadow-red/50"></div>
-    `,
-  )
-
-  expect(await getPropertyList('#a', 'filter')).toEqual([
-    'drop-shadow(rgba(0, 0, 0, 0.12) 0px 3px 3px)',
-  ])
-
-  expect(await getPropertyList('#b', 'filter')).toEqual([
-    expect.stringMatching(/drop-shadow\(oklab\(0\.627\d+ 0\.224\d+ 0\.125\d+\) 0px 3px 3px\)/),
-  ])
-
-  expect(await getPropertyList('#c', 'filter')).toEqual([
-    'drop-shadow(oklab(0 0 0 / 0.5) 0px 3px 3px)',
-  ])
-
-  expect(await getPropertyList('#d', 'filter')).toEqual([
-    expect.stringMatching(
-      /drop-shadow\(oklab\(0\.627\d+ 0\.224\d+ 0\.125\d+ \/ 0\.5\) 0px 3px 3px\)/,
-    ),
-  ])
-
-  expect(await getPropertyList('#e', 'filter')).toEqual([
-    expect.stringMatching(
-      /drop-shadow\(oklab\(0\.627\d+ 0\.224\d+ 0\.125\d+ \/ 0\.25\) 0px 3px 3px\)/,
-    ),
-  ])
-})
-
-test('multiple drop shadow filters with `@theme inline`', async ({ page }) => {
-  let { getPropertyList } = await render(
-    page,
-    html`
-      <div id="a" class="drop-shadow-inlined"></div>
-      <div id="b" class="drop-shadow-inlined drop-shadow-red"></div>
-      <div style="--drop-shadow-var: 0 20px 20px rgb(0 0 0 / 0.75)">
-        <div id="c" class="drop-shadow-var"></div>
-      </div>
-      <div style="--drop-shadow-var: 0 10px 10px rgb(0 0 0 / 0.75), 0 20px 20px rgb(0 0 0 / 0.75)">
-        <div id="d" class="drop-shadow-var"></div>
-      </div>
-    `,
-    css`
-      @theme {
-        --drop-shadow-var: 0 1px 1px rgb(0 0 0 / 0.5), 0 10px 10px rgb(0 0 0 / 0.25);
-      }
-      @theme inline {
-        --drop-shadow-inlined: 0 1px 1px rgb(0 0 0 / 0.5), 0 10px 10px rgb(0 0 0 / 0.25);
-      }
-    `,
-  )
-
-  expect(await getPropertyList('#a', 'filter')).toEqual([
-    'drop-shadow(rgba(0, 0, 0, 0.5) 0px 1px 1px) drop-shadow(rgba(0, 0, 0, 0.25) 0px 10px 10px)',
-  ])
-
-  expect(await getPropertyList('#b', 'filter')).toEqual([
-    expect.stringMatching(
-      /drop-shadow\(oklab\(0\.627\d+ 0\.224\d+ 0\.125\d+\) 0px 1px 1px\) drop-shadow\(oklab\(0\.627\d+ 0\.224\d+ 0\.125\d+\) 0px 10px 10px\)/,
-    ),
-  ])
-
-  expect(await getPropertyList('#c', 'filter')).toEqual([
-    'drop-shadow(rgba(0, 0, 0, 0.75) 0px 20px 20px)',
-  ])
-
-  // Multiple values are only supported with `@theme inline` because otherwise we use var(…)
-  // inside of drop-shadow(…) which can only ever be a single shadow
-  expect(await getPropertyList('#d', 'filter')).toEqual(['none'])
-})
-
 test('outline style is optional', async ({ page }) => {
   let { getPropertyValue } = await render(
     page,
     html`<div id="x" class="outline-2 outline-white"></div>`,
   )
 
-  expect(await getPropertyValue('#x', 'outline')).toEqual('2px solid rgb(255, 255, 255)')
+  expect(await getPropertyValue('#x', 'outline')).toEqual('rgb(255, 255, 255) solid 2px')
 })
 
 test('outline style is preserved when changing outline width', async ({ page }) => {
@@ -1922,11 +456,11 @@ test('outline style is preserved when changing outline width', async ({ page })
     </div>`,
   )
 
-  expect(await getPropertyValue('#x', 'outline')).toEqual('2px dotted rgb(255, 255, 255)')
+  expect(await getPropertyValue('#x', 'outline')).toEqual('rgb(255, 255, 255) dotted 2px')
 
   await page.locator('#x').hover()
 
-  expect(await getPropertyValue('#x', 'outline')).toEqual('4px dotted rgb(255, 255, 255)')
+  expect(await getPropertyValue('#x', 'outline')).toEqual('rgb(255, 255, 255) dotted 4px')
 })
 
 test('borders can be added without a border-style utility', async ({ page }) => {
@@ -2177,330 +711,6 @@ test('shadow DOM has access to variables', async ({ page }) => {
   expect(gap).toBe('8px')
 })
 
-// @scope related tests
-{
-  test('custom variant using `@scope`', async ({ page }) => {
-    let { getPropertyValue } = await render(
-      page,
-      html`
-        <div class="checkout">
-          <div id="in" class="in-checkout:underline">In scope</div>
-          <div class="payment">
-            <div id="beyond" class="in-checkout:underline">Beyond the limit</div>
-          </div>
-        </div>
-        <div id="out" class="in-checkout:underline">Not in scope</div>
-      `,
-      css`
-        @custom-variant in-checkout {
-          @scope (.checkout) to (.payment) {
-            @slot;
-          }
-        }
-      `,
-    )
-
-    test.skip(!(await supportsAtScope(page)), '`@scope` is not supported in this browser')
-
-    expect(await getPropertyValue('#in', 'text-decoration-line')).toEqual('underline')
-    expect(await getPropertyValue('#beyond', 'text-decoration-line')).toEqual('none')
-    expect(await getPropertyValue('#out', 'text-decoration-line')).toEqual('none')
-  })
-
-  test('custom variant using `@scope` behaves like the equivalent authored CSS', async ({
-    page,
-  }) => {
-    // Render the same structure twice:
-    // - Once styled by authored CSS using `@scope`, like the "normal CSS"
-    //   reference in https://github.com/tailwindlabs/tailwindcss/issues/18961
-    // - Once styled by utilities using an equivalent custom variant
-    function structure(prefix: string, probe: string) {
-      return html`
-        <div class="checkout">
-          <div id="${prefix}-in" class="${probe}">In scope</div>
-          <div class="payment">
-            <div id="${prefix}-beyond" class="${probe}">Beyond the limit</div>
-          </div>
-        </div>
-        <div id="${prefix}-out" class="${probe}">Not in scope</div>
-      `
-    }
-
-    let { getPropertyValue } = await render(
-      page,
-      structure('a', 'a-probe') + structure('c', 'in-checkout:underline'),
-      css`
-        @custom-variant in-checkout {
-          @scope (.checkout) to (.payment) {
-            @slot;
-          }
-        }
-      `,
-    )
-
-    // The `a-*` structure is styled by the authored CSS as-is
-    await page.addStyleTag({
-      content: css`
-        @scope (.checkout) to (.payment) {
-          .a-probe {
-            text-decoration-line: underline;
-          }
-        }
-      `,
-    })
-
-    test.skip(!(await supportsAtScope(page)), '`@scope` is not supported in this browser')
-
-    for (let prefix of ['a', 'c']) {
-      expect(await getPropertyValue(`#${prefix}-in`, 'text-decoration-line')).toEqual('underline')
-      expect(await getPropertyValue(`#${prefix}-beyond`, 'text-decoration-line')).toEqual('none')
-      expect(await getPropertyValue(`#${prefix}-out`, 'text-decoration-line')).toEqual('none')
-    }
-  })
-
-  test('user-authored nested `@scope` behaves like the authored CSS', async ({ page }) => {
-    // User-authored `@scope` rules are compiled to their native CSS nesting
-    // semantics. Rendering the same structure twice:
-    // - Once styled by the authored (nested) CSS as-is
-    // - Once styled by the compiled output
-    function structure(prefix: string) {
-      return html`
-        <div class="${prefix}-parent">
-          <div class="${prefix}-scope">
-            <span class="${prefix}-content" id="${prefix}-in">in scope</span>
-            <div class="${prefix}-limit">
-              <span class="${prefix}-content" id="${prefix}-beyond">beyond the limit</span>
-            </div>
-          </div>
-        </div>
-        <div class="${prefix}-scope">
-          <span class="${prefix}-content" id="${prefix}-out">scope not inside parent</span>
-        </div>
-      `
-    }
-
-    function scopeCss(prefix: string) {
-      return css`
-        .${prefix}-parent {
-          @scope (& > .${prefix}-scope) to (& .${prefix}-limit) {
-            .${prefix}-content {
-              text-decoration-line: underline;
-            }
-          }
-        }
-      `
-    }
-
-    // The `c-*` structure is styled by the compiled CSS
-    let { getPropertyValue } = await render(page, structure('a') + structure('c'), scopeCss('c'))
-
-    // The `a-*` structure is styled by the authored CSS as-is
-    await page.addStyleTag({ content: scopeCss('a') })
-
-    test.skip(!(await supportsAtScope(page)), '`@scope` is not supported in this browser')
-
-    // The compiled output only applies within the scope
-    expect(await getPropertyValue('#c-in', 'text-decoration-line')).toEqual('underline')
-    expect(await getPropertyValue('#c-beyond', 'text-decoration-line')).toEqual('none')
-    expect(await getPropertyValue('#c-out', 'text-decoration-line')).toEqual('none')
-
-    // The authored CSS behaves the same
-    expect(await getPropertyValue('#a-in', 'text-decoration-line')).toEqual('underline')
-    expect(await getPropertyValue('#a-out', 'text-decoration-line')).toEqual('none')
-
-    // WebKit currently drops the `<scope-end>` limit entirely when it contains
-    // `&`. Since we resolve the `&` at build time, the compiled output works
-    // even though the authored CSS doesn't.
-    if (test.info().project.name !== 'webkit') {
-      expect(await getPropertyValue('#a-beyond', 'text-decoration-line')).toEqual('none')
-    }
-  })
-
-  test('user-authored `@scope` nested inside another `@scope`', async ({ page }) => {
-    function structure(prefix: string) {
-      return html`
-        <!-- Control: outer > middle > inner -->
-        <div class="${prefix}-outer">
-          <div class="${prefix}-middle">
-            <div class="${prefix}-inner" id="${prefix}-ctrl">ctrl</div>
-          </div>
-        </div>
-
-        <!-- Middle is an ancestor of the outer scope root -->
-        <div class="${prefix}-middle">
-          <div class="${prefix}-outer">
-            <div class="${prefix}-inner" id="${prefix}-ancestor">ancestor</div>
-          </div>
-        </div>
-
-        <!-- Middle is beyond the outer limit -->
-        <div class="${prefix}-outer">
-          <div class="${prefix}-outer-limit">
-            <div class="${prefix}-middle">
-              <div class="${prefix}-inner" id="${prefix}-beyond">beyond</div>
-            </div>
-          </div>
-        </div>
-      `
-    }
-
-    function scopeCss(prefix: string) {
-      return css`
-        @scope (.${prefix}-outer) to (.${prefix}-outer-limit) {
-          .${prefix}-middle {
-            @scope (.${prefix}-inner) to (.${prefix}-inner-limit) {
-              text-decoration-line: underline;
-            }
-          }
-        }
-      `
-    }
-
-    // The `c-*` structure is styled by the compiled CSS
-    let { getPropertyValue } = await render(page, structure('a') + structure('c'), scopeCss('c'))
-
-    // The `a-*` structure is styled by the authored CSS as-is
-    await page.addStyleTag({ content: scopeCss('a') })
-
-    test.skip(!(await supportsAtScope(page)), '`@scope` is not supported in this browser')
-
-    // The compiled output behaves the same in every browser
-    expect(await getPropertyValue('#c-ctrl', 'text-decoration-line')).toEqual('underline')
-    expect(await getPropertyValue('#c-ancestor', 'text-decoration-line')).toEqual('none')
-    expect(await getPropertyValue('#c-beyond', 'text-decoration-line')).toEqual('none')
-
-    // The authored CSS behaves the same …
-    expect(await getPropertyValue('#a-ctrl', 'text-decoration-line')).toEqual('underline')
-    expect(await getPropertyValue('#a-beyond', 'text-decoration-line')).toEqual('none')
-
-    // … except in Chromium, which resolves the nesting context of a
-    // rule-nested `@scope` without the enclosing scope's constraint (Safari
-    // and Firefox both constrain it). The compiled output normalizes this
-    // browser difference.
-    if (test.info().project.name !== 'chromium') {
-      expect(await getPropertyValue('#a-ancestor', 'text-decoration-line')).toEqual('none')
-    }
-  })
-
-  function supportsAtScope(page: Page) {
-    return page.evaluate(() => typeof CSSScopeRule !== 'undefined')
-  }
-}
-
-for (let kind of ['group', 'peer']) {
-  test(`${kind}-* variants`, async ({ page }) => {
-    let targets = html`
-      <div id="target" class="${kind}-focus:z-10"></div>
-      <div id="applied" class="applied"></div>
-    `
-
-    let { getPropertyValue } = await render(
-      page,
-      kind === 'group'
-        ? html`<div id="trigger" tabindex="0" class="group owner">${targets}</div>`
-        : html`<div class="owner">
-            <div id="trigger" tabindex="0" class="peer"></div>
-            ${targets}
-          </div>`,
-      css`
-        .owner > .applied {
-          @apply ${kind}-focus:z-20;
-        }
-      `,
-    )
-
-    expect(await getPropertyValue('#target', 'z-index')).toEqual('auto')
-    expect(await getPropertyValue('#applied', 'z-index')).toEqual('auto')
-
-    await page.locator('#trigger').focus()
-
-    expect(await getPropertyValue('#target', 'z-index')).toEqual('10')
-    expect(await getPropertyValue('#applied', 'z-index')).toEqual('20')
-
-    await page.locator('#trigger').blur()
-
-    expect(await getPropertyValue('#target', 'z-index')).toEqual('auto')
-    expect(await getPropertyValue('#applied', 'z-index')).toEqual('auto')
-  })
-}
-
-test('group-* variants do not change specificity', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="trigger" tabindex="0" class="group">
-        <div id="target" class="target group-focus:z-10"></div>
-      </div>
-    `,
-    css`
-      @layer utilities {
-        .target {
-          z-index: 20;
-        }
-        .target.equal {
-          z-index: 30;
-        }
-      }
-    `,
-  )
-
-  await page.locator('#trigger').focus()
-
-  expect(await getPropertyValue('#target', 'z-index')).toEqual('10')
-
-  await page.locator('#target').evaluate((element) => element.classList.add('equal'))
-
-  expect(await getPropertyValue('#target', 'z-index')).toEqual('30')
-})
-
-test('stacked group-* variants match regardless of the order of the groups', async ({ page }) => {
-  for (let [outer, inner] of [
-    ['a', 'b'],
-    ['b', 'a'],
-  ]) {
-    let { getPropertyValue } = await render(
-      page,
-      html`
-        <div class="group/${outer}" data-active>
-          <div id="inner" class="group/${inner}" data-active>
-            <div id="target" class="group-data-active/a:group-data-active/b:z-10"></div>
-          </div>
-        </div>
-      `,
-    )
-
-    expect(await getPropertyValue('#target', 'z-index')).toEqual('10')
-
-    await page.locator('#inner').evaluate((element) => element.removeAttribute('data-active'))
-
-    expect(await getPropertyValue('#target', 'z-index')).toEqual('auto')
-  }
-})
-
-test('compound group-* and peer-* variants', async ({ page }) => {
-  let { getPropertyValue } = await render(
-    page,
-    html`
-      <div id="outer" tabindex="0" class="group">
-        <div id="peer" tabindex="0" class="peer"></div>
-        <div id="middle" class="group peer-group-focus:z-20">
-          <div id="target" class="group-peer-focus:z-10"></div>
-        </div>
-      </div>
-    `,
-  )
-
-  await page.locator('#peer').focus()
-
-  expect(await getPropertyValue('#target', 'z-index')).toEqual('10')
-  expect(await getPropertyValue('#middle', 'z-index')).toEqual('auto')
-
-  await page.locator('#outer').focus()
-
-  expect(await getPropertyValue('#target', 'z-index')).toEqual('auto')
-  expect(await getPropertyValue('#middle', 'z-index')).toEqual('20')
-})
-
 // ---
 
 const preflight = fs.readFileSync(path.resolve(__dirname, '..', 'preflight.css'), 'utf-8')
@@ -2516,8 +726,6 @@ async function render(page: Page, content: string, extraCss: string = '') {
         --color-red: rgb(255, 0, 0);
         --color-green: rgb(0, 255, 0);
         --color-blue: rgb(0, 0, 255);
-        --color-black: black;
-        --color-transparent: transparent;
       }
     }
     @layer base {
@@ -2540,7 +748,7 @@ async function render(page: Page, content: string, extraCss: string = '') {
   let scanner = new Scanner({})
   let candidates = scanner.scanFiles([{ content, extension: 'html' }])
 
-  let { code: styles } = optimize(build(candidates))
+  let styles = optimizeCss(build(candidates))
 
   content = `<style type="text/css">${styles}</style>${content}`
   await page.setContent(content)
@@ -2555,16 +763,6 @@ async function render(page: Page, content: string, extraCss: string = '') {
         property,
       )
     },
-
-    async getPropertyList(selector: string | [string, string], property: string) {
-      let value = await getPropertyValue(
-        page,
-        Array.isArray(selector) ? selector : [selector, undefined],
-        property,
-      )
-
-      return segment(value, ',').map((item) => item.trim())
-    },
   }
 }
 
@@ -2573,7 +771,7 @@ async function getPropertyValue(
   selector: [string, string | undefined],
   property: string,
 ) {
-  let value = await page.evaluate(
+  return page.evaluate(
     ([[selector, pseudo], property]) => {
       return window
         .getComputedStyle(document.querySelector(selector)!, pseudo)
@@ -2581,16 +779,4 @@ async function getPropertyValue(
     },
     [selector, property] as const,
   )
-
-  switch (property) {
-    case 'outline':
-      // Order in webkit vs chromium is different. Sort to normalize.
-      return segment(value, ' ')
-        .map((part) => part.trim())
-        .sort((a, z) => a.length - z.length)
-        .join(' ')
-
-    default:
-      return value
-  }
 }
diff --git a/packages/tailwindcss/theme.css b/packages/tailwindcss/theme.css
index 05364f5c2..6f40223e4 100644
--- a/packages/tailwindcss/theme.css
+++ b/packages/tailwindcss/theme.css
@@ -1,323 +1,275 @@
 @theme default {
   --font-sans:
-    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial,
-    sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+    ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
+    'Noto Color Emoji';
   --font-serif: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;
   --font-mono:
     ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
     monospace;
 
-  --color-red-50: oklch(97.1% 0.013 17.38);
-  --color-red-100: oklch(93.6% 0.032 17.717);
-  --color-red-200: oklch(88.5% 0.062 18.334);
-  --color-red-300: oklch(80.8% 0.114 19.571);
-  --color-red-400: oklch(70.4% 0.191 22.216);
-  --color-red-500: oklch(63.7% 0.237 25.331);
-  --color-red-600: oklch(57.7% 0.245 27.325);
-  --color-red-700: oklch(50.5% 0.213 27.518);
-  --color-red-800: oklch(44.4% 0.177 26.899);
-  --color-red-900: oklch(39.6% 0.141 25.723);
-  --color-red-950: oklch(25.8% 0.092 26.042);
+  --color-red-50: oklch(0.971 0.013 17.38);
+  --color-red-100: oklch(0.936 0.032 17.717);
+  --color-red-200: oklch(0.885 0.062 18.334);
+  --color-red-300: oklch(0.808 0.114 19.571);
+  --color-red-400: oklch(0.704 0.191 22.216);
+  --color-red-500: oklch(0.637 0.237 25.331);
+  --color-red-600: oklch(0.577 0.245 27.325);
+  --color-red-700: oklch(0.505 0.213 27.518);
+  --color-red-800: oklch(0.444 0.177 26.899);
+  --color-red-900: oklch(0.396 0.141 25.723);
+  --color-red-950: oklch(0.258 0.092 26.042);
 
-  --color-orange-50: oklch(98% 0.016 73.684);
-  --color-orange-100: oklch(95.4% 0.038 75.164);
-  --color-orange-200: oklch(90.1% 0.076 70.697);
-  --color-orange-300: oklch(83.7% 0.128 66.29);
-  --color-orange-400: oklch(75% 0.183 55.934);
-  --color-orange-500: oklch(70.5% 0.213 47.604);
-  --color-orange-600: oklch(64.6% 0.222 41.116);
-  --color-orange-700: oklch(55.3% 0.195 38.402);
-  --color-orange-800: oklch(47% 0.157 37.304);
-  --color-orange-900: oklch(40.8% 0.123 38.172);
-  --color-orange-950: oklch(26.6% 0.079 36.259);
+  --color-orange-50: oklch(0.98 0.016 73.684);
+  --color-orange-100: oklch(0.954 0.038 75.164);
+  --color-orange-200: oklch(0.901 0.076 70.697);
+  --color-orange-300: oklch(0.837 0.128 66.29);
+  --color-orange-400: oklch(0.75 0.183 55.934);
+  --color-orange-500: oklch(0.705 0.213 47.604);
+  --color-orange-600: oklch(0.646 0.222 41.116);
+  --color-orange-700: oklch(0.553 0.195 38.402);
+  --color-orange-800: oklch(0.47 0.157 37.304);
+  --color-orange-900: oklch(0.408 0.123 38.172);
+  --color-orange-950: oklch(0.266 0.079 36.259);
 
-  --color-amber-50: oklch(98.7% 0.022 95.277);
-  --color-amber-100: oklch(96.2% 0.059 95.617);
-  --color-amber-200: oklch(92.4% 0.12 95.746);
-  --color-amber-300: oklch(87.9% 0.169 91.605);
-  --color-amber-400: oklch(82.8% 0.189 84.429);
-  --color-amber-500: oklch(76.9% 0.188 70.08);
-  --color-amber-600: oklch(66.6% 0.179 58.318);
-  --color-amber-700: oklch(55.5% 0.163 48.998);
-  --color-amber-800: oklch(47.3% 0.137 46.201);
-  --color-amber-900: oklch(41.4% 0.112 45.904);
-  --color-amber-950: oklch(27.9% 0.077 45.635);
+  --color-amber-50: oklch(0.987 0.022 95.277);
+  --color-amber-100: oklch(0.962 0.059 95.617);
+  --color-amber-200: oklch(0.924 0.12 95.746);
+  --color-amber-300: oklch(0.879 0.169 91.605);
+  --color-amber-400: oklch(0.828 0.189 84.429);
+  --color-amber-500: oklch(0.769 0.188 70.08);
+  --color-amber-600: oklch(0.666 0.179 58.318);
+  --color-amber-700: oklch(0.555 0.163 48.998);
+  --color-amber-800: oklch(0.473 0.137 46.201);
+  --color-amber-900: oklch(0.414 0.112 45.904);
+  --color-amber-950: oklch(0.279 0.077 45.635);
 
-  --color-yellow-50: oklch(98.7% 0.026 102.212);
-  --color-yellow-100: oklch(97.3% 0.071 103.193);
-  --color-yellow-200: oklch(94.5% 0.129 101.54);
-  --color-yellow-300: oklch(90.5% 0.182 98.111);
-  --color-yellow-400: oklch(85.2% 0.199 91.936);
-  --color-yellow-500: oklch(79.5% 0.184 86.047);
-  --color-yellow-600: oklch(68.1% 0.162 75.834);
-  --color-yellow-700: oklch(55.4% 0.135 66.442);
-  --color-yellow-800: oklch(47.6% 0.114 61.907);
-  --color-yellow-900: oklch(42.1% 0.095 57.708);
-  --color-yellow-950: oklch(28.6% 0.066 53.813);
+  --color-yellow-50: oklch(0.987 0.026 102.212);
+  --color-yellow-100: oklch(0.973 0.071 103.193);
+  --color-yellow-200: oklch(0.945 0.129 101.54);
+  --color-yellow-300: oklch(0.905 0.182 98.111);
+  --color-yellow-400: oklch(0.852 0.199 91.936);
+  --color-yellow-500: oklch(0.795 0.184 86.047);
+  --color-yellow-600: oklch(0.681 0.162 75.834);
+  --color-yellow-700: oklch(0.554 0.135 66.442);
+  --color-yellow-800: oklch(0.476 0.114 61.907);
+  --color-yellow-900: oklch(0.421 0.095 57.708);
+  --color-yellow-950: oklch(0.286 0.066 53.813);
 
-  --color-lime-50: oklch(98.6% 0.031 120.757);
-  --color-lime-100: oklch(96.7% 0.067 122.328);
-  --color-lime-200: oklch(93.8% 0.127 124.321);
-  --color-lime-300: oklch(89.7% 0.196 126.665);
-  --color-lime-400: oklch(84.1% 0.238 128.85);
-  --color-lime-500: oklch(76.8% 0.233 130.85);
-  --color-lime-600: oklch(64.8% 0.2 131.684);
-  --color-lime-700: oklch(53.2% 0.157 131.589);
-  --color-lime-800: oklch(45.3% 0.124 130.933);
-  --color-lime-900: oklch(40.5% 0.101 131.063);
-  --color-lime-950: oklch(27.4% 0.072 132.109);
+  --color-lime-50: oklch(0.986 0.031 120.757);
+  --color-lime-100: oklch(0.967 0.067 122.328);
+  --color-lime-200: oklch(0.938 0.127 124.321);
+  --color-lime-300: oklch(0.897 0.196 126.665);
+  --color-lime-400: oklch(0.841 0.238 128.85);
+  --color-lime-500: oklch(0.768 0.233 130.85);
+  --color-lime-600: oklch(0.648 0.2 131.684);
+  --color-lime-700: oklch(0.532 0.157 131.589);
+  --color-lime-800: oklch(0.453 0.124 130.933);
+  --color-lime-900: oklch(0.405 0.101 131.063);
+  --color-lime-950: oklch(0.274 0.072 132.109);
 
-  --color-green-50: oklch(98.2% 0.018 155.826);
-  --color-green-100: oklch(96.2% 0.044 156.743);
-  --color-green-200: oklch(92.5% 0.084 155.995);
-  --color-green-300: oklch(87.1% 0.15 154.449);
-  --color-green-400: oklch(79.2% 0.209 151.711);
-  --color-green-500: oklch(72.3% 0.219 149.579);
-  --color-green-600: oklch(62.7% 0.194 149.214);
-  --color-green-700: oklch(52.7% 0.154 150.069);
-  --color-green-800: oklch(44.8% 0.119 151.328);
-  --color-green-900: oklch(39.3% 0.095 152.535);
-  --color-green-950: oklch(26.6% 0.065 152.934);
+  --color-green-50: oklch(0.982 0.018 155.826);
+  --color-green-100: oklch(0.962 0.044 156.743);
+  --color-green-200: oklch(0.925 0.084 155.995);
+  --color-green-300: oklch(0.871 0.15 154.449);
+  --color-green-400: oklch(0.792 0.209 151.711);
+  --color-green-500: oklch(0.723 0.219 149.579);
+  --color-green-600: oklch(0.627 0.194 149.214);
+  --color-green-700: oklch(0.527 0.154 150.069);
+  --color-green-800: oklch(0.448 0.119 151.328);
+  --color-green-900: oklch(0.393 0.095 152.535);
+  --color-green-950: oklch(0.266 0.065 152.934);
 
-  --color-emerald-50: oklch(97.9% 0.021 166.113);
-  --color-emerald-100: oklch(95% 0.052 163.051);
-  --color-emerald-200: oklch(90.5% 0.093 164.15);
-  --color-emerald-300: oklch(84.5% 0.143 164.978);
-  --color-emerald-400: oklch(76.5% 0.177 163.223);
-  --color-emerald-500: oklch(69.6% 0.17 162.48);
-  --color-emerald-600: oklch(59.6% 0.145 163.225);
-  --color-emerald-700: oklch(50.8% 0.118 165.612);
-  --color-emerald-800: oklch(43.2% 0.095 166.913);
-  --color-emerald-900: oklch(37.8% 0.077 168.94);
-  --color-emerald-950: oklch(26.2% 0.051 172.552);
+  --color-emerald-50: oklch(0.979 0.021 166.113);
+  --color-emerald-100: oklch(0.95 0.052 163.051);
+  --color-emerald-200: oklch(0.905 0.093 164.15);
+  --color-emerald-300: oklch(0.845 0.143 164.978);
+  --color-emerald-400: oklch(0.765 0.177 163.223);
+  --color-emerald-500: oklch(0.696 0.17 162.48);
+  --color-emerald-600: oklch(0.596 0.145 163.225);
+  --color-emerald-700: oklch(0.508 0.118 165.612);
+  --color-emerald-800: oklch(0.432 0.095 166.913);
+  --color-emerald-900: oklch(0.378 0.077 168.94);
+  --color-emerald-950: oklch(0.262 0.051 172.552);
 
-  --color-teal-50: oklch(98.4% 0.014 180.72);
-  --color-teal-100: oklch(95.3% 0.051 180.801);
-  --color-teal-200: oklch(91% 0.096 180.426);
-  --color-teal-300: oklch(85.5% 0.138 181.071);
-  --color-teal-400: oklch(77.7% 0.152 181.912);
-  --color-teal-500: oklch(70.4% 0.14 182.503);
-  --color-teal-600: oklch(60% 0.118 184.704);
-  --color-teal-700: oklch(51.1% 0.096 186.391);
-  --color-teal-800: oklch(43.7% 0.078 188.216);
-  --color-teal-900: oklch(38.6% 0.063 188.416);
-  --color-teal-950: oklch(27.7% 0.046 192.524);
+  --color-teal-50: oklch(0.984 0.014 180.72);
+  --color-teal-100: oklch(0.953 0.051 180.801);
+  --color-teal-200: oklch(0.91 0.096 180.426);
+  --color-teal-300: oklch(0.855 0.138 181.071);
+  --color-teal-400: oklch(0.777 0.152 181.912);
+  --color-teal-500: oklch(0.704 0.14 182.503);
+  --color-teal-600: oklch(0.6 0.118 184.704);
+  --color-teal-700: oklch(0.511 0.096 186.391);
+  --color-teal-800: oklch(0.437 0.078 188.216);
+  --color-teal-900: oklch(0.386 0.063 188.416);
+  --color-teal-950: oklch(0.277 0.046 192.524);
 
-  --color-cyan-50: oklch(98.4% 0.019 200.873);
-  --color-cyan-100: oklch(95.6% 0.045 203.388);
-  --color-cyan-200: oklch(91.7% 0.08 205.041);
-  --color-cyan-300: oklch(86.5% 0.127 207.078);
-  --color-cyan-400: oklch(78.9% 0.154 211.53);
-  --color-cyan-500: oklch(71.5% 0.143 215.221);
-  --color-cyan-600: oklch(60.9% 0.126 221.723);
-  --color-cyan-700: oklch(52% 0.105 223.128);
-  --color-cyan-800: oklch(45% 0.085 224.283);
-  --color-cyan-900: oklch(39.8% 0.07 227.392);
-  --color-cyan-950: oklch(30.2% 0.056 229.695);
+  --color-cyan-50: oklch(0.984 0.019 200.873);
+  --color-cyan-100: oklch(0.956 0.045 203.388);
+  --color-cyan-200: oklch(0.917 0.08 205.041);
+  --color-cyan-300: oklch(0.865 0.127 207.078);
+  --color-cyan-400: oklch(0.789 0.154 211.53);
+  --color-cyan-500: oklch(0.715 0.143 215.221);
+  --color-cyan-600: oklch(0.609 0.126 221.723);
+  --color-cyan-700: oklch(0.52 0.105 223.128);
+  --color-cyan-800: oklch(0.45 0.085 224.283);
+  --color-cyan-900: oklch(0.398 0.07 227.392);
+  --color-cyan-950: oklch(0.302 0.056 229.695);
 
-  --color-sky-50: oklch(97.7% 0.013 236.62);
-  --color-sky-100: oklch(95.1% 0.026 236.824);
-  --color-sky-200: oklch(90.1% 0.058 230.902);
-  --color-sky-300: oklch(82.8% 0.111 230.318);
-  --color-sky-400: oklch(74.6% 0.16 232.661);
-  --color-sky-500: oklch(68.5% 0.169 237.323);
-  --color-sky-600: oklch(58.8% 0.158 241.966);
-  --color-sky-700: oklch(50% 0.134 242.749);
-  --color-sky-800: oklch(44.3% 0.11 240.79);
-  --color-sky-900: oklch(39.1% 0.09 240.876);
-  --color-sky-950: oklch(29.3% 0.066 243.157);
+  --color-sky-50: oklch(0.977 0.013 236.62);
+  --color-sky-100: oklch(0.951 0.026 236.824);
+  --color-sky-200: oklch(0.901 0.058 230.902);
+  --color-sky-300: oklch(0.828 0.111 230.318);
+  --color-sky-400: oklch(0.746 0.16 232.661);
+  --color-sky-500: oklch(0.685 0.169 237.323);
+  --color-sky-600: oklch(0.588 0.158 241.966);
+  --color-sky-700: oklch(0.5 0.134 242.749);
+  --color-sky-800: oklch(0.443 0.11 240.79);
+  --color-sky-900: oklch(0.391 0.09 240.876);
+  --color-sky-950: oklch(0.293 0.066 243.157);
 
-  --color-blue-50: oklch(97% 0.014 254.604);
-  --color-blue-100: oklch(93.2% 0.032 255.585);
-  --color-blue-200: oklch(88.2% 0.059 254.128);
-  --color-blue-300: oklch(80.9% 0.105 251.813);
-  --color-blue-400: oklch(70.7% 0.165 254.624);
-  --color-blue-500: oklch(62.3% 0.214 259.815);
-  --color-blue-600: oklch(54.6% 0.245 262.881);
-  --color-blue-700: oklch(48.8% 0.243 264.376);
-  --color-blue-800: oklch(42.4% 0.199 265.638);
-  --color-blue-900: oklch(37.9% 0.146 265.522);
-  --color-blue-950: oklch(28.2% 0.091 267.935);
+  --color-blue-50: oklch(0.97 0.014 254.604);
+  --color-blue-100: oklch(0.932 0.032 255.585);
+  --color-blue-200: oklch(0.882 0.059 254.128);
+  --color-blue-300: oklch(0.809 0.105 251.813);
+  --color-blue-400: oklch(0.707 0.165 254.624);
+  --color-blue-500: oklch(0.623 0.214 259.815);
+  --color-blue-600: oklch(0.546 0.245 262.881);
+  --color-blue-700: oklch(0.488 0.243 264.376);
+  --color-blue-800: oklch(0.424 0.199 265.638);
+  --color-blue-900: oklch(0.379 0.146 265.522);
+  --color-blue-950: oklch(0.282 0.091 267.935);
 
-  --color-indigo-50: oklch(96.2% 0.018 272.314);
-  --color-indigo-100: oklch(93% 0.034 272.788);
-  --color-indigo-200: oklch(87% 0.065 274.039);
-  --color-indigo-300: oklch(78.5% 0.115 274.713);
-  --color-indigo-400: oklch(67.3% 0.182 276.935);
-  --color-indigo-500: oklch(58.5% 0.233 277.117);
-  --color-indigo-600: oklch(51.1% 0.262 276.966);
-  --color-indigo-700: oklch(45.7% 0.24 277.023);
-  --color-indigo-800: oklch(39.8% 0.195 277.366);
-  --color-indigo-900: oklch(35.9% 0.144 278.697);
-  --color-indigo-950: oklch(25.7% 0.09 281.288);
+  --color-indigo-50: oklch(0.962 0.018 272.314);
+  --color-indigo-100: oklch(0.93 0.034 272.788);
+  --color-indigo-200: oklch(0.87 0.065 274.039);
+  --color-indigo-300: oklch(0.785 0.115 274.713);
+  --color-indigo-400: oklch(0.673 0.182 276.935);
+  --color-indigo-500: oklch(0.585 0.233 277.117);
+  --color-indigo-600: oklch(0.511 0.262 276.966);
+  --color-indigo-700: oklch(0.457 0.24 277.023);
+  --color-indigo-800: oklch(0.398 0.195 277.366);
+  --color-indigo-900: oklch(0.359 0.144 278.697);
+  --color-indigo-950: oklch(0.257 0.09 281.288);
 
-  --color-violet-50: oklch(96.9% 0.016 293.756);
-  --color-violet-100: oklch(94.3% 0.029 294.588);
-  --color-violet-200: oklch(89.4% 0.057 293.283);
-  --color-violet-300: oklch(81.1% 0.111 293.571);
-  --color-violet-400: oklch(70.2% 0.183 293.541);
-  --color-violet-500: oklch(60.6% 0.25 292.717);
-  --color-violet-600: oklch(54.1% 0.281 293.009);
-  --color-violet-700: oklch(49.1% 0.27 292.581);
-  --color-violet-800: oklch(43.2% 0.232 292.759);
-  --color-violet-900: oklch(38% 0.189 293.745);
-  --color-violet-950: oklch(28.3% 0.141 291.089);
+  --color-violet-50: oklch(0.969 0.016 293.756);
+  --color-violet-100: oklch(0.943 0.029 294.588);
+  --color-violet-200: oklch(0.894 0.057 293.283);
+  --color-violet-300: oklch(0.811 0.111 293.571);
+  --color-violet-400: oklch(0.702 0.183 293.541);
+  --color-violet-500: oklch(0.606 0.25 292.717);
+  --color-violet-600: oklch(0.541 0.281 293.009);
+  --color-violet-700: oklch(0.491 0.27 292.581);
+  --color-violet-800: oklch(0.432 0.232 292.759);
+  --color-violet-900: oklch(0.38 0.189 293.745);
+  --color-violet-950: oklch(0.283 0.141 291.089);
 
-  --color-purple-50: oklch(97.7% 0.014 308.299);
-  --color-purple-100: oklch(94.6% 0.033 307.174);
-  --color-purple-200: oklch(90.2% 0.063 306.703);
-  --color-purple-300: oklch(82.7% 0.119 306.383);
-  --color-purple-400: oklch(71.4% 0.203 305.504);
-  --color-purple-500: oklch(62.7% 0.265 303.9);
-  --color-purple-600: oklch(55.8% 0.288 302.321);
-  --color-purple-700: oklch(49.6% 0.265 301.924);
-  --color-purple-800: oklch(43.8% 0.218 303.724);
-  --color-purple-900: oklch(38.1% 0.176 304.987);
-  --color-purple-950: oklch(29.1% 0.149 302.717);
+  --color-purple-50: oklch(0.977 0.014 308.299);
+  --color-purple-100: oklch(0.946 0.033 307.174);
+  --color-purple-200: oklch(0.902 0.063 306.703);
+  --color-purple-300: oklch(0.827 0.119 306.383);
+  --color-purple-400: oklch(0.714 0.203 305.504);
+  --color-purple-500: oklch(0.627 0.265 303.9);
+  --color-purple-600: oklch(0.558 0.288 302.321);
+  --color-purple-700: oklch(0.496 0.265 301.924);
+  --color-purple-800: oklch(0.438 0.218 303.724);
+  --color-purple-900: oklch(0.381 0.176 304.987);
+  --color-purple-950: oklch(0.291 0.149 302.717);
 
-  --color-fuchsia-50: oklch(97.7% 0.017 320.058);
-  --color-fuchsia-100: oklch(95.2% 0.037 318.852);
-  --color-fuchsia-200: oklch(90.3% 0.076 319.62);
-  --color-fuchsia-300: oklch(83.3% 0.145 321.434);
-  --color-fuchsia-400: oklch(74% 0.238 322.16);
-  --color-fuchsia-500: oklch(66.7% 0.295 322.15);
-  --color-fuchsia-600: oklch(59.1% 0.293 322.896);
-  --color-fuchsia-700: oklch(51.8% 0.253 323.949);
-  --color-fuchsia-800: oklch(45.2% 0.211 324.591);
-  --color-fuchsia-900: oklch(40.1% 0.17 325.612);
-  --color-fuchsia-950: oklch(29.3% 0.136 325.661);
+  --color-fuchsia-50: oklch(0.977 0.017 320.058);
+  --color-fuchsia-100: oklch(0.952 0.037 318.852);
+  --color-fuchsia-200: oklch(0.903 0.076 319.62);
+  --color-fuchsia-300: oklch(0.833 0.145 321.434);
+  --color-fuchsia-400: oklch(0.74 0.238 322.16);
+  --color-fuchsia-500: oklch(0.667 0.295 322.15);
+  --color-fuchsia-600: oklch(0.591 0.293 322.896);
+  --color-fuchsia-700: oklch(0.518 0.253 323.949);
+  --color-fuchsia-800: oklch(0.452 0.211 324.591);
+  --color-fuchsia-900: oklch(0.401 0.17 325.612);
+  --color-fuchsia-950: oklch(0.293 0.136 325.661);
 
-  --color-pink-50: oklch(97.1% 0.014 343.198);
-  --color-pink-100: oklch(94.8% 0.028 342.258);
-  --color-pink-200: oklch(89.9% 0.061 343.231);
-  --color-pink-300: oklch(82.3% 0.12 346.018);
-  --color-pink-400: oklch(71.8% 0.202 349.761);
-  --color-pink-500: oklch(65.6% 0.241 354.308);
-  --color-pink-600: oklch(59.2% 0.249 0.584);
-  --color-pink-700: oklch(52.5% 0.223 3.958);
-  --color-pink-800: oklch(45.9% 0.187 3.815);
-  --color-pink-900: oklch(40.8% 0.153 2.432);
-  --color-pink-950: oklch(28.4% 0.109 3.907);
+  --color-pink-50: oklch(0.971 0.014 343.198);
+  --color-pink-100: oklch(0.948 0.028 342.258);
+  --color-pink-200: oklch(0.899 0.061 343.231);
+  --color-pink-300: oklch(0.823 0.12 346.018);
+  --color-pink-400: oklch(0.718 0.202 349.761);
+  --color-pink-500: oklch(0.656 0.241 354.308);
+  --color-pink-600: oklch(0.592 0.249 0.584);
+  --color-pink-700: oklch(0.525 0.223 3.958);
+  --color-pink-800: oklch(0.459 0.187 3.815);
+  --color-pink-900: oklch(0.408 0.153 2.432);
+  --color-pink-950: oklch(0.284 0.109 3.907);
 
-  --color-rose-50: oklch(96.9% 0.015 12.422);
-  --color-rose-100: oklch(94.1% 0.03 12.58);
-  --color-rose-200: oklch(89.2% 0.058 10.001);
-  --color-rose-300: oklch(81% 0.117 11.638);
-  --color-rose-400: oklch(71.2% 0.194 13.428);
-  --color-rose-500: oklch(64.5% 0.246 16.439);
-  --color-rose-600: oklch(58.6% 0.253 17.585);
-  --color-rose-700: oklch(51.4% 0.222 16.935);
-  --color-rose-800: oklch(45.5% 0.188 13.697);
-  --color-rose-900: oklch(41% 0.159 10.272);
-  --color-rose-950: oklch(27.1% 0.105 12.094);
+  --color-rose-50: oklch(0.969 0.015 12.422);
+  --color-rose-100: oklch(0.941 0.03 12.58);
+  --color-rose-200: oklch(0.892 0.058 10.001);
+  --color-rose-300: oklch(0.81 0.117 11.638);
+  --color-rose-400: oklch(0.712 0.194 13.428);
+  --color-rose-500: oklch(0.645 0.246 16.439);
+  --color-rose-600: oklch(0.586 0.253 17.585);
+  --color-rose-700: oklch(0.514 0.222 16.935);
+  --color-rose-800: oklch(0.455 0.188 13.697);
+  --color-rose-900: oklch(0.41 0.159 10.272);
+  --color-rose-950: oklch(0.271 0.105 12.094);
 
-  --color-slate-50: oklch(98.4% 0.003 247.858);
-  --color-slate-100: oklch(96.8% 0.007 247.896);
-  --color-slate-200: oklch(92.9% 0.013 255.508);
-  --color-slate-300: oklch(86.9% 0.022 252.894);
-  --color-slate-400: oklch(70.4% 0.04 256.788);
-  --color-slate-500: oklch(55.4% 0.046 257.417);
-  --color-slate-600: oklch(44.6% 0.043 257.281);
-  --color-slate-700: oklch(37.2% 0.044 257.287);
-  --color-slate-800: oklch(27.9% 0.041 260.031);
-  --color-slate-900: oklch(20.8% 0.042 265.755);
-  --color-slate-950: oklch(12.9% 0.042 264.695);
+  --color-slate-50: oklch(0.984 0.003 247.858);
+  --color-slate-100: oklch(0.968 0.007 247.896);
+  --color-slate-200: oklch(0.929 0.013 255.508);
+  --color-slate-300: oklch(0.869 0.022 252.894);
+  --color-slate-400: oklch(0.704 0.04 256.788);
+  --color-slate-500: oklch(0.554 0.046 257.417);
+  --color-slate-600: oklch(0.446 0.043 257.281);
+  --color-slate-700: oklch(0.372 0.044 257.287);
+  --color-slate-800: oklch(0.279 0.041 260.031);
+  --color-slate-900: oklch(0.208 0.042 265.755);
+  --color-slate-950: oklch(0.129 0.042 264.695);
 
-  --color-gray-50: oklch(98.5% 0.002 247.839);
-  --color-gray-100: oklch(96.7% 0.003 264.542);
-  --color-gray-200: oklch(92.8% 0.006 264.531);
-  --color-gray-300: oklch(87.2% 0.01 258.338);
-  --color-gray-400: oklch(70.7% 0.022 261.325);
-  --color-gray-500: oklch(55.1% 0.027 264.364);
-  --color-gray-600: oklch(44.6% 0.03 256.802);
-  --color-gray-700: oklch(37.3% 0.034 259.733);
-  --color-gray-800: oklch(27.8% 0.033 256.848);
-  --color-gray-900: oklch(21% 0.034 264.665);
-  --color-gray-950: oklch(13% 0.028 261.692);
+  --color-gray-50: oklch(0.985 0.002 247.839);
+  --color-gray-100: oklch(0.967 0.003 264.542);
+  --color-gray-200: oklch(0.928 0.006 264.531);
+  --color-gray-300: oklch(0.872 0.01 258.338);
+  --color-gray-400: oklch(0.707 0.022 261.325);
+  --color-gray-500: oklch(0.551 0.027 264.364);
+  --color-gray-600: oklch(0.446 0.03 256.802);
+  --color-gray-700: oklch(0.373 0.034 259.733);
+  --color-gray-800: oklch(0.278 0.033 256.848);
+  --color-gray-900: oklch(0.21 0.034 264.665);
+  --color-gray-950: oklch(0.13 0.028 261.692);
 
-  --color-zinc-50: oklch(98.5% 0 none);
-  --color-zinc-100: oklch(96.7% 0.001 286.375);
-  --color-zinc-200: oklch(92% 0.004 286.32);
-  --color-zinc-300: oklch(87.1% 0.006 286.286);
-  --color-zinc-400: oklch(70.5% 0.015 286.067);
-  --color-zinc-500: oklch(55.2% 0.016 285.938);
-  --color-zinc-600: oklch(44.2% 0.017 285.786);
-  --color-zinc-700: oklch(37% 0.013 285.805);
-  --color-zinc-800: oklch(27.4% 0.006 286.033);
-  --color-zinc-900: oklch(21% 0.006 285.885);
-  --color-zinc-950: oklch(14.1% 0.005 285.823);
+  --color-zinc-50: oklch(0.985 0 0);
+  --color-zinc-100: oklch(0.967 0.001 286.375);
+  --color-zinc-200: oklch(0.92 0.004 286.32);
+  --color-zinc-300: oklch(0.871 0.006 286.286);
+  --color-zinc-400: oklch(0.705 0.015 286.067);
+  --color-zinc-500: oklch(0.552 0.016 285.938);
+  --color-zinc-600: oklch(0.442 0.017 285.786);
+  --color-zinc-700: oklch(0.37 0.013 285.805);
+  --color-zinc-800: oklch(0.274 0.006 286.033);
+  --color-zinc-900: oklch(0.21 0.006 285.885);
+  --color-zinc-950: oklch(0.141 0.005 285.823);
 
-  --color-neutral-50: oklch(98.5% 0 none);
-  --color-neutral-100: oklch(97% 0 none);
-  --color-neutral-200: oklch(92.2% 0 none);
-  --color-neutral-300: oklch(87% 0 none);
-  --color-neutral-400: oklch(70.8% 0 none);
-  --color-neutral-500: oklch(55.6% 0 none);
-  --color-neutral-600: oklch(43.9% 0 none);
-  --color-neutral-700: oklch(37.1% 0 none);
-  --color-neutral-800: oklch(26.9% 0 none);
-  --color-neutral-900: oklch(20.5% 0 none);
-  --color-neutral-950: oklch(14.5% 0 none);
+  --color-neutral-50: oklch(0.985 0 0);
+  --color-neutral-100: oklch(0.97 0 0);
+  --color-neutral-200: oklch(0.922 0 0);
+  --color-neutral-300: oklch(0.87 0 0);
+  --color-neutral-400: oklch(0.708 0 0);
+  --color-neutral-500: oklch(0.556 0 0);
+  --color-neutral-600: oklch(0.439 0 0);
+  --color-neutral-700: oklch(0.371 0 0);
+  --color-neutral-800: oklch(0.269 0 0);
+  --color-neutral-900: oklch(0.205 0 0);
+  --color-neutral-950: oklch(0.145 0 0);
 
-  --color-stone-50: oklch(98.5% 0.001 106.423);
-  --color-stone-100: oklch(97% 0.001 106.424);
-  --color-stone-200: oklch(92.3% 0.003 48.717);
-  --color-stone-300: oklch(86.9% 0.005 56.366);
-  --color-stone-400: oklch(70.9% 0.01 56.259);
-  --color-stone-500: oklch(55.3% 0.013 58.071);
-  --color-stone-600: oklch(44.4% 0.011 73.639);
-  --color-stone-700: oklch(37.4% 0.01 67.558);
-  --color-stone-800: oklch(26.8% 0.007 34.298);
-  --color-stone-900: oklch(21.6% 0.006 56.043);
-  --color-stone-950: oklch(14.7% 0.004 49.25);
-
-  --color-mauve-50: oklch(98.5% 0 none);
-  --color-mauve-100: oklch(96% 0.003 325.6);
-  --color-mauve-200: oklch(92.2% 0.005 325.62);
-  --color-mauve-300: oklch(86.5% 0.012 325.68);
-  --color-mauve-400: oklch(71.1% 0.019 323.02);
-  --color-mauve-500: oklch(54.2% 0.034 322.5);
-  --color-mauve-600: oklch(43.5% 0.029 321.78);
-  --color-mauve-700: oklch(36.4% 0.029 323.89);
-  --color-mauve-800: oklch(26.3% 0.024 320.12);
-  --color-mauve-900: oklch(21.2% 0.019 322.12);
-  --color-mauve-950: oklch(14.5% 0.008 326);
-
-  --color-olive-50: oklch(98.8% 0.003 106.5);
-  --color-olive-100: oklch(96.6% 0.005 106.5);
-  --color-olive-200: oklch(93% 0.007 106.5);
-  --color-olive-300: oklch(88% 0.011 106.6);
-  --color-olive-400: oklch(73.7% 0.021 106.9);
-  --color-olive-500: oklch(58% 0.031 107.3);
-  --color-olive-600: oklch(46.6% 0.025 107.3);
-  --color-olive-700: oklch(39.4% 0.023 107.4);
-  --color-olive-800: oklch(28.6% 0.016 107.4);
-  --color-olive-900: oklch(22.8% 0.013 107.4);
-  --color-olive-950: oklch(15.3% 0.006 107.1);
-
-  --color-mist-50: oklch(98.7% 0.002 197.1);
-  --color-mist-100: oklch(96.3% 0.002 197.1);
-  --color-mist-200: oklch(92.5% 0.005 214.3);
-  --color-mist-300: oklch(87.2% 0.007 219.6);
-  --color-mist-400: oklch(72.3% 0.014 214.4);
-  --color-mist-500: oklch(56% 0.021 213.5);
-  --color-mist-600: oklch(45% 0.017 213.2);
-  --color-mist-700: oklch(37.8% 0.015 216);
-  --color-mist-800: oklch(27.5% 0.011 216.9);
-  --color-mist-900: oklch(21.8% 0.008 223.9);
-  --color-mist-950: oklch(14.8% 0.004 228.8);
-
-  --color-taupe-50: oklch(98.6% 0.002 67.8);
-  --color-taupe-100: oklch(96% 0.002 17.2);
-  --color-taupe-200: oklch(92.2% 0.005 34.3);
-  --color-taupe-300: oklch(86.8% 0.007 39.5);
-  --color-taupe-400: oklch(71.4% 0.014 41.2);
-  --color-taupe-500: oklch(54.7% 0.021 43.1);
-  --color-taupe-600: oklch(43.8% 0.017 39.3);
-  --color-taupe-700: oklch(36.7% 0.016 35.7);
-  --color-taupe-800: oklch(26.8% 0.011 36.5);
-  --color-taupe-900: oklch(21.4% 0.009 43.1);
-  --color-taupe-950: oklch(14.7% 0.004 49.3);
+  --color-stone-50: oklch(0.985 0.001 106.423);
+  --color-stone-100: oklch(0.97 0.001 106.424);
+  --color-stone-200: oklch(0.923 0.003 48.717);
+  --color-stone-300: oklch(0.869 0.005 56.366);
+  --color-stone-400: oklch(0.709 0.01 56.259);
+  --color-stone-500: oklch(0.553 0.013 58.071);
+  --color-stone-600: oklch(0.444 0.011 73.639);
+  --color-stone-700: oklch(0.374 0.01 67.558);
+  --color-stone-800: oklch(0.268 0.007 34.298);
+  --color-stone-900: oklch(0.216 0.006 56.043);
+  --color-stone-950: oklch(0.147 0.004 49.25);
 
   --color-black: #000;
   --color-white: #fff;
@@ -422,15 +374,6 @@
   --drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
   --drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
 
-  --text-shadow-2xs: 0px 1px 0px rgb(0 0 0 / 0.15);
-  --text-shadow-xs: 0px 1px 1px rgb(0 0 0 / 0.2);
-  --text-shadow-sm:
-    0px 1px 0px rgb(0 0 0 / 0.075), 0px 1px 1px rgb(0 0 0 / 0.075), 0px 2px 2px rgb(0 0 0 / 0.075);
-  --text-shadow-md:
-    0px 1px 1px rgb(0 0 0 / 0.1), 0px 1px 2px rgb(0 0 0 / 0.1), 0px 2px 4px rgb(0 0 0 / 0.1);
-  --text-shadow-lg:
-    0px 1px 2px rgb(0 0 0 / 0.1), 0px 3px 2px rgb(0 0 0 / 0.1), 0px 4px 8px rgb(0 0 0 / 0.1);
-
   --ease-in: cubic-bezier(0.4, 0, 1, 1);
   --ease-out: cubic-bezier(0, 0, 0.2, 1);
   --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
diff --git a/packages/tailwindcss/tsconfig.json b/packages/tailwindcss/tsconfig.json
index d2131cbeb..6ae022f65 100644
--- a/packages/tailwindcss/tsconfig.json
+++ b/packages/tailwindcss/tsconfig.json
@@ -1,6 +1,3 @@
 {
   "extends": "../tsconfig.base.json",
-  "compilerOptions": {
-    "verbatimModuleSyntax": false,
-  },
 }
diff --git a/packages/tailwindcss/vitest.config.mts b/packages/tailwindcss/vitest.config.ts
similarity index 100%
rename from packages/tailwindcss/vitest.config.mts
rename to packages/tailwindcss/vitest.config.ts
diff --git a/patches/@napi-rs__cli@3.7.4.patch b/patches/@napi-rs__cli@3.7.4.patch
deleted file mode 100644
index e72212499..000000000
--- a/patches/@napi-rs__cli@3.7.4.patch
+++ /dev/null
@@ -1,80 +0,0 @@
-diff --git a/dist/cli.js b/dist/cli.js
-index c4c2d568bc070c07dbf3a1f9f4a0c946466668cf..353bbca86e3261a2ba9a8fc56dc612c7c84dab6d 100755
---- a/dist/cli.js
-+++ b/dist/cli.js
-@@ -1,4 +1,13 @@
- #!/usr/bin/env node
-+// PATCHED (see patches/@napi-rs__cli@3.7.4.patch): the embedded wasi loader
-+// and worker templates below retry `new WASI(...)` with narrower preopens,
-+// because preopening `/` throws `UVWASI_EACCES` on sandboxed platforms (e.g.
-+// OpenHarmony), which would make the generated wasm binding fail to load.
-+//
-+// The same templates also exist in `dist/index.js` and `dist/index.cjs` (the
-+// programmatic API). Those are intentionally NOT patched because we only
-+// build through the `napi` bin, which runs this file. If we ever start using
-+// the programmatic API, update the patch to cover those bundles too.
- import { createRequire } from "node:module";
- import { Cli, Command, Option } from "clipanion";
- import path, { basename, dirname, isAbsolute, join, parse, resolve } from "node:path";
-@@ -1021,13 +1030,25 @@ const {
- 
- const __rootDir = __nodePath.parse(process.cwd()).root
- 
--const __wasi = new __nodeWASI({
--  version: 'preview1',
--  env: process.env,
--  preopens: {
--    [__rootDir]: __rootDir,
-+const __wasi = (() => {
-+  // Preopening '/' fails with UVWASI_EACCES in sandboxed environments (e.g.
-+  // OpenHarmony, Android), which would prevent the wasm binding from loading
-+  // at all. Retry with narrower preopens instead. Without any preopens the
-+  // binding still loads; only file system access is unavailable.
-+  let lastError = null
-+  for (const dir of [__rootDir, process.cwd(), null]) {
-+    try {
-+      return new __nodeWASI({
-+        version: 'preview1',
-+        env: process.env,
-+        preopens: dir === null ? {} : { [dir]: dir },
-+      })
-+    } catch (error) {
-+      lastError = error
-+    }
-   }
--})
-+  throw lastError
-+})()
- 
- const __emnapiContext = __emnapiGetDefaultContext()
- 
-@@ -1151,13 +1172,22 @@ const __rootDir = parse(process.cwd()).root;
- 
- const handler = new MessageHandler({
-   onLoad({ wasmModule, wasmMemory }) {
--    const wasi = new WASI({
--      version: 'preview1',
--      env: process.env,
--      preopens: {
--        [__rootDir]: __rootDir,
--      },
--    });
-+    // Keep in sync with the preopen fallback in the main-thread loader.
-+    const wasi = (() => {
-+      let lastError = null;
-+      for (const dir of [__rootDir, process.cwd(), null]) {
-+        try {
-+          return new WASI({
-+            version: 'preview1',
-+            env: process.env,
-+            preopens: dir === null ? {} : { [dir]: dir },
-+          });
-+        } catch (error) {
-+          lastError = error;
-+        }
-+      }
-+      throw lastError;
-+    })();
- 
-     return instantiateNapiModuleSync(wasmModule, {
-       childThread: true,
diff --git a/patches/@parcel__watcher@2.6.0.patch b/patches/@parcel__watcher@2.5.1.patch
similarity index 52%
rename from patches/@parcel__watcher@2.6.0.patch
rename to patches/@parcel__watcher@2.5.1.patch
index 37ff83f04..ed9fa9040 100644
--- a/patches/@parcel__watcher@2.6.0.patch
+++ b/patches/@parcel__watcher@2.5.1.patch
@@ -1,22 +1,20 @@
 diff --git a/index.js b/index.js
-index 78ee744d74900c39a839cafa46b295258fc86307..f28fd092644ccfb8aff2618b966cb5219a181a02 100644
+index 8afb2b1126dcc687b7ff9b631589da252c1f9c22..398af238a439912d150b3573367873d2a9a311e3 100644
 --- a/index.js
 +++ b/index.js
-@@ -1,43 +1,32 @@
- const {createWrapper} = require('./wrapper');
+@@ -1,41 +1,34 @@
+-const {createWrapper} = require('./wrapper');
++const { createWrapper } = require('./wrapper')
  
 -let name = `@parcel/watcher-${process.platform}-${process.arch}`;
 -if (process.platform === 'linux') {
--  const {MUSL, familySync} = require('detect-libc');
--  const family = familySync();
+-  const { MUSL, family } = require('detect-libc');
 -  if (family === MUSL) {
 -    name += '-musl';
 -  } else {
 -    name += '-glibc';
 -  }
 -}
-+// We need to take the `process.env.PLATFORM_LIBC` into account, and we also
-+// need static analysis, so we can't make use of the `parts.push(…)` approach.
 +function loadPackage() {
 +  if (process.platform === 'linux') {
 +    if (process.env.PLATFORM_LIBC === "musl") {
@@ -24,8 +22,7 @@ index 78ee744d74900c39a839cafa46b295258fc86307..f28fd092644ccfb8aff2618b966cb521
 +    } else if (process.env.PLATFORM_LIBC === "glibc") {
 +      return require(`@parcel/watcher-${process.platform}-${process.arch}-glibc`)
 +    } else {
-+      let { MUSL, GLIBC, familySync } = require('detect-libc')
-+      let family = familySync()
++      let { MUSL, GLIBC, family, familySync } = require('detect-libc')
  
 -let binding;
 -try {
@@ -40,12 +37,14 @@ index 78ee744d74900c39a839cafa46b295258fc86307..f28fd092644ccfb8aff2618b966cb521
 -      binding = require('./build/Debug/watcher.node');
 -    } catch (err) {
 -      handleError(err);
--      throw new Error(
--        `No prebuild or local build of @parcel/watcher found. Tried ${name}. Please ensure it is installed (don't use --no-optional when installing with npm). Otherwise it is possible we don't support your platform yet. If this is the case, please report an issue to https://github.com/parcel-bundler/watcher.`,
--      );
+-      throw new Error(`No prebuild or local build of @parcel/watcher found. Tried ${name}. Please ensure it is installed (don't use --no-optional when installing with npm). Otherwise it is possible we don't support your platform yet. If this is the case, please report an issue to https://github.com/parcel-bundler/watcher.`);
 -    }
 -  }
 -}
++      // Bun polyfills `detect-libc` in compiled binaries. We rely on
++      // detect-libc@1.0.3 but the polyfilled version is 2.x. In detect-libc@2x
++      // there is a `familySync` function that we can use instead.
++      if (typeof familySync === 'function') family = familySync()
  
 -function handleError(err) {
 -  if (err?.code !== 'MODULE_NOT_FOUND') {
@@ -64,7 +63,12 @@ index 78ee744d74900c39a839cafa46b295258fc86307..f28fd092644ccfb8aff2618b966cb521
  }
  
 -const wrapper = createWrapper(binding);
-+const wrapper = createWrapper(loadPackage());
- exports.writeSnapshot = wrapper.writeSnapshot;
- exports.getEventsSince = wrapper.getEventsSince;
- exports.subscribe = wrapper.subscribe;
+-exports.writeSnapshot = wrapper.writeSnapshot;
+-exports.getEventsSince = wrapper.getEventsSince;
+-exports.subscribe = wrapper.subscribe;
+-exports.unsubscribe = wrapper.unsubscribe;
++const wrapper = createWrapper(loadPackage())
++exports.writeSnapshot = wrapper.writeSnapshot
++exports.getEventsSince = wrapper.getEventsSince
++exports.subscribe = wrapper.subscribe
++exports.unsubscribe = wrapper.unsubscribe
diff --git a/patches/lightningcss@1.33.0.patch b/patches/lightningcss@1.29.2.patch
similarity index 58%
rename from patches/lightningcss@1.33.0.patch
rename to patches/lightningcss@1.29.2.patch
index e70be2315..204f06ab3 100644
--- a/patches/lightningcss@1.33.0.patch
+++ b/patches/lightningcss@1.29.2.patch
@@ -1,8 +1,8 @@
 diff --git a/node/index.js b/node/index.js
-index 6fe25aef457aa5448f9ee6204da1e253f5534800..742be0229b94450b631b6e069ffc372d2b35df47 100644
+index 011d04b450687083e7a0ec9023c41ee79104831c..ef26db49d98c60b5b31f3601f6ad045f0b0e8f4f 100644
 --- a/node/index.js
 +++ b/node/index.js
-@@ -1,25 +1,40 @@
+@@ -1,28 +1,41 @@
 -let parts = [process.platform, process.arch];
 -if (process.platform === 'linux') {
 -  const { MUSL, familySync } = require('detect-libc');
@@ -11,8 +11,12 @@ index 6fe25aef457aa5448f9ee6204da1e253f5534800..742be0229b94450b631b6e069ffc372d
 -    parts.push('musl');
 -  } else if (process.arch === 'arm') {
 -    parts.push('gnueabihf');
-+// We need to take the `process.env.PLATFORM_LIBC` into account, and we also
-+// need static analysis, so we can't make use of the `parts.push(…)` approach.
+-  } else {
+-    parts.push('gnu');
+-  }
+-} else if (process.platform === 'win32') {
+-  parts.push('msvc');
+-}
 +function loadPackage() {
 +  if (process.platform === 'linux') {
 +    if (process.env.PLATFORM_LIBC === 'musl') {
@@ -24,8 +28,19 @@ index 6fe25aef457aa5448f9ee6204da1e253f5534800..742be0229b94450b631b6e069ffc372d
 +        return require(`lightningcss-${process.platform}-${process.arch}-gnu`)
 +      }
 +    } else {
-+      let { MUSL, GLIBC, familySync } = require('detect-libc')
-+      let family = familySync()
++      let { MUSL, GLIBC, family, familySync } = require('detect-libc')
+
+-if (process.env.CSS_TRANSFORMER_WASM) {
+-  module.exports = require(`../pkg`);
+-} else {
+-  try {
+-    module.exports = require(`lightningcss-${parts.join('-')}`);
+-  } catch (err) {
+-    module.exports = require(`../lightningcss.${parts.join('-')}.node`);
++      // Bun polyfills `detect-libc` in compiled binaries. We rely on
++      // detect-libc@1.0.3 but the polyfilled version is 2.x. In detect-libc@2x
++      // there is a `familySync` function that we can use instead.
++      if (typeof familySync === 'function') family = familySync()
 +
 +      if (family === MUSL) {
 +        return require(`lightningcss-${process.platform}-${process.arch}-musl`)
@@ -41,22 +56,15 @@ index 6fe25aef457aa5448f9ee6204da1e253f5534800..742be0229b94450b631b6e069ffc372d
 +    }
 +  } else if (process.platform === 'win32') {
 +    return require(`lightningcss-${process.platform}-${process.arch}-msvc`)
-   } else {
--    parts.push('gnu');
++  } else {
 +    return require(`lightningcss-${process.platform}-${process.arch}`)
    }
--} else if (process.platform === 'win32') {
--  parts.push('msvc');
  }
- 
--let native;
--try {
--  native = require(`lightningcss-${parts.join('-')}`);
--} catch (err) {
--  native = require(`../lightningcss.${parts.join('-')}.node`);
--}
- 
-+let native = loadPackage();
- module.exports.transform = wrap(native.transform);
- module.exports.transformStyleAttribute = wrap(native.transformStyleAttribute);
- module.exports.bundle = wrap(native.bundle);
+
+-module.exports.browserslistToTargets = require('./browserslistToTargets');
+-module.exports.composeVisitors = require('./composeVisitors');
+-module.exports.Features = require('./flags').Features;
++module.exports = loadPackage()
++module.exports.browserslistToTargets = require('./browserslistToTargets')
++module.exports.composeVisitors = require('./composeVisitors')
++module.exports.Features = require('./flags').Features
diff --git a/playgrounds/nextjs/app/layout.tsx b/playgrounds/nextjs/app/layout.tsx
index 41ee7f492..cf832e94e 100644
--- a/playgrounds/nextjs/app/layout.tsx
+++ b/playgrounds/nextjs/app/layout.tsx
@@ -15,7 +15,7 @@ export default function RootLayout({
   children: React.ReactNode
 }>) {
   return (
-    <html lang="en">
+    <html lang="en" className="[&_h1]:font-thin">
       <head>{/* <script src="https://cdn.tailwindcss.com"></script> */}</head>
       <body className={inter.className}>{children}</body>
     </html>
diff --git a/playgrounds/nextjs/app/page.module.css b/playgrounds/nextjs/app/page.module.css
index b0117f44c..e0c1bf51e 100644
--- a/playgrounds/nextjs/app/page.module.css
+++ b/playgrounds/nextjs/app/page.module.css
@@ -1,5 +1,228 @@
-@reference "./globals.css";
-
-.heading {
-  @apply text-red-500;
+.main {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+  padding: 6rem;
+  min-height: 100vh;
+}
+
+.description {
+  display: inherit;
+  justify-content: inherit;
+  align-items: inherit;
+  font-size: 0.85rem;
+  max-width: var(--max-width);
+  width: 100%;
+  z-index: 2;
+  font-family: var(--font-mono);
+}
+
+.description a {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.description p {
+  position: relative;
+  margin: 0;
+  padding: 1rem;
+  background-color: rgba(var(--callout-rgb), 0.5);
+  border: 1px solid rgba(var(--callout-border-rgb), 0.3);
+  border-radius: var(--border-radius);
+}
+
+.code {
+  font-weight: 700;
+  font-family: var(--font-mono);
+}
+
+.grid {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(25%, auto));
+  max-width: 100%;
+  width: var(--max-width);
+}
+
+.card {
+  padding: 1rem 1.2rem;
+  border-radius: var(--border-radius);
+  background: rgba(var(--card-rgb), 0);
+  border: 1px solid rgba(var(--card-border-rgb), 0);
+  transition:
+    background 200ms,
+    border 200ms;
+}
+
+.card span {
+  display: inline-block;
+  transition: transform 200ms;
+}
+
+.card h2 {
+  font-weight: 600;
+  margin-bottom: 0.7rem;
+}
+
+.card p {
+  margin: 0;
+  opacity: 0.6;
+  font-size: 0.9rem;
+  line-height: 1.5;
+  max-width: 30ch;
+  text-wrap: balance;
+}
+
+.center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: relative;
+  padding: 4rem 0;
+}
+
+.center::before {
+  background: var(--secondary-glow);
+  border-radius: 50%;
+  width: 480px;
+  height: 360px;
+  margin-left: -400px;
+}
+
+.center::after {
+  background: var(--primary-glow);
+  width: 240px;
+  height: 180px;
+  z-index: -1;
+}
+
+.center::before,
+.center::after {
+  content: '';
+  left: 50%;
+  position: absolute;
+  filter: blur(45px);
+  transform: translateZ(0);
+}
+
+.logo {
+  position: relative;
+}
+/* Enable hover only on non-touch devices */
+@media (hover: hover) and (pointer: fine) {
+  .card:hover {
+    background: rgba(var(--card-rgb), 0.1);
+    border: 1px solid rgba(var(--card-border-rgb), 0.15);
+  }
+
+  .card:hover span {
+    transform: translateX(4px);
+  }
+}
+
+@media (prefers-reduced-motion) {
+  .card:hover span {
+    transform: none;
+  }
+}
+
+/* Mobile */
+@media (max-width: 700px) {
+  .content {
+    padding: 4rem;
+  }
+
+  .grid {
+    grid-template-columns: 1fr;
+    margin-bottom: 120px;
+    max-width: 320px;
+    text-align: center;
+  }
+
+  .card {
+    padding: 1rem 2.5rem;
+  }
+
+  .card h2 {
+    margin-bottom: 0.5rem;
+  }
+
+  .center {
+    padding: 8rem 0 6rem;
+  }
+
+  .center::before {
+    transform: none;
+    height: 300px;
+  }
+
+  .description {
+    font-size: 0.8rem;
+  }
+
+  .description a {
+    padding: 1rem;
+  }
+
+  .description p,
+  .description div {
+    display: flex;
+    justify-content: center;
+    position: fixed;
+    width: 100%;
+  }
+
+  .description p {
+    align-items: center;
+    inset: 0 0 auto;
+    padding: 2rem 1rem 1.4rem;
+    border-radius: 0;
+    border: none;
+    border-bottom: 1px solid rgba(var(--callout-border-rgb), 0.25);
+    background: linear-gradient(
+      to bottom,
+      rgba(var(--background-start-rgb), 1),
+      rgba(var(--callout-rgb), 0.5)
+    );
+    background-clip: padding-box;
+    backdrop-filter: blur(24px);
+  }
+
+  .description div {
+    align-items: flex-end;
+    pointer-events: none;
+    inset: auto 0 0;
+    padding: 2rem;
+    height: 200px;
+    background: linear-gradient(to bottom, transparent 0%, rgb(var(--background-end-rgb)) 40%);
+    z-index: 1;
+  }
+}
+
+/* Tablet and Smaller Desktop */
+@media (min-width: 701px) and (max-width: 1120px) {
+  .grid {
+    grid-template-columns: repeat(2, 50%);
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  .vercelLogo {
+    filter: invert(1);
+  }
+
+  .logo {
+    filter: invert(1) drop-shadow(0 0 0.3rem #ffffff70);
+  }
+}
+
+@keyframes rotate {
+  from {
+    transform: rotate(360deg);
+  }
+  to {
+    transform: rotate(0deg);
+  }
 }
diff --git a/playgrounds/nextjs/app/page.tsx b/playgrounds/nextjs/app/page.tsx
index 70ea89898..3c5390442 100644
--- a/playgrounds/nextjs/app/page.tsx
+++ b/playgrounds/nextjs/app/page.tsx
@@ -1,5 +1,3 @@
-import styles from './page.module.css'
-
 export default function Home() {
-  return <h1 className={styles.heading}>Hello world!</h1>
+  return <h1 className="text-3xl font-bold underline border ring">Hello world!</h1>
 }
diff --git a/playgrounds/nextjs/package.json b/playgrounds/nextjs/package.json
index 5487af5a5..a80871011 100644
--- a/playgrounds/nextjs/package.json
+++ b/playgrounds/nextjs/package.json
@@ -5,20 +5,23 @@
   "scripts": {
     "dev": "next dev",
     "build": "next build",
-    "start": "next start"
+    "start": "next start",
+    "lint": "next lint"
   },
   "dependencies": {
     "@tailwindcss/postcss": "workspace:^",
     "fast-glob": "^3.3.3",
-    "next": "16.2.7",
-    "react": "19.2.7",
-    "react-dom": "19.2.7",
+    "next": "15.2.3",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "tailwindcss": "workspace:^"
   },
   "devDependencies": {
     "@types/node": "catalog:",
-    "@types/react": "19.2.15",
-    "@types/react-dom": "19.2.3",
-    "typescript": "^6.0.3"
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "eslint": "^9.22.0",
+    "eslint-config-next": "^15.2.3",
+    "typescript": "^5.5.4"
   }
 }
diff --git a/playgrounds/nextjs/tsconfig.json b/playgrounds/nextjs/tsconfig.json
index 27414aae7..862143548 100644
--- a/playgrounds/nextjs/tsconfig.json
+++ b/playgrounds/nextjs/tsconfig.json
@@ -10,7 +10,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "react-jsx",
+    "jsx": "preserve",
     "incremental": true,
     "plugins": [
       {
@@ -20,14 +20,7 @@
     "paths": {
       "@/*": ["./*"],
     },
-    "target": "ES2017",
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts",
-    ".next/dev/types/**/*.ts",
-  ],
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
   "exclude": ["node_modules"],
 }
diff --git a/playgrounds/v3/package.json b/playgrounds/v3/package.json
index 8c08310db..5fc2f046b 100644
--- a/playgrounds/v3/package.json
+++ b/playgrounds/v3/package.json
@@ -9,16 +9,18 @@
     "upgrade": "node scripts/upgrade.mjs"
   },
   "dependencies": {
-    "next": "16.2.7",
-    "react": "19.2.7",
-    "react-dom": "19.2.7",
+    "next": "15.2.3",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "tailwindcss": "^3"
   },
   "devDependencies": {
-    "@types/node": "catalog:",
-    "@types/react": "19.2.15",
-    "@types/react-dom": "19.2.3",
-    "autoprefixer": "^10.5.0",
-    "typescript": "^6.0.3"
+    "@types/node": "^20.14.8",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "autoprefixer": "^10.4.21",
+    "eslint": "^9.22.0",
+    "eslint-config-next": "^15.2.3",
+    "typescript": "^5.5.4"
   }
 }
diff --git a/playgrounds/v3/tsconfig.json b/playgrounds/v3/tsconfig.json
index 27414aae7..862143548 100644
--- a/playgrounds/v3/tsconfig.json
+++ b/playgrounds/v3/tsconfig.json
@@ -10,7 +10,7 @@
     "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "jsx": "react-jsx",
+    "jsx": "preserve",
     "incremental": true,
     "plugins": [
       {
@@ -20,14 +20,7 @@
     "paths": {
       "@/*": ["./*"],
     },
-    "target": "ES2017",
   },
-  "include": [
-    "next-env.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    ".next/types/**/*.ts",
-    ".next/dev/types/**/*.ts",
-  ],
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
   "exclude": ["node_modules"],
 }
diff --git a/playgrounds/vite/package.json b/playgrounds/vite/package.json
index 25ab1a33b..749a6bcbf 100644
--- a/playgrounds/vite/package.json
+++ b/playgrounds/vite/package.json
@@ -10,15 +10,15 @@
   },
   "dependencies": {
     "@tailwindcss/vite": "workspace:^",
-    "@vitejs/plugin-react": "^6.0.2",
-    "react": "^19.2.6",
-    "react-dom": "^19.2.6",
+    "@vitejs/plugin-react": "^4.3.4",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
     "tailwindcss": "workspace:^"
   },
   "devDependencies": {
-    "@types/react": "^19.2.15",
-    "@types/react-dom": "^19.2.3",
-    "bun": "^1.3.14",
+    "@types/react": "^19.0.10",
+    "@types/react-dom": "^19.0.4",
+    "bun": "^1.2.4",
     "vite": "catalog:"
   }
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 8382b2ba5..efeac8bfd 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -6,136 +6,87 @@ settings:
 
 catalogs:
   default:
-    '@parcel/watcher':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-darwin-arm64':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-darwin-x64':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-linux-arm64-glibc':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-linux-arm64-musl':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-linux-x64-glibc':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-linux-x64-musl':
-      specifier: 2.6.0
-      version: 2.6.0
-    '@parcel/watcher-win32-x64':
-      specifier: 2.6.0
-      version: 2.6.0
     '@types/node':
-      specifier: 22.20.1
-      version: 22.20.1
-    dedent:
-      specifier: 1.7.2
-      version: 1.7.2
-    enhanced-resolve:
-      specifier: ^5.24.5
-      version: 5.24.5
+      specifier: ^20.14.8
+      version: 20.14.13
     lightningcss:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-darwin-arm64:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-darwin-x64:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-linux-arm64-gnu:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-linux-arm64-musl:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-linux-x64-gnu:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-linux-x64-musl:
-      specifier: 1.33.0
-      version: 1.33.0
+      specifier: 1.29.2
+      version: 1.29.2
     lightningcss-win32-x64-msvc:
-      specifier: 1.33.0
-      version: 1.33.0
-    postcss:
-      specifier: ^8.5.25
-      version: 8.5.25
+      specifier: 1.29.2
+      version: 1.29.2
     prettier:
-      specifier: 3.9.6
-      version: 3.9.6
+      specifier: 3.5.0
+      version: 3.5.0
     vite:
-      specifier: ^8.2.0
-      version: 8.2.0
-    webpack:
-      specifier: ^5.109.2
-      version: 5.109.2
+      specifier: ^6.0.0
+      version: 6.0.0
 
 patchedDependencies:
-  '@napi-rs/cli@3.7.4': 9912bf0a9c2cef8329d11c41fbce4d33ce2bdcf660a630b258c962c0a3c44bed
-  '@parcel/watcher@2.6.0': 705ce75ccea54337110c4d7fe0a8b421658ea0c23e1a77c1fa890a86041179da
-  lightningcss@1.33.0: 1d4a8800d60d13d42887b88b3a86576df4b451670308145fb432ec8abbf40930
+  '@parcel/watcher@2.5.1':
+    hash: zs2vvlrje3h42xp5ed2v44fep4
+    path: patches/@parcel__watcher@2.5.1.patch
+  lightningcss@1.29.2:
+    hash: tzyxy3asfxcqc7ihrooumyi5fm
+    path: patches/lightningcss@1.29.2.patch
 
 importers:
 
   .:
     devDependencies:
       '@playwright/test':
-        specifier: ^1.62.1
-        version: 1.62.1
+        specifier: ^1.51.0
+        version: 1.51.0
       '@types/node':
         specifier: 'catalog:'
-        version: 22.20.1
+        version: 20.14.13
       postcss:
-        specifier: 'catalog:'
-        version: 8.5.25
+        specifier: 8.5.3
+        version: 8.5.3
       postcss-import:
-        specifier: ^16.1.1
-        version: 16.1.1(postcss@8.5.25)
+        specifier: ^16.1.0
+        version: 16.1.0(postcss@8.5.3)
       prettier:
         specifier: 'catalog:'
-        version: 3.9.6
+        version: 3.5.0
       prettier-plugin-embed:
-        specifier: ^0.5.1
-        version: 0.5.1
+        specifier: ^0.5.0
+        version: 0.5.0
       prettier-plugin-organize-imports:
-        specifier: ^4.3.0
-        version: 4.3.0(prettier@3.9.6)(typescript@5.9.3)
+        specifier: ^4.0.0
+        version: 4.0.0(prettier@3.5.0)(typescript@5.5.4)
       tsup:
-        specifier: ^8.5.1
-        version: 8.5.1(jiti@2.7.0)(postcss@8.5.25)(typescript@5.9.3)(yaml@2.9.0)
+        specifier: ^8.4.0
+        version: 8.4.0(jiti@2.4.2)(postcss@8.5.3)(tsx@4.19.1)(typescript@5.5.4)(yaml@2.6.0)
       turbo:
-        specifier: ^2.10.8
-        version: 2.10.8
+        specifier: ^2.4.4
+        version: 2.4.4
       typescript:
-        specifier: ^5.9.3
-        version: 5.9.3
+        specifier: ^5.5.4
+        version: 5.5.4
       vitest:
-        specifier: ^4.1.10
-        version: 4.1.10(@types/node@22.20.1)(vite@8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
+        specifier: ^2.0.5
+        version: 2.0.5(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)
 
   crates/node:
-    devDependencies:
-      '@emnapi/core':
-        specifier: 1.11.3
-        version: 1.11.3
-      '@emnapi/runtime':
-        specifier: 1.11.3
-        version: 1.11.3
-      '@napi-rs/cli':
-        specifier: 3.7.4
-        version: 3.7.4(patch_hash=9912bf0a9c2cef8329d11c41fbce4d33ce2bdcf660a630b258c962c0a3c44bed)(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)(@types/node@25.9.1)(node-addon-api@8.7.0)
-      '@napi-rs/wasm-runtime':
-        specifier: ^1.2.2
-        version: 1.2.2(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      emnapi:
-        specifier: 1.11.3
-        version: 1.11.3(node-addon-api@8.7.0)
     optionalDependencies:
       '@tailwindcss/oxide-android-arm64':
         specifier: workspace:*
@@ -164,15 +115,16 @@ importers:
       '@tailwindcss/oxide-linux-x64-musl':
         specifier: workspace:*
         version: link:npm/linux-x64-musl
-      '@tailwindcss/oxide-wasm32-wasi':
-        specifier: workspace:*
-        version: link:npm/wasm32-wasi
       '@tailwindcss/oxide-win32-arm64-msvc':
         specifier: workspace:*
         version: link:npm/win32-arm64-msvc
       '@tailwindcss/oxide-win32-x64-msvc':
         specifier: workspace:*
         version: link:npm/win32-x64-msvc
+    devDependencies:
+      '@napi-rs/cli':
+        specifier: ^2.18.4
+        version: 2.18.4
 
   crates/node/npm/android-arm-eabi: {}
 
@@ -194,27 +146,6 @@ importers:
 
   crates/node/npm/linux-x64-musl: {}
 
-  crates/node/npm/wasm32-wasi:
-    dependencies:
-      '@emnapi/core':
-        specifier: ^1.11.3
-        version: 1.11.3
-      '@emnapi/runtime':
-        specifier: ^1.11.3
-        version: 1.11.3
-      '@emnapi/wasi-threads':
-        specifier: ^1.2.3
-        version: 1.2.3
-      '@napi-rs/wasm-runtime':
-        specifier: ^1.2.2
-        version: 1.2.2(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@tybys/wasm-util':
-        specifier: ^0.10.3
-        version: 0.10.3
-      tslib:
-        specifier: ^2.8.1
-        version: 2.8.1
-
   crates/node/npm/win32-arm64-msvc: {}
 
   crates/node/npm/win32-x64-msvc: {}
@@ -222,26 +153,20 @@ importers:
   integrations:
     devDependencies:
       dedent:
-        specifier: 'catalog:'
-        version: 1.7.2
+        specifier: 1.5.3
+        version: 1.5.3
       fast-glob:
         specifier: ^3.3.3
         version: 3.3.3
-      source-map-js:
-        specifier: ^1.2.1
-        version: 1.2.1
-      yaml:
-        specifier: ^2.9.0
-        version: 2.9.0
 
   packages/@tailwindcss-browser:
     devDependencies:
       h3:
-        specifier: ^1.15.11
-        version: 1.15.11
+        specifier: ^1.15.1
+        version: 1.15.1
       listhen:
-        specifier: ^1.10.1
-        version: 1.10.1(@parcel/watcher@2.6.0(patch_hash=705ce75ccea54337110c4d7fe0a8b421658ea0c23e1a77c1fa890a86041179da))
+        specifier: ^1.9.0
+        version: 1.9.0
       tailwindcss:
         specifier: workspace:*
         version: link:../tailwindcss
@@ -249,8 +174,8 @@ importers:
   packages/@tailwindcss-cli:
     dependencies:
       '@parcel/watcher':
-        specifier: 'catalog:'
-        version: 2.6.0(patch_hash=705ce75ccea54337110c4d7fe0a8b421658ea0c23e1a77c1fa890a86041179da)
+        specifier: ^2.5.1
+        version: 2.5.1(patch_hash=zs2vvlrje3h42xp5ed2v44fep4)
       '@tailwindcss/node':
         specifier: workspace:*
         version: link:../@tailwindcss-node
@@ -258,8 +183,11 @@ importers:
         specifier: workspace:*
         version: link:../../crates/node
       enhanced-resolve:
+        specifier: ^5.18.1
+        version: 5.18.1
+      lightningcss:
         specifier: 'catalog:'
-        version: 5.24.5
+        version: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
       mri:
         specifier: ^1.2.0
         version: 1.2.0
@@ -270,26 +198,60 @@ importers:
         specifier: workspace:*
         version: link:../tailwindcss
 
-  packages/@tailwindcss-node:
+  packages/@tailwindcss-compatibility:
     dependencies:
-      '@jridgewell/remapping':
-        specifier: ^2.3.5
-        version: 2.3.5
-      enhanced-resolve:
-        specifier: 'catalog:'
-        version: 5.24.5
-      jiti:
-        specifier: ^2.7.0
-        version: 2.7.0
+      '@csstools/postcss-cascade-layers':
+        specifier: ^5.0.1
+        version: 5.0.1(postcss@8.5.3)
+      '@csstools/postcss-color-mix-function':
+        specifier: ^3.0.8
+        version: 3.0.8(postcss@8.5.3)
+      '@csstools/postcss-oklab-function':
+        specifier: ^4.0.8
+        version: 4.0.8(postcss@8.5.3)
+      '@tailwindcss/node':
+        specifier: workspace:*
+        version: link:../@tailwindcss-node
+      '@tailwindcss/oxide':
+        specifier: workspace:*
+        version: link:../../crates/node
+      autoprefixer:
+        specifier: ^10.4.21
+        version: 10.4.21(postcss@8.5.3)
       lightningcss:
         specifier: 'catalog:'
-        version: 1.33.0(patch_hash=1d4a8800d60d13d42887b88b3a86576df4b451670308145fb432ec8abbf40930)
-      magic-string:
-        specifier: ^1.1.0
-        version: 1.1.0
-      source-map-js:
-        specifier: ^1.2.1
-        version: 1.2.1
+        version: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
+      postcss:
+        specifier: ^8.4.41
+        version: 8.5.3
+      postcss-media-minmax:
+        specifier: ^5.0.0
+        version: 5.0.0(postcss@8.5.3)
+      postcss-nesting:
+        specifier: ^13.0.1
+        version: 13.0.1(postcss@8.5.3)
+    devDependencies:
+      '@tailwindcss/postcss':
+        specifier: workspace:*
+        version: link:../@tailwindcss-postcss
+      '@types/node':
+        specifier: 'catalog:'
+        version: 20.14.13
+      dedent:
+        specifier: 1.5.3
+        version: 1.5.3
+      tailwindcss:
+        specifier: workspace:*
+        version: link:../tailwindcss
+
+  packages/@tailwindcss-node:
+    dependencies:
+      enhanced-resolve:
+        specifier: ^5.18.1
+        version: 5.18.1
+      jiti:
+        specifier: ^2.4.2
+        version: 2.4.2
       tailwindcss:
         specifier: workspace:*
         version: link:../tailwindcss
@@ -305,28 +267,31 @@ importers:
       '@tailwindcss/oxide':
         specifier: workspace:*
         version: link:../../crates/node
-      postcss:
+      lightningcss:
         specifier: 'catalog:'
-        version: 8.5.25
+        version: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
+      postcss:
+        specifier: ^8.4.41
+        version: 8.4.41
       tailwindcss:
         specifier: workspace:*
         version: link:../tailwindcss
     devDependencies:
       '@types/node':
         specifier: 'catalog:'
-        version: 22.20.1
+        version: 20.14.13
       '@types/postcss-import':
         specifier: 14.0.3
         version: 14.0.3
       dedent:
-        specifier: 'catalog:'
-        version: 1.7.2
+        specifier: 1.5.3
+        version: 1.5.3
       internal-example-plugin:
         specifier: workspace:*
         version: link:../internal-example-plugin
       postcss-import:
-        specifier: ^16.1.1
-        version: 16.1.1(postcss@8.5.25)
+        specifier: ^16.1.0
+        version: 16.1.0(postcss@8.4.41)
 
   packages/@tailwindcss-standalone:
     dependencies:
@@ -337,91 +302,69 @@ importers:
         specifier: workspace:*
         version: link:../@tailwindcss-cli
       '@tailwindcss/forms':
-        specifier: ^0.5.11
-        version: 0.5.11(tailwindcss@packages+tailwindcss)
+        specifier: ^0.5.10
+        version: 0.5.10(tailwindcss@packages+tailwindcss)
       '@tailwindcss/typography':
-        specifier: ^0.5.20
-        version: 0.5.20(tailwindcss@packages+tailwindcss)
+        specifier: ^0.5.16
+        version: 0.5.16(tailwindcss@packages+tailwindcss)
       detect-libc:
         specifier: 1.0.3
         version: 1.0.3
       enhanced-resolve:
-        specifier: 'catalog:'
-        version: 5.24.5
+        specifier: ^5.18.1
+        version: 5.18.1
       tailwindcss:
         specifier: workspace:*
         version: link:../tailwindcss
     devDependencies:
       '@parcel/watcher-darwin-arm64':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@parcel/watcher-darwin-x64':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@parcel/watcher-linux-arm64-glibc':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@parcel/watcher-linux-arm64-musl':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@parcel/watcher-linux-x64-glibc':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@parcel/watcher-linux-x64-musl':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@parcel/watcher-win32-x64':
-        specifier: 'catalog:'
-        version: 2.6.0
+        specifier: ^2.5.1
+        version: 2.5.1
       '@types/bun':
-        specifier: ^1.3.14
-        version: 1.3.14
+        specifier: ^1.2.4
+        version: 1.2.4
       bun:
-        specifier: ^1.3.14
-        version: 1.3.14
+        specifier: ^1.2.4
+        version: 1.2.4
       lightningcss-darwin-arm64:
         specifier: 'catalog:'
-        version: 1.33.0
+        version: 1.29.2
       lightningcss-darwin-x64:
         specifier: 'catalog:'
-        version: 1.33.0
+        version: 1.29.2
       lightningcss-linux-arm64-gnu:
         specifier: 'catalog:'
-        version: 1.33.0
+        version: 1.29.2
       lightningcss-linux-arm64-musl:
         specifier: 'catalog:'
-        version: 1.33.0
+        version: 1.29.2
       lightningcss-linux-x64-gnu:
         specifier: 'catalog:'
-        version: 1.33.0
+        version: 1.29.2
       lightningcss-linux-x64-musl:
         specifier: 'catalog:'
-        version: 1.33.0
+        version: 1.29.2
       lightningcss-win32-x64-msvc:
         specifier: 'catalog:'
-        version: 1.33.0
-
-  packages/@tailwindcss-turbopack:
-    dependencies:
-      '@alloc/quick-lru':
-        specifier: ^5.2.0
-        version: 5.2.0
-      '@tailwindcss/node':
-        specifier: workspace:*
-        version: link:../@tailwindcss-node
-      '@tailwindcss/oxide':
-        specifier: workspace:*
-        version: link:../../crates/node
-      tailwindcss:
-        specifier: workspace:*
-        version: link:../tailwindcss
-    devDependencies:
-      '@types/node':
-        specifier: 'catalog:'
-        version: 22.20.1
-      webpack:
-        specifier: 'catalog:'
-        version: 5.109.2(esbuild@0.27.7)(postcss@8.5.25)
+        version: 1.29.2
 
   packages/@tailwindcss-upgrade:
     dependencies:
@@ -431,18 +374,21 @@ importers:
       '@tailwindcss/oxide':
         specifier: workspace:*
         version: link:../../crates/node
+      braces:
+        specifier: ^3.0.3
+        version: 3.0.3
       dedent:
-        specifier: 'catalog:'
-        version: 1.7.2
+        specifier: 1.5.3
+        version: 1.5.3
       enhanced-resolve:
-        specifier: 'catalog:'
-        version: 5.24.5
+        specifier: ^5.18.1
+        version: 5.18.1
       globby:
-        specifier: ^16.2.2
-        version: 16.2.2
+        specifier: ^14.1.0
+        version: 14.1.0
       jiti:
-        specifier: ^2.7.0
-        version: 2.7.0
+        specifier: ^2.0.0-beta.3
+        version: 2.4.2
       mri:
         specifier: ^1.2.0
         version: 1.2.0
@@ -450,39 +396,36 @@ importers:
         specifier: ^1.1.1
         version: 1.1.1
       postcss:
-        specifier: 'catalog:'
-        version: 8.5.25
+        specifier: ^8.4.41
+        version: 8.4.41
       postcss-import:
-        specifier: ^16.1.1
-        version: 16.1.1(postcss@8.5.25)
+        specifier: ^16.1.0
+        version: 16.1.0(postcss@8.4.41)
       postcss-selector-parser:
-        specifier: ^7.1.4
-        version: 7.1.4
+        specifier: ^7.1.0
+        version: 7.1.0
       prettier:
         specifier: 'catalog:'
-        version: 3.9.6
-      semver:
-        specifier: ^7.8.5
-        version: 7.8.5
+        version: 3.5.0
       tailwindcss:
         specifier: workspace:*
         version: link:../tailwindcss
       tree-sitter:
-        specifier: ^0.25.1
-        version: 0.25.1
+        specifier: ^0.22.4
+        version: 0.22.4
       tree-sitter-typescript:
         specifier: ^0.23.2
-        version: 0.23.2(tree-sitter@0.25.1)
+        version: 0.23.2(tree-sitter@0.22.4)
     devDependencies:
+      '@types/braces':
+        specifier: ^3.0.5
+        version: 3.0.5
       '@types/node':
         specifier: 'catalog:'
-        version: 22.20.1
+        version: 20.14.13
       '@types/postcss-import':
         specifier: ^14.0.3
         version: 14.0.3
-      '@types/semver':
-        specifier: ^7.8.0
-        version: 7.8.0
 
   packages/@tailwindcss-vite:
     dependencies:
@@ -492,67 +435,36 @@ importers:
       '@tailwindcss/oxide':
         specifier: workspace:*
         version: link:../../crates/node
+      lightningcss:
+        specifier: 'catalog:'
+        version: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
       tailwindcss:
         specifier: workspace:*
         version: link:../tailwindcss
     devDependencies:
       '@types/node':
         specifier: 'catalog:'
-        version: 22.20.1
+        version: 20.14.13
       vite:
         specifier: 'catalog:'
-        version: 8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
-
-  packages/@tailwindcss-webpack:
-    dependencies:
-      '@alloc/quick-lru':
-        specifier: ^5.2.0
-        version: 5.2.0
-      '@rspack/core':
-        specifier: ^1.0.0 || ^2.0.0
-        version: 2.0.2(@swc/helpers@0.5.15)
-      '@tailwindcss/node':
-        specifier: workspace:*
-        version: link:../@tailwindcss-node
-      '@tailwindcss/oxide':
-        specifier: workspace:*
-        version: link:../../crates/node
-      tailwindcss:
-        specifier: workspace:*
-        version: link:../tailwindcss
-    devDependencies:
-      '@types/node':
-        specifier: 'catalog:'
-        version: 22.20.1
-      webpack:
-        specifier: 'catalog:'
-        version: 5.109.2(esbuild@0.27.7)(postcss@8.5.25)
+        version: 6.0.0(@types/node@20.14.13)(jiti@2.4.2)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)(tsx@4.19.1)(yaml@2.6.0)
 
   packages/internal-example-plugin: {}
 
   packages/tailwindcss:
     devDependencies:
-      '@jridgewell/remapping':
-        specifier: ^2.3.5
-        version: 2.3.5
       '@tailwindcss/oxide':
         specifier: workspace:^
         version: link:../../crates/node
       '@types/node':
         specifier: 'catalog:'
-        version: 22.20.1
+        version: 20.14.13
       dedent:
-        specifier: 'catalog:'
-        version: 1.7.2
+        specifier: 1.5.3
+        version: 1.5.3
       lightningcss:
         specifier: 'catalog:'
-        version: 1.33.0(patch_hash=1d4a8800d60d13d42887b88b3a86576df4b451670308145fb432ec8abbf40930)
-      magic-string:
-        specifier: ^1.1.0
-        version: 1.1.0
-      source-map-js:
-        specifier: ^1.2.1
-        version: 1.2.1
+        version: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
 
   playgrounds/nextjs:
     dependencies:
@@ -563,61 +475,73 @@ importers:
         specifier: ^3.3.3
         version: 3.3.3
       next:
-        specifier: 16.2.7
-        version: 16.2.7(@playwright/test@1.62.1)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)
+        specifier: 15.2.3
+        version: 15.2.3(@playwright/test@1.51.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
       react:
-        specifier: 19.2.7
-        version: 19.2.7
+        specifier: ^19.0.0
+        version: 19.0.0
       react-dom:
-        specifier: 19.2.7
-        version: 19.2.7(react@19.2.7)
+        specifier: ^19.0.0
+        version: 19.0.0(react@19.0.0)
       tailwindcss:
         specifier: workspace:^
         version: link:../../packages/tailwindcss
     devDependencies:
       '@types/node':
         specifier: 'catalog:'
-        version: 22.20.1
+        version: 20.14.13
       '@types/react':
-        specifier: 19.2.15
-        version: 19.2.15
+        specifier: ^19.0.10
+        version: 19.0.10
       '@types/react-dom':
-        specifier: 19.2.3
-        version: 19.2.3(@types/react@19.2.15)
+        specifier: ^19.0.4
+        version: 19.0.4(@types/react@19.0.10)
+      eslint:
+        specifier: ^9.22.0
+        version: 9.22.0(jiti@2.4.2)
+      eslint-config-next:
+        specifier: ^15.2.3
+        version: 15.2.3(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
       typescript:
-        specifier: ^6.0.3
-        version: 6.0.3
+        specifier: ^5.5.4
+        version: 5.5.4
 
   playgrounds/v3:
     dependencies:
       next:
-        specifier: 16.2.7
-        version: 16.2.7(@playwright/test@1.62.1)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)
+        specifier: 15.2.3
+        version: 15.2.3(@playwright/test@1.51.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0)
       react:
-        specifier: 19.2.7
-        version: 19.2.7
+        specifier: ^19.0.0
+        version: 19.0.0
       react-dom:
-        specifier: 19.2.7
-        version: 19.2.7(react@19.2.7)
+        specifier: ^19.0.0
+        version: 19.0.0(react@19.0.0)
       tailwindcss:
         specifier: ^3
-        version: 3.4.19(yaml@2.9.0)
+        version: 3.4.14
     devDependencies:
       '@types/node':
-        specifier: 'catalog:'
-        version: 22.20.1
+        specifier: ^20.14.8
+        version: 20.14.13
       '@types/react':
-        specifier: 19.2.15
-        version: 19.2.15
+        specifier: ^19.0.10
+        version: 19.0.10
       '@types/react-dom':
-        specifier: 19.2.3
-        version: 19.2.3(@types/react@19.2.15)
+        specifier: ^19.0.4
+        version: 19.0.4(@types/react@19.0.10)
       autoprefixer:
-        specifier: ^10.5.0
-        version: 10.5.0(postcss@8.5.25)
+        specifier: ^10.4.21
+        version: 10.4.21(postcss@8.5.3)
+      eslint:
+        specifier: ^9.22.0
+        version: 9.22.0(jiti@2.4.2)
+      eslint-config-next:
+        specifier: ^15.2.3
+        version: 15.2.3(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
       typescript:
-        specifier: ^6.0.3
-        version: 6.0.3
+        specifier: ^5.5.4
+        version: 5.6.3
 
   playgrounds/vite:
     dependencies:
@@ -625,30 +549,30 @@ importers:
         specifier: workspace:^
         version: link:../../packages/@tailwindcss-vite
       '@vitejs/plugin-react':
-        specifier: ^6.0.2
-        version: 6.0.2(vite@8.2.0(@types/node@25.9.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
+        specifier: ^4.3.4
+        version: 4.3.4(vite@6.0.0(@types/node@20.14.13)(jiti@2.4.2)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)(tsx@4.19.1)(yaml@2.6.0))
       react:
-        specifier: ^19.2.6
-        version: 19.2.6
+        specifier: ^19.0.0
+        version: 19.0.0
       react-dom:
-        specifier: ^19.2.6
-        version: 19.2.6(react@19.2.6)
+        specifier: ^19.0.0
+        version: 19.0.0(react@19.0.0)
       tailwindcss:
         specifier: workspace:^
         version: link:../../packages/tailwindcss
     devDependencies:
       '@types/react':
-        specifier: ^19.2.15
-        version: 19.2.15
+        specifier: ^19.0.10
+        version: 19.0.10
       '@types/react-dom':
-        specifier: ^19.2.3
-        version: 19.2.3(@types/react@19.2.15)
+        specifier: ^19.0.4
+        version: 19.0.4(@types/react@19.0.10)
       bun:
-        specifier: ^1.3.14
-        version: 1.3.14
+        specifier: ^1.2.4
+        version: 1.2.4
       vite:
         specifier: 'catalog:'
-        version: 8.2.0(@types/node@25.9.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+        version: 6.0.0(@types/node@20.14.13)(jiti@2.4.2)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)(tsx@4.19.1)(yaml@2.6.0)
 
 packages:
 
@@ -656,906 +580,981 @@ packages:
     resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
     engines: {node: '>=10'}
 
-  '@emnapi/core@1.10.0':
-    resolution: {integrity: sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==}
+  '@ampproject/remapping@2.3.0':
+    resolution: {integrity: sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==}
+    engines: {node: '>=6.0.0'}
 
-  '@emnapi/core@1.11.3':
-    resolution: {integrity: sha512-zLpS5asjEb7lq8jYLq37N6XKaE41DIexlY1rF/z4/tIl3wo13Sqm28fRyfIsKZD+NZ8mM5RoKkpW/rBcuoSZSg==}
+  '@babel/code-frame@7.26.2':
+    resolution: {integrity: sha512-RJlIHRueQgwWitWgF8OdFYGZX328Ax5BCemNGlqHfplnRT9ESi8JkFlvaVYbS+UubVY6dpv87Fs2u5M29iNFVQ==}
+    engines: {node: '>=6.9.0'}
 
-  '@emnapi/core@2.0.0-alpha.3':
-    resolution: {integrity: sha512-AZypUeJ/yByuxyS7BlSNRDOMLMlROYtjYdIAuBmJssVz1UJDSeYxLrdizhXCFYhedC5bqd/ASy8EuNXbVVXp9g==}
+  '@babel/compat-data@7.26.3':
+    resolution: {integrity: sha512-nHIxvKPniQXpmQLb0vhY3VaFb3S0YrTAwpOWJZh1wn3oJPjJk9Asva204PsBdmAE8vpzfHudT8DB0scYvy9q0g==}
+    engines: {node: '>=6.9.0'}
 
-  '@emnapi/runtime@1.10.0':
-    resolution: {integrity: sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==}
+  '@babel/core@7.26.0':
+    resolution: {integrity: sha512-i1SLeK+DzNnQ3LL/CswPCa/E5u4lh1k6IAEphON8F+cXt0t9euTshDru0q7/IqMa1PMPz5RnHuHscF8/ZJsStg==}
+    engines: {node: '>=6.9.0'}
 
-  '@emnapi/runtime@1.11.3':
-    resolution: {integrity: sha512-Xz4Tpyki7XyrpbUK1jR1AhdAdaXyhhY4lZ3neLodmhpuWfy2PAQN5B46sAiU4liOXGLkHypn/qU+jvfWSCYYLA==}
+  '@babel/generator@7.26.3':
+    resolution: {integrity: sha512-6FF/urZvD0sTeO7k6/B15pMLC4CHUv1426lzr3N01aHJTl046uCAh9LXW/fzeXXjPNCJ6iABW5XaWOsIZB93aQ==}
+    engines: {node: '>=6.9.0'}
 
-  '@emnapi/runtime@2.0.0-alpha.3':
-    resolution: {integrity: sha512-hFPAhMUjJD9BSyCANEISPOogeXC9Zo9ZQl7L6vKnaVsMkCtzznaW/naYypeyl0Gv5rYfWYsZbpixTMpjDJzQeA==}
+  '@babel/helper-compilation-targets@7.25.9':
+    resolution: {integrity: sha512-j9Db8Suy6yV/VHa4qzrj9yZfZxhLWQdVnRlXxmKLYlhWUVB1sB2G5sxuWYXk/whHD9iW76PmNzxZ4UCnTQTVEQ==}
+    engines: {node: '>=6.9.0'}
 
-  '@emnapi/wasi-threads@1.2.1':
-    resolution: {integrity: sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==}
+  '@babel/helper-module-imports@7.25.9':
+    resolution: {integrity: sha512-tnUA4RsrmflIM6W6RFTLFSXITtl0wKjgpnLgXyowocVPrbYrLUXSBXDgTs8BlbmIzIdlBySRQjINYs2BAkiLtw==}
+    engines: {node: '>=6.9.0'}
 
-  '@emnapi/wasi-threads@1.2.3':
-    resolution: {integrity: sha512-ELEBe8PsLvvJ6QMr0zLt8ffvOHW/dc1m3CEzNMg7aJUv3bMaoDtw2TXyDAwkYBuroxxuHEwhRTLJSe5sya547g==}
+  '@babel/helper-module-transforms@7.26.0':
+    resolution: {integrity: sha512-xO+xu6B5K2czEnQye6BHA7DolFFmS3LB7stHZFaOLb1pAwO1HWLS8fXA+eh0A2yIvltPVmx3eNNDBJA2SLHXFw==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0
 
-  '@emnapi/wasi-threads@2.0.1':
-    resolution: {integrity: sha512-9DsSk+o5NBX0CCJT8s0EROGSGxjR/tKu6aBTaVyq+SjAEQH4XcdcRxPBRzsBLizTTJ49MJjF+jgu3qnO9GLQcQ==}
+  '@babel/helper-plugin-utils@7.25.9':
+    resolution: {integrity: sha512-kSMlyUVdWe25rEsRGviIgOWnoT/nfABVWlqt9N19/dIPWViAOW2s9wznP5tURbs/IDuNk4gPy3YdYRgH3uxhBw==}
+    engines: {node: '>=6.9.0'}
 
-  '@esbuild/aix-ppc64@0.27.7':
-    resolution: {integrity: sha512-EKX3Qwmhz1eMdEJokhALr0YiD0lhQNwDqkPYyPhiSwKrh7/4KRjQc04sZ8db+5DVVnZ1LmbNDI1uAMPEUBnQPg==}
+  '@babel/helper-string-parser@7.25.9':
+    resolution: {integrity: sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-validator-identifier@7.25.9':
+    resolution: {integrity: sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helper-validator-option@7.25.9':
+    resolution: {integrity: sha512-e/zv1co8pp55dNdEcCynfj9X7nyUKUXoUEwfXqaZt0omVOmDe9oOTdKStH4GmAw6zxMFs50ZayuMfHDKlO7Tfw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/helpers@7.26.0':
+    resolution: {integrity: sha512-tbhNuIxNcVb21pInl3ZSjksLCvgdZy9KwJ8brv993QtIVKJBBkYXz4q4ZbAv31GdnC+R90np23L5FbEBlthAEw==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/parser@7.26.3':
+    resolution: {integrity: sha512-WJ/CvmY8Mea8iDXo6a7RK2wbmJITT5fN3BEkRuFlxVyNx8jOKIIhmC4fSkTcPcf8JyavbBwIe6OpiCOBXt/IcA==}
+    engines: {node: '>=6.0.0'}
+    hasBin: true
+
+  '@babel/plugin-transform-react-jsx-self@7.25.9':
+    resolution: {integrity: sha512-y8quW6p0WHkEhmErnfe58r7x0A70uKphQm8Sp8cV7tjNQwK56sNVK0M73LK3WuYmsuyrftut4xAkjjgU0twaMg==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-transform-react-jsx-source@7.25.9':
+    resolution: {integrity: sha512-+iqjT8xmXhhYv4/uiYd8FNQsraMFZIfxVSqxxVSZP0WbbSAWvBXAul0m/zu+7Vv4O/3WtApy9pmaTMiumEZgfg==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/template@7.25.9':
+    resolution: {integrity: sha512-9DGttpmPvIxBb/2uwpVo3dqJ+O6RooAFOS+lB+xDqoE2PVCE8nfoHMdZLpfCQRLwvohzXISPZcgxt80xLfsuwg==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/traverse@7.26.4':
+    resolution: {integrity: sha512-fH+b7Y4p3yqvApJALCPJcwb0/XaOSgtK4pzV6WVjPR5GLFQBRI7pfoX2V2iM48NXvX07NUxxm1Vw98YjqTcU5w==}
+    engines: {node: '>=6.9.0'}
+
+  '@babel/types@7.26.3':
+    resolution: {integrity: sha512-vN5p+1kl59GVKMvTHt55NzzmYVxprfJD+ql7U9NFIfKCBkYE55LYtS+WtPlaYOyzydrKI8Nezd+aZextrd+FMA==}
+    engines: {node: '>=6.9.0'}
+
+  '@csstools/color-helpers@5.0.2':
+    resolution: {integrity: sha512-JqWH1vsgdGcw2RR6VliXXdA0/59LttzlU8UlRT/iUUsEeWfYq8I+K0yhihEUTTHLRm1EXvpsCx3083EU15ecsA==}
+    engines: {node: '>=18'}
+
+  '@csstools/css-calc@2.1.2':
+    resolution: {integrity: sha512-TklMyb3uBB28b5uQdxjReG4L80NxAqgrECqLZFQbyLekwwlcDDS8r3f07DKqeo8C4926Br0gf/ZDe17Zv4wIuw==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@csstools/css-parser-algorithms': ^3.0.4
+      '@csstools/css-tokenizer': ^3.0.3
+
+  '@csstools/css-color-parser@3.0.8':
+    resolution: {integrity: sha512-pdwotQjCCnRPuNi06jFuP68cykU1f3ZWExLe/8MQ1LOs8Xq+fTkYgd+2V8mWUWMrOn9iS2HftPVaMZDaXzGbhQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@csstools/css-parser-algorithms': ^3.0.4
+      '@csstools/css-tokenizer': ^3.0.3
+
+  '@csstools/css-parser-algorithms@3.0.4':
+    resolution: {integrity: sha512-Up7rBoV77rv29d3uKHUIVubz1BTcgyUK72IvCQAbfbMv584xHcGKCKbWh7i8hPrRJ7qU4Y8IO3IY9m+iTB7P3A==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      '@csstools/css-tokenizer': ^3.0.3
+
+  '@csstools/css-tokenizer@3.0.3':
+    resolution: {integrity: sha512-UJnjoFsmxfKUdNYdWgOB0mWUypuLvAfQPH1+pyvRJs6euowbFkFC6P13w1l8mJyi3vxYMxc9kld5jZEGRQs6bw==}
+    engines: {node: '>=18'}
+
+  '@csstools/postcss-cascade-layers@5.0.1':
+    resolution: {integrity: sha512-XOfhI7GShVcKiKwmPAnWSqd2tBR0uxt+runAxttbSp/LY2U16yAVPmAf7e9q4JJ0d+xMNmpwNDLBXnmRCl3HMQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+
+  '@csstools/postcss-color-mix-function@3.0.8':
+    resolution: {integrity: sha512-yuZpgWUzqZWQhEqfvtJufhl28DgO9sBwSbXbf/59gejNuvZcoUTRGQZhzhwF4ccqb53YAGB+u92z9+eSKoB4YA==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+
+  '@csstools/postcss-oklab-function@4.0.8':
+    resolution: {integrity: sha512-+5aPsNWgxohXoYNS1f+Ys0x3Qnfehgygv3qrPyv+Y25G0yX54/WlVB+IXprqBLOXHM1gsVF+QQSjlArhygna0Q==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+
+  '@csstools/postcss-progressive-custom-properties@4.0.0':
+    resolution: {integrity: sha512-XQPtROaQjomnvLUSy/bALTR5VCtTVUFwYs1SblvYgLSeTo2a/bMNwUwo2piXw5rTv/FEYiy5yPSXBqg9OKUx7Q==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+
+  '@csstools/selector-resolve-nested@3.0.0':
+    resolution: {integrity: sha512-ZoK24Yku6VJU1gS79a5PFmC8yn3wIapiKmPgun0hZgEI5AOqgH2kiPRsPz1qkGv4HL+wuDLH83yQyk6inMYrJQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss-selector-parser: ^7.0.0
+
+  '@csstools/selector-specificity@5.0.0':
+    resolution: {integrity: sha512-PCqQV3c4CoVm3kdPhyeZ07VmBRdH2EpMFA/pd9OASpOEC3aXNGoqPDAZ80D0cLpMBxnmk0+yNhGsEx31hq7Gtw==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss-selector-parser: ^7.0.0
+
+  '@csstools/utilities@2.0.0':
+    resolution: {integrity: sha512-5VdOr0Z71u+Yp3ozOx8T11N703wIFGVRgOWbOZMKgglPJsWA54MRIoMNVMa7shUToIhx5J8vX4sOZgD2XiihiQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+
+  '@emnapi/runtime@1.3.1':
+    resolution: {integrity: sha512-kEBmG8KyqtxJZv+ygbEim+KCGtIq1fC22Ms3S4ziXmYKm8uyoLX0MHONVKwp+9opg390VaKRNt4a7A9NwmpNhw==}
+
+  '@esbuild/aix-ppc64@0.21.5':
+    resolution: {integrity: sha512-1SDgH6ZSPTlggy1yI6+Dbkiz8xzpHJEVAlF/AM1tHPLsf5STom9rwtjE4hKAF20FfXXNTFqEYXyJNWh1GiZedQ==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/aix-ppc64@0.23.1':
+    resolution: {integrity: sha512-6VhYk1diRqrhBAqpJEdjASR/+WVRtfjpqKuNw11cLiaWpAT/Uu+nokB+UJnevzy/P9C/ty6AOe0dwueMrGh/iQ==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [aix]
 
-  '@esbuild/android-arm64@0.27.7':
-    resolution: {integrity: sha512-62dPZHpIXzvChfvfLJow3q5dDtiNMkwiRzPylSCfriLvZeq0a1bWChrGx/BbUbPwOrsWKMn8idSllklzBy+dgQ==}
+  '@esbuild/aix-ppc64@0.24.0':
+    resolution: {integrity: sha512-WtKdFM7ls47zkKHFVzMz8opM7LkcsIp9amDUBIAWirg70RM71WRSjdILPsY5Uv1D42ZpUfaPILDlfactHgsRkw==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/aix-ppc64@0.25.0':
+    resolution: {integrity: sha512-O7vun9Sf8DFjH2UtqK8Ku3LkquL9SZL8OLY1T5NZkA34+wG3OQF7cl4Ql8vdNzM6fzBbYfLaiRLIOZ+2FOCgBQ==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [aix]
+
+  '@esbuild/android-arm64@0.21.5':
+    resolution: {integrity: sha512-c0uX9VAUBQ7dTDCjq+wdyGLowMdtR/GoC2U5IYk/7D1H1JYC0qseD7+11iMP2mRLN9RcCMRcjC4YMclCzGwS/A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm64@0.23.1':
+    resolution: {integrity: sha512-xw50ipykXcLstLeWH7WRdQuysJqejuAGPd30vd1i5zSyKK3WE+ijzHmLKxdiCMtH1pHz78rOg0BKSYOSB/2Khw==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [android]
 
-  '@esbuild/android-arm@0.27.7':
-    resolution: {integrity: sha512-jbPXvB4Yj2yBV7HUfE2KHe4GJX51QplCN1pGbYjvsyCZbQmies29EoJbkEc+vYuU5o45AfQn37vZlyXy4YJ8RQ==}
+  '@esbuild/android-arm64@0.24.0':
+    resolution: {integrity: sha512-Vsm497xFM7tTIPYK9bNTYJyF/lsP590Qc1WxJdlB6ljCbdZKU9SY8i7+Iin4kyhV/KV5J2rOKsBQbB77Ab7L/w==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm64@0.25.0':
+    resolution: {integrity: sha512-grvv8WncGjDSyUBjN9yHXNt+cq0snxXbDxy5pJtzMKGmmpPxeAmAhWxXI+01lU5rwZomDgD3kJwulEnhTRUd6g==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [android]
+
+  '@esbuild/android-arm@0.21.5':
+    resolution: {integrity: sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-arm@0.23.1':
+    resolution: {integrity: sha512-uz6/tEy2IFm9RYOyvKl88zdzZfwEfKZmnX9Cj1BHjeSGNuGLuMD1kR8y5bteYmwqKm1tj8m4cb/aKEorr6fHWQ==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [android]
 
-  '@esbuild/android-x64@0.27.7':
-    resolution: {integrity: sha512-x5VpMODneVDb70PYV2VQOmIUUiBtY3D3mPBG8NxVk5CogneYhkR7MmM3yR/uMdITLrC1ml/NV1rj4bMJuy9MCg==}
+  '@esbuild/android-arm@0.24.0':
+    resolution: {integrity: sha512-arAtTPo76fJ/ICkXWetLCc9EwEHKaeya4vMrReVlEIUCAUncH7M4bhMQ+M9Vf+FFOZJdTNMXNBrWwW+OXWpSew==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-arm@0.25.0':
+    resolution: {integrity: sha512-PTyWCYYiU0+1eJKmw21lWtC+d08JDZPQ5g+kFyxP0V+es6VPPSUhM6zk8iImp2jbV6GwjX4pap0JFbUQN65X1g==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [android]
+
+  '@esbuild/android-x64@0.21.5':
+    resolution: {integrity: sha512-D7aPRUUNHRBwHxzxRvp856rjUHRFW1SdQATKXH2hqA0kAZb1hKmi02OpYRacl0TxIGz/ZmXWlbZgjwWYaCakTA==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/android-x64@0.23.1':
+    resolution: {integrity: sha512-nlN9B69St9BwUoB+jkyU090bru8L0NA3yFvAd7k8dNsVH8bi9a8cUAUSEcEEgTp2z3dbEDGJGfP6VUnkQnlReg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [android]
 
-  '@esbuild/darwin-arm64@0.27.7':
-    resolution: {integrity: sha512-5lckdqeuBPlKUwvoCXIgI2D9/ABmPq3Rdp7IfL70393YgaASt7tbju3Ac+ePVi3KDH6N2RqePfHnXkaDtY9fkw==}
+  '@esbuild/android-x64@0.24.0':
+    resolution: {integrity: sha512-t8GrvnFkiIY7pa7mMgJd7p8p8qqYIz1NYiAoKc75Zyv73L3DZW++oYMSHPRarcotTKuSs6m3hTOa5CKHaS02TQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/android-x64@0.25.0':
+    resolution: {integrity: sha512-m/ix7SfKG5buCnxasr52+LI78SQ+wgdENi9CqyCXwjVR2X4Jkz+BpC3le3AoBPYTC9NHklwngVXvbJ9/Akhrfg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [android]
+
+  '@esbuild/darwin-arm64@0.21.5':
+    resolution: {integrity: sha512-DwqXqZyuk5AiWWf3UfLiRDJ5EDd49zg6O9wclZ7kUMv2WRFr4HKjXp/5t8JZ11QbQfUS6/cRCKGwYhtNAY88kQ==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-arm64@0.23.1':
+    resolution: {integrity: sha512-YsS2e3Wtgnw7Wq53XXBLcV6JhRsEq8hkfg91ESVadIrzr9wO6jJDMZnCQbHm1Guc5t/CdDiFSSfWP58FNuvT3Q==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [darwin]
 
-  '@esbuild/darwin-x64@0.27.7':
-    resolution: {integrity: sha512-rYnXrKcXuT7Z+WL5K980jVFdvVKhCHhUwid+dDYQpH+qu+TefcomiMAJpIiC2EM3Rjtq0sO3StMV/+3w3MyyqQ==}
+  '@esbuild/darwin-arm64@0.24.0':
+    resolution: {integrity: sha512-CKyDpRbK1hXwv79soeTJNHb5EiG6ct3efd/FTPdzOWdbZZfGhpbcqIpiD0+vwmpu0wTIL97ZRPZu8vUt46nBSw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-arm64@0.25.0':
+    resolution: {integrity: sha512-mVwdUb5SRkPayVadIOI78K7aAnPamoeFR2bT5nszFUZ9P8UpK4ratOdYbZZXYSqPKMHfS1wdHCJk1P1EZpRdvw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.21.5':
+    resolution: {integrity: sha512-se/JjF8NlmKVG4kNIuyWMV/22ZaerB+qaSi5MdrXtd6R08kvs2qCN4C09miupktDitvh8jRFflwGFBQcxZRjbw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.23.1':
+    resolution: {integrity: sha512-aClqdgTDVPSEGgoCS8QDG37Gu8yc9lTHNAQlsztQ6ENetKEO//b8y31MMu2ZaPbn4kVsIABzVLXYLhCGekGDqw==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [darwin]
 
-  '@esbuild/freebsd-arm64@0.27.7':
-    resolution: {integrity: sha512-B48PqeCsEgOtzME2GbNM2roU29AMTuOIN91dsMO30t+Ydis3z/3Ngoj5hhnsOSSwNzS+6JppqWsuhTp6E82l2w==}
+  '@esbuild/darwin-x64@0.24.0':
+    resolution: {integrity: sha512-rgtz6flkVkh58od4PwTRqxbKH9cOjaXCMZgWD905JOzjFKW+7EiUObfd/Kav+A6Gyud6WZk9w+xu6QLytdi2OA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/darwin-x64@0.25.0':
+    resolution: {integrity: sha512-DgDaYsPWFTS4S3nWpFcMn/33ZZwAAeAFKNHNa1QN0rI4pUjgqf0f7ONmXf6d22tqTY+H9FNdgeaAa+YIFUn2Rg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@esbuild/freebsd-arm64@0.21.5':
+    resolution: {integrity: sha512-5JcRxxRDUJLX8JXp/wcBCy3pENnCgBR9bN6JsY4OmhfUtIHe3ZW0mawA7+RDAcMLrMIZaf03NlQiX9DGyB8h4g==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-arm64@0.23.1':
+    resolution: {integrity: sha512-h1k6yS8/pN/NHlMl5+v4XPfikhJulk4G+tKGFIOwURBSFzE8bixw1ebjluLOjfwtLqY0kewfjLSrO6tN2MgIhA==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [freebsd]
 
-  '@esbuild/freebsd-x64@0.27.7':
-    resolution: {integrity: sha512-jOBDK5XEjA4m5IJK3bpAQF9/Lelu/Z9ZcdhTRLf4cajlB+8VEhFFRjWgfy3M1O4rO2GQ/b2dLwCUGpiF/eATNQ==}
+  '@esbuild/freebsd-arm64@0.24.0':
+    resolution: {integrity: sha512-6Mtdq5nHggwfDNLAHkPlyLBpE5L6hwsuXZX8XNmHno9JuL2+bg2BX5tRkwjyfn6sKbxZTq68suOjgWqCicvPXA==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-arm64@0.25.0':
+    resolution: {integrity: sha512-VN4ocxy6dxefN1MepBx/iD1dH5K8qNtNe227I0mnTRjry8tj5MRk4zprLEdG8WPyAPb93/e4pSgi1SoHdgOa4w==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.21.5':
+    resolution: {integrity: sha512-J95kNBj1zkbMXtHVH29bBriQygMXqoVQOQYA+ISs0/2l3T9/kj42ow2mpqerRBxDJnmkUDCaQT/dfNXWX/ZZCQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.23.1':
+    resolution: {integrity: sha512-lK1eJeyk1ZX8UklqFd/3A60UuZ/6UVfGT2LuGo3Wp4/z7eRTRYY+0xOu2kpClP+vMTi9wKOfXi2vjUpO1Ro76g==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [freebsd]
 
-  '@esbuild/linux-arm64@0.27.7':
-    resolution: {integrity: sha512-RZPHBoxXuNnPQO9rvjh5jdkRmVizktkT7TCDkDmQ0W2SwHInKCAV95GRuvdSvA7w4VMwfCjUiPwDi0ZO6Nfe9A==}
+  '@esbuild/freebsd-x64@0.24.0':
+    resolution: {integrity: sha512-D3H+xh3/zphoX8ck4S2RxKR6gHlHDXXzOf6f/9dbFt/NRBDIE33+cVa49Kil4WUjxMGW0ZIYBYtaGCa2+OsQwQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/freebsd-x64@0.25.0':
+    resolution: {integrity: sha512-mrSgt7lCh07FY+hDD1TxiTyIHyttn6vnjesnPoVDNmDfOmggTLXRv8Id5fNZey1gl/V2dyVK1VXXqVsQIiAk+A==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@esbuild/linux-arm64@0.21.5':
+    resolution: {integrity: sha512-ibKvmyYzKsBeX8d8I7MH/TMfWDXBF3db4qM6sy+7re0YXya+K1cem3on9XgdT2EQGMu4hQyZhan7TeQ8XkGp4Q==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm64@0.23.1':
+    resolution: {integrity: sha512-/93bf2yxencYDnItMYV/v116zff6UyTjo4EtEQjUBeGiVpMmffDNUyD9UN2zV+V3LRV3/on4xdZ26NKzn6754g==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [linux]
 
-  '@esbuild/linux-arm@0.27.7':
-    resolution: {integrity: sha512-RkT/YXYBTSULo3+af8Ib0ykH8u2MBh57o7q/DAs3lTJlyVQkgQvlrPTnjIzzRPQyavxtPtfg0EopvDyIt0j1rA==}
+  '@esbuild/linux-arm64@0.24.0':
+    resolution: {integrity: sha512-TDijPXTOeE3eaMkRYpcy3LarIg13dS9wWHRdwYRnzlwlA370rNdZqbcp0WTyyV/k2zSxfko52+C7jU5F9Tfj1g==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm64@0.25.0':
+    resolution: {integrity: sha512-9QAQjTWNDM/Vk2bgBl17yWuZxZNQIF0OUUuPZRKoDtqF2k4EtYbpyiG5/Dk7nqeK6kIJWPYldkOcBqjXjrUlmg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.21.5':
+    resolution: {integrity: sha512-bPb5AHZtbeNGjCKVZ9UGqGwo8EUu4cLq68E95A53KlxAPRmUyYv2D6F0uUI65XisGOL1hBP5mTronbgo+0bFcA==}
+    engines: {node: '>=12'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.23.1':
+    resolution: {integrity: sha512-CXXkzgn+dXAPs3WBwE+Kvnrf4WECwBdfjfeYHpMeVxWE0EceB6vhWGShs6wi0IYEqMSIzdOF1XjQ/Mkm5d7ZdQ==}
     engines: {node: '>=18'}
     cpu: [arm]
     os: [linux]
 
-  '@esbuild/linux-ia32@0.27.7':
-    resolution: {integrity: sha512-GA48aKNkyQDbd3KtkplYWT102C5sn/EZTY4XROkxONgruHPU72l+gW+FfF8tf2cFjeHaRbWpOYa/uRBz/Xq1Pg==}
+  '@esbuild/linux-arm@0.24.0':
+    resolution: {integrity: sha512-gJKIi2IjRo5G6Glxb8d3DzYXlxdEj2NlkixPsqePSZMhLudqPhtZ4BUrpIuTjJYXxvF9njql+vRjB2oaC9XpBw==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-arm@0.25.0':
+    resolution: {integrity: sha512-vkB3IYj2IDo3g9xX7HqhPYxVkNQe8qTK55fraQyTzTX/fxaDtXiEnavv9geOsonh2Fd2RMB+i5cbhu2zMNWJwg==}
+    engines: {node: '>=18'}
+    cpu: [arm]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.21.5':
+    resolution: {integrity: sha512-YvjXDqLRqPDl2dvRODYmmhz4rPeVKYvppfGYKSNGdyZkA01046pLWyRKKI3ax8fbJoK5QbxblURkwK/MWY18Tg==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.23.1':
+    resolution: {integrity: sha512-VTN4EuOHwXEkXzX5nTvVY4s7E/Krz7COC8xkftbbKRYAl96vPiUssGkeMELQMOnLOJ8k3BY1+ZY52tttZnHcXQ==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [linux]
 
-  '@esbuild/linux-loong64@0.27.7':
-    resolution: {integrity: sha512-a4POruNM2oWsD4WKvBSEKGIiWQF8fZOAsycHOt6JBpZ+JN2n2JH9WAv56SOyu9X5IqAjqSIPTaJkqN8F7XOQ5Q==}
+  '@esbuild/linux-ia32@0.24.0':
+    resolution: {integrity: sha512-K40ip1LAcA0byL05TbCQ4yJ4swvnbzHscRmUilrmP9Am7//0UjPreh4lpYzvThT2Quw66MhjG//20mrufm40mA==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-ia32@0.25.0':
+    resolution: {integrity: sha512-43ET5bHbphBegyeqLb7I1eYn2P/JYGNmzzdidq/w0T8E2SsYL1U6un2NFROFRg1JZLTzdCoRomg8Rvf9M6W6Gg==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.21.5':
+    resolution: {integrity: sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==}
+    engines: {node: '>=12'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.23.1':
+    resolution: {integrity: sha512-Vx09LzEoBa5zDnieH8LSMRToj7ir/Jeq0Gu6qJ/1GcBq9GkfoEAoXvLiW1U9J1qE/Y/Oyaq33w5p2ZWrNNHNEw==}
     engines: {node: '>=18'}
     cpu: [loong64]
     os: [linux]
 
-  '@esbuild/linux-mips64el@0.27.7':
-    resolution: {integrity: sha512-KabT5I6StirGfIz0FMgl1I+R1H73Gp0ofL9A3nG3i/cYFJzKHhouBV5VWK1CSgKvVaG4q1RNpCTR2LuTVB3fIw==}
+  '@esbuild/linux-loong64@0.24.0':
+    resolution: {integrity: sha512-0mswrYP/9ai+CU0BzBfPMZ8RVm3RGAN/lmOMgW4aFUSOQBjA31UP8Mr6DDhWSuMwj7jaWOT0p0WoZ6jeHhrD7g==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-loong64@0.25.0':
+    resolution: {integrity: sha512-fC95c/xyNFueMhClxJmeRIj2yrSMdDfmqJnyOY4ZqsALkDrrKJfIg5NTMSzVBr5YW1jf+l7/cndBfP3MSDpoHw==}
+    engines: {node: '>=18'}
+    cpu: [loong64]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.21.5':
+    resolution: {integrity: sha512-IajOmO+KJK23bj52dFSNCMsz1QP1DqM6cwLUv3W1QwyxkyIWecfafnI555fvSGqEKwjMXVLokcV5ygHW5b3Jbg==}
+    engines: {node: '>=12'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.23.1':
+    resolution: {integrity: sha512-nrFzzMQ7W4WRLNUOU5dlWAqa6yVeI0P78WKGUo7lg2HShq/yx+UYkeNSE0SSfSure0SqgnsxPvmAUu/vu0E+3Q==}
     engines: {node: '>=18'}
     cpu: [mips64el]
     os: [linux]
 
-  '@esbuild/linux-ppc64@0.27.7':
-    resolution: {integrity: sha512-gRsL4x6wsGHGRqhtI+ifpN/vpOFTQtnbsupUF5R5YTAg+y/lKelYR1hXbnBdzDjGbMYjVJLJTd2OFmMewAgwlQ==}
+  '@esbuild/linux-mips64el@0.24.0':
+    resolution: {integrity: sha512-hIKvXm0/3w/5+RDtCJeXqMZGkI2s4oMUGj3/jM0QzhgIASWrGO5/RlzAzm5nNh/awHE0A19h/CvHQe6FaBNrRA==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-mips64el@0.25.0':
+    resolution: {integrity: sha512-nkAMFju7KDW73T1DdH7glcyIptm95a7Le8irTQNO/qtkoyypZAnjchQgooFUDQhNAy4iu08N79W4T4pMBwhPwQ==}
+    engines: {node: '>=18'}
+    cpu: [mips64el]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.21.5':
+    resolution: {integrity: sha512-1hHV/Z4OEfMwpLO8rp7CvlhBDnjsC3CttJXIhBi+5Aj5r+MBvy4egg7wCbe//hSsT+RvDAG7s81tAvpL2XAE4w==}
+    engines: {node: '>=12'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.23.1':
+    resolution: {integrity: sha512-dKN8fgVqd0vUIjxuJI6P/9SSSe/mB9rvA98CSH2sJnlZ/OCZWO1DJvxj8jvKTfYUdGfcq2dDxoKaC6bHuTlgcw==}
     engines: {node: '>=18'}
     cpu: [ppc64]
     os: [linux]
 
-  '@esbuild/linux-riscv64@0.27.7':
-    resolution: {integrity: sha512-hL25LbxO1QOngGzu2U5xeXtxXcW+/GvMN3ejANqXkxZ/opySAZMrc+9LY/WyjAan41unrR3YrmtTsUpwT66InQ==}
+  '@esbuild/linux-ppc64@0.24.0':
+    resolution: {integrity: sha512-HcZh5BNq0aC52UoocJxaKORfFODWXZxtBaaZNuN3PUX3MoDsChsZqopzi5UupRhPHSEHotoiptqikjN/B77mYQ==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-ppc64@0.25.0':
+    resolution: {integrity: sha512-NhyOejdhRGS8Iwv+KKR2zTq2PpysF9XqY+Zk77vQHqNbo/PwZCzB5/h7VGuREZm1fixhs4Q/qWRSi5zmAiO4Fw==}
+    engines: {node: '>=18'}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.21.5':
+    resolution: {integrity: sha512-2HdXDMd9GMgTGrPWnJzP2ALSokE/0O5HhTUvWIbD3YdjME8JwvSCnNGBnTThKGEB91OZhzrJ4qIIxk/SBmyDDA==}
+    engines: {node: '>=12'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.23.1':
+    resolution: {integrity: sha512-5AV4Pzp80fhHL83JM6LoA6pTQVWgB1HovMBsLQ9OZWLDqVY8MVobBXNSmAJi//Csh6tcY7e7Lny2Hg1tElMjIA==}
     engines: {node: '>=18'}
     cpu: [riscv64]
     os: [linux]
 
-  '@esbuild/linux-s390x@0.27.7':
-    resolution: {integrity: sha512-2k8go8Ycu1Kb46vEelhu1vqEP+UeRVj2zY1pSuPdgvbd5ykAw82Lrro28vXUrRmzEsUV0NzCf54yARIK8r0fdw==}
+  '@esbuild/linux-riscv64@0.24.0':
+    resolution: {integrity: sha512-bEh7dMn/h3QxeR2KTy1DUszQjUrIHPZKyO6aN1X4BCnhfYhuQqedHaa5MxSQA/06j3GpiIlFGSsy1c7Gf9padw==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-riscv64@0.25.0':
+    resolution: {integrity: sha512-5S/rbP5OY+GHLC5qXp1y/Mx//e92L1YDqkiBbO9TQOvuFXM+iDqUNG5XopAnXoRH3FjIUDkeGcY1cgNvnXp/kA==}
+    engines: {node: '>=18'}
+    cpu: [riscv64]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.21.5':
+    resolution: {integrity: sha512-zus5sxzqBJD3eXxwvjN1yQkRepANgxE9lgOW2qLnmr8ikMTphkjgXu1HR01K4FJg8h1kEEDAqDcZQtbrRnB41A==}
+    engines: {node: '>=12'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.23.1':
+    resolution: {integrity: sha512-9ygs73tuFCe6f6m/Tb+9LtYxWR4c9yg7zjt2cYkjDbDpV/xVn+68cQxMXCjUpYwEkze2RcU/rMnfIXNRFmSoDw==}
     engines: {node: '>=18'}
     cpu: [s390x]
     os: [linux]
 
-  '@esbuild/linux-x64@0.27.7':
-    resolution: {integrity: sha512-hzznmADPt+OmsYzw1EE33ccA+HPdIqiCRq7cQeL1Jlq2gb1+OyWBkMCrYGBJ+sxVzve2ZJEVeePbLM2iEIZSxA==}
+  '@esbuild/linux-s390x@0.24.0':
+    resolution: {integrity: sha512-ZcQ6+qRkw1UcZGPyrCiHHkmBaj9SiCD8Oqd556HldP+QlpUIe2Wgn3ehQGVoPOvZvtHm8HPx+bH20c9pvbkX3g==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-s390x@0.25.0':
+    resolution: {integrity: sha512-XM2BFsEBz0Fw37V0zU4CXfcfuACMrppsMFKdYY2WuTS3yi8O1nFOhil/xhKTmE1nPmVyvQJjJivgDT+xh8pXJA==}
+    engines: {node: '>=18'}
+    cpu: [s390x]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.21.5':
+    resolution: {integrity: sha512-1rYdTpyv03iycF1+BhzrzQJCdOuAOtaqHTWJZCWvijKD2N5Xu0TtVC8/+1faWqcP9iBCWOmjmhoH94dH82BxPQ==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.23.1':
+    resolution: {integrity: sha512-EV6+ovTsEXCPAp58g2dD68LxoP/wK5pRvgy0J/HxPGB009omFPv3Yet0HiaqvrIrgPTBuC6wCH1LTOY91EO5hQ==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [linux]
 
-  '@esbuild/netbsd-arm64@0.27.7':
-    resolution: {integrity: sha512-b6pqtrQdigZBwZxAn1UpazEisvwaIDvdbMbmrly7cDTMFnw/+3lVxxCTGOrkPVnsYIosJJXAsILG9XcQS+Yu6w==}
+  '@esbuild/linux-x64@0.24.0':
+    resolution: {integrity: sha512-vbutsFqQ+foy3wSSbmjBXXIJ6PL3scghJoM8zCL142cGaZKAdCZHyf+Bpu/MmX9zT9Q0zFBVKb36Ma5Fzfa8xA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/linux-x64@0.25.0':
+    resolution: {integrity: sha512-9yl91rHw/cpwMCNytUDxwj2XjFpxML0y9HAOH9pNVQDpQrBxHy01Dx+vaMu0N1CKa/RzBD2hB4u//nfc+Sd3Cw==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [linux]
+
+  '@esbuild/netbsd-arm64@0.25.0':
+    resolution: {integrity: sha512-RuG4PSMPFfrkH6UwCAqBzauBWTygTvb1nxWasEJooGSJ/NwRw7b2HOwyRTQIU97Hq37l3npXoZGYMy3b3xYvPw==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [netbsd]
 
-  '@esbuild/netbsd-x64@0.27.7':
-    resolution: {integrity: sha512-OfatkLojr6U+WN5EDYuoQhtM+1xco+/6FSzJJnuWiUw5eVcicbyK3dq5EeV/QHT1uy6GoDhGbFpprUiHUYggrw==}
+  '@esbuild/netbsd-x64@0.21.5':
+    resolution: {integrity: sha512-Woi2MXzXjMULccIwMnLciyZH4nCIMpWQAs049KEeMvOcNADVxo0UBIQPfSmxB3CWKedngg7sWZdLvLczpe0tLg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.23.1':
+    resolution: {integrity: sha512-aevEkCNu7KlPRpYLjwmdcuNz6bDFiE7Z8XC4CPqExjTvrHugh28QzUXVOZtiYghciKUacNktqxdpymplil1beA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [netbsd]
 
-  '@esbuild/openbsd-arm64@0.27.7':
-    resolution: {integrity: sha512-AFuojMQTxAz75Fo8idVcqoQWEHIXFRbOc1TrVcFSgCZtQfSdc1RXgB3tjOn/krRHENUB4j00bfGjyl2mJrU37A==}
+  '@esbuild/netbsd-x64@0.24.0':
+    resolution: {integrity: sha512-hjQ0R/ulkO8fCYFsG0FZoH+pWgTTDreqpqY7UnQntnaKv95uP5iW3+dChxnx7C3trQQU40S+OgWhUVwCjVFLvg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/netbsd-x64@0.25.0':
+    resolution: {integrity: sha512-jl+qisSB5jk01N5f7sPCsBENCOlPiS/xptD5yxOx2oqQfyourJwIKLRA2yqWdifj3owQZCL2sn6o08dBzZGQzA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [netbsd]
+
+  '@esbuild/openbsd-arm64@0.23.1':
+    resolution: {integrity: sha512-3x37szhLexNA4bXhLrCC/LImN/YtWis6WXr1VESlfVtVeoFJBRINPJ3f0a/6LV8zpikqoUg4hyXw0sFBt5Cr+Q==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [openbsd]
 
-  '@esbuild/openbsd-x64@0.27.7':
-    resolution: {integrity: sha512-+A1NJmfM8WNDv5CLVQYJ5PshuRm/4cI6WMZRg1by1GwPIQPCTs1GLEUHwiiQGT5zDdyLiRM/l1G0Pv54gvtKIg==}
+  '@esbuild/openbsd-arm64@0.24.0':
+    resolution: {integrity: sha512-MD9uzzkPQbYehwcN583yx3Tu5M8EIoTD+tUgKF982WYL9Pf5rKy9ltgD0eUgs8pvKnmizxjXZyLt0z6DC3rRXg==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-arm64@0.25.0':
+    resolution: {integrity: sha512-21sUNbq2r84YE+SJDfaQRvdgznTD8Xc0oc3p3iW/a1EVWeNj/SdUCbm5U0itZPQYRuRTW20fPMWMpcrciH2EJw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.21.5':
+    resolution: {integrity: sha512-HLNNw99xsvx12lFBUwoT8EVCsSvRNDVxNpjZ7bPn947b8gJPzeHWyNVhFsaerc0n3TsbOINvRP2byTZ5LKezow==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/openbsd-x64@0.23.1':
+    resolution: {integrity: sha512-aY2gMmKmPhxfU+0EdnN+XNtGbjfQgwZj43k8G3fyrDM/UdZww6xrWxmDkuz2eCZchqVeABjV5BpildOrUbBTqA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [openbsd]
 
-  '@esbuild/openharmony-arm64@0.27.7':
-    resolution: {integrity: sha512-+KrvYb/C8zA9CU/g0sR6w2RBw7IGc5J2BPnc3dYc5VJxHCSF1yNMxTV5LQ7GuKteQXZtspjFbiuW5/dOj7H4Yw==}
+  '@esbuild/openbsd-x64@0.24.0':
+    resolution: {integrity: sha512-4ir0aY1NGUhIC1hdoCzr1+5b43mw99uNwVzhIq1OY3QcEwPDO3B7WNXBzaKY5Nsf1+N11i1eOfFcq+D/gOS15Q==}
     engines: {node: '>=18'}
-    cpu: [arm64]
-    os: [openharmony]
+    cpu: [x64]
+    os: [openbsd]
 
-  '@esbuild/sunos-x64@0.27.7':
-    resolution: {integrity: sha512-ikktIhFBzQNt/QDyOL580ti9+5mL/YZeUPKU2ivGtGjdTYoqz6jObj6nOMfhASpS4GU4Q/Clh1QtxWAvcYKamA==}
+  '@esbuild/openbsd-x64@0.25.0':
+    resolution: {integrity: sha512-2gwwriSMPcCFRlPlKx3zLQhfN/2WjJ2NSlg5TKLQOJdV0mSxIcYNTMhk3H3ulL/cak+Xj0lY1Ym9ysDV1igceg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [openbsd]
+
+  '@esbuild/sunos-x64@0.21.5':
+    resolution: {integrity: sha512-6+gjmFpfy0BHU5Tpptkuh8+uw3mnrvgs+dSPQXQOv3ekbordwnzTVEb4qnIvQcYXq6gzkyTnoZ9dZG+D4garKg==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/sunos-x64@0.23.1':
+    resolution: {integrity: sha512-RBRT2gqEl0IKQABT4XTj78tpk9v7ehp+mazn2HbUeZl1YMdaGAQqhapjGTCe7uw7y0frDi4gS0uHzhvpFuI1sA==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [sunos]
 
-  '@esbuild/win32-arm64@0.27.7':
-    resolution: {integrity: sha512-7yRhbHvPqSpRUV7Q20VuDwbjW5kIMwTHpptuUzV+AA46kiPze5Z7qgt6CLCK3pWFrHeNfDd1VKgyP4O+ng17CA==}
+  '@esbuild/sunos-x64@0.24.0':
+    resolution: {integrity: sha512-jVzdzsbM5xrotH+W5f1s+JtUy1UWgjU0Cf4wMvffTB8m6wP5/kx0KiaLHlbJO+dMgtxKV8RQ/JvtlFcdZ1zCPA==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/sunos-x64@0.25.0':
+    resolution: {integrity: sha512-bxI7ThgLzPrPz484/S9jLlvUAHYMzy6I0XiU1ZMeAEOBcS0VePBFxh1JjTQt3Xiat5b6Oh4x7UC7IwKQKIJRIg==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [sunos]
+
+  '@esbuild/win32-arm64@0.21.5':
+    resolution: {integrity: sha512-Z0gOTd75VvXqyq7nsl93zwahcTROgqvuAcYDUr+vOv8uHhNSKROyU961kgtCD1e95IqPKSQKH7tBTslnS3tA8A==}
+    engines: {node: '>=12'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-arm64@0.23.1':
+    resolution: {integrity: sha512-4O+gPR5rEBe2FpKOVyiJ7wNDPA8nGzDuJ6gN4okSA1gEOYZ67N8JPk58tkWtdtPeLz7lBnY6I5L3jdsr3S+A6A==}
     engines: {node: '>=18'}
     cpu: [arm64]
     os: [win32]
 
-  '@esbuild/win32-ia32@0.27.7':
-    resolution: {integrity: sha512-SmwKXe6VHIyZYbBLJrhOoCJRB/Z1tckzmgTLfFYOfpMAx63BJEaL9ExI8x7v0oAO3Zh6D/Oi1gVxEYr5oUCFhw==}
+  '@esbuild/win32-arm64@0.24.0':
+    resolution: {integrity: sha512-iKc8GAslzRpBytO2/aN3d2yb2z8XTVfNV0PjGlCxKo5SgWmNXx82I/Q3aG1tFfS+A2igVCY97TJ8tnYwpUWLCA==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-arm64@0.25.0':
+    resolution: {integrity: sha512-ZUAc2YK6JW89xTbXvftxdnYy3m4iHIkDtK3CLce8wg8M2L+YZhIvO1DKpxrd0Yr59AeNNkTiic9YLf6FTtXWMw==}
+    engines: {node: '>=18'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.21.5':
+    resolution: {integrity: sha512-SWXFF1CL2RVNMaVs+BBClwtfZSvDgtL//G/smwAc5oVK/UPu2Gu9tIaRgFmYFFKrmg3SyAjSrElf0TiJ1v8fYA==}
+    engines: {node: '>=12'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.23.1':
+    resolution: {integrity: sha512-BcaL0Vn6QwCwre3Y717nVHZbAa4UBEigzFm6VdsVdT/MbZ38xoj1X9HPkZhbmaBGUD1W8vxAfffbDe8bA6AKnQ==}
     engines: {node: '>=18'}
     cpu: [ia32]
     os: [win32]
 
-  '@esbuild/win32-x64@0.27.7':
-    resolution: {integrity: sha512-56hiAJPhwQ1R4i+21FVF7V8kSD5zZTdHcVuRFMW0hn753vVfQN8xlx4uOPT4xoGH0Z/oVATuR82AiqSTDIpaHg==}
+  '@esbuild/win32-ia32@0.24.0':
+    resolution: {integrity: sha512-vQW36KZolfIudCcTnaTpmLQ24Ha1RjygBo39/aLkM2kmjkWmZGEJ5Gn9l5/7tzXA42QGIoWbICfg6KLLkIw6yw==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-ia32@0.25.0':
+    resolution: {integrity: sha512-eSNxISBu8XweVEWG31/JzjkIGbGIJN/TrRoiSVZwZ6pkC6VX4Im/WV2cz559/TXLcYbcrDN8JtKgd9DJVIo8GA==}
+    engines: {node: '>=18'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.21.5':
+    resolution: {integrity: sha512-tQd/1efJuzPC6rCFwEvLtci/xNFcTZknmXs98FYDfGE4wP9ClFV98nyKrzJKVPMhdDnjzLhdUyMX4PsQAPjwIw==}
+    engines: {node: '>=12'}
+    cpu: [x64]
+    os: [win32]
+
+  '@esbuild/win32-x64@0.23.1':
+    resolution: {integrity: sha512-BHpFFeslkWrXWyUPnbKm+xYYVYruCinGcftSBaa8zoF9hZO4BcSCFUvHVTtzpIY6YzUnYtuEhZ+C9iEXjxnasg==}
     engines: {node: '>=18'}
     cpu: [x64]
     os: [win32]
 
-  '@img/colour@1.1.0':
-    resolution: {integrity: sha512-Td76q7j57o/tLVdgS746cYARfSyxk8iEfRxewL9h4OMzYhbW4TAcppl0mT4eyqXddh6L/jwoM75mo7ixa/pCeQ==}
+  '@esbuild/win32-x64@0.24.0':
+    resolution: {integrity: sha512-7IAFPrjSQIJrGsK6flwg7NFmwBoSTyF3rl7If0hNUFQU4ilTsEPL6GuMuU9BfIWVVGuRnuIidkSMC+c0Otu8IA==}
     engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
 
-  '@img/sharp-darwin-arm64@0.34.5':
-    resolution: {integrity: sha512-imtQ3WMJXbMY4fxb/Ndp6HBTNVtWCUI0WdobyheGf5+ad6xX8VIDO8u2xE4qc/fr08CKG/7dDseFtn6M6g/r3w==}
+  '@esbuild/win32-x64@0.25.0':
+    resolution: {integrity: sha512-ZENoHJBxA20C2zFzh6AI4fT6RraMzjYw4xKWemRTRmRVtN9c5DcH9r/f2ihEkMjOW5eGgrwCslG/+Y/3bL+DHQ==}
+    engines: {node: '>=18'}
+    cpu: [x64]
+    os: [win32]
+
+  '@eslint-community/eslint-utils@4.4.0':
+    resolution: {integrity: sha512-1/sA4dwrzBAyeUoQ6oxahHKmrZvsnLCg4RfxW3ZFGGmQkSNQPFNLV9CUEFQP1x9EYXHTo5p6xdhZM1Ne9p/AfA==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+    peerDependencies:
+      eslint: ^6.0.0 || ^7.0.0 || >=8.0.0
+
+  '@eslint-community/regexpp@4.12.1':
+    resolution: {integrity: sha512-CCZCDJuduB9OUkFkY2IgppNZMi2lBQgD2qzwXkEia16cge2pijY/aXi96CJMquDMn3nJdlPV1A5KrJEXwfLNzQ==}
+    engines: {node: ^12.0.0 || ^14.0.0 || >=16.0.0}
+
+  '@eslint/config-array@0.19.2':
+    resolution: {integrity: sha512-GNKqxfHG2ySmJOBSHg7LxeUx4xpuCoFjacmlCoYWEbaPXLwvfIjixRI12xCQZeULksQb23uiA8F40w5TojpV7w==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@eslint/config-helpers@0.1.0':
+    resolution: {integrity: sha512-kLrdPDJE1ckPo94kmPPf9Hfd0DU0Jw6oKYrhe+pwSC0iTUInmTa+w6fw8sGgcfkFJGNdWOUeOaDM4quW4a7OkA==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@eslint/core@0.12.0':
+    resolution: {integrity: sha512-cmrR6pytBuSMTaBweKoGMwu3EiHiEC+DoyupPmlZ0HxBJBtIxwe+j/E4XPIKNx+Q74c8lXKPwYawBf5glsTkHg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@eslint/eslintrc@3.3.0':
+    resolution: {integrity: sha512-yaVPAiNAalnCZedKLdR21GOGILMLKPyqSLWaAjQFvYA2i/ciDi8ArYVr69Anohb6cH2Ukhqti4aFnYyPm8wdwQ==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@eslint/js@9.22.0':
+    resolution: {integrity: sha512-vLFajx9o8d1/oL2ZkpMYbkLv8nDB6yaIwFNt7nI4+I80U/z03SxmfOMsLbvWr3p7C+Wnoh//aOu2pQW8cS0HCQ==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@eslint/object-schema@2.1.6':
+    resolution: {integrity: sha512-RBMg5FRL0I0gs51M/guSAj5/e14VQ4tpZnQNWwuDT66P14I43ItmPfIZRhO9fUVIPOAQXU47atlywZ/czoqFPA==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@eslint/plugin-kit@0.2.7':
+    resolution: {integrity: sha512-JubJ5B2pJ4k4yGxaNLdbjrnk9d/iDz6/q8wOilpIowd6PJPgaxCuHBnBszq7Ce2TyMrywm5r4PnKm6V3iiZF+g==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  '@humanfs/core@0.19.1':
+    resolution: {integrity: sha512-5DyQ4+1JEUzejeK1JGICcideyfUbGixgS9jNgex5nqkW+cY7WZhxBigmieN5Qnw9ZosSNVC9KQKyb+GUaGyKUA==}
+    engines: {node: '>=18.18.0'}
+
+  '@humanfs/node@0.16.6':
+    resolution: {integrity: sha512-YuI2ZHQL78Q5HbhDiBA1X4LmYdXCKCMQIfw0pw7piHJwyREFebJUvrQN4cMssyES6x+vfUbx1CIpaQUKYdQZOw==}
+    engines: {node: '>=18.18.0'}
+
+  '@humanwhocodes/module-importer@1.0.1':
+    resolution: {integrity: sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==}
+    engines: {node: '>=12.22'}
+
+  '@humanwhocodes/retry@0.3.1':
+    resolution: {integrity: sha512-JBxkERygn7Bv/GbN5Rv8Ul6LVknS+5Bp6RgDC/O8gEBU/yeH5Ui5C/OlWrTb6qct7LjjfT6Re2NxB0ln0yYybA==}
+    engines: {node: '>=18.18'}
+
+  '@humanwhocodes/retry@0.4.2':
+    resolution: {integrity: sha512-xeO57FpIu4p1Ri3Jq/EXq4ClRm86dVF2z/+kvFnyqVYRavTZmaFaUBbWCOuuTh0o/g7DSsk6kc2vrS4Vl5oPOQ==}
+    engines: {node: '>=18.18'}
+
+  '@img/sharp-darwin-arm64@0.33.5':
+    resolution: {integrity: sha512-UT4p+iz/2H4twwAoLCqfA9UH5pI6DggwKEGuaPy7nCVQ8ZsiY5PIcrRvD1DzuY3qYL07NtIQcWnBSY/heikIFQ==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [arm64]
     os: [darwin]
 
-  '@img/sharp-darwin-x64@0.34.5':
-    resolution: {integrity: sha512-YNEFAF/4KQ/PeW0N+r+aVVsoIY0/qxxikF2SWdp+NRkmMB7y9LBZAVqQ4yhGCm/H3H270OSykqmQMKLBhBJDEw==}
+  '@img/sharp-darwin-x64@0.33.5':
+    resolution: {integrity: sha512-fyHac4jIc1ANYGRDxtiqelIbdWkIuQaI84Mv45KvGRRxSAa7o7d1ZKAOBaYbnepLC1WqxfpimdeWfvqqSGwR2Q==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [x64]
     os: [darwin]
 
-  '@img/sharp-libvips-darwin-arm64@1.2.4':
-    resolution: {integrity: sha512-zqjjo7RatFfFoP0MkQ51jfuFZBnVE2pRiaydKJ1G/rHZvnsrHAOcQALIi9sA5co5xenQdTugCvtb1cuf78Vf4g==}
+  '@img/sharp-libvips-darwin-arm64@1.0.4':
+    resolution: {integrity: sha512-XblONe153h0O2zuFfTAbQYAX2JhYmDHeWikp1LM9Hul9gVPjFY427k6dFEcOL72O01QxQsWi761svJ/ev9xEDg==}
     cpu: [arm64]
     os: [darwin]
 
-  '@img/sharp-libvips-darwin-x64@1.2.4':
-    resolution: {integrity: sha512-1IOd5xfVhlGwX+zXv2N93k0yMONvUlANylbJw1eTah8K/Jtpi15KC+WSiaX/nBmbm2HxRM1gZ0nSdjSsrZbGKg==}
+  '@img/sharp-libvips-darwin-x64@1.0.4':
+    resolution: {integrity: sha512-xnGR8YuZYfJGmWPvmlunFaWJsb9T/AO2ykoP3Fz/0X5XV2aoYBPkX6xqCQvUTKKiLddarLaxpzNe+b1hjeWHAQ==}
     cpu: [x64]
     os: [darwin]
 
-  '@img/sharp-libvips-linux-arm64@1.2.4':
-    resolution: {integrity: sha512-excjX8DfsIcJ10x1Kzr4RcWe1edC9PquDRRPx3YVCvQv+U5p7Yin2s32ftzikXojb1PIFc/9Mt28/y+iRklkrw==}
+  '@img/sharp-libvips-linux-arm64@1.0.4':
+    resolution: {integrity: sha512-9B+taZ8DlyyqzZQnoeIvDVR/2F4EbMepXMc/NdVbkzsJbzkUjhXv/70GQJ7tdLA4YJgNP25zukcxpX2/SueNrA==}
     cpu: [arm64]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-libvips-linux-arm@1.2.4':
-    resolution: {integrity: sha512-bFI7xcKFELdiNCVov8e44Ia4u2byA+l3XtsAj+Q8tfCwO6BQ8iDojYdvoPMqsKDkuoOo+X6HZA0s0q11ANMQ8A==}
+  '@img/sharp-libvips-linux-arm@1.0.5':
+    resolution: {integrity: sha512-gvcC4ACAOPRNATg/ov8/MnbxFDJqf/pDePbBnuBDcjsI8PssmjoKMAz4LtLaVi+OnSb5FK/yIOamqDwGmXW32g==}
     cpu: [arm]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-libvips-linux-ppc64@1.2.4':
-    resolution: {integrity: sha512-FMuvGijLDYG6lW+b/UvyilUWu5Ayu+3r2d1S8notiGCIyYU/76eig1UfMmkZ7vwgOrzKzlQbFSuQfgm7GYUPpA==}
-    cpu: [ppc64]
-    os: [linux]
-    libc: [glibc]
-
-  '@img/sharp-libvips-linux-riscv64@1.2.4':
-    resolution: {integrity: sha512-oVDbcR4zUC0ce82teubSm+x6ETixtKZBh/qbREIOcI3cULzDyb18Sr/Wcyx7NRQeQzOiHTNbZFF1UwPS2scyGA==}
-    cpu: [riscv64]
-    os: [linux]
-    libc: [glibc]
-
-  '@img/sharp-libvips-linux-s390x@1.2.4':
-    resolution: {integrity: sha512-qmp9VrzgPgMoGZyPvrQHqk02uyjA0/QrTO26Tqk6l4ZV0MPWIW6LTkqOIov+J1yEu7MbFQaDpwdwJKhbJvuRxQ==}
+  '@img/sharp-libvips-linux-s390x@1.0.4':
+    resolution: {integrity: sha512-u7Wz6ntiSSgGSGcjZ55im6uvTrOxSIS8/dgoVMoiGE9I6JAfU50yH5BoDlYA1tcuGS7g/QNtetJnxA6QEsCVTA==}
     cpu: [s390x]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-libvips-linux-x64@1.2.4':
-    resolution: {integrity: sha512-tJxiiLsmHc9Ax1bz3oaOYBURTXGIRDODBqhveVHonrHJ9/+k89qbLl0bcJns+e4t4rvaNBxaEZsFtSfAdquPrw==}
+  '@img/sharp-libvips-linux-x64@1.0.4':
+    resolution: {integrity: sha512-MmWmQ3iPFZr0Iev+BAgVMb3ZyC4KeFc3jFxnNbEPas60e1cIfevbtuyf9nDGIzOaW9PdnDciJm+wFFaTlj5xYw==}
     cpu: [x64]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-libvips-linuxmusl-arm64@1.2.4':
-    resolution: {integrity: sha512-FVQHuwx1IIuNow9QAbYUzJ+En8KcVm9Lk5+uGUQJHaZmMECZmOlix9HnH7n1TRkXMS0pGxIJokIVB9SuqZGGXw==}
+  '@img/sharp-libvips-linuxmusl-arm64@1.0.4':
+    resolution: {integrity: sha512-9Ti+BbTYDcsbp4wfYib8Ctm1ilkugkA/uscUn6UXK1ldpC1JjiXbLfFZtRlBhjPZ5o1NCLiDbg8fhUPKStHoTA==}
     cpu: [arm64]
     os: [linux]
-    libc: [musl]
 
-  '@img/sharp-libvips-linuxmusl-x64@1.2.4':
-    resolution: {integrity: sha512-+LpyBk7L44ZIXwz/VYfglaX/okxezESc6UxDSoyo2Ks6Jxc4Y7sGjpgU9s4PMgqgjj1gZCylTieNamqA1MF7Dg==}
+  '@img/sharp-libvips-linuxmusl-x64@1.0.4':
+    resolution: {integrity: sha512-viYN1KX9m+/hGkJtvYYp+CCLgnJXwiQB39damAO7WMdKWlIhmYTfHjwSbQeUK/20vY154mwezd9HflVFM1wVSw==}
     cpu: [x64]
     os: [linux]
-    libc: [musl]
 
-  '@img/sharp-linux-arm64@0.34.5':
-    resolution: {integrity: sha512-bKQzaJRY/bkPOXyKx5EVup7qkaojECG6NLYswgktOZjaXecSAeCWiZwwiFf3/Y+O1HrauiE3FVsGxFg8c24rZg==}
+  '@img/sharp-linux-arm64@0.33.5':
+    resolution: {integrity: sha512-JMVv+AMRyGOHtO1RFBiJy/MBsgz0x4AWrT6QoEVVTyh1E39TrCUpTRI7mx9VksGX4awWASxqCYLCV4wBZHAYxA==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [arm64]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-linux-arm@0.34.5':
-    resolution: {integrity: sha512-9dLqsvwtg1uuXBGZKsxem9595+ujv0sJ6Vi8wcTANSFpwV/GONat5eCkzQo/1O6zRIkh0m/8+5BjrRr7jDUSZw==}
+  '@img/sharp-linux-arm@0.33.5':
+    resolution: {integrity: sha512-JTS1eldqZbJxjvKaAkxhZmBqPRGmxgu+qFKSInv8moZ2AmT5Yib3EQ1c6gp493HvrvV8QgdOXdyaIBrhvFhBMQ==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [arm]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-linux-ppc64@0.34.5':
-    resolution: {integrity: sha512-7zznwNaqW6YtsfrGGDA6BRkISKAAE1Jo0QdpNYXNMHu2+0dTrPflTLNkpc8l7MUP5M16ZJcUvysVWWrMefZquA==}
-    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
-    cpu: [ppc64]
-    os: [linux]
-    libc: [glibc]
-
-  '@img/sharp-linux-riscv64@0.34.5':
-    resolution: {integrity: sha512-51gJuLPTKa7piYPaVs8GmByo7/U7/7TZOq+cnXJIHZKavIRHAP77e3N2HEl3dgiqdD/w0yUfiJnII77PuDDFdw==}
-    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
-    cpu: [riscv64]
-    os: [linux]
-    libc: [glibc]
-
-  '@img/sharp-linux-s390x@0.34.5':
-    resolution: {integrity: sha512-nQtCk0PdKfho3eC5MrbQoigJ2gd1CgddUMkabUj+rBevs8tZ2cULOx46E7oyX+04WGfABgIwmMC0VqieTiR4jg==}
+  '@img/sharp-linux-s390x@0.33.5':
+    resolution: {integrity: sha512-y/5PCd+mP4CA/sPDKl2961b+C9d+vPAveS33s6Z3zfASk2j5upL6fXVPZi7ztePZ5CuH+1kW8JtvxgbuXHRa4Q==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [s390x]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-linux-x64@0.34.5':
-    resolution: {integrity: sha512-MEzd8HPKxVxVenwAa+JRPwEC7QFjoPWuS5NZnBt6B3pu7EG2Ge0id1oLHZpPJdn3OQK+BQDiw9zStiHBTJQQQQ==}
+  '@img/sharp-linux-x64@0.33.5':
+    resolution: {integrity: sha512-opC+Ok5pRNAzuvq1AG0ar+1owsu842/Ab+4qvU879ippJBHvyY5n2mxF1izXqkPYlGuP/M556uh53jRLJmzTWA==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [x64]
     os: [linux]
-    libc: [glibc]
 
-  '@img/sharp-linuxmusl-arm64@0.34.5':
-    resolution: {integrity: sha512-fprJR6GtRsMt6Kyfq44IsChVZeGN97gTD331weR1ex1c1rypDEABN6Tm2xa1wE6lYb5DdEnk03NZPqA7Id21yg==}
+  '@img/sharp-linuxmusl-arm64@0.33.5':
+    resolution: {integrity: sha512-XrHMZwGQGvJg2V/oRSUfSAfjfPxO+4DkiRh6p2AFjLQztWUuY/o8Mq0eMQVIY7HJ1CDQUJlxGGZRw1a5bqmd1g==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [arm64]
     os: [linux]
-    libc: [musl]
 
-  '@img/sharp-linuxmusl-x64@0.34.5':
-    resolution: {integrity: sha512-Jg8wNT1MUzIvhBFxViqrEhWDGzqymo3sV7z7ZsaWbZNDLXRJZoRGrjulp60YYtV4wfY8VIKcWidjojlLcWrd8Q==}
+  '@img/sharp-linuxmusl-x64@0.33.5':
+    resolution: {integrity: sha512-WT+d/cgqKkkKySYmqoZ8y3pxx7lx9vVejxW/W4DOFMYVSkErR+w7mf2u8m/y4+xHe7yY9DAXQMWQhpnMuFfScw==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [x64]
     os: [linux]
-    libc: [musl]
 
-  '@img/sharp-wasm32@0.34.5':
-    resolution: {integrity: sha512-OdWTEiVkY2PHwqkbBI8frFxQQFekHaSSkUIJkwzclWZe64O1X4UlUjqqqLaPbUpMOQk6FBu/HtlGXNblIs0huw==}
+  '@img/sharp-wasm32@0.33.5':
+    resolution: {integrity: sha512-ykUW4LVGaMcU9lu9thv85CbRMAwfeadCJHRsg2GmeRa/cJxsVY9Rbd57JcMxBkKHag5U/x7TSBpScF4U8ElVzg==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [wasm32]
 
-  '@img/sharp-win32-arm64@0.34.5':
-    resolution: {integrity: sha512-WQ3AgWCWYSb2yt+IG8mnC6Jdk9Whs7O0gxphblsLvdhSpSTtmu69ZG1Gkb6NuvxsNACwiPV6cNSZNzt0KPsw7g==}
-    engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
-    cpu: [arm64]
-    os: [win32]
-
-  '@img/sharp-win32-ia32@0.34.5':
-    resolution: {integrity: sha512-FV9m/7NmeCmSHDD5j4+4pNI8Cp3aW+JvLoXcTUo0IqyjSfAZJ8dIUmijx1qaJsIiU+Hosw6xM5KijAWRJCSgNg==}
+  '@img/sharp-win32-ia32@0.33.5':
+    resolution: {integrity: sha512-T36PblLaTwuVJ/zw/LaH0PdZkRz5rd3SmMHX8GSmR7vtNSP5Z6bQkExdSK7xGWyxLw4sUknBuugTelgw2faBbQ==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [ia32]
     os: [win32]
 
-  '@img/sharp-win32-x64@0.34.5':
-    resolution: {integrity: sha512-+29YMsqY2/9eFEiW93eqWnuLcWcufowXewwSNIT6UwZdUUCrM3oFjMWH/Z6/TMmb4hlFenmfAVbpWeup2jryCw==}
+  '@img/sharp-win32-x64@0.33.5':
+    resolution: {integrity: sha512-MpY/o8/8kj+EcnxwvrP4aTJSWw/aZ7JIGR4aBeZkZw5B7/Jn+tY9/VNwtcoGmdT7GfggGIU4kygOMSbYnOrAbg==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
     cpu: [x64]
     os: [win32]
 
-  '@inquirer/ansi@2.0.7':
-    resolution: {integrity: sha512-3eTuUO1vH2cZm2ZKHeQxnOqlTi9EfZDGgIe3BL3I4u+rJHocr9Fz86M4fjYABPvFnQG/gGK551HqDiIcETwU6Q==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
+  '@isaacs/cliui@8.0.2':
+    resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==}
+    engines: {node: '>=12'}
 
-  '@inquirer/checkbox@5.2.1':
-    resolution: {integrity: sha512-b6xmA/VlTe0ZgDQHDui+Nav470u7u49nRd8/iuhOcQPO9Ch7lGuogydhi2VOmNlZ+zXcM8IcPuNSwQcdJaF/kw==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/confirm@6.1.1':
-    resolution: {integrity: sha512-eb8DBZcz/2qHWQda4rk2JiQk5h9QV/cVHi1yjt0f69WFZMRFn0sJTye3EAP8icut8UDMjQPsaH5KbcOogefrFQ==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/core@11.2.1':
-    resolution: {integrity: sha512-Qd6GJT1yVyrZZCfN8W2qKF5ApmqryXRhRKCuip8h01x2w/esJQ2XIYc6f9abMIHgKQdBfFTSOdbHRLAhuM09UA==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/editor@5.2.2':
-    resolution: {integrity: sha512-ZRVd/oD+sYsUd5zVm0NflqEzlqfYCyHNsqkHl2oWXEUHs12tCbcSFi+wVFEvD8+LGRaMUsVrE7qeo6lSG/S1Vg==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/expand@5.1.1':
-    resolution: {integrity: sha512-YmQpenjbFSHAK3sOd44puHh3V1KXXr+JiNpUztoSQ4drLh2rTVzTap/YtlAVu/5xavifIlBfNEzJ/neZJ1a/1g==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/external-editor@3.0.3':
-    resolution: {integrity: sha512-6thf5I8q7lZwzGLAxPaaGEREEkZ3nyePPDQ1oyobblxmEE8mqTLguScP7pDjUTAibiyb4hfXl+qjUEJ+di/aNA==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/figures@2.0.7':
-    resolution: {integrity: sha512-aJ8TBPOGB6f/2qziPfElISTCEd5XOYTFckA2SGjhNmiKzfK/u4ot3v0DUzGVdUnKjN10EqnnEPck36BkyfLnJw==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-
-  '@inquirer/input@5.1.2':
-    resolution: {integrity: sha512-9K/DDBSQpOyZSkt6sOVP9Vo0TR7atX2kuILsUu0x3wVcVbe97lJwIJKMLdMw25tDYuXl/qp6erT0Xs1rfmcfZg==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/number@4.1.1':
-    resolution: {integrity: sha512-XF4IXAbPnGPgw0wsbC/i2tPcyfdZgDpUlhsqU0SfT4IRIGWha6Xm9VRgN5yYxJq+jnyXlfXI/nQ3ulfk0iEICA==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/password@5.1.1':
-    resolution: {integrity: sha512-3XBfF7DAsp5qeDsvN5Rd1HmbNokVvEQoUM0QLrRcybC9nX96w3Pbmu7qUsb3IT3J3jBvs2+mTXaKHOUsgHMLzg==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/prompts@8.5.2':
-    resolution: {integrity: sha512-IYR/3C/paEVVQYQvdDlFZVjRCJVYHHON0XXMH91KO9GSxs0TdKYWlUdvfQl2EfAHDxUaN3IBffkE/BDTh5nJ6g==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/rawlist@5.3.1':
-    resolution: {integrity: sha512-QqdTqQddL3qPX/PPrjobpsO25NZ4dWXgTLenrR445L2ptLEYE6Z+PD5c5CNDJNx4ugRgELAIpSIJxZaO2jJ2Og==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/search@4.2.1':
-    resolution: {integrity: sha512-xJj8QWKRSrfKoBIITLZK61dD3zwo0Rz11fgDImku30/Oe81zMdIdGgrLY2h6RkJ+KZ/GhNYIRMKnH/62qBTA5g==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/select@5.2.1':
-    resolution: {integrity: sha512-FlDndEUww8m7BfukO2nJa25vhD+H5jxxCv4oGioKqzyWz3nPHhhw4LKdYRSlXuAx7DsdWia7iyaBPKKS95Evfw==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@inquirer/type@4.0.7':
-    resolution: {integrity: sha512-t28inv14nMQ1PhKpsJPY+kEs/c00qzeCOS2gTNRyTjG5d6qsVA2fItxW4hkvGZ5lvanGLdtCzVIx5dwdRpN1+g==}
-    engines: {node: '>=23.5.0 || ^22.13.0 || ^20.17.0'}
-    peerDependencies:
-      '@types/node': '>=18'
-    peerDependenciesMeta:
-      '@types/node':
-        optional: true
-
-  '@jridgewell/gen-mapping@0.3.13':
-    resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}
-
-  '@jridgewell/remapping@2.3.5':
-    resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==}
+  '@jridgewell/gen-mapping@0.3.5':
+    resolution: {integrity: sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==}
+    engines: {node: '>=6.0.0'}
 
   '@jridgewell/resolve-uri@3.1.2':
     resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
     engines: {node: '>=6.0.0'}
 
-  '@jridgewell/source-map@0.3.11':
-    resolution: {integrity: sha512-ZMp1V8ZFcPG5dIWnQLr3NSI1MiCU7UETdS/A0G8V/XWHvJv3ZsFqutJn1Y5RPmAPX6F3BiE397OqveU/9NCuIA==}
+  '@jridgewell/set-array@1.2.1':
+    resolution: {integrity: sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==}
+    engines: {node: '>=6.0.0'}
 
-  '@jridgewell/sourcemap-codec@1.5.5':
-    resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
+  '@jridgewell/source-map@0.3.6':
+    resolution: {integrity: sha512-1ZJTZebgqllO79ue2bm3rIGud/bOe0pP5BjSRCRxxYkEZS8STV7zN84UBbiYu7jy+eCKSnVIUgoWWE/tt+shMQ==}
 
-  '@jridgewell/trace-mapping@0.3.31':
-    resolution: {integrity: sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==}
+  '@jridgewell/sourcemap-codec@1.5.0':
+    resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==}
 
-  '@napi-rs/cli@3.7.4':
-    resolution: {integrity: sha512-idELIUceJ9zPgx/shcMt1fSSsteFG68v56RIXi4qUm7OYuJOt7CoMj2KnHVmbOqXgUHWQU1lCULrtQdZDG4F5A==}
-    engines: {node: '>= 16'}
+  '@jridgewell/trace-mapping@0.3.25':
+    resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
+
+  '@napi-rs/cli@2.18.4':
+    resolution: {integrity: sha512-SgJeA4df9DE2iAEpr3M2H0OKl/yjtg1BnRI5/JyowS71tUWhrfSu2LT0V3vlHET+g1hBVlrO60PmEXwUEKp8Mg==}
+    engines: {node: '>= 10'}
     hasBin: true
-    peerDependencies:
-      '@emnapi/runtime': ^1.7.1
-    peerDependenciesMeta:
-      '@emnapi/runtime':
-        optional: true
 
-  '@napi-rs/cross-toolchain@1.0.3':
-    resolution: {integrity: sha512-ENPfLe4937bsKVTDA6zdABx4pq9w0tHqRrJHyaGxgaPq03a2Bd1unD5XSKjXJjebsABJ+MjAv1A2OvCgK9yehg==}
-    peerDependencies:
-      '@napi-rs/cross-toolchain-arm64-target-aarch64': ^1.0.3
-      '@napi-rs/cross-toolchain-arm64-target-armv7': ^1.0.3
-      '@napi-rs/cross-toolchain-arm64-target-ppc64le': ^1.0.3
-      '@napi-rs/cross-toolchain-arm64-target-s390x': ^1.0.3
-      '@napi-rs/cross-toolchain-arm64-target-x86_64': ^1.0.3
-      '@napi-rs/cross-toolchain-x64-target-aarch64': ^1.0.3
-      '@napi-rs/cross-toolchain-x64-target-armv7': ^1.0.3
-      '@napi-rs/cross-toolchain-x64-target-ppc64le': ^1.0.3
-      '@napi-rs/cross-toolchain-x64-target-s390x': ^1.0.3
-      '@napi-rs/cross-toolchain-x64-target-x86_64': ^1.0.3
-    peerDependenciesMeta:
-      '@napi-rs/cross-toolchain-arm64-target-aarch64':
-        optional: true
-      '@napi-rs/cross-toolchain-arm64-target-armv7':
-        optional: true
-      '@napi-rs/cross-toolchain-arm64-target-ppc64le':
-        optional: true
-      '@napi-rs/cross-toolchain-arm64-target-s390x':
-        optional: true
-      '@napi-rs/cross-toolchain-arm64-target-x86_64':
-        optional: true
-      '@napi-rs/cross-toolchain-x64-target-aarch64':
-        optional: true
-      '@napi-rs/cross-toolchain-x64-target-armv7':
-        optional: true
-      '@napi-rs/cross-toolchain-x64-target-ppc64le':
-        optional: true
-      '@napi-rs/cross-toolchain-x64-target-s390x':
-        optional: true
-      '@napi-rs/cross-toolchain-x64-target-x86_64':
-        optional: true
+  '@next/env@15.2.3':
+    resolution: {integrity: sha512-a26KnbW9DFEUsSxAxKBORR/uD9THoYoKbkpFywMN/AFvboTt94b8+g/07T8J6ACsdLag8/PDU60ov4rPxRAixw==}
 
-  '@napi-rs/lzma-android-arm-eabi@1.4.5':
-    resolution: {integrity: sha512-Up4gpyw2SacmyKWWEib06GhiDdF+H+CCU0LAV8pnM4aJIDqKKd5LHSlBht83Jut6frkB0vwEPmAkv4NjQ5u//Q==}
-    engines: {node: '>= 10'}
-    cpu: [arm]
-    os: [android]
+  '@next/eslint-plugin-next@15.2.3':
+    resolution: {integrity: sha512-eNSOIMJtjs+dp4Ms1tB1PPPJUQHP3uZK+OQ7iFY9qXpGO6ojT6imCL+KcUOqE/GXGidWbBZJzYdgAdPHqeCEPA==}
 
-  '@napi-rs/lzma-android-arm64@1.4.5':
-    resolution: {integrity: sha512-uwa8sLlWEzkAM0MWyoZJg0JTD3BkPknvejAFG2acUA1raXM8jLrqujWCdOStisXhqQjZ2nDMp3FV6cs//zjfuQ==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [android]
-
-  '@napi-rs/lzma-darwin-arm64@1.4.5':
-    resolution: {integrity: sha512-0Y0TQLQ2xAjVabrMDem1NhIssOZzF/y/dqetc6OT8mD3xMTDtF8u5BqZoX3MyPc9FzpsZw4ksol+w7DsxHrpMA==}
+  '@next/swc-darwin-arm64@15.2.3':
+    resolution: {integrity: sha512-uaBhA8aLbXLqwjnsHSkxs353WrRgQgiFjduDpc7YXEU0B54IKx3vU+cxQlYwPCyC8uYEEX7THhtQQsfHnvv8dw==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [darwin]
 
-  '@napi-rs/lzma-darwin-x64@1.4.5':
-    resolution: {integrity: sha512-vR2IUyJY3En+V1wJkwmbGWcYiT8pHloTAWdW4pG24+51GIq+intst6Uf6D/r46citObGZrlX0QvMarOkQeHWpw==}
+  '@next/swc-darwin-x64@15.2.3':
+    resolution: {integrity: sha512-pVwKvJ4Zk7h+4hwhqOUuMx7Ib02u3gDX3HXPKIShBi9JlYllI0nU6TWLbPT94dt7FSi6mSBhfc2JrHViwqbOdw==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [darwin]
 
-  '@napi-rs/lzma-freebsd-x64@1.4.5':
-    resolution: {integrity: sha512-XpnYQC5SVovO35tF0xGkbHYjsS6kqyNCjuaLQ2dbEblFRr5cAZVvsJ/9h7zj/5FluJPJRDojVNxGyRhTp4z2lw==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [freebsd]
-
-  '@napi-rs/lzma-linux-arm-gnueabihf@1.4.5':
-    resolution: {integrity: sha512-ic1ZZMoRfRMwtSwxkyw4zIlbDZGC6davC9r+2oX6x9QiF247BRqqT94qGeL5ZP4Vtz0Hyy7TEViWhx5j6Bpzvw==}
-    engines: {node: '>= 10'}
-    cpu: [arm]
-    os: [linux]
-
-  '@napi-rs/lzma-linux-arm64-gnu@1.4.5':
-    resolution: {integrity: sha512-asEp7FPd7C1Yi6DQb45a3KPHKOFBSfGuJWXcAd4/bL2Fjetb2n/KK2z14yfW8YC/Fv6x3rBM0VAZKmJuz4tysg==}
+  '@next/swc-linux-arm64-gnu@15.2.3':
+    resolution: {integrity: sha512-50ibWdn2RuFFkOEUmo9NCcQbbV9ViQOrUfG48zHBCONciHjaUKtHcYFiCwBVuzD08fzvzkWuuZkd4AqbvKO7UQ==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
-    libc: [glibc]
 
-  '@napi-rs/lzma-linux-arm64-musl@1.4.5':
-    resolution: {integrity: sha512-yWjcPDgJ2nIL3KNvi4536dlT/CcCWO0DUyEOlBs/SacG7BeD6IjGh6yYzd3/X1Y3JItCbZoDoLUH8iB1lTXo3w==}
+  '@next/swc-linux-arm64-musl@15.2.3':
+    resolution: {integrity: sha512-2gAPA7P652D3HzR4cLyAuVYwYqjG0mt/3pHSWTCyKZq/N/dJcUAEoNQMyUmwTZWCJRKofB+JPuDVP2aD8w2J6Q==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [linux]
-    libc: [musl]
 
-  '@napi-rs/lzma-linux-ppc64-gnu@1.4.5':
-    resolution: {integrity: sha512-0XRhKuIU/9ZjT4WDIG/qnX7Xz7mSQHYZo9Gb3MP2gcvBgr6BA4zywQ9k3gmQaPn9ECE+CZg2V7DV7kT+x2pUMQ==}
-    engines: {node: '>= 10'}
-    cpu: [ppc64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/lzma-linux-riscv64-gnu@1.4.5':
-    resolution: {integrity: sha512-QrqDIPEUUB23GCpyQj/QFyMlr8SGxxyExeZz9OWFnHfb70kXdTLWrHS/hEI1Ru+lSbQ/6xRqeoGyQ4Aqdg+/RA==}
-    engines: {node: '>= 10'}
-    cpu: [riscv64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/lzma-linux-s390x-gnu@1.4.5':
-    resolution: {integrity: sha512-k8RVM5aMhW86E9H0QXdquwojew4H3SwPxbRVbl49/COJQWCUjGi79X6mYruMnMPEznZinUiT1jgKbFo2A00NdA==}
-    engines: {node: '>= 10'}
-    cpu: [s390x]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/lzma-linux-x64-gnu@1.4.5':
-    resolution: {integrity: sha512-6rMtBgnIq2Wcl1rQdZsnM+rtCcVCbws1nF8S2NzaUsVaZv8bjrPiAa0lwg4Eqnn1d9lgwqT+cZgm5m+//K08Kw==}
+  '@next/swc-linux-x64-gnu@15.2.3':
+    resolution: {integrity: sha512-ODSKvrdMgAJOVU4qElflYy1KSZRM3M45JVbeZu42TINCMG3anp7YCBn80RkISV6bhzKwcUqLBAmOiWkaGtBA9w==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
-    libc: [glibc]
 
-  '@napi-rs/lzma-linux-x64-musl@1.4.5':
-    resolution: {integrity: sha512-eiadGBKi7Vd0bCArBUOO/qqRYPHt/VQVvGyYvDFt6C2ZSIjlD+HuOl+2oS1sjf4CFjK4eDIog6EdXnL0NE6iyQ==}
+  '@next/swc-linux-x64-musl@15.2.3':
+    resolution: {integrity: sha512-ZR9kLwCWrlYxwEoytqPi1jhPd1TlsSJWAc+H/CJHmHkf2nD92MQpSRIURR1iNgA/kuFSdxB8xIPt4p/T78kwsg==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [linux]
-    libc: [musl]
 
-  '@napi-rs/lzma-wasm32-wasi@1.4.5':
-    resolution: {integrity: sha512-+VyHHlr68dvey6fXc2hehw9gHVFIW3TtGF1XkcbAu65qVXsA9D/T+uuoRVqhE+JCyFHFrO0ixRbZDRK1XJt1sA==}
-    engines: {node: '>=14.0.0'}
-    cpu: [wasm32]
-
-  '@napi-rs/lzma-win32-arm64-msvc@1.4.5':
-    resolution: {integrity: sha512-eewnqvIyyhHi3KaZtBOJXohLvwwN27gfS2G/YDWdfHlbz1jrmfeHAmzMsP5qv8vGB+T80TMHNkro4kYjeh6Deg==}
+  '@next/swc-win32-arm64-msvc@15.2.3':
+    resolution: {integrity: sha512-+G2FrDcfm2YDbhDiObDU/qPriWeiz/9cRR0yMWJeTLGGX6/x8oryO3tt7HhodA1vZ8r2ddJPCjtLcpaVl7TE2Q==}
     engines: {node: '>= 10'}
     cpu: [arm64]
     os: [win32]
 
-  '@napi-rs/lzma-win32-ia32-msvc@1.4.5':
-    resolution: {integrity: sha512-OeacFVRCJOKNU/a0ephUfYZ2Yt+NvaHze/4TgOwJ0J0P4P7X1mHzN+ig9Iyd74aQDXYqc7kaCXA2dpAOcH87Cg==}
-    engines: {node: '>= 10'}
-    cpu: [ia32]
-    os: [win32]
-
-  '@napi-rs/lzma-win32-x64-msvc@1.4.5':
-    resolution: {integrity: sha512-T4I1SamdSmtyZgDXGAGP+y5LEK5vxHUFwe8mz6D4R7Sa5/WCxTcCIgPJ9BD7RkpO17lzhlaM2vmVvMy96Lvk9Q==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [win32]
-
-  '@napi-rs/lzma@1.4.5':
-    resolution: {integrity: sha512-zS5LuN1OBPAyZpda2ZZgYOEDC+xecUdAGnrvbYzjnLXkrq/OBC3B9qcRvlxbDR3k5H/gVfvef1/jyUqPknqjbg==}
-    engines: {node: '>= 10'}
-
-  '@napi-rs/tar-android-arm-eabi@1.1.0':
-    resolution: {integrity: sha512-h2Ryndraj/YiKgMV/r5by1cDusluYIRT0CaE0/PekQ4u+Wpy2iUVqvzVU98ZPnhXaNeYxEvVJHNGafpOfaD0TA==}
-    engines: {node: '>= 10'}
-    cpu: [arm]
-    os: [android]
-
-  '@napi-rs/tar-android-arm64@1.1.0':
-    resolution: {integrity: sha512-DJFyQHr1ZxNZorm/gzc1qBNLF/FcKzcH0V0Vwan5P+o0aE2keQIGEjJ09FudkF9v6uOuJjHCVDdK6S6uHtShAw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [android]
-
-  '@napi-rs/tar-darwin-arm64@1.1.0':
-    resolution: {integrity: sha512-Zz2sXRzjIX4e532zD6xm2SjXEym6MkvfCvL2RMpG2+UwNVDVscHNcz3d47Pf3sysP2e2af7fBB3TIoK2f6trPw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [darwin]
-
-  '@napi-rs/tar-darwin-x64@1.1.0':
-    resolution: {integrity: sha512-EI+CptIMNweT0ms9S3mkP/q+J6FNZ1Q6pvpJOEcWglRfyfQpLqjlC0O+dptruTPE8VamKYuqdjxfqD8hifZDOA==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [darwin]
-
-  '@napi-rs/tar-freebsd-x64@1.1.0':
-    resolution: {integrity: sha512-J0PIqX+pl6lBIAckL/c87gpodLbjZB1OtIK+RDscKC9NLdpVv6VGOxzUV/fYev/hctcE8EfkLbgFOfpmVQPg2g==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [freebsd]
-
-  '@napi-rs/tar-linux-arm-gnueabihf@1.1.0':
-    resolution: {integrity: sha512-SLgIQo3f3EjkZ82ZwvrEgFvMdDAhsxCYjyoSuWfHCz0U16qx3SuGCp8+FYOPYCECHN3ZlGjXnoAIt9ERd0dEUg==}
-    engines: {node: '>= 10'}
-    cpu: [arm]
-    os: [linux]
-
-  '@napi-rs/tar-linux-arm64-gnu@1.1.0':
-    resolution: {integrity: sha512-d014cdle52EGaH6GpYTQOP9Py7glMO1zz/+ynJPjjzYFSxvdYx0byrjumZk2UQdIyGZiJO2MEFpCkEEKFSgPYA==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/tar-linux-arm64-musl@1.1.0':
-    resolution: {integrity: sha512-L/y1/26q9L/uBqiW/JdOb/Dc94egFvNALUZV2WCGKQXc6UByPBMgdiEyW2dtoYxYYYYc+AKD+jr+wQPcvX2vrQ==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
-  '@napi-rs/tar-linux-ppc64-gnu@1.1.0':
-    resolution: {integrity: sha512-EPE1K/80RQvPbLRJDJs1QmCIcH+7WRi0F73+oTe1582y9RtfGRuzAkzeBuAGRXAQEjRQw/RjtNqr6UTJ+8UuWQ==}
-    engines: {node: '>= 10'}
-    cpu: [ppc64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/tar-linux-s390x-gnu@1.1.0':
-    resolution: {integrity: sha512-B2jhWiB1ffw1nQBqLUP1h4+J1ovAxBOoe5N2IqDMOc63fsPZKNqF1PvO/dIem8z7LL4U4bsfmhy3gBfu547oNQ==}
-    engines: {node: '>= 10'}
-    cpu: [s390x]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/tar-linux-x64-gnu@1.1.0':
-    resolution: {integrity: sha512-tbZDHnb9617lTnsDMGo/eAMZxnsQFnaRe+MszRqHguKfMwkisc9CCJnks/r1o84u5fECI+J/HOrKXgczq/3Oww==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/tar-linux-x64-musl@1.1.0':
-    resolution: {integrity: sha512-dV6cODlzbO8u6Anmv2N/ilQHq/AWz0xyltuXoLU3yUyXbZcnWYZuB2rL8OBGPmqNcD+x9NdScBNXh7vWN0naSQ==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
-  '@napi-rs/tar-wasm32-wasi@1.1.0':
-    resolution: {integrity: sha512-jIa9nb2HzOrfH0F8QQ9g3WE4aMH5vSI5/1NYVNm9ysCmNjCCtMXCAhlI3WKCdm/DwHf0zLqdrrtDFXODcNaqMw==}
-    engines: {node: '>=14.0.0'}
-    cpu: [wasm32]
-
-  '@napi-rs/tar-win32-arm64-msvc@1.1.0':
-    resolution: {integrity: sha512-vfpG71OB0ijtjemp3WTdmBKJm9R70KM8vsSExMsIQtV0lVzP07oM1CW6JbNRPXNLhRoue9ofYLiUDk8bE0Hckg==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [win32]
-
-  '@napi-rs/tar-win32-ia32-msvc@1.1.0':
-    resolution: {integrity: sha512-hGPyPW60YSpOSgzfy68DLBHgi6HxkAM+L59ZZZPMQ0TOXjQg+p2EW87+TjZfJOkSpbYiEkULwa/f4a2hcVjsqQ==}
-    engines: {node: '>= 10'}
-    cpu: [ia32]
-    os: [win32]
-
-  '@napi-rs/tar-win32-x64-msvc@1.1.0':
-    resolution: {integrity: sha512-L6Ed1DxXK9YSCMyvpR8MiNAyKNkQLjsHsHK9E0qnHa8NzLFqzDKhvs5LfnWxM2kJ+F7m/e5n9zPm24kHb3LsVw==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [win32]
-
-  '@napi-rs/tar@1.1.0':
-    resolution: {integrity: sha512-7cmzIu+Vbupriudo7UudoMRH2OA3cTw67vva8MxeoAe5S7vPFI7z0vp0pMXiA25S8IUJefImQ90FeJjl8fjEaQ==}
-    engines: {node: '>= 10'}
-
-  '@napi-rs/wasm-runtime@1.1.4':
-    resolution: {integrity: sha512-3NQNNgA1YSlJb/kMH1ildASP9HW7/7kYnRI2szWJaofaS1hWmbGI4H+d3+22aGzXXN9IJ+n+GiFVcGipJP18ow==}
-    peerDependencies:
-      '@emnapi/core': ^1.7.1
-      '@emnapi/runtime': ^1.7.1
-
-  '@napi-rs/wasm-runtime@1.2.2':
-    resolution: {integrity: sha512-JfB4kuJQjaoHuCTseIINHtHWeJnvgEcxjwA5t/Y00ZgaOO1Crz3fjT/p8kT28zA/Caz7oiUMn3d6H2yOVCVwuw==}
-    engines: {node: ^20.19.0 || ^22.13.0 || >=23.5.0}
-    peerDependencies:
-      '@emnapi/core': ^1.7.1 || ^2.0.0-alpha.3
-      '@emnapi/runtime': ^1.7.1 || ^2.0.0-alpha.3
-
-  '@napi-rs/wasm-tools-android-arm-eabi@1.0.1':
-    resolution: {integrity: sha512-lr07E/l571Gft5v4aA1dI8koJEmF1F0UigBbsqg9OWNzg80H3lDPO+auv85y3T/NHE3GirDk7x/D3sLO57vayw==}
-    engines: {node: '>= 10'}
-    cpu: [arm]
-    os: [android]
-
-  '@napi-rs/wasm-tools-android-arm64@1.0.1':
-    resolution: {integrity: sha512-WDR7S+aRLV6LtBJAg5fmjKkTZIdrEnnQxgdsb7Cf8pYiMWBHLU+LC49OUVppQ2YSPY0+GeYm9yuZWW3kLjJ7Bg==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [android]
-
-  '@napi-rs/wasm-tools-darwin-arm64@1.0.1':
-    resolution: {integrity: sha512-qWTI+EEkiN0oIn/N2gQo7+TVYil+AJ20jjuzD2vATS6uIjVz+Updeqmszi7zq7rdFTLp6Ea3/z4kDKIfZwmR9g==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [darwin]
-
-  '@napi-rs/wasm-tools-darwin-x64@1.0.1':
-    resolution: {integrity: sha512-bA6hubqtHROR5UI3tToAF/c6TDmaAgF0SWgo4rADHtQ4wdn0JeogvOk50gs2TYVhKPE2ZD2+qqt7oBKB+sxW3A==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [darwin]
-
-  '@napi-rs/wasm-tools-freebsd-x64@1.0.1':
-    resolution: {integrity: sha512-90+KLBkD9hZEjPQW1MDfwSt5J1L46EUKacpCZWyRuL6iIEO5CgWU0V/JnEgFsDOGyyYtiTvHc5bUdUTWd4I9Vg==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [freebsd]
-
-  '@napi-rs/wasm-tools-linux-arm64-gnu@1.0.1':
-    resolution: {integrity: sha512-rG0QlS65x9K/u3HrKafDf8cFKj5wV2JHGfl8abWgKew0GVPyp6vfsDweOwHbWAjcHtp2LHi6JHoW80/MTHm52Q==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/wasm-tools-linux-arm64-musl@1.0.1':
-    resolution: {integrity: sha512-jAasbIvjZXCgX0TCuEFQr+4D6Lla/3AAVx2LmDuMjgG4xoIXzjKWl7c4chuaD+TI+prWT0X6LJcdzFT+ROKGHQ==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
-  '@napi-rs/wasm-tools-linux-x64-gnu@1.0.1':
-    resolution: {integrity: sha512-Plgk5rPqqK2nocBGajkMVbGm010Z7dnUgq0wtnYRZbzWWxwWcXfZMPa8EYxrK4eE8SzpI7VlZP1tdVsdjgGwMw==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
-  '@napi-rs/wasm-tools-linux-x64-musl@1.0.1':
-    resolution: {integrity: sha512-GW7AzGuWxtQkyHknHWYFdR0CHmW6is8rG2Rf4V6GNmMpmwtXt/ItWYWtBe4zqJWycMNazpfZKSw/BpT7/MVCXQ==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
-  '@napi-rs/wasm-tools-wasm32-wasi@1.0.1':
-    resolution: {integrity: sha512-/nQVSTrqSsn7YdAc2R7Ips/tnw5SPUcl3D7QrXCNGPqjbatIspnaexvaOYNyKMU6xPu+pc0BTnKVmqhlJJCPLA==}
-    engines: {node: '>=14.0.0'}
-    cpu: [wasm32]
-
-  '@napi-rs/wasm-tools-win32-arm64-msvc@1.0.1':
-    resolution: {integrity: sha512-PFi7oJIBu5w7Qzh3dwFea3sHRO3pojMsaEnUIy22QvsW+UJfNQwJCryVrpoUt8m4QyZXI+saEq/0r4GwdoHYFQ==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [win32]
-
-  '@napi-rs/wasm-tools-win32-ia32-msvc@1.0.1':
-    resolution: {integrity: sha512-gXkuYzxQsgkj05Zaq+KQTkHIN83dFAwMcTKa2aQcpYPRImFm2AQzEyLtpXmyCWzJ0F9ZYAOmbSyrNew8/us6bw==}
-    engines: {node: '>= 10'}
-    cpu: [ia32]
-    os: [win32]
-
-  '@napi-rs/wasm-tools-win32-x64-msvc@1.0.1':
-    resolution: {integrity: sha512-rEAf05nol3e3eei2sRButmgXP+6ATgm0/38MKhz9Isne82T4rPIMYsCIFj0kOisaGeVwoi2fnm7O9oWp5YVnYQ==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [win32]
-
-  '@napi-rs/wasm-tools@1.0.1':
-    resolution: {integrity: sha512-enkZYyuCdo+9jneCPE/0fjIta4wWnvVN9hBo2HuiMpRF0q3lzv1J6b/cl7i0mxZUKhBrV3aCKDBQnCOhwKbPmQ==}
-    engines: {node: '>= 10'}
-
-  '@next/env@16.2.7':
-    resolution: {integrity: sha512-tMJizPlj6ZYpBMMdK8S0LJufrP4QTdR6pcv9KQ/bVETPAmg0j1mlHE9G2c38UyGHxoBapgwuj7XjbGJ2RcDFOg==}
-
-  '@next/swc-darwin-arm64@16.2.7':
-    resolution: {integrity: sha512-vm1EDI/pVaBNNiychmxk3fft+OhQPVD9cIM/tReLZIQ3TfQ4kqI9DwKk00dzuS1ulC7icbrzCFrmRRlk9PfNdw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [darwin]
-
-  '@next/swc-darwin-x64@16.2.7':
-    resolution: {integrity: sha512-O3IRSv1ZBL1zs0WrIgefTEcTKFVn+ryxBNe54erJ6KsD+2f/Mmt7g2jOYh8PSBdUwPtKQJuCsTMlZ7tIu2AcsQ==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [darwin]
-
-  '@next/swc-linux-arm64-gnu@16.2.7':
-    resolution: {integrity: sha512-Re6PZtjBDd0aMU+VcZcC/PrIvj4WhrjDYtMhhCVQamWN4L90EVP0pcEOBQD25prSlw7OzNw5QpHLWMilRLsRNw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
-  '@next/swc-linux-arm64-musl@16.2.7':
-    resolution: {integrity: sha512-qyogG9QtBzWxgJfeGBvOEHI3851gTfCF3wLZ5RDLTBJGAmE9p1qDwKCOdrBrvBzRvYDT+gUDp72pzlSEfAXgNA==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
-  '@next/swc-linux-x64-gnu@16.2.7':
-    resolution: {integrity: sha512-Vhe4ZDuBpmMogrGi5D4R2Kq4JAQlj6+wvgaFYy31zfES0zPmt6TLA+cuYpM/OLrPZjo2MYQTHVqNUSCR6+fDZQ==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
-  '@next/swc-linux-x64-musl@16.2.7':
-    resolution: {integrity: sha512-srvian89JahFLw1YLBEuhvPJ0DO5lpUeJQMXy4xYo7g628ZlNgXdNkqoxSAv9OYrBfByh6vxISMwW/mRbzCY+g==}
-    engines: {node: '>= 10'}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
-  '@next/swc-win32-arm64-msvc@16.2.7':
-    resolution: {integrity: sha512-GX3wvLpULFuRFJzwHaKfm7QZJ18F4ZSuxlPJ96BoBglCzBmdSjyeBKF+ZhWhvL/ckxNfLnNa7bsObO2ipYpszw==}
-    engines: {node: '>= 10'}
-    cpu: [arm64]
-    os: [win32]
-
-  '@next/swc-win32-x64-msvc@16.2.7':
-    resolution: {integrity: sha512-J4WlM72NMk076Qsg0jTdK3SNXatlSdnjW7L7oNGLst1tAGjHrJh/FYi+pw9wyIjEtGRKDNzD0zuiY16oWYWVaw==}
+  '@next/swc-win32-x64-msvc@15.2.3':
+    resolution: {integrity: sha512-gHYS9tc+G2W0ZC8rBL+H6RdtXIyk40uLiaos0yj5US85FNhbFEndMA2nW3z47nzOWiSvXTZ5kBClc3rD0zJg0w==}
     engines: {node: '>= 10'}
     cpu: [x64]
     os: [win32]
@@ -1572,539 +1571,351 @@ packages:
     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
     engines: {node: '>= 8'}
 
-  '@octokit/auth-token@6.0.0':
-    resolution: {integrity: sha512-P4YJBPdPSpWTQ1NU4XYdvHvXJJDxM6YwpS0FZHRgP7YFkdVxsWcpWGy/NVqlAA7PcPCnMacXlRm1y2PFZRWL/w==}
-    engines: {node: '>= 20'}
+  '@nolyfill/is-core-module@1.0.39':
+    resolution: {integrity: sha512-nn5ozdjYQpUCZlWGuxcJY/KpxkWQs4DcbMCmKojjyrYDEAGy4Ce19NN4v5MduafTwJlbKc99UA8YhSVqq9yPZA==}
+    engines: {node: '>=12.4.0'}
 
-  '@octokit/core@7.0.6':
-    resolution: {integrity: sha512-DhGl4xMVFGVIyMwswXeyzdL4uXD5OGILGX5N8Y+f6W7LhC1Ze2poSNrkF/fedpVDHEEZ+PHFW0vL14I+mm8K3Q==}
-    engines: {node: '>= 20'}
-
-  '@octokit/endpoint@11.0.3':
-    resolution: {integrity: sha512-FWFlNxghg4HrXkD3ifYbS/IdL/mDHjh9QcsNyhQjN8dplUoZbejsdpmuqdA76nxj2xoWPs7p8uX2SNr9rYu0Ag==}
-    engines: {node: '>= 20'}
-
-  '@octokit/graphql@9.0.3':
-    resolution: {integrity: sha512-grAEuupr/C1rALFnXTv6ZQhFuL1D8G5y8CN04RgrO4FIPMrtm+mcZzFG7dcBm+nq+1ppNixu+Jd78aeJOYxlGA==}
-    engines: {node: '>= 20'}
-
-  '@octokit/openapi-types@27.0.0':
-    resolution: {integrity: sha512-whrdktVs1h6gtR+09+QsNk2+FO+49j6ga1c55YZudfEG+oKJVvJLQi3zkOm5JjiUXAagWK2tI2kTGKJ2Ys7MGA==}
-
-  '@octokit/plugin-paginate-rest@14.0.0':
-    resolution: {integrity: sha512-fNVRE7ufJiAA3XUrha2omTA39M6IXIc6GIZLvlbsm8QOQCYvpq/LkMNGyFlB1d8hTDzsAXa3OKtybdMAYsV/fw==}
-    engines: {node: '>= 20'}
-    peerDependencies:
-      '@octokit/core': '>=6'
-
-  '@octokit/plugin-request-log@6.0.0':
-    resolution: {integrity: sha512-UkOzeEN3W91/eBq9sPZNQ7sUBvYCqYbrrD8gTbBuGtHEuycE4/awMXcYvx6sVYo7LypPhmQwwpUe4Yyu4QZN5Q==}
-    engines: {node: '>= 20'}
-    peerDependencies:
-      '@octokit/core': '>=6'
-
-  '@octokit/plugin-rest-endpoint-methods@17.0.0':
-    resolution: {integrity: sha512-B5yCyIlOJFPqUUeiD0cnBJwWJO8lkJs5d8+ze9QDP6SvfiXSz1BF+91+0MeI1d2yxgOhU/O+CvtiZ9jSkHhFAw==}
-    engines: {node: '>= 20'}
-    peerDependencies:
-      '@octokit/core': '>=6'
-
-  '@octokit/request-error@7.1.0':
-    resolution: {integrity: sha512-KMQIfq5sOPpkQYajXHwnhjCC0slzCNScLHs9JafXc4RAJI+9f+jNDlBNaIMTvazOPLgb4BnlhGJOTbnN0wIjPw==}
-    engines: {node: '>= 20'}
-
-  '@octokit/request@10.0.9':
-    resolution: {integrity: sha512-o8Bi3f608eyM+7BmBiUWxFsdjLb3/ym1cQek5LZOv9KkZcxRrHCPhhRzm6xjO6HVZ85ItD6+sTsjxo821SVa/A==}
-    engines: {node: '>= 20'}
-
-  '@octokit/rest@22.0.1':
-    resolution: {integrity: sha512-Jzbhzl3CEexhnivb1iQ0KJ7s5vvjMWcmRtq5aUsKmKDrRW6z3r84ngmiFKFvpZjpiU/9/S6ITPFRpn5s/3uQJw==}
-    engines: {node: '>= 20'}
-
-  '@octokit/types@16.0.0':
-    resolution: {integrity: sha512-sKq+9r1Mm4efXW1FCk7hFSeJo4QKreL/tTbR0rz/qx/r1Oa2VV83LTA/H/MuCOX7uCIJmQVRKBcbmWoySjAnSg==}
-
-  '@oven/bun-darwin-aarch64@1.3.14':
-    resolution: {integrity: sha512-Omj20SuiHBOUjUBIyqtkNjSUIjOtEOJwmbix/ZyFH4BaQ6OZTaaRWIR4TjHVz0yadHgli6lLTiAh1uarnvD49A==}
+  '@oven/bun-darwin-aarch64@1.2.4':
+    resolution: {integrity: sha512-xBz/Q7X6AFwMg7MXtBemjjt5uB+tvEYBmi9Zbm1r8qnI2V8m/Smuhma0EARhiVfLuIAYj2EM5qjzxeAFV4TBJA==}
     cpu: [arm64]
     os: [darwin]
 
-  '@oven/bun-darwin-x64-baseline@1.3.14':
-    resolution: {integrity: sha512-OSfsTZstc898HHElhU4NccaBGOSSDn5VfahiVTnidZ9B/+wb7WTyfZJaBeJcfjwJ9H2W9uTh2TGtl3UfcXgV9g==}
+  '@oven/bun-darwin-x64-baseline@1.2.4':
+    resolution: {integrity: sha512-stsq8vBiYgfGunBGlf2M7ST7Ymyw3WnwrxEeJ04vkKmMEEE2LpX8Rkol6UPRvZawab9s9/scFIRgFi6hu9H4SQ==}
     cpu: [x64]
     os: [darwin]
 
-  '@oven/bun-darwin-x64@1.3.14':
-    resolution: {integrity: sha512-FFj3QdU/OhlDyZOJ8CWfN5eWLpRlT4qjZg7lMQi7jA6GuoY5ajlO1zWLP/MuHYRSbXQUvV52RejNi8DVnAp13w==}
+  '@oven/bun-darwin-x64@1.2.4':
+    resolution: {integrity: sha512-ufyty+2754QCFDhq447H39JiqabMlFRItLn1YFp+2hdpKak7KCYLGOUuHnlr1pmImKJzDHURjnvTTq1QRlUWAA==}
     cpu: [x64]
     os: [darwin]
 
-  '@oven/bun-freebsd-aarch64@1.3.14':
-    resolution: {integrity: sha512-LIKrXaFxAHybVO5Pf+9XP2FHUj/5APvXTUKk9dqHm5iFz4oH+W24cmhjkJirNujh9hKeTyrpWSe3no9JZKowIw==}
-    cpu: [arm64]
-    os: [freebsd]
+  '@oven/bun-linux-aarch64-musl@1.2.4':
+    resolution: {integrity: sha512-+lxWF7up9MuB1ZdGxXCH3AH3XmYtdBC6soQ38+yg3+y3iOPrAlSG+wytHEkypN/UU2mGvCuaEED3cMvejrGdDw==}
+    cpu: [aarch64]
+    os: [linux]
 
-  '@oven/bun-freebsd-x64@1.3.14':
-    resolution: {integrity: sha512-uwD+fGUH1ADpIF3B1U2jWzzb20QwRLZfj5QZ28GUCGrAJ/nTmWrD6YYGsblCY1wuhldRez3lU40AyuvSCyLYmw==}
-    cpu: [x64]
-    os: [freebsd]
-
-  '@oven/bun-linux-aarch64-android@1.3.14':
-    resolution: {integrity: sha512-y4kq5b85lsrmFb9Xvi4w9mA5IEFJkLMrSmYn06q24KjL9rUWDWO3VFZEtteZxUN5+ec3Zm5S8OnJw1umaCbVjA==}
-    cpu: [arm64]
-    os: [android]
-
-  '@oven/bun-linux-aarch64-musl@1.3.14':
-    resolution: {integrity: sha512-jmqOA92Cd1NL/1XBd4bFkJLxQ86K0RW7ohxS2qzzAvuitO4JiIxjjTeCspoU44zCozH72HpfZfUE2On31OjnWA==}
+  '@oven/bun-linux-aarch64@1.2.4':
+    resolution: {integrity: sha512-OhVpzme2vvLA7w8GYeJg2SQ2h2CwJQN9oYDiGeoML4EwE+DEoYHdxgaBZsQySOwZtFIr8ufpc/8iD4hssJ50qg==}
     cpu: [arm64]
     os: [linux]
 
-  '@oven/bun-linux-aarch64@1.3.14':
-    resolution: {integrity: sha512-X5SsPZHs+iYO8R/efIcRtc7gT2Q2DgPfliCxEkx4cXBumwkw0c/EsHMNwH3EgGpCDaZ7IYVPhpCG/xBOQHEwZw==}
-    cpu: [arm64]
-    os: [linux]
-
-  '@oven/bun-linux-x64-android@1.3.14':
-    resolution: {integrity: sha512-qe9e1d+3VAEU7nAA2ol9Jvmy/o99PVMSgZhHn7Q/9O3YcDrfEqyQ8zm4zoe5qTEo8HZH0dN03Le0Ys2eQPs7eg==}
-    cpu: [x64]
-    os: [android]
-
-  '@oven/bun-linux-x64-baseline@1.3.14':
-    resolution: {integrity: sha512-q/8EdOC0yUE8FPeoOVq8/Pw5I9/tJaYmUfO/uDUAREx8IUnOJH1RJ5A3BjFqre8pvJoiZA9AovPJq5FnNNjSxA==}
+  '@oven/bun-linux-x64-baseline@1.2.4':
+    resolution: {integrity: sha512-3nmDDZJH73MzhBg2sRYioj4CE8wgaz0w24OieMqj4/c44BbNr3X5RewrldsMD2cU6DtVbi52FuD5WpTw3N8nmw==}
     cpu: [x64]
     os: [linux]
 
-  '@oven/bun-linux-x64-musl-baseline@1.3.14':
-    resolution: {integrity: sha512-n6iE71G4lQE4XkrZhQQcL5YUlxDbnq6nqV7zeQi33PMsLT/0kYE+RvHOtBWZ3w0wMdXZfINmp63hIb9ijUBGtw==}
+  '@oven/bun-linux-x64-musl-baseline@1.2.4':
+    resolution: {integrity: sha512-qDsUvKCW0WUlVOt6Yx5eEzxgCbvzuSJBsu0sXtr6uGt8TnMKghmliRO5FmiMLQ0k/PUDA8vPJCtuv5k14bDi6g==}
     cpu: [x64]
     os: [linux]
 
-  '@oven/bun-linux-x64-musl@1.3.14':
-    resolution: {integrity: sha512-GBCB/k/sIqcr06eTNgg7g46qiUv35Jasx4XiccJ/n7RGqrE4RWUD/XJBbWFprVPjvqd59+QtSnS99XGqvftHfg==}
+  '@oven/bun-linux-x64-musl@1.2.4':
+    resolution: {integrity: sha512-cLdMbK7srNoUbYSG3Tp4GYdPAO0+5mgUhdbU053GZs0DLQmQ8h1JQhALp+ZjrUWstmQe7ddcNu7l7EAu6E76XA==}
     cpu: [x64]
     os: [linux]
 
-  '@oven/bun-linux-x64@1.3.14':
-    resolution: {integrity: sha512-7OVTAKvwfPmSbIV1HpdOoVVx5VRc427GuPPne93N6vk4eQBPId9nXmZDh9/zGaKPdbVjVtQSZafWQoUjx38Utw==}
+  '@oven/bun-linux-x64@1.2.4':
+    resolution: {integrity: sha512-oof3ii92Cz2yIOZRbVFHMHmffCutRPFITIdXLZ2/rkqVuKUe0ZdqWjHPhxJFm31AL9MlJ/dSqDbPb51SaLI7tw==}
     cpu: [x64]
     os: [linux]
 
-  '@oven/bun-windows-aarch64@1.3.14':
-    resolution: {integrity: sha512-T7s3x/BsVKQObGU6QDkZeI6wKynzqGbBH1yI77jrrj5siElclxr3DQrDIk8CV4G5/SJq2HHq4kpLyYY2DKCSmA==}
-    cpu: [arm64]
-    os: [win32]
-
-  '@oven/bun-windows-x64-baseline@1.3.14':
-    resolution: {integrity: sha512-uIjLUC1S9DWgICzuoMba7vurBJnBruE4S5CxnvmZkdqWVXRzx1Rgu636HoH+k0qeaQCFh3jeG3JQ1y6fRHv0sw==}
+  '@oven/bun-windows-x64-baseline@1.2.4':
+    resolution: {integrity: sha512-j/G4bnfsRAiCvpTADda40m29iSGvueIaF9Kc9hBu4jN8dTS9fEXdNNXuf8c30/z7/npxw2dhzsAn8jbc5QvD1A==}
     cpu: [x64]
     os: [win32]
 
-  '@oven/bun-windows-x64@1.3.14':
-    resolution: {integrity: sha512-mUFWL3BoYkNpjd8e9PqROiFF/1Xeotq20mABJsiQH62jM1g5zqWh4khw1RZ6bX8Q8fWvlPaxG1PjofkmjUi3vg==}
+  '@oven/bun-windows-x64@1.2.4':
+    resolution: {integrity: sha512-4YRJd4pdaTWEM+uawYmchOeNv874RGAFpIZQubWnN4SBf6HfcDm0OMMZcm0f0I70Wd5gbPg1+rvCRtDZWVmZog==}
     cpu: [x64]
     os: [win32]
 
-  '@oxc-project/types@0.142.0':
-    resolution: {integrity: sha512-7W+2q5AKQVU36fkaryontrHn3YDt1RyUYXatw9i5H8ocYe2sPKSFB6eS8WNPeRKiN1qAWWZUPm7gwFzJGrccqQ==}
-
-  '@parcel/watcher-android-arm64@2.6.0':
-    resolution: {integrity: sha512-trgpLSCKRC/huFjXX/Smh+0sWe4+YtKfktIToiMl59ghz7z+qkH6kMvNnUbLyRs9N11t8l4svSCs1+5B3rOAhA==}
+  '@parcel/watcher-android-arm64@2.5.0':
+    resolution: {integrity: sha512-qlX4eS28bUcQCdribHkg/herLe+0A9RyYC+mm2PXpncit8z5b3nSqGVzMNR3CmtAOgRutiZ02eIJJgP/b1iEFQ==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [android]
 
-  '@parcel/watcher-darwin-arm64@2.6.0':
-    resolution: {integrity: sha512-Y3QV0gl7Q1zbfueunkWIERICbEojQFCgpyG7YqOGNFLsckXyI1xu9mAIUpKY9QBYzBtSkN8dBPwd3yiAO9ovMw==}
+  '@parcel/watcher-android-arm64@2.5.1':
+    resolution: {integrity: sha512-KF8+j9nNbUN8vzOFDpRMsaKBHZ/mcjEjMToVMJOhTozkDonQFFrRcfdLWn6yWKCmJKmdVxSgHiYvTCef4/qcBA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [android]
+
+  '@parcel/watcher-darwin-arm64@2.5.0':
+    resolution: {integrity: sha512-hyZ3TANnzGfLpRA2s/4U1kbw2ZI4qGxaRJbBH2DCSREFfubMswheh8TeiC1sGZ3z2jUf3s37P0BBlrD3sjVTUw==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [darwin]
 
-  '@parcel/watcher-darwin-x64@2.6.0':
-    resolution: {integrity: sha512-Ohv6OpzhUfKYD7Beb8kDvG0jbIxORCYY1JRdZnaBtnjjkJxgD7ZVL0nw2sCYd0yTMKTvz3nnTnOF3cDifK+kvw==}
+  '@parcel/watcher-darwin-arm64@2.5.1':
+    resolution: {integrity: sha512-eAzPv5osDmZyBhou8PoF4i6RQXAfeKL9tjb3QzYuccXFMQU0ruIc/POh30ePnaOyD1UXdlKguHBmsTs53tVoPw==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@parcel/watcher-darwin-x64@2.5.0':
+    resolution: {integrity: sha512-9rhlwd78saKf18fT869/poydQK8YqlU26TMiNg7AIu7eBp9adqbJZqmdFOsbZ5cnLp5XvRo9wcFmNHgHdWaGYA==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [darwin]
 
-  '@parcel/watcher-freebsd-x64@2.6.0':
-    resolution: {integrity: sha512-5HmXvDgs8VK+74jF9y9/2FE3/OnlcKmc56tjmSrEuZjpSZOGL+fvAu+HKJBdPs9uwoP2hE6TlSUpXZ/C5jUFmQ==}
+  '@parcel/watcher-darwin-x64@2.5.1':
+    resolution: {integrity: sha512-1ZXDthrnNmwv10A0/3AJNZ9JGlzrF82i3gNQcWOzd7nJ8aj+ILyW1MTxVk35Db0u91oD5Nlk9MBiujMlwmeXZg==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  '@parcel/watcher-freebsd-x64@2.5.0':
+    resolution: {integrity: sha512-syvfhZzyM8kErg3VF0xpV8dixJ+RzbUaaGaeb7uDuz0D3FK97/mZ5AJQ3XNnDsXX7KkFNtyQyFrXZzQIcN49Tw==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [freebsd]
 
-  '@parcel/watcher-linux-arm-glibc@2.6.0':
-    resolution: {integrity: sha512-Ps/hui3A+vMbjdqlqAowK2ZL8+BO8dBjxeWXj6npTBs3jx4wWmbPpaLuqwrQrSqIVMCnpWo238bJ1U37GhQOYg==}
+  '@parcel/watcher-freebsd-x64@2.5.1':
+    resolution: {integrity: sha512-SI4eljM7Flp9yPuKi8W0ird8TI/JK6CSxju3NojVI6BjHsTyK7zxA9urjVjEKJ5MBYC+bLmMcbAWlZ+rFkLpJQ==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@parcel/watcher-linux-arm-glibc@2.5.0':
+    resolution: {integrity: sha512-0VQY1K35DQET3dVYWpOaPFecqOT9dbuCfzjxoQyif1Wc574t3kOSkKevULddcR9znz1TcklCE7Ht6NIxjvTqLA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
-    libc: [glibc]
 
-  '@parcel/watcher-linux-arm-musl@2.6.0':
-    resolution: {integrity: sha512-9c6AUHgHoG+IY88MRIHupztQiQnrbqHYQjkM2btA+Bf/wQnQMuiD0Wfk1EVv3TlNT3x41uU71rn6E4xh/+zvkw==}
+  '@parcel/watcher-linux-arm-glibc@2.5.1':
+    resolution: {integrity: sha512-RCdZlEyTs8geyBkkcnPWvtXLY44BCeZKmGYRtSgtwwnHR4dxfHRG3gR99XdMEdQ7KeiDdasJwwvNSF5jKtDwdA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm]
     os: [linux]
-    libc: [musl]
 
-  '@parcel/watcher-linux-arm64-glibc@2.6.0':
-    resolution: {integrity: sha512-yHRqS2owEXe6Hic9z6Mh1ECsCd+ODVOGvZDyciqRd21+v+o+DnXMOrw50DSpIG2sb8GPEaPPmfeCAWKPJdq46g==}
+  '@parcel/watcher-linux-arm-musl@2.5.0':
+    resolution: {integrity: sha512-6uHywSIzz8+vi2lAzFeltnYbdHsDm3iIB57d4g5oaB9vKwjb6N6dRIgZMujw4nm5r6v9/BQH0noq6DzHrqr2pA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  '@parcel/watcher-linux-arm-musl@2.5.1':
+    resolution: {integrity: sha512-6E+m/Mm1t1yhB8X412stiKFG3XykmgdIOqhjWj+VL8oHkKABfu/gjFj8DvLrYVHSBNC+/u5PeNrujiSQ1zwd1Q==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  '@parcel/watcher-linux-arm64-glibc@2.5.0':
+    resolution: {integrity: sha512-BfNjXwZKxBy4WibDb/LDCriWSKLz+jJRL3cM/DllnHH5QUyoiUNEp3GmL80ZqxeumoADfCCP19+qiYiC8gUBjA==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
 
-  '@parcel/watcher-linux-arm64-musl@2.6.0':
-    resolution: {integrity: sha512-WhB2e/V7rqdHHWZusBSPuy5Ei8S6lSz6FE5TKKQz5h3a0O+C+mhY7vxU9b/stqvMb8beLnPY82ZrFTLKs+SrKA==}
+  '@parcel/watcher-linux-arm64-glibc@2.5.1':
+    resolution: {integrity: sha512-LrGp+f02yU3BN9A+DGuY3v3bmnFUggAITBGriZHUREfNEzZh/GO06FF5u2kx8x+GBEUYfyTGamol4j3m9ANe8w==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [linux]
 
-  '@parcel/watcher-linux-x64-glibc@2.6.0':
-    resolution: {integrity: sha512-ulGE6x6Oz6iAwg75T8YQSoguBWasniIbX+QWpaYPcCnDOpdWX3k+4xbEYPZVLxOuoJI+svJJPD3sEj8G7lrQ3A==}
+  '@parcel/watcher-linux-arm64-musl@2.5.0':
+    resolution: {integrity: sha512-S1qARKOphxfiBEkwLUbHjCY9BWPdWnW9j7f7Hb2jPplu8UZ3nes7zpPOW9bkLbHRvWM0WDTsjdOTUgW0xLBN1Q==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@parcel/watcher-linux-arm64-musl@2.5.1':
+    resolution: {integrity: sha512-cFOjABi92pMYRXS7AcQv9/M1YuKRw8SZniCDw0ssQb/noPkRzA+HBDkwmyOJYp5wXcsTrhxO0zq1U11cK9jsFg==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  '@parcel/watcher-linux-x64-glibc@2.5.0':
+    resolution: {integrity: sha512-d9AOkusyXARkFD66S6zlGXyzx5RvY+chTP9Jp0ypSTC9d4lzyRs9ovGf/80VCxjKddcUvnsGwCHWuF2EoPgWjw==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
 
-  '@parcel/watcher-linux-x64-musl@2.6.0':
-    resolution: {integrity: sha512-tkBYKt7YQrjIJWYDnto2YgO8MRkjlMTSNoRHzsXinBqbLdeOM3L32wPZJvIZxqaLMfSlS/4sUjH/6STVP/XDLw==}
+  '@parcel/watcher-linux-x64-glibc@2.5.1':
+    resolution: {integrity: sha512-GcESn8NZySmfwlTsIur+49yDqSny2IhPeZfXunQi48DMugKeZ7uy1FX83pO0X22sHntJ4Ub+9k34XQCX+oHt2A==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [linux]
 
-  '@parcel/watcher-wasm@2.5.6':
-    resolution: {integrity: sha512-byAiBZ1t3tXQvc8dMD/eoyE7lTXYorhn+6uVW5AC+JGI1KtJC/LvDche5cfUE+qiefH+Ybq0bUCJU0aB1cSHUA==}
+  '@parcel/watcher-linux-x64-musl@2.5.0':
+    resolution: {integrity: sha512-iqOC+GoTDoFyk/VYSFHwjHhYrk8bljW6zOhPuhi5t9ulqiYq1togGJB5e3PwYVFFfeVgc6pbz3JdQyDoBszVaA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  '@parcel/watcher-linux-x64-musl@2.5.1':
+    resolution: {integrity: sha512-n0E2EQbatQ3bXhcH2D1XIAANAcTZkQICBPVaxMeaCVBtOpBZpWJuf7LwyWPSBDITb7In8mqQgJ7gH8CILCURXg==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  '@parcel/watcher-wasm@2.5.0':
+    resolution: {integrity: sha512-Z4ouuR8Pfggk1EYYbTaIoxc+Yv4o7cGQnH0Xy8+pQ+HbiW+ZnwhcD2LPf/prfq1nIWpAxjOkQ8uSMFWMtBLiVQ==}
     engines: {node: '>= 10.0.0'}
     bundledDependencies:
       - napi-wasm
 
-  '@parcel/watcher-win32-arm64@2.6.0':
-    resolution: {integrity: sha512-gIZAP23jaHjGWasY/TY6yL7NHFClf0Ga7FN+iINvk+KN94rhm94lYZhFsbYFNcA04/onvGD9kKmiJLJB2HbNwQ==}
+  '@parcel/watcher-win32-arm64@2.5.0':
+    resolution: {integrity: sha512-twtft1d+JRNkM5YbmexfcH/N4znDtjgysFaV9zvZmmJezQsKpkfLYJ+JFV3uygugK6AtIM2oADPkB2AdhBrNig==}
     engines: {node: '>= 10.0.0'}
     cpu: [arm64]
     os: [win32]
 
-  '@parcel/watcher-win32-x64@2.6.0':
-    resolution: {integrity: sha512-cA+/pXV2YkfxlIcXOQ5fSWqAzzPyD78/x5qbK/I0vUkrlYHA8TIz+MXjAbGouguKVSI4bOmkTSJ1/poVSsgt+A==}
+  '@parcel/watcher-win32-arm64@2.5.1':
+    resolution: {integrity: sha512-RFzklRvmc3PkjKjry3hLF9wD7ppR4AKcWNzH7kXR7GUe0Igb3Nz8fyPwtZCSquGrhU5HhUNDr/mKBqj7tqA2Vw==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  '@parcel/watcher-win32-ia32@2.5.0':
+    resolution: {integrity: sha512-+rgpsNRKwo8A53elqbbHXdOMtY/tAtTzManTWShB5Kk54N8Q9mzNWV7tV+IbGueCbcj826MfWGU3mprWtuf1TA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@parcel/watcher-win32-ia32@2.5.1':
+    resolution: {integrity: sha512-c2KkcVN+NJmuA7CGlaGD1qJh1cLfDnQsHjE89E60vUEMlqduHGCdCLJCID5geFVM0dOtA3ZiIO8BoEQmzQVfpQ==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [ia32]
+    os: [win32]
+
+  '@parcel/watcher-win32-x64@2.5.0':
+    resolution: {integrity: sha512-lPrxve92zEHdgeff3aiu4gDOIt4u7sJYha6wbdEZDCDUhtjTsOMiaJzG5lMY4GkWH8p0fMmO2Ppq5G5XXG+DQw==}
     engines: {node: '>= 10.0.0'}
     cpu: [x64]
     os: [win32]
 
-  '@parcel/watcher@2.6.0':
-    resolution: {integrity: sha512-7FNeNl8NCE7aINx7WXiKQrPYZWC/hvrTsmk6zmxbI7LTXE7hVek/n8AfVgpe2y82zl3w0HvCHN0bVKMBoJcC0w==}
+  '@parcel/watcher-win32-x64@2.5.1':
+    resolution: {integrity: sha512-9lHBdJITeNR++EvSQVUcaZoWupyHfXe1jZvGZ06O/5MflPcuPLtEphScIBL+AiCWBO46tDSHzWyD0uDmmZqsgA==}
+    engines: {node: '>= 10.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  '@parcel/watcher@2.5.0':
+    resolution: {integrity: sha512-i0GV1yJnm2n3Yq1qw6QrUrd/LI9bE8WEBOTtOkpCXHHdyN3TAGgqAK/DAT05z4fq2x04cARXt2pDmjWjL92iTQ==}
     engines: {node: '>= 10.0.0'}
 
-  '@playwright/test@1.62.1':
-    resolution: {integrity: sha512-DTcUc8qii+cpHvtOwggMtBRMjKZHXYWdw8syRYu2vtzuq4Wxphqq4NfCs5Zt44L6mA8rfDfj+PHnxFc/FeK6mQ==}
-    engines: {node: '>=20'}
+  '@parcel/watcher@2.5.1':
+    resolution: {integrity: sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==}
+    engines: {node: '>= 10.0.0'}
+
+  '@pkgjs/parseargs@0.11.0':
+    resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
+    engines: {node: '>=14'}
+
+  '@playwright/test@1.51.0':
+    resolution: {integrity: sha512-dJ0dMbZeHhI+wb77+ljx/FeC8VBP6j/rj9OAojO08JI80wTZy6vRk9KvHKiDCUh4iMpEiseMgqRBIeW+eKX6RA==}
+    engines: {node: '>=18'}
     hasBin: true
 
-  '@rolldown/binding-android-arm64@1.2.1':
-    resolution: {integrity: sha512-02hOeOSryYxVrOIphmLAsqnCJWxwlzFk+pEt/N/i6OgT3lShHO7xGCU5cpgchRDHboAEbSjzgGh+O/u1GswQmA==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm64]
-    os: [android]
-
-  '@rolldown/binding-darwin-arm64@1.2.1':
-    resolution: {integrity: sha512-fMsTOnN0OjFm3CyppWPitKnc8UlliVARUULW6cfU6AIqjdtgmSFWSk9vecHzZduv/yMWIHDlRhM1e8Iff9uAfA==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm64]
-    os: [darwin]
-
-  '@rolldown/binding-darwin-x64@1.2.1':
-    resolution: {integrity: sha512-1wjKdz/XLGKHaTNHjQveQ/B23TKx4ItAqm1JbyVuvNPc4Ze0Fb48s49TAd/2zcplPl8okE/UbTgmlVfwT7eFeQ==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [x64]
-    os: [darwin]
-
-  '@rolldown/binding-freebsd-x64@1.2.1':
-    resolution: {integrity: sha512-Fa0jHR07E7YBN4vOEsbVf2briYNsuOowfLJaXULZM0ldMlaCaj2LJgLMbMe4iacRyZmvR8efFhgR9wKuGclQUg==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [x64]
-    os: [freebsd]
-
-  '@rolldown/binding-linux-arm-gnueabihf@1.2.1':
-    resolution: {integrity: sha512-pzkgu1SSHGgRRyRZ4fbmSgmajbVt+epaLP99NDjFft69v/ypfTi6swBMiVdh2EkQ0OSnHE1lZDM7DRGkyAzUpA==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm]
-    os: [linux]
-
-  '@rolldown/binding-linux-arm64-gnu@1.2.1':
-    resolution: {integrity: sha512-QI5SEDY8cbiYWHx0VO4vIc3UlS6a32vXHjU8Qy/17adEmZIPuByJg13UEvo9c/UCiUkdcVWY83C+b+JrwnNyUg==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
-  '@rolldown/binding-linux-arm64-musl@1.2.1':
-    resolution: {integrity: sha512-Sm41FyCeXqmYcERoYOCbGIL5hNfd8w9LQ7Y61Bev48HkcjaJqV/iiVOaiDxjVTRMS+QKrZmD8cfPt4uMVnvM+A==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
-  '@rolldown/binding-linux-ppc64-gnu@1.2.1':
-    resolution: {integrity: sha512-2x+WhXTGl9yJYPbltW/BSEPTVz9OIWQyER4N+gJEDWkkn904eRcBzELqh/Hf7K0w/ubGbKNMv0ZC+94QK/IFEg==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [ppc64]
-    os: [linux]
-    libc: [glibc]
-
-  '@rolldown/binding-linux-s390x-gnu@1.2.1':
-    resolution: {integrity: sha512-eEjmQpuRQayHPWWnywaWHkFT3ToPbP3RYy42VVd/B9aBGDA+Ol25EIWHxKQST3IiWJjikCWUF7KtbfqwZrzVwQ==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [s390x]
-    os: [linux]
-    libc: [glibc]
-
-  '@rolldown/binding-linux-x64-gnu@1.2.1':
-    resolution: {integrity: sha512-/Orga1fZYkLc/56jBICcHrKchl8Z2UKdDSr3LG9ToWO1lQ6a4Livk9Xz+9WN91zsz5QR3XQz2NNoSDEvP6qadw==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
-  '@rolldown/binding-linux-x64-musl@1.2.1':
-    resolution: {integrity: sha512-xxBJRL+0q0Kce7orznGWLuylHDY65vuARXZRpX+hPdv+DqK2c3NlCsVA98tlWzWNEE7yPqA/1NQ5nnCrj49Y5A==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
-  '@rolldown/binding-openharmony-arm64@1.2.1':
-    resolution: {integrity: sha512-M6AdXIXw3s+/8XpKMzdGDEXGS1S7kwUsy+rcTIUIOx5Ge4nXKCtAFHFV9YKkXvGcC5WMoTjAteLzlsQROVI0Yw==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm64]
-    os: [openharmony]
-
-  '@rolldown/binding-wasm32-wasi@1.2.1':
-    resolution: {integrity: sha512-/TX0SoRGojHzSAHpfVBbavRVSazg5U3h3Y3VXfcc0cdugq6kxdqw8LPGFiPr+/7gE/60zRcsOY2Vi9b9eT0jww==}
-    engines: {node: ^20.19.0 || ^22.13.0 || >=23.5.0}
-
-  '@rolldown/binding-win32-arm64-msvc@1.2.1':
-    resolution: {integrity: sha512-EvRrivJieyHG+AO9lleZWgq+g0+S7oV2C51yuqlcyU/R9net+sI4Pj0F+lUoP2bEr6TWX3SqFaaS0SzfLxSzkw==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [arm64]
-    os: [win32]
-
-  '@rolldown/binding-win32-x64-msvc@1.2.1':
-    resolution: {integrity: sha512-Z4eCmn5QJ/5+azF9knpLWKfVd9aidn0mAe9TpJgvBLId9Ax3t0+JVxBmT25Bv7NBbVW1TZyKjQjQReouMeH5UQ==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    cpu: [x64]
-    os: [win32]
-
-  '@rolldown/pluginutils@1.0.1':
-    resolution: {integrity: sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==}
-
-  '@rollup/rollup-android-arm-eabi@4.60.4':
-    resolution: {integrity: sha512-F5QXMSiFebS9hKZj02XhWLLnRpJ3B3AROP0tWbFBSj+6kCbg5m9j5JoHKd4mmSVy5mS/IMQloYgYxCuJC0fxEQ==}
+  '@rollup/rollup-android-arm-eabi@4.34.9':
+    resolution: {integrity: sha512-qZdlImWXur0CFakn2BJ2znJOdqYZKiedEPEVNTBrpfPjc/YuTGcaYZcdmNFTkUj3DU0ZM/AElcM8Ybww3xVLzA==}
     cpu: [arm]
     os: [android]
 
-  '@rollup/rollup-android-arm64@4.60.4':
-    resolution: {integrity: sha512-GxxTKApUpzRhof7poWvCJHRF51C67u1R7D6DiluBE8wKU1u5GWE8t+v81JvJYtbawoBFX1hLv5Ei4eVjkWokaw==}
+  '@rollup/rollup-android-arm64@4.34.9':
+    resolution: {integrity: sha512-4KW7P53h6HtJf5Y608T1ISKvNIYLWRKMvfnG0c44M6In4DQVU58HZFEVhWINDZKp7FZps98G3gxwC1sb0wXUUg==}
     cpu: [arm64]
     os: [android]
 
-  '@rollup/rollup-darwin-arm64@4.60.4':
-    resolution: {integrity: sha512-tua0TaJxMOB1R0V0RS1jFZ/RpURFDJIOR2A6jWwQeawuFyS4gBW+rntLRaQd0EQ4bd6Vp44Z2rXW+YYDBsj6IA==}
+  '@rollup/rollup-darwin-arm64@4.34.9':
+    resolution: {integrity: sha512-0CY3/K54slrzLDjOA7TOjN1NuLKERBgk9nY5V34mhmuu673YNb+7ghaDUs6N0ujXR7fz5XaS5Aa6d2TNxZd0OQ==}
     cpu: [arm64]
     os: [darwin]
 
-  '@rollup/rollup-darwin-x64@4.60.4':
-    resolution: {integrity: sha512-CSKq7MsP+5PFIcydhAiR1K0UhEI1A2jWXVKHPCBZ151yOutENwvnPocgVHkivu2kviURtCEB6zUQw0vs8RrhMg==}
+  '@rollup/rollup-darwin-x64@4.34.9':
+    resolution: {integrity: sha512-eOojSEAi/acnsJVYRxnMkPFqcxSMFfrw7r2iD9Q32SGkb/Q9FpUY1UlAu1DH9T7j++gZ0lHjnm4OyH2vCI7l7Q==}
     cpu: [x64]
     os: [darwin]
 
-  '@rollup/rollup-freebsd-arm64@4.60.4':
-    resolution: {integrity: sha512-+O8OkVdyvXMtJEciu2wS/pzm1IxntEEQx3z5TAVy4l32G0etZn+RsA48ARRrFm6Ri8fvqPQfgrvNxSjKAbnd3g==}
+  '@rollup/rollup-freebsd-arm64@4.34.9':
+    resolution: {integrity: sha512-2lzjQPJbN5UnHm7bHIUKFMulGTQwdvOkouJDpPysJS+QFBGDJqcfh+CxxtG23Ik/9tEvnebQiylYoazFMAgrYw==}
     cpu: [arm64]
     os: [freebsd]
 
-  '@rollup/rollup-freebsd-x64@4.60.4':
-    resolution: {integrity: sha512-Iw3oMskH3AfNuhU0MSN7vNbdi4me/NiYo2azqPz/Le16zHSa+3RRmliCMWWQmh4lcndccU40xcJuTYJZxNo/lw==}
+  '@rollup/rollup-freebsd-x64@4.34.9':
+    resolution: {integrity: sha512-SLl0hi2Ah2H7xQYd6Qaiu01kFPzQ+hqvdYSoOtHYg/zCIFs6t8sV95kaoqjzjFwuYQLtOI0RZre/Ke0nPaQV+g==}
     cpu: [x64]
     os: [freebsd]
 
-  '@rollup/rollup-linux-arm-gnueabihf@4.60.4':
-    resolution: {integrity: sha512-EIPRXTVQpHyF8WOo219AD2yEltPehLTcTMz2fn6JsatLYSzQf00hj3rulF+yauOlF9/FtM2WpkT/hJh/KJFGhA==}
+  '@rollup/rollup-linux-arm-gnueabihf@4.34.9':
+    resolution: {integrity: sha512-88I+D3TeKItrw+Y/2ud4Tw0+3CxQ2kLgu3QvrogZ0OfkmX/DEppehus7L3TS2Q4lpB+hYyxhkQiYPJ6Mf5/dPg==}
     cpu: [arm]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-arm-musleabihf@4.60.4':
-    resolution: {integrity: sha512-J3Yh9PzzF1Ovah2At+lHiGQdsYgArxBbXv/zHfSyaiFQEqvNv7DcW98pCrmdjCZBrqBiKrKKe2V+aaSGWuBe/w==}
+  '@rollup/rollup-linux-arm-musleabihf@4.34.9':
+    resolution: {integrity: sha512-3qyfWljSFHi9zH0KgtEPG4cBXHDFhwD8kwg6xLfHQ0IWuH9crp005GfoUUh/6w9/FWGBwEHg3lxK1iHRN1MFlA==}
     cpu: [arm]
     os: [linux]
-    libc: [musl]
 
-  '@rollup/rollup-linux-arm64-gnu@4.60.4':
-    resolution: {integrity: sha512-BFDEZMYfUvLn37ONE1yMBojPxnMlTFsdyNoqncT0qFq1mAfllL+ATMMJd8TeuVMiX84s1KbcxcZbXInmcO2mRg==}
+  '@rollup/rollup-linux-arm64-gnu@4.34.9':
+    resolution: {integrity: sha512-6TZjPHjKZUQKmVKMUowF3ewHxctrRR09eYyvT5eFv8w/fXarEra83A2mHTVJLA5xU91aCNOUnM+DWFMSbQ0Nxw==}
     cpu: [arm64]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-arm64-musl@4.60.4':
-    resolution: {integrity: sha512-pc9EYOSlOgdQ2uPl1o9PF6/kLSgaUosia7gOuS8mB69IxJvlclko1MECXysjs5ryez1/5zjYqx3+xYU0TU6R1A==}
+  '@rollup/rollup-linux-arm64-musl@4.34.9':
+    resolution: {integrity: sha512-LD2fytxZJZ6xzOKnMbIpgzFOuIKlxVOpiMAXawsAZ2mHBPEYOnLRK5TTEsID6z4eM23DuO88X0Tq1mErHMVq0A==}
     cpu: [arm64]
     os: [linux]
-    libc: [musl]
 
-  '@rollup/rollup-linux-loong64-gnu@4.60.4':
-    resolution: {integrity: sha512-NxnomyxYerDh5n4iLrNa+sH+Z+U4BMEE46V2PgQ/hoB909i8gV1M5wPojWg9fk1jWpO3IQnOs20K4wyZuFLEFQ==}
+  '@rollup/rollup-linux-loongarch64-gnu@4.34.9':
+    resolution: {integrity: sha512-dRAgTfDsn0TE0HI6cmo13hemKpVHOEyeciGtvlBTkpx/F65kTvShtY/EVyZEIfxFkV5JJTuQ9tP5HGBS0hfxIg==}
     cpu: [loong64]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-loong64-musl@4.60.4':
-    resolution: {integrity: sha512-nbJnQ8a3z1mtmrwImCYhc6BGpThAyYVRQxw9uKSKG4wR6aAYno9sVjJ0zaZcW9BPJX1GbrDPf+SvdWjgTuDmnw==}
-    cpu: [loong64]
-    os: [linux]
-    libc: [musl]
-
-  '@rollup/rollup-linux-ppc64-gnu@4.60.4':
-    resolution: {integrity: sha512-2EU6acNrQLd8tYvo/LXW535wupT3m6fo7HKo6lr7ktQoItxTyOL1ZCR/GfGCuXl2vR+zmfI6eRXkSemafv+iVg==}
+  '@rollup/rollup-linux-powerpc64le-gnu@4.34.9':
+    resolution: {integrity: sha512-PHcNOAEhkoMSQtMf+rJofwisZqaU8iQ8EaSps58f5HYll9EAY5BSErCZ8qBDMVbq88h4UxaNPlbrKqfWP8RfJA==}
     cpu: [ppc64]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-ppc64-musl@4.60.4':
-    resolution: {integrity: sha512-WeBtoMuaMxiiIrO2IYP3xs6GMWkJP2C0EoT8beTLkUPmzV1i/UcOSVw1d5r9KBODtHKilG5yFxsGRnBbK3wJ4A==}
-    cpu: [ppc64]
-    os: [linux]
-    libc: [musl]
-
-  '@rollup/rollup-linux-riscv64-gnu@4.60.4':
-    resolution: {integrity: sha512-FJHFfqpKUI3A10WrWKiFbBZ7yVbGT4q4B5o1qKFFojqpaYoh9LrQgqWCmmcxQzVSXYtyB5bzkXrYzlHTs21MYA==}
+  '@rollup/rollup-linux-riscv64-gnu@4.34.9':
+    resolution: {integrity: sha512-Z2i0Uy5G96KBYKjeQFKbbsB54xFOL5/y1P5wNBsbXB8yE+At3oh0DVMjQVzCJRJSfReiB2tX8T6HUFZ2k8iaKg==}
     cpu: [riscv64]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-riscv64-musl@4.60.4':
-    resolution: {integrity: sha512-mcEl6CUT5IAUmQf1m9FYSmVqCJlpQ8r8eyftFUHG8i9OhY7BkBXSUdnLH5DOf0wCOjcP9v/QO93zpmF1SptCCw==}
-    cpu: [riscv64]
-    os: [linux]
-    libc: [musl]
-
-  '@rollup/rollup-linux-s390x-gnu@4.60.4':
-    resolution: {integrity: sha512-ynt3JxVd2w2buzoKDWIyiV1pJW93xlQic1THVLXilz429oijRpSHivZAgp65KBu+cMcgf1eVVjdnTLvPxgCuoQ==}
+  '@rollup/rollup-linux-s390x-gnu@4.34.9':
+    resolution: {integrity: sha512-U+5SwTMoeYXoDzJX5dhDTxRltSrIax8KWwfaaYcynuJw8mT33W7oOgz0a+AaXtGuvhzTr2tVKh5UO8GVANTxyQ==}
     cpu: [s390x]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-x64-gnu@4.60.4':
-    resolution: {integrity: sha512-Boiz5+MsaROEWDf+GGEwF8VMHGhlUoQMtIPjOgA5fv4osupqTVnJteQNKJwUcnUog2G55jYXH7KZFFiJe0TEzQ==}
+  '@rollup/rollup-linux-x64-gnu@4.34.9':
+    resolution: {integrity: sha512-FwBHNSOjUTQLP4MG7y6rR6qbGw4MFeQnIBrMe161QGaQoBQLqSUEKlHIiVgF3g/mb3lxlxzJOpIBhaP+C+KP2A==}
     cpu: [x64]
     os: [linux]
-    libc: [glibc]
 
-  '@rollup/rollup-linux-x64-musl@4.60.4':
-    resolution: {integrity: sha512-+qfSY27qIrFfI/Hom04KYFw3GKZSGU4lXus51wsb5EuySfFlWRwjkKWoE9emgRw/ukoT4Udsj4W/+xxG8VbPKg==}
+  '@rollup/rollup-linux-x64-musl@4.34.9':
+    resolution: {integrity: sha512-cYRpV4650z2I3/s6+5/LONkjIz8MBeqrk+vPXV10ORBnshpn8S32bPqQ2Utv39jCiDcO2eJTuSlPXpnvmaIgRA==}
     cpu: [x64]
     os: [linux]
-    libc: [musl]
 
-  '@rollup/rollup-openbsd-x64@4.60.4':
-    resolution: {integrity: sha512-VpTfOPHgVXEBeeR8hZ2O0F3aSso+JDWqTWmTmzcQKted54IAdUVbxE+j/MVxUsKa8L20HJhv3vUezVPoquqWjA==}
-    cpu: [x64]
-    os: [openbsd]
-
-  '@rollup/rollup-openharmony-arm64@4.60.4':
-    resolution: {integrity: sha512-IPOsh5aRYuLv/nkU51X10Bf75Bsf6+gZdx1X+QP5QM6lIJFHHqbHLG0uJn/hWthzo13UAc2umiUorqZy3axoZg==}
-    cpu: [arm64]
-    os: [openharmony]
-
-  '@rollup/rollup-win32-arm64-msvc@4.60.4':
-    resolution: {integrity: sha512-4QzE9E81OohJ/HKzHhsqU+zcYYojVOXlFMs1DdyMT6qXl/niOH7AVElmmEdUNHHS/oRkc++d5k6Vy85zFs0DEw==}
+  '@rollup/rollup-win32-arm64-msvc@4.34.9':
+    resolution: {integrity: sha512-z4mQK9dAN6byRA/vsSgQiPeuO63wdiDxZ9yg9iyX2QTzKuQM7T4xlBoeUP/J8uiFkqxkcWndWi+W7bXdPbt27Q==}
     cpu: [arm64]
     os: [win32]
 
-  '@rollup/rollup-win32-ia32-msvc@4.60.4':
-    resolution: {integrity: sha512-zTPgT1YuHHcd+Tmx7h8aml0FWFVelV5N54oHow9SLj+GfoDy/huQ+UV396N/C7KpMDMiPspRktzM1/0r1usYEA==}
+  '@rollup/rollup-win32-ia32-msvc@4.34.9':
+    resolution: {integrity: sha512-KB48mPtaoHy1AwDNkAJfHXvHp24H0ryZog28spEs0V48l3H1fr4i37tiyHsgKZJnCmvxsbATdZGBpbmxTE3a9w==}
     cpu: [ia32]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-gnu@4.60.4':
-    resolution: {integrity: sha512-DRS4G7mi9lJxqEDezIkKCaUIKCrLUUDCUaCsTPCi/rtqaC6D/jjwslMQyiDU50Ka0JKpeXeRBFBAXwArY52vBw==}
+  '@rollup/rollup-win32-x64-msvc@4.34.9':
+    resolution: {integrity: sha512-AyleYRPU7+rgkMWbEh71fQlrzRfeP6SyMnRf9XX4fCdDPAJumdSBqYEcWPMzVQ4ScAl7E4oFfK0GUVn77xSwbw==}
     cpu: [x64]
     os: [win32]
 
-  '@rollup/rollup-win32-x64-msvc@4.60.4':
-    resolution: {integrity: sha512-QVTUovf40zgTqlFVrKA1uXMVvU2QWEFWfAH8Wdc48IxLvrJMQVMBRjuQyUpzZCDkakImib9eVazbWlC6ksWtJw==}
-    cpu: [x64]
-    os: [win32]
+  '@rtsao/scc@1.1.0':
+    resolution: {integrity: sha512-zt6OdqaDoOnJ1ZYsCYGt9YmWzDXl4vQdKTyJev62gFhRGKdx7mcT54V9KIjg+d2wi9EXsPvAPKe7i7WjfVWB8g==}
 
-  '@rspack/binding-darwin-arm64@2.0.2':
-    resolution: {integrity: sha512-0o7lbgBBsDlICWdjIH0q3e0BsSco4GRiImHWVfZSVEG+q2+ykZJvSvYCVhPM1Co375Z0S3VMPa/8SjcY1FHwlw==}
-    cpu: [arm64]
-    os: [darwin]
+  '@rushstack/eslint-patch@1.10.4':
+    resolution: {integrity: sha512-WJgX9nzTqknM393q1QJDJmoW28kUfEnybeTfVNcNAPnIx210RXm2DiXiHzfNPJNIUUb1tJnz/l4QGtJ30PgWmA==}
 
-  '@rspack/binding-darwin-x64@2.0.2':
-    resolution: {integrity: sha512-tOwxZpoPlTlRs/w6UyUinXJ4TYRVHMlR7+eQxO1R3muKpixvhXQjtvoaY16HuFyTVky5F0IfOoWr3x9FEsgdLg==}
-    cpu: [x64]
-    os: [darwin]
-
-  '@rspack/binding-linux-arm64-gnu@2.0.2':
-    resolution: {integrity: sha512-1ZD4YFhG1rmgqj+W8hfwHyKV8xDxGsc/3KgU0FwmiVEX7JfzhCkgBO/xlCG79kRKSrzuVzt4icO/G3cCKn0pag==}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
-  '@rspack/binding-linux-arm64-musl@2.0.2':
-    resolution: {integrity: sha512-/PtTkM/DsDLjeuXTmeJeRfbjCDbcL9jvoVgZrgxYFZ28y2cdLvbChbW9uigOzs5dQEs1CIBQXMTTj7KhdBTuQg==}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
-  '@rspack/binding-linux-x64-gnu@2.0.2':
-    resolution: {integrity: sha512-bBjsZxMHRaPo6X9SokApm6ucs+UhXtAJFyJJyuk2BH4XJsLeCU9Dz1vMwioeohFbJUUeTASVPm6/BL+RhSaunw==}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
-  '@rspack/binding-linux-x64-musl@2.0.2':
-    resolution: {integrity: sha512-HjlpInqzabDNkhVsUJpsHPqa9QYVWBViJoyWNjzXCAW0vKMDvwaphyUvokSinX8FGTlZi/sr5UEaHJo6XtQ35g==}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
-  '@rspack/binding-wasm32-wasi@2.0.2':
-    resolution: {integrity: sha512-YaRYNFLJRpkGfYjSWR7n9f+nQKtrlmrrffpAn/blc2geHcRvXoBc5SCs1idPtsLhj7H9qWWhs7ucjyHy4csWFg==}
-    cpu: [wasm32]
-
-  '@rspack/binding-win32-arm64-msvc@2.0.2':
-    resolution: {integrity: sha512-d/3kTEKq+asLjRFPO96t+wfWiM7DLN76VQEPDD9bc1kdsZXlVJBuvyXfsgK8bbEvKplWXYcSsokhmEnuXrLOpg==}
-    cpu: [arm64]
-    os: [win32]
-
-  '@rspack/binding-win32-ia32-msvc@2.0.2':
-    resolution: {integrity: sha512-161cWineq3RW+Jdm1FAfSpXeUtYWvhB3kAbm46vNT9h/YYz+spwsFMvveAZ1nsVSVL0IC5lDBGUte7yUAY8K2g==}
-    cpu: [ia32]
-    os: [win32]
-
-  '@rspack/binding-win32-x64-msvc@2.0.2':
-    resolution: {integrity: sha512-y7Q0S1FE+OlkL5GMqLG0PwxrPw6E1r892KhGrGKE1Vdufe5YTEx6xTPxzZ+b7N2KPD7s9G1/iJmWHQxb1+Bjkg==}
-    cpu: [x64]
-    os: [win32]
-
-  '@rspack/binding@2.0.2':
-    resolution: {integrity: sha512-0kZPplW9GWx8mfC6DfsaRY3QBIYPuUs42JfmSM6aSb8tMHZAXQeLeMB8M+h8i4SeI+aFtCgO6UuYGtyWf7+L+A==}
-
-  '@rspack/core@2.0.2':
-    resolution: {integrity: sha512-VM3UHOo26uC+4QSqY5tU1ybI7KuXY5rTof8nhFOaBY9SYau0Smvr+hMSAPmrmHwknB6dXT8yaNVxrj7I+qxE1Q==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    peerDependencies:
-      '@module-federation/runtime-tools': ^0.24.1 || ^2.0.0
-      '@swc/helpers': '>=0.5.1'
-    peerDependenciesMeta:
-      '@module-federation/runtime-tools':
-        optional: true
-      '@swc/helpers':
-        optional: true
-
-  '@sindresorhus/merge-streams@4.0.0':
-    resolution: {integrity: sha512-tlqY9xq5ukxTUZBmoOp+m61cqwQD5pHJtFY3Mn8CA8ps6yghLH/Hw8UPdqg4OLmFW3IFlcXnQNmo/dh8HzXYIQ==}
+  '@sindresorhus/merge-streams@2.3.0':
+    resolution: {integrity: sha512-LtoMMhxAlorcGhmFYI+LhPgbPZCkgP6ra1YL604EeF6U98pLlQ3iWIGMdWSC+vWmPBWBNgmDBAhnAobLROJmwg==}
     engines: {node: '>=18'}
 
-  '@standard-schema/spec@1.1.0':
-    resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
+  '@swc/counter@0.1.3':
+    resolution: {integrity: sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==}
 
   '@swc/helpers@0.5.15':
     resolution: {integrity: sha512-JQ5TuMi45Owi4/BIMAJBoSQoOJu12oOk/gADqlcUL9JEdHB8vyjUSsxqeNXnmXHjYKMi2WcYtezGEEhqUI/E2g==}
@@ -2114,200 +1925,169 @@ packages:
     peerDependencies:
       tailwindcss: '>=2.0.0 || >=3.0.0 || >=3.0.0-alpha.1'
 
-  '@tailwindcss/forms@0.5.11':
-    resolution: {integrity: sha512-h9wegbZDPurxG22xZSoWtdzc41/OlNEUQERNqI/0fOwa2aVlWGu7C35E/x6LDyD3lgtztFSSjKZyuVM0hxhbgA==}
+  '@tailwindcss/forms@0.5.10':
+    resolution: {integrity: sha512-utI1ONF6uf/pPNO68kmN1b8rEwNXv3czukalo8VtJH8ksIkZXr3Q3VYudZLkCsDd4Wku120uF02hYK25XGPorw==}
     peerDependencies:
       tailwindcss: '>=3.0.0 || >= 3.0.0-alpha.1 || >= 4.0.0-alpha.20 || >= 4.0.0-beta.1'
 
-  '@tailwindcss/typography@0.5.20':
-    resolution: {integrity: sha512-hwbzQuNUfcPvbegQFatVPl/MY/tcM9KLl963hQ5laJKPh81TEZ1+dNG9PirGvcaDBkp+BCshExAyKVPW91dozw==}
+  '@tailwindcss/typography@0.5.16':
+    resolution: {integrity: sha512-0wDLwCVF5V3x3b1SGXPCDcdsbDHMBe+lkFzBRaHeLvNi+nrrnZ1lA18u+OTWO8iSWU2GxUOCvlXtDuqftc1oiA==}
     peerDependencies:
-      tailwindcss: '>=3.0.0 || >=4.0.0 || insiders'
+      tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1'
 
-  '@turbo/darwin-64@2.10.8':
-    resolution: {integrity: sha512-po+7rfJfUnFXjWlcoN2RwhErgzCdRtBc1T26vYPcywHlggmCQiQe1uWaE4j+BibI2uY9/2pDoFzMN0rmSaPFOw==}
-    cpu: [x64]
-    os: [darwin]
+  '@types/babel__core@7.20.5':
+    resolution: {integrity: sha512-qoQprZvz5wQFJwMDqeseRXWv3rqMvhgpbXFfVyWhbx9X47POIA6i/+dXefEmZKoAgOaTdaIgNSMqMIU61yRyzA==}
 
-  '@turbo/darwin-arm64@2.10.8':
-    resolution: {integrity: sha512-+zB2btDJ00lnPRuqOvpVvgl4x34k/djZQGZTTCfjn7JgNCl8QFY5Njo5+dqkY1g/+9gbbsnAvWm9CmJg9ebcXA==}
-    cpu: [arm64]
-    os: [darwin]
+  '@types/babel__generator@7.6.8':
+    resolution: {integrity: sha512-ASsj+tpEDsEiFr1arWrlN6V3mdfjRMZt6LtK/Vp/kreFLnr5QH5+DhvD5nINYZXzwJvXeGq+05iUXcAzVrqWtw==}
 
-  '@turbo/linux-64@2.10.8':
-    resolution: {integrity: sha512-K1dxqiVisyN7cViVsfQLs6xscQbYuI8aO2nbUhFURDACgEDfZRdP/b4CCxeosBJpcMfhYyiibWqJorCnvz9kKg==}
-    cpu: [x64]
-    os: [android, linux]
+  '@types/babel__template@7.4.4':
+    resolution: {integrity: sha512-h/NUaSyG5EyxBIp8YRxo4RMe2/qQgvyowRwVMzhYhBCONbW8PUsg4lkFMrhgZhUe5z3L3MiLDuvyJ/CaPa2A8A==}
 
-  '@turbo/linux-arm64@2.10.8':
-    resolution: {integrity: sha512-Gi77ibVnrE1fEmvr+/wBD/yvRqhwp/RQuCp2+//lv1U1wNFFyVg0V7Wj8FG9FXPFAw5QHReo8rxc9+wBSDZjzA==}
-    cpu: [arm64]
-    os: [android, linux]
+  '@types/babel__traverse@7.20.6':
+    resolution: {integrity: sha512-r1bzfrm0tomOI8g1SzvCaQHo6Lcv6zu0EA+W2kHrt8dyrHQxGzBBL4kdkzIS+jBMV+EYcMAEAqXqYaLJq5rOZg==}
 
-  '@turbo/windows-64@2.10.8':
-    resolution: {integrity: sha512-znnLO1haJPYTHoKMKwlAvlkjRiYbbhBzME6wIGaMd+fwir23U6jVd1ecaTWWi1fbnRVqxMfgDBKseQ/hLKb83g==}
-    cpu: [x64]
-    os: [win32]
+  '@types/braces@3.0.5':
+    resolution: {integrity: sha512-SQFof9H+LXeWNz8wDe7oN5zu7ket0qwMu5vZubW4GCJ8Kkeh6nBWUz87+KTz/G3Kqsrp0j/W253XJb3KMEeg3w==}
 
-  '@turbo/windows-arm64@2.10.8':
-    resolution: {integrity: sha512-VN30vh3b3Czh2WzYHNTfF1FE0YMZ5aHsLO8dBMGHJewA6792wX6iJR8ZxlzFW6WdOu0gEAKIvlYhfyT81Wkm4Q==}
-    cpu: [arm64]
-    os: [win32]
+  '@types/bun@1.2.4':
+    resolution: {integrity: sha512-QtuV5OMR8/rdKJs213iwXDpfVvnskPXY/S0ZiFbsTjQZycuqPbMW8Gf/XhLfwE5njW8sxI2WjISURXPlHypMFA==}
 
-  '@tybys/wasm-util@0.10.3':
-    resolution: {integrity: sha512-F3fo1MYrRJYL3zER0OUOmkutjr1Vp23m7OsSgp7nq4SP6OqX6C/56XFIPAl5bt3zaBRjmW7SGz3u/6LwFpYcOg==}
-
-  '@types/bun@1.3.14':
-    resolution: {integrity: sha512-h1hFqFVcvAvD9j9K7ZW7vd82aSA+rTdznZa+5bwvCwqSB1jmmfLcbIWhOLx1/+boy/xmjgCs/OMUL8hRJSmnPw==}
-
-  '@types/chai@5.2.3':
-    resolution: {integrity: sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==}
-
-  '@types/deep-eql@4.0.2':
-    resolution: {integrity: sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==}
-
-  '@types/estree@1.0.8':
-    resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
-
-  '@types/estree@1.0.9':
-    resolution: {integrity: sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==}
+  '@types/estree@1.0.6':
+    resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==}
 
   '@types/json-schema@7.0.15':
     resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
 
-  '@types/node@22.20.1':
-    resolution: {integrity: sha512-EANqOCF9QFyra+4pfxUcX9STKJpCLjMbObVzljIJomAWSnuSIEAvyzEU53GaajbXJEgdh0iEcPL+DGvpUd4k1Q==}
+  '@types/json5@0.0.29':
+    resolution: {integrity: sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==}
 
-  '@types/node@25.9.1':
-    resolution: {integrity: sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg==}
+  '@types/node@20.14.13':
+    resolution: {integrity: sha512-+bHoGiZb8UiQ0+WEtmph2IWQCjIqg8MDZMAV+ppRRhUZnquF5mQkP/9vpSwJClEiSM/C7fZZExPzfU0vJTyp8w==}
 
   '@types/postcss-import@14.0.3':
     resolution: {integrity: sha512-raZhRVTf6Vw5+QbmQ7LOHSDML71A5rj4+EqDzAbrZPfxfoGzFxMHRCq16VlddGIZpHELw0BG4G0YE2ANkdZiIQ==}
 
-  '@types/react-dom@19.2.3':
-    resolution: {integrity: sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==}
+  '@types/react-dom@19.0.4':
+    resolution: {integrity: sha512-4fSQ8vWFkg+TGhePfUzVmat3eC14TXYSsiiDSLI0dVLsrm9gZFABjPy/Qu6TKgl1tq1Bu1yDsuQgY3A3DOjCcg==}
     peerDependencies:
-      '@types/react': ^19.2.0
+      '@types/react': ^19.0.0
 
-  '@types/react@19.2.15':
-    resolution: {integrity: sha512-eRwcGNHve+E8qtEQSSRl6urh+rFop4v8gm6O8rGv25CodbvFdLjA1vVQ1KkiFE0w0UPOnb8tDiFKL5lp0rtY5Q==}
+  '@types/react@19.0.10':
+    resolution: {integrity: sha512-JuRQ9KXLEjaUNjTWpzuR231Z2WpIwczOkBEIvbHNCzQefFIT0L8IqE6NV6ULLyC1SI/i234JnDoMkfg+RjQj2g==}
 
-  '@types/semver@7.8.0':
-    resolution: {integrity: sha512-1mAINjtQCXXeLkJ9ehXkwOcBpqtLxiVtKhpUf83DdRNdQKV0iXZpaHYqRr7nj+wvxuJzoAmAwXI+sCNMv1CzLQ==}
+  '@types/ws@8.5.12':
+    resolution: {integrity: sha512-3tPRkv1EtkDpzlgyKyI8pGsGZAGPEaXeu0DOj5DI25Ja91bdAYddYHbADRYVrZMRbfW+1l5YwXVDKohDJNQxkQ==}
 
-  '@vitejs/plugin-react@6.0.2':
-    resolution: {integrity: sha512-DlSMqo4WhThw4vB8Mpn0Woe9J+Jfq1geJ61AKW0QEgLzGMNwtIMdxbDUzLxcun8W7NbJO0e2Jg/Nxm3cCSVzzg==}
-    engines: {node: ^20.19.0 || >=22.12.0}
+  '@typescript-eslint/eslint-plugin@8.11.0':
+    resolution: {integrity: sha512-KhGn2LjW1PJT2A/GfDpiyOfS4a8xHQv2myUagTM5+zsormOmBlYsnQ6pobJ8XxJmh6hnHwa2Mbe3fPrDJoDhbA==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      '@rolldown/plugin-babel': ^0.1.7 || ^0.2.0
-      babel-plugin-react-compiler: ^1.0.0
-      vite: ^8.0.0
+      '@typescript-eslint/parser': ^8.0.0 || ^8.0.0-alpha.0
+      eslint: ^8.57.0 || ^9.0.0
+      typescript: '*'
     peerDependenciesMeta:
-      '@rolldown/plugin-babel':
-        optional: true
-      babel-plugin-react-compiler:
+      typescript:
         optional: true
 
-  '@vitest/expect@4.1.10':
-    resolution: {integrity: sha512-YsCn+qAk1GWjQOWFEsEcL2gNQ0zmVmQu3T03qP6UyjhtmdtwtbuI+DASn/7iQB3HGTXkdBwGddzxPlmiql5vlA==}
-
-  '@vitest/mocker@4.1.10':
-    resolution: {integrity: sha512-v0xaezt+DKEmKfaxg133ldzADrwLGd7Ze1MfQQTYfvs8OqZIwbxyxaYURivwV7sWy5fqn3rH5uOrSp07bp44Ow==}
+  '@typescript-eslint/parser@8.11.0':
+    resolution: {integrity: sha512-lmt73NeHdy1Q/2ul295Qy3uninSqi6wQI18XwSpm8w0ZbQXUpjCAWP1Vlv/obudoBiIjJVjlztjQ+d/Md98Yxg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
     peerDependencies:
-      msw: ^2.4.9
-      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
+      eslint: ^8.57.0 || ^9.0.0
+      typescript: '*'
     peerDependenciesMeta:
-      msw:
-        optional: true
-      vite:
+      typescript:
         optional: true
 
-  '@vitest/pretty-format@4.1.10':
-    resolution: {integrity: sha512-W1HsjSH4MXQ9YfmmhLAoIYf1HRfekQCGngeIgcei6MP5QQGWUe0gkopdZQaVCFO+JDJMrAJGwa5pRpNpvy4P8Q==}
+  '@typescript-eslint/scope-manager@8.11.0':
+    resolution: {integrity: sha512-Uholz7tWhXmA4r6epo+vaeV7yjdKy5QFCERMjs1kMVsLRKIrSdM6o21W2He9ftp5PP6aWOVpD5zvrvuHZC0bMQ==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@vitest/runner@4.1.10':
-    resolution: {integrity: sha512-IKI6kpIH+LmpROplyLwBBaCfMgOZOMsygVa6BARD6ahA04VRuJSa6OaVG7kRvSEMD870Vd91rSSw0eegtWyLGg==}
+  '@typescript-eslint/type-utils@8.11.0':
+    resolution: {integrity: sha512-ItiMfJS6pQU0NIKAaybBKkuVzo6IdnAhPFZA/2Mba/uBjuPQPet/8+zh5GtLHwmuFRShZx+8lhIs7/QeDHflOg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
 
-  '@vitest/snapshot@4.1.10':
-    resolution: {integrity: sha512-xRkfOT1qpTAi/Ti4Y1LtfRc3kEuqxGw59eN2jN9pRWMtS/XDevekhcFSqvQqjUNGksfjMJu3Y+oJ+4Ypn2OaJw==}
+  '@typescript-eslint/types@8.11.0':
+    resolution: {integrity: sha512-tn6sNMHf6EBAYMvmPUaKaVeYvhUsrE6x+bXQTxjQRp360h1giATU0WvgeEys1spbvb5R+VpNOZ+XJmjD8wOUHw==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@vitest/spy@4.1.10':
-    resolution: {integrity: sha512-PLf/Ugvoq5wO/b4rwYCR1h2PSIdXz7wnkQFMiUpLdtM7l6pqVFcQIBEHyT1+l+cj7mNwAfZHzqXqDyjvOuwbDw==}
+  '@typescript-eslint/typescript-estree@8.11.0':
+    resolution: {integrity: sha512-yHC3s1z1RCHoCz5t06gf7jH24rr3vns08XXhfEqzYpd6Hll3z/3g23JRi0jM8A47UFKNc3u/y5KIMx8Ynbjohg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    peerDependencies:
+      typescript: '*'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
 
-  '@vitest/utils@4.1.10':
-    resolution: {integrity: sha512-fy9am/HWxbaGt/Sawrp90vt6Y6jQwf1RX77cz3uwoJwJVMli/e1IEwRPnMNJ7vKfPTwo0diXifkpPvwH9v7nGA==}
+  '@typescript-eslint/utils@8.11.0':
+    resolution: {integrity: sha512-CYiX6WZcbXNJV7UNB4PLDIBtSdRmRI/nb0FMyqHPTQD1rMjA0foPLaPUV39C/MxkTd/QKSeX+Gb34PPsDVC35g==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    peerDependencies:
+      eslint: ^8.57.0 || ^9.0.0
 
-  '@webassemblyjs/ast@1.14.1':
-    resolution: {integrity: sha512-nuBEDgQfm1ccRp/8bCQrx1frohyufl4JlbMMZ4P1wpeOfDhF6FQkxZJ1b/e+PLwr6X1Nhw6OLme5usuBWYBvuQ==}
+  '@typescript-eslint/visitor-keys@8.11.0':
+    resolution: {integrity: sha512-EaewX6lxSjRJnc+99+dqzTeoDZUfyrA52d2/HRrkI830kgovWsmIiTfmr0NZorzqic7ga+1bS60lRBUgR3n/Bw==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
-  '@webassemblyjs/floating-point-hex-parser@1.13.2':
-    resolution: {integrity: sha512-6oXyTOzbKxGH4steLbLNOu71Oj+C8Lg34n6CqRvqfS2O71BxY6ByfMDRhBytzknj9yGUPVJ1qIKhRlAwO1AovA==}
+  '@vitejs/plugin-react@4.3.4':
+    resolution: {integrity: sha512-SCCPBJtYLdE8PX/7ZQAs1QAZ8Jqwih+0VBLum1EGqmCCQal+MIUqLCzj3ZUy8ufbC0cAM4LRlSTm7IQJwWT4ug==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      vite: ^4.2.0 || ^5.0.0 || ^6.0.0
 
-  '@webassemblyjs/helper-api-error@1.13.2':
-    resolution: {integrity: sha512-U56GMYxy4ZQCbDZd6JuvvNV/WFildOjsaWD3Tzzvmw/mas3cXzRJPMjP83JqEsgSbyrmaGjBfDtV7KDXV9UzFQ==}
+  '@vitest/expect@2.0.5':
+    resolution: {integrity: sha512-yHZtwuP7JZivj65Gxoi8upUN2OzHTi3zVfjwdpu2WrvCZPLwsJ2Ey5ILIPccoW23dd/zQBlJ4/dhi7DWNyXCpA==}
 
-  '@webassemblyjs/helper-buffer@1.14.1':
-    resolution: {integrity: sha512-jyH7wtcHiKssDtFPRB+iQdxlDf96m0E39yb0k5uJVhFGleZFoNw1c4aeIcVUPPbXUVJ94wwnMOAqUHyzoEPVMA==}
+  '@vitest/pretty-format@2.0.5':
+    resolution: {integrity: sha512-h8k+1oWHfwTkyTkb9egzwNMfJAEx4veaPSnMeKbVSjp4euqGSbQlm5+6VHwTr7u4FJslVVsUG5nopCaAYdOmSQ==}
 
-  '@webassemblyjs/helper-numbers@1.13.2':
-    resolution: {integrity: sha512-FE8aCmS5Q6eQYcV3gI35O4J789wlQA+7JrqTTpJqn5emA4U2hvwJmvFRC0HODS+3Ye6WioDklgd6scJ3+PLnEA==}
+  '@vitest/runner@2.0.5':
+    resolution: {integrity: sha512-TfRfZa6Bkk9ky4tW0z20WKXFEwwvWhRY+84CnSEtq4+3ZvDlJyY32oNTJtM7AW9ihW90tX/1Q78cb6FjoAs+ig==}
 
-  '@webassemblyjs/helper-wasm-bytecode@1.13.2':
-    resolution: {integrity: sha512-3QbLKy93F0EAIXLh0ogEVR6rOubA9AoZ+WRYhNbFyuB70j3dRdwH9g+qXhLAO0kiYGlg3TxDV+I4rQTr/YNXkA==}
+  '@vitest/snapshot@2.0.5':
+    resolution: {integrity: sha512-SgCPUeDFLaM0mIUHfaArq8fD2WbaXG/zVXjRupthYfYGzc8ztbFbu6dUNOblBG7XLMR1kEhS/DNnfCZ2IhdDew==}
 
-  '@webassemblyjs/helper-wasm-section@1.14.1':
-    resolution: {integrity: sha512-ds5mXEqTJ6oxRoqjhWDU83OgzAYjwsCV8Lo/N+oRsNDmx/ZDpqalmrtgOMkHwxsG0iI//3BwWAErYRHtgn0dZw==}
+  '@vitest/spy@2.0.5':
+    resolution: {integrity: sha512-c/jdthAhvJdpfVuaexSrnawxZz6pywlTPe84LUB2m/4t3rl2fTo9NFGBG4oWgaD+FTgDDV8hJ/nibT7IfH3JfA==}
 
-  '@webassemblyjs/ieee754@1.13.2':
-    resolution: {integrity: sha512-4LtOzh58S/5lX4ITKxnAK2USuNEvpdVV9AlgGQb8rJDHaLeHciwG4zlGr0j/SNWlr7x3vO1lDEsuePvtcDNCkw==}
+  '@vitest/utils@2.0.5':
+    resolution: {integrity: sha512-d8HKbqIcya+GR67mkZbrzhS5kKhtp8dQLcmRZLGTscGVg7yImT82cIrhtn2L8+VujWcy6KZweApgNmPsTAO/UQ==}
 
-  '@webassemblyjs/leb128@1.13.2':
-    resolution: {integrity: sha512-Lde1oNoIdzVzdkNEAWZ1dZ5orIbff80YPdHx20mrHwHrVNNTjNr8E3xz9BdpcGqRQbAEa+fkrCb+fRFTl/6sQw==}
+  acorn-jsx@5.3.2:
+    resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==}
+    peerDependencies:
+      acorn: ^6.0.0 || ^7.0.0 || ^8.0.0
 
-  '@webassemblyjs/utf8@1.13.2':
-    resolution: {integrity: sha512-3NQWGjKTASY1xV5m7Hr0iPeXD9+RDobLll3T9d2AO+g3my8xy5peVyjSag4I50mR1bBSN/Ct12lo+R9tJk0NZQ==}
-
-  '@webassemblyjs/wasm-edit@1.14.1':
-    resolution: {integrity: sha512-RNJUIQH/J8iA/1NzlE4N7KtyZNHi3w7at7hDjvRNm5rcUXa00z1vRz3glZoULfJ5mpvYhLybmVcwcjGrC1pRrQ==}
-
-  '@webassemblyjs/wasm-gen@1.14.1':
-    resolution: {integrity: sha512-AmomSIjP8ZbfGQhumkNvgC33AY7qtMCXnN6bL2u2Js4gVCg8fp735aEiMSBbDR7UQIj90n4wKAFUSEd0QN2Ukg==}
-
-  '@webassemblyjs/wasm-opt@1.14.1':
-    resolution: {integrity: sha512-PTcKLUNvBqnY2U6E5bdOQcSM+oVP/PmrDY9NzowJjislEjwP/C4an2303MCVS2Mg9d3AJpIGdUFIQQWbPds0Sw==}
-
-  '@webassemblyjs/wasm-parser@1.14.1':
-    resolution: {integrity: sha512-JLBl+KZ0R5qB7mCnud/yyX08jWFw5MsoalJ1pQ4EdFlgj9VdXKGuENGsiCIjegI1W7p91rUlcB/LB5yRJKNTcQ==}
-
-  '@webassemblyjs/wast-printer@1.14.1':
-    resolution: {integrity: sha512-kPSSXE6De1XOR820C90RIo2ogvZG+c3KiHzqUoO/F34Y2shGzesfqv7o57xrxovZJH/MetF5UjroJ/R/3isoiw==}
-
-  '@xtuc/ieee754@1.2.0':
-    resolution: {integrity: sha512-DX8nKgqcGwsc0eJSqYt5lwP4DH5FlHnmuWWBRy7X0NcaGR0ZtuyeESgMwTYVEtxmsNGY+qit4QYT/MIYTOTPeA==}
-
-  '@xtuc/long@4.2.2':
-    resolution: {integrity: sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ==}
-
-  acorn@8.16.0:
-    resolution: {integrity: sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==}
+  acorn@8.14.0:
+    resolution: {integrity: sha512-cl669nCJTZBsL97OF4kUQm5g5hC2uihk0NxY3WENAC0TYdILVkAyHymAntgxGkl7K+t0cXIrH5siy5S4XkFycA==}
     engines: {node: '>=0.4.0'}
     hasBin: true
 
-  ajv-formats@2.1.1:
-    resolution: {integrity: sha512-Wx0Kx52hxE7C18hkMEggYlEifqWZtYaRgouJor+WMdPnQyEK13vgEWyVNup7SoeeoLMsr4kf5h6dOW11I15MUA==}
-    peerDependencies:
-      ajv: ^8.0.0
-    peerDependenciesMeta:
-      ajv:
-        optional: true
+  ajv@6.12.6:
+    resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
 
-  ajv-keywords@5.1.0:
-    resolution: {integrity: sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==}
-    peerDependencies:
-      ajv: ^8.8.2
+  ansi-regex@5.0.1:
+    resolution: {integrity: sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==}
+    engines: {node: '>=8'}
 
-  ajv@8.20.0:
-    resolution: {integrity: sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==}
+  ansi-regex@6.0.1:
+    resolution: {integrity: sha512-n5M855fKb2SsfMIiFFoVrABHJC8QtHwVx+mHWP3QcEqBHYienj5dHSgjbxtC0WEZXYt4wcD6zrQElDPhFuZgfA==}
+    engines: {node: '>=12'}
+
+  ansi-styles@4.3.0:
+    resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
+    engines: {node: '>=8'}
+
+  ansi-styles@6.2.1:
+    resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
+    engines: {node: '>=12'}
 
   any-promise@1.3.0:
     resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==}
@@ -2322,48 +2102,105 @@ packages:
   argparse@2.0.1:
     resolution: {integrity: sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==}
 
+  aria-query@5.3.2:
+    resolution: {integrity: sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==}
+    engines: {node: '>= 0.4'}
+
+  array-buffer-byte-length@1.0.1:
+    resolution: {integrity: sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==}
+    engines: {node: '>= 0.4'}
+
+  array-includes@3.1.8:
+    resolution: {integrity: sha512-itaWrbYbqpGXkGhZPGUulwnhVf5Hpy1xiCFsGqyIGglbBxmG5vSjxQen3/WGOjPpNEv1RtBLKxbmVXm8HpJStQ==}
+    engines: {node: '>= 0.4'}
+
+  array.prototype.findlast@1.2.5:
+    resolution: {integrity: sha512-CVvd6FHg1Z3POpBLxO6E6zr+rSKEQ9L6rZHAaY7lLfhKsWYUBBOuMs0e9o24oopj6H+geRCX0YJ+TJLBK2eHyQ==}
+    engines: {node: '>= 0.4'}
+
+  array.prototype.findlastindex@1.2.5:
+    resolution: {integrity: sha512-zfETvRFA8o7EiNn++N5f/kaCw221hrpGsDmcpndVupkPzEc1Wuf3VgC0qby1BbHs7f5DVYjgtEU2LLh5bqeGfQ==}
+    engines: {node: '>= 0.4'}
+
+  array.prototype.flat@1.3.2:
+    resolution: {integrity: sha512-djYB+Zx2vLewY8RWlNCUdHjDXs2XOgm602S9E7P/UpHgfeHL00cRiIF+IN/G/aUJ7kGPb6yO/ErDI5V2s8iycA==}
+    engines: {node: '>= 0.4'}
+
+  array.prototype.flatmap@1.3.2:
+    resolution: {integrity: sha512-Ewyx0c9PmpcsByhSW4r+9zDU7sGjFc86qf/kKtuSCRdhfbk0SNLLkaT5qvcHnRGgc5NP/ly/y+qkXkqONX54CQ==}
+    engines: {node: '>= 0.4'}
+
+  array.prototype.tosorted@1.1.4:
+    resolution: {integrity: sha512-p6Fx8B7b7ZhL/gmUsAy0D15WhvDccw3mnGNbZpi3pmeJdxtWsj2jEaI4Y6oo3XiHfzuSgPwKc04MYt6KgvC/wA==}
+    engines: {node: '>= 0.4'}
+
+  arraybuffer.prototype.slice@1.0.3:
+    resolution: {integrity: sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==}
+    engines: {node: '>= 0.4'}
+
   assertion-error@2.0.1:
     resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
     engines: {node: '>=12'}
 
-  autoprefixer@10.5.0:
-    resolution: {integrity: sha512-FMhOoZV4+qR6aTUALKX2rEqGG+oyATvwBt9IIzVR5rMa2HRWPkxf+P+PAJLD1I/H5/II+HuZcBJYEFBpq39ong==}
+  ast-types-flow@0.0.8:
+    resolution: {integrity: sha512-OH/2E5Fg20h2aPrbe+QL8JZQFko0YZaF+j4mnQ7BGhfavO7OpSLa8a0y9sBwomHdSbkhTS8TQNayBfnW5DwbvQ==}
+
+  autoprefixer@10.4.21:
+    resolution: {integrity: sha512-O+A6LWV5LDHSJD3LjHYoNi4VLsj/Whi7k6zG12xTYaU4cQ8oxQGckXNX8cRHK5yOZ/ppVHe0ZBXGzSV9jXdVbQ==}
     engines: {node: ^10 || ^12 || >=14}
     hasBin: true
     peerDependencies:
       postcss: ^8.1.0
 
-  baseline-browser-mapping@2.10.31:
-    resolution: {integrity: sha512-MujYO3eP72uvmSE0i4wltsodRfIpZATP3jvzRNRGGxgzId7aVocVJJV3nf01qnzzKFGxQVC9bpWxl5cjxTr/7Q==}
-    engines: {node: '>=6.0.0'}
-    hasBin: true
+  available-typed-arrays@1.0.7:
+    resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
+    engines: {node: '>= 0.4'}
 
-  before-after-hook@4.0.0:
-    resolution: {integrity: sha512-q6tR3RPqIB1pMiTRMFcZwuG5T8vwp+vUvEG0vuI6B+Rikh5BfPp2fQ82c925FOs+b0lcFQ8CFrL+KbilfZFhOQ==}
+  axe-core@4.10.2:
+    resolution: {integrity: sha512-RE3mdQ7P3FRSe7eqCWoeQ/Z9QXrtniSjp1wUjt5nRC3WIpz5rSCve6o3fsZ2aCpJtrZjSZgjwXAoTO5k4tEI0w==}
+    engines: {node: '>=4'}
+
+  axobject-query@4.1.0:
+    resolution: {integrity: sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==}
+    engines: {node: '>= 0.4'}
+
+  balanced-match@1.0.2:
+    resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
 
   binary-extensions@2.3.0:
     resolution: {integrity: sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==}
     engines: {node: '>=8'}
 
+  brace-expansion@1.1.11:
+    resolution: {integrity: sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==}
+
+  brace-expansion@2.0.1:
+    resolution: {integrity: sha512-XnAIvQ8eM+kC6aULx6wuQiwVsnzsi9d3WxzV3FpWTGA19F621kwdbsAcFKXgKUHZWsy+mY6iL1sHTxWEFCytDA==}
+
   braces@3.0.3:
     resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
     engines: {node: '>=8'}
 
-  browserslist@4.28.2:
-    resolution: {integrity: sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==}
+  browserslist@4.24.2:
+    resolution: {integrity: sha512-ZIc+Q62revdMcqC6aChtW4jz3My3klmCO1fEmINZY/8J3EpBg5/A/D0AKmBveUh6pgoeycoMkVMko84tuYS+Gg==}
+    engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
+    hasBin: true
+
+  browserslist@4.24.4:
+    resolution: {integrity: sha512-KDi1Ny1gSePi1vm0q4oxSF8b4DR44GF4BbmS2YdhPLOEqd8pDviZOGH/GsmRwoWJ2+5Lr085X7naowMwKHDG1A==}
     engines: {node: ^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7}
     hasBin: true
 
   buffer-from@1.1.2:
     resolution: {integrity: sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==}
 
-  bun-types@1.3.14:
-    resolution: {integrity: sha512-4N0ig0fEomHt5R0KCFWjovxow98rIoRwKolrYdCcknNwMekCXRnWEUvgu5soYV8QXtVsrUD8B95MBOZGPvr6KQ==}
+  bun-types@1.2.4:
+    resolution: {integrity: sha512-nDPymR207ZZEoWD4AavvEaa/KZe/qlrbMSchqpQwovPZCKc7pwMoENjEtHgMKaAjJhy+x6vfqSBA1QU3bJgs0Q==}
 
-  bun@1.3.14:
-    resolution: {integrity: sha512-aB6GVd42x1Y5ie1K16SF+oLGtgSkwX9hgoDdIW88pjvfTccU8F1vfpoOt34QLv0dZ1v3XimtaxPlZUG81Gx9Zg==}
-    cpu: [arm64, x64]
-    os: [darwin, linux, android, freebsd, win32]
+  bun@1.2.4:
+    resolution: {integrity: sha512-ZY0EZ/UKqheaLeAtMsfJA6jWoWvV9HAtfFaOJSmS3LrNpFKs1Sg5fZLSsczN1h3a+Dtheo4O3p3ZYWrf40kRGw==}
+    cpu: [arm64, x64, aarch64]
+    os: [darwin, linux, win32]
     hasBin: true
 
   bundle-require@5.1.0:
@@ -2372,23 +2209,40 @@ packages:
     peerDependencies:
       esbuild: '>=0.18'
 
+  busboy@1.6.0:
+    resolution: {integrity: sha512-8SFQbg/0hQ9xy3UNTB0YEnsNBbWfhf7RtnzpL7TkBiTBRfrQ9Fxcnz7VJsleJpyp6rVLvXiuORqjlHi5q+PYuA==}
+    engines: {node: '>=10.16.0'}
+
   cac@6.7.14:
     resolution: {integrity: sha512-b6Ilus+c3RrdDk+JhLKUAQfzzgLEPy6wcXqS7f/xe1EETvsDP6GORG7SFuOs6cID5YkqchW/LXZbX5bc8j7ZcQ==}
     engines: {node: '>=8'}
 
+  call-bind@1.0.7:
+    resolution: {integrity: sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==}
+    engines: {node: '>= 0.4'}
+
+  callsites@3.1.0:
+    resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
+    engines: {node: '>=6'}
+
   camelcase-css@2.0.1:
     resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
     engines: {node: '>= 6'}
 
-  caniuse-lite@1.0.30001793:
-    resolution: {integrity: sha512-iwSsYWaCOoh26cV8NwNRViHlrfUvYsHDfRVcbtmw0Kg6PJIZZXwMkj1442FYLBGkeUf1juAsU3DTfxW579mrPA==}
+  caniuse-lite@1.0.30001705:
+    resolution: {integrity: sha512-S0uyMMiYvA7CxNgomYBwwwPUnWzFD83f3B1ce5jHUfHTH//QL6hHsreI8RVC5606R4ssqravelYO5TU6t8sEyg==}
 
-  chai@6.2.2:
-    resolution: {integrity: sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==}
-    engines: {node: '>=18'}
+  chai@5.1.1:
+    resolution: {integrity: sha512-pT1ZgP8rPNqUgieVaEY+ryQr6Q4HXNg8Ei9UnLUrjN4IA7dvQC5JB+/kxVcPNDHyBcc/26CXPkbNzq3qwrOEKA==}
+    engines: {node: '>=12'}
 
-  chardet@2.1.1:
-    resolution: {integrity: sha512-PsezH1rqdV9VvyNhxxOW32/d75r01NY7TQCmOqomRo15ZSOKbpTFVsfjghxo6JloQUCGnH4k1LGu0R4yCLlWQQ==}
+  chalk@4.1.2:
+    resolution: {integrity: sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==}
+    engines: {node: '>=10'}
+
+  check-error@2.1.1:
+    resolution: {integrity: sha512-OAlb+T7V4Op9OwdkjmguYRqncdlx5JiofwOAUkmTF+jNdHwzTaTs4sRAGpzLF3oOz5xAyDGrPgeIDFQmDOTiJw==}
+    engines: {node: '>= 16'}
 
   chokidar@3.6.0:
     resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
@@ -2398,27 +2252,29 @@ packages:
     resolution: {integrity: sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==}
     engines: {node: '>= 14.16.0'}
 
-  chrome-trace-event@1.0.4:
-    resolution: {integrity: sha512-rNjApaLzuwaOTjCiT8lSDdGN1APCiqkChLMJxJPWLunPAt5fy8xgU9/jNOchV84wfIxrA0lRQB7oCT8jrn/wrQ==}
-    engines: {node: '>=6.0'}
-
-  citty@0.2.2:
-    resolution: {integrity: sha512-+6vJA3L98yv+IdfKGZHBNiGW5KHn22e/JwID0Strsz8h4S/csAu/OuICwxrg44k5MRiZHWIo8XXuJgQTriRP4w==}
-
-  cli-width@4.1.0:
-    resolution: {integrity: sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==}
-    engines: {node: '>= 12'}
+  citty@0.1.6:
+    resolution: {integrity: sha512-tskPPKEs8D2KPafUypv2gxwJP8h/OaJmC82QQGGDQcHvXX43xF2VDACcJVmZ0EuSxkpO9Kc4MlrA3q0+FG58AQ==}
 
   client-only@0.0.1:
     resolution: {integrity: sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==}
 
-  clipanion@4.0.0-rc.4:
-    resolution: {integrity: sha512-CXkMQxU6s9GklO/1f714dkKBMu1lopS1WFF0B8o4AxPykR1hpozxSiUZ5ZUeBjfPgCWqbcNOtZVFhB8Lkfp1+Q==}
-    peerDependencies:
-      typanion: '*'
+  clipboardy@4.0.0:
+    resolution: {integrity: sha512-5mOlNS0mhX0707P2I0aZ2V/cmHUEO/fL7VFLqszkhUsxt7RwnmrInf/eEQKlf5GzvYeHIjT+Ov1HRfNmymlG0w==}
+    engines: {node: '>=18'}
 
-  colorette@2.0.20:
-    resolution: {integrity: sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==}
+  color-convert@2.0.1:
+    resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
+    engines: {node: '>=7.0.0'}
+
+  color-name@1.1.4:
+    resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
+
+  color-string@1.9.1:
+    resolution: {integrity: sha512-shrVawQFojnZv6xM40anx4CkoDP+fZsw/ZerEMsW/pyzsRbElpsL/DBVW7q3ExxwusdNXI3lXpuhEZkzs8p5Eg==}
+
+  color@4.2.3:
+    resolution: {integrity: sha512-1rXeuUUiGGrykh+CeBdu5Ie7OJwinCgQY0bc7GCRxy5xVHy+moaqkpL/jqQq0MtQOeYcrqEz4abc5f0KtU7W4A==}
+    engines: {node: '>=12.5.0'}
 
   commander@2.20.3:
     resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==}
@@ -2427,44 +2283,69 @@ packages:
     resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==}
     engines: {node: '>= 6'}
 
+  concat-map@0.0.1:
+    resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
+
   confbox@0.1.8:
     resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==}
 
-  consola@3.4.2:
-    resolution: {integrity: sha512-5IKcdX0nnYavi6G7TtOhwkYzyjfJlatbjMjuLSfE2kYT5pMDOilZ4OvMhi637CcDICTmz3wARPoyhqyX1Y+XvA==}
+  consola@3.2.3:
+    resolution: {integrity: sha512-I5qxpzLv+sJhTVEoLYNcTW+bThDCPsit0vLNKShZx6rLtpilNpmmeTPaeqJb9ZE9dV3DGaeby6Vuhrw38WjeyQ==}
     engines: {node: ^14.18.0 || >=16.10.0}
 
-  content-type@2.0.0:
-    resolution: {integrity: sha512-j/O/d7GcZCyNl7/hwZAb606rzqkyvaDctLmckbxLzHvFBzTJHuGEdodATcP3yIRoDrLHkIATJuvzbFlp/ki2cQ==}
-    engines: {node: '>=18'}
+  consola@3.4.0:
+    resolution: {integrity: sha512-EiPU8G6dQG0GFHNR8ljnZFki/8a+cQwEQ+7wpxdChl02Q8HXlwEZWD5lqAF8vC2sEC3Tehr8hy7vErz88LHyUA==}
+    engines: {node: ^14.18.0 || >=16.10.0}
 
   convert-source-map@2.0.0:
     resolution: {integrity: sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==}
 
-  cookie-es@1.2.3:
-    resolution: {integrity: sha512-lXVyvUvrNXblMqzIRrxHb57UUVmqsSWlxqt3XIjCkUP0wDAf6uicO6KMbEgYrMNtEvWgWHwe42CKxPu9MYAnWw==}
+  cookie-es@1.2.2:
+    resolution: {integrity: sha512-+W7VmiVINB+ywl1HGXJXmrqkOhpKrIiVZV6tQuV54ZyQC7MMuBt81Vc336GMLoHBq5hV/F9eXgt5Mnx0Rha5Fg==}
 
-  crossws@0.3.5:
-    resolution: {integrity: sha512-ojKiDvcmByhwa8YYqbQI/hg7MEU0NC03+pSdEq4ZUnZR9xXpwk7E43SMNGkn+JxJGPFtNvQ48+vV2p+P1ml5PA==}
+  cross-spawn@7.0.6:
+    resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
+    engines: {node: '>= 8'}
 
-  crossws@0.4.10:
-    resolution: {integrity: sha512-pz3oubH/dt12KjqsUB0IuXW4nwRDQ583iDsP4555Cpdqx0NoU7pGlWBcayyFI8f/l/idRpgjMEfwuOxSWJYlIA==}
-    peerDependencies:
-      srvx: '>=0.11.5'
-    peerDependenciesMeta:
-      srvx:
-        optional: true
+  crossws@0.3.1:
+    resolution: {integrity: sha512-HsZgeVYaG+b5zA+9PbIPGq4+J/CJynJuearykPsXx4V/eMhyQ5EDVg3Ak2FBZtVXCiOLu/U7IiwDHTr9MA+IKw==}
+
+  crossws@0.3.4:
+    resolution: {integrity: sha512-uj0O1ETYX1Bh6uSgktfPvwDiPYGQ3aI4qVsaC/LWpkIzGj1nUYm5FK3K+t11oOlpN01lGbprFCH4wBlKdJjVgw==}
 
   cssesc@3.0.0:
     resolution: {integrity: sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==}
     engines: {node: '>=4'}
     hasBin: true
 
-  csstype@3.2.3:
-    resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==}
+  csstype@3.1.3:
+    resolution: {integrity: sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==}
 
-  debug@4.4.3:
-    resolution: {integrity: sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==}
+  damerau-levenshtein@1.0.8:
+    resolution: {integrity: sha512-sdQSFB7+llfUcQHUQO3+B8ERRj0Oa4w9POWMI/puGtuf7gFywGmkaLCElnudfTiKZV+NvHqL0ifzdrI8Ro7ESA==}
+
+  data-view-buffer@1.0.1:
+    resolution: {integrity: sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==}
+    engines: {node: '>= 0.4'}
+
+  data-view-byte-length@1.0.1:
+    resolution: {integrity: sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==}
+    engines: {node: '>= 0.4'}
+
+  data-view-byte-offset@1.0.0:
+    resolution: {integrity: sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==}
+    engines: {node: '>= 0.4'}
+
+  debug@3.2.7:
+    resolution: {integrity: sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
+  debug@4.3.6:
+    resolution: {integrity: sha512-O/09Bd4Z1fBrU4VzkhFqVgpPzaGbw6Sm9FEkBT1A/YBXQFGuuSxa1dN2nxgxS34JmKXqYx8CZAwEVoJFImUXIg==}
     engines: {node: '>=6.0'}
     peerDependencies:
       supports-color: '*'
@@ -2472,27 +2353,51 @@ packages:
       supports-color:
         optional: true
 
-  dedent@1.7.2:
-    resolution: {integrity: sha512-WzMx3mW98SN+zn3hgemf4OzdmyNhhhKz5Ay0pUfQiMQ3e1g+xmTJWp/pKdwKVXhdSkAEGIIzqeuWrL3mV/AXbA==}
+  debug@4.4.0:
+    resolution: {integrity: sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==}
+    engines: {node: '>=6.0'}
+    peerDependencies:
+      supports-color: '*'
+    peerDependenciesMeta:
+      supports-color:
+        optional: true
+
+  dedent@1.5.3:
+    resolution: {integrity: sha512-NHQtfOOW68WD8lgypbLA5oT+Bt0xXJhiYvoR6SmmNXZfpzOGXwdKWmcwG8N7PwVVWV3eF/68nmD9BaJSsTBhyQ==}
     peerDependencies:
       babel-plugin-macros: ^3.1.0
     peerDependenciesMeta:
       babel-plugin-macros:
         optional: true
 
-  defu@6.1.7:
-    resolution: {integrity: sha512-7z22QmUWiQ/2d0KkdYmANbRUVABpZ9SNYyH5vx6PZ+nE5bcC0l7uFvEfHlyld/HcGBFTL536ClDt3DEcSlEJAQ==}
+  deep-eql@5.0.2:
+    resolution: {integrity: sha512-h5k/5U50IJJFpzfL6nO9jaaumfjO/f2NjK/oYB2Djzm4p9L+3T9qWpZqZ2hAbLPuuYq9wrU08WQyBTL5GbPk5Q==}
+    engines: {node: '>=6'}
 
-  destr@2.0.5:
-    resolution: {integrity: sha512-ugFTXCtDZunbzasqBxrK93Ik/DRYsO6S/fedkWEMKqt04xZ4csmnmwGDBAb07QWNaGMAmnTIemsYZCksjATwsA==}
+  deep-is@0.1.4:
+    resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
+
+  define-data-property@1.1.4:
+    resolution: {integrity: sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==}
+    engines: {node: '>= 0.4'}
+
+  define-properties@1.2.1:
+    resolution: {integrity: sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==}
+    engines: {node: '>= 0.4'}
+
+  defu@6.1.4:
+    resolution: {integrity: sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==}
+
+  destr@2.0.3:
+    resolution: {integrity: sha512-2N3BOUU4gYMpTP24s5rF5iP7BDr7uNTCs4ozw3kf/eKfvWSIu93GEBi5m427YoyJoeOzQ5smuu4nNAPGb8idSQ==}
 
   detect-libc@1.0.3:
     resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==}
     engines: {node: '>=0.10'}
     hasBin: true
 
-  detect-libc@2.1.2:
-    resolution: {integrity: sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==}
+  detect-libc@2.0.3:
+    resolution: {integrity: sha512-bwy0MGW55bG41VqxxypOsdSdGqLwXPI/focwgTYCFMbdUiBAxLg9CFzG08sz2aqzknwiX7Hkl0bQENjg8iLByw==}
     engines: {node: '>=8'}
 
   didyoumean@1.2.2:
@@ -2501,33 +2406,77 @@ packages:
   dlv@1.1.3:
     resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==}
 
-  electron-to-chromium@1.5.361:
-    resolution: {integrity: sha512-Q6Hts7N9FnJc5LeGRINFvLhCI9xZmNtTDe5ZbcVezQz7cU4a8Aua3GH1b8J2XY8Al9PF+OCwYqhgsOOheMdvkA==}
+  doctrine@2.1.0:
+    resolution: {integrity: sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==}
+    engines: {node: '>=0.10.0'}
 
-  emnapi@1.11.3:
-    resolution: {integrity: sha512-+/ZS90YK/rYfVOHtGLHkGffVsnmD/MAKaBHio+Y4XAtg75RLr4cveV/w0jTkUdLM1CcAlaRgG76mpIemWAlk0A==}
-    peerDependencies:
-      node-addon-api: '>= 6.1.0'
-    peerDependenciesMeta:
-      node-addon-api:
-        optional: true
+  eastasianwidth@0.2.0:
+    resolution: {integrity: sha512-I88TYZWc9XiYHRQ4/3c5rjjfgkjhLyW2luGIheGERbNQ6OY7yTybanSpDXZa8y7VUP9YmDcYa+eyq4ca7iLqWA==}
 
-  enhanced-resolve@5.24.5:
-    resolution: {integrity: sha512-L1l8TNvomm6UVW5B253AGxQagSQr+vGwhMlrrfRS2qmhx46AMpMVJKQYLvWYbysTMY8VoicOvzHzoHMbyzB+4A==}
+  electron-to-chromium@1.5.119:
+    resolution: {integrity: sha512-Ku4NMzUjz3e3Vweh7PhApPrZSS4fyiCIbcIrG9eKrriYVLmbMepETR/v6SU7xPm98QTqMSYiCwfO89QNjXLkbQ==}
+
+  electron-to-chromium@1.5.45:
+    resolution: {integrity: sha512-vOzZS6uZwhhbkZbcRyiy99Wg+pYFV5hk+5YaECvx0+Z31NR3Tt5zS6dze2OepT6PCTzVzT0dIJItti+uAW5zmw==}
+
+  emoji-regex@8.0.0:
+    resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
+
+  emoji-regex@9.2.2:
+    resolution: {integrity: sha512-L18DaJsXSUk2+42pv8mLs5jJT2hqFkFE4j21wOmgbUqsZ2hL72NsUU785g9RXgo3s0ZNgVl42TiHp3ZtOv/Vyg==}
+
+  enhanced-resolve@5.18.1:
+    resolution: {integrity: sha512-ZSW3ma5GkcQBIpwZTSRAI8N71Uuwgs93IezB7mf7R60tC8ZbJideoDNKjHn2O9KIlx6rkGTTEk1xUCK2E1Y2Yg==}
     engines: {node: '>=10.13.0'}
 
+  es-abstract@1.23.3:
+    resolution: {integrity: sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==}
+    engines: {node: '>= 0.4'}
+
+  es-define-property@1.0.0:
+    resolution: {integrity: sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==}
+    engines: {node: '>= 0.4'}
+
   es-errors@1.3.0:
     resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==}
     engines: {node: '>= 0.4'}
 
-  es-module-lexer@2.1.0:
-    resolution: {integrity: sha512-n27zTYMjYu1aj4MjCWzSP7G9r75utsaoc8m61weK+W8JMBGGQybd43GstCXZ3WNmSFtGT9wi59qQTW6mhTR5LQ==}
+  es-iterator-helpers@1.1.0:
+    resolution: {integrity: sha512-/SurEfycdyssORP/E+bj4sEu1CWw4EmLDsHynHwSXQ7utgbrMRWW195pTrCjFgFCddf/UkYm3oqKPRq5i8bJbw==}
+    engines: {node: '>= 0.4'}
 
-  es-toolkit@1.50.0:
-    resolution: {integrity: sha512-OyZKhUVvEep9ITEiwHn8GKnMRQIVqoSIX7WnRbkWgJkllCujilqP2rD0u979tkl8wqyc8ICwlc1UBVv/Sl1G6w==}
+  es-object-atoms@1.0.0:
+    resolution: {integrity: sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==}
+    engines: {node: '>= 0.4'}
 
-  esbuild@0.27.7:
-    resolution: {integrity: sha512-IxpibTjyVnmrIQo5aqNpCgoACA/dTKLTlhMHihVHhdkxKyPO1uBBthumT0rdHmcsk9uMonIWS0m4FljWzILh3w==}
+  es-set-tostringtag@2.0.3:
+    resolution: {integrity: sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==}
+    engines: {node: '>= 0.4'}
+
+  es-shim-unscopables@1.0.2:
+    resolution: {integrity: sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw==}
+
+  es-to-primitive@1.2.1:
+    resolution: {integrity: sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==}
+    engines: {node: '>= 0.4'}
+
+  esbuild@0.21.5:
+    resolution: {integrity: sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  esbuild@0.23.1:
+    resolution: {integrity: sha512-VVNz/9Sa0bs5SELtn3f7qhJCDPCF5oMEl5cO9/SSinpE9hbPVvxbd572HH5AKiP7WD8INO53GgfDDhRjkylHEg==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  esbuild@0.24.0:
+    resolution: {integrity: sha512-FuLPevChGDshgSicjisSooU0cemp/sGXR841D5LHMB7mTVOmsEHcAxaH3irL53+8YDIeVNQEySh4DaYU/iuPqQ==}
+    engines: {node: '>=18'}
+    hasBin: true
+
+  esbuild@0.25.0:
+    resolution: {integrity: sha512-BXq5mqc8ltbaN34cDqWuYKyNhX8D/Z0J1xdtdQ8UcIIIyJyz+ZMKUt58tF3SrZ85jcfN/PZYhjR5uDQAYNVbuw==}
     engines: {node: '>=18'}
     hasBin: true
 
@@ -2535,18 +2484,118 @@ packages:
     resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==}
     engines: {node: '>=6'}
 
-  eslint-scope@5.1.1:
-    resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==}
-    engines: {node: '>=8.0.0'}
+  escape-string-regexp@4.0.0:
+    resolution: {integrity: sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==}
+    engines: {node: '>=10'}
+
+  eslint-config-next@15.2.3:
+    resolution: {integrity: sha512-VDQwbajhNMFmrhLWVyUXCqsGPN+zz5G8Ys/QwFubfsxTIrkqdx3N3x3QPW+pERz8bzGPP0IgEm8cNbZcd8PFRQ==}
+    peerDependencies:
+      eslint: ^7.23.0 || ^8.0.0 || ^9.0.0
+      typescript: '>=3.3.1'
+    peerDependenciesMeta:
+      typescript:
+        optional: true
+
+  eslint-import-resolver-node@0.3.9:
+    resolution: {integrity: sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==}
+
+  eslint-import-resolver-typescript@3.6.3:
+    resolution: {integrity: sha512-ud9aw4szY9cCT1EWWdGv1L1XR6hh2PaRWif0j2QjQ0pgTY/69iw+W0Z4qZv5wHahOl8isEr+k/JnyAqNQkLkIA==}
+    engines: {node: ^14.18.0 || >=16.0.0}
+    peerDependencies:
+      eslint: '*'
+      eslint-plugin-import: '*'
+      eslint-plugin-import-x: '*'
+    peerDependenciesMeta:
+      eslint-plugin-import:
+        optional: true
+      eslint-plugin-import-x:
+        optional: true
+
+  eslint-module-utils@2.12.0:
+    resolution: {integrity: sha512-wALZ0HFoytlyh/1+4wuZ9FJCD/leWHQzzrxJ8+rebyReSLk7LApMyd3WJaLVoN+D5+WIdJyDK1c6JnE65V4Zyg==}
+    engines: {node: '>=4'}
+    peerDependencies:
+      '@typescript-eslint/parser': '*'
+      eslint: '*'
+      eslint-import-resolver-node: '*'
+      eslint-import-resolver-typescript: '*'
+      eslint-import-resolver-webpack: '*'
+    peerDependenciesMeta:
+      '@typescript-eslint/parser':
+        optional: true
+      eslint:
+        optional: true
+      eslint-import-resolver-node:
+        optional: true
+      eslint-import-resolver-typescript:
+        optional: true
+      eslint-import-resolver-webpack:
+        optional: true
+
+  eslint-plugin-import@2.31.0:
+    resolution: {integrity: sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==}
+    engines: {node: '>=4'}
+    peerDependencies:
+      '@typescript-eslint/parser': '*'
+      eslint: ^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8 || ^9
+    peerDependenciesMeta:
+      '@typescript-eslint/parser':
+        optional: true
+
+  eslint-plugin-jsx-a11y@6.10.1:
+    resolution: {integrity: sha512-zHByM9WTUMnfsDTafGXRiqxp6lFtNoSOWBY6FonVRn3A+BUwN1L/tdBXT40BcBJi0cZjOGTXZ0eD/rTG9fEJ0g==}
+    engines: {node: '>=4.0'}
+    peerDependencies:
+      eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9
+
+  eslint-plugin-react-hooks@5.0.0:
+    resolution: {integrity: sha512-hIOwI+5hYGpJEc4uPRmz2ulCjAGD/N13Lukkh8cLV0i2IRk/bdZDYjgLVHj+U9Z704kLIdIO6iueGvxNur0sgw==}
+    engines: {node: '>=10'}
+    peerDependencies:
+      eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0
+
+  eslint-plugin-react@7.37.2:
+    resolution: {integrity: sha512-EsTAnj9fLVr/GZleBLFbj/sSuXeWmp1eXIN60ceYnZveqEaUCyW4X+Vh4WTdUhCkW4xutXYqTXCUSyqD4rB75w==}
+    engines: {node: '>=4'}
+    peerDependencies:
+      eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || ^9.7
+
+  eslint-scope@8.3.0:
+    resolution: {integrity: sha512-pUNxi75F8MJ/GdeKtVLSbYg4ZI34J6C0C7sbL4YOp2exGwen7ZsuBqKzUhXd0qMQ362yET3z+uPwKeg/0C2XCQ==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  eslint-visitor-keys@3.4.3:
+    resolution: {integrity: sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==}
+    engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
+
+  eslint-visitor-keys@4.2.0:
+    resolution: {integrity: sha512-UyLnSehNt62FFhSwjZlHmeokpRK59rcz29j+F1/aDgbkbRTk7wIc9XzdoasMUbRNKDM0qQt/+BJ4BrpFeABemw==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  eslint@9.22.0:
+    resolution: {integrity: sha512-9V/QURhsRN40xuHXWjV64yvrzMjcz7ZyNoF2jJFmy9j/SLk0u1OLSZgXi28MrXjymnjEGSR80WCdab3RGMDveQ==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    hasBin: true
+    peerDependencies:
+      jiti: '*'
+    peerDependenciesMeta:
+      jiti:
+        optional: true
+
+  espree@10.3.0:
+    resolution: {integrity: sha512-0QYC8b24HWY8zjRnDTL6RiHfDbAWn63qb4LMj1Z4b076A4une81+z03Kg7l7mn/48PUTqoLptSXez8oknU8Clg==}
+    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+
+  esquery@1.6.0:
+    resolution: {integrity: sha512-ca9pw9fomFcKPvFLXhBKUK90ZvGibiGOvRJNbjljY7s7uq/5YO4BOzcYtJqExdx99rF6aAcnRxHmcUHcz6sQsg==}
+    engines: {node: '>=0.10'}
 
   esrecurse@4.3.0:
     resolution: {integrity: sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==}
     engines: {node: '>=4.0'}
 
-  estraverse@4.3.0:
-    resolution: {integrity: sha512-39nnKffWz8xN1BU/2c79n9nB9HDzo0niYUqx6xyqUnyoAnQyyWpOTdZEeiCch8BBu515t4wp9ZmgVfVhn9EBpw==}
-    engines: {node: '>=4.0'}
-
   estraverse@5.3.0:
     resolution: {integrity: sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==}
     engines: {node: '>=4.0'}
@@ -2554,68 +2603,74 @@ packages:
   estree-walker@3.0.3:
     resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==}
 
-  events@3.3.0:
-    resolution: {integrity: sha512-mQw+2fkQbALzQ7V0MY0IqdnXNOeTtP4r0lN9z7AAawCXgqea7bDii20AYrIBrFd/Hx0M2Ocz6S111CaFkUcb0Q==}
-    engines: {node: '>=0.8.x'}
+  esutils@2.0.3:
+    resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==}
+    engines: {node: '>=0.10.0'}
 
-  expect-type@1.3.0:
-    resolution: {integrity: sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==}
-    engines: {node: '>=12.0.0'}
-
-  fast-content-type-parse@3.0.0:
-    resolution: {integrity: sha512-ZvLdcY8P+N8mGQJahJV5G4U88CSvT1rP8ApL6uETe88MBXrBHAkZlSEySdUlyztF7ccb+Znos3TFqaepHxdhBg==}
+  execa@8.0.1:
+    resolution: {integrity: sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==}
+    engines: {node: '>=16.17'}
 
   fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
 
-  fast-equals@5.4.0:
-    resolution: {integrity: sha512-jt2DW/aNFNwke7AUd+Z+e6pz39KO5rzdbbFCg2sGafS4mk13MI7Z8O5z9cADNn5lhGODIgLwug6TZO2ctf7kcw==}
-    engines: {node: '>=6.0.0'}
+  fast-glob@3.3.1:
+    resolution: {integrity: sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg==}
+    engines: {node: '>=8.6.0'}
 
   fast-glob@3.3.3:
     resolution: {integrity: sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==}
     engines: {node: '>=8.6.0'}
 
-  fast-string-truncated-width@3.0.3:
-    resolution: {integrity: sha512-0jjjIEL6+0jag3l2XWWizO64/aZVtpiGE3t0Zgqxv0DPuxiMjvB3M24fCyhZUO4KomJQPj3LTSUnDP3GpdwC0g==}
+  fast-json-stable-stringify@2.1.0:
+    resolution: {integrity: sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==}
 
-  fast-string-width@3.0.2:
-    resolution: {integrity: sha512-gX8LrtNEI5hq8DVUfRQMbr5lpaS4nMIWV+7XEbXk2b8kiQIizgnlr12B4dA3ZEx3308ze0O4Q1R+cHts8kyUJg==}
+  fast-levenshtein@2.0.6:
+    resolution: {integrity: sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==}
 
-  fast-stringify@4.0.0:
-    resolution: {integrity: sha512-lE2DIivBaLysf6hK5WH/VfMgqRbvBVHcpGVVTmA5Zi8oWIjq9YxIt6lYGdUgP1HNSXxTIat7HEIDnrSvXSeKQw==}
+  fastq@1.17.1:
+    resolution: {integrity: sha512-sRVD3lWVIXWg6By68ZN7vho9a1pQcN/WBFaAAsDDFzlJjvoGx0P8z7V1t72grFJfJhu3YPZBuu25f7Kaw2jN1w==}
 
-  fast-uri@3.1.2:
-    resolution: {integrity: sha512-rVjf7ArG3LTk+FS6Yw81V1DLuZl1bRbNrev6Tmd/9RaroeeRRJhAt7jg/6YFxbvAQXUCavSoZhPPj6oOx+5KjQ==}
-
-  fast-wrap-ansi@0.2.2:
-    resolution: {integrity: sha512-7F2Fl+TjRSenLqlU3UjSH0iyqopqoZIu7eZVpEirP2g1GtWa2G/ecEmBdgz31+Mxr+ELclgg6sokpSFIQiZ02Q==}
-
-  fastq@1.20.1:
-    resolution: {integrity: sha512-GGToxJ/w1x32s/D2EKND7kTil4n8OVk/9mycTc4VDza13lOvpUZTGX3mFSCtV9ksdGBVzvsyAVLM6mHFThxXxw==}
-
-  fdir@6.5.0:
-    resolution: {integrity: sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==}
-    engines: {node: '>=12.0.0'}
+  fdir@6.4.3:
+    resolution: {integrity: sha512-PMXmW2y1hDDfTSRc9gaXIuCCRpuoz3Kaz8cUelp3smouvfT632ozg2vrT6lJsHKKOF59YLbOGfAWGUcKEfRMQw==}
     peerDependencies:
       picomatch: ^3 || ^4
     peerDependenciesMeta:
       picomatch:
         optional: true
 
+  file-entry-cache@8.0.0:
+    resolution: {integrity: sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==}
+    engines: {node: '>=16.0.0'}
+
   fill-range@7.1.1:
     resolution: {integrity: sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==}
     engines: {node: '>=8'}
 
-  find-up-simple@1.0.1:
-    resolution: {integrity: sha512-afd4O7zpqHeRyg4PfDQsXmlDe2PfdHtJt6Akt8jOWaApLOZk5JXs6VMR29lz03pRe9mpykrRCYIYxaJYcfpncQ==}
+  find-up-simple@1.0.0:
+    resolution: {integrity: sha512-q7Us7kcjj2VMePAa02hDAF6d+MzsdsAWEwYyOpwUtlerRBkOEPBCRZrAV4XfcSN8fHAgaD0hP7miwoay6DCprw==}
     engines: {node: '>=18'}
 
-  fix-dts-default-cjs-exports@1.0.1:
-    resolution: {integrity: sha512-pVIECanWFC61Hzl2+oOCtoJ3F17kglZC/6N94eRWycFgBH35hHx0Li604ZIzhseh97mf2p0cv7vVrOZGoqhlEg==}
+  find-up@5.0.0:
+    resolution: {integrity: sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==}
+    engines: {node: '>=10'}
 
-  fraction.js@5.3.4:
-    resolution: {integrity: sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==}
+  flat-cache@4.0.1:
+    resolution: {integrity: sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==}
+    engines: {node: '>=16'}
+
+  flatted@3.3.1:
+    resolution: {integrity: sha512-X8cqMLLie7KsNUDSdzeN8FYK9rEt4Dt67OsG/DNGnYTSDBG4uFAJFBnUeiV+zCVAvwFy56IjM9sH51jVaEhNxw==}
+
+  for-each@0.3.3:
+    resolution: {integrity: sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==}
+
+  foreground-child@3.3.0:
+    resolution: {integrity: sha512-Ld2g8rrAyMYFXBhEqMz8ZAHBi4J4uS1i/CxGMDnjyFWddMXLVcDp051DZfu+t7+ab7Wv6SMqpWmyFIj5UbfFvg==}
+    engines: {node: '>=14'}
+
+  fraction.js@4.3.7:
+    resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
 
   fsevents@2.3.2:
     resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==}
@@ -2630,8 +2685,37 @@ packages:
   function-bind@1.1.2:
     resolution: {integrity: sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==}
 
-  get-port-please@3.2.0:
-    resolution: {integrity: sha512-I9QVvBw5U/hw3RmWpYKRumUeaDgxTPd401x364rLmWBJcOQ753eov1eTgzDqRG9bqFIfDc7gfzcQEWrUri3o1A==}
+  function.prototype.name@1.1.6:
+    resolution: {integrity: sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==}
+    engines: {node: '>= 0.4'}
+
+  functions-have-names@1.2.3:
+    resolution: {integrity: sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==}
+
+  gensync@1.0.0-beta.2:
+    resolution: {integrity: sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==}
+    engines: {node: '>=6.9.0'}
+
+  get-func-name@2.0.2:
+    resolution: {integrity: sha512-8vXOvuE167CtIc3OyItco7N/dpRtBbYOsPsXCz7X/PMnlGjYjSGuZJgM1Y7mmew7BKf9BqvLX2tnOVy1BBUsxQ==}
+
+  get-intrinsic@1.2.4:
+    resolution: {integrity: sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==}
+    engines: {node: '>= 0.4'}
+
+  get-port-please@3.1.2:
+    resolution: {integrity: sha512-Gxc29eLs1fbn6LQ4jSU4vXjlwyZhF5HsGuMAa7gqBP4Rw4yxxltyDUuF5MBclFzDTXO+ACchGQoeela4DSfzdQ==}
+
+  get-stream@8.0.1:
+    resolution: {integrity: sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==}
+    engines: {node: '>=16'}
+
+  get-symbol-description@1.0.2:
+    resolution: {integrity: sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==}
+    engines: {node: '>= 0.4'}
+
+  get-tsconfig@4.8.1:
+    resolution: {integrity: sha512-k9PN+cFBmaLWtVz29SkUoqU5O0slLuHJXt/2P+tMVFT+phsSGXGkp9t3rQIqdz0e+06EHNGs3oM6ZX1s2zHxRg==}
 
   glob-parent@5.1.2:
     resolution: {integrity: sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==}
@@ -2641,184 +2725,419 @@ packages:
     resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
     engines: {node: '>=10.13.0'}
 
-  globby@16.2.2:
-    resolution: {integrity: sha512-NLvV9ubZ6NDsJaOpKPy3cQeJpKi9DcWiyCiFUpJPA0YihRqiE6RWaLUmgNNPr8MgPpLZjnBjSmou7uZBRJv9wA==}
-    engines: {node: '>=20'}
+  glob@10.4.5:
+    resolution: {integrity: sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==}
+    hasBin: true
+
+  globals@11.12.0:
+    resolution: {integrity: sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==}
+    engines: {node: '>=4'}
+
+  globals@14.0.0:
+    resolution: {integrity: sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==}
+    engines: {node: '>=18'}
+
+  globalthis@1.0.4:
+    resolution: {integrity: sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==}
+    engines: {node: '>= 0.4'}
+
+  globby@14.1.0:
+    resolution: {integrity: sha512-0Ia46fDOaT7k4og1PDW4YbodWWr3scS2vAr2lTbsplOt2WkKp0vQbkI9wKis/T5LV/dqPjO3bpS/z6GTJB82LA==}
+    engines: {node: '>=18'}
+
+  gopd@1.0.1:
+    resolution: {integrity: sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==}
 
   graceful-fs@4.2.11:
     resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
 
-  h3@1.15.11:
-    resolution: {integrity: sha512-L3THSe2MPeBwgIZVSH5zLdBBU90TOxarvhK9d04IDY2AmVS8j2Jz2LIWtwsGOU3lu2I5jCN7FNvVfY2+XyF+mg==}
+  graphemer@1.4.0:
+    resolution: {integrity: sha512-EtKwoO6kxCL9WO5xipiHTZlSzBm7WLT627TqC/uVRd0HKmq8NXyebnNYxDoBi7wt8eTWrUrKXCOVaFq9x1kgag==}
+
+  h3@1.15.1:
+    resolution: {integrity: sha512-+ORaOBttdUm1E2Uu/obAyCguiI7MbBvsLTndc3gyK3zU+SYLoZXlyCP9Xgy0gikkGufFLTZXCXD6+4BsufnmHA==}
+
+  has-bigints@1.0.2:
+    resolution: {integrity: sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==}
 
   has-flag@4.0.0:
     resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
     engines: {node: '>=8'}
 
-  hasown@2.0.3:
-    resolution: {integrity: sha512-ej4AhfhfL2Q2zpMmLo7U1Uv9+PyhIZpgQLGT1F9miIGmiCJIoCgSmczFdrc97mWT4kVY72KA+WnnhJ5pghSvSg==}
+  has-property-descriptors@1.0.2:
+    resolution: {integrity: sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==}
+
+  has-proto@1.0.3:
+    resolution: {integrity: sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==}
+    engines: {node: '>= 0.4'}
+
+  has-symbols@1.0.3:
+    resolution: {integrity: sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==}
+    engines: {node: '>= 0.4'}
+
+  has-tostringtag@1.0.2:
+    resolution: {integrity: sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==}
+    engines: {node: '>= 0.4'}
+
+  hasown@2.0.2:
+    resolution: {integrity: sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==}
     engines: {node: '>= 0.4'}
 
   http-shutdown@1.2.2:
     resolution: {integrity: sha512-S9wWkJ/VSY9/k4qcjG318bqJNruzE4HySUhFYknwmu6LBP97KLLfwNf+n4V1BHurvFNkSKLFnK/RsuUnRTf9Vw==}
     engines: {iojs: '>= 1.0.0', node: '>= 0.12.0'}
 
-  iconv-lite@0.7.2:
-    resolution: {integrity: sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==}
-    engines: {node: '>=0.10.0'}
+  human-signals@5.0.0:
+    resolution: {integrity: sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==}
+    engines: {node: '>=16.17.0'}
 
-  ignore@7.0.5:
-    resolution: {integrity: sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==}
+  ignore@5.3.2:
+    resolution: {integrity: sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==}
     engines: {node: '>= 4'}
 
+  ignore@7.0.3:
+    resolution: {integrity: sha512-bAH5jbK/F3T3Jls4I0SO1hmPR0dKU0a7+SY6n1yzRtG54FLO8d6w/nxLFX2Nb7dBu6cCWXPaAME6cYqFUMmuCA==}
+    engines: {node: '>= 4'}
+
+  import-fresh@3.3.0:
+    resolution: {integrity: sha512-veYYhQa+D1QBKznvhUHxb8faxlrwUnxseDAbAp457E0wLNio2bOSKnjYDhMj+YiAq61xrMGhQk9iXVk5FzgQMw==}
+    engines: {node: '>=6'}
+
+  imurmurhash@0.1.4:
+    resolution: {integrity: sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==}
+    engines: {node: '>=0.8.19'}
+
+  internal-slot@1.0.7:
+    resolution: {integrity: sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==}
+    engines: {node: '>= 0.4'}
+
   iron-webcrypto@1.2.1:
     resolution: {integrity: sha512-feOM6FaSr6rEABp/eDfVseKyTMDt+KGpeB35SkVn9Tyn0CqvVsY3EwI0v5i8nMHyJnzCIQf7nsy3p41TPkJZhg==}
 
+  is-array-buffer@3.0.4:
+    resolution: {integrity: sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==}
+    engines: {node: '>= 0.4'}
+
+  is-arrayish@0.3.2:
+    resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==}
+
+  is-async-function@2.0.0:
+    resolution: {integrity: sha512-Y1JXKrfykRJGdlDwdKlLpLyMIiWqWvuSd17TvZk68PLAOGOoF4Xyav1z0Xhoi+gCYjZVeC5SI+hYFOfvXmGRCA==}
+    engines: {node: '>= 0.4'}
+
+  is-bigint@1.0.4:
+    resolution: {integrity: sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==}
+
   is-binary-path@2.1.0:
     resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==}
     engines: {node: '>=8'}
 
-  is-core-module@2.16.2:
-    resolution: {integrity: sha512-evOr8xfXKxE6qSR0hSXL2r3sd7ALj8+7jQEUvPYcm5sgZFdJ+AYzT6yNmJenvIYQBgIGwfwz08sL8zoL7yq2BA==}
+  is-boolean-object@1.1.2:
+    resolution: {integrity: sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==}
     engines: {node: '>= 0.4'}
 
+  is-bun-module@1.2.1:
+    resolution: {integrity: sha512-AmidtEM6D6NmUiLOvvU7+IePxjEjOzra2h0pSrsfSAcXwl/83zLLXDByafUJy9k/rKK0pvXMLdwKwGHlX2Ke6Q==}
+
+  is-callable@1.2.7:
+    resolution: {integrity: sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==}
+    engines: {node: '>= 0.4'}
+
+  is-core-module@2.15.0:
+    resolution: {integrity: sha512-Dd+Lb2/zvk9SKy1TGCt1wFJFo/MWBPMX5x7KcvLajWTGuomczdQX61PvY5yK6SVACwpoexWo81IfFyoKY2QnTA==}
+    engines: {node: '>= 0.4'}
+
+  is-core-module@2.15.1:
+    resolution: {integrity: sha512-z0vtXSwucUJtANQWldhbtbt7BnL0vxiFjIdDLAatwhDYty2bad6s+rijD6Ri4YuYJubLzIJLUidCh09e1djEVQ==}
+    engines: {node: '>= 0.4'}
+
+  is-data-view@1.0.1:
+    resolution: {integrity: sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==}
+    engines: {node: '>= 0.4'}
+
+  is-date-object@1.0.5:
+    resolution: {integrity: sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==}
+    engines: {node: '>= 0.4'}
+
+  is-docker@3.0.0:
+    resolution: {integrity: sha512-eljcgEDlEns/7AXFosB5K/2nCM4P7FQPkGc/DWLy5rmFEWvZayGrik1d9/QIY5nJ4f9YsVvBkA6kJpHn9rISdQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+    hasBin: true
+
   is-extglob@2.1.1:
     resolution: {integrity: sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==}
     engines: {node: '>=0.10.0'}
 
+  is-finalizationregistry@1.0.2:
+    resolution: {integrity: sha512-0by5vtUJs8iFQb5TYUHHPudOR+qXYIMKtiUzvLIZITZUjknFmziyBJuLhVRc+Ds0dREFlskDNJKYIdIzu/9pfw==}
+
+  is-fullwidth-code-point@3.0.0:
+    resolution: {integrity: sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==}
+    engines: {node: '>=8'}
+
+  is-generator-function@1.0.10:
+    resolution: {integrity: sha512-jsEjy9l3yiXEQ+PsXdmBwEPcOxaXWLspKdplFUVI9vq1iZgIekeC0L167qeu86czQaxed3q/Uzuw0swL0irL8A==}
+    engines: {node: '>= 0.4'}
+
   is-glob@4.0.3:
     resolution: {integrity: sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==}
     engines: {node: '>=0.10.0'}
 
+  is-inside-container@1.0.0:
+    resolution: {integrity: sha512-KIYLCCJghfHZxqjYBE7rEy0OBuTd5xCHS7tHVgvCLkx7StIoaxwNW3hCALgEUjFfeRk+MG/Qxmp/vtETEF3tRA==}
+    engines: {node: '>=14.16'}
+    hasBin: true
+
+  is-map@2.0.3:
+    resolution: {integrity: sha512-1Qed0/Hr2m+YqxnM09CjA2d/i6YZNfF6R2oRAOj36eUdS6qIV/huPJNSEpKbupewFs+ZsJlxsjjPbc0/afW6Lw==}
+    engines: {node: '>= 0.4'}
+
+  is-negative-zero@2.0.3:
+    resolution: {integrity: sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==}
+    engines: {node: '>= 0.4'}
+
+  is-number-object@1.0.7:
+    resolution: {integrity: sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==}
+    engines: {node: '>= 0.4'}
+
   is-number@7.0.0:
     resolution: {integrity: sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==}
     engines: {node: '>=0.12.0'}
 
-  is-path-inside@4.0.0:
-    resolution: {integrity: sha512-lJJV/5dYS+RcL8uQdBDW9c9uWFLLBNRyFhnAKXw5tVqLlKZ4RMGZKv+YQ/IA3OhD+RpbJa1LLFM1FQPGyIXvOA==}
-    engines: {node: '>=12'}
+  is-regex@1.1.4:
+    resolution: {integrity: sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==}
+    engines: {node: '>= 0.4'}
 
-  jest-worker@27.5.1:
-    resolution: {integrity: sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==}
-    engines: {node: '>= 10.13.0'}
+  is-set@2.0.3:
+    resolution: {integrity: sha512-iPAjerrse27/ygGLxw+EBR9agv9Y6uLeYVJMu+QNCoouJ1/1ri0mGrcWpfCqFZuzzx3WjtwxG098X+n4OuRkPg==}
+    engines: {node: '>= 0.4'}
 
-  jiti@1.21.7:
-    resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==}
+  is-shared-array-buffer@1.0.3:
+    resolution: {integrity: sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==}
+    engines: {node: '>= 0.4'}
+
+  is-stream@3.0.0:
+    resolution: {integrity: sha512-LnQR4bZ9IADDRSkvpqMGvt/tEJWclzklNgSw48V5EAaAeDd6qGvN8ei6k5p0tvxSR171VmGyHuTiAOfxAbr8kA==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+
+  is-string@1.0.7:
+    resolution: {integrity: sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==}
+    engines: {node: '>= 0.4'}
+
+  is-symbol@1.0.4:
+    resolution: {integrity: sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==}
+    engines: {node: '>= 0.4'}
+
+  is-typed-array@1.1.13:
+    resolution: {integrity: sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==}
+    engines: {node: '>= 0.4'}
+
+  is-weakmap@2.0.2:
+    resolution: {integrity: sha512-K5pXYOm9wqY1RgjpL3YTkF39tni1XajUIkawTLUo9EZEVUFga5gSQJF8nNS7ZwJQ02y+1YCNYcMh+HIf1ZqE+w==}
+    engines: {node: '>= 0.4'}
+
+  is-weakref@1.0.2:
+    resolution: {integrity: sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==}
+
+  is-weakset@2.0.3:
+    resolution: {integrity: sha512-LvIm3/KWzS9oRFHugab7d+M/GcBXuXX5xZkzPmN+NxihdQlZUQ4dWuSV1xR/sq6upL1TJEDrfBgRepHFdBtSNQ==}
+    engines: {node: '>= 0.4'}
+
+  is-wsl@3.1.0:
+    resolution: {integrity: sha512-UcVfVfaK4Sc4m7X3dUSoHoozQGBEFeDC+zVo06t98xe8CzHSZZBekNXH+tu0NalHolcJ/QAGqS46Hef7QXBIMw==}
+    engines: {node: '>=16'}
+
+  is64bit@2.0.0:
+    resolution: {integrity: sha512-jv+8jaWCl0g2lSBkNSVXdzfBA0npK1HGC2KtWM9FumFRoGS94g3NbCCLVnCYHLjp4GrW2KZeeSTMo5ddtznmGw==}
+    engines: {node: '>=18'}
+
+  isarray@2.0.5:
+    resolution: {integrity: sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==}
+
+  isexe@2.0.0:
+    resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
+
+  iterator.prototype@1.1.3:
+    resolution: {integrity: sha512-FW5iMbeQ6rBGm/oKgzq2aW4KvAGpxPzYES8N4g4xNXUKpL1mclMvOe+76AcLDTvD+Ze+sOpVhgdAQEKF4L9iGQ==}
+    engines: {node: '>= 0.4'}
+
+  jackspeak@3.4.3:
+    resolution: {integrity: sha512-OGlZQpz2yfahA/Rd1Y8Cd9SIEsqvXkLVoSw/cgwhnhFMDbsQFeZYoJJ7bIZBS9BcamUW96asq/npPWugM+RQBw==}
+
+  jiti@1.21.6:
+    resolution: {integrity: sha512-2yTgeWTWzMWkHu6Jp9NKgePDaYHbntiwvYuuJLbbN9vl7DC9DvXKOB2BC3ZZ92D3cvV/aflH0osDfwpHepQ53w==}
     hasBin: true
 
-  jiti@2.7.0:
-    resolution: {integrity: sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==}
+  jiti@2.4.2:
+    resolution: {integrity: sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==}
     hasBin: true
 
   joycon@3.1.1:
     resolution: {integrity: sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw==}
     engines: {node: '>=10'}
 
-  js-yaml@4.3.1:
-    resolution: {integrity: sha512-CY6crGq313MX8GkwvB7tzgp99vjQxY1++5y10/BKN/GUfHqWaOGQMNZkBvqSzsZKWk/ijwHlWzzkLulsGHhjWQ==}
+  js-tokens@4.0.0:
+    resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
+
+  js-yaml@4.1.0:
+    resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
     hasBin: true
 
-  json-schema-traverse@1.0.0:
-    resolution: {integrity: sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==}
+  jsesc@3.1.0:
+    resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==}
+    engines: {node: '>=6'}
+    hasBin: true
 
-  json-with-bigint@3.5.8:
-    resolution: {integrity: sha512-eq/4KP6K34kwa7TcFdtvnftvHCD9KvHOGGICWwMFc4dOOKF5t4iYqnfLK8otCRCRv06FXOzGGyqE8h8ElMvvdw==}
+  json-buffer@3.0.1:
+    resolution: {integrity: sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==}
 
-  lightningcss-android-arm64@1.33.0:
-    resolution: {integrity: sha512-gEpRTalKdosp4Bb8qWtc2iOgE5SeIHlpS1up9bFq2wAyYhl1UdTObYiHe98zEM9SQvSoqQZ1IQD0JNpg3Ml5pg==}
-    engines: {node: '>= 12.0.0'}
-    cpu: [arm64]
-    os: [android]
+  json-schema-traverse@0.4.1:
+    resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
 
-  lightningcss-darwin-arm64@1.33.0:
-    resolution: {integrity: sha512-Sciaz8eenNTKn9b3t7+xr0ipTp9YxKQY4npwQ3mrRuL0BAVHBLyZxofhaKBAVtzmtRZ/zTyo0/to4B1uWG/Djg==}
+  json-stable-stringify-without-jsonify@1.0.1:
+    resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
+
+  json5@1.0.2:
+    resolution: {integrity: sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==}
+    hasBin: true
+
+  json5@2.2.3:
+    resolution: {integrity: sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==}
+    engines: {node: '>=6'}
+    hasBin: true
+
+  jsx-ast-utils@3.3.5:
+    resolution: {integrity: sha512-ZZow9HBI5O6EPgSJLUb8n2NKgmVWTwCvHGwFuJlMjvLFqlGG6pjirPhtdsseaLZjSibD8eegzmYpUZwoIlj2cQ==}
+    engines: {node: '>=4.0'}
+
+  keyv@4.5.4:
+    resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
+
+  language-subtag-registry@0.3.23:
+    resolution: {integrity: sha512-0K65Lea881pHotoGEa5gDlMxt3pctLi2RplBb7Ezh4rRdLEOtgi7n4EwK9lamnUCkKBqaeKRVebTq6BAxSkpXQ==}
+
+  language-tags@1.0.9:
+    resolution: {integrity: sha512-MbjN408fEndfiQXbFQ1vnd+1NoLDsnQW41410oQBXiyXDMYH5z505juWa4KUE1LqxRC7DgOgZDbKLxHIwm27hA==}
+    engines: {node: '>=0.10'}
+
+  levn@0.4.1:
+    resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
+    engines: {node: '>= 0.8.0'}
+
+  lightningcss-darwin-arm64@1.29.2:
+    resolution: {integrity: sha512-cK/eMabSViKn/PG8U/a7aCorpeKLMlK0bQeNHmdb7qUnBkNPnL+oV5DjJUo0kqWsJUapZsM4jCfYItbqBDvlcA==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [darwin]
 
-  lightningcss-darwin-x64@1.33.0:
-    resolution: {integrity: sha512-Z5UPAxzrjlWNNyGy6i65cJzzvgJ5D3T6wMvs+gWpY9d7qRhANrxqAp6LhxIgZhWEw18RfJTGcRxjuLIBr+m8XQ==}
+  lightningcss-darwin-x64@1.29.2:
+    resolution: {integrity: sha512-j5qYxamyQw4kDXX5hnnCKMf3mLlHvG44f24Qyi2965/Ycz829MYqjrVg2H8BidybHBp9kom4D7DR5VqCKDXS0w==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [darwin]
 
-  lightningcss-freebsd-x64@1.33.0:
-    resolution: {integrity: sha512-QQM/Ti/hQajJwCY+RiWuCZ9sdtI/XQk7nDK5vC8kkdwixezOlDgvDx7+RT+QjK6FcFT4MpsuoBnHIo/O3StRRg==}
+  lightningcss-freebsd-x64@1.29.2:
+    resolution: {integrity: sha512-wDk7M2tM78Ii8ek9YjnY8MjV5f5JN2qNVO+/0BAGZRvXKtQrBC4/cn4ssQIpKIPP44YXw6gFdpUF+Ps+RGsCwg==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [freebsd]
 
-  lightningcss-linux-arm-gnueabihf@1.33.0:
-    resolution: {integrity: sha512-N7FVBe6iS24MlM6R/4RBTxGhQheZGs7tiQ9U32UtF75NzP5Q7xWPRqLBCKxlRQRk3rY1jCIPLzx7WzOhuUIRLQ==}
+  lightningcss-linux-arm-gnueabihf@1.29.2:
+    resolution: {integrity: sha512-IRUrOrAF2Z+KExdExe3Rz7NSTuuJ2HvCGlMKoquK5pjvo2JY4Rybr+NrKnq0U0hZnx5AnGsuFHjGnNT14w26sg==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm]
     os: [linux]
 
-  lightningcss-linux-arm64-gnu@1.33.0:
-    resolution: {integrity: sha512-j2v/itmy4HlNxlc6voKXYgBqNi0Ng2LShg4z7GufpEgs05P+2suBVyi9I6YHq5uoVFx9ETin3eCEhLVyXGQnKg==}
+  lightningcss-linux-arm64-gnu@1.29.2:
+    resolution: {integrity: sha512-KKCpOlmhdjvUTX/mBuaKemp0oeDIBBLFiU5Fnqxh1/DZ4JPZi4evEH7TKoSBFOSOV3J7iEmmBaw/8dpiUvRKlQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
 
-  lightningcss-linux-arm64-musl@1.33.0:
-    resolution: {integrity: sha512-yiO5ROMuYQgXbC60yjZU5CYSFZGKXL0HFATXt9mHJn1+zW55oCtMI9NfcVhYLMFDL7gV7oBPon/EmMMGg2OvtQ==}
+  lightningcss-linux-arm64-musl@1.29.2:
+    resolution: {integrity: sha512-Q64eM1bPlOOUgxFmoPUefqzY1yV3ctFPE6d/Vt7WzLW4rKTv7MyYNky+FWxRpLkNASTnKQUaiMJ87zNODIrrKQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
 
-  lightningcss-linux-x64-gnu@1.33.0:
-    resolution: {integrity: sha512-ar+Ju7LmcN0Jo4FpL4hpFybwNG9/3A/Br5KW2n2jyODg3MEZXaDYADdemoNS+BDNfMgKvylJLj4S5tyRActuAg==}
+  lightningcss-linux-x64-gnu@1.29.2:
+    resolution: {integrity: sha512-0v6idDCPG6epLXtBH/RPkHvYx74CVziHo6TMYga8O2EiQApnUPZsbR9nFNrg2cgBzk1AYqEd95TlrsL7nYABQg==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
 
-  lightningcss-linux-x64-musl@1.33.0:
-    resolution: {integrity: sha512-RYiYbkokw0trfKqqzfF55lginwEPrD3OJDfTuJzFs1MK6iFnDenaz1fqLLtX4ITG3OktJQXOeTaw1awrBAlZPw==}
+  lightningcss-linux-x64-musl@1.29.2:
+    resolution: {integrity: sha512-rMpz2yawkgGT8RULc5S4WiZopVMOFWjiItBT7aSfDX4NQav6M44rhn5hjtkKzB+wMTRlLLqxkeYEtQ3dd9696w==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
 
-  lightningcss-win32-arm64-msvc@1.33.0:
-    resolution: {integrity: sha512-1K+MPfLSFVpphzpdbfkhlWk6wBrTObBzS2T6db10PNOZgR9GoVsAWzwNyuhUYYbTp23j+4RrncfujZ4uAzXvwA==}
+  lightningcss-win32-arm64-msvc@1.29.2:
+    resolution: {integrity: sha512-nL7zRW6evGQqYVu/bKGK+zShyz8OVzsCotFgc7judbt6wnB2KbiKKJwBE4SGoDBQ1O94RjW4asrCjQL4i8Fhbw==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [win32]
 
-  lightningcss-win32-x64-msvc@1.33.0:
-    resolution: {integrity: sha512-OlEICDx/Xl0FqSp4bry8zFnCvGpig3Gl4gCquvYwHuqJKEC1+n9NgDniFvqHGmMv1ZkqDJrDqKKSykTDX+ehuA==}
+  lightningcss-win32-x64-msvc@1.29.2:
+    resolution: {integrity: sha512-EdIUW3B2vLuHmv7urfzMI/h2fmlnOQBk1xlsDxkN1tCWKjNFjfLhGxYk8C8mzpSfr+A6jFFIi8fU6LbQGsRWjA==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [win32]
 
-  lightningcss@1.33.0:
-    resolution: {integrity: sha512-WkUDrojuJs0xkgGf2udWxa3yGBRxPtxUkB79i6aCZLRgc7PM8fZe9TosfPDcvEpQZbuFASnHYmRLBLUbmLOIIA==}
+  lightningcss@1.29.2:
+    resolution: {integrity: sha512-6b6gd/RUXKaw5keVdSEtqFVdzWnU5jMxTUjA2bVcMNPLwSQ08Sv/UodBVtETLCn7k4S1Ibxwh7k68IwLZPgKaA==}
     engines: {node: '>= 12.0.0'}
 
-  lilconfig@3.1.3:
-    resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==}
+  lilconfig@2.1.0:
+    resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==}
+    engines: {node: '>=10'}
+
+  lilconfig@3.1.2:
+    resolution: {integrity: sha512-eop+wDAvpItUys0FWkHIKeC9ybYrTGbU41U5K7+bttZZeohvnY7M9dZ5kB21GNWiFT2q1OoPTvncPCgSOVO5ow==}
     engines: {node: '>=14'}
 
   lines-and-columns@1.2.4:
     resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
 
-  listhen@1.10.1:
-    resolution: {integrity: sha512-6nt/86SkqUQSLW1ofz8MxC6RhRMqOl3ONISe6qqvJ3xj09aJWQx6DhgSZpugs3PX4PXdOas/WD6A9jx6J2N19A==}
+  listhen@1.9.0:
+    resolution: {integrity: sha512-I8oW2+QL5KJo8zXNWX046M134WchxsXC7SawLPvRQpogCbkyQIaFxPE89A2HiwR7vAK2Dm2ERBAmyjTYGYEpBg==}
     hasBin: true
-    peerDependencies:
-      '@parcel/watcher': ^2.5.6
-    peerDependenciesMeta:
-      '@parcel/watcher':
-        optional: true
 
   load-tsconfig@0.2.5:
     resolution: {integrity: sha512-IXO6OCs9yg8tMKzfPZ1YmheJbZCiEsnBdcB03l0OcfK9prKnJb96siuHCr5Fl37/yo9DnKU+TLpxzTUspw9shg==}
     engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
 
-  magic-string@0.30.21:
-    resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
+  locate-path@6.0.0:
+    resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
+    engines: {node: '>=10'}
 
-  magic-string@1.1.0:
-    resolution: {integrity: sha512-kS3VHe0nEPST2saQV4Rbkchcd3UBRkVTQHo1D3h/ZTwFDhai/mfKkmtPAtD129EOI7K3HlHIsFOt0WrI2/oU9g==}
+  lodash.castarray@4.4.0:
+    resolution: {integrity: sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==}
+
+  lodash.isplainobject@4.0.6:
+    resolution: {integrity: sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==}
+
+  lodash.merge@4.6.2:
+    resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
+
+  lodash.sortby@4.7.0:
+    resolution: {integrity: sha512-HDWXG8isMntAyRF5vZ7xKuEvOhT4AhlRt/3czTSjvGUxjYCBVRQY48ViDHyfYz9VIoBkW4TMGQNapx+l3RUwdA==}
+
+  loose-envify@1.4.0:
+    resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
+    hasBin: true
+
+  loupe@3.1.1:
+    resolution: {integrity: sha512-edNu/8D5MKVfGVFRhFf8aAxiTM6Wumfz5XsaatSxlD3w4R1d/WEKUTydCdPGbl9K7QG/Ca3GnDV2sIKIpXRQcw==}
+
+  lru-cache@10.4.3:
+    resolution: {integrity: sha512-JNAzZcXrCt42VGLuYz0zfAzDfAvJWW6AfYlDBQyDV5DClI2m5sAmK+OIO7s59XfsRsWHp02jAJrRadPRGTt6SQ==}
+
+  lru-cache@5.1.1:
+    resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}
+
+  magic-string@0.30.11:
+    resolution: {integrity: sha512-+Wri9p0QHMy+545hKww7YAu5NyzF8iomPL/RQazugQ9+Ez4Ic3mERMd8ZTX5rfK944j+560ZJi8iAwgak1Ac7A==}
 
   merge-stream@2.0.0:
     resolution: {integrity: sha512-abv/qOcuPfk3URPfDzmZU1LKmuw8kT+0nIHvKrKgFrwifol/doWcdA4ZqsWQ8ENrFKkd67Mfpo/LovbIUsbt3w==}
@@ -2827,101 +3146,75 @@ packages:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
     engines: {node: '>= 8'}
 
-  micro-memoize@5.1.1:
-    resolution: {integrity: sha512-QDwluos8YeMijiKxZGwaV4f4tzj0soS6+xcsJhJ3+4wdEIHMyKbIKVUziebOgWX3e6yiijdoaHo+9tyhbnaWXA==}
+  micro-memoize@4.1.3:
+    resolution: {integrity: sha512-DzRMi8smUZXT7rCGikRwldEh6eO6qzKiPPopcr1+2EY3AYKpy5fu159PKWwIS9A6IWnrvPKDMcuFtyrroZa8Bw==}
+
+  micromatch@4.0.7:
+    resolution: {integrity: sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==}
+    engines: {node: '>=8.6'}
 
   micromatch@4.0.8:
     resolution: {integrity: sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==}
     engines: {node: '>=8.6'}
 
-  mime-db@1.54.0:
-    resolution: {integrity: sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==}
-    engines: {node: '>= 0.6'}
+  mimic-fn@4.0.0:
+    resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==}
+    engines: {node: '>=12'}
 
   mini-svg-data-uri@1.4.4:
     resolution: {integrity: sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==}
     hasBin: true
 
-  minimizer-webpack-plugin@5.6.1:
-    resolution: {integrity: sha512-DoeAZz8Q1C1znwsUzej1fdoi4jCf7/+Em27ouLqfK/+3m8G+D7yDhUwrc3CNhjSzGUN1kn7Iv4sWmjflQHenpw==}
-    engines: {node: '>= 10.13.0'}
-    peerDependencies:
-      '@minify-html/node': '*'
-      '@swc/core': '*'
-      '@swc/css': '*'
-      '@swc/html': '*'
-      clean-css: '*'
-      cssnano: '*'
-      csso: '*'
-      esbuild: '*'
-      html-minifier-terser: '*'
-      lightningcss: '*'
-      postcss: '*'
-      uglify-js: '*'
-      webpack: ^5.1.0
-    peerDependenciesMeta:
-      '@minify-html/node':
-        optional: true
-      '@swc/core':
-        optional: true
-      '@swc/css':
-        optional: true
-      '@swc/html':
-        optional: true
-      clean-css:
-        optional: true
-      cssnano:
-        optional: true
-      csso:
-        optional: true
-      esbuild:
-        optional: true
-      html-minifier-terser:
-        optional: true
-      lightningcss:
-        optional: true
-      postcss:
-        optional: true
-      uglify-js:
-        optional: true
+  minimatch@3.1.2:
+    resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
 
-  mlly@1.8.2:
-    resolution: {integrity: sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA==}
+  minimatch@9.0.5:
+    resolution: {integrity: sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
+  minimist@1.2.8:
+    resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
+
+  minipass@7.1.2:
+    resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
+  mlly@1.7.3:
+    resolution: {integrity: sha512-xUsx5n/mN0uQf4V548PKQ+YShA4/IW0KI1dZhrNrPCLG+xizETbHTkOa1f8/xut9JRPp8kQuMnz0oqwkTiLo/A==}
 
   mri@1.2.0:
     resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
     engines: {node: '>=4'}
 
+  ms@2.1.2:
+    resolution: {integrity: sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==}
+
   ms@2.1.3:
     resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
 
-  mute-stream@3.0.0:
-    resolution: {integrity: sha512-dkEJPVvun4FryqBmZ5KhDo0K9iDXAwn08tMLDinNdRBNPcYEDiWYysLcc6k3mjTMlbP9KyylvRpd4wFtwrT9rw==}
-    engines: {node: ^20.17.0 || >=22.9.0}
-
   mz@2.7.0:
     resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==}
 
-  nanoid@3.3.12:
-    resolution: {integrity: sha512-ZB9RH/39qpq5Vu6Y+NmUaFhQR6pp+M2Xt76XBnEwDaGcVAqhlvxrl3B2bKS5D3NH3QR76v3aSrKaF/Kiy7lEtQ==}
+  nanoid@3.3.7:
+    resolution: {integrity: sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
-  nanoid@3.3.16:
-    resolution: {integrity: sha512-bzlKTyNJ7+LdGIIwy8ijFpIqEQIvafahV7eYykJ8Cvh42EdJeODoJ6gUJXpQJvej1BddH8OqTXZNE/KfbWAu8Q==}
+  nanoid@3.3.8:
+    resolution: {integrity: sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
-  neo-async@2.6.2:
-    resolution: {integrity: sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==}
+  natural-compare@1.4.0:
+    resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
-  next@16.2.7:
-    resolution: {integrity: sha512-eMJxgjRzBaj3olkP4cBamHDXL79A8FC6u1GcsO1D1Tsx8bw/LLXUJCaoajVxtnhD3A1IJqIT8IcRJjgBIPJq4w==}
-    engines: {node: '>=20.9.0'}
+  next@15.2.3:
+    resolution: {integrity: sha512-x6eDkZxk2rPpu46E1ZVUWIBhYCLszmUY6fvHBFcbzJ9dD+qRX6vcHusaqqDlnY+VngKzKbAiG2iRCkPbmi8f7w==}
+    engines: {node: ^18.18.0 || ^19.8.0 || >= 20.0.0}
     hasBin: true
     peerDependencies:
       '@opentelemetry/api': ^1.1.0
-      '@playwright/test': ^1.51.1
+      '@playwright/test': ^1.41.2
       babel-plugin-react-compiler: '*'
       react: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0
       react-dom: ^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0
@@ -2939,29 +3232,47 @@ packages:
   node-addon-api@7.1.1:
     resolution: {integrity: sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==}
 
-  node-addon-api@8.7.0:
-    resolution: {integrity: sha512-9MdFxmkKaOYVTV+XVRG8ArDwwQ77XIgIPyKASB1k3JPq3M8fGQQQE3YpMOrKm6g//Ktx8ivZr8xo1Qmtqub+GA==}
+  node-addon-api@8.2.2:
+    resolution: {integrity: sha512-9emqXAKhVoNrQ792nLI/wpzPpJ/bj/YXxW0CvAau1+RdGBcCRF1Dmz7719zgVsQNrzHl9Tzn3ImZ4qWFarWL0A==}
     engines: {node: ^18 || ^20 || >= 21}
 
-  node-forge@1.4.0:
-    resolution: {integrity: sha512-LarFH0+6VfriEhqMMcLX2F7SwSXeWwnEAJEsYm5QKWchiVYVvJyV9v7UDvUv+w5HO23ZpQTXDv/GxdDdMyOuoQ==}
+  node-addon-api@8.3.0:
+    resolution: {integrity: sha512-8VOpLHFrOQlAH+qA0ZzuGRlALRA6/LVh8QJldbrC4DY0hXoMP0l4Acq8TzFC018HztWiRqyCEj2aTWY2UvnJUg==}
+    engines: {node: ^18 || ^20 || >= 21}
+
+  node-forge@1.3.1:
+    resolution: {integrity: sha512-dPEtOeMvF9VMcYV/1Wb8CPoVAXtp6MKMlcbAt4ddqmGqUJ6fQZFXkNZNkNlfevtNkGtaSoXf/vNNNSvgrdXwtA==}
     engines: {node: '>= 6.13.0'}
 
+  node-gyp-build@4.8.2:
+    resolution: {integrity: sha512-IRUxE4BVsHWXkV/SFOut4qTlagw2aM8T5/vnTsmrHJvVoKueJHRc/JaFND7QDDc61kLYUJ6qlZM3sqTSyx2dTw==}
+    hasBin: true
+
   node-gyp-build@4.8.4:
     resolution: {integrity: sha512-LA4ZjwlnUblHVgq0oBF3Jl/6h/Nvs5fzBLwdEF4nuxnFdsfajde4WfxtJr3CaiH+F6ewcIB/q4jQ4UzPyid+CQ==}
     hasBin: true
 
-  node-mock-http@1.0.4:
-    resolution: {integrity: sha512-8DY+kFsDkNXy1sJglUfuODx1/opAGJGyrTuFqEoN90oRc2Vk0ZbD4K2qmKXBBEhZQzdKHIVfEJpDU8Ak2NJEvQ==}
+  node-mock-http@1.0.0:
+    resolution: {integrity: sha512-0uGYQ1WQL1M5kKvGRXWQ3uZCHtLTO8hln3oBjIusM75WoesZ909uQJs/Hb946i2SS+Gsrhkaa6iAO17jRIv6DQ==}
 
-  node-releases@2.0.46:
-    resolution: {integrity: sha512-GYVXHE2KnrzAfsAjl4uP++evGFCrAU1jta4ubEjIG7YWt/64Gqv66a30yKwWczVjA6j3bM4nBwH7Pk1JmDHaxQ==}
-    engines: {node: '>=18'}
+  node-releases@2.0.18:
+    resolution: {integrity: sha512-d9VeXT4SJ7ZeOqGX6R5EM022wpL+eWPooLI+5UpWn2jCT1aosUQEhQP214x33Wkwx3JQMvIm+tIoVOdodFS40g==}
+
+  node-releases@2.0.19:
+    resolution: {integrity: sha512-xxOWJsBKtzAq7DY0J+DTzuz58K8e7sJbdgwkbMWQe8UYB6ekmsQ45q0M/tJDsGaZmbC+l7n57UV8Hl5tHxO9uw==}
 
   normalize-path@3.0.0:
     resolution: {integrity: sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==}
     engines: {node: '>=0.10.0'}
 
+  normalize-range@0.1.2:
+    resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
+    engines: {node: '>=0.10.0'}
+
+  npm-run-path@5.3.0:
+    resolution: {integrity: sha512-ppwTtiJZq0O/ai0z7yfudtBpWIoxM8yE6nHi1X47eFR2EWORqfbu6CnPlNsjeN683eT0qG6H/Pyf9fCcvjnnnQ==}
+    engines: {node: ^12.20.0 || ^14.13.1 || >=16.0.0}
+
   object-assign@4.1.1:
     resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==}
     engines: {node: '>=0.10.0'}
@@ -2970,77 +3281,157 @@ packages:
     resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==}
     engines: {node: '>= 6'}
 
-  obug@2.1.1:
-    resolution: {integrity: sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==}
+  object-inspect@1.13.2:
+    resolution: {integrity: sha512-IRZSRuzJiynemAXPYtPe5BoI/RESNYR7TYm50MC5Mqbd3Jmw5y790sErYw3V6SryFJD64b74qQQs9wn5Bg/k3g==}
+    engines: {node: '>= 0.4'}
 
-  obug@2.1.4:
-    resolution: {integrity: sha512-4a+OsYv9UktOJKE+l1A4OufDgdRF9PifWj+tJnHURo/P+WOxpG4GzUFL9qCalmWauao6ogiG+QvnCovwPoyAWA==}
-    engines: {node: '>=12.20.0'}
+  object-keys@1.1.1:
+    resolution: {integrity: sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==}
+    engines: {node: '>= 0.4'}
+
+  object.assign@4.1.5:
+    resolution: {integrity: sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==}
+    engines: {node: '>= 0.4'}
+
+  object.entries@1.1.8:
+    resolution: {integrity: sha512-cmopxi8VwRIAw/fkijJohSfpef5PdN0pMQJN6VC/ZKvn0LIknWD8KtgY6KlQdEc4tIjcQ3HxSMmnvtzIscdaYQ==}
+    engines: {node: '>= 0.4'}
+
+  object.fromentries@2.0.8:
+    resolution: {integrity: sha512-k6E21FzySsSK5a21KRADBd/NGneRegFO5pLHfdQLpRDETUNJueLXs3WCzyQ3tFRDYgbq3KHGXfTbi2bs8WQ6rQ==}
+    engines: {node: '>= 0.4'}
+
+  object.groupby@1.0.3:
+    resolution: {integrity: sha512-+Lhy3TQTuzXI5hevh8sBGqbmurHbbIjAi0Z4S63nthVLmLxfbj4T54a4CfZrXIrt9iP4mVAPYMo/v99taj3wjQ==}
+    engines: {node: '>= 0.4'}
+
+  object.values@1.2.0:
+    resolution: {integrity: sha512-yBYjY9QX2hnRmZHAjG/f13MzmBzxzYgQhFrke06TTyKY5zSTEqkOeukBzIdVA3j3ulu8Qa3MbVFShV7T2RmGtQ==}
+    engines: {node: '>= 0.4'}
+
+  onetime@6.0.0:
+    resolution: {integrity: sha512-1FlR+gjXK7X+AsAHso35MnyN5KqGwJRi/31ft6x0M194ht7S+rWAvd7PHss9xSKMzE0asv1pyIHaJYq+BbacAQ==}
+    engines: {node: '>=12'}
+
+  optionator@0.9.4:
+    resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==}
+    engines: {node: '>= 0.8.0'}
+
+  p-limit@3.1.0:
+    resolution: {integrity: sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==}
+    engines: {node: '>=10'}
+
+  p-locate@5.0.0:
+    resolution: {integrity: sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==}
+    engines: {node: '>=10'}
+
+  package-json-from-dist@1.0.1:
+    resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==}
 
   package-up@5.0.0:
     resolution: {integrity: sha512-MQEgDUvXCa3sGvqHg3pzHO8e9gqTCMPVrWUko3vPQGntwegmFo52mZb2abIVTjFnUcW0BcPz0D93jV5Cas1DWA==}
     engines: {node: '>=18'}
 
+  parent-module@1.0.1:
+    resolution: {integrity: sha512-GQ2EWRpQV8/o+Aw8YqtfZZPfNRWZYkbidE9k5rpl/hC3vtHHBfGm2Ifi6qWV+coDGkrUKZAxE3Lot5kcsRlh+g==}
+    engines: {node: '>=6'}
+
+  path-exists@4.0.0:
+    resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
+    engines: {node: '>=8'}
+
+  path-key@3.1.1:
+    resolution: {integrity: sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==}
+    engines: {node: '>=8'}
+
+  path-key@4.0.0:
+    resolution: {integrity: sha512-haREypq7xkM7ErfgIyA0z+Bj4AGKlMSdlQE2jvJo6huWD1EdkKYV+G/T4nq0YEF2vgTT8kqMFKo1uHn950r4SQ==}
+    engines: {node: '>=12'}
+
   path-parse@1.0.7:
     resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
 
-  pathe@2.0.3:
-    resolution: {integrity: sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==}
+  path-scurry@1.11.1:
+    resolution: {integrity: sha512-Xa4Nw17FS9ApQFJ9umLiJS4orGjm7ZzwUrwamcGQuHSzDyth9boKDaycYdDcZDuqYATXw4HFXgaqWTctW/v1HA==}
+    engines: {node: '>=16 || 14 >=14.18'}
+
+  path-type@6.0.0:
+    resolution: {integrity: sha512-Vj7sf++t5pBD637NSfkxpHSMfWaeig5+DKWLhcqIYx6mWQz5hdJTGDVMQiJcw1ZYkhs7AazKDGpRVji1LJCZUQ==}
+    engines: {node: '>=18'}
+
+  pathe@1.1.2:
+    resolution: {integrity: sha512-whLdWMYL2TwI08hn8/ZqAbrVemu0LNaNNJZX73O6qaIdCTfXutsLhMkjdENX0qhsQ9uIimo4/aQOmXkoon2nDQ==}
+
+  pathval@2.0.0:
+    resolution: {integrity: sha512-vE7JKRyES09KiunauX7nd2Q9/L7lhok4smP9RZTDeD4MVs72Dp2qNFVz39Nz5a0FVEW0BJR6C0DYrq6unoziZA==}
+    engines: {node: '>= 14.16'}
 
   picocolors@1.1.1:
     resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
 
-  picomatch@2.3.2:
-    resolution: {integrity: sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==}
+  picomatch@2.3.1:
+    resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
     engines: {node: '>=8.6'}
 
-  picomatch@4.0.4:
-    resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==}
-    engines: {node: '>=12'}
-
-  picomatch@4.0.5:
-    resolution: {integrity: sha512-RvwwcruNjI1ncT5xRakeyS9Lf8lcItv34KD+aif+VH9kduAyfYBipGh12274xtenIPZ119/R9BdTBa8gAwSh0A==}
+  picomatch@4.0.2:
+    resolution: {integrity: sha512-M7BAV6Rlcy5u+m6oPhAPFgJTzAioX/6B0DxyvDlo9l8+T3nLKbrczg2WLUyzd45L8RqfUMyGPzekbMvX2Ldkwg==}
     engines: {node: '>=12'}
 
   pify@2.3.0:
     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
     engines: {node: '>=0.10.0'}
 
-  pirates@4.0.7:
-    resolution: {integrity: sha512-TfySrs/5nm8fQJDcBDuUng3VOUKsd7S+zqvbOTiGXHfxX4wK31ard+hoNuvkicM/2YFzlpDgABOevKSsB4G/FA==}
+  pirates@4.0.6:
+    resolution: {integrity: sha512-saLsH7WeYYPiD25LDuLRRY/i+6HaPYr6G1OUlN39otzkSTxKnubR9RTxS3/Kk50s1g2JTgFwWQDQyplC5/SHZg==}
     engines: {node: '>= 6'}
 
-  pkg-types@1.3.1:
-    resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
+  pkg-types@1.3.0:
+    resolution: {integrity: sha512-kS7yWjVFCkIw9hqdJBoMxDdzEngmkr5FXeWZZfQ6GoYacjVnsW6l2CcYW/0ThD0vF4LPJgVYnrg4d0uuhwYQbg==}
 
-  playwright-core@1.62.1:
-    resolution: {integrity: sha512-wPYSwEBJY9GHraISXqyqtx0na0LpO3XEX7jNDhntbex7tzUS7kLnZsOlFruFJB4Hi/rhDMjXGqHewDZ68nYZVw==}
-    engines: {node: '>=20'}
+  playwright-core@1.51.0:
+    resolution: {integrity: sha512-x47yPE3Zwhlil7wlNU/iktF7t2r/URR3VLbH6EknJd/04Qc/PSJ0EY3CMXipmglLG+zyRxW6HNo2EGbKLHPWMg==}
+    engines: {node: '>=18'}
     hasBin: true
 
-  playwright@1.62.1:
-    resolution: {integrity: sha512-0M+L3LAD8/nm554LOla9Ayx0j0tmFZ0FBcoQ7F1VuVHpM/XpiC8RcDzBQB8W5+hA8L22THxELzeF+2WcUzvcLg==}
-    engines: {node: '>=20'}
+  playwright@1.51.0:
+    resolution: {integrity: sha512-442pTfGM0xxfCYxuBa/Pu6B2OqxqqaYq39JS8QDMGThUvIOCd6s0ANDog3uwA0cHavVlnTQzGCN7Id2YekDSXA==}
+    engines: {node: '>=18'}
     hasBin: true
 
+  possible-typed-array-names@1.0.0:
+    resolution: {integrity: sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==}
+    engines: {node: '>= 0.4'}
+
   postcss-import@15.1.0:
     resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
     engines: {node: '>=14.0.0'}
     peerDependencies:
       postcss: ^8.0.0
 
-  postcss-import@16.1.1:
-    resolution: {integrity: sha512-2xVS1NCZAfjtVdvXiyegxzJ447GyqCeEI5V7ApgQVOWnros1p5lGNovJNapwPpMombyFBfqDwt7AD3n2l0KOfQ==}
+  postcss-import@16.1.0:
+    resolution: {integrity: sha512-7hsAZ4xGXl4MW+OKEWCnF6T5jqBw80/EE9aXg1r2yyn1RsVEU8EtKXbijEODa+rg7iih4bKf7vlvTGYR4CnPNg==}
     engines: {node: '>=18.0.0'}
     peerDependencies:
       postcss: ^8.0.0
 
-  postcss-js@4.1.0:
-    resolution: {integrity: sha512-oIAOTqgIo7q2EOwbhb8UalYePMvYoIeRY2YKntdpFQXNosSu3vLrniGgmH9OKs/qAkfoj5oB3le/7mINW1LCfw==}
+  postcss-js@4.0.1:
+    resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
     engines: {node: ^12 || ^14 || >= 16}
     peerDependencies:
       postcss: ^8.4.21
 
+  postcss-load-config@4.0.2:
+    resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
+    engines: {node: '>= 14'}
+    peerDependencies:
+      postcss: '>=8.0.9'
+      ts-node: '>=9.0.0'
+    peerDependenciesMeta:
+      postcss:
+        optional: true
+      ts-node:
+        optional: true
+
   postcss-load-config@6.0.1:
     resolution: {integrity: sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==}
     engines: {node: '>= 18'}
@@ -3059,12 +3450,24 @@ packages:
       yaml:
         optional: true
 
+  postcss-media-minmax@5.0.0:
+    resolution: {integrity: sha512-yDUvFf9QdFZTuCUg0g0uNSHVlJ5X1lSzDZjPSFaiCWvjgsvu8vEVxtahPrLMinIDEEGnx6cBe6iqdx5YWz08wQ==}
+    engines: {node: '>=10.0.0'}
+    peerDependencies:
+      postcss: ^8.1.0
+
   postcss-nested@6.2.0:
     resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
     engines: {node: '>=12.0'}
     peerDependencies:
       postcss: ^8.2.14
 
+  postcss-nesting@13.0.1:
+    resolution: {integrity: sha512-VbqqHkOBOt4Uu3G8Dm8n6lU5+9cJFxiuty9+4rcoyRPO9zZS1JIs6td49VIoix3qYqELHlJIn46Oih9SAKo+yQ==}
+    engines: {node: '>=18'}
+    peerDependencies:
+      postcss: ^8.4
+
   postcss-selector-parser@6.0.10:
     resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==}
     engines: {node: '>=4'}
@@ -3073,8 +3476,8 @@ packages:
     resolution: {integrity: sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==}
     engines: {node: '>=4'}
 
-  postcss-selector-parser@7.1.4:
-    resolution: {integrity: sha512-HeP7D2wyhkR+XaK6v4W8oRF62Dsz4flyuczALJp61GckGm42u1saSSJ/0auvcBqxs3jMRFEcPK34At/0JBKdOg==}
+  postcss-selector-parser@7.1.0:
+    resolution: {integrity: sha512-8sLjZwK0R+JlxlYcTuVnyT2v+htpdrjDOKuMcOVdYjt52Lh8hWRYpxBPoKx/Zg+bcjc3wx6fmQevMmUztS/ccA==}
     engines: {node: '>=4'}
 
   postcss-value-parser@4.2.0:
@@ -3084,54 +3487,66 @@ packages:
     resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==}
     engines: {node: ^10 || ^12 || >=14}
 
-  postcss@8.5.16:
-    resolution: {integrity: sha512-vuwillviilfKZsg0VGj5R/YwwcHx4SLsIOI/7K6mQkWx+l5cUHTjj5g0AasTBcyXsbfTgrwsUNmVUb5xVwyPwg==}
+  postcss@8.4.41:
+    resolution: {integrity: sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==}
     engines: {node: ^10 || ^12 || >=14}
 
-  postcss@8.5.25:
-    resolution: {integrity: sha512-DTPx3RWSSnWyzLxQnlH0rJP+EW5ekl16ZU4/psbIhA0e53kJfdgaN5vKM+xP7yJtXVu+nfdVFmlgFDEKAe4Pyw==}
+  postcss@8.5.3:
+    resolution: {integrity: sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==}
     engines: {node: ^10 || ^12 || >=14}
 
-  prettier-plugin-embed@0.5.1:
-    resolution: {integrity: sha512-2Ege8gIlLNTvHElUeU5XcFsD7/dbDXkQA6H9TczHSJAGxB58nNjjifk/dlRMS5E29eqQx/z+ToA4ZVMWzjME/A==}
+  prelude-ls@1.2.1:
+    resolution: {integrity: sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==}
+    engines: {node: '>= 0.8.0'}
 
-  prettier-plugin-organize-imports@4.3.0:
-    resolution: {integrity: sha512-FxFz0qFhyBsGdIsb697f/EkvHzi5SZOhWAjxcx2dLt+Q532bAlhswcXGYB1yzjZ69kW8UoadFBw7TyNwlq96Iw==}
+  prettier-plugin-embed@0.5.0:
+    resolution: {integrity: sha512-A5nzX8U9x+FJdpOKrDrH9eq86xHZNiGguWpphS6chTME0OK1bDgH1X+WLtZq7qV3kUEMkL/dHkr6C1NLdUA7RQ==}
+
+  prettier-plugin-organize-imports@4.0.0:
+    resolution: {integrity: sha512-vnKSdgv9aOlqKeEFGhf9SCBsTyzDSyScy1k7E0R1Uo4L0cTcOV7c1XQaT7jfXIOc/p08WLBfN2QUQA9zDSZMxA==}
     peerDependencies:
+      '@vue/language-plugin-pug': ^2.0.24
       prettier: '>=2.0'
       typescript: '>=2.9'
-      vue-tsc: ^2.1.0 || 3
+      vue-tsc: ^2.0.24
     peerDependenciesMeta:
+      '@vue/language-plugin-pug':
+        optional: true
       vue-tsc:
         optional: true
 
-  prettier@3.9.6:
-    resolution: {integrity: sha512-OpN0zzVdiaiAhxpuuj5efpIS4sY9j7bY6uR5mnj5yPzGkdkjNKSJeUThPb60Jw29QuAZgA4o+/iB49kFiaBX6g==}
+  prettier@3.5.0:
+    resolution: {integrity: sha512-quyMrVt6svPS7CjQ9gKb3GLEX/rl3BCL2oa/QkNcXv4YNVBC9olt3s+H7ukto06q7B1Qz46PbrKLO34PR6vXcA==}
     engines: {node: '>=14'}
     hasBin: true
 
+  prop-types@15.8.1:
+    resolution: {integrity: sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==}
+
+  punycode@2.3.1:
+    resolution: {integrity: sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==}
+    engines: {node: '>=6'}
+
   queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
 
   radix3@1.1.2:
     resolution: {integrity: sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==}
 
-  react-dom@19.2.6:
-    resolution: {integrity: sha512-0prMI+hvBbPjsWnxDLxlCGyM8PN6UuWjEUCYmZhO67xIV9Xasa/r/vDnq+Xyq4Lo27g8QSbO5YzARu0D1Sps3g==}
+  react-dom@19.0.0:
+    resolution: {integrity: sha512-4GV5sHFG0e/0AD4X+ySy6UJd3jVl1iNsNHdpad0qhABJ11twS3TTBnseqsKurKcsNqCEFeGL3uLpVChpIO3QfQ==}
     peerDependencies:
-      react: ^19.2.6
+      react: ^19.0.0
 
-  react-dom@19.2.7:
-    resolution: {integrity: sha512-t0BRVXvbiE/o20Hfw669rLbMCDWtYZLvmJigy2f0MxsXF+71pxhR3xOkspmsO8h3ZlNzyibAmtCa3l4lYKk6gQ==}
-    peerDependencies:
-      react: ^19.2.7
+  react-is@16.13.1:
+    resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
 
-  react@19.2.6:
-    resolution: {integrity: sha512-sfWGGfavi0xr8Pg0sVsyHMAOziVYKgPLNrS7ig+ivMNb3wbCBw3KxtflsGBAwD3gYQlE/AEZsTLgToRrSCjb0Q==}
+  react-refresh@0.14.2:
+    resolution: {integrity: sha512-jCvmsr+1IUSMUyzOkRcvnVbX3ZYC6g9TDrDbFuFmRDq7PD4yaGbLKNQL6k2jnArV8hjYxh7hVhAZB6s9HDGpZA==}
     engines: {node: '>=0.10.0'}
 
-  react@19.2.7:
-    resolution: {integrity: sha512-HNe9WslTbXmFK8o8cmwgAeJFSBvt1bPdHCVKtaaV+WlAN36mpT4hcRpwbf3fY56ar2oIXzsBpOAiIRHAdY0OlQ==}
+  react@19.0.0:
+    resolution: {integrity: sha512-V8AVnmPIICiWpGfm6GLzCR/W5FXLchHop40W4nXBmdlEceh16rCN8O8LNWm5bh5XUX91fh7KpA+W0TgMKmgTpQ==}
     engines: {node: '>=0.10.0'}
 
   read-cache@1.0.0:
@@ -3141,59 +3556,93 @@ packages:
     resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
     engines: {node: '>=8.10.0'}
 
-  readdirp@4.1.2:
-    resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
+  readdirp@4.1.1:
+    resolution: {integrity: sha512-h80JrZu/MHUZCyHu5ciuoI0+WxsCxzxJTILn6Fs8rxSnFPh+UVHYfeIxK1nVGugMqkfC4vJcBOYbkfkwYK0+gw==}
     engines: {node: '>= 14.18.0'}
 
-  require-from-string@2.0.2:
-    resolution: {integrity: sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==}
-    engines: {node: '>=0.10.0'}
+  reflect.getprototypeof@1.0.6:
+    resolution: {integrity: sha512-fmfw4XgoDke3kdI6h4xcUz1dG8uaiv5q9gcEwLS4Pnth2kxT+GZ7YehS1JTMGBQmtV7Y4GFGbs2re2NqhdozUg==}
+    engines: {node: '>= 0.4'}
+
+  regexp.prototype.flags@1.5.2:
+    resolution: {integrity: sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==}
+    engines: {node: '>= 0.4'}
+
+  resolve-from@4.0.0:
+    resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
+    engines: {node: '>=4'}
 
   resolve-from@5.0.0:
     resolution: {integrity: sha512-qYg9KP24dD5qka9J47d0aVky0N+b4fTU89LN9iDnjB5waksiC49rvMB0PrUJQGoTmH50XPiqOvAjDfaijGxYZw==}
     engines: {node: '>=8'}
 
-  resolve@1.22.12:
-    resolution: {integrity: sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==}
-    engines: {node: '>= 0.4'}
+  resolve-pkg-maps@1.0.0:
+    resolution: {integrity: sha512-seS2Tj26TBVOC2NIc2rOe2y2ZO7efxITtLZcGSOnHHNOQ7CkiUBfw0Iw2ck6xkIhPwLhKNLS8BO+hEpngQlqzw==}
+
+  resolve@1.22.8:
+    resolution: {integrity: sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==}
     hasBin: true
 
-  reusify@1.1.0:
-    resolution: {integrity: sha512-g6QUff04oZpHs0eG5p83rFLhHeV00ug/Yf9nZM6fLeUrPguBTkTQOdpAWWspMh55TZfVQDPaN3NQJfbVRAxdIw==}
+  resolve@2.0.0-next.5:
+    resolution: {integrity: sha512-U7WjGVG9sH8tvjW5SmGbQuui75FiyjAX72HX15DwBBwF9dNiQZRQAg9nnPhYy+TUnE0+VcrttuvNI8oSxZcocA==}
+    hasBin: true
+
+  reusify@1.0.4:
+    resolution: {integrity: sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==}
     engines: {iojs: '>=1.0.0', node: '>=0.10.0'}
 
-  rolldown@1.2.1:
-    resolution: {integrity: sha512-4FKJhg8d3OiyQOA6Q1Q0hoFFpW9/OoX+VsHzpECsdsIZoOArrAK90gl59YK/Z+gnDel45bgJZK03ozH/9bCqEw==}
-    engines: {node: ^20.19.0 || >=22.12.0}
-    hasBin: true
-
-  rollup@4.60.4:
-    resolution: {integrity: sha512-WHeFSbZYsPu3+bLoNRUuAO+wavNlocOPf3wSHTP7hcFKVnJeWsYlCDbr3mTS14FCizf9ccIxXA8sGL8zKeQN3g==}
+  rollup@4.34.9:
+    resolution: {integrity: sha512-nF5XYqWWp9hx/LrpC8sZvvvmq0TeTjQgaZHYmAgwysT9nh8sWnZhBnM8ZyVbbJFIQBLwHDNoMqsBZBbUo4U8sQ==}
     engines: {node: '>=18.0.0', npm: '>=8.0.0'}
     hasBin: true
 
   run-parallel@1.2.0:
     resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
 
-  safer-buffer@2.1.2:
-    resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
+  safe-array-concat@1.1.2:
+    resolution: {integrity: sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==}
+    engines: {node: '>=0.4'}
 
-  scheduler@0.27.0:
-    resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==}
+  safe-regex-test@1.0.3:
+    resolution: {integrity: sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==}
+    engines: {node: '>= 0.4'}
 
-  schema-utils@4.3.3:
-    resolution: {integrity: sha512-eflK8wEtyOE6+hsaRVPxvUKYCpRgzLqDTb8krvAsRIwOGlHoSgYLgBXoubGgLd2fT41/OUYdb48v4k4WWHQurA==}
-    engines: {node: '>= 10.13.0'}
+  scheduler@0.25.0:
+    resolution: {integrity: sha512-xFVuu11jh+xcO7JOAGJNOXld8/TcEHK/4CituBUeUb5hqxJLj9YuemAEuvm9gQ/+pgXYfbQuqAkiYu+u7YEsNA==}
 
-  semver@7.8.5:
-    resolution: {integrity: sha512-Y7/KDsb8LjooZpwaqGyulO6DQlksgCncchHGk+sZIY4SBvUocMBEFH5Ur1fI4dV+Jvl0w6cjvucaIi40puRioA==}
+  semver@6.3.1:
+    resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
+    hasBin: true
+
+  semver@7.6.3:
+    resolution: {integrity: sha512-oVekP1cKtI+CTDvHWYFUcMtsK/00wmAEfyqKfNdARm8u1wNVhSgaX7A8d4UuIlUI5e84iEwOhs7ZPYRmzU9U6A==}
     engines: {node: '>=10'}
     hasBin: true
 
-  sharp@0.34.5:
-    resolution: {integrity: sha512-Ou9I5Ft9WNcCbXrU9cMgPBcCK8LiwLqcbywW3t4oDV37n1pzpuNLsYiAV8eODnjbtQlSDwZ2cUEeQz4E54Hltg==}
+  set-function-length@1.2.2:
+    resolution: {integrity: sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==}
+    engines: {node: '>= 0.4'}
+
+  set-function-name@2.0.2:
+    resolution: {integrity: sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==}
+    engines: {node: '>= 0.4'}
+
+  sharp@0.33.5:
+    resolution: {integrity: sha512-haPVm1EkS9pgvHrQ/F3Xy+hgcuMV0Wm9vfIBSiwZ05k+xgb0PkBQpGsAA/oWdDobNaZTH5ppvHtzCFbnSEwHVw==}
     engines: {node: ^18.17.0 || ^20.3.0 || >=21.0.0}
 
+  shebang-command@2.0.0:
+    resolution: {integrity: sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==}
+    engines: {node: '>=8'}
+
+  shebang-regex@3.0.0:
+    resolution: {integrity: sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==}
+    engines: {node: '>=8'}
+
+  side-channel@1.0.6:
+    resolution: {integrity: sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==}
+    engines: {node: '>= 0.4'}
+
   siginfo@2.0.0:
     resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
 
@@ -3201,10 +3650,17 @@ packages:
     resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
     engines: {node: '>=14'}
 
+  simple-swizzle@0.2.2:
+    resolution: {integrity: sha512-JA//kQgZtbuY83m+xT+tXJkmJncGMTFT+C+g2h2R9uxkYIrE2yy9sgmcLhCnw57/WSD+Eh3J97FPEDFnbXnDUg==}
+
   slash@5.1.0:
     resolution: {integrity: sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==}
     engines: {node: '>=14.16'}
 
+  source-map-js@1.2.0:
+    resolution: {integrity: sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==}
+    engines: {node: '>=0.10.0'}
+
   source-map-js@1.2.1:
     resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
     engines: {node: '>=0.10.0'}
@@ -3216,18 +3672,69 @@ packages:
     resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
     engines: {node: '>=0.10.0'}
 
-  source-map@0.7.6:
-    resolution: {integrity: sha512-i5uvt8C3ikiWeNZSVZNWcfZPItFQOsYTUAOkcUPGd8DqDy1uOUikjt5dG+uRlwyvR108Fb9DOd4GvXfT0N2/uQ==}
-    engines: {node: '>= 12'}
+  source-map@0.8.0-beta.0:
+    resolution: {integrity: sha512-2ymg6oRBpebeZi9UUNsgQ89bhx01TcTkmNTGnNO88imTmbSgy4nfujrgVEFKWpMTEGA11EDkTt7mqObTPdigIA==}
+    engines: {node: '>= 8'}
 
   stackback@0.0.2:
     resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
 
-  std-env@4.1.0:
-    resolution: {integrity: sha512-Rq7ybcX2RuC55r9oaPVEW7/xu3tj8u4GeBYHBWCychFtzMIr86A7e3PPEBPT37sHStKX3+TiX/Fr/ACmJLVlLQ==}
+  std-env@3.7.0:
+    resolution: {integrity: sha512-JPbdCEQLj1w5GilpiHAx3qJvFndqybBysA3qUOnznweH4QbNYUsW/ea8QzSrnh0vNsezMMw5bcVool8lM0gwzg==}
 
-  std-env@4.2.0:
-    resolution: {integrity: sha512-oCUKSupKTHX53EyjDtuZQ64pjLJ6yYCtpmEw0goYxtjG9KpbRe8KAsl2tBUGU9DyMcJ0RwJ8GqJAFzMXcXW1Rw==}
+  streamsearch@1.1.0:
+    resolution: {integrity: sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==}
+    engines: {node: '>=10.0.0'}
+
+  string-width@4.2.3:
+    resolution: {integrity: sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==}
+    engines: {node: '>=8'}
+
+  string-width@5.1.2:
+    resolution: {integrity: sha512-HnLOCR3vjcY8beoNLtcjZ5/nxn2afmME6lhrDrebokqMap+XbeW8n9TXpPDOqdGK5qcI3oT0GKTW6wC7EMiVqA==}
+    engines: {node: '>=12'}
+
+  string.prototype.includes@2.0.1:
+    resolution: {integrity: sha512-o7+c9bW6zpAdJHTtujeePODAhkuicdAryFsfVKwA+wGw89wJ4GTY484WTucM9hLtDEOpOvI+aHnzqnC5lHp4Rg==}
+    engines: {node: '>= 0.4'}
+
+  string.prototype.matchall@4.0.11:
+    resolution: {integrity: sha512-NUdh0aDavY2og7IbBPenWqR9exH+E26Sv8e0/eTe1tltDGZL+GtBkDAnnyBtmekfK6/Dq3MkcGtzXFEd1LQrtg==}
+    engines: {node: '>= 0.4'}
+
+  string.prototype.repeat@1.0.0:
+    resolution: {integrity: sha512-0u/TldDbKD8bFCQ/4f5+mNRrXwZ8hg2w7ZR8wa16e8z9XpePWl3eGEcUD0OXpEH/VJH/2G3gjUtR3ZOiBe2S/w==}
+
+  string.prototype.trim@1.2.9:
+    resolution: {integrity: sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==}
+    engines: {node: '>= 0.4'}
+
+  string.prototype.trimend@1.0.8:
+    resolution: {integrity: sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==}
+
+  string.prototype.trimstart@1.0.8:
+    resolution: {integrity: sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==}
+    engines: {node: '>= 0.4'}
+
+  strip-ansi@6.0.1:
+    resolution: {integrity: sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==}
+    engines: {node: '>=8'}
+
+  strip-ansi@7.1.0:
+    resolution: {integrity: sha512-iq6eVVI64nQQTRYq2KtEg2d2uU7LElhTJwsH4YzIHZshxlgZms/wIc4VoDQTlG/IvVIrBKG06CrZnp0qv7hkcQ==}
+    engines: {node: '>=12'}
+
+  strip-bom@3.0.0:
+    resolution: {integrity: sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==}
+    engines: {node: '>=4'}
+
+  strip-final-newline@3.0.0:
+    resolution: {integrity: sha512-dOESqjYr96iWYylGObzd39EuNTa5VJxyvVAEm5Jnh7KGo75V43Hk1odPQkNDyXNmUR6k+gEiDVXnjB8HJ3crXw==}
+    engines: {node: '>=12'}
+
+  strip-json-comments@3.1.1:
+    resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
+    engines: {node: '>=8'}
 
   styled-jsx@5.1.6:
     resolution: {integrity: sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==}
@@ -3242,34 +3749,34 @@ packages:
       babel-plugin-macros:
         optional: true
 
-  sucrase@3.35.1:
-    resolution: {integrity: sha512-DhuTmvZWux4H1UOnWMB3sk0sbaCVOoQZjv8u1rDoTV0HTdGem9hkAZtl4JZy8P2z4Bg0nT+YMeOFyVr4zcG5Tw==}
+  sucrase@3.35.0:
+    resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
     engines: {node: '>=16 || 14 >=14.17'}
     hasBin: true
 
-  supports-color@8.1.1:
-    resolution: {integrity: sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==}
-    engines: {node: '>=10'}
+  supports-color@7.2.0:
+    resolution: {integrity: sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==}
+    engines: {node: '>=8'}
 
   supports-preserve-symlinks-flag@1.0.0:
     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
     engines: {node: '>= 0.4'}
 
-  tagged-tag@1.0.0:
-    resolution: {integrity: sha512-yEFYrVhod+hdNyx7g5Bnkkb0G6si8HJurOoOEgC8B/O0uXLHlaey/65KRv6cuWBNhBgHKAROVpc7QyYqE5gFng==}
-    engines: {node: '>=20'}
+  system-architecture@0.1.0:
+    resolution: {integrity: sha512-ulAk51I9UVUyJgxlv9M6lFot2WP3e7t8Kz9+IS6D4rVba1tR9kON+Ey69f+1R4Q8cd45Lod6a4IcJIxnzGc/zA==}
+    engines: {node: '>=18'}
 
-  tailwindcss@3.4.19:
-    resolution: {integrity: sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==}
+  tailwindcss@3.4.14:
+    resolution: {integrity: sha512-IcSvOcTRcUtQQ7ILQL5quRDg7Xs93PdJEk1ZLbhhvJc7uj/OAhYOnruEiwnGgBvUtaUAJ8/mhSw1o8L2jCiENA==}
     engines: {node: '>=14.0.0'}
     hasBin: true
 
-  tapable@2.3.3:
-    resolution: {integrity: sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==}
+  tapable@2.2.1:
+    resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==}
     engines: {node: '>=6'}
 
-  terser@5.48.0:
-    resolution: {integrity: sha512-J/9An6vs9Us6wKRriSFXBWdRZapREHqFzdNUKk0pmu804EMR6dr6winwo7e5JDxN4xahxQsuysyYFwlwj4XN/Q==}
+  terser@5.31.6:
+    resolution: {integrity: sha512-PQ4DAriWzKj+qgehQ7LK5bQqCFNMmlhjR2PFFLuqGCpuCAauxemVBWwWOxo3UIwWQx8+Pr61Df++r76wDmkQBg==}
     engines: {node: '>=10'}
     hasBin: true
 
@@ -3286,33 +3793,32 @@ packages:
   tinybench@2.9.0:
     resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
 
-  tinyclip@0.1.15:
-    resolution: {integrity: sha512-uo33abH+Ays0xYaDysoBt494Hb3hsEczMpcC0MwFl773pazORx4fmvKhclhR1wonUbB6vvpRsvVMwnhfqeMc+A==}
-    engines: {node: ^16.14.0 || >= 17.3.0}
-
   tinyexec@0.3.2:
     resolution: {integrity: sha512-KQQR9yN7R5+OSwaK0XQoj22pwHoTlgYqmUscPYoknOoWCWfj/5/ABTMRi69FrKU5ffPVh5QcFikpWJI/P1ocHA==}
 
-  tinyexec@1.1.2:
-    resolution: {integrity: sha512-dAqSqE/RabpBKI8+h26GfLq6Vb3JVXs30XYQjdMjaj/c2tS8IYYMbIzP599KtRj7c57/wYApb3QjgRgXmrCukA==}
-    engines: {node: '>=18'}
-
-  tinyglobby@0.2.16:
-    resolution: {integrity: sha512-pn99VhoACYR8nFHhxqix+uvsbXineAasWm5ojXoN8xEwK5Kd3/TrhNn1wByuD52UxWRLy8pu+kRMniEi6Eq9Zg==}
+  tinyglobby@0.2.12:
+    resolution: {integrity: sha512-qkf4trmKSIiMTs/E63cxH+ojC2unam7rJ0WrauAzpT3ECNTxGRMlaXxVbfxMUC/w0LaYk6jQ4y/nGR9uBO3tww==}
     engines: {node: '>=12.0.0'}
 
-  tinyglobby@0.2.17:
-    resolution: {integrity: sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==}
-    engines: {node: '>=12.0.0'}
+  tinypool@1.0.0:
+    resolution: {integrity: sha512-KIKExllK7jp3uvrNtvRBYBWBOAXSX8ZvoaD8T+7KB/QHIuoJW3Pmr60zucywjAlMb5TeXUkcs/MWeWLu0qvuAQ==}
+    engines: {node: ^18.0.0 || >=20.0.0}
 
-  tinyrainbow@3.1.0:
-    resolution: {integrity: sha512-Bf+ILmBgretUrdJxzXM0SgXLZ3XfiaUuOj/IKQHuTXip+05Xn+uyEYdVg0kYDipTBcLrCVyUzAPz7QmArb0mmw==}
+  tinyrainbow@1.2.0:
+    resolution: {integrity: sha512-weEDEq7Z5eTHPDh4xjX789+fHfF+P8boiFB+0vbWzpbnbsEr/GRaohi/uMKxg8RZMXnl1ItAi/IUHWMsjDV7kQ==}
+    engines: {node: '>=14.0.0'}
+
+  tinyspy@3.0.0:
+    resolution: {integrity: sha512-q5nmENpTHgiPVd1cJDDc9cVoYN5x4vCvwT3FMilvKPKneCBZAxn2YWQjDF0UMcE9k0Cay1gBiDfTMU0g+mPMQA==}
     engines: {node: '>=14.0.0'}
 
   to-regex-range@5.0.1:
     resolution: {integrity: sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==}
     engines: {node: '>=8.0'}
 
+  tr46@1.0.1:
+    resolution: {integrity: sha512-dTpowEjclQ7Kgx5SdBkqRzVhERQXov8/l9Ft9dVM9fmg0W0KQSVaXX9T4i6twCPNtYiZM53lpSSUAwJbFPOHxA==}
+
   tree-kill@1.2.2:
     resolution: {integrity: sha512-L0Orpi8qGpRG//Nd+H90vFB+3iHnue1zSSGmNOOCh1GLJ7rUKVwV2HvijphGQS2UmhUZewS9VgvxYIdgr+fG1A==}
     hasBin: true
@@ -3333,17 +3839,26 @@ packages:
       tree-sitter:
         optional: true
 
-  tree-sitter@0.25.1:
-    resolution: {integrity: sha512-mrcEdkYtHfrK1A6fs3O6FxkBo0Qig5XUXqHhxUOQu0bmPo00QF4XaSx4edpazdHwxnSCjlGKGgIqWdaN4dvTLA==}
+  tree-sitter@0.22.4:
+    resolution: {integrity: sha512-usbHZP9/oxNsUY65MQUsduGRqDHQOou1cagUSwjhoSYAmSahjQDAVsh9s+SlZkn8X8+O1FULRGwHu7AFP3kjzg==}
+
+  ts-api-utils@1.3.0:
+    resolution: {integrity: sha512-UQMIo7pb8WRomKR1/+MFVLTroIvDVtMX3K6OUir8ynLyzB8Jeriont2bTAtmNPa1ekAgN7YPDyf6V+ygrdU+eQ==}
+    engines: {node: '>=16'}
+    peerDependencies:
+      typescript: '>=4.2.0'
 
   ts-interface-checker@0.1.13:
     resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==}
 
-  tslib@2.8.1:
-    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
+  tsconfig-paths@3.15.0:
+    resolution: {integrity: sha512-2Ac2RgzDe/cn48GvOe3M+o82pEFewD3UPbyoUHHdKasHwJKjds4fLXWf/Ux5kATBKN20oaFGu+jbElp1pos0mg==}
 
-  tsup@8.5.1:
-    resolution: {integrity: sha512-xtgkqwdhpKWr3tKPmCkvYmS9xnQK3m3XgxZHwSUjvfTjp7YfXe5tT3GgWi0F2N+ZSMsOeWeZFh7ZZFg5iPhing==}
+  tslib@2.8.0:
+    resolution: {integrity: sha512-jWVzBLplnCmoaTr13V9dYbiQ99wvZRd0vNWaDRg+aVYRcjDF3nDksxFDE/+fkXnKhpnUUkmx5pK/v8mCtLVqZA==}
+
+  tsup@8.4.0:
+    resolution: {integrity: sha512-b+eZbPCjz10fRryaAA7C8xlIHnf8VnsaRqydheLIqwG/Mcpfk8Z5zp3HayX7GaTygkigHl5cBUs+IhcySiIexQ==}
     engines: {node: '>=18'}
     hasBin: true
     peerDependencies:
@@ -3361,90 +3876,175 @@ packages:
       typescript:
         optional: true
 
-  turbo@2.10.8:
-    resolution: {integrity: sha512-9+8YX5QOkGXzZxcIykTHgaooRHGMWO+jfdyRK0o+rN0U7hBIig2MrJ8r/aNzIPDPhdA73SGb0O+tIztaModTMg==}
+  tsx@4.19.1:
+    resolution: {integrity: sha512-0flMz1lh74BR4wOvBjuh9olbnwqCPc35OOlfyzHba0Dc+QNUeWX/Gq2YTbnwcWPO3BMd8fkzRVrHcsR+a7z7rA==}
+    engines: {node: '>=18.0.0'}
     hasBin: true
 
-  typanion@3.14.0:
-    resolution: {integrity: sha512-ZW/lVMRabETuYCd9O9ZvMhAh8GslSqaUjxmK/JLPCh6l73CvLBiuXswj/+7LdnWOgYsQ130FqLzFz5aGT4I3Ug==}
+  turbo-darwin-64@2.4.4:
+    resolution: {integrity: sha512-5kPvRkLAfmWI0MH96D+/THnDMGXlFNmjeqNRj5grLKiry+M9pKj3pRuScddAXPdlxjO5Ptz06UNaOQrrYGTx1g==}
+    cpu: [x64]
+    os: [darwin]
 
-  type-fest@5.6.0:
-    resolution: {integrity: sha512-8ZiHFm91orbSAe2PSAiSVBVko18pbhbiB3U9GglSzF/zCGkR+rxpHx6sEMCUm4kxY4LjDIUGgCfUMtwfZfjfUA==}
-    engines: {node: '>=20'}
+  turbo-darwin-arm64@2.4.4:
+    resolution: {integrity: sha512-/gtHPqbGQXDFhrmy+Q/MFW2HUTUlThJ97WLLSe4bxkDrKHecDYhAjbZ4rN3MM93RV9STQb3Tqy4pZBtsd4DfCw==}
+    cpu: [arm64]
+    os: [darwin]
 
-  typescript@5.9.3:
-    resolution: {integrity: sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==}
+  turbo-linux-64@2.4.4:
+    resolution: {integrity: sha512-SR0gri4k0bda56hw5u9VgDXLKb1Q+jrw4lM7WAhnNdXvVoep4d6LmnzgMHQQR12Wxl3KyWPbkz9d1whL6NTm2Q==}
+    cpu: [x64]
+    os: [linux]
+
+  turbo-linux-arm64@2.4.4:
+    resolution: {integrity: sha512-COXXwzRd3vslQIfJhXUklgEqlwq35uFUZ7hnN+AUyXx7hUOLIiD5NblL+ETrHnhY4TzWszrbwUMfe2BYWtaPQg==}
+    cpu: [arm64]
+    os: [linux]
+
+  turbo-windows-64@2.4.4:
+    resolution: {integrity: sha512-PV9rYNouGz4Ff3fd6sIfQy5L7HT9a4fcZoEv8PKRavU9O75G7PoDtm8scpHU10QnK0QQNLbE9qNxOAeRvF0fJg==}
+    cpu: [x64]
+    os: [win32]
+
+  turbo-windows-arm64@2.4.4:
+    resolution: {integrity: sha512-403sqp9t5sx6YGEC32IfZTVWkRAixOQomGYB8kEc6ZD+//LirSxzeCHCnM8EmSXw7l57U1G+Fb0kxgTcKPU/Lg==}
+    cpu: [arm64]
+    os: [win32]
+
+  turbo@2.4.4:
+    resolution: {integrity: sha512-N9FDOVaY3yz0YCOhYIgOGYad7+m2ptvinXygw27WPLQvcZDl3+0Sa77KGVlLSiuPDChOUEnTKE9VJwLSi9BPGQ==}
+    hasBin: true
+
+  type-check@0.4.0:
+    resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
+    engines: {node: '>= 0.8.0'}
+
+  type-fest@4.36.0:
+    resolution: {integrity: sha512-3T/PUdKTCnkUmhQU6FFJEHsLwadsRegktX3TNHk+2JJB9HlA8gp1/VXblXVDI93kSnXF2rdPx0GMbHtJIV2LPg==}
+    engines: {node: '>=16'}
+
+  typed-array-buffer@1.0.2:
+    resolution: {integrity: sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==}
+    engines: {node: '>= 0.4'}
+
+  typed-array-byte-length@1.0.1:
+    resolution: {integrity: sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==}
+    engines: {node: '>= 0.4'}
+
+  typed-array-byte-offset@1.0.2:
+    resolution: {integrity: sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==}
+    engines: {node: '>= 0.4'}
+
+  typed-array-length@1.0.6:
+    resolution: {integrity: sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==}
+    engines: {node: '>= 0.4'}
+
+  typescript@5.5.4:
+    resolution: {integrity: sha512-Mtq29sKDAEYP7aljRgtPOpTvOfbwRWlS6dPRzwjdE+C0R4brX/GUyhHSecbHMFLNBLcJIPt9nl9yG5TZ1weH+Q==}
     engines: {node: '>=14.17'}
     hasBin: true
 
-  typescript@6.0.3:
-    resolution: {integrity: sha512-y2TvuxSZPDyQakkFRPZHKFm+KKVqIisdg9/CZwm9ftvKXLP8NRWj38/ODjNbr43SsoXqNuAisEf1GdCxqWcdBw==}
+  typescript@5.6.3:
+    resolution: {integrity: sha512-hjcS1mhfuyi4WW8IWtjP7brDrG2cuDZukyrYrSauoXGNgx0S7zceP07adYkJycEr56BOUTNPzbInooiN3fn1qw==}
     engines: {node: '>=14.17'}
     hasBin: true
 
-  ufo@1.6.4:
-    resolution: {integrity: sha512-JFNbkD1Svwe0KvGi8GOeLcP4kAWQ609twvCdcHxq1oSL8svv39ZuSvajcD8B+5D0eL4+s1Is2D/O6KN3qcTeRA==}
+  ufo@1.5.4:
+    resolution: {integrity: sha512-UsUk3byDzKd04EyoZ7U4DOlxQaD14JUKQl6/P7wiX4FNvUfm3XL246n9W5AmqwW5RSFJ27NAuM0iLscAOYUiGQ==}
+
+  unbox-primitive@1.0.2:
+    resolution: {integrity: sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==}
 
   uncrypto@0.1.3:
     resolution: {integrity: sha512-Ql87qFHB3s/De2ClA9e0gsnS6zXG27SkTiSJwjCc9MebbfapQfuPzumMIUMi38ezPZVNFcHI9sUIepeQfw8J8Q==}
 
-  undici-types@6.21.0:
-    resolution: {integrity: sha512-iwDZqg0QAGrg9Rav5H4n0M64c3mkR59cJ6wQp+7C4nI0gsmExaedaYLNO44eT4AtBBwjbTiGPMlt2Md0T9H9JQ==}
+  undici-types@5.26.5:
+    resolution: {integrity: sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==}
 
-  undici-types@7.24.6:
-    resolution: {integrity: sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg==}
+  unicorn-magic@0.3.0:
+    resolution: {integrity: sha512-+QBBXBCvifc56fsbuxZQ6Sic3wqqc3WWaqxs58gvJrcOuN83HGTCwz3oS5phzU9LthRNE9VrJCFCLUgHeeFnfA==}
+    engines: {node: '>=18'}
 
-  unicorn-magic@0.4.0:
-    resolution: {integrity: sha512-wH590V9VNgYH9g3lH9wWjTrUoKsjLF6sGLjhR4sH1LWpLmCOH0Zf7PukhDA8BiS7KHe4oPNkcTHqYkj7SOGUOw==}
-    engines: {node: '>=20'}
-
-  universal-user-agent@7.0.3:
-    resolution: {integrity: sha512-TmnEAEAsBJVZM/AADELsK76llnwcf9vMKuPz8JflO1frO8Lchitr0fNaN9d+Ap0BjKtqWqd/J17qeDnXh8CL2A==}
-
-  untun@0.2.2:
-    resolution: {integrity: sha512-+NnOJcSiEtYsVgJmXUzQbJeRAFXJC4yPJYuh6kF9B0Rm6zunXcs/3GZOTllyocSbUDIxD6Bj7e/4ATw7sph1Sw==}
+  untun@0.1.3:
+    resolution: {integrity: sha512-4luGP9LMYszMRZwsvyUd9MrxgEGZdZuZgpVQHEEX0lCYFESasVRvZd0EYpCkOIbJKHMuv0LskpXc/8Un+MJzEQ==}
     hasBin: true
 
-  update-browserslist-db@1.2.3:
-    resolution: {integrity: sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==}
+  update-browserslist-db@1.1.1:
+    resolution: {integrity: sha512-R8UzCaa9Az+38REPiJ1tXlImTJXlVfgHZsglwBD/k6nj76ctsH1E3q4doGrukiLQd3sGQYu56r5+lo5r94l29A==}
     hasBin: true
     peerDependencies:
       browserslist: '>= 4.21.0'
 
-  uqr@0.1.3:
-    resolution: {integrity: sha512-0rjE8iEJe4YmT9TOhwsZtqCMRLc5DXZUI2UEYUUg63ikBkqqE5EYWaI0etFe/5KUcmcYwLih2RND1kq+hrUJXA==}
+  uqr@0.1.2:
+    resolution: {integrity: sha512-MJu7ypHq6QasgF5YRTjqscSzQp/W11zoUk6kvmlH+fmWEs63Y0Eib13hYFwAzagRJcVY8WVnlV+eBDUGMJ5IbA==}
+
+  uri-js@4.4.1:
+    resolution: {integrity: sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==}
 
   util-deprecate@1.0.2:
     resolution: {integrity: sha512-EPD5q1uXyFxJpCrLnCc1nHnq3gOa6DZBocAIiI2TaSCA7VCJ1UJDMagCzIkXNsUYfD1daK//LTEQ8xiIbrHtcw==}
 
-  vite@8.2.0:
-    resolution: {integrity: sha512-pn+CFpM0lwDeKwmOq1ZaBK/9sjorZcgqxki6MbY/jPEVd9vichIlmlD4HmQ5wdP5EgqQCFRaACBxMC7uEGc6lQ==}
-    engines: {node: ^20.19.0 || >=22.12.0}
+  vite-node@2.0.5:
+    resolution: {integrity: sha512-LdsW4pxj0Ot69FAoXZ1yTnA9bjGohr2yNBU7QKRxpz8ITSkhuDl6h3zS/tvgz4qrNjeRnvrWeXQ8ZF7Um4W00Q==}
+    engines: {node: ^18.0.0 || >=20.0.0}
+    hasBin: true
+
+  vite@5.4.0:
+    resolution: {integrity: sha512-5xokfMX0PIiwCMCMb9ZJcMyh5wbBun0zUzKib+L65vAZ8GY9ePZMXxFrHbr/Kyll2+LSCY7xtERPpxkBDKngwg==}
+    engines: {node: ^18.0.0 || >=20.0.0}
     hasBin: true
     peerDependencies:
-      '@types/node': ^20.19.0 || >=22.12.0
-      '@vitejs/devtools': ^0.4.0
-      esbuild: ^0.27.0 || ^0.28.0
+      '@types/node': ^18.0.0 || >=20.0.0
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      sass-embedded: '*'
+      stylus: '*'
+      sugarss: '*'
+      terser: ^5.4.0
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      less:
+        optional: true
+      lightningcss:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+
+  vite@6.0.0:
+    resolution: {integrity: sha512-Q2+5yQV79EdnpbNxjD3/QHVMCBaQ3Kpd4/uL51UGuh38bIIM+s4o3FqyCzRvTRwFb+cWIUeZvaWwS9y2LD2qeQ==}
+    engines: {node: ^18.0.0 || ^20.0.0 || >=22.0.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^18.0.0 || ^20.0.0 || >=22.0.0
       jiti: '>=1.21.0'
-      less: ^4.0.0
-      sass: ^1.70.0
-      sass-embedded: ^1.70.0
-      stylus: '>=0.54.8'
-      sugarss: ^5.0.0
+      less: '*'
+      lightningcss: ^1.21.0
+      sass: '*'
+      sass-embedded: '*'
+      stylus: '*'
+      sugarss: '*'
       terser: ^5.16.0
       tsx: ^4.8.1
       yaml: ^2.4.2
     peerDependenciesMeta:
       '@types/node':
         optional: true
-      '@vitejs/devtools':
-        optional: true
-      esbuild:
-        optional: true
       jiti:
         optional: true
       less:
         optional: true
+      lightningcss:
+        optional: true
       sass:
         optional: true
       sass-embedded:
@@ -3460,39 +4060,23 @@ packages:
       yaml:
         optional: true
 
-  vitest@4.1.10:
-    resolution: {integrity: sha512-R9jUTe5S4Qb0HCd4TNqpC7oGcrMssMRGXLW80ubjWsW9VH5GF8y1Y0SFLY9AbqSk6nt0PnOx4H4WNJYZ13GUPw==}
-    engines: {node: ^20.0.0 || ^22.0.0 || >=24.0.0}
+  vitest@2.0.5:
+    resolution: {integrity: sha512-8GUxONfauuIdeSl5f9GTgVEpg5BTOlplET4WEDaeY2QBiN8wSm68vxN/tb5z405OwppfoCavnwXafiaYBC/xOA==}
+    engines: {node: ^18.0.0 || >=20.0.0}
     hasBin: true
     peerDependencies:
       '@edge-runtime/vm': '*'
-      '@opentelemetry/api': ^1.9.0
-      '@types/node': ^20.0.0 || ^22.0.0 || >=24.0.0
-      '@vitest/browser-playwright': 4.1.10
-      '@vitest/browser-preview': 4.1.10
-      '@vitest/browser-webdriverio': 4.1.10
-      '@vitest/coverage-istanbul': 4.1.10
-      '@vitest/coverage-v8': 4.1.10
-      '@vitest/ui': 4.1.10
+      '@types/node': ^18.0.0 || >=20.0.0
+      '@vitest/browser': 2.0.5
+      '@vitest/ui': 2.0.5
       happy-dom: '*'
       jsdom: '*'
-      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       '@edge-runtime/vm':
         optional: true
-      '@opentelemetry/api':
-        optional: true
       '@types/node':
         optional: true
-      '@vitest/browser-playwright':
-        optional: true
-      '@vitest/browser-preview':
-        optional: true
-      '@vitest/browser-webdriverio':
-        optional: true
-      '@vitest/coverage-istanbul':
-        optional: true
-      '@vitest/coverage-v8':
+      '@vitest/browser':
         optional: true
       '@vitest/ui':
         optional: true
@@ -3501,704 +4085,728 @@ packages:
       jsdom:
         optional: true
 
-  watchpack@2.5.2:
-    resolution: {integrity: sha512-6i/00NBjP4yGPs+caKSyRfpTF/8Torsu0MOW3mMzIbhgISFder8i7xbqgHlLMwJrdiN8ndBV3UA1/AfzPSr+jg==}
-    engines: {node: '>=10.13.0'}
+  webidl-conversions@4.0.2:
+    resolution: {integrity: sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==}
 
-  webpack-sources@3.5.1:
-    resolution: {integrity: sha512-jyuiGJdtvY434z5bUZrjz67v76/ePNvFZTp9Mdz29IlH4+GPsgyGjiv0fKI+M7BdkU6ADjulUcKAd3tUK3WlEw==}
-    engines: {node: '>=10.13.0'}
+  whatwg-url@7.1.0:
+    resolution: {integrity: sha512-WUu7Rg1DroM7oQvGWfOiAK21n74Gg+T4elXEQYkOhtyLeWiJFoOGLXPKI/9gzIie9CtwVLm8wtw6YJdKyxSjeg==}
 
-  webpack@5.109.2:
-    resolution: {integrity: sha512-U9/cvLzxObKNEZ9+TtdqrHM5/9z3lgl2c+c4BzbqGxFQvQvBAq87yql5A8pQ+rrMbS496MZJeF5enVBndIy2hw==}
-    engines: {node: '>=10.13.0'}
+  which-boxed-primitive@1.0.2:
+    resolution: {integrity: sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==}
+
+  which-builtin-type@1.1.4:
+    resolution: {integrity: sha512-bppkmBSsHFmIMSl8BO9TbsyzsvGjVoppt8xUiGzwiu/bhDCGxnpOKCxgqj6GuyHE0mINMDecBFPlOm2hzY084w==}
+    engines: {node: '>= 0.4'}
+
+  which-collection@1.0.2:
+    resolution: {integrity: sha512-K4jVyjnBdgvc86Y6BkaLZEN933SwYOuBFkdmBu9ZfkcAbdVbpITnDmjvZ/aQjRXQrv5EPkTnD1s39GiiqbngCw==}
+    engines: {node: '>= 0.4'}
+
+  which-typed-array@1.1.15:
+    resolution: {integrity: sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==}
+    engines: {node: '>= 0.4'}
+
+  which@2.0.2:
+    resolution: {integrity: sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==}
+    engines: {node: '>= 8'}
     hasBin: true
-    peerDependencies:
-      webpack-cli: '*'
-    peerDependenciesMeta:
-      webpack-cli:
-        optional: true
 
   why-is-node-running@2.3.0:
     resolution: {integrity: sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==}
     engines: {node: '>=8'}
     hasBin: true
 
-  yaml@2.9.0:
-    resolution: {integrity: sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==}
-    engines: {node: '>= 14.6'}
+  word-wrap@1.2.5:
+    resolution: {integrity: sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==}
+    engines: {node: '>=0.10.0'}
+
+  wrap-ansi@7.0.0:
+    resolution: {integrity: sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==}
+    engines: {node: '>=10'}
+
+  wrap-ansi@8.1.0:
+    resolution: {integrity: sha512-si7QWI6zUMq56bESFvagtmzMdGOtoxfR+Sez11Mobfc7tm+VkUckk9bW2UeffTGVUbOksxmSw0AA2gs8g71NCQ==}
+    engines: {node: '>=12'}
+
+  yallist@3.1.1:
+    resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
+
+  yaml@2.6.0:
+    resolution: {integrity: sha512-a6ae//JvKDEra2kdi1qzCyrJW/WZCgFi8ydDV+eXExl95t+5R+ijnqHJbz9tmMh8FUjx3iv2fCQ4dclAQlO2UQ==}
+    engines: {node: '>= 14'}
     hasBin: true
 
+  yocto-queue@0.1.0:
+    resolution: {integrity: sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==}
+    engines: {node: '>=10'}
+
 snapshots:
 
   '@alloc/quick-lru@5.2.0': {}
 
-  '@emnapi/core@1.10.0':
+  '@ampproject/remapping@2.3.0':
     dependencies:
-      '@emnapi/wasi-threads': 1.2.1
-      tslib: 2.8.1
-    optional: true
+      '@jridgewell/gen-mapping': 0.3.5
+      '@jridgewell/trace-mapping': 0.3.25
 
-  '@emnapi/core@1.11.3':
+  '@babel/code-frame@7.26.2':
     dependencies:
-      '@emnapi/wasi-threads': 1.2.3
-      tslib: 2.8.1
+      '@babel/helper-validator-identifier': 7.25.9
+      js-tokens: 4.0.0
+      picocolors: 1.1.1
 
-  '@emnapi/core@2.0.0-alpha.3':
+  '@babel/compat-data@7.26.3': {}
+
+  '@babel/core@7.26.0':
     dependencies:
-      '@emnapi/wasi-threads': 2.0.1
-      tslib: 2.8.1
-    optional: true
+      '@ampproject/remapping': 2.3.0
+      '@babel/code-frame': 7.26.2
+      '@babel/generator': 7.26.3
+      '@babel/helper-compilation-targets': 7.25.9
+      '@babel/helper-module-transforms': 7.26.0(@babel/core@7.26.0)
+      '@babel/helpers': 7.26.0
+      '@babel/parser': 7.26.3
+      '@babel/template': 7.25.9
+      '@babel/traverse': 7.26.4
+      '@babel/types': 7.26.3
+      convert-source-map: 2.0.0
+      debug: 4.4.0
+      gensync: 1.0.0-beta.2
+      json5: 2.2.3
+      semver: 6.3.1
+    transitivePeerDependencies:
+      - supports-color
 
-  '@emnapi/runtime@1.10.0':
+  '@babel/generator@7.26.3':
     dependencies:
-      tslib: 2.8.1
-    optional: true
+      '@babel/parser': 7.26.3
+      '@babel/types': 7.26.3
+      '@jridgewell/gen-mapping': 0.3.5
+      '@jridgewell/trace-mapping': 0.3.25
+      jsesc: 3.1.0
 
-  '@emnapi/runtime@1.11.3':
+  '@babel/helper-compilation-targets@7.25.9':
     dependencies:
-      tslib: 2.8.1
+      '@babel/compat-data': 7.26.3
+      '@babel/helper-validator-option': 7.25.9
+      browserslist: 4.24.2
+      lru-cache: 5.1.1
+      semver: 6.3.1
 
-  '@emnapi/runtime@2.0.0-alpha.3':
+  '@babel/helper-module-imports@7.25.9':
     dependencies:
-      tslib: 2.8.1
-    optional: true
+      '@babel/traverse': 7.26.4
+      '@babel/types': 7.26.3
+    transitivePeerDependencies:
+      - supports-color
 
-  '@emnapi/wasi-threads@1.2.1':
+  '@babel/helper-module-transforms@7.26.0(@babel/core@7.26.0)':
     dependencies:
-      tslib: 2.8.1
-    optional: true
+      '@babel/core': 7.26.0
+      '@babel/helper-module-imports': 7.25.9
+      '@babel/helper-validator-identifier': 7.25.9
+      '@babel/traverse': 7.26.4
+    transitivePeerDependencies:
+      - supports-color
 
-  '@emnapi/wasi-threads@1.2.3':
+  '@babel/helper-plugin-utils@7.25.9': {}
+
+  '@babel/helper-string-parser@7.25.9': {}
+
+  '@babel/helper-validator-identifier@7.25.9': {}
+
+  '@babel/helper-validator-option@7.25.9': {}
+
+  '@babel/helpers@7.26.0':
     dependencies:
-      tslib: 2.8.1
+      '@babel/template': 7.25.9
+      '@babel/types': 7.26.3
 
-  '@emnapi/wasi-threads@2.0.1':
+  '@babel/parser@7.26.3':
     dependencies:
-      tslib: 2.8.1
+      '@babel/types': 7.26.3
+
+  '@babel/plugin-transform-react-jsx-self@7.25.9(@babel/core@7.26.0)':
+    dependencies:
+      '@babel/core': 7.26.0
+      '@babel/helper-plugin-utils': 7.25.9
+
+  '@babel/plugin-transform-react-jsx-source@7.25.9(@babel/core@7.26.0)':
+    dependencies:
+      '@babel/core': 7.26.0
+      '@babel/helper-plugin-utils': 7.25.9
+
+  '@babel/template@7.25.9':
+    dependencies:
+      '@babel/code-frame': 7.26.2
+      '@babel/parser': 7.26.3
+      '@babel/types': 7.26.3
+
+  '@babel/traverse@7.26.4':
+    dependencies:
+      '@babel/code-frame': 7.26.2
+      '@babel/generator': 7.26.3
+      '@babel/parser': 7.26.3
+      '@babel/template': 7.25.9
+      '@babel/types': 7.26.3
+      debug: 4.4.0
+      globals: 11.12.0
+    transitivePeerDependencies:
+      - supports-color
+
+  '@babel/types@7.26.3':
+    dependencies:
+      '@babel/helper-string-parser': 7.25.9
+      '@babel/helper-validator-identifier': 7.25.9
+
+  '@csstools/color-helpers@5.0.2': {}
+
+  '@csstools/css-calc@2.1.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+    dependencies:
+      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-tokenizer': 3.0.3
+
+  '@csstools/css-color-parser@3.0.8(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)':
+    dependencies:
+      '@csstools/color-helpers': 5.0.2
+      '@csstools/css-calc': 2.1.2(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-tokenizer': 3.0.3
+
+  '@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3)':
+    dependencies:
+      '@csstools/css-tokenizer': 3.0.3
+
+  '@csstools/css-tokenizer@3.0.3': {}
+
+  '@csstools/postcss-cascade-layers@5.0.1(postcss@8.5.3)':
+    dependencies:
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.0)
+      postcss: 8.5.3
+      postcss-selector-parser: 7.1.0
+
+  '@csstools/postcss-color-mix-function@3.0.8(postcss@8.5.3)':
+    dependencies:
+      '@csstools/css-color-parser': 3.0.8(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-tokenizer': 3.0.3
+      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.5.3)
+      '@csstools/utilities': 2.0.0(postcss@8.5.3)
+      postcss: 8.5.3
+
+  '@csstools/postcss-oklab-function@4.0.8(postcss@8.5.3)':
+    dependencies:
+      '@csstools/css-color-parser': 3.0.8(@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3))(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-parser-algorithms': 3.0.4(@csstools/css-tokenizer@3.0.3)
+      '@csstools/css-tokenizer': 3.0.3
+      '@csstools/postcss-progressive-custom-properties': 4.0.0(postcss@8.5.3)
+      '@csstools/utilities': 2.0.0(postcss@8.5.3)
+      postcss: 8.5.3
+
+  '@csstools/postcss-progressive-custom-properties@4.0.0(postcss@8.5.3)':
+    dependencies:
+      postcss: 8.5.3
+      postcss-value-parser: 4.2.0
+
+  '@csstools/selector-resolve-nested@3.0.0(postcss-selector-parser@7.1.0)':
+    dependencies:
+      postcss-selector-parser: 7.1.0
+
+  '@csstools/selector-specificity@5.0.0(postcss-selector-parser@7.1.0)':
+    dependencies:
+      postcss-selector-parser: 7.1.0
+
+  '@csstools/utilities@2.0.0(postcss@8.5.3)':
+    dependencies:
+      postcss: 8.5.3
+
+  '@emnapi/runtime@1.3.1':
+    dependencies:
+      tslib: 2.8.0
     optional: true
 
-  '@esbuild/aix-ppc64@0.27.7':
+  '@esbuild/aix-ppc64@0.21.5':
     optional: true
 
-  '@esbuild/android-arm64@0.27.7':
+  '@esbuild/aix-ppc64@0.23.1':
     optional: true
 
-  '@esbuild/android-arm@0.27.7':
+  '@esbuild/aix-ppc64@0.24.0':
     optional: true
 
-  '@esbuild/android-x64@0.27.7':
+  '@esbuild/aix-ppc64@0.25.0':
     optional: true
 
-  '@esbuild/darwin-arm64@0.27.7':
+  '@esbuild/android-arm64@0.21.5':
     optional: true
 
-  '@esbuild/darwin-x64@0.27.7':
+  '@esbuild/android-arm64@0.23.1':
     optional: true
 
-  '@esbuild/freebsd-arm64@0.27.7':
+  '@esbuild/android-arm64@0.24.0':
     optional: true
 
-  '@esbuild/freebsd-x64@0.27.7':
+  '@esbuild/android-arm64@0.25.0':
     optional: true
 
-  '@esbuild/linux-arm64@0.27.7':
+  '@esbuild/android-arm@0.21.5':
     optional: true
 
-  '@esbuild/linux-arm@0.27.7':
+  '@esbuild/android-arm@0.23.1':
     optional: true
 
-  '@esbuild/linux-ia32@0.27.7':
+  '@esbuild/android-arm@0.24.0':
     optional: true
 
-  '@esbuild/linux-loong64@0.27.7':
+  '@esbuild/android-arm@0.25.0':
     optional: true
 
-  '@esbuild/linux-mips64el@0.27.7':
+  '@esbuild/android-x64@0.21.5':
     optional: true
 
-  '@esbuild/linux-ppc64@0.27.7':
+  '@esbuild/android-x64@0.23.1':
     optional: true
 
-  '@esbuild/linux-riscv64@0.27.7':
+  '@esbuild/android-x64@0.24.0':
     optional: true
 
-  '@esbuild/linux-s390x@0.27.7':
+  '@esbuild/android-x64@0.25.0':
     optional: true
 
-  '@esbuild/linux-x64@0.27.7':
+  '@esbuild/darwin-arm64@0.21.5':
     optional: true
 
-  '@esbuild/netbsd-arm64@0.27.7':
+  '@esbuild/darwin-arm64@0.23.1':
     optional: true
 
-  '@esbuild/netbsd-x64@0.27.7':
+  '@esbuild/darwin-arm64@0.24.0':
     optional: true
 
-  '@esbuild/openbsd-arm64@0.27.7':
+  '@esbuild/darwin-arm64@0.25.0':
     optional: true
 
-  '@esbuild/openbsd-x64@0.27.7':
+  '@esbuild/darwin-x64@0.21.5':
     optional: true
 
-  '@esbuild/openharmony-arm64@0.27.7':
+  '@esbuild/darwin-x64@0.23.1':
     optional: true
 
-  '@esbuild/sunos-x64@0.27.7':
+  '@esbuild/darwin-x64@0.24.0':
     optional: true
 
-  '@esbuild/win32-arm64@0.27.7':
+  '@esbuild/darwin-x64@0.25.0':
     optional: true
 
-  '@esbuild/win32-ia32@0.27.7':
+  '@esbuild/freebsd-arm64@0.21.5':
     optional: true
 
-  '@esbuild/win32-x64@0.27.7':
+  '@esbuild/freebsd-arm64@0.23.1':
     optional: true
 
-  '@img/colour@1.1.0':
+  '@esbuild/freebsd-arm64@0.24.0':
     optional: true
 
-  '@img/sharp-darwin-arm64@0.34.5':
+  '@esbuild/freebsd-arm64@0.25.0':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.23.1':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.24.0':
+    optional: true
+
+  '@esbuild/freebsd-x64@0.25.0':
+    optional: true
+
+  '@esbuild/linux-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-arm64@0.23.1':
+    optional: true
+
+  '@esbuild/linux-arm64@0.24.0':
+    optional: true
+
+  '@esbuild/linux-arm64@0.25.0':
+    optional: true
+
+  '@esbuild/linux-arm@0.21.5':
+    optional: true
+
+  '@esbuild/linux-arm@0.23.1':
+    optional: true
+
+  '@esbuild/linux-arm@0.24.0':
+    optional: true
+
+  '@esbuild/linux-arm@0.25.0':
+    optional: true
+
+  '@esbuild/linux-ia32@0.21.5':
+    optional: true
+
+  '@esbuild/linux-ia32@0.23.1':
+    optional: true
+
+  '@esbuild/linux-ia32@0.24.0':
+    optional: true
+
+  '@esbuild/linux-ia32@0.25.0':
+    optional: true
+
+  '@esbuild/linux-loong64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-loong64@0.23.1':
+    optional: true
+
+  '@esbuild/linux-loong64@0.24.0':
+    optional: true
+
+  '@esbuild/linux-loong64@0.25.0':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.21.5':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.23.1':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.24.0':
+    optional: true
+
+  '@esbuild/linux-mips64el@0.25.0':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.23.1':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.24.0':
+    optional: true
+
+  '@esbuild/linux-ppc64@0.25.0':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.23.1':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.24.0':
+    optional: true
+
+  '@esbuild/linux-riscv64@0.25.0':
+    optional: true
+
+  '@esbuild/linux-s390x@0.21.5':
+    optional: true
+
+  '@esbuild/linux-s390x@0.23.1':
+    optional: true
+
+  '@esbuild/linux-s390x@0.24.0':
+    optional: true
+
+  '@esbuild/linux-s390x@0.25.0':
+    optional: true
+
+  '@esbuild/linux-x64@0.21.5':
+    optional: true
+
+  '@esbuild/linux-x64@0.23.1':
+    optional: true
+
+  '@esbuild/linux-x64@0.24.0':
+    optional: true
+
+  '@esbuild/linux-x64@0.25.0':
+    optional: true
+
+  '@esbuild/netbsd-arm64@0.25.0':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.23.1':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.24.0':
+    optional: true
+
+  '@esbuild/netbsd-x64@0.25.0':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.23.1':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.24.0':
+    optional: true
+
+  '@esbuild/openbsd-arm64@0.25.0':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.21.5':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.23.1':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.24.0':
+    optional: true
+
+  '@esbuild/openbsd-x64@0.25.0':
+    optional: true
+
+  '@esbuild/sunos-x64@0.21.5':
+    optional: true
+
+  '@esbuild/sunos-x64@0.23.1':
+    optional: true
+
+  '@esbuild/sunos-x64@0.24.0':
+    optional: true
+
+  '@esbuild/sunos-x64@0.25.0':
+    optional: true
+
+  '@esbuild/win32-arm64@0.21.5':
+    optional: true
+
+  '@esbuild/win32-arm64@0.23.1':
+    optional: true
+
+  '@esbuild/win32-arm64@0.24.0':
+    optional: true
+
+  '@esbuild/win32-arm64@0.25.0':
+    optional: true
+
+  '@esbuild/win32-ia32@0.21.5':
+    optional: true
+
+  '@esbuild/win32-ia32@0.23.1':
+    optional: true
+
+  '@esbuild/win32-ia32@0.24.0':
+    optional: true
+
+  '@esbuild/win32-ia32@0.25.0':
+    optional: true
+
+  '@esbuild/win32-x64@0.21.5':
+    optional: true
+
+  '@esbuild/win32-x64@0.23.1':
+    optional: true
+
+  '@esbuild/win32-x64@0.24.0':
+    optional: true
+
+  '@esbuild/win32-x64@0.25.0':
+    optional: true
+
+  '@eslint-community/eslint-utils@4.4.0(eslint@9.22.0(jiti@2.4.2))':
+    dependencies:
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-visitor-keys: 3.4.3
+
+  '@eslint-community/regexpp@4.12.1': {}
+
+  '@eslint/config-array@0.19.2':
+    dependencies:
+      '@eslint/object-schema': 2.1.6
+      debug: 4.4.0
+      minimatch: 3.1.2
+    transitivePeerDependencies:
+      - supports-color
+
+  '@eslint/config-helpers@0.1.0': {}
+
+  '@eslint/core@0.12.0':
+    dependencies:
+      '@types/json-schema': 7.0.15
+
+  '@eslint/eslintrc@3.3.0':
+    dependencies:
+      ajv: 6.12.6
+      debug: 4.4.0
+      espree: 10.3.0
+      globals: 14.0.0
+      ignore: 5.3.2
+      import-fresh: 3.3.0
+      js-yaml: 4.1.0
+      minimatch: 3.1.2
+      strip-json-comments: 3.1.1
+    transitivePeerDependencies:
+      - supports-color
+
+  '@eslint/js@9.22.0': {}
+
+  '@eslint/object-schema@2.1.6': {}
+
+  '@eslint/plugin-kit@0.2.7':
+    dependencies:
+      '@eslint/core': 0.12.0
+      levn: 0.4.1
+
+  '@humanfs/core@0.19.1': {}
+
+  '@humanfs/node@0.16.6':
+    dependencies:
+      '@humanfs/core': 0.19.1
+      '@humanwhocodes/retry': 0.3.1
+
+  '@humanwhocodes/module-importer@1.0.1': {}
+
+  '@humanwhocodes/retry@0.3.1': {}
+
+  '@humanwhocodes/retry@0.4.2': {}
+
+  '@img/sharp-darwin-arm64@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-darwin-arm64': 1.2.4
+      '@img/sharp-libvips-darwin-arm64': 1.0.4
     optional: true
 
-  '@img/sharp-darwin-x64@0.34.5':
+  '@img/sharp-darwin-x64@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-darwin-x64': 1.2.4
+      '@img/sharp-libvips-darwin-x64': 1.0.4
     optional: true
 
-  '@img/sharp-libvips-darwin-arm64@1.2.4':
+  '@img/sharp-libvips-darwin-arm64@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-darwin-x64@1.2.4':
+  '@img/sharp-libvips-darwin-x64@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-linux-arm64@1.2.4':
+  '@img/sharp-libvips-linux-arm64@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-linux-arm@1.2.4':
+  '@img/sharp-libvips-linux-arm@1.0.5':
     optional: true
 
-  '@img/sharp-libvips-linux-ppc64@1.2.4':
+  '@img/sharp-libvips-linux-s390x@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-linux-riscv64@1.2.4':
+  '@img/sharp-libvips-linux-x64@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-linux-s390x@1.2.4':
+  '@img/sharp-libvips-linuxmusl-arm64@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-linux-x64@1.2.4':
+  '@img/sharp-libvips-linuxmusl-x64@1.0.4':
     optional: true
 
-  '@img/sharp-libvips-linuxmusl-arm64@1.2.4':
-    optional: true
-
-  '@img/sharp-libvips-linuxmusl-x64@1.2.4':
-    optional: true
-
-  '@img/sharp-linux-arm64@0.34.5':
+  '@img/sharp-linux-arm64@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-linux-arm64': 1.2.4
+      '@img/sharp-libvips-linux-arm64': 1.0.4
     optional: true
 
-  '@img/sharp-linux-arm@0.34.5':
+  '@img/sharp-linux-arm@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-linux-arm': 1.2.4
+      '@img/sharp-libvips-linux-arm': 1.0.5
     optional: true
 
-  '@img/sharp-linux-ppc64@0.34.5':
+  '@img/sharp-linux-s390x@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-linux-ppc64': 1.2.4
+      '@img/sharp-libvips-linux-s390x': 1.0.4
     optional: true
 
-  '@img/sharp-linux-riscv64@0.34.5':
+  '@img/sharp-linux-x64@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-linux-riscv64': 1.2.4
+      '@img/sharp-libvips-linux-x64': 1.0.4
     optional: true
 
-  '@img/sharp-linux-s390x@0.34.5':
+  '@img/sharp-linuxmusl-arm64@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-linux-s390x': 1.2.4
+      '@img/sharp-libvips-linuxmusl-arm64': 1.0.4
     optional: true
 
-  '@img/sharp-linux-x64@0.34.5':
+  '@img/sharp-linuxmusl-x64@0.33.5':
     optionalDependencies:
-      '@img/sharp-libvips-linux-x64': 1.2.4
+      '@img/sharp-libvips-linuxmusl-x64': 1.0.4
     optional: true
 
-  '@img/sharp-linuxmusl-arm64@0.34.5':
-    optionalDependencies:
-      '@img/sharp-libvips-linuxmusl-arm64': 1.2.4
-    optional: true
-
-  '@img/sharp-linuxmusl-x64@0.34.5':
-    optionalDependencies:
-      '@img/sharp-libvips-linuxmusl-x64': 1.2.4
-    optional: true
-
-  '@img/sharp-wasm32@0.34.5':
+  '@img/sharp-wasm32@0.33.5':
     dependencies:
-      '@emnapi/runtime': 1.11.3
+      '@emnapi/runtime': 1.3.1
     optional: true
 
-  '@img/sharp-win32-arm64@0.34.5':
+  '@img/sharp-win32-ia32@0.33.5':
     optional: true
 
-  '@img/sharp-win32-ia32@0.34.5':
+  '@img/sharp-win32-x64@0.33.5':
     optional: true
 
-  '@img/sharp-win32-x64@0.34.5':
-    optional: true
-
-  '@inquirer/ansi@2.0.7': {}
-
-  '@inquirer/checkbox@5.2.1(@types/node@25.9.1)':
+  '@isaacs/cliui@8.0.2':
     dependencies:
-      '@inquirer/ansi': 2.0.7
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/figures': 2.0.7
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
+      string-width: 5.1.2
+      string-width-cjs: string-width@4.2.3
+      strip-ansi: 7.1.0
+      strip-ansi-cjs: strip-ansi@6.0.1
+      wrap-ansi: 8.1.0
+      wrap-ansi-cjs: wrap-ansi@7.0.0
 
-  '@inquirer/confirm@6.1.1(@types/node@25.9.1)':
+  '@jridgewell/gen-mapping@0.3.5':
     dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/core@11.2.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/ansi': 2.0.7
-      '@inquirer/figures': 2.0.7
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-      cli-width: 4.1.0
-      fast-wrap-ansi: 0.2.2
-      mute-stream: 3.0.0
-      signal-exit: 4.1.0
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/editor@5.2.2(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/external-editor': 3.0.3(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/expand@5.1.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/external-editor@3.0.3(@types/node@25.9.1)':
-    dependencies:
-      chardet: 2.1.1
-      iconv-lite: 0.7.2
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/figures@2.0.7': {}
-
-  '@inquirer/input@5.1.2(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/number@4.1.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/password@5.1.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/ansi': 2.0.7
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/prompts@8.5.2(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/checkbox': 5.2.1(@types/node@25.9.1)
-      '@inquirer/confirm': 6.1.1(@types/node@25.9.1)
-      '@inquirer/editor': 5.2.2(@types/node@25.9.1)
-      '@inquirer/expand': 5.1.1(@types/node@25.9.1)
-      '@inquirer/input': 5.1.2(@types/node@25.9.1)
-      '@inquirer/number': 4.1.1(@types/node@25.9.1)
-      '@inquirer/password': 5.1.1(@types/node@25.9.1)
-      '@inquirer/rawlist': 5.3.1(@types/node@25.9.1)
-      '@inquirer/search': 4.2.1(@types/node@25.9.1)
-      '@inquirer/select': 5.2.1(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/rawlist@5.3.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/search@4.2.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/figures': 2.0.7
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/select@5.2.1(@types/node@25.9.1)':
-    dependencies:
-      '@inquirer/ansi': 2.0.7
-      '@inquirer/core': 11.2.1(@types/node@25.9.1)
-      '@inquirer/figures': 2.0.7
-      '@inquirer/type': 4.0.7(@types/node@25.9.1)
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@inquirer/type@4.0.7(@types/node@25.9.1)':
-    optionalDependencies:
-      '@types/node': 25.9.1
-
-  '@jridgewell/gen-mapping@0.3.13':
-    dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.5
-      '@jridgewell/trace-mapping': 0.3.31
-
-  '@jridgewell/remapping@2.3.5':
-    dependencies:
-      '@jridgewell/gen-mapping': 0.3.13
-      '@jridgewell/trace-mapping': 0.3.31
+      '@jridgewell/set-array': 1.2.1
+      '@jridgewell/sourcemap-codec': 1.5.0
+      '@jridgewell/trace-mapping': 0.3.25
 
   '@jridgewell/resolve-uri@3.1.2': {}
 
-  '@jridgewell/source-map@0.3.11':
+  '@jridgewell/set-array@1.2.1': {}
+
+  '@jridgewell/source-map@0.3.6':
     dependencies:
-      '@jridgewell/gen-mapping': 0.3.13
-      '@jridgewell/trace-mapping': 0.3.31
+      '@jridgewell/gen-mapping': 0.3.5
+      '@jridgewell/trace-mapping': 0.3.25
+    optional: true
 
-  '@jridgewell/sourcemap-codec@1.5.5': {}
+  '@jridgewell/sourcemap-codec@1.5.0': {}
 
-  '@jridgewell/trace-mapping@0.3.31':
+  '@jridgewell/trace-mapping@0.3.25':
     dependencies:
       '@jridgewell/resolve-uri': 3.1.2
-      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/sourcemap-codec': 1.5.0
 
-  '@napi-rs/cli@3.7.4(patch_hash=9912bf0a9c2cef8329d11c41fbce4d33ce2bdcf660a630b258c962c0a3c44bed)(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)(@types/node@25.9.1)(node-addon-api@8.7.0)':
+  '@napi-rs/cli@2.18.4': {}
+
+  '@next/env@15.2.3': {}
+
+  '@next/eslint-plugin-next@15.2.3':
     dependencies:
-      '@inquirer/prompts': 8.5.2(@types/node@25.9.1)
-      '@napi-rs/cross-toolchain': 1.0.3(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@napi-rs/wasm-tools': 1.0.1(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@octokit/rest': 22.0.1
-      clipanion: 4.0.0-rc.4(typanion@3.14.0)
-      colorette: 2.0.20
-      emnapi: 1.11.3(node-addon-api@8.7.0)
-      es-toolkit: 1.50.0
-      js-yaml: 4.3.1
-      obug: 2.1.4
-      semver: 7.8.5
-      typanion: 3.14.0
-    optionalDependencies:
-      '@emnapi/runtime': 1.11.3
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@napi-rs/cross-toolchain-arm64-target-aarch64'
-      - '@napi-rs/cross-toolchain-arm64-target-armv7'
-      - '@napi-rs/cross-toolchain-arm64-target-ppc64le'
-      - '@napi-rs/cross-toolchain-arm64-target-s390x'
-      - '@napi-rs/cross-toolchain-arm64-target-x86_64'
-      - '@napi-rs/cross-toolchain-x64-target-aarch64'
-      - '@napi-rs/cross-toolchain-x64-target-armv7'
-      - '@napi-rs/cross-toolchain-x64-target-ppc64le'
-      - '@napi-rs/cross-toolchain-x64-target-s390x'
-      - '@napi-rs/cross-toolchain-x64-target-x86_64'
-      - '@types/node'
-      - node-addon-api
-      - supports-color
+      fast-glob: 3.3.1
 
-  '@napi-rs/cross-toolchain@1.0.3(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    dependencies:
-      '@napi-rs/lzma': 1.4.5(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@napi-rs/tar': 1.1.0(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      debug: 4.4.3
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-      - supports-color
-
-  '@napi-rs/lzma-android-arm-eabi@1.4.5':
+  '@next/swc-darwin-arm64@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-android-arm64@1.4.5':
+  '@next/swc-darwin-x64@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-darwin-arm64@1.4.5':
+  '@next/swc-linux-arm64-gnu@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-darwin-x64@1.4.5':
+  '@next/swc-linux-arm64-musl@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-freebsd-x64@1.4.5':
+  '@next/swc-linux-x64-gnu@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-linux-arm-gnueabihf@1.4.5':
+  '@next/swc-linux-x64-musl@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-linux-arm64-gnu@1.4.5':
+  '@next/swc-win32-arm64-msvc@15.2.3':
     optional: true
 
-  '@napi-rs/lzma-linux-arm64-musl@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-linux-ppc64-gnu@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-linux-riscv64-gnu@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-linux-s390x-gnu@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-linux-x64-gnu@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-linux-x64-musl@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-wasm32-wasi@1.4.5(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    dependencies:
-      '@napi-rs/wasm-runtime': 1.2.2(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-    optional: true
-
-  '@napi-rs/lzma-win32-arm64-msvc@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-win32-ia32-msvc@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma-win32-x64-msvc@1.4.5':
-    optional: true
-
-  '@napi-rs/lzma@1.4.5(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    optionalDependencies:
-      '@napi-rs/lzma-android-arm-eabi': 1.4.5
-      '@napi-rs/lzma-android-arm64': 1.4.5
-      '@napi-rs/lzma-darwin-arm64': 1.4.5
-      '@napi-rs/lzma-darwin-x64': 1.4.5
-      '@napi-rs/lzma-freebsd-x64': 1.4.5
-      '@napi-rs/lzma-linux-arm-gnueabihf': 1.4.5
-      '@napi-rs/lzma-linux-arm64-gnu': 1.4.5
-      '@napi-rs/lzma-linux-arm64-musl': 1.4.5
-      '@napi-rs/lzma-linux-ppc64-gnu': 1.4.5
-      '@napi-rs/lzma-linux-riscv64-gnu': 1.4.5
-      '@napi-rs/lzma-linux-s390x-gnu': 1.4.5
-      '@napi-rs/lzma-linux-x64-gnu': 1.4.5
-      '@napi-rs/lzma-linux-x64-musl': 1.4.5
-      '@napi-rs/lzma-wasm32-wasi': 1.4.5(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@napi-rs/lzma-win32-arm64-msvc': 1.4.5
-      '@napi-rs/lzma-win32-ia32-msvc': 1.4.5
-      '@napi-rs/lzma-win32-x64-msvc': 1.4.5
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-
-  '@napi-rs/tar-android-arm-eabi@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-android-arm64@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-darwin-arm64@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-darwin-x64@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-freebsd-x64@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-arm-gnueabihf@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-arm64-gnu@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-arm64-musl@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-ppc64-gnu@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-s390x-gnu@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-x64-gnu@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-linux-x64-musl@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-wasm32-wasi@1.1.0(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    dependencies:
-      '@napi-rs/wasm-runtime': 1.2.2(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-    optional: true
-
-  '@napi-rs/tar-win32-arm64-msvc@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-win32-ia32-msvc@1.1.0':
-    optional: true
-
-  '@napi-rs/tar-win32-x64-msvc@1.1.0':
-    optional: true
-
-  '@napi-rs/tar@1.1.0(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    optionalDependencies:
-      '@napi-rs/tar-android-arm-eabi': 1.1.0
-      '@napi-rs/tar-android-arm64': 1.1.0
-      '@napi-rs/tar-darwin-arm64': 1.1.0
-      '@napi-rs/tar-darwin-x64': 1.1.0
-      '@napi-rs/tar-freebsd-x64': 1.1.0
-      '@napi-rs/tar-linux-arm-gnueabihf': 1.1.0
-      '@napi-rs/tar-linux-arm64-gnu': 1.1.0
-      '@napi-rs/tar-linux-arm64-musl': 1.1.0
-      '@napi-rs/tar-linux-ppc64-gnu': 1.1.0
-      '@napi-rs/tar-linux-s390x-gnu': 1.1.0
-      '@napi-rs/tar-linux-x64-gnu': 1.1.0
-      '@napi-rs/tar-linux-x64-musl': 1.1.0
-      '@napi-rs/tar-wasm32-wasi': 1.1.0(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@napi-rs/tar-win32-arm64-msvc': 1.1.0
-      '@napi-rs/tar-win32-ia32-msvc': 1.1.0
-      '@napi-rs/tar-win32-x64-msvc': 1.1.0
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-
-  '@napi-rs/wasm-runtime@1.1.4(@emnapi/core@1.10.0)(@emnapi/runtime@1.10.0)':
-    dependencies:
-      '@emnapi/core': 1.10.0
-      '@emnapi/runtime': 1.10.0
-      '@tybys/wasm-util': 0.10.3
-    optional: true
-
-  '@napi-rs/wasm-runtime@1.2.2(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    dependencies:
-      '@emnapi/core': 1.11.3
-      '@emnapi/runtime': 1.11.3
-      '@tybys/wasm-util': 0.10.3
-
-  '@napi-rs/wasm-runtime@1.2.2(@emnapi/core@2.0.0-alpha.3)(@emnapi/runtime@2.0.0-alpha.3)':
-    dependencies:
-      '@emnapi/core': 2.0.0-alpha.3
-      '@emnapi/runtime': 2.0.0-alpha.3
-      '@tybys/wasm-util': 0.10.3
-    optional: true
-
-  '@napi-rs/wasm-tools-android-arm-eabi@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-android-arm64@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-darwin-arm64@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-darwin-x64@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-freebsd-x64@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-linux-arm64-gnu@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-linux-arm64-musl@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-linux-x64-gnu@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-linux-x64-musl@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-wasm32-wasi@1.0.1(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    dependencies:
-      '@napi-rs/wasm-runtime': 1.2.2(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-    optional: true
-
-  '@napi-rs/wasm-tools-win32-arm64-msvc@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-win32-ia32-msvc@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools-win32-x64-msvc@1.0.1':
-    optional: true
-
-  '@napi-rs/wasm-tools@1.0.1(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)':
-    optionalDependencies:
-      '@napi-rs/wasm-tools-android-arm-eabi': 1.0.1
-      '@napi-rs/wasm-tools-android-arm64': 1.0.1
-      '@napi-rs/wasm-tools-darwin-arm64': 1.0.1
-      '@napi-rs/wasm-tools-darwin-x64': 1.0.1
-      '@napi-rs/wasm-tools-freebsd-x64': 1.0.1
-      '@napi-rs/wasm-tools-linux-arm64-gnu': 1.0.1
-      '@napi-rs/wasm-tools-linux-arm64-musl': 1.0.1
-      '@napi-rs/wasm-tools-linux-x64-gnu': 1.0.1
-      '@napi-rs/wasm-tools-linux-x64-musl': 1.0.1
-      '@napi-rs/wasm-tools-wasm32-wasi': 1.0.1(@emnapi/core@1.11.3)(@emnapi/runtime@1.11.3)
-      '@napi-rs/wasm-tools-win32-arm64-msvc': 1.0.1
-      '@napi-rs/wasm-tools-win32-ia32-msvc': 1.0.1
-      '@napi-rs/wasm-tools-win32-x64-msvc': 1.0.1
-    transitivePeerDependencies:
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-
-  '@next/env@16.2.7': {}
-
-  '@next/swc-darwin-arm64@16.2.7':
-    optional: true
-
-  '@next/swc-darwin-x64@16.2.7':
-    optional: true
-
-  '@next/swc-linux-arm64-gnu@16.2.7':
-    optional: true
-
-  '@next/swc-linux-arm64-musl@16.2.7':
-    optional: true
-
-  '@next/swc-linux-x64-gnu@16.2.7':
-    optional: true
-
-  '@next/swc-linux-x64-musl@16.2.7':
-    optional: true
-
-  '@next/swc-win32-arm64-msvc@16.2.7':
-    optional: true
-
-  '@next/swc-win32-x64-msvc@16.2.7':
+  '@next/swc-win32-x64-msvc@15.2.3':
     optional: true
 
   '@nodelib/fs.scandir@2.1.5':
@@ -4211,665 +4819,716 @@ snapshots:
   '@nodelib/fs.walk@1.2.8':
     dependencies:
       '@nodelib/fs.scandir': 2.1.5
-      fastq: 1.20.1
+      fastq: 1.17.1
 
-  '@octokit/auth-token@6.0.0': {}
+  '@nolyfill/is-core-module@1.0.39': {}
 
-  '@octokit/core@7.0.6':
-    dependencies:
-      '@octokit/auth-token': 6.0.0
-      '@octokit/graphql': 9.0.3
-      '@octokit/request': 10.0.9
-      '@octokit/request-error': 7.1.0
-      '@octokit/types': 16.0.0
-      before-after-hook: 4.0.0
-      universal-user-agent: 7.0.3
-
-  '@octokit/endpoint@11.0.3':
-    dependencies:
-      '@octokit/types': 16.0.0
-      universal-user-agent: 7.0.3
-
-  '@octokit/graphql@9.0.3':
-    dependencies:
-      '@octokit/request': 10.0.9
-      '@octokit/types': 16.0.0
-      universal-user-agent: 7.0.3
-
-  '@octokit/openapi-types@27.0.0': {}
-
-  '@octokit/plugin-paginate-rest@14.0.0(@octokit/core@7.0.6)':
-    dependencies:
-      '@octokit/core': 7.0.6
-      '@octokit/types': 16.0.0
-
-  '@octokit/plugin-request-log@6.0.0(@octokit/core@7.0.6)':
-    dependencies:
-      '@octokit/core': 7.0.6
-
-  '@octokit/plugin-rest-endpoint-methods@17.0.0(@octokit/core@7.0.6)':
-    dependencies:
-      '@octokit/core': 7.0.6
-      '@octokit/types': 16.0.0
-
-  '@octokit/request-error@7.1.0':
-    dependencies:
-      '@octokit/types': 16.0.0
-
-  '@octokit/request@10.0.9':
-    dependencies:
-      '@octokit/endpoint': 11.0.3
-      '@octokit/request-error': 7.1.0
-      '@octokit/types': 16.0.0
-      content-type: 2.0.0
-      fast-content-type-parse: 3.0.0
-      json-with-bigint: 3.5.8
-      universal-user-agent: 7.0.3
-
-  '@octokit/rest@22.0.1':
-    dependencies:
-      '@octokit/core': 7.0.6
-      '@octokit/plugin-paginate-rest': 14.0.0(@octokit/core@7.0.6)
-      '@octokit/plugin-request-log': 6.0.0(@octokit/core@7.0.6)
-      '@octokit/plugin-rest-endpoint-methods': 17.0.0(@octokit/core@7.0.6)
-
-  '@octokit/types@16.0.0':
-    dependencies:
-      '@octokit/openapi-types': 27.0.0
-
-  '@oven/bun-darwin-aarch64@1.3.14':
+  '@oven/bun-darwin-aarch64@1.2.4':
     optional: true
 
-  '@oven/bun-darwin-x64-baseline@1.3.14':
+  '@oven/bun-darwin-x64-baseline@1.2.4':
     optional: true
 
-  '@oven/bun-darwin-x64@1.3.14':
+  '@oven/bun-darwin-x64@1.2.4':
     optional: true
 
-  '@oven/bun-freebsd-aarch64@1.3.14':
+  '@oven/bun-linux-aarch64-musl@1.2.4':
     optional: true
 
-  '@oven/bun-freebsd-x64@1.3.14':
+  '@oven/bun-linux-aarch64@1.2.4':
     optional: true
 
-  '@oven/bun-linux-aarch64-android@1.3.14':
+  '@oven/bun-linux-x64-baseline@1.2.4':
     optional: true
 
-  '@oven/bun-linux-aarch64-musl@1.3.14':
+  '@oven/bun-linux-x64-musl-baseline@1.2.4':
     optional: true
 
-  '@oven/bun-linux-aarch64@1.3.14':
+  '@oven/bun-linux-x64-musl@1.2.4':
     optional: true
 
-  '@oven/bun-linux-x64-android@1.3.14':
+  '@oven/bun-linux-x64@1.2.4':
     optional: true
 
-  '@oven/bun-linux-x64-baseline@1.3.14':
+  '@oven/bun-windows-x64-baseline@1.2.4':
     optional: true
 
-  '@oven/bun-linux-x64-musl-baseline@1.3.14':
+  '@oven/bun-windows-x64@1.2.4':
     optional: true
 
-  '@oven/bun-linux-x64-musl@1.3.14':
+  '@parcel/watcher-android-arm64@2.5.0':
     optional: true
 
-  '@oven/bun-linux-x64@1.3.14':
+  '@parcel/watcher-android-arm64@2.5.1':
     optional: true
 
-  '@oven/bun-windows-aarch64@1.3.14':
+  '@parcel/watcher-darwin-arm64@2.5.0':
     optional: true
 
-  '@oven/bun-windows-x64-baseline@1.3.14':
+  '@parcel/watcher-darwin-arm64@2.5.1': {}
+
+  '@parcel/watcher-darwin-x64@2.5.0':
     optional: true
 
-  '@oven/bun-windows-x64@1.3.14':
+  '@parcel/watcher-darwin-x64@2.5.1': {}
+
+  '@parcel/watcher-freebsd-x64@2.5.0':
     optional: true
 
-  '@oxc-project/types@0.142.0': {}
-
-  '@parcel/watcher-android-arm64@2.6.0':
+  '@parcel/watcher-freebsd-x64@2.5.1':
     optional: true
 
-  '@parcel/watcher-darwin-arm64@2.6.0': {}
-
-  '@parcel/watcher-darwin-x64@2.6.0': {}
-
-  '@parcel/watcher-freebsd-x64@2.6.0':
+  '@parcel/watcher-linux-arm-glibc@2.5.0':
     optional: true
 
-  '@parcel/watcher-linux-arm-glibc@2.6.0':
+  '@parcel/watcher-linux-arm-glibc@2.5.1':
     optional: true
 
-  '@parcel/watcher-linux-arm-musl@2.6.0':
+  '@parcel/watcher-linux-arm-musl@2.5.0':
     optional: true
 
-  '@parcel/watcher-linux-arm64-glibc@2.6.0': {}
+  '@parcel/watcher-linux-arm-musl@2.5.1':
+    optional: true
 
-  '@parcel/watcher-linux-arm64-musl@2.6.0': {}
+  '@parcel/watcher-linux-arm64-glibc@2.5.0':
+    optional: true
 
-  '@parcel/watcher-linux-x64-glibc@2.6.0': {}
+  '@parcel/watcher-linux-arm64-glibc@2.5.1': {}
 
-  '@parcel/watcher-linux-x64-musl@2.6.0': {}
+  '@parcel/watcher-linux-arm64-musl@2.5.0':
+    optional: true
 
-  '@parcel/watcher-wasm@2.5.6':
+  '@parcel/watcher-linux-arm64-musl@2.5.1': {}
+
+  '@parcel/watcher-linux-x64-glibc@2.5.0':
+    optional: true
+
+  '@parcel/watcher-linux-x64-glibc@2.5.1': {}
+
+  '@parcel/watcher-linux-x64-musl@2.5.0':
+    optional: true
+
+  '@parcel/watcher-linux-x64-musl@2.5.1': {}
+
+  '@parcel/watcher-wasm@2.5.0':
     dependencies:
       is-glob: 4.0.3
-      picomatch: 4.0.5
+      micromatch: 4.0.7
 
-  '@parcel/watcher-win32-arm64@2.6.0':
+  '@parcel/watcher-win32-arm64@2.5.0':
     optional: true
 
-  '@parcel/watcher-win32-x64@2.6.0': {}
+  '@parcel/watcher-win32-arm64@2.5.1':
+    optional: true
 
-  '@parcel/watcher@2.6.0(patch_hash=705ce75ccea54337110c4d7fe0a8b421658ea0c23e1a77c1fa890a86041179da)':
+  '@parcel/watcher-win32-ia32@2.5.0':
+    optional: true
+
+  '@parcel/watcher-win32-ia32@2.5.1':
+    optional: true
+
+  '@parcel/watcher-win32-x64@2.5.0':
+    optional: true
+
+  '@parcel/watcher-win32-x64@2.5.1': {}
+
+  '@parcel/watcher@2.5.0':
     dependencies:
-      detect-libc: 2.1.2
+      detect-libc: 1.0.3
       is-glob: 4.0.3
+      micromatch: 4.0.7
       node-addon-api: 7.1.1
-      picomatch: 4.0.5
     optionalDependencies:
-      '@parcel/watcher-android-arm64': 2.6.0
-      '@parcel/watcher-darwin-arm64': 2.6.0
-      '@parcel/watcher-darwin-x64': 2.6.0
-      '@parcel/watcher-freebsd-x64': 2.6.0
-      '@parcel/watcher-linux-arm-glibc': 2.6.0
-      '@parcel/watcher-linux-arm-musl': 2.6.0
-      '@parcel/watcher-linux-arm64-glibc': 2.6.0
-      '@parcel/watcher-linux-arm64-musl': 2.6.0
-      '@parcel/watcher-linux-x64-glibc': 2.6.0
-      '@parcel/watcher-linux-x64-musl': 2.6.0
-      '@parcel/watcher-win32-arm64': 2.6.0
-      '@parcel/watcher-win32-x64': 2.6.0
+      '@parcel/watcher-android-arm64': 2.5.0
+      '@parcel/watcher-darwin-arm64': 2.5.0
+      '@parcel/watcher-darwin-x64': 2.5.0
+      '@parcel/watcher-freebsd-x64': 2.5.0
+      '@parcel/watcher-linux-arm-glibc': 2.5.0
+      '@parcel/watcher-linux-arm-musl': 2.5.0
+      '@parcel/watcher-linux-arm64-glibc': 2.5.0
+      '@parcel/watcher-linux-arm64-musl': 2.5.0
+      '@parcel/watcher-linux-x64-glibc': 2.5.0
+      '@parcel/watcher-linux-x64-musl': 2.5.0
+      '@parcel/watcher-win32-arm64': 2.5.0
+      '@parcel/watcher-win32-ia32': 2.5.0
+      '@parcel/watcher-win32-x64': 2.5.0
 
-  '@playwright/test@1.62.1':
+  '@parcel/watcher@2.5.1(patch_hash=zs2vvlrje3h42xp5ed2v44fep4)':
     dependencies:
-      playwright: 1.62.1
-
-  '@rolldown/binding-android-arm64@1.2.1':
-    optional: true
-
-  '@rolldown/binding-darwin-arm64@1.2.1':
-    optional: true
-
-  '@rolldown/binding-darwin-x64@1.2.1':
-    optional: true
-
-  '@rolldown/binding-freebsd-x64@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-arm-gnueabihf@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-arm64-gnu@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-arm64-musl@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-ppc64-gnu@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-s390x-gnu@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-x64-gnu@1.2.1':
-    optional: true
-
-  '@rolldown/binding-linux-x64-musl@1.2.1':
-    optional: true
-
-  '@rolldown/binding-openharmony-arm64@1.2.1':
-    optional: true
-
-  '@rolldown/binding-wasm32-wasi@1.2.1':
-    dependencies:
-      '@emnapi/core': 2.0.0-alpha.3
-      '@emnapi/runtime': 2.0.0-alpha.3
-      '@napi-rs/wasm-runtime': 1.2.2(@emnapi/core@2.0.0-alpha.3)(@emnapi/runtime@2.0.0-alpha.3)
-    optional: true
-
-  '@rolldown/binding-win32-arm64-msvc@1.2.1':
-    optional: true
-
-  '@rolldown/binding-win32-x64-msvc@1.2.1':
-    optional: true
-
-  '@rolldown/pluginutils@1.0.1': {}
-
-  '@rollup/rollup-android-arm-eabi@4.60.4':
-    optional: true
-
-  '@rollup/rollup-android-arm64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-darwin-arm64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-darwin-x64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-freebsd-arm64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-freebsd-x64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-arm-gnueabihf@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-arm-musleabihf@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-arm64-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-arm64-musl@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-loong64-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-loong64-musl@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-ppc64-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-ppc64-musl@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-riscv64-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-riscv64-musl@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-s390x-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-x64-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-linux-x64-musl@4.60.4':
-    optional: true
-
-  '@rollup/rollup-openbsd-x64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-openharmony-arm64@4.60.4':
-    optional: true
-
-  '@rollup/rollup-win32-arm64-msvc@4.60.4':
-    optional: true
-
-  '@rollup/rollup-win32-ia32-msvc@4.60.4':
-    optional: true
-
-  '@rollup/rollup-win32-x64-gnu@4.60.4':
-    optional: true
-
-  '@rollup/rollup-win32-x64-msvc@4.60.4':
-    optional: true
-
-  '@rspack/binding-darwin-arm64@2.0.2':
-    optional: true
-
-  '@rspack/binding-darwin-x64@2.0.2':
-    optional: true
-
-  '@rspack/binding-linux-arm64-gnu@2.0.2':
-    optional: true
-
-  '@rspack/binding-linux-arm64-musl@2.0.2':
-    optional: true
-
-  '@rspack/binding-linux-x64-gnu@2.0.2':
-    optional: true
-
-  '@rspack/binding-linux-x64-musl@2.0.2':
-    optional: true
-
-  '@rspack/binding-wasm32-wasi@2.0.2':
-    dependencies:
-      '@emnapi/core': 1.10.0
-      '@emnapi/runtime': 1.10.0
-      '@napi-rs/wasm-runtime': 1.1.4(@emnapi/core@1.10.0)(@emnapi/runtime@1.10.0)
-    optional: true
-
-  '@rspack/binding-win32-arm64-msvc@2.0.2':
-    optional: true
-
-  '@rspack/binding-win32-ia32-msvc@2.0.2':
-    optional: true
-
-  '@rspack/binding-win32-x64-msvc@2.0.2':
-    optional: true
-
-  '@rspack/binding@2.0.2':
+      detect-libc: 1.0.3
+      is-glob: 4.0.3
+      micromatch: 4.0.8
+      node-addon-api: 7.1.1
     optionalDependencies:
-      '@rspack/binding-darwin-arm64': 2.0.2
-      '@rspack/binding-darwin-x64': 2.0.2
-      '@rspack/binding-linux-arm64-gnu': 2.0.2
-      '@rspack/binding-linux-arm64-musl': 2.0.2
-      '@rspack/binding-linux-x64-gnu': 2.0.2
-      '@rspack/binding-linux-x64-musl': 2.0.2
-      '@rspack/binding-wasm32-wasi': 2.0.2
-      '@rspack/binding-win32-arm64-msvc': 2.0.2
-      '@rspack/binding-win32-ia32-msvc': 2.0.2
-      '@rspack/binding-win32-x64-msvc': 2.0.2
+      '@parcel/watcher-android-arm64': 2.5.1
+      '@parcel/watcher-darwin-arm64': 2.5.1
+      '@parcel/watcher-darwin-x64': 2.5.1
+      '@parcel/watcher-freebsd-x64': 2.5.1
+      '@parcel/watcher-linux-arm-glibc': 2.5.1
+      '@parcel/watcher-linux-arm-musl': 2.5.1
+      '@parcel/watcher-linux-arm64-glibc': 2.5.1
+      '@parcel/watcher-linux-arm64-musl': 2.5.1
+      '@parcel/watcher-linux-x64-glibc': 2.5.1
+      '@parcel/watcher-linux-x64-musl': 2.5.1
+      '@parcel/watcher-win32-arm64': 2.5.1
+      '@parcel/watcher-win32-ia32': 2.5.1
+      '@parcel/watcher-win32-x64': 2.5.1
 
-  '@rspack/core@2.0.2(@swc/helpers@0.5.15)':
+  '@pkgjs/parseargs@0.11.0':
+    optional: true
+
+  '@playwright/test@1.51.0':
     dependencies:
-      '@rspack/binding': 2.0.2
-    optionalDependencies:
-      '@swc/helpers': 0.5.15
+      playwright: 1.51.0
 
-  '@sindresorhus/merge-streams@4.0.0': {}
+  '@rollup/rollup-android-arm-eabi@4.34.9':
+    optional: true
 
-  '@standard-schema/spec@1.1.0': {}
+  '@rollup/rollup-android-arm64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-darwin-arm64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-darwin-x64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-freebsd-arm64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-freebsd-x64@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm-gnueabihf@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm-musleabihf@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-arm64-musl@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-loongarch64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-powerpc64le-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-riscv64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-s390x-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-x64-gnu@4.34.9':
+    optional: true
+
+  '@rollup/rollup-linux-x64-musl@4.34.9':
+    optional: true
+
+  '@rollup/rollup-win32-arm64-msvc@4.34.9':
+    optional: true
+
+  '@rollup/rollup-win32-ia32-msvc@4.34.9':
+    optional: true
+
+  '@rollup/rollup-win32-x64-msvc@4.34.9':
+    optional: true
+
+  '@rtsao/scc@1.1.0': {}
+
+  '@rushstack/eslint-patch@1.10.4': {}
+
+  '@sindresorhus/merge-streams@2.3.0': {}
+
+  '@swc/counter@0.1.3': {}
 
   '@swc/helpers@0.5.15':
     dependencies:
-      tslib: 2.8.1
+      tslib: 2.8.0
 
   '@tailwindcss/aspect-ratio@0.4.2(tailwindcss@packages+tailwindcss)':
     dependencies:
       tailwindcss: link:packages/tailwindcss
 
-  '@tailwindcss/forms@0.5.11(tailwindcss@packages+tailwindcss)':
+  '@tailwindcss/forms@0.5.10(tailwindcss@packages+tailwindcss)':
     dependencies:
       mini-svg-data-uri: 1.4.4
       tailwindcss: link:packages/tailwindcss
 
-  '@tailwindcss/typography@0.5.20(tailwindcss@packages+tailwindcss)':
+  '@tailwindcss/typography@0.5.16(tailwindcss@packages+tailwindcss)':
     dependencies:
+      lodash.castarray: 4.4.0
+      lodash.isplainobject: 4.0.6
+      lodash.merge: 4.6.2
       postcss-selector-parser: 6.0.10
       tailwindcss: link:packages/tailwindcss
 
-  '@turbo/darwin-64@2.10.8':
-    optional: true
-
-  '@turbo/darwin-arm64@2.10.8':
-    optional: true
-
-  '@turbo/linux-64@2.10.8':
-    optional: true
-
-  '@turbo/linux-arm64@2.10.8':
-    optional: true
-
-  '@turbo/windows-64@2.10.8':
-    optional: true
-
-  '@turbo/windows-arm64@2.10.8':
-    optional: true
-
-  '@tybys/wasm-util@0.10.3':
+  '@types/babel__core@7.20.5':
     dependencies:
-      tslib: 2.8.1
+      '@babel/parser': 7.26.3
+      '@babel/types': 7.26.3
+      '@types/babel__generator': 7.6.8
+      '@types/babel__template': 7.4.4
+      '@types/babel__traverse': 7.20.6
 
-  '@types/bun@1.3.14':
+  '@types/babel__generator@7.6.8':
     dependencies:
-      bun-types: 1.3.14
+      '@babel/types': 7.26.3
 
-  '@types/chai@5.2.3':
+  '@types/babel__template@7.4.4':
     dependencies:
-      '@types/deep-eql': 4.0.2
-      assertion-error: 2.0.1
+      '@babel/parser': 7.26.3
+      '@babel/types': 7.26.3
 
-  '@types/deep-eql@4.0.2': {}
+  '@types/babel__traverse@7.20.6':
+    dependencies:
+      '@babel/types': 7.26.3
 
-  '@types/estree@1.0.8': {}
+  '@types/braces@3.0.5': {}
 
-  '@types/estree@1.0.9': {}
+  '@types/bun@1.2.4':
+    dependencies:
+      bun-types: 1.2.4
+
+  '@types/estree@1.0.6': {}
 
   '@types/json-schema@7.0.15': {}
 
-  '@types/node@22.20.1':
-    dependencies:
-      undici-types: 6.21.0
+  '@types/json5@0.0.29': {}
 
-  '@types/node@25.9.1':
+  '@types/node@20.14.13':
     dependencies:
-      undici-types: 7.24.6
+      undici-types: 5.26.5
 
   '@types/postcss-import@14.0.3':
     dependencies:
-      postcss: 8.5.25
+      postcss: 8.5.3
 
-  '@types/react-dom@19.2.3(@types/react@19.2.15)':
+  '@types/react-dom@19.0.4(@types/react@19.0.10)':
     dependencies:
-      '@types/react': 19.2.15
+      '@types/react': 19.0.10
 
-  '@types/react@19.2.15':
+  '@types/react@19.0.10':
     dependencies:
-      csstype: 3.2.3
+      csstype: 3.1.3
 
-  '@types/semver@7.8.0': {}
-
-  '@vitejs/plugin-react@6.0.2(vite@8.2.0(@types/node@25.9.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))':
+  '@types/ws@8.5.12':
     dependencies:
-      '@rolldown/pluginutils': 1.0.1
-      vite: 8.2.0(@types/node@25.9.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+      '@types/node': 20.14.13
 
-  '@vitest/expect@4.1.10':
+  '@typescript-eslint/eslint-plugin@8.11.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)':
     dependencies:
-      '@standard-schema/spec': 1.1.0
-      '@types/chai': 5.2.3
-      '@vitest/spy': 4.1.10
-      '@vitest/utils': 4.1.10
-      chai: 6.2.2
-      tinyrainbow: 3.1.0
+      '@eslint-community/regexpp': 4.12.1
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      '@typescript-eslint/scope-manager': 8.11.0
+      '@typescript-eslint/type-utils': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      '@typescript-eslint/utils': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      '@typescript-eslint/visitor-keys': 8.11.0
+      eslint: 9.22.0(jiti@2.4.2)
+      graphemer: 1.4.0
+      ignore: 5.3.2
+      natural-compare: 1.4.0
+      ts-api-utils: 1.3.0(typescript@5.5.4)
+    optionalDependencies:
+      typescript: 5.5.4
+    transitivePeerDependencies:
+      - supports-color
 
-  '@vitest/mocker@4.1.10(vite@8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))':
+  '@typescript-eslint/eslint-plugin@8.11.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)':
     dependencies:
-      '@vitest/spy': 4.1.10
+      '@eslint-community/regexpp': 4.12.1
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/scope-manager': 8.11.0
+      '@typescript-eslint/type-utils': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/utils': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/visitor-keys': 8.11.0
+      eslint: 9.22.0(jiti@2.4.2)
+      graphemer: 1.4.0
+      ignore: 5.3.2
+      natural-compare: 1.4.0
+      ts-api-utils: 1.3.0(typescript@5.6.3)
+    optionalDependencies:
+      typescript: 5.6.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)':
+    dependencies:
+      '@typescript-eslint/scope-manager': 8.11.0
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/typescript-estree': 8.11.0(typescript@5.5.4)
+      '@typescript-eslint/visitor-keys': 8.11.0
+      debug: 4.4.0
+      eslint: 9.22.0(jiti@2.4.2)
+    optionalDependencies:
+      typescript: 5.5.4
+    transitivePeerDependencies:
+      - supports-color
+
+  '@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)':
+    dependencies:
+      '@typescript-eslint/scope-manager': 8.11.0
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/typescript-estree': 8.11.0(typescript@5.6.3)
+      '@typescript-eslint/visitor-keys': 8.11.0
+      debug: 4.4.0
+      eslint: 9.22.0(jiti@2.4.2)
+    optionalDependencies:
+      typescript: 5.6.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@typescript-eslint/scope-manager@8.11.0':
+    dependencies:
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/visitor-keys': 8.11.0
+
+  '@typescript-eslint/type-utils@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)':
+    dependencies:
+      '@typescript-eslint/typescript-estree': 8.11.0(typescript@5.5.4)
+      '@typescript-eslint/utils': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      debug: 4.4.0
+      ts-api-utils: 1.3.0(typescript@5.5.4)
+    optionalDependencies:
+      typescript: 5.5.4
+    transitivePeerDependencies:
+      - eslint
+      - supports-color
+
+  '@typescript-eslint/type-utils@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)':
+    dependencies:
+      '@typescript-eslint/typescript-estree': 8.11.0(typescript@5.6.3)
+      '@typescript-eslint/utils': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      debug: 4.4.0
+      ts-api-utils: 1.3.0(typescript@5.6.3)
+    optionalDependencies:
+      typescript: 5.6.3
+    transitivePeerDependencies:
+      - eslint
+      - supports-color
+
+  '@typescript-eslint/types@8.11.0': {}
+
+  '@typescript-eslint/typescript-estree@8.11.0(typescript@5.5.4)':
+    dependencies:
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/visitor-keys': 8.11.0
+      debug: 4.4.0
+      fast-glob: 3.3.3
+      is-glob: 4.0.3
+      minimatch: 9.0.5
+      semver: 7.6.3
+      ts-api-utils: 1.3.0(typescript@5.5.4)
+    optionalDependencies:
+      typescript: 5.5.4
+    transitivePeerDependencies:
+      - supports-color
+
+  '@typescript-eslint/typescript-estree@8.11.0(typescript@5.6.3)':
+    dependencies:
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/visitor-keys': 8.11.0
+      debug: 4.4.0
+      fast-glob: 3.3.3
+      is-glob: 4.0.3
+      minimatch: 9.0.5
+      semver: 7.6.3
+      ts-api-utils: 1.3.0(typescript@5.6.3)
+    optionalDependencies:
+      typescript: 5.6.3
+    transitivePeerDependencies:
+      - supports-color
+
+  '@typescript-eslint/utils@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)':
+    dependencies:
+      '@eslint-community/eslint-utils': 4.4.0(eslint@9.22.0(jiti@2.4.2))
+      '@typescript-eslint/scope-manager': 8.11.0
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/typescript-estree': 8.11.0(typescript@5.5.4)
+      eslint: 9.22.0(jiti@2.4.2)
+    transitivePeerDependencies:
+      - supports-color
+      - typescript
+
+  '@typescript-eslint/utils@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)':
+    dependencies:
+      '@eslint-community/eslint-utils': 4.4.0(eslint@9.22.0(jiti@2.4.2))
+      '@typescript-eslint/scope-manager': 8.11.0
+      '@typescript-eslint/types': 8.11.0
+      '@typescript-eslint/typescript-estree': 8.11.0(typescript@5.6.3)
+      eslint: 9.22.0(jiti@2.4.2)
+    transitivePeerDependencies:
+      - supports-color
+      - typescript
+
+  '@typescript-eslint/visitor-keys@8.11.0':
+    dependencies:
+      '@typescript-eslint/types': 8.11.0
+      eslint-visitor-keys: 3.4.3
+
+  '@vitejs/plugin-react@4.3.4(vite@6.0.0(@types/node@20.14.13)(jiti@2.4.2)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)(tsx@4.19.1)(yaml@2.6.0))':
+    dependencies:
+      '@babel/core': 7.26.0
+      '@babel/plugin-transform-react-jsx-self': 7.25.9(@babel/core@7.26.0)
+      '@babel/plugin-transform-react-jsx-source': 7.25.9(@babel/core@7.26.0)
+      '@types/babel__core': 7.20.5
+      react-refresh: 0.14.2
+      vite: 6.0.0(@types/node@20.14.13)(jiti@2.4.2)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)(tsx@4.19.1)(yaml@2.6.0)
+    transitivePeerDependencies:
+      - supports-color
+
+  '@vitest/expect@2.0.5':
+    dependencies:
+      '@vitest/spy': 2.0.5
+      '@vitest/utils': 2.0.5
+      chai: 5.1.1
+      tinyrainbow: 1.2.0
+
+  '@vitest/pretty-format@2.0.5':
+    dependencies:
+      tinyrainbow: 1.2.0
+
+  '@vitest/runner@2.0.5':
+    dependencies:
+      '@vitest/utils': 2.0.5
+      pathe: 1.1.2
+
+  '@vitest/snapshot@2.0.5':
+    dependencies:
+      '@vitest/pretty-format': 2.0.5
+      magic-string: 0.30.11
+      pathe: 1.1.2
+
+  '@vitest/spy@2.0.5':
+    dependencies:
+      tinyspy: 3.0.0
+
+  '@vitest/utils@2.0.5':
+    dependencies:
+      '@vitest/pretty-format': 2.0.5
       estree-walker: 3.0.3
-      magic-string: 0.30.21
-    optionalDependencies:
-      vite: 8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+      loupe: 3.1.1
+      tinyrainbow: 1.2.0
 
-  '@vitest/pretty-format@4.1.10':
+  acorn-jsx@5.3.2(acorn@8.14.0):
     dependencies:
-      tinyrainbow: 3.1.0
+      acorn: 8.14.0
 
-  '@vitest/runner@4.1.10':
-    dependencies:
-      '@vitest/utils': 4.1.10
-      pathe: 2.0.3
+  acorn@8.14.0: {}
 
-  '@vitest/snapshot@4.1.10':
-    dependencies:
-      '@vitest/pretty-format': 4.1.10
-      '@vitest/utils': 4.1.10
-      magic-string: 0.30.21
-      pathe: 2.0.3
-
-  '@vitest/spy@4.1.10': {}
-
-  '@vitest/utils@4.1.10':
-    dependencies:
-      '@vitest/pretty-format': 4.1.10
-      convert-source-map: 2.0.0
-      tinyrainbow: 3.1.0
-
-  '@webassemblyjs/ast@1.14.1':
-    dependencies:
-      '@webassemblyjs/helper-numbers': 1.13.2
-      '@webassemblyjs/helper-wasm-bytecode': 1.13.2
-
-  '@webassemblyjs/floating-point-hex-parser@1.13.2': {}
-
-  '@webassemblyjs/helper-api-error@1.13.2': {}
-
-  '@webassemblyjs/helper-buffer@1.14.1': {}
-
-  '@webassemblyjs/helper-numbers@1.13.2':
-    dependencies:
-      '@webassemblyjs/floating-point-hex-parser': 1.13.2
-      '@webassemblyjs/helper-api-error': 1.13.2
-      '@xtuc/long': 4.2.2
-
-  '@webassemblyjs/helper-wasm-bytecode@1.13.2': {}
-
-  '@webassemblyjs/helper-wasm-section@1.14.1':
-    dependencies:
-      '@webassemblyjs/ast': 1.14.1
-      '@webassemblyjs/helper-buffer': 1.14.1
-      '@webassemblyjs/helper-wasm-bytecode': 1.13.2
-      '@webassemblyjs/wasm-gen': 1.14.1
-
-  '@webassemblyjs/ieee754@1.13.2':
-    dependencies:
-      '@xtuc/ieee754': 1.2.0
-
-  '@webassemblyjs/leb128@1.13.2':
-    dependencies:
-      '@xtuc/long': 4.2.2
-
-  '@webassemblyjs/utf8@1.13.2': {}
-
-  '@webassemblyjs/wasm-edit@1.14.1':
-    dependencies:
-      '@webassemblyjs/ast': 1.14.1
-      '@webassemblyjs/helper-buffer': 1.14.1
-      '@webassemblyjs/helper-wasm-bytecode': 1.13.2
-      '@webassemblyjs/helper-wasm-section': 1.14.1
-      '@webassemblyjs/wasm-gen': 1.14.1
-      '@webassemblyjs/wasm-opt': 1.14.1
-      '@webassemblyjs/wasm-parser': 1.14.1
-      '@webassemblyjs/wast-printer': 1.14.1
-
-  '@webassemblyjs/wasm-gen@1.14.1':
-    dependencies:
-      '@webassemblyjs/ast': 1.14.1
-      '@webassemblyjs/helper-wasm-bytecode': 1.13.2
-      '@webassemblyjs/ieee754': 1.13.2
-      '@webassemblyjs/leb128': 1.13.2
-      '@webassemblyjs/utf8': 1.13.2
-
-  '@webassemblyjs/wasm-opt@1.14.1':
-    dependencies:
-      '@webassemblyjs/ast': 1.14.1
-      '@webassemblyjs/helper-buffer': 1.14.1
-      '@webassemblyjs/wasm-gen': 1.14.1
-      '@webassemblyjs/wasm-parser': 1.14.1
-
-  '@webassemblyjs/wasm-parser@1.14.1':
-    dependencies:
-      '@webassemblyjs/ast': 1.14.1
-      '@webassemblyjs/helper-api-error': 1.13.2
-      '@webassemblyjs/helper-wasm-bytecode': 1.13.2
-      '@webassemblyjs/ieee754': 1.13.2
-      '@webassemblyjs/leb128': 1.13.2
-      '@webassemblyjs/utf8': 1.13.2
-
-  '@webassemblyjs/wast-printer@1.14.1':
-    dependencies:
-      '@webassemblyjs/ast': 1.14.1
-      '@xtuc/long': 4.2.2
-
-  '@xtuc/ieee754@1.2.0': {}
-
-  '@xtuc/long@4.2.2': {}
-
-  acorn@8.16.0: {}
-
-  ajv-formats@2.1.1(ajv@8.20.0):
-    optionalDependencies:
-      ajv: 8.20.0
-
-  ajv-keywords@5.1.0(ajv@8.20.0):
-    dependencies:
-      ajv: 8.20.0
-      fast-deep-equal: 3.1.3
-
-  ajv@8.20.0:
+  ajv@6.12.6:
     dependencies:
       fast-deep-equal: 3.1.3
-      fast-uri: 3.1.2
-      json-schema-traverse: 1.0.0
-      require-from-string: 2.0.2
+      fast-json-stable-stringify: 2.1.0
+      json-schema-traverse: 0.4.1
+      uri-js: 4.4.1
+
+  ansi-regex@5.0.1: {}
+
+  ansi-regex@6.0.1: {}
+
+  ansi-styles@4.3.0:
+    dependencies:
+      color-convert: 2.0.1
+
+  ansi-styles@6.2.1: {}
 
   any-promise@1.3.0: {}
 
   anymatch@3.1.3:
     dependencies:
       normalize-path: 3.0.0
-      picomatch: 2.3.2
+      picomatch: 2.3.1
 
   arg@5.0.2: {}
 
   argparse@2.0.1: {}
 
+  aria-query@5.3.2: {}
+
+  array-buffer-byte-length@1.0.1:
+    dependencies:
+      call-bind: 1.0.7
+      is-array-buffer: 3.0.4
+
+  array-includes@3.1.8:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-object-atoms: 1.0.0
+      get-intrinsic: 1.2.4
+      is-string: 1.0.7
+
+  array.prototype.findlast@1.2.5:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      es-object-atoms: 1.0.0
+      es-shim-unscopables: 1.0.2
+
+  array.prototype.findlastindex@1.2.5:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      es-object-atoms: 1.0.0
+      es-shim-unscopables: 1.0.2
+
+  array.prototype.flat@1.3.2:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-shim-unscopables: 1.0.2
+
+  array.prototype.flatmap@1.3.2:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-shim-unscopables: 1.0.2
+
+  array.prototype.tosorted@1.1.4:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      es-shim-unscopables: 1.0.2
+
+  arraybuffer.prototype.slice@1.0.3:
+    dependencies:
+      array-buffer-byte-length: 1.0.1
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      get-intrinsic: 1.2.4
+      is-array-buffer: 3.0.4
+      is-shared-array-buffer: 1.0.3
+
   assertion-error@2.0.1: {}
 
-  autoprefixer@10.5.0(postcss@8.5.25):
+  ast-types-flow@0.0.8: {}
+
+  autoprefixer@10.4.21(postcss@8.5.3):
     dependencies:
-      browserslist: 4.28.2
-      caniuse-lite: 1.0.30001793
-      fraction.js: 5.3.4
+      browserslist: 4.24.4
+      caniuse-lite: 1.0.30001705
+      fraction.js: 4.3.7
+      normalize-range: 0.1.2
       picocolors: 1.1.1
-      postcss: 8.5.25
+      postcss: 8.5.3
       postcss-value-parser: 4.2.0
 
-  baseline-browser-mapping@2.10.31: {}
+  available-typed-arrays@1.0.7:
+    dependencies:
+      possible-typed-array-names: 1.0.0
 
-  before-after-hook@4.0.0: {}
+  axe-core@4.10.2: {}
+
+  axobject-query@4.1.0: {}
+
+  balanced-match@1.0.2: {}
 
   binary-extensions@2.3.0: {}
 
+  brace-expansion@1.1.11:
+    dependencies:
+      balanced-match: 1.0.2
+      concat-map: 0.0.1
+
+  brace-expansion@2.0.1:
+    dependencies:
+      balanced-match: 1.0.2
+
   braces@3.0.3:
     dependencies:
       fill-range: 7.1.1
 
-  browserslist@4.28.2:
+  browserslist@4.24.2:
     dependencies:
-      baseline-browser-mapping: 2.10.31
-      caniuse-lite: 1.0.30001793
-      electron-to-chromium: 1.5.361
-      node-releases: 2.0.46
-      update-browserslist-db: 1.2.3(browserslist@4.28.2)
+      caniuse-lite: 1.0.30001705
+      electron-to-chromium: 1.5.45
+      node-releases: 2.0.18
+      update-browserslist-db: 1.1.1(browserslist@4.24.2)
 
-  buffer-from@1.1.2: {}
-
-  bun-types@1.3.14:
+  browserslist@4.24.4:
     dependencies:
-      '@types/node': 25.9.1
+      caniuse-lite: 1.0.30001705
+      electron-to-chromium: 1.5.119
+      node-releases: 2.0.19
+      update-browserslist-db: 1.1.1(browserslist@4.24.4)
 
-  bun@1.3.14:
+  buffer-from@1.1.2:
+    optional: true
+
+  bun-types@1.2.4:
+    dependencies:
+      '@types/node': 20.14.13
+      '@types/ws': 8.5.12
+
+  bun@1.2.4:
     optionalDependencies:
-      '@oven/bun-darwin-aarch64': 1.3.14
-      '@oven/bun-darwin-x64': 1.3.14
-      '@oven/bun-darwin-x64-baseline': 1.3.14
-      '@oven/bun-freebsd-aarch64': 1.3.14
-      '@oven/bun-freebsd-x64': 1.3.14
-      '@oven/bun-linux-aarch64': 1.3.14
-      '@oven/bun-linux-aarch64-android': 1.3.14
-      '@oven/bun-linux-aarch64-musl': 1.3.14
-      '@oven/bun-linux-x64': 1.3.14
-      '@oven/bun-linux-x64-android': 1.3.14
-      '@oven/bun-linux-x64-baseline': 1.3.14
-      '@oven/bun-linux-x64-musl': 1.3.14
-      '@oven/bun-linux-x64-musl-baseline': 1.3.14
-      '@oven/bun-windows-aarch64': 1.3.14
-      '@oven/bun-windows-x64': 1.3.14
-      '@oven/bun-windows-x64-baseline': 1.3.14
+      '@oven/bun-darwin-aarch64': 1.2.4
+      '@oven/bun-darwin-x64': 1.2.4
+      '@oven/bun-darwin-x64-baseline': 1.2.4
+      '@oven/bun-linux-aarch64': 1.2.4
+      '@oven/bun-linux-aarch64-musl': 1.2.4
+      '@oven/bun-linux-x64': 1.2.4
+      '@oven/bun-linux-x64-baseline': 1.2.4
+      '@oven/bun-linux-x64-musl': 1.2.4
+      '@oven/bun-linux-x64-musl-baseline': 1.2.4
+      '@oven/bun-windows-x64': 1.2.4
+      '@oven/bun-windows-x64-baseline': 1.2.4
 
-  bundle-require@5.1.0(esbuild@0.27.7):
+  bundle-require@5.1.0(esbuild@0.25.0):
     dependencies:
-      esbuild: 0.27.7
+      esbuild: 0.25.0
       load-tsconfig: 0.2.5
 
+  busboy@1.6.0:
+    dependencies:
+      streamsearch: 1.1.0
+
   cac@6.7.14: {}
 
+  call-bind@1.0.7:
+    dependencies:
+      es-define-property: 1.0.0
+      es-errors: 1.3.0
+      function-bind: 1.1.2
+      get-intrinsic: 1.2.4
+      set-function-length: 1.2.2
+
+  callsites@3.1.0: {}
+
   camelcase-css@2.0.1: {}
 
-  caniuse-lite@1.0.30001793: {}
+  caniuse-lite@1.0.30001705: {}
 
-  chai@6.2.2: {}
+  chai@5.1.1:
+    dependencies:
+      assertion-error: 2.0.1
+      check-error: 2.1.1
+      deep-eql: 5.0.2
+      loupe: 3.1.1
+      pathval: 2.0.0
 
-  chardet@2.1.1: {}
+  chalk@4.1.2:
+    dependencies:
+      ansi-styles: 4.3.0
+      supports-color: 7.2.0
+
+  check-error@2.1.1: {}
 
   chokidar@3.6.0:
     dependencies:
@@ -4885,138 +5544,665 @@ snapshots:
 
   chokidar@4.0.3:
     dependencies:
-      readdirp: 4.1.2
+      readdirp: 4.1.1
 
-  chrome-trace-event@1.0.4: {}
-
-  citty@0.2.2: {}
-
-  cli-width@4.1.0: {}
+  citty@0.1.6:
+    dependencies:
+      consola: 3.2.3
 
   client-only@0.0.1: {}
 
-  clipanion@4.0.0-rc.4(typanion@3.14.0):
+  clipboardy@4.0.0:
     dependencies:
-      typanion: 3.14.0
+      execa: 8.0.1
+      is-wsl: 3.1.0
+      is64bit: 2.0.0
 
-  colorette@2.0.20: {}
+  color-convert@2.0.1:
+    dependencies:
+      color-name: 1.1.4
 
-  commander@2.20.3: {}
+  color-name@1.1.4: {}
+
+  color-string@1.9.1:
+    dependencies:
+      color-name: 1.1.4
+      simple-swizzle: 0.2.2
+    optional: true
+
+  color@4.2.3:
+    dependencies:
+      color-convert: 2.0.1
+      color-string: 1.9.1
+    optional: true
+
+  commander@2.20.3:
+    optional: true
 
   commander@4.1.1: {}
 
+  concat-map@0.0.1: {}
+
   confbox@0.1.8: {}
 
-  consola@3.4.2: {}
+  consola@3.2.3: {}
 
-  content-type@2.0.0: {}
+  consola@3.4.0: {}
 
   convert-source-map@2.0.0: {}
 
-  cookie-es@1.2.3: {}
+  cookie-es@1.2.2: {}
 
-  crossws@0.3.5:
+  cross-spawn@7.0.6:
+    dependencies:
+      path-key: 3.1.1
+      shebang-command: 2.0.0
+      which: 2.0.2
+
+  crossws@0.3.1:
     dependencies:
       uncrypto: 0.1.3
 
-  crossws@0.4.10: {}
+  crossws@0.3.4:
+    dependencies:
+      uncrypto: 0.1.3
 
   cssesc@3.0.0: {}
 
-  csstype@3.2.3: {}
+  csstype@3.1.3: {}
 
-  debug@4.4.3:
+  damerau-levenshtein@1.0.8: {}
+
+  data-view-buffer@1.0.1:
+    dependencies:
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      is-data-view: 1.0.1
+
+  data-view-byte-length@1.0.1:
+    dependencies:
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      is-data-view: 1.0.1
+
+  data-view-byte-offset@1.0.0:
+    dependencies:
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      is-data-view: 1.0.1
+
+  debug@3.2.7:
     dependencies:
       ms: 2.1.3
 
-  dedent@1.7.2: {}
+  debug@4.3.6:
+    dependencies:
+      ms: 2.1.2
 
-  defu@6.1.7: {}
+  debug@4.4.0:
+    dependencies:
+      ms: 2.1.3
 
-  destr@2.0.5: {}
+  dedent@1.5.3: {}
+
+  deep-eql@5.0.2: {}
+
+  deep-is@0.1.4: {}
+
+  define-data-property@1.1.4:
+    dependencies:
+      es-define-property: 1.0.0
+      es-errors: 1.3.0
+      gopd: 1.0.1
+
+  define-properties@1.2.1:
+    dependencies:
+      define-data-property: 1.1.4
+      has-property-descriptors: 1.0.2
+      object-keys: 1.1.1
+
+  defu@6.1.4: {}
+
+  destr@2.0.3: {}
 
   detect-libc@1.0.3: {}
 
-  detect-libc@2.1.2: {}
+  detect-libc@2.0.3: {}
 
   didyoumean@1.2.2: {}
 
   dlv@1.1.3: {}
 
-  electron-to-chromium@1.5.361: {}
+  doctrine@2.1.0:
+    dependencies:
+      esutils: 2.0.3
 
-  emnapi@1.11.3(node-addon-api@8.7.0):
-    optionalDependencies:
-      node-addon-api: 8.7.0
+  eastasianwidth@0.2.0: {}
 
-  enhanced-resolve@5.24.5:
+  electron-to-chromium@1.5.119: {}
+
+  electron-to-chromium@1.5.45: {}
+
+  emoji-regex@8.0.0: {}
+
+  emoji-regex@9.2.2: {}
+
+  enhanced-resolve@5.18.1:
     dependencies:
       graceful-fs: 4.2.11
-      tapable: 2.3.3
+      tapable: 2.2.1
+
+  es-abstract@1.23.3:
+    dependencies:
+      array-buffer-byte-length: 1.0.1
+      arraybuffer.prototype.slice: 1.0.3
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.7
+      data-view-buffer: 1.0.1
+      data-view-byte-length: 1.0.1
+      data-view-byte-offset: 1.0.0
+      es-define-property: 1.0.0
+      es-errors: 1.3.0
+      es-object-atoms: 1.0.0
+      es-set-tostringtag: 2.0.3
+      es-to-primitive: 1.2.1
+      function.prototype.name: 1.1.6
+      get-intrinsic: 1.2.4
+      get-symbol-description: 1.0.2
+      globalthis: 1.0.4
+      gopd: 1.0.1
+      has-property-descriptors: 1.0.2
+      has-proto: 1.0.3
+      has-symbols: 1.0.3
+      hasown: 2.0.2
+      internal-slot: 1.0.7
+      is-array-buffer: 3.0.4
+      is-callable: 1.2.7
+      is-data-view: 1.0.1
+      is-negative-zero: 2.0.3
+      is-regex: 1.1.4
+      is-shared-array-buffer: 1.0.3
+      is-string: 1.0.7
+      is-typed-array: 1.1.13
+      is-weakref: 1.0.2
+      object-inspect: 1.13.2
+      object-keys: 1.1.1
+      object.assign: 4.1.5
+      regexp.prototype.flags: 1.5.2
+      safe-array-concat: 1.1.2
+      safe-regex-test: 1.0.3
+      string.prototype.trim: 1.2.9
+      string.prototype.trimend: 1.0.8
+      string.prototype.trimstart: 1.0.8
+      typed-array-buffer: 1.0.2
+      typed-array-byte-length: 1.0.1
+      typed-array-byte-offset: 1.0.2
+      typed-array-length: 1.0.6
+      unbox-primitive: 1.0.2
+      which-typed-array: 1.1.15
+
+  es-define-property@1.0.0:
+    dependencies:
+      get-intrinsic: 1.2.4
 
   es-errors@1.3.0: {}
 
-  es-module-lexer@2.1.0: {}
+  es-iterator-helpers@1.1.0:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      es-set-tostringtag: 2.0.3
+      function-bind: 1.1.2
+      get-intrinsic: 1.2.4
+      globalthis: 1.0.4
+      has-property-descriptors: 1.0.2
+      has-proto: 1.0.3
+      has-symbols: 1.0.3
+      internal-slot: 1.0.7
+      iterator.prototype: 1.1.3
+      safe-array-concat: 1.1.2
 
-  es-toolkit@1.50.0: {}
+  es-object-atoms@1.0.0:
+    dependencies:
+      es-errors: 1.3.0
 
-  esbuild@0.27.7:
+  es-set-tostringtag@2.0.3:
+    dependencies:
+      get-intrinsic: 1.2.4
+      has-tostringtag: 1.0.2
+      hasown: 2.0.2
+
+  es-shim-unscopables@1.0.2:
+    dependencies:
+      hasown: 2.0.2
+
+  es-to-primitive@1.2.1:
+    dependencies:
+      is-callable: 1.2.7
+      is-date-object: 1.0.5
+      is-symbol: 1.0.4
+
+  esbuild@0.21.5:
     optionalDependencies:
-      '@esbuild/aix-ppc64': 0.27.7
-      '@esbuild/android-arm': 0.27.7
-      '@esbuild/android-arm64': 0.27.7
-      '@esbuild/android-x64': 0.27.7
-      '@esbuild/darwin-arm64': 0.27.7
-      '@esbuild/darwin-x64': 0.27.7
-      '@esbuild/freebsd-arm64': 0.27.7
-      '@esbuild/freebsd-x64': 0.27.7
-      '@esbuild/linux-arm': 0.27.7
-      '@esbuild/linux-arm64': 0.27.7
-      '@esbuild/linux-ia32': 0.27.7
-      '@esbuild/linux-loong64': 0.27.7
-      '@esbuild/linux-mips64el': 0.27.7
-      '@esbuild/linux-ppc64': 0.27.7
-      '@esbuild/linux-riscv64': 0.27.7
-      '@esbuild/linux-s390x': 0.27.7
-      '@esbuild/linux-x64': 0.27.7
-      '@esbuild/netbsd-arm64': 0.27.7
-      '@esbuild/netbsd-x64': 0.27.7
-      '@esbuild/openbsd-arm64': 0.27.7
-      '@esbuild/openbsd-x64': 0.27.7
-      '@esbuild/openharmony-arm64': 0.27.7
-      '@esbuild/sunos-x64': 0.27.7
-      '@esbuild/win32-arm64': 0.27.7
-      '@esbuild/win32-ia32': 0.27.7
-      '@esbuild/win32-x64': 0.27.7
+      '@esbuild/aix-ppc64': 0.21.5
+      '@esbuild/android-arm': 0.21.5
+      '@esbuild/android-arm64': 0.21.5
+      '@esbuild/android-x64': 0.21.5
+      '@esbuild/darwin-arm64': 0.21.5
+      '@esbuild/darwin-x64': 0.21.5
+      '@esbuild/freebsd-arm64': 0.21.5
+      '@esbuild/freebsd-x64': 0.21.5
+      '@esbuild/linux-arm': 0.21.5
+      '@esbuild/linux-arm64': 0.21.5
+      '@esbuild/linux-ia32': 0.21.5
+      '@esbuild/linux-loong64': 0.21.5
+      '@esbuild/linux-mips64el': 0.21.5
+      '@esbuild/linux-ppc64': 0.21.5
+      '@esbuild/linux-riscv64': 0.21.5
+      '@esbuild/linux-s390x': 0.21.5
+      '@esbuild/linux-x64': 0.21.5
+      '@esbuild/netbsd-x64': 0.21.5
+      '@esbuild/openbsd-x64': 0.21.5
+      '@esbuild/sunos-x64': 0.21.5
+      '@esbuild/win32-arm64': 0.21.5
+      '@esbuild/win32-ia32': 0.21.5
+      '@esbuild/win32-x64': 0.21.5
+
+  esbuild@0.23.1:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.23.1
+      '@esbuild/android-arm': 0.23.1
+      '@esbuild/android-arm64': 0.23.1
+      '@esbuild/android-x64': 0.23.1
+      '@esbuild/darwin-arm64': 0.23.1
+      '@esbuild/darwin-x64': 0.23.1
+      '@esbuild/freebsd-arm64': 0.23.1
+      '@esbuild/freebsd-x64': 0.23.1
+      '@esbuild/linux-arm': 0.23.1
+      '@esbuild/linux-arm64': 0.23.1
+      '@esbuild/linux-ia32': 0.23.1
+      '@esbuild/linux-loong64': 0.23.1
+      '@esbuild/linux-mips64el': 0.23.1
+      '@esbuild/linux-ppc64': 0.23.1
+      '@esbuild/linux-riscv64': 0.23.1
+      '@esbuild/linux-s390x': 0.23.1
+      '@esbuild/linux-x64': 0.23.1
+      '@esbuild/netbsd-x64': 0.23.1
+      '@esbuild/openbsd-arm64': 0.23.1
+      '@esbuild/openbsd-x64': 0.23.1
+      '@esbuild/sunos-x64': 0.23.1
+      '@esbuild/win32-arm64': 0.23.1
+      '@esbuild/win32-ia32': 0.23.1
+      '@esbuild/win32-x64': 0.23.1
+    optional: true
+
+  esbuild@0.24.0:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.24.0
+      '@esbuild/android-arm': 0.24.0
+      '@esbuild/android-arm64': 0.24.0
+      '@esbuild/android-x64': 0.24.0
+      '@esbuild/darwin-arm64': 0.24.0
+      '@esbuild/darwin-x64': 0.24.0
+      '@esbuild/freebsd-arm64': 0.24.0
+      '@esbuild/freebsd-x64': 0.24.0
+      '@esbuild/linux-arm': 0.24.0
+      '@esbuild/linux-arm64': 0.24.0
+      '@esbuild/linux-ia32': 0.24.0
+      '@esbuild/linux-loong64': 0.24.0
+      '@esbuild/linux-mips64el': 0.24.0
+      '@esbuild/linux-ppc64': 0.24.0
+      '@esbuild/linux-riscv64': 0.24.0
+      '@esbuild/linux-s390x': 0.24.0
+      '@esbuild/linux-x64': 0.24.0
+      '@esbuild/netbsd-x64': 0.24.0
+      '@esbuild/openbsd-arm64': 0.24.0
+      '@esbuild/openbsd-x64': 0.24.0
+      '@esbuild/sunos-x64': 0.24.0
+      '@esbuild/win32-arm64': 0.24.0
+      '@esbuild/win32-ia32': 0.24.0
+      '@esbuild/win32-x64': 0.24.0
+
+  esbuild@0.25.0:
+    optionalDependencies:
+      '@esbuild/aix-ppc64': 0.25.0
+      '@esbuild/android-arm': 0.25.0
+      '@esbuild/android-arm64': 0.25.0
+      '@esbuild/android-x64': 0.25.0
+      '@esbuild/darwin-arm64': 0.25.0
+      '@esbuild/darwin-x64': 0.25.0
+      '@esbuild/freebsd-arm64': 0.25.0
+      '@esbuild/freebsd-x64': 0.25.0
+      '@esbuild/linux-arm': 0.25.0
+      '@esbuild/linux-arm64': 0.25.0
+      '@esbuild/linux-ia32': 0.25.0
+      '@esbuild/linux-loong64': 0.25.0
+      '@esbuild/linux-mips64el': 0.25.0
+      '@esbuild/linux-ppc64': 0.25.0
+      '@esbuild/linux-riscv64': 0.25.0
+      '@esbuild/linux-s390x': 0.25.0
+      '@esbuild/linux-x64': 0.25.0
+      '@esbuild/netbsd-arm64': 0.25.0
+      '@esbuild/netbsd-x64': 0.25.0
+      '@esbuild/openbsd-arm64': 0.25.0
+      '@esbuild/openbsd-x64': 0.25.0
+      '@esbuild/sunos-x64': 0.25.0
+      '@esbuild/win32-arm64': 0.25.0
+      '@esbuild/win32-ia32': 0.25.0
+      '@esbuild/win32-x64': 0.25.0
 
   escalade@3.2.0: {}
 
-  eslint-scope@5.1.1:
+  escape-string-regexp@4.0.0: {}
+
+  eslint-config-next@15.2.3(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4):
+    dependencies:
+      '@next/eslint-plugin-next': 15.2.3
+      '@rushstack/eslint-patch': 1.10.4
+      '@typescript-eslint/eslint-plugin': 8.11.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-import-resolver-node: 0.3.9
+      eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-jsx-a11y: 6.10.1(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-react: 7.37.2(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-react-hooks: 5.0.0(eslint@9.22.0(jiti@2.4.2))
+    optionalDependencies:
+      typescript: 5.5.4
+    transitivePeerDependencies:
+      - eslint-import-resolver-webpack
+      - eslint-plugin-import-x
+      - supports-color
+
+  eslint-config-next@15.2.3(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3):
+    dependencies:
+      '@next/eslint-plugin-next': 15.2.3
+      '@rushstack/eslint-patch': 1.10.4
+      '@typescript-eslint/eslint-plugin': 8.11.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-import-resolver-node: 0.3.9
+      eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-jsx-a11y: 6.10.1(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-react: 7.37.2(eslint@9.22.0(jiti@2.4.2))
+      eslint-plugin-react-hooks: 5.0.0(eslint@9.22.0(jiti@2.4.2))
+    optionalDependencies:
+      typescript: 5.6.3
+    transitivePeerDependencies:
+      - eslint-import-resolver-webpack
+      - eslint-plugin-import-x
+      - supports-color
+
+  eslint-import-resolver-node@0.3.9:
+    dependencies:
+      debug: 3.2.7
+      is-core-module: 2.15.1
+      resolve: 1.22.8
+    transitivePeerDependencies:
+      - supports-color
+
+  eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      '@nolyfill/is-core-module': 1.0.39
+      debug: 4.4.0
+      enhanced-resolve: 5.18.1
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2))
+      fast-glob: 3.3.3
+      get-tsconfig: 4.8.1
+      is-bun-module: 1.2.1
+      is-glob: 4.0.3
+    optionalDependencies:
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2))
+    transitivePeerDependencies:
+      - '@typescript-eslint/parser'
+      - eslint-import-resolver-node
+      - eslint-import-resolver-webpack
+      - supports-color
+
+  eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      '@nolyfill/is-core-module': 1.0.39
+      debug: 4.4.0
+      enhanced-resolve: 5.18.1
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2))
+      fast-glob: 3.3.3
+      get-tsconfig: 4.8.1
+      is-bun-module: 1.2.1
+      is-glob: 4.0.3
+    optionalDependencies:
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.22.0(jiti@2.4.2))
+    transitivePeerDependencies:
+      - '@typescript-eslint/parser'
+      - eslint-import-resolver-node
+      - eslint-import-resolver-webpack
+      - supports-color
+
+  eslint-module-utils@2.12.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      debug: 3.2.7
+    optionalDependencies:
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-import-resolver-node: 0.3.9
+      eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@9.22.0(jiti@2.4.2))
+    transitivePeerDependencies:
+      - supports-color
+
+  eslint-module-utils@2.12.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      debug: 3.2.7
+    optionalDependencies:
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-import-resolver-node: 0.3.9
+      eslint-import-resolver-typescript: 3.6.3(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-plugin-import@2.31.0)(eslint@9.22.0(jiti@2.4.2))
+    transitivePeerDependencies:
+      - supports-color
+
+  eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      '@rtsao/scc': 1.1.0
+      array-includes: 3.1.8
+      array.prototype.findlastindex: 1.2.5
+      array.prototype.flat: 1.3.2
+      array.prototype.flatmap: 1.3.2
+      debug: 3.2.7
+      doctrine: 2.1.0
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-import-resolver-node: 0.3.9
+      eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2))
+      hasown: 2.0.2
+      is-core-module: 2.15.1
+      is-glob: 4.0.3
+      minimatch: 3.1.2
+      object.fromentries: 2.0.8
+      object.groupby: 1.0.3
+      object.values: 1.2.0
+      semver: 6.3.1
+      string.prototype.trimend: 1.0.8
+      tsconfig-paths: 3.15.0
+    optionalDependencies:
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.5.4)
+    transitivePeerDependencies:
+      - eslint-import-resolver-typescript
+      - eslint-import-resolver-webpack
+      - supports-color
+
+  eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      '@rtsao/scc': 1.1.0
+      array-includes: 3.1.8
+      array.prototype.findlastindex: 1.2.5
+      array.prototype.flat: 1.3.2
+      array.prototype.flatmap: 1.3.2
+      debug: 3.2.7
+      doctrine: 2.1.0
+      eslint: 9.22.0(jiti@2.4.2)
+      eslint-import-resolver-node: 0.3.9
+      eslint-module-utils: 2.12.0(@typescript-eslint/parser@8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3)(eslint@9.22.0(jiti@2.4.2))
+      hasown: 2.0.2
+      is-core-module: 2.15.1
+      is-glob: 4.0.3
+      minimatch: 3.1.2
+      object.fromentries: 2.0.8
+      object.groupby: 1.0.3
+      object.values: 1.2.0
+      semver: 6.3.1
+      string.prototype.trimend: 1.0.8
+      tsconfig-paths: 3.15.0
+    optionalDependencies:
+      '@typescript-eslint/parser': 8.11.0(eslint@9.22.0(jiti@2.4.2))(typescript@5.6.3)
+    transitivePeerDependencies:
+      - eslint-import-resolver-typescript
+      - eslint-import-resolver-webpack
+      - supports-color
+
+  eslint-plugin-jsx-a11y@6.10.1(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      aria-query: 5.3.2
+      array-includes: 3.1.8
+      array.prototype.flatmap: 1.3.2
+      ast-types-flow: 0.0.8
+      axe-core: 4.10.2
+      axobject-query: 4.1.0
+      damerau-levenshtein: 1.0.8
+      emoji-regex: 9.2.2
+      es-iterator-helpers: 1.1.0
+      eslint: 9.22.0(jiti@2.4.2)
+      hasown: 2.0.2
+      jsx-ast-utils: 3.3.5
+      language-tags: 1.0.9
+      minimatch: 3.1.2
+      object.fromentries: 2.0.8
+      safe-regex-test: 1.0.3
+      string.prototype.includes: 2.0.1
+
+  eslint-plugin-react-hooks@5.0.0(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      eslint: 9.22.0(jiti@2.4.2)
+
+  eslint-plugin-react@7.37.2(eslint@9.22.0(jiti@2.4.2)):
+    dependencies:
+      array-includes: 3.1.8
+      array.prototype.findlast: 1.2.5
+      array.prototype.flatmap: 1.3.2
+      array.prototype.tosorted: 1.1.4
+      doctrine: 2.1.0
+      es-iterator-helpers: 1.1.0
+      eslint: 9.22.0(jiti@2.4.2)
+      estraverse: 5.3.0
+      hasown: 2.0.2
+      jsx-ast-utils: 3.3.5
+      minimatch: 3.1.2
+      object.entries: 1.1.8
+      object.fromentries: 2.0.8
+      object.values: 1.2.0
+      prop-types: 15.8.1
+      resolve: 2.0.0-next.5
+      semver: 6.3.1
+      string.prototype.matchall: 4.0.11
+      string.prototype.repeat: 1.0.0
+
+  eslint-scope@8.3.0:
     dependencies:
       esrecurse: 4.3.0
-      estraverse: 4.3.0
+      estraverse: 5.3.0
+
+  eslint-visitor-keys@3.4.3: {}
+
+  eslint-visitor-keys@4.2.0: {}
+
+  eslint@9.22.0(jiti@2.4.2):
+    dependencies:
+      '@eslint-community/eslint-utils': 4.4.0(eslint@9.22.0(jiti@2.4.2))
+      '@eslint-community/regexpp': 4.12.1
+      '@eslint/config-array': 0.19.2
+      '@eslint/config-helpers': 0.1.0
+      '@eslint/core': 0.12.0
+      '@eslint/eslintrc': 3.3.0
+      '@eslint/js': 9.22.0
+      '@eslint/plugin-kit': 0.2.7
+      '@humanfs/node': 0.16.6
+      '@humanwhocodes/module-importer': 1.0.1
+      '@humanwhocodes/retry': 0.4.2
+      '@types/estree': 1.0.6
+      '@types/json-schema': 7.0.15
+      ajv: 6.12.6
+      chalk: 4.1.2
+      cross-spawn: 7.0.6
+      debug: 4.4.0
+      escape-string-regexp: 4.0.0
+      eslint-scope: 8.3.0
+      eslint-visitor-keys: 4.2.0
+      espree: 10.3.0
+      esquery: 1.6.0
+      esutils: 2.0.3
+      fast-deep-equal: 3.1.3
+      file-entry-cache: 8.0.0
+      find-up: 5.0.0
+      glob-parent: 6.0.2
+      ignore: 5.3.2
+      imurmurhash: 0.1.4
+      is-glob: 4.0.3
+      json-stable-stringify-without-jsonify: 1.0.1
+      lodash.merge: 4.6.2
+      minimatch: 3.1.2
+      natural-compare: 1.4.0
+      optionator: 0.9.4
+    optionalDependencies:
+      jiti: 2.4.2
+    transitivePeerDependencies:
+      - supports-color
+
+  espree@10.3.0:
+    dependencies:
+      acorn: 8.14.0
+      acorn-jsx: 5.3.2(acorn@8.14.0)
+      eslint-visitor-keys: 4.2.0
+
+  esquery@1.6.0:
+    dependencies:
+      estraverse: 5.3.0
 
   esrecurse@4.3.0:
     dependencies:
       estraverse: 5.3.0
 
-  estraverse@4.3.0: {}
-
   estraverse@5.3.0: {}
 
   estree-walker@3.0.3:
     dependencies:
-      '@types/estree': 1.0.9
+      '@types/estree': 1.0.6
 
-  events@3.3.0: {}
+  esutils@2.0.3: {}
 
-  expect-type@1.3.0: {}
-
-  fast-content-type-parse@3.0.0: {}
+  execa@8.0.1:
+    dependencies:
+      cross-spawn: 7.0.6
+      get-stream: 8.0.1
+      human-signals: 5.0.0
+      is-stream: 3.0.0
+      merge-stream: 2.0.0
+      npm-run-path: 5.3.0
+      onetime: 6.0.0
+      signal-exit: 4.1.0
+      strip-final-newline: 3.0.0
 
   fast-deep-equal@3.1.3: {}
 
-  fast-equals@5.4.0: {}
+  fast-glob@3.3.1:
+    dependencies:
+      '@nodelib/fs.stat': 2.0.5
+      '@nodelib/fs.walk': 1.2.8
+      glob-parent: 5.1.2
+      merge2: 1.4.1
+      micromatch: 4.0.8
 
   fast-glob@3.3.3:
     dependencies:
@@ -5026,45 +6212,50 @@ snapshots:
       merge2: 1.4.1
       micromatch: 4.0.8
 
-  fast-string-truncated-width@3.0.3: {}
+  fast-json-stable-stringify@2.1.0: {}
 
-  fast-string-width@3.0.2:
+  fast-levenshtein@2.0.6: {}
+
+  fastq@1.17.1:
     dependencies:
-      fast-string-truncated-width: 3.0.3
+      reusify: 1.0.4
 
-  fast-stringify@4.0.0: {}
-
-  fast-uri@3.1.2: {}
-
-  fast-wrap-ansi@0.2.2:
-    dependencies:
-      fast-string-width: 3.0.2
-
-  fastq@1.20.1:
-    dependencies:
-      reusify: 1.1.0
-
-  fdir@6.5.0(picomatch@4.0.4):
+  fdir@6.4.3(picomatch@4.0.2):
     optionalDependencies:
-      picomatch: 4.0.4
+      picomatch: 4.0.2
 
-  fdir@6.5.0(picomatch@4.0.5):
-    optionalDependencies:
-      picomatch: 4.0.5
+  file-entry-cache@8.0.0:
+    dependencies:
+      flat-cache: 4.0.1
 
   fill-range@7.1.1:
     dependencies:
       to-regex-range: 5.0.1
 
-  find-up-simple@1.0.1: {}
+  find-up-simple@1.0.0: {}
 
-  fix-dts-default-cjs-exports@1.0.1:
+  find-up@5.0.0:
     dependencies:
-      magic-string: 0.30.21
-      mlly: 1.8.2
-      rollup: 4.60.4
+      locate-path: 6.0.0
+      path-exists: 4.0.0
 
-  fraction.js@5.3.4: {}
+  flat-cache@4.0.1:
+    dependencies:
+      flatted: 3.3.1
+      keyv: 4.5.4
+
+  flatted@3.3.1: {}
+
+  for-each@0.3.3:
+    dependencies:
+      is-callable: 1.2.7
+
+  foreground-child@3.3.0:
+    dependencies:
+      cross-spawn: 7.0.6
+      signal-exit: 4.1.0
+
+  fraction.js@4.3.7: {}
 
   fsevents@2.3.2:
     optional: true
@@ -5074,7 +6265,40 @@ snapshots:
 
   function-bind@1.1.2: {}
 
-  get-port-please@3.2.0: {}
+  function.prototype.name@1.1.6:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      functions-have-names: 1.2.3
+
+  functions-have-names@1.2.3: {}
+
+  gensync@1.0.0-beta.2: {}
+
+  get-func-name@2.0.2: {}
+
+  get-intrinsic@1.2.4:
+    dependencies:
+      es-errors: 1.3.0
+      function-bind: 1.1.2
+      has-proto: 1.0.3
+      has-symbols: 1.0.3
+      hasown: 2.0.2
+
+  get-port-please@3.1.2: {}
+
+  get-stream@8.0.1: {}
+
+  get-symbol-description@1.0.2:
+    dependencies:
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      get-intrinsic: 1.2.4
+
+  get-tsconfig@4.8.1:
+    dependencies:
+      resolve-pkg-maps: 1.0.0
 
   glob-parent@5.1.2:
     dependencies:
@@ -5084,203 +6308,426 @@ snapshots:
     dependencies:
       is-glob: 4.0.3
 
-  globby@16.2.2:
+  glob@10.4.5:
     dependencies:
-      '@sindresorhus/merge-streams': 4.0.0
+      foreground-child: 3.3.0
+      jackspeak: 3.4.3
+      minimatch: 9.0.5
+      minipass: 7.1.2
+      package-json-from-dist: 1.0.1
+      path-scurry: 1.11.1
+
+  globals@11.12.0: {}
+
+  globals@14.0.0: {}
+
+  globalthis@1.0.4:
+    dependencies:
+      define-properties: 1.2.1
+      gopd: 1.0.1
+
+  globby@14.1.0:
+    dependencies:
+      '@sindresorhus/merge-streams': 2.3.0
       fast-glob: 3.3.3
-      ignore: 7.0.5
-      is-path-inside: 4.0.0
+      ignore: 7.0.3
+      path-type: 6.0.0
       slash: 5.1.0
-      unicorn-magic: 0.4.0
+      unicorn-magic: 0.3.0
+
+  gopd@1.0.1:
+    dependencies:
+      get-intrinsic: 1.2.4
 
   graceful-fs@4.2.11: {}
 
-  h3@1.15.11:
+  graphemer@1.4.0: {}
+
+  h3@1.15.1:
     dependencies:
-      cookie-es: 1.2.3
-      crossws: 0.3.5
-      defu: 6.1.7
-      destr: 2.0.5
+      cookie-es: 1.2.2
+      crossws: 0.3.4
+      defu: 6.1.4
+      destr: 2.0.3
       iron-webcrypto: 1.2.1
-      node-mock-http: 1.0.4
+      node-mock-http: 1.0.0
       radix3: 1.1.2
-      ufo: 1.6.4
+      ufo: 1.5.4
       uncrypto: 0.1.3
 
+  has-bigints@1.0.2: {}
+
   has-flag@4.0.0: {}
 
-  hasown@2.0.3:
+  has-property-descriptors@1.0.2:
+    dependencies:
+      es-define-property: 1.0.0
+
+  has-proto@1.0.3: {}
+
+  has-symbols@1.0.3: {}
+
+  has-tostringtag@1.0.2:
+    dependencies:
+      has-symbols: 1.0.3
+
+  hasown@2.0.2:
     dependencies:
       function-bind: 1.1.2
 
   http-shutdown@1.2.2: {}
 
-  iconv-lite@0.7.2:
-    dependencies:
-      safer-buffer: 2.1.2
+  human-signals@5.0.0: {}
 
-  ignore@7.0.5: {}
+  ignore@5.3.2: {}
+
+  ignore@7.0.3: {}
+
+  import-fresh@3.3.0:
+    dependencies:
+      parent-module: 1.0.1
+      resolve-from: 4.0.0
+
+  imurmurhash@0.1.4: {}
+
+  internal-slot@1.0.7:
+    dependencies:
+      es-errors: 1.3.0
+      hasown: 2.0.2
+      side-channel: 1.0.6
 
   iron-webcrypto@1.2.1: {}
 
+  is-array-buffer@3.0.4:
+    dependencies:
+      call-bind: 1.0.7
+      get-intrinsic: 1.2.4
+
+  is-arrayish@0.3.2:
+    optional: true
+
+  is-async-function@2.0.0:
+    dependencies:
+      has-tostringtag: 1.0.2
+
+  is-bigint@1.0.4:
+    dependencies:
+      has-bigints: 1.0.2
+
   is-binary-path@2.1.0:
     dependencies:
       binary-extensions: 2.3.0
 
-  is-core-module@2.16.2:
+  is-boolean-object@1.1.2:
     dependencies:
-      hasown: 2.0.3
+      call-bind: 1.0.7
+      has-tostringtag: 1.0.2
+
+  is-bun-module@1.2.1:
+    dependencies:
+      semver: 7.6.3
+
+  is-callable@1.2.7: {}
+
+  is-core-module@2.15.0:
+    dependencies:
+      hasown: 2.0.2
+
+  is-core-module@2.15.1:
+    dependencies:
+      hasown: 2.0.2
+
+  is-data-view@1.0.1:
+    dependencies:
+      is-typed-array: 1.1.13
+
+  is-date-object@1.0.5:
+    dependencies:
+      has-tostringtag: 1.0.2
+
+  is-docker@3.0.0: {}
 
   is-extglob@2.1.1: {}
 
+  is-finalizationregistry@1.0.2:
+    dependencies:
+      call-bind: 1.0.7
+
+  is-fullwidth-code-point@3.0.0: {}
+
+  is-generator-function@1.0.10:
+    dependencies:
+      has-tostringtag: 1.0.2
+
   is-glob@4.0.3:
     dependencies:
       is-extglob: 2.1.1
 
+  is-inside-container@1.0.0:
+    dependencies:
+      is-docker: 3.0.0
+
+  is-map@2.0.3: {}
+
+  is-negative-zero@2.0.3: {}
+
+  is-number-object@1.0.7:
+    dependencies:
+      has-tostringtag: 1.0.2
+
   is-number@7.0.0: {}
 
-  is-path-inside@4.0.0: {}
-
-  jest-worker@27.5.1:
+  is-regex@1.1.4:
     dependencies:
-      '@types/node': 25.9.1
-      merge-stream: 2.0.0
-      supports-color: 8.1.1
+      call-bind: 1.0.7
+      has-tostringtag: 1.0.2
 
-  jiti@1.21.7: {}
+  is-set@2.0.3: {}
 
-  jiti@2.7.0: {}
+  is-shared-array-buffer@1.0.3:
+    dependencies:
+      call-bind: 1.0.7
+
+  is-stream@3.0.0: {}
+
+  is-string@1.0.7:
+    dependencies:
+      has-tostringtag: 1.0.2
+
+  is-symbol@1.0.4:
+    dependencies:
+      has-symbols: 1.0.3
+
+  is-typed-array@1.1.13:
+    dependencies:
+      which-typed-array: 1.1.15
+
+  is-weakmap@2.0.2: {}
+
+  is-weakref@1.0.2:
+    dependencies:
+      call-bind: 1.0.7
+
+  is-weakset@2.0.3:
+    dependencies:
+      call-bind: 1.0.7
+      get-intrinsic: 1.2.4
+
+  is-wsl@3.1.0:
+    dependencies:
+      is-inside-container: 1.0.0
+
+  is64bit@2.0.0:
+    dependencies:
+      system-architecture: 0.1.0
+
+  isarray@2.0.5: {}
+
+  isexe@2.0.0: {}
+
+  iterator.prototype@1.1.3:
+    dependencies:
+      define-properties: 1.2.1
+      get-intrinsic: 1.2.4
+      has-symbols: 1.0.3
+      reflect.getprototypeof: 1.0.6
+      set-function-name: 2.0.2
+
+  jackspeak@3.4.3:
+    dependencies:
+      '@isaacs/cliui': 8.0.2
+    optionalDependencies:
+      '@pkgjs/parseargs': 0.11.0
+
+  jiti@1.21.6: {}
+
+  jiti@2.4.2: {}
 
   joycon@3.1.1: {}
 
-  js-yaml@4.3.1:
+  js-tokens@4.0.0: {}
+
+  js-yaml@4.1.0:
     dependencies:
       argparse: 2.0.1
 
-  json-schema-traverse@1.0.0: {}
+  jsesc@3.1.0: {}
 
-  json-with-bigint@3.5.8: {}
+  json-buffer@3.0.1: {}
 
-  lightningcss-android-arm64@1.33.0:
-    optional: true
+  json-schema-traverse@0.4.1: {}
 
-  lightningcss-darwin-arm64@1.33.0: {}
+  json-stable-stringify-without-jsonify@1.0.1: {}
 
-  lightningcss-darwin-x64@1.33.0: {}
-
-  lightningcss-freebsd-x64@1.33.0:
-    optional: true
-
-  lightningcss-linux-arm-gnueabihf@1.33.0:
-    optional: true
-
-  lightningcss-linux-arm64-gnu@1.33.0: {}
-
-  lightningcss-linux-arm64-musl@1.33.0: {}
-
-  lightningcss-linux-x64-gnu@1.33.0: {}
-
-  lightningcss-linux-x64-musl@1.33.0: {}
-
-  lightningcss-win32-arm64-msvc@1.33.0:
-    optional: true
-
-  lightningcss-win32-x64-msvc@1.33.0: {}
-
-  lightningcss@1.33.0(patch_hash=1d4a8800d60d13d42887b88b3a86576df4b451670308145fb432ec8abbf40930):
+  json5@1.0.2:
     dependencies:
-      detect-libc: 2.1.2
-    optionalDependencies:
-      lightningcss-android-arm64: 1.33.0
-      lightningcss-darwin-arm64: 1.33.0
-      lightningcss-darwin-x64: 1.33.0
-      lightningcss-freebsd-x64: 1.33.0
-      lightningcss-linux-arm-gnueabihf: 1.33.0
-      lightningcss-linux-arm64-gnu: 1.33.0
-      lightningcss-linux-arm64-musl: 1.33.0
-      lightningcss-linux-x64-gnu: 1.33.0
-      lightningcss-linux-x64-musl: 1.33.0
-      lightningcss-win32-arm64-msvc: 1.33.0
-      lightningcss-win32-x64-msvc: 1.33.0
+      minimist: 1.2.8
 
-  lilconfig@3.1.3: {}
+  json5@2.2.3: {}
+
+  jsx-ast-utils@3.3.5:
+    dependencies:
+      array-includes: 3.1.8
+      array.prototype.flat: 1.3.2
+      object.assign: 4.1.5
+      object.values: 1.2.0
+
+  keyv@4.5.4:
+    dependencies:
+      json-buffer: 3.0.1
+
+  language-subtag-registry@0.3.23: {}
+
+  language-tags@1.0.9:
+    dependencies:
+      language-subtag-registry: 0.3.23
+
+  levn@0.4.1:
+    dependencies:
+      prelude-ls: 1.2.1
+      type-check: 0.4.0
+
+  lightningcss-darwin-arm64@1.29.2: {}
+
+  lightningcss-darwin-x64@1.29.2: {}
+
+  lightningcss-freebsd-x64@1.29.2:
+    optional: true
+
+  lightningcss-linux-arm-gnueabihf@1.29.2:
+    optional: true
+
+  lightningcss-linux-arm64-gnu@1.29.2: {}
+
+  lightningcss-linux-arm64-musl@1.29.2: {}
+
+  lightningcss-linux-x64-gnu@1.29.2: {}
+
+  lightningcss-linux-x64-musl@1.29.2: {}
+
+  lightningcss-win32-arm64-msvc@1.29.2:
+    optional: true
+
+  lightningcss-win32-x64-msvc@1.29.2: {}
+
+  lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm):
+    dependencies:
+      detect-libc: 2.0.3
+    optionalDependencies:
+      lightningcss-darwin-arm64: 1.29.2
+      lightningcss-darwin-x64: 1.29.2
+      lightningcss-freebsd-x64: 1.29.2
+      lightningcss-linux-arm-gnueabihf: 1.29.2
+      lightningcss-linux-arm64-gnu: 1.29.2
+      lightningcss-linux-arm64-musl: 1.29.2
+      lightningcss-linux-x64-gnu: 1.29.2
+      lightningcss-linux-x64-musl: 1.29.2
+      lightningcss-win32-arm64-msvc: 1.29.2
+      lightningcss-win32-x64-msvc: 1.29.2
+
+  lilconfig@2.1.0: {}
+
+  lilconfig@3.1.2: {}
 
   lines-and-columns@1.2.4: {}
 
-  listhen@1.10.1(@parcel/watcher@2.6.0(patch_hash=705ce75ccea54337110c4d7fe0a8b421658ea0c23e1a77c1fa890a86041179da)):
+  listhen@1.9.0:
     dependencies:
-      '@parcel/watcher-wasm': 2.5.6
-      citty: 0.2.2
-      consola: 3.4.2
-      crossws: 0.4.10
-      defu: 6.1.7
-      get-port-please: 3.2.0
-      h3: 1.15.11
+      '@parcel/watcher': 2.5.0
+      '@parcel/watcher-wasm': 2.5.0
+      citty: 0.1.6
+      clipboardy: 4.0.0
+      consola: 3.2.3
+      crossws: 0.3.1
+      defu: 6.1.4
+      get-port-please: 3.1.2
+      h3: 1.15.1
       http-shutdown: 1.2.2
-      jiti: 2.7.0
-      node-forge: 1.4.0
-      pathe: 2.0.3
-      std-env: 4.2.0
-      tinyclip: 0.1.15
-      ufo: 1.6.4
-      untun: 0.2.2
-      uqr: 0.1.3
-    optionalDependencies:
-      '@parcel/watcher': 2.6.0(patch_hash=705ce75ccea54337110c4d7fe0a8b421658ea0c23e1a77c1fa890a86041179da)
-    transitivePeerDependencies:
-      - srvx
+      jiti: 2.4.2
+      mlly: 1.7.3
+      node-forge: 1.3.1
+      pathe: 1.1.2
+      std-env: 3.7.0
+      ufo: 1.5.4
+      untun: 0.1.3
+      uqr: 0.1.2
 
   load-tsconfig@0.2.5: {}
 
-  magic-string@0.30.21:
+  locate-path@6.0.0:
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.5
+      p-locate: 5.0.0
 
-  magic-string@1.1.0:
+  lodash.castarray@4.4.0: {}
+
+  lodash.isplainobject@4.0.6: {}
+
+  lodash.merge@4.6.2: {}
+
+  lodash.sortby@4.7.0: {}
+
+  loose-envify@1.4.0:
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.5
+      js-tokens: 4.0.0
+
+  loupe@3.1.1:
+    dependencies:
+      get-func-name: 2.0.2
+
+  lru-cache@10.4.3: {}
+
+  lru-cache@5.1.1:
+    dependencies:
+      yallist: 3.1.1
+
+  magic-string@0.30.11:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.0
 
   merge-stream@2.0.0: {}
 
   merge2@1.4.1: {}
 
-  micro-memoize@5.1.1:
+  micro-memoize@4.1.3: {}
+
+  micromatch@4.0.7:
     dependencies:
-      fast-equals: 5.4.0
-      fast-stringify: 4.0.0
+      braces: 3.0.3
+      picomatch: 2.3.1
 
   micromatch@4.0.8:
     dependencies:
       braces: 3.0.3
-      picomatch: 2.3.2
+      picomatch: 2.3.1
 
-  mime-db@1.54.0: {}
+  mimic-fn@4.0.0: {}
 
   mini-svg-data-uri@1.4.4: {}
 
-  minimizer-webpack-plugin@5.6.1(esbuild@0.27.7)(postcss@8.5.25)(webpack@5.109.2(esbuild@0.27.7)(postcss@8.5.25)):
+  minimatch@3.1.2:
     dependencies:
-      '@jridgewell/trace-mapping': 0.3.31
-      jest-worker: 27.5.1
-      schema-utils: 4.3.3
-      terser: 5.48.0
-      webpack: 5.109.2(esbuild@0.27.7)(postcss@8.5.25)
-    optionalDependencies:
-      esbuild: 0.27.7
-      postcss: 8.5.25
+      brace-expansion: 1.1.11
 
-  mlly@1.8.2:
+  minimatch@9.0.5:
     dependencies:
-      acorn: 8.16.0
-      pathe: 2.0.3
-      pkg-types: 1.3.1
-      ufo: 1.6.4
+      brace-expansion: 2.0.1
+
+  minimist@1.2.8: {}
+
+  minipass@7.1.2: {}
+
+  mlly@1.7.3:
+    dependencies:
+      acorn: 8.14.0
+      pathe: 1.1.2
+      pkg-types: 1.3.0
+      ufo: 1.5.4
 
   mri@1.2.0: {}
 
-  ms@2.1.3: {}
+  ms@2.1.2: {}
 
-  mute-stream@3.0.0: {}
+  ms@2.1.3: {}
 
   mz@2.7.0:
     dependencies:
@@ -5288,133 +6735,238 @@ snapshots:
       object-assign: 4.1.1
       thenify-all: 1.6.0
 
-  nanoid@3.3.12: {}
+  nanoid@3.3.7: {}
 
-  nanoid@3.3.16: {}
+  nanoid@3.3.8: {}
 
-  neo-async@2.6.2: {}
+  natural-compare@1.4.0: {}
 
-  next@16.2.7(@playwright/test@1.62.1)(react-dom@19.2.7(react@19.2.7))(react@19.2.7):
+  next@15.2.3(@playwright/test@1.51.0)(react-dom@19.0.0(react@19.0.0))(react@19.0.0):
     dependencies:
-      '@next/env': 16.2.7
+      '@next/env': 15.2.3
+      '@swc/counter': 0.1.3
       '@swc/helpers': 0.5.15
-      baseline-browser-mapping: 2.10.31
-      caniuse-lite: 1.0.30001793
+      busboy: 1.6.0
+      caniuse-lite: 1.0.30001705
       postcss: 8.4.31
-      react: 19.2.7
-      react-dom: 19.2.7(react@19.2.7)
-      styled-jsx: 5.1.6(react@19.2.7)
+      react: 19.0.0
+      react-dom: 19.0.0(react@19.0.0)
+      styled-jsx: 5.1.6(react@19.0.0)
     optionalDependencies:
-      '@next/swc-darwin-arm64': 16.2.7
-      '@next/swc-darwin-x64': 16.2.7
-      '@next/swc-linux-arm64-gnu': 16.2.7
-      '@next/swc-linux-arm64-musl': 16.2.7
-      '@next/swc-linux-x64-gnu': 16.2.7
-      '@next/swc-linux-x64-musl': 16.2.7
-      '@next/swc-win32-arm64-msvc': 16.2.7
-      '@next/swc-win32-x64-msvc': 16.2.7
-      '@playwright/test': 1.62.1
-      sharp: 0.34.5
+      '@next/swc-darwin-arm64': 15.2.3
+      '@next/swc-darwin-x64': 15.2.3
+      '@next/swc-linux-arm64-gnu': 15.2.3
+      '@next/swc-linux-arm64-musl': 15.2.3
+      '@next/swc-linux-x64-gnu': 15.2.3
+      '@next/swc-linux-x64-musl': 15.2.3
+      '@next/swc-win32-arm64-msvc': 15.2.3
+      '@next/swc-win32-x64-msvc': 15.2.3
+      '@playwright/test': 1.51.0
+      sharp: 0.33.5
     transitivePeerDependencies:
       - '@babel/core'
       - babel-plugin-macros
 
   node-addon-api@7.1.1: {}
 
-  node-addon-api@8.7.0: {}
+  node-addon-api@8.2.2: {}
 
-  node-forge@1.4.0: {}
+  node-addon-api@8.3.0: {}
+
+  node-forge@1.3.1: {}
+
+  node-gyp-build@4.8.2: {}
 
   node-gyp-build@4.8.4: {}
 
-  node-mock-http@1.0.4: {}
+  node-mock-http@1.0.0: {}
 
-  node-releases@2.0.46: {}
+  node-releases@2.0.18: {}
+
+  node-releases@2.0.19: {}
 
   normalize-path@3.0.0: {}
 
+  normalize-range@0.1.2: {}
+
+  npm-run-path@5.3.0:
+    dependencies:
+      path-key: 4.0.0
+
   object-assign@4.1.1: {}
 
   object-hash@3.0.0: {}
 
-  obug@2.1.1: {}
+  object-inspect@1.13.2: {}
 
-  obug@2.1.4: {}
+  object-keys@1.1.1: {}
+
+  object.assign@4.1.5:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      has-symbols: 1.0.3
+      object-keys: 1.1.1
+
+  object.entries@1.1.8:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-object-atoms: 1.0.0
+
+  object.fromentries@2.0.8:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-object-atoms: 1.0.0
+
+  object.groupby@1.0.3:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+
+  object.values@1.2.0:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-object-atoms: 1.0.0
+
+  onetime@6.0.0:
+    dependencies:
+      mimic-fn: 4.0.0
+
+  optionator@0.9.4:
+    dependencies:
+      deep-is: 0.1.4
+      fast-levenshtein: 2.0.6
+      levn: 0.4.1
+      prelude-ls: 1.2.1
+      type-check: 0.4.0
+      word-wrap: 1.2.5
+
+  p-limit@3.1.0:
+    dependencies:
+      yocto-queue: 0.1.0
+
+  p-locate@5.0.0:
+    dependencies:
+      p-limit: 3.1.0
+
+  package-json-from-dist@1.0.1: {}
 
   package-up@5.0.0:
     dependencies:
-      find-up-simple: 1.0.1
+      find-up-simple: 1.0.0
+
+  parent-module@1.0.1:
+    dependencies:
+      callsites: 3.1.0
+
+  path-exists@4.0.0: {}
+
+  path-key@3.1.1: {}
+
+  path-key@4.0.0: {}
 
   path-parse@1.0.7: {}
 
-  pathe@2.0.3: {}
+  path-scurry@1.11.1:
+    dependencies:
+      lru-cache: 10.4.3
+      minipass: 7.1.2
+
+  path-type@6.0.0: {}
+
+  pathe@1.1.2: {}
+
+  pathval@2.0.0: {}
 
   picocolors@1.1.1: {}
 
-  picomatch@2.3.2: {}
+  picomatch@2.3.1: {}
 
-  picomatch@4.0.4: {}
-
-  picomatch@4.0.5: {}
+  picomatch@4.0.2: {}
 
   pify@2.3.0: {}
 
-  pirates@4.0.7: {}
+  pirates@4.0.6: {}
 
-  pkg-types@1.3.1:
+  pkg-types@1.3.0:
     dependencies:
       confbox: 0.1.8
-      mlly: 1.8.2
-      pathe: 2.0.3
+      mlly: 1.7.3
+      pathe: 1.1.2
 
-  playwright-core@1.62.1: {}
+  playwright-core@1.51.0: {}
 
-  playwright@1.62.1:
+  playwright@1.51.0:
     dependencies:
-      playwright-core: 1.62.1
+      playwright-core: 1.51.0
     optionalDependencies:
       fsevents: 2.3.2
 
-  postcss-import@15.1.0(postcss@8.5.16):
+  possible-typed-array-names@1.0.0: {}
+
+  postcss-import@15.1.0(postcss@8.5.3):
     dependencies:
-      postcss: 8.5.16
+      postcss: 8.5.3
       postcss-value-parser: 4.2.0
       read-cache: 1.0.0
-      resolve: 1.22.12
+      resolve: 1.22.8
 
-  postcss-import@16.1.1(postcss@8.5.25):
+  postcss-import@16.1.0(postcss@8.4.41):
     dependencies:
-      postcss: 8.5.25
+      postcss: 8.4.41
       postcss-value-parser: 4.2.0
       read-cache: 1.0.0
-      resolve: 1.22.12
+      resolve: 1.22.8
 
-  postcss-js@4.1.0(postcss@8.5.16):
+  postcss-import@16.1.0(postcss@8.5.3):
+    dependencies:
+      postcss: 8.5.3
+      postcss-value-parser: 4.2.0
+      read-cache: 1.0.0
+      resolve: 1.22.8
+
+  postcss-js@4.0.1(postcss@8.5.3):
     dependencies:
       camelcase-css: 2.0.1
-      postcss: 8.5.16
+      postcss: 8.5.3
 
-  postcss-load-config@6.0.1(jiti@1.21.7)(postcss@8.5.16)(yaml@2.9.0):
+  postcss-load-config@4.0.2(postcss@8.5.3):
     dependencies:
-      lilconfig: 3.1.3
+      lilconfig: 3.1.2
+      yaml: 2.6.0
     optionalDependencies:
-      jiti: 1.21.7
-      postcss: 8.5.16
-      yaml: 2.9.0
+      postcss: 8.5.3
 
-  postcss-load-config@6.0.1(jiti@2.7.0)(postcss@8.5.25)(yaml@2.9.0):
+  postcss-load-config@6.0.1(jiti@2.4.2)(postcss@8.5.3)(tsx@4.19.1)(yaml@2.6.0):
     dependencies:
-      lilconfig: 3.1.3
+      lilconfig: 3.1.2
     optionalDependencies:
-      jiti: 2.7.0
-      postcss: 8.5.25
-      yaml: 2.9.0
+      jiti: 2.4.2
+      postcss: 8.5.3
+      tsx: 4.19.1
+      yaml: 2.6.0
 
-  postcss-nested@6.2.0(postcss@8.5.16):
+  postcss-media-minmax@5.0.0(postcss@8.5.3):
     dependencies:
-      postcss: 8.5.16
+      postcss: 8.5.3
+
+  postcss-nested@6.2.0(postcss@8.5.3):
+    dependencies:
+      postcss: 8.5.3
       postcss-selector-parser: 6.1.2
 
+  postcss-nesting@13.0.1(postcss@8.5.3):
+    dependencies:
+      '@csstools/selector-resolve-nested': 3.0.0(postcss-selector-parser@7.1.0)
+      '@csstools/selector-specificity': 5.0.0(postcss-selector-parser@7.1.0)
+      postcss: 8.5.3
+      postcss-selector-parser: 7.1.0
+
   postcss-selector-parser@6.0.10:
     dependencies:
       cssesc: 3.0.0
@@ -5425,7 +6977,7 @@ snapshots:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
 
-  postcss-selector-parser@7.1.4:
+  postcss-selector-parser@7.1.0:
     dependencies:
       cssesc: 3.0.0
       util-deprecate: 1.0.2
@@ -5434,57 +6986,64 @@ snapshots:
 
   postcss@8.4.31:
     dependencies:
-      nanoid: 3.3.12
+      nanoid: 3.3.8
       picocolors: 1.1.1
       source-map-js: 1.2.1
 
-  postcss@8.5.16:
+  postcss@8.4.41:
     dependencies:
-      nanoid: 3.3.12
+      nanoid: 3.3.7
+      picocolors: 1.1.1
+      source-map-js: 1.2.0
+
+  postcss@8.5.3:
+    dependencies:
+      nanoid: 3.3.8
       picocolors: 1.1.1
       source-map-js: 1.2.1
 
-  postcss@8.5.25:
-    dependencies:
-      nanoid: 3.3.16
-      picocolors: 1.1.1
-      source-map-js: 1.2.1
+  prelude-ls@1.2.1: {}
 
-  prettier-plugin-embed@0.5.1:
+  prettier-plugin-embed@0.5.0:
     dependencies:
-      '@types/estree': 1.0.9
-      dedent: 1.7.2
-      micro-memoize: 5.1.1
+      '@types/estree': 1.0.6
+      dedent: 1.5.3
+      micro-memoize: 4.1.3
       package-up: 5.0.0
       tiny-jsonc: 1.0.2
-      type-fest: 5.6.0
+      type-fest: 4.36.0
     transitivePeerDependencies:
       - babel-plugin-macros
 
-  prettier-plugin-organize-imports@4.3.0(prettier@3.9.6)(typescript@5.9.3):
+  prettier-plugin-organize-imports@4.0.0(prettier@3.5.0)(typescript@5.5.4):
     dependencies:
-      prettier: 3.9.6
-      typescript: 5.9.3
+      prettier: 3.5.0
+      typescript: 5.5.4
 
-  prettier@3.9.6: {}
+  prettier@3.5.0: {}
+
+  prop-types@15.8.1:
+    dependencies:
+      loose-envify: 1.4.0
+      object-assign: 4.1.1
+      react-is: 16.13.1
+
+  punycode@2.3.1: {}
 
   queue-microtask@1.2.3: {}
 
   radix3@1.1.2: {}
 
-  react-dom@19.2.6(react@19.2.6):
+  react-dom@19.0.0(react@19.0.0):
     dependencies:
-      react: 19.2.6
-      scheduler: 0.27.0
+      react: 19.0.0
+      scheduler: 0.25.0
 
-  react-dom@19.2.7(react@19.2.7):
-    dependencies:
-      react: 19.2.7
-      scheduler: 0.27.0
+  react-is@16.13.1: {}
 
-  react@19.2.6: {}
+  react-refresh@0.14.2: {}
 
-  react@19.2.7: {}
+  react@19.0.0: {}
 
   read-cache@1.0.0:
     dependencies:
@@ -5492,171 +7051,280 @@ snapshots:
 
   readdirp@3.6.0:
     dependencies:
-      picomatch: 2.3.2
+      picomatch: 2.3.1
 
-  readdirp@4.1.2: {}
+  readdirp@4.1.1: {}
 
-  require-from-string@2.0.2: {}
+  reflect.getprototypeof@1.0.6:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      get-intrinsic: 1.2.4
+      globalthis: 1.0.4
+      which-builtin-type: 1.1.4
+
+  regexp.prototype.flags@1.5.2:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-errors: 1.3.0
+      set-function-name: 2.0.2
+
+  resolve-from@4.0.0: {}
 
   resolve-from@5.0.0: {}
 
-  resolve@1.22.12:
+  resolve-pkg-maps@1.0.0: {}
+
+  resolve@1.22.8:
     dependencies:
-      es-errors: 1.3.0
-      is-core-module: 2.16.2
+      is-core-module: 2.15.0
       path-parse: 1.0.7
       supports-preserve-symlinks-flag: 1.0.0
 
-  reusify@1.1.0: {}
-
-  rolldown@1.2.1:
+  resolve@2.0.0-next.5:
     dependencies:
-      '@oxc-project/types': 0.142.0
-      '@rolldown/pluginutils': 1.0.1
-    optionalDependencies:
-      '@rolldown/binding-android-arm64': 1.2.1
-      '@rolldown/binding-darwin-arm64': 1.2.1
-      '@rolldown/binding-darwin-x64': 1.2.1
-      '@rolldown/binding-freebsd-x64': 1.2.1
-      '@rolldown/binding-linux-arm-gnueabihf': 1.2.1
-      '@rolldown/binding-linux-arm64-gnu': 1.2.1
-      '@rolldown/binding-linux-arm64-musl': 1.2.1
-      '@rolldown/binding-linux-ppc64-gnu': 1.2.1
-      '@rolldown/binding-linux-s390x-gnu': 1.2.1
-      '@rolldown/binding-linux-x64-gnu': 1.2.1
-      '@rolldown/binding-linux-x64-musl': 1.2.1
-      '@rolldown/binding-openharmony-arm64': 1.2.1
-      '@rolldown/binding-wasm32-wasi': 1.2.1
-      '@rolldown/binding-win32-arm64-msvc': 1.2.1
-      '@rolldown/binding-win32-x64-msvc': 1.2.1
+      is-core-module: 2.15.1
+      path-parse: 1.0.7
+      supports-preserve-symlinks-flag: 1.0.0
 
-  rollup@4.60.4:
+  reusify@1.0.4: {}
+
+  rollup@4.34.9:
     dependencies:
-      '@types/estree': 1.0.8
+      '@types/estree': 1.0.6
     optionalDependencies:
-      '@rollup/rollup-android-arm-eabi': 4.60.4
-      '@rollup/rollup-android-arm64': 4.60.4
-      '@rollup/rollup-darwin-arm64': 4.60.4
-      '@rollup/rollup-darwin-x64': 4.60.4
-      '@rollup/rollup-freebsd-arm64': 4.60.4
-      '@rollup/rollup-freebsd-x64': 4.60.4
-      '@rollup/rollup-linux-arm-gnueabihf': 4.60.4
-      '@rollup/rollup-linux-arm-musleabihf': 4.60.4
-      '@rollup/rollup-linux-arm64-gnu': 4.60.4
-      '@rollup/rollup-linux-arm64-musl': 4.60.4
-      '@rollup/rollup-linux-loong64-gnu': 4.60.4
-      '@rollup/rollup-linux-loong64-musl': 4.60.4
-      '@rollup/rollup-linux-ppc64-gnu': 4.60.4
-      '@rollup/rollup-linux-ppc64-musl': 4.60.4
-      '@rollup/rollup-linux-riscv64-gnu': 4.60.4
-      '@rollup/rollup-linux-riscv64-musl': 4.60.4
-      '@rollup/rollup-linux-s390x-gnu': 4.60.4
-      '@rollup/rollup-linux-x64-gnu': 4.60.4
-      '@rollup/rollup-linux-x64-musl': 4.60.4
-      '@rollup/rollup-openbsd-x64': 4.60.4
-      '@rollup/rollup-openharmony-arm64': 4.60.4
-      '@rollup/rollup-win32-arm64-msvc': 4.60.4
-      '@rollup/rollup-win32-ia32-msvc': 4.60.4
-      '@rollup/rollup-win32-x64-gnu': 4.60.4
-      '@rollup/rollup-win32-x64-msvc': 4.60.4
+      '@rollup/rollup-android-arm-eabi': 4.34.9
+      '@rollup/rollup-android-arm64': 4.34.9
+      '@rollup/rollup-darwin-arm64': 4.34.9
+      '@rollup/rollup-darwin-x64': 4.34.9
+      '@rollup/rollup-freebsd-arm64': 4.34.9
+      '@rollup/rollup-freebsd-x64': 4.34.9
+      '@rollup/rollup-linux-arm-gnueabihf': 4.34.9
+      '@rollup/rollup-linux-arm-musleabihf': 4.34.9
+      '@rollup/rollup-linux-arm64-gnu': 4.34.9
+      '@rollup/rollup-linux-arm64-musl': 4.34.9
+      '@rollup/rollup-linux-loongarch64-gnu': 4.34.9
+      '@rollup/rollup-linux-powerpc64le-gnu': 4.34.9
+      '@rollup/rollup-linux-riscv64-gnu': 4.34.9
+      '@rollup/rollup-linux-s390x-gnu': 4.34.9
+      '@rollup/rollup-linux-x64-gnu': 4.34.9
+      '@rollup/rollup-linux-x64-musl': 4.34.9
+      '@rollup/rollup-win32-arm64-msvc': 4.34.9
+      '@rollup/rollup-win32-ia32-msvc': 4.34.9
+      '@rollup/rollup-win32-x64-msvc': 4.34.9
       fsevents: 2.3.3
 
   run-parallel@1.2.0:
     dependencies:
       queue-microtask: 1.2.3
 
-  safer-buffer@2.1.2: {}
-
-  scheduler@0.27.0: {}
-
-  schema-utils@4.3.3:
+  safe-array-concat@1.1.2:
     dependencies:
-      '@types/json-schema': 7.0.15
-      ajv: 8.20.0
-      ajv-formats: 2.1.1(ajv@8.20.0)
-      ajv-keywords: 5.1.0(ajv@8.20.0)
+      call-bind: 1.0.7
+      get-intrinsic: 1.2.4
+      has-symbols: 1.0.3
+      isarray: 2.0.5
 
-  semver@7.8.5: {}
-
-  sharp@0.34.5:
+  safe-regex-test@1.0.3:
     dependencies:
-      '@img/colour': 1.1.0
-      detect-libc: 2.1.2
-      semver: 7.8.5
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      is-regex: 1.1.4
+
+  scheduler@0.25.0: {}
+
+  semver@6.3.1: {}
+
+  semver@7.6.3: {}
+
+  set-function-length@1.2.2:
+    dependencies:
+      define-data-property: 1.1.4
+      es-errors: 1.3.0
+      function-bind: 1.1.2
+      get-intrinsic: 1.2.4
+      gopd: 1.0.1
+      has-property-descriptors: 1.0.2
+
+  set-function-name@2.0.2:
+    dependencies:
+      define-data-property: 1.1.4
+      es-errors: 1.3.0
+      functions-have-names: 1.2.3
+      has-property-descriptors: 1.0.2
+
+  sharp@0.33.5:
+    dependencies:
+      color: 4.2.3
+      detect-libc: 2.0.3
+      semver: 7.6.3
     optionalDependencies:
-      '@img/sharp-darwin-arm64': 0.34.5
-      '@img/sharp-darwin-x64': 0.34.5
-      '@img/sharp-libvips-darwin-arm64': 1.2.4
-      '@img/sharp-libvips-darwin-x64': 1.2.4
-      '@img/sharp-libvips-linux-arm': 1.2.4
-      '@img/sharp-libvips-linux-arm64': 1.2.4
-      '@img/sharp-libvips-linux-ppc64': 1.2.4
-      '@img/sharp-libvips-linux-riscv64': 1.2.4
-      '@img/sharp-libvips-linux-s390x': 1.2.4
-      '@img/sharp-libvips-linux-x64': 1.2.4
-      '@img/sharp-libvips-linuxmusl-arm64': 1.2.4
-      '@img/sharp-libvips-linuxmusl-x64': 1.2.4
-      '@img/sharp-linux-arm': 0.34.5
-      '@img/sharp-linux-arm64': 0.34.5
-      '@img/sharp-linux-ppc64': 0.34.5
-      '@img/sharp-linux-riscv64': 0.34.5
-      '@img/sharp-linux-s390x': 0.34.5
-      '@img/sharp-linux-x64': 0.34.5
-      '@img/sharp-linuxmusl-arm64': 0.34.5
-      '@img/sharp-linuxmusl-x64': 0.34.5
-      '@img/sharp-wasm32': 0.34.5
-      '@img/sharp-win32-arm64': 0.34.5
-      '@img/sharp-win32-ia32': 0.34.5
-      '@img/sharp-win32-x64': 0.34.5
+      '@img/sharp-darwin-arm64': 0.33.5
+      '@img/sharp-darwin-x64': 0.33.5
+      '@img/sharp-libvips-darwin-arm64': 1.0.4
+      '@img/sharp-libvips-darwin-x64': 1.0.4
+      '@img/sharp-libvips-linux-arm': 1.0.5
+      '@img/sharp-libvips-linux-arm64': 1.0.4
+      '@img/sharp-libvips-linux-s390x': 1.0.4
+      '@img/sharp-libvips-linux-x64': 1.0.4
+      '@img/sharp-libvips-linuxmusl-arm64': 1.0.4
+      '@img/sharp-libvips-linuxmusl-x64': 1.0.4
+      '@img/sharp-linux-arm': 0.33.5
+      '@img/sharp-linux-arm64': 0.33.5
+      '@img/sharp-linux-s390x': 0.33.5
+      '@img/sharp-linux-x64': 0.33.5
+      '@img/sharp-linuxmusl-arm64': 0.33.5
+      '@img/sharp-linuxmusl-x64': 0.33.5
+      '@img/sharp-wasm32': 0.33.5
+      '@img/sharp-win32-ia32': 0.33.5
+      '@img/sharp-win32-x64': 0.33.5
     optional: true
 
+  shebang-command@2.0.0:
+    dependencies:
+      shebang-regex: 3.0.0
+
+  shebang-regex@3.0.0: {}
+
+  side-channel@1.0.6:
+    dependencies:
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      get-intrinsic: 1.2.4
+      object-inspect: 1.13.2
+
   siginfo@2.0.0: {}
 
   signal-exit@4.1.0: {}
 
+  simple-swizzle@0.2.2:
+    dependencies:
+      is-arrayish: 0.3.2
+    optional: true
+
   slash@5.1.0: {}
 
+  source-map-js@1.2.0: {}
+
   source-map-js@1.2.1: {}
 
   source-map-support@0.5.21:
     dependencies:
       buffer-from: 1.1.2
       source-map: 0.6.1
+    optional: true
 
-  source-map@0.6.1: {}
+  source-map@0.6.1:
+    optional: true
 
-  source-map@0.7.6: {}
+  source-map@0.8.0-beta.0:
+    dependencies:
+      whatwg-url: 7.1.0
 
   stackback@0.0.2: {}
 
-  std-env@4.1.0: {}
+  std-env@3.7.0: {}
 
-  std-env@4.2.0: {}
+  streamsearch@1.1.0: {}
 
-  styled-jsx@5.1.6(react@19.2.7):
+  string-width@4.2.3:
+    dependencies:
+      emoji-regex: 8.0.0
+      is-fullwidth-code-point: 3.0.0
+      strip-ansi: 6.0.1
+
+  string-width@5.1.2:
+    dependencies:
+      eastasianwidth: 0.2.0
+      emoji-regex: 9.2.2
+      strip-ansi: 7.1.0
+
+  string.prototype.includes@2.0.1:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+
+  string.prototype.matchall@4.0.11:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-errors: 1.3.0
+      es-object-atoms: 1.0.0
+      get-intrinsic: 1.2.4
+      gopd: 1.0.1
+      has-symbols: 1.0.3
+      internal-slot: 1.0.7
+      regexp.prototype.flags: 1.5.2
+      set-function-name: 2.0.2
+      side-channel: 1.0.6
+
+  string.prototype.repeat@1.0.0:
+    dependencies:
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+
+  string.prototype.trim@1.2.9:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-abstract: 1.23.3
+      es-object-atoms: 1.0.0
+
+  string.prototype.trimend@1.0.8:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-object-atoms: 1.0.0
+
+  string.prototype.trimstart@1.0.8:
+    dependencies:
+      call-bind: 1.0.7
+      define-properties: 1.2.1
+      es-object-atoms: 1.0.0
+
+  strip-ansi@6.0.1:
+    dependencies:
+      ansi-regex: 5.0.1
+
+  strip-ansi@7.1.0:
+    dependencies:
+      ansi-regex: 6.0.1
+
+  strip-bom@3.0.0: {}
+
+  strip-final-newline@3.0.0: {}
+
+  strip-json-comments@3.1.1: {}
+
+  styled-jsx@5.1.6(react@19.0.0):
     dependencies:
       client-only: 0.0.1
-      react: 19.2.7
+      react: 19.0.0
 
-  sucrase@3.35.1:
+  sucrase@3.35.0:
     dependencies:
-      '@jridgewell/gen-mapping': 0.3.13
+      '@jridgewell/gen-mapping': 0.3.5
       commander: 4.1.1
+      glob: 10.4.5
       lines-and-columns: 1.2.4
       mz: 2.7.0
-      pirates: 4.0.7
-      tinyglobby: 0.2.16
+      pirates: 4.0.6
       ts-interface-checker: 0.1.13
 
-  supports-color@8.1.1:
+  supports-color@7.2.0:
     dependencies:
       has-flag: 4.0.0
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
-  tagged-tag@1.0.0: {}
+  system-architecture@0.1.0: {}
 
-  tailwindcss@3.4.19(yaml@2.9.0):
+  tailwindcss@3.4.14:
     dependencies:
       '@alloc/quick-lru': 5.2.0
       arg: 5.0.2
@@ -5666,32 +7334,32 @@ snapshots:
       fast-glob: 3.3.3
       glob-parent: 6.0.2
       is-glob: 4.0.3
-      jiti: 1.21.7
-      lilconfig: 3.1.3
-      micromatch: 4.0.8
+      jiti: 1.21.6
+      lilconfig: 2.1.0
+      micromatch: 4.0.7
       normalize-path: 3.0.0
       object-hash: 3.0.0
       picocolors: 1.1.1
-      postcss: 8.5.16
-      postcss-import: 15.1.0(postcss@8.5.16)
-      postcss-js: 4.1.0(postcss@8.5.16)
-      postcss-load-config: 6.0.1(jiti@1.21.7)(postcss@8.5.16)(yaml@2.9.0)
-      postcss-nested: 6.2.0(postcss@8.5.16)
+      postcss: 8.5.3
+      postcss-import: 15.1.0(postcss@8.5.3)
+      postcss-js: 4.0.1(postcss@8.5.3)
+      postcss-load-config: 4.0.2(postcss@8.5.3)
+      postcss-nested: 6.2.0(postcss@8.5.3)
       postcss-selector-parser: 6.1.2
-      resolve: 1.22.12
-      sucrase: 3.35.1
+      resolve: 1.22.8
+      sucrase: 3.35.0
     transitivePeerDependencies:
-      - tsx
-      - yaml
+      - ts-node
 
-  tapable@2.3.3: {}
+  tapable@2.2.1: {}
 
-  terser@5.48.0:
+  terser@5.31.6:
     dependencies:
-      '@jridgewell/source-map': 0.3.11
-      acorn: 8.16.0
+      '@jridgewell/source-map': 0.3.6
+      acorn: 8.14.0
       commander: 2.20.3
       source-map-support: 0.5.21
+    optional: true
 
   thenify-all@1.6.0:
     dependencies:
@@ -5705,227 +7373,360 @@ snapshots:
 
   tinybench@2.9.0: {}
 
-  tinyclip@0.1.15: {}
-
   tinyexec@0.3.2: {}
 
-  tinyexec@1.1.2: {}
-
-  tinyglobby@0.2.16:
+  tinyglobby@0.2.12:
     dependencies:
-      fdir: 6.5.0(picomatch@4.0.4)
-      picomatch: 4.0.4
+      fdir: 6.4.3(picomatch@4.0.2)
+      picomatch: 4.0.2
 
-  tinyglobby@0.2.17:
-    dependencies:
-      fdir: 6.5.0(picomatch@4.0.5)
-      picomatch: 4.0.5
+  tinypool@1.0.0: {}
 
-  tinyrainbow@3.1.0: {}
+  tinyrainbow@1.2.0: {}
+
+  tinyspy@3.0.0: {}
 
   to-regex-range@5.0.1:
     dependencies:
       is-number: 7.0.0
 
+  tr46@1.0.1:
+    dependencies:
+      punycode: 2.3.1
+
   tree-kill@1.2.2: {}
 
-  tree-sitter-javascript@0.23.1(tree-sitter@0.25.1):
+  tree-sitter-javascript@0.23.1(tree-sitter@0.22.4):
     dependencies:
-      node-addon-api: 8.7.0
-      node-gyp-build: 4.8.4
+      node-addon-api: 8.2.2
+      node-gyp-build: 4.8.2
     optionalDependencies:
-      tree-sitter: 0.25.1
+      tree-sitter: 0.22.4
 
-  tree-sitter-typescript@0.23.2(tree-sitter@0.25.1):
+  tree-sitter-typescript@0.23.2(tree-sitter@0.22.4):
     dependencies:
-      node-addon-api: 8.7.0
-      node-gyp-build: 4.8.4
-      tree-sitter-javascript: 0.23.1(tree-sitter@0.25.1)
+      node-addon-api: 8.2.2
+      node-gyp-build: 4.8.2
+      tree-sitter-javascript: 0.23.1(tree-sitter@0.22.4)
     optionalDependencies:
-      tree-sitter: 0.25.1
+      tree-sitter: 0.22.4
 
-  tree-sitter@0.25.1:
+  tree-sitter@0.22.4:
     dependencies:
-      node-addon-api: 8.7.0
+      node-addon-api: 8.3.0
       node-gyp-build: 4.8.4
 
+  ts-api-utils@1.3.0(typescript@5.5.4):
+    dependencies:
+      typescript: 5.5.4
+
+  ts-api-utils@1.3.0(typescript@5.6.3):
+    dependencies:
+      typescript: 5.6.3
+
   ts-interface-checker@0.1.13: {}
 
-  tslib@2.8.1: {}
-
-  tsup@8.5.1(jiti@2.7.0)(postcss@8.5.25)(typescript@5.9.3)(yaml@2.9.0):
+  tsconfig-paths@3.15.0:
     dependencies:
-      bundle-require: 5.1.0(esbuild@0.27.7)
+      '@types/json5': 0.0.29
+      json5: 1.0.2
+      minimist: 1.2.8
+      strip-bom: 3.0.0
+
+  tslib@2.8.0: {}
+
+  tsup@8.4.0(jiti@2.4.2)(postcss@8.5.3)(tsx@4.19.1)(typescript@5.5.4)(yaml@2.6.0):
+    dependencies:
+      bundle-require: 5.1.0(esbuild@0.25.0)
       cac: 6.7.14
       chokidar: 4.0.3
-      consola: 3.4.2
-      debug: 4.4.3
-      esbuild: 0.27.7
-      fix-dts-default-cjs-exports: 1.0.1
+      consola: 3.4.0
+      debug: 4.4.0
+      esbuild: 0.25.0
       joycon: 3.1.1
       picocolors: 1.1.1
-      postcss-load-config: 6.0.1(jiti@2.7.0)(postcss@8.5.25)(yaml@2.9.0)
+      postcss-load-config: 6.0.1(jiti@2.4.2)(postcss@8.5.3)(tsx@4.19.1)(yaml@2.6.0)
       resolve-from: 5.0.0
-      rollup: 4.60.4
-      source-map: 0.7.6
-      sucrase: 3.35.1
+      rollup: 4.34.9
+      source-map: 0.8.0-beta.0
+      sucrase: 3.35.0
       tinyexec: 0.3.2
-      tinyglobby: 0.2.16
+      tinyglobby: 0.2.12
       tree-kill: 1.2.2
     optionalDependencies:
-      postcss: 8.5.25
-      typescript: 5.9.3
+      postcss: 8.5.3
+      typescript: 5.5.4
     transitivePeerDependencies:
       - jiti
       - supports-color
       - tsx
       - yaml
 
-  turbo@2.10.8:
-    optionalDependencies:
-      '@turbo/darwin-64': 2.10.8
-      '@turbo/darwin-arm64': 2.10.8
-      '@turbo/linux-64': 2.10.8
-      '@turbo/linux-arm64': 2.10.8
-      '@turbo/windows-64': 2.10.8
-      '@turbo/windows-arm64': 2.10.8
-
-  typanion@3.14.0: {}
-
-  type-fest@5.6.0:
+  tsx@4.19.1:
     dependencies:
-      tagged-tag: 1.0.0
+      esbuild: 0.23.1
+      get-tsconfig: 4.8.1
+    optionalDependencies:
+      fsevents: 2.3.3
+    optional: true
 
-  typescript@5.9.3: {}
+  turbo-darwin-64@2.4.4:
+    optional: true
 
-  typescript@6.0.3: {}
+  turbo-darwin-arm64@2.4.4:
+    optional: true
 
-  ufo@1.6.4: {}
+  turbo-linux-64@2.4.4:
+    optional: true
+
+  turbo-linux-arm64@2.4.4:
+    optional: true
+
+  turbo-windows-64@2.4.4:
+    optional: true
+
+  turbo-windows-arm64@2.4.4:
+    optional: true
+
+  turbo@2.4.4:
+    optionalDependencies:
+      turbo-darwin-64: 2.4.4
+      turbo-darwin-arm64: 2.4.4
+      turbo-linux-64: 2.4.4
+      turbo-linux-arm64: 2.4.4
+      turbo-windows-64: 2.4.4
+      turbo-windows-arm64: 2.4.4
+
+  type-check@0.4.0:
+    dependencies:
+      prelude-ls: 1.2.1
+
+  type-fest@4.36.0: {}
+
+  typed-array-buffer@1.0.2:
+    dependencies:
+      call-bind: 1.0.7
+      es-errors: 1.3.0
+      is-typed-array: 1.1.13
+
+  typed-array-byte-length@1.0.1:
+    dependencies:
+      call-bind: 1.0.7
+      for-each: 0.3.3
+      gopd: 1.0.1
+      has-proto: 1.0.3
+      is-typed-array: 1.1.13
+
+  typed-array-byte-offset@1.0.2:
+    dependencies:
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.7
+      for-each: 0.3.3
+      gopd: 1.0.1
+      has-proto: 1.0.3
+      is-typed-array: 1.1.13
+
+  typed-array-length@1.0.6:
+    dependencies:
+      call-bind: 1.0.7
+      for-each: 0.3.3
+      gopd: 1.0.1
+      has-proto: 1.0.3
+      is-typed-array: 1.1.13
+      possible-typed-array-names: 1.0.0
+
+  typescript@5.5.4: {}
+
+  typescript@5.6.3: {}
+
+  ufo@1.5.4: {}
+
+  unbox-primitive@1.0.2:
+    dependencies:
+      call-bind: 1.0.7
+      has-bigints: 1.0.2
+      has-symbols: 1.0.3
+      which-boxed-primitive: 1.0.2
 
   uncrypto@0.1.3: {}
 
-  undici-types@6.21.0: {}
+  undici-types@5.26.5: {}
 
-  undici-types@7.24.6: {}
+  unicorn-magic@0.3.0: {}
 
-  unicorn-magic@0.4.0: {}
-
-  universal-user-agent@7.0.3: {}
-
-  untun@0.2.2: {}
-
-  update-browserslist-db@1.2.3(browserslist@4.28.2):
+  untun@0.1.3:
     dependencies:
-      browserslist: 4.28.2
+      citty: 0.1.6
+      consola: 3.2.3
+      pathe: 1.1.2
+
+  update-browserslist-db@1.1.1(browserslist@4.24.2):
+    dependencies:
+      browserslist: 4.24.2
       escalade: 3.2.0
       picocolors: 1.1.1
 
-  uqr@0.1.3: {}
+  update-browserslist-db@1.1.1(browserslist@4.24.4):
+    dependencies:
+      browserslist: 4.24.4
+      escalade: 3.2.0
+      picocolors: 1.1.1
+
+  uqr@0.1.2: {}
+
+  uri-js@4.4.1:
+    dependencies:
+      punycode: 2.3.1
 
   util-deprecate@1.0.2: {}
 
-  vite@8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0):
+  vite-node@2.0.5(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6):
     dependencies:
-      lightningcss: 1.33.0(patch_hash=1d4a8800d60d13d42887b88b3a86576df4b451670308145fb432ec8abbf40930)
-      picomatch: 4.0.5
-      postcss: 8.5.25
-      rolldown: 1.2.1
-      tinyglobby: 0.2.17
-    optionalDependencies:
-      '@types/node': 22.20.1
-      esbuild: 0.27.7
-      fsevents: 2.3.3
-      jiti: 2.7.0
-      terser: 5.48.0
-      yaml: 2.9.0
+      cac: 6.7.14
+      debug: 4.4.0
+      pathe: 1.1.2
+      tinyrainbow: 1.2.0
+      vite: 5.4.0(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)
+    transitivePeerDependencies:
+      - '@types/node'
+      - less
+      - lightningcss
+      - sass
+      - sass-embedded
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
 
-  vite@8.2.0(@types/node@25.9.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0):
+  vite@5.4.0(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6):
     dependencies:
-      lightningcss: 1.33.0(patch_hash=1d4a8800d60d13d42887b88b3a86576df4b451670308145fb432ec8abbf40930)
-      picomatch: 4.0.5
-      postcss: 8.5.25
-      rolldown: 1.2.1
-      tinyglobby: 0.2.17
+      esbuild: 0.21.5
+      postcss: 8.5.3
+      rollup: 4.34.9
     optionalDependencies:
-      '@types/node': 25.9.1
-      esbuild: 0.27.7
+      '@types/node': 20.14.13
       fsevents: 2.3.3
-      jiti: 2.7.0
-      terser: 5.48.0
-      yaml: 2.9.0
+      lightningcss: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
+      terser: 5.31.6
 
-  vitest@4.1.10(@types/node@22.20.1)(vite@8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)):
+  vite@6.0.0(@types/node@20.14.13)(jiti@2.4.2)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)(tsx@4.19.1)(yaml@2.6.0):
     dependencies:
-      '@vitest/expect': 4.1.10
-      '@vitest/mocker': 4.1.10(vite@8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0))
-      '@vitest/pretty-format': 4.1.10
-      '@vitest/runner': 4.1.10
-      '@vitest/snapshot': 4.1.10
-      '@vitest/spy': 4.1.10
-      '@vitest/utils': 4.1.10
-      es-module-lexer: 2.1.0
-      expect-type: 1.3.0
-      magic-string: 0.30.21
-      obug: 2.1.1
-      pathe: 2.0.3
-      picomatch: 4.0.4
-      std-env: 4.1.0
+      esbuild: 0.24.0
+      postcss: 8.5.3
+      rollup: 4.34.9
+    optionalDependencies:
+      '@types/node': 20.14.13
+      fsevents: 2.3.3
+      jiti: 2.4.2
+      lightningcss: 1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm)
+      terser: 5.31.6
+      tsx: 4.19.1
+      yaml: 2.6.0
+
+  vitest@2.0.5(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6):
+    dependencies:
+      '@ampproject/remapping': 2.3.0
+      '@vitest/expect': 2.0.5
+      '@vitest/pretty-format': 2.0.5
+      '@vitest/runner': 2.0.5
+      '@vitest/snapshot': 2.0.5
+      '@vitest/spy': 2.0.5
+      '@vitest/utils': 2.0.5
+      chai: 5.1.1
+      debug: 4.3.6
+      execa: 8.0.1
+      magic-string: 0.30.11
+      pathe: 1.1.2
+      std-env: 3.7.0
       tinybench: 2.9.0
-      tinyexec: 1.1.2
-      tinyglobby: 0.2.17
-      tinyrainbow: 3.1.0
-      vite: 8.2.0(@types/node@22.20.1)(esbuild@0.27.7)(jiti@2.7.0)(terser@5.48.0)(yaml@2.9.0)
+      tinypool: 1.0.0
+      tinyrainbow: 1.2.0
+      vite: 5.4.0(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)
+      vite-node: 2.0.5(@types/node@20.14.13)(lightningcss@1.29.2(patch_hash=tzyxy3asfxcqc7ihrooumyi5fm))(terser@5.31.6)
       why-is-node-running: 2.3.0
     optionalDependencies:
-      '@types/node': 22.20.1
+      '@types/node': 20.14.13
     transitivePeerDependencies:
-      - msw
-
-  watchpack@2.5.2:
-    dependencies:
-      graceful-fs: 4.2.11
-
-  webpack-sources@3.5.1: {}
-
-  webpack@5.109.2(esbuild@0.27.7)(postcss@8.5.25):
-    dependencies:
-      '@types/estree': 1.0.9
-      '@types/json-schema': 7.0.15
-      '@webassemblyjs/ast': 1.14.1
-      '@webassemblyjs/wasm-edit': 1.14.1
-      '@webassemblyjs/wasm-parser': 1.14.1
-      acorn: 8.16.0
-      browserslist: 4.28.2
-      chrome-trace-event: 1.0.4
-      enhanced-resolve: 5.24.5
-      es-module-lexer: 2.1.0
-      eslint-scope: 5.1.1
-      events: 3.3.0
-      graceful-fs: 4.2.11
-      mime-db: 1.54.0
-      minimizer-webpack-plugin: 5.6.1(esbuild@0.27.7)(postcss@8.5.25)(webpack@5.109.2(esbuild@0.27.7)(postcss@8.5.25))
-      neo-async: 2.6.2
-      schema-utils: 4.3.3
-      tapable: 2.3.3
-      watchpack: 2.5.2
-      webpack-sources: 3.5.1
-    transitivePeerDependencies:
-      - '@minify-html/node'
-      - '@swc/core'
-      - '@swc/css'
-      - '@swc/html'
-      - clean-css
-      - cssnano
-      - csso
-      - esbuild
-      - html-minifier-terser
+      - less
       - lightningcss
-      - postcss
-      - uglify-js
+      - sass
+      - sass-embedded
+      - stylus
+      - sugarss
+      - supports-color
+      - terser
+
+  webidl-conversions@4.0.2: {}
+
+  whatwg-url@7.1.0:
+    dependencies:
+      lodash.sortby: 4.7.0
+      tr46: 1.0.1
+      webidl-conversions: 4.0.2
+
+  which-boxed-primitive@1.0.2:
+    dependencies:
+      is-bigint: 1.0.4
+      is-boolean-object: 1.1.2
+      is-number-object: 1.0.7
+      is-string: 1.0.7
+      is-symbol: 1.0.4
+
+  which-builtin-type@1.1.4:
+    dependencies:
+      function.prototype.name: 1.1.6
+      has-tostringtag: 1.0.2
+      is-async-function: 2.0.0
+      is-date-object: 1.0.5
+      is-finalizationregistry: 1.0.2
+      is-generator-function: 1.0.10
+      is-regex: 1.1.4
+      is-weakref: 1.0.2
+      isarray: 2.0.5
+      which-boxed-primitive: 1.0.2
+      which-collection: 1.0.2
+      which-typed-array: 1.1.15
+
+  which-collection@1.0.2:
+    dependencies:
+      is-map: 2.0.3
+      is-set: 2.0.3
+      is-weakmap: 2.0.2
+      is-weakset: 2.0.3
+
+  which-typed-array@1.1.15:
+    dependencies:
+      available-typed-arrays: 1.0.7
+      call-bind: 1.0.7
+      for-each: 0.3.3
+      gopd: 1.0.1
+      has-tostringtag: 1.0.2
+
+  which@2.0.2:
+    dependencies:
+      isexe: 2.0.0
 
   why-is-node-running@2.3.0:
     dependencies:
       siginfo: 2.0.0
       stackback: 0.0.2
 
-  yaml@2.9.0: {}
+  word-wrap@1.2.5: {}
+
+  wrap-ansi@7.0.0:
+    dependencies:
+      ansi-styles: 4.3.0
+      string-width: 4.2.3
+      strip-ansi: 6.0.1
+
+  wrap-ansi@8.1.0:
+    dependencies:
+      ansi-styles: 6.2.1
+      string-width: 5.1.2
+      strip-ansi: 7.1.0
+
+  yallist@3.1.1: {}
+
+  yaml@2.6.0: {}
+
+  yocto-queue@0.1.0: {}
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index bcddef126..98329b69e 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -5,50 +5,15 @@ packages:
   - 'playgrounds/*'
   - 'integrations'
 
-patchedDependencies:
-  '@napi-rs/cli@3.7.4': patches/@napi-rs__cli@3.7.4.patch
-  '@parcel/watcher@2.6.0': patches/@parcel__watcher@2.6.0.patch
-  lightningcss@1.33.0: patches/lightningcss@1.33.0.patch
-
 catalog:
-  '@types/node': 22.20.1
-  dedent: 1.7.2
-  enhanced-resolve: ^5.24.5
-  lightningcss-darwin-arm64: 1.33.0
-  lightningcss-darwin-x64: 1.33.0
-  lightningcss-linux-arm64-gnu: 1.33.0
-  lightningcss-linux-arm64-musl: 1.33.0
-  lightningcss-linux-x64-gnu: 1.33.0
-  lightningcss-linux-x64-musl: 1.33.0
-  lightningcss-win32-x64-msvc: 1.33.0
-  lightningcss: 1.33.0
-  '@parcel/watcher-darwin-arm64': 2.6.0
-  '@parcel/watcher-darwin-x64': 2.6.0
-  '@parcel/watcher-linux-arm64-glibc': 2.6.0
-  '@parcel/watcher-linux-arm64-musl': 2.6.0
-  '@parcel/watcher-linux-x64-glibc': 2.6.0
-  '@parcel/watcher-linux-x64-musl': 2.6.0
-  '@parcel/watcher-win32-x64': 2.6.0
-  '@parcel/watcher': 2.6.0
-  postcss: ^8.5.25
-  prettier: 3.9.6
-  vite: ^8.2.0
-  webpack: ^5.109.2
-
-onlyBuiltDependencies:
-  - '@parcel/watcher'
-  - bun
-  - esbuild
-  - sharp
-  - tree-sitter
-  - tree-sitter-javascript
-  - tree-sitter-typescript
-
-allowBuilds:
-  '@parcel/watcher': true
-  bun: true
-  esbuild: true
-  sharp: true
-  tree-sitter: true
-  tree-sitter-javascript: true
-  tree-sitter-typescript: true
+  '@types/node': ^20.14.8
+  prettier: 3.5.0
+  vite: ^6.0.0
+  lightningcss: 1.29.2
+  lightningcss-darwin-arm64: 1.29.2
+  lightningcss-darwin-x64: 1.29.2
+  lightningcss-linux-arm64-gnu: 1.29.2
+  lightningcss-linux-arm64-musl: 1.29.2
+  lightningcss-linux-x64-gnu: 1.29.2
+  lightningcss-linux-x64-musl: 1.29.2
+  lightningcss-win32-x64-msvc: 1.29.2
diff --git a/rust-toolchain.toml b/rust-toolchain.toml
index f92020c65..aaba1588e 100644
--- a/rust-toolchain.toml
+++ b/rust-toolchain.toml
@@ -1,3 +1,3 @@
 [toolchain]
-channel = "1.95.0"
+channel = "1.85.0"
 profile = "default"
diff --git a/scripts/pack-packages.mjs b/scripts/pack-packages.mjs
index 2b0b9f15d..3bcf23bec 100644
--- a/scripts/pack-packages.mjs
+++ b/scripts/pack-packages.mjs
@@ -21,25 +21,30 @@ let workspaces = new Map()
 for (let path of paths) {
   let pkg = await fs.readFile(path, 'utf8').then(JSON.parse)
   if (pkg.private) continue
-  workspaces.set(pkg.name, {
-    version: pkg.version ?? '',
-    dir: dirname(path),
-    hasBundledDependencies: pkg.bundledDependencies?.length > 0 ?? false,
-  })
+  workspaces.set(pkg.name, { version: pkg.version ?? '', dir: dirname(path) })
+}
+
+// Move napi artifacts into sub packages
+const tailwindcssOxideRoot = path.join(root, 'crates', 'node')
+for (let file of await fs.readdir(tailwindcssOxideRoot)) {
+  if (file.startsWith('tailwindcss-oxide.') && file.endsWith('.node')) {
+    let target = file.split('.')[1]
+    await fs.cp(
+      path.join(tailwindcssOxideRoot, file),
+      path.join(tailwindcssOxideRoot, 'npm', target, file),
+    )
+  }
 }
 
 // Clean dist folder
 await fs.rm(path.join(root, 'dist'), { recursive: true, force: true })
 
 Promise.all(
-  [...workspaces.entries()].map(async ([name, { dir, hasBundledDependencies }]) => {
+  [...workspaces.entries()].map(async ([name, { version, dir }]) => {
     function pack() {
       return new Promise((resolve) => {
-        // `bundledDependencies` can only be packed with the hoisted node linker
-        // since pnpm v10. We opt into it for those packages only, instead of
-        // changing the node linker for the entire workspace.
         exec(
-          `pnpm pack --pack-gzip-level=0 --pack-destination="${path.join(root, 'dist').replace(/\\/g, '\\\\')}"${hasBundledDependencies ? ' --config.node-linker=hoisted' : ''}`,
+          `pnpm pack --pack-gzip-level=0 --pack-destination="${path.join(root, 'dist').replace(/\\/g, '\\\\')}"`,
           { cwd: dir },
           (err, stdout, stderr) => {
             if (err) {
diff --git a/scripts/release-notes.mjs b/scripts/release-notes.mjs
index bb703c07b..289cb1d96 100644
--- a/scripts/release-notes.mjs
+++ b/scripts/release-notes.mjs
@@ -1,5 +1,5 @@
 // Given a version, figure out what the release notes are so that we can use this to pre-fill the
-// release notes on a GitHub release for the current version.
+// relase notes on a GitHub release for the current version.
 
 import * as fs from 'node:fs/promises'
 import * as path from 'node:path'
diff --git a/scripts/version-packages.mjs b/scripts/version-packages.mjs
index 1641d5404..36f412cc3 100644
--- a/scripts/version-packages.mjs
+++ b/scripts/version-packages.mjs
@@ -28,9 +28,8 @@ const syncedWorkspaces = new Map([
       'crates/node/npm/linux-arm64-musl',
       'crates/node/npm/linux-x64-gnu',
       'crates/node/npm/linux-x64-musl',
-      'crates/node/npm/wasm32-wasi',
-      'crates/node/npm/win32-arm64-msvc',
       'crates/node/npm/win32-x64-msvc',
+      'crates/node/npm/win32-arm64-msvc',
     ],
   ],
   ['@tailwindcss/cli', ['packages/@tailwindcss-standalone']],
diff --git a/turbo.json b/turbo.json
index c48410b29..87eba2732 100644
--- a/turbo.json
+++ b/turbo.json
@@ -1,5 +1,5 @@
 {
-  "$schema": "https://v2-10-8.turborepo.dev/schema.json",
+  "$schema": "https://turbo.build/schema.json",
   "ui": "tui",
   "tasks": {
     "@tailwindcss/oxide#build": {
diff --git a/vitest.config.mts b/vitest.config.mts
deleted file mode 100644
index 3ef999be2..000000000
--- a/vitest.config.mts
+++ /dev/null
@@ -1,8 +0,0 @@
-import { defineConfig } from 'vitest/config'
-
-export default defineConfig({
-  test: {
-    projects: ['./packages/*', '!./packages/tsconfig.base.json'],
-    exclude: ['**/*.spec.?(c|m)[jt]s?(x)', 'integrations/**/*'],
-  },
-})
diff --git a/vitest.workspace.ts b/vitest.workspace.ts
new file mode 100644
index 000000000..4ccde0667
--- /dev/null
+++ b/vitest.workspace.ts
@@ -0,0 +1 @@
+export default ['packages/*']