Add CreateRecipePage component for recipe creation with ingredients. Updated UX

frontend/app/page.tsx

@@ -2,12 +2,36 @@ import Link from 'next/link';
 
 export default function HomePage() {
   return (
-    <main style={{ padding: '2rem' }}>
-      <h1>Recipe App</h1>
-      <p>Det här är första riktiga grunden för projektet.</p>
-      <p><Link href="/inventory">Gå till varor som finns hemma</Link></p>
-      <p><Link href="/admin/products">Gå till produktadmin</Link></p>
-      <p><Link href="/recipes">Gå till recept</Link></p>
+    <main style={{ padding: '2rem', maxWidth: '700px', margin: '0 auto' }}>
+      <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1.5rem' }}>
+        <h1 style={{ margin: 0 }}>Recipe App</h1>
+        <Link
+          href="/recipes/create"
+          style={{
+            padding: '0.5rem 1rem',
+            background: '#0070f3',
+            color: 'white',
+            borderRadius: '4px',
+            textDecoration: 'none',
+            fontWeight: 500,
+            fontSize: '1rem',
+            transition: 'background 0.2s',
+          }}
+        >
+          Lägg till nytt recept
+        </Link>
+      </div>
+      <div style={{ display: 'grid', gap: '1rem' }}>
+        <Link href="/inventory" style={{ padding: '0.5rem', background: '#eee', borderRadius: '4px', textDecoration: 'none', color: '#222' }}>
+          Gå till varor som finns hemma
+        </Link>
+        <Link href="/admin/products" style={{ padding: '0.5rem', background: '#eee', borderRadius: '4px', textDecoration: 'none', color: '#222' }}>
+          Gå till produktadmin
+        </Link>
+        <Link href="/recipes" style={{ padding: '0.5rem', background: '#eee', borderRadius: '4px', textDecoration: 'none', color: '#222' }}>
+          Gå till recept
+        </Link>
+      </div>
     </main>
   );
 }