1. Media Queries: interaction media features

    Allows a media query to be set based on the presence and accuracy of the user's pointing device, and whether they have the ability to hover over elements on the page. This includes the `pointer`, `any-pointer`, `hover`, and `any-hover` media features.

  2. Media Queries: Range Syntax

    Syntax improvements to make media queries using features that have a "range" type (like width or height) less verbose. Can be used with ordinary mathematical comparison operators: `>`, `<`, `>=`, or `<=`. For example: `@media (100px <= width <= 1900px)` is the equivalent of `@media (min-width: 100px) and (max-width: 1900px)`

  3. Media Queries: resolution feature

    Allows a media query to be set based on the device pixels used per CSS unit. While the standard uses `min`/`max-resolution` for this, some browsers support the older non-standard `device-pixel-ratio` media query.

  4. CSS3 Media Queries

    Method of applying styles based on media information. Includes things like page and device dimensions

  5. CSS @when / @else conditional rules

    Syntax allowing CSS conditions (like media and support queries) to be written more simply, as well as making it possible to write mutually exclusive rules using `@else` statements.

  6. css at-rule: `@media`: nested media queries

  7. css at-rule: `@media`: `or` syntax from media queries level 4