Add Navigation component and integrate it into multiple pages for consistent navigation

frontend/app/recipes/page.tsx

@@ -2,12 +2,14 @@ import Link from 'next/link';
 import { fetchJson } from '../../lib/api';
 import type { Recipe } from '../../features/inventory/types';
 import RecipePreview from './RecipePreview';
+import Navigation from '../Navigation';
 
 export default async function RecipesPage() {
   const recipes = await fetchJson<Recipe[]>('/api/recipes');
 
   return (
-    <main style={{ padding: '1.5rem', maxWidth: '1000px', margin: '0 auto' }}>
+    <main style={{ padding: '1rem', maxWidth: '1000px', margin: '0 auto' }}>
+      <Navigation />
       <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1.5rem' }}>
         <h1 style={{ margin: 0 }}>Recept</h1>
         <Link