style welcome screen

src/app/page.tsx

@@ -3,21 +3,21 @@ import { Button } from "@/components/ui/button";
 
 export default function Home() {
   return (
-    <main className="flex flex-col items-center justify-around h-60 w-26">
+    <main className="flex flex-col gap-4 items-center justify-around h-60 w-26 m-6">
       < div >
         <h1 className="text-3xl font-black">
-          Welcome to Subman
+          Welcome to Subman!
         </h1>
       </div >
-      <div>
+      <div className="flex flex-col gap-3">
-        <p className="mb-6">
+        <p>
           This app is for demonstration purposes only. Data is reset periodically.
         </p>
         <p>
-          USERNAME: demo@demo.demo
+          <b>USERNAME:</b> demo@demo.demo
         </p>
         <p>
-          PASSWORD: password
+          <b>PASSWORD:</b> password
         </p>
       </div>
       <Button className="mt-6">

src/app/tailwind.css

@@ -710,6 +710,14 @@ body {
   margin: auto;
 }
 
+.m-6 {
+  margin: 1.5rem;
+}
+
+.m-12 {
+  margin: 3rem;
+}
+
 .-mx-1 {
   margin-left: -0.25rem;
   margin-right: -0.25rem;
@@ -1146,6 +1154,14 @@ body {
   gap: 1rem;
 }
 
+.gap-3 {
+  gap: 0.75rem;
+}
+
+.gap-12 {
+  gap: 3rem;
+}
+
 .gap-x-16 {
   -moz-column-gap: 4rem;
        column-gap: 4rem;