Recipe page: ingredients and method side-by-side layout

- Change rp-body-grid from 1.5fr 1fr (content|history) to 1fr 1fr
  (ingredients|method)
- Move cook history to full-width section below the grid
- Move sections list binding out of inner div so both columns can use it

src/Roux/Html.hs

@@ -927,7 +927,7 @@ recipePageStyles =
         , ".rp-hero-wrap { position: relative; margin-bottom: 32px; }"
         , ".rp-hero-wrap .rp-hero { margin-bottom: 0; }"
         , ""
-        , ".rp-body-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 40px; margin-bottom: 32px; }"
+        , ".rp-body-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-bottom: 16px; }"
         , ""
         , ".rp-section-label { font-size: 12px; letter-spacing: 0.12em; color: #8A7560; text-transform: uppercase; margin-bottom: 10px; display: flex; justify-content: space-between; align-items: baseline; }"
         , ".rp-serves { font-family: \"Fraunces\", serif; font-size: 28px; margin-bottom: 22px; }"
@@ -960,6 +960,7 @@ recipePageStyles =
         , ""
         , ".rp-tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 24px; }"
         , ".rp-tag { font-size: 12px; color: var(--roux-accent); border: 1px solid rgba(184,92,56,0.25); border-radius: 4px; padding: 2px 10px; }"
+        , ".rp-history-section { border-top: 0.5px solid rgba(61,40,23,0.15); padding-top: 24px; margin-top: 0; }"
         , ""
         , "@media (max-width: 720px) { .rp-page { padding: 24px 24px 60px; } .rp-meta-strip { flex-direction: column; align-items: flex-start; } .rp-meta-strip-actions { width: 100%; justify-content: flex-end; } .rp-body-grid { grid-template-columns: 1fr; gap: 32px; } .rp-title { font-size: 30px; } }"
         ]
@@ -999,25 +1000,29 @@ renderRecipe filename recipe entries = do
         -- Hero image
         rpHeroImage meta filename
         -- Body grid
+        -- Body grid: ingredients | method
+        let sections = NE.toList (recipeSections recipe)
+        -- Body grid: ingredients | method
         H.div ! A.class_ "rp-body-grid" $ do
-            -- Left column: servings, ingredients, method
+            -- Left column: servings + ingredients
             H.div $ do
                 case metaServings meta of
                     Just s -> do
                         H.div ! A.class_ "rp-section-label" $ "Serves"
                         H.div ! A.class_ "rp-serves" $ H.toHtml (showServings s)
                     Nothing -> pure ()
-                let sections = NE.toList (recipeSections recipe)
                 H.div ! A.class_ "rp-section-label" $ "Ingredients"
                 rpIngredientList sections
+            -- Right column: method
+            H.div $ do
                 H.div ! A.class_ "rp-section-label" $ "Method"
                 rpMethodList sections
-            -- Right column: cook history rail
+        -- Cook history full-width below grid
-            H.aside $ do
+        H.aside ! A.class_ "rp-history-section" $ do
-                H.div ! A.class_ "rp-section-label" $ do
+            H.div ! A.class_ "rp-section-label" $ do
-                    H.span "Cook history"
+                H.span "Cook history"
-                    H.button ! A.class_ "rp-btn-ghost roux-record-trigger" ! H.dataAttribute "filename" (H.toValue (T.pack filename)) $ "+ Add"
+                H.button ! A.class_ "rp-btn-ghost roux-record-trigger" ! H.dataAttribute "filename" (H.toValue (T.pack filename)) $ "+ Add"
-                rpHistoryList entries
+            rpHistoryList entries
         -- Tags
         let tags = metaTags meta
         unless (null tags) $