Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The Chess Game Review System is a web application designed to analyze chess games using the Lichess Cloud-Eval API. It allows users to ingest games from Chess.com or Lichess, evaluate moves, and display results in a user-friendly interface with move classifications, accuracy scores, and visual graphs. The application focuses on providing insightful feedback to players about their gameplay, helping them improve their skills.

## CORE FEATURES
1. **Game Ingestion**: Users can input chess games from Chess.com or Lichess, or paste raw PGN strings for analysis.
2. **Analysis Engine**: Each move is evaluated using the Lichess Cloud-Eval API, providing detailed feedback on move quality and accuracy.
3. **Review UI**: A chessboard interface allows users to navigate through the game, view move classifications, and analyze evaluation graphs.
4. **Accuracy Scoring**: The application computes and displays accuracy scores for each player based on their moves, including breakdowns by game phase.
5. **Performance Ratings**: Users receive performance ratings based on their gameplay, comparing their move quality to expected standards for their rating level.
6. **Progress Tracking**: A progress bar indicates the status of the analysis process, enhancing the user experience during lengthy evaluations.

## 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 layout consists of a top navigation bar, a central chessboard for move analysis, a sidebar for move list and classifications, and a footer with links and contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Query for async state management and caching.

## IMPLEMENTATION STEPS
1. **Set Up Project**:
   - Initialize a new React project with TypeScript.
   - Install necessary dependencies: `tailwindcss`, `chess.js`, `chessground`, `recharts`, and `@tanstack/query`.
   - Configure Tailwind CSS for styling.

2. **Build Game Ingestion**:
   - Create components for inputting Chess.com usernames or Lichess usernames, and for pasting PGN.
   - Implement functions to fetch game data from APIs and parse them using `chess.js`.

3. **Implement Analysis Engine**:
   - Integrate the Lichess Cloud-Eval API for move evaluation.
   - Create a queue system to handle API calls with rate limiting and caching strategies.

4. **Develop Review UI**:
   - Use `chessground` to create an interactive chessboard for displaying moves.
   - Design a move list component showing SAN notation and classification badges.

5. **Add Accuracy Scoring and Performance Ratings**:
   - Implement functions to calculate and display accuracy scores and performance ratings after game analysis.

6. **Create Evaluation Graph**:
   - Use `recharts` to build a dynamic evaluation graph that reflects win percentages throughout the game.

7. **Design Responsive Layout**:
   - Ensure the application is mobile-friendly and includes responsive design elements for different screen sizes.

8. **Testing and Optimization**:
   - Conduct thorough testing to ensure all features work as intended.
   - Optimize performance and user experience based on feedback.

## USER EXPERIENCE
Users will begin by selecting a game source (Chess.com or Lichess) and either entering their username or pasting PGN. After submission, the application will fetch and analyze the game, providing real-time feedback through a progress indicator. Once analysis is complete, users can navigate through the game on an interactive chessboard, observe move classifications, and review their performance metrics in an organized layout. The minimalist design ensures that users can focus on the analysis without distractions, making it easy to identify areas for improvement.