You are redesigning a client's website into a polished static preview.

Follow these standing rules exactly:
1. Build a redesigned static website preview in ./dist.
2. Preserve the core business content and intent from the source site, but improve structure, visual hierarchy, and conversion clarity.
3. Make the result client-presentable, premium, and intentionally art-directed.
4. Ensure ./dist/index.html exists and all asset paths are relative so the preview works under a subpath.
5. Prefer HTML/CSS/vanilla JS unless a tiny static framework is clearly justified. Do not require a build step for previewing.
6. Write a concise implementation summary to ./dist/redesign-summary.md.
7. Before finishing, verify the preview files exist in ./dist.

Skill directives:
## website-audit
Role: audit the captured source website before redesigning it.

You must:
- identify the current page structure and section order
- note weak hierarchy, weak CTAs, visual clutter, and missing trust signals
- preserve useful business details from the source
- improve structure, not just styling

Avoid:
- copying weak legacy layout decisions directly
- preserving filler sections that do not help the client convert

## design-direction
Role: define a clear visual direction before implementation.

You must:
- infer a coherent design concept from the references and brand notes
- choose typography with intent
- define palette, density, spacing rhythm, and image treatment
- create a premium, memorable mood instead of a generic template look

Avoid:
- safe default startup aesthetics
- weak font choices and flat white-page layouts

## layout-composer
Role: compose a stronger page structure than the source site.

You must:
- reorder sections if it improves clarity and conversion
- give the hero a clear visual anchor and CTA
- use sections with distinct rhythm and pacing
- create a narrative flow from introduction to proof to action

Avoid:
- repetitive blocks with identical spacing
- dumping all content into one long undifferentiated column

## frontend-art-direction
Role: enforce implementation taste in the final HTML/CSS.

You must:
- produce a client-presentable result with deliberate typography and spacing
- make desktop and mobile both feel designed, not merely responsive
- use a few meaningful visual accents or animations where appropriate
- keep the output self-contained and previewable without a build step

Avoid:
- default system-font landing pages
- purple-on-white defaults
- generic section padding and low-contrast hierarchy

## design-critic
Role: critique the design before finalizing.

You must verify:
- the page feels premium and intentional
- the CTA path is obvious
- text is readable and hierarchy is strong
- the layout has enough contrast, spacing, and visual variety
- the result does not feel like a generic AI landing page

If a weak area is obvious, fix it before finishing instead of merely noting it.

## restaurant
Industry pack: restaurant

Prioritize:
- appetite appeal through imagery, texture, and atmosphere
- clear reservation or visit CTA
- strong display of cuisine identity and location
- concise menu highlights rather than overwhelming full-menu dumps
- trust signals such as awards, reviews, ambiance, or longevity

Visual guidance:
- cinematic hero treatment
- editorial typography can work well if readability stays strong
- use warmth, depth, and material contrast instead of sterile SaaS composition


Pre-generation design guardrails:
- Do not use overused default fonts like Inter, Roboto, Open Sans, Lato, Montserrat, or Arial as the primary personality font unless the reference blueprint explicitly requires them.
- Do not use gradient text, decorative background-clip text, or flashy AI-tell effects.
- Ensure body text and CTA text clearly exceed WCAG AA contrast; do not leave near-failing warm-on-cream combinations.
- Do not animate layout properties like width, height, padding, or margin. Prefer transform and opacity.
- Avoid uppercase for long body copy; reserve it for short labels only.
- Avoid generic SaaS hero composition. The first draft should already feel editorial and reference-led.


Operator controls:
- Industry: restaurant
- Generator profile: quality
- Source expansion mode: balanced
- Search enrichment: True
- Search budget: 4
- Design goal: Make the diner feel more upscale and image-led while keeping it friendly and local.
- Brand notes: Warm hospitality, stronger food imagery, clearer reservations and menu CTAs.
- Additional instructions: None
- Prompt append: None


Business profile:
- Business name: Princess Maria Diner
- Category: restaurant
- Address: 2044 Rte 35 North, Wall NJ 07719
- Phone: 732-282-1722
- Hours: 7:00am - 10:00pm
- Source description: Princess Maria Diner in Wall, NJ. Call us at (732) 282-1722. Check out our location and hours, and latest menu with photos and reviews.
- Core highlights:
  - family-owned
  - over 30 years
  - breakfast
  - lunch
  - dinner
  - exceptional service


Source website context:
- URL: https://princessmariadiner.com/
- Captured source HTML is available under ./source
- Source title: Princess Maria Diner - Restaurant in Wall, NJ
- Completeness score: 1.00
- Completeness notes:
  - source markdown has usable length
  - metadata description found
  - important internal links discovered
  - logo-like asset found
  - multiple visual assets found
  - business facts present in extracted content
    - Source summary:
2044 Rte 35 North, Wall NJ 07719

[732-282-1722](tel:7322821722)

Opening Hours : 7:00am - 10:00pm

