with misses in html

1 files changed, 78 insertions, 29 deletions

diff --git a/served/styles/common.css b/served/styles/common.css
index 64067cb..f798e3a 100755
--- a/served/styles/common.css
+++ b/served/styles/common.css
@@ -2,55 +2,104 @@
 	box-sizing: border-box;
 }
 
+@font-face {
+	font-family: Recursive;
+	font-style: oblique 0deg 15deg;
+	font-weight: 300 1000;
+	font-display: swap;
+	src: url(Recursive.woff2);
+}
+
+@font-face {
+	font-family: 'Atkinson Hyperlegible';
+	src: url(Atkinson-Hyperlegible-Regular-102a.woff2);
+	font-weight: normal;
+}
+
 :root {
+	/* "-dim" to mean: secondary; alternate; deemphasized  */
 	--text: #222;
-	--text-dim: #444;
-	--text-link: #037;
-	--text-link-visited: #730;
+	--text-dim: #456;
 	--background: #FFF;
-	--background-dim: #F8F0F0;
-	--color-a: rgb(11, 113, 126);
-	--color-a-dim: rgb(7, 80, 90);
-}
+	--background-dim: #F8F0FF;
 
-@media (prefers-color-scheme: dark) {
-	:root {
-		--text: #eee;
-		--text-dim: #bbb;
-		--text-link: #ddf;
-		--text-link-visited: #fed;
-		--background: #112;
-		--background-dim: #333;
-		--color-a: #3a8;
-		--color-a-dim: rgb(158, 228, 208);
-	}
+	--link: #a41;
+	--visited: #439;
+
+	--pwidth: 35rem;
+	--left-pad: 5rem;
+	/* ^ lmao */
 }
 
 html,
 body {
-	padding: 0;
 	margin: 0;
+	padding: 0;
+	width: 100%;
+	height: 100%;
 }
 
 body {
-	font-size: 1.1rem;
-	line-height: 1.4;
-	font-family: 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
-	padding: 2rem 5vw;
+	padding: 2rem 1rem 2rem var(--left-pad);
 
+	font-family: 'Atkinson Hyperlegible', sans-serif;
 	color: var(--text);
+	font-size: 1.15rem;
+
 	background-color: var(--background);
 }
 
-a {
-	color: var(--color-a);
+@media (max-width: 35rem) {
+	body {
+		padding-left: 2vw;
+		padding-right: 4vw;
+	}
 }
 
 h1,
-h2,
-h3 {
-	margin: 0;
-	font-family: serif;
+h2 {
+	margin: 1rem 0;
+	padding: 0;
+
+	font-family: Recursive, sans-serif;
+	font-variation-settings:
+		"MONO" 0,
+		"CASL" 0,
+		"wght" 500,
+		"slnt" 0,
+		"CRSV" 0;
+}
+
+h1 {
+	font-size: 2rem;
+}
+
+h2 {
+	font-size: 1.5rem;
+}
+
+p {
+	line-height: 1.3;
+	max-width: var(--pwidth);
+	margin: 1rem 0;
+}
+
+ul {
+	padding: 0;
+	list-style-position: inside;
+	list-style-type: decimal;
+}
+
+a {
+	color: var(--link);
+}
+
+a:visited {
+	color: var(--visited);
+}
+
+a.dead {
+	text-decoration: line-through;
 }
 
 #nav-access {