diff --git a/backend/controllers/routineController.js b/backend/controllers/routineController.js
index dcc47005..ba437d56 100644
--- a/backend/controllers/routineController.js
+++ b/backend/controllers/routineController.js
@@ -286,12 +286,13 @@ export const updateRoutine = async (req, res) => {
     }
 
     // fetch updated routine details
-    const { name, description, items } = req.body;
+    const { name, description, items, isPublic } = req.body;
 
     const updates = {
       ...(name && { name }),
       ...(description && { description }),
       ...(items && { items }),
+      ...(isPublic !== undefined && { isPublic }),
     };
     const routineId = req.params.id;
 
@@ -430,10 +431,10 @@ export const getPublicRoutine = async (req, res) => {
   try {
     const routineId = req.params.id;
     const routine = await Routine.findById(routineId).populate("items.taskId");
-    if (!routine) {
-      return res.status(404).json({
+    if (!routine || !routine.isPublic) {
+      return res.status(403).json({
         success: false,
-        message: "Routine not found",
+        message: "Routine not found or not public",
       });
     }
     return res.status(200).json({ success: true, routine });
diff --git a/backend/src/models/Routine.js b/backend/src/models/Routine.js
index 3ba7c2a5..6fd5417f 100644
--- a/backend/src/models/Routine.js
+++ b/backend/src/models/Routine.js
@@ -12,6 +12,10 @@ const routineSchema = mongoose.Schema(
       required: true,
       trim: true
     },
+    isPublic: {
+      type: Boolean,
+      default: false,
+    },
     description: {
       type: String,
       required: false,
diff --git a/frontend/src/App.jsx b/frontend/src/App.jsx
index d8e2a94c..b7753928 100644
--- a/frontend/src/App.jsx
+++ b/frontend/src/App.jsx
@@ -21,6 +21,7 @@ import ErrorBoundary from "./components/ErrorBoundary.jsx";
 import PageTransition from "./components/PageTransition.jsx";
 import ShareRoutine from "./pages/ShareRoutine.jsx";
 import DailyJournal from "./pages/DailyJournal.jsx";
+import ForgeMode from "./pages/ForgeMode.jsx";
 
 const AuthLayout = ({ children }) => (
   <div className="min-h-[calc(100vh-3.75rem)] flex items-center justify-center">
@@ -38,9 +39,9 @@ const AnimatedRoutes = () => {
           path="/"
           element={
             <PublicRoute>
-              <AuthLayout>
-                <Login />
-              </AuthLayout>
+              <PageTransition>
+                <LandingPage />
+              </PageTransition>
             </PublicRoute>
           }
         />
@@ -48,9 +49,11 @@ const AnimatedRoutes = () => {
           path="/login"
           element={
             <PublicRoute>
-              <AuthLayout>
-                <Login />
-              </AuthLayout>
+              <PageTransition>
+                <AuthLayout>
+                  <Login />
+                </AuthLayout>
+              </PageTransition>
             </PublicRoute>
           }
         />
@@ -58,18 +61,22 @@ const AnimatedRoutes = () => {
           path="/signup"
           element={
             <PublicRoute>
-              <AuthLayout>
-                <Signup />
-              </AuthLayout>
+              <PageTransition>
+                <AuthLayout>
+                  <Signup />
+                </AuthLayout>
+              </PageTransition>
             </PublicRoute>
           }
         />
         <Route
           path="/about"
           element={
-            <AuthLayout>
-              <About />
-            </AuthLayout>
+            <PageTransition>
+              <AuthLayout>
+                <About />
+              </AuthLayout>
+            </PageTransition>
           }
         />
         <Route
@@ -108,6 +115,16 @@ const AnimatedRoutes = () => {
             </ProtectedRoutes>
           }
         />
+        <Route
+          path="/focus-mode"
+          element={
+            <ProtectedRoutes>
+              <PageTransition>
+                <Pomodoro />
+              </PageTransition>
+            </ProtectedRoutes>
+          }
+        />
         <Route
           path="/profile"
           element={
@@ -133,7 +150,9 @@ const AnimatedRoutes = () => {
           element={
             <ProtectedRoutes>
               <ErrorBoundary>
-                <PageTransition><DailyJournal /></PageTransition>
+                <PageTransition>
+                  <DailyJournal />
+                </PageTransition>
               </ErrorBoundary>
             </ProtectedRoutes>
           }
@@ -142,7 +161,9 @@ const AnimatedRoutes = () => {
           path="/forge"
           element={
             <ProtectedRoutes>
-              <PageTransition><ForgeMode /></PageTransition>
+              <PageTransition>
+                <ForgeMode />
+              </PageTransition>
             </ProtectedRoutes>
           }
         />
@@ -150,11 +171,28 @@ const AnimatedRoutes = () => {
           path="/focus"
           element={
             <ProtectedRoutes>
-              <PageTransition><ForgeMode /></PageTransition>
+              <PageTransition>
+                <ForgeMode />
+              </PageTransition>
             </ProtectedRoutes>
           }
         />
-        <Route path="*" element={<NotFound />} />
+        <Route
+          path="/share/routine/:id"
+          element={
+            <PageTransition>
+              <ShareRoutine />
+            </PageTransition>
+          }
+        />
+        <Route 
+          path="*" 
+          element={
+            <PageTransition>
+              <NotFound />
+            </PageTransition>
+          } 
+        />
       </Routes>
 
     </AnimatePresence>
@@ -166,104 +204,7 @@ const App = () => {
     <BrowserRouter>
       <Navbar />
       <main className="app-bg min-h-screen pt-24 sm:pt-28 flex flex-col text-main transition-colors duration-300">
-        <Routes>
-          <Route
-            path="/"
-            element={
-              <PublicRoute>
-                <AuthLayout>
-                  <Login />
-                </AuthLayout>
-              </PublicRoute>
-            }
-          />
-          <Route
-            path="/login"
-            element={
-              <PublicRoute>
-                <AuthLayout>
-                  <Login />
-                </AuthLayout>
-              </PublicRoute>
-            }
-          />
-          <Route
-            path="/signup"
-            element={
-              <PublicRoute>
-                <AuthLayout>
-                  <Signup />
-                </AuthLayout>
-              </PublicRoute>
-            }
-          />
-          <Route
-            path="/about"
-            element={
-              <AuthLayout>
-                <About />
-              </AuthLayout>
-            }
-          />
-          <Route
-            path="/dashboard"
-            element={
-              <ProtectedRoutes>
-                <Dashboard />
-              </ProtectedRoutes>
-            }
-          />
-          <Route
-            path="/tasks"
-            element={
-              <ProtectedRoutes>
-                <Tasks />
-              </ProtectedRoutes>
-            }
-          />
-          <Route
-            path="/routine-builder"
-            element={
-              <ProtectedRoutes>
-                <RoutineBuilder />
-              </ProtectedRoutes>
-            }
-          />
-          <Route
-            path="/focus-mode"
-            element={
-              <ProtectedRoutes>
-                <Pomodoro />
-              </ProtectedRoutes>
-            }
-          />
-          <Route
-            path="/profile"
-            element={
-              <ProtectedRoutes>
-                <Profile />
-              </ProtectedRoutes>
-            }
-          />
-          <Route
-            path="/analytics"
-            element={
-              <ProtectedRoutes>
-                <Analytics />
-              </ProtectedRoutes>
-            }
-          />
-          <Route
-            path="/daily-journal"
-            element={
-              <ProtectedRoutes>
-                <DailyJournal />
-              </ProtectedRoutes>
-            }
-          />
-          <Route path="/share/routine/:id" element={<ShareRoutine />} />
-          <Route path="*" element={<NotFound />} />
-        </Routes>
+        <AnimatedRoutes />
       </main>
       <Footer />
       <ScrollToTop />
diff --git a/frontend/src/components/Routine/RoutineCard.jsx b/frontend/src/components/Routine/RoutineCard.jsx
index bc84857b..9858d4d6 100644
--- a/frontend/src/components/Routine/RoutineCard.jsx
+++ b/frontend/src/components/Routine/RoutineCard.jsx
@@ -1,5 +1,5 @@
 import { useEffect, useMemo, useRef, useState } from "react";
-import { MoreVertical, Trash2, Share2, Copy, Download, Loader2 } from "lucide-react";
+import { MoreVertical, Trash2, Share2, Copy, Download, Loader2, EyeOff } from "lucide-react";
 import RoutineOverviewModal from "./RoutineOverviewModal";
 import api from "../../api/axios.js";
 import { exportRoutineToPDF, generateRoutineSummary } from "../../utils/routineExport.js";
@@ -36,6 +36,10 @@ export default function RoutineCard({
     e.stopPropagation();
     setShowMenu(false);
     try {
+      if (!routine.isPublic) {
+        await api.put(`/routines/${routine._id}`, { isPublic: true });
+        await fetchRoutines();
+      }
       const shareUrl = `${window.location.origin}/share/routine/${routine._id}`;
       await navigator.clipboard.writeText(shareUrl);
       triggerToast("Share Link Copied", "The public routine link was copied to clipboard.");
@@ -45,6 +49,19 @@ export default function RoutineCard({
     }
   };
 
+  const handleRevokeLink = async (e) => {
+    e.stopPropagation();
+    setShowMenu(false);
+    try {
+      await api.put(`/routines/${routine._id}`, { isPublic: false });
+      await fetchRoutines();
+      triggerToast("Link Revoked", "The routine is now private.");
+    } catch (err) {
+      console.error(err);
+      alert("Failed to revoke share link");
+    }
+  };
+
   const handleCopySummary = async (e) => {
     e.stopPropagation();
     setShowMenu(false);
@@ -414,6 +431,15 @@ export default function RoutineCard({
                 <Share2 size={16} />
                 Copy Share Link
               </button>
+              {routine.isPublic && (
+                <button
+                  onClick={handleRevokeLink}
+                  className="w-full flex items-center gap-3 px-4 py-3 text-sm text-main hover:bg-slate-100 dark:hover:bg-slate-800 transition font-medium cursor-pointer"
+                >
+                  <EyeOff size={16} />
+                  Revoke Share Link
+                </button>
+              )}
               <button
                 onClick={handleCopySummary}
                 className="w-full flex items-center gap-3 px-4 py-3 text-sm text-main hover:bg-slate-100 dark:hover:bg-slate-800 transition font-medium cursor-pointer"
diff --git a/frontend/src/index.css b/frontend/src/index.css
index f7b3c6b4..1741151c 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -1,171 +1,4 @@
-@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
-@import "tailwindcss";
-
-@custom-variant dark (&:where(.dark, .dark *));
-
-@theme {
-  --color-primary: var(--primary);
-}
-
-* {
-  font-family: 'Outfit', sans-serif;
-}
-
-:root {
-  --bg: #d0f6e3;
-  --surface: #ffffff;
-  --primary: #4eb7b3;
-  --primary-hover: #6dd5c7;
-  --accent: #98e1d7;
-  --text-main: #3b8ea0;
-  --text-muted: #4eb7b3;
-  --border: #98e1d7;
-  --radius: 0.75rem;
-}
-
-:root[data-theme-custom="true"] {
-  --primary-hover: color-mix(in srgb, var(--primary) 85%, white);
-  --bg: color-mix(in srgb, var(--primary) 15%, #ffffff);
-  --accent: color-mix(in srgb, var(--primary) 60%, #ffffff);
-  --text-main: color-mix(in srgb, var(--primary) 70%, #000000);
-  --text-muted: var(--primary);
-  --border: color-mix(in srgb, var(--primary) 60%, #ffffff);
-}
-
-.dark {
-  --bg: #0f172a;
-  --surface: #1e293b;
-  --primary: #4eb7b3;
-  --primary-hover: #5ec7c3;
-  --accent: #1e2e30;
-  --text-main: #f8fafc;
-  --text-muted: #94a3b8;
-  --border: #334155;
-}
-
-html.dark[data-theme-custom="true"] {
-  --primary-hover: color-mix(in srgb, var(--primary) 85%, white);
-  --bg: color-mix(in srgb, var(--primary) 10%, #0f172a);
-  --surface: color-mix(in srgb, var(--primary) 15%, #1e293b);
-  --accent: color-mix(in srgb, var(--primary) 25%, #1e293b);
-  --text-muted: color-mix(in srgb, var(--primary) 50%, #94a3b8);
-  --border: color-mix(in srgb, var(--primary) 30%, #334155);
-}
-
-html.dark,
-html.dark body {
-  
-  background-color: var(--bg);
-  color: var(--text-main);
-  color-scheme: dark;
-}
-
-@layer utilities {
-  .app-bg {
-    background-color: var(--bg);
-  }
-
-  .surface-bg {
-    background-color: var(--surface);
-  }
-
-  .text-main {
-    color: var(--text-main);
-  }
-
-  .text-muted {
-    color: var(--text-muted);
-  }
-
-  .border-soft {
-    border: 1px solid var(--border);
-  }
-
-  .btn {
-    @apply inline-flex items-center justify-center px-4 py-2 font-medium rounded-xl transition-all duration-200 select-none;
-  }
-
-  .btn-primary {
-    @apply text-white shadow-sm hover:shadow-md active:scale-[0.97] focus:outline-none focus:ring-2 focus:ring-offset-2;
-    background-color: var(--primary);
-  }
-
-  .btn-primary:hover {
-    background-color: var(--primary-hover);
-  }
-
-  .card {
-    background-color: var(--surface);
-    border-radius: var(--radius);
-    border: 1px solid var(--border);
-    @apply p-6 shadow-sm transition-shadow duration-200;
-  }
-
-  .card:hover {
-    @apply shadow-md;
-  }
-
-  .card-muted {
-    @apply bg-white/80 dark:bg-gray-800/80;
-  }
-
-  .card-primary {
-    @apply shadow-md;
-  }
-
-  .animate-in {
-    animation: fadeUp 0.4s ease-out both;
-  }
-
-  .animate-in-slow {
-    animation: fadeUp 0.6s ease-out both;
-  }
-
-  .delay-100 {
-    animation-delay: 0.1s;
-  }
-
-  .delay-200 {
-    animation-delay: 0.2s;
-  }
 
-  .delay-300 {
-    animation-delay: 0.3s;
-  }
-
-  .hover-lift {
-    transition: transform 0.2s ease, box-shadow 0.2s ease;
-  }
-
-  .hover-lift:hover {
-    transform: translateY(-2px);
-  }
-}
-
-@keyframes fadeUp {
-  from {
-    opacity: 0;
-    transform: translateY(12px);
-  }
-  to {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-
-/* Hide default browser reveal buttons to stop overlapping */
-input::-ms-reveal,
-input::-ms-clear,
-input::-webkit-contacts-auto-fill-button,
-input::-webkit-credentials-type-password-toggle {
-  display: none !important;
-}
-* {
-  transition:
-    background-color 0.25s ease,
-    border-color 0.25s ease,
-    color 0.25s ease;
-  }
 @import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
 @import "tailwindcss";