The "CreditGhost" Master Prompt

Role: You are an expert Fintech UI/UX Developer. Project Name: CreditGhost Tagline: Behavioral Credit Scoring for Thin-File Borrowers.

Objective: Build a professional, high-trust React web application with a linear 3-step flow (Input → Loading → Results).

Step 1: Onboarding & Upload (The "Handshake")

• Create a centered, clean card with a deep navy/slate theme (#1A2B3C).

• Inputs: Name (Text), PAN Number (Masked input with regex validation for 10 alphanumeric chars).

• Feature: A Drag-and-Drop PDF Upload zone using a dashed border.

• Requirement: The "Analyze Credit Profile" button should only be active once all fields are filled and a file is attached.

Step 2: The "Intelligence Engine" (Loading State)

• When "Analyze" is clicked, transition to a full-screen processing state.

• Visual: A large, pulsing circular progress ring.

• Dynamic Status Text: Cycle through these messages every 800ms:

  1. "Parsing Bank Statement with pdfplumber..."

  2. "Extracting 14 Behavioral Risk Signals..."

  3. "Analyzing Inflow Variance & Essential Spend..."

  4. "Running XGBoost Inference Model..."

  5. "Detecting Income Manipulation Patterns..."

Step 3: The "Risk Intelligence" Dashboard (Results)

• Show a professional dashboard using the following JSON-mapped attributes:

  • Credit Score Gauge: A semi-circle speedometer (0-920). Use Green for 750+, Amber for 600-750, Red for <600.

  • Confidence/Fraud Shield: A secondary circular meter (0-100%) labeled "Verification Confidence."

  • Reasoning Feed: Use a vertical list of cards. Use Lucide-React icons (Green Check for positive logic, Red Alert for risks).

  • Attributes to Display: Income Stability, Savings Buffer Days, and Essential Spending Ratio.

Styling & Vibe:

• Theme: "Modern Enterprise Fintech." Use Dark Mode by default.

• Colors: Deep Navy (#0F172A), Emerald Green (#10B981), and Amber (#F59E0B).

• Typography: Use a clean Sans-Serif (Inter) for UI and Monospace (JetBrains Mono) for the loading logs to give it a "Tech/AI" feel.

• Responsiveness: Must look flawless on mobile and desktop.

Pro-Tip for Vibe Coding:

If the AI tool asks for the Backend API, tell it:

"For now, mock the API response with a 3-second delay and return a random Credit Score between 300-920, a Confidence Score between 50-100, and 3 bullet points of reasoning based on the score value."