diff --git a/static/styles.css b/static/styles.css
index c33995e..c8a0a92 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -1,5 +1,86 @@
 :root {
     --hr: #cfcfcf;
+    --b-font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
+    --b-font-mono: Consolas, Monaco, monospace;
+    --b-txt: #2e3440;
+    --b-bg-1: #fff;
+    --b-bg-2: #eceff4;
+    --b-line: #eceff4;
+    --b-link: #0073ff;
+    --b-btn-bg: #242933;
+    --b-btn-txt: #fff;
+    --b-focus: #d8dee9;
+}
+
+:root.dark-mode {
+    --b-txt: #ffffff;
+    --b-bg-1: #121212;
+    --b-bg-2: #1a1a1a;
+    --b-line: #2a2a2a;
+    --b-link: #bb86fc;
+    --b-btn-bg: #2a2a2a;
+    --b-btn-txt: #ffffff;
+    --b-focus: #bb86fc;
+}
+
+/* Apply the dark mode class to the root element by default */
+body {
+    class: dark-mode;
+    color: var(--b-txt);
+    background-color: var(--b-bg-1);
+}
+
+header {
+    padding-top: 5vh;
+    margin-bottom: 5vh;
+    text-align: center;
+}
+
+footer {
+    text-align: center;
+    opacity: 0.5;
+}
+
+img, video {
+    object-fit: contain;
+    max-width: 100%;
+    max-height: 400px;
+    border-radius: 8px;
+    display: block;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+figcaption {
+    font-size: 0.8rem;
+    text-align: center;
+    opacity: .6;
+}
+
+pre {
+    padding: 0 !important;
+}
+
+hr {
+    border: none;
+    height: 1px;
+    background-color: var(--hr);
+}
+
+nav {
+    font-size: 1.2rem;
+}
+
+.footnotes {
+    opacity: 0.6;
+}
+
+.hljs-comment {
+    color: #8d9196;
+}
+
+/* :root {
+    --hr: #cfcfcf;
 
     /* bamboo css values */
 	--b-font-main: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
@@ -65,3 +146,4 @@ nav {
     /* make codeblock comments easier to differentiate */
     color: #8d9196;
 }
+ */