PDF cover: cream card layout matching in-app HTML cover

Replace full-bleed approach with cream paper background + framed FLUX
illustration (sun inner border, ink outer border) + title below + badge —
identical visual language to the HTML cover shown in the app.

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

book_builder.py

@@ -226,70 +226,71 @@ def render_cover_image(
     Falls back to cream-background design when no illustration is available.
     """
     W, H = 1240, 1754
-    sun    = (244, 198, 74)
-    leaf   = (116, 184, 90)
-    white  = (255, 255, 255)
-    ink    = (46, 42, 38)
-    berry  = (214, 81, 122)
-    dark   = (30, 26, 24)
+    sun   = (244, 198, 74)
+    leaf  = (116, 184, 90)
+    white = (255, 255, 255)
+    ink   = (46, 42, 38)
+    berry = (214, 81, 122)
 
     if first_page_bytes:
-        # --- Full-bleed FLUX illustration cover ---
-        src = Image.open(io.BytesIO(first_page_bytes)).convert("RGB")
-        # Scale-and-crop to fill A4 exactly
-        src_r = src.width / src.height
-        tar_r = W / H
-        if src_r > tar_r:
-            new_h, new_w = H, int(H * src_r)
-        else:
-            new_w, new_h = W, int(W / src_r)
-        src = src.resize((new_w, new_h), Image.LANCZOS)
-        left = (new_w - W) // 2
-        top  = (new_h - H) // 2
-        base = src.crop((left, top, left + W, top + H)).convert("RGBA")
-
-        # Dark banner overlays (semi-transparent)
-        ov = Image.new("RGBA", (W, H), (0, 0, 0, 0))
-        dov = ImageDraw.Draw(ov)
-        # Top strip (kicker)
-        dov.rectangle([0, 0, W, 170], fill=(*dark, 210))
-        # Bottom strip (title + badge)  — taller when title is long
-        dov.rectangle([0, H - 540, W, H], fill=(*dark, 215))
-        # Decorative inner border
-        for i in range(3):
-            dov.rectangle([i*10, i*10, W - i*10, H - i*10],
-                          outline=(255, 255, 255, 60), width=2)
-
-        img = Image.alpha_composite(base, ov).convert("RGB")
+        # --- Cream card cover: same layout as the in-app HTML cover ---
+        cream = (255, 248, 230)
+        img = Image.new("RGB", (W, H), cream)
         draw = ImageDraw.Draw(img)
+        _paper_grain(img, amount=5000)
 
         # Kicker
-        font_kicker = _load_font(FONT_CAVEAT, 68)
-        draw.text((W // 2, 88), "✨  a DoodleBook story  ✨",
-                  font=font_kicker, fill=sun, anchor="mm")
-
-        # Title
-        font_title = _load_font(FONT_GAEGU, 108)
-        lines = _wrap_title(title, font_title, W - 140)
-        line_h = 128
-        total_h = len(lines) * line_h
-        y0 = H - 510 + max(0, (460 - total_h)) // 2
+        font_kicker = _load_font(FONT_CAVEAT, 66)
+        draw.text((W // 2, 118), "✨  a DoodleBook story  ✨",
+                  font=font_kicker, fill=berry, anchor="mm")
+
+        # FLUX illustration — square-crop & resize to 900 px
+        src = Image.open(io.BytesIO(first_page_bytes)).convert("RGB")
+        min_d = min(src.width, src.height)
+        src = src.crop(((src.width - min_d) // 2, (src.height - min_d) // 2,
+                        (src.width + min_d) // 2, (src.height + min_d) // 2))
+        src = src.resize((900, 900), Image.LANCZOS)
+
+        # Frame: sun inner (12 px) + ink outer (16 px), rounded corners
+        pad_inner, pad_outer = 12, 16
+        pad = pad_inner + pad_outer
+        ix, iy = (W - 900) // 2, 200          # top-left of image
+        # Ink outer border
+        draw.rounded_rectangle(
+            [ix - pad, iy - pad, ix + 900 + pad, iy + 900 + pad],
+            radius=30, fill=ink,
+        )
+        # Sun inner border
+        draw.rounded_rectangle(
+            [ix - pad_inner, iy - pad_inner, ix + 900 + pad_inner, iy + 900 + pad_inner],
+            radius=20, fill=sun,
+        )
+        # Paste illustration
+        img.paste(src, (ix, iy))
+        draw = ImageDraw.Draw(img)
+
+        # Title — below frame
+        font_title = _load_font(FONT_GAEGU, 100)
+        lines = _wrap_title(title, font_title, W - 160)
+        line_h = 118
+        y0 = iy + 900 + pad + 56
         for i, line in enumerate(lines):
             cy = y0 + i * line_h
             draw.text((W // 2 + 3, cy + 3), line, font=font_title,
                       fill=sun, anchor="mm")
             draw.text((W // 2, cy), line, font=font_title,
-                      fill=white, anchor="mm")
+                      fill=ink, anchor="mm")
+        total_h = len(lines) * line_h
 
         # Badge
         font_badge = _load_font(FONT_GAEGU, 46)
         bb = font_badge.getbbox(badge_text)
         tw, th = bb[2] - bb[0], bb[3] - bb[1]
         bx = W // 2 - (tw + 44) // 2
-        by = H - 72
-        draw.rounded_rectangle([bx, by - th - 16, bx + tw + 44, by],
+        by = max(y0 + total_h + 60, H - 160)
+        draw.rounded_rectangle([bx, by, bx + tw + 44, by + th + 24],
                                radius=14, fill=leaf)
-        draw.text((W // 2, by - th // 2 - 8), badge_text,
+        draw.text((W // 2, by + th // 2 + 12), badge_text,
                   font=font_badge, fill=white, anchor="mm")
 
     else: