diff --git a/views/styles/normal.css b/views/styles/normal.css
index 3a8968f..b989e99 100755
--- a/views/styles/normal.css
+++ b/views/styles/normal.css
@@ -58,6 +58,8 @@
   --color: hsl(var(--base-color), 85%);
   /* The accent color of the page. */
   --accent-color: hsl(var(--base-color), 50%);
+  /* The background-adjacent accent color of the page. */
+  --accent-color-bg: hsl(var(--base-color), 50%);
   /* The foreground accent color of the page. */
   --accent-color-fg: hsl(var(--base-color), 95%);
 
@@ -75,8 +77,9 @@ html.base {
   --underlay-color: #fff !important;
   --background-color: transparent !important;
   --color: #000 !important;
-  --accent-color: #000 !important;
-  --accent-color-fg: #fff !important;
+  --accent-color: #c0c0c0 !important;
+  --accent-color-bg: #000 !important;
+  --accent-color-fg: #000 !important;
 
   --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
     Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",
@@ -91,6 +94,19 @@ html.base {
   transition: none;
 }
 
+@media (prefers-color-scheme: dark) {
+  html.base {
+    --underlay-color: #000 !important;
+    --background-color: transparent !important;
+    --color: #fff !important;
+    --accent-color: #404040 !important;
+    --accent-color-bg: #fff !important;
+    --accent-color-fg: #fff !important;
+
+    --border-color: var(--color);
+  }
+}
+
 html.base body {
   margin: 0;
 }
@@ -225,7 +241,7 @@ html {
 }
 
 *:focus {
-  outline: 2px solid var(--accent-color-fg);
+  outline: 2px solid var(--accent-color-bg);
 }
 
 fieldset {
@@ -257,7 +273,7 @@ iframe {
 /* Interactive normalize */
 
 a {
-  color: var(--accent-color);
+  color: var(--accent-color-bg);
   text-decoration: underline;
 }
 
@@ -377,7 +393,7 @@ label.checkbox input[type="checkbox"] + span.checkbox {
 }
 
 label.checkbox input[type="checkbox"]:focus + span.checkbox {
-  outline: 2px solid var(--accent-color-fg);
+  outline: 2px solid var(--accent-color-bg);
 }
 
 label.checkbox input[type="checkbox"]:checked + span.checkbox {
@@ -426,7 +442,7 @@ input[type="range"]::-webkit-slider-thumb {
 }
 
 input[type="range"]:focus::-webkit-slider-thumb {
-  outline: 2px solid var(--accent-color-fg);
+  outline: 2px solid var(--accent-color-bg);
 }
 
 /******** Firefox styles ********/
@@ -441,5 +457,5 @@ input[type="range"]::-moz-range-thumb {
 }
 
 input[type="range"]:focus::-moz-range-thumb {
-  outline: 2px solid var(--accent-color-fg);
+  outline: 2px solid var(--accent-color-bg);
 }