Build a React web application called "HabitGate". It is a gamified productivity app that locks "addictive" apps (like Instagram or TikTok) behind real-world habits (like running or reading) using a token economy system.

1. Design & Aesthetic (Critical)

• Theme: Ultra-modern dark mode. Use zinc-950 for the background, zinc-900 for cards, and zinc-100 for text.
• Accents:
  • Emerald (#10b981): associated with "Earn" actions (completing habits).
  • Indigo (#6366f1): associated with "Spend" actions (unlocking apps).
  • Red/Orange: For wasted time or specific integrations (Strava).
• Style: Rounded corners (xl or 2xl), subtle borders (border-zinc-800), glassmorphism on the sticky header, and crisp iconography.
• Font: Inter (sans-serif).

2. Core Features & State Management

• Time Bank: A global state tracking the user's balance in minutes. Starts at 45m.
• Gamification: Track User Level, XP, and Current Streak.
• Token Economy Logic:
  • Completing a habit = Adds minutes to the bank (e.g., +30m).
  • Unlocking an app = Deducts minutes from the bank (e.g., -15m).
• Gemini AI Coach: A component that simulates an API call to Google Gemini to give a witty, 1-sentence motivational quote based on the user's current stats (streak, completion rate).

3. Views & Navigation (Bottom Tab Bar)

The app should have 4 main views, switchable via a fixed bottom navigation bar:

• View 1: Dashboard (Home)
  • Sticky Header: Shows "Welcome, [Name]" and the current "Time Bank" balance with a coin icon.
  • AI Coach Card: A glowing card showing the AI's advice.
  • Action Buttons: Two large cards to quickly jump to "Earn" or "Unlock".
  • "Today's Operations": A list of habits to complete.
• View 2: Earn (Habits)
  • List of daily tasks (e.g., "Morning Run", "Read 20 Pages").
  • Each item shows the name, icon, and reward amount (e.g., "+30 min").
  • Interaction: Clicking a habit marks it as complete (green style), plays a toast notification, and updates the balance.
  • Integrations: If a habit is linked to an external source (like Strava), display a small badge (e.g., Orange badge for Strava).
• View 3: Spend (The Vault)
  • A grid of locked apps (Instagram, YouTube, etc.).
  • State: Apps appear greyed out/locked by default.
  • Interaction: Clicking "Unlock" checks the balance. If sufficient, the app unlocks (glows purple) for a simulated 15 minutes.
  • Emergency Unlock: Add a button to "Pay $1.00" for an emergency unlock if the user has no time credits.
• View 4: Profile (Stats)
  • Hero Stats: 3-column layout showing Streak, Level, and XP.
  • Chart: A Bar Chart (use Recharts) showing "Minutes Earned" (Green) vs "Minutes Wasted" (Red) over the last 7 days.
  • Integrations Section: A list of external services (Strava, Apple Health) with "Connect/Disconnect" toggle buttons. Connecting them should simulate a loading state and then update the specific habits in the "Earn" view to show they are auto-tracked.

4. Technical Details

• Use lucide-react for icons.
• Use recharts for the analytics chart.