The live demo was built from exactly this text — nothing added. The other cases only change the values of the [VARIABLES].

# Wedding Invitation and RSVP Website

Build this website exactly as described below. Replace the [VARIABLES] with your own values; keep everything else.

## Brief
A single-page wedding invitation for [BRAND], marrying at [VENUE] in [CITY] on [DATE]. It must feel like a printed suite come alive: an ivory hero with the names in an elegant serif and a live countdown to [DATE], a four-chapter story, the schedule of the day as a vertical timeline, travel and stay notes with invented hotels, an RSVP form (attending, party size, meal choice, dietary notes, one song request) that saves a thank-you card client-side, a guest FAQ and drawn registry placeholder cards. One page: index.html with sections (#story, #day, #travel, #rsvp, #faq, #registry). Everything runs in the browser; nothing is submitted anywhere.

- Audience: The guest list: college friends, extended family, colleagues and plus-ones, ages 9 to 90, mostly opening the link from a group chat on a phone. They want to know where, when, what to wear, where to sleep and how to say yes — in under three minutes.
- Goal: Get every guest to a submitted RSVP and a booked hotel. Within ten seconds a visitor should know who, where and when, and see the countdown; within two minutes they should have answered the RSVP.
- Tone: Warm, personal and lightly funny, like the couple wrote it themselves on a good writing day. Short paragraphs, concrete details (times, walking minutes, menu names), no formal invitation clichés, no exclamation marks.

## Stack
- Framework: Vite 5 + React 18 + TypeScript
- Styling: Tailwind CSS 3.4
- Libraries: react (MIT), react-dom (MIT), motion (motion.dev, import from 'motion/react') (MIT), lucide-react (ISC), tailwindcss (MIT), postcss (MIT), autoprefixer (MIT), vite (MIT), @vitejs/plugin-react (MIT), typescript (Apache-2.0), @fontsource/gilda-display (OFL-1.1), @fontsource/jost (OFL-1.1)
- Build: `npm run build` → static files in `dist/`. No backend, no server code, no external APIs.
- Setup:
  - Scaffold with npm create vite@latest using the react-ts template. One HTML page at the project root: index.html (entry src/main.tsx).
  - vite.config.ts: base './', plugins [react()], build { outDir 'dist', sourcemap false, assetsInlineLimit 0 }. Do not copy src/ into dist/.
  - Tailwind 3.4 through PostCSS (tailwindcss + postcss + autoprefixer), content ['./index.html', './src/**/*.{ts,tsx}']. In tailwind.config.ts add every color under Design to theme.extend.colors with kebab-case keys (ivory, paper, linen, sage, olive, blush, blush-deep, ink, stone, rule) and fontFamily display ['Gilda Display', 'Georgia', 'serif'], sans ['Jost', 'system-ui', 'sans-serif']. Set borderRadius DEFAULT to 14px and add maxWidth { container: '1080px' } — an invitation is narrower than a shop.
  - In src/fonts.ts import '@fontsource/gilda-display/400.css' and '@fontsource/jost/300.css', '@fontsource/jost/400.css', '@fontsource/jost/500.css'; import src/fonts.ts and src/index.css from the entry file.
  - File layout: src/content.ts (every string, number, chapter, timeline entry, hotel, meal, FAQ answer and registry card, typed), src/lib/brand.ts (brandSlug = [BRAND] lowercased with every run of non-alphanumeric characters replaced by '-', coupleInitials = first letter of each name of [BRAND] uppercased joined with '&' (E&M), hashtag = '#' + brandSlug without hyphens or spaces capitalized per word), src/lib/storage.ts (safe localStorage get/set wrapped in try/catch, keys prefixed with brandSlug + ':'), src/lib/countdown.ts (timeLeft(target) → { days, hours, minutes, seconds, done } from parsing [DATE]).
  - State: src/store/rsvp.ts is a tiny external store (useSyncExternalStore) holding the draft { name, attending, party, meal, dietary, song } and the saved answer, persisted to localStorage key brandSlug + ':rsvp'. A saved answer renders the thank-you card; 'Change your answer' clears it back to the form with values pre-filled.
  - Components in src/components/: Header.tsx (anchor nav), Reveal.tsx (Motion whileInView wrapper), Botanical.tsx (a corner sprig SVG, mirrored via transforms), Countdown.tsx (four cells), Heart.tsx (small drawn SVG heart), Footer.tsx; Hero.tsx, Story.tsx (ChapterCard.tsx), DaySchedule.tsx (TimelineRow.tsx), TravelStay.tsx (HotelCard.tsx, VenueSketch.tsx inline SVG), Rsvp.tsx (AttendingToggle.tsx, PartyStepper.tsx, MealPicker.tsx, ThankYouCard.tsx), Faq.tsx, Registry.tsx (RegistryCard.tsx drawn placeholder). src/pages/Home.tsx composes them.
  - Before the first build, download every image listed under Assets into public/images/ with curl -L -o using the exact file names given. The build itself never fetches anything.
  - public/favicon.svg as described under Assets. index.html: lang en, <meta name='theme-color' content='#F8F5EE'>, <link rel='icon' href='./favicon.svg' type='image/svg+xml'>, <title>[BRAND] — [VENUE], [CITY]</title>.
  - Write ASSETS.md at the project root as described under Assets.
  - dist/ holds index.html, hashed JS/CSS, the woff2 fonts, favicon.svg and the six images. Keep it under 10 MB.

## Variables
- [BRAND] — The couple (default: "Elena & Marcus"). The couple's names as they'll appear on the invitation, 'Name & Name'. Used in the hero wordmark, title, hashtag (from the slug), couple initials in the footer and the RSVP's saved key. Always invented people.
- [VENUE] — Venue (default: "Hollowbrook Barn"). The invented venue name. Used in the hero line, the venue sketch label, travel copy and hotel distances. Two common English words; never a real venue.
- [CITY] — City (default: "Hudson, New York"). Where the venue is. Used in the hero line, travel directions (train station, drive times) and the footer. Real towns are fine; streets and hotels stay invented.
- [DATE] — Wedding date (default: "June 12, 2027"). The full future date the countdown runs to, written like 'June 12, 2027'. Drives the countdown, the hero line and the story's last chapter. Always in the future so the countdown is live.
- [CREDIT] — keep a small "Template by VibeFather" link to https://vibefather.ai/t/wedding-invitation-and-rsvp-website in the footer (default: yes; delete this line to remove it)

The copy under Pages & Sections is written for the default values. If your values differ, rewrite every headline, paragraph, label and image for them — same length, tone and structure. Layout, colors, type and motion stay as described.
Keep all copy, image paths and links in one content file (for example `src/content.ts`), keyed by section, so the content can be swapped later without touching components.

## Design
### Colors
- Ivory `#F8F5EE` — Page background throughout.
- Paper `#FDFBF7` — Card surfaces (story chapters, hotels, RSVP panel, registry cards).
- Linen `#F0EBDF` — Alternate section background (Schedule, Registry), input fill, chip hover.
- Sage `#8A9B84` — Botanical line work, chapter markers, timeline dots, selected chips, eyebrows.
- Olive `#4E5A48` — Secondary text on light backgrounds, timeline times, captions, icon color.
- Blush `#C98D84` — The one warm accent: hearts, countdown numbers, the attending 'Joyfully accepts' state, focus ring.
- Blush Deep `#B26F66` — Blush hover state, primary button pressed, meal selected border.
- Ink `#32362F` — Names, headlines and body text, primary outline buttons.
- Stone `#6B6F63` — Muted body text, secondary buttons, disabled fields.
- Rule `#E2DCCF` — 1px hairlines, card borders, input borders, timeline base line.

### Typography
- Display: the couple's names, H1, H2, H3, chapter titles, timeline titles, countdown numbers, the wordmark: Gilda Display (OFL), weights 400
- Text and UI: body, eyebrows, buttons, nav, form fields, timeline times (font-variant-numeric tabular-nums), captions: Jost (OFL), weights 300/400/500

### Layout & motion
- Spacing: 8px base unit. Container max-width 1080px, centered, side padding 48px desktop, 32px tablet, 20px under 640px. Section vertical padding 112px desktop, 80px under 1024px, 64px under 640px. Type scale: H1 (the names) clamp(56px, 9vw, 120px) Gilda Display 400, line-height 1.04, letter-spacing 0.01em; H2 clamp(32px, 4vw, 52px) Gilda 400; H3 24px Gilda 400; ampersand between names set in Sage italic via Cormorant-free fallback (Gilda has no italic — set '&' in Jost 300 italic instead); lead Jost 300 18px / 1.75 Ink at 85%; body Jost 400 16px / 1.8 (max-width 64ch); eyebrow Jost 500 12px uppercase letter-spacing 0.2em Olive with a 16px drawn sprig glyph before; caption Jost 400 13px Olive. Buttons: height 50px, padding 0 28px, Jost 500 14px letter-spacing 0.12em uppercase. Primary: Ink fill, Paper text. Secondary: 1px Olive border, Olive text. Inputs: height 50px, 1px Rule border, Paper fill, 16px Jost, focus border Sage. Focus ring everywhere: 2px Blush outline with 3px offset.
- Radius: 14px on cards, inputs, chips, photos and the RSVP panel. 999px only for chips, the party stepper buttons, timeline dots and the heart.
- Motion: Easing: --ease-out cubic-bezier(0.22, 0.61, 0.36, 1) for reveals and the countdown; --ease-io cubic-bezier(0.65, 0, 0.35, 1) for accordions and the RSVP swap. Slow and soft — this is paper, not software.
- Motion: Reveal: blocks wrapped in <Reveal> start at opacity 0, translateY(16px) and animate to rest over 900ms --ease-out when 15% visible (Motion whileInView, viewport once). Siblings stagger by 100ms (index prop).
- Motion: Hero: the two names fade and rise from translateY(20px) with 200ms stagger 400ms after load, then the ampersand sprig draws (stroke-dashoffset to 0) over 1200ms, then the countdown fades in. The hero photo (top half, photo hero-barn.webp) scales from 1.05 to 1.0 over 2600ms; scrolling translates it 0 to 8% (Motion useScroll, offset ['start start', 'end start']).
- Motion: Countdown: the four cells sit on one hairline; each tick crossfades only the changed digit (a 240ms y-slide), never a flip-clock. Under prefers-reduced-motion the digits swap instantly.
- Motion: Story chapters: each chapter card reveals with its marker dot filling Sage; the connecting hairline draws downward as the section scrolls (scaleY 0 to 1, transform-origin top, useScroll on the list).
- Motion: Timeline (schedule): rows reveal with 100ms stagger; each time crossfades when its row enters; the dot pops from scale 0.6 once.
- Motion: RSVP: the attending toggle slides a small drawn heart between 'Joyfully accepts' (Blush) and 'Regretfully declines' (Stone); meal chips fill Sage when selected; party stepper counts with a 200ms scale pulse; submitting slides the form out and the ThankYouCard in (16px rise, 320ms --ease-io, AnimatePresence mode 'wait'); the card's heart draws its outline over 700ms.
- Motion: FAQ accordions: height 0 to auto and opacity 0 to 1 over 340ms --ease-io; the Plus rotates 45 degrees into an X.
- Motion: Registry cards: hover lifts 4px and the drawn ribbon straightens (a tiny 6px rotate settles to 0).
- Motion: Header: transparent over the ivory page with Ink text; after 40px of scroll it gets Ivory at 92% opacity, backdrop-filter blur(8px) and a 1px Rule border, 250ms transition. Anchor nav always visible with .link-draw underlines.
- Motion: prefers-reduced-motion: reduce — disable the photo scale and parallax, name rise, sprig draws, count-ups, layout animations (render at rest; countdown digits swap instantly). Color and border hover changes stay. Use CSS @media in index.css plus Motion's useReducedMotion in components.
- Imagery: Real photography only, soft and romantic, all six made for this template in one consistent style: soft garden light, ivory and sage with blush accents, shallow depth of field, fine grain. Never a person: the venue, florals, stationery, table settings and candles — no faces, no hands, no rings on fingers. No readable text anywhere — stationery stays blank. Every photo uses object-fit cover with the object-position given under Assets, 14px corners, no shadow; photos on Ivory get a 1px Rule outline. Captions under photos in Jost 13px Olive. Drawn in code: the botanical corner sprigs, chapter markers, timeline dots, the heart, the venue sketch and the registry placeholder cards. Icons: lucide-react only, stroke width 1.5.

## Pages & Sections
### Invitation (`index.html`)
1. **Content file and copy rules** — All copy below is written for the default values ([BRAND] = Elena & Marcus, [VENUE] = Hollowbrook Barn, [CITY] = Hudson, New York, [DATE] = June 12, 2027). Put every string, number and list in src/content.ts and render from it. If any variable value differs, rewrite every headline, chapter, timeline entry, hotel, direction, meal, FAQ answer and registry card so it is specific and believable for the new couple, keeping the same structure and counts (4 chapters, 6 timeline entries, 2 hotels, 3 meals, 5 FAQs, 3 registry cards). All people, places, hotels and shops are invented. Facts used throughout: hashtag '#ElenaAndMarcus' from the slug; ceremony 3:00pm at [VENUE]; the venue is a restored 1880s dairy barn with gardens; arrivals from 2:30pm; train: Amtrak to Hudson station, 10 minutes by taxi; drive: two hours north of the city, parking in the meadow; shuttle bus from both hotels at 2:00pm and 2:20pm, back at 11:30pm; hotels: 'The Hollowbrook Inn' a five-minute stroll (link '#', placeholder), 'Riverside Lodge' ten minutes by car (link '#'); meals: 'Braised beef with roots', 'Roast salmon with fennel', 'Garden risotto'; dietary captured free-text; dress code 'garden formal, block heels sink in grass'; ceremony unplugged; kids welcome at the brunch, evening is adults-only; registry: three invented shops ('The Hearth Shop', 'Wander & Co', 'Kitchen Garden'), all links '#'.
   Layout: n/a
   Motion: n/a
2. **Header (anchor nav)** — Centered wordmark: the couple initials 'E & M' in Gilda Display 20px linking to ./index.html. Nav below (Jost 500 14px, letter-spacing 0.08em): 'Our story' → #story, 'The day' → #day, 'Travel & stay' → #travel, 'RSVP' → #rsvp, 'FAQ' → #faq, 'Registry' → #registry. On mobile the nav scrolls horizontally under the wordmark. The 'RSVP' link gets a small drawn heart after it in Blush.
   Layout: Fixed top, Ivory/92% with blur after 40px of scroll, height 104px total (wordmark row 56px + nav row 48px), centered container. Body gets matching top padding.
3. **Hero** — Top half: photo hero-barn.webp (full container width, aspect 21:9 on desktop, 16:10 mobile) under a soft Ivory gradient at the bottom edge. Below it, centered on Ivory: eyebrow sprig line 'Together with their families'; the names 'Elena' and 'Marcus' on either side of a Jost 300 italic Sage ampersand at H1 size; then Jost 300 20px '[VENUE] · [CITY]'; then 'Save the afternoon of [DATE]' in Jost 400 16px Olive; then the hashtag '#ElenaAndMarcus' in Blush 500. Below, the countdown: four cells (Gilda Display 400 40px Ink numbers over Jost 500 11px uppercase letter-spacing 0.18em Olive labels) 'days · hours · minutes · seconds' counting to [DATE] 3:00pm local. Under the countdown, one primary button 'RSVP by April 1' → #rsvp and secondary 'See the day' → #day. Caption: 'Formal invitation to follow by post; this page is the one that updates.'
   Layout: Hero photo 1px Rule outline, 14px radius, 32px margin under the header. Names row wraps under 640px with the ampersand centered on its own line. Countdown cells separated by 1px Rule verticals, 48px total height, on a single 1px Rule top and bottom border inset 20%. Buttons centered with 16px gap; caption 24px below.
4. **Our story** — Section id='story'. Eyebrow 'How we got here' and H2 'Four chapters, one barn.' Chapters on a vertical hairline: 1) marker '2019' — 'A borrowed umbrella' — 'Elena lent Marcus an umbrella outside a bookstore and got it back three weeks later, with a receipt for two coffees she never drank. He had done the math; she did the forgiving.' 2) '2021' — 'One apartment, two bookshelves' — 'A move across the city turned into a shared lease. The bookshelves merged badly; everything else merged easily.' 3) '2024' — 'The question' — 'On the bridge where the umbrella finally died, Marcus asked. Elena said yes before he finished the sentence, which he has never let her forget.' 4) '2027' — 'You are here' — 'A barn in [CITY], everyone we love, and a playlist that starts polite. Thank you for being chapter four.'
   Layout: Ivory background. Header centered. Chapters: vertical hairline center-left on desktop (marker year in Gilda 28px Sage left of the line, card right), stacked under 768px. Cards on Paper 1px Rule border 28px padding, title Gilda 24px, body Jost 16px / 1.8.
