[Minor changes to Frontend]

backend/app/api/auth_routes.py

@@ -134,5 +134,6 @@ def get_current_active_user(
         "name": getattr(current_user, 'username', getattr(current_user, 'email', 'User')),
         "is_admin": getattr(current_user, 'is_admin', False),
         "avatar_url": getattr(current_user, 'avatar_url', None),
-        "google_avatar_url": getattr(current_user, 'google_avatar_url', None)
+        "google_avatar_url": getattr(current_user, 'google_avatar_url', None),
+        "created_at": current_user.created_at.isoformat() if getattr(current_user, 'created_at', None) else None
     }

frontend/app/dashboard/page.tsx

@@ -11,7 +11,7 @@ import { motion, AnimatePresence } from "framer-motion";
 import { useRouter } from "next/navigation";
 
 export default function DashboardPage() {
-    const { isAuthenticated, loading, logout } = useAuth();
+    const { isAuthenticated, loading } = useAuth();
     const router = useRouter();
 
     const [files, setFiles] = useState<any[]>([]);
@@ -34,6 +34,16 @@ export default function DashboardPage() {
         }
     }, [isAuthenticated, loading, router]);
 
+    // Scroll Lock for Modal
+    useEffect(() => {
+        if (isUploadModalOpen) {
+            document.body.style.overflow = 'hidden';
+        } else {
+            document.body.style.overflow = '';
+        }
+        return () => { document.body.style.overflow = ''; };
+    }, [isUploadModalOpen]);
+
     const handleDeleteFile = async (id: string, filename: string) => {
         try {
             await apiLayer.deleteFile(id);
@@ -196,6 +206,9 @@ export default function DashboardPage() {
                         animate={{ opacity: 1, backdropFilter: 'blur(20px)' }} 
                         exit={{ opacity: 0, backdropFilter: 'blur(0px)' }}
                         className="fixed inset-0 z-[100] bg-black/60 flex justify-center items-center p-4"
+                        onClick={(e) => {
+                            if (e.target === e.currentTarget) setIsUploadModalOpen(false);
+                        }}
                      >
                         <motion.div 
                             initial={{ scale: 0.95, y: 20 }}

frontend/app/globals.css

@@ -56,7 +56,7 @@
 :root {
   --theme-bg-val: #080c14;
   --theme-text-val: #fde8d6;
-  --theme-border-val: rgba(255, 255, 255, 0.05);
+  --theme-border-val: #ffffff0d;
   --theme-glass-val: rgba(8, 12, 20, 0.8);
   --theme-glass-border-val: rgba(255, 255, 255, 0.1);
   --theme-bg: var(--theme-bg-val);

frontend/app/layout.tsx

@@ -18,8 +18,8 @@ const geistMono = Geist_Mono({
 });
 
 export const metadata: Metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: "Spotix",
+  description: "Detect AI generated Image/Video",
 };
 
 import { AuthProvider } from "@/contexts/AuthContext";

frontend/app/login/page.tsx

@@ -94,7 +94,7 @@ export default function LoginPage() {
     };
 
     return (
-        <div id="login-section" className="min-h-[100vh] bg-[var(--theme-bg)] text-[var(--theme-text)] font-sans relative flex justify-center pt-[15vh] px-4 overflow-y-auto overflow-x-hidden pb-32">
+        <div id="login-section" className="min-h-[100vh] bg-[var(--theme-bg)] text-[var(--theme-text)] font-sans relative flex justify-center pt-[10vh] px-4 overflow-y-auto overflow-x-hidden">
             <style dangerouslySetInnerHTML={{
                 __html: `
                 html, body, a, button, [role="button"], input, select, textarea, .cursor-pointer { cursor: none !important; }
@@ -137,7 +137,7 @@ export default function LoginPage() {
                     <div className="absolute -top-40 -right-40 w-80 h-80 bg-theme-text/5 rounded-full blur-[80px] pointer-events-none"></div>
                     
                     <h1 className="text-3xl tracking-widest font-bold mb-2 font-sans uppercase">
-                        Neural<span className="text-[var(--theme-border)]/50">Vault</span> Access
+                        Neural<span className="text-[var(--theme-text)]/50"> Vault</span> Access
                     </h1>
                     <p className="text-[#d0c4bb]/60 text-sm mb-6">Authenticate to seamlessly vault and analyze.</p>
 

frontend/app/not-found.tsx

@@ -28,6 +28,7 @@ export default function NotFoundPage() {
                 
                 .glitch-text {
                     position: relative;
+                    font-size: 200px;
                 }
                 .glitch-text::before, .glitch-text::after {
                     content: attr(data-text);
@@ -38,26 +39,6 @@ export default function NotFoundPage() {
                     height: 100%;
                     opacity: 0.8;
                 }
-                .glitch-text::before {
-                    left: 2px;
-                    text-shadow: -2px 0 red;
-                    clip: rect(24px, 550px, 90px, 0);
-                    animation: glitch-anim 3s infinite linear alternate-reverse;
-                }
-                .glitch-text::after {
-                    left: -2px;
-                    text-shadow: -2px 0 blue;
-                    clip: rect(85px, 550px, 140px, 0);
-                    animation: glitch-anim 2.5s infinite linear alternate-reverse;
-                }
-                @keyframes glitch-anim {
-                    0% { clip: rect(23px, 9999px, 85px, 0); }
-                    20% { clip: rect(98px, 9999px, 14px, 0); }
-                    40% { clip: rect(43px, 9999px, 65px, 0); }
-                    60% { clip: rect(12px, 9999px, 92px, 0); }
-                    80% { clip: rect(76px, 9999px, 34px, 0); }
-                    100% { clip: rect(54px, 9999px, 12px, 0); }
-                }
                 `
             }} />
 
@@ -69,16 +50,8 @@ export default function NotFoundPage() {
                 backgroundSize: '40px 40px'
             }}></div>
 
-            {/* Dynamic Spotlight */}
-            <div 
-                className="absolute inset-0 pointer-events-none z-0 mix-blend-screen opacity-20 transition-opacity duration-300"
-                style={{
-                    background: `radial-gradient(circle 400px at ${mousePos.x}px ${mousePos.y}px, var(--theme-text), transparent 80%)`
-                }}
-            />
-
             <div className="flex-1 flex flex-col items-center justify-center relative z-10 px-6 text-center">
-                <div className="mb-8 relative dash-border rounded-full p-6 bg-[var(--theme-text)]/5 shadow-[0_0_80px_rgba(253,232,214,0.1)]">
+                <div className="mt-20 relative dash-border rounded-full p-6 bg-[var(--theme-text)]/5 shadow-[0_0_80px_rgba(253,232,214,0.1)]">
                     <AlertTriangle className="w-16 h-16 text-red-500/80 animate-pulse !cursor-none" />
                 </div>
                 
@@ -87,19 +60,19 @@ export default function NotFoundPage() {
                 </h1>
                 
                 <div className="bg-red-500/10 border border-red-500/20 text-red-400 font-mono uppercase tracking-[0.3em] text-xs px-4 py-2 rounded-full mb-8 backdrop-blur-md !cursor-none">
-                    SIGNAL LOST // ENDPOINT NOT FOUND
+                    ERROR // ENDPOINT NOT FOUND //
                 </div>
                 
                 <p className="text-[#d0c4bb] max-w-lg mb-12 text-lg font-light leading-relaxed !cursor-none">
-                    The requested temporal coordinate does not exist within the Obsidian network. The neural link has been severed.
+                    The requested temporal coordinate does not exist within the Spotix network.
                 </p>
                 
                 <button 
                     onClick={() => router.push('/')}
-                    className="group relative overflow-hidden rounded-full bg-[var(--theme-text)] text-[var(--theme-bg)] px-10 py-4 font-bold tracking-widest text-sm uppercase transition-all duration-500 hover:shadow-[0_0_40px_rgba(253,232,214,0.3)] hover:scale-105 !cursor-none flex items-center gap-3"
+                    className="group relative overflow-hidden rounded-full bg-[var(--theme-text)] text-[var(--theme-bg)] px-10 py-4 font-bold tracking-widest text-sm uppercase transition-all duration-100 hover:shadow-[0_0_40px_rgba(253,232,214,0.1)] hover:scale-105 !cursor-none flex items-center gap-3"
                 >
-                    <ArrowLeft className="w-5 h-5 transition-transform duration-300 group-hover:-translate-x-1 !cursor-none" />
-                    <span>Return to Gateway</span>
+                    <ArrowLeft className="w-5 h-5 transition-transform duration-100 group-hover:-translate-x-1 !cursor-none" />
+                    <span>Return to Spotix</span>
                     <div className="absolute inset-0 bg-white/20 translate-y-[100%] group-hover:translate-y-[0%] transition-transform duration-500 ease-[cubic-bezier(0.23,1,0.32,1)] rounded-full !cursor-none"></div>
                 </button>
             </div>

frontend/app/page.tsx

@@ -58,6 +58,16 @@ export default function LandingPage() {
         return () => window.removeEventListener('keydown', handleKeyDown);
     }, []);
 
+    // Scroll Lock for Modal
+    useEffect(() => {
+        if (isUploadModalOpen) {
+            document.body.style.overflow = 'hidden';
+        } else {
+            document.body.style.overflow = '';
+        }
+        return () => { document.body.style.overflow = ''; };
+    }, [isUploadModalOpen]);
+
     // Global Cursor & Interactions
     // Note: The global custom cursor is now managed by components/shared/CustomCursor.tsx
 
@@ -273,7 +283,7 @@ export default function LandingPage() {
                     <div className="loader-panel top"></div>
                     <div className="loader-panel bottom"></div>
                     <div className="loader-content flex flex-col items-center">
-                        <div className="text-[10px] font-mono tracking-[0.5em] text-[var(--theme-text)] uppercase mb-4">Initializing Obsidian Engine</div>
+                        <div className="text-[10px] font-mono tracking-[0.5em] text-[var(--theme-text)] uppercase mb-4">Initializing Spotix Engine</div>
                         <div id="progress-bar-container">
                             <div id="progress-bar-fill" style={{ width: `${loadProgress}%` }}></div>
                         </div>

frontend/app/profile/page.tsx

@@ -7,7 +7,7 @@ import { apiLayer } from "@/lib/api";
 import { Camera, Mail, Shield, CheckCircle, Activity, Calendar, Trash2 } from "lucide-react";
 
 export default function ProfilePage() {
-    const { user, isAuthenticated, loading } = useAuth();
+    const { user, isAuthenticated, loading, updateUser } = useAuth();
     const [stats, setStats] = useState({ totalAnalyses: 0 });
     
     // Edit States
@@ -46,6 +46,7 @@ export default function ProfilePage() {
         
         try {
             await apiLayer.updateUsername(usernameInput);
+            updateUser({ name: usernameInput });
             setStatusMsg({ type: "success", text: "Username updated successfully." });
             setIsEditingUsername(false);
             setTimeout(() => setStatusMsg(null), 3000);
@@ -69,6 +70,7 @@ export default function ProfilePage() {
             setLocalAvatar(base64String);
             try {
                 await apiLayer.updateAvatar(base64String);
+                updateUser({ avatar_url: base64String });
                 setStatusMsg({ type: "success", text: "Avatar updated successfully." });
                 setTimeout(() => setStatusMsg(null), 3000);
             } catch (err) {

frontend/app/result/[id]/page.tsx

@@ -40,12 +40,25 @@ export default function ResultPage() {
 
     useEffect(() => {
         const handleKeyDown = (e: KeyboardEvent) => {
-            if (e.key === 'Escape') setShowAuthModal(false);
+            if (e.key === 'Escape') {
+                setShowAuthModal(false);
+                setIsUploadModalOpen(false);
+            }
         };
         window.addEventListener('keydown', handleKeyDown);
         return () => window.removeEventListener('keydown', handleKeyDown);
     }, []);
 
+    // Scroll Lock for Modal
+    useEffect(() => {
+        if (isUploadModalOpen) {
+            document.body.style.overflow = 'hidden';
+        } else {
+            document.body.style.overflow = '';
+        }
+        return () => { document.body.style.overflow = ''; };
+    }, [isUploadModalOpen]);
+
     useEffect(() => {
         let dragTimer: NodeJS.Timeout;
         const handleDragOver = (e: DragEvent) => {
@@ -211,7 +224,7 @@ export default function ResultPage() {
                 <div className="absolute inset-0 flex flex-col items-center justify-center z-50">
                     <div className="font-mono text-sm uppercase tracking-widest text-[#d0c4bb] mb-6">Error Establishing Uplink</div>
                     <button onClick={() => router.push("/")} className="bg-[var(--theme-text)]/10 px-8 py-3 rounded-full hover:bg-[var(--theme-text)]/20 transition-all text-sm font-bold border border-theme-border !cursor-none group">
-                        Return to Platform
+                        RETURN TO PLATFORM
                     </button>
                 </div>
             ) : (
@@ -239,7 +252,7 @@ export default function ResultPage() {
                 {/* Left Side: Media Preview */}
                 <div className="lg:w-1/2 flex flex-col gap-6">
                     <div className="flex justify-between items-end mb-2 relative">
-                        <h2 className="text-sm font-mono tracking-widest text-[var(--theme-text)]/90 uppercase">Extracted File</h2>
+                        <h2 className="text-sm font-mono tracking-widest text-[var(--theme-text)]/90 uppercase">Analyzed File</h2>
                         {heatmapUrl && (
                             <div className="text-xs font-semibold uppercase tracking-wider text-[var(--theme-text)] bg-theme-text/5 px-4 py-1.5 rounded-full border border-theme-border">
                                 DRAG TO REVEAL HEATMAP
@@ -318,14 +331,14 @@ export default function ResultPage() {
                                 verdictStatus === 'SUSPICIOUS' ? 'text-amber-400' :
                                 'text-emerald-400'
                             }`}>
-                                Neural Verdict
+                                Analysis Verdict
                             </span>
-                            <h1 className="text-5xl md:text-6xl font-black tracking-tight text-[var(--theme-text)] my-2">
+                            <h1 className="text-5xs md:text-6xl font-black tracking-tight text-[var(--theme-text)] my-2">
                                 {label}
                             </h1>
                             {confidenceVal !== null && (
-                                <div className="text-3xl font-light text-[var(--theme-border)]">
-                                    {confidenceVal.toFixed(1)}% <span className="text-lg opacity-60">Confidence</span>
+                                <div className="text-3xl font-light text-[var(--theme-text)]">
+                                    {confidenceVal.toFixed(1)}% <span className="text-lg opacity-100">Confidence</span>
                                 </div>
                             )}
                             {nsfwScore !== null && (
@@ -339,9 +352,9 @@ export default function ResultPage() {
                     {/* Diagnostic Explanation Box */}
                     <div className="upload-glass p-8 rounded-3xl relative overflow-hidden group">
                         <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-[var(--theme-border)]/20 to-transparent transform -translate-x-full group-hover:translate-x-full transition-transform duration-1000"></div>
-                        <h3 className="text-sm font-semibold uppercase tracking-widest text-[#d0c4bb] mb-4">Diagnostic Output</h3>
+                        <h3 className="text-sm font-semibold uppercase tracking-widest text-[#d0c4bb] mb-4">AI Explanation</h3>
                         <p className="text-sm text-theme-text/80 leading-relaxed font-light">
-                            {fileData?.ai_explanation ? fileData.ai_explanation : 'The neural engine has evaluated structural frequencies and edge patterns. No anomalies flagged in standard distribution.'}
+                            {fileData?.ai_explanation ? fileData.ai_explanation : 'The Spotix engine has evaluated structural frequencies and edge patterns. No anomalies flagged in standard distribution.'}
                         </p>
                     </div>
 
@@ -349,10 +362,10 @@ export default function ResultPage() {
                     <div className="grid grid-cols-1 md:grid-cols-2 gap-5">
                         <div className="upload-glass p-6 rounded-2xl flex flex-col gap-4 !cursor-none relative overflow-hidden group">
                             <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-[var(--theme-border)]/30 to-transparent transform -translate-x-full group-hover:translate-x-full transition-transform duration-1000"></div>
-                            <Activity className="w-6 h-6 text-[var(--theme-border)] opacity-80" />
+                            <Activity className="w-6 h-6 text-[var(--theme-text)] opacity-80" />
                             <div>
                                 <h4 className="text-[var(--theme-text)] font-bold text-lg mb-1">Neural Fingerprint</h4>
-                                <p className="text-[#d0c4bb] text-xs leading-relaxed opacity-80 mb-3">Frequency bounds evaluated across 512 discrete localized convolutions.</p>
+                                <p className="text-[#d0c4bb] text-xs leading-relaxed opacity-80 mb-8">Frequency bounds evaluated across 512 discrete localized convolutions.</p>
                                 {freqScore !== null && (
                                     <div className="flex items-end gap-2">
                                         <span className="text-2xl font-mono text-emerald-400/90">{freqScore}</span>
@@ -364,7 +377,7 @@ export default function ResultPage() {
 
                         <div className="upload-glass p-6 rounded-2xl flex flex-col gap-4 !cursor-none relative overflow-hidden group">
                             <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-[var(--theme-border)]/30 to-transparent transform -translate-x-full group-hover:translate-x-full transition-transform duration-1000 delay-100"></div>
-                            <Layers className="w-6 h-6 text-[var(--theme-border)] opacity-80" />
+                            <Layers className="w-6 h-6 text-[var(--theme-text)] opacity-80" />
                             <div>
                                 <h4 className="text-[var(--theme-text)] font-bold text-lg mb-1">Noise Pattern</h4>
                                 <p className="text-[#d0c4bb] text-xs leading-relaxed opacity-80 mb-3">Evaluating PRNU map distribution. Sensor consistency is within normal threshold.</p>
@@ -379,9 +392,9 @@ export default function ResultPage() {
 
                         <div className="upload-glass p-6 rounded-2xl flex flex-col gap-4 !cursor-none md:col-span-2 relative overflow-hidden group">
                              <div className="absolute top-0 left-0 w-full h-[1px] bg-gradient-to-r from-transparent via-[var(--theme-border)]/30 to-transparent transform -translate-x-full group-hover:translate-x-full transition-transform duration-1000 delay-200"></div>
-                            <Hash className="w-6 h-6 text-[var(--theme-border)] opacity-80" />
+                            <Hash className="w-6 h-6 text-[var(--theme-text)] opacity-80" />
                             <div>
-                                <h4 className="text-[var(--theme-text)] font-bold text-lg mb-1">Detection Signals</h4>
+                                <h4 className="text-[var(--theme-text)] font-bold text-lg mb-4">Detection Tags</h4>
                                 <p className="text-[#d0c4bb] text-xs leading-relaxed opacity-80 flex flex-wrap gap-2">
                                     {displayTags.map(tag => (
                                         <span key={tag} className="inline-block px-3 py-1 bg-theme-text/5 rounded-md border border-theme-border font-mono capitalize shadow-sm">

frontend/components/dashboard/AnalyticsSection.tsx

@@ -52,16 +52,16 @@ export default function AnalyticsSection({ files }: { files: any[] }) {
                  {/* Quick Stats Column */}
                  <div className="flex flex-col gap-6 lg:col-span-1">
                      <div className="p-6 bg-[var(--theme-text)]/5 border border-[var(--theme-border)] rounded-2xl dash-border hover:bg-[var(--theme-text)]/10 transition backdrop-blur-sm">
-                         <h3 className="text-[var(--theme-text)]/40 uppercase tracking-widest text-xs mb-2">Total Analyses</h3>
+                         <h3 className="text-[var(--theme-text)]/60 uppercase tracking-widest text-[14px] mb-4">Total Analyses</h3>
                          <p className="text-4xl font-bold font-mono tracking-tighter text-[var(--theme-text)]">{stats.summary.total}</p>
                      </div>
                      <div className="grid grid-cols-2 gap-6">
                         <div className="p-6 bg-[var(--theme-text)]/5 border border-[var(--theme-border)] rounded-2xl hover:border-red-500/50 transition backdrop-blur-sm group">
-                            <h3 className="text-[var(--theme-text)]/40 uppercase tracking-widest text-[10px] mb-2">Synthetic</h3>
+                            <h3 className="text-[var(--theme-text)]/40 uppercase tracking-widest text-[14px] mb-6.5">Synthetic</h3>
                             <p className="text-2xl font-bold font-mono text-red-400 group-hover:text-red-300 transition">{stats.summary.ai}%</p>
                         </div>
                         <div className="p-6 bg-[var(--theme-text)]/5 border border-[var(--theme-border)] rounded-2xl hover:border-green-500/50 transition backdrop-blur-sm group">
-                            <h3 className="text-[var(--theme-text)]/40 uppercase tracking-widest text-[10px] mb-2">Authentic</h3>
+                            <h3 className="text-[var(--theme-text)]/40 uppercase tracking-widest text-[14px] mb-6.5">Authentic</h3>
                             <p className="text-2xl font-bold font-mono text-green-400 group-hover:text-green-300 transition">{stats.summary.real}%</p>
                         </div>
                      </div>

frontend/components/dashboard/HistoryGrid.tsx

@@ -42,7 +42,7 @@ export default function HistoryGrid({ files, onDeleteFile }: { files: any[], onD
                     <Clock className="w-6 h-6 text-[var(--theme-text)]/20 !cursor-none" />
                 </div>
                 <p className="text-[var(--theme-text)]/40 mb-2 font-mono text-sm tracking-widest uppercase !cursor-none">No analyses yet</p>
-                <p className="text-[var(--theme-text)]/30 text-xs text-center max-w-sm !cursor-none">Upload media using the button above to begin generating your detection history.</p>
+                <p className="text-[var(--theme-text)]/30 text-xs text-center max-w-sm !cursor-none">Upload media using the [Analyze New Media] button above to begin generating your detection history.</p>
             </div>
         );
     }
@@ -149,7 +149,7 @@ export default function HistoryGrid({ files, onDeleteFile }: { files: any[], onD
                             </div>
                             <div className="p-6 !cursor-none">
                                 <p className="text-[var(--theme-text)]/70 text-sm mb-6 !cursor-none">
-                                    Are you sure you want to delete <strong className="text-[var(--theme-text)] font-mono">{fileToDelete.filename}</strong>? This action cannot be undone and will permanently remove the item from the Obsidian Engine.
+                                    Are you sure you want to delete <strong className="text-[var(--theme-text)] font-mono">{fileToDelete.filename}</strong>? This action cannot be undone and will permanently remove the item from Spotix.
                                 </p>
                                 <div className="flex gap-3 !cursor-none">
                                     <button 

frontend/components/shared/FeedbackModal.tsx

@@ -11,7 +11,7 @@ export default function FeedbackModal({ isOpen, onClose }: { isOpen: boolean, on
     const [status, setStatus] = useState<"idle" | "loading" | "success" | "error">("idle");
     const [errorMsg, setErrorMsg] = useState("");
 
-    const handleSubmit = async (e: React.FormEvent) => {
+    const handleSubmit = async (e: React.SubmitEvent) => {
         e.preventDefault();
         if (message.trim().length < 5) {
             setErrorMsg("Message must be at least 5 characters.");

frontend/components/shared/Navbar.tsx

@@ -12,7 +12,7 @@ interface NavbarProps {
 export default function Navbar({ onAnalyzeClick }: NavbarProps) {
     const router = useRouter();
     const pathname = usePathname();
-    const { isAuthenticated, user, logout } = useAuth();
+    const { isAuthenticated, user, logout, updateUser } = useAuth();
     const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
     const [dropdownOpen, setDropdownOpen] = useState(false);
     
@@ -69,6 +69,7 @@ export default function Navbar({ onAnalyzeClick }: NavbarProps) {
             setLocalAvatar(base64String);
             try {
                 await apiLayer.updateAvatar(base64String);
+                updateUser({ avatar_url: base64String });
             } catch (err) {
                 console.error("Failed to update avatar:", err);
             }
@@ -84,6 +85,7 @@ export default function Navbar({ onAnalyzeClick }: NavbarProps) {
         }
         try {
             await apiLayer.updateAvatar("");
+            updateUser({ avatar_url: null });
         } catch (err) {
             console.error("Failed to remove avatar:", err);
         }
@@ -94,7 +96,7 @@ export default function Navbar({ onAnalyzeClick }: NavbarProps) {
         <>
             <nav className="fixed top-6 left-1/2 -translate-x-1/2 z-[60] w-[92%] max-w-5xl">
                 <div className="bg-[var(--theme-bg)]/60 backdrop-blur-xl border border-[#4d453e]/15 rounded-full px-6 md:px-8 py-3 md:py-4 flex justify-between items-center shadow-[0_20px_50px_rgba(0,0,0,0.4)] transition-all duration-500">
-                    <div onClick={() => router.push('/')} className="cursor-pointer text-base md:text-lg font-black tracking-tighter text-[var(--theme-text)] uppercase hover:opacity-80 transition-opacity">OBSIDIAN</div>
+                    <div onClick={() => router.push('/')} className="cursor-pointer text-base md:text-lg font-black tracking-tighter text-[var(--theme-text)] uppercase hover:opacity-80 transition-opacity">SPOTIX</div>
                     
                     <div className="hidden lg:flex items-center gap-10">
                         <a className={`font-['Inter'] tracking-tight font-medium text-[11px] uppercase transition-colors nav-link ${pathname === '/' ? 'text-[var(--theme-text)]' : 'text-[#d0c4bb] hover:text-[var(--theme-text)]'}`} href="/">Platform</a>

frontend/components/upload/UploadZone.tsx

@@ -149,8 +149,7 @@ export default function UploadZone({ autoAnalyze = false }: { autoAnalyze?: bool
                 </defs>
             </svg>
 
-            <div 
-                className={`rounded-[2.5rem] p-1 md:p-2 bg-[var(--theme-bg)] backdrop-blur-3xl border-2 border-dashed border-[var(--theme-text)]/40 relative overflow-hidden group/upload transition-all duration-700 shadow-[0_40px_100px_rgba(0,0,0,0.5)] hover:border-[var(--theme-text)] hover:shadow-[0_0_40px_var(--theme-text)] ${isDragging ? 'border-[var(--theme-text)] shadow-[0_0_60px_var(--theme-text)]' : ''}`}
+            <div className={`rounded-[2.5rem] p-1 md:p-2 bg-[var(--theme-bg)] backdrop-blur-3xl border-2 border-dashed border-[var(--theme-text)]/40 relative overflow-hidden group/upload transition-all duration-700 hover:border-[var(--theme-text)] ${isDragging ? 'border-[var(--theme-text)]' : ''}`}
                 onDragOver={onDragOver}
                 onDragLeave={onDragLeave}
                 onDrop={onDrop}

frontend/contexts/AuthContext.tsx

@@ -9,6 +9,8 @@ type UserData = {
   name: string;
   is_admin: boolean;
   avatar_url?: string | null;
+  google_avatar_url?: string | null;
+  created_at?: string | null;
 };
 
 type AuthContextType = {
@@ -16,9 +18,10 @@ type AuthContextType = {
   user: UserData | null;
   loading: boolean;
   logout: () => void;
+  updateUser: (data: Partial<UserData>) => void;
 };
 
-const AuthContext = createContext<AuthContextType>({ isAuthenticated: false, user: null, loading: true, logout: () => {} });
+const AuthContext = createContext<AuthContextType>({ isAuthenticated: false, user: null, loading: true, logout: () => {}, updateUser: () => {} });
 
 export function AuthProvider({ children }: { children: React.ReactNode }) {
   const [isAuthenticated, setIsAuthenticated] = useState(false);
@@ -58,8 +61,12 @@ export function AuthProvider({ children }: { children: React.ReactNode }) {
     router.push("/login");
   };
 
+  const updateUser = (data: Partial<UserData>) => {
+    setUser(prev => prev ? { ...prev, ...data } : null);
+  };
+
   return (
-    <AuthContext.Provider value={{ isAuthenticated, user, loading, logout }}>
+    <AuthContext.Provider value={{ isAuthenticated, user, loading, logout, updateUser }}>
       {children}
     </AuthContext.Provider>
   );