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

# Animal Shelter Adoption Website

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

## Brief
A two-page website for [SHELTER], a no-kill shelter in [CITY] with [PETS] animals currently looking for homes. It must be honest and warm: a filterable adoptable grid (species, age, size), pet detail pages with real stories and an application, donate tiers that say what money does, volunteer roles with time commitments, and sample-labeled statistics. Pages: index.html, pet.html?pet=<slug> (first pet without a query). Everything runs in the browser; nothing is submitted or charged anywhere.

- Audience: Families and singles deciding to adopt, weekend volunteers, and donors who give $25 when a story lands. They browse on phones, fall for one animal, and need the next step to be obvious.
- Goal: Start applications and shift the stats. Within ten seconds a visitor sees the animals and the mission; within two minutes they've filtered the grid and opened one story.
- Tone: Warm, funny about animals, serious about care. Every pet gets a real personality description, not a breed chart; no guilt-tripping.

## 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 (MIT), tailwindcss (MIT), postcss (MIT), autoprefixer (MIT), vite (MIT), @vitejs/plugin-react (MIT), typescript (Apache-2.0), @fontsource/quicksand (OFL-1.1), @fontsource-variable/nunito-sans (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. Two real HTML pages at the project root: index.html (entry src/main-index.tsx) and pet.html (entry src/main-pet.tsx).
  - vite.config.ts: base './', plugins [react()], build { outDir 'dist', sourcemap false, assetsInlineLimit 0, rollupOptions { input { index: resolve(__dirname, 'index.html'), pet: resolve(__dirname, 'pet.html') } } }. Do not copy src/ into dist/.
  - Tailwind 3.4 through PostCSS, content ['./index.html', './pet.html', './src/**/*.{ts,tsx}']. In tailwind.config.ts add every color under Design to theme.extend.colors with kebab-case keys (cream, sand, card, meadow, meadow-deep, meadow-mist, ink, bark, tangerine, tangerine-deep, rule) and fontFamily display ['Quicksand', 'system-ui', 'sans-serif'], sans ['Nunito Sans Variable', 'system-ui', 'sans-serif']. Set borderRadius DEFAULT to 16px and add maxWidth { container: '1180px' }.
  - In src/fonts.ts import '@fontsource/quicksand/500.css', '@fontsource/quicksand/700.css' and '@fontsource-variable/nunito-sans'; import src/fonts.ts and src/index.css from both entry files.
  - File layout: src/content.ts (every string, pet, trait, tier, role, stat and image path, typed), src/lib/brand.ts (shelterSlug = [SHELTER] lowercased with every run of non-alphanumeric characters replaced by '-', emailDomain = shelterSlug without hyphens + '.org'), src/lib/storage.ts (safe localStorage get/set wrapped in try/catch, keys prefixed with shelterSlug + ':'), src/lib/pet.ts (reads the query 'pet.html?pet=<slug>', returns the matching pet or the first — never a not-found), src/lib/filters.ts (applyFilters(pets, { species, age, size })).
  - State: src/store/application.ts is a tiny external store (useSyncExternalStore) holding { petSlug, name, email, home, experience, note, sent } persisted to localStorage key shelterSlug + ':application:<petSlug>'.
  - Components in src/components/: Header.tsx, Reveal.tsx (Motion whileInView wrapper), Eyebrow.tsx, Footer.tsx, PawGlyph.tsx (drawn SVG); index: Hero.tsx, StatsStrip.tsx, AdoptGrid.tsx (FilterChips.tsx, PetCard.tsx), DonateTiers.tsx, VolunteerRoles.tsx, VisitStrip.tsx; pet: PetHero.tsx, StoryBlock.tsx, TraitsList.tsx, Application.tsx (Confirmed.tsx), NextPet.tsx. src/pages/Home.tsx and Pet.tsx compose them; both pages render Header and Footer.
  - 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. Both HTML files: lang en, <meta name='theme-color' content='#FBF8F2'>, <link rel='icon' href='./favicon.svg' type='image/svg+xml'>. Titles: index.html '<title>[SHELTER] — Adopt a friend in [CITY]</title>', pet.html '<title>Adopt — [SHELTER]</title>' (the pet page sets document.title to the pet's name on load).
  - Write ASSETS.md at the project root as described under Assets.
  - dist/ holds the two HTML files, hashed JS/CSS, the woff2 fonts, favicon.svg and the six images. Keep it under 10 MB.

## Variables
- [SHELTER] — Shelter name (default: "Second Snout Shelter"). Invented shelter name. Used in the wordmark, title, footer, email (hello@ + shelterSlug without hyphens + .org) and localStorage keys. Never a real shelter or rescue.
- [CITY] — City (default: "Madison, Wisconsin"). Where the shelter is. Used in the hero, visit strip and footer. Real cities fine; the street invented.
- [PETS] — Pets count (default: "12"). The number of animals currently adoptable, as digits. Drives the hero strip, the grid's live count and one stat. Keep it 8–20 (the roster in content.ts has 12; adjust proportionally if changed).
- [FOCUS] — Focus (default: "dogs and cats"). The animals the shelter takes, lowercase. Drives the hero line, filter defaults and two stats. Keep it dog/cat-centric; the roster can include one small-and-furry.
- [CREDIT] — keep a small "Template by VibeFather" link to https://vibefather.ai/t/animal-shelter-adoption-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
- Cream `#FBF8F2` — Page background on both pages.
- Sand `#F2EBDD` — Alternate section background (Donate, Volunteer), hover fill, chips.
- Card `#FFFFFF` — Pet cards, application panel, confirmation, tier cards.
- Meadow `#3F7A52` — Primary: headlines' accents, primary buttons, selected chips, focus ring.
- Meadow Deep `#2E5E3E` — Primary hover, footer background.
- Meadow Mist `#E5EFE5` — Selected pet detail accents, filter chip fills, trait tags.
- Ink `#2C2A24` — Headlines and body text, icon color.
- Bark `#6E675B` — Secondary text, captions, eyebrows, filter labels.
- Tangerine `#E8833A` — The one warm accent: Donate buttons, adoption fees, stat figures, the heart glyphs, focus-visible details.
- Tangerine Deep `#C96A25` — Tangerine hover and pressed.
- Rule `#E5DCCB` — 1px hairlines, card borders, input borders, dividers.

### Typography
- Display: H1, H2, H3, pet names, tier prices, the wordmark: Quicksand (OFL), weights 500/700
- Text and UI: body, eyebrows, buttons, form fields, captions; tabular numerals for stats and fees: Nunito Sans (OFL), weights 400/600/700

### Layout & motion
- Spacing: 8px base unit. Container max-width 1180px, centered, side padding 48px desktop, 32px tablet, 20px under 640px. 12-column grid, column gap 24px. Section vertical padding 96px desktop, 72px under 1024px, 56px under 640px. Type scale: H1 clamp(42px, 6.4vw, 80px) Quicksand 700, line-height 1.04; H2 clamp(28px, 3.8vw, 46px) Quicksand 700; H3 21px Quicksand 700; pet names Quicksand 700 22px; lead Nunito 400 17.5px / 1.65 Ink at 90%; body 15.5px / 1.7 (max-width 62ch); eyebrow Nunito 700 12px uppercase letter-spacing 0.16em Bark with a drawn paw glyph before; caption 13px Bark. Buttons: height 50px, Nunito 700 14px. Primary: Meadow fill, Card text. Donate: Tangerine fill, Card text. Secondary: 1px Meadow border, Meadow text. Inputs: height 50px, 1px Rule border, Card fill, focus Meadow border. Focus ring everywhere: 2px Meadow outline with 3px offset.
- Radius: 16px on cards, buttons, inputs, chips and photos — friendly corners everywhere. 999px only for chips, pills, stat dots and paw dots.
- Motion: Easing: --ease-out cubic-bezier(0.22, 0.61, 0.36, 1) for reveals and grid shuffles; --ease-io cubic-bezier(0.65, 0, 0.35, 1) for the application swap. Gentle and warm.
- Motion: Reveal: blocks wrapped in <Reveal> start at opacity 0, translateY(14px) and settle over 700ms --ease-out when 15% visible (Motion whileInView, viewport once). Siblings stagger 75ms.
- Motion: Hero: the shelter photo scales 1.04→1.0 over 2400ms; the headline rises; three paw glyphs walk in beside the mission line (staggered 200ms, off under reduced motion).
- Motion: Grid filtering: cards use Motion layout with AnimatePresence mode 'popLayout'; leaving cards fade 180ms, survivors glide 380ms --ease-io; the live count crossfades; an empty filtered grid shows 'No friends match — loosen a filter, they''re all good ones.' with Reset.
- Motion: Pet cards: hover lifts 3px and the photo scales 1.03; the one-line personality ticks from Bark to Meadow.
- Motion: Pet detail: the story's first line reveals with a Meadow underline draw; trait tags stagger 40ms; the 'good with' checks draw once.
- Motion: Application: the preselected pet's chip pulses once; invalid submit shakes 4px with inline labels; sending swaps to Confirmed (300ms --ease-io) — a drawn heart+paw stamp scaling in, 'Application received' and 'The shelter replies within two days — usually with more photos.'
- Motion: Stats: figures count up once on reveal (600ms); the '(sample)' caption never animates.
- Motion: Donate tiers: hover lifts the tier 2px; the Tangerine 'what it buys' line brightens.
- Motion: Links: .link-draw grows a 1px currentColor underline over 280ms on hover and focus-visible.
- Motion: prefers-reduced-motion: reduce — no scales, staggers, counts or stamps; everything renders at rest. Use CSS @media in index.css plus Motion's useReducedMotion in components.
- Imagery: Warm real photography, all six made for this template in one consistent style: soft natural light, cream and warm gray backgrounds, animals relaxed and well-lit — portraits, action and shelter corners; never a person (no faces, no hands). No readable text or signage. Every photo uses object-fit cover with the object-position given under Assets, 16px corners, no shadow; photos on Cream get a 1px Rule outline. Captions in Nunito 13px Bark. Drawn in code: the paw glyphs, heart stamp, trait tags, chips and the favicon. Icons: lucide-react only, stroke width 1.75.

## Pages & Sections
### Adopt (`index.html`)
1. **Content file and copy rules** — All copy below is written for the default values ([SHELTER] = Second Snout Shelter, [CITY] = Madison, Wisconsin, [PETS] = 12, [FOCUS] = dogs and cats). Put every string, fee and list in src/content.ts and render from it; both pages share one content file. If any variable value differs, rewrite the hero, all pet stories and one-liners, tiers, roles, stats and visit copy so they are specific and believable for the new shelter, keeping the same structure and counts (12 pets: 7 dogs, 4 cats, 1 rabbit; 3 tiers; 4 roles; 4 stats). All animals, staff and figures are invented; stats carry '(sample)'. Roster (slug · name · species · age · size · one-liner · photo): 'biscuit' Biscuit dog 2y medium 'A golden retriever mix who believes every stranger is a friend he hasn''t sniffed yet' hero-dog; 'mochi' Mochi cat 3y small 'A round gray lap-cat with a purr like a distant road crew' cat-gray; 'waffles' Waffles dog 5y large 'Basset-hound dignity; walks at his own press speed' dog-basset; 'pickle' Pickle cat 1y small 'An orange menace with a sock collection you must respect' cat-orange; 'rosa' Rosa dog 7y medium 'A staff favorite: calm, wise, and done with your other pets'' nonsense' dog-brindle; 'turnip' Turnip rabbit 2y small 'Lop-eared, litter-trained, judges your salad choices' rabbit-lop; 'gus' Gus dog 4y large 'A lab-great-dane pup who hasn''t met a door frame he likes' dog-bigpup; 'sesame' Sesame cat 8y small 'A senior tabby; discount fee, full heart, excellent window commentary' cat-senior; 'juniper' Juniper dog 1y small 'A heeler mix puppy: smart, busy, needs a job and a person' dog-puppy; 'olive' Olive cat 2y small 'A black cat with green eyes and a gossip''s interest in your day' cat-black; 'maple' Maple dog 3y medium 'A pittie mix who smiles in photos and means it' dog-smile; 'clover' Clover cat 5y small 'A calico who prefers respectful distance and scheduled affection' cat-calico.
   Layout: n/a
   Motion: n/a
2. **Header (all pages)** — Left: the wordmark — paw glyph + '[SHELTER]' (Quicksand 700 18px) over 'No-kill · [CITY] · est. by volunteers' (10px uppercase Bark) — linking ./index.html. Right nav (Nunito 600 14px): 'Adopt' → #adopt, 'Donate' → #donate, 'Volunteer' → #volunteer, 'Visit' → #visit; a small Meadow 'Apply to adopt' → ./pet.html (first pet). Under 820px: wordmark + Donate chip.
   Layout: Sticky top, height 72px, Cream/94% blur, Rule border.
3. **Hero** — Two columns. Left: eyebrow paw 'NO-KILL SHELTER · [CITY]'; H1 'Twelve someones' / '*want to meet you.*'; lead (max-width 520px): '[SHELTER] takes in [FOCUS] and gives them time — time to heal, learn, and pick their person. No time limits, no excuses, a lot of treats.'; primary 'Meet the animals' → #adopt and Tangerine 'Donate $25' → #donate; trust row: 'No-kill, always'; 'Every pet vetted and vaccinated'; 'Returns accepted, no questions'. Right: hero-dog.webp (4:3) with the caption 'Biscuit, applying for the position of your whole heart'. The photo column centers vertically against the text (or goes 4:5 taller); the H1 sets in two lines max; the paw glyphs sit inline with the mission line, aligned.
   Layout: Cream background, vertical padding 104px top; left 6 cols, right 5 cols offset 1.
4. **Stats strip** — A hairline-bounded band: '1,280' / 'pets rehomed since opening (sample)'; '96%' / 'spay & neututer before adoption'; '4%' / 'return rate — we take them back, gladly'; '[PETS]' / 'looking for homes today'. Figures Quicksand 700 32px Tangerine tabular, captions Nunito 12px Bark.
   Layout: Full-width band with Rule top/bottom borders, vertical padding 32px, four equal cells with hairline dividers.
5. **Adoptable grid** — Section id='adopt'. Eyebrow 'ADOPTABLE NOW' and H2 'Twelve friends, filtered your way.' FilterChips: Species (All · Dogs · Cats · Small & furry); Age (All · Under 2 · 2–7 · Senior 7+); Size (All · Small · Medium · Large); live count '12 friends'. The grid: 4x3 PetCards (photo, name, one-liner, chips for age/species/size, adoption fee in Tangerine — dogs $180, cats $90, rabbit $60, seniors half) linking ./pet.html?pet=<slug>. Empty state as in Motion. Caption under: 'Fees cover vetting, vaccines and the microchip; love included free.' Twelve pets over six photos never read as duplicates: each card gets a distinct crop/zoom (full-shot vs close head-shot vs off-center) so the same animal never looks repeated under two names; siblings pair deliberately and say so.
   Layout: Cream background. Filters sticky under the header on scroll (top 72px, Cream/96% blur). Cards 4 columns 20px gap (2 under 1024px, 1 under 640px); photo aspect 1:1 top, 16px radius.
6. **Donate tiers** — Section id='donate'. Eyebrow 'KEEP THE LIGHTS ON' and H2 'What your dollars become.' Three tier cards: '$25' — 'A week of meals for one dog, or a very good chew toy' — Tangerine 'Give $25'; '$100' — 'A full vaccination set for one animal' — 'Give $100'; '$250' — 'A spay or neuter surgery, plus the cone of shame (they forgive you)' — 'Give $250'. Caption under: 'This demo takes no payment — the real shelter page would. Every tier prints a plain receipt.' A monthly checkbox line: 'Make it monthly — cancel anytime, the animals understand.' The 'what it buys' sentence is Ink body text; Tangerine carries the price only; Tangerine text always passes contrast on white.
   Layout: Sand background. Three columns 24px gap; cards on Card Rule-bordered, price Quicksand 700 40px Tangerine; buttons Tangerine fill.
7. **Volunteer roles** — Section id='volunteer'. Eyebrow 'GIVE AN AFTERNOON' and H2 'Four ways in.' Role cards (icon, title, time, one line): DogWalking 'Dog walker' — '2h shifts, mornings' — 'The most requested job at the shelter, and the waggiest.'; HeartHandshake 'Cattery cuddler' — '1h shifts' — 'Socialize the shy ones; patience and feather wands provided.'; Camera 'Photo day helper' — 'Monthly Saturdays' — 'Great photos get pets adopted; wrangle treats and tails.'; Truck 'Transport driver' — 'On call' — 'Vet runs and intake pickups; a car and a soft heart required.' A line under: 'Orientation is one hour and includes meeting everyone, which is the point.'
   Layout: Cream background. 2x2 grid 20px gap; cards on Card, icon in 44px Meadow Mist rounded square.
8. **Visit strip and footer** — VisitStrip (id='visit'): hours and directions on Card: 'Tue–Sun 12–5 · closed Mondays for deep-clean' · '2109 Dogwood Lane, [CITY]' · 'hello@ + emailDomain' · 'Tours walk-in; applications same-day.' Footer: Meadow Deep background; three columns: 1) paw wordmark + '[SHELTER]' over 'No-kill shelter · [CITY]'; 2) 'Reach us': address, email, '(608) 555-0162'; 3) 'Around': Adopt, Donate, Volunteer, Visit anchors. Bottom line: '© [SHELTER]. Statistics are sample data; the wags are real.'
   Layout: VisitStrip two-column Card; footer vertical padding 64px, 3 columns, bottom line 32px below a Card/15% rule. Under 768px stacked.