5. **The day** — Section id='day'. Eyebrow 'June 12' and H2 'The shape of the day.' Vertical timeline: '2:30pm — Arrivals & lemonade' — 'Gates open; find a seat, find a friend, find the shade.'; '3:00pm — The ceremony' — 'In the garden. Unplugged — our photographer is quick, we promise.'; '4:00pm — Cocktails on the lawn' — ' Lawn games for the competitive, chairs for the wise.'; '6:00pm — Dinner in the barn' — 'Long tables, short speeches, three suppers to choose from.'; '8:00pm — Toasts & cake' — 'Speak now or forever hold your prosecco.'; '9:00pm — Dancing' — 'The band starts polite. It does not stay polite.'; '11:30pm — Last song & shuttles' — 'The shuttle loops to both hotels until everyone is home.'
   Layout: Linen background. Centered header. Timeline: hairline at left 32px column with Sage dots, time Gilda 26px Ink (tabular-nums via Jost for the digits — set times in Jost 500 16px and the period label in Gilda; keep one style for all rows), title Gilda 24px, note Jost 15px Olive. Rows reveal with stagger; 1px Rule dividers. Photo strip after the timeline: three photos side by side (flowers-table.webp 'The palette', stationery.webp 'The suite', candles-evening.webp 'The evening') aspect 4:3, captions below.
