diff --git a/ts/editor/editable.scss b/ts/editor/editable.scss
index c502f7793..0f01da597 100644
--- a/ts/editor/editable.scss
+++ b/ts/editor/editable.scss
@@ -26,7 +26,7 @@ p {
     }
 }
 
-:host-context(.nightMode) * {
+:host(.nightMode) * {
     @include scrollbar.night-mode;
 }
 
diff --git a/ts/editor/editing-area.ts b/ts/editor/editing-area.ts
index 08933c2d0..831824b73 100644
--- a/ts/editor/editing-area.ts
+++ b/ts/editor/editing-area.ts
@@ -27,6 +27,10 @@ export class EditingArea extends HTMLDivElement {
         this.attachShadow({ mode: "open" });
         this.className = "field";
 
+        if (document.documentElement.classList.contains("night-mode")) {
+            this.classList.add("night-mode");
+        }
+
         const rootStyle = document.createElement("link");
         rootStyle.setAttribute("rel", "stylesheet");
         rootStyle.setAttribute("href", "./_anki/css/editable.css");