big cleanup, minify

static/index.typ

@@ -1,19 +1,5 @@
 #let fonts = (
-  (src: "/font/Minecraft-Seven_v2.woff2", name: "Mojangles", style: "normal", weight: 400),
-  (src: "/font/LibertinusKeyboard-Regular.woff2", name: "Libertinus Keyboard", style: "normal", weight: 400),
-  (src: "/font/LibertinusMath-Regular.woff2", name: "Libertinus Math", style: "normal", weight: 400),
-  (src: "/font/LibertinusMono-Regular.woff2", name: "Libertinus Mono", style: "normal", weight: 400),
-  (src: "/font/LibertinusSans-Bold.woff2", name: "Libertinus Sans", style: "normal", weight: 700),
-  (src: "/font/LibertinusSans-Italic.woff2", name: "Libertinus Sans", style: "italic", weight: 400),
-  (src: "/font/LibertinusSans-Regular.woff2", name: "Libertinus Sans", style: "normal", weight: 400),
-  (src: "/font/LibertinusSerif-Bold.woff2", name: "Libertinus Serif", style: "normal", weight: 700),
-  (src: "/font/LibertinusSerif-BoldItalic.woff2", name: "Libertinus Serif", style: "italic", weight: 700),
-  (src: "/font/LibertinusSerif-Italic.woff2", name: "Libertinus Serif", style: "italic", weight: 400),
-  (src: "/font/LibertinusSerif-Regular.woff2", name: "Libertinus Serif", style: "normal", weight: 400),
-  (src: "/font/LibertinusSerif-Semibold.woff2", name: "Libertinus Serif", style: "normal", weight: 600),
-  (src: "/font/LibertinusSerif-SemiboldItalic.woff2", name: "Libertinus Serif", style: "italic", weight: 600),
-  (src: "/font/LibertinusSerifDisplay-Regular.woff2", name: "Libertinus Display", style: "normal", weight: 400),
-  (src: "/font/LibertinusSerifInitials-Regular.woff2", name: "Libertinus Initials", style: "normal", weight: 400),
+  (src: "/font/minecraft-seven-ascii.woff2", name: "Mojangles", style: "normal", weight: 400, unicodes: "U+0000-007F"),
 )
 
 #asset(
@@ -25,6 +11,7 @@
       "font-style:" + str(it.style) + ";"
       "font-weight:" + str(it.weight) + ";"
       "src: url(" + repr(it.src) + ");"
+      if ("unicodes" in it) { "unicode-range: " + str(it.unicodes) + ";" }
       "}"
     })
     .join(" "),

static/style.css

@@ -1,217 +1,95 @@
 :root {
-    font-family: "Libertinus Serif", serif;
-    line-height: 1.3em;
+    font: 1rem / 1.5 sans-serif;
 }
 
