Media Query
In plain terms
A CSS feature applying styles based on device characteristics.
Going deeper
Media queries conditionally apply CSS depending on viewport size, orientation, or other features, enabling responsive design. They adapt layouts to screens.
Under the hood
The core mechanism of responsive breakpoints; container queries now add component-level responsiveness.
Examples
Responsive breakpoints, dark-mode detection, print styles, mobile layouts.
Think of it like...
Like a thermostat rule: 'if the screen is small, switch to the compact layout.'