I'll help you build an auditor dashboard for visualizing ticket fee breakdowns. Let me first generate some design inspiration to create a clear and professional interface for this use case.

Now I have a clear design direction - a dark, professional financial dashboard. Let me build the auditor fee breakdown dashboard with:

1. Updated dark theme in globals.css
2. Main dashboard page with fee visualization
3. Interactive components for fee breakdown

Now let me create the fee types and data structure, then the dashboard components:

Now let me create the main dashboard page:

I've built a comprehensive Fee Audit Dashboard for your auditor. Here's what the dashboard includes:

Features:

• Interactive Base Price Input - Enter any ticket price to see real-time fee calculations

• Three Visualization Modes:

  1. Waterfall View - Shows fees applied sequentially with arrows indicating flow from base price to final total
  2. Table View - Lists all configured fees with their properties (category, type, value, applied on, refundable)
  3. Breakdown View - Detailed step-by-step calculation table showing input, formula, fee amount, and output for each step

Fee Information Displayed:

• Category badges (Platform, Payment Provider, VAT) with distinct colors
• Fee type (Fixed amount vs Percentage)
• Application basis (on base price or cumulative total)
• Refundable status with clear visual indicators (green checkmark for refundable, red X for non-refundable)
• Application order showing which fees are calculated first

Summary Panel:

• Total fees and percentage markup
• Refundable vs non-refundable breakdown with visual bar
• Fees grouped by category with progress bars

The default fees include Platform Service Fee (10%), Booking Fee ($2.50), Stripe Processing (2.9% + $0.30), and VAT (21%) - you can easily modify these in lib/fees.ts.