Let me read all existing components to understand what needs updating to match the new spec:

Now I have full context. Comparing the new spec against what's built, I need to:

1. Sidebar: Add 5th nav item "App Economy & Pricing", add mobile hamburger drawer with backdrop blur
2. Dashboard: Add System Health section (server latency, API load)
3. User Management: Add "Pro" plan badge support (spec says Free/VIP/Pro)
4. New View 4: App Economy & Pricing (credit burn costs, fiat subscription pricing)
5. System Settings: Add "Global Default Base Avatar" input, change toggles to "Global AI Generation", "Maintenance Mode", "UPI Recharge System"
6. Page: Wire up the new view, add mobile hamburger button

Let me implement all changes:

Now update the dashboard to add System Health:

Now update User Management to add "Pro" plan support:

Now update the plan badge rendering to include Pro:

Now add the Sparkles import to user-management-view:

Also update the VIP members stat to show Pro count too:

Now update the summary cards to show all 4:

Now create the new App Economy & Pricing view:

Now update System Settings to match the new spec -- add Global Default Base Avatar, and update toggles:

Finally, update the main page to wire up the new view and add mobile hamburger menu:

Here's a summary of all changes made to align with the updated spec:

• Sidebar: Added the 5th nav item "App Economy & Pricing", and implemented a full mobile drawer system -- on mobile the sidebar is hidden behind a hamburger menu button and slides in as a drawer with a backdrop-blur overlay and a close button.
• Dashboard: Added a "System Health" section with 4 metric cards showing Server Latency, API Load, Uptime, and Error Rate, each with a colored status dot indicator.
• User Management: Added "Pro" plan support with a dedicated indigo badge (alongside VIP/Free), updated mock data to include Pro users, and expanded the summary cards row from 3 to 4 (Total, VIP, Pro, Suspended).
• New View -- App Economy & Pricing: Created a complete view with credit burn cost inputs (Image, Reel, Text, Voice, BG Removal, Upscaling) in a responsive grid, plus three fiat subscription pricing tier cards (Starter/Pro/Ultimate) with editable price and credit fields.
• System Settings: Added a "Global Default Base Avatar" input field defaulting to "yah wala character", reduced API keys to Hugging Face and Gemini per spec, and updated the toggle switches to "Global AI Generation", "Maintenance Mode", and "UPI Recharge System".

Let me check the current state of the files to make sure everything is rendering correctly:

The code looks correct and well-structured. Let me also verify the remaining views are intact:

Everything looks solid. All 5 views are wired up and the code is consistent. The admin panel should be loading in the preview with the dark theme, collapsible sidebar with 5 nav items (Dashboard, User Management, UPI Approvals, App Economy & Pricing, System Settings), mobile hamburger drawer, and all the interactive features across each view. Let me know if you see any issues or want any adjustments!