css, move to proper location.

assets/css/extended/custom.css

@@ -1,3 +1,17 @@
+/* Widen the site so that sentences don't wrap. */
+:root {
+    --main-width: 1200px; /* Adjust value as needed */
+}
+
+/* Center and align the social media icons */
+.center {
+  display: flex;
+  gap: 1rem;
+  align-items: center;
+  justify-content: center;
+}
+
+/* From static/style.css */
 body {
 	font-family: sans-serif ;
 	background: #ccc ;
@@ -36,10 +50,11 @@ h1,h2,h3,h4,h5,h6,b,strong {
 	clear: both ;
 }
 
-/* For NEXTPREV.HTML */
+/* For NEXTPREV.HTML * /
 #nextprev {
-	/* The container for both the previous and next articles. */
+	/* The container for both the previous and next articles. * /
 }
+/* */
 #prevart {
 	float: left ;
 	text-align: left ;

assets/css/extended/theme-vars-override.css.disabled

@@ -0,0 +1,25 @@
+:root {
+    /* Light Mode Variables */
+    --theme: #fff;          /* Main background */
+    --entry: #ddd;          /* Entry/Card background */
+    --primary: rgba(0, 0, 106, 0.88);
+    --secondary: rgba(0, 0, 80, 0.78);
+    --tertiary: rgba(0, 0, 106, 0.16);
+    --content: rgba(0, 0, 60, 0.88);
+    --hljs-bg: #222;        /* Code block background */
+    --code-bg: #eee;        /* Inline code background */
+    --border: #fff;
+}
+
+:root[data-theme="dark"] {
+    /* Dark Mode Variables */
+    --theme: #111;          /* Main background */
+    --entry: #222;          /* Entry/Card background */
+    --primary: rgba(235, 235, 255, 0.96);
+    --secondary: rgba(235, 235, 255, 0.66);
+    --tertiary: rgba(1, 1, 5, 0.32);
+    --content: rgba(235, 235, 255, 0.82);
+    --hljs-bg: #333;     /* Code block background */
+    --code-bg: #444;     /* Inline code background */
+    --border: #555;
+}