diff --git a/src/assets/svg/bars.svg b/src/assets/svg/bars.svg
index 998b141..42e6ae2 100644
--- a/src/assets/svg/bars.svg
+++ b/src/assets/svg/bars.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M96 160C96 142.3 110.3 128 128 128L512 128C529.7 128 544 142.3 544 160C544 177.7 529.7 192 512 192L128 192C110.3 192 96 177.7 96 160zM96 320C96 302.3 110.3 288 128 288L512 288C529.7 288 544 302.3 544 320C544 337.7 529.7 352 512 352L128 352C110.3 352 96 337.7 96 320zM544 480C544 497.7 529.7 512 512 512L128 512C110.3 512 96 497.7 96 480C96 462.3 110.3 448 128 448L512 448C529.7 448 544 462.3 544 480z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor"><!--!Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M96 160C96 142.3 110.3 128 128 128L512 128C529.7 128 544 142.3 544 160C544 177.7 529.7 192 512 192L128 192C110.3 192 96 177.7 96 160zM96 320C96 302.3 110.3 288 128 288L512 288C529.7 288 544 302.3 544 320C544 337.7 529.7 352 512 352L128 352C110.3 352 96 337.7 96 320zM544 480C544 497.7 529.7 512 512 512L128 512C110.3 512 96 497.7 96 480C96 462.3 110.3 448 128 448L512 448C529.7 448 544 462.3 544 480z"/></svg>
diff --git a/src/assets/svg/bluesky.svg b/src/assets/svg/bluesky.svg
index 0f25b8b..d6de3e8 100644
--- a/src/assets/svg/bluesky.svg
+++ b/src/assets/svg/bluesky.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -3.268 64 68.414" width="2232" height="2500"><path fill="#0085ff" d="M13.873 3.805C21.21 9.332 29.103 20.537 32 26.55v15.882c0-.338-.13.044-.41.867-1.512 4.456-7.418 21.847-20.923 7.944-7.111-7.32-3.819-14.64 9.125-16.85-7.405 1.264-15.73-.825-18.014-9.015C1.12 23.022 0 8.51 0 6.55 0-3.268 8.579-.182 13.873 3.805zm36.254 0C42.79 9.332 34.897 20.537 32 26.55v15.882c0-.338.13.044.41.867 1.512 4.456 7.418 21.847 20.923 7.944 7.111-7.32 3.819-14.64-9.125-16.85 7.405 1.264 15.73-.825 18.014-9.015C62.88 23.022 64 8.51 64 6.55c0-9.818-8.578-6.732-13.873-2.745z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -3.268 64 68.414" width="2232" height="2500" fill="currentColor"><path  d="M13.873 3.805C21.21 9.332 29.103 20.537 32 26.55v15.882c0-.338-.13.044-.41.867-1.512 4.456-7.418 21.847-20.923 7.944-7.111-7.32-3.819-14.64 9.125-16.85-7.405 1.264-15.73-.825-18.014-9.015C1.12 23.022 0 8.51 0 6.55 0-3.268 8.579-.182 13.873 3.805zm36.254 0C42.79 9.332 34.897 20.537 32 26.55v15.882c0-.338.13.044.41.867 1.512 4.456 7.418 21.847 20.923 7.944 7.111-7.32 3.819-14.64-9.125-16.85 7.405 1.264 15.73-.825 18.014-9.015C62.88 23.022 64 8.51 64 6.55c0-9.818-8.578-6.732-13.873-2.745z"/></svg>
diff --git a/src/assets/svg/xmark.svg b/src/assets/svg/xmark.svg
index b3c5fe5..66a568d 100644
--- a/src/assets/svg/xmark.svg
+++ b/src/assets/svg/xmark.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M183.1 137.4C170.6 124.9 150.3 124.9 137.8 137.4C125.3 149.9 125.3 170.2 137.8 182.7L275.2 320L137.9 457.4C125.4 469.9 125.4 490.2 137.9 502.7C150.4 515.2 170.7 515.2 183.2 502.7L320.5 365.3L457.9 502.6C470.4 515.1 490.7 515.1 503.2 502.6C515.7 490.1 515.7 469.8 503.2 457.3L365.8 320L503.1 182.6C515.6 170.1 515.6 149.8 503.1 137.3C490.6 124.8 470.3 124.8 457.8 137.3L320.5 274.7L183.1 137.4z"/></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640" fill="currentColor"><!--!Font Awesome Free 7.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M183.1 137.4C170.6 124.9 150.3 124.9 137.8 137.4C125.3 149.9 125.3 170.2 137.8 182.7L275.2 320L137.9 457.4C125.4 469.9 125.4 490.2 137.9 502.7C150.4 515.2 170.7 515.2 183.2 502.7L320.5 365.3L457.9 502.6C470.4 515.1 490.7 515.1 503.2 502.6C515.7 490.1 515.7 469.8 503.2 457.3L365.8 320L503.1 182.6C515.6 170.1 515.6 149.8 503.1 137.3C490.6 124.8 470.3 124.8 457.8 137.3L320.5 274.7L183.1 137.4z"/></svg>
diff --git a/src/components/Header/Drawer.astro b/src/components/Header/Drawer.astro
index 02e671d..b433cfb 100644
--- a/src/components/Header/Drawer.astro
+++ b/src/components/Header/Drawer.astro
@@ -31,32 +31,24 @@ import { navLinks } from '../../data/nav-links';
 		x-transition:leave-start="visible-drawer"
 		x-transition:leave-end="hidden-drawer"
 	>
