diff --git a/PACKAGE_OPTIMIZATION_PLAN.md b/PACKAGE_OPTIMIZATION_PLAN.md
new file mode 100644
index 0000000..a5b0eaa
--- /dev/null
+++ b/PACKAGE_OPTIMIZATION_PLAN.md
@@ -0,0 +1,392 @@
+# 📦 PACKAGE OPTIMIZATION PLAN
+
+**Goal**: Optimize packages for best performance, load time, and user experience  
+**Strategy**: Admin (all bells & whistles) vs. Public Site (lightweight & fast)
+
+---
+
+## 🎯 SPLIT STRATEGY
+
+### Admin Dashboard (`/admin/*`)
+- **Philosophy**: All features, rich UX, animations, tools
+- **Priority**: Functionality > Performance
+- **Bundle Size**: Can be larger (~500KB-1MB)
+- **Users**: Internal team only
+
+### Public Site (`/` and `/posts/*`)
+- **Philosophy**: Minimal, fast, SEO-optimized
+- **Priority**: Performance > Features
+- **Bundle Size**: Tiny (~50-100KB)
+- **Users**: Public visitors
+
+---
+
+## 📋 PACKAGE DECISIONS
+
+### ✅ KEEP FOR ADMIN ONLY (35 packages)
+
+#### Core Admin Features:
+1. **@tanstack/react-table** - Data tables
+2. **@tanstack/react-query** - Server state
+3. **@tanstack/react-virtual** - Virtual scrolling
+4. **@dnd-kit/core** + **@dnd-kit/sortable** - Kanban drag-drop
+5. **react-hook-form** + **zod** + **@hookform/resolvers** - Forms
+6. **@radix-ui/*** (8 packages) - UI primitives
+7. **framer-motion** - Animations ✨
+8. **recharts** + **@tremor/react** - Analytics dashboards
+9. **@tiptap/*** (3 packages) - Rich text editor
+10. **react-markdown** + **remark-gfm** - Markdown rendering
+11. **react-syntax-highlighter** - Code highlighting
+12. **@craftjs/core** + **@craftjs/utils** - Visual editor (future)
+13. **reactflow** + **react-flow-renderer** - Workflow builder (future)
+14. **leaflet** + **react-leaflet** + **@turf/turf** - Maps
+15. **papaparse** - CSV import/export
+16. **pdfmake** - PDF generation
+17. **html-to-image** - Screenshot exports
+18. **react-dropzone** - File uploads
+19. **react-diff-viewer-continued** - Version comparison
+20. **bullmq** + **@bull-board/*** - Queue management
+21. **cmdk** - Command palette
+22. **sonner** - Toast notifications
+23. **lucide-react** - Icons
+24. **tailwindcss-animate** - Animation utilities
+
+#### State & Utils:
+25. **zustand** + **immer** - Complex state
+26. **nanostores** + **@nanostores/react** - Global state
+27. **lodash-es** - Utilities
+28. **date-fns** - Date formatting
+29. **nanoid** - ID generation
+30. **lzutf8** - Compression
+
+---
+
+### ✅ KEEP FOR PUBLIC SITE (Minimal - 15 packages)
+
+#### Essential Only:
+1. **astro** - SSR framework
+2. **react** + **react-dom** - UI (only where needed)
+3. **@directus/sdk** - Data fetching
+4. **tailwindcss** + **tailwind-merge** - Styling
+5. **clsx** - Class names
+6. **@astrojs/node** - SSR adapter
+7. **@astrojs/tailwind** - Tailwind integration
+8. **@astrojs/sitemap** - SEO sitemap
+9. **@astrojs/partytown** - Analytics (off main thread)
+10. **@vite-pwa/astro** - PWA/offline
+11. **sharp** - Image optimization
+12. **autoprefixer** + **postcss** - CSS processing
+
+**Public Site Bundle**: ~50-100KB (gzipped)
+
+---
+
+### ❌ REMOVE COMPLETELY (Not Used - 8 packages)
+
+1. **react-contenteditable** - Not using inline editing
+2. **@types/papaparse** - Only needed if using papaparse
+3. **@types/react-syntax-highlighter** - Only for admin
+4. **ioredis** - Only if using queues (move to backend)
+5. **astro-imagetools** - Redundant with sharp
+6. **rollup-plugin-visualizer** - Dev tool only
+7. **vite-plugin-inspect** - Dev tool only
+8. **@tanstack/react-query-devtools** - Dev tool only
+
+**Savings**: ~20MB in node_modules
+
+---
+
+## 🏗️ IMPLEMENTATION PLAN
+
+### Phase 1: Code Splitting (Immediate)
+
+**Goal**: Separate admin and public bundles
+
+#### Step 1: Create Entry Points
+```typescript
+// src/lib/admin-only.ts
+export { default as Kanban } from '@/components/factory/KanbanBoard';
+export { default as DataTable } from '@/components/ui/DataTable';
+export { default as RichTextEditor } from '@/components/ui/RichTextEditor';
+// ... all admin components
+```
+
+#### Step 2: Lazy Load Admin Components
+```astro
+---
+// Admin pages only
+const AdminComponent = (await import('@/lib/admin-only')).Kanban;
+---
+<AdminComponent client:load />
+```
+
+#### Step 3: Configure Vite Chunking
+```typescript
+// astro.config.ts
+export default defineConfig({
+  vite: {
+    build: {
+      rollupOptions: {
+        output: {
+          manualChunks: {
+            'admin-core': [
+              '@tanstack/react-table',
+              '@tanstack/react-query',
+              'react-hook-form',
+              'zod'
+            ],
+            'admin-ui': [
+              '@radix-ui/react-dialog',
+              '@radix-ui/react-dropdown-menu',
+              'framer-motion'
+            ],
+            'admin-viz': [
+              'recharts',
+              '@tremor/react',
+              'leaflet'
+            ]
+          }
+        }
+      }
+    }
+  }
+});
+```
+
+---
+
+### Phase 2: Public Site Optimization (This Week)
+
+#### Remove Heavy Packages from Public Pages:
+```astro
+---
+// ❌ Don't do this on public pages
+import { DataTable } from '@tanstack/react-table';
+
+// ✅ Do this instead
+// Use static HTML tables or minimal client-side JS
+---
+```
+
+#### Implement Static Generation:
+```typescript
+// astro.config.ts
+export default defineConfig({
+  output: 'hybrid', // SSR for admin, static for public
+  adapter: node({
+    mode: 'middleware'
+  })
+});
+```
+
+#### Add Route-Based Rendering:
+```astro
+---
+// src/pages/[...slug].astro
+export const prerender = true; // Static for public posts
+---
+
+---
+// src/pages/admin/[...admin].astro
+export const prerender = false; // SSR for admin
+---
+```
+
+---
+
+### Phase 3: Animation Strategy (Next Week)
+
+#### Admin Animations (Rich):
+```typescript
+// Use framer-motion for admin
+import { motion } from 'framer-motion';
+
+<motion.div
+  initial={{ opacity: 0, y: 20 }}
+  animate={{ opacity: 1, y: 0 }}
+  transition={{ duration: 0.3 }}
+>
+  {content}
+</motion.div>
+```
+
+#### Public Animations (Lightweight):
+```css
+/* Use CSS animations for public */
+@keyframes fadeIn {
+  from { opacity: 0; transform: translateY(20px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.fade-in {
+  animation: fadeIn 0.3s ease-out;
+}
+```
+
+#### Intersection Observer for Scroll Animations:
+```typescript
+// Lightweight scroll animations
+const observer = new IntersectionObserver((entries) => {
+  entries.forEach(entry => {
+    if (entry.isIntersecting) {
+      entry.target.classList.add('fade-in');
+    }
+  });
+});
+```
+
+---
+
+### Phase 4: Backend Enhancements (Ongoing)
+
+#### Enable All Directus Features:
+1. **Flows** - Automation workflows
+2. **Webhooks** - Real-time notifications
+3. **Insights** - Analytics dashboards
+4. **Translations** - Multi-language support
+5. **Revisions** - Version history
+6. **Activity Log** - Audit trail
+7. **File Library** - Media management
+8. **Custom Extensions** - Spark-specific tools
+
+#### Add Backend Services:
+1. **Redis** - Caching layer
+2. **BullMQ** - Job queues
+3. **Elasticsearch** - Full-text search (future)
+4. **S3** - Cloud storage (future)
+
+---
+
+## 📊 EXPECTED RESULTS
+
+### Before Optimization:
+- **Admin Bundle**: ~800KB (unoptimized)
+- **Public Bundle**: ~800KB (same as admin)
+- **Total node_modules**: ~500MB
+- **Build Time**: ~60 seconds
+
+### After Optimization:
+- **Admin Bundle**: ~500KB (all features)
+- **Public Bundle**: ~50KB (minimal)
+- **Total node_modules**: ~480MB (-20MB)
+- **Build Time**: ~45 seconds (-25%)
+
+### Performance Gains:
+- **Public Site Load Time**: 3s → 0.8s (73% faster)
+- **Admin Load Time**: 3s → 2s (33% faster)
+- **Lighthouse Score**: 75 → 95 (public)
+- **First Contentful Paint**: 1.5s → 0.4s
+
+---
+
+## 🎨 ANIMATION IMPLEMENTATION
+
+### Admin Dashboard Animations:
+
+#### 1. Page Transitions:
+```typescript
+// Smooth page transitions
+<motion.div
+  initial={{ opacity: 0 }}
+  animate={{ opacity: 1 }}
+  exit={{ opacity: 0 }}
+  transition={{ duration: 0.2 }}
+>
+```
+
+#### 2. List Animations:
+```typescript
+// Stagger children
+<motion.div
+  variants={{
+    hidden: { opacity: 0 },
+    show: {
+      opacity: 1,
+      transition: {
+        staggerChildren: 0.1
+      }
+    }
+  }}
+>
+```
+
+#### 3. Hover Effects:
+```typescript
+// Interactive hover
+<motion.button
+  whileHover={{ scale: 1.05 }}
+  whileTap={{ scale: 0.95 }}
+>
+```
+
+#### 4. Loading States:
+```typescript
+// Skeleton loading
+<motion.div
+  animate={{
+    opacity: [0.5, 1, 0.5],
+  }}
+  transition={{
+    duration: 1.5,
+    repeat: Infinity
+  }}
+/>
+```
+
+### Public Site Animations (CSS):
+
+```css
+/* Fade in on scroll */
+.animate-on-scroll {
+  opacity: 0;
+  transform: translateY(30px);
+  transition: opacity 0.6s ease, transform 0.6s ease;
+}
+
+.animate-on-scroll.visible {
+  opacity: 1;
+  transform: translateY(0);
+}
+
+/* Smooth hover */
+.card {
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
+}
+
+.card:hover {
+  transform: translateY(-4px);
+  box-shadow: 0 10px 30px rgba(0,0,0,0.2);
+}
+```
+
+---
+
+## ✅ ACTION ITEMS
+
+### Immediate (Today):
+- [x] Fix deployment errors
+- [x] Archive obsolete docs
+- [x] Add .dockerignore
+- [ ] Test deployment succeeds
+
+### This Week:
+- [ ] Implement code splitting
+- [ ] Configure manual chunks
+- [ ] Add route-based rendering
+- [ ] Test bundle sizes
+
+### Next Week:
+- [ ] Add admin animations (framer-motion)
+- [ ] Add public animations (CSS)
+- [ ] Implement scroll animations
+- [ ] Performance audit
+
+### Ongoing:
+- [ ] Enable all Directus features
+- [ ] Add backend services
+- [ ] Monitor bundle sizes
+- [ ] Optimize as needed
+
+---
+
+**Result**: Fast public site + Feature-rich admin dashboard! 🚀