Daniel Schwarz shares named media queries you can drop into any project. Input presets like --mouse, --touch, --stylus, --air, and --dpad combine hover and pointer instead of guessing by screen size. Breakpoints go in 100px steps from --from-360 to --from-1560, and --true-hdr checks for HDR and P3. Only Firefox supports @custom-media, behind a flag, so each preset also comes as @container style(), or use PostCSS.
Useful @custom-media presets
