update `public_html` static files

public_html/css/style.css

@@ -15,7 +15,7 @@
   --main-gap-v: 0;
 
   /* font-derived column width */
-  --col-w: clamp(33.33vw, 74ch, 100vw);
+  --col-w: calc(clamp(33.33vw, 74ch, 100vw) - 2ch);
 
   /* colors */
   --fg-c: #000000;
@@ -42,11 +42,17 @@
   hyphens: auto;
 }
 
+*:focus {
+  outline: var(--link-c) solid 1px;
+}
+
 /* root */
 :root {
 	color: var(--fg-c);
 	background-color: var(--bg-c);
   font: var(--font-size)/var(--line-height) var(--font-family);
+  scrollbar-width: thin;
+  scrollbar-color: var(--link-c) rgba(0,0,0,0);
 }
 
 /* content sectioning */
@@ -60,6 +66,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 /* text content */
+/*
 :is(article :is(blockquote, dl, figure, menu, ol, p, pre, ul, div)) +
 :is(article :is(blockquote, dl, figure, menu, ol, p, pre, ul, div)) {
   margin-block-start: var(--v-un);
@@ -99,10 +106,17 @@ h1, h2, h3, h4, h5, h6 {
 
 :is(article :is(address, article, aside, footer, header, hgroup, nav, section, search)) +
 :is(article :is(h1, h2, h3, h4, h5, h6)) {
+}*/
+
+article :is(h1, h2, h3, h4, h5, h6) {
   margin-block-start: calc(2 * var(--v-un));
   margin-block-end: var(--v-un);
 }
 
+article :is(blockquote, dl, figure, menu, ol, p, pre, ul, div) {
+  margin-block-start: var(--v-un);
+}
+
 blockquote {
 	margin-inline: calc(4 * var(--h-un));
 }
@@ -170,7 +184,15 @@ body>main {
 	overflow-x: scroll;
 }
 
-body>main>article {
+body>main>* {
 	overflow-y: scroll;
   padding: var(--v-un) var(--h-un);
 }
+
+/* fenced divs */
+div.horizontal {
+  display: grid;
+  grid-auto-flow: column;
+  grid-auto-columns: 100%;
+  overflow-x: scroll;
+}