Fix React Next Supabase Bugs

My React + Next.js application is nearly production-ready but three pages—the Home, Login/Signup, and Profile screens—still show visible UI/UX flaws. Layouts slip out of place, some buttons refuse to fire their handlers, and styling is inconsistent across viewports. On top of that, Supabase is installed but its authentication flow has not been wired up.

Here is what I need completed:

• Correct every layout problem, make all buttons responsive, and align styling so the three pages look and behave consistently on modern browsers and mobile devices.
• Integrate Supabase Auth: configure the client, create sign-up / sign-in / sign-out flows, persist sessions, and gate the Profile page behind authenticated access.
• Deliver clean, commented code in the existing repo (React, Next.js, Supabase JS SDK), keeping current component structure intact.
• Pass a quick walkthrough session showing the fixes in action and outlining any.env variables or setup steps I should know about.

Acceptance criteria: zero console errors, fully functional buttons, pixel-perfect layout on Chrome & Safari mobile/desktop breakpoints, and a seamless login cycle that redirects correctly.

The codebase is on Git and ready for you to pull; once your changes merge without breaking the CI tests, the task is considered complete.