6. **Travel and stay** — Section id='travel'. Eyebrow 'Getting there' and H2 'The barn, the beds, the way home.' Left column, the VenueSketch (inline SVG line drawing of a barn with gardens, labeled '[VENUE]' in Sage) and the venue paragraph: 'A restored 1880s dairy barn ten minutes outside town — gardens for the ceremony, string lights for the dancing, meadow parking for the practical. The ground is grass: block heels, not stilettos.' Getting-there rows with Lucide icons: TrainFront 'By train' — 'Amtrak to Hudson station; the venue is a 10-minute taxi. We'll post a shared-cab list closer to the day.'; Car 'By car' — 'About two hours north of the city. Turn at the farm stand with the giant pumpkins — that's the one. Parking in the meadow, follow the lights.'; Bus 'Shuttle' — 'A shuttle loops from both hotels at 2:00pm and 2:20pm, and back from the last song until everyone's home.' Right column, two HotelCards on Paper: 'The Hollowbrook Inn' — 'A five-minute stroll from the barn. Twelve rooms held under [hashtag] until March 1; mention the wedding for the rate.' — link '#' caption 'Placeholder link for the couple to fill in'; 'Riverside Lodge' — 'Ten minutes by car, breakfast worth the drive. Pet friendly, for the plus-ones with paws.' — link '#' same caption.
   Layout: Ivory background. Two columns: venue + travel rows (7 cols), hotels (4 cols, offset 1) stacked with 24px gaps. Travel rows: icon in 44px Linen rounded square. Sketch SVG viewBox 0 0 480 360 width 100%, Rule strokes, Sage accents.
