Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed as a practice engine for Makerere University exams, emphasizing a dark luxury Uganda aesthetic. The application offers users a structured way to prepare for various exam sections through interactive questions, AI coaching, and a metrics dashboard to track their progress and readiness.

## CORE FEATURES
1. **Exam Sections**: Users can practice all five Makerere exam sections, each designed to reflect the actual exam format. The sections include Aptitude & Logic, Comprehension & Language, Numerical Skills, General Knowledge, and Analytical Writing.
   
2. **AI Coaching**: Provides two layers of support. Per-question, the AI (Claude) explains answers with legal context after each submission. The full coach chat allows users to ask questions about Ugandan law, exam strategies, and essay structures.

3. **Metrics Dashboard**: Features live-updating visuals including a radar chart for competencies by section, a score history line graph, session breakdown tables, a streak counter, and color-coded readiness indicators (Ready / Improving / Needs Work).

4. **Performance Scoring Logic**: Scores from practice sessions blend into a running average after each session, rewarding improvement with a 70/30 weighting system and real-time chart updates.

5. **User Profiles and Progress Tracking**: Users can create profiles to save their progress, manage sessions, and track metrics over time.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: The main layout will feature a vertical navigation bar on the left for easy access to exam sections, a central content area displaying questions and AI coaching interactions, and a dashboard section for metrics.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Redux or Context API (as needed).

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript. Install required dependencies including Tailwind CSS and shadcn/ui.
   
2. **Design Components**: Create reusable UI components such as buttons, cards, and input fields with the specified border radius and typography.

3. **Develop Exam Sections**: Implement each exam section with a question bank and timer functionality. Ensure the interface is clean and intuitive for seamless user interaction.

4. **Integrate AI Coaching**: Set up the AI component to provide explanations after each question submission, and implement the full coach chat feature.

5. **Build Metrics Dashboard**: Develop the metrics dashboard using charts to visualize user performance and readiness indicators.

6. **User Profile Management**: Create user authentication and profile management features to allow users to track their progress and session history.

7. **Test and Optimize**: Conduct thorough testing for usability and performance, ensuring the application is responsive and user-friendly across devices.

## USER EXPERIENCE
Users will have a straightforward journey starting from landing on the homepage, where they can navigate to different exam sections. They will engage with questions presented in an easy-to-read format, receive feedback from AI coaching, and view their performance metrics on the dashboard. The design prioritizes user engagement and clarity, ensuring a pleasant and effective study experience.