Responsive layout

hdyc-svelte/src/app.css

@@ -105,12 +105,17 @@ a:hover {
 .site-body {
   display: flex;
   min-height: calc(100vh - var(--header-h));
+  width: 100%;
+  max-width: 1800px;
+  margin: 0 auto;
+  gap: clamp(1.25rem, 2vw, 2.5rem);
+  padding: 0 clamp(1rem, 2vw, 2rem);
+  align-items: stretch;
 }
 
 .main-content {
   flex: 1;
-  padding: 2rem;
-  max-width: 900px;
+  padding: clamp(1.5rem, 2vw, 3rem);
   width: 100%;
 }
 
@@ -316,4 +321,8 @@ a:hover {
   .stats-row {
     gap: 1.5rem;
   }
+  .site-body {
+    gap: 1rem;
+    padding-inline: 1rem;
+  }
 }