Product Mockup Design

Create professional product mockups and showcases. Two paths:

• Gemini (default for physical products): product photo + prompt -> photoreal staged scene, packaging, lifestyle shot
• HTML/CSS (default for app/web screenshots): Gemini redraws UI and will alter text, icons, and layout, so wrap real screenshots in CSS device frames (Steps 3-9) and render to PNG. For a photoreal device scene, generate the scene with a blank screen, then composite the screenshot in code

Step 1: Load Design Context

1. Read .agents/design-context.md first -- brand colors (hex), fonts, style archetype
2. If missing, use the design-context Default Fallbacks and tell the user defaults were used
3. Product mockups should match the brand's design style (minimal, bold, luxurious, etc.)

Gemini Image Generation Path