Refactor Tailwind CSS setup and introduce OKLCH-based design system

- **Tailwind Config:** Clear custom config path and update base color to `zinc`.
- **Design System:** Replace existing CSS with OKLCH color model for improved accessibility and uniformity.
- **Typography & Themes:** Use Geist fonts, define light/dark themes with enhanced semantic variables.
- **Global Styles:** Add consistent border colors, smooth transitions, and reusable variables for Tailwind integration.

frontend/src/app/providers.tsx

@@ -4,6 +4,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
 import { useState } from 'react';
 import { AuthInitializer } from '@/components/auth';
+import { ThemeProvider } from '@/components/theme';
 
 export function Providers({ children }: { children: React.ReactNode }) {
   const [queryClient] = useState(
@@ -23,10 +24,12 @@ export function Providers({ children }: { children: React.ReactNode }) {
   );
 
   return (
-    <QueryClientProvider client={queryClient}>
-      <AuthInitializer />
-      {children}
-      <ReactQueryDevtools initialIsOpen={false} />
-    </QueryClientProvider>
+    <ThemeProvider>
+      <QueryClientProvider client={queryClient}>
+        <AuthInitializer />
+        {children}
+        <ReactQueryDevtools initialIsOpen={false} />
+      </QueryClientProvider>
+    </ThemeProvider>
   );
 }