Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed as a prank simulator inspired by Roblox, allowing users to simulate sending fake Robux. It features a modern gaming dashboard with a dark theme and aims to provide a fun and engaging user experience without any real transactions.

## CORE FEATURES
1. **Username Input Field**: Users can enter their Roblox username to initiate the prank.
2. **Robux Amount Selector**: A dropdown menu allows users to select an amount of Robux (100, 500, 1,000, 5,000, 10,000, 100,000) to simulate sending.
3. **SEND ROBUX Button**: A prominent button that triggers the simulated transaction when clicked.
4. **Animated Robux Sending Progress Bar**: Displays the progress of the simulated transaction with engaging animations.
5. **Fake Transaction Animation**: Provides a visual effect that mimics a real transaction, enhancing the prank experience.
6. **Simulated Success Message**: After the transaction, a message appears confirming the fake transfer of Robux.
7. **Virtual Transaction History**: Displays a record of past simulated transactions for the user to view.
8. **Disclaimer**: Clear labeling that states, "PRANK SIMULATOR – No real Robux is transferred."

## 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 consist of a centered form section for user inputs, an animated progress area, and a transaction history section below, ensuring a clear flow of interaction.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui for modern UI components.
- **State Management**: Use React's Context API for managing the state of transactions and user inputs.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project for styling and UI components.
3. **Create UI Components**: Build the main components including the username input, Robux selector, SEND ROBUX button, progress bar, and transaction history display.
4. **Implement Animation**: Use CSS animations or a library like Framer Motion for the fake transaction animations and progress bar.
5. **State Management**: Utilize React Context API to manage the state of user inputs, transaction history, and success messages.
6. **Add Disclaimer**: Ensure the disclaimer is clearly visible on the page to inform users about the nature of the simulator.
7. **Responsive Design**: Test the application on various screen sizes to ensure mobile-friendliness and adjust styles as necessary.

## USER EXPERIENCE
Users will start by entering their Roblox username into the input field and selecting the desired amount of Robux. Upon clicking the SEND ROBUX button, an animated progress bar will display the sending process, followed by a simulated success message. Users will be able to view their transaction history at any time, which adds to the playful nature of the application. The clear disclaimer ensures users understand that this is a prank simulator and no real transactions occur.

This structure creates an engaging, minimalist web application that aligns perfectly with the user's vision for a Roblox-inspired fake Robux sender prank simulator.