-		<button @click="open = !open">
-			<CloseIcon class="bars-icon" width={24} height={24} /></button
-		>
-		<hr />
-		<ul>
-			{
-				navLinks.map((link) => (
-					<li>
-						<a href={`/${link.path}`}>
-							<span>{link.label}</span>
-						</a>
-					</li>
-				))
-			}
-		</ul>
+		<div>
+			<button @click="open = !open">
+				<CloseIcon class="bars-icon" width={24} height={24} /></button
+			>
+		</div>
+		<nav>
+			{navLinks.map((link) => <a href={`/${link.path}`}>{link.label}</a>)}
+		</nav>
 	</div>
 </div>
 
 <style>
 	:root {
-		--transition: all 0.1s ease-in-out;
+		--transition: all 0.3s ease-in-out;
 	}
 
 	button {
 		background: none;
-		color: inherit;
 		padding: 2px 2px -2px;
 		border: none;
 		line-height: 1;
@@ -67,10 +59,12 @@ import { navLinks } from '../../data/nav-links';
 		opacity: 0.3;
 	}
 
-	@media screen and (min-width: 600px) {
-		.drawer-container {
-			display: none;
-		}
+	button > svg {
+		color: var(--text);
+	}
+
+	.drawer-container {
+		display: none;
 	}
 
 	.overlay {
@@ -93,22 +87,33 @@ import { navLinks } from '../../data/nav-links';
 		top: 0;
 		background-color: var(--background);
 		position: absolute;
-		width: 200px;
+		width: 75vw;
 		height: 100vh;
-		padding: 12px;
 		z-index: 3;
 		transition: var(--transition);
 	}
 
-	ul {
-		list-style: none;
+	.drawer > div {
+		padding: 8px 6px 4px;
+		border-bottom: var(--border);
 	}
 
-	li {
-		margin-bottom: 12px;
+	nav {
+		text-align: center;
+		padding: 12px;
+		display: flex;
+		flex-direction: column;
+		gap: 12px;
+		font-size: 1.2rem;
 	}
 
 	.hidden-drawer {
-		transform: translateX(220px);
+		transform: translateX(75vw);
+	}
+
+	@media screen and (max-width: 768px) {
+		.drawer-container {
+			display: block;
+		}
 	}
 </style>
diff --git a/src/components/Header/Header.astro b/src/components/Header/Header.astro
index 26fbcf3..b355b38 100644
--- a/src/components/Header/Header.astro
+++ b/src/components/Header/Header.astro
@@ -31,7 +31,7 @@ import Drawer from './Drawer.astro';
 		align-items: center;
 		max-width: var(--max-page-width);
 		margin: auto;
-		padding: 0 10px;
+		padding: 0 16px;
 		height: 100%;
 	}
 
diff --git a/src/components/Header/Nav.astro b/src/components/Header/Nav.astro
index a067ccd..1bfe8fe 100644
--- a/src/components/Header/Nav.astro
+++ b/src/components/Header/Nav.astro
@@ -10,10 +10,12 @@ const pathComponents = pathname.split('/').slice(1);
 	{
 		navLinks.map((link) => (
 			<li>
-				<a href={`/${link.path}`}>
-					<span>{link.label}</span>
+				<a
+					href={`/${link.path}`}
+					class={pathComponents[0] === link.path ? 'selected' : null}
+				>
+					{link.label}
 				</a>
-				{pathComponents[0] === link.path ? <div class="underline" /> : null}
 			</li>
 		))
 	}
@@ -24,13 +26,21 @@ const pathComponents = pathname.split('/').slice(1);
 		display: flex;
 		flex-direction: row;
 		list-style: none;
-		gap: 20px;
+		gap: 10px;
 		font-size: 1.15rem;
 		font-weight: 600;
 	}
 
+	a {
+		color: var(--text);
+		padding: 5px 10px;
+		border-radius: var(--radius);
+		transition: background-color 0.2s ease-in-out;
+	}
+
 	a:hover {
-		text-decoration: none;
+		background-color: rgba(0, 0, 0, 0.04);
+		opacity: 1;
 	}
 
 	.selected {
@@ -42,9 +52,16 @@ const pathComponents = pathname.split('/').slice(1);
 		background-color: var(--orange);
 	}
 
-	@media screen and (max-width: 600px) {
+	@media screen and (max-width: 768px) {
 		nav {
 			display: none;
 		}
 	}
+
+	@media (prefers-color-scheme: dark) {
+		a:hover {
+			background-color: rgba(231, 237, 255, 0.1);
+			opacity: 1;
+		}
+	}
 </style>
diff --git a/src/global.css b/src/global.css
index 092a42b..492f29d 100644
--- a/src/global.css
+++ b/src/global.css
@@ -18,7 +18,6 @@
 	--text: #4c4f69;
 	--background: #fcfcfc;
 	--radius: 5px;
-	--shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
 	--border: 1px solid #ced3f1;
 	--max-page-width: 800px;
 }
@@ -70,16 +69,12 @@ main p {
 
 article img {
 	border-radius: var(--radius);
-	box-shadow: var(--shadow);
 	display: block;
 	margin: auto;
 	max-width: var(--max-page-width);
 	height: auto;
 }
 
-.no-shadow {
-	box-shadow: none;
-}
 .footnotes {
 	font-size: 1rem;
 }