feat: add recipe editing, image upload management, and UI improvements

Added comprehensive recipe editing functionality with improved image handling
and better UX for large file uploads.

**Features:**
- Recipe editing: Full CRUD support for recipes with edit page
- Image management: Upload, replace, and delete recipe images
- Upload feedback: Processing and uploading states for better UX
- File size increase: Raised limit from 10MB to 20MB for images
- Nginx configuration: Added client_max_body_size for large uploads

**Changes:**
- Created EditRecipe.tsx page for editing existing recipes
- Created NewRecipe.tsx page wrapper for recipe creation
- Created RecipeForm.tsx comprehensive form component with:
  - Simple and multi-section recipe modes
  - Image upload with confirmation dialogs
  - Processing state feedback during file handling
  - Smaller, button-style upload controls
- Updated recipes.routes.ts:
  - Increased multer fileSize limit to 20MB
  - Added file validation for image types
  - Image upload now updates Recipe.imageUrl field
  - Added DELETE /recipes/:id/image endpoint
  - Automatic cleanup of old images when uploading new ones
- Updated nginx.conf: Added client_max_body_size 20M for API proxy
- Updated App.css: Improved upload button styling (smaller, more compact)
- Updated RecipeForm.tsx: Better file processing feedback with setTimeout
- Updated help text to reflect 20MB limit and WEBP support

**Technical Details:**
- Fixed static file serving path in index.ts
- Added detailed logging for upload debugging
- Improved TypeScript type safety in upload handlers
- Better error handling and user feedback

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

packages/api/prisma/schema.prisma

@@ -25,6 +25,7 @@ model Recipe {
   createdAt   DateTime @default(now())
   updatedAt   DateTime @updatedAt
 
+  sections     RecipeSection[]
   ingredients  Ingredient[]
   instructions Instruction[]
   images       RecipeImage[]
@@ -35,30 +36,51 @@ model Recipe {
   @@index([category])
 }
 
-model Ingredient {
+model RecipeSection {
   id       String  @id @default(cuid())
   recipeId String
-  name     String
-  amount   String?
-  unit     String?
-  notes    String?
+  name     String  // e.g., "Starter", "Dough", "Assembly"
   order    Int
+  timing   String? // e.g., "Day 1 - 8PM", "12 hours before mixing"
 
-  recipe Recipe @relation(fields: [recipeId], references: [id], onDelete: Cascade)
+  recipe       Recipe        @relation(fields: [recipeId], references: [id], onDelete: Cascade)
+  ingredients  Ingredient[]
+  instructions Instruction[]
 
   @@index([recipeId])
 }
 
-model Instruction {
-  id       String  @id @default(cuid())
-  recipeId String
-  step     Int
-  text     String  @db.Text
-  imageUrl String?
+model Ingredient {
+  id        String  @id @default(cuid())
+  recipeId  String? // Optional - can be derived from section
+  sectionId String? // Optional - if null, belongs to recipe directly
+  name      String
+  amount    String?
+  unit      String?
+  notes     String?
+  order     Int
 
-  recipe Recipe @relation(fields: [recipeId], references: [id], onDelete: Cascade)
+  recipe  Recipe?        @relation(fields: [recipeId], references: [id], onDelete: Cascade)
+  section RecipeSection? @relation(fields: [sectionId], references: [id], onDelete: Cascade)
 
   @@index([recipeId])
+  @@index([sectionId])
+}
+
+model Instruction {
+  id        String  @id @default(cuid())
+  recipeId  String? // Optional - can be derived from section
+  sectionId String? // Optional - if null, belongs to recipe directly
+  step      Int
+  text      String  @db.Text
+  imageUrl  String?
+  timing    String? // e.g., "8:00am", "After 30 minutes", "Day 2 - Morning"
+
+  recipe  Recipe?        @relation(fields: [recipeId], references: [id], onDelete: Cascade)
+  section RecipeSection? @relation(fields: [sectionId], references: [id], onDelete: Cascade)
+
+  @@index([recipeId])
+  @@index([sectionId])
 }
 
 model RecipeImage {