diff --git a/app/components/admin/HomepageContent.vue b/app/components/admin/HomepageContent.vue
index 038ea92..03f8dd0 100644
--- a/app/components/admin/HomepageContent.vue
+++ b/app/components/admin/HomepageContent.vue
@@ -42,17 +42,32 @@
         </SettingsGroup>
 
         <SettingsGroup
-          label="Status Badge"
+          label="Status Badge (Online)"
           description="Text shown in the pill badge above the title."
         >
           <input
-            v-model="statusBadgeText"
+            v-model="statusBadgeTextOnline"
             type="text"
             maxlength="100"
             class="w-full bg-bg-tertiary border border-border rounded px-3 py-2 text-sm text-text-primary focus:outline-none focus:border-white/20"
             placeholder="Tracker Online & Operational"
           />
-        </SettingsGroup>
+        </div>
+
+        <div>
+          <label
+            class="text-[10px] font-bold uppercase tracking-widest text-text-muted block mb-2"
+          >
+            Status Badge (Offline)
+          </label>
+          <input
+            v-model="statusBadgeTextOffline"
+            type="text"
+            maxlength="100"
+            class="w-full bg-bg-tertiary border border-border rounded px-3 py-2 text-sm text-text-primary focus:outline-none focus:border-white/20"
+            placeholder="Tracker Offline"
+          />
+        </div>
       </div>
 
       <!-- Feature Boxes -->
