new style, dark style

html/style.css

@@ -1,8 +1,26 @@
+@media (prefers-color-scheme: dark) {
+  :root {
+    --bg-color: #111;
+    --fg-color: #fff;
+    --link-color: dodgerblue;
+  }
+}
+
+* {
+  color: var(--fg-color);
+  text-decoration: none;
+}
+
+a {
+  color: var(--link-color);
+}
+
 html {
      font-size: 20px;
      font-family: "Charter","Georgia",'Times New Roman',serif;
 }
  body {
+     background-color: var(--bg-color);
      line-height: 1.3;
 }
  article, .container {
@@ -29,7 +47,7 @@ html {
      margin: 0.9em 0px 0.9em;
 }
  pre, code {
-     background-color: #eeeeff;
+     background-color: var(--bg-color);
      line-height: normal;
      overflow: auto;
      font-size: 0.8em;
@@ -46,7 +64,7 @@ html {
      flex-direction: row;
      flex-wrap: nowrap;
      font-size: 0.8em;
-     background-color: #f0f0f0;
+     background-color: var(--bg-color);
      border: 1px solid #bbbbdd;
 }
  nav li:first-child {
@@ -66,10 +84,10 @@ html {
      background-color: #e0e0e0;
 }
  nav a:link {
-     color: #44d;
+     color: var(--link-color);
 }
  nav a:visited {
-     color: #44d;
+     color: var(--link-color);
 }
  nav a.here {
      background-color: #e0e0e0;