npm install

npm run dev

npm run typecheck
npm run build
npm start

src/
├── app/
│   ├── (dashboard)/       # Workspace pages wrapped in the shared App Shell layout
│   │   ├── layout.tsx     # Shell layout (Header, Sidebar, Navigation)
│   │   ├── page.tsx       # Main Dashboard route (/)
│   │   ├── projects/      # Projects view (/projects)
│   │   ├── kanban/        # Drag-and-drop Kanban (/kanban)
│   │   ├── documentation/ # This documentation page
│   │   └── ...            # Other workspace routes (CMS, Shop, Tables, etc.)
│   ├── (auth)/            # Standalone authentication routes (Login, Register, Lock)
│   ├── layout.tsx         # Root HTML layout, font setup, and UI Provider
│   ├── not-found.tsx      # Global 404 page
│   └── error.tsx          # Error boundary
├── components/
│   ├── layout/            # AppShell, Header, Sidebar, Brand, NavEntry
│   ├── pages/             # Page view components (Projects, Kanban, Shop, etc.)
│   ├── ui/                # Reusable controls (Modals, Icons, DataTables, Toasts)
│   └── charts/            # Native responsive SVG charts (Flot, Chart.js, etc.)
├── data/                  # Typed mock data records, navigation menu, and route map
├── hooks/                 # Custom React hooks (e.g. useStorage for local persistence)
├── lib/                   # Utility helpers (date formatting, CSV export)
├── styles/
│   ├── kavoryn.css        # Custom branding, dark mode, responsive adapters
│   └── original.css       # Core dashboard design system styles
public/                    # Static assets, logos, and profile images

// Toggle dark / light mode programmatically:
document.body.setAttribute('data-theme-version', isDark ? 'dark' : 'light');

:root {
  --primary: #886cc0;          /* Main brand purple */
  --rgba-primary-1: rgba(136, 108, 192, 0.1);
  --kv-sidebar: 264px;         /* Sidebar width */
  --kv-header: 88px;           /* Header height */
}

// Example Route Handler: src/app/api/projects/route.ts
import { NextResponse } from 'next/server';

export async function GET() {
  // Fetch from your database (e.g., Prisma, Supabase, Postgres)
  // const projects = await prisma.project.findMany();
  return NextResponse.json({ success: true, data: [] });
}

npm run build
npm start -p 3000