[](https://x.com/Mariadiner)
[](https://www.facebook.com/Princess-Maria-Diner-115652971791226/)

[![Princess Maria Diner](https://princessmariadiner.com/assets/logo-418779bfc65e80a126fe5aaad4864e1b6a9e9f5369431ad16d2a56cf3e745230.png)](https://princessmariadiner.com/)

![Princess Maria Diner](https://princessmariadiner.com/cdn/rs3ha06vhp7te2p5sjnr2es9ua1d/pork-roll-egg-cheese-bkgd.jpg)

Serving...
- Important discovered links:
  - https://princessmariadiner.com
  - https://princessmariadiner.com/menu
  - https://princessmariadiner.com/gallery
  - https://princessmariadiner.com/contact
- Source visual cues:
  - brightness=light
  - contrast=high
  - saturation=muted
  - palette=#ffffff, #3a312b, #b3a382, #eceeee, #fffdf9
  - mood=light airy base, high contrast framing, muted color restraint, strong vertical section rhythm, long-scroll editorial pacing


Design references:
- URL: https://haven-annecy.fr/en
  Focus: Borrow the premium hospitality pacing, restrained palette, and image-led visual rhythm.
  Title: Home | Haven Annecy
  Mood signals: image-led composition
  Structure cues: sections=4, images=28, headings=6, nav=False
  Desktop snapshot: brightness=light, contrast=moderate, saturation=restrained, palette=#fffaf7, #b2623d, #e6dace, #fffaf6, #fefbf8, bands=20
  Desktop mood: light airy base, strong vertical section rhythm, long-scroll editorial pacing
  Mobile snapshot: brightness=light, contrast=moderate, saturation=restrained, palette=#fffaf7, #c1643b, #faf7f5, #fffcf9, #e1cfc5, bands=30
  Mobile mood: light airy base, strong vertical section rhythm, long-scroll editorial pacing
  Content notes: [Skip to main content](https://haven-annecy.fr/en#main-content " Skip to main content")

*   [En](https://h...

Reference design blueprint:
- URL: https://haven-annecy.fr/en
  Blueprint focus: Borrow the premium hospitality pacing, restrained palette, and image-led visual rhythm.
  Typography: display=serif display, body=clean sans, uppercase_accents=False
  Color system: palette=#fffaf7, #b2623d, #e6dace, #fffaf6, #fefbf8, brightness=light, contrast=moderate, saturation=restrained
  Spacing system: section_padding=, gaps=, radius=, content_width=
  Components: header=minimal, hero=explicit hero section, buttons=minimal, cards=light panels
  Composition: image_density=high, desktop_pacing=long-scroll editorial pacing, mobile_pacing=long-scroll mobile rhythm, sections=4

External enrichment:
- None used (source content considered sufficient)

Image and asset strategy:
Use a hybrid approach: preserve any usable logo or brand mark, reuse good source photos when credible, and supplement weak imagery with high-quality external/editorial imagery.
External imagery is allowed.
Reusing source images is encouraged when quality is acceptable.

Detected source asset candidates:
- https://princessmariadiner.com/assets/logo-418779bfc65e80a126fe5aaad4864e1b6a9e9f5369431ad16d2a56cf3e745230.png (logo)
- https://princessmariadiner.com/cdn/rs3ha06vhp7te2p5sjnr2es9ua1d/pork-roll-egg-cheese-bkgd.jpg (general)
- https://princessmariadiner.com/assets/gallery/coffee-bar-at-work-58aa315144eff144fad230833006e90bc61ea18ff0b451b5d7cf83ade7400bbf.jpg (general)
- https://princessmariadiner.com/assets/gallery/coffee-bar-close-up-view-d66c956fc6ac1fbc7ced300098a2b4174e7f1523530ab1289262a74959c97a3c.jpg (general)
- https://princessmariadiner.com/assets/gallery/dining-room-view-847520a3a0c82cd87a78e55b6962498c7cddab980f6bae088c58229b9757c6bd.jpg (general)
- https://princessmariadiner.com/assets/gallery/steak-entree-2-2c3eb0c5091920a5295bdda1f40a77c65b3d394696e8903dae9b1c01df647b3f.jpeg (general)
- https://princessmariadiner.com/assets/gallery/team-photo-2-a3feac0fd7043cc31d6de016f8a90ab60a2c0747222672063eb1dfe60936cfcf.jpg (general)
- https://princessmariadiner.com/assets/gallery/nutella-waffle-and-strawberries-396328ff5021328b6ee8f9b3311973c98c502d864f6f9ecb550fb07cda183172.jpg (general)


Implementation expectations:
- Use the design references for layout, typography, spacing, rhythm, and visual tone, but do not copy branding directly.
- Treat each reference site's Focus note as the instruction for what to borrow from that site.
- Match the dominant reference site's visual system deliberately: typography feel, spacing scale, image density, and section cadence should be recognizably inspired by it.
- Use the reference design blueprint as a concrete system, not just loose inspiration. Re-express the source business in that structural and component language.
- Copy reusable design mechanics from the reference where appropriate: container widths, section cadence, serif/sans relationship, button silhouette, card softness, and header/hero treatment.
- Use the screenshot-derived visual cues from the reference to shape the page mood, visual density, and pacing, not just the reference text summary.
- If the source site's imagery is weak, preserve any usable logo/brand marks and upgrade the preview with better image treatment rather than leaving the page imageless.
- If external images are allowed, you may use tasteful editorial/stock imagery that fits the brand and note that choice in redesign-summary.md.
- If the captured content is incomplete, infer sensible placeholders while keeping the preview coherent.
- Avoid generic AI landing-page patterns, default fonts, and flat section stacking.