feat(docs): add docs and restructure

web/src/components/docs/Prose.tsx

@@ -0,0 +1,24 @@
+import clsx from 'clsx'
+
+export function Prose<T extends React.ElementType = 'div'>({
+  as,
+  className,
+  ...props
+}: Omit<React.ComponentPropsWithoutRef<T>, 'as' | 'className'> & {
+  as?: T
+  className?: string
+}) {
+  let Component = as ?? 'div'
+
+  return (
+    <Component
+      className={clsx(
+        className,
+        'prose dark:prose-invert',
+        // `html :where(& > *)` is used to select all direct children without an increase in specificity like you'd get from just `& > *`
+        '[html_:where(&>*)]:mx-auto [html_:where(&>*)]:max-w-2xl [html_:where(&>*)]:lg:mx-[calc(50%-min(50%,theme(maxWidth.lg)))] [html_:where(&>*)]:lg:max-w-3xl',
+      )}
+      {...props}
+    />
+  )
+}