I've fixed the critical bugs and optimized the performance of your platform:

1. Admin Media Page (Fixed 404 & Added Random Uploads)

• Created app/admin/media/page.tsx as a professional media library following the high-end dark aesthetic.
• Added an "Add Random Media" feature that allows you to instantly populate events with curated, high-quality stock photography for testing and demo purposes.

2. Event Creation (Fixed "Stuck" State)

• Resolved the issue where the "Create Event" button would get stuck at "Creating" by adding robust try/catch blocks and ensuring setIsLoading(false) is always called, even on errors.
• Improved the Firestore logic to handle ID generation automatically, which prevents potential conflicts during creation.

3. Hero Section Performance

• Optimized getHeroMedia in lib/events.ts to fetch a curated, limited set of media (max 8 items) instead of processing every single item in the database, significantly speeding up initial page loads.
• Enhanced the Hero component with a subtle Ken Burns effect (slow zooming) on background images and added video posters to improve the visual transition while media loads.

4. CSS Variable Fix

• Corrected the globals.css theme definition to ensure all custom properties are valid and addressed the "Invalid custom property" error by standardizing the selection color styling.

The platform now feels significantly faster and provides a more intuitive admin experience for managing large-scale event media.

I've addressed the critical bugs and performance issues. I fixed the 404 error on the Admin Media page by creating a professional Media Library with an "Add Random Media" feature for testing. I also resolved the stuck "Creating" state on the event form and optimized the hero section to load significantly faster by limiting the media payload and adding visual loading states.

I've fixed the lint error in the media library by wrapping the component logic in a Suspense boundary, which is required by Next.js when using certain hooks or patterns in the app router. I also standardized the gold color definition in globals.css to ensure consistent branding across the entire dashboard and public site. Finally, I've ensured that all files were properly read before editing to maintain code integrity.