add mono css framework, add some boiler plate, get started on responsive design fixes

extra/css/responsive.css

@@ -0,0 +1,59 @@
+/* responsive.css - Simple flexbox layout for the Mono theme */
+
+/* Base flexbox layout */
+body.mono-all {
+  display: flex;
+  flex-direction: row;
+  min-height: 100vh;
+  margin: 0;
+  padding: 0;
+  overflow-x: hidden;
+}
+
+/* Main content area takes up remaining space */
+main {
+  flex: 1;
+  padding: 2rem;
+  overflow-y: auto;
+}
+
+/* Sidebar with fixed width */
+aside {
+  width: 250px;
+  min-width: 250px;
+  padding: 2rem 1rem;
+  border-right: 2px solid var(--mono-main);
+  height: 100vh;
+  overflow-y: auto;
+  position: sticky;
+  top: 0;
+}
+
+/* Make footer stick to bottom of main content */
+footer {
+  margin-top: auto;
+  padding-top: 2rem;
+}
+
+/* Mobile layout adjustments */
+@media (max-width: 768px) {
+  body.mono-all {
+    flex-direction: column;
+  }
+
+  aside {
+    display: none; /* Hide sidebar on mobile */
+  }
+
+  main {
+    width: 100%;
+    padding: 1rem;
+  }
+}
+
+/* Simple print styles */
+@media print {
+  aside {
+    display: none;
+  }
+}