7. **RSVP** — Section id='rsvp'. Eyebrow 'RSVP' and H2 'Say yes (or no, gently).' A Paper panel: name input (placeholder 'Your name as the envelope spelled it'); attending toggle — two chips with a sliding heart, 'Joyfully accepts' (Blush when active) / 'Regretfully declines' (Stone when active); party stepper 'Seats in your party' 1–4 (stepper with Minus/Plus, count Gilda 28px); meal picker (three chips with one-line notes): 'Braised beef with roots' — 'short ribs, carrots, mash'; 'Roast salmon with fennel' — 'herb butter, new potatoes'; 'Garden risotto' — 'peas, mint, parmesan — the vegetarian plate'; dietary input (placeholder 'Allergies, aversions, strong feelings'); song input (placeholder 'One song that fills the floor'); primary button 'Send our answer' with caption 'Saved right here in this browser — nothing is posted anywhere; the couple checks the list by candlelight.' On submit (name + attending + meal required): ThankYouCard on Linen — drawn heart with its outline animating, 'Thank you, [NAME].' in Gilda 32px, summary lines ('2 seats · Roast salmon with fennel' or 'You'll be missed — we''ll raise a glass.' for declines, dietary and song echoed), buttons 'Change your answer' (returns to the form pre-filled) and 'Back to the day' → #day. Saved in localStorage.
   Layout: Linen background. Panel max-width 680px centered, 32px padding, 1px Rule border, 14px radius. Inputs full width, 16px gaps; chips wrap; stepper centered. Under 480px the panel padding drops to 20px.
8. **FAQ** — Section id='faq'. Eyebrow 'Good questions' and H2 'Before you ask the mothers.' Five accordions: 1) 'What should I wear?' — 'Garden formal: linen, florals, a hat if you like. The ceremony is on grass — block heels forgive, stilettos do not.' 2) 'Can I bring my kids?' — 'To the Sunday-after brunch, absolutely and loudly. The evening is adults-only, except the two smallest ring bearers, who have contracts.' 3) 'What about photos?' — 'Unplugged ceremony — put the phones away and be in the pictures. After the kiss, shoot freely and tag [hashtag].' 4) 'Gifts?' — 'Your presence is the present; the registry below is for the stubborn. Three shops, no china, zero crystal.' 5) 'What if it rains?' — 'The barn holds everyone; the garden ceremony moves inside with the string lights on. Rain on a wedding is luck — mud is a shoe choice.'
   Layout: Ivory background, accordion rows with 1px Rule dividers, question in Gilda 22px, answer Jost 16px / 1.8 max-width 64ch, Plus icon right. Container max-width 720px.
