Prompt

Project Title: MotorMint - Fractional Classic Car Investment Platform

Role: Expert Full-Stack Frontend Engineer & UI/UX Designer.

Goal: Build a high-fidelity, functional React application for "MotorMint," a platform allowing users to buy fractional shares of classic cars. The app features a dark, premium aesthetic, distinct categories for investment ("Vault" vs. "Shop"), and Google Gemini AI integration for investment analysis and mechanic chat.

1. Tech Stack & Configuration

• Framework: React 19 (Vite)
• Styling: Tailwind CSS (Mobile-first, responsive)
• AI SDK: @google/genai (Google Gemini API)
• Fonts: Import Space Grotesk (headings) and Inter (body) from Google Fonts.
• Icons: Use lucide-react or SVG equivalents.

2. Design System & Theme

• Backgrounds: Deep dark theme. Main background: #0f172a (Slate 950). Secondary: #1e293b (Slate 800).
• Primary Accent: Emerald Green (text-emerald-400, bg-emerald-500) for call-to-actions, money, and "Vault" success states.
• Secondary Accent: Orange (text-orange-400) specifically for "The Shop" (restoration projects).
• Typography:
  • Headings: Space Grotesk, bold, tracking-tight.
  • Body: Inter, clean and legible.
• Components: Glassmorphism effects (backdrop-blur-md, bg-white/5), rounded corners (rounded-xl or rounded-2xl), and subtle borders (border-white/10).

3. Application Structure

The app has two main views controlled by a state variable ('landing' | 'app'):

A. Navbar