Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application that simulates a fun, interactive experience similar to Roblox, allowing users to generate and distribute virtual currency (Robux) in a playful environment. Users can input a number to receive a fake amount of Robux, which can then be shared with friends, creating an engaging and social experience.

## CORE FEATURES
1. **Robux Generator**: Users can enter a numerical value and click a button to generate a corresponding amount of fake Robux instantly.
2. **Friend Sharing**: A feature that allows users to send their generated Robux to friends with a simple interface.
3. **User Input Field**: An input field for users to enter the amount of Robux they wish to generate.
4. **Visual Feedback**: Immediate visual feedback when Robux are generated, confirming the action and displaying the amount.
5. **Minimalist Dashboard**: A clean, easy-to-navigate dashboard where users can track their generated Robux and manage friend connections.

## 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 centered input section for number entry and a prominent button for Robux generation, with a feedback area directly below to display results. The dashboard will include sections for generated Robux and a friend-sharing feature.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand (for managing user state and shared Robux)

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create Main Components**:
   - Input component for entering the number of Robux.
   - Button component for generating Robux.
   - Display component for showing generated Robux.
3. **Implement State Management**: Use React Context API or Zustand to manage the state of generated Robux and handle sharing logic.
4. **Build the Dashboard Layout**: Design the main layout using Tailwind CSS, ensuring responsiveness for various screen sizes.
5. **Add Visual Feedback**: Implement feedback mechanisms to show users the amount of Robux they have generated and any messages related to sharing.
6. **Testing**: Conduct testing to ensure all features work as expected, including user input, generation, and sharing functionalities.
7. **Deploy**: Prepare the application for deployment, ensuring all assets are optimized.

## USER EXPERIENCE
Users will have a straightforward experience where they can quickly enter a number in the input field and click a button to generate Robux. Upon clicking the button, they will see a confirmation message with the amount generated. Users can then choose to share their Robux with friends through a simple interface. The minimalist design ensures that users can focus on the key actions without distractions, providing a smooth and engaging interaction.