update `public_html` static files

public_html/css/style.css

@@ -8,39 +8,23 @@
   --v-un: calc(var(--font-size) * var(--line-height));
   --h-un: 1ch;
 
-  /* gaps and paddings */
-  --body-padding-h: var(--h-un);
-  --body-padding-v: var(--v-un);
-  --main-gap-h: calc(2 * var(--h-un));
-  --main-gap-v: 0;
-
   /* font-derived column width */
   --col-w: clamp(33.33vw, 80ch, 100vw);
 
   /* colors */
-  --fg-c: #e2e2e2;
-  --bg-c: #000000;
-  /*
-	--link-c: hsl(240 100% 50%);
-	--visited-c: hsl(270 100% 50%);
-	--active-c: hsl(0 100% 50%);
-  */
+  --fg-c: #000000;
+  --bg-c: #e2e2e2;
 	--link-c: #856cff;
 	--visited-c: #ff1170;
 	--active-c: #fa3500;
 }
 
-/*
 @media (prefers-color-scheme: dark) {
   :root {
-    --fg-c: #ffffff;
+    --fg-c: #e2e2e2;
     --bg-c: #000000;
-    --link-c: hsl(240 100% 75%);
-    --visited-c: hsl(270 100% 75%);
-    --active-c: hsl(0 100% 75%);
   }
 }
-*/
 
 /* reset */
 * {
@@ -63,6 +47,10 @@
   scrollbar-color: var(--link-c) rgba(0,0,0,0);
 }
 
+body {
+  margin: 0;
+}
+
 /* content sectioning */
 address {
   font-style: unset;
@@ -70,9 +58,16 @@ address {
 
 h1, h2, h3, h4, h5, h6 {
 	font-size: unset;
+}
+
+h1, h2 {
   font-weight: bold;
 }
 
+h3, h4, h5, h6 {
+  font-style: italic;
+}
+
 /* text content */
 
 :is(h1, h2, h3, h4, h5, h6) {
@@ -152,6 +147,10 @@ a:visited:active {
   color: var(--active-c);
 }
 
+code {
+  color: var(--link-c);
+}
+
 /* layout */
 body>main {
   width: 100vw;
@@ -160,11 +159,13 @@ body>main {
   grid-auto-flow: column;
   grid-auto-columns: var(--col-w);
 	overflow-x: scroll;
+  scroll-snap-type: x proximity;
 }
 
 body>main>article {
 	overflow-y: scroll;
   padding: var(--v-un) var(--h-un);
+  scroll-snap-align: center;
 }
 
 article:focus {
@@ -186,18 +187,29 @@ aside.footnotes>hr {
 }
 
 /* fenced divs */
+
 div.horizontal {
   display: grid;
   grid-auto-flow: column;
   grid-auto-columns: 100%;
+  gap: calc(2 * var(--h-un));
   overflow-x: scroll;
+  scroll-snap-type: x proximity;
 }
 
 div.horizontal>* {
   margin-block: unset;
+  scroll-snap-align: center;
 }
 
+/* math */
+
 .display.math {
   display: block;
   text-align: center;
 }
+
+/* fenced pres */
+pre.center {
+  text-align: center;
+}