Implement @custom-variant at-rule for Tailwind 4

[Copilot]

This PR implements support for the @custom-variant at-rule in Tailwind 4, enabling both the single-line and block syntax forms as specified in the Tailwind CSS documentation.

Supported Syntax

Single-line form:

@custom-variant theme-midnight (&:where([data-theme="midnight"] *));

Block form:

@custom-variant theme-midnight {
    &:where([data-theme="midnight"] *) {
        @slot;
    }
}

Implementation Details

• Custom Parser: Created a dedicated parser (src/atrule/tailwind-custom-variant.js) that properly handles variant name identification and optional parentheses syntax
• Block Form: Uses structured AtrulePrelude parsing to extract the variant identifier correctly
• Single-line Form: Falls back to Raw parsing while maintaining successful parsing without errors
• Backward Compatibility: All existing functionality remains unchanged

Testing

Added comprehensive test coverage including:

• Block form with CSS rules
• Single-line form with complex selectors
• Block form with @slot directive
• Integration with the canonical Tailwind 4 fixture file

All 66 tests pass, including the 3 new @custom-variant test cases.

Fixes #2.

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.