@@ -146,7 +161,8 @@ onMounted(async () => {
     const settings = await $fetch<{
       heroTitle: string;
       heroSubtitle: string;
-      statusBadgeText: string;
+      statusBadgeTextOnline: string;
+      statusBadgeTextOffline: string;
       feature1Title: string;
       feature1Desc: string;
       feature2Title: string;
@@ -157,7 +173,8 @@ onMounted(async () => {
 
     heroTitle.value = settings.heroTitle;
     heroSubtitle.value = settings.heroSubtitle;
-    statusBadgeText.value = settings.statusBadgeText;
+    statusBadgeTextOnline.value = settings.statusBadgeTextOnline;
+    statusBadgeTextOffline.value = settings.statusBadgeTextOffline;
     features.value = [
       { title: settings.feature1Title, description: settings.feature1Desc },
       { title: settings.feature2Title, description: settings.feature2Desc },
@@ -176,7 +193,8 @@ async function saveContent() {
       body: {
         heroTitle: heroTitle.value,
         heroSubtitle: heroSubtitle.value,
-        statusBadgeText: statusBadgeText.value,
+        statusBadgeTextOnline: statusBadgeTextOnline.value,
+        statusBadgeTextOffline: statusBadgeTextOffline.value,
         feature1Title: features.value[0]?.title ?? '',
         feature1Desc: features.value[0]?.description ?? '',
         feature2Title: features.value[1]?.title ?? '',
diff --git a/app/pages/admin.vue b/app/pages/admin.vue
index f75047a..d9e33da 100644
--- a/app/pages/admin.vue
+++ b/app/pages/admin.vue
@@ -34,10 +34,12 @@
           >
             <span class="relative flex h-2 w-2">
               <span
+                v-if="trackerOnline"
                 class="animate-ping absolute inline-flex h-full w-full rounded-full bg-success opacity-75"
               ></span>
               <span
-                class="relative inline-flex rounded-full h-2 w-2 bg-success"
+                class="relative inline-flex rounded-full h-2 w-2"
+                :class="trackerOnline ? 'bg-success' : 'bg-error'"
               ></span>
             </span>
             LIVE TRACKER FEED
@@ -140,4 +142,10 @@ const currentItem = computed(
 
 const currentTitle = computed(() => currentItem?.value?.label);
 const currentDescription = computed(() => currentItem?.value?.description);
+
+const { data: trackerStatus } = await useFetch('/api/tracker-status', {
+  server: false,
+});
+
+const trackerOnline = computed(() => trackerStatus.value?.online ?? false);
 </script>
diff --git a/app/pages/index.vue b/app/pages/index.vue
index 0583aad..d1b60f0 100644
--- a/app/pages/index.vue
+++ b/app/pages/index.vue
@@ -7,17 +7,17 @@
       >
         <span class="relative flex h-2 w-2">
           <span
+            v-if="trackerOnline"
             class="animate-ping absolute inline-flex h-full w-full rounded-full bg-success opacity-75"
           ></span>
           <span
-            class="relative inline-flex rounded-full h-2 w-2 bg-success"
+            class="relative inline-flex rounded-full h-2 w-2"
+            :class="trackerOnline ? 'bg-success' : 'bg-error'"
           ></span>
         </span>
         <span
           class="text-[10px] font-bold uppercase tracking-widest text-text-muted"
-          >{{
-            content?.statusBadgeText ?? 'Tracker Online & Operational'
-          }}</span
+          >{{ trackerOnline ? (content?.statusBadgeTextOnline ?? 'Tracker Online & Operational') : (content?.statusBadgeTextOffline ?? 'Tracker Offline') }}</span
         >
       </div>
       <h1
@@ -202,6 +202,12 @@ const { data: torrentsData } = await useFetch<{ data: TorrentWithStats[] }>(
 );
 
 const recentTorrents = computed(() => torrentsData.value?.data ?? []);
+
+const { data: trackerStatus } = await useFetch('/api/tracker-status', {
+  server: false,
+});
+
+const trackerOnline = computed(() => trackerStatus.value?.online ?? false);
 </script>
 
 <style>
diff --git a/server/api/admin/settings.get.ts b/server/api/admin/settings.get.ts
index 92e48ee..645a1b7 100644
--- a/server/api/admin/settings.get.ts
+++ b/server/api/admin/settings.get.ts
@@ -21,7 +21,8 @@ import {
   getAnnouncementType,
   getHeroTitle,
   getHeroSubtitle,
-  getStatusBadgeText,
+  getStatusBadgeTextOnline,
+  getStatusBadgeTextOffline,
   getFeature1Title,
   getFeature1Desc,
   getFeature2Title,
@@ -60,7 +61,8 @@ export default defineEventHandler(async (event) => {
   const announcementType = await getAnnouncementType();
   const heroTitle = await getHeroTitle();
   const heroSubtitle = await getHeroSubtitle();
-  const statusBadgeText = await getStatusBadgeText();
+  const statusBadgeTextOnline = await getStatusBadgeTextOnline();
+  const statusBadgeTextOffline = await getStatusBadgeTextOffline();
   const feature1Title = await getFeature1Title();
   const feature1Desc = await getFeature1Desc();
   const feature2Title = await getFeature2Title();
@@ -92,7 +94,8 @@ export default defineEventHandler(async (event) => {
     announcementType,
     heroTitle,
     heroSubtitle,
-    statusBadgeText,
+    statusBadgeTextOnline,
+    statusBadgeTextOffline,
     feature1Title,
     feature1Desc,
     feature2Title,
diff --git a/server/api/admin/settings.put.ts b/server/api/admin/settings.put.ts
index 420dbd2..a01a509 100644
--- a/server/api/admin/settings.put.ts
+++ b/server/api/admin/settings.put.ts
@@ -139,8 +139,12 @@ export default defineEventHandler(async (event) => {
     await setSetting(SETTINGS_KEYS.HERO_SUBTITLE, body.heroSubtitle);
   }
 
-  if (typeof body.statusBadgeText === 'string') {
-    await setSetting(SETTINGS_KEYS.STATUS_BADGE_TEXT, body.statusBadgeText);
+  if (typeof body.statusBadgeTextOnline === 'string') {
+    await setSetting(SETTINGS_KEYS.STATUS_BADGE_TEXT_ONLINE, body.statusBadgeTextOnline);
+  }
+
+  if (typeof body.statusBadgeTextOffline === 'string') {
+    await setSetting(SETTINGS_KEYS.STATUS_BADGE_TEXT_OFFLINE, body.statusBadgeTextOffline);
   }
 
   if (typeof body.feature1Title === 'string') {
diff --git a/server/api/admin/stats.get.ts b/server/api/admin/stats.get.ts
index 8e7328e..6b01aed 100644
--- a/server/api/admin/stats.get.ts
+++ b/server/api/admin/stats.get.ts
@@ -3,6 +3,7 @@ import { db, schema } from '../../db';
 import { sql } from 'drizzle-orm';
 import { redis } from '../../redis/client';
 import { requireAdminSession } from '../../utils/adminAuth';
+import { checkProtocolHealth } from '../../utils/protocolHealthCheck';
 
 export default defineEventHandler(async (event) => {
   // Require admin authentication
@@ -51,23 +52,11 @@ export default defineEventHandler(async (event) => {
     console.error('[Stats] Failed to fetch peer count from Redis:', err);
   }
 
-  // Try to get tracker, may fail if native modules aren't built
-  let tracker = null;
-  let protocols = { http: false, udp: false, ws: false };
+  // Check protocol health dynamically
+  const protocols = await checkProtocolHealth();
 
-  try {
-    const { getTracker } = await import('../../tracker');
-    tracker = getTracker();
-    if (tracker) {
-      protocols = {
-        http: !!tracker.http,
-        udp: !!tracker.udp,
-        ws: !!tracker.ws,
-      };
-    }
-  } catch {
-    // Tracker not available (native modules not built)
-  }
+  // Determine tracker status based on protocol health
+  const tracker = protocols.http || protocols.udp || protocols.ws;
 
   return {
     status: tracker ? 'running' : 'stopped',
diff --git a/server/api/homepage-content.get.ts b/server/api/homepage-content.get.ts
index 606c388..b05bd51 100644
--- a/server/api/homepage-content.get.ts
+++ b/server/api/homepage-content.get.ts
@@ -1,7 +1,8 @@
 import {
   getHeroTitle,
   getHeroSubtitle,
-  getStatusBadgeText,
+  getStatusBadgeTextOnline,
+  getStatusBadgeTextOffline,
   getFeature1Title,
   getFeature1Desc,
   getFeature2Title,
@@ -17,7 +18,8 @@ import {
 export default defineEventHandler(async () => {
   const heroTitle = await getHeroTitle();
   const heroSubtitle = await getHeroSubtitle();
-  const statusBadgeText = await getStatusBadgeText();
+  const statusBadgeTextOnline = await getStatusBadgeTextOnline();
+  const statusBadgeTextOffline = await getStatusBadgeTextOffline();
   const feature1Title = await getFeature1Title();
   const feature1Desc = await getFeature1Desc();
   const feature2Title = await getFeature2Title();
@@ -28,7 +30,8 @@ export default defineEventHandler(async () => {
   return {
     heroTitle,
     heroSubtitle,
-    statusBadgeText,
+    statusBadgeTextOnline,
+    statusBadgeTextOffline,
     features: [
       { title: feature1Title, description: feature1Desc },
       { title: feature2Title, description: feature2Desc },
diff --git a/server/api/tracker-status.get.ts b/server/api/tracker-status.get.ts
new file mode 100644
index 0000000..f8d6b49
--- /dev/null
+++ b/server/api/tracker-status.get.ts
@@ -0,0 +1,15 @@
+import { checkProtocolHealth } from '../utils/protocolHealthCheck';
+
+/**
+ * GET /api/tracker-status
+ * Lightweight endpoint to check if tracker is online
+ * Used for real-time status indicators on homepage and admin panel
+ */
+export default defineEventHandler(async () => {
+  const protocols = await checkProtocolHealth();
+  
+  return {
+    online: protocols.http || protocols.udp || protocols.ws,
+    protocols,
+  };
+});
diff --git a/server/utils/protocolHealthCheck.ts b/server/utils/protocolHealthCheck.ts
new file mode 100644
index 0000000..e91b0ce
--- /dev/null
+++ b/server/utils/protocolHealthCheck.ts
@@ -0,0 +1,123 @@
+/**
+ * Protocol Health Check Utility
+ * Dynamically checks if tracker protocols are actually responding
+ */
+
+export interface ProtocolStatus {
+  http: boolean;
+  udp: boolean;
+  ws: boolean;
+}
+
+/**
+ * Check if HTTP tracker is responding
+ */
+async function checkHttpHealth(): Promise<boolean> {
+  try {
+    // Use local tracker port for health check to avoid Cloudflare/proxy issues
+    const httpPort = process.env.TRACKER_HTTP_PORT || '8080';
+    const httpUrl = `http://localhost:${httpPort}`;
+
+    const controller = new AbortController();
+    const timeoutId = setTimeout(() => controller.abort(), 2000); // 2 second timeout
+
+    try {
+      const response = await fetch(httpUrl, {
+        method: 'GET',
+        signal: controller.signal,
+      });
+      clearTimeout(timeoutId);
+      
+      // Read response body
+      const text = await response.text();
+      
+      // Valid tracker responses are bencoded and start with 'd'
+      if (text.startsWith('d')) {
+        return true;
+      }
+      
+      // If we get here, it's not a valid tracker response
+      return false;
+    } catch (fetchError: any) {
+      clearTimeout(timeoutId);
+      
+      // Timeout means server didn't respond
+      if (fetchError.name === 'AbortError') {
+        return false;
+      }
+      
+      // Connection refused means server is down
+      if (fetchError.cause?.code === 'ECONNREFUSED' || fetchError.cause?.code === 'ECONNRESET') {
+        return false;
+      }
+      
+      // Network errors mean server is unreachable
+      return false;
+    }
+  } catch (error) {
+    console.error('[Health Check] HTTP check failed:', error);
+    return false;
+  }
+}
+
+/**
+ * Check if UDP tracker is responding
+ * TODO: Implement UDP health check
+ * Port: 6969 (from TRACKER_UDP_URL)
+ */
+async function checkUdpHealth(): Promise<boolean> {
+  try {
+    const udpUrl = process.env.TRACKER_UDP_URL;
+    if (!udpUrl) {
+      return false;
+    }
+
+    // TODO: Implement UDP connection test
+    // This requires sending a UDP connect request to the tracker
+    // and waiting for a response
+    // For now, return false as UDP is disabled in the tracker config
+    return false;
+  } catch (error) {
+    console.error('[Health Check] UDP check failed:', error);
+    return false;
+  }
+}
+
+/**
+ * Check if WebSocket tracker is responding
+ * TODO: Implement WebSocket health check
+ */
+async function checkWsHealth(): Promise<boolean> {
+  try {
+    const wsUrl = process.env.TRACKER_WS_URL;
+    if (!wsUrl) {
+      return false;
+    }
+
+    // TODO: Implement WebSocket connection test
+    // This requires opening a WebSocket connection and checking if it connects
+    // For now, return false as WS is disabled in the tracker config
+    return false;
+  } catch (error) {
+    console.error('[Health Check] WebSocket check failed:', error);
+    return false;
+  }
+}
+
+/**
+ * Check all protocol health statuses
+ * Returns the current status of each protocol
+ */
+export async function checkProtocolHealth(): Promise<ProtocolStatus> {
+  const [http, udp, ws] = await Promise.all([
+    checkHttpHealth(),
+    checkUdpHealth(),
+    checkWsHealth(),
+  ]);
+
+  return {
+    http,
+    udp,
+    ws,
+  };
+}
diff --git a/server/utils/schemas.ts b/server/utils/schemas.ts
index 5fdf349..1e299d5 100644
--- a/server/utils/schemas.ts
+++ b/server/utils/schemas.ts
@@ -152,16 +152,17 @@ export const adminSettingsSchema = z.object({
   announcementEnabled: z.boolean().optional(),
   announcementMessage: z.string().max(500).optional(),
   announcementType: z.enum(['info', 'warning', 'error']).optional(),
-  // Homepage content (rich text HTML)
-  heroTitle: z.string().max(2000).optional(),
-  heroSubtitle: z.string().max(5000).optional(),
-  statusBadgeText: z.string().max(100).optional(),
-  feature1Title: z.string().max(500).optional(),
-  feature1Desc: z.string().max(2000).optional(),
-  feature2Title: z.string().max(500).optional(),
-  feature2Desc: z.string().max(2000).optional(),
-  feature3Title: z.string().max(500).optional(),
-  feature3Desc: z.string().max(2000).optional(),
+  // Homepage content
+  heroTitle: z.string().max(50).optional(),
+  heroSubtitle: z.string().max(500).optional(),
+  statusBadgeTextOnline: z.string().max(100).optional(),
+  statusBadgeTextOffline: z.string().max(100).optional(),
+  feature1Title: z.string().max(100).optional(),
+  feature1Desc: z.string().max(500).optional(),
+  feature2Title: z.string().max(100).optional(),
+  feature2Desc: z.string().max(500).optional(),
+  feature3Title: z.string().max(100).optional(),
+  feature3Desc: z.string().max(500).optional(),
 });
 
 // ============================================================================
diff --git a/server/utils/settings.ts b/server/utils/settings.ts
index f6804f2..877c3c5 100644
--- a/server/utils/settings.ts
+++ b/server/utils/settings.ts
@@ -31,7 +31,8 @@ export const SETTINGS_KEYS = {
   // Homepage content
   HERO_TITLE: 'hero_title',
   HERO_SUBTITLE: 'hero_subtitle',
-  STATUS_BADGE_TEXT: 'status_badge_text',
+  STATUS_BADGE_TEXT_ONLINE: 'status_badge_text_online',
+  STATUS_BADGE_TEXT_OFFLINE: 'status_badge_text_offline',
   FEATURE_1_TITLE: 'feature_1_title',
   FEATURE_1_DESC: 'feature_1_desc',
   FEATURE_2_TITLE: 'feature_2_title',
@@ -310,13 +311,21 @@ export async function getHeroSubtitle(): Promise<string> {
 }
 
 /**
- * Get status badge text
+ * Get status badge text for online state
  */
-export async function getStatusBadgeText(): Promise<string> {
-  const value = await getSetting(SETTINGS_KEYS.STATUS_BADGE_TEXT);
+export async function getStatusBadgeTextOnline(): Promise<string> {
+  const value = await getSetting(SETTINGS_KEYS.STATUS_BADGE_TEXT_ONLINE);
   return value || 'Tracker Online & Operational';
 }
 
+/**
+ * Get status badge text for offline state
+ */
+export async function getStatusBadgeTextOffline(): Promise<string> {
+  const value = await getSetting(SETTINGS_KEYS.STATUS_BADGE_TEXT_OFFLINE);
+  return value || 'Tracker Offline';
+}
+
 /**
  * Get feature 1 title
  */