• Version1:-https://ai.studio/apps/drive/1Xx3l5lM4jLSGndUQcXyzMFSib5yzNMhH?fullscreenApplet=true
• Version 2: -https://tempo-deployment-4b785f7a-2b8b-4528-816f-c99b82a41e1-hlwhc5kfm.vercel.app/
• Version 3:-https://evolveo-asset-forge.lovable.app

Evolveo is an enterprise-grade, desktop-first application that transforms complex LMA-standard loan agreements into structured, trackable, and compliant financial assets. Built for tier-1 banks, loan operations teams, and compliance professionals, it delivers institutional trust through conservative design, information density, and explainable AI. The platform is modular, role-aware, and designed for serious financial work — not flashy demos.

Financial Command Center — A hybrid of Swiss International rationality and modern banking dashboards. This archetype prioritizes clarity, hierarchy, and trust over aesthetics. It uses restrained motion, high information density, structured grids, and conservative color palettes. Think Bloomberg Terminal meets modern SaaS, not crypto dashboards or consumer apps.

Navigation & Shell

• Top Navigation Bar: Evolveo logo (left), global search (loans, clauses, borrowers), notification bell (deadlines, alerts), user profile menu (role, logout)
• Left Sidebar: Collapsible icon navigation with labels — Dashboard, Documents, Covenant Monitoring, ESG Tracker, Loan Lifecycle, Trade Overview, Reports, Admin Settings (role-based)
• Active State: Subtle left border accent in Growth Green, slight background tint Pre-Login Experience
• Home/Landing Page: Centered Evolveo logo, tagline ("Transforming loan documents into intelligent financial assets"), abstract banking visuals (grids, document outlines, timelines), gradient background (Navy → Slate Blue), two primary CTAs ("Sign In", "Request Access")
• Authentication Screen: Minimalist email + password login, clear error messaging, optional "Remember me", post-login routing to Main Dashboard Main Dashboard (Command Center)
• Active Loans Snapshot: Card showing total active loans, high-risk count, total portfolio value
• Risk & Covenant Alerts (Guard Module): Card with upcoming covenant deadlines, breach warnings, non-standard clause flags
• ESG Overview (Green Module): Card showing ESG-linked loan count, compliance score, KPI trend indicator
• Loan Lifecycle Timeline: Visual timeline with color-coded status (Origination → Reporting → Amendments → Maturity)
• Widget Behavior: All cards are clickable and expand into detailed module views

Module 1: Evolveo Docs (Document Intelligence)

• Upload Interface: Drag-and-drop zone for PDF/Word files, progress indicator during upload, confirmation message on completion
• Document History Section: Table showing filename, upload date, analysis status (Parsing, Analyzing, Completed, Failed), clickable rows to view past analyses
• Analysis Results View: Structured summary with clause-by-clause navigation, confidence indicators, clause traceability (click clause to see page number and paragraph in original document)
• Extracted Clauses & Terms: Organized sections for Parties & Roles, Facility Details, Key Dates, Financial & Non-Financial Covenants, Reporting Obligations, Events of Default, ESG-linked clauses
• Error Handling: Failed analyses show "Failed" status with brief explanation and "Retry" option

Module 2: Evolveo Guard (Covenant Monitoring)

• Covenant Timeline: Visual timeline showing reporting deadlines, interest resets, margin ratchets
• Predictive Alerts: Rule-based warnings for potential covenant breaches, leverage threshold proximity
• Alert Cards: Each alert shows covenant type, deadline, risk level, linked clause reference

Module 3: Evolveo Green (ESG Compliance)

• ESG Clause Detection: Auto-detected ESG-linked clauses from uploaded documents
• KPI Tracking: Mock data visualization for KPI commitments over time
• ESG Score Visualization: Circular progress indicator with percentage, bar chart showing compliance trends
• Export Function: Button to generate regulator-ready ESG compliance summary

Module 4: Evolveo Trade (Loan Trading)

• Position Visualization: Table showing trade history, settlement status, documentation alignment
• AI Flags: Highlighted rows for off-market pricing, settlement delays, documentation mismatches

Loan Lifecycle View

• End-to-End Timeline: Horizontal timeline with milestones (Origination, Drawdowns, Amendments, Resets, Maturity)
• Status Indicators: Color-coded dots (Green = on track, Yellow = attention needed, Red = at risk)
• Drill-Down: Click any milestone to see detailed event information

User Authentication & Roles

• User logs in via email + password (mock auth acceptable)
• System routes to Main Dashboard based on role (Loan Officer, Legal/Documentation Team, Compliance/Risk Manager, Admin)
• Dashboard widgets adapt priority and visibility based on role Document Upload & Analysis (Docs Module)
• User drags/drops or selects PDF/Word file
• Progress indicator shows upload status
• System extracts text using PDF parsing library (pdfjs-dist or similar)
• Extracted text is passed to analyzeLoanDocument function
• Real-time status updates in Document History: Parsing → Analyzing → Completed
• For .docx files, simulate analysis with placeholder message indicating full parsing in future iteration
• On completion, user sees structured analysis results
• Failed analyses show "Failed" status with explanation and "Retry" button Clause Traceability
• User clicks on specific extracted clause in analysis results
• System highlights exact location (page number, paragraph) in original document
• Visual indicator appears in "Extracted Clauses & Terms" section Document History Navigation
• User views "Recent Analyses History" table in Docs module
• Table shows filename, upload date, status (with real-time updates for ongoing analyses)
• User clicks row to view past analysis results Dashboard Widget Interaction
• User clicks on any dashboard card (Active Loans, Risk Alerts, ESG Overview, Lifecycle Timeline)
• System expands card into full module view with detailed data
• User can navigate back to dashboard or to other modules via sidebar Covenant Alert Workflow (Guard Module)
• User views covenant timeline and predictive alerts
• User clicks alert card to see detailed covenant information and linked clause reference
• System shows explanation tied to original loan document clause ESG Compliance Export (Green Module)
• User reviews ESG score and KPI tracking
• user clicks "Export ESG Report" button
• System generates regulator-ready PDF summary (mock data) Global Search
• User types query in top navigation search bar (loans, clauses, borrowers)
• System returns filtered results across all modules
• User clicks result to navigate to relevant module view Notifications
• User clicks notification bell in top navigation
• Dropdown shows recent alerts (covenant deadlines, analysis completions, risk warnings)
• User clicks notification to navigate to relevant module

