You're happy as a programmer ? You think you know the Web ? You're a browser implementor ? You think dealing with Media Queries is easy ? Do the following first:

Given a totally arbitrary html document with arbitrary stylesheets and arbitrary media constraints, write an algo that gives all h1 a red foreground color when the viewport size is between min and max, where min is a value in pixels (0 indicating no min-width in the media query...) , and max is a value in pixels or infinite (indicating no max-width in the media query).  You can't use inline styles, of course. !important can be used ONLY if it's the only way of adding that style to the document and it's impossible otherwise. Oh, and you have to handle the case where some stylesheets are remote so you're not allowed to modify them because you could not reserialize them

What's hard? Eh:

• media attributes on stylesheet owner node
• badly ordered MQs
• intersecting (but not contained) media queries
• default styles between MQs
• remote stylesheets
• so funny to deal with the CSS OM where you can't insert a rule before or after another rule but have to deal with rule indices...
• etc.

My implementation in BlueGriffon is almost ready. Have fun...

http://www.glazman.org/weblog/dotclear/index.php?post/2016/06/23/Implementing-Media-Queries-in-an-editor