diff --git a/.github/workflows/tauri-all-platforms.yml b/.github/workflows/tauri-all-platforms.yml
index 33eda89..b83ed72 100644
--- a/.github/workflows/tauri-all-platforms.yml
+++ b/.github/workflows/tauri-all-platforms.yml
@@ -77,7 +77,7 @@ jobs:
         run: pnpm install --frozen-lockfile
 
       - name: Security audit
-        run: npm audit --omit=dev --audit-level=high
+        run: pnpm audit --prod --audit-level high
 
       - name: Build and publish signed bundles
         uses: tauri-apps/tauri-action@v1
diff --git a/package-lock.json b/package-lock.json
index 12fe99f..7067745 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,10 +10,10 @@
       "dependencies": {
         "@hookform/resolvers": "^5.2.2",
         "@tanstack/react-query": "^5.100.9",
-        "@tauri-apps/api": "^2.11.0",
-        "@tauri-apps/plugin-opener": "^2.5.4",
-        "@tauri-apps/plugin-process": "^2.3.1",
-        "@tauri-apps/plugin-updater": "^2.10.1",
+        "@tauri-apps/api": "2.10.1",
+        "@tauri-apps/plugin-opener": "2.5.4",
+        "@tauri-apps/plugin-process": "2.3.1",
+        "@tauri-apps/plugin-updater": "2.10.1",
         "class-variance-authority": "^0.7.1",
         "clsx": "^2.1.1",
         "date-fns": "^4.1.0",
@@ -36,7 +36,7 @@
         "@eslint/js": "^9.39.4",
         "@tailwindcss/typography": "^0.5.19",
         "@tailwindcss/vite": "^4.3.0",
-        "@tauri-apps/cli": "^2.11.1",
+        "@tauri-apps/cli": "2.10.1",
         "@types/markdown-to-jsx": "^7.0.1",
         "@types/react": "^19.2.14",
         "@types/react-dom": "^19.2.3",
@@ -1469,13 +1469,13 @@
       }
     },
     "node_modules/@inquirer/confirm": {
-      "version": "6.0.12",
-      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-6.0.12.tgz",
-      "integrity": "sha512-h9FgGun3QwVYNj5TWIZZ+slii73bMoBFjPfVIGtnFuL4t8gBiNDV9PcSfIzkuxvgquJKt9nr1QzszpBzTbH8Og==",
+      "version": "6.0.13",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-6.0.13.tgz",
+      "integrity": "sha512-wkGPC7yJ5WJk1DJ5SX7fzk+gfj4BM8cf5dDDi71B/551xHrdsZVRJOC0WyikXd0pEsb/9cLniuE4atbsMqmFkw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@inquirer/core": "^11.1.9",
+        "@inquirer/core": "^11.1.10",
         "@inquirer/type": "^4.0.5"
       },
       "engines": {
@@ -1491,9 +1491,9 @@
       }
     },
     "node_modules/@inquirer/core": {
-      "version": "11.1.9",
-      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-11.1.9.tgz",
-      "integrity": "sha512-BDE4fG22uYh1bGSifcj7JSx119TVYNViMhMu85usp4Fswrzh6M0DV3yld64jA98uOAa2GSQ4Bg4bZRm2d2cwSg==",
+      "version": "11.1.10",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-11.1.10.tgz",
+      "integrity": "sha512-a4Q5BXHQAHa9eO202sTaFCHFYVB3x5fauDuThEAdZ9gfn76pSxiKU7wWcEH0N1O0XmQvNfQNU6QXpiRxmYQx+A==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -1661,9 +1661,9 @@
       "license": "MIT"
     },
     "node_modules/@mswjs/interceptors": {
-      "version": "0.41.8",
-      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.41.8.tgz",
-      "integrity": "sha512-pRLMNKTSGRoLq+KnEB/7OY5vijw1XmcheAAOiv6pj7W1FG32kAGqj1C/RK/cqxRGr1Fh+zBi8sDur8kj3EQv6A==",
+      "version": "0.41.9",
+      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.41.9.tgz",
+      "integrity": "sha512-VVPPgHyQ6ShqnrmDWuxjmUIsO9gWyOZFmuOfLd9LfBGQJwZfy0gvv9pbHSJuoFNIYC7ZDX9aoFwowjcdSC4E8w==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -3315,9 +3315,9 @@
       }
     },
     "node_modules/@reduxjs/toolkit/node_modules/immer": {
-      "version": "11.1.6",
-      "resolved": "https://registry.npmjs.org/immer/-/immer-11.1.6.tgz",
-      "integrity": "sha512-uwrF08UBQfxk49i9WcUeCx045wjB1zXEHNJmbYHPVVspxmjwSeWCoKbB8DEIvs3XkBJV6lcRAyLaWJ2+u3MMCw==",
+      "version": "11.1.8",
+      "resolved": "https://registry.npmjs.org/immer/-/immer-11.1.8.tgz",
+      "integrity": "sha512-/tbkHMW7y10Lx6i1crLjD4/OhNkRG+Fo7byZHtah0547nIeXYcpIXaUh0IAQY6gO5459qpGGYapcEOHtFXkIuA==",
       "license": "MIT",
       "funding": {
         "type": "opencollective",
@@ -3855,9 +3855,6 @@
         "arm64"
       ],
       "dev": true,
-      "libc": [
-        "glibc"
-      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3875,9 +3872,6 @@
         "arm64"
       ],
       "dev": true,
-      "libc": [
-        "musl"
-      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3895,9 +3889,6 @@
         "x64"
       ],
       "dev": true,
-      "libc": [
-        "glibc"
-      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3915,9 +3906,6 @@
         "x64"
       ],
       "dev": true,
-      "libc": [
-        "musl"
-      ],
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4020,9 +4008,9 @@
       }
     },
     "node_modules/@tanstack/query-core": {
-      "version": "5.100.9",
-      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.100.9.tgz",
-      "integrity": "sha512-SJSFw1S8+kQ0+knv/XGfrbocWoAlT7vDKsSImtLx3ZPQmEcR46hkDjLSvynSy25N8Ms4tIEini1FuBd5k7IscQ==",
+      "version": "5.100.10",
+      "resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.100.10.tgz",
+      "integrity": "sha512-8UR0yJR+GiQ40m3lPhUr0xbfAupe6GSQiksSBSa9SM2NjezFyxXCIA69/lz8cSoNKZLrw1/PktIyQBJcVeMi3w==",
       "license": "MIT",
       "funding": {
         "type": "github",
@@ -4030,12 +4018,12 @@
       }
     },
     "node_modules/@tanstack/react-query": {
-      "version": "5.100.9",
-      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.100.9.tgz",
-      "integrity": "sha512-Oa44XkaI3kCNN6ME0KByU3xT3SEUNOMfZpHxL6+wFoTm+OeUFYHKdeYVe0aOXlRDm/f15sgLwEt2HDorIdW8+A==",
+      "version": "5.100.10",
+      "resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.100.10.tgz",
+      "integrity": "sha512-FLaZf2RCrA/Zgp4aiu5tG3TyasTRO7aZ99skxQpr3Hg/zXOhu6yq5FZCYQ/tRaJtM9ylnoK8tFK7PolXQadv6Q==",
       "license": "MIT",
       "dependencies": {
-        "@tanstack/query-core": "5.100.9"
+        "@tanstack/query-core": "5.100.10"
       },
       "funding": {
         "type": "github",
@@ -4046,9 +4034,9 @@
       }
     },
     "node_modules/@tauri-apps/api": {
-      "version": "2.11.0",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/api/-/api-2.11.0.tgz",
-      "integrity": "sha512-7CinYODhky9lmO23xHnUFv0Xt43fbtWMyxZcLcRBlFkcgXKuEirBvHpmtJ89YMhyeGcq20Wuc47Fa4XjyniywA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/api/-/api-2.10.1.tgz",
+      "integrity": "sha512-hKL/jWf293UDSUN09rR69hrToyIXBb8CjGaWC7gfinvnQrBVvnLr08FeFi38gxtugAVyVcTa5/FD/Xnkb1siBw==",
       "license": "Apache-2.0 OR MIT",
       "funding": {
         "type": "opencollective",
@@ -4056,9 +4044,9 @@
       }
     },
     "node_modules/@tauri-apps/cli": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-2.11.1.tgz",
-      "integrity": "sha512-rpEbaJ/HzNb6fwsquwoAbq29/Vt4gADhS423A8fdkwL4edJ0wZmoB8ar7O6JPDL834MUKOCm/rrJ7c9oAaEaYQ==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli/-/cli-2.10.1.tgz",
+      "integrity": "sha512-jQNGF/5quwORdZSSLtTluyKQ+o6SMa/AUICfhf4egCGFdMHqWssApVgYSbg+jmrZoc8e1DscNvjTnXtlHLS11g==",
       "dev": true,
       "license": "Apache-2.0 OR MIT",
       "bin": {
@@ -4072,23 +4060,23 @@
         "url": "https://opencollective.com/tauri"
       },
       "optionalDependencies": {
-        "@tauri-apps/cli-darwin-arm64": "2.11.1",
-        "@tauri-apps/cli-darwin-x64": "2.11.1",
-        "@tauri-apps/cli-linux-arm-gnueabihf": "2.11.1",
-        "@tauri-apps/cli-linux-arm64-gnu": "2.11.1",
-        "@tauri-apps/cli-linux-arm64-musl": "2.11.1",
-        "@tauri-apps/cli-linux-riscv64-gnu": "2.11.1",
-        "@tauri-apps/cli-linux-x64-gnu": "2.11.1",
-        "@tauri-apps/cli-linux-x64-musl": "2.11.1",
-        "@tauri-apps/cli-win32-arm64-msvc": "2.11.1",
-        "@tauri-apps/cli-win32-ia32-msvc": "2.11.1",
-        "@tauri-apps/cli-win32-x64-msvc": "2.11.1"
+        "@tauri-apps/cli-darwin-arm64": "2.10.1",
+        "@tauri-apps/cli-darwin-x64": "2.10.1",
+        "@tauri-apps/cli-linux-arm-gnueabihf": "2.10.1",
+        "@tauri-apps/cli-linux-arm64-gnu": "2.10.1",
+        "@tauri-apps/cli-linux-arm64-musl": "2.10.1",
+        "@tauri-apps/cli-linux-riscv64-gnu": "2.10.1",
+        "@tauri-apps/cli-linux-x64-gnu": "2.10.1",
+        "@tauri-apps/cli-linux-x64-musl": "2.10.1",
+        "@tauri-apps/cli-win32-arm64-msvc": "2.10.1",
+        "@tauri-apps/cli-win32-ia32-msvc": "2.10.1",
+        "@tauri-apps/cli-win32-x64-msvc": "2.10.1"
       }
     },
     "node_modules/@tauri-apps/cli-darwin-arm64": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-arm64/-/cli-darwin-arm64-2.11.1.tgz",
-      "integrity": "sha512-6eEKMBXsQPCuM1EmvrjT2+aBuxWQuFdKdW8pzNuNQtpq45nEEpBlD5gr8pUeAyOU1DQKlkFaEc/MPBxb/Pfjtg==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-arm64/-/cli-darwin-arm64-2.10.1.tgz",
+      "integrity": "sha512-Z2OjCXiZ+fbYZy7PmP3WRnOpM9+Fy+oonKDEmUE6MwN4IGaYqgceTjwHucc/kEEYZos5GICve35f7ZiizgqEnQ==",
       "cpu": [
         "arm64"
       ],
@@ -4103,9 +4091,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-darwin-x64": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-x64/-/cli-darwin-x64-2.11.1.tgz",
-      "integrity": "sha512-LQUO7exfRWjWALNhetph5guWpMeHphRpokOLk0OIbTTExaNwJNFu3I4vb+CCM/4G/QGoZe/5XikZOJdNEFP1ig==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-darwin-x64/-/cli-darwin-x64-2.10.1.tgz",
+      "integrity": "sha512-V/irQVvjPMGOTQqNj55PnQPVuH4VJP8vZCN7ajnj+ZS8Kom1tEM2hR3qbbIRoS3dBKs5mbG8yg1WC+97dq17Pw==",
       "cpu": [
         "x64"
       ],
@@ -4120,9 +4108,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-arm-gnueabihf": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm-gnueabihf/-/cli-linux-arm-gnueabihf-2.11.1.tgz",
-      "integrity": "sha512-5i/awiBCRRhOUG8yjn0fMHXIWD5Ez8eEk5LtvOxyQrKuJkRaZDvnbIjZbE183blAwkoA4xN3aO/prJiqscl02Q==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm-gnueabihf/-/cli-linux-arm-gnueabihf-2.10.1.tgz",
+      "integrity": "sha512-Hyzwsb4VnCWKGfTw+wSt15Z2pLw2f0JdFBfq2vHBOBhvg7oi6uhKiF87hmbXOBXUZaGkyRDkCHsdzJcIfoJC2w==",
       "cpu": [
         "arm"
       ],
@@ -4137,9 +4125,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-arm64-gnu": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-gnu/-/cli-linux-arm64-gnu-2.11.1.tgz",
-      "integrity": "sha512-9LrwDw3S9Fygtw/Q6WDhOP+3svJRGAsejeE+GKrc0eO1ThMVhwi2LL6hw4dlKw93IfS7VY1G19sWGxJ/NcU4nA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-gnu/-/cli-linux-arm64-gnu-2.10.1.tgz",
+      "integrity": "sha512-OyOYs2t5GkBIvyWjA1+h4CZxTcdz1OZPCWAPz5DYEfB0cnWHERTnQ/SLayQzncrT0kwRoSfSz9KxenkyJoTelA==",
       "cpu": [
         "arm64"
       ],
@@ -4154,9 +4142,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-arm64-musl": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.11.1.tgz",
-      "integrity": "sha512-mNA5dbbqPqDUdTIwdUYYuhO2GvIe9UnB2r0VU2njxBOS3Opbx4gKNC5yP0Iu4rYmEmqdlwry9VzGZQ3wq9dyFg==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-arm64-musl/-/cli-linux-arm64-musl-2.10.1.tgz",
+      "integrity": "sha512-MIj78PDDGjkg3NqGptDOGgfXks7SYJwhiMh8SBoZS+vfdz7yP5jN18bNaLnDhsVIPARcAhE1TlsZe/8Yxo2zqg==",
       "cpu": [
         "arm64"
       ],
@@ -4171,9 +4159,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-riscv64-gnu": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-riscv64-gnu/-/cli-linux-riscv64-gnu-2.11.1.tgz",
-      "integrity": "sha512-fZj3Gwq+6fUs305T5WQiD5iSGJw+j/4w/HGmk4sHDAcy+rp9zU5eaxB7nOyz5/I/nkNAuKPqfp6uIbiUBXkBCw==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-riscv64-gnu/-/cli-linux-riscv64-gnu-2.10.1.tgz",
+      "integrity": "sha512-X0lvOVUg8PCVaoEtEAnpxmnkwlE1gcMDTqfhbefICKDnOTJ5Est3qL0SrWxizDackIOKBcvtpejrSiVpuJI1kw==",
       "cpu": [
         "riscv64"
       ],
@@ -4188,9 +4176,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-x64-gnu": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-gnu/-/cli-linux-x64-gnu-2.11.1.tgz",
-      "integrity": "sha512-XFxGxOvHM7jjeD6ozCKdGfhzJ7lERYDGZl1/Kb4fsvchaJsfLJ981TlyTG8Qy/gFq+f5GitH3bfrX9JAkjPEyw==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-gnu/-/cli-linux-x64-gnu-2.10.1.tgz",
+      "integrity": "sha512-2/12bEzsJS9fAKybxgicCDFxYD1WEI9kO+tlDwX5znWG2GwMBaiWcmhGlZ8fi+DMe9CXlcVarMTYc0L3REIRxw==",
       "cpu": [
         "x64"
       ],
@@ -4205,9 +4193,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-linux-x64-musl": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-musl/-/cli-linux-x64-musl-2.11.1.tgz",
-      "integrity": "sha512-d5C2/Zm+68v7R9wTuTCjRQEVrWjcdMkJBZ1+rXse+QdMMlTB9+u9PDNDLw9PQflWxYLaYZ7tjxxL9Nb9II6PbA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-linux-x64-musl/-/cli-linux-x64-musl-2.10.1.tgz",
+      "integrity": "sha512-Y8J0ZzswPz50UcGOFuXGEMrxbjwKSPgXftx5qnkuMs2rmwQB5ssvLb6tn54wDSYxe7S6vlLob9vt0VKuNOaCIQ==",
       "cpu": [
         "x64"
       ],
