CSS rules in `@media` blocks are not applied

[oobabooga]

Describe the bug

@media styles are not applied as of gradio==4.18. They work fine in gradio==3.50.2. This is another bug preventing me from updating to the latest Gradio version.

Related to https://github.com/gradio-app/gradio/issues/7335, and probably caused by https://github.com/gradio-app/gradio/pull/6738.

Have you searched existing issues? 🔎

• [X] I have searched and found no existing issues

Reproduction

Launch the demo below and access http://127.0.0.1:7860/?__theme=dark. The text should be red, but it's white.

import gradio as gr

css = """
@media screen and (min-width: 100px) {
    textarea {
       color: red !important;
       -webkit-text-fill-color: red !important;
    }
}
"""

with gr.Blocks(css=css) as demo:
    gr.TextArea(value="This is a test.")

demo.launch()

Screenshot

No response

Logs

No response

System Info

gradio==4.18.0

Severity

Blocking usage of gradio

[hannahblair]

Ah not another one! 😅 Thanks for reporting this @oobabooga, I'll check this one as well.