CSS conditionals with the new if() function

Chrome 137 introduces the CSS if() function, enabling inline conditionals for dynamic styling. The function supports style(), media(), and supports() queries, allowing developers to write conditional logic directly within CSS properties instead of using separate @media or @supports blocks. Examples include responsive button sizing based on pointer type, color space fallbacks, and state-based styling using data attributes. This feature provides a cleaner architectural approach by keeping styling logic inline rather than scattered across multiple CSS blocks.