9. **Registry** — Section id='registry'. Eyebrow 'For the stubborn' and H2 'Three shops, no china.' Three drawn RegistryCards (SVG: a shopfront frontispiece in Rule lines with Sage accents, the shop name in Gilda): 'The Hearth Shop' — 'For the fireplace we don''t have yet and fully intend to earn.' — button 'Visit' (link '#', caption 'placeholder link'); 'Wander & Co' — 'Travel fund in shop form: contributions to a honeymoon we''ll actually take.' — 'Visit' ('#'); 'Kitchen Garden' — 'Seeds, tools and one absurdly good knife.' — 'Visit' ('#'). Below: 'Or bring a bottle — red, dry, and label-free. We''re building a cellar, not a display.'
   Layout: Linen background. Three equal columns 24px gap; cards Paper 1px Rule border 28px padding, shopfront SVG 100% width aspect 4:3 top. Under 860px: stacked.
10. **Footer** — Ivory background with a 1px Rule top border. Centered: a Sage sprig, the initials 'E & M' in Gilda 24px, '[VENUE] · [CITY] · [DATE]' in Jost 400 14px Olive, the hashtag in Blush 500 14px, and the line 'Made with love and a shared spreadsheet.' in Jost 300 14px Stone. No social icons, no email — the couple is reachable by phone like it''s 2019.
   Layout: Vertical padding 64px, centered stack, 16px gaps.

