reorderd stuff, added homepage

src/styles/global.css

@@ -5,16 +5,8 @@
  */
 
 :root {
-	--accent: #2337ff;
-	--accent-dark: #000d8a;
-	--black: 15, 18, 25;
-	--gray: 96, 115, 159;
-	--gray-light: 229, 233, 240;
-	--gray-dark: 34, 41, 57;
-	--gray-gradient: rgba(var(--gray-light), 50%), #fff;
-	--box-shadow:
-		0 2px 6px rgba(var(--gray), 25%), 0 8px 24px rgba(var(--gray), 33%), 0 16px 32px
-		rgba(var(--gray), 33%);
+	min-width: 0px;
+	min-height: 0px;
 }
 @font-face {
 	font-family: "Atkinson";
@@ -39,14 +31,12 @@ body {
 	background-size: 100% 600px;
 	word-wrap: break-word;
 	overflow-wrap: break-word;
-	font-size: 20px;
-	line-height: 1.7;
+	font-size: 17px;
+	line-height: 1.5;
 }
-main {
-	width: 720px;
-	max-width: calc(100% - 2em);
-	margin: auto;
-	padding: 3em 1em;
+ul {
+	padding: 5px;
+	margin: 0;
 }
 h1,
 h2,
@@ -126,6 +116,26 @@ hr {
 	border: none;
 	border-top: 1px solid rgb(var(--gray-light));
 }
+figure {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin: 2rem 0;
+  gap: 0.5rem;
+}
+
+figcaption {
+  font-style: italic;
+  color: #cacbcd;
+  text-align: center;
+  max-width: 80%;
+}
+
+figcaption::before {
+  content: "Figure: ";
+  font-weight: bold;
+}
+
 @media (max-width: 720px) {
 	body {
 		font-size: 18px;