### Pet (`pet.html`)
1. **Pet hero and story** — Reads ?pet=<slug>; with no query, biscuit renders fully (title becomes 'Biscuit — adopt me'). Two columns: left the pet's large photo (3:4) with name and chips (age/species/size, fee in Tangerine); right the Eyebrow 'MEET [NAME]', the story in three short paragraphs (write real ones for all 12 in content.ts — Biscuit: 'Biscuit arrived as a stray with a coat like a carwash and no idea of cars. Three weeks of meals and two of patience later, he''s decided people are excellent and doors are invitations.' / 'He knows ''sit'', is learning ''wait'' (hard), and walks best with a harness and a running commentary.' / 'His ideal home has a yard, a spot on the couch he can claim, and someone home more often than not. Kids eight and up, cats unknown but he''s optimistic.'); TraitsList (tags): 'Loves belly rubs'; 'House-trained'; 'Rides well in cars'; 'Chew toy scholar'; 'Good with: dogs, kids 8+'; Application CTA 'Apply for [NAME]' → #apply.
   Layout: Cream background, vertical padding 104px top; photo 5 cols, story 6 cols offset 1; traits as Meadow Mist chips wrapping.
2. **Adoption application** — Section id='apply'. Eyebrow 'THE APPLICATION' and H2 'Two minutes, seriously.' A Card panel: the pet chip preselected ('Applying for: Biscuit — $180 fee', changeable via a small select of all pets); name + email; home type select (House with yard / Apartment / Farm / Other); experience select ('First-time owner' / 'Had pets before' / 'Seasoned, bring it on'); a note textarea (placeholder 'Tell us about your home, your schedule, and anyone two- or four-legged waiting at it.'); primary 'Send application' with caption 'Saved in this browser — the real page would email the shelter. Nothing is sent here.' Confirmed: the heart+paw stamp, 'Application received.' 'The shelter replies within two days — usually with more photos [NAME] insisted on including.' and 'Apply for another' returning pre-filled. Persisted per pet in localStorage.
   Layout: Sand background; panel max-width 640px, 28px padding, Rule border; selects full-width; two-column name/email stacks under 560px.
