clause agent mode "make it look like papermod"

sass/base/elements/_body.scss

@@ -1,3 +1,11 @@
 body {
-	background: $color__background-body; // Fallback for when there is no custom background color defined.
+	background: var(--color-bg-primary);
+	color: var(--color-text-primary);
+	font-family: $font__main;
+	font-size: $font__size-base;
+	line-height: $font__line-height-body;
+	font-weight: $font__weight-normal;
+	transition: var(--transition-default);
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
 }

sass/base/elements/_links.scss

@@ -1,22 +1,38 @@
 a {
-	color: $color__link;
+	color: var(--color-link);
+	text-decoration: none;
+	transition: var(--transition-fast);
+	border-bottom: 1px solid transparent;
 
 	&:visited {
-		color: $color__link-visited;
+		color: var(--color-link-visited);
 	}
 
 	&:hover,
 	&:focus,
 	&:active {
-		color: $color__link-hover;
+		color: var(--color-link-hover);
+		border-bottom-color: var(--color-link-hover);
 	}
 
 	&:focus {
-		outline: thin dotted;
+		outline: 2px solid var(--color-link);
+		outline-offset: 2px;
+		border-radius: 2px;
 	}
 
 	&:hover,
 	&:active {
 		outline: 0;
 	}
+
+	// Remove underline for navigation links
+	.main-navigation &,
+	.site-branding & {
+		border-bottom: none;
+		
+		&:hover {
+			border-bottom: none;
+		}
+	}
 }

sass/base/typography/_headings.scss

@@ -5,4 +5,40 @@ h4,
 h5,
 h6 {
 	clear: both;
+	font-family: $font__heading;
+	font-weight: $font__weight-semibold;
+	line-height: $font__line-height-heading;
+	color: var(--color-text-primary);
+	margin-top: 0;
+	margin-bottom: 1rem;
+}
+
+h1 {
+	font-size: $font__size-h1;
+	font-weight: $font__weight-bold;
+	margin-bottom: 1.5rem;
+}
+
+h2 {
+	font-size: $font__size-h2;
+	margin-top: 2rem;
+	margin-bottom: 1rem;
+}
+
+h3 {
+	font-size: $font__size-h3;
+	margin-top: 1.5rem;
+}
+
+h4 {
+	font-size: $font__size-h4;
+}
+
+h5 {
+	font-size: $font__size-h5;
+}
+
+h6 {
+	font-size: $font__size-h6;
+	font-weight: $font__weight-medium;
 }