diff --git a/src/components/DialogPanel.svelte b/src/components/DialogPanel.svelte
index 0fd0514..1354fa5 100644
--- a/src/components/DialogPanel.svelte
+++ b/src/components/DialogPanel.svelte
@@ -110,4 +110,41 @@
       border: 1px solid hsl(210, 90%, 80%);
     }
   }
+
+  @media (prefers-color-scheme: dark) {
+    .dialog {
+      background-color: rgba(240, 240, 240, 0.15);
+    }
+
+    .dialog :global {
+      form {
+        border-color: hsl(210, 20%, 40%);
+        background-color: hsl(210, 12%, 25%);
+      }
+
+      .close {
+        color: hsl(210, 20%, 50%);
+        opacity: 0.6;
+      }
+
+      .close:hover {
+        color: hsl(210, 20%, 50%);
+        opacity: 1.0;
+      }
+
+      input[type="text"], input[type="password"] {
+        border-color: #666;
+      }
+
+      input[type="submit"] {
+        border-color: hsl(210, 15%, 40%);
+        background-color: hsl(210, 12%, 35%);
+      }
+
+      input[type="submit"]:active {
+        border-color: hsl(210, 15%, 35%);
+        background-color: hsl(210, 12%, 30%);
+      }
+    }
+  }
 </style>
diff --git a/src/components/LoginDialog.svelte b/src/components/LoginDialog.svelte
index 824629a..379931d 100644
--- a/src/components/LoginDialog.svelte
+++ b/src/components/LoginDialog.svelte
@@ -121,43 +121,10 @@
   }
 
   @media (prefers-color-scheme: dark) {
-    :global(#login) {
-      background-color: rgba(240, 240, 240, 0.15);
-    }
-
-    form {
-      border-color: hsl(210, 20%, 40%);
-      background-color: hsl(210, 12%, 25%);
-    }
-
-    .close {
-      color: hsl(210, 20%, 50%);
-      opacity: 0.6;
-    }
-
-    .close:hover {
-      color: hsl(210, 20%, 50%);
-      opacity: 1.0;
-    }
-
     p.info a {
       color: #888;
     }
 
-    input[type="text"], input[type="password"] {
-      border-color: #666;
-    }
-
-    input[type="submit"] {
-      border-color: hsl(210, 15%, 40%);
-      background-color: hsl(210, 12%, 35%);
-    }
-
-    input[type="submit"]:active {
-      border-color: hsl(210, 15%, 35%);
-      background-color: hsl(210, 12%, 30%);
-    }
-
     .cloudy {
       color: hsl(210, 60%, 75%);
     }