3. **Next pet and reassurance** — NextPet: a wide letterboxed card for the next pet in the roster (wrapping to first after last): 'NEXT FRIEND — [NAME]' + one-liner + ArrowUpRight → ./pet.html?pet=<next-slug>. Reassurance strip: three lines with Meadow checks — 'Every animal vetted, vaccinated and microchipped'; 'Two-week trial period, no hard feelings'; 'We take our pets back, for their whole lives.'
   Layout: Cream background; NextPet container-width Card with Rule border; reassurance a hairline strip of three under it, 48px padding.

## 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/d4af93fd-65bf-4fd9-8a9b-1fd75cfd748b/hero-dog.webp → public/images/hero-dog.webp (Hero, Biscuit card and detail; object-position 50% 50%; alt 'A smiling golden retriever mix in a sunny yard'); https://media.vibefather.ai/assets/d4af93fd-65bf-4fd9-8a9b-1fd75cfd748b/cat-gray.webp → public/images/cat-gray.webp (Mochi, Sesame; alt 'A round gray cat asleep in a sunny windowsill'); https://media.vibefather.ai/assets/d4af93fd-65bf-4fd9-8a9b-1fd75cfd748b/dog-basset.webp → public/images/dog-basset.webp (Waffles, Rosa; alt 'A basset hound standing in grass with long ears'); https://media.vibefather.ai/assets/d4af93fd-65bf-4fd9-8a9b-1fd75cfd748b/cat-orange.webp → public/images/cat-orange.webp (Pickle, Clover; alt 'An orange young cat mid-play with a toy'); https://media.vibefather.ai/assets/d4af93fd-65bf-4fd9-8a9b-1fd75cfd748b/dog-puppy.webp → public/images/dog-puppy.webp (Juniper, Gus, Maple; alt 'A heeler-mix puppy sitting attentively in soft grass'); https://media.vibefather.ai/assets/d4af93fd-65bf-4fd9-8a9b-1fd75cfd748b/rabbit-lop.webp → public/images/rabbit-lop.webp (Turnip; alt 'A cream lop-eared rabbit sitting on a towel'). 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/quicksand and @fontsource-variable/nunito-sans (OFL-1.1) and lucide-react (ISC). Never replace photos with stock sites or images with people, faces, hands or readable signage.
- icon: lucide-react only: Dog, Cat, Rabbit, Footprints, HeartHandshake, Camera, Truck, Check, ArrowUpRight, MapPin, Mail, Clock, Heart. Stroke width 1.75, 16–24px, color inherits. The paw glyphs, heart+paw stamp, chips and favicon are drawn SVG. public/favicon.svg: viewBox 0 0 32 32, a 32x32 rect rx 9 filled #3F7A52, a Card (#FFFFFF) paw glyph with a Tangerine (#E8833A) heart above it. No other logo: the shelter name is always set as type; no real payment marks.
- font: Install @fontsource/quicksand and @fontsource-variable/nunito-sans and import them in src/fonts.ts as listed in Setup. Vite bundles the woff2 files into dist/.
- image: Drawn in code: the paw glyphs and eyebrow marks, the heart+paw stamp, trait chips, filter chips and the favicon. No other bitmaps beyond the six photos; no illustrations; no map tiles.

## Don'ts
- No backend, no form submission, no fetch to any API, no payments: the application and donate clicks save or confirm in the browser only (localStorage); the donate caption says the demo takes no payment.
- Every internal link points to a file name (./index.html, ./index.html#adopt, ./pet.html, ./pet.html?pet=mochi, ./pet.html#apply) — never to a bare directory; pet.html without a query shows the first pet, never an error.
- 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 shelters, rescues, staff or animals; no photos with people, faces or hands; stats are sample-labeled; no real payment marks anywhere.
- No dates or years anywhere; ages are in years ('2y') without birth dates; the site never shows today's date.
- 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: no scales, staggers, counts or stamps; grid filters change instantly; color/border hovers stay.
- The site must work at 1440x900 desktop and 390x844 mobile with zero console errors; filters, chips, selects and the application work with keyboard only and visible focus rings.
- Keep copy concrete and kind: no lorem, no guilt-tripping; every fee, trait and story line lives in src/content.ts.

---
— Prompt by VibeFather · https://vibefather.ai/t/animal-shelter-adoption-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.