refactor: extract redundant max-width into utility (#525)

* refactor: extract redundant max-width into utility

Extract redundant max-width into a universal tailwind
utility class. By doing so, the width of the layout
in different pages can be customized easily.

* docs: update docs for modifying `max-w-app` utility

src/pages/404.astro

@@ -11,7 +11,7 @@ import { SITE } from "@/config";
 
   <main
     id="main-content"
-    class="mx-auto flex max-w-3xl flex-1 items-center justify-center"
+    class="mx-auto flex max-w-app flex-1 items-center justify-center"
   >
     <div class="mb-14 flex flex-col items-center justify-center">
       <h1 class="text-9xl font-bold text-accent">404</h1>