Overall Vibe

• Conservative, institutional, and trustworthy — designed for tier-1 banks. The aesthetic is calm authority: high information density without clutter, restrained motion, and a color palette that signals stability and professionalism. Think modern banking dashboards, not consumer apps or crypto platforms. Color Mood
• Primary: Deep Navy Blue (#0B1F3A) — dominant background and header color
• Secondary: Slate Blue (#2C3E5C) — secondary backgrounds, sidebar, card borders
• Accent: Growth Green (#4CAF50) — positive actions, active states, on-track indicators
• Neutral: White (#FFFFFF), Light Grey (#F4F6F8) — card backgrounds, text on dark surfaces
• Error/Risk: Muted Red (#C62828) — alerts, warnings, at-risk indicators
• Avoid: Pure black (#000) and pure white (#FFF) — use tinted charcoals (#0B1F3A) and warm creams (#F4F6F8) instead

• Grid-Based: Strict alignment using invisible vertical lines, Bento-grid layouts for dashboard cards
• High Whitespace: Generous padding between sections (24px–48px gaps), treat whitespace as an active element
• Asymmetrical Balance: Left-aligned content with deliberate asymmetry, avoid defaulting to center alignment
• Information Density: Compressed but clean — multiple data points visible without scrolling, but never cluttered

• Display/Headings: Use Space Grotesk (geometric, technical, modern but not overused) — weights 600–700 for headings, 400–500 for subheadings
• Body Text: Use IBM Plex Sans (highly readable, technical but friendly) — weight 400 for body, 500 for labels
• Monospace/Data: Use JetBrains Mono for numerical data, code snippets, clause references — weight 400
• Scale: Use 2x–3x size jumps for hierarchy (e.g., H1: 32px, H2: 24px, Body: 14px, Labels: 12px)
• Contrast: Pair geometric sans (Space Grotesk) for headings with technical sans (IBM Plex Sans) for body — avoid middle-ground weights

• Subtle Only: No flashy animations, no bouncing, no excessive motion
• Entrance Choreography: Dashboard cards fade in with slight stagger (50ms delay between each), not all at once
• Tactile Feedback: Buttons scale slightly on hover (scale: 1.02), cards lift with subtle shadow on hover
• Smooth Transitions: All state changes use 200ms ease-out transitions (e.g., sidebar collapse, card expansion)
• Background Motion: On landing page, slow-moving abstract lines or grids representing data flow (5–10s animation loop), very subtle

• Depth: Use subtle box shadows for cards (e.g., 0 2px 8px rgba(0,0,0,0.08)), layered elements with slight transparency
• Texture: Subtle noise texture overlay on Navy Blue backgrounds (opacity: 0.02–0.03) to avoid sterile flatness
• Gradients: Use Navy → Slate Blue gradient on landing page background, avoid harsh transitions
• Glassmorphism (Minimal): Optional subtle blur on modal overlays or dropdown menus, but keep it restrained

• Cards: White background (#FFFFFF), rounded corners (8px), subtle shadow, 16px–24px padding
• Buttons: Primary (Growth Green, white text), Secondary (Slate Blue, white text), Ghost (transparent, Navy text) — all with subtle hover scale
• Tables: Zebra striping (alternating Light Grey rows), sticky headers, sortable columns with subtle arrow indicators
• Progress Indicators: Linear progress bars (Growth Green fill on Light Grey background), circular loaders for indeterminate states -Alerts/Notifications: Color-coded left border (Green = success, Red = error, Yellow = warning), icon + text layout
• Sidebar: Slate Blue background, white icons/text, Growth Green accent for active state, smooth collapse animation

• 🚫 Purple gradients on white backgrounds
• 🚫 Overused fonts (Inter, Roboto, Arial, system fonts)
• 🚫 Flat, textureless empty spaces
• 🚫 Timid typography (small size jumps, safe weight choices)
• 🚫 Cookie-cutter layouts (Hero → 3 Columns → Footer)
• 🚫 Crypto/Web3 aesthetics (neon colors, excessive glow effects)
• 🚫 Consumer app patterns (playful illustrations, casual tone)

Why Financial Command Center? Evolveo operates in a high-stakes, institutional context where trust and clarity are paramount. The Financial Command Center archetype balances modern design with conservative professionalism. It uses Swiss International's rational grid systems and high whitespace, but softens it with subtle depth (shadows, textures) and restrained motion to avoid feeling cold or dated. The color palette (Navy, Slate, Growth Green) signals stability and growth without veering into flashy or trendy territory. Typography choices (Space Grotesk, IBM Plex Sans, JetBrains Mono) are technical and modern but not overused in AI-generated designs, giving Evolveo a distinctive voice. The result is a platform that feels serious, capable, and trustworthy — suitable for tier-1 banks and compliance professionals.

This project is built with:

• Vite
• TypeScript
• React
• shadcn-ui
• Tailwind CSS