-@media (prefers-color-scheme: light) {
-    :root {
-        --fg: black;
-        --bg: white;
-    }
-
-    [aria-label="note"] {
-        --fg: mediumblue;
-    }
-
-    [aria-label="warn"] {
-        --fg: brown;
-    }
-
-    [aria-label="tip"] {
-        --fg: forestgreen;
-    }
+.tip {
+    color: forestgreen;
 }
 
-@media (prefers-color-scheme: dark) {
-    :root {
-        --fg: rgb(240 240 240);
-        --bg: rgb(30 30 30);
-    }
-
-    [aria-label="note"] {
-        --fg: cyan;
-    }
-
-    [aria-label="warn"] {
-        --fg: coral;
-    }
-
-    [aria-label="tip"] {
-        --fg: springgreen;
-    }
+.warn {
+    color: brown;
 }
 
-nav, h1, h2, h3, h4, h5, h6 {
-    font-family: "Mojangles", "monospace";
-}
-
-math {
-    font-family: "Libertinus Math", math;
-}
-
-code {
-    font-family: "Libertinus Mono", monospace;
-}
-
-nav a {
-    text-decoration: none;
-}
-
-nav a:hover {
-    text-decoration: underline;
+.note {
+    color: mediumblue;
 }
 
 a {
-    color: var(--fg);
+    color: inherit;
 }
 
-nav ul {
-    list-style-type: none;
-    padding-inline: 2ch;
+a:hover {
+    color: LinkText;
 }
 
-nav > ul {
-    padding-inline: 0;
+@media (prefers-color-scheme: dark) {
+    .tip {
+        color: springgreen;
+    }
+
+    .warn {
+        color: coral;
+    }
+
+    .note {
+        color: cyan;
+    }
 }
 
-nav li {
-    margin-block: 0.5em;
+h1, h2, h3, h4, h5, h6, nav {
+    font-family: Mojangles, monospace;
 }
 
-nav summary {
-    display: block;
+ol {
+    padding-inline-start: 2ch;
 }
 
-nav details summary:hover::after {
-    content: "⮞";
-    float: right;
+nav > ol {
+    padding-inline-start: 0;
 }
 
-nav details[open] summary::after {
-    content: "⮟";
-    float: right;
-}
-
-html {
-    display: flex;
-    justify-content: center;
-    min-height: 100%;
-    min-width: 100%;
+ol ol {
+    margin-block-end: 1em;
 }
 
 body {
-    display: grid;
-    grid-template-columns: 25ch 80ch 25ch;
-    grid-template-rows: auto auto 1fr auto;
-    grid-gap: 4ch;
-    width: auto;
-    min-height: 100%;
-    margin-inline: auto;
+    max-width: 800px;
+    margin: 40px auto;
+    padding: 0 10px;
 }
 
-body > a[href="#main"] {
-    position: absolute;
-    top: 0;
-    left: 0;
+.callout {
+    margin: 1em -1em;
+    padding: 0.5em 1em;
+    background: rgb(from currentColor r g b / 5%);
+    border: solid currentColor;
+    border-width: 1px 0;
 }
 
-body > a[href="#main"]:not(:focus) {
-    transform: translateY(-2em);
+hr {
+    margin: 0 -1em;
 }
 
-body > header {
-    grid-column: 1 / 3;
-    grid-row: 1;
+header p:has(+h1) {
+    margin-block-end: 0;
+    font-family: Mojangles, monospace;
 }
 
-nav[aria-label="Table of Contents"] {
-    grid-column: 1;
-    grid-row: 2;
+header p + h1 {
+    margin-block-start: 0;
 }
 
-nav[aria-label="Outline"] {
-    grid-column: 3;
-    grid-row: 2;
-}
-
-nav[aria-label="Outline"]:before {
-    content: "On this Page";
-    display: block;
-    margin-block: 1em;
-}
-
-nav[aria-label="Page Navigation"] > ul {
-    grid-column: 2;
-    grid-row: 3;
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    gap: 4pt;
-}
-
-nav[aria-label="Page Navigation"] > ul > li > a {
-    display: block;
-    text-align: center;
-    padding: 1em;
-
-    background: rgb(from var(--fg) r g b / 15%);
-    border: 1pt solid rgb(from var(--fg) r g b / 50%);
-    border-radius: 3pt;
-}
-
-li[aria-label="Next Page"] {
-    grid-column: 2;
-}
-
-li[aria-label="Prev Page"] {
-    grid-column: 1;
-}
-
-li[aria-label="Next Page"] > a:after {
-    content: "Next Page";
-    display: block;
-    font-size: small;
-}
-
-li[aria-label="Prev Page"] > a:after {
-    content: "Previous Page";
-    display: block;
-    font-size: small;
-}
-
-body > main {
-    grid-column: 2;
-    grid-row: 2;
-}
-
-body > footer {
-    grid-column: 1 / 4;
-    grid-row: 4;
-}
-
-aside {
-    border-block: 1pt solid rgba(from var(--fg) r g b / 50%);
-    background: rgba(from var(--fg) r g b / 15%);
-    color: var(--fg);
-    margin-block: 1em;
-    padding-block: 1ch;
-    padding-inline: 1em;
-    margin-inline: -1em;
-}
-
-aside[aria-label="note"]:before {
-    content: "Note:";
-    margin-inline-end: 1ch;
-    font-family: "Mojangles", monospace;
-}
-
-aside[aria-label="warn"]:before {
-    content: "Caution:";
-    margin-inline-end: 1ch;
-    font-family: "Mojangles", monospace;
-}
-
-aside[aria-label="tip"]:before {
-    content: "Tip:";
-    margin-inline-end: 1ch;
-    font-family: "Mojangles", monospace;
+.callout h1,
+.callout h2,
+.callout h3,
+.callout h4,
+.callout h5,
+.callout h6,
+.callout h1 + p,
+.callout h2 + p,
+.callout h3 + p,
+.callout h4 + p,
+.callout h5 + p,
+.callout h6 + p {
+    display: inline;
 }