diff --git a/edit/codemirror-default.css b/edit/codemirror-default.css
index 191b9813..6d68219a 100644
--- a/edit/codemirror-default.css
+++ b/edit/codemirror-default.css
@@ -85,7 +85,7 @@
   background: linear-gradient(0deg, hsla(180, 100%, 30%, .75) 2px, hsla(180, 100%, 30%, .2) 2px);
 }
 
-@media (prefers-color-scheme: dark) {
+@media screen and (prefers-color-scheme: dark), dark {
   .CodeMirror-dialog {
     background-color: #333;
   }
diff --git a/js/dark-themer.js b/js/dark-themer.js
index ca983e13..0b473bf8 100644
--- a/js/dark-themer.js
+++ b/js/dark-themer.js
@@ -3,9 +3,9 @@
 
 /**
  * This file must be loaded in a <script> tag placed after all the <link> tags
- * that contain dark themes so that the stylesheets are loaded synchronously
- * by the time this script runs. The CSS must use `@media (prefers-color-scheme: dark) {}`
- * to ensure the rules are loaded before the first paint, then we toggle the rule here,
+ * that contain dark themes so that the stylesheets are loaded by the time this script runs.
+ * The CSS must use `@media screen and (prefers-color-scheme: dark), dark {}` that also works
+ * in old browsers and ensures CSS loads before the first paint, then we toggle the media here,
  * which also happens before the first paint unless the browser "yields", but that's abnormal
  * and not even a problem in the most popular case of using system dark/light mode.
  */
@@ -22,8 +22,8 @@ API.colorScheme.shouldIncludeStyle('darkUI').then(val => {
   function toggleDarkStyles() {
     for (const sheet of document.styleSheets) {
       for (const {media: m} of sheet.cssRules) {
-        if (m && /dark/.test(m) && (m[0] === 'screen') !== isDark) {
-          m.mediaText = isDark ? 'screen,dark' : 'dark';
+        if (m && m[1] === 'dark' && (m[0] === 'screen') !== isDark) {
+          m.mediaText = isDark ? 'screen,dark' : 'not all,dark';
         }
       }
     }