diff --git a/.gitignore b/.gitignore
index 30204822515140e470b4d6fcbd3d8da774c6c628..712ad9d0dcbc554bb70cb74dfa7218bbd7e502b4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -39,3 +39,14 @@ next-env.d.ts
 
 # Ignore Jetbrains IDE folder
 .idea/*
+
+# Ignore emacs temporary files
+*~
+*#
+
+# Vite files
+dist/
+
+# Bun
+bun.lockb
+
diff --git a/README.md b/README.md
index 6a552e2026f1cb6fb991c215b59bab71ab432f0b..40d1313846b619e0e035f3a436b3eeecc40ef9d6 100644
--- a/README.md
+++ b/README.md
@@ -1,23 +1,22 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+Haven is a vite app.
 
 ## Getting Started
 
 First, run the development server:
 
 ```bash
+npm install
 npm run dev
 # or
+yarn install
 yarn dev
+# or
+bun install
+bun run dev
 ```
 
 Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
-
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
-
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
-
 ## ICP Cannister HOWTO
 
 https://internetcomputer.org/docs/current/developer-docs/web-apps/application-frontends/existing-frontend
@@ -44,17 +43,15 @@ Deploy
 dfx deploy --network ic --identity icp_prod
 ```
 
-## Learn More
-
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+# Production
 
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+```
+npm run build
+npm run preview
+# or
+yarn build
+yarn preview
+# or
+bun run build
+bun run preview
+```
diff --git a/package.json b/package.json
index f45bb99790064e0ba39529002a1634f0e4d1ae6e..f9516ed9895d1466216f5c40e5a15c6bfa8ccb4a 100644
--- a/package.json
+++ b/package.json
@@ -2,17 +2,17 @@
   "name": "haven-web",
   "version": "0.3.22",
   "private": true,
+  "type": "module",
   "scripts": {
-    "dev": "next dev",
+    "dev": "vite",
     "dev:ts": "yarn dev & yarn ts:watch",
     "ts": "tsc --noEmit --incremental",
     "ts:watch": "yarn ts --watch",
-    "build": "next build",
-    "build:analyze": "ANALYZE=true next build",
-    "start": "npx serve out",
-    "lint": "next lint",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "lint": "eslint",
     "format": "prettier --write \"**/*.{ts,tsx,md}\"",
-    "lint:fix": "next lint --fix",
+    "lint:fix": "eslint --fix",
     "test": "cypress",
     "see-cy-coverage": "open ./cypress-coverage/lcov-report/index.html"
   },
@@ -27,10 +27,13 @@
     "@react-oauth/google": "^0.9.0",
     "@react-spring/web": "^9.5.5",
     "@reduxjs/toolkit": "^1.9.1",
+    "@vitejs/plugin-react": "^4.3.4",
+    "@windmillcode/quill-emoji": "^2.0.3000",
     "body-scroll-lock": "^4.0.0-beta.0",
     "classnames": "^2.3.1",
     "contrast-color": "^1.0.1",
     "copy-to-clipboard": "^3.3.2",
+    "date-fns": "^4.1.0",
     "dayjs": "^1.11.9",
     "delay": "^5.0.0",
     "dexie": "^3.2.2",
@@ -45,21 +48,22 @@
     "js-cookie": "^3.0.1",
     "lodash": "^4.17.21",
     "lucide-react": "^0.453.0",
-    "next": "^14.2.16",
-    "next-seo": "^5.11.1",
+    "pako": "^2.1.0",
     "parchment": "^2.0.1",
-    "quill": "^1.3.7",
+    "quill": "^2.0.3",
     "quill-auto-detect-url": "^0.2.1",
-    "quill-mention": "^3.1.0",
+    "quill-mention": "6.0.2",
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-error-boundary": "^3.1.4",
+    "react-helmet-async": "^2.0.5",
     "react-hot-toast": "^2.4.1",
     "react-i18next": "^12.2.0",
     "react-moment": "^1.1.2",
     "react-multiline-clamp": "^2.0.0",
     "react-quill": "^2.0.0",
     "react-redux": "^8.0.5",
+    "react-router-dom": "^7.1.5",
     "react-spring": "^9.5.2",
     "react-tailwindcss-select": "^1.6.0",
     "react-tooltip": "^5.7.4",
@@ -68,15 +72,15 @@
     "redux-localstorage": "^0.4.1",
     "serve": "^14.2.4",
     "ts.data.json": "^2.2.0",
-    "use-sound": "^4.0.1",
+    "use-sound": "^4.0.3",
     "usehooks-ts": "^2.9.1",
     "uuid": "^9.0.0",
