diff --git a/ExpenseFlow b/ExpenseFlow
new file mode 160000
index 0000000..c6cf847
--- /dev/null
+++ b/ExpenseFlow
@@ -0,0 +1 @@
+Subproject commit c6cf847dc58d9c4ec4a20941a94dbb167bea9ac5
diff --git a/index.html b/index.html
index 13c4294..a8b3dfa 100644
--- a/index.html
+++ b/index.html
@@ -1296,6 +1296,24 @@
         gap: 0.5rem;
         justify-content: center;
       }
+.glass {
+  background: rgba(255, 255, 255, 0.04);
+  backdrop-filter: blur(12px);
+  border-radius: 18px;
+  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
+  animation: fadeIn 0.8s ease;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: translateY(14px);
+  }
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
+}
 
       .dismiss-btn:hover {
         background: rgba(255, 255, 255, 0.1);
@@ -1495,6 +1513,37 @@
           justify-content: stretch;
         }
       }
+.balance-card,
+.income-card,
+.expense-card,
+.history-section,
+.form-section,
+.data-management-section,
+.recurring-section {
+  transition: transform 0.25s ease, box-shadow 0.25s ease;
+}
+
+.balance-card:hover,
+.income-card:hover,
+.expense-card:hover {
+  transform: translateY(-4px);
+  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
+}
+.btn-submit {
+  background: linear-gradient(135deg, #64ffda, #48e0c1);
+  border: none;
+  color: #041212;
+  font-weight: 600;
+  border-radius: 14px;
+  padding: 0.85rem 1.5rem;
+  cursor: pointer;
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.btn-submit:hover {
+  transform: translateY(-2px);
+  box-shadow: 0 6px 18px rgba(100, 255, 218, 0.35);
+}
 
       @media (max-width: 480px) {
         .hero-title {
@@ -1551,39 +1600,45 @@
         }
       }
 
-      /* Touch and gesture improvements */
-      @media (hover: none) and (pointer: coarse) {
-        .filter-btn,
-        .export-btn,
-        .import-btn,
-        .btn-submit {
-          min-height: 44px;
-          padding: 0.75rem 1.5rem;
-        }
-        
-        .delete-btn {
-          min-width: 44px;
-          min-height: 44px;
-        }
-        
-        .nav-link {
-          padding: 1rem 1.5rem;
-        }
-        
-        .category-select,
-        .date-input,
-        .amount-input,
-        .search-input {
-          min-height: 48px;
-          font-size: 16px;
-        }
-        
-        .form-control input,
-        .form-control select {
-          min-height: 48px;
-          font-size: 16px;
-        }
-      }
+<body>
+  <!-- Header -->
+  <header class="header">
+    <nav class="navbar">
+      <div class="nav-container">
+        <div class="nav-logo">
+          <i class="fas fa-wallet"></i>
+          <span>ExpenseFlow</span>
+        </div>
+        <div class="nav-menu" id="nav-menu">
+          <a href="#dashboard" class="nav-link active">Dashboard</a>
+          <a href="#analytics" class="nav-link">Analytics</a>
+          <a href="#goals" class="nav-link">Goals</a>
+          <a href="#settings" class="nav-link">Settings</a>
+        </div>
+        <div class="nav-toggle" id="nav-toggle">
+          <span class="bar"></span>
+          <span class="bar"></span>
+          <span class="bar"></span>
+        </div>
+        <div class="user-profile">
+          <button class="currency-btn" onclick="openCurrencyModal()" title="Currency Settings">
+            <i class="fas fa-coins"></i>
+            <span id="current-currency">INR</span>
+          </button>
+          <img src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?w=50&h=50&fit=crop&crop=face"
+            alt="User" class="profile-img">
+          <span class="username">John Doe</span>
+        </div>
+      </div>
+    </nav>
+  </header>
+
+  <!-- Main Content -->
+  <main class="main-content">
+    <div class="hero-section glass">
+      <h1 class="hero-title">Smart Money Management</h1>
+      <p class="hero-subtitle">Take control of your finances with our intuitive expense tracker</p>
+    </div>
 
       /* Safe area insets for devices with notches */
       @supports (padding: max(0px)) {
@@ -2227,23 +2282,95 @@ <h3><i class="fas fa-money-bill-wave"></i> Currency Settings</h3>
 
   <!-- Footer -->
   <footer class="footer">
-    <div class="footer-container">
-      <div class="footer-section">
-        <div class="footer-logo">
-          <i class="fas fa-wallet"></i>
-          <span>ExpenseFlow</span>
-        </div>
-        
-        <div class="footer-section">
-          <h4>Company</h4>
-          <ul class="footer-links">
-            <li><a href="AboutUs.html">About Us</a></li>
-            <li><a href="PrivacyPolicy.html">Privacy Policy</a></li>
-            <li><a href="terms_service.html">Terms of Service</a></li>
-            <li><a href="#">Contact</a></li>
-          </ul>
-        </div>
-      </div>
+  <div class="footer-container">
+
+    <div class="footer-section">
+  <div class="footer-logo">
+    <i class="fas fa-wallet"></i>
+    <span>ExpenseFlow</span>
+  </div>
+
+  <p class="footer-description">
+    Smart money management made simple. Track, analyze, and optimize your financial habits.
+  </p>
+
+  <div class="social-links">
+    <a
+      href="https://x.com/9504_renu"
+      class="social-link"
+      target="_blank"
+      rel="noopener noreferrer"
+      aria-label="X (Twitter)"
+    >
+      <i class="fab fa-x-twitter"></i>
+    </a>
+
+    <a
+      href="https://github.com/Renu-code123/ExpenseFlow"
+      class="social-link"
+      target="_blank"
+      rel="noopener noreferrer"
+      aria-label="Github"
+    >
+      <i class="fab fa-github"></i>
+    </a>
+
+    <a
+      href="mailto:renu89857@gmail.com"
+      class="social-link"
+      target="_blank"
+      rel="noopener noreferrer"
+      aria-label="Email"
+    >
+      <i class="far fa-envelope"></i>
+    </a>
+
+    <a
+      href="https://www.linkedin.com/in/renu-kumari-prajapati"
+      class="social-link"
+      target="_blank"
+      rel="noopener noreferrer"
+      aria-label="LinkedIn"
+    >
+      <i class="fab fa-linkedin-in"></i>
+    </a>
+  </div>
+</div>
+
+
+    <div class="footer-section">
+      <h4>Company</h4>
+      <ul class="footer-links">
+        <li><a href="AboutUs.html">About Us</a></li>
+        <li><a href="PrivacyPolicy.html">Privacy Policy</a></li>
+        <li><a href="terms_service.html">Terms of Service</a></li>
+        <li><a href="#">Contact</a></li>
+      </ul>
+    </div>
+
+    <div class="footer-section">
+      <h4>Features</h4>
+      <ul class="footer-links">
+        <li><a href="#">Expense Tracking</a></li>
+        <li><a href="#">Budget Planning</a></li>
+        <li><a href="#">Analytics Dashboard</a></li>
+        <li><a href="#">Goal Setting</a></li>
+      </ul>
+    </div>
+
+  </div>
+
+<div class="footer-bottom">
+  <div class="footer-container">
+    <p>&copy; 2026 ExpenseFlow. All rights reserved. Made with ❤️ for better financial management.</p>
+    <div class="footer-stats">
+      <span>🏆 Trusted by 10,000+ users</span>
+      <span>💰 ₹50M+ tracked</span>
+      <span>📊 99.9% uptime</span>
+    </div>
+  </div>
+</div>
+</footer>
 
       <div class="footer-section">
         <h4>Features</h4>
@@ -2255,61 +2382,6 @@ <h4>Features</h4>
         </ul>
       </div>
 
-    <button id="scrollToTopBtn" title="Go to top">
-    <i data-lucide="arrow-up-circle"></i>
-  </button>
-    <script src="https://unpkg.com/lucide@latest"></script>
-    <script src="theme.js"></script>
-    <script src="trackerscript.js"></script>
-    
-    <!-- PWA Installation Prompt -->
-    <div id="install-prompt" class="install-prompt" style="display: none;">
-      <div class="install-prompt-content">
-        <div class="install-prompt-header">
-          <i class="fas fa-download"></i>
-          <h3>Install ExpenseFlow</h3>
-        </div>
-        <p>Install ExpenseFlow for quick access and offline functionality!</p>
-        <div class="install-prompt-actions">
-          <button id="install-button" class="install-btn">
-            <i class="fas fa-plus"></i> Install
-          </button>
-          <button id="install-dismiss" class="dismiss-btn">
-            <i class="fas fa-times"></i> Not now
-          </button>
-        </div>
-      <div class="footer-section">
-        <h4>Resources</h4>
-        <ul class="footer-links">
-          <li><a href="#">Help Center</a></li>
-          <li><a href="#">Financial Tips</a></li>
-          <li><a href="#">Video Tutorials</a></li>
-          <li><a href="#">Community</a></li>
-        </ul>
-      </div>
-
-      <div class="footer-section">
-        <h4>Company</h4>
-        <ul class="footer-links">
-          <li><a href="#">About Us</a></li>
-          <li><a href="#">Privacy Policy</a></li>
-          <li><a href="#">Terms of Service</a></li>
-          <li><a href="#">Contact</a></li>
-        </ul>
-      </div>
-    </div>
-
-    <div class="footer-bottom">
-      <div class="footer-container">
-        <p>&copy; 2026 ExpenseFlow. All rights reserved. Made with ❤️ for better financial management.</p>
-        <div class="footer-stats">
-          <span>🏆 Trusted by 10,000+ users</span>
-          <span>💰 ₹50M+ tracked</span>
-          <span>📊 99.9% uptime</span>
-        </div>
-      </div>
-    </div>
-  </footer>
 
   <script src="trackerscript.js"></script>
   <script src="export-feature.js"></script>
diff --git a/services/analyticsService.js b/services/analyticsService.js
index f16e8b5..2a02ba8 100644
--- a/services/analyticsService.js
+++ b/services/analyticsService.js
@@ -2,6 +2,21 @@ const Expense = require('../models/Expense');
 const Budget = require('../models/Budget');
 const AnalyticsCache = require('../models/AnalyticsCache');
 const mongoose = require('mongoose');
+const CACHE_KEYS = {
+    SPENDING_TRENDS: CACHE_KEYS.SPENDING_TRENDS
+    ,
+    CATEGORY_BREAKDOWN: CACHE_KEYS.CATEGORY_BREAKDOWN,
+    MONTHLY_COMPARISON: CACHE_KEYS.MONTHLY_COMPARISON,
+    INSIGHTS: CACHE_KEYS.INSIGHTS,
+    PREDICTIONS: CACHE_KEYS.PREDICTIONS
+};
+
+const CACHE_TTL = {
+    SHORT: CACHE_TTL.SHORT,     // minutes
+    MEDIUM: CACHE_TTL.MEDIUM,
+    LONG: CACHE_TTL.LONG,
+    XLONG: CACHE_TTL.XLONG
+};
 
 class AnalyticsService {
     constructor() {
@@ -33,7 +48,8 @@ class AnalyticsService {
 
         // Check cache
         if (useCache) {
-            const cached = await AnalyticsCache.getCache('spending_trends', userId, { period, months });
+            const cached = await AnalyticsCache.getCache(CACHE_KEYS.SPENDING_TRENDS
+                , userId, { period, months });
             if (cached) return cached;
         }
 
@@ -127,7 +143,8 @@ class AnalyticsService {
 
         // Cache result
         if (useCache) {
-            await AnalyticsCache.setCache('spending_trends', userId, { period, months }, result, 60);
+            await AnalyticsCache.setCache(CACHE_KEYS.SPENDING_TRENDS
+                , userId, { period, months }, result, CACHE_TTL.MEDIUM);
         }
 
         return result;
@@ -183,7 +200,7 @@ class AnalyticsService {
         };
 
         if (useCache) {
-            const cached = await AnalyticsCache.getCache('category_breakdown', userId, cacheParams);
+            const cached = await AnalyticsCache.getCache(CACHE_KEYS.CATEGORY_BREAKDOWN, userId, cacheParams);
             if (cached) return cached;
         }
 
@@ -231,7 +248,7 @@ class AnalyticsService {
         };
 
         if (useCache) {
-            await AnalyticsCache.setCache('category_breakdown', userId, cacheParams, result, 30);
+            await AnalyticsCache.setCache(CACHE_KEYS.CATEGORY_BREAKDOWN, userId, cacheParams, result, CACHE_TTL.SHORT);
         }
 
         return result;
@@ -244,7 +261,7 @@ class AnalyticsService {
         const { months = 3, useCache = true } = options;
 
         if (useCache) {
-            const cached = await AnalyticsCache.getCache('monthly_comparison', userId, { months });
+            const cached = await AnalyticsCache.getCache(CACHE_KEYS.MONTHLY_COMPARISON, userId, { months });
             if (cached) return cached;
         }
 
@@ -272,26 +289,9 @@ class AnalyticsService {
             }
         ]);
 
-        const getMonthData = (year, month) => {
-            const monthStats = allStats.filter(s => s._id.year === year && s._id.month === (month + 1));
-            const income = monthStats.find(s => s._id.type === 'income');
-            const expense = monthStats.find(s => s._id.type === 'expense');
-            const totalIncome = income?.total || 0;
-            const totalExpense = expense?.total || 0;
-            return {
-                totalIncome,
-                totalExpense,
-                incomeCount: income?.count || 0,
-                expenseCount: expense?.count || 0,
-                net: totalIncome - totalExpense,
-                savingsRate: totalIncome ? Math.round(((totalIncome - totalExpense) / totalIncome) * 100) : 0
-            };
-        };
-
-        const comparisons = [];
         for (let i = 0; i < months; i++) {
-            const d = new Date(now.getFullYear(), now.getMonth() - i, 1);
-            const pd = new Date(now.getFullYear(), now.getMonth() - i - 1, 1);
+            const { start: monthStart, end: monthEnd } = this.getMonthRange(i);
+            const { start: prevMonthStart, end: prevMonthEnd } = this.getMonthRange(i + 1);
 
             const currentMonth = getMonthData(d.getFullYear(), d.getMonth());
             const previousMonth = getMonthData(pd.getFullYear(), pd.getMonth());
@@ -321,7 +321,7 @@ class AnalyticsService {
         const result = { comparisons };
 
         if (useCache) {
-            await AnalyticsCache.setCache('monthly_comparison', userId, { months }, result, 60);
+            await AnalyticsCache.setCache(CACHE_KEYS.MONTHLY_COMPARISON, userId, { months }, result, CACHE_TTL.MEDIUM);
         }
 
         return result;
@@ -369,7 +369,7 @@ class AnalyticsService {
         const { useCache = true } = options;
 
         if (useCache) {
-            const cached = await AnalyticsCache.getCache('insights', userId, {});
+            const cached = await AnalyticsCache.getCache(CACHE_KEYS.INSIGHTS, userId, {});
             if (cached) return cached;
         }
 
@@ -538,7 +538,7 @@ class AnalyticsService {
         };
 
         if (useCache) {
-            await AnalyticsCache.setCache('insights', userId, {}, result, 120);
+            await AnalyticsCache.setCache(CACHE_KEYS.INSIGHTS, userId, {}, result, CACHE_TTL.LONG);
         }
 
         return result;
@@ -551,7 +551,7 @@ class AnalyticsService {
         const { useCache = true } = options;
 
         if (useCache) {
-            const cached = await AnalyticsCache.getCache('predictions', userId, {});
+            const cached = await AnalyticsCache.getCache(CACHE_KEYS.PREDICTIONS, userId, {});
             if (cached) return cached;
         }
 
@@ -615,7 +615,7 @@ class AnalyticsService {
         };
 
         if (useCache) {
-            await AnalyticsCache.setCache('predictions', userId, {}, result, 180);
+            await AnalyticsCache.setCache(CACHE_KEYS.PREDICTIONS, userId, {}, result, CACHE_TTL.XLONG);
         }
 
         return result;
@@ -643,7 +643,7 @@ class AnalyticsService {
             }
         ]);
 
-        const months = Math.ceil((new Date() - startDate) / (30 * 24 * 60 * 60 * 1000));
+        const months = Math.ceil((new Date() - startDate) / (CACHE_TTL.SHORT * 24 * CACHE_TTL.MEDIUM * CACHE_TTL.MEDIUM * 1000));
 
         return categoryData.map(cat => ({
             category: cat._id,
