Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application serves as a modern and professional demo for a gaming currency platform. It allows users to manage a virtual currency balance, send coins to other users, and view transaction history, all while maintaining a polished, gaming-inspired aesthetic.

## CORE FEATURES
1. **Balance Display**: The current balance of 32,000 virtual coins is prominently displayed at the top of the page.
2. **Send Coins Functionality**: A “Send Coins” button opens a modal window where users can enter a username and the amount of coins to send.
3. **Real-time Balance Update**: The application automatically updates the balance after each successful transaction, reflecting the new balance immediately.
4. **Error Handling**: If a user attempts to send more coins than they have, an error message is displayed, preventing the transaction.
5. **Transaction History**: A dedicated section displays the history of all previous transfers for user reference.
6. **Responsive Design**: The application is designed to be fully responsive, ensuring usability on both desktop and mobile devices.

## 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 includes a header for the balance display, a central section for the "Send Coins" button and transaction history, and a modal for sending coins that overlays the main content.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React's built-in context API or a similar state management solution for managing the balance and transaction history.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Components**: Develop components for the balance display, send coins modal, transaction history, and buttons.
3. **Implement State Management**: Use React's context API to manage the balance and transaction history state.
4. **Add Balance Logic**: Implement the logic to handle sending coins, updating the balance, and maintaining a transaction history.
5. **Design Styling**: Apply Tailwind CSS for styling components according to the design specifications, ensuring the primary color and typography are consistent.
6. **Implement Responsiveness**: Ensure that the layout adapts well on various screen sizes, using Tailwind's responsive utilities.
7. **Test Functionality**: Conduct thorough testing to ensure that coin sending, error handling, and balance updates work as intended.

## USER EXPERIENCE
Users will first see their balance at the top of the page, immediately identifying their current virtual currency status. Upon clicking the "Send Coins" button, a modal will appear, allowing them to input the recipient's username and the amount to send. The application provides instant feedback by updating the balance and notifying users of successful transfers or errors, creating a seamless and engaging experience. The transaction history section allows users to keep track of their activities, enhancing usability and transparency.