diff --git a/README.md b/README.md
index ada1d21..097bfe2 100644
--- a/README.md
+++ b/README.md
@@ -13,6 +13,6 @@ bun install
 bun dev
 
 # for production:
-bun build
-bun start
+bun run build
+bun preview
 ```
diff --git a/bun.lockb b/bun.lockb
index ffb85bf..3dfd6e3 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/package.json b/package.json
index fd2cb94..43ec7e1 100644
--- a/package.json
+++ b/package.json
@@ -45,8 +45,11 @@
     "@fontsource/geist-sans": "^5.0.2",
     "bits-ui": "^0.21.2",
     "clsx": "^2.1.0",
+    "marked": "^12.0.1",
+    "marked-katex-extension": "^5.0.1",
     "mode-watcher": "^0.3.0",
     "svelte-radix": "^1.1.0",
+    "svelte-sonner": "^0.3.21",
     "tailwind-merge": "^2.2.2",
     "tailwind-variants": "^0.2.1"
   }
diff --git a/src/globals.d.ts b/src/globals.d.ts
new file mode 100644
index 0000000..e69de29
diff --git a/src/lib/components/Footer.svelte b/src/lib/components/Footer.svelte
index 47f8556..eb3b3fe 100644
--- a/src/lib/components/Footer.svelte
+++ b/src/lib/components/Footer.svelte
@@ -1,18 +1,13 @@
 <script>
 	import { GithubLogo } from 'svelte-radix';
 	import Separator from './ui/separator/separator.svelte';
+	import Socials from './Socials.svelte';
 </script>
 
-<footer class="h-24 px-2 mb-4 text-sm md:text-md xl:text-lg">
+<footer class="h-24 px-2 mb-8 text-sm md:text-md xl:text-lg">
 	<Separator class="mb-4" />
 	<div class="flex justify-center flex-col gap-4">
-		<div class="flex justify-around gap-4">
-			<a
-				href="https://github.com/couscousdude"
-				target="_blank"
-				class="dark:brightness-75 dark:hover:brightness-100"><GithubLogo /></a
-			>
-		</div>
+		<Socials center />
 		<p class="text-zinc-400 dark:text-zinc-700 text-center">
 			&copy 2024 Youwen Wu | Built with <a
 				href="https://kit.svelte.dev"
diff --git a/src/lib/components/Gpg.svelte b/src/lib/components/Gpg.svelte
new file mode 100644
index 0000000..3c6b8fc
--- /dev/null
+++ b/src/lib/components/Gpg.svelte
@@ -0,0 +1,57 @@
+<script lang="ts">
+	import * as AlertDialog from '$lib/components/ui/alert-dialog';
+	import { onMount } from 'svelte';
+	import { toast } from 'svelte-sonner';
+	import ScrollArea from './ui/scroll-area/scroll-area.svelte';
+
+	let gpg: Promise<string>;
+
+	async function getGpg() {
+		const res = await fetch(`/youwen.gpg`);
+		const text = await res.text();
+
+		if (res.ok) {
+			return text;
+		} else {
+			throw new Error(text);
+		}
+	}
+	async function copyGpg() {
+		try {
+			const text = await gpg;
+			navigator.clipboard.writeText(text);
+			toast('Copied GPG key to clipboard');
+		} catch (e) {
+			console.error(e);
+			toast('Failed to copy GPG key to clipboard');
+		}
+	}
+	onMount(() => {
+		gpg = getGpg();
+	});
+</script>
+
+<AlertDialog.Root>
+	<AlertDialog.Trigger><slot /></AlertDialog.Trigger>
+	<AlertDialog.Content>
+		<AlertDialog.Header>
+			<AlertDialog.Title>GPG Key</AlertDialog.Title>
+			<AlertDialog.Description class="flex justify-center">
+				{#await gpg then text}
+					<ScrollArea class="max-h-60 mb-4 max-w-60" orientation="both">
+						<p>{text}</p>
+					</ScrollArea>
+				{:catch}
+					<p class="text-destructive">Couldn't fetch GPG key.</p>
+				{/await}
+			</AlertDialog.Description>
+		</AlertDialog.Header>
+		<AlertDialog.Footer class="gap-1">
+			<a href="/youwen.gpg" download>
+				<AlertDialog.Action>Download</AlertDialog.Action>
+			</a>
+			<AlertDialog.Action on:click={copyGpg}>Copy</AlertDialog.Action>
+			<AlertDialog.Cancel>Close</AlertDialog.Cancel>
+		</AlertDialog.Footer>
+	</AlertDialog.Content>
+</AlertDialog.Root>
diff --git a/src/lib/components/Navbar/Navbar.svelte b/src/lib/components/Navbar/Navbar.svelte
index 534ea00..ed40e86 100644
--- a/src/lib/components/Navbar/Navbar.svelte
+++ b/src/lib/components/Navbar/Navbar.svelte
@@ -25,7 +25,7 @@
 	});
 </script>
 
-<nav class="h-20 bg-background bg-opacity-50 backdrop-blur-md fixed w-full">
+<nav class="h-20 bg-background bg-opacity-50 backdrop-blur-md fixed w-full z-50">
 	<div class="container mx-auto flex justify-between items-center h-full gap-4">
 		{#if current === 'blog'}
 			<Coredump height="95%" href="/blog" />
diff --git a/src/lib/components/Socials.svelte b/src/lib/components/Socials.svelte
new file mode 100644
index 0000000..b805f72
--- /dev/null
+++ b/src/lib/components/Socials.svelte
@@ -0,0 +1,63 @@
+<script>
+	import {
+		InstagramLogo,
+		TwitterLogo,
+		GithubLogo,
+		LinkedinLogo,
+		DiscordLogo,
+		EnvelopeClosed
+	} from 'svelte-radix';
+	import * as Popover from '$lib/components/ui/popover';
+
+	export let center = false;
+
+	import Button from './ui/button/button.svelte';
+	import PopoverContent from './ui/popover/popover-content.svelte';
+</script>
+
+<div class="flex gap-2 mt-2" class:justify-center={center}>
+	<Button variant="ghost" size="icon" href="https://github.com/couscousdude">
+		<GithubLogo />
+	</Button>
+	<Button variant="ghost" size="icon" href="https://www.instagram.com/uncle_uwon/"
+		><InstagramLogo /></Button
+	>
+	<Button variant="ghost" size="icon" href="https://twitter.com/couscousdude"
+		><TwitterLogo /></Button
+	>
+	<Button variant="ghost" size="icon" href="https://www.linkedin.com/in/youwen-wu-306221288/>">
+		<LinkedinLogo />
+	</Button>
+	<Popover.Root>
+		<Popover.Trigger>
+			<Button variant="ghost" size="icon">
+				<DiscordLogo />
+			</Button>
+		</Popover.Trigger>
+		<Popover.Content>
+			Discord (for some reason) doesn't support direct links to profiles. You can find me on discord
+			with my username, <strong>@couscousdude</strong>.
+		</Popover.Content>
+	</Popover.Root>
+	<Popover.Root>
+		<Popover.Trigger>
+			<Button variant="ghost" size="icon">
+				<EnvelopeClosed />
+			</Button>
+		</Popover.Trigger>
+		<Popover.Content>
+			<p>
+				You can reach my Gmail at <a class="text-link" href="mailto:youwenw@gmail.com"
+					>youwenw@gmail.com</a
+				>
+			</p>
+			<br />
+			<p>
+				Or, if you prefer, you can securely email me on Protonmail at <a
+					class="text-link"
+					href="mailto:youwenw@protonmail.com">youwenw@protonmail.com</a
+				>
+			</p>
+		</Popover.Content>
+	</Popover.Root>
+</div>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte
new file mode 100644
index 0000000..57d643b
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-action.svelte
@@ -0,0 +1,21 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+	import { buttonVariants } from "$lib/components/ui/button/index.js";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = AlertDialogPrimitive.ActionProps;
+	type $$Events = AlertDialogPrimitive.ActionEvents;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<AlertDialogPrimitive.Action
+	class={cn(buttonVariants(), className)}
+	{...$$restProps}
+	on:click
+	on:keydown
+	let:builder
+>
+	<slot {builder} />
+</AlertDialogPrimitive.Action>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte
new file mode 100644
index 0000000..ef0a953
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-cancel.svelte
@@ -0,0 +1,21 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+	import { buttonVariants } from "$lib/components/ui/button/index.js";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = AlertDialogPrimitive.CancelProps;
+	type $$Events = AlertDialogPrimitive.CancelEvents;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<AlertDialogPrimitive.Cancel
+	class={cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className)}
+	{...$$restProps}
+	on:click
+	on:keydown
+	let:builder
+>
+	<slot {builder} />
+</AlertDialogPrimitive.Cancel>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte
new file mode 100644
index 0000000..833f262
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-content.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+	import * as AlertDialog from "./index.js";
+	import { cn, flyAndScale } from "$lib/utils.js";
+
+	type $$Props = AlertDialogPrimitive.ContentProps;
+
+	let className: $$Props["class"] = undefined;
+	export let transition: $$Props["transition"] = flyAndScale;
+	export let transitionConfig: $$Props["transitionConfig"] = undefined;
+	export { className as class };
+</script>
+
+<AlertDialog.Portal>
+	<AlertDialog.Overlay />
+	<AlertDialogPrimitive.Content
+		{transition}
+		{transitionConfig}
+		class={cn(
+			"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg  sm:rounded-lg md:w-full",
+			className
+		)}
+		{...$$restProps}
+	>
+		<slot />
+	</AlertDialogPrimitive.Content>
+</AlertDialog.Portal>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte
new file mode 100644
index 0000000..18acce9
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-description.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = AlertDialogPrimitive.DescriptionProps;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<AlertDialogPrimitive.Description
+	class={cn("text-sm text-muted-foreground", className)}
+	{...$$restProps}
+>
+	<slot />
+</AlertDialogPrimitive.Description>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte
new file mode 100644
index 0000000..a235d1f
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-footer.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+	import type { HTMLAttributes } from "svelte/elements";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = HTMLAttributes<HTMLDivElement>;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<div
+	class={cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className)}
+	{...$$restProps}
+>
+	<slot />
+</div>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte
new file mode 100644
index 0000000..2650ef9
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-header.svelte
@@ -0,0 +1,13 @@
+<script lang="ts">
+	import type { HTMLAttributes } from "svelte/elements";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = HTMLAttributes<HTMLDivElement>;
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+</script>
+
+<div class={cn("flex flex-col space-y-2 text-center sm:text-left", className)} {...$$restProps}>
+	<slot />
+</div>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte
new file mode 100644
index 0000000..cd5a786
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-overlay.svelte
@@ -0,0 +1,21 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+	import { fade } from "svelte/transition";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = AlertDialogPrimitive.OverlayProps;
+
+	let className: $$Props["class"] = undefined;
+	export let transition: $$Props["transition"] = fade;
+	export let transitionConfig: $$Props["transitionConfig"] = {
+		duration: 150,
+	};
+	export { className as class };
+</script>
+
+<AlertDialogPrimitive.Overlay
+	{transition}
+	{transitionConfig}
+	class={cn("fixed inset-0 z-50 bg-background/80 backdrop-blur-sm", className)}
+	{...$$restProps}
+/>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-portal.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-portal.svelte
new file mode 100644
index 0000000..e227219
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-portal.svelte
@@ -0,0 +1,9 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+
+	type $$Props = AlertDialogPrimitive.PortalProps;
+</script>
+
+<AlertDialogPrimitive.Portal {...$$restProps}>
+	<slot />
+</AlertDialogPrimitive.Portal>
diff --git a/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte b/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte
new file mode 100644
index 0000000..7f98004
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/alert-dialog-title.svelte
@@ -0,0 +1,14 @@
+<script lang="ts">
+	import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = AlertDialogPrimitive.TitleProps;
+
+	let className: $$Props["class"] = undefined;
+	export let level: $$Props["level"] = "h3";
+	export { className as class };
+</script>
+
+<AlertDialogPrimitive.Title class={cn("text-lg font-semibold", className)} {level} {...$$restProps}>
+	<slot />
+</AlertDialogPrimitive.Title>
diff --git a/src/lib/components/ui/alert-dialog/index.ts b/src/lib/components/ui/alert-dialog/index.ts
new file mode 100644
index 0000000..be56dd7
--- /dev/null
+++ b/src/lib/components/ui/alert-dialog/index.ts
@@ -0,0 +1,40 @@
+import { AlertDialog as AlertDialogPrimitive } from "bits-ui";
+
+import Title from "./alert-dialog-title.svelte";
+import Action from "./alert-dialog-action.svelte";
+import Cancel from "./alert-dialog-cancel.svelte";
+import Portal from "./alert-dialog-portal.svelte";
+import Footer from "./alert-dialog-footer.svelte";
+import Header from "./alert-dialog-header.svelte";
+import Overlay from "./alert-dialog-overlay.svelte";
+import Content from "./alert-dialog-content.svelte";
+import Description from "./alert-dialog-description.svelte";
+
+const Root = AlertDialogPrimitive.Root;
+const Trigger = AlertDialogPrimitive.Trigger;
+
+export {
+	Root,
+	Title,
+	Action,
+	Cancel,
+	Portal,
+	Footer,
+	Header,
+	Trigger,
+	Overlay,
+	Content,
+	Description,
+	//
+	Root as AlertDialog,
+	Title as AlertDialogTitle,
+	Action as AlertDialogAction,
+	Cancel as AlertDialogCancel,
+	Portal as AlertDialogPortal,
+	Footer as AlertDialogFooter,
+	Header as AlertDialogHeader,
+	Trigger as AlertDialogTrigger,
+	Overlay as AlertDialogOverlay,
+	Content as AlertDialogContent,
+	Description as AlertDialogDescription,
+};
diff --git a/src/lib/components/ui/badge/badge.svelte b/src/lib/components/ui/badge/badge.svelte
new file mode 100644
index 0000000..e8817f4
--- /dev/null
+++ b/src/lib/components/ui/badge/badge.svelte
@@ -0,0 +1,18 @@
+<script lang="ts">
+	import { type Variant, badgeVariants } from "./index.js";
+	import { cn } from "$lib/utils.js";
+
+	let className: string | undefined | null = undefined;
+	export let href: string | undefined = undefined;
+	export let variant: Variant = "default";
+	export { className as class };
+</script>
+
+<svelte:element
+	this={href ? "a" : "span"}
+	{href}
+	class={cn(badgeVariants({ variant, className }))}
+	{...$$restProps}
+>
+	<slot />
+</svelte:element>
diff --git a/src/lib/components/ui/badge/index.ts b/src/lib/components/ui/badge/index.ts
new file mode 100644
index 0000000..a460124
--- /dev/null
+++ b/src/lib/components/ui/badge/index.ts
@@ -0,0 +1,22 @@
+import { type VariantProps, tv } from "tailwind-variants";
+
+export { default as Badge } from "./badge.svelte";
+export const badgeVariants = tv({
+	base: "inline-flex select-none items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+	variants: {
+		variant: {
+			default:
+				"border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80",
+			secondary:
+				"border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+			destructive:
+				"border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80",
+			outline: "text-foreground",
+		},
+	},
+	defaultVariants: {
+		variant: "default",
+	},
+});
+
+export type Variant = VariantProps<typeof badgeVariants>["variant"];
diff --git a/src/lib/components/ui/popover/index.ts b/src/lib/components/ui/popover/index.ts
new file mode 100644
index 0000000..63aecf9
--- /dev/null
+++ b/src/lib/components/ui/popover/index.ts
@@ -0,0 +1,17 @@
+import { Popover as PopoverPrimitive } from "bits-ui";
+import Content from "./popover-content.svelte";
+const Root = PopoverPrimitive.Root;
+const Trigger = PopoverPrimitive.Trigger;
+const Close = PopoverPrimitive.Close;
+
+export {
+	Root,
+	Content,
+	Trigger,
+	Close,
+	//
+	Root as Popover,
+	Content as PopoverContent,
+	Trigger as PopoverTrigger,
+	Close as PopoverClose,
+};
diff --git a/src/lib/components/ui/popover/popover-content.svelte b/src/lib/components/ui/popover/popover-content.svelte
new file mode 100644
index 0000000..d1ad856
--- /dev/null
+++ b/src/lib/components/ui/popover/popover-content.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { Popover as PopoverPrimitive } from "bits-ui";
+	import { cn, flyAndScale } from "$lib/utils.js";
+
+	type $$Props = PopoverPrimitive.ContentProps;
+
+	let className: $$Props["class"] = undefined;
+	export let transition: $$Props["transition"] = flyAndScale;
+	export let transitionConfig: $$Props["transitionConfig"] = undefined;
+	export let align: $$Props["align"] = "center";
+	export let sideOffset: $$Props["sideOffset"] = 4;
+	export { className as class };
+</script>
+
+<PopoverPrimitive.Content
+	{transition}
+	{transitionConfig}
+	{align}
+	{sideOffset}
+	{...$$restProps}
+	class={cn(
+		"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none",
+		className
+	)}
+>
+	<slot />
+</PopoverPrimitive.Content>
diff --git a/src/lib/components/ui/scroll-area/index.ts b/src/lib/components/ui/scroll-area/index.ts
new file mode 100644
index 0000000..e86a25b
--- /dev/null
+++ b/src/lib/components/ui/scroll-area/index.ts
@@ -0,0 +1,10 @@
+import Scrollbar from "./scroll-area-scrollbar.svelte";
+import Root from "./scroll-area.svelte";
+
+export {
+	Root,
+	Scrollbar,
+	//,
+	Root as ScrollArea,
+	Scrollbar as ScrollAreaScrollbar,
+};
diff --git a/src/lib/components/ui/scroll-area/scroll-area-scrollbar.svelte b/src/lib/components/ui/scroll-area/scroll-area-scrollbar.svelte
new file mode 100644
index 0000000..a97f3bb
--- /dev/null
+++ b/src/lib/components/ui/scroll-area/scroll-area-scrollbar.svelte
@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { ScrollArea as ScrollAreaPrimitive } from "bits-ui";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = ScrollAreaPrimitive.ScrollbarProps & {
+		orientation?: "vertical" | "horizontal";
+	};
+
+	let className: $$Props["class"] = undefined;
+	export let orientation: $$Props["orientation"] = "vertical";
+	export { className as class };
+</script>
+
+<ScrollAreaPrimitive.Scrollbar
+	{orientation}
+	class={cn(
+		"flex touch-none select-none transition-colors",
+		orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-px",
+		orientation === "horizontal" && "h-2.5 w-full border-t border-t-transparent p-px",
+		className
+	)}
+>
+	<slot />
+	<ScrollAreaPrimitive.Thumb
+		class={cn("relative rounded-full bg-border", orientation === "vertical" && "flex-1")}
+	/>
+</ScrollAreaPrimitive.Scrollbar>
diff --git a/src/lib/components/ui/scroll-area/scroll-area.svelte b/src/lib/components/ui/scroll-area/scroll-area.svelte
new file mode 100644
index 0000000..e8e368c
--- /dev/null
+++ b/src/lib/components/ui/scroll-area/scroll-area.svelte
@@ -0,0 +1,32 @@
+<script lang="ts">
+	import { ScrollArea as ScrollAreaPrimitive } from "bits-ui";
+	import { Scrollbar } from "./index.js";
+	import { cn } from "$lib/utils.js";
+
+	type $$Props = ScrollAreaPrimitive.Props & {
+		orientation?: "vertical" | "horizontal" | "both";
+		scrollbarXClasses?: string;
+		scrollbarYClasses?: string;
+	};
+
+	let className: $$Props["class"] = undefined;
+	export { className as class };
+	export let orientation = "vertical";
+	export let scrollbarXClasses: string = "";
+	export let scrollbarYClasses: string = "";
+</script>
+
+<ScrollAreaPrimitive.Root {...$$restProps} class={cn("relative overflow-hidden", className)}>
+	<ScrollAreaPrimitive.Viewport class="h-full w-full rounded-[inherit]">
+		<ScrollAreaPrimitive.Content>
+			<slot />
+		</ScrollAreaPrimitive.Content>
+	</ScrollAreaPrimitive.Viewport>
+	{#if orientation === "vertical" || orientation === "both"}
+		<Scrollbar orientation="vertical" class={scrollbarYClasses} />
+	{/if}
+	{#if orientation === "horizontal" || orientation === "both"}
+		<Scrollbar orientation="horizontal" class={scrollbarXClasses} />
+	{/if}
+	<ScrollAreaPrimitive.Corner />
+</ScrollAreaPrimitive.Root>
diff --git a/src/lib/components/ui/sonner/index.ts b/src/lib/components/ui/sonner/index.ts
new file mode 100644
index 0000000..1ad9f4a
--- /dev/null
+++ b/src/lib/components/ui/sonner/index.ts
@@ -0,0 +1 @@
+export { default as Toaster } from "./sonner.svelte";
diff --git a/src/lib/components/ui/sonner/sonner.svelte b/src/lib/components/ui/sonner/sonner.svelte
new file mode 100644
index 0000000..7d5b2f1
--- /dev/null
+++ b/src/lib/components/ui/sonner/sonner.svelte
@@ -0,0 +1,20 @@
+<script lang="ts">
+	import { Toaster as Sonner, type ToasterProps as SonnerProps } from "svelte-sonner";
+	import { mode } from "mode-watcher";
+
+	type $$Props = SonnerProps;
+</script>
+
+<Sonner
+	theme={$mode}
+	class="toaster group"
+	toastOptions={{
+		classes: {
+			toast: "group toast group-[.toaster]:bg-background group-[.toaster]:text-foreground group-[.toaster]:border-border group-[.toaster]:shadow-lg",
+			description: "group-[.toast]:text-muted-foreground",
+			actionButton: "group-[.toast]:bg-primary group-[.toast]:text-primary-foreground",
+			cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground",
+		},
+	}}
+	{...$$restProps}
+/>
diff --git a/src/lib/styles/katex.min.css b/src/lib/styles/katex.min.css
new file mode 100644
index 0000000..b5337aa
--- /dev/null
+++ b/src/lib/styles/katex.min.css
@@ -0,0 +1 @@
+@font-face{font-family:KaTeX_AMS;font-style:normal;font-weight:400;src:url(fonts/KaTeX_AMS-Regular.woff2) format("woff2"),url(fonts/KaTeX_AMS-Regular.woff) format("woff"),url(fonts/KaTeX_AMS-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Caligraphic;font-style:normal;font-weight:700;src:url(fonts/KaTeX_Caligraphic-Bold.woff2) format("woff2"),url(fonts/KaTeX_Caligraphic-Bold.woff) format("woff"),url(fonts/KaTeX_Caligraphic-Bold.ttf) format("truetype")}@font-face{font-family:KaTeX_Caligraphic;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Caligraphic-Regular.woff2) format("woff2"),url(fonts/KaTeX_Caligraphic-Regular.woff) format("woff"),url(fonts/KaTeX_Caligraphic-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Fraktur;font-style:normal;font-weight:700;src:url(fonts/KaTeX_Fraktur-Bold.woff2) format("woff2"),url(fonts/KaTeX_Fraktur-Bold.woff) format("woff"),url(fonts/KaTeX_Fraktur-Bold.ttf) format("truetype")}@font-face{font-family:KaTeX_Fraktur;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Fraktur-Regular.woff2) format("woff2"),url(fonts/KaTeX_Fraktur-Regular.woff) format("woff"),url(fonts/KaTeX_Fraktur-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Main;font-style:normal;font-weight:700;src:url(fonts/KaTeX_Main-Bold.woff2) format("woff2"),url(fonts/KaTeX_Main-Bold.woff) format("woff"),url(fonts/KaTeX_Main-Bold.ttf) format("truetype")}@font-face{font-family:KaTeX_Main;font-style:italic;font-weight:700;src:url(fonts/KaTeX_Main-BoldItalic.woff2) format("woff2"),url(fonts/KaTeX_Main-BoldItalic.woff) format("woff"),url(fonts/KaTeX_Main-BoldItalic.ttf) format("truetype")}@font-face{font-family:KaTeX_Main;font-style:italic;font-weight:400;src:url(fonts/KaTeX_Main-Italic.woff2) format("woff2"),url(fonts/KaTeX_Main-Italic.woff) format("woff"),url(fonts/KaTeX_Main-Italic.ttf) format("truetype")}@font-face{font-family:KaTeX_Main;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Main-Regular.woff2) format("woff2"),url(fonts/KaTeX_Main-Regular.woff) format("woff"),url(fonts/KaTeX_Main-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Math;font-style:italic;font-weight:700;src:url(fonts/KaTeX_Math-BoldItalic.woff2) format("woff2"),url(fonts/KaTeX_Math-BoldItalic.woff) format("woff"),url(fonts/KaTeX_Math-BoldItalic.ttf) format("truetype")}@font-face{font-family:KaTeX_Math;font-style:italic;font-weight:400;src:url(fonts/KaTeX_Math-Italic.woff2) format("woff2"),url(fonts/KaTeX_Math-Italic.woff) format("woff"),url(fonts/KaTeX_Math-Italic.ttf) format("truetype")}@font-face{font-family:"KaTeX_SansSerif";font-style:normal;font-weight:700;src:url(fonts/KaTeX_SansSerif-Bold.woff2) format("woff2"),url(fonts/KaTeX_SansSerif-Bold.woff) format("woff"),url(fonts/KaTeX_SansSerif-Bold.ttf) format("truetype")}@font-face{font-family:"KaTeX_SansSerif";font-style:italic;font-weight:400;src:url(fonts/KaTeX_SansSerif-Italic.woff2) format("woff2"),url(fonts/KaTeX_SansSerif-Italic.woff) format("woff"),url(fonts/KaTeX_SansSerif-Italic.ttf) format("truetype")}@font-face{font-family:"KaTeX_SansSerif";font-style:normal;font-weight:400;src:url(fonts/KaTeX_SansSerif-Regular.woff2) format("woff2"),url(fonts/KaTeX_SansSerif-Regular.woff) format("woff"),url(fonts/KaTeX_SansSerif-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Script;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Script-Regular.woff2) format("woff2"),url(fonts/KaTeX_Script-Regular.woff) format("woff"),url(fonts/KaTeX_Script-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Size1;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Size1-Regular.woff2) format("woff2"),url(fonts/KaTeX_Size1-Regular.woff) format("woff"),url(fonts/KaTeX_Size1-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Size2;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Size2-Regular.woff2) format("woff2"),url(fonts/KaTeX_Size2-Regular.woff) format("woff"),url(fonts/KaTeX_Size2-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Size3;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Size3-Regular.woff2) format("woff2"),url(fonts/KaTeX_Size3-Regular.woff) format("woff"),url(fonts/KaTeX_Size3-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Size4;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Size4-Regular.woff2) format("woff2"),url(fonts/KaTeX_Size4-Regular.woff) format("woff"),url(fonts/KaTeX_Size4-Regular.ttf) format("truetype")}@font-face{font-family:KaTeX_Typewriter;font-style:normal;font-weight:400;src:url(fonts/KaTeX_Typewriter-Regular.woff2) format("woff2"),url(fonts/KaTeX_Typewriter-Regular.woff) format("woff"),url(fonts/KaTeX_Typewriter-Regular.ttf) format("truetype")}.katex{font:normal 1.21em KaTeX_Main,Times New Roman,serif;line-height:1.2;text-indent:0;text-rendering:auto}.katex *{-ms-high-contrast-adjust:none!important;border-color:currentColor}.katex .katex-version:after{content:"0.16.10"}.katex .katex-mathml{clip:rect(1px,1px,1px,1px);border:0;height:1px;overflow:hidden;padding:0;position:absolute;width:1px}.katex .katex-html>.newline{display:block}.katex .base{position:relative;white-space:nowrap;width:-webkit-min-content;width:-moz-min-content;width:min-content}.katex .base,.katex .strut{display:inline-block}.katex .textbf{font-weight:700}.katex .textit{font-style:italic}.katex .textrm{font-family:KaTeX_Main}.katex .textsf{font-family:KaTeX_SansSerif}.katex .texttt{font-family:KaTeX_Typewriter}.katex .mathnormal{font-family:KaTeX_Math;font-style:italic}.katex .mathit{font-family:KaTeX_Main;font-style:italic}.katex .mathrm{font-style:normal}.katex .mathbf{font-family:KaTeX_Main;font-weight:700}.katex .boldsymbol{font-family:KaTeX_Math;font-style:italic;font-weight:700}.katex .amsrm,.katex .mathbb,.katex .textbb{font-family:KaTeX_AMS}.katex .mathcal{font-family:KaTeX_Caligraphic}.katex .mathfrak,.katex .textfrak{font-family:KaTeX_Fraktur}.katex .mathboldfrak,.katex .textboldfrak{font-family:KaTeX_Fraktur;font-weight:700}.katex .mathtt{font-family:KaTeX_Typewriter}.katex .mathscr,.katex .textscr{font-family:KaTeX_Script}.katex .mathsf,.katex .textsf{font-family:KaTeX_SansSerif}.katex .mathboldsf,.katex .textboldsf{font-family:KaTeX_SansSerif;font-weight:700}.katex .mathitsf,.katex .textitsf{font-family:KaTeX_SansSerif;font-style:italic}.katex .mainrm{font-family:KaTeX_Main;font-style:normal}.katex .vlist-t{border-collapse:collapse;display:inline-table;table-layout:fixed}.katex .vlist-r{display:table-row}.katex .vlist{display:table-cell;position:relative;vertical-align:bottom}.katex .vlist>span{display:block;height:0;position:relative}.katex .vlist>span>span{display:inline-block}.katex .vlist>span>.pstrut{overflow:hidden;width:0}.katex .vlist-t2{margin-right:-2px}.katex .vlist-s{display:table-cell;font-size:1px;min-width:2px;vertical-align:bottom;width:2px}.katex .vbox{align-items:baseline;display:inline-flex;flex-direction:column}.katex .hbox{width:100%}.katex .hbox,.katex .thinbox{display:inline-flex;flex-direction:row}.katex .thinbox{max-width:0;width:0}.katex .msupsub{text-align:left}.katex .mfrac>span>span{text-align:center}.katex .mfrac .frac-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline,.katex .hline,.katex .mfrac .frac-line,.katex .overline .overline-line,.katex .rule,.katex .underline .underline-line{min-height:1px}.katex .mspace{display:inline-block}.katex .clap,.katex .llap,.katex .rlap{position:relative;width:0}.katex .clap>.inner,.katex .llap>.inner,.katex .rlap>.inner{position:absolute}.katex .clap>.fix,.katex .llap>.fix,.katex .rlap>.fix{display:inline-block}.katex .llap>.inner{right:0}.katex .clap>.inner,.katex .rlap>.inner{left:0}.katex .clap>.inner>span{margin-left:-50%;margin-right:50%}.katex .rule{border:0 solid;display:inline-block;position:relative}.katex .hline,.katex .overline .overline-line,.katex .underline .underline-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline{border-bottom-style:dashed;display:inline-block;width:100%}.katex .sqrt>.root{margin-left:.27777778em;margin-right:-.55555556em}.katex .fontsize-ensurer.reset-size1.size1,.katex .sizing.reset-size1.size1{font-size:1em}.katex .fontsize-ensurer.reset-size1.size2,.katex .sizing.reset-size1.size2{font-size:1.2em}.katex .fontsize-ensurer.reset-size1.size3,.katex .sizing.reset-size1.size3{font-size:1.4em}.katex .fontsize-ensurer.reset-size1.size4,.katex .sizing.reset-size1.size4{font-size:1.6em}.katex .fontsize-ensurer.reset-size1.size5,.katex .sizing.reset-size1.size5{font-size:1.8em}.katex .fontsize-ensurer.reset-size1.size6,.katex .sizing.reset-size1.size6{font-size:2em}.katex .fontsize-ensurer.reset-size1.size7,.katex .sizing.reset-size1.size7{font-size:2.4em}.katex .fontsize-ensurer.reset-size1.size8,.katex .sizing.reset-size1.size8{font-size:2.88em}.katex .fontsize-ensurer.reset-size1.size9,.katex .sizing.reset-size1.size9{font-size:3.456em}.katex .fontsize-ensurer.reset-size1.size10,.katex .sizing.reset-size1.size10{font-size:4.148em}.katex .fontsize-ensurer.reset-size1.size11,.katex .sizing.reset-size1.size11{font-size:4.976em}.katex .fontsize-ensurer.reset-size2.size1,.katex .sizing.reset-size2.size1{font-size:.83333333em}.katex .fontsize-ensurer.reset-size2.size2,.katex .sizing.reset-size2.size2{font-size:1em}.katex .fontsize-ensurer.reset-size2.size3,.katex .sizing.reset-size2.size3{font-size:1.16666667em}.katex .fontsize-ensurer.reset-size2.size4,.katex .sizing.reset-size2.size4{font-size:1.33333333em}.katex .fontsize-ensurer.reset-size2.size5,.katex .sizing.reset-size2.size5{font-size:1.5em}.katex .fontsize-ensurer.reset-size2.size6,.katex .sizing.reset-size2.size6{font-size:1.66666667em}.katex .fontsize-ensurer.reset-size2.size7,.katex .sizing.reset-size2.size7{font-size:2em}.katex .fontsize-ensurer.reset-size2.size8,.katex .sizing.reset-size2.size8{font-size:2.4em}.katex .fontsize-ensurer.reset-size2.size9,.katex .sizing.reset-size2.size9{font-size:2.88em}.katex .fontsize-ensurer.reset-size2.size10,.katex .sizing.reset-size2.size10{font-size:3.45666667em}.katex .fontsize-ensurer.reset-size2.size11,.katex .sizing.reset-size2.size11{font-size:4.14666667em}.katex .fontsize-ensurer.reset-size3.size1,.katex .sizing.reset-size3.size1{font-size:.71428571em}.katex .fontsize-ensurer.reset-size3.size2,.katex .sizing.reset-size3.size2{font-size:.85714286em}.katex .fontsize-ensurer.reset-size3.size3,.katex .sizing.reset-size3.size3{font-size:1em}.katex .fontsize-ensurer.reset-size3.size4,.katex .sizing.reset-size3.size4{font-size:1.14285714em}.katex .fontsize-ensurer.reset-size3.size5,.katex .sizing.reset-size3.size5{font-size:1.28571429em}.katex .fontsize-ensurer.reset-size3.size6,.katex .sizing.reset-size3.size6{font-size:1.42857143em}.katex .fontsize-ensurer.reset-size3.size7,.katex .sizing.reset-size3.size7{font-size:1.71428571em}.katex .fontsize-ensurer.reset-size3.size8,.katex .sizing.reset-size3.size8{font-size:2.05714286em}.katex .fontsize-ensurer.reset-size3.size9,.katex .sizing.reset-size3.size9{font-size:2.46857143em}.katex .fontsize-ensurer.reset-size3.size10,.katex .sizing.reset-size3.size10{font-size:2.96285714em}.katex .fontsize-ensurer.reset-size3.size11,.katex .sizing.reset-size3.size11{font-size:3.55428571em}.katex .fontsize-ensurer.reset-size4.size1,.katex .sizing.reset-size4.size1{font-size:.625em}.katex .fontsize-ensurer.reset-size4.size2,.katex .sizing.reset-size4.size2{font-size:.75em}.katex .fontsize-ensurer.reset-size4.size3,.katex .sizing.reset-size4.size3{font-size:.875em}.katex .fontsize-ensurer.reset-size4.size4,.katex .sizing.reset-size4.size4{font-size:1em}.katex .fontsize-ensurer.reset-size4.size5,.katex .sizing.reset-size4.size5{font-size:1.125em}.katex .fontsize-ensurer.reset-size4.size6,.katex .sizing.reset-size4.size6{font-size:1.25em}.katex .fontsize-ensurer.reset-size4.size7,.katex .sizing.reset-size4.size7{font-size:1.5em}.katex .fontsize-ensurer.reset-size4.size8,.katex .sizing.reset-size4.size8{font-size:1.8em}.katex .fontsize-ensurer.reset-size4.size9,.katex .sizing.reset-size4.size9{font-size:2.16em}.katex .fontsize-ensurer.reset-size4.size10,.katex .sizing.reset-size4.size10{font-size:2.5925em}.katex .fontsize-ensurer.reset-size4.size11,.katex .sizing.reset-size4.size11{font-size:3.11em}.katex .fontsize-ensurer.reset-size5.size1,.katex .sizing.reset-size5.size1{font-size:.55555556em}.katex .fontsize-ensurer.reset-size5.size2,.katex .sizing.reset-size5.size2{font-size:.66666667em}.katex .fontsize-ensurer.reset-size5.size3,.katex .sizing.reset-size5.size3{font-size:.77777778em}.katex .fontsize-ensurer.reset-size5.size4,.katex .sizing.reset-size5.size4{font-size:.88888889em}.katex .fontsize-ensurer.reset-size5.size5,.katex .sizing.reset-size5.size5{font-size:1em}.katex .fontsize-ensurer.reset-size5.size6,.katex .sizing.reset-size5.size6{font-size:1.11111111em}.katex .fontsize-ensurer.reset-size5.size7,.katex .sizing.reset-size5.size7{font-size:1.33333333em}.katex .fontsize-ensurer.reset-size5.size8,.katex .sizing.reset-size5.size8{font-size:1.6em}.katex .fontsize-ensurer.reset-size5.size9,.katex .sizing.reset-size5.size9{font-size:1.92em}.katex .fontsize-ensurer.reset-size5.size10,.katex .sizing.reset-size5.size10{font-size:2.30444444em}.katex .fontsize-ensurer.reset-size5.size11,.katex .sizing.reset-size5.size11{font-size:2.76444444em}.katex .fontsize-ensurer.reset-size6.size1,.katex .sizing.reset-size6.size1{font-size:.5em}.katex .fontsize-ensurer.reset-size6.size2,.katex .sizing.reset-size6.size2{font-size:.6em}.katex .fontsize-ensurer.reset-size6.size3,.katex .sizing.reset-size6.size3{font-size:.7em}.katex .fontsize-ensurer.reset-size6.size4,.katex .sizing.reset-size6.size4{font-size:.8em}.katex .fontsize-ensurer.reset-size6.size5,.katex .sizing.reset-size6.size5{font-size:.9em}.katex .fontsize-ensurer.reset-size6.size6,.katex .sizing.reset-size6.size6{font-size:1em}.katex .fontsize-ensurer.reset-size6.size7,.katex .sizing.reset-size6.size7{font-size:1.2em}.katex .fontsize-ensurer.reset-size6.size8,.katex .sizing.reset-size6.size8{font-size:1.44em}.katex .fontsize-ensurer.reset-size6.size9,.katex .sizing.reset-size6.size9{font-size:1.728em}.katex .fontsize-ensurer.reset-size6.size10,.katex .sizing.reset-size6.size10{font-size:2.074em}.katex .fontsize-ensurer.reset-size6.size11,.katex .sizing.reset-size6.size11{font-size:2.488em}.katex .fontsize-ensurer.reset-size7.size1,.katex .sizing.reset-size7.size1{font-size:.41666667em}.katex .fontsize-ensurer.reset-size7.size2,.katex .sizing.reset-size7.size2{font-size:.5em}.katex .fontsize-ensurer.reset-size7.size3,.katex .sizing.reset-size7.size3{font-size:.58333333em}.katex .fontsize-ensurer.reset-size7.size4,.katex .sizing.reset-size7.size4{font-size:.66666667em}.katex .fontsize-ensurer.reset-size7.size5,.katex .sizing.reset-size7.size5{font-size:.75em}.katex .fontsize-ensurer.reset-size7.size6,.katex .sizing.reset-size7.size6{font-size:.83333333em}.katex .fontsize-ensurer.reset-size7.size7,.katex .sizing.reset-size7.size7{font-size:1em}.katex .fontsize-ensurer.reset-size7.size8,.katex .sizing.reset-size7.size8{font-size:1.2em}.katex .fontsize-ensurer.reset-size7.size9,.katex .sizing.reset-size7.size9{font-size:1.44em}.katex .fontsize-ensurer.reset-size7.size10,.katex .sizing.reset-size7.size10{font-size:1.72833333em}.katex .fontsize-ensurer.reset-size7.size11,.katex .sizing.reset-size7.size11{font-size:2.07333333em}.katex .fontsize-ensurer.reset-size8.size1,.katex .sizing.reset-size8.size1{font-size:.34722222em}.katex .fontsize-ensurer.reset-size8.size2,.katex .sizing.reset-size8.size2{font-size:.41666667em}.katex .fontsize-ensurer.reset-size8.size3,.katex .sizing.reset-size8.size3{font-size:.48611111em}.katex .fontsize-ensurer.reset-size8.size4,.katex .sizing.reset-size8.size4{font-size:.55555556em}.katex .fontsize-ensurer.reset-size8.size5,.katex .sizing.reset-size8.size5{font-size:.625em}.katex .fontsize-ensurer.reset-size8.size6,.katex .sizing.reset-size8.size6{font-size:.69444444em}.katex .fontsize-ensurer.reset-size8.size7,.katex .sizing.reset-size8.size7{font-size:.83333333em}.katex .fontsize-ensurer.reset-size8.size8,.katex .sizing.reset-size8.size8{font-size:1em}.katex .fontsize-ensurer.reset-size8.size9,.katex .sizing.reset-size8.size9{font-size:1.2em}.katex .fontsize-ensurer.reset-size8.size10,.katex .sizing.reset-size8.size10{font-size:1.44027778em}.katex .fontsize-ensurer.reset-size8.size11,.katex .sizing.reset-size8.size11{font-size:1.72777778em}.katex .fontsize-ensurer.reset-size9.size1,.katex .sizing.reset-size9.size1{font-size:.28935185em}.katex .fontsize-ensurer.reset-size9.size2,.katex .sizing.reset-size9.size2{font-size:.34722222em}.katex .fontsize-ensurer.reset-size9.size3,.katex .sizing.reset-size9.size3{font-size:.40509259em}.katex .fontsize-ensurer.reset-size9.size4,.katex .sizing.reset-size9.size4{font-size:.46296296em}.katex .fontsize-ensurer.reset-size9.size5,.katex .sizing.reset-size9.size5{font-size:.52083333em}.katex .fontsize-ensurer.reset-size9.size6,.katex .sizing.reset-size9.size6{font-size:.5787037em}.katex .fontsize-ensurer.reset-size9.size7,.katex .sizing.reset-size9.size7{font-size:.69444444em}.katex .fontsize-ensurer.reset-size9.size8,.katex .sizing.reset-size9.size8{font-size:.83333333em}.katex .fontsize-ensurer.reset-size9.size9,.katex .sizing.reset-size9.size9{font-size:1em}.katex .fontsize-ensurer.reset-size9.size10,.katex .sizing.reset-size9.size10{font-size:1.20023148em}.katex .fontsize-ensurer.reset-size9.size11,.katex .sizing.reset-size9.size11{font-size:1.43981481em}.katex .fontsize-ensurer.reset-size10.size1,.katex .sizing.reset-size10.size1{font-size:.24108004em}.katex .fontsize-ensurer.reset-size10.size2,.katex .sizing.reset-size10.size2{font-size:.28929605em}.katex .fontsize-ensurer.reset-size10.size3,.katex .sizing.reset-size10.size3{font-size:.33751205em}.katex .fontsize-ensurer.reset-size10.size4,.katex .sizing.reset-size10.size4{font-size:.38572806em}.katex .fontsize-ensurer.reset-size10.size5,.katex .sizing.reset-size10.size5{font-size:.43394407em}.katex .fontsize-ensurer.reset-size10.size6,.katex .sizing.reset-size10.size6{font-size:.48216008em}.katex .fontsize-ensurer.reset-size10.size7,.katex .sizing.reset-size10.size7{font-size:.57859209em}.katex .fontsize-ensurer.reset-size10.size8,.katex .sizing.reset-size10.size8{font-size:.69431051em}.katex .fontsize-ensurer.reset-size10.size9,.katex .sizing.reset-size10.size9{font-size:.83317261em}.katex .fontsize-ensurer.reset-size10.size10,.katex .sizing.reset-size10.size10{font-size:1em}.katex .fontsize-ensurer.reset-size10.size11,.katex .sizing.reset-size10.size11{font-size:1.19961427em}.katex .fontsize-ensurer.reset-size11.size1,.katex .sizing.reset-size11.size1{font-size:.20096463em}.katex .fontsize-ensurer.reset-size11.size2,.katex .sizing.reset-size11.size2{font-size:.24115756em}.katex .fontsize-ensurer.reset-size11.size3,.katex .sizing.reset-size11.size3{font-size:.28135048em}.katex .fontsize-ensurer.reset-size11.size4,.katex .sizing.reset-size11.size4{font-size:.32154341em}.katex .fontsize-ensurer.reset-size11.size5,.katex .sizing.reset-size11.size5{font-size:.36173633em}.katex .fontsize-ensurer.reset-size11.size6,.katex .sizing.reset-size11.size6{font-size:.40192926em}.katex .fontsize-ensurer.reset-size11.size7,.katex .sizing.reset-size11.size7{font-size:.48231511em}.katex .fontsize-ensurer.reset-size11.size8,.katex .sizing.reset-size11.size8{font-size:.57877814em}.katex .fontsize-ensurer.reset-size11.size9,.katex .sizing.reset-size11.size9{font-size:.69453376em}.katex .fontsize-ensurer.reset-size11.size10,.katex .sizing.reset-size11.size10{font-size:.83360129em}.katex .fontsize-ensurer.reset-size11.size11,.katex .sizing.reset-size11.size11{font-size:1em}.katex .delimsizing.size1{font-family:KaTeX_Size1}.katex .delimsizing.size2{font-family:KaTeX_Size2}.katex .delimsizing.size3{font-family:KaTeX_Size3}.katex .delimsizing.size4{font-family:KaTeX_Size4}.katex .delimsizing.mult .delim-size1>span{font-family:KaTeX_Size1}.katex .delimsizing.mult .delim-size4>span{font-family:KaTeX_Size4}.katex .nulldelimiter{display:inline-block;width:.12em}.katex .delimcenter,.katex .op-symbol{position:relative}.katex .op-symbol.small-op{font-family:KaTeX_Size1}.katex .op-symbol.large-op{font-family:KaTeX_Size2}.katex .accent>.vlist-t,.katex .op-limits>.vlist-t{text-align:center}.katex .accent .accent-body{position:relative}.katex .accent .accent-body:not(.accent-full){width:0}.katex .overlay{display:block}.katex .mtable .vertical-separator{display:inline-block;min-width:1px}.katex .mtable .arraycolsep{display:inline-block}.katex .mtable .col-align-c>.vlist-t{text-align:center}.katex .mtable .col-align-l>.vlist-t{text-align:left}.katex .mtable .col-align-r>.vlist-t{text-align:right}.katex .svg-align{text-align:left}.katex svg{fill:currentColor;stroke:currentColor;fill-rule:nonzero;fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;display:block;height:inherit;position:absolute;width:100%}.katex svg path{stroke:none}.katex img{border-style:none;max-height:none;max-width:none;min-height:0;min-width:0}.katex .stretchy{display:block;overflow:hidden;position:relative;width:100%}.katex .stretchy:after,.katex .stretchy:before{content:""}.katex .hide-tail{overflow:hidden;position:relative;width:100%}.katex .halfarrow-left{left:0;overflow:hidden;position:absolute;width:50.2%}.katex .halfarrow-right{overflow:hidden;position:absolute;right:0;width:50.2%}.katex .brace-left{left:0;overflow:hidden;position:absolute;width:25.1%}.katex .brace-center{left:25%;overflow:hidden;position:absolute;width:50%}.katex .brace-right{overflow:hidden;position:absolute;right:0;width:25.1%}.katex .x-arrow-pad{padding:0 .5em}.katex .cd-arrow-pad{padding:0 .55556em 0 .27778em}.katex .mover,.katex .munder,.katex .x-arrow{text-align:center}.katex .boxpad{padding:0 .3em}.katex .fbox,.katex .fcolorbox{border:.04em solid;box-sizing:border-box}.katex .cancel-pad{padding:0 .2em}.katex .cancel-lap{margin-left:-.2em;margin-right:-.2em}.katex .sout{border-bottom-style:solid;border-bottom-width:.08em}.katex .angl{border-right:.049em solid;border-top:.049em solid;box-sizing:border-box;margin-right:.03889em}.katex .anglpad{padding:0 .03889em}.katex .eqn-num:before{content:"(" counter(katexEqnNo) ")";counter-increment:katexEqnNo}.katex .mml-eqn-num:before{content:"(" counter(mmlEqnNo) ")";counter-increment:mmlEqnNo}.katex .mtr-glue{width:50%}.katex .cd-vert-arrow{display:inline-block;position:relative}.katex .cd-label-left{display:inline-block;position:absolute;right:calc(50% + .3em);text-align:left}.katex .cd-label-right{display:inline-block;left:calc(50% + .3em);position:absolute;text-align:right}.katex-display{display:block;margin:1em 0;text-align:center}.katex-display>.katex{display:block;text-align:center;white-space:nowrap}.katex-display>.katex>.katex-html{display:block;position:relative}.katex-display>.katex>.katex-html>.tag{position:absolute;right:0}.katex-display.leqno>.katex>.katex-html>.tag{left:0;right:auto}.katex-display.fleqn>.katex{padding-left:2em;text-align:left}body{counter-reset:katexEqnNo mmlEqnNo}
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 8871245..eba19d8 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -1,7 +1,7 @@
-import { type ClassValue, clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
-import { cubicOut } from "svelte/easing";
-import type { TransitionConfig } from "svelte/transition";
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+import { cubicOut } from 'svelte/easing';
+import type { TransitionConfig } from 'svelte/transition';
 
 export function cn(...inputs: ClassValue[]) {
 	return twMerge(clsx(inputs));
@@ -19,13 +19,9 @@ export const flyAndScale = (
 	params: FlyAndScaleParams = { y: -8, x: 0, start: 0.95, duration: 150 }
 ): TransitionConfig => {
 	const style = getComputedStyle(node);
-	const transform = style.transform === "none" ? "" : style.transform;
+	const transform = style.transform === 'none' ? '' : style.transform;
 
-	const scaleConversion = (
-		valueA: number,
-		scaleA: [number, number],
-		scaleB: [number, number]
-	) => {
+	const scaleConversion = (valueA: number, scaleA: [number, number], scaleB: [number, number]) => {
 		const [minA, maxA] = scaleA;
 		const [minB, maxB] = scaleB;
 
@@ -35,13 +31,11 @@ export const flyAndScale = (
 		return valueB;
 	};
 
-	const styleToString = (
-		style: Record<string, number | string | undefined>
-	): string => {
+	const styleToString = (style: Record<string, number | string | undefined>): string => {
 		return Object.keys(style).reduce((str, key) => {
 			if (style[key] === undefined) return str;
 			return str + `${key}:${style[key]};`;
-		}, "");
+		}, '');
 	};
 
 	return {
@@ -59,4 +53,4 @@ export const flyAndScale = (
 		},
 		easing: cubicOut
 	};
-};
\ No newline at end of file
+};
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index a4f7039..f75edcd 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -5,11 +5,14 @@
 	import '@fontsource/geist-sans/latin.css';
 	import '@fontsource/geist-mono/latin.css';
 	import Footer from '$lib/components/Footer.svelte';
+	import { Toaster } from '$lib/components/ui/sonner';
 </script>
 
+<Toaster />
 <ModeWatcher />
+
 <Navbar />
-<div class="px-4 pt-24">
+<div class="pt-20">
 	<slot />
 </div>
 
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index b5ad08c..c3fb530 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -1,5 +1,6 @@
-<script>
-	import Footer from '$lib/components/Footer.svelte';
+<script lang="ts">
+	import Gpg from '$lib/components/Gpg.svelte';
+	import Socials from '$lib/components/Socials.svelte';
 	import Button from '$lib/components/ui/button/button.svelte';
 	import * as Card from '$lib/components/ui/card';
 	import { ArrowRight, GithubLogo } from 'svelte-radix';
@@ -12,9 +13,9 @@
 	<meta name="author" content="Youwen Wu" />
 </svelte:head>
 
-<main class="background py-2">
-	<div class="container max-w-3xl mx-auto p-10">
-		<Typewriter mode="scramble" scrambleDuration={500}>
+<main class="background px-4">
+	<div class="container max-w-4xl 2xl:max-w-5xl mx-auto p-10">
+		<Typewriter mode="scramble" scrambleDuration={750}>
 			<h1 class="text-4xl md:text-6xl font-bold text-center tracking-tight mt-20">
 				👋 Hi, I'm Youwen.
 			</h1>
@@ -29,11 +30,11 @@
 			</Typewriter>
 			<br />
 			<Typewriter mode="scramble" scrambleDuration={1000}>
-				I'm interested in systems programming, web design, data science, and statistics.
+				Interested in systems programming, web design, data science, and statistics.
 			</Typewriter>
 		</div>
-		<span class="flex gap-2 justify-center my-8">
-			<Button href="/about" size="lg" class="text-xl">About Me</Button>
+		<span class="flex gap-2 justify-center my-8 flex-wrap">
+			<Button href="/about" size="lg" class="text-xl">More About Me</Button>
 			<Button
 				href="https://github.com/couscousdude"
 				target="_blank"
@@ -42,8 +43,8 @@
 				class="text-xl"><GithubLogo class="mr-2" />My GitHub</Button
 			>
 		</span>
-		<div class="grid sm:grid-cols-2 gap-4 grid-cols-1">
-			<Card.Root>
+		<div class="grid grid-cols-2 gap-4">
+			<Card.Root class="col-span-2 sm:col-span-1">
 				<Card.Header>
 					<Card.Title>Blog</Card.Title>
 				</Card.Header>
@@ -57,7 +58,7 @@
 					<Button variant="outline" href="/blog">Go<ArrowRight class="ml-2" /></Button>
 				</Card.Footer>
 			</Card.Root>
-			<Card.Root>
+			<Card.Root class="col-span-2 sm:col-span-1">
 				<Card.Header>
 					<Card.Title>Projects</Card.Title>
 				</Card.Header>
@@ -90,6 +91,18 @@
 					</span>
 				</Card.Footer>
 			</Card.Root>
+			<Card.Root class="col-span-2">
+				<Card.Header>
+					<Card.Title>Contact Me</Card.Title>
+				</Card.Header>
+				<Card.Content>
+					<h3>Find me on:</h3>
+					<Socials />
+					<Gpg>
+						<Button variant="outline" class="mt-4"><span class="mr-2">🔑</span> My GPG Key</Button>
+					</Gpg>
+				</Card.Content>
+			</Card.Root>
 		</div>
 	</div>
 </main>
diff --git a/src/routes/blog/+layout.svelte b/src/routes/blog/+layout.svelte
new file mode 100644
index 0000000..5a23c62
--- /dev/null
+++ b/src/routes/blog/+layout.svelte
@@ -0,0 +1,5 @@
+<script lang="ts">
+	import '$lib/styles/katex.min.css';
+</script>
+
+<slot />
diff --git a/src/routes/blog/+page.svelte b/src/routes/blog/+page.svelte
index b970c34..42bf4f0 100644
--- a/src/routes/blog/+page.svelte
+++ b/src/routes/blog/+page.svelte
@@ -1,5 +1,19 @@
-<script>
-	import UnderConstruction from '$lib/components/UnderConstruction.svelte';
+<script lang="ts">
+	import ChevronRight from 'svelte-radix/ChevronRight.svelte';
+	import Code from 'svelte-radix/Code.svelte';
+	import type { PageData } from './$types.js';
+	// import { config } from '$lib/stores/index.js';
+	import { cn } from '$lib/utils.js';
+
+	let doc = {
+		title: 'Test Post',
+		description: ''
+	};
+
+	export let data: PageData;
+	$: markdown = data.markdown;
+	// $: doc = data.metadata;
+	// $: componentSource = data.metadata.source?.replace('default', $config.style ?? 'default');
 </script>
 
 <svelte:head>
@@ -8,4 +22,33 @@
 	<meta name="author" content="Youwen Wu" />
 </svelte:head>
 
-<UnderConstruction />
+<main class="container max-w-5xl mx-auto my-8">
+	<div class="mx-auto w-full min-w-0 mb-4">
+		<div class="mb-4 flex items-center space-x-1 text-sm text-muted-foreground">
+			<div class="overflow-hidden text-ellipsis whitespace-nowrap">Docs</div>
+			<ChevronRight class="h-4 w-4" />
+			<div class="font-medium text-foreground">{doc.title}</div>
+		</div>
+		<div class="space-y-2">
+			<h1 class={cn('scroll-m-20 text-4xl font-bold tracking-tight')}>
+				{doc.title}
+			</h1>
+			{#if doc.description}
+				<p class="text-balance text-lg text-muted-foreground">
+					{doc.description}
+				</p>
+			{/if}
+		</div>
+
+		<!-- <div class="pb-12 pt-8 mx-auto"> -->
+		<!-- </div> -->
+		<!-- <div class="hidden text-sm xl:block">
+		<div class="sticky top-16 -mt-10 h-[calc(100vh-3.5rem)] overflow-hidden pt-4">
+			{#key $page.url.pathname}
+				<TableOfContents />
+			{/key}
+		</div>
+	</div> -->
+	</div>
+	{@html markdown}
+</main>
diff --git a/src/routes/blog/+page.ts b/src/routes/blog/+page.ts
new file mode 100644
index 0000000..1690a1c
--- /dev/null
+++ b/src/routes/blog/+page.ts
@@ -0,0 +1,17 @@
+import type { PageLoad } from './$types.js';
+import { marked } from 'marked';
+import markedKatex from 'marked-katex-extension';
+
+const options = {
+	throwOnError: false
+};
+marked.use(markedKatex(options));
+
+export const load: PageLoad = async ({ fetch }) => {
+	const data = await fetch('/test.md');
+	const markdown = await marked.parse(await data.text());
+
+	return {
+		markdown
+	};
+};
diff --git a/static/fonts/KaTeX_AMS-Regular.ttf b/static/fonts/KaTeX_AMS-Regular.ttf
new file mode 100644
index 0000000..c6f9a5e
Binary files /dev/null and b/static/fonts/KaTeX_AMS-Regular.ttf differ
diff --git a/static/fonts/KaTeX_AMS-Regular.woff b/static/fonts/KaTeX_AMS-Regular.woff
new file mode 100644
index 0000000..b804d7b
Binary files /dev/null and b/static/fonts/KaTeX_AMS-Regular.woff differ
diff --git a/static/fonts/KaTeX_AMS-Regular.woff2 b/static/fonts/KaTeX_AMS-Regular.woff2
new file mode 100644
index 0000000..0acaaff
Binary files /dev/null and b/static/fonts/KaTeX_AMS-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Caligraphic-Bold.ttf b/static/fonts/KaTeX_Caligraphic-Bold.ttf
new file mode 100644
index 0000000..9ff4a5e
Binary files /dev/null and b/static/fonts/KaTeX_Caligraphic-Bold.ttf differ
diff --git a/static/fonts/KaTeX_Caligraphic-Bold.woff b/static/fonts/KaTeX_Caligraphic-Bold.woff
new file mode 100644
index 0000000..9759710
Binary files /dev/null and b/static/fonts/KaTeX_Caligraphic-Bold.woff differ
diff --git a/static/fonts/KaTeX_Caligraphic-Bold.woff2 b/static/fonts/KaTeX_Caligraphic-Bold.woff2
new file mode 100644
index 0000000..f390922
Binary files /dev/null and b/static/fonts/KaTeX_Caligraphic-Bold.woff2 differ
diff --git a/static/fonts/KaTeX_Caligraphic-Regular.ttf b/static/fonts/KaTeX_Caligraphic-Regular.ttf
new file mode 100644
index 0000000..f522294
Binary files /dev/null and b/static/fonts/KaTeX_Caligraphic-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Caligraphic-Regular.woff b/static/fonts/KaTeX_Caligraphic-Regular.woff
new file mode 100644
index 0000000..9bdd534
Binary files /dev/null and b/static/fonts/KaTeX_Caligraphic-Regular.woff differ
diff --git a/static/fonts/KaTeX_Caligraphic-Regular.woff2 b/static/fonts/KaTeX_Caligraphic-Regular.woff2
new file mode 100644
index 0000000..75344a1
Binary files /dev/null and b/static/fonts/KaTeX_Caligraphic-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Fraktur-Bold.ttf b/static/fonts/KaTeX_Fraktur-Bold.ttf
new file mode 100644
index 0000000..4e98259
Binary files /dev/null and b/static/fonts/KaTeX_Fraktur-Bold.ttf differ
diff --git a/static/fonts/KaTeX_Fraktur-Bold.woff b/static/fonts/KaTeX_Fraktur-Bold.woff
new file mode 100644
index 0000000..e7730f6
Binary files /dev/null and b/static/fonts/KaTeX_Fraktur-Bold.woff differ
diff --git a/static/fonts/KaTeX_Fraktur-Bold.woff2 b/static/fonts/KaTeX_Fraktur-Bold.woff2
new file mode 100644
index 0000000..395f28b
Binary files /dev/null and b/static/fonts/KaTeX_Fraktur-Bold.woff2 differ
diff --git a/static/fonts/KaTeX_Fraktur-Regular.ttf b/static/fonts/KaTeX_Fraktur-Regular.ttf
new file mode 100644
index 0000000..b8461b2
Binary files /dev/null and b/static/fonts/KaTeX_Fraktur-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Fraktur-Regular.woff b/static/fonts/KaTeX_Fraktur-Regular.woff
new file mode 100644
index 0000000..acab069
Binary files /dev/null and b/static/fonts/KaTeX_Fraktur-Regular.woff differ
diff --git a/static/fonts/KaTeX_Fraktur-Regular.woff2 b/static/fonts/KaTeX_Fraktur-Regular.woff2
new file mode 100644
index 0000000..735f694
Binary files /dev/null and b/static/fonts/KaTeX_Fraktur-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Main-Bold.ttf b/static/fonts/KaTeX_Main-Bold.ttf
new file mode 100644
index 0000000..4060e62
Binary files /dev/null and b/static/fonts/KaTeX_Main-Bold.ttf differ
diff --git a/static/fonts/KaTeX_Main-Bold.woff b/static/fonts/KaTeX_Main-Bold.woff
new file mode 100644
index 0000000..f38136a
Binary files /dev/null and b/static/fonts/KaTeX_Main-Bold.woff differ
diff --git a/static/fonts/KaTeX_Main-Bold.woff2 b/static/fonts/KaTeX_Main-Bold.woff2
new file mode 100644
index 0000000..ab2ad21
Binary files /dev/null and b/static/fonts/KaTeX_Main-Bold.woff2 differ
diff --git a/static/fonts/KaTeX_Main-BoldItalic.ttf b/static/fonts/KaTeX_Main-BoldItalic.ttf
new file mode 100644
index 0000000..dc00797
Binary files /dev/null and b/static/fonts/KaTeX_Main-BoldItalic.ttf differ
diff --git a/static/fonts/KaTeX_Main-BoldItalic.woff b/static/fonts/KaTeX_Main-BoldItalic.woff
new file mode 100644
index 0000000..67807b0
Binary files /dev/null and b/static/fonts/KaTeX_Main-BoldItalic.woff differ
diff --git a/static/fonts/KaTeX_Main-BoldItalic.woff2 b/static/fonts/KaTeX_Main-BoldItalic.woff2
new file mode 100644
index 0000000..5931794
Binary files /dev/null and b/static/fonts/KaTeX_Main-BoldItalic.woff2 differ
diff --git a/static/fonts/KaTeX_Main-Italic.ttf b/static/fonts/KaTeX_Main-Italic.ttf
new file mode 100644
index 0000000..0e9b0f3
Binary files /dev/null and b/static/fonts/KaTeX_Main-Italic.ttf differ
diff --git a/static/fonts/KaTeX_Main-Italic.woff b/static/fonts/KaTeX_Main-Italic.woff
new file mode 100644
index 0000000..6f43b59
Binary files /dev/null and b/static/fonts/KaTeX_Main-Italic.woff differ
diff --git a/static/fonts/KaTeX_Main-Italic.woff2 b/static/fonts/KaTeX_Main-Italic.woff2
new file mode 100644
index 0000000..b50920e
Binary files /dev/null and b/static/fonts/KaTeX_Main-Italic.woff2 differ
diff --git a/static/fonts/KaTeX_Main-Regular.ttf b/static/fonts/KaTeX_Main-Regular.ttf
new file mode 100644
index 0000000..dd45e1e
Binary files /dev/null and b/static/fonts/KaTeX_Main-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Main-Regular.woff b/static/fonts/KaTeX_Main-Regular.woff
new file mode 100644
index 0000000..21f5812
Binary files /dev/null and b/static/fonts/KaTeX_Main-Regular.woff differ
diff --git a/static/fonts/KaTeX_Main-Regular.woff2 b/static/fonts/KaTeX_Main-Regular.woff2
new file mode 100644
index 0000000..eb24a7b
Binary files /dev/null and b/static/fonts/KaTeX_Main-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Math-BoldItalic.ttf b/static/fonts/KaTeX_Math-BoldItalic.ttf
new file mode 100644
index 0000000..728ce7a
Binary files /dev/null and b/static/fonts/KaTeX_Math-BoldItalic.ttf differ
diff --git a/static/fonts/KaTeX_Math-BoldItalic.woff b/static/fonts/KaTeX_Math-BoldItalic.woff
new file mode 100644
index 0000000..0ae390d
Binary files /dev/null and b/static/fonts/KaTeX_Math-BoldItalic.woff differ
diff --git a/static/fonts/KaTeX_Math-BoldItalic.woff2 b/static/fonts/KaTeX_Math-BoldItalic.woff2
new file mode 100644
index 0000000..2965702
Binary files /dev/null and b/static/fonts/KaTeX_Math-BoldItalic.woff2 differ
diff --git a/static/fonts/KaTeX_Math-Italic.ttf b/static/fonts/KaTeX_Math-Italic.ttf
new file mode 100644
index 0000000..70d559b
Binary files /dev/null and b/static/fonts/KaTeX_Math-Italic.ttf differ
diff --git a/static/fonts/KaTeX_Math-Italic.woff b/static/fonts/KaTeX_Math-Italic.woff
new file mode 100644
index 0000000..eb5159d
Binary files /dev/null and b/static/fonts/KaTeX_Math-Italic.woff differ
diff --git a/static/fonts/KaTeX_Math-Italic.woff2 b/static/fonts/KaTeX_Math-Italic.woff2
new file mode 100644
index 0000000..215c143
Binary files /dev/null and b/static/fonts/KaTeX_Math-Italic.woff2 differ
diff --git a/static/fonts/KaTeX_SansSerif-Bold.ttf b/static/fonts/KaTeX_SansSerif-Bold.ttf
new file mode 100644
index 0000000..2f65a8a
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Bold.ttf differ
diff --git a/static/fonts/KaTeX_SansSerif-Bold.woff b/static/fonts/KaTeX_SansSerif-Bold.woff
new file mode 100644
index 0000000..8d47c02
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Bold.woff differ
diff --git a/static/fonts/KaTeX_SansSerif-Bold.woff2 b/static/fonts/KaTeX_SansSerif-Bold.woff2
new file mode 100644
index 0000000..cfaa3bd
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Bold.woff2 differ
diff --git a/static/fonts/KaTeX_SansSerif-Italic.ttf b/static/fonts/KaTeX_SansSerif-Italic.ttf
new file mode 100644
index 0000000..d5850df
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Italic.ttf differ
diff --git a/static/fonts/KaTeX_SansSerif-Italic.woff b/static/fonts/KaTeX_SansSerif-Italic.woff
new file mode 100644
index 0000000..7e02df9
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Italic.woff differ
diff --git a/static/fonts/KaTeX_SansSerif-Italic.woff2 b/static/fonts/KaTeX_SansSerif-Italic.woff2
new file mode 100644
index 0000000..349c06d
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Italic.woff2 differ
diff --git a/static/fonts/KaTeX_SansSerif-Regular.ttf b/static/fonts/KaTeX_SansSerif-Regular.ttf
new file mode 100644
index 0000000..537279f
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Regular.ttf differ
diff --git a/static/fonts/KaTeX_SansSerif-Regular.woff b/static/fonts/KaTeX_SansSerif-Regular.woff
new file mode 100644
index 0000000..31b8482
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Regular.woff differ
diff --git a/static/fonts/KaTeX_SansSerif-Regular.woff2 b/static/fonts/KaTeX_SansSerif-Regular.woff2
new file mode 100644
index 0000000..a90eea8
Binary files /dev/null and b/static/fonts/KaTeX_SansSerif-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Script-Regular.ttf b/static/fonts/KaTeX_Script-Regular.ttf
new file mode 100644
index 0000000..fd679bf
Binary files /dev/null and b/static/fonts/KaTeX_Script-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Script-Regular.woff b/static/fonts/KaTeX_Script-Regular.woff
new file mode 100644
index 0000000..0e7da82
Binary files /dev/null and b/static/fonts/KaTeX_Script-Regular.woff differ
diff --git a/static/fonts/KaTeX_Script-Regular.woff2 b/static/fonts/KaTeX_Script-Regular.woff2
new file mode 100644
index 0000000..b3048fc
Binary files /dev/null and b/static/fonts/KaTeX_Script-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Size1-Regular.ttf b/static/fonts/KaTeX_Size1-Regular.ttf
new file mode 100644
index 0000000..871fd7d
Binary files /dev/null and b/static/fonts/KaTeX_Size1-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Size1-Regular.woff b/static/fonts/KaTeX_Size1-Regular.woff
new file mode 100644
index 0000000..7f292d9
Binary files /dev/null and b/static/fonts/KaTeX_Size1-Regular.woff differ
diff --git a/static/fonts/KaTeX_Size1-Regular.woff2 b/static/fonts/KaTeX_Size1-Regular.woff2
new file mode 100644
index 0000000..c5a8462
Binary files /dev/null and b/static/fonts/KaTeX_Size1-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Size2-Regular.ttf b/static/fonts/KaTeX_Size2-Regular.ttf
new file mode 100644
index 0000000..7a212ca
Binary files /dev/null and b/static/fonts/KaTeX_Size2-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Size2-Regular.woff b/static/fonts/KaTeX_Size2-Regular.woff
new file mode 100644
index 0000000..d241d9b
Binary files /dev/null and b/static/fonts/KaTeX_Size2-Regular.woff differ
diff --git a/static/fonts/KaTeX_Size2-Regular.woff2 b/static/fonts/KaTeX_Size2-Regular.woff2
new file mode 100644
index 0000000..e1bccfe
Binary files /dev/null and b/static/fonts/KaTeX_Size2-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Size3-Regular.ttf b/static/fonts/KaTeX_Size3-Regular.ttf
new file mode 100644
index 0000000..00bff34
Binary files /dev/null and b/static/fonts/KaTeX_Size3-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Size3-Regular.woff b/static/fonts/KaTeX_Size3-Regular.woff
new file mode 100644
index 0000000..e6e9b65
Binary files /dev/null and b/static/fonts/KaTeX_Size3-Regular.woff differ
diff --git a/static/fonts/KaTeX_Size3-Regular.woff2 b/static/fonts/KaTeX_Size3-Regular.woff2
new file mode 100644
index 0000000..249a286
Binary files /dev/null and b/static/fonts/KaTeX_Size3-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Size4-Regular.ttf b/static/fonts/KaTeX_Size4-Regular.ttf
new file mode 100644
index 0000000..74f0892
Binary files /dev/null and b/static/fonts/KaTeX_Size4-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Size4-Regular.woff b/static/fonts/KaTeX_Size4-Regular.woff
new file mode 100644
index 0000000..e1ec545
Binary files /dev/null and b/static/fonts/KaTeX_Size4-Regular.woff differ
diff --git a/static/fonts/KaTeX_Size4-Regular.woff2 b/static/fonts/KaTeX_Size4-Regular.woff2
new file mode 100644
index 0000000..680c130
Binary files /dev/null and b/static/fonts/KaTeX_Size4-Regular.woff2 differ
diff --git a/static/fonts/KaTeX_Typewriter-Regular.ttf b/static/fonts/KaTeX_Typewriter-Regular.ttf
new file mode 100644
index 0000000..c83252c
Binary files /dev/null and b/static/fonts/KaTeX_Typewriter-Regular.ttf differ
diff --git a/static/fonts/KaTeX_Typewriter-Regular.woff b/static/fonts/KaTeX_Typewriter-Regular.woff
new file mode 100644
index 0000000..2432419
Binary files /dev/null and b/static/fonts/KaTeX_Typewriter-Regular.woff differ
diff --git a/static/fonts/KaTeX_Typewriter-Regular.woff2 b/static/fonts/KaTeX_Typewriter-Regular.woff2
new file mode 100644
index 0000000..771f1af
Binary files /dev/null and b/static/fonts/KaTeX_Typewriter-Regular.woff2 differ
diff --git a/static/test.md b/static/test.md
new file mode 100644
index 0000000..89efd90
--- /dev/null
+++ b/static/test.md
@@ -0,0 +1,135 @@
+The following content is a test post for the blog's markdown and $\KaTeX$ rendering capabilities. There's a few errors, and wikilinks aren't supported. This file was copy pasted directly out of my `obsidian.md` notebook, so it contains some weird formatting.
+
+<br />
+
+The methods in [[9.8 Power Series]] and [[9.9 Representation of (Rational) Functions by Power Series]] allow us to find power series for rational functions, $\ln$, and $\arctan$. To get power series for other elementary functions, we need a more general method.
+
+We can approximate some non-polynomial functions by constructing a polynomial with the _same derivatives_ as the function. This is called a _Taylor Polynomial_.
+
+> [!NOTE]
+> In general, if $c \neq 0$, it's called a Taylor Polynomial. If $c = 0$, then it's a Maclaurin Polynomial.
+
+Consider $f(x) = e^x$. Let's find the best cubic approximation $P_3(x)$ for $f(x)$ at $c=0$.
+
+$$
+P_3(0) = f(0)
+$$
+
+$$
+f'(x) = e^x,\,P_3'(0)=f'(0)
+$$
+
+$$
+f''(x) = e^x,\,P_3''(0) = f''(0)
+$$
+
+$$
+f'''(x) = e^x,\,P_3'''(0) = f'''(0)
+$$
+
+$$
+f(0) = f'(0) = f''(0) = f'''(0) = 1
+$$
+
+We know that $P_3(x)$ will be of the form
+
+$$
+P_3(x) = a_0 + a_1 x + a_2 x^2 + a_3 x^3
+$$
+
+We can differentiate both sides $n$ times to find the values of $a_0$, $a_1$, $\dots$, $a_n$.
+
+$$
+P_3(x) = 1 + x + \frac{1}{2} x^2 + \frac{1}{6} x^3
+$$
+
+You can confirm that this polynomial has the same first, second, and third derivatives as $e^x$.
+
+## Generalizing
+
+Taking repeated derivatives like this leads to a common pattern in all Taylor polynomials.
+
+> [!NOTE]
+> We use the notation $P_n(x)$ to denote the $n^{th}$ Taylor polynomial
+
+Taylor polynomials take the form:
+
+$$
+P_n(x) = a_0 + a_1 (x-c) + a_2(x-c)^2 + a_3 (x-c)^3 + \dots + a_n(x-c)^n
+$$
+
+where $a_n$ is the coefficient of the $n^{th}$ term (indexed from 0). It turns out that these coefficients are actually common across Taylor polynomials.
+
+$$
+P_n(c) = a_0 = f(c)
+$$
+
+$$
+P_n'(c) = a_1 = f'(c)
+$$
+
+$$
+P_n''(c) = 2 a_2 = 2!\,a_2
+$$
+
+$$
+P_n'''(c) = 6a_3 = 3!\,a_3 = f'''(c)
+$$
+
+$$
+P_n^{(n)}(c) = n!\,a_n = f^{(n)}(c)
+$$
+
+$$
+\implies a_n = \frac{f^{(n)}(c)}{n!}
+$$
+
+## Tying up loose ends
+
+We've seen Taylor and Maclaurin polynomials. We will eventually extend them to [[9.10 Taylor and Maclaurin Series|Maclaurin and Taylor series]]. Before this is mathematically valid (at least, valid enough), we need to do some stuff first.
+
+We can use Maclaurin and Taylor polynomials (or series) to estimate the value of functions by hand.
+
+### Taylor Remainder
+
+If you have $f(x)$ and $P_n(x)$ (centered at $c$), then $f(x) = P_n(x) + R_n(x)$, where $R_n$ is
+
+$$
+R_n(x) = \frac{f^{(n+1)}(z)}{(n+1)!}\,(x-c)^{n+1}
+$$
+
+$$
+z \in [c,\,x]
+$$
+
+> [!TIP]
+> This is a fancy way of saying that $z$ is between $c$ and $x$.
+
+$$
+\text{Error} = \left|R_n(x)\right|
+$$
+
+> [!NOTE] > $R_n$ would be the "next term" in $P_n(x)$ except we put $z$ instead of $c$.
+
+#### Applying to $e^x$
+
+How many terms of the Maclaurin Polynomial for $f(x) = e^x$ do we need to guarantee that our estimate for $f(1) = e$ is within $\displaystyle\frac{1}{1000000}$?
+The error is
+
+$$
+|R_n(1)| = \frac{|f^{(n+1)}(z)|}{(n+1)!}\,\cancel{|1-0|^{n+1}}
+$$
+
+for some $z$ between $c=0$ and $x=1$
+So we want an $n$ such that
+
+$$
+\frac{|e^z|}{(n+1)!} \le \frac{1}{1000000}
+$$
+
+The worst case scenario is $z=1$.
+If $\displaystyle\frac{e}{(n+1)!} \le \frac{1}{1000000}$, we're all set.
+
+Assume that $e \le 3$, which implies that if $\displaystyle\frac{3}{(n+1)!} \le \frac{1}{1000000}$, we're all set.
+After trying terms, we find that $n=9$ works.
+So $P_9(1) = 1 + 1 + \frac{1}{2!} + \frac{1}{3!} + \dots + \frac{1}{9!}$ is within $\frac{1}{1000000}$ of $e$.
diff --git a/static/youwen.gpg b/static/youwen.gpg
new file mode 100644
index 0000000..85f9fad
--- /dev/null
+++ b/static/youwen.gpg
@@ -0,0 +1,41 @@
+-----BEGIN PGP PUBLIC KEY BLOCK-----
+
+mQGNBGXUU/YBDACU4lNbN+Ovl22kFQNkQTiYjbeYtfzCg7qxepDwNwRzF7AbD+AX
+dK2z6QOQt7E0t0kTAvuwAUqj5IyantUgrWT9de/pTGorS5jICN+mph1r6HUdZ0vv
+0aIHVbzAWEPiIgPz4RtOe2LqWMHDN2nXH+E+HAJ4gehHIJsYpBlSpyL9jEfe7mSe
+/F2rKu6sDaTVplx9THvxMZRMWwQ0tE0acyyEdlNnmouD/wJ4INVKei/hQkOjO753
+2DNxG3xDb4cb7aNVnFnBQ9v4vy8vOfcuawwkvV0oI84ZT5+EeEJ7DfcecYUt1Utj
+MxvNrXtbdEoH9gK10DnirNtfEk2WCWIe35lKYEY/Yak4l5IaxRilWzYPUaxSoHLX
+t9AFFMq9Vf+JxgA6xMQaZn6VJIz8NnJKGdaz31WQkB+7BD4g/+gkg2VSnRk/bHt9
+/7AiVYvdImzaObeWeFtzu04+OTznzXplvjldFqocVg5GvwkIXl85Zdl4NxmFclrU
+S0PKxDKyPb/wvksAEQEAAbQdWW91d2VuIFd1IDx5b3V3ZW53QGdtYWlsLmNvbT6J
+Ac4EEwEIADgWIQSPXmwa+Ql2ynECkXqGVljtH+YewwUCZdRT9gIbAwULCQgHAgYV
+CgkICwIEFgIDAQIeAQIXgAAKCRCGVljtH+Yew/r1C/oCFDUiqtGsfssaODMahxrP
+qm8z9Qf8beJNxJzd1kboh0BvMt68SI7TH6FkLbw3qOkcHQqPgnFEnrWpZ6Du95ra
+a4S2I1T5jTGcIE6F+016KB7vVdBkLnyzIjXLBCJ5aRhJNgWyvcBIJ3UPTQqGkvm3
+jnrwSMGFkx/ugdoFbbEk9TWCcZcof/rCFwlU/VUHIIXuQw/CMtOcSIlrHiPqRxS2
+y9Dei0fhegXSpPI7l+vvU8W1YV0hfc70QZjcSKRCjy9Sf8oMV+r986yEOl4UUNGv
+uDT32pb/T5c1bVC2SItQ8qZT1TS6CqO9hPIdV2W/yCRdcs/Ibhl/oVWZ/Rf+gMcJ
+hg40vwHg9nFebhXIZO4aJvGx3cRPuWiMOF+amXfhWaHvSfLeT6zySN2M/wtTlHJh
+Fb+BtRpwAcrMlzGz5Z7+eW8FX6ja0u9NuBwujqZzw8hIEnTOaH7RZgkdJfvbhwx8
+tc61oN8iTlkVsEvxx9+Rz32dUO3fPlgnpfnuRDT33D65AY0EZdRT9gEMAPJz81qb
+e/V2XaaZWn3LcSeXqcMixOJCKVlXTU9kTZ2N8Jc1+pSZrKsGnMHoH5eRmVk3Mh5r
+Z15i7KETrUYVod7tQmFhg7sciXPT34mUyT/06B5gOE/3tdCIb6b9b2v4g/iOwQfR
+VqREF69ARwhOlibqi7r6Gsdms4MXqHtb9Q8hH0EGOkp2jpek7pKxGOJML1oOi5HX
+RmGDvEPqvFdKRpJ9cBHixGQSMceFZ2RAm5DYVinM/G2Rzf9eDK7JL0vxAk2c6mku
+Xhf1BIGtWV3M/oBokdV0puP3GcZ6Y2GJptyd1vbvOyuhhdItHGWFGsp3TZ0nExOW
+wIoqK0mgDvYMd6GfC0gBME6P59yVM5GO2RUX3Pm+sA7sIJLx+6P9VzZ9cpFyA7Jm
+uQ7nkJuSCllvZt0p/amnlI01DrVN4qGpTNhiYyX4h52XxjmBF4zD4PPDQ3vUTprO
+GFe7thruze3QDgQvexK57RIUGwMNAlIcNIqxGtRRodgI2bZ8PDXHtwtrswARAQAB
+iQG2BBgBCAAgFiEEj15sGvkJdspxApF6hlZY7R/mHsMFAmXUU/YCGwwACgkQhlZY
+7R/mHsO2GAv7BDqUYQU2vpsKTfLvethDiOtkHcl6ysVppui++vQMbC/ix2FugFl+
+uzWZ+C8YW92L7mzMVqSfId+E/uUUZ3WcpWoF0RkQ5S0RxLJu956iCMX8vz++KbWF
+gOh1XO6J0PEW96krb0/y06bk9njsSgepRrEtJ2HhJkugP9r8EPfP5TdoZFCMA71s
+0lbdo3yMy5hRsg6sCWtQ05t1kSgmKKYJ080ezr4u43J2zI/RDnoZFqpq9D2DFJQw
+886JpjgCUxYpt4IGFp4xQ4xUzq+lOvBx2a1sFqBB8Jc7GKu7hkDEJVvT8o4ykYCZ
+kTc1IABHnMHnrMGwIu4Ac2y7XTDteKbZ9m11nN5yGRDDYF0W8dPwNVlZ5eN7rObx
+GZGDgXQeUEIqCZeKH9req7dEvSEtRSL9TTljZQPmluQ5McCYjO5VE1ELYoN06gxk
+e+zFKHMvWz6wasYkSMKA4LAPNkt7tCGtksDO0k2cakcVEVYqa8CI20gIFeLrY7pM
+1Aslp42CY3IG
+=wGsS
+-----END PGP PUBLIC KEY BLOCK-----
\ No newline at end of file