+    "vite": "^6.0.11",
     "xxdk-wasm": "^0.3.21"
   },
   "devDependencies": {
     "@cypress/code-coverage": "^3.13.4",
     "@cypress/webpack-preprocessor": "^6.0.2",
-    "@next/bundle-analyzer": "^15.0.2",
     "@testing-library/cypress": "^10.0.2",
     "@types/contrast-color": "^1.0.0",
     "@types/dompurify": "^2.3.4",
@@ -87,33 +91,38 @@
     "@types/js-cookie": "^3.0.2",
     "@types/lodash": "^4.14.185",
     "@types/node": "18.7.14",
-    "@types/react": "18.3.11",
-    "@types/react-dom": "18.3.0",
+    "@types/pako": "^2.0.3",
+    "@types/react": "^18.2.43",
+    "@types/react-dom": "^18.2.17",
     "@types/react-draft-wysiwyg": "^1.13.4",
     "@types/testing-library__cypress": "^5.0.9",
     "@types/uuid": "^8.3.4",
-    "@typescript-eslint/eslint-plugin": "^5.45.0",
+    "@typescript-eslint/eslint-plugin": "^latest",
+    "@typescript-eslint/parser": "^latest",
+    "@vitejs/plugin-react-swc": "^3.5.0",
     "autoprefixer": "^10.4.20",
     "babel-plugin-istanbul": "^6.1.1",
     "cypress": "^13.15.1",
-    "eslint": "8.23.0",
+    "eslint": "^latest",
     "eslint-config-airbnb-typescript": "^17.0.0",
-    "eslint-config-next": "^13.0.6",
     "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-import-newlines": "^1.3.0",
     "eslint-plugin-prettier": "^5.2.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react": "^latest",
+    "eslint-plugin-react-hooks": "^latest",
     "eslint-plugin-simple-import-sort": "^8.0.0",
     "eslint-plugin-sort-destructure-keys": "^1.4.0",
-    "next-build-id": "^3.0.0",
     "nyc": "^15.1.0",
     "postcss": "^8.4.47",
     "prettier": "^3.3.3",
     "prettier-plugin-tailwindcss": "^0.4.1",
-    "sass": "^1.80.5",
     "tailwindcss": "^3.4.14",
-    "typed-scss-modules": "^8.0.1",
-    "typescript": "4.8.2"
-  }
+    "typescript": "^5.7.3",
+    "vite-plugin-eslint": "^1.8.1"
+  },
+  "trustedDependencies": [
+    "@swc/core",
+    "core-js-pure"
+  ]
 }
diff --git a/postcss.config.js b/postcss.config.js
index 5cbc2c7d8770dd519eeb059f155ee14aa9dc811a..cb9b0aaa5bdd67441f1cf7d4d6f6cbdba7ba8d24 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,6 +1,6 @@
-module.exports = {
+export default {
   plugins: {
     tailwindcss: {},
-    autoprefixer: {}
+    autoprefixer: {},
   }
-};
+}
diff --git a/tailwind.config.js b/tailwind.config.js
index 69ad3d096c74c1985e59cf1acf55cbb7866f31c2..72d6dc2922288370fd0af5dd165821ca499f8d9a 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -1,6 +1,8 @@
 /** @type {import('tailwindcss').Config} */
 module.exports = {
-  content: ['./src/**/*.{js,ts,jsx,tsx}'],
+  content: [
+    "./src/**/*.{js,jsx,ts,tsx}",
+  ],
   theme: {
     colors: {
       primary: 'var(--primary)',
@@ -35,6 +37,18 @@ module.exports = {
         lg: '1280px',
         xl: '1280px',
         '2xl': '1560px'
+      },
+      keyframes: {
+        draw: {
+          '0%, 66%, 100%': {
+            fill: 'rgb(96, 165, 250)', // blue-400 lighter
+            transform: 'translate(0, 0)'
+          },
+          '33%': {
+            fill: 'rgb(59, 130, 246)', // blue-500 darker
+            transform: 'translate(-1px, -1px)'
+          }
+        }
       }
     }
   },
diff --git a/tsconfig.json b/tsconfig.json
index cc6c4ce50afe95c1a119c87345005f712fc27ebb..9ad0a2630ebb602a294fabcceca4ecb7f01dc4ac 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -17,16 +17,12 @@
     "incremental": true,
     "allowSyntheticDefaultImports": true,
     "paths": {
-      "@assets/*": ["src/assets/*"],
-      "@utils/*": ["src/utils/*"],
-      "@layouts": ["src/layouts"],
-      "@layouts/*": ["src/layouts/*"],
-      "@components/*": ["src/components/*"],
+      "@/*": ["src/*"],
+      "src/*": ["src/*"],
       "@contexts/*": ["src/contexts/*"],
-      "@types": ["src/types"],
-      "@utils": ["src/utils/index"],
-      "@utils/hooks/*": ["src/utils/hooks/*"],
-      "@sdk/*": ["sdk-utils/*"]
+      "@components/*": ["src/components/*"],
+      "@assets/*": ["src/assets/*"],
+      "@utils/*": ["src/utils/*"]
     }
   },
   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "src/quill/constants.js"],