## Assets
- image: Template photos made for this design (free to redistribute with the template). Download each with curl -L -o into public/images/: https://media.vibefather.ai/assets/2364ee3f-9bc9-48a8-bff1-bcd52aa512d9/hero-barn.webp → public/images/hero-barn.webp (Hero; object-position 50% 55%; alt 'A restored barn with string lights and garden chairs ready for a ceremony'); https://media.vibefather.ai/assets/2364ee3f-9bc9-48a8-bff1-bcd52aa512d9/flowers-table.webp → public/images/flowers-table.webp (Day photo strip; alt 'Sage and blush flowers with eucalyptus on a linen table'); https://media.vibefather.ai/assets/2364ee3f-9bc9-48a8-bff1-bcd52aa512d9/stationery.webp → public/images/stationery.webp (Day photo strip; alt 'Blank ivory wedding stationery with a wax seal and sage ribbon'); https://media.vibefather.ai/assets/2364ee3f-9bc9-48a8-bff1-bcd52aa512d9/candles-evening.webp → public/images/candles-evening.webp (Day photo strip; alt 'Taper candles in glass holders along a barn dinner table at dusk'); https://media.vibefather.ai/assets/2364ee3f-9bc9-48a8-bff1-bcd52aa512d9/garden-path.webp → public/images/garden-path.webp (Story section side image between chapters 3 and 4 on desktop; alt 'A garden path with a simple birch arch'); https://media.vibefather.ai/assets/2364ee3f-9bc9-48a8-bff1-bcd52aa512d9/table-setting.webp → public/images/table-setting.webp (RSVP section, small side image above the panel; alt 'A single place setting with ivory linen and a sage napkin'). Six files in total.
- image: Write ASSETS.md at the project root with a table: path, source URL, author, license — one row for each photo (source 'media.vibefather.ai, made for this template', author 'VibeFather', license 'Distributed with the template'), plus rows for @fontsource/gilda-display and @fontsource/jost (OFL-1.1) and lucide-react (ISC). Never replace photos with stock sites (Unsplash, Pexels, Pixabay) or images with people, faces, hands, rings on fingers or readable writing on stationery.
- icon: lucide-react only: Heart, Minus, Plus, TrainFront, Car, Bus, Check, Clock, MapPin, GlassWater, Music. Stroke width 1.5, 16–24px, color inherits. public/favicon.svg hand-written: viewBox 0 0 32 32, a 32x32 rect rx 9 filled #F8F5EE with a 1px Sage (#8A9B84) border, a Blush (#C98D84) heart glyph centered. No other logo: the couple's initials are always set as type.
- font: Install @fontsource/gilda-display and @fontsource/jost and import them in src/fonts.ts as listed in Setup. Vite bundles the woff2 files into dist/.
- image: Drawn in code: the botanical corner sprigs and eyebrow glyphs, chapter markers, timeline dots, the RSVP heart, the venue sketch (barn line drawing) and the three registry shopfront placeholders. No other bitmaps, no illustrations, no map tiles.