@@ -4222,9 +4210,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-win32-arm64-msvc": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-arm64-msvc/-/cli-win32-arm64-msvc-2.11.1.tgz",
-      "integrity": "sha512-YdeVWFAR1pTXzUU6NLstPq4G6OLxuDrXCXEBdmBH+5EZIDXUx0D2kJlz3+YjpazkKvAzYpgziTsyRagls0OfRQ==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-arm64-msvc/-/cli-win32-arm64-msvc-2.10.1.tgz",
+      "integrity": "sha512-iSt5B86jHYAPJa/IlYw++SXtFPGnWtFJriHn7X0NFBVunF6zu9+/zOn8OgqIWSl8RgzhLGXQEEtGBdR4wzpVgg==",
       "cpu": [
         "arm64"
       ],
@@ -4239,9 +4227,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-win32-ia32-msvc": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-ia32-msvc/-/cli-win32-ia32-msvc-2.11.1.tgz",
-      "integrity": "sha512-VBGkuH0eB9K9LLSMv361Gzr5Ou72sCS4+ztpmkWEQ+wd/amhcYOsf3X6qn1RJZDzIhiOYHJEOysZUC3baD01rA==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-ia32-msvc/-/cli-win32-ia32-msvc-2.10.1.tgz",
+      "integrity": "sha512-gXyxgEzsFegmnWywYU5pEBURkcFN/Oo45EAwvZrHMh+zUSEAvO5E8TXsgPADYm31d1u7OQU3O3HsYfVBf2moHw==",
       "cpu": [
         "ia32"
       ],
@@ -4256,9 +4244,9 @@
       }
     },
     "node_modules/@tauri-apps/cli-win32-x64-msvc": {
-      "version": "2.11.1",
-      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-x64-msvc/-/cli-win32-x64-msvc-2.11.1.tgz",
-      "integrity": "sha512-b3ORhIAKgp9ZYY+zBt7b7r0kLU2kjvyGF0+MS2SBym3emsweGPybEqocJcmtMuxyBhkOKHP4CiuEJEDuAlTx6A==",
+      "version": "2.10.1",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/cli-win32-x64-msvc/-/cli-win32-x64-msvc-2.10.1.tgz",
+      "integrity": "sha512-6Cn7YpPFwzChy0ERz6djKEmUehWrYlM+xTaNzGPgZocw3BD7OfwfWHKVWxXzdjEW2KfKkHddfdxK1XXTYqBRLg==",
       "cpu": [
         "x64"
       ],
@@ -4281,6 +4269,16 @@
         "@tauri-apps/api": "^2.11.0"
       }
     },
+    "node_modules/@tauri-apps/plugin-opener/node_modules/@tauri-apps/api": {
+      "version": "2.11.0",
+      "resolved": "https://registry.npmjs.org/@tauri-apps/api/-/api-2.11.0.tgz",
+      "integrity": "sha512-7CinYODhky9lmO23xHnUFv0Xt43fbtWMyxZcLcRBlFkcgXKuEirBvHpmtJ89YMhyeGcq20Wuc47Fa4XjyniywA==",
+      "license": "Apache-2.0 OR MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/tauri"
+      }
+    },
     "node_modules/@tauri-apps/plugin-process": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/@tauri-apps/plugin-process/-/plugin-process-2.3.1.tgz",
@@ -4322,9 +4320,9 @@
       }
     },
     "node_modules/@ts-morph/common/node_modules/brace-expansion": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.5.tgz",
-      "integrity": "sha512-VZznLgtwhn+Mact9tfiwx64fA9erHH/MCXEUfB/0bX/6Fz6ny5EGTXYltMocqg4xFAQZtnO3DHWWXi8RiuN7cQ==",
+      "version": "5.0.6",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.6.tgz",
+      "integrity": "sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4459,9 +4457,9 @@
       "license": "MIT"
     },
     "node_modules/@types/estree": {
-      "version": "1.0.8",
-      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
-      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.9.tgz",
+      "integrity": "sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg==",
       "dev": true,
       "license": "MIT"
     },
@@ -4484,13 +4482,13 @@
       }
     },
     "node_modules/@types/node": {
-      "version": "25.6.0",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-25.6.0.tgz",
-      "integrity": "sha512-+qIYRKdNYJwY3vRCZMdJbPLJAtGjQBudzZzdzwQYkEPQd+PJGixUL5QfvCLDaULoLv+RhT3LDkwEfKaAkgSmNQ==",
+      "version": "25.7.0",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-25.7.0.tgz",
+      "integrity": "sha512-z+pdZyxE+RTQE9AcboAZCb4otwcrvgHD+GlBpPgn0emDVt0ohrTMhAwlr2Wd9nZ+nihhYFxO2pThz3C5qSu2Eg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "undici-types": "~7.19.0"
+        "undici-types": "~7.21.0"
       }
     },
     "node_modules/@types/react": {
@@ -4544,17 +4542,17 @@
       "license": "MIT"
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.59.2.tgz",
-      "integrity": "sha512-j/bwmkBvHUtPNxzuWe5z6BEk3q54YRyGlBXkSsmfoih7zNrBvl5A9A98anlp/7JbyZcWIJ8KXo/3Tq/DjFLtuQ==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.59.3.tgz",
+      "integrity": "sha512-PwFvSKsXGShKGW6n5bZOhGHEcCZXM8HofLK9fNsEwZXzFRjoY+XT1Vsf1zgyXdwTr0ZYz1/2tkZ0DBTT9jZjhw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/regexpp": "^4.12.2",
-        "@typescript-eslint/scope-manager": "8.59.2",
-        "@typescript-eslint/type-utils": "8.59.2",
-        "@typescript-eslint/utils": "8.59.2",
-        "@typescript-eslint/visitor-keys": "8.59.2",
+        "@typescript-eslint/scope-manager": "8.59.3",
+        "@typescript-eslint/type-utils": "8.59.3",
+        "@typescript-eslint/utils": "8.59.3",
+        "@typescript-eslint/visitor-keys": "8.59.3",
         "ignore": "^7.0.5",
         "natural-compare": "^1.4.0",
         "ts-api-utils": "^2.5.0"
@@ -4567,7 +4565,7 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "@typescript-eslint/parser": "^8.59.2",
+        "@typescript-eslint/parser": "^8.59.3",
         "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
         "typescript": ">=4.8.4 <6.1.0"
       }
@@ -4583,16 +4581,16 @@
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.59.2.tgz",
-      "integrity": "sha512-plR3pp6D+SSUn1HM7xvSkx12/DhoHInI2YF35KAcVFNZvlC0gtrWqx7Qq1oH2Ssgi0vlFRCTbP+DZc7B9+TtsQ==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.59.3.tgz",
+      "integrity": "sha512-HPwA+hVkfcriajbNvTmZv4VRauibay+cWArYUYq7u7W7PmGShMxbPxLvrwDme55a6d5alG3nrYfhyJ/G28XlLg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.59.2",
-        "@typescript-eslint/types": "8.59.2",
-        "@typescript-eslint/typescript-estree": "8.59.2",
-        "@typescript-eslint/visitor-keys": "8.59.2",
+        "@typescript-eslint/scope-manager": "8.59.3",
+        "@typescript-eslint/types": "8.59.3",
+        "@typescript-eslint/typescript-estree": "8.59.3",
+        "@typescript-eslint/visitor-keys": "8.59.3",
         "debug": "^4.4.3"
       },
       "engines": {
@@ -4608,14 +4606,14 @@
       }
     },
     "node_modules/@typescript-eslint/project-service": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.2.tgz",
-      "integrity": "sha512-+2hqvEkeyf/0FBor67duF0Ll7Ot8jyKzDQOSrxazF/danillRq2DwR9dLptsXpoZQqxE1UisSmoZewrlPas9Vw==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.3.tgz",
+      "integrity": "sha512-ECiUWa/KYRGDFUqTNehaRgzDshnJfkTABJxVemHk4ko22gcr0ukloKjWvyQ64g8YCV/UI47kN1dbmjf/GaQYng==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/tsconfig-utils": "^8.59.2",
-        "@typescript-eslint/types": "^8.59.2",
+        "@typescript-eslint/tsconfig-utils": "^8.59.3",
+        "@typescript-eslint/types": "^8.59.3",
         "debug": "^4.4.3"
       },
       "engines": {
@@ -4630,14 +4628,14 @@
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.2.tgz",
-      "integrity": "sha512-JzfyEpEtOU89CcFSwyNS3mu4MLvLSXqnmX05+aKBDM+TdR5jzcGOEBwxwGNxrEQ7p/z6kK2WyioCGBf2zZBnvg==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.3.tgz",
+      "integrity": "sha512-t2LvZnoEfzKtnPjgeEu41xw5gxq9mQVfYy4OoZ4Vlt0sk3JwxmhCca/AR7DwOiHrjWgjAj6as4AhRLKSDfvZIA==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.59.2",
-        "@typescript-eslint/visitor-keys": "8.59.2"
+        "@typescript-eslint/types": "8.59.3",
+        "@typescript-eslint/visitor-keys": "8.59.3"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4648,9 +4646,9 @@
       }
     },
     "node_modules/@typescript-eslint/tsconfig-utils": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.2.tgz",
-      "integrity": "sha512-BKK4alN7oi4C/zv4VqHQ+uRU+lTa6JGIZ7s1juw7b3RHo9OfKB+bKX3u0iVZetdsUCBBkSbdWbarJbmN0fTeSw==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.3.tgz",
+      "integrity": "sha512-PcIJHjmaREXLgIAIzLnSY9VucEzz8FKXsRgFa1DmdGCK/5tJpW03TKJF01Q6VZd1lLdz2sIKPWaDUZN9dp//dw==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -4665,15 +4663,15 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.59.2.tgz",
-      "integrity": "sha512-nhqaj1nmTdVVl/BP5omXNRGO38jn5iosis2vbdmupF2txCf8ylWT8lx+JlvMYYVqzGVKtjojUFoQ3JRWK+mfzQ==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.59.3.tgz",
+      "integrity": "sha512-g71d8QD8UaiHGvrJwyIS1hCX5r63w6Jll+4VEYhEAHXTDIqX1JgxhTAbEHtKntL9kuc4jRo7/GWw5xfCepSccQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.59.2",
-        "@typescript-eslint/typescript-estree": "8.59.2",
-        "@typescript-eslint/utils": "8.59.2",
+        "@typescript-eslint/types": "8.59.3",
+        "@typescript-eslint/typescript-estree": "8.59.3",
+        "@typescript-eslint/utils": "8.59.3",
         "debug": "^4.4.3",
         "ts-api-utils": "^2.5.0"
       },
@@ -4690,9 +4688,9 @@
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.2.tgz",
-      "integrity": "sha512-e82GVOE8Ps3E++Egvb6Y3Dw0S10u8NkQ9KXmtRhCWJJ8kDhOJTvtMAWnFL16kB1583goCWXsr0NieKCZMs2/0Q==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.3.tgz",
+      "integrity": "sha512-ePFoH0g4ludssdRFqqDxQePCxU4WQyRa9+XVwjm7yLn0FKhMeoetC+qBEEI1Eyb1pGSDveTIT09Bvw2WhlGayg==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -4704,16 +4702,16 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.2.tgz",
-      "integrity": "sha512-o0XPGNwcWw+FIwStOWn+BwBuEmL6QXP0rsvAFg7ET1dey1Nr6Wb1ac8p5HEsK0ygO/6mUxlk+YWQD9xcb/nnXg==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.3.tgz",
+      "integrity": "sha512-CbRjVRAf7Lr9Kr8RopKcbY45p2VfmmHrm0ygOCYFi7oU8q19m0Fs/6iHS7kNOmwpp+ob07ZVcAqlxUod9lYdmg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/project-service": "8.59.2",
-        "@typescript-eslint/tsconfig-utils": "8.59.2",
-        "@typescript-eslint/types": "8.59.2",
-        "@typescript-eslint/visitor-keys": "8.59.2",
+        "@typescript-eslint/project-service": "8.59.3",
+        "@typescript-eslint/tsconfig-utils": "8.59.3",
+        "@typescript-eslint/types": "8.59.3",
+        "@typescript-eslint/visitor-keys": "8.59.3",
         "debug": "^4.4.3",
         "minimatch": "^10.2.2",
         "semver": "^7.7.3",
@@ -4742,9 +4740,9 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/brace-expansion": {
-      "version": "5.0.5",
-      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.5.tgz",
-      "integrity": "sha512-VZznLgtwhn+Mact9tfiwx64fA9erHH/MCXEUfB/0bX/6Fz6ny5EGTXYltMocqg4xFAQZtnO3DHWWXi8RiuN7cQ==",
+      "version": "5.0.6",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.6.tgz",
+      "integrity": "sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -4771,16 +4769,16 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.59.2.tgz",
-      "integrity": "sha512-Juw3EinkXqjaffxz6roowvV7GZT/kET5vSKKZT6upl5TXdWkLkYmNPXwDDL2Vkt2DPn0nODIS4egC/0AGxKo/Q==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.59.3.tgz",
+      "integrity": "sha512-JAvT14goBzRzzzZyqq3P9BLArIxTtQURUtFgQ/V7FO+eU+Gg6ES+5ymOPP1wRxXcxAYeivCk4uS3jCKWI1K8Zg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.9.1",
-        "@typescript-eslint/scope-manager": "8.59.2",
-        "@typescript-eslint/types": "8.59.2",
-        "@typescript-eslint/typescript-estree": "8.59.2"
+        "@typescript-eslint/scope-manager": "8.59.3",
+        "@typescript-eslint/types": "8.59.3",
+        "@typescript-eslint/typescript-estree": "8.59.3"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -4795,13 +4793,13 @@
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.2.tgz",
-      "integrity": "sha512-NwjLUnGy8/Zfx23fl50tRC8rYaYnM52xNRYFAXvmiil9yh1+K6aRVQMnzW6gQB/1DLgWt977lYQn7C+wtgXZiA==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.3.tgz",
+      "integrity": "sha512-f1UQF7ggd42YiwI5wGrRaPsa+P0CINBlrkLPmGfpq/u/I/oVtecoEIfFR9ag/oa1sLOsRNZ6xehf6qMZhQGBDg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/types": "8.59.3",
         "eslint-visitor-keys": "^5.0.0"
       },
       "engines": {
@@ -4982,9 +4980,9 @@
       }
     },
     "node_modules/ansis": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmjs.org/ansis/-/ansis-4.2.0.tgz",
