Added backend to status page

frontend/app/page.tsx

@@ -16,7 +16,7 @@ function DeletedToastManager() {
         if (searchParams.get("deleted") === "true") {
             setDeletedToast(true);
             setTimeout(() => setDeletedToast(false), 5000);
-            
+
             // Clean up URL
             const url = new URL(window.location.href);
             url.searchParams.delete("deleted");
@@ -48,7 +48,7 @@ export default function LandingPage() {
         const handleEsc = (e: KeyboardEvent) => {
             if (e.key === 'Escape' && isUploadModalOpen) setIsUploadModalOpen(false);
         };
-        
+
         window.addEventListener('dragover', handleDragOver);
         window.addEventListener('keydown', handleEsc);
         return () => {
@@ -60,7 +60,7 @@ export default function LandingPage() {
     // --- Footer Copyright and Dynamic Date ---
     const [year, setYear] = useState(new Date().getFullYear());
 
-    useEffect(() =>{
+    useEffect(() => {
         setYear(new Date().getFullYear());
     }, []);
 
@@ -354,14 +354,14 @@ export default function LandingPage() {
 
             {/* Hero Section */}
             <section className="relative min-h-screen flex flex-col justify-center px-6 md:px-12 pt-32 pb-32 overflow-hidden bg-[var(--theme-bg)]" id="hero-section">
-                
+
 
                 <div className="absolute inset-0 bg-[var(--theme-bg)] z-0"></div>
                 <div className="absolute inset-0 opacity-40 pointer-events-none bg-[radial-gradient(circle_at_50%_50%,_#11141d_0%,_var(--theme-bg)_100%)] z-[1]" id="hero-bg"></div>
                 <div className="absolute inset-0 z-[2] opacity-[0.03] pointer-events-none" style={{ backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.90' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")` }}></div>
                 <div className="absolute inset-0 pointer-events-none" id="hero-grid"></div>
                 <div className="absolute inset-0 pointer-events-none" id="hero-glow"></div>
-                
+
                 <div className="relative z-10 max-w-5xl mx-auto w-full flex flex-col items-center lg:items-start text-center lg:text-left h-full justify-center min-h-[500px]">
 
                     {/* Main Hero Content */}
@@ -396,21 +396,21 @@ export default function LandingPage() {
 
                 <div className="absolute right-[-5%] bottom-[10%] w-1/3 aspect-square breathing-glow rounded-full blur-[80px] opacity-30 scroll-reveal z-0"></div>
             </section>
-                    <div
-                        className={`fixed inset-0 z-[999] flex flex-col items-center justify-center p-6 md:p-12 transition-all duration-1000 ease-[cubic-bezier(0.23,1,0.32,1)] ${isUploadModalOpen ? 'opacity-100 visible bg-black/60 backdrop-blur-md' : 'opacity-0 invisible pointer-events-none'}`}
-                        id="hero-upload-inline"
-                        onClick={(e) => {
-                            if (e.target === e.currentTarget) {
-                                setIsUploadModalOpen(false);
-                            }
-                        }}
-                    >
-                        <div className="w-full relative z-[110] max-w-5xl h-full max-h-[80vh] flex flex-col pointer-events-none" id="upload-content-box">
+            <div
+                className={`fixed inset-0 z-[999] flex flex-col items-center justify-center p-6 md:p-12 transition-all duration-1000 ease-[cubic-bezier(0.23,1,0.32,1)] ${isUploadModalOpen ? 'opacity-100 visible bg-black/60 backdrop-blur-md' : 'opacity-0 invisible pointer-events-none'}`}
+                id="hero-upload-inline"
+                onClick={(e) => {
+                    if (e.target === e.currentTarget) {
+                        setIsUploadModalOpen(false);
+                    }
+                }}
+            >
+                <div className="w-full relative z-[110] max-w-5xl h-full max-h-[80vh] flex flex-col pointer-events-none" id="upload-content-box">
                     <div className="w-full max-w-2xl mx-auto flex flex-col items-center justify-center min-h-[400px] pointer-events-auto">
                         <UploadZone autoAnalyze={true} />
                     </div>
                 </div>
-                    </div>
+            </div>
 
 
             {/* Demo Section */}
@@ -572,8 +572,8 @@ export default function LandingPage() {
 
                     </div>
                     <div className="flex flex-wrap justify-center gap-x-12 gap-y-6 items-center">
-                        <a className="font-['Inter'] uppercase tracking-[0.2em] text-[10px] text-[#d0c4bb] transition-all duration-300 flex items-center gap-2 group hover:text-green-400 hover:drop-shadow-[0_0_8px_rgba(74,222,128,0.5)] cursor-pointer" href="#">
-                            <span><a href="https://stats.uptimerobot.com/25WvbZF0wj" target="_blank">System Status</a></span>
+                        <a href="https://stats.uptimerobot.com/25WvbZF0wj" target="_blank" className="font-['Inter'] uppercase tracking-[0.2em] text-[10px] text-[#d0c4bb] transition-all duration-300 flex items-center gap-2 group hover:text-green-400 hover:drop-shadow-[0_0_8px_rgba(74,222,128,0.5)] cursor-pointer" href="#">
+                            <span><a>System Status</a></span>
                             <span className="text-[9px] bg-[var(--theme-text)]/5 px-2 py-0.5 rounded-full border border-[var(--theme-text)]/10 group-hover:border-green-500/30 group-hover:bg-green-500/10 flex items-center gap-1.5 transition-colors">
                                 <span className="w-1.5 h-1.5 rounded-full bg-[var(--theme-text)]/40 group-hover:bg-green-400 group-hover:animate-pulse transition-colors"></span>
                                 Online