## Don'ts
- No backend, no form submission, no fetch to any API: the RSVP and its thank-you card live in the browser only (localStorage); nothing is posted anywhere, and the form says so.
- All links on this single page are anchors (./index.html#story, #day, #travel, #rsvp, #faq, #registry); hotel and registry links are '#' placeholders the couple fills in — never real stores.
- Self-host everything: fonts through Fontsource, icons as npm packages or inline SVG, images downloaded into public/images/. No CDN <script> or <link> tags, no Google Fonts, no analytics.
- Production build: minified, no source maps, no src/ copied into dist/, single command npm run build, output in dist/ under 10 MB.
- No real venues, hotels, registry stores or real couples; no photos with faces, hands or people; stationery in photos stays blank — no readable writing.
- No dates of any real couple; the countdown targets the [DATE] variable only; the page shows no other dates (the RSVP deadline lives in copy, not a calendar).
- Never mention VibeFather or any other brand inside the site except the optional credit footer link; all copy is invented US English.
- Respect prefers-reduced-motion everywhere: disable parallax, the sprig and heart draws, digit slides and staggered reveals; keep color/border hovers.
- The site must work at 1440x900 desktop and 390x844 mobile with zero console errors; the RSVP works with keyboard only and every interactive element has a visible focus ring.
- Keep copy concrete and personal: no lorem, no invitation-website clichés ('welcome to our journey'); every time, shop and hotel comes from src/content.ts.

---
— Prompt by VibeFather · https://vibefather.ai/t/wedding-invitation-and-rsvp-website · CC BY-NC 4.0 (non-commercial; commercial use needs a VibeFather Pro license) · Request removal: https://vibefather.ai/takedown

Free for personal projects under CC BY-NC 4.0. Commercial use comes with Pro.