-      "integrity": "sha512-HqZ5rWlFjGiV0tDm3UxxgNRqsOTniqoKZu0pIAfh7TZQMGuZK+hH0drySty0si0QXj1ieop4+SkSfPZBPPkHig==",
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansis/-/ansis-4.3.0.tgz",
+      "integrity": "sha512-44mvgtPvohuU/70DdY5Oz2AIrLJ9k6/5x4KmoSvPwO+5Moijo0+N9D0fKbbYZQWP1hNm5CpOf+E01jhxG/r8xg==",
       "dev": true,
       "license": "ISC",
       "engines": {
@@ -5031,9 +5029,9 @@
       "license": "MIT"
     },
     "node_modules/baseline-browser-mapping": {
-      "version": "2.10.27",
-      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.27.tgz",
-      "integrity": "sha512-zEs/ufmZoUd7WftKpKyXaT6RFxpQ5Qm9xytKRHvJfxFV9DFJkZph9RvJ1LcOUi0Z1ZVijMte65JbILeV+8QQEA==",
+      "version": "2.10.29",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.29.tgz",
+      "integrity": "sha512-Asa2krT+XTPZINCS+2QcyS8WTkObE77RwkydwF7h6DmnKqbvlalz93m/dnphUyCa6SWSP51VgtEUf2FN+gelFQ==",
       "dev": true,
       "license": "Apache-2.0",
       "bin": {
@@ -5865,9 +5863,9 @@
       "license": "MIT"
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.351",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.351.tgz",
-      "integrity": "sha512-9D7Iqx8RImSvCnOsj86rCH6eQjZFQoM04Jn6HnZVM0Nu/G58/gmKYQ1d12MZTbjQbQSTGI8nwEy07ErsA2slLA==",
+      "version": "1.5.353",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.353.tgz",
+      "integrity": "sha512-kOrWphBi8TOZyiJZqsgqIle0lw+tzmnQK83pV9dZUd01Nm2POECSyFQMAuarzZdYqQW7FH9RaYOuaRo3h+bQ3w==",
       "dev": true,
       "license": "ISC"
     },
@@ -5889,9 +5887,9 @@
       }
     },
     "node_modules/enhanced-resolve": {
-      "version": "5.21.2",
-      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.21.2.tgz",
-      "integrity": "sha512-xe9vQb5kReirPUxgQrXA3ihgbCqssmTiM7cOZ+Gzu+VeGWgpV98lLZvp0dl4yriyAePcewxGUs9UpKD8PET9KQ==",
+      "version": "5.21.3",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.21.3.tgz",
+      "integrity": "sha512-QyL119InA+XXEkNLNTPCXPugSvOfhwv0JOlGNzvxs0hZaiHLNvXSpudUWsOlsXGWJh8G6ckCScEkVHfX3kw/2Q==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6362,13 +6360,13 @@
       }
     },
     "node_modules/express-rate-limit": {
-      "version": "8.5.0",
-      "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-8.5.0.tgz",
-      "integrity": "sha512-XKhFohWaSBdVJNTi5TaHziqnPkv04I9UQV6q1Wy7Ui6GGQZVW12ojDFwqer14EvCXxjvPG0CyWXx7cAXpALB4Q==",
+      "version": "8.5.1",
+      "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-8.5.1.tgz",
+      "integrity": "sha512-5O6KYmyJEpuPJV5hNTXKbAHWRqrzyu+OI3vUnSd2kXFubIVpG7ezpgxQy76Zo5GQZtrQBg86hF+CM/NX+cioiQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "ip-address": "10.1.0"
+        "ip-address": "^10.2.0"
       },
       "engines": {
         "node": ">= 16"
@@ -6673,9 +6671,9 @@
       }
     },
     "node_modules/fs-extra": {
-      "version": "11.3.4",
-      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.4.tgz",
-      "integrity": "sha512-CTXd6rk/M3/ULNQj8FBqBWHYBVYybQ3VPBw0xGKFe3tuH7ytT6ACnvzpIQ3UZtB8yvUKC2cXn1a+x+5EVQLovA==",
+      "version": "11.3.5",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.5.tgz",
+      "integrity": "sha512-eKpRKAovdpZtR1WopLHxlBWvAgPny3c4gX1G5Jhwmmw4XJj0ifSD5qB5TOo8hmA0wlRKDAOAhEE1yVPgs6Fgcg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -6747,9 +6745,9 @@
       }
     },
     "node_modules/get-east-asian-width": {
-      "version": "1.5.0",
-      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.5.0.tgz",
-      "integrity": "sha512-CQ+bEO+Tva/qlmw24dCejulK5pMzVnUOFOijVogd3KQs07HnRIgp8TGipvCCRT06xeYEbpbgwaCxglFyiuIcmA==",
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.6.0.tgz",
+      "integrity": "sha512-QRbvDIbx6YklUe6RxeTeleMR0yv3cYH6PsPZHcnVn7xv7zO1BHN8r0XETu8n6Ye3Q+ahtSarc3WgtNWmehIBfA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -7844,9 +7842,9 @@
       }
     },
     "node_modules/markdown-to-jsx": {
-      "version": "9.7.16",
-      "resolved": "https://registry.npmjs.org/markdown-to-jsx/-/markdown-to-jsx-9.7.16.tgz",
-      "integrity": "sha512-+LEgOlYfUEB9i2Oaxasec9H2HytB1+SQcgwFmQiNTKwe8cQ2E9bDNgePGq6ChIycMxtpcEY0g44aQ3uJoMw8eg==",
+      "version": "9.8.0",
+      "resolved": "https://registry.npmjs.org/markdown-to-jsx/-/markdown-to-jsx-9.8.0.tgz",
+      "integrity": "sha512-NWL0vDt6BeQgCxc2kK6g2SEPJpQuacu+NJk5j4QT4wlNmbsHdudoAbTGLCIyoPhfMiEqD1OZVBsYK0hvCky/HQ==",
       "license": "MIT",
       "engines": {
         "node": ">= 18"
@@ -8029,9 +8027,9 @@
       "license": "MIT"
     },
     "node_modules/msw": {
-      "version": "2.14.3",
-      "resolved": "https://registry.npmjs.org/msw/-/msw-2.14.3.tgz",
-      "integrity": "sha512-kk8G5cocVlJ4wsKMGZegn2H6XLOEKjbA+nSJE2354e/SRp4mDicCHUYnMXpymzVcVDCs+GUAsmNqSn+yHv4T2A==",
+      "version": "2.14.6",
+      "resolved": "https://registry.npmjs.org/msw/-/msw-2.14.6.tgz",
+      "integrity": "sha512-ALe+N10S72cyx94cMcy3Zs4HhXCj35sgeAL4c+WTvKi0zWnbd8/h0lcFqv0mb2P+aSgAdD7p9HzvA0DiUPxsyg==",
       "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
@@ -8170,9 +8168,9 @@
       }
     },
     "node_modules/node-releases": {
-      "version": "2.0.38",
-      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.38.tgz",
-      "integrity": "sha512-3qT/88Y3FbH/Kx4szpQQ4HzUbVrHPKTLVpVocKiLfoYvw9XSGOX2FmD2d6DrXbVYyAQTF2HeF6My8jmzx7/CRw==",
+      "version": "2.0.44",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.44.tgz",
+      "integrity": "sha512-5WUyunoPMsvvEhS8AxHtRzP+oA8UCkJ7YRxatWKjngndhDGLiqEVAQKWjFAiAiuL8zMRGzGSJxFnLetoa43qGQ==",
       "dev": true,
       "license": "MIT"
     },
@@ -8874,9 +8872,9 @@
       }
     },
     "node_modules/react-is": {
-      "version": "19.2.5",
-      "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.5.tgz",
-      "integrity": "sha512-Dn0t8IQhCmeIT3wu+Apm1/YVsJXsGWi6k4sPdnBIdqMVtHtv0IGi6dcpNpNkNac0zB2uUAqNX3MHzN8c+z2rwQ==",
+      "version": "19.2.6",
+      "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.6.tgz",
+      "integrity": "sha512-XjBR15BhXuylgWGuslhDKqlSayuqvqBX91BP8pauG8kd1zY8kotkNWbXksTCNRarse4kuGbe2kIY05ARtwNIvw==",
       "license": "MIT",
       "peer": true
     },
@@ -9198,6 +9196,13 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/rollup/node_modules/@types/estree": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
+      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "dev": true,
+      "license": "MIT"
+    },
     "node_modules/router": {
       "version": "2.2.0",
       "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
@@ -9277,9 +9282,9 @@
       "license": "MIT"
     },
     "node_modules/semver": {
-      "version": "7.7.4",
-      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz",
-      "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==",
+      "version": "7.8.0",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.0.tgz",
+      "integrity": "sha512-AcM7dV/5ul4EekoQ29Agm5vri8JNqRyj39o0qpX6vDF2GZrtutZl5RwgD1XnZjiTAfncsJhMI48QQH3sN87YNA==",
       "dev": true,
       "license": "ISC",
       "bin": {
@@ -9704,9 +9709,9 @@
       }
     },
     "node_modules/tailwind-merge": {
-      "version": "3.5.0",
-      "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.5.0.tgz",
-      "integrity": "sha512-I8K9wewnVDkL1NTGoqWmVEIlUcB9gFriAEkXkfCjX5ib8ezGxtR3xD7iZIxrfArjEsH7F1CHD4RFUtxefdqV/A==",
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.6.0.tgz",
+      "integrity": "sha512-uxL7qAVQriqRQPAyK3pj66VqskWqoZ37PW94jwOTwNfq/z9oyu1V+eqrZqtR2+fCiXdYOZe/Modt8GtvqNzu+w==",
       "license": "MIT",
       "funding": {
         "type": "github",
@@ -9937,16 +9942,16 @@
       }
     },
     "node_modules/typescript-eslint": {
-      "version": "8.59.2",
-      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.59.2.tgz",
-      "integrity": "sha512-pJw051uomb3ZeCzGTpRb8RbEqB5Y4WWet8gl/GcTlU35BSx0PVdZ86/bqkQCyKKuraVQEK7r6kBHQXF+fBhkoQ==",
+      "version": "8.59.3",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.59.3.tgz",
+      "integrity": "sha512-KgusgyDgG4LI8Ih/sWaCtZ06tckLAS5CvT5A4D1Q7bYVoAAyzwiZvE4BmwDHkhRVkvhRBepKeASoFzQetha7Fg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/eslint-plugin": "8.59.2",
-        "@typescript-eslint/parser": "8.59.2",
-        "@typescript-eslint/typescript-estree": "8.59.2",
-        "@typescript-eslint/utils": "8.59.2"
+        "@typescript-eslint/eslint-plugin": "8.59.3",
+        "@typescript-eslint/parser": "8.59.3",
+        "@typescript-eslint/typescript-estree": "8.59.3",
+        "@typescript-eslint/utils": "8.59.3"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -9961,9 +9966,9 @@
       }
     },
     "node_modules/undici-types": {
-      "version": "7.19.2",
-      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.19.2.tgz",
-      "integrity": "sha512-qYVnV5OEm2AW8cJMCpdV20CDyaN3g0AjDlOGf1OW4iaDEx8MwdtChUp4zu4H0VP3nDRF/8RKWH+IPp9uW0YGZg==",
+      "version": "7.21.0",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.21.0.tgz",
+      "integrity": "sha512-w9IMgQrz4O0YN1LtB7K5P63vhlIOvC7opSmouCJ+ZywlPAlO9gIkJ+otk6LvGpAs2wg4econaCz3TvQ9xPoyuQ==",
       "dev": true,
       "license": "MIT"
     },
diff --git a/src/App.tsx b/src/App.tsx
index 4738fbf..d6c22f2 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -2,6 +2,21 @@ import { useEffect } from "react";
 
 import { BrowserRouter } from "react-router-dom";
 
+import DashboardPage from "./features/Dashboard/v1/Pages/DashboardPage";
+import MemberPage from "./features/Member/v1/Pages/MemberPage";
+import LoginUserTemplate from "./features/template/LoginUserTemplate";
+import AddMemberPage from "./features/AddMember/v1/Page/AddMemberPage";
+import CreateNewEvent from "./features/Events/v1/Pages/CreateNewEvent";
+import Contact from "./features/Contact_And_Support/v1/Pages/Contact";
+import ViewEvent from "./features/Events/v1/Pages/ViewEvent";
+import LoginPage from "./features/Auth/v1/Pages/LoginPage";
+import SignUpPage from "./features/Auth/v1/Pages/SignUpPage";
+import TaskListPage from "./features/MemberTask/pages/TaskListPage";
+import TaskDetailPage from "./features/MemberTask/pages/TaskDetailPage";
+import CreateTaskPage from "./features/MemberTask/pages/CreateTaskPage";
+import EditTaskPage from "./features/MemberTask/pages/EditTaskPage";
+import ProjectDetailPage from "./features/ProjectDetail/pages/ProjectDetailPage";
+import { PermissionProvider } from "./features/MemberTask/context/PermissionContext";
 import "./App.css";
 
 import { dashboardData } from "./features/Member/v1/mock/dashboardData";
@@ -19,6 +34,65 @@ function App() {
   const user = dashboardData.user;
 
   return (
+    <PermissionProvider>
+    <BrowserRouter>
+      <Routes>
+        {/* Public Routes */}
+        <Route path="/" element={<LoginPage />} />
+        <Route path="/signup" element={<SignUpPage />} />
+
+        {/* Protected / Org Layout */}
+        <Route path="/org" element={<LoginUserTemplate />}>
+          {/* Protected Dashboard */}
+          <Route
+            index
+            element={
+              <ProtectedRoute user={user} allowedRoles={["Member", "Admin"]}>
+                <DashboardPage />
+              </ProtectedRoute>
+            }
+          />
+
+          <Route
+            path="dashboard"
+            element={
+              <ProtectedRoute user={user} allowedRoles={["Member", "Admin"]}>
+                <DashboardPage />
+              </ProtectedRoute>
+            }
+          />
+
+          {/* Other routes (not restricted) */}
+          <Route path="member" element={<MemberPage />} />
+          <Route path="add-member" element={<AddMemberPage />} />
+          <Route path="events" element={<ViewEvent />} />
+          <Route path="create-event" element={<CreateNewEvent />} />
+          <Route path="contact" element={<Contact />} />
+
+          {/* Task System */}
+          <Route path="tasks" element={<TaskListPage />} />
+          <Route path="tasks/create" element={<CreateTaskPage />} />
+          <Route path="tasks/:taskId" element={<TaskDetailPage />} />
+          <Route path="tasks/:taskId/edit" element={<EditTaskPage />} />
+
+          {/* Project System */}
+          <Route path="projects/:projectId" element={<ProjectDetailPage />} />
+
+          <Route path="*" element={<div>404 Not Found</div>} />
+        </Route>
+
+        <Route
+          path="/unauthorized"
+          element={
+            <div className="flex items-center justify-center h-screen text-red-500 text-xl">
+              Unauthorized Access
+            </div>
+          }
+        />
+      </Routes>
+    </BrowserRouter>
+    </PermissionProvider>
+    <ThemeProvider attribute="class" defaultTheme="light">
     <ThemeProvider>
       <BrowserRouter>
 
diff --git a/src/features/MemberTask/components/common/ConfirmModal.tsx b/src/features/MemberTask/components/common/ConfirmModal.tsx
new file mode 100644
index 0000000..78df90e
--- /dev/null
+++ b/src/features/MemberTask/components/common/ConfirmModal.tsx
@@ -0,0 +1,38 @@
+interface Props {
+  title: string;
+  message: string;
+  confirmLabel?: string;
+  onConfirm: () => void;
+  onCancel: () => void;
+}
+
+export default function ConfirmModal({
+  title,
+  message,
+  confirmLabel = "Confirm",
+  onConfirm,
+  onCancel,
+}: Props) {
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
+      <div className="bg-white rounded-xl shadow-xl p-6 w-full max-w-sm mx-4">
+        <h3 className="text-base font-semibold text-gray-900 mb-2">{title}</h3>
+        <p className="text-sm text-gray-500 mb-6">{message}</p>
+        <div className="flex gap-3 justify-end">
+          <button
+            onClick={onCancel}
+            className="px-4 py-2 text-sm rounded-lg border border-gray-200 text-gray-600 hover:bg-gray-50 transition-colors"
+          >
+            Cancel
+          </button>
+          <button
+            onClick={onConfirm}
+            className="px-4 py-2 text-sm rounded-lg bg-red-500 text-white hover:bg-red-600 transition-colors"
+          >
+            {confirmLabel}
+          </button>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/components/common/PriorityBadge.tsx b/src/features/MemberTask/components/common/PriorityBadge.tsx
new file mode 100644
index 0000000..d76599a
--- /dev/null
+++ b/src/features/MemberTask/components/common/PriorityBadge.tsx
@@ -0,0 +1,17 @@
+import type { TaskPriority } from "../../types/task.types";
+
+const config: Record<TaskPriority, { label: string; className: string }> = {
+  low: { label: "Low", className: "bg-gray-50 text-gray-500 border-gray-200" },
+  medium: { label: "Medium", className: "bg-orange-50 text-orange-500 border-orange-200" },
+  high: { label: "High", className: "bg-red-50 text-red-500 border-red-200" },
+  urgent: { label: "Urgent", className: "bg-red-100 text-red-700 border-red-300 font-semibold" },
+};
+
+export default function PriorityBadge({ priority }: { priority: TaskPriority }) {
+  const { label, className } = config[priority];
+  return (
+    <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium border ${className}`}>
+      {label}
+    </span>
+  );
+}
diff --git a/src/features/MemberTask/components/common/SkeletonLoader.tsx b/src/features/MemberTask/components/common/SkeletonLoader.tsx
new file mode 100644
index 0000000..f9515e9
--- /dev/null
+++ b/src/features/MemberTask/components/common/SkeletonLoader.tsx
@@ -0,0 +1,14 @@
+export default function SkeletonLoader({ rows = 5 }: { rows?: number }) {
+  return (
+    <div className="space-y-3 animate-pulse">
+      {Array.from({ length: rows }).map((_, i) => (
+        <div key={i} className="flex items-center gap-4 p-4 bg-white rounded-xl border border-gray-100">
+          <div className="h-4 bg-gray-200 rounded w-1/3" />
+          <div className="h-4 bg-gray-200 rounded w-1/6" />
+          <div className="h-4 bg-gray-200 rounded w-1/6" />
+          <div className="h-4 bg-gray-200 rounded w-1/6 ml-auto" />
+        </div>
+      ))}
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/components/common/StatusBadge.tsx b/src/features/MemberTask/components/common/StatusBadge.tsx
new file mode 100644
index 0000000..d24f7ec
--- /dev/null
+++ b/src/features/MemberTask/components/common/StatusBadge.tsx
@@ -0,0 +1,17 @@
+import type { TaskStatus } from "../../types/task.types";
+
+const config: Record<TaskStatus, { label: string; className: string }> = {
+  todo: { label: "To Do", className: "bg-gray-100 text-gray-600 border-gray-200" },
+  "in-progress": { label: "In Progress", className: "bg-blue-50 text-blue-600 border-blue-200" },
+  review: { label: "In Review", className: "bg-yellow-50 text-yellow-600 border-yellow-200" },
+  completed: { label: "Completed", className: "bg-green-50 text-green-600 border-green-200" },
+};
+
+export default function StatusBadge({ status }: { status: TaskStatus }) {
+  const { label, className } = config[status];
+  return (
+    <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium border ${className}`}>
+      {label}
+    </span>
+  );
+}
diff --git a/src/features/MemberTask/components/event/EventDropdown.tsx b/src/features/MemberTask/components/event/EventDropdown.tsx
new file mode 100644
index 0000000..0f62366
--- /dev/null
+++ b/src/features/MemberTask/components/event/EventDropdown.tsx
@@ -0,0 +1,38 @@
+import { MdEvent, MdExpandMore } from "react-icons/md";
+import type { Event } from "../../types/task.types";
+
+interface Props {
+  events: Event[];
+  selectedEventId: string | null;
+  onChange: (id: string) => void;
+}
+
+export default function EventDropdown({ events, selectedEventId, onChange }: Props) {
+  const selected = events.find((e) => e.id === selectedEventId);
+
+  return (
+    <div className="relative inline-flex items-center gap-2">
+      <MdEvent className="text-[#306ee8] text-lg shrink-0" />
+      <div className="relative">
+        <select
+          value={selectedEventId ?? ""}
+          onChange={(e) => onChange(e.target.value)}
+          className="appearance-none bg-white border border-gray-200 rounded-lg pl-3 pr-8 py-2 text-sm font-medium text-gray-700 cursor-pointer focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8] transition-colors"
+        >
+          <option value="" disabled>
+            Select Event
+          </option>
+          {events.map((ev) => (
+            <option key={ev.id} value={ev.id}>
+              {ev.name}
+            </option>
+          ))}
+        </select>
+        <MdExpandMore className="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-gray-400" />
+      </div>
+      {selected && (
+        <span className="text-xs text-gray-400 hidden sm:inline">— {selected.name}</span>
+      )}
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/components/task/CommentSection.tsx b/src/features/MemberTask/components/task/CommentSection.tsx
new file mode 100644
index 0000000..ba4558f
--- /dev/null
+++ b/src/features/MemberTask/components/task/CommentSection.tsx
@@ -0,0 +1,73 @@
+import { useState } from "react";
+import type { Comment } from "../../types/task.types";
+import { usePermissions } from "../../context/PermissionContext";
+
+interface Props {
+  comments: Comment[];
+  onAddComment: (content: string) => void;
+}
+
+export default function CommentSection({ comments, onAddComment }: Props) {
+  const { currentUserName } = usePermissions();
+  const [text, setText] = useState("");
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!text.trim()) return;
+    onAddComment(text.trim());
+    setText("");
+  };
+
+  return (
+    <div className="space-y-4">
+      <h3 className="text-sm font-semibold text-gray-700">Comments</h3>
+
+      <div className="space-y-3 max-h-64 overflow-y-auto pr-1">
+        {comments.length === 0 && (
+          <p className="text-sm text-gray-400">No comments yet.</p>
+        )}
+        {comments.map((c) => (
+          <div key={c.id} className="flex gap-3">
+            <div className="w-7 h-7 rounded-full bg-[#306ee8]/10 flex items-center justify-center text-xs font-bold text-[#306ee8] shrink-0">
+              {c.authorName[0]}
+            </div>
+            <div className="flex-1 bg-gray-50 rounded-lg px-3 py-2">
+              <div className="flex items-center gap-2 mb-1">
+                <span className="text-xs font-semibold text-gray-700">{c.authorName}</span>
+                <span className="text-xs text-gray-400">
+                  {new Date(c.createdAt).toLocaleDateString("en-IN", {
+                    day: "numeric",
+                    month: "short",
+                  })}
+                </span>
+              </div>
+              <p className="text-sm text-gray-600">{c.content}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+
+      <form onSubmit={handleSubmit} className="flex gap-2">
+        <div className="w-7 h-7 rounded-full bg-[#306ee8]/10 flex items-center justify-center text-xs font-bold text-[#306ee8] shrink-0 mt-1">
+          {currentUserName[0]}
+        </div>
+        <div className="flex-1 flex gap-2">
+          <input
+            type="text"
+            value={text}
+            onChange={(e) => setText(e.target.value)}
+            placeholder="Add a comment..."
+            className="flex-1 text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          />
+          <button
+            type="submit"
+            disabled={!text.trim()}
+            className="px-4 py-2 text-sm font-medium bg-[#306ee8] text-white rounded-lg hover:bg-[#2558c9] disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
+          >
+            Post
+          </button>
+        </div>
+      </form>
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/components/task/SubmissionForm.tsx b/src/features/MemberTask/components/task/SubmissionForm.tsx
new file mode 100644
index 0000000..d5901f7
--- /dev/null
+++ b/src/features/MemberTask/components/task/SubmissionForm.tsx
@@ -0,0 +1,93 @@
+import { useState } from "react";
+import type { Submission } from "../../types/task.types";
+import { usePermissions } from "../../context/PermissionContext";
+import { MdCheckCircle, MdCancel, MdHourglassEmpty } from "react-icons/md";
+
+interface Props {
+  taskId: string;
+  deadline: string;
+  submissions: Submission[];
+  onSubmit: (content: string) => void;
+}
+
+const statusIcon = {
+  pending: <MdHourglassEmpty className="text-yellow-500" />,
+  approved: <MdCheckCircle className="text-green-500" />,
+  rejected: <MdCancel className="text-red-500" />,
+};
+
+export default function SubmissionForm({ deadline, submissions, onSubmit }: Props) {
+  const { hasPermission, currentUserId } = usePermissions();
+  const [content, setContent] = useState("");
+
+  const deadlinePassed = new Date() > new Date(deadline);
+  const mySubmissions = submissions.filter((s) => s.submittedBy === currentUserId);
+  const hasSubmitted = mySubmissions.length > 0;
+
+  const canSubmit =
+    (!hasSubmitted || hasPermission("MULTIPLE_SUBMISSION")) &&
+    (!deadlinePassed || hasPermission("LATE_SUBMISSION"));
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!content.trim() || !canSubmit) return;
+    onSubmit(content.trim());
+    setContent("");
+  };
+
+  return (
+    <div className="space-y-4">
+      <h3 className="text-sm font-semibold text-gray-700">Submissions</h3>
+
+      {/* Submission history */}
+      {mySubmissions.length > 0 && (
+        <div className="space-y-2">
+          {mySubmissions.map((sub) => (
+            <div key={sub.id} className="bg-gray-50 rounded-lg p-3 border border-gray-100">
+              <div className="flex items-center gap-2 mb-1">
+                {statusIcon[sub.status]}
+                <span className="text-xs font-medium text-gray-600 capitalize">{sub.status}</span>
+                <span className="text-xs text-gray-400 ml-auto">
+                  {new Date(sub.submittedAt).toLocaleDateString("en-IN", {
+                    day: "numeric",
+                    month: "short",
+                  })}
+                </span>
+              </div>
+              <p className="text-sm text-gray-700">{sub.content}</p>
+              {sub.reviewNote && (
+                <p className="text-xs text-gray-500 mt-1 italic">Review: {sub.reviewNote}</p>
+              )}
+            </div>
+          ))}
+        </div>
+      )}
+
+      {/* Submit form */}
+      {canSubmit ? (
+        <form onSubmit={handleSubmit} className="space-y-2">
+          <textarea
+            value={content}
+            onChange={(e) => setContent(e.target.value)}
+            placeholder="Describe your submission or paste a link..."
+            rows={3}
+            className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 resize-none focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          />
+          <button
+            type="submit"
+            disabled={!content.trim()}
+            className="px-4 py-2 text-sm font-medium bg-[#306ee8] text-white rounded-lg hover:bg-[#2558c9] disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
+          >
+            Submit Work
+          </button>
+        </form>
+      ) : (
+        <div className="text-sm text-gray-400 bg-gray-50 rounded-lg px-3 py-2 border border-gray-100">
+          {deadlinePassed && !hasPermission("LATE_SUBMISSION")
+            ? "Deadline has passed. Late submissions are not allowed."
+            : "You have already submitted. Multiple submissions are not allowed."}
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/components/task/TaskDetail.tsx b/src/features/MemberTask/components/task/TaskDetail.tsx
new file mode 100644
index 0000000..28af87e
--- /dev/null
+++ b/src/features/MemberTask/components/task/TaskDetail.tsx
@@ -0,0 +1,254 @@
+import { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { MdArrowBack, MdEdit, MdDelete } from "react-icons/md";
+import type { Task, Submission, Comment, TaskStatus } from "../../types/task.types";
+import { usePermissions } from "../../context/PermissionContext";
+import StatusBadge from "../common/StatusBadge";
+import PriorityBadge from "../common/PriorityBadge";
+import ConfirmModal from "../common/ConfirmModal";
+import SubmissionForm from "./SubmissionForm";
+import CommentSection from "./CommentSection";
+
+interface Props {
+  task: Task;
+  submissions: Submission[];
+  comments: Comment[];
+  onDelete: (id: string) => void;
+  onStatusChange: (id: string, status: TaskStatus) => void;
+  onAddSubmission: (taskId: string, content: string) => void;
+  onAddComment: (taskId: string, content: string) => void;
+  onReview: (submissionId: string, status: "approved" | "rejected", note: string) => void;
+}
+
+const STATUS_OPTIONS: TaskStatus[] = ["todo", "in-progress", "review", "completed"];
+
+export default function TaskDetail({
+  task,
+  submissions,
+  comments,
+  onDelete,
+  onStatusChange,
+  onAddSubmission,
+  onAddComment,
+  onReview,
+}: Props) {
+  const navigate = useNavigate();
+  const { hasPermission } = usePermissions();
+  const [showDelete, setShowDelete] = useState(false);
+  const [reviewNote, setReviewNote] = useState("");
+  const [reviewTarget, setReviewTarget] = useState<string | null>(null);
+
+  const deadlinePassed = new Date() > new Date(task.deadline);
+
+  return (
+    <div className="space-y-6">
+      {/* Header */}
+      <div className="flex items-start gap-4">
+        <button
+          onClick={() => navigate("/org/tasks")}
+          className="p-2 rounded-lg border border-gray-200 text-gray-500 hover:bg-gray-50 transition-colors shrink-0"
+        >
+          <MdArrowBack />
+        </button>
+        <div className="flex-1 min-w-0">
+          <h1 className="text-xl font-semibold text-gray-900 truncate">{task.title}</h1>
+          <div className="flex flex-wrap items-center gap-2 mt-2">
+            <StatusBadge status={task.status} />
+            <PriorityBadge priority={task.priority} />
+            {deadlinePassed && (
+              <span className="text-xs text-red-500 font-medium">Deadline passed</span>
+            )}
+          </div>
+        </div>
+        <div className="flex gap-2 shrink-0">
+          {hasPermission("EDIT_TASK") && (
+            <button
+              onClick={() => navigate(`/org/tasks/${task.id}/edit`)}
+              className="flex items-center gap-1.5 px-3 py-2 text-sm border border-gray-200 rounded-lg text-gray-600 hover:bg-gray-50 transition-colors"
+            >
+              <MdEdit className="text-base" /> Edit
+            </button>
+          )}
+          {hasPermission("DELETE_TASK") && (
+            <button
+              onClick={() => setShowDelete(true)}
+              className="flex items-center gap-1.5 px-3 py-2 text-sm border border-red-200 rounded-lg text-red-500 hover:bg-red-50 transition-colors"
+            >
+              <MdDelete className="text-base" /> Delete
+            </button>
+          )}
+        </div>
+      </div>
+
+      <div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
+        {/* Left: Task info */}
+        <div className="lg:col-span-2 space-y-6">
+          {/* Description */}
+          <div className="bg-white rounded-xl border border-gray-100 p-5">
+            <h2 className="text-sm font-semibold text-gray-700 mb-3">Description</h2>
+            <p className="text-sm text-gray-600 leading-relaxed">{task.description}</p>
+            {task.tags && task.tags.length > 0 && (
+              <div className="flex gap-1.5 mt-4 flex-wrap">
+                {task.tags.map((tag) => (
+                  <span key={tag} className="text-xs bg-gray-100 text-gray-500 px-2 py-0.5 rounded-full">
+                    {tag}
+                  </span>
+                ))}
+              </div>
+            )}
+          </div>
+
+          {/* Submission */}
+          <div className="bg-white rounded-xl border border-gray-100 p-5">
+            <SubmissionForm
+              taskId={task.id}
+              deadline={task.deadline}
+              submissions={submissions}
+              onSubmit={(content) => onAddSubmission(task.id, content)}
+            />
+          </div>
+
+          {/* Review panel */}
+          {hasPermission("UPDATE_STATUS") && submissions.filter((s) => s.status === "pending").length > 0 && (
+            <div className="bg-white rounded-xl border border-gray-100 p-5">
+              <h3 className="text-sm font-semibold text-gray-700 mb-3">Review Submissions</h3>
+              <div className="space-y-3">
+                {submissions
+                  .filter((s) => s.status === "pending")
+                  .map((sub) => (
+                    <div key={sub.id} className="border border-gray-100 rounded-lg p-3 space-y-2">
+                      <div className="flex items-center justify-between">
+                        <span className="text-sm font-medium text-gray-700">{sub.submittedByName}</span>
+                        <span className="text-xs text-gray-400">
+                          {new Date(sub.submittedAt).toLocaleDateString("en-IN")}
+                        </span>
+                      </div>
+                      <p className="text-sm text-gray-600">{sub.content}</p>
+                      {reviewTarget === sub.id ? (
+                        <div className="space-y-2">
+                          <input
+                            type="text"
+                            value={reviewNote}
+                            onChange={(e) => setReviewNote(e.target.value)}
+                            placeholder="Review note (optional)"
+                            className="w-full text-sm border border-gray-200 rounded-lg px-3 py-1.5 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30"
+                          />
+                          <div className="flex gap-2">
+                            <button
+                              onClick={() => {
+                                onReview(sub.id, "approved", reviewNote);
+                                setReviewTarget(null);
+                                setReviewNote("");
+                              }}
+                              className="px-3 py-1.5 text-xs font-medium bg-green-500 text-white rounded-lg hover:bg-green-600 transition-colors"
+                            >
+                              Approve
+                            </button>
+                            <button
+                              onClick={() => {
+                                onReview(sub.id, "rejected", reviewNote);
+                                setReviewTarget(null);
+                                setReviewNote("");
+                              }}
+                              className="px-3 py-1.5 text-xs font-medium bg-red-500 text-white rounded-lg hover:bg-red-600 transition-colors"
+                            >
+                              Reject
+                            </button>
+                            <button
+                              onClick={() => setReviewTarget(null)}
+                              className="px-3 py-1.5 text-xs text-gray-500 hover:text-gray-700 transition-colors"
+                            >
+                              Cancel
+                            </button>
+                          </div>
+                        </div>
+                      ) : (
+                        <button
+                          onClick={() => setReviewTarget(sub.id)}
+                          className="text-xs text-[#306ee8] hover:underline"
+                        >
+                          Review
+                        </button>
+                      )}
+                    </div>
+                  ))}
+              </div>
+            </div>
+          )}
+
+          {/* Comments */}
+          <div className="bg-white rounded-xl border border-gray-100 p-5">
+            <CommentSection
+              comments={comments}
+              onAddComment={(content) => onAddComment(task.id, content)}
+            />
+          </div>
+        </div>
+
+        {/* Right: Meta */}
+        <div className="space-y-4">
+          <div className="bg-white rounded-xl border border-gray-100 p-5 space-y-4">
+            <h2 className="text-sm font-semibold text-gray-700">Details</h2>
+
+            <div className="space-y-3 text-sm">
+              <div className="flex justify-between">
+                <span className="text-gray-500">Assigned To</span>
+                <span className="font-medium text-gray-700">{task.assignedToName}</span>
+              </div>
+              <div className="flex justify-between">
+                <span className="text-gray-500">Deadline</span>
+                <span className={`font-medium ${deadlinePassed ? "text-red-500" : "text-gray-700"}`}>
+                  {new Date(task.deadline).toLocaleDateString("en-IN", {
+                    day: "numeric",
+                    month: "short",
+                    year: "numeric",
+                  })}
+                </span>
+              </div>
+              <div className="flex justify-between">
+                <span className="text-gray-500">Created</span>
+                <span className="text-gray-700">
+                  {new Date(task.createdAt).toLocaleDateString("en-IN", {
+                    day: "numeric",
+                    month: "short",
+                  })}
+                </span>
+              </div>
+            </div>
+
+            {/* Status update */}
+            {hasPermission("UPDATE_STATUS") && (
+              <div className="pt-3 border-t border-gray-100">
+                <label className="block text-xs font-medium text-gray-600 mb-1.5">
+                  Update Status
+                </label>
+                <select
+                  value={task.status}
+                  onChange={(e) => onStatusChange(task.id, e.target.value as TaskStatus)}
+                  className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+                >
+                  {STATUS_OPTIONS.map((s) => (
+                    <option key={s} value={s} className="capitalize">{s}</option>
+                  ))}
+                </select>
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+
+      {showDelete && (
+        <ConfirmModal
+          title="Delete Task"
+          message="This action cannot be undone. Are you sure?"
+          confirmLabel="Delete"
+          onConfirm={() => {
+            onDelete(task.id);
+            navigate("/org/tasks");
+          }}
+          onCancel={() => setShowDelete(false)}
+        />
+      )}
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/components/task/TaskForm.tsx b/src/features/MemberTask/components/task/TaskForm.tsx
new file mode 100644
index 0000000..f14cdae
--- /dev/null
+++ b/src/features/MemberTask/components/task/TaskForm.tsx
@@ -0,0 +1,150 @@
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import type { Task, TaskFormData, TaskPriority } from "../../types/task.types";
+import { mockEvents, mockMembers } from "../../mock/taskMock";
+
+interface Props {
+  initial?: Task;
+  onSubmit: (data: TaskFormData) => void;
+  onCancel: () => void;
+  isSubmitting?: boolean;
+}
+
+export default function TaskForm({ initial, onSubmit, onCancel, isSubmitting }: Props) {
+  const {
+    register,
+    handleSubmit,
+    reset,
+    formState: { errors },
+  } = useForm<TaskFormData>();
+
+  useEffect(() => {
+    if (initial) {
+      reset({
+        title: initial.title,
+        description: initial.description,
+        priority: initial.priority,
+        eventId: initial.eventId,
+        assignedTo: initial.assignedTo,
+        deadline: initial.deadline,
+        tags: initial.tags?.join(", "),
+      });
+    }
+  }, [initial, reset]);
+
+  const priorities: TaskPriority[] = ["low", "medium", "high", "urgent"];
+
+  return (
+    <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
+      <div>
+        <label className="block text-xs font-medium text-gray-600 mb-1">Title *</label>
+        <input
+          {...register("title", { required: "Title is required" })}
+          className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          placeholder="Task title"
+        />
+        {errors.title && <p className="text-xs text-red-500 mt-1">{errors.title.message}</p>}
+      </div>
+
+      <div>
+        <label className="block text-xs font-medium text-gray-600 mb-1">Description *</label>
+        <textarea
+          {...register("description", { required: "Description is required" })}
+          rows={3}
+          className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 resize-none focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          placeholder="Describe the task..."
+        />
+        {errors.description && (
+          <p className="text-xs text-red-500 mt-1">{errors.description.message}</p>
+        )}
+      </div>
+
+      <div className="grid grid-cols-2 gap-4">
+        <div>
+          <label className="block text-xs font-medium text-gray-600 mb-1">Event *</label>
+          <select
+            {...register("eventId", { required: "Event is required" })}
+            className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          >
+            <option value="">Select event</option>
+            {mockEvents.map((e) => (
+              <option key={e.id} value={e.id}>{e.name}</option>
+            ))}
+          </select>
+          {errors.eventId && <p className="text-xs text-red-500 mt-1">{errors.eventId.message}</p>}
+        </div>
+
+        <div>
+          <label className="block text-xs font-medium text-gray-600 mb-1">Priority *</label>
+          <select
+            {...register("priority", { required: true })}
+            className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          >
+            <option value="">Select priority</option>
+            {priorities.map((p) => (
+              <option key={p} value={p} className="capitalize">{p}</option>
+            ))}
+          </select>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-2 gap-4">
+        <div>
+          <label className="block text-xs font-medium text-gray-600 mb-1">Assign To *</label>
+          <select
+            {...register("assignedTo", { required: "Assignee is required" })}
+            className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          >
+            <option value="">Select member</option>
+            {mockMembers.map((m) => (
+              <option key={m.id} value={m.id}>{m.name}</option>
+            ))}
+          </select>
+          {errors.assignedTo && (
+            <p className="text-xs text-red-500 mt-1">{errors.assignedTo.message}</p>
+          )}
+        </div>
+
+        <div>
+          <label className="block text-xs font-medium text-gray-600 mb-1">Deadline *</label>
+          <input
+            type="date"
+            {...register("deadline", { required: "Deadline is required" })}
+            className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          />
+          {errors.deadline && (
+            <p className="text-xs text-red-500 mt-1">{errors.deadline.message}</p>
+          )}
+        </div>
+      </div>
+
+      <div>
+        <label className="block text-xs font-medium text-gray-600 mb-1">
+          Tags <span className="text-gray-400">(comma separated)</span>
+        </label>
+        <input
+          {...register("tags")}
+          className="w-full text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          placeholder="frontend, design, api"
+        />
+      </div>
+
+      <div className="flex gap-3 pt-2">
+        <button
+          type="button"
+          onClick={onCancel}
+          className="flex-1 py-2 text-sm border border-gray-200 rounded-lg text-gray-600 hover:bg-gray-50 transition-colors"
+        >
+          Cancel
+        </button>
+        <button
+          type="submit"
+          disabled={isSubmitting}
+          className="flex-1 py-2 text-sm font-medium bg-[#306ee8] text-white rounded-lg hover:bg-[#2558c9] disabled:opacity-50 transition-colors"
+        >
+          {isSubmitting ? "Saving..." : initial ? "Update Task" : "Create Task"}
+        </button>
+      </div>
+    </form>
+  );
+}
diff --git a/src/features/MemberTask/components/task/TaskTable.tsx b/src/features/MemberTask/components/task/TaskTable.tsx
new file mode 100644
index 0000000..daf8656
--- /dev/null
+++ b/src/features/MemberTask/components/task/TaskTable.tsx
@@ -0,0 +1,204 @@
+import { useState, useMemo } from "react";
+import { useNavigate } from "react-router-dom";
+import { MdSearch, MdAdd, MdEdit, MdDelete, MdVisibility } from "react-icons/md";
+import type { Task, TaskStatus, TaskPriority } from "../../types/task.types";
+import { usePermissions } from "../../context/PermissionContext";
+import StatusBadge from "../common/StatusBadge";
+import PriorityBadge from "../common/PriorityBadge";
+import ConfirmModal from "../common/ConfirmModal";
+import SkeletonLoader from "../common/SkeletonLoader";
+
+interface Props {
+  tasks: Task[];
+  isLoading?: boolean;
+  onDelete: (id: string) => void;
+}
+
+const STATUS_OPTIONS: { value: TaskStatus | "all"; label: string }[] = [
+  { value: "all", label: "All Status" },
+  { value: "todo", label: "To Do" },
+  { value: "in-progress", label: "In Progress" },
+  { value: "review", label: "In Review" },
+  { value: "completed", label: "Completed" },
+];
+
+const PRIORITY_OPTIONS: { value: TaskPriority | "all"; label: string }[] = [
+  { value: "all", label: "All Priority" },
+  { value: "urgent", label: "Urgent" },
+  { value: "high", label: "High" },
+  { value: "medium", label: "Medium" },
+  { value: "low", label: "Low" },
+];
+
+export default function TaskTable({ tasks, isLoading, onDelete }: Props) {
+  const navigate = useNavigate();
+  const { hasPermission } = usePermissions();
+
+  const [search, setSearch] = useState("");
+  const [statusFilter, setStatusFilter] = useState<TaskStatus | "all">("all");
+  const [priorityFilter, setPriorityFilter] = useState<TaskPriority | "all">("all");
+  const [deleteTarget, setDeleteTarget] = useState<string | null>(null);
+
+  const filtered = useMemo(() => {
+    return tasks.filter((t) => {
+      const matchSearch =
+        !search || t.title.toLowerCase().includes(search.toLowerCase());
+      const matchStatus = statusFilter === "all" || t.status === statusFilter;
+      const matchPriority = priorityFilter === "all" || t.priority === priorityFilter;
+      return matchSearch && matchStatus && matchPriority;
+    });
+  }, [tasks, search, statusFilter, priorityFilter]);
+
+  if (isLoading) return <SkeletonLoader rows={6} />;
+
+  return (
+    <div className="space-y-4">
+      {/* Toolbar */}
+      <div className="flex flex-wrap items-center gap-3">
+        <div className="relative flex-1 min-w-[180px]">
+          <MdSearch className="absolute left-3 top-1/2 -translate-y-1/2 text-gray-400 text-lg" />
+          <input
+            type="text"
+            placeholder="Search tasks..."
+            value={search}
+            onChange={(e) => setSearch(e.target.value)}
+            className="w-full pl-9 pr-4 py-2 text-sm border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+          />
+        </div>
+
+        <select
+          value={statusFilter}
+          onChange={(e) => setStatusFilter(e.target.value as TaskStatus | "all")}
+          className="text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+        >
+          {STATUS_OPTIONS.map((o) => (
+            <option key={o.value} value={o.value}>{o.label}</option>
+          ))}
+        </select>
+
+        <select
+          value={priorityFilter}
+          onChange={(e) => setPriorityFilter(e.target.value as TaskPriority | "all")}
+          className="text-sm border border-gray-200 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-[#306ee8]/30 focus:border-[#306ee8]"
+        >
+          {PRIORITY_OPTIONS.map((o) => (
+            <option key={o.value} value={o.value}>{o.label}</option>
+          ))}
+        </select>
+
+        {hasPermission("CREATE_TASK") && (
+          <button
+            onClick={() => navigate("/org/tasks/create")}
+            className="flex items-center gap-1.5 px-4 py-2 text-sm font-medium bg-[#306ee8] text-white rounded-lg hover:bg-[#2558c9] transition-colors ml-auto"
+          >
+            <MdAdd className="text-base" />
+            New Task
+          </button>
+        )}
+      </div>
+
+      {/* Table */}
+      {filtered.length === 0 ? (
+        <div className="text-center py-16 text-gray-400 text-sm">
+          No tasks found.
+        </div>
+      ) : (
+        <div className="bg-white rounded-xl border border-gray-100 overflow-hidden">
+          <div className="overflow-x-auto">
+            <table className="w-full text-sm">
+              <thead>
+                <tr className="border-b border-gray-100 bg-gray-50/60">
+                  <th className="text-left px-4 py-3 font-medium text-gray-500">Task</th>
+                  <th className="text-left px-4 py-3 font-medium text-gray-500">Status</th>
+                  <th className="text-left px-4 py-3 font-medium text-gray-500">Priority</th>
+                  <th className="text-left px-4 py-3 font-medium text-gray-500">Assigned To</th>
+                  <th className="text-left px-4 py-3 font-medium text-gray-500">Deadline</th>
+                  <th className="text-right px-4 py-3 font-medium text-gray-500">Actions</th>
+                </tr>
+              </thead>
+              <tbody className="divide-y divide-gray-50">
+                {filtered.map((task) => (
+                  <tr
+                    key={task.id}
+                    className={`hover:bg-gray-50/50 transition-colors ${
+                      task.priority === "urgent" ? "border-l-2 border-l-red-400" : ""
+                    }`}
+                  >
+                    <td className="px-4 py-3">
+                      <div className="font-medium text-gray-800">{task.title}</div>
+                      {task.tags && task.tags.length > 0 && (
+                        <div className="flex gap-1 mt-1 flex-wrap">
+                          {task.tags.map((tag) => (
+                            <span key={tag} className="text-xs bg-gray-100 text-gray-500 px-1.5 py-0.5 rounded">
+                              {tag}
+                            </span>
+                          ))}
+                        </div>
+                      )}
+                    </td>
+                    <td className="px-4 py-3">
+                      <StatusBadge status={task.status} />
+                    </td>
+                    <td className="px-4 py-3">
+                      <PriorityBadge priority={task.priority} />
+                    </td>
+                    <td className="px-4 py-3 text-gray-600">{task.assignedToName}</td>
+                    <td className="px-4 py-3 text-gray-500">
+                      {new Date(task.deadline).toLocaleDateString("en-IN", {
+                        day: "numeric",
+                        month: "short",
+                        year: "numeric",
+                      })}
+                    </td>
+                    <td className="px-4 py-3">
+                      <div className="flex items-center gap-1 justify-end">
+                        <button
+                          onClick={() => navigate(`/org/tasks/${task.id}`)}
+                          className="p-1.5 rounded-lg text-gray-400 hover:text-[#306ee8] hover:bg-blue-50 transition-colors"
+                          title="View"
+                        >
+                          <MdVisibility />
+                        </button>
+                        {hasPermission("EDIT_TASK") && (
+                          <button
+                            onClick={() => navigate(`/org/tasks/${task.id}/edit`)}
+                            className="p-1.5 rounded-lg text-gray-400 hover:text-orange-500 hover:bg-orange-50 transition-colors"
+                            title="Edit"
+                          >
+                            <MdEdit />
+                          </button>
+                        )}
+                        {hasPermission("DELETE_TASK") && (
+                          <button
+                            onClick={() => setDeleteTarget(task.id)}
+                            className="p-1.5 rounded-lg text-gray-400 hover:text-red-500 hover:bg-red-50 transition-colors"
+                            title="Delete"
+                          >
+                            <MdDelete />
+                          </button>
+                        )}
+                      </div>
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+          </div>
+        </div>
+      )}
+
+      {deleteTarget && (
+        <ConfirmModal
+          title="Delete Task"
+          message="This action cannot be undone. Are you sure you want to delete this task?"
+          confirmLabel="Delete"
+          onConfirm={() => {
+            onDelete(deleteTarget);
+            setDeleteTarget(null);
+          }}
+          onCancel={() => setDeleteTarget(null)}
+        />
+      )}
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/context/PermissionContext.tsx b/src/features/MemberTask/context/PermissionContext.tsx
new file mode 100644
index 0000000..54db081
--- /dev/null
+++ b/src/features/MemberTask/context/PermissionContext.tsx
@@ -0,0 +1,58 @@
+import { createContext, useContext, useState } from "react";
+import type { Permission } from "../types/task.types";
+
+interface PermissionContextValue {
+  permissions: Permission[];
+  currentUserId: string;
+  currentUserName: string;
+  hasPermission: (p: Permission) => boolean;
+  grantPermission: (p: Permission) => void;
+  revokePermission: (p: Permission) => void;
+}
+
+const PermissionContext = createContext<PermissionContextValue | null>(null);
+
+// Default: member with organizer-level permissions for demo
+const DEFAULT_PERMISSIONS: Permission[] = [
+  "CREATE_TASK",
+  "ASSIGN_TASK",
+  "UPDATE_STATUS",
+  "EDIT_TASK",
+  "DELETE_TASK",
+  "MULTIPLE_SUBMISSION",
+  "LATE_SUBMISSION",
+  "VIEW_ALL_TASKS",
+];
+
+export function PermissionProvider({ children }: { children: React.ReactNode }) {
+  const [permissions, setPermissions] = useState<Permission[]>(DEFAULT_PERMISSIONS);
+
+  const hasPermission = (p: Permission) => permissions.includes(p);
+
+  const grantPermission = (p: Permission) =>
+    setPermissions((prev) => (prev.includes(p) ? prev : [...prev, p]));
+
+  const revokePermission = (p: Permission) =>
+    setPermissions((prev) => prev.filter((x) => x !== p));
+
+  return (
+    <PermissionContext.Provider
+      value={{
+        permissions,
+        currentUserId: "user-1",
+        currentUserName: "Arjun Mehta",
+        hasPermission,
+        grantPermission,
+        revokePermission,
+      }}
+    >
+      {children}
+    </PermissionContext.Provider>
+  );
+}
+
+export function usePermissions() {
+  const ctx = useContext(PermissionContext);
+  if (!ctx) throw new Error("usePermissions must be used within PermissionProvider");
+  return ctx;
+}
diff --git a/src/features/MemberTask/mock/taskMock.ts b/src/features/MemberTask/mock/taskMock.ts
new file mode 100644
index 0000000..1b3c257
--- /dev/null
+++ b/src/features/MemberTask/mock/taskMock.ts
@@ -0,0 +1,128 @@
+import type { Event, Task, Submission, Comment } from "../types/task.types";
+
+export const mockEvents: Event[] = [
+  { id: "evt-1", name: "HackFest 2026" },
+  { id: "evt-2", name: "Spring Bootcamp" },
+  { id: "evt-3", name: "Open Source Day" },
+];
+
+export const mockTasks: Task[] = [
+  {
+    id: "task-1",
+    title: "Build Landing Page",
+    description: "Design and implement the event landing page with responsive layout.",
+    status: "in-progress",
+    priority: "high",
+    eventId: "evt-1",
+    assignedTo: "user-1",
+    assignedToName: "Arjun Mehta",
+    createdBy: "user-2",
+    deadline: "2026-08-10",
+    createdAt: "2026-07-01",
+    tags: ["frontend", "design"],
+  },
+  {
+    id: "task-2",
+    title: "Fix Auth Bug",
+    description: "Resolve the JWT token expiry issue causing silent logouts.",
+    status: "todo",
+    priority: "urgent",
+    eventId: "evt-1",
+    assignedTo: "user-1",
+    assignedToName: "Arjun Mehta",
+    createdBy: "user-2",
+    deadline: "2026-08-05",
+    createdAt: "2026-07-02",
+    tags: ["backend", "auth"],
+  },
+  {
+    id: "task-3",
+    title: "Design System Setup",
+    description: "Establish component library and token system for the hackathon UI.",
+    status: "completed",
+    priority: "medium",
+    eventId: "evt-1",
+    assignedTo: "user-3",
+    assignedToName: "Priya Sharma",
+    createdBy: "user-1",
+    deadline: "2026-07-20",
+    createdAt: "2026-07-01",
+    tags: ["design"],
+  },
+  {
+    id: "task-4",
+    title: "API Integration",
+    description: "Connect frontend to backend REST APIs for participant data.",
+    status: "review",
+    priority: "high",
+    eventId: "evt-2",
+    assignedTo: "user-1",
+    assignedToName: "Arjun Mehta",
+    createdBy: "user-2",
+    deadline: "2026-08-15",
+    createdAt: "2026-07-05",
+    tags: ["backend", "api"],
+  },
+  {
+    id: "task-5",
+    title: "Write Documentation",
+    description: "Document all API endpoints and component usage.",
+    status: "todo",
+    priority: "low",
+    eventId: "evt-2",
+    assignedTo: "user-3",
+    assignedToName: "Priya Sharma",
+    createdBy: "user-1",
+    deadline: "2026-08-20",
+    createdAt: "2026-07-06",
+    tags: ["docs"],
+  },
+];
+
+export const mockSubmissions: Submission[] = [
+  {
+    id: "sub-1",
+    taskId: "task-1",
+    submittedBy: "user-1",
+    submittedByName: "Arjun Mehta",
+    content: "Completed the landing page. Deployed at staging URL.",
+    submittedAt: "2026-08-08T10:30:00Z",
+    status: "pending",
+  },
+  {
+    id: "sub-2",
+    taskId: "task-4",
+    submittedBy: "user-1",
+    submittedByName: "Arjun Mehta",
+    content: "All endpoints integrated. Tests passing.",
+    submittedAt: "2026-08-12T14:00:00Z",
+    status: "approved",
+    reviewNote: "Great work! Clean implementation.",
+  },
+];
+
+export const mockComments: Comment[] = [
+  {
+    id: "cmt-1",
+    taskId: "task-1",
+    authorId: "user-2",
+    authorName: "Rahul Verma",
+    content: "Please make sure the mobile breakpoints are tested.",
+    createdAt: "2026-08-07T09:00:00Z",
+  },
+  {
+    id: "cmt-2",
+    taskId: "task-1",
+    authorId: "user-1",
+    authorName: "Arjun Mehta",
+    content: "Done, tested on 375px and 768px.",
+    createdAt: "2026-08-07T11:00:00Z",
+  },
+];
+
+export const mockMembers = [
+  { id: "user-1", name: "Arjun Mehta" },
+  { id: "user-2", name: "Rahul Verma" },
+  { id: "user-3", name: "Priya Sharma" },
+  { id: "user-4", name: "Sneha Patel" },
+];
diff --git a/src/features/MemberTask/pages/CreateTaskPage.tsx b/src/features/MemberTask/pages/CreateTaskPage.tsx
new file mode 100644
index 0000000..5fba1c2
--- /dev/null
+++ b/src/features/MemberTask/pages/CreateTaskPage.tsx
@@ -0,0 +1,60 @@
+import { useState } from "react";
+import { useNavigate, Navigate } from "react-router-dom";
+import { MdAddTask } from "react-icons/md";
+import { usePermissions } from "../context/PermissionContext";
+import { mockMembers } from "../mock/taskMock";
+import TaskForm from "../components/task/TaskForm";
+import type { TaskFormData } from "../types/task.types";
+
+export default function CreateTaskPage() {
+  const navigate = useNavigate();
+  const { hasPermission, currentUserId } = usePermissions();
+  const [isSubmitting, setIsSubmitting] = useState(false);
+
+  if (!hasPermission("CREATE_TASK")) {
+    return <Navigate to="/org/tasks" replace />;
+  }
+
+  const handleSubmit = (data: TaskFormData) => {
+    setIsSubmitting(true);
+    // Simulate async save
+    setTimeout(() => {
+      console.log("New task:", {
+        ...data,
+        id: `task-${Date.now()}`,
+        status: "todo",
+        createdBy: currentUserId,
+        createdAt: new Date().toISOString().split("T")[0],
+        assignedToName:
+          mockMembers.find((m) => m.id === data.assignedTo)?.name ?? data.assignedTo,
+        tags: data.tags ? data.tags.split(",").map((t) => t.trim()).filter(Boolean) : [],
+      });
+      setIsSubmitting(false);
+      navigate("/org/tasks");
+    }, 600);
+  };
+
+  return (
+    <div className="flex-1 p-6 min-w-0">
+      <div className="max-w-2xl mx-auto">
+        <div className="flex items-center gap-3 mb-6">
+          <div className="w-9 h-9 rounded-xl bg-[#306ee8]/10 flex items-center justify-center">
+            <MdAddTask className="text-[#306ee8] text-xl" />
+          </div>
+          <div>
+            <h1 className="text-lg font-semibold text-gray-900">Create Task</h1>
+            <p className="text-xs text-gray-400">Add a new task to an event</p>
+          </div>
+        </div>
+
+        <div className="bg-white rounded-xl border border-gray-100 p-6">
+          <TaskForm
+            onSubmit={handleSubmit}
+            onCancel={() => navigate("/org/tasks")}
+            isSubmitting={isSubmitting}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/pages/EditTaskPage.tsx b/src/features/MemberTask/pages/EditTaskPage.tsx
new file mode 100644
index 0000000..c02b000
--- /dev/null
+++ b/src/features/MemberTask/pages/EditTaskPage.tsx
@@ -0,0 +1,61 @@
+import { useState } from "react";
+import { useNavigate, useParams, Navigate } from "react-router-dom";
+import { MdEdit } from "react-icons/md";
+import { usePermissions } from "../context/PermissionContext";
+import { mockTasks, mockMembers } from "../mock/taskMock";
+import TaskForm from "../components/task/TaskForm";
+import type { TaskFormData } from "../types/task.types";
+
+export default function EditTaskPage() {
+  const { taskId } = useParams<{ taskId: string }>();
+  const navigate = useNavigate();
+  const { hasPermission } = usePermissions();
+  const [isSubmitting, setIsSubmitting] = useState(false);
+
+  if (!hasPermission("EDIT_TASK")) {
+    return <Navigate to="/org/tasks" replace />;
+  }
+
+  const task = mockTasks.find((t) => t.id === taskId);
+  if (!task) return <Navigate to="/org/tasks" replace />;
+
+  const handleSubmit = (data: TaskFormData) => {
+    setIsSubmitting(true);
+    setTimeout(() => {
+      console.log("Updated task:", {
+        ...task,
+        ...data,
+        assignedToName:
+          mockMembers.find((m) => m.id === data.assignedTo)?.name ?? data.assignedTo,
+        tags: data.tags ? data.tags.split(",").map((t) => t.trim()).filter(Boolean) : [],
+      });
+      setIsSubmitting(false);
+      navigate(`/org/tasks/${taskId}`);
+    }, 600);
+  };
+
+  return (
+    <div className="flex-1 p-6 min-w-0">
+      <div className="max-w-2xl mx-auto">
+        <div className="flex items-center gap-3 mb-6">
+          <div className="w-9 h-9 rounded-xl bg-orange-50 flex items-center justify-center">
+            <MdEdit className="text-orange-500 text-xl" />
+          </div>
+          <div>
+            <h1 className="text-lg font-semibold text-gray-900">Edit Task</h1>
+            <p className="text-xs text-gray-400 truncate max-w-xs">{task.title}</p>
+          </div>
+        </div>
+
+        <div className="bg-white rounded-xl border border-gray-100 p-6">
+          <TaskForm
+            initial={task}
+            onSubmit={handleSubmit}
+            onCancel={() => navigate(`/org/tasks/${taskId}`)}
+            isSubmitting={isSubmitting}
+          />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/pages/TaskDetailPage.tsx b/src/features/MemberTask/pages/TaskDetailPage.tsx
new file mode 100644
index 0000000..5e9373e
--- /dev/null
+++ b/src/features/MemberTask/pages/TaskDetailPage.tsx
@@ -0,0 +1,81 @@
+import { useState } from "react";
+import { useParams, Navigate } from "react-router-dom";
+import { mockTasks, mockSubmissions, mockComments } from "../mock/taskMock";
+import { usePermissions } from "../context/PermissionContext";
+import TaskDetail from "../components/task/TaskDetail";
+import type { Task, Submission, Comment, TaskStatus } from "../types/task.types";
+
+export default function TaskDetailPage() {
+  const { taskId } = useParams<{ taskId: string }>();
+  const { currentUserId, currentUserName } = usePermissions();
+
+  const [tasks, setTasks] = useState<Task[]>(mockTasks);
+  const [submissions, setSubmissions] = useState<Submission[]>(mockSubmissions);
+  const [comments, setComments] = useState<Comment[]>(mockComments);
+
+  const task = tasks.find((t) => t.id === taskId);
+  if (!task) return <Navigate to="/org/tasks" replace />;
+
+  const taskSubmissions = submissions.filter((s) => s.taskId === taskId);
+  const taskComments = comments.filter((c) => c.taskId === taskId);
+
+  const handleDelete = (id: string) => {
+    setTasks((prev) => prev.filter((t) => t.id !== id));
+  };
+
+  const handleStatusChange = (id: string, status: TaskStatus) => {
+    setTasks((prev) => prev.map((t) => (t.id === id ? { ...t, status } : t)));
+  };
+
+  const handleAddSubmission = (_taskId: string, content: string) => {
+    const newSub: Submission = {
+      id: `sub-${Date.now()}`,
+      taskId: _taskId,
+      submittedBy: currentUserId,
+      submittedByName: currentUserName,
+      content,
+      submittedAt: new Date().toISOString(),
+      status: "pending",
+    };
+    setSubmissions((prev) => [...prev, newSub]);
+  };
+
+  const handleAddComment = (_taskId: string, content: string) => {
+    const newComment: Comment = {
+      id: `cmt-${Date.now()}`,
+      taskId: _taskId,
+      authorId: currentUserId,
+      authorName: currentUserName,
+      content,
+      createdAt: new Date().toISOString(),
+    };
+    setComments((prev) => [...prev, newComment]);
+  };
+
+  const handleReview = (
+    submissionId: string,
+    status: "approved" | "rejected",
+    note: string
+  ) => {
+    setSubmissions((prev) =>
+      prev.map((s) =>
+        s.id === submissionId ? { ...s, status, reviewNote: note } : s
+      )
+    );
+  };
+
+  return (
+    <div className="flex-1 p-6 min-w-0">
+      <TaskDetail
+        task={task}
+        submissions={taskSubmissions}
+        comments={taskComments}
+        onDelete={handleDelete}
+        onStatusChange={handleStatusChange}
+        onAddSubmission={handleAddSubmission}
+        onAddComment={handleAddComment}
+        onReview={handleReview}
+      />
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/pages/TaskListPage.tsx b/src/features/MemberTask/pages/TaskListPage.tsx
new file mode 100644
index 0000000..cfbfd14
--- /dev/null
+++ b/src/features/MemberTask/pages/TaskListPage.tsx
@@ -0,0 +1,55 @@
+import { useState } from "react";
+import { MdAssignment } from "react-icons/md";
+import { usePermissions } from "../context/PermissionContext";
+import { mockEvents, mockTasks } from "../mock/taskMock";
+import EventDropdown from "../components/event/EventDropdown";
+import TaskTable from "../components/task/TaskTable";
+import type { Task } from "../types/task.types";
+
+export default function TaskListPage() {
+  const { hasPermission, currentUserId } = usePermissions();
+  const [selectedEventId, setSelectedEventId] = useState<string>(mockEvents[0].id);
+  const [tasks, setTasks] = useState<Task[]>(mockTasks);
+
+  const visibleTasks = tasks.filter((t) => {
+    const inEvent = t.eventId === selectedEventId;
+    if (!inEvent) return false;
+    return hasPermission("VIEW_ALL_TASKS") || t.assignedTo === currentUserId;
+  });
+
+  const handleDelete = (id: string) => {
+    setTasks((prev) => prev.filter((t) => t.id !== id));
+  };
+
+  return (
+    <div className="flex-1 p-6 space-y-6 min-w-0">
+      {/* Page header */}
+      <div className="flex flex-wrap items-center justify-between gap-4">
+        <div className="flex items-center gap-3">
+          <div className="w-9 h-9 rounded-xl bg-[#306ee8]/10 flex items-center justify-center">
+            <MdAssignment className="text-[#306ee8] text-xl" />
+          </div>
+          <div>
+            <h1 className="text-lg font-semibold text-gray-900">Tasks</h1>
+            <p className="text-xs text-gray-400">
+              {hasPermission("VIEW_ALL_TASKS") ? "All event tasks" : "Your assigned tasks"}
+            </p>
+          </div>
+        </div>
+        <EventDropdown
+          events={mockEvents}
+          selectedEventId={selectedEventId}
+          onChange={setSelectedEventId}
+        />
+      </div>
+
+      {!selectedEventId ? (
+        <div className="text-center py-20 text-gray-400 text-sm">
+          Select an event to view tasks.
+        </div>
+      ) : (
+        <TaskTable tasks={visibleTasks} onDelete={handleDelete} />
+      )}
+    </div>
+  );
+}
diff --git a/src/features/MemberTask/types/task.types.ts b/src/features/MemberTask/types/task.types.ts
new file mode 100644
index 0000000..425028f
--- /dev/null
+++ b/src/features/MemberTask/types/task.types.ts
@@ -0,0 +1,63 @@
+export type Permission =
+  | "CREATE_TASK"
+  | "ASSIGN_TASK"
+  | "UPDATE_STATUS"
+  | "EDIT_TASK"
+  | "DELETE_TASK"
+  | "MULTIPLE_SUBMISSION"
+  | "LATE_SUBMISSION"
+  | "VIEW_ALL_TASKS";
+
+export type TaskStatus = "todo" | "in-progress" | "completed" | "review";
+export type TaskPriority = "low" | "medium" | "high" | "urgent";
+
+export interface Task {
+  id: string;
+  title: string;
+  description: string;
+  status: TaskStatus;
+  priority: TaskPriority;
+  eventId: string;
+  assignedTo: string;
+  assignedToName: string;
+  createdBy: string;
+  deadline: string;
+  createdAt: string;
+  tags?: string[];
+}
+
+export interface Submission {
+  id: string;
+  taskId: string;
+  submittedBy: string;
+  submittedByName: string;
+  content: string;
+  fileUrl?: string;
+  submittedAt: string;
+  status: "pending" | "approved" | "rejected";
+  reviewNote?: string;
+}
+
+export interface Comment {
+  id: string;
+  taskId: string;
+  authorId: string;
+  authorName: string;
+  content: string;
+  createdAt: string;
+}
+
+export interface Event {
+  id: string;
+  name: string;
+}
+
+export interface TaskFormData {
+  title: string;
+  description: string;
+  priority: TaskPriority;
+  eventId: string;
+  assignedTo: string;
+  deadline: string;
+  tags?: string;
+}
diff --git a/src/features/ProjectDetail/components/Attachments.tsx b/src/features/ProjectDetail/components/Attachments.tsx
new file mode 100644
index 0000000..e6d32c3
--- /dev/null
+++ b/src/features/ProjectDetail/components/Attachments.tsx
@@ -0,0 +1,41 @@
+import { Project } from "../types";
+import { Paperclip, FileText, Image as ImageIcon, Link as LinkIcon } from "lucide-react";
+
+export function Attachments({ project }: { project: Project }) {
+  if (project.attachments.length === 0) return null;
+
+  const getIcon = (type: string) => {
+    switch (type) {
+      case "document": return <FileText className="w-5 h-5 text-blue-400" />;
+      case "image": return <ImageIcon className="w-5 h-5 text-purple-400" />;
+      case "link": return <LinkIcon className="w-5 h-5 text-green-400" />;
+      default: return <Paperclip className="w-5 h-5 text-slate-400" />;
+    }
+  };
+
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+      <h2 className="text-xl font-semibold text-white">Attachments</h2>
+
+      <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
+        {project.attachments.map((att) => (
+          <a
+            key={att.id}
+            href={att.url}
+            target="_blank"
+            rel="noreferrer"
+            className="flex items-center gap-3 p-3 rounded-lg border border-slate-700 bg-slate-800/50 hover:bg-slate-700/50 transition-colors group"
+          >
+            <div className="p-2 bg-slate-800 rounded-md group-hover:bg-slate-900 transition-colors">
+              {getIcon(att.type)}
+            </div>
+            <div className="truncate">
+              <p className="text-sm font-medium text-slate-200 truncate group-hover:text-white transition-colors">{att.name}</p>
+              <p className="text-xs text-slate-400 capitalize">{att.type}</p>
+            </div>
+          </a>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/Header.tsx b/src/features/ProjectDetail/components/Header.tsx
new file mode 100644
index 0000000..f7ce42d
--- /dev/null
+++ b/src/features/ProjectDetail/components/Header.tsx
@@ -0,0 +1,59 @@
+import { Project } from "../types";
+import { Button } from "../../../shadcnComponet/ui/button";
+
+interface HeaderProps {
+  project: Project;
+  userRole: "Participant" | "Judge" | "Organizer" | "Admin";
+  onSubmit: () => void;
+  isSubmitting: boolean;
+}
+
+export function Header({ project, userRole, onSubmit, isSubmitting }: HeaderProps) {
+  const getStatusColor = (status: Project["status"]) => {
+    switch (status) {
+      case "Draft": return "bg-gray-500/20 text-gray-400 border-gray-500/30";
+      case "Submitted": return "bg-blue-500/20 text-blue-400 border-blue-500/30";
+      case "Under Review": return "bg-yellow-500/20 text-yellow-400 border-yellow-500/30";
+      case "Approved": return "bg-green-500/20 text-green-400 border-green-500/30";
+      case "Rejected": return "bg-red-500/20 text-red-400 border-red-500/30";
+      default: return "bg-gray-500/20 text-gray-400";
+    }
+  };
+
+  const isOwner = userRole === "Participant"; // Simplified
+
+  return (
+    <div className="flex flex-col md:flex-row items-start md:items-center justify-between gap-4 p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+      <div className="space-y-2">
+        <div className="flex items-center gap-3">
+          <h1 className="text-2xl md:text-3xl font-bold text-white tracking-tight">{project.title}</h1>
+          <span className={`px-2.5 py-1 text-xs font-semibold rounded-full border ${getStatusColor(project.status)}`}>
+            {project.status}
+          </span>
+        </div>
+        <div className="flex items-center gap-2 text-sm text-slate-400 font-medium">
+          <span>{project.eventName}</span>
+          <span className="w-1 h-1 rounded-full bg-slate-600"></span>
+          <span>{project.eventType}</span>
+        </div>
+      </div>
+
+      <div className="flex items-center gap-3 w-full md:w-auto">
+        {isOwner && project.status === "Draft" && (
+          <>
+            <Button variant="outline" className="w-full md:w-auto border-slate-700 text-slate-300 hover:bg-slate-800">
+              Edit Project
+            </Button>
+            <Button 
+              onClick={onSubmit} 
+              disabled={isSubmitting}
+              className="w-full md:w-auto bg-indigo-600 hover:bg-indigo-500 text-white transition-colors"
+            >
+              {isSubmitting ? "Submitting..." : "Submit Project"}
+            </Button>
+          </>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/ModerationPanel.tsx b/src/features/ProjectDetail/components/ModerationPanel.tsx
new file mode 100644
index 0000000..31bff75
--- /dev/null
+++ b/src/features/ProjectDetail/components/ModerationPanel.tsx
@@ -0,0 +1,57 @@
+import { Project } from "../types";
+import { Button } from "../../../shadcnComponet/ui/button";
+import { ShieldAlert, CheckCircle, XCircle, Trash2 } from "lucide-react";
+
+interface ModerationPanelProps {
+  project: Project;
+  onModerate: (action: "approve" | "reject") => Promise<void>;
+  onDelete: () => Promise<void>;
+  isProcessing: boolean;
+}
+
+export function ModerationPanel({ project, onModerate, onDelete, isProcessing }: ModerationPanelProps) {
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-red-950/20 border border-red-900/50 rounded-xl backdrop-blur-sm">
+      <div className="flex items-center gap-2 text-red-400">
+        <ShieldAlert className="w-5 h-5" />
+        <h2 className="text-xl font-semibold">Moderation Controls</h2>
+      </div>
+
+      <p className="text-sm text-red-200/70">
+        These actions are restricted to Organizers and Admins. Please review carefully before taking action.
+      </p>
+
+      <div className="flex flex-wrap items-center gap-3">
+        <Button
+          onClick={() => onModerate("approve")}
+          disabled={isProcessing || project.status === "Approved"}
+          className="bg-green-600/20 hover:bg-green-600/30 text-green-400 border border-green-600/50 hover:border-green-500 transition-colors"
+        >
+          <CheckCircle className="w-4 h-4 mr-2" />
+          Approve Project
+        </Button>
+        
+        <Button
+          onClick={() => onModerate("reject")}
+          disabled={isProcessing || project.status === "Rejected"}
+          className="bg-red-600/20 hover:bg-red-600/30 text-red-400 border border-red-600/50 hover:border-red-500 transition-colors"
+        >
+          <XCircle className="w-4 h-4 mr-2" />
+          Reject Project
+        </Button>
+
+        <div className="flex-1" />
+
+        <Button
+          onClick={onDelete}
+          disabled={isProcessing}
+          variant="destructive"
+          className="bg-red-600 hover:bg-red-700 text-white shadow-[0_0_15px_rgba(220,38,38,0.3)] transition-all"
+        >
+          <Trash2 className="w-4 h-4 mr-2" />
+          Delete Project
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/Overview.tsx b/src/features/ProjectDetail/components/Overview.tsx
new file mode 100644
index 0000000..27c3cc6
--- /dev/null
+++ b/src/features/ProjectDetail/components/Overview.tsx
@@ -0,0 +1,50 @@
+import { Project } from "../types";
+import { ExternalLink, Github } from "lucide-react";
+
+export function Overview({ project }: { project: Project }) {
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+      <h2 className="text-xl font-semibold text-white">Project Overview</h2>
+      
+      <div className="text-slate-300 leading-relaxed text-sm md:text-base">
+        {project.description}
+      </div>
+
+      <div className="space-y-3">
+        <h3 className="text-sm font-medium text-slate-400">Tech Stack</h3>
+        <div className="flex flex-wrap gap-2">
+          {project.techStack.map((tech) => (
+            <span key={tech} className="px-3 py-1 bg-slate-800 text-slate-300 text-xs font-medium rounded-md border border-slate-700">
+              {tech}
+            </span>
+          ))}
+        </div>
+      </div>
+
+      <div className="flex flex-wrap gap-4 pt-2">
+        {project.githubUrl && (
+          <a 
+            href={project.githubUrl} 
+            target="_blank" 
+            rel="noreferrer"
+            className="flex items-center gap-2 text-sm font-medium text-slate-300 hover:text-white transition-colors"
+          >
+            <Github className="w-4 h-4" />
+            <span>GitHub Repository</span>
+          </a>
+        )}
+        {project.liveDemoUrl && (
+          <a 
+            href={project.liveDemoUrl} 
+            target="_blank" 
+            rel="noreferrer"
+            className="flex items-center gap-2 text-sm font-medium text-indigo-400 hover:text-indigo-300 transition-colors"
+          >
+            <ExternalLink className="w-4 h-4" />
+            <span>Live Demo</span>
+          </a>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/ScorePanel.tsx b/src/features/ProjectDetail/components/ScorePanel.tsx
new file mode 100644
index 0000000..79f29ae
--- /dev/null
+++ b/src/features/ProjectDetail/components/ScorePanel.tsx
@@ -0,0 +1,79 @@
+import { useState } from "react";
+import { Project } from "../types";
+import { Button } from "../../../shadcnComponet/ui/button";
+
+interface ScorePanelProps {
+  project: Project;
+  onSubmitScore: (scoreData: { innovation: number; technical: number; design: number; impact: number; feedback: string }) => Promise<void>;
+}
+
+export function ScorePanel({ project, onSubmitScore }: ScorePanelProps) {
+  const [scores, setScores] = useState({ innovation: 0, technical: 0, design: 0, impact: 0 });
+  const [feedback, setFeedback] = useState("");
+  const [isSubmitting, setIsSubmitting] = useState(false);
+
+  const totalScore = Object.values(scores).reduce((a, b) => a + b, 0);
+
+  const handleSubmit = async () => {
+    setIsSubmitting(true);
+    try {
+      await onSubmitScore({ ...scores, feedback });
+    } finally {
+      setIsSubmitting(false);
+    }
+  };
+
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-indigo-950/30 border border-indigo-500/30 rounded-xl backdrop-blur-sm relative overflow-hidden">
+      <div className="absolute top-0 right-0 p-4 opacity-10 pointer-events-none">
+        <div className="text-9xl font-bold">{totalScore}</div>
+      </div>
+
+      <div className="flex items-center justify-between relative z-10">
+        <h2 className="text-xl font-semibold text-indigo-100">Judge Evaluation</h2>
+        <div className="bg-indigo-600 px-4 py-1.5 rounded-full text-white font-bold shadow-[0_0_15px_rgba(79,70,229,0.5)]">
+          Total: {totalScore} / 40
+        </div>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-6 relative z-10">
+        {(["innovation", "technical", "design", "impact"] as const).map((criteria) => (
+          <div key={criteria} className="space-y-2">
+            <div className="flex justify-between items-center">
+              <label className="text-sm font-medium text-indigo-200 capitalize">{criteria} (0-10)</label>
+              <span className="text-xs text-indigo-400 font-mono">{scores[criteria]}/10</span>
+            </div>
+            <input
+              type="range"
+              min="0"
+              max="10"
+              value={scores[criteria]}
+              onChange={(e) => setScores(s => ({ ...s, [criteria]: parseInt(e.target.value, 10) }))}
+              className="w-full accent-indigo-500 h-2 bg-slate-800 rounded-lg appearance-none cursor-pointer"
+            />
+          </div>
+        ))}
+      </div>
+
+      <div className="space-y-2 relative z-10">
+        <label className="text-sm font-medium text-indigo-200">Feedback Details</label>
+        <textarea
+          value={feedback}
+          onChange={(e) => setFeedback(e.target.value)}
+          placeholder="Provide constructive feedback for the team..."
+          className="w-full h-32 bg-slate-900/50 border border-indigo-500/30 rounded-lg p-3 text-sm text-indigo-100 placeholder:text-indigo-300/50 focus:outline-none focus:border-indigo-500 transition-colors resize-none"
+        />
+      </div>
+
+      <div className="flex justify-end relative z-10">
+        <Button 
+          onClick={handleSubmit} 
+          disabled={isSubmitting || totalScore === 0}
+          className="bg-indigo-600 hover:bg-indigo-500 text-white font-semibold transition-all shadow-[0_0_15px_rgba(79,70,229,0.3)] hover:shadow-[0_0_25px_rgba(79,70,229,0.5)]"
+        >
+          {isSubmitting ? "Submitting Evaluation..." : "Submit Score"}
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/Submission.tsx b/src/features/ProjectDetail/components/Submission.tsx
new file mode 100644
index 0000000..1e7dbd3
--- /dev/null
+++ b/src/features/ProjectDetail/components/Submission.tsx
@@ -0,0 +1,54 @@
+import { Project } from "../types";
+import { Clock, CheckCircle2, AlertCircle } from "lucide-react";
+
+export function Submission({ project }: { project: Project }) {
+  const isSubmitted = project.status !== "Draft";
+
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+      <h2 className="text-xl font-semibold text-white">Submission Details</h2>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+        <div className="space-y-1">
+          <p className="text-sm text-slate-400">Status</p>
+          <div className="flex items-center gap-2">
+            {isSubmitted ? (
+              <CheckCircle2 className="w-4 h-4 text-green-400" />
+            ) : (
+              <AlertCircle className="w-4 h-4 text-yellow-400" />
+            )}
+            <span className="text-sm font-medium text-white">{isSubmitted ? "Submitted" : "Not Submitted (Draft)"}</span>
+          </div>
+        </div>
+
+        <div className="space-y-1">
+          <p className="text-sm text-slate-400">Version</p>
+          <div className="flex items-center gap-2 text-sm font-medium text-white">
+            <span>v{project.version}.0</span>
+            <span className="px-2 py-0.5 text-[10px] uppercase tracking-wider bg-slate-800 rounded-sm text-slate-400 border border-slate-700">
+              {isSubmitted ? "Final" : "Draft"}
+            </span>
+          </div>
+        </div>
+
+        {project.submittedAt && (
+          <div className="space-y-1">
+            <p className="text-sm text-slate-400">Submitted At</p>
+            <div className="flex items-center gap-2 text-sm font-medium text-white">
+              <Clock className="w-4 h-4 text-slate-400" />
+              <span>{new Date(project.submittedAt).toLocaleString()}</span>
+            </div>
+          </div>
+        )}
+
+        <div className="space-y-1">
+          <p className="text-sm text-slate-400">Last Updated</p>
+          <div className="flex items-center gap-2 text-sm font-medium text-white">
+            <Clock className="w-4 h-4 text-slate-400" />
+            <span>{new Date(project.lastUpdatedAt).toLocaleString()}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/Team.tsx b/src/features/ProjectDetail/components/Team.tsx
new file mode 100644
index 0000000..66909a2
--- /dev/null
+++ b/src/features/ProjectDetail/components/Team.tsx
@@ -0,0 +1,38 @@
+import { Project } from "../types";
+import { Users } from "lucide-react";
+
+export function Team({ project }: { project: Project }) {
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+      <div className="flex items-center gap-2">
+        <Users className="w-5 h-5 text-indigo-400" />
+        <h2 className="text-xl font-semibold text-white">
+          Team: <span className="text-indigo-300">{project.teamName}</span>
+        </h2>
+        {project.isSolo && (
+          <span className="ml-2 px-2 py-0.5 text-xs font-medium bg-slate-800 text-slate-300 rounded-md border border-slate-700">
+            Solo
+          </span>
+        )}
+      </div>
+
+      <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+        {project.members.map((member) => (
+          <div key={member.id} className="flex items-center gap-4 p-3 bg-slate-800/50 rounded-lg border border-slate-700">
+            {member.avatarUrl ? (
+              <img src={member.avatarUrl} alt={member.name} className="w-10 h-10 rounded-full bg-slate-700 object-cover" />
+            ) : (
+              <div className="w-10 h-10 rounded-full bg-slate-700 flex items-center justify-center text-sm font-medium text-slate-300">
+                {member.name.charAt(0)}
+              </div>
+            )}
+            <div>
+              <p className="text-sm font-medium text-white">{member.name}</p>
+              <p className="text-xs text-slate-400">{member.role}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/components/Timeline.tsx b/src/features/ProjectDetail/components/Timeline.tsx
new file mode 100644
index 0000000..d955bed
--- /dev/null
+++ b/src/features/ProjectDetail/components/Timeline.tsx
@@ -0,0 +1,47 @@
+import { Project, TimelineEvent } from "../types";
+import { Circle, FileEdit, UploadCloud, Star, ShieldCheck, ShieldX } from "lucide-react";
+
+export function Timeline({ project }: { project: Project }) {
+  const getEventIcon = (type: TimelineEvent["type"]) => {
+    switch (type) {
+      case "created": return <Circle className="w-4 h-4 text-slate-400" />;
+      case "edited": return <FileEdit className="w-4 h-4 text-blue-400" />;
+      case "submitted": return <UploadCloud className="w-4 h-4 text-indigo-400" />;
+      case "scored": return <Star className="w-4 h-4 text-yellow-400" />;
+      case "approved": return <ShieldCheck className="w-4 h-4 text-green-400" />;
+      case "rejected": return <ShieldX className="w-4 h-4 text-red-400" />;
+    }
+  };
+
+  // Sort timeline newest first
+  const sortedTimeline = useMemo(() => 
+    [...project.timeline].sort(
+      (a, b) => new Date(b.timestamp).getTime() - new Date(a.timestamp).getTime()
+    ), [project.timeline]);
+
+  return (
+    <div className="flex flex-col gap-6 p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+      <h2 className="text-xl font-semibold text-white">Activity Timeline</h2>
+
+      <div className="relative border-l border-slate-700 ml-3 space-y-6">
+        {sortedTimeline.map((event, index) => (
+          <div key={event.id} className="relative pl-6">
+            <span className="absolute -left-[11px] top-1 bg-slate-900 p-1 rounded-full border border-slate-700">
+              {getEventIcon(event.type)}
+            </span>
+            <div className="flex flex-col gap-1">
+              <div className="flex items-center gap-2">
+                <span className="text-sm font-semibold text-white">{event.title}</span>
+                <span className="text-xs text-slate-500">
+                  {new Date(event.timestamp).toLocaleString()}
+                </span>
+              </div>
+              <p className="text-sm text-slate-400">{event.description}</p>
+              <p className="text-xs text-slate-500 font-medium">by {event.actorName}</p>
+            </div>
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/pages/ProjectDetailPage.tsx b/src/features/ProjectDetail/pages/ProjectDetailPage.tsx
new file mode 100644
index 0000000..cfe3e22
--- /dev/null
+++ b/src/features/ProjectDetail/pages/ProjectDetailPage.tsx
@@ -0,0 +1,199 @@
+import { useEffect, useState } from "react";
+import { useParams, useNavigate } from "react-router-dom";
+import { Project } from "../types";
+import { projectApi } from "../services/mockProjectApi";
+
+import { Header } from "../components/Header";
+import { Overview } from "../components/Overview";
+import { Team } from "../components/Team";
+import { Submission } from "../components/Submission";
+import { Attachments } from "../components/Attachments";
+import { ScorePanel } from "../components/ScorePanel";
+import { ModerationPanel } from "../components/ModerationPanel";
+import { Timeline } from "../components/Timeline";
+
+// Mock User Context (In a real app, this would come from a global auth state)
+type UserRole = "Participant" | "Judge" | "Organizer" | "Admin";
+
+export default function ProjectDetailPage() {
+  const { projectId } = useParams<{ projectId: string }>();
+  const navigate = useNavigate();
+  
+  const [project, setProject] = useState<Project | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [isProcessing, setIsProcessing] = useState(false);
+
+  // Temporary UI to switch roles for testing
+  const [userRole, setUserRole] = useState<UserRole>("Admin");
+  const [userName] = useState("Mock Current User");
+
+  useEffect(() => {
+    if (projectId) {
+      loadProject(projectId);
+    }
+  }, [projectId]);
+
+  const loadProject = async (id: string) => {
+    try {
+      setLoading(true);
+      setError(null);
+      const data = await projectApi.getProject(id);
+      setProject(data);
+    } catch (err: any) {
+      setError(err.message || "Failed to load project");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  const handleSubmitProject = async () => {
+    if (!project) return;
+    try {
+      setIsProcessing(true);
+      const updated = await projectApi.submitProject(project.id, userName);
+      setProject(updated);
+    } catch (err: any) {
+      alert(err.message);
+    } finally {
+      setIsProcessing(false);
+    }
+  };
+
+  const handleScoreProject = async (scoreData: { innovation: number; technical: number; design: number; impact: number; feedback: string }) => {
+    if (!project) return;
+    try {
+      const updated = await projectApi.scoreProject(project.id, {
+        ...scoreData,
+        judgeId: "curr-user-id",
+        judgeName: userName
+      });
+      setProject(updated);
+    } catch (err: any) {
+      alert(err.message);
+    }
+  };
+
+  const handleModerate = async (action: "approve" | "reject") => {
+    if (!project) return;
+    try {
+      setIsProcessing(true);
+      const updated = await projectApi.moderateProject(project.id, action, userName);
+      setProject(updated);
+    } catch (err: any) {
+      alert(err.message);
+    } finally {
+      setIsProcessing(false);
+    }
+  };
+
+  const handleDelete = async () => {
+    if (!project) return;
+    if (window.confirm("Are you sure you want to delete this project? This cannot be undone.")) {
+      try {
+        setIsProcessing(true);
+        await projectApi.deleteProject(project.id);
+        navigate("/org/dashboard"); // redirect after delete
+      } catch (err: any) {
+        alert(err.message);
+        setIsProcessing(false);
+      }
+    }
+  };
+
+  if (loading) {
+    return (
+      <div className="flex h-screen items-center justify-center bg-[#0B0F19]">
+        <div className="animate-spin rounded-full h-12 w-12 border-b-2 border-indigo-500"></div>
+      </div>
+    );
+  }
+
+  if (error || !project) {
+    return (
+      <div className="flex h-screen flex-col items-center justify-center bg-[#0B0F19] text-white gap-4">
+        <h2 className="text-2xl font-bold text-red-400">Error</h2>
+        <p className="text-slate-400">{error || "Project not found"}</p>
+        <button onClick={() => projectId && loadProject(projectId)} className="px-4 py-2 bg-indigo-600 rounded-md hover:bg-indigo-500 transition-colors">
+          Retry
+        </button>
+      </div>
+    );
+  }
+
+  return (
+    <div className="min-h-screen bg-[#0B0F19] p-4 md:p-8 font-sans selection:bg-indigo-500/30">
+      <div className="max-w-6xl mx-auto space-y-8">
+        
+        {/* Testing Role Switcher (Can be removed in production) */}
+        <div className="flex items-center gap-4 p-4 bg-slate-800/50 rounded-lg border border-slate-700">
+          <span className="text-sm text-slate-400 font-medium">Test Role:</span>
+          {(["Participant", "Judge", "Organizer", "Admin"] as const).map(role => (
+            <button
+              key={role}
+              onClick={() => setUserRole(role)}
+              className={`px-3 py-1 rounded-md text-sm font-medium transition-colors ${userRole === role ? 'bg-indigo-600 text-white' : 'bg-slate-700 text-slate-300 hover:bg-slate-600'}`}
+            >
+              {role}
+            </button>
+          ))}
+          <span className="ml-auto text-xs text-slate-500">Only visible in dev</span>
+        </div>
+
+        <Header 
+          project={project} 
+          userRole={userRole} 
+          onSubmit={handleSubmitProject} 
+          isSubmitting={isProcessing} 
+        />
+
+        <div className="grid grid-cols-1 lg:grid-cols-3 gap-8">
+          {/* Main Content Column */}
+          <div className="lg:col-span-2 space-y-8">
+            <Overview project={project} />
+            <Submission project={project} />
+            <Attachments project={project} />
+            
+            {/* Role Specific Panels */}
+            {userRole === "Judge" && (
+              <ScorePanel project={project} onSubmitScore={handleScoreProject} />
+            )}
+            
+            {(userRole === "Organizer" || userRole === "Admin") && (
+              <ModerationPanel 
+                project={project} 
+                onModerate={handleModerate} 
+                onDelete={handleDelete} 
+                isProcessing={isProcessing} 
+              />
+            )}
+          </div>
+
+          {/* Sidebar Column */}
+          <div className="space-y-8">
+            <Team project={project} />
+            <Timeline project={project} />
+            
+            {/* Show scores summary if Admin or Organizer */}
+            {(userRole === "Admin" || userRole === "Organizer" || userRole === "Judge") && project.scores.length > 0 && (
+              <div className="p-6 bg-slate-900/50 border border-slate-800 rounded-xl backdrop-blur-sm">
+                <h3 className="text-lg font-semibold text-white mb-4">Evaluation Summary</h3>
+                <div className="flex items-center justify-between">
+                  <span className="text-slate-400">Total Scores</span>
+                  <span className="text-white font-medium">{project.scores.length}</span>
+                </div>
+                <div className="flex items-center justify-between mt-2">
+                  <span className="text-slate-400">Average</span>
+                  <span className="text-indigo-400 font-bold text-xl">
+                    {(project.scores.reduce((a, b) => a + b.totalScore, 0) / project.scores.length).toFixed(1)} / 40
+                  </span>
+                </div>
+              </div>
+            )}
+          </div>
+        </div>
+
+      </div>
+    </div>
+  );
+}
diff --git a/src/features/ProjectDetail/services/mockProjectApi.ts b/src/features/ProjectDetail/services/mockProjectApi.ts
new file mode 100644
index 0000000..41e0da3
--- /dev/null
+++ b/src/features/ProjectDetail/services/mockProjectApi.ts
@@ -0,0 +1,137 @@
+import { Project, ProjectStatus, Score } from "../types";
+
+// In-memory store for simulation
+let mockProjects: Record<string, Project> = {
+  "proj-123": {
+    id: "proj-123",
+    title: "EcoTrack AI",
+    status: "Draft",
+    eventName: "Global Sustainability Hackathon 2026",
+    eventType: "Virtual",
+    description: "An AI-powered application that tracks personal carbon footprint by analyzing daily receipts and travel logs. It uses machine learning to suggest eco-friendly alternatives and gamifies the experience with a community leaderboard.",
+    techStack: ["React", "TypeScript", "Node.js", "Python", "TensorFlow", "PostgreSQL"],
+    githubUrl: "https://github.com/example/ecotrack",
+    liveDemoUrl: "https://ecotrack-demo.vercel.app",
+    teamName: "Green Innovators",
+    isSolo: false,
+    members: [
+      { id: "user-1", name: "Alice Smith", role: "Frontend Lead", avatarUrl: "https://i.pravatar.cc/150?u=a042581f4e29026024d" },
+      { id: "user-2", name: "Bob Jones", role: "AI Engineer", avatarUrl: "https://i.pravatar.cc/150?u=a042581f4e29026704d" }
+    ],
+    submittedAt: undefined,
+    lastUpdatedAt: new Date().toISOString(),
+    version: 1,
+    attachments: [
+      { id: "att-1", name: "Architecture Diagram", url: "#", type: "image" },
+      { id: "att-2", name: "Pitch Deck", url: "#", type: "document" }
+    ],
+    scores: [],
+    timeline: [
+      {
+        id: "ev-1",
+        type: "created",
+        title: "Project Created",
+        description: "Initial draft of the project was created.",
+        timestamp: new Date(Date.now() - 86400000).toISOString(),
+        actorName: "Alice Smith"
+      }
+    ],
+    participantId: "user-1", // mock user ID representing a participant
+  }
+};
+
+const delay = (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
+
+export const projectApi = {
+  getProject: async (id: string): Promise<Project> => {
+    await delay(800);
+    const project = mockProjects[id];
+    if (!project) throw new Error("Project not found");
+    return { ...project };
+  },
+
+  submitProject: async (id: string, actorName: string): Promise<Project> => {
+    await delay(1000);
+    const project = mockProjects[id];
+    if (!project) throw new Error("Project not found");
+    if (project.status !== "Draft") throw new Error("Project is already submitted");
+
+    project.status = "Submitted";
+    project.submittedAt = new Date().toISOString();
+    project.lastUpdatedAt = new Date().toISOString();
+    project.timeline.push({
+      id: `ev-${Date.now()}`,
+      type: "submitted",
+      title: "Project Submitted",
+      description: "Project was officially submitted for review.",
+      timestamp: new Date().toISOString(),
+      actorName
+    });
+
+    mockProjects[id] = { ...project };
+    return { ...project };
+  },
+
+  scoreProject: async (
+    id: string, 
+    scoreData: Omit<Score, "id" | "projectId" | "totalScore" | "submittedAt">
+  ): Promise<Project> => {
+    await delay(1000);
+    const project = mockProjects[id];
+    if (!project) throw new Error("Project not found");
+    
+    // Auto calculate total score
+    const totalScore = scoreData.innovation + scoreData.technical + scoreData.design + scoreData.impact;
+    
+    const newScore: Score = {
+      ...scoreData,
+      id: `score-${Date.now()}`,
+      projectId: id,
+      totalScore,
+      submittedAt: new Date().toISOString()
+    };
+
+    project.scores.push(newScore);
+    // If we transition state based on scoring, we could do it here
+    if (project.status === "Submitted") {
+      project.status = "Under Review";
+    }
+
+    project.timeline.push({
+      id: `ev-${Date.now()}`,
+      type: "scored",
+      title: "Project Scored",
+      description: `A judge has evaluated this project. Score: ${totalScore}/40`,
+      timestamp: new Date().toISOString(),
+      actorName: scoreData.judgeName
+    });
+
+    mockProjects[id] = { ...project };
+    return { ...project };
+  },
+
+  moderateProject: async (id: string, action: "approve" | "reject", actorName: string): Promise<Project> => {
+    await delay(1000);
+    const project = mockProjects[id];
+    if (!project) throw new Error("Project not found");
+
+    project.status = action === "approve" ? "Approved" : "Rejected";
+    project.timeline.push({
+      id: `ev-${Date.now()}`,
+      type: action === "approve" ? "approved" : "rejected",
+      title: `Project ${action === "approve" ? "Approved" : "Rejected"}`,
+      description: `Moderator decision applied.`,
+      timestamp: new Date().toISOString(),
+      actorName
+    });
+
+    mockProjects[id] = { ...project };
+    return { ...project };
+  },
+
+  deleteProject: async (id: string): Promise<void> => {
+    await delay(1000);
+    if (!mockProjects[id]) throw new Error("Project not found");
+    delete mockProjects[id];
+  }
+};
diff --git a/src/features/ProjectDetail/types/index.ts b/src/features/ProjectDetail/types/index.ts
new file mode 100644
index 0000000..37595b9
--- /dev/null
+++ b/src/features/ProjectDetail/types/index.ts
@@ -0,0 +1,60 @@
+export type ProjectStatus = "Draft" | "Submitted" | "Under Review" | "Approved" | "Rejected";
+
+export interface TeamMember {
+  id: string;
+  name: string;
+  role: string;
+  avatarUrl?: string;
+}
+
+export interface Score {
+  id: string;
+  projectId: string;
+  judgeId: string;
+  judgeName: string;
+  innovation: number;
+  technical: number;
+  design: number;
+  impact: number;
+  totalScore: number;
+  feedback: string;
+  submittedAt: string;
+}
+
+export interface TimelineEvent {
+  id: string;
+  type: "created" | "edited" | "submitted" | "scored" | "approved" | "rejected";
+  title: string;
+  description: string;
+  timestamp: string;
+  actorName: string;
+}
+
+export interface Attachment {
+  id: string;
+  name: string;
+  url: string;
+  type: "document" | "image" | "link";
+}
+
+export interface Project {
+  id: string;
+  title: string;
+  status: ProjectStatus;
+  eventName: string;
+  eventType: string;
+  description: string;
+  techStack: string[];
+  githubUrl?: string;
+  liveDemoUrl?: string;
+  teamName: string;
+  isSolo: boolean;
+  members: TeamMember[];
+  submittedAt?: string;
+  lastUpdatedAt: string;
+  version: number;
+  attachments: Attachment[];
+  scores: Score[];
+  timeline: TimelineEvent[];
+  participantId: string; // The owner ID
+}
diff --git a/src/features/SideBar/v1/Section/BotamNavBar.tsx b/src/features/SideBar/v1/Section/BotamNavBar.tsx
index b0c3b2b..c94a805 100644
--- a/src/features/SideBar/v1/Section/BotamNavBar.tsx
+++ b/src/features/SideBar/v1/Section/BotamNavBar.tsx
@@ -33,8 +33,8 @@ const navItems: NavItem[] = [
   {
     icon: MdAssignment,
     text: "Tasks",
-    link: "/tasks",
-    isActive: (pathname) => pathname.startsWith("/tasks"),
+    link: "/org/tasks",
+    isActive: (pathname) => pathname.startsWith("/org/tasks"),
   },
   {
     icon: RiContactsBookFill,
diff --git a/src/features/SideBar/v1/Section/SideBar.tsx b/src/features/SideBar/v1/Section/SideBar.tsx
index cd4ef5e..e913e3e 100644
--- a/src/features/SideBar/v1/Section/SideBar.tsx
+++ b/src/features/SideBar/v1/Section/SideBar.tsx
@@ -1,4 +1,14 @@
 import { RiContactsBookFill } from "react-icons/ri";
+import { getTheme } from "../../../../config/them.config";
+import SideBarLink from "../Components/SideBarLink";
+import { MdDashboard, MdEvent, MdGroup, MdSettings, MdWork, MdAssignment, MdAddTask } from "react-icons/md";
+import { dashboardData } from "@/features/Dashboard/mock/dashboardData";
+import { usePermissions } from "@/features/MemberTask/context/PermissionContext";
+
+const SideBar = () => {
+  let theme = getTheme("light");
+  const { hasPermission } = usePermissions();
+import { MdDashboard, MdEvent, MdGroup, MdSettings, MdWork } from "react-icons/md";
 import { MdAssignment, MdDashboard, MdEvent, MdGroup, MdSettings, MdWork } from "react-icons/md";
 import { useTheme } from "@/theme";
 import { ThemeToggle } from "@/Component/ui/ThemeToggle";
@@ -49,6 +59,9 @@ const SideBar = () => {
         <SideBarLink icon={<MdGroup />} text="Teams" link="/org/member" />
         <SideBarLink icon={<MdEvent />} text="Events" link="/org/events" />
         <SideBarLink icon={<MdAssignment />} text="Tasks" link="/org/tasks" />
+        {hasPermission("CREATE_TASK") && (
+          <SideBarLink icon={<MdAddTask />} text="Create Task" link="/org/tasks/create" />
+        )}
         <SideBarLink icon={<RiContactsBookFill />} text="Contact Submissions" link="/org/contact" />
 
         {/* Footer */}