Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web app designed for simulating the distribution of Robux, the virtual currency used in Roblox. Users can select the amount of Robux they wish to give, with a limit of 500,000 Robux. Additionally, the app features a functionality that allows users to input a username to send products, enhancing the user experience for Roblox interactions.

## CORE FEATURES
1. **Robux Selection**: Users can choose the nominal value of Robux they want to distribute, with options up to 500,000 Robux.
2. **Username Input**: A feature that allows users to enter a Roblox username to send Robux or products directly.
3. **Transaction Confirmation**: An interface that confirms the transaction details before proceeding, ensuring users review their selections.
4. **User Dashboard**: A simple dashboard displaying transaction history and status, enhancing user engagement and tracking.
5. **Responsive Design**: Ensures the app is usable on various devices, providing an optimal experience on mobile and desktop screens.

## 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 consists of a header for branding, a central section for Robux selection and username input, followed by a confirmation section and a footer with contact information.

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

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Layout**: Implement the main layout structure with header, central content area, and footer using Tailwind CSS classes.
3. **Develop Core Features**:
   - Build the Robux selection component allowing users to choose the amount.
   - Create the username input form for sending Robux.
   - Develop a confirmation modal that displays transaction details before finalization.
4. **Implement User Dashboard**: Create a simple dashboard to keep track of transaction history using state management.
5. **Test Responsiveness**: Ensure the application layout adjusts correctly on different screen sizes and devices.
6. **Deploy Application**: Host the app on a suitable platform (e.g., Vercel or Netlify) and ensure all features function as intended.

## USER EXPERIENCE
Users will be greeted with a clean interface where they can easily select the amount of Robux they wish to distribute and input the recipient's username. Upon confirming the transaction, users will see a summary of their actions, ensuring clarity before final submission. The dashboard will allow users to track all their transactions, enhancing engagement and usability. The minimalist design will provide a smooth experience, allowing users to focus on their tasks without distraction.