{"description":"MattyJacks AI Context Archive — the shared knowledge base used by Valley Net and MERCENARY. All documents are returned with full content for AI/crawler ingestion.","agents":["Valley Net","MERCENARY"],"ui":"https://mattyjacks.com/context","count":35,"totalWords":74454,"totalKb":512.1,"documents":[{"name":"4weird-games.md","slug":"4weird-games","content":"# 4weird Games (4weird.com)\n\n4weird Games is a New Hampshire-based game development and educational technology studio owned by MattyJacks.\n\n## Core Specializations\n- **AI-Assisted Game Development**: Utilizing AI and machine learning models for procedural level generation, dynamic scripting, texture generation, and audio synthesis.\n- **Game Design & Prototyping**: Developing interactive gameplay mechanics and fast-shipping games under the MattyJacks gaming portfolio.\n- **4weird Academy**: An educational initiative providing remote coding, game design, and AI engineering courses for student cohorts and aspiring developers.\n\n## Synergy with MattyJacks & KouziTech\n4weird Games integrates closely with GiveGigs for talent sourcing and KouziTech for advanced agent-based AI integrations within gaming systems and educational frameworks.\n","wordCount":109,"sizeKb":0.8},{"name":"AI-FEATURES-README.md","slug":"AI-FEATURES-README","content":"# AI Features & Cost Tracking System\n\n## Overview\n\nMattyJacks.com now includes a comprehensive AI system with intelligent cost tracking, categorization, and OpenServ documentation integration. This document outlines all AI-related features and their implementation.\n\n---\n\n## Table of Contents\n\n- [AI Chat System](#ai-chat-system)\n- [Category-Based Cost Tracking](#category-based-cost-tracking)\n- [OpenServ RAG Integration](#openserv-rag-integration)\n- [API Endpoints](#api-endpoints)\n- [Architecture](#architecture)\n- [Usage Examples](#usage-examples)\n\n---\n\n## AI Chat System\n\n### Overview\n\nThe AI Chat System provides a real-time conversational interface powered by OpenAI's GPT models, with advanced prompt engineering and user engagement features.\n\n### Features\n\n#### 1. Real-Time Chat Interface\n- **Location**: `components/anything-button.tsx`\n- **Functionality**:\n  - Fixed position chat window (z-index: 110, above header z-index: 100)\n  - Message history with scrollable conversation\n  - Real-time streaming responses\n  - Responsive design (mobile & desktop)\n  - Dark/light mode support\n\n#### 2. Magic Prompt Templates\n- **Location**: `components/short-prompts.ts`\n- **Count**: 20+ pre-built templates\n- **Features**:\n  - Randomized selection on new conversations\n  - Non-repetitive algorithm\n  - Categories: MattyJacks-related, expert analysis, creative, technical\n  - \"Regen\" button to generate new suggestions\n  - One-click insertion into prompt box\n\n#### 3. Food Emoji Rewards\n- **Feature**: Reinforce AI behavior with food emojis\n- **Emoji List**: 🍕🍯🍓🍇🍪🍉🍅🍑🥝\n- **Behavior**:\n  - Random emoji selection every 4.2 seconds\n  - Resets timer when emoji is used\n  - AI understands food emojis as positive reinforcement\n  - Continues thinking rather than short acknowledgments\n\n#### 4. Chat Disclaimer\n- **Text**: `-+OUTPUT_NOT_100%_TRUE+-`\n- **Location**: Bottom of chat window\n- **Purpose**: Reminds users that AI output may not be 100% accurate\n- **Styling**: Small monospace text, zinc-500 color\n\n### Technical Details\n\n**Model**: gpt-5.4-mini-2026-03-17 (with fallbacks to gpt-5-mini-2025-08-07, gpt-4o-mini)\n\n**System Prompt Features**:\n- Boss/nickname customization\n- Food emoji safeguard (prevents corruption)\n- RAG context injection for OpenServ queries\n- Instruction following and safety guidelines\n\n**API Endpoint**: `/api/chat` (POST)\n\n**Request Format**:\n```json\n{\n  \"messages\": [\n    { \"role\": \"user\", \"content\": \"Your question here\" }\n  ],\n  \"nickname\": \"Boss\"\n}\n```\n\n**Response Format**:\n```json\n{\n  \"message\": \"AI response text\",\n  \"model\": \"gpt-5.4-mini-2026-03-17\",\n  \"toolCalls\": 0,\n  \"responseTimeMs\": 1234\n}\n```\n\n---\n\n## Category-Based Cost Tracking\n\n### Overview\n\nIntelligent system that automatically categorizes API usage and tracks costs by category using gpt-5.4-nano.\n\n### Categories\n\n| Category | Purpose |\n|---|---|\n| **MattyJacks** | Questions about MattyJacks, the person, projects, or brand |\n| **GiveGigs** | GiveGigs platform or feature questions |\n| **CryptArtist** | CryptArtist Studio or related projects |\n| **OpenServ** | OpenServ, agents, or autonomous systems |\n| **Personal** | Personal questions, life advice, casual chat |\n| **Coding** | Programming, development, technical questions |\n| **Weird** | Unusual, strange, or absurd requests |\n| **Marketing** | Marketing strategy, branding, promotion |\n| **Mischief** | Playful, mischievous, or humorous requests |\n| **Other** | General topics not fitting above categories |\n| **Unknown** | Cannot determine category |\n\n### Features\n\n#### 1. AI Categorization\n- **Model**: gpt-5.4-nano (cost-efficient)\n- **Assignments**: 1-3 categories per prompt\n- **Reasoning**: Includes explanation of categorization\n- **Speed**: Fast, lightweight categorization\n\n#### 2. Cost Splitting\n- **2 Categories**: 50% cost split each\n- **3 Categories**: 33% cost split each\n- **Tokens**: Proportionally split across categories\n- **Requests**: Fractional request count per category\n\n#### 3. Live Dashboard\n- **Location**: Clout Calculator component\n- **Display**:\n  - Category name\n  - Cost in USD\n  - Percentage of total cost\n  - Request count\n- **Updates**: Real-time (every 2 seconds)\n- **Layout**: Responsive grid (2-4 columns)\n\n#### 4. Cost Metrics Tracked\n- Total requests\n- Total input tokens\n- Total output tokens\n- Total tokens (combined)\n- Total cost in USD\n- Cost per category\n- Percentage breakdown\n\n### Technical Details\n\n**Files**:\n- `lib/category-cost-tracker.ts` - Core tracking system\n- `lib/prompt-categorizer.ts` - AI categorization\n- `app/api/category-costs/route.ts` - API endpoint\n- `components/clout-calculations.tsx` - Dashboard display\n\n**Storage**: In-memory (production should use database)\n\n**API Endpoint**: `/api/category-costs` (GET)\n\n**Response Format**:\n```json\n{\n  \"categoryBreakdown\": [\n    {\n      \"category\": \"Coding\",\n      \"cost\": 0.45,\n      \"percentage\": 25.5,\n      \"requests\": 3.5\n    }\n  ]\n}\n```\n\n**Pricing** (gpt-5.4-mini):\n- Input: $0.075 per 1K tokens\n- Output: $0.30 per 1K tokens\n\n---\n\n## OpenServ RAG Integration\n\n### Overview\n\nComprehensive OpenServ documentation with intelligent retrieval-augmented generation (RAG) system.\n\n### Documentation Files\n\nLocated in `context/openserv/`:\n\n| File | Purpose |\n|---|---|\n| **README.md** | Overview, quick links, key resources |\n| **SDK.md** | TypeScript SDK features, installation, core concepts |\n| **AGENT_TUTORIAL.md** | Building agents, architecture, development workflow |\n| **API_CONCEPTS.md** | API patterns, action types, authentication, error handling |\n| **EXAMPLES.md** | Real-world agent examples and patterns |\n| **ARCHITECTURE.md** | System architecture, shadow agents, control levels |\n| **DEPLOYMENT.md** | Deployment strategies, monitoring, scaling, security |\n| **TROUBLESHOOTING.md** | Common issues, debugging, FAQ |\n\n### Features\n\n#### 1. Selective RAG Scanning\n- **Location**: `lib/openserv-rag.ts`\n- **Functionality**:\n  - Scans `.md` and `.txt` files in `/context/openserv/`\n  - Calculates relevance scores\n  - Extracts relevant snippets\n  - Returns top 3 most relevant matches\n  - Keyword grouping for better matching\n\n#### 2. Quick-Context Mini-AI\n- **Model**: gpt-5.4-nano\n- **Purpose**: Summarize relevant documentation\n- **Features**:\n  - Processes RAG context\n  - Generates concise summaries (2-3 sentences)\n  - Cost-efficient (nano model)\n  - Fallback to empty context if no matches\n\n#### 3. OpenServ Counter\n- **Location**: `lib/openserv-counter.ts`\n- **Features**:\n  - Tracks OpenServ prompt count\n  - 10% chance message display\n  - Shows total prompts and spend\n  - Shared across all users\n  - Example: \"This is the 3247th OpenServ prompt. MattyJacks has spent $32.48 teaching OpenServ.\"\n\n#### 4. Integration with Chat\n- **Automatic Detection**: Detects OpenServ queries\n- **Context Injection**: Adds relevant documentation to system prompt\n- **Cost Tracking**: Separate OpenServ cost tracking\n- **Counter Display**: 10% chance message appended to response\n\n### Technical Details\n\n**Files**:\n- `lib/openserv-rag.ts` - RAG scanning and matching\n- `lib/openserv-counter.ts` - Counter and messaging\n- `app/api/quick-context/route.ts` - Quick-context endpoint\n- `context/openserv/` - Documentation files\n\n**API Endpoint**: `/api/quick-context` (POST)\n\n**Request Format**:\n```json\n{\n  \"query\": \"How do I create an OpenServ agent?\"\n}\n```\n\n**Response Format**:\n```json\n{\n  \"context\": \"Summarized documentation context\",\n  \"isOpenserv\": true,\n  \"source\": \"quick-context-rag\"\n}\n```\n\n**Relevance Scoring**:\n- Exact phrase match: +10 points\n- Word-by-word match: +2 points per word\n- Keyword group match: +3 points per match\n\n---\n\n## API Endpoints\n\n### Chat Endpoint\n\n**Route**: `/api/chat`\n**Method**: POST\n**Purpose**: Send messages and receive AI responses\n\n**Request**:\n```typescript\n{\n  messages: Array<{\n    role: \"user\" | \"assistant\";\n    content: string;\n  }>;\n  nickname?: string;\n  requestedModel?: string;\n}\n```\n\n**Response**:\n```typescript\n{\n  message: string;\n  model: string;\n  toolCalls: number;\n  responseTimeMs: number;\n  debugLogs?: string[];\n}\n```\n\n### Category Costs Endpoint\n\n**Route**: `/api/category-costs`\n**Method**: GET\n**Purpose**: Fetch category cost breakdown\n\n**Response**:\n```typescript\n{\n  categoryBreakdown: Array<{\n    category: string;\n    cost: number;\n    percentage: number;\n    requests: number;\n  }>;\n}\n```\n\n### Quick Context Endpoint\n\n**Route**: `/api/quick-context`\n**Method**: POST\n**Purpose**: Get RAG-enhanced context for OpenServ queries\n\n**Request**:\n```typescript\n{\n  query: string;\n}\n```\n\n**Response**:\n```typescript\n{\n  context: string;\n  isOpenserv: boolean;\n  source: \"quick-context-rag\" | \"no-docs\";\n}\n```\n\n---\n\n## Architecture\n\n### Data Flow\n\n```\nUser Message\n    ↓\nChat API (/api/chat)\n    ↓\n├─→ Categorization (gpt-5.4-nano)\n│   └─→ Assign 1-3 categories\n│\n├─→ OpenServ Detection\n│   └─→ If OpenServ query:\n│       ├─→ RAG Scanning\n│       ├─→ Quick-Context Summary\n│       └─→ Counter Increment\n│\n├─→ OpenAI API Call (gpt-5.4-mini)\n│   └─→ Process with context\n│\n├─→ Cost Tracking\n│   ├─→ API Cost Tracker\n│   └─→ Category Cost Tracker\n│\n└─→ Response to User\n    └─→ Display in Chat UI\n```\n\n### Component Hierarchy\n\n```\nApp Layout\n├─ Navigation (z-index: 100)\n├─ Main Content\n│  └─ AnythingButton (Chat, z-index: 110)\n│     ├─ Message List\n│     ├─ Input Area\n│     ├─ Magic Prompts\n│     ├─ Food Emoji Button\n│     └─ Disclaimer\n└─ Footer\n   └─ CloutCalculations\n      ├─ View Stats\n      ├─ API Cost Tracking\n      └─ Category Cost Breakdown\n```\n\n---\n\n## Usage Examples\n\n### Example 1: Regular Chat\n\n**User Input**: \"What's the best way to optimize a React component?\"\n\n**Flow**:\n1. Message sent to `/api/chat`\n2. Categorized as \"Coding\" (100%)\n3. No OpenServ detection\n4. OpenAI processes with system prompt\n5. Response displayed with disclaimer\n6. Costs tracked under \"Coding\" category\n\n### Example 2: OpenServ Query\n\n**User Input**: \"How do I create an autonomous agent with OpenServ?\"\n\n**Flow**:\n1. Message sent to `/api/chat`\n2. Categorized as \"OpenServ\" (100%)\n3. OpenServ detected\n4. RAG scans documentation\n5. Quick-context summarizes relevant docs\n6. Context injected into system prompt\n7. OpenAI processes with enhanced context\n8. 10% chance: Counter message appended\n9. Costs tracked under \"OpenServ\" category\n\n### Example 3: Multi-Category Query\n\n**User Input**: \"I want to build a weird marketing campaign using AI agents\"\n\n**Flow**:\n1. Message sent to `/api/chat`\n2. Categorized as: \"Marketing\" (33%), \"Weird\" (33%), \"Coding\" (33%)\n3. Costs split equally across 3 categories\n4. OpenAI processes\n5. Response displayed\n6. Each category receives 33% of the cost\n\n---\n\n## Configuration\n\n### Environment Variables\n\n```bash\n# OpenAI API Key (required)\nOPENAI_API_KEY=sk-...\n\n# Optional: Custom model selection\nOPENAI_MODEL=gpt-5.4-mini-2026-03-17\n```\n\n### Customization\n\n**Magic Prompts**: Edit `components/short-prompts.ts`\n**Categories**: Edit `lib/category-cost-tracker.ts` (COST_CATEGORIES)\n**System Prompt**: Edit `app/api/chat/route.ts` (SYSTEM_PROMPT)\n**RAG Settings**: Edit `lib/openserv-rag.ts` (MAX_SNIPPET_LENGTH, MAX_RESULTS)\n\n---\n\n## Performance Metrics\n\n### Typical Response Times\n\n- Chat response: 1-3 seconds\n- Categorization: 200-500ms\n- RAG scanning: 50-150ms\n- Quick-context: 300-800ms\n\n### Token Usage\n\n- Average chat message: 150-300 tokens\n- Categorization: 50-100 tokens\n- RAG context: 200-500 tokens\n\n### Cost Estimates\n\n- Average chat: $0.01-0.05\n- Categorization: $0.001-0.002\n- Quick-context: $0.002-0.005\n\n---\n\n## Future Enhancements\n\n- [ ] Database persistence for cost tracking\n- [ ] User-specific cost tracking\n- [ ] Cost alerts and budgets\n- [ ] Advanced RAG with vector embeddings\n- [ ] Multi-language support\n- [ ] Custom category creation\n- [ ] Cost analytics and reporting\n- [ ] Conversation export/sharing\n\n---\n\nFor more information, see the individual feature documentation files.\n","wordCount":1575,"sizeKb":11.8},{"name":"IMPLEMENTATION-SUMMARY.md","slug":"IMPLEMENTATION-SUMMARY","content":"# MattyJacks.com Implementation Summary\n\n**Last Updated**: March 20, 2026\n\n## Project Overview\n\nMattyJacks.com is a comprehensive business website with integrated AI chat, intelligent cost tracking, and OpenServ documentation system. This document summarizes all implemented features and their current status.\n\n---\n\n## Completed Features\n\n### Phase 1: Core UI & UX Fixes ✅\n\n#### 1. Header Z-Index Fix\n- **Issue**: Navigation header (z-index: 100) was covering AI chat close button\n- **Solution**: Increased chat container z-index from 60 to 110\n- **File**: `components/anything-button.tsx` (line 1033)\n- **Status**: ✅ Complete\n\n#### 2. Chat Disclaimer\n- **Feature**: Added \"-+OUTPUT_NOT_100%_TRUE+-\" disclaimer at bottom of chat\n- **Purpose**: Reminds users that AI output may not be 100% accurate\n- **File**: `components/anything-button.tsx` (lines 1327-1331)\n- **Styling**: Small monospace text, zinc-500 color, bottom border\n- **Status**: ✅ Complete\n\n#### 3. OpenServ Documentation Folder\n- **Created**: `/context/openserv/` directory\n- **Files**: 5 initial markdown files\n- **Purpose**: Comprehensive OpenServ documentation for RAG system\n- **Status**: ✅ Complete\n\n### Phase 2: API Cost Tracking & OpenServ Counter ✅\n\n#### 1. API Cost Tracker\n- **File**: `lib/api-cost-tracker.ts`\n- **Features**:\n  - Tracks requests, input tokens, output tokens, total tokens, total cost\n  - Per-model tracking (gpt-5.4-mini, gpt-5-mini, gpt-4o-mini)\n  - OpenServ-specific cost tracking\n  - In-memory storage (production: use database)\n- **Status**: ✅ Complete\n\n#### 2. OpenServ Counter\n- **File**: `lib/openserv-counter.ts`\n- **Features**:\n  - Tracks OpenServ prompt count\n  - 10% chance message display\n  - Shows total prompts and spend\n  - Shared across all users\n- **Integration**: `app/api/chat/route.ts` (lines 822-828)\n- **Status**: ✅ Complete\n\n#### 3. Chat API Integration\n- **File**: `app/api/chat/route.ts`\n- **Additions**:\n  - Cost tracking imports (lines 6-7)\n  - Cost tracking logic (lines 810-817)\n  - OpenServ counter integration (lines 821-828)\n- **Status**: ✅ Complete\n\n### Phase 3: Quick-Context Mini-AI with RAG ✅\n\n#### 1. OpenServ RAG System\n- **File**: `lib/openserv-rag.ts`\n- **Features**:\n  - Selective document scanning (.md, .txt files)\n  - Relevance scoring algorithm\n  - Snippet extraction\n  - Top 3 results return\n  - Keyword grouping for better matching\n- **Status**: ✅ Complete\n\n#### 2. Quick-Context API Endpoint\n- **File**: `app/api/quick-context/route.ts`\n- **Features**:\n  - gpt-5.4-nano powered summarization\n  - RAG context processing\n  - OpenServ query detection\n  - Cost tracking\n- **Status**: ✅ Complete\n\n#### 3. Chat API RAG Integration\n- **File**: `app/api/chat/route.ts` (lines 679-686)\n- **Features**:\n  - Automatic OpenServ detection\n  - RAG context injection into system prompt\n  - Seamless integration with chat flow\n- **Status**: ✅ Complete\n\n### Phase 4: Enhanced Documentation ✅\n\n#### 1. Web Research & Documentation Enhancement\n- **Source**: Browsed OpenServ GitHub and documentation\n- **Files Enhanced**: SDK.md with advanced features\n- **Status**: ✅ Complete\n\n#### 2. New Documentation Files\n- **ARCHITECTURE.md**: System architecture, shadow agents, control levels (344 lines)\n- **DEPLOYMENT.md**: Deployment strategies, monitoring, scaling (400+ lines)\n- **TROUBLESHOOTING.md**: Common issues, debugging, FAQ (500+ lines)\n- **Status**: ✅ Complete\n\n### Phase 5: Category-Based Cost Tracking ✅\n\n#### 1. Category Cost Tracker\n- **File**: `lib/category-cost-tracker.ts`\n- **Categories**: 11 (MattyJacks, GiveGigs, CryptArtist, Other, Unknown, OpenServ, Personal, Coding, Weird, Marketing, Mischief)\n- **Features**:\n  - Per-category cost tracking\n  - Cost splitting (50% for 2 categories, 33% for 3)\n  - Request counting\n  - Token tracking per category\n  - Category breakdown with percentages\n- **Status**: ✅ Complete\n\n#### 2. Prompt Categorizer\n- **File**: `lib/prompt-categorizer.ts`\n- **Features**:\n  - gpt-5.4-nano powered categorization\n  - 1-3 category assignment per prompt\n  - Reasoning explanation\n  - JSON response parsing\n  - Error handling with fallback\n- **Status**: ✅ Complete\n\n#### 3. Category Costs API Endpoint\n- **File**: `app/api/category-costs/route.ts`\n- **Features**:\n  - GET endpoint for category breakdown\n  - Formatted response with cost, percentage, requests\n  - Security headers\n- **Status**: ✅ Complete\n\n#### 4. Chat API Category Integration\n- **File**: `app/api/chat/route.ts` (lines 813-817)\n- **Features**:\n  - Automatic categorization on each prompt\n  - Cost calculation and splitting\n  - Category cost tracking\n- **Status**: ✅ Complete\n\n#### 5. Clout Calculator Enhancement\n- **File**: `components/clout-calculations.tsx`\n- **Additions**:\n  - CategoryCostBreakdown interface (lines 27-32)\n  - categoryCosts state (line 51)\n  - Category cost fetching (lines 81-100)\n  - Category cost display section (lines 202-222)\n  - Responsive grid layout (2-4 columns)\n  - Live updates every 2 seconds\n- **Status**: ✅ Complete\n\n---\n\n## File Structure\n\n### New Files Created\n\n```\nmattyjacks7/\n├── lib/\n│   ├── api-cost-tracker.ts          # API cost tracking system\n│   ├── openserv-counter.ts          # OpenServ prompt counter\n│   ├── openserv-rag.ts              # RAG document scanning\n│   ├── category-cost-tracker.ts     # Category-based cost tracking\n│   └── prompt-categorizer.ts        # AI categorization system\n├── app/api/\n│   ├── chat/route.ts                # Enhanced with all tracking\n│   ├── quick-context/route.ts       # Quick-context RAG endpoint\n│   └── category-costs/route.ts      # Category costs API endpoint\n└── context/\n    ├── mattyjacks-website-README.md # Updated main README\n    ├── AI-FEATURES-README.md        # Comprehensive AI features doc\n    ├── IMPLEMENTATION-SUMMARY.md    # This file\n    └── openserv/\n        ├── README.md                # OpenServ overview\n        ├── SDK.md                   # SDK documentation\n        ├── AGENT_TUTORIAL.md        # Agent development guide\n        ├── API_CONCEPTS.md          # API patterns\n        ├── EXAMPLES.md              # Real-world examples\n        ├── ARCHITECTURE.md          # System architecture\n        ├── DEPLOYMENT.md            # Deployment guide\n        └── TROUBLESHOOTING.md       # Troubleshooting guide\n```\n\n### Modified Files\n\n```\nmattyjacks7/\n├── components/\n│   ├── anything-button.tsx          # Chat UI (z-index fix, disclaimer)\n│   └── clout-calculations.tsx       # Enhanced with category costs\n├── app/\n│   └── api/chat/route.ts            # All tracking integrations\n└── context/\n    └── mattyjacks-website-README.md # Updated with latest features\n```\n\n---\n\n## Build Status\n\n**Last Build**: March 20, 2026, 4:20 PM UTC-04:00\n**Status**: ✅ **SUCCESS**\n**Build Time**: 6.2s (Turbopack)\n**TypeScript**: ✅ Compiled successfully in 9.0s\n\n### Build Output\n- 31 static pages generated\n- 8 dynamic API routes\n- All routes compiled without errors\n- No lint errors or warnings\n\n---\n\n## API Endpoints Summary\n\n| Endpoint | Method | Purpose | Status |\n|---|---|---|---|\n| `/api/chat` | POST | Chat with AI, cost tracking | ✅ Complete |\n| `/api/quick-context` | POST | RAG-enhanced context retrieval | ✅ Complete |\n| `/api/category-costs` | GET | Fetch category cost breakdown | ✅ Complete |\n| `/api/views` | GET | View statistics | ✅ Existing |\n\n---\n\n## Feature Checklist\n\n### AI Chat System\n- ✅ Real-time chat interface\n- ✅ Magic prompt templates (20+)\n- ✅ Food emoji rewards\n- ✅ Short prompt suggestions with Regen button\n- ✅ Chat disclaimer\n- ✅ Responsive design\n- ✅ Dark/light mode support\n\n### Cost Tracking\n- ✅ API cost tracker (requests, tokens, cost)\n- ✅ Per-model tracking\n- ✅ OpenServ-specific tracking\n- ✅ Category-based tracking (11 categories)\n- ✅ Cost splitting (50%/33%)\n- ✅ Live dashboard display\n- ✅ Real-time updates (2-second refresh)\n\n### OpenServ Integration\n- ✅ 8 comprehensive documentation files\n- ✅ Selective RAG scanning\n- ✅ Quick-context mini-AI (gpt-5.4-nano)\n- ✅ OpenServ counter (10% chance message)\n- ✅ Automatic context injection\n- ✅ Separate cost tracking\n\n### UI/UX Improvements\n- ✅ Header z-index fix (chat above nav)\n- ✅ Chat disclaimer\n- ✅ Clout Calculator enhancement\n- ✅ Category cost breakdown display\n- ✅ Responsive grid layout\n- ✅ Live metrics updates\n\n---\n\n## Performance Metrics\n\n### Response Times\n- Chat response: 1-3 seconds\n- Categorization: 200-500ms\n- RAG scanning: 50-150ms\n- Quick-context: 300-800ms\n\n### Token Usage\n- Average chat message: 150-300 tokens\n- Categorization: 50-100 tokens\n- RAG context: 200-500 tokens\n\n### Cost Estimates\n- Average chat: $0.01-0.05\n- Categorization: $0.001-0.002\n- Quick-context: $0.002-0.005\n\n---\n\n## Known Limitations & Future Improvements\n\n### Current Limitations\n- Cost tracking uses in-memory storage (no persistence)\n- Category data resets on server restart\n- No user-specific cost tracking\n- No cost alerts or budgets\n\n### Planned Enhancements\n- [ ] Database persistence for cost tracking\n- [ ] User-specific cost tracking\n- [ ] Cost alerts and budgets\n- [ ] Advanced RAG with vector embeddings\n- [ ] Multi-language support\n- [ ] Custom category creation\n- [ ] Cost analytics and reporting\n- [ ] Conversation export/sharing\n- [ ] Memory leak investigation (profile pages, chat components)\n\n---\n\n## Documentation Files\n\n### Main README\n- **File**: `context/mattyjacks-website-README.md`\n- **Size**: 796 lines\n- **Updates**: Added Latest Features section with AI Chat, Category Tracking, OpenServ RAG\n\n### AI Features README\n- **File**: `context/AI-FEATURES-README.md`\n- **Size**: 500+ lines\n- **Content**: Comprehensive guide to all AI features, APIs, architecture, usage examples\n\n### Implementation Summary\n- **File**: `context/IMPLEMENTATION-SUMMARY.md`\n- **Size**: This document\n- **Content**: Complete overview of all implemented features and current status\n\n### OpenServ Documentation\n- **Location**: `context/openserv/`\n- **Files**: 8 markdown files\n- **Total Lines**: 1500+\n- **Coverage**: Complete OpenServ ecosystem documentation\n\n---\n\n## Testing & Verification\n\n### Build Verification\n```bash\nnpm run build\n# Result: ✅ SUCCESS (6.2s)\n```\n\n### Feature Testing Checklist\n- ✅ Chat interface loads and responds\n- ✅ Magic prompts display and work\n- ✅ Food emoji button functions\n- ✅ Chat disclaimer displays\n- ✅ Cost tracking calculates correctly\n- ✅ Categories assign properly\n- ✅ Clout Calculator displays categories\n- ✅ OpenServ detection works\n- ✅ RAG context injects correctly\n- ✅ Counter message displays (10% chance)\n\n---\n\n## Deployment Notes\n\n### Environment Variables Required\n```bash\nOPENAI_API_KEY=sk-...\n```\n\n### Deployment Checklist\n- ✅ All files created and integrated\n- ✅ Build passes without errors\n- ✅ No TypeScript errors\n- ✅ Security headers configured\n- ✅ API endpoints functional\n- ✅ Database ready (in-memory for now)\n\n### Post-Deployment\n- Monitor API costs and usage\n- Track category distribution\n- Watch for memory leaks\n- Collect user feedback on AI features\n\n---\n\n## Contact & Support\n\nFor questions or issues related to:\n- **AI Chat**: See `components/anything-button.tsx`\n- **Cost Tracking**: See `lib/api-cost-tracker.ts` and `lib/category-cost-tracker.ts`\n- **OpenServ**: See `context/openserv/` documentation\n- **General**: See `context/mattyjacks-website-README.md`\n\n---\n\n## Version History\n\n| Date | Version | Changes |\n|---|---|---|\n| 2026-03-20 | 1.0.0 | Initial release with all features |\n| 2026-03-19 | 0.5.0 | Phase 3 & 4 complete (RAG, docs) |\n| 2026-03-19 | 0.3.0 | Phase 2 complete (cost tracking) |\n| 2026-03-19 | 0.1.0 | Phase 1 complete (UI fixes) |\n\n---\n\n**Status**: Production Ready ✅\n**Last Updated**: March 20, 2026, 4:25 PM UTC-04:00\n","wordCount":1622,"sizeKb":11.7},{"name":"contact-channels.md","slug":"contact-channels","content":"# MattyJacks Contact Channels\n\nThis document catalogs the official contact channels and support pathways for MattyJacks clients, partners, and team members.\n\n## Main Phone Line\n- **Number**: `603-999-9420` (USA)\n- **Guidelines**: Calls only. Strictly **no texts** (texts sent to this line are not monitored).\n\n## WhatsApp Support (Public / Interns)\n- **Direct WA Number**: `+1 (510) 600-5735`\n- **Guidelines**: Standard messaging support. No calling without permission.\n\n## Telegram Communications\n- **Direct User**: `@MattyJacks` (For quick B2B outreach and support)\n- **Public Telegram Channel**: `https://t.me/mattyjacks1`\n\n## Social Media\n- **X / Twitter**: `@MattyJacksX` (Latest ecosystem news and announcements)\n\n## Email Addresses\n- **Founder**: `Matt@MattyJacks.com`\n- **General Support**: `support@MattyJacks.com`\n","wordCount":107,"sizeKb":0.8},{"name":"cryptartist-studio-README.md","slug":"cryptartist-studio-README","content":"<div align=\"center\">\n\n# CryptArtist Studio\n\n### The Open Creative Suite - Powered by Community\n\n**Website:** [mattyjacks.com](https://mattyjacks.com) | **GitHub:** [github.com/mattyjacks/CryptArtistStudio](https://github.com/mattyjacks/CryptArtistStudio) | **Contact:** [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n\n---\n\n**CryptArtist Studio** is a free, open-source, professional-grade creative suite built with\nTauri v2, React 18, TypeScript, and Rust. It bundles eleven powerful programs into a single\ndesktop application: a video/image editor, a vibe-coding IDE, a screen recorder, an\nautonomous AI agent, an integrated game development studio, a terminal-based command center,\na P2P compute-sharing tool, an installer builder, a GIMP-style image editor with AI, a\nluck-based AI seed generator, and a full settings hub.\n\nThe project is community-funded through donations at\n[mattyjacks.com](https://mattyjacks.com) and [givegigs.com](https://givegigs.com).\n\n</div>\n\n---\n\n## Table of Contents\n\n- [Overview](#overview)\n- [Programs in the Suite](#programs-in-the-suite)\n  - [Media Mogul](#media-mogul--mmo)\n  - [VibeCodeWorker](#vibecodeworker--vcw)\n  - [DemoRecorder](#demorecorder--dre)\n  - [ValleyNet](#valleynet--vnt)\n  - [GameStudio](#gamestudio--gst)\n  - [CryptArt Commander](#cryptart-commander--cac)\n  - [DonatePersonalSeconds](#donatepersonalseconds--dps)\n  - [Clone Tool](#clone-tool--cln)\n  - [DictatePic](#dictatepic--dc)\n  - [Luck Factory](#luck-factory--lck)\n  - [Settings](#settings--set)\n- [Workspace Management](#workspace-management)\n  - [Multi-File Workspaces](#multi-file-workspaces)\n  - [Workspace Groups and Resource Sharing](#workspace-groups-and-resource-sharing)\n- [Plugin, Mod, and Theme System](#plugin-mod-and-theme-system)\n  - [Plugins](#plugins)\n  - [Mods](#mods)\n  - [Themes](#themes)\n- [The .CryptArt File Format](#the-cryptart-file-format)\n  - [Format Overview](#format-overview)\n  - [Required Fields](#required-fields)\n  - [Recommended Fields](#recommended-fields)\n  - [Optional Fields](#optional-fields)\n  - [Meta Object](#meta-object)\n  - [Backward Compatibility](#backward-compatibility)\n  - [Example Files](#example-files)\n- [Technology Stack](#technology-stack)\n  - [Frontend](#frontend)\n  - [Backend (Rust)](#backend-rust)\n  - [Media Engine](#media-engine)\n  - [Build System](#build-system)\n- [Project Architecture](#project-architecture)\n  - [Directory Structure](#directory-structure)\n  - [Frontend Architecture](#frontend-architecture)\n  - [Backend Architecture](#backend-architecture)\n  - [State Management](#state-management)\n- [Getting Started](#getting-started)\n  - [Prerequisites](#prerequisites)\n  - [Installation](#installation)\n  - [Development Mode](#development-mode)\n  - [Building for Production](#building-for-production)\n  - [Platform Support](#platform-support)\n- [CLI Reference](#cli-reference)\n  - [Global Commands](#global-commands)\n  - [Project Management](#project-management-commands)\n  - [Media Commands](#media-commands)\n  - [AI Commands](#ai-commands)\n  - [File System Commands](#file-system-commands)\n  - [Server Commands](#server-commands)\n  - [System Commands](#system-commands)\n- [REST API Reference](#rest-api-reference)\n  - [Starting the Server](#starting-the-server)\n  - [Endpoints](#endpoints)\n  - [Authentication](#authentication)\n- [Configuration](#configuration)\n  - [API Keys](#api-keys)\n  - [FFmpeg Setup](#ffmpeg-setup)\n  - [Godot Integration](#godot-integration)\n  - [Tauri Configuration](#tauri-configuration)\n- [Logging System](#logging-system)\n  - [Log Files](#log-files)\n  - [Log Levels](#log-levels)\n  - [Frontend Logging](#frontend-logging)\n- [Keyboard Shortcuts](#keyboard-shortcuts)\n- [OpenRouter Multi-Model AI Integration](#openrouter-multi-model-ai-integration)\n  - [Supported Providers](#supported-providers)\n  - [Model Selection](#model-selection)\n  - [Fallback Behavior](#fallback-behavior)\n- [Security Hardening](#security-hardening)\n  - [Overview of 300 Vulnerability Fixes](#overview-of-300-vulnerability-fixes)\n  - [Security Utility Module](#security-utility-module)\n  - [Content Security Policy](#content-security-policy)\n  - [REST API Security Headers](#rest-api-security-headers)\n  - [Input Validation Summary](#input-validation-summary)\n- [CryptArtist Studio Website](#cryptartist-studio-website)\n  - [Website Pages](#website-pages)\n  - [Website Technology](#website-technology)\n- [Privacy Policy and Terms of Use](#privacy-policy-and-terms-of-use)\n- [Contributing](#contributing)\n  - [Development Workflow](#development-workflow)\n  - [Code Style](#code-style)\n  - [Pull Requests](#pull-requests)\n- [Troubleshooting](#troubleshooting)\n- [Performance Optimization](#performance-optimization)\n- [Prompt History](#prompt-history)\n- [Related Projects and Links](#related-projects-and-links)\n- [Roadmap](#roadmap)\n- [Future Plans](#future-plans)\n  - [New Programs (CꜴS, SLM, BRD, MKT, NET, SYN, TRN, ARK, COM)](#new-programs)\n  - [Existing Program Enhancements](#existing-program-enhancements)\n  - [Platform and Infrastructure](#platform-and-infrastructure)\n  - [AI and Machine Learning](#ai-and-machine-learning)\n  - [Community and Ecosystem](#community-and-ecosystem)\n- [Detailed CꜴS Plan](#detailed-cꜴs-plan)\n- [Detailed SLM Plan](#detailed-slm-plan)\n- [License](#license)\n- [Credits](#credits)\n\n---\n\n## Overview\n\nCryptArtist Studio started as a DaVinci Resolve competitor - a professional video editor\nwith AI integration. It has since evolved into a full creative suite with eleven distinct\nprograms, all sharing a unified dark theme, a common project file format (`.CryptArt`),\nand deep AI integration powered by the user's own API keys.\n\n### Key Highlights\n\n- **Eleven Programs in One** - Video editing, code editing, screen recording, AI agent,\n  game development, terminal commander, P2P compute sharing, installer builder, AI image\n  editor, luck seed generator, and a settings hub all in a single ~15 MB download.\n- **Security Hardened** - 300 vulnerability fixes across frontend and backend,\n  including CSP, input validation, rate limiting, XSS prevention, audit logging,\n  encrypted storage, SVG sanitization, WebSocket monitoring, and API guards.\n- **AI-Powered Everything** - Every program integrates with OpenAI, Anthropic, Google,\n  or any OpenAI-compatible API endpoint. Users bring their own keys.\n- **The .CryptArt File Format** - A permanently future-proof JSON project file that\n  will never need a format upgrade. Any `.CryptArt` file ever created will always be\n  readable by any version of the app.\n- **Cross-Platform** - Runs on Windows, macOS, and Linux via Tauri. Planned launches\n  on 100+ platforms including Steam (PC/Mac/Linux/Deck), iOS, Android, Xbox, PS5,\n  Nintendo Switch 1 & 2, Smart TVs, Chromebook, Raspberry Pi, Arduino, calculators,\n  smart watches, VR headsets, web browsers, Docker, and more. See\n  [Platform Launch Plans](#platform-launch-plans---every-platform-possible) for the full list.\n- **Full CLI and REST API** - Every feature is accessible from the command line or via\n  HTTP API, enabling integration with other AI tools and automation pipelines.\n- **Comprehensive Logging** - Three rolling log files track everything: a session log,\n  a recent log (last 1,000 lines), and a full history log.\n- **Community-Funded** - No subscriptions, no ads. Supported by donations at\n  [mattyjacks.com](https://mattyjacks.com) and [givegigs.com](https://givegigs.com).\n- **Open Source** - CryptArtist Custom License v1.69.420.3. Fork it, extend it, make it yours.\n\n### Philosophy\n\nCryptArtist Studio is built on the belief that creative tools should be:\n\n1. **Free** - No paywalls, no feature gates, no \"pro\" tiers.\n2. **Open** - CryptArtist Custom License v1.69.420.3, fully auditable, community-driven.\n3. **Permanent** - File formats that never break, software that respects your work.\n4. **AI-Native** - AI is not bolted on; it is woven into every workflow.\n5. **User-Controlled** - Your API keys, your data, your machine. No cloud dependency.\n\n### Recent Updates (March 2026)\n\n**GameStudio Enhancements:**\n- ✅ Upgraded to **Godot 4.6.1** (latest stable release)\n- ✅ **Custom Godot Path Browser** - Users can now browse and select custom Godot executable paths\n- ✅ **Godot Path Verification** - Backend validates custom paths before use\n- ✅ **Improved Godot Not Found Dialog** - Four options: Download, Browse, Rescan, or Continue\n- ✅ **GPT-5 Mini Default** - All AI code generation now uses GPT-5 Mini for better performance\n\n**VibeCodeWorker Improvements:**\n- ✅ **Shared API Keys** - Now uses centralized API keys from CryptArtist Studio Settings\n- ✅ **Removed Duplicate Configuration** - No need to set API keys per-program\n- ✅ **Better Status Indicators** - Settings panel shows available API keys (OpenAI, OpenRouter, etc.)\n- ✅ **GPT-5 Mini Default** - AI assistant defaults to GPT-5 Mini model\n- ✅ **Cleaner UI** - Simplified settings panel with clear API key status\n\n**System-Wide Updates:**\n- ✅ **GPT-5 Mini as Default AI Model** - All programs now default to `openai/gpt-5-mini`\n- ✅ **Centralized API Key Management** - All programs share keys from Settings\n- ✅ **Production Build Ready** - Latest .exe built and tested (v1.69.420)\n- ✅ **Security Hardening** - 300+ vulnerability fixes across frontend and backend\n\n---\n\n## Programs in the Suite\n\nWhen you launch CryptArtist Studio, you are greeted by the **Suite Launcher [🗺️SLr]** - a\nfull-window launcher displaying the CryptArtist logo and twelve program cards.\nThe Suite Launcher is itself a launchable program from within the grid.\nEach card shows the program's emoji logo, name, short code, and a one-line description.\nThe launcher includes search and filter, favorites, category sorting, grid/list views,\na rotating tips carousel, keyboard shortcuts overlay, system status indicators, and\nan AI readiness indicator.\n\n| # | Program | Emoji | Code | Shortcut | Description |\n|---|---|---|---|---|---|\n| - | **Suite Launcher** | Map | SLr | `Home` | The home screen - launch programs, open .CryptArt files, view status |\n| 1 | **Media Mogul** | TV | MMo | `1` | Video editor, image editor, and AI-powered media studio |\n| 2 | **VibeCodeWorker** | Technologist | VCW | `2` | Your personal vibe-coding IDE powered by your own API keys |\n| 3 | **DemoRecorder** | Camera | DRe | `3` | Screen recorder and live streamer for demos and gaming |\n| 4 | **ValleyNet** | Person | VNt | `4` | Autonomous AI agent that can do anything on your computer |\n| 5 | **GameStudio** | Game Controller | GSt | `5` | Combined media + code + Godot engine for game development |\n| 6 | **CryptArt Commander** | Cat | CAC | `6` | Terminal-based command center for API and CLI control |\n| 7 | **DonatePersonalSeconds** | Computer | DPS | `7` | P2P compute resource sharing for distributed tasks |\n| 8 | **Clone Tool** | Package | CLN | `9` | Create .exe, .dmg, .deb installers from your config |\n| 9 | **DictatePic** | Pie | D(pi)c | `-` | GIMP-style image editor with AI generation, inpainting, and style transfer |\n| 10 | **Luck Factory** | Clover | Lck | `-` | AI luck seed generator with guided meditation and affirmations |\n| 11 | **Settings** | Gear | Set | `0` | API key management, OpenRouter, appearance, and data |\n\nThe Suite Launcher [🗺️SLr] also displays a donation banner encouraging users to support\ndevelopment at [mattyjacks.com](https://mattyjacks.com) and\n[givegigs.com](https://givegigs.com).\n\n#### Suite Launcher [SLr] Features\n\n- **Search and Filter** - Type to search programs by name, code, description, or tags\n- **Category Filter** - Filter by category tags (all, video, code, ai, media, game, tools)\n- **Sort Options** - Sort by default, A-Z, most used, or favorites first\n- **Grid/List View** - Toggle between card grid and compact list layouts\n- **Favorites** - Star programs for quick access; persisted in localStorage\n- **Launch Count Tracking** - Tracks how many times each program is launched\n- **Time-Based Greeting** - Dynamic greeting based on time of day\n- **Rotating Tips** - 14 tips rotate every 8 seconds with usage hints\n- **Keyboard Shortcuts Overlay** - Press `?` to see all shortcuts\n- **Recent Projects Panel** - Press `R` to see recently opened `.CryptArt` files\n- **Quick Actions Dropdown** - Access recent projects, shortcuts, cache clear, and GitHub\n- **System Status** - Shows FFmpeg, Godot, and AI (OpenRouter/OpenAI) status\n- **Open .CryptArt Files** - Multi-file open dialog that creates workspaces\n- **Accent Color** - Configurable accent color theme\n- **Uptime Display** - Shows session uptime in the status bar\n\n---\n\n### Media Mogul - MMo\n\n**Media Mogul** is the flagship program of CryptArtist Studio. It is a professional-grade\nvideo editor, image editor, and AI-powered media production studio with an integrated\nPodcast & Audio Lab powered by ElevenLabs.\n\n#### Workspaces\n\nMedia Mogul is organized into seven workspaces, each accessible from the header tabs:\n\n| Workspace | Description |\n|---|---|\n| **Edit** | Timeline-based video editing with multi-track support |\n| **Node Mode** | Node-based compositing pipeline for advanced visual effects |\n| **Color** | Color grading and correction tools |\n| **Audio** | Audio editing, mixing, and waveform visualization |\n| **AI Studio** | AI-powered video generation, voiceover, captioning, and scripting |\n| **Podcast** | ElevenLabs voice generation, speech-to-text, and sound effects lab |\n| **Deliver** | Export settings, format selection, and render queue |\n\n#### Features\n\n- **Multi-Track Timeline** - Drag-and-drop clips onto a layered timeline with\n  snap-to-grid, trimming, splitting, and ripple editing.\n- **Node-Based Compositing** - A directed acyclic graph (DAG) editor for chaining\n  visual effects, color corrections, and transformations.\n- **AI Studio Mode** - Generate complete videos from a text prompt:\n  - AI selects stock footage from Pexels\n  - AI writes voiceover scripts\n  - AI generates captions and subtitles\n  - AI suggests background music from GiveGigs media bucket\n  - AI creates podcast scripts and music compositions\n- **Podcast & Audio Lab (ElevenLabs)**:\n  - Text-to-speech voiceover generation with selectable voice/model\n  - Speech-to-text transcription for uploaded audio files\n  - Sound effects generation from text prompts\n  - Voice/model catalog fetch (from ElevenLabs API)\n  - Generated audio output tracking for quick reuse in timeline workflows\n- **Pexels Integration** - Search and import photos and videos from Pexels directly\n  into your project. Multiple resolution options for video.\n- **GiveGigs Media Bucket** - Connect to a GiveGigs.com Supabase bucket for royalty-free\n  music, sound effects, and media assets.\n- **Image Generation** - Generate images using the OpenAI API (DALL-E) with custom\n  prompts or AI-assisted prompt refinement.\n- **FFmpeg-Powered** - All encoding, decoding, and transcoding is handled by FFmpeg,\n  which is automatically downloaded on first run.\n- **Export Options** - Export to MP4, WebM, GIF, PNG sequence, and more with\n  configurable resolution, bitrate, and codec settings.\n\n#### .CryptArt Data Payload (Media Mogul)\n\nWhen Media Mogul saves a `.CryptArt` file, the `data` object contains:\n\n```json\n{\n  \"workspace\": \"edit\",\n  \"timeline\": { ... },\n  \"mediaPool\": [ ... ],\n  \"nodeGraph\": { ... },\n  \"colorGrade\": { ... },\n  \"exportSettings\": { ... }\n}\n```\n\n---\n\n### VibeCodeWorker - VCW\n\n**VibeCodeWorker** is a full-featured vibe-coding IDE built into CryptArtist Studio.\nIt is modeled after VS Code and Windsurf, using the MIT-licensed Monaco Editor as its\ncode editing engine. VibeCodeWorker now uses shared API keys from CryptArtist Studio Settings,\neliminating the need for per-program API key configuration.\n\n#### Layout\n\nThe VibeCodeWorker window is divided into four main areas:\n\n| Area | Position | Description |\n|---|---|---|\n| **File Explorer** | Left sidebar (200px) | Tree view of the project directory |\n| **Editor** | Center | Monaco Editor with syntax highlighting, minimap, bracket colorization |\n| **Bottom Panel** | Below editor (200px) | Tabbed panel with 5 sub-panels |\n| **AI Chat** | Right sidebar (300px) | AI assistant with context-aware code help (uses GPT-5 Mini by default) |\n\n#### API Key Management\n\n- **Shared API Keys** - VibeCodeWorker uses the same API keys configured in CryptArtist Studio Settings\n- **Supported Providers** - OpenAI, Anthropic, Google, OpenRouter\n- **Default Model** - GPT-5 Mini (openai/gpt-5-mini)\n- **Status Indicators** - Settings panel shows which API keys are available\n- **No Duplication** - Configure once in Settings, use everywhere in the suite\n\n#### Bottom Panel Tabs\n\n| Tab | Description |\n|---|---|\n| **Terminal** | Built-in terminal with basic commands (clear, pwd, help) |\n| **Problems** | Auto-scanning lint diagnostics that run on every file change |\n| **Testing** | AI-powered + pattern-based test runner with auto-test on save |\n| **Web Audit** | Lighthouse-style website quality analysis (Performance, Accessibility, SEO, Best Practices) |\n| **Search** | Cross-file search and replace with regex and case-sensitivity toggles |\n\n#### Testing Panel\n\nThe Testing panel provides two modes of analysis:\n\n**AI-Powered Testing** (requires API key):\n- Analyzes the current file for potential bugs, edge cases, and coverage gaps\n- Checks for: null safety, error handling, boundary conditions, type safety,\n  security issues, race conditions\n- Returns 5-15 individual test checks with pass/fail/warning status\n\n**Pattern-Based Testing** (no API key required):\n- Detects test files (`.test.`, `.spec.`, `_test.`, `test_` patterns)\n- Counts assertions (`expect()`, `assert()`)\n- Flags TypeScript `any` usage\n- Flags empty catch blocks\n\n**Auto-Test on Save**:\n- Toggle the \"Auto-test on save\" checkbox\n- Every file save automatically triggers a test run\n- Status bar shows \"Auto-test ON\" when enabled\n\n#### Web Audit Panel\n\nThe Web Audit panel provides Google Lighthouse-style website analysis:\n\n**AI-Powered Audit** (requires API key):\n- Scores from 0-100 for: Performance, Accessibility, Best Practices, SEO\n- 15-25 individual checks covering:\n  - Page load optimizations\n  - Image alt tags and semantic HTML\n  - ARIA roles and keyboard navigation\n  - Meta tags, viewport, HTTPS\n  - CSP headers, font loading\n  - Mobile responsiveness\n  - Heading hierarchy, link text, form labels\n\n**Pattern-Based Audit** (no API key required):\n- Checks HTML files for viewport meta, title tag, lang attribute, image alt attributes\n\nColor-coded score display:\n- Green (90+): Excellent\n- Yellow (50-89): Needs improvement\n- Red (0-49): Poor\n\n#### Problem Scanner\n\nThe Problems panel automatically scans all open files for:\n\n| Check | Severity | Description |\n|---|---|---|\n| `console.log()` | Warning | Console.log statements left in non-test code |\n| `TODO/FIXME/HACK/XXX` | Info | Task comments that need attention |\n| Lines > 200 chars | Warning | Excessively long lines |\n| `debugger` | Error | Debugger statements left in code |\n| Empty catch blocks | Warning | Error swallowing without handling |\n\n#### Supported Languages\n\nMonaco Editor provides syntax highlighting for:\n\nTypeScript, JavaScript, Python, Rust, JSON, Markdown, HTML, CSS, SCSS, TOML,\nYAML, Shell/Bash, SQL, Go, Java, C, C++, XML, SVG, and plaintext.\n\n#### AI Assistant\n\nThe AI chat panel supports multiple providers:\n\n| Provider | Models |\n|---|---|\n| **OpenAI** | GPT-5 Mini (default), gpt-4o, gpt-4-turbo, gpt-3.5-turbo, etc. |\n| **Anthropic** | Claude models |\n| **Google** | Gemini models |\n| **Custom** | Any OpenAI-compatible endpoint |\n\nThe AI assistant automatically includes the currently open file as context (up to 8,000\ncharacters) when answering questions. All AI features use the shared API keys from Settings.\n\n#### .CryptArt Data Payload (VibeCodeWorker)\n\n```json\n{\n  \"rootPath\": \"/path/to/project\",\n  \"openFiles\": [\n    { \"path\": \"/path/to/file.ts\", \"name\": \"file.ts\" }\n  ],\n  \"activeFile\": \"/path/to/file.ts\",\n  \"model\": \"openai/gpt-5-mini\"\n}\n```\n\n---\n\n### DemoRecorder - DRe\n\n**DemoRecorder** is a screen recording and live streaming tool designed for software\ndemos, gaming clips, and content creation.\n\n#### Features\n\n- **Screen Recording** - Record your entire screen or a specific window with\n  configurable resolution and frame rate.\n- **Recording Controls** - Start, Pause, Stop buttons with a live timer display.\n- **Resolution Presets** - 720p, 1080p, 1440p, 4K, or custom resolution.\n- **FPS Options** - 24, 30, 60, or 120 frames per second.\n- **Live Streaming** - Stream to Twitch, YouTube Live, or Google Meet using\n  RTMP URL and stream key.\n- **Input Logger Plugin** - Optional plugin that records keyboard and mouse events\n  in a structured JSON log, timestamped to video frames. Designed for training AI\n  models to replicate human computer interactions.\n  **Warning:** This feature logs all keystrokes. A clear warning is shown when enabling.\n- **Integration Links** - Quick links to GiveGigs.com and SiteFari.com for publishing\n  and sharing recorded demos.\n\n#### Streaming Targets\n\n| Platform | Connection Method |\n|---|---|\n| **Twitch** | RTMP URL + Stream Key |\n| **YouTube Live** | RTMP URL + Stream Key |\n| **Google Meet** | Meeting URL + Credentials |\n\n#### .CryptArt Data Payload (DemoRecorder)\n\n```json\n{\n  \"resolution\": \"1920x1080\",\n  \"fps\": 60,\n  \"format\": \"mp4\",\n  \"streamTargets\": [ ... ],\n  \"inputLoggerEnabled\": false,\n  \"recordings\": [ ... ]\n}\n```\n\n---\n\n### ValleyNet - VNt\n\n**ValleyNet** is an autonomous AI agent inspired by OpenClaw - the open-source\nself-hosted AI agent that executes real-world tasks via LLMs. ValleyNet brings\nthis concept directly into CryptArtist Studio.\n\n#### Features\n\n- **Natural Language Task Execution** - Type tasks in plain English:\n  \"Research competitors and summarize findings\",\n  \"Send this file to my Discord channel\",\n  \"Book a meeting for Thursday\".\n- **Skills Marketplace** - Browse, install, and manage agent skills. Each skill\n  is a directory containing a `SKILL.md` manifest file.\n- **Browser Automation** - An embedded webview that ValleyNet can control to\n  browse the web, fill forms, scrape data, and interact with sites.\n- **Service Integrations** - Connect to Discord, Slack, Telegram, WhatsApp,\n  Gmail, Google Calendar, and any webhook URL.\n- **Task Memory** - Persistent context that carries across sessions, with a\n  full task history and memory log.\n\n#### Supported Integrations\n\n| Service | Connection Method |\n|---|---|\n| **Discord** | Bot token or webhook URL |\n| **Slack** | Bot token or webhook URL |\n| **Telegram** | Bot token |\n| **WhatsApp** | WhatsApp Business API |\n| **Gmail** | OAuth2 or app password |\n| **Google Calendar** | OAuth2 |\n| **Custom Webhook** | Any HTTP endpoint |\n\n#### .CryptArt Data Payload (ValleyNet)\n\n```json\n{\n  \"skills\": [ ... ],\n  \"taskHistory\": [ ... ],\n  \"memory\": { ... },\n  \"integrations\": { ... },\n  \"browserState\": { ... }\n}\n```\n\n---\n\n### GameStudio - GSt\n\n**GameStudio** is the newest program in the suite. It combines the capabilities of\nMedia Mogul and VibeCodeWorker with Godot 4.6.1 Engine integration to enable AI-powered\ngame development. It features a custom Godot installation finder with file browser support.\n\n#### Features\n\n- **Three-Panel Layout** - Asset editor (Media Mogul), code editor (VibeCodeWorker),\n  and Godot Engine side by side in a configurable layout.\n- **Godot 4.6.1 Integration** - Automatically detects Godot 4.6.1 or allows custom path\n  selection via file browser. Launch, manage, and interact with Godot projects from\n  within CryptArtist Studio.\n- **Custom Godot Path Browser** - If Godot is not found on the system, users can:\n  - Download Godot 4.6.1 from the official website\n  - Browse for a custom Godot executable path\n  - Rescan the system for automatic detection\n  - Continue working without Godot (code editing only)\n- **AI Game Generation** - Describe a game concept in natural language and the AI\n  will generate GDScript code, scene files, and asset suggestions using GPT-5 Mini.\n- **Project Templates** - Start from pre-built templates for 2D platformers,\n  top-down RPGs, puzzle games, and more.\n- **Asset Pipeline** - Use Media Mogul's AI image generation to create sprites,\n  textures, and UI elements, then import them directly into Godot.\n- **Video Game Cloner** - Generate completely original games based on the mechanics\n  (not lore, art, or copyrighted content) of any existing video game. See below.\n\n#### Video Game Cloner\n\nThe **Video Game Cloner** is a powerful AI-assisted tool inside GameStudio that\ncreates entirely original video games inspired by the *mechanics* of existing games.\nIt uses publicly available information (Wikipedia, wikis, gameplay descriptions) to\nunderstand game mechanics and then generates a fresh, original game with no\ncopyrighted or patented content.\n\n**How It Works:**\n\n1. **Input** - Enter the name of any video game (e.g., \"Tetris\", \"Pac-Man\", \"Portal\")\n2. **Research** - The system fetches the Wikipedia page and all publicly available\n   gameplay descriptions, mechanic breakdowns, and genre classifications\n3. **Analyze** - AI extracts the core *mechanics* (movement, scoring, physics, rules)\n   while explicitly filtering out all lore, characters, art, music, and trademarks\n4. **Generate (Phase 1: Emoji Graphics)** - On first run, the game is generated with\n   emoji-based graphics for instant playability. Emoji sprites, emoji backgrounds,\n   emoji UI elements - a fully playable game in minutes\n5. **Generate (Phase 2: AI 3D Graphics)** - AI generates basic 3D models, textures,\n   and environments to replace emoji placeholders with original visual assets\n6. **Export** - The finished game is a complete Godot project ready for distribution\n\n**What Gets Cloned:**\n- Core gameplay mechanics (movement, physics, rules, win/loss conditions)\n- Genre conventions (platformer, puzzle, shooter, RPG, etc.)\n- Game design patterns (progression systems, difficulty curves, control schemes)\n- UI/UX paradigms (HUD layout concepts, menu flow patterns)\n\n**What Never Gets Cloned:**\n- Characters, names, or likenesses\n- Story, lore, dialogue, or narrative elements\n- Art assets, sprites, textures, or visual designs\n- Music, sound effects, or audio\n- Patented game mechanics (clearly flagged and avoided)\n- Trademarked terms or branding\n\n**Legal Disclaimer (shown on first run):**\n\n> **IMPORTANT LEGAL NOTICE**\n>\n> The Video Game Cloner is designed for creating original games inspired by\n> publicly available game mechanics. It is optimized for games in the **public\n> domain** but can accept any game name with the following conditions:\n>\n> 1. No copyrighted or patented content is included in generated output\n> 2. Users are solely responsible for the games they produce\n> 3. CryptArtist Studio is not liable for any games generated by this tool\n> 4. We will actively report copyright infringement at our discretion to\n>    protect the platform and its community\n> 5. Patent holders and copyright owners may use this tool on their own\n>    intellectual property without restriction\n> 6. By using this tool, you agree to the CryptArtist Studio Terms of Service\n>\n> If you are not the rights holder, ensure the game mechanics you are cloning\n> are not covered by active patents. When in doubt, stick to public domain games.\n\n**Emoji Graphics Mode (Phase 1 Output Example):**\n- Player character: a running emoji (e.g., a person, animal, or object)\n- Enemies: threat-themed emojis (skulls, fire, ghosts)\n- Collectibles: gem/star/coin emojis\n- Terrain: earth/tree/water/brick emojis arranged in grid or platformer layouts\n- UI: emoji-based health bars, score counters, and menus\n\n**AI 3D Graphics Mode (Phase 2 Output):**\n- AI-generated low-poly 3D models via text-to-3D\n- Procedural textures and materials\n- Basic lighting and environment setup\n- Original character designs with no resemblance to source material\n\n#### Layout Modes\n\n| Mode | Description |\n|---|---|\n| **Split** | Media + Code side by side (50/50) |\n| **Code Focus** | Full-width code editor with asset sidebar |\n| **Media Focus** | Full-width media editor with code sidebar |\n| **Godot Focus** | Full-width Godot viewport with toolbars |\n\n#### Godot Installation Detection & Management\n\nGameStudio includes a robust Godot installation detection system:\n\n**Automatic Detection:**\n- Scans system PATH for Godot executable\n- Checks common installation directories (Windows, macOS, Linux)\n- Detects Godot version via `--version` command\n- Displays status in terminal and status bar\n\n**Custom Path Selection:**\n- File browser dialog to select custom Godot executable\n- Path validation via `godot_verify_path` backend command\n- Supports .exe, .bin, and .app executables\n- Fallback verification checks file permissions and extension\n\n**Godot Not Found Dialog:**\nWhen Godot is not detected, users can:\n1. **📥 Download Godot 4.6.1** - Opens official Godot download page\n2. **📁 Browse for Godot .exe** - Opens file browser for custom path selection\n3. **🔄 Rescan System** - Re-runs automatic detection\n4. **Continue Without Godot** - Closes dialog and allows code editing only\n\n#### .CryptArt Data Payload (GameStudio)\n\n```json\n{\n  \"godotProjectPath\": \"/path/to/project.godot\",\n  \"godotCustomPath\": \"/custom/path/to/godot.exe\",\n  \"layout\": \"split\",\n  \"mediaState\": { ... },\n  \"codeState\": { ... },\n  \"godotState\": { ... },\n  \"aiConversation\": [ ... ]\n}\n```\n\n---\n\n### CryptArt Commander - CAC\n\n**CryptArt Commander** (CAC) is a terminal-based command center that provides full\ncontrol over CryptArtist Studio through a command-line interface, REST API integration,\nand scripting capabilities. It is designed for power users, automation, and AI agent\nintegration.\n\n#### Terminal Interface\n\nThe Commander presents a full-screen terminal with a command prompt, scrollable output\nhistory, and syntax-highlighted results. It includes tab completion, command aliases,\nenvironment variables, and arrow-key history navigation.\n\n#### Built-In Commands\n\n| Command | Description |\n|---|---|\n| `help` | Show all available commands |\n| `clear` | Clear the terminal output |\n| `version` | Show CryptArtist Studio and Commander version |\n| `sysinfo` | Display system information (OS, arch, FFmpeg, Godot) |\n| `health` | Run a health check on the application |\n| `keys status` | Check which API keys are configured |\n| `keys export` | Export all API keys to JSON |\n| `ffmpeg status` | Check if FFmpeg is installed |\n| `ffmpeg install` | Install FFmpeg automatically |\n| `godot detect` | Detect Godot engine installation |\n| `ls <path>` | List directory contents with sizes |\n| `cat <path>` | Read and display a file's contents |\n| `write <path> <content>` | Write content to a file |\n| `chat <prompt>` | Send a prompt to OpenAI |\n| `or <prompt>` | Send a prompt to OpenRouter (200+ models) |\n| `or models` | List available OpenRouter models |\n| `pexels <query>` | Search Pexels for stock media |\n| `generate <prompt>` | Generate an AI image via DALL-E |\n| `tts <text>` | Convert text to speech |\n| `project` | Show current project state |\n| `programs` | List all programs in the suite |\n| `run <script>` | Execute a saved script |\n| `scripts` | List saved scripts |\n| `api` | Show REST API reference |\n| `echo <text>` | Echo text to the terminal |\n| `time` | Display current time |\n| `date` | Display current date and time |\n| `history` | Show command history |\n| `alias <name>=<cmd>` | Create a command alias |\n| `aliases` | List all command aliases |\n| `uptime` | Show session uptime |\n| `whoami` | Show user information |\n| `open <program>` | Navigate to a program by name or ID |\n| `env` | Show environment variables |\n| `env set <key> <value>` | Set an environment variable |\n| `bench <cmd>` | Benchmark a command's execution time |\n| `count` | Show total commands run across all sessions |\n| `grep <pattern> <path>` | Search for a pattern in a file |\n| `head <n> <path>` | Show the first N lines of a file |\n| `tail <n> <path>` | Show the last N lines of a file |\n| `wc <path>` | Word, line, and character count |\n| `sort <path>` | Sort lines of a file alphabetically |\n| `uniq <path>` | Show unique lines of a file |\n| `calc <expr>` | Evaluate a math expression |\n| `pwd` | Print working directory |\n| `touch <path>` | Create an empty file |\n| `export-history` | Export command history to a file |\n\n#### Tab Completion\n\nPress `Tab` to autocomplete commands and aliases. When multiple matches exist,\nsuggestion pills are displayed below the input. Press `Tab` again to cycle through\nsuggestions.\n\n#### Command Aliases\n\nCreate shortcuts for frequently used commands:\n\n```bash\nalias ll=ls .\nalias st=keys status\nalias hc=health\nalias v=version\n```\n\nDefault aliases: `ll` (ls .), `st` (keys status), `hc` (health), `v` (version).\nAliases are persisted to localStorage across sessions.\n\n#### Script Editor\n\nThe Commander includes a built-in script editor for creating, saving, and running\nmulti-command scripts:\n\n- **Create scripts** with the visual editor\n- **Run scripts** that execute each line as a command sequentially\n- **Default scripts**: `hello-world` and `system-check` are provided out of the box\n- **Languages**: Shell (command sequences), JavaScript, Python\n\n#### REST API Reference Tab\n\nA built-in API reference tab displays all 18+ REST API endpoints with their HTTP\nmethods, paths, descriptions, and parameters. This serves as an interactive\ndocumentation panel for developers integrating with CryptArtist Studio.\n\n#### Security Limits\n\n- Maximum command input length: 10,000 characters\n- Maximum display history: 200 entries\n- Maximum command history: 500 entries\n- Maximum script content: 50,000 characters\n- Maximum environment variables: 100\n- Maximum aliases: 50\n- File paths are sanitized before passing to backend\n\n#### .CryptArt Data Payload (Commander)\n\n```json\n{\n  \"commandHistory\": [ ... ],\n  \"scripts\": [ ... ],\n  \"aliases\": { \"ll\": \"ls .\", \"st\": \"keys status\" },\n  \"envVars\": { \"USER\": \"Matt\", \"SHELL\": \"cac\" }\n}\n```\n\n---\n\n### DonatePersonalSeconds - DPS\n\n**DonatePersonalSeconds** is a P2P compute resource sharing tool that allows users to donate\ntheir idle CPU, RAM, and GPU resources to help other CryptArtist Studio users run\ncomputationally intensive tasks like AI inference, video rendering, and image generation.\n\n#### How It Works\n\n1. **Detect** - The system detects your available CPU cores, RAM, GPU, and network speed\n2. **Configure** - Set donation limits (what percentage of each resource to share)\n3. **Connect** - Connect to the P2P signaling network with a unique peer ID\n4. **Share** - Your idle resources are made available to verified borrowers\n5. **Borrow** - Request compute resources from available donors in the network\n\n#### System Resource Detection\n\nThe component automatically detects:\n\n| Resource | Detection Method |\n|---|---|\n| **CPU Cores** | `navigator.hardwareConcurrency` |\n| **RAM** | `navigator.deviceMemory` API |\n| **GPU** | WebGL2/WebGL `WEBGL_debug_renderer_info` extension |\n| **Network** | `navigator.connection` API (downlink, RTT, effectiveType) |\n| **Platform** | `navigator.platform` |\n\n#### Donation Limits\n\nUsers can configure how much of each resource to share via sliders:\n\n| Resource | Default | Range |\n|---|---|---|\n| **CPU** | 80% | 0-100% |\n| **RAM** | 50% | 0-100% |\n| **GPU** | 90% | 0-100% |\n\n#### Features\n\n- **Password Protection** - Cryptographically secure 16-character passwords for peer verification\n- **Peer Verification** - Peers must be verified before resource sharing begins\n- **Live Statistics** - Connected peers, tasks completed, uptime, CPU time shared\n- **Activity Log** - Timestamped log of all events (connections, tasks, errors)\n- **Peer Information** - Detailed info about connected peers and their resources\n- **Start/Stop Controls** - Simple buttons to start donating or borrowing\n- **Secure Random IDs** - Peer IDs generated using `crypto.getRandomValues()`\n\n#### Security Features\n\n- Maximum 50 peer connections (Vuln 52)\n- Maximum 200 log entries to prevent memory leaks (Vuln 53)\n- All timeouts tracked and cleaned up on unmount (Vuln 51)\n- Cryptographically secure peer ID generation (Vuln 86)\n- Double-click prevention on stop button (Vuln 64)\n\n#### .CryptArt Data Payload (DonatePersonalSeconds)\n\n```json\n{\n  \"peerId\": \"ca-a1b2c3d4e5f6g7h8\",\n  \"mode\": \"donating\",\n  \"limits\": { \"cpuPercent\": 80, \"ramPercent\": 50, \"gpuPercent\": 90 },\n  \"stats\": { \"uptime\": 3600, \"tasksCompleted\": 42, \"cpuTimeShared\": 2880000 }\n}\n```\n\n---\n\n### Settings - Set\n\n**Settings** is the centralized configuration hub for CryptArtist Studio. It manages\nall API keys, AI model defaults, per-action model/mode routing, appearance preferences, data management, and\nkeyboard shortcuts.\n\n#### Sidebar Navigation\n\n| Section | Description |\n|---|---|\n| **API Keys** | Manage OpenAI, OpenRouter, Pexels, ElevenLabs, and GiveGigs API keys |\n| **OpenRouter** | Configure OpenRouter key, global model/mode defaults, and per-action overrides |\n| **Appearance** | Theme accent color, font family, font size |\n| **Keyboard Shortcuts** | View all global keyboard shortcuts |\n| **Data & Storage** | localStorage usage, clear data, reset settings |\n| **About** | Version info, credits, and links |\n\n#### API Key Management\n\nAll API keys are stored securely in the Rust backend state, never in frontend\nlocalStorage. The Settings panel provides:\n\n- **OpenAI Key** - For AI chat, image generation, TTS, and AI Studio\n- **OpenRouter Key** - For access to 200+ AI models\n- **Pexels Key** - For stock photo and video search\n- **ElevenLabs Key** - For podcast voice generation, speech transcription, and sound effects\n- **GiveGigs Config** - For media asset library access\n\nKeys are masked in the UI (showing only the first 8 characters) and can be\ntoggled visible.\n\n#### OpenRouter Configuration\n\n- **Default Model** - `openai/gpt-5-mini` is the global default for all AI actions\n- **Default AI Mode** - Global efficiency mode:\n  - `💳 Cheap` - Minimize token usage and total cost\n  - `⚡ Fast` - Prioritize quick completion\n  - `🦄 Good` - Positive, clever, funny tone; serious code quality; goodness-oriented guidance\n  - `🧠 Smart` - Default mode; highly intelligent and precise\n- **Per-Action Defaults** - Configure model + mode for each action:\n  - General AI chat, Media chat, Auto-edit planning\n  - ValleyNet agent, Coding assistant/planner/review\n  - Game generation, Demo narration, Commander chat/OpenRouter\n- **Connection Test** - Verify OpenRouter key works with a live API call\n- **Live Status** - Shows connected model and provider in the panel footer\n\n#### Import/Export API Keys\n\nExport all API keys to a `Forbidden-Secrets-of-CryptArtist-Keys-N.txt` file:\n\n- File numbers auto-increment (1, 2, 3, ...)\n- JSON format with all keys\n- Warning header about sensitive data\n- Import reads JSON and updates all keys in the backend\n\n#### Data & Storage\n\n- **localStorage Usage** - Visual display of storage used by CryptArtist\n- **Per-Key Info** - See which localStorage keys exist and their sizes\n- **Clear Specific Data** - Clear favorites, recent projects, launch counts, etc.\n- **Danger Zone** - Reset all data, clear all localStorage, reset accent color\n\n---\n\n### Clone Tool - CLN\n\n**Clone Tool** is an installer builder that creates platform-specific application\npackages from your current CryptArtist Studio configuration.\n\n#### Features\n\n- **Multi-Platform Targets** - Build for Windows (.exe, .msi), macOS (.dmg, .app),\n  Linux (.deb, .AppImage, .rpm), Android (.apk), and iOS (.ipa).\n- **Five Configuration Tabs** - General (app name, version, author), Targets (platform\n  selection), Window (dimensions, fullscreen, resizable), Includes (plugins, themes,\n  mods, settings, API keys), and Build (progress, logs).\n- **Custom Branding** - Upload custom app icons and splash screens with validation.\n- **Build Source** - Clone from default config or current running config.\n- **Include Options** - Optionally bundle plugins, themes, mods, settings, and API\n  keys (with security warning for keys).\n- **Code Signing** - Optional code signing, compression, and auto-update toggles.\n- **Build Simulation** - Multi-stage build process with progress bar and detailed\n  build log output.\n\n#### .CryptArt Data Payload (Clone Tool)\n\n```json\n{\n  \"appName\": \"My Custom Studio\",\n  \"targets\": [\"windows-exe\", \"linux-appimage\"],\n  \"includePlugins\": true,\n  \"includeThemes\": true,\n  \"buildResults\": [ ... ]\n}\n```\n\n---\n\n### DictatePic - D(pi)c\n\n**DictatePic** is a professional image editor built on GIMP principles with integrated\nAI features for generation, inpainting, upscaling, background removal, and style transfer.\n\n#### Layout\n\nThe DictatePic window follows a classic image editor layout:\n\n| Area | Position | Description |\n|---|---|---|\n| **Toolbox** | Left sidebar | 28 tools organized by group (selection, transform, paint, fill, retouch, AI, other) |\n| **Canvas** | Center | Zoomable canvas with checkerboard transparency, rulers, and grid |\n| **Layers Panel** | Right sidebar | Layer stack with visibility, lock, opacity, blend modes |\n| **Properties** | Right sidebar (below layers) | Tool options, brush size, opacity, hardness, colors |\n| **History** | Right sidebar (bottom) | Undo history with named entries |\n\n#### Tools (28 Total)\n\n| Group | Tools |\n|---|---|\n| **Selection** | Rectangle Select, Ellipse Select, Free Select (Lasso), Magic Wand |\n| **Transform** | Move, Crop, Rotate, Scale, Flip |\n| **Paint** | Paintbrush, Pencil, Eraser, Airbrush, Clone Stamp |\n| **Fill** | Bucket Fill, Gradient |\n| **Retouch** | Blur, Sharpen, Smudge, Dodge, Burn, Heal |\n| **Other** | Text, Color Picker, Measure, Path/Bezier |\n| **AI** | AI Generate, AI Inpaint, AI Upscale, AI Remove Background, AI Style Transfer |\n\n#### Filters (16)\n\nGaussian Blur, Sharpen, Edge Detect, Emboss, Noise Reduction, Posterize, Threshold,\nInvert Colors, Desaturate, Sepia, Levels, Curves, Hue/Saturation, Color Balance,\nBrightness/Contrast, Unsharp Mask.\n\n#### AI Features\n\n- **AI Generate** - Generate images from text prompts via OpenAI/OpenRouter\n- **AI Inpaint** - Fill selected areas with AI-generated content\n- **AI Upscale** - Enhance image resolution using AI super-resolution\n- **AI Remove Background** - Automatically remove image backgrounds\n- **AI Style Transfer** - Apply artistic styles to images (photorealistic, anime,\n  oil painting, watercolor, sketch, pixel art, cinematic, abstract)\n\n#### Canvas Features\n\n- **Zoom** - 10% to 800% zoom with scroll wheel support\n- **Pan** - Click and drag to pan the canvas\n- **Grid and Guides** - Toggleable grid overlay and snap-to-grid\n- **Rulers** - Horizontal and vertical pixel rulers\n- **Color Modes** - RGB, RGBA, Grayscale, Indexed\n- **Bit Depths** - 8-bit, 16-bit, 32-bit\n- **Blend Modes** - 15 blend modes (Normal, Multiply, Screen, Overlay, etc.)\n\n#### .CryptArt Data Payload (DictatePic)\n\n```json\n{\n  \"canvasSize\": { \"w\": 1920, \"h\": 1080 },\n  \"layers\": [ ... ],\n  \"colorMode\": \"RGBA\",\n  \"bitDepth\": 8,\n  \"activeTool\": \"brush\",\n  \"history\": [ ... ]\n}\n```\n\n---\n\n### Luck Factory - Lck\n\n**Luck Factory** is a unique AI seed generator that anchors CryptArtist Studio's\n\"Lucky\" AI mode to a deterministic value derived from user-provided intentions.\n\n#### How It Works\n\n1. **Introduction** - The program explains the concept of anchoring AI operations\n   to a cryptographic luck signature.\n2. **Input** - The user enters any string (name, wish, mantra, emojis, Unicode text)\n   to serve as their luck anchor.\n3. **Meditation** - A guided meditation sequence plays seven affirmations while the\n   luck score is computed, including:\n   - \"Centering the mind...\"\n   - \"Aligning the cosmic probability vectors...\"\n   - \"Breathing in fortune, exhaling uncertainty...\"\n   - \"Tuning into the universal frequency of 777...\"\n   - \"Manifesting serendipitous outcomes...\"\n4. **Result** - Three values are displayed:\n   - **Base Score** (0-999) - Computed from the string hash\n   - **Threshold Preset** (69, 420, or 777) - Based on base score range\n   - **Final Seed** - Combined value used by the Lucky AI mode\n\n#### Luck Presets\n\n| Base Score Range | Preset | Meaning |\n|---|---|---|\n| 0-499 | 69 | Standard luck |\n| 500-899 | 420 | Elevated luck |\n| 900-999 | 777 | Maximum luck |\n\n#### Integration\n\n- The final luck seed is stored in `localStorage` as `cryptartist_lucky_seed`\n- The luck string is stored as `cryptartist_lucky_string`\n- All programs with the \"Lucky\" AI mode use this seed to influence AI prompts\n- Luck Factory is automatically opened when a user selects the Lucky mode for\n  the first time without an existing luck seed\n\n#### .CryptArt Data Payload (Luck Factory)\n\n```json\n{\n  \"luckString\": \"To the moon\",\n  \"baseLuck\": 482,\n  \"presetLuck\": 69,\n  \"finalLuck\": 551\n}\n```\n\n---\n\n## Workspace Management\n\nCryptArtist Studio supports opening multiple `.CryptArt` files simultaneously through\na workspace management system. This enables multi-project workflows, resource sharing\nbetween projects, and side-by-side editing.\n\n### Multi-File Workspaces\n\n- **Open Multiple Files** - Use the \"Open .CryptArt Files...\" button in the Suite\n  Launcher to open a multi-file dialog. Each file creates a separate workspace.\n- **Workspace Bar** - A global tab bar appears above the main content area, showing\n  all open workspaces with their names and program icons.\n- **Switch Workspaces** - Click a tab to switch between open workspaces. The active\n  workspace's project data loads into the appropriate program.\n- **Context Menu** - Right-click a workspace tab for options: combine, share resources,\n  duplicate, and close.\n- **Maximum Workspaces** - Up to 20 workspaces can be open simultaneously.\n\n### Workspace Groups and Resource Sharing\n\nWorkspaces can be combined into groups for resource sharing:\n\n| Shared Resource | Description |\n|---|---|\n| **Media** | Share media pools between projects |\n| **AI Context** | Share AI conversation context and history |\n| **Settings** | Share configuration settings |\n| **Files** | Share file references |\n| **Chat History** | Share chat conversation history |\n\nGroups are created by right-clicking a workspace tab and selecting \"Combine\".\nWithin a group, each member can selectively share resources with other members.\n\n### Integration with Programs\n\nAll programs use the workspace system:\n\n- **Mount/Switch** - Programs load active workspace data when mounted or when the\n  active workspace changes\n- **Multi-File Open** - Programs can open files into new workspaces via the dialog\n- **Save Integration** - Programs call `updateProject()`, `updateFilePath()`, and\n  `markClean()` on the workspace context when saving\n\n### Architecture\n\n| File | Purpose |\n|---|---|\n| `src/utils/workspace.ts` | Types, context, and helper functions |\n| `src/components/WorkspaceProvider.tsx` | React state provider with CRUD and group logic |\n| `src/components/WorkspaceBar.tsx` | Global tab bar UI with context menu |\n\n---\n\n## Cross-Program Interoperability\n\nCryptArtist Studio features a comprehensive interoperability layer that enables all\nprograms in the suite to communicate, share data, and chain workflows together. This\nis the backbone that makes the suite feel like one unified application rather than\nseparate tools.\n\n### 1. Event Bus (`src/utils/interop.ts`)\n\nA global pub/sub event bus that enables real-time communication between programs.\nPrograms can emit events and subscribe to events from other programs.\n\n**Event Categories:**\n- **Media events** - `media:exported`, `media:imported`, `media:image-generated`, `media:audio-generated`\n- **Code events** - `code:file-saved`, `code:file-opened`, `code:snippet-created`, `code:project-opened`\n- **Game events** - `game:asset-imported`, `game:script-generated`, `game:scene-created`, `game:clone-started`\n- **Recording events** - `recording:started`, `recording:stopped`, `recording:exported`\n- **Agent events** - `agent:task-started`, `agent:task-completed`, `agent:task-failed`\n- **AI events** - `ai:response-received`, `ai:model-changed`, `ai:key-updated`\n- **Workspace events** - `workspace:opened`, `workspace:closed`, `workspace:saved`\n- **Pipeline events** - `pipeline:step-completed`, `pipeline:finished`, `pipeline:failed`\n- **Clipboard events** - `clipboard:copied`, `clipboard:pasted`\n- **Navigation events** - `nav:program-switched`, `nav:requested`\n- **System events** - `system:theme-changed`, `system:settings-updated`, `system:notification`\n\n**Usage in programs:**\n```tsx\n// Subscribe to events\nuseInterop(\"media:exported\", (event) => {\n  console.log(\"Media from\", event.source, event.data);\n}, { target: \"game-studio\" });\n\n// Emit events\nconst emit = useInteropEmit(\"media-mogul\");\nemit(\"media:exported\", { path: \"/sprites/hero.png\", type: \"image\" });\n\n// Request-response pattern\nconst response = await interopBus.request(\n  \"agent:task-started\", \"game-studio\", { task: \"Generate GDScript\" },\n  \"agent:task-completed\", \"valley-net\"\n);\n```\n\n**Cross-program event flows:**\n- **VibeCodeWorker -> GameStudio** - GDScript snippets are received and displayed in GameStudio's terminal and AI chat\n- **MediaMogul -> GameStudio** - Exported media assets appear in GameStudio's asset import queue\n- **ValleyNet -> Any Program** - Agent task requests can be sent to ValleyNet from any program\n- **All Programs -> System** - Save events, AI responses, and errors are broadcast globally\n\n### 2. Shared API Key Context (`src/utils/apiKeys.ts` + `src/components/ApiKeyProvider.tsx`)\n\nCentralized API key management that loads all keys from the Rust backend once at app\nstartup and shares them via React context. Eliminates redundant `invoke(\"get_api_key\")`\ncalls in every program.\n\n**Supported keys:** OpenAI, OpenRouter, Pexels, Supabase/GiveGigs, ElevenLabs\n\n**Features:**\n- Single load on app startup via `ApiKeyProvider`\n- Auto-refresh when any key is updated from Settings\n- `useApiKeys()` hook provides `openaiKey`, `openrouterKey`, `pexelsKey`, `supabaseKey`, `elevenlabsKey`\n- `hasKey(\"openai\")` check for conditional feature rendering\n- `getKeyStatus()` returns a map of all key availability\n- `ai:key-updated` event broadcast when keys change\n\n### 3. Cross-Program Clipboard (`src/utils/crossClipboard.ts`)\n\nA universal clipboard that can transfer media, code snippets, files, and other data\nbetween programs with rich metadata about source, content type, and transfer context.\n\n**Content types:** `text`, `code`, `image`, `audio`, `video`, `file-path`, `media-asset`,\n`gdscript`, `scene-tree`, `ai-prompt`, `ai-response`, `recording`, `sprite`, `texture`,\n`project-data`, `terminal-output`, `custom`\n\n**Features:**\n- 50-entry clipboard history\n- Type-filtered paste (e.g., paste only code, only images)\n- Program-aware content compatibility checks\n- Automatic interop bus notifications on copy/paste\n- `useCrossClipboard(\"program-id\")` hook for easy integration\n\n**Program compatibility matrix:**\n\n| Content Type | MMo | VCW | GSt | VNt | DRe | CAC |\n|---|---|---|---|---|---|---|\n| code | | X | X | X | | X |\n| gdscript | | X | X | | | |\n| image | X | | X | | | |\n| audio | X | | | | X | |\n| video | X | | | | X | |\n| sprite/texture | X | | X | | | |\n| ai-prompt | | | | X | | X |\n| terminal-output | | X | | X | | X |\n| file-path | X | X | X | | X | X |\n\n### 4. Program Pipeline System (`src/utils/pipeline.ts`)\n\nDefines reusable workflows that chain operations across multiple programs. Pipelines\nare sequences of steps, each handled by a specific program, with automatic progression\nand failure handling.\n\n**Built-in pipelines:**\n\n| Pipeline | Steps | Description |\n|---|---|---|\n| Media to Game Asset | MMo -> GSt | Export media from Media Mogul, import as game asset |\n| AI Code to Game Script | VCW -> GSt | Generate code in VibeCodeWorker, apply as GDScript |\n| Record and Narrate | DRe -> DRe -> MMo | Record screen, export, add AI narration |\n| Agent Full-Stack Build | VNt -> VCW -> GSt | Agent plans feature, code generates, game integrates |\n| Video Game Clone Pipeline | VNt -> MMo -> VCW -> GSt | Research, generate assets, write code, build project |\n| AI Podcast Pipeline | VNt -> MMo -> MMo | Write script, TTS voiceover, add SFX |\n\n**Features:**\n- Start, advance, fail, cancel pipeline runs\n- Optional steps that can be skipped on failure\n- 20-run history\n- Custom pipeline registration via `pipelineRunner.register()`\n- Pipeline events broadcast via interop bus\n- Input/output chaining between steps\n\n### 5. Unified Notification Hub (`src/utils/notifications.ts`)\n\nCentral notification system for all programs with priorities, categories, grouping,\nand cross-program routing.\n\n**Notification levels:** `info`, `success`, `warning`, `error`, `critical`\n**Categories:** `ai`, `media`, `code`, `game`, `recording`, `agent`, `system`, `pipeline`, `security`, `update`, `donation`\n\n**Features:**\n- 100-notification history\n- Read/unread tracking\n- Auto-dismiss with configurable timeout\n- Group key for collapsing similar notifications\n- Optional action buttons and navigation targets\n- `subscribe()` for real-time notification handling\n- Convenience functions: `notifyInfo()`, `notifySuccess()`, `notifyWarning()`, `notifyError()`, `notifyAI()`, `notifyPipeline()`\n\n### Interoperability Architecture\n\n| File | Purpose |\n|---|---|\n| `src/utils/interop.ts` | Cross-program event bus (pub/sub) with React hooks |\n| `src/utils/apiKeys.ts` | Shared API key types, context, and backend loaders |\n| `src/components/ApiKeyProvider.tsx` | React provider that loads keys once at startup |\n| `src/utils/crossClipboard.ts` | Cross-program clipboard with type-aware routing |\n| `src/utils/pipeline.ts` | Multi-program workflow pipeline system |\n| `src/utils/notifications.ts` | Unified notification hub with categories and grouping |\n\n### Integration Status\n\nAll eleven programs are integrated with the interoperability layer:\n\n| Program | useApiKeys | useInteropEmit | useCrossClipboard | useInterop (listen) | Save Events | AI Events |\n|---|---|---|---|---|---|---|\n| Media Mogul [MMo] | X | X | X | - | X | X |\n| VibeCodeWorker [VCW] | X | X | X | - | X | X |\n| GameStudio [GSt] | X | X | X | code:snippet-created, media:exported | X | X |\n| ValleyNet [VNt] | X | X | X | agent:task-started | X | X |\n| DemoRecorder [DRe] | X | X | X | - | X | - |\n| CryptArt Commander [CAC] | X | X | - | - | - | X |\n| DonatePersonalSeconds [DPS] | - | X | - | - | - | - |\n| Clone Tool [CLN] | - | X | - | - | - | - |\n| DictatePic [D(pi)c] | X | X | - | - | - | X |\n| Luck Factory [Lck] | - | - | - | - | - | - |\n| Settings [Set] | X | X | - | ai:key-updated | - | X |\n\n---\n\n## Plugin, Mod, and Theme System\n\nCryptArtist Studio includes a full extension system for plugins, mods, and themes.\nAll three are distributed as ZIP files with a `manifest.json` inside.\n\n### Plugins\n\nPlugins extend existing programs with new features. They are managed by the\n**Plugin Manager** (`src/components/PluginManager.tsx`) and the plugin system\n(`src/utils/plugins.ts`).\n\n| Field | Description |\n|---|---|\n| `id` | Unique plugin identifier (e.g., `com.example.my-plugin`) |\n| `name` | Display name |\n| `version` | Semver version string |\n| `author` | Plugin author |\n| `description` | Short description |\n| `targetProgram` | Which program this plugin extends |\n| `entryPoint` | Main script file inside the ZIP |\n| `permissions` | Requested capabilities (filesystem, network, ai, etc.) |\n\nPlugins are installed from ZIP files via Settings > Plugins, stored in localStorage,\nand loaded on program startup.\n\n### Mods\n\nMods are self-contained mini-programs that appear as launchable entries in the\nSuite Launcher. They are managed by the **Mod Manager** (`src/components/ModManager.tsx`)\nand the mod system (`src/utils/mods.ts`).\n\n| Field | Description |\n|---|---|\n| `id` | Unique mod identifier |\n| `name` | Display name shown in Suite Launcher |\n| `emoji` | Emoji icon for the launcher card |\n| `code` | Short 3-letter code |\n| `description` | One-line description |\n| `gradient` | CSS gradient for the launcher card |\n| `component` | Main React component file |\n\nBuilt-in program IDs (`media-mogul`, `vibecode-worker`, etc.) are reserved and\ncannot be overridden by mods.\n\n### Themes\n\nThemes change the visual appearance of the entire application. They are managed by\nthe **Theme Manager** (`src/components/ThemeManager.tsx`) and the theme system\n(`src/utils/themes.ts`).\n\n#### Built-in Themes\n\n| Theme | Description |\n|---|---|\n| **Primordial** | The default dark theme with deep navy/purple tones |\n| **Blank** | A minimal, clean dark theme with reduced visual noise |\n\n#### Custom Themes\n\nCustom themes are ZIP files containing a `manifest.json` and a `theme.css` file.\nThe CSS file uses CSS custom properties to override the default theme tokens:\n\n```css\n:root {\n  --studio-bg: #0a0a0f;\n  --studio-panel: #12121a;\n  --studio-surface: #1a1a2e;\n  --studio-border: #2a2a3e;\n  --studio-text: #e0e0e8;\n  --studio-accent: #00d4ff;\n  /* ... additional tokens ... */\n}\n```\n\n#### Theme Features\n\n- **Live Preview** - Preview themes before applying\n- **Theme Creator** - Built-in editor for creating custom themes\n- **Export** - Export custom themes as ZIP files for sharing\n- **CSS Variables** - Full control over colors, fonts, spacing, and effects\n- **Animation Control** - `body.no-animations` class disables all animations\n- **Scrollbar Control** - `body.scrollbar-hidden` class hides scrollbars\n\n---\n\n## The .CryptArt File Format\n\nThe `.CryptArt` file format is the universal project file for all CryptArtist Studio\nprograms. It is a JSON file with the extension `.CryptArt` and the registered MIME type\n`application/x-cryptartist-art`. The OS file type description is \"CryptArtist Art\".\n\n### Design Goals\n\nThe `.CryptArt` format was designed with one overriding goal: **it must never need a\nbase format upgrade**. The envelope schema is stable forever. Any `.CryptArt` file ever\ncreated will always be readable by any version of CryptArtist Studio.\n\n1. **Permanent Envelope** - The envelope schema (`$cryptart`, `program`, `data`) never changes.\n2. **Universal Readability** - Any `.CryptArt` file from any version is always parseable.\n3. **Additive Only** - New fields and capabilities are added without breaking old files.\n4. **Self-Identifying** - The `$cryptart` magic key identifies the file and its envelope version.\n5. **Open Program IDs** - Any string is a valid program ID. No closed union types.\n6. **Rich Metadata** - Optional metadata for author, description, tags, thumbnails, and more.\n7. **Extensible** - The `extensions` section allows future plugin data.\n8. **Auditable** - The `history` array tracks edit actions with timestamps.\n\n### Compatibility Contract\n\n| Rule | Description |\n|---|---|\n| **Readers MUST** | Ignore unknown top-level keys |\n| **Readers MUST NOT** | Fail if optional keys are missing |\n| **Writers MUST** | Always include the 3 required keys |\n| **Writers SHOULD** | Preserve unknown keys when re-saving a file |\n\n### Required Fields\n\nThese are the only three fields that **MUST** exist in every `.CryptArt` file:\n\n| Field | Type | Description |\n|---|---|---|\n| `$cryptart` | `1` (number) | Magic key. Identifies the file AND its envelope version. Always `1`. |\n| `program` | `string` | Free-form string identifying which program created the file. |\n| `data` | `object` | Program-specific payload. Opaque to the envelope. |\n\n### Recommended Fields\n\nWritten by default when creating a new file, but not required for parsing:\n\n| Field | Type | Description |\n|---|---|---|\n| `name` | `string` | Human-readable project name |\n| `createdAt` | `string` | ISO-8601 creation timestamp |\n| `updatedAt` | `string` | ISO-8601 last-save timestamp |\n| `appVersion` | `string` | Version of CryptArtist Studio that wrote the file |\n\n### Optional Fields\n\nAll optional fields are designed so that omitting them has no effect on functionality.\nThey exist for richer workflows:\n\n#### Identity and Sync\n\n| Field | Type | Description |\n|---|---|---|\n| `id` | `string` | UUID for deduplication and cloud sync |\n| `parentId` | `string` | UUID of the parent file (for forks/branches) |\n| `source` | `string` | Origin URL or file path |\n\n#### Meta Object\n\nThe `meta` field is an object with the following optional properties:\n\n| Field | Type | Description |\n|---|---|---|\n| `meta.author` | `string` | Author name |\n| `meta.email` | `string` | Contact email |\n| `meta.organization` | `string` | Organization name |\n| `meta.website` | `string` | Website URL (default: `https://mattyjacks.com`) |\n| `meta.repository` | `string` | Source code repository URL |\n| `meta.description` | `string` | Project description |\n| `meta.readme` | `string` | Inline readme or path to readme file |\n| `meta.tags` | `string[]` | Categorization tags |\n| `meta.keywords` | `string[]` | Search keywords |\n| `meta.category` | `string` | Project category |\n| `meta.license` | `string` | License identifier (e.g., \"MIT\") |\n| `meta.copyright` | `string` | Copyright notice |\n| `meta.rating` | `string` | Content rating |\n| `meta.thumbnail` | `string` | Thumbnail image URL or base64 |\n| `meta.preview` | `string` | Preview image URL or base64 |\n| `meta.icon` | `string` | Custom icon URL or base64 |\n| `meta.color` | `string` | Accent color for UI (hex) |\n| `meta.collaborators` | `string[]` | List of collaborator names/emails |\n| `meta.fileCount` | `number` | Number of files in the project |\n| `meta.duration` | `number` | Duration in seconds (for time-based projects) |\n| `meta.resolution` | `string` | Resolution string (e.g., \"1920x1080\") |\n| `meta.language` | `string` | Primary programming language |\n| `meta.locale` | `string` | Content locale (e.g., \"en-US\") |\n\nThe `meta` object also accepts any additional key-value pairs via an open index\nsignature, so custom metadata is always preserved.\n\n#### Project Structure\n\n| Field | Type | Description |\n|---|---|---|\n| `dependencies` | `array` | Array of `{ name, version?, type? }` dependency objects |\n| `environment` | `object` | `{ os?, arch?, runtime?, runtimeVersion? }` |\n\n#### Integrity\n\n| Field | Type | Description |\n|---|---|---|\n| `checksum` | `string` | SHA-256 hash of the `data` section |\n| `encryption` | `string` | Encryption algorithm used, if any |\n| `compression` | `string` | Compression algorithm used, if any |\n\n#### Compatibility\n\n| Field | Type | Description |\n|---|---|---|\n| `minAppVersion` | `string` | Minimum app version required to read this file |\n| `maxAppVersion` | `string` | Maximum app version known to work |\n| `compatibility` | `string[]` | Array of compatible reader identifiers |\n\n#### Audit Trail\n\n| Field | Type | Description |\n|---|---|---|\n| `history` | `array` | Array of `{ timestamp, action, detail?, user? }` entries |\n\n#### Extensibility\n\n| Field | Type | Description |\n|---|---|---|\n| `extensions` | `object` | `Record<string, unknown>` for plugin data |\n| `plugins` | `string[]` | Array of plugin identifiers used |\n| `schemas` | `object` | Map of data key to JSON Schema URL for validation |\n\n#### Export and Sharing\n\n| Field | Type | Description |\n|---|---|---|\n| `exportedAt` | `string` | ISO-8601 timestamp of last export |\n| `exportedBy` | `string` | Who or what exported the file |\n| `exportFormat` | `string` | Target format of export |\n| `shareUrl` | `string` | Public sharing URL |\n\n### Backward Compatibility\n\nThe parser handles all historical `.CryptArt` file versions:\n\n1. **Pre-v1 files** (no `$cryptart` key) are auto-upgraded in memory on parse.\n2. The old `version` field is silently migrated to `appVersion`.\n3. Missing `data` defaults to `{}`.\n4. Unknown keys are preserved on re-save, never discarded.\n5. The `program` field was originally a closed union type; it is now an open string.\n\n### Known Program IDs\n\n| Program ID | Program Name |\n|---|---|\n| `media-mogul` | Media Mogul |\n| `vibecode-worker` | VibeCodeWorker |\n| `demo-recorder` | DemoRecorder |\n| `valley-net` | ValleyNet |\n| `game-studio` | GameStudio |\n| `commander` | CryptArt Commander |\n| `donate-personal-seconds` | DonatePersonalSeconds |\n| `clone-tool` | Clone Tool |\n| `dictate-pic` | DictatePic |\n| `luck-factory` | Luck Factory |\n| `settings` | Settings |\n\nAny string is valid as a program ID. Third-party programs can use their own IDs\n(e.g., `my-custom-tool`) without any changes to the format.\n\n### Example: Minimal .CryptArt File\n\n```json\n{\n  \"$cryptart\": 1,\n  \"program\": \"media-mogul\",\n  \"data\": {}\n}\n```\n\n### Example: Full .CryptArt File\n\n```json\n{\n  \"$cryptart\": 1,\n  \"program\": \"vibecode-worker\",\n  \"name\": \"My Web App\",\n  \"createdAt\": \"2026-03-13T17:00:00.000Z\",\n  \"updatedAt\": \"2026-03-13T18:30:00.000Z\",\n  \"appVersion\": \"0.1.0\",\n  \"id\": \"a1b2c3d4-e5f6-7890-abcd-ef1234567890\",\n  \"meta\": {\n    \"author\": \"Matt\",\n    \"email\": \"Matt@MattyJacks.com\",\n    \"website\": \"https://mattyjacks.com\",\n    \"description\": \"A full-stack web application\",\n    \"tags\": [\"typescript\", \"react\", \"tauri\"],\n    \"license\": \"MIT\",\n    \"category\": \"web-development\",\n    \"language\": \"typescript\"\n  },\n  \"environment\": {\n    \"os\": \"windows\",\n    \"arch\": \"x86_64\",\n    \"runtime\": \"tauri\",\n    \"runtimeVersion\": \"2.2.0\"\n  },\n  \"history\": [\n    {\n      \"timestamp\": \"2026-03-13T17:00:00.000Z\",\n      \"action\": \"created\",\n      \"user\": \"Matt\"\n    },\n    {\n      \"timestamp\": \"2026-03-13T18:30:00.000Z\",\n      \"action\": \"saved\",\n      \"detail\": \"Added authentication module\"\n    }\n  ],\n  \"data\": {\n    \"rootPath\": \"/home/matt/projects/webapp\",\n    \"openFiles\": [\n      { \"path\": \"/home/matt/projects/webapp/src/App.tsx\", \"name\": \"App.tsx\" }\n    ],\n    \"activeFile\": \"/home/matt/projects/webapp/src/App.tsx\",\n    \"aiProvider\": \"openai\",\n    \"model\": \"gpt-4o\"\n  }\n}\n```\n\n### Example: Legacy Pre-v1 File (Still Readable)\n\n```json\n{\n  \"program\": \"media-mogul\",\n  \"version\": \"0.1.0\",\n  \"name\": \"Old Project\",\n  \"createdAt\": \"2026-03-01T12:00:00.000Z\",\n  \"updatedAt\": \"2026-03-01T12:00:00.000Z\",\n  \"data\": {}\n}\n```\n\nThis file has no `$cryptart` key. The parser will:\n1. Add `$cryptart: 1` in memory\n2. Migrate `version` to `appVersion`\n3. Return a valid `CryptArtFile` object\n\n---\n\n## Technology Stack\n\n### Frontend\n\n| Technology | Version | Purpose |\n|---|---|---|\n| **React** | 18.3.x | UI component framework |\n| **TypeScript** | 5.7.x | Type-safe JavaScript |\n| **Vite** | 6.0.x | Build tool and dev server |\n| **TailwindCSS** | 3.4.x | Utility-first CSS framework |\n| **React Router** | 7.13.x | Client-side routing between programs |\n| **Monaco Editor** | 4.7.x | Code editor engine (VS Code core) |\n| **Tauri API** | 2.2.x | IPC bridge to Rust backend |\n| **Tauri Dialog Plugin** | 2.6.x | Native file open/save dialogs |\n| **Tauri Shell Plugin** | 2.2.x | Shell command execution |\n\n### Backend (Rust)\n\n| Crate | Version | Purpose |\n|---|---|---|\n| **tauri** | 2.x | Desktop application framework |\n| **serde** | 1.x | Serialization/deserialization |\n| **serde_json** | 1.x | JSON parsing and generation |\n| **tokio** | 1.x | Async runtime |\n| **reqwest** | 0.12.x | HTTP client for API calls |\n| **clap** | 4.6.x | CLI argument parsing |\n| **tiny_http** | 0.12.x | Lightweight HTTP server for REST API |\n| **sha2** | 0.10.x | SHA-256 hashing (FFmpeg verification) |\n| **dirs** | 5.x | OS-specific directory paths |\n| **zip** | 2.x | Archive extraction (FFmpeg download) |\n| **chrono** | 0.4.x | Date/time handling |\n| **uuid** | 1.x | UUID generation |\n| **base64** | 0.22.x | Base64 encoding/decoding |\n| **futures-util** | 0.3.x | Async stream utilities |\n\n### Media Engine\n\n| Tool | Purpose |\n|---|---|\n| **FFmpeg** | Video/audio encoding, decoding, transcoding, and processing |\n| **FFprobe** | Media file analysis and metadata extraction |\n| **Godot Engine** | Game engine integration (GameStudio program) |\n\nFFmpeg and FFprobe are automatically downloaded on first run. The installer detects\nthe user's operating system and architecture, downloads the appropriate binaries,\nverifies their SHA-256 checksums, and stores them in the local AppData directory.\n\n### Build System\n\n| Tool | Purpose |\n|---|---|\n| **Vite** | Frontend bundling and hot module replacement |\n| **tsc** | TypeScript type checking |\n| **Cargo** | Rust compilation and dependency management |\n| **Tauri CLI** | Application packaging and distribution |\n| **PostCSS** | CSS processing pipeline |\n| **Autoprefixer** | CSS vendor prefix automation |\n\n---\n\n## Project Architecture\n\n### Directory Structure\n\n```\nCryptArtistStudio/\n|\n|-- README.md                              # This file\n|-- .gitignore                             # Git ignore rules\n|\n|-- prompts/                               # Documentation of all AI prompts used\n|   |-- all-prompts.md                     # Complete prompt history\n|   |-- bigprompt-2.md                     # Suite refactor mega-prompt\n|\n|-- v1/                                    # Main application source\n    |\n    |-- package.json                       # Node.js dependencies and scripts\n    |-- tsconfig.json                      # TypeScript configuration\n    |-- vite.config.ts                     # Vite build configuration\n    |-- tailwind.config.js                 # TailwindCSS theme and plugins\n    |-- postcss.config.js                  # PostCSS pipeline\n    |-- index.html                         # HTML entry point\n    |\n    |-- src/                               # Frontend source code\n    |   |\n    |   |-- main.tsx                       # React entry point + logger init\n    |   |-- App.tsx                        # Root component + router\n    |   |-- index.css                      # Global styles + TailwindCSS\n    |   |-- vite-env.d.ts                  # Vite type declarations\n    |   |\n    |   |-- components/                    # Shared UI components\n    |   |   |-- AIStudio.tsx               # AI-powered video generation\n    |   |   |-- ApiKeyProvider.tsx          # Shared API key React context provider\n    |   |   |-- ErrorBoundary.tsx          # React error boundary\n    |   |   |-- FFmpegSetup.tsx            # FFmpeg download progress UI\n    |   |   |-- GlobalMenuBar.tsx          # Desktop/mobile menu bar (File, Edit, View...)\n    |   |   |-- Header.tsx                 # Media Mogul header with workspace tabs\n    |   |   |-- Inspector.tsx              # Property inspector panel\n    |   |   |-- LoadingSpinner.tsx         # Loading animation component\n    |   |   |-- MediaBrowser.tsx           # Media pool + Pexels integration\n    |   |   |-- MobileNav.tsx              # Mobile-responsive navigation\n    |   |   |-- ModManager.tsx             # Mod installation and management UI\n    |   |   |-- NodeEditor.tsx             # Node-based compositing editor\n    |   |   |-- PluginManager.tsx          # Plugin installation and management UI\n    |   |   |-- PreviewCanvas.tsx          # Video preview viewport\n    |   |   |-- SettingsModal.tsx          # Global settings with API keys\n    |   |   |-- SuiteLauncher.tsx          # Main launcher with program cards\n    |   |   |-- TermsAcceptanceModal.tsx   # Privacy policy + terms acceptance\n    |   |   |-- ThemeManager.tsx           # Theme browsing, install, and creation UI\n    |   |   |-- Timeline.tsx               # Multi-track video timeline\n    |   |   |-- WorkspaceBar.tsx           # Workspace tab bar with context menu\n    |   |   |-- WorkspaceProvider.tsx      # Workspace state management provider\n    |   |\n    |   |-- programs/                      # Individual program views\n    |   |   |-- media-mogul/\n    |   |   |   |-- MediaMogul.tsx         # Media Mogul main component\n    |   |   |-- vibecode-worker/\n    |   |   |   |-- VibeCodeWorker.tsx     # VibeCodeWorker IDE component\n    |   |   |-- demo-recorder/\n    |   |   |   |-- DemoRecorder.tsx       # DemoRecorder main component\n    |   |   |-- valley-net/\n    |   |   |   |-- ValleyNet.tsx          # ValleyNet AI agent component\n    |   |   |-- game-studio/\n    |   |   |   |-- GameStudio.tsx         # GameStudio main component\n    |   |   |-- commander/\n    |   |   |   |-- Commander.tsx          # CryptArt Commander terminal\n    |   |   |-- donate-personal-seconds/\n    |   |   |   |-- DonatePersonalSeconds.tsx  # P2P compute resource sharing\n    |   |   |   |-- DPSLeaderboard.tsx         # Leaderboard for donated seconds\n    |   |   |-- clone-tool/\n    |   |   |   |-- CloneTool.tsx          # Installer builder for all platforms\n    |   |   |-- dictate-pic/\n    |   |   |   |-- DictatePic.tsx         # GIMP-style AI image editor\n    |   |   |-- luck-factory/\n    |   |   |   |-- LuckFactory.tsx        # AI luck seed generator\n    |   |   |-- settings/\n    |   |       |-- Settings.tsx           # Settings hub with API keys\n    |   |\n    |   |-- pages/                         # Static pages\n    |   |   |-- PrivacyPolicy.tsx          # Privacy policy page\n    |   |   |-- TermsOfUse.tsx             # Terms of use page\n    |   |\n    |   |-- utils/                         # Utility modules\n    |       |-- apiKeys.ts                 # Shared API key context and loaders\n    |       |-- audio-zip.ts               # ZIP audio import with security checks\n    |       |-- constants.ts               # Shared constants and type definitions\n    |       |-- cross-platform.ts          # Platform detection, capabilities, safe areas\n    |       |-- crossClipboard.ts          # Cross-program clipboard with type routing\n    |       |-- cryptart.ts                # .CryptArt file format (permanent schema)\n    |       |-- debounce.ts                # Debounce utility\n    |       |-- extensions.ts              # Shared extension manifest types (plugin/mod/theme)\n    |       |-- formatters.ts              # Number/date/size formatting\n    |       |-- hooks.ts                   # Shared React hooks library (17 hooks)\n    |       |-- interop.ts                 # Cross-program event bus (pub/sub)\n    |       |-- keyboard.ts                # Global keyboard shortcuts\n    |       |-- logger.ts                  # Frontend logging (sends to Rust)\n    |       |-- luckyRNG.ts                # Seeded PRNG for Lucky AI mode (xmur3 + mulberry32)\n    |       |-- mods.ts                    # Mod system - self-contained programs\n    |       |-- notifications.ts           # Unified notification hub\n    |       |-- openrouter.ts              # OpenRouter multi-model AI utility\n    |       |-- pipeline.ts                # Cross-program workflow pipelines\n    |       |-- platform.ts                # Platform detection + mobile viewport\n    |       |-- plugins.ts                 # Plugin system with ZIP install\n    |       |-- security.ts                # Security helpers (150+ functions)\n    |       |-- storage.ts                 # LocalStorage wrapper (validated)\n    |       |-- themes.ts                  # Theme system (Primordial, Blank, custom)\n    |       |-- toast.ts                   # Toast notification system (rate-limited)\n    |       |-- workspace.ts               # Workspace types, context, helpers\n    |\n    |-- src-tauri/                          # Rust backend\n        |\n        |-- Cargo.toml                     # Rust dependencies\n        |-- tauri.conf.json                # Tauri window/bundle configuration\n        |-- build.rs                       # Tauri build script\n        |\n        |-- src/\n        |   |-- main.rs                    # Entry point: CLI, Tauri commands, REST API\n        |   |-- state.rs                   # Application state management\n        |   |-- ai_integration.rs          # OpenAI API integration\n        |   |-- ffmpeg_installer.rs        # FFmpeg auto-download + verification\n        |   |-- logger.rs                  # Logging system (3 log files)\n        |\n        |-- icons/                         # Application icons for all platforms\n            |-- 32x32.png\n            |-- 128x128.png\n            |-- 128x128@2x.png\n            |-- icon.icns                  # macOS icon\n            |-- icon.ico                   # Windows icon\n|\n|-- website/                              # Companion marketing website\n    |-- A1/                               # Version 1 of the website\n        |-- index.html                    # Landing page\n        |-- programs.html                 # Program details page\n        |-- about.html                    # About / philosophy page\n        |-- docs.html                     # Documentation page\n        |-- download.html                 # Download page\n        |-- contact.html                  # Contact page\n        |-- privacy.html                  # Privacy policy page\n        |-- terms.html                    # Terms of use page\n        |-- donate-personal-seconds.html  # P2P resource sharing page\n        |-- style.css                     # Full dark theme stylesheet\n        |-- script.js                     # Navigation, animations, interactions\n        |-- donate-personal-seconds.js    # DonatePersonalSeconds UI controller\n        |-- donate-personal-seconds-api.js # P2P resource sharing API\n```\n\n### Frontend Architecture\n\nThe frontend follows a clean layered architecture:\n\n```\nmain.tsx                        # Entry point - initializes logger, renders App\n  |\n  App.tsx                       # Router + terms gate + ErrorBoundary\n    |\n    WorkspaceProvider           # Multi-file workspace state\n      ApiKeyProvider            # Shared API keys loaded once\n        GlobalMenuBar           # Desktop/mobile menu bar\n        WorkspaceBar            # Workspace tabs\n        |\n        |-- SuiteLauncher       # \"/\" - Program selection grid\n        |-- MediaMogul          # \"/media-mogul\" - Video/image editor\n        |-- VibeCodeWorker      # \"/vibecode-worker\" - Code IDE\n        |-- DemoRecorder        # \"/demo-recorder\" - Screen recorder\n        |-- ValleyNet           # \"/valley-net\" - AI agent\n        |-- GameStudio          # \"/game-studio\" - Game development\n        |-- Commander           # \"/commander\" - Terminal command center\n        |-- Settings            # \"/settings\" - API keys, themes, plugins\n        |-- DonatePersonalSeconds # \"/donate-personal-seconds\" - P2P compute\n        |-- DPSLeaderboard      # \"/dps-leaderboard\" - Donation leaderboard\n        |-- CloneTool           # \"/clone-tool\" - Installer builder\n        |-- LuckFactory         # \"/luck-factory\" - AI luck seed generator\n        |-- DictatePic          # \"/dictate-pic\" - AI image editor\n        |-- PrivacyPolicy       # \"/privacy\" - Privacy policy\n        |-- TermsOfUse          # \"/terms\" - Terms of use\n        |-- NotFound            # \"*\" - 404 page\n        |\n        MobileNav               # Bottom nav for mobile/tablet\n```\n\nEach program is a self-contained React component that manages its own state.\nPrograms communicate with the Rust backend through Tauri's `invoke()` IPC mechanism,\nand with each other through the interop event bus (`src/utils/interop.ts`).\n\n### Backend Architecture\n\nThe Rust backend (`main.rs`) is organized into three execution modes:\n\n1. **GUI Mode** (default) - Starts the Tauri application with all registered commands.\n2. **CLI Mode** - Parses command-line arguments via Clap and executes headless.\n3. **Server Mode** - Starts a REST API server on a configurable port.\n\n#### Rust Source Files\n\n| File | Lines | Purpose |\n|---|---|---|\n| `main.rs` | ~1,400 | CLI parsing, Tauri commands, REST API server |\n| `state.rs` | ~300 | Application state: API keys, FFmpeg paths, project data |\n| `ai_integration.rs` | ~160 | OpenAI API chat completion wrapper |\n| `ffmpeg_installer.rs` | ~220 | OS-aware FFmpeg download, extraction, verification |\n| `logger.rs` | ~280 | Thread-safe logging with 3 rolling files |\n\n#### Tauri Commands (IPC)\n\nThe backend exposes the following Tauri commands to the frontend via `invoke()`:\n\n##### FFmpeg Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `check_ffmpeg_installed` | none | `bool` | Check if FFmpeg binary exists and is executable |\n| `install_ffmpeg` | none | `string` | Download, verify, and install FFmpeg; returns install path |\n\n##### AI Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `ai_chat` | `{ message: string }` | `string` | Send a chat completion request to OpenAI |\n| `ai_generate_image` | `{ prompt: string }` | `string` | Generate an image via DALL-E; returns URL |\n| `ai_generate_tts` | `{ text: string }` | `string` | Generate OpenAI TTS audio and return saved file path |\n| `openrouter_chat` | `{ message: string, model: string }` | `string` | Chat via OpenRouter with model selection |\n| `openrouter_list_models` | none | `string` | List available OpenRouter models (JSON) |\n| `elevenlabs_text_to_speech` | `{ text: string, voiceId: string, modelId?: string }` | `string` | Generate ElevenLabs voiceover and return saved file path |\n| `elevenlabs_speech_to_text` | `{ filePath: string, modelId?: string, languageCode?: string }` | `string` | Transcribe audio via ElevenLabs STT |\n| `elevenlabs_generate_sound_effect` | `{ prompt: string, durationSeconds?: number }` | `string` | Generate sound effect audio via ElevenLabs |\n| `elevenlabs_list_voices` | none | `string` | List available ElevenLabs voices (JSON) |\n| `elevenlabs_list_models` | none | `string` | List available ElevenLabs models (JSON) |\n\n##### API Key Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `get_api_key` | none | `string` | Retrieve the stored OpenAI API key |\n| `set_api_key` | `{ key: string }` | `()` | Store an OpenAI API key (validated, max 512 chars) |\n| `get_pexels_key` | none | `string` | Retrieve the stored Pexels API key |\n| `set_pexels_key` | `{ key: string }` | `()` | Store a Pexels API key |\n| `get_openrouter_key` | none | `string` | Retrieve the stored OpenRouter API key |\n| `save_openrouter_key` | `{ key: string }` | `()` | Store an OpenRouter API key |\n| `get_elevenlabs_key` | none | `string` | Retrieve the stored ElevenLabs API key |\n| `save_elevenlabs_key` | `{ key: string }` | `()` | Store an ElevenLabs API key |\n| `export_all_api_keys` | none | `string` | Export all keys as JSON string |\n| `import_all_api_keys` | `{ json: string }` | `()` | Import keys from JSON (max 10 MB) |\n\n##### Filesystem Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `read_directory` | `{ path: string }` | `DirEntry[]` | List directory with name, path, is_dir, size |\n| `read_text_file` | `{ path: string }` | `string` | Read file contents (max 50 MB) |\n| `write_text_file` | `{ path, content: string }` | `()` | Write content to file (max 100 MB, path sanitized) |\n\n##### GiveGigs Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `set_givegigs_config` | `{ url, key, bucket: string }` | `()` | Configure GiveGigs Supabase connection |\n| `get_givegigs_config` | none | `GiveGigsConfig` | Retrieve stored GiveGigs configuration |\n| `list_givegigs_media` | `{ folder: string }` | `string` | List media files from GiveGigs bucket |\n\n##### Godot Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `godot_detect` | none | `{ found: bool }` | Auto-detect Godot engine installation |\n| `install_godot` | none | `string` | Download and install Godot engine |\n| `launch_godot` | `{ path: string }` | `()` | Launch Godot with a project file (path sanitized) |\n| `get_godot_path` | none | `string` | Get the configured Godot binary path |\n\n##### Platform and System Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `get_platform_info` | none | `PlatformInfo` | OS, arch, home dir, available memory |\n| `health_check` | none | `HealthStatus` | Application health: FFmpeg, Godot, API keys |\n\n##### Logging Commands\n\n| Command | Parameters | Returns | Description |\n|---|---|---|---|\n| `log_from_frontend` | `{ level, message: string }` | `()` | Forward frontend log to Rust logger |\n| `get_log_session` | none | `string[]` | Get last 100 lines (session log) |\n| `get_log_recent` | none | `string[]` | Get last 1,000 lines (recent log) |\n| `get_log_paths` | none | `LogPaths` | Get absolute paths to all 3 log files |\n\n### State Management\n\nThe Rust backend holds the **source of truth** for all application state. The React\nfrontend is strictly a view layer that:\n\n1. Calls Tauri commands to read/write state\n2. Manages UI-only state (tab selection, panel visibility, etc.) locally\n3. Uses `localStorage` for lightweight persistence (theme, terms accepted, etc.)\n\nState is stored in a thread-safe `AppState` struct protected by `Mutex` locks,\naccessible from any Tauri command or CLI operation.\n\n### UI Theme System\n\nCryptArtist Studio uses a unified dark theme across all programs. The theme is\ndefined through TailwindCSS custom colors and CSS custom properties.\n\n#### TailwindCSS Color Tokens\n\n| Token | Hex Value | Usage |\n|---|---|---|\n| `studio-bg` | `#0a0a0f` | Main application background |\n| `studio-panel` | `#12121a` | Panel and sidebar backgrounds |\n| `studio-surface` | `#1a1a2e` | Elevated surface elements |\n| `studio-border` | `#2a2a3e` | Borders and dividers |\n| `studio-hover` | `#2a2a4e` | Hover state backgrounds |\n| `studio-text` | `#e0e0e8` | Primary text color |\n| `studio-muted` | `#6b6b80` | Muted/disabled text |\n| `studio-secondary` | `#9090a8` | Secondary text |\n| `studio-cyan` | `#00d4ff` | Accent color (links, active states) |\n| `studio-green` | `#00ff88` | Success states, positive indicators |\n\n#### Extended Color Palette\n\n| Token | Usage |\n|---|---|\n| `info` | Informational badges and alerts |\n| `success` | Success states and confirmations |\n| `danger` | Error states and destructive actions |\n| `warning` | Warning indicators |\n| `pink` | Special highlights |\n| `teal` | Secondary accent |\n| `indigo` | Tertiary accent |\n| `lime` | Positive metrics |\n| `rose` | Critical alerts |\n| `sky` | Informational highlights |\n| `amber` | Caution indicators |\n| `emerald` | Connected/online states |\n| `violet` | Creative/AI features |\n| `fuchsia` | Special features |\n\n#### CSS Utility Classes\n\nThe global stylesheet (`index.css`) provides custom utility classes beyond Tailwind:\n\n| Class | Description |\n|---|---|\n| `.glass-card` | Frosted glass effect with backdrop-blur |\n| `.gradient-border` | Animated gradient border effect |\n| `.text-gradient-cyan` | Cyan-to-blue gradient text |\n| `.text-gradient-warm` | Orange-to-pink gradient text |\n| `.glow-cyan` | Cyan box-shadow glow effect |\n| `.glow-green` | Green box-shadow glow effect |\n| `.glow-purple` | Purple box-shadow glow effect |\n| `.glow-red` | Red box-shadow glow effect |\n| `.skeleton` | Shimmer loading placeholder animation |\n| `.pulse-ring` | Animated border pulse for active states |\n| `.provider-badge` | AI provider indicator badge |\n| `.model-selector` | AI model dropdown styling |\n| `.ai-panel` | AI feature panel layout |\n| `.ai-streaming` | Streaming response indicator |\n| `.token-bar` | Token usage progress bar |\n| `.truncate-2` | 2-line text truncation with ellipsis |\n| `.truncate-3` | 3-line text truncation with ellipsis |\n\n#### Animation Keyframes\n\n| Animation | Duration | Description |\n|---|---|---|\n| `fade-in` | 300ms | Opacity 0 to 1 |\n| `scale-in` | 300ms | Scale from 0.9 to 1 with fade |\n| `slide-in` | 400ms | Slide from below with fade |\n| `bounce-in` | 500ms | Bounce scale effect |\n| `spin-slow` | 3s | Slow continuous rotation |\n| `typing` | 1s | Typing cursor blink |\n| `float` | 3s | Gentle floating up/down |\n| `shake` | 300ms | Horizontal shake |\n| `wiggle` | 400ms | Rotation wiggle |\n| `gradient-shift` | 4s | Background gradient animation |\n| `expand` | 300ms | Height 0 to auto |\n| `collapse` | 300ms | Height auto to 0 |\n| `pop` | 200ms | Quick scale pop |\n\n### Shared Hooks Library\n\nThe `src/utils/hooks.ts` module provides reusable React hooks used across programs:\n\n| Hook | Description |\n|---|---|\n| `useLocalStorage(key, initial)` | Persist state to localStorage with validation |\n| `useDebounce(value, delay)` | Debounce a rapidly changing value |\n| `useInterval(callback, delay)` | Safe interval with automatic cleanup |\n| `useTimeout(callback, delay)` | Safe timeout with automatic cleanup |\n| `useToggle(initial)` | Boolean toggle with on/off/toggle functions |\n| `useClickOutside(ref, handler)` | Detect clicks outside a referenced element |\n| `useKeyPress(key)` | Detect when a specific key is pressed |\n| `useMediaQuery(query)` | Responsive media query matching |\n| `usePrevious(value)` | Track the previous value of a variable |\n| `useClipboard()` | Copy text to clipboard with status |\n| `useDocumentTitle(title)` | Set the browser document title |\n| `useCounter(initial)` | Increment/decrement/reset counter |\n| `useWindowSize()` | Track window dimensions on resize |\n| `useHover(ref)` | Track hover state on an element |\n| `useAsync(asyncFn)` | Execute async functions with loading/error state |\n| `useThrottle(value, limit)` | Throttle a rapidly changing value |\n| `useScrollPosition()` | Track scroll position of the window |\n\n### Shared Constants Library\n\nThe `src/utils/constants.ts` module centralizes all magic strings and numbers:\n\n| Category | Examples |\n|---|---|\n| **APP Metadata** | Name, version, identifier, website, contact |\n| **Program IDs** | `media-mogul`, `vibecode-worker`, `demo-recorder`, etc. |\n| **Routes** | `/media-mogul`, `/vibecode-worker`, `/settings`, etc. |\n| **localStorage Keys** | `cryptartist_favorites`, `cryptartist_theme`, etc. |\n| **API Providers** | OpenAI, Anthropic, Google, OpenRouter, Custom |\n| **AI Models** | 15 popular model IDs with display names |\n| **Editor Defaults** | Font size, tab size, theme, word wrap, minimap |\n| **Media Formats** | MP4, WebM, GIF, PNG, JPEG, WAV, MP3 |\n| **Resolution Presets** | 720p, 1080p, 1440p, 4K with dimensions |\n| **Keyboard Shortcuts** | All global and per-program shortcuts |\n| **Accent Colors** | 12 selectable accent colors with hex values |\n| **File Type Icons** | Emoji icons for 20+ file extensions |\n| **Timing Constants** | Toast duration, debounce delay, auto-save interval |\n| **Size Limits** | Max file size, max storage, max history entries |\n\n### Development Statistics\n\nCryptArtist Studio was built over 42+ AI-assisted development sessions. Here is a\nsummary of the project's scope:\n\n| Metric | Count |\n|---|---|\n| **Total Prompts** | 43+ |\n| **Programs in Suite** | 11 (+ Suite Launcher) |\n| **Tauri Commands** | 35+ |\n| **CLI Commands** | 20+ |\n| **REST API Endpoints** | 18+ |\n| **Commander Built-In Commands** | 40+ |\n| **UI/UX Improvements** | 370+ |\n| **Security Vulnerability Fixes** | 300 |\n| **Security Helper Functions** | 150+ |\n| **React Hooks (shared)** | 17 |\n| **Interop Event Types** | 30+ (11 categories) |\n| **Cross-Program Pipelines** | 6 built-in |\n| **OpenRouter Models** | 15 popular (200+ available) |\n| **AI Efficiency Modes** | 5 (Cheap, Fast, Good, Smart, Lucky) |\n| **Website Pages** | 9 |\n| **Log Files** | 3 (session, recent, full history) |\n| **Supported Languages (Editor)** | 20+ |\n| **.CryptArt Optional Fields** | 30+ |\n| **Known Program IDs** | 11 |\n| **CSS Utility Classes** | 50+ |\n| **Animation Keyframes** | 13 |\n| **TailwindCSS Color Tokens** | 24+ |\n| **Keyboard Shortcuts** | 16+ |\n| **Utility Modules** | 20+ |\n| **Frontend Source Files** | 50+ |\n| **Rust Source Files** | 5 |\n| **README Lines** | 4,600+ |\n\n#### Technology Breakdown\n\n| Language | Approximate Lines | Files |\n|---|---|---|\n| **TypeScript/TSX** | ~35,000 | ~50 |\n| **Rust** | ~2,400 | 5 |\n| **CSS** | ~3,500 | 2 |\n| **HTML** | ~6,000 | 10 |\n| **JavaScript** | ~1,500 | 3 |\n| **JSON** | ~500 | 5 |\n| **Markdown** | ~6,000 | 3 |\n| **Total** | ~55,000 | ~78 |\n\n---\n\n## Getting Started\n\n### Prerequisites\n\nBefore building CryptArtist Studio, ensure you have the following installed:\n\n| Requirement | Version | Download |\n|---|---|---|\n| **Node.js** | 18.x or later | [nodejs.org](https://nodejs.org/) |\n| **npm** | 9.x or later | Included with Node.js |\n| **Rust** | 1.70 or later | [rustup.rs](https://rustup.rs/) |\n| **Tauri CLI** | 2.x | `npm install -g @tauri-apps/cli` |\n\n**Platform-specific requirements:**\n\n- **Windows:** Microsoft Visual Studio C++ Build Tools, WebView2 (included in Windows 10/11)\n- **macOS:** Xcode Command Line Tools (`xcode-select --install`)\n- **Linux:** `libwebkit2gtk-4.1-dev`, `libappindicator3-dev`, `librsvg2-dev`, `patchelf`\n\n### Installation\n\n```bash\n# 1. Clone the repository\ngit clone https://github.com/mattyjacks/CryptArtistStudio.git\ncd CryptArtistStudio\n\n# 2. Install frontend dependencies\ncd v1\nnpm install\n\n# 3. Verify Rust toolchain\nrustup update\ncargo --version\n```\n\n### Development Mode\n\n```bash\n# Start the development server with hot reload\ncd v1\nnpm run tauri dev\n```\n\nThis command:\n1. Starts the Vite dev server on `http://localhost:1420`\n2. Compiles the Rust backend\n3. Opens the Tauri application window\n4. Enables hot module replacement for frontend changes\n\n### Building for Production\n\n```bash\n# Build the optimized release binary\ncd v1\nnpm run tauri build\n```\n\nThe compiled application will be in:\n- **Windows:** `v1/src-tauri/target/release/cryptartist-studio.exe`\n- **macOS:** `v1/src-tauri/target/release/bundle/macos/CryptArtist Studio.app`\n- **Linux:** `v1/src-tauri/target/release/bundle/appimage/cryptartist-studio.AppImage`\n\n### Type Checking\n\n```bash\n# TypeScript type check (frontend)\ncd v1\nnpx tsc --noEmit\n\n# Rust check (backend)\ncd v1/src-tauri\ncargo check\n```\n\n### Platform Support\n\n| Platform | Status | Notes |\n|---|---|---|\n| **Windows 10/11** | Supported | Primary development platform |\n| **macOS 12+** | Supported | Intel and Apple Silicon |\n| **Linux (Ubuntu 22+)** | Supported | AppImage and .deb bundles |\n| **Android** | In Progress | Tauri mobile support |\n| **iOS** | In Progress | Tauri mobile support |\n\n---\n\n## CLI Reference\n\nCryptArtist Studio includes a full command-line interface powered by Clap. Every\nfeature available in the GUI can also be accessed from the terminal.\n\n### Usage\n\n```bash\n# Run the GUI (default)\ncryptartist-studio\n\n# Run a CLI command\ncryptartist-studio <command> [options]\n```\n\n### Global Commands\n\n#### `new` - Create a new project\n\n```bash\ncryptartist-studio new --path ./my-project\n\n# Creates a new project directory with default structure\n```\n\n| Flag | Description |\n|---|---|\n| `--path <PATH>` | Directory path for the new project |\n\n#### `info` - Show project information\n\n```bash\ncryptartist-studio info --path ./my-project\n\n# Displays project metadata, media files, timeline info\n```\n\n| Flag | Description |\n|---|---|\n| `--path <PATH>` | Path to the project directory |\n\n### Project Management Commands\n\n#### `cryptart create` - Create a .CryptArt file\n\n```bash\ncryptartist-studio cryptart create \\\n  --program vibecode-worker \\\n  --name \"My Project\" \\\n  --path ./project.CryptArt\n```\n\n| Flag | Description |\n|---|---|\n| `--program <ID>` | Program identifier (e.g., `media-mogul`, `vibecode-worker`) |\n| `--name <NAME>` | Human-readable project name |\n| `--path <PATH>` | Output file path |\n\nThe created file includes `$cryptart: 1`, `appVersion`, and a default `meta` object\nwith `website: \"https://mattyjacks.com\"`.\n\nUnknown program IDs are allowed with a warning - the format is open and extensible.\n\n#### `cryptart inspect` - Inspect a .CryptArt file\n\n```bash\ncryptartist-studio cryptart inspect --path ./project.CryptArt\n```\n\nExample output:\n\n```\nFormat:     .CryptArt v1\nProgram:    vibecode-worker\nApp Ver:    0.1.0\nName:       My Project\nCreated:    2026-03-13T17:00:00.000Z\nUpdated:    2026-03-13T18:30:00.000Z\nWebsite:    https://mattyjacks.com\nData keys:  [\"rootPath\", \"openFiles\", \"activeFile\"]\n```\n\nThe inspect command handles both old (pre-v1) and new format files, displaying\nall available fields including `meta`, `extensions`, and `history` when present.\n\n### Media Commands\n\n#### `add-media` - Add media to a project\n\n```bash\ncryptartist-studio add-media \\\n  --project ./project \\\n  --file ./video.mp4\n```\n\n| Flag | Description |\n|---|---|\n| `--project <PATH>` | Project directory |\n| `--file <PATH>` | Media file to add |\n\n#### `pexels` - Search Pexels for media\n\n```bash\ncryptartist-studio pexels --query \"ocean sunset\" --type photos --count 5\n```\n\n| Flag | Description |\n|---|---|\n| `--query <TEXT>` | Search query |\n| `--type <TYPE>` | `photos` or `videos` |\n| `--count <N>` | Number of results (default: 10) |\n\n#### `export` - Export a project\n\n```bash\ncryptartist-studio export \\\n  --project ./project \\\n  --format mp4 \\\n  --output ./output.mp4\n```\n\n| Flag | Description |\n|---|---|\n| `--project <PATH>` | Project directory |\n| `--format <FMT>` | Output format (mp4, webm, gif, png) |\n| `--output <PATH>` | Output file path |\n\n### AI Commands\n\n#### `chat` - Send a message to the AI\n\n```bash\ncryptartist-studio chat --message \"Write a Python script that sorts a list\"\n```\n\n| Flag | Description |\n|---|---|\n| `--message <TEXT>` | Message to send to the AI |\n\n### File System Commands\n\n#### `read-file` - Read a file's contents\n\n```bash\ncryptartist-studio read-file --path ./src/App.tsx\n```\n\n#### `write-file` - Write content to a file\n\n```bash\ncryptartist-studio write-file --path ./output.txt --content \"Hello, world!\"\n```\n\n#### `ls` - List directory contents\n\n```bash\ncryptartist-studio ls --path ./src\n```\n\n### Server Commands\n\n#### `serve` - Start the REST API server\n\n```bash\ncryptartist-studio serve --port 8080 --api-key my-secret-key\n```\n\n| Flag | Description |\n|---|---|\n| `--port <PORT>` | Port number (default: 8080) |\n| `--api-key <KEY>` | Optional API key for authentication |\n\n### System Commands\n\n#### `sysinfo` - Display system information\n\n```bash\ncryptartist-studio sysinfo\n```\n\nOutputs: OS, architecture, FFmpeg status, Godot status, log paths, and version info.\n\n#### `list-programs` - List available programs\n\n```bash\ncryptartist-studio list-programs\n```\n\nOutputs all eleven programs with their IDs, names, and descriptions.\n\n---\n\n## REST API Reference\n\nCryptArtist Studio includes a built-in REST API server powered by `tiny_http`.\nThis enables integration with external tools, automation scripts, and AI agents.\n\n### Starting the Server\n\n```bash\n# Start with default settings\ncryptartist-studio serve\n\n# Start with custom port and API key\ncryptartist-studio serve --port 3000 --api-key my-secret-key\n```\n\n### Authentication\n\nIf an `--api-key` is specified, all requests must include the `X-API-Key` header:\n\n```bash\ncurl -H \"X-API-Key: my-secret-key\" http://localhost:8080/health\n```\n\nRequests without a valid API key will receive a `401 Unauthorized` response.\n\n### Endpoints\n\n#### Health Check\n\n```\nGET /health\n```\n\nReturns `{\"status\": \"ok\"}` if the server is running.\n\n#### AI Chat\n\n```\nPOST /ai/chat\nContent-Type: application/json\n\n{\n  \"message\": \"Explain async/await in Rust\"\n}\n```\n\nReturns the AI response as a JSON object with a `reply` field.\n\n#### File Operations\n\n```\nGET /files/read?path=/path/to/file.txt\n```\n\nReturns the file contents as plain text.\n\n```\nPOST /files/write\nContent-Type: application/json\n\n{\n  \"path\": \"/path/to/file.txt\",\n  \"content\": \"Hello, world!\"\n}\n```\n\n#### Directory Listing\n\n```\nGET /files/list?path=/path/to/directory\n```\n\nReturns a JSON array of directory entries with name, path, is_dir, and size.\n\n#### Pexels Search\n\n```\nGET /pexels/search?query=ocean+sunset&type=photos&count=5\n```\n\nReturns Pexels API search results.\n\n#### Project Management\n\n```\nPOST /project/new\nContent-Type: application/json\n\n{\n  \"path\": \"/path/to/project\"\n}\n```\n\n```\nGET /project/info?path=/path/to/project\n```\n\n#### System Information\n\n```\nGET /sysinfo\n```\n\nReturns system information as JSON.\n\n#### Export\n\n```\nPOST /export\nContent-Type: application/json\n\n{\n  \"project\": \"/path/to/project\",\n  \"format\": \"mp4\",\n  \"output\": \"/path/to/output.mp4\"\n}\n```\n\n### CORS\n\nAll API responses include the following headers:\n\n```\nAccess-Control-Allow-Origin: *\nContent-Type: application/json\n```\n\n### Response Format\n\nAll endpoints return JSON responses. Error responses include a `message` field:\n\n```json\n{\n  \"error\": \"Not Found\",\n  \"message\": \"The requested endpoint does not exist\"\n}\n```\n\n---\n\n## Configuration\n\n### API Keys\n\nCryptArtist Studio supports multiple AI providers. API keys are stored securely\nin the Rust backend state (never in frontend localStorage):\n\n| Provider | Setting | Used By |\n|---|---|---|\n| **OpenAI** | Settings > API Keys > OpenAI Key | AI Chat, Image Generation, TTS, AI Studio |\n| **OpenRouter** | Settings > API Keys > OpenRouter Key | All AI features (200+ models), primary provider |\n| **Pexels** | Settings > API Keys > Pexels Key | Media Browser, stock photo/video search |\n| **ElevenLabs** | Settings > API Keys > ElevenLabs Key | TTS voiceover, STT transcription, SFX generation |\n| **GiveGigs** | Settings > API Keys > GiveGigs/Supabase Key | Media asset library via Supabase |\n| **Anthropic** | VibeCodeWorker Settings | VCW AI Assistant (via direct API) |\n| **Google** | VibeCodeWorker Settings | VCW AI Assistant (via direct API) |\n| **Custom** | VibeCodeWorker Settings | Any OpenAI-compatible endpoint |\n\n#### Setting Keys via CLI\n\n```bash\n# Set OpenAI key (stored in app state)\ncryptartist-studio serve --api-key my-key\n```\n\n#### Setting Keys via REST API\n\n```bash\ncurl -X POST http://localhost:8080/settings/api-key \\\n  -H \"Content-Type: application/json\" \\\n  -d '{\"key\": \"sk-...\"}'\n```\n\n### FFmpeg Setup\n\nFFmpeg is required for video/audio processing in Media Mogul. On first launch,\nCryptArtist Studio will:\n\n1. Detect the user's OS and architecture\n2. Download the appropriate FFmpeg and FFprobe binaries\n3. Verify SHA-256 checksums\n4. Store binaries in the local AppData directory:\n   - **Windows:** `%LOCALAPPDATA%\\CryptArtist Studio\\ffmpeg\\`\n   - **macOS:** `~/Library/Application Support/CryptArtist Studio/ffmpeg/`\n   - **Linux:** `~/.local/share/CryptArtist Studio/ffmpeg/`\n\nIf FFmpeg is already installed system-wide, CryptArtist Studio will detect and\nuse it automatically.\n\n### Godot Integration\n\nGameStudio requires the Godot Engine. CryptArtist Studio can:\n\n1. **Auto-detect** an existing Godot installation\n2. **Download** Godot automatically (similar to FFmpeg setup)\n3. **Launch** Godot with project files from within the app\n\nConfigure the Godot path in Settings or let the auto-detection handle it.\n\n### Tauri Configuration\n\nThe Tauri configuration lives in `v1/src-tauri/tauri.conf.json`:\n\n```json\n{\n  \"productName\": \"CryptArtist Studio\",\n  \"version\": \"1.69.420.4\",\n  \"identifier\": \"com.cryptartist.studio\",\n  \"app\": {\n    \"windows\": [{\n      \"title\": \"CryptArtist Studio\",\n      \"width\": 1440,\n      \"height\": 900,\n      \"minWidth\": 360,\n      \"minHeight\": 480\n    }]\n  },\n  \"bundle\": {\n    \"fileAssociations\": [{\n      \"ext\": [\"CryptArt\"],\n      \"mimeType\": \"application/x-cryptartist-art\",\n      \"description\": \"CryptArtist Art\"\n    }]\n  }\n}\n```\n\n---\n\n## Logging System\n\nCryptArtist Studio includes a comprehensive logging system that captures events\nfrom the Rust backend, Tauri commands, REST API, CLI, and frontend.\n\n### Log Files\n\nThree log files are maintained simultaneously:\n\n| File | Description | Location |\n|---|---|---|\n| `cryptartist-session.txt` | Last 100 lines since current run | `{AppData}/CryptArtist Studio/logs/` |\n| `cryptartist-recent.txt` | Rolling last 1,000 lines | `{AppData}/CryptArtist Studio/logs/` |\n| `cryptartist-full-history.txt` | Append-only full history | `{AppData}/CryptArtist Studio/logs/` |\n\n**AppData locations by platform:**\n- **Windows:** `%LOCALAPPDATA%\\CryptArtist Studio\\logs\\`\n- **macOS:** `~/Library/Application Support/CryptArtist Studio/logs\\`\n- **Linux:** `~/.local/share/CryptArtist Studio/logs/`\n\n### Log Levels\n\n| Level | Prefix | Description |\n|---|---|---|\n| **Debug** | `[DEBUG]` | Verbose diagnostic information |\n| **Info** | `[INFO]` | General operational events |\n| **Warn** | `[WARN]` | Potential issues that don't prevent operation |\n| **Error** | `[ERROR]` | Errors that need attention |\n| **Command** | `[CMD]` | Tauri command invocations |\n| **CLI** | `[CLI]` | CLI command executions |\n| **API** | `[API]` | REST API request/response cycle |\n| **Frontend** | `[FE]` | Frontend events forwarded from TypeScript |\n\n### Log Format\n\nEach log line follows this format:\n\n```\n2026-03-13T17:05:23.456Z [INFO] [source] message\n```\n\n### Frontend Logging\n\nThe frontend logging system (`src/utils/logger.ts`) automatically captures:\n\n- All `console.error()` and `console.warn()` calls\n- Unhandled JavaScript errors\n- Unhandled promise rejections\n- Program launches and navigation events\n- Keyboard shortcut activations\n- User actions (terms acceptance, settings changes, etc.)\n\nFrontend logs are forwarded to the Rust backend via the `log_from_frontend`\nTauri command and written to the same three log files.\n\n### Reading Logs via Tauri Commands\n\n```typescript\n// Get the last 100 lines (session log)\nconst session = await invoke<string[]>(\"get_log_session\");\n\n// Get the last 1,000 lines (recent log)\nconst recent = await invoke<string[]>(\"get_log_recent\");\n\n// Get the file paths of all log files\nconst paths = await invoke(\"get_log_paths\");\n```\n\n---\n\n## Keyboard Shortcuts\n\n| Shortcut | Action | Context |\n|---|---|---|\n| `Ctrl+S` / `Cmd+S` | Save current file | VibeCodeWorker, GameStudio |\n| `Ctrl+O` / `Cmd+O` | Open file/folder | All programs |\n| `Ctrl+N` / `Cmd+N` | New project | All programs |\n| `Ctrl+Z` / `Cmd+Z` | Undo | Editor, Timeline |\n| `Ctrl+Shift+Z` / `Cmd+Shift+Z` | Redo | Editor, Timeline |\n| `Ctrl+F` / `Cmd+F` | Find in file | VibeCodeWorker |\n| `Ctrl+Shift+F` / `Cmd+Shift+F` | Find in project | VibeCodeWorker |\n| `Ctrl+P` / `Cmd+P` | Quick file open | VibeCodeWorker |\n| `Space` | Play/Pause | Media Mogul, DemoRecorder |\n| `Escape` | Back to Suite Launcher | All programs |\n\nKeyboard shortcuts are logged automatically for debugging and analytics purposes.\n\n#### Additional Keyboard Shortcuts\n\n| Shortcut | Action | Context |\n|---|---|---|\n| `1` - `8` | Quick-launch program by number | Suite Launcher |\n| `?` | Show keyboard shortcuts overlay | Suite Launcher |\n| `R` | Show recent projects panel | Suite Launcher |\n| `Ctrl+Shift+P` / `Cmd+Shift+P` | Command palette | VibeCodeWorker |\n| `Tab` | Autocomplete command | CryptArt Commander |\n| `Up Arrow` / `Down Arrow` | Navigate command history | CryptArt Commander |\n\n---\n\n## OpenRouter Multi-Model AI Integration\n\nCryptArtist Studio integrates with [OpenRouter](https://openrouter.ai/) to provide\naccess to 200+ AI models from multiple providers through a single API key. OpenRouter\nis deeply integrated into every program that uses AI.\n\n### Supported Providers\n\n| Provider | Models Available | Example Model IDs |\n|---|---|---|\n| **OpenAI** | GPT-5 Mini, GPT-4o, GPT-4o Mini, o1 | `openai/gpt-5-mini`, `openai/gpt-4o` |\n| **Anthropic** | Claude 3.5 Sonnet, Claude 3 Opus, Claude 3 Haiku | `anthropic/claude-3.5-sonnet`, `anthropic/claude-3-opus` |\n| **Google** | Gemini Pro 1.5, Gemini Flash 1.5 | `google/gemini-pro-1.5`, `google/gemini-flash-1.5` |\n| **Meta** | Llama 3.1 405B, Llama 3.1 70B | `meta-llama/llama-3.1-405b-instruct` |\n| **Mistral** | Mixtral 8x22B, Mistral Large | `mistralai/mixtral-8x22b-instruct` |\n| **Perplexity** | Llama 3.1 Sonar 70B | `perplexity/llama-3.1-sonar-huge-128k-online` |\n\n### Model Selection\n\n`openai/gpt-5-mini` is the default model for all purposes unless overridden.\n\nModel and mode can be changed from:\n\n- **Settings** > OpenRouter section (global default)\n- **Settings** > Per-Action AI Defaults (persistent per-action overrides)\n- **ValleyNet** config toolbar (action-specific override)\n- **VibeCodeWorker** AI settings panel (action-specific override)\n- **GameStudio** AI Generator panel header (action-specific override)\n- **DemoRecorder** AI Tools panel header (action-specific override)\n- **CryptArt Commander** via `or models` command\n\n### AI Efficiency Modes\n\nAll major AI actions support five efficiency modes:\n\n- **`💳 Cheap`** - Keep responses token-efficient and cost-minimized\n- **`⚡ Fast`** - Prefer fastest useful completion path\n- **`🦄 Good`** - Encourage commonwealth goodness, keep tone clever/funny, and keep code quality strict\n- **`🧠 Smart`** - Default mode with maximum precision and practical intelligence\n- **`🍀 Lucky`** - Seed AI generation from a deterministic luck value computed by Luck Factory [Lck].\n  On first use, the user is redirected to Luck Factory to anchor their luck seed with a\n  personal intention string. The seed (0-999 base + preset of 69/420/777) influences AI\n  prompt construction for serendipitous results.\n\n### Fallback Behavior\n\nThe shared OpenRouter utility (`src/utils/openrouter.ts`) implements a two-tier\nfallback strategy:\n\n```\n1. Try OpenRouter first (if key is configured)\n   - Send request to https://openrouter.ai/api/v1/chat/completions\n   - Include HTTP-Referer and X-Title headers for ranking\n2. If OpenRouter fails or is not configured:\n   - Fall back to direct OpenAI API (if OpenAI key is configured)\n3. If both fail:\n   - Return error to the user\n```\n\n### Rust Backend Integration\n\nThe Rust backend exposes these OpenRouter commands:\n\n| Command | Description |\n|---|---|\n| `save_openrouter_key` | Store the OpenRouter API key |\n| `get_openrouter_key` | Retrieve the stored key |\n| `openrouter_chat` | Send a chat completion request to OpenRouter |\n| `openrouter_list_models` | List available models from OpenRouter |\n\nThe `openrouter_chat` command includes:\n- Model ID validation (must match `provider/model-name` format)\n- Bearer token authentication\n- HTTP-Referer header set to `https://mattyjacks.com`\n- X-Title header set to `CryptArtist Studio`\n- 30-second request timeout\n- Response size limiting\n\n### Frontend Utility Module\n\nThe `src/utils/openrouter.ts` module provides:\n\n```typescript\nchatWithAI(prompt, options?)    // OpenRouter-first with OpenAI fallback\nlistModels()                    // List available models\nisOpenRouterConfigured()        // Check if key is set\nisOpenAIConfigured()            // Check if OpenAI key is set\ngetAIStatus()                   // Get full AI readiness status\ngetDefaultModel()               // Get stored default model\nsetDefaultModel(model)          // Set default model (validated)\ngetDefaultMode()                // Get global AI mode (cheap/fast/good/smart)\nsetDefaultMode(mode)            // Set global AI mode\ngetActionModel(action)          // Get per-action model override\nsetActionModel(action, model)   // Set per-action model override\ngetActionMode(action)           // Get per-action mode override\nsetActionMode(action, mode)     // Set per-action mode override\n```\n\n---\n\n## Security Hardening\n\nCryptArtist Studio has undergone comprehensive security hardening with 300 vulnerability\nfixes across the Rust backend and TypeScript frontend. The fixes are organized into\nten batches covering all major vulnerability categories.\n\n### Overview of 300 Vulnerability Fixes\n\n#### BATCH A (Vulns 1-25): Rust Backend\n\n| # | Category | Fix Description |\n|---|---|---|\n| 1-3 | **API Key Validation** | Max 512 chars, printable ASCII only, reject empty keys |\n| 4-5 | **URL Validation** | Trusted domain whitelist, HTTPS enforcement for external calls |\n| 6-7 | **Prompt Validation** | Max 32,000 chars, UTF-8 validation |\n| 8-9 | **File Size Limits** | 50 MB read limit, 100 MB write limit |\n| 10-11 | **Search Validation** | Search type enum validation, query length limits |\n| 12-13 | **HTTP Timeouts** | 30-second timeout on all outbound HTTP requests |\n| 14-15 | **Path Sanitization** | Extended sanitization for Godot project paths |\n| 16-17 | **Template Validation** | Godot template parameters sanitized |\n| 18-19 | **Log Limits** | Log message truncated to 2,000 chars, level validated |\n| 20-21 | **Import Limits** | Key import JSON limited to 10 MB |\n| 22-24 | **REST API CORS** | OPTIONS preflight handler, Content-Type validation |\n| 25 | **Security Headers** | X-Content-Type-Options, X-Frame-Options on all responses |\n\n#### BATCH B (Vulns 26-50): Frontend XSS, Sanitization, CSP\n\n| # | Category | Fix Description |\n|---|---|---|\n| 26-27 | **CSP** | Content Security Policy meta tag in index.html |\n| 28-29 | **localStorage** | Key format validation, value size limits (5 MB) |\n| 30-31 | **Preferences** | Schema validation for theme, fontSize, autoSave, etc. |\n| 32-33 | **Recent Projects** | Path and name sanitization, character limits |\n| 34-36 | **Command Input** | Length limits, file path sanitization |\n| 37-39 | **Toast System** | Rate limiting, message truncation, queue size limits |\n| 40-41 | **Model Validation** | Model ID format validation (`provider/model`) |\n| 42-44 | **URL Validation** | Trusted domain whitelist in frontend |\n| 45-47 | **Search Sanitization** | Search query length limits, character filtering |\n| 48-50 | **Prototype Pollution** | `sanitizeObjectKeys()` on parsed JSON, ISO date validation |\n\n#### BATCH C (Vulns 51-75): Memory Leaks, Race Conditions, Resource Limits\n\n| # | Category | Fix Description |\n|---|---|---|\n| 51-53 | **Timeout Cleanup** | Track all `setTimeout`/`setInterval`, clean up on unmount |\n| 52-54 | **Peer Limits** | Max 50 peer connections in DonatePersonalSeconds |\n| 55-57 | **Log Limits** | Max 200 log entries in activity logs |\n| 58-60 | **History Limits** | Max 200 display entries, 500 command history entries |\n| 61-63 | **Input Limits** | Max 10,000 char command input, 50,000 char scripts |\n| 64-66 | **Double-Click** | `preventDoubleClick()` guard on destructive actions |\n| 67-69 | **Script Limits** | Max script content size, env var count limits |\n| 70-72 | **Alias Limits** | Max 50 command aliases |\n| 73-75 | **Search Limits** | Search query sanitization in Suite Launcher |\n\n#### BATCH D (Vulns 76-100): Hardening, Crypto, Audit Logging\n\n| # | Category | Fix Description |\n|---|---|---|\n| 76-78 | **Security Headers** | X-XSS-Protection, Referrer-Policy, Permissions-Policy |\n| 79-81 | **Referrer Policy** | `strict-origin-when-cross-origin` meta tag |\n| 82-84 | **Cache Control** | `no-store` for sensitive API responses |\n| 85-87 | **Secure Random** | `crypto.getRandomValues()` for all IDs and tokens |\n| 88-90 | **Audit Logger** | `logSecurityEvent()` for all security-relevant events |\n| 91-93 | **Safe JSON** | `safeJsonStringify()` with circular reference handling |\n| 94-96 | **File Extensions** | Allowlist validation for uploaded/opened files |\n| 97-98 | **Suspicious Paths** | Warning on paths containing `..`, `~`, or null bytes |\n| 99-100 | **UTF-8 Validation** | Input string validation before processing |\n\n#### BATCH E (Vulns 101-125): Advanced Frontend Hardening\n\n| # | Category | Fix Description |\n|---|---|---|\n| 101-103 | **DOM XSS** | Safe innerHTML alternatives, attribute sanitization |\n| 104-106 | **Event Handlers** | Event listener cleanup, delegation limits |\n| 107-109 | **iframe Security** | Sandbox attributes, postMessage origin validation |\n| 110-112 | **Form Security** | CSRF token validation, autocomplete controls |\n| 113-115 | **CSS Injection** | Color value validation, safe CSS property setting |\n| 116-118 | **Web Worker** | Worker script URL validation, message size limits |\n| 119-121 | **WebSocket** | Connection limits, message size validation |\n| 122-125 | **Canvas Security** | Canvas fingerprint mitigation, tainted canvas detection |\n\n#### BATCH F (Vulns 126-150): API and Network Security\n\n| # | Category | Fix Description |\n|---|---|---|\n| 126-128 | **Fetch Hardening** | Request timeout enforcement, response size limits |\n| 129-131 | **CORS** | Strict origin checking, preflight caching |\n| 132-134 | **Cookie Security** | Secure/HttpOnly/SameSite enforcement |\n| 135-137 | **CSP Nonce** | Dynamic script nonce generation |\n| 138-140 | **SRI** | Subresource integrity hash validation |\n| 141-143 | **Rate Limiting** | Per-endpoint rate limiting with sliding window |\n| 144-146 | **Request Queue** | Priority-based request queuing |\n| 147-150 | **Error Handling** | Safe error serialization, stack trace redaction |\n\n#### BATCH G (Vulns 151-175): Data Protection\n\n| # | Category | Fix Description |\n|---|---|---|\n| 151-153 | **Template Safety** | Safe template literal interpolation |\n| 154-156 | **Clipboard** | Clipboard data sanitization, paste event filtering |\n| 157-159 | **Drag-Drop** | File validation on drop, type checking |\n| 160-162 | **Storage Encryption** | AES-GCM encrypted localStorage wrapper |\n| 163-165 | **Key Management** | Web Crypto API key generation and export |\n| 166-168 | **Credential Leak** | URL credential detection, referrer stripping |\n| 169-171 | **HSTS** | HTTP Strict Transport Security enforcement |\n| 172-175 | **Cookie Consent** | Cookie consent manager with category controls |\n\n#### BATCH H (Vulns 176-200): Resource Management\n\n| # | Category | Fix Description |\n|---|---|---|\n| 176-178 | **Focus Trap** | Modal focus containment for accessibility |\n| 179-181 | **Scroll Safety** | Scroll restoration control, position validation |\n| 182-184 | **Content Disposition** | Header validation for file downloads |\n| 185-187 | **DOM Monitoring** | DOM size tracking, mutation rate limiting |\n| 188-190 | **Lazy Loading** | Secure lazy load with crossorigin and referrerpolicy |\n| 191-193 | **Intersection Observer** | Safe observer factory with error handling |\n| 194-196 | **Resource Timing** | Performance entry analysis for slow/cross-origin resources |\n| 197-200 | **Connection Pool** | Hostname connection limits, pool management |\n\n#### BATCH I (Vulns 201-250): Advanced Security Utilities\n\n| # | Category | Fix Description |\n|---|---|---|\n| 201-203 | **CSP Nonce Injection** | Dynamic nonce generation for inline scripts |\n| 204-206 | **SRI Cache** | Subresource integrity hash caching |\n| 207-209 | **Form Guard** | Secure form submission with action URL validation |\n| 210-212 | **postMessage** | Safe cross-window messaging with origin verification |\n| 213-215 | **DOM Mutation** | Rate-limited DOM mutation tracking |\n| 216-218 | **Text Purification** | Control character stripping, Unicode normalization |\n| 219-221 | **URL Builder** | Safe URL construction with parameter encoding |\n| 222-224 | **Credential Detection** | URL userinfo detection and warning |\n| 225-227 | **HSTS Check** | Strict-Transport-Security header validation |\n| 228-230 | **Cookie Consent** | Granular analytics/functional/marketing consent |\n| 231-233 | **Web Crypto** | AES-GCM key generation and secure export |\n| 234-236 | **Permission Guard** | Throttled permission request with cooldowns |\n| 237-239 | **Object Safety** | Prototype-safe property access with fallbacks |\n| 240-242 | **Event Guard** | Propagation control, secure worker creation |\n| 243-245 | **Leak Detection** | Stale object tracking with age-based eviction |\n| 246-248 | **Blob Security** | MIME type validation for Blob creation |\n| 249-250 | **Array Zeroing** | Typed array secure zeroing, enum validation |\n\n#### BATCH J (Vulns 251-300): Platform API Guards and Comprehensive Init\n\n| # | Category | Fix Description |\n|---|---|---|\n| 251-252 | **Encrypted Storage** | AES-GCM encrypt/decrypt localStorage wrapper |\n| 253-254 | **WebSocket Monitor** | Heartbeat/pong monitoring with auto-disconnect |\n| 255-256 | **Drag-Drop Validation** | File type, size, and extension validation on drop |\n| 257-258 | **Fetch Retry** | Exponential backoff retry with abort timeout |\n| 259-260 | **SVG Sanitization** | Dangerous tag/attribute removal from SVG markup |\n| 261-262 | **WebGL Guard** | Context count limiting, leak prevention |\n| 263-264 | **Audio Fingerprint** | Oscillator creation monitoring to detect fingerprinting |\n| 265-266 | **Battery/Geolocation** | Privacy guards with value quantization |\n| 267-268 | **BroadcastChannel** | Origin-validated cross-tab messaging |\n| 269-270 | **Device Orientation** | Listener limits, precision reduction |\n| 271-272 | **Speech/Gamepad** | Single-instance guards, ID truncation |\n| 273-274 | **SharedArrayBuffer** | Cross-origin isolation check |\n| 275-276 | **WebTransport** | Connection count limits |\n| 277-278 | **WASM Validation** | Magic byte verification, size limits |\n| 279-280 | **Screen Capture** | Single-instance guard |\n| 281-282 | **USB/Serial/Bluetooth** | Rate-limited device access requests |\n| 283-284 | **Idle/Wake Lock** | Single-instance API guards |\n| 285-286 | **File Handle** | Size and path traversal validation |\n| 287-288 | **Web Share/Payment** | Cooldown and single-instance guards |\n| 289-290 | **Notifications** | Permission throttling, safe creation |\n| 291-292 | **Error Serialization** | Stack trace leak prevention |\n| 293-294 | **Content Editable** | Paste sanitization, drop prevention |\n| 295-296 | **Image Validation** | Dimension and pixel count limits (decompression bomb prevention) |\n| 297-298 | **AbortController Pool** | Managed pool with auto-eviction |\n| 299 | **Console Protection** | Tamper detection and restoration |\n| 300 | **Comprehensive Init** | `initializeSecurityHardeningV2()` combining all vulns 201-300 |\n\n### Security Utility Module\n\nThe `src/utils/security.ts` module provides 150+ security helper functions:\n\n#### Sanitization Functions\n\n| Function | Description |\n|---|---|\n| `sanitizeHtml(input)` | Strip all HTML tags from a string |\n| `sanitizeFilePath(path)` | Remove path traversal sequences and dangerous characters |\n| `sanitizeSearchQuery(query, maxLen)` | Limit length, strip control characters |\n| `sanitizeWorkspaceName(name)` | Alphanumeric + spaces/hyphens only, max 100 chars |\n| `sanitizeObjectKeys(obj)` | Remove `__proto__`, `constructor`, `prototype` keys |\n| `truncateToastMessage(msg)` | Truncate to 500 chars for toast display |\n\n#### Validation Functions\n\n| Function | Description |\n|---|---|\n| `validateUrl(url)` | Check against trusted domain whitelist |\n| `validateApiKey(key)` | Max 512 chars, printable ASCII, non-empty |\n| `validateModelId(model)` | Must match `provider/model-name` pattern |\n| `validateStorageKey(key)` | Alphanumeric + underscores/hyphens/dots only |\n| `validateStorageValue(value)` | Max 5 MB string length |\n| `isValidISODate(dateStr)` | ISO-8601 format check |\n| `validateFileExtension(filename, allowed)` | Extension allowlist check |\n| `isSuspiciousPath(path)` | Detect `..`, `~`, null bytes |\n| `isValidUtf8(str)` | Check for null bytes and control characters |\n\n#### Rate Limiting and Throttling\n\n| Function | Description |\n|---|---|\n| `shouldThrottleToast()` | Rate limit toasts to 1 per 500ms |\n| `createApiRateLimiter(interval)` | Create a rate limiter for API calls |\n| `preventDoubleClick(id, cooldown)` | Prevent duplicate button clicks |\n| `createDebouncedValue(delay)` | Debounce rapidly changing values |\n\n#### Security Utilities\n\n| Function | Description |\n|---|---|\n| `secureRandomHex(bytes)` | Cryptographically secure hex string |\n| `maskApiKey(key)` | Show first 8 chars, mask the rest with asterisks |\n| `hashForLog(sensitive)` | SHA-256 hash for safe logging of sensitive data |\n| `safeJsonStringify(obj, indent)` | JSON stringify with circular reference handling |\n| `createAbortableRequest(timeout)` | AbortController with automatic timeout |\n| `logSecurityEvent(source, severity, message, detail?)` | Audit log entry |\n| `runSecurityAudit()` | Run all security checks and return a report |\n\n### Content Security Policy\n\nThe frontend `index.html` includes a strict Content Security Policy:\n\n```\ndefault-src 'self';\nscript-src 'self' 'unsafe-inline';\nstyle-src 'self' 'unsafe-inline' https://fonts.googleapis.com;\nfont-src 'self' https://fonts.gstatic.com;\nconnect-src 'self' https://openrouter.ai https://api.openai.com\n            https://api.pexels.com https://ipc.localhost\n            http://ipc.localhost tauri:;\nimg-src 'self' data: blob: https:;\nmedia-src 'self' blob: data:;\nobject-src 'none';\nbase-uri 'self';\nform-action 'self';\n```\n\nThis policy:\n- Blocks all external scripts and inline `eval()`\n- Restricts network connections to known API endpoints and Tauri IPC\n- Prevents object/embed injection\n- Limits form submissions to same-origin\n- Allows images from any HTTPS source (for Pexels integration)\n\n### REST API Security Headers\n\nAll REST API responses include these security headers:\n\n| Header | Value | Purpose |\n|---|---|---|\n| `X-Content-Type-Options` | `nosniff` | Prevent MIME type sniffing |\n| `X-Frame-Options` | `DENY` | Prevent clickjacking |\n| `X-XSS-Protection` | `1; mode=block` | Enable XSS filter |\n| `Referrer-Policy` | `strict-origin-when-cross-origin` | Limit referrer info |\n| `Permissions-Policy` | `camera=(), microphone=(), geolocation=()` | Restrict APIs |\n| `Cache-Control` | `no-store` | Prevent caching of sensitive data |\n| `Access-Control-Allow-Origin` | `*` | CORS support |\n| `Content-Type` | `application/json` | Explicit content type |\n\n### Input Validation Summary\n\n| Input | Max Length | Validation |\n|---|---|---|\n| API keys | 512 chars | Printable ASCII only |\n| Prompts | 32,000 chars | UTF-8, non-empty |\n| File reads | 50 MB | Size check before read |\n| File writes | 100 MB | Size check before write |\n| Request bodies | 10 MB | Size check before parse |\n| Search queries | 200 chars | Alphanumeric + basic punctuation |\n| Model IDs | 200 chars | `provider/model-name` format |\n| Log messages | 2,000 chars | Truncated on write |\n| Storage keys | 200 chars | Alphanumeric + underscores |\n| Storage values | 5 MB | Size check before write |\n| Command input | 10,000 chars | Length check |\n| Toast messages | 500 chars | Truncated on display |\n| Workspace names | 100 chars | Alphanumeric + spaces/hyphens |\n| Recent project names | 256 chars | HTML-unsafe chars stripped |\n\n---\n\n## CryptArtist Studio Website\n\nCryptArtist Studio has a companion marketing website located in the `website/A1/`\ndirectory. The website is a static HTML/CSS/JS site designed for deployment on\nCloudflare Pages or any static hosting provider.\n\n### Website Pages\n\n| Page | File | Description |\n|---|---|---|\n| **Home** | `index.html` | Landing page with hero, program cards, features, tech stack, CTA |\n| **Programs** | `programs.html` | Detailed breakdown of all programs with feature lists |\n| **About** | `about.html` | Philosophy, development timeline, tech stack tables |\n| **Documentation** | `docs.html` | .CryptArt format spec, CLI reference, REST API, FAQ |\n| **Download** | `download.html` | Platform download cards, build-from-source guide |\n| **Contact** | `contact.html` | Contact form, email, social links |\n| **Privacy** | `privacy.html` | Full privacy policy (NH law compliant) |\n| **Terms** | `terms.html` | Full terms of use (NH law compliant) |\n| **DonatePersonalSeconds** | `donate-personal-seconds.html` | P2P resource sharing page with live demo |\n\n### Website Technology\n\n| Technology | Purpose |\n|---|---|\n| **HTML5** | Semantic markup with ARIA roles |\n| **CSS3** | Custom properties, grid, flexbox, animations |\n| **Vanilla JavaScript** | Navigation, scroll animations, accordions, counters |\n| **Google Fonts** | Inter font family |\n| **Responsive Design** | Mobile-first with breakpoints at 768px, 1024px, 1200px |\n\nThe website uses a dark theme consistent with the desktop application, featuring:\n- CSS custom properties for color tokens\n- Gradient text effects and glow animations\n- Intersection Observer for scroll-triggered animations\n- Accordion components for FAQ sections\n- Counter animations for statistics\n- Mobile hamburger menu with smooth transitions\n\n### DonatePersonalSeconds Web API\n\nThe website includes a standalone P2P resource sharing API (`donate-personal-seconds-api.js`)\nthat can be used independently of the desktop application:\n\n```javascript\nconst api = new DonatePersonalSecondsAPI({ password: \"my-password\" });\n\n// Start donating resources\napi.startDonating({ cpuPercent: 80, ramPercent: 50, gpuPercent: 90 });\n\n// Or start borrowing resources\napi.startBorrowing();\n\n// Submit a task to the network\napi.submitTask({ type: \"ai-inference\", payload: { prompt: \"...\" } });\n\n// Listen for events\napi.on(\"peer-connected\", (peer) => console.log(\"New peer:\", peer));\napi.on(\"task-completed\", (result) => console.log(\"Result:\", result));\n```\n\n---\n\n## Privacy Policy and Terms of Use\n\nCryptArtist Studio includes a built-in Privacy Policy and Terms of Use, fully\ncompliant with New Hampshire, USA law.\n\n### Terms Acceptance\n\nOn first launch (and after clearing local storage), users must accept the Terms\nof Use and Privacy Policy before using the application. The acceptance modal\nincludes links to the full policy pages.\n\n### Privacy Highlights\n\n- **No data collection without consent** - CryptArtist Studio does not phone home.\n- **API keys are stored locally** - Keys never leave the user's machine except\n  when making API calls to the configured providers.\n- **Log files are local only** - All logging is to local files only.\n- **No telemetry** - No usage tracking, no analytics beacons.\n- **Open source** - The full source code is available for audit.\n\n### Third-Party Services\n\nCryptArtist Studio integrates with these third-party services (only when the user\nopts in by providing API keys):\n\n| Service | Purpose | Data Sent |\n|---|---|---|\n| **OpenAI API** | AI chat, image generation, TTS | User prompts, code context |\n| **OpenRouter** | AI model gateway (200+ models) | User prompts, model selection |\n| **ElevenLabs** | Voice generation, STT, sound effects | Text prompts, audio files |\n| **Pexels API** | Stock photo/video search | Search queries |\n| **GiveGigs.com** | Media asset library | Supabase auth credentials |\n| **Cloudflare** | Website hosting (mattyjacks.com) | Standard web requests |\n| **Cloudflare Turnstile** | Bot protection | Browser fingerprint |\n\n### Contact\n\n- **Email:** [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n- **Contact Page:** [MattyJacks.com/Contact](https://mattyjacks.com/Contact)\n\n### Legal Pages\n\nThe full Privacy Policy and Terms of Use are accessible within the application\nat `/privacy` and `/terms` respectively, and are also available at:\n\n- [mattyjacks.com/privacy](https://mattyjacks.com/privacy)\n- [mattyjacks.com/terms](https://mattyjacks.com/terms)\n\n---\n\n## Contributing\n\nCryptArtist Studio is open source and welcomes contributions from anyone. Whether\nyou are fixing a typo, adding a feature, or suggesting an improvement, your help\nis valued.\n\n### Development Workflow\n\n1. **Fork** the repository on GitHub.\n2. **Clone** your fork locally:\n   ```bash\n   git clone https://github.com/YOUR-USERNAME/CryptArtistStudio.git\n   ```\n3. **Create a branch** for your changes:\n   ```bash\n   git checkout -b feature/my-new-feature\n   ```\n4. **Make your changes** and test them:\n   ```bash\n   cd v1\n   npx tsc --noEmit          # TypeScript check\n   cd src-tauri && cargo check # Rust check\n   ```\n5. **Commit** with a descriptive message:\n   ```bash\n   git commit -m \"Add: description of your change\"\n   ```\n6. **Push** to your fork and open a **Pull Request** against `main`.\n\n### Code Style\n\n#### TypeScript / React\n\n- Use functional components with hooks (no class components).\n- Use TypeScript strict mode - avoid `any` types.\n- Follow the existing TailwindCSS dark theme tokens (`studio-bg`, `studio-panel`,\n  `studio-text`, `studio-border`, `studio-hover`, `studio-muted`, `studio-secondary`,\n  `studio-cyan`, `studio-green`).\n- Keep components self-contained - each program is a single file or small folder.\n- Use `invoke()` for all backend communication, never direct HTTP from frontend.\n- Do not add comments or documentation unless specifically relevant.\n\n#### Rust\n\n- Follow standard Rust formatting (`cargo fmt`).\n- Use `Result<T, String>` for Tauri command return types.\n- Use `Mutex` for shared state access.\n- Log all significant operations using the logger module.\n- Keep CLI commands headless - no GUI dependencies.\n\n#### General\n\n- Never remove existing functionality without explicit permission.\n- Maintain backward compatibility for the `.CryptArt` file format.\n- Keep the three required `.CryptArt` fields (`$cryptart`, `program`, `data`) sacred.\n- Test on Windows at minimum; cross-platform testing is appreciated.\n- Do not use em dashes or en dashes in code - use hyphens instead.\n\n### Pull Requests\n\nWhen submitting a pull request:\n\n1. **Describe what you changed** and why.\n2. **Reference any related issues** using `#issue-number`.\n3. **Confirm builds pass** - both `tsc --noEmit` and `cargo check`.\n4. **Keep changes focused** - one feature or fix per PR.\n5. **Screenshots welcome** for UI changes.\n\n### Reporting Issues\n\nOpen an issue on GitHub with:\n\n- **Steps to reproduce** the problem\n- **Expected behavior** vs. actual behavior\n- **Platform and version** information\n- **Screenshots or logs** if applicable\n\n### Feature Requests\n\nFeature requests are welcome! Please open an issue with the tag `enhancement` and\ndescribe:\n\n- What the feature does\n- Why it would be useful\n- How it might be implemented (optional)\n\n---\n\n## Troubleshooting\n\n### Common Issues\n\n#### Application Won't Start\n\n| Symptom | Cause | Solution |\n|---|---|---|\n| White screen on launch | WebView2 not installed | Install WebView2 Runtime from Microsoft |\n| Crash on startup (Windows) | Missing VC++ redistributable | Install Visual C++ Redistributable 2022 |\n| Crash on startup (Linux) | Missing webkit2gtk | `sudo apt install libwebkit2gtk-4.1-dev` |\n| \"Port already in use\" | REST API server conflict | Change the port with `--port` flag |\n| Blank window (macOS) | Gatekeeper blocking | Right-click > Open, or allow in System Settings |\n\n#### FFmpeg Issues\n\n| Symptom | Cause | Solution |\n|---|---|---|\n| \"FFmpeg not found\" | Not installed | Click \"Install FFmpeg\" in Media Mogul or Settings |\n| Download fails | Network/firewall blocking | Download manually from ffmpeg.org and place in AppData |\n| Checksum mismatch | Corrupted download | Delete the ffmpeg directory and re-download |\n| Encoding fails | Outdated FFmpeg | Update to the latest version |\n\n#### API Key Issues\n\n| Symptom | Cause | Solution |\n|---|---|---|\n| \"No API key configured\" | Key not set | Go to Settings > API Keys and enter your key |\n| \"Invalid API key\" | Incorrect key format | Check that the key starts with `sk-` (OpenAI) |\n| \"Rate limited\" | Too many requests | Wait a moment and try again, or upgrade your API plan |\n| OpenRouter fails | Key not configured | Set the OpenRouter key in Settings > OpenRouter |\n| Fallback not working | Neither key set | Configure at least one of OpenAI or OpenRouter |\n\n#### Godot Issues\n\n| Symptom | Cause | Solution |\n|---|---|---|\n| \"Godot not detected\" | Not installed | Install from godotengine.org or use auto-download |\n| \"Invalid Godot path\" | Wrong version | CryptArtist Studio requires Godot 4.x |\n| Project creation fails | Invalid path characters | Use only alphanumeric characters in project names |\n| Export fails | Missing export templates | Install Godot export templates for your target platform |\n\n#### Build Issues\n\n| Symptom | Cause | Solution |\n|---|---|---|\n| `tsc` errors | Type errors | Run `npx tsc --noEmit` and fix reported errors |\n| `cargo check` errors | Rust compilation errors | Check Rust version (`rustup update`) |\n| Vite build fails | Dependency issues | Delete `node_modules` and run `npm install` |\n| Tauri build fails | Missing platform deps | Install platform-specific prerequisites (see Getting Started) |\n\n### Debug Mode\n\nEnable verbose logging by checking the log files:\n\n```bash\n# Windows\ntype \"%LOCALAPPDATA%\\CryptArtist Studio\\logs\\cryptartist-session.txt\"\n\n# macOS\ncat ~/Library/Application\\ Support/CryptArtist\\ Studio/logs/cryptartist-session.txt\n\n# Linux\ncat ~/.local/share/CryptArtist\\ Studio/logs/cryptartist-session.txt\n```\n\nUse CryptArt Commander to check system status:\n\n```\nhealth          # Application health check\nsysinfo         # Full system information\nkeys status     # API key configuration\nffmpeg status   # FFmpeg installation\ngodot detect    # Godot detection\n```\n\n### Getting Help\n\n1. Check the [FAQ](#faq) section below\n2. Search [GitHub Issues](https://github.com/mattyjacks/CryptArtistStudio/issues)\n3. Open a new issue with reproduction steps\n4. Email [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n\n---\n\n## Performance Optimization\n\n### Frontend Performance\n\nCryptArtist Studio is designed for smooth performance even on lower-end hardware:\n\n| Optimization | Implementation |\n|---|---|\n| **React.memo** | Heavy components are memoized to prevent unnecessary re-renders |\n| **useCallback/useMemo** | Expensive computations and callbacks are memoized |\n| **Lazy Loading** | Programs are loaded on-demand when navigated to |\n| **Debouncing** | Search, resize, and input handlers are debounced |\n| **Virtual Scrolling** | Long lists (command history, logs) use windowed rendering |\n| **CSS Containment** | Layout-heavy components use CSS `contain` property |\n| **Reduced Motion** | Animations respect `prefers-reduced-motion` media query |\n| **Font Preloading** | Google Fonts are preconnected for faster loading |\n\n### Backend Performance\n\n| Optimization | Implementation |\n|---|---|\n| **Async I/O** | All file and network operations use Tokio async runtime |\n| **Connection Pooling** | HTTP client reuses connections via `reqwest::Client` |\n| **Request Timeouts** | All outbound requests have 30-second timeouts |\n| **Streaming Responses** | Large responses are streamed rather than buffered |\n| **Thread-Safe State** | `Mutex`-protected state with minimal lock contention |\n| **Lazy Initialization** | FFmpeg, Godot, and log paths are resolved on first use |\n\n### Memory Management\n\n| Strategy | Implementation |\n|---|---|\n| **Log Rotation** | Session log capped at 100 lines, recent at 1,000 |\n| **History Limits** | Command history: 500 entries, display: 200 entries |\n| **Toast Queue** | Maximum 10 concurrent toast notifications |\n| **Peer Limits** | Maximum 50 P2P connections in DonatePersonalSeconds |\n| **Activity Logs** | Maximum 200 log entries per component |\n| **Timeout Cleanup** | All `setTimeout`/`setInterval` cleaned up on unmount |\n| **Storage Limits** | localStorage values capped at 5 MB each |\n\n### Recommended System Requirements\n\n| Component | Minimum | Recommended |\n|---|---|---|\n| **CPU** | Dual-core 2.0 GHz | Quad-core 3.0 GHz+ |\n| **RAM** | 4 GB | 8 GB+ |\n| **Storage** | 200 MB (app + FFmpeg) | 1 GB+ (with media files) |\n| **Display** | 1280x720 | 1920x1080+ |\n| **GPU** | Not required | WebGL-capable for DonatePersonalSeconds GPU detection |\n| **Network** | Optional | Required for AI features and Pexels integration |\n\n---\n\n## Prompt History\n\nCryptArtist Studio was built through a series of AI-assisted development sessions.\nThe prompt entries in this README are a summary view. The full archive is in\n`prompts/all-prompts.md` and on GitHub:\n`https://github.com/mattyjacks/CryptArtistStudio/blob/main/prompts/all-prompts.md`.\nSome historical prompt text may contain minor AI transcription mistakes, so it is\nnot guaranteed to be 100% exact. We continuously improve prompt accuracy.\n\nThis history serves as both documentation and a case study in AI-assisted\n(\"vibe coding\") software development.\n\n### Prompt 0 - Initial Project Setup\n\n> In a new folder /v1/ make the following program: CryptArtist Studio.\n> It is also integrated with OpenAI API and the user can enter their own API keys.\n> Come up with cool features on your own.\n\n**Result:** Created the initial Tauri + React + TypeScript project with the full\ntechnology stack, FFmpeg auto-installer, OpenAI integration, and the foundational\narchitecture.\n\n### Prompt 1 - Security and Branding\n\n> Run npm audit on the packages and fix all vulnerabilities. \"skull+art\" is the logo\n> of cryptartist.com. Also let people create images using the OpenAI API.\n\n**Result:** Fixed npm vulnerabilities, established branding, added image generation.\n\n### Prompt 2 - Initial Fixes\n\n> Fix everything!\n\n**Result:** Resolved initial bugs and integration issues.\n\n### Prompt 3 - Naming Fix\n\n> Don't call it Fusion Editor, that may be copyrighted, call it Node Mode.\n\n**Result:** Renamed the node-based editor from \"Fusion Editor\" to \"Node Mode\" to\navoid trademark issues.\n\n### Prompt 4 - Build Instructions\n\n> Now how do I run it as an .exe or something?\n\n**Result:** Added build instructions and packaging configuration.\n\n### Prompt 5 - Running the App\n\n> Run it for me.\n\n**Result:** Started the development server and verified the app runs.\n\n### Prompt 6 - Compilation\n\n> Done. Compile it now.\n\n**Result:** Compiled the application for distribution.\n\n### Prompt 7 - Final Build\n\n> Run npm run tauri build one last time!\n\n**Result:** Created the final production build.\n\n### Prompt 8 - UI/UX Debugging\n\n> None of it works! I can switch between the tabs but the buttons don't do anything.\n\n**Result:** Fixed all non-functional UI buttons and integrated them with the backend.\n\n### Prompt 9 - Feature Integration\n\n> Integrate every single upcoming feature. Now.\n\n**Result:** Connected all planned features to working implementations.\n\n### Prompt 10 - CLI and AI Integration\n\n> Make it be able to be commanded and for projects to be edited through the command\n> line, for integration with AI tools like Antigravity for helping test it.\n\n**Result:** Added the full CLI powered by Clap with commands for project management,\nfile operations, AI chat, and system information.\n\n### Prompt 11 - Pexels Integration\n\n> Let the user browse pexels.com for images and videos, and add them to the project\n> automatically, with support for multiple file sizes for videos at the same time.\n\n**Result:** Added Pexels API integration with search, browse, and import functionality\nin the Media Browser component.\n\n### Prompt 12 - AI Studio Mode\n\n> Now make an AI studio mode where the user can generate a video using prompts, and\n> it will be automatically edited together from pexels.com videos, and put on the\n> project. It can also have captions, and audio generated from OpenAI API.\n\n**Result:** Created the AI Studio workspace with automated video generation pipeline:\nscript writing, Pexels footage selection, voiceover generation, caption creation,\nand auto-editing.\n\n### Prompt 13 - Git Cleanup\n\n> Add the node modules to .gitignore.\n\n**Result:** Added `node_modules/` to `.gitignore`.\n\n### Prompt 14 - Prompt Documentation\n\n> Add every single prompt I gave you to prompts/all-prompts.md starting before the\n> prompts already on there, also organize them properly.\n\n**Result:** Created the `prompts/all-prompts.md` file with all historical prompts\norganized chronologically.\n\n### Prompt 15 - Prompt Builder\n\n> Look in /v1/ and make me a 1,200 word prompt for using with Windsurf Claude Opus\n> 4.6 Thinking model, and return the prompt as /prompts/bigprompt-2.md.\n\n**Result:** Generated a comprehensive 1,200-word prompt document (`bigprompt-2.md`)\nthat described the full suite refactor plan including all five programs, the\n`.CryptArt` file format, and implementation guidelines.\n\n### Prompt 16 - Suite Refactor Execution\n\n> (The bigprompt-2.md mega-prompt - executed in full)\n\n**Result:** Transformed CryptArtist Studio from a single video editor into a full\nsuite of five programs with the Suite Launcher, React Router navigation, and all\nprogram shells implemented:\n- Media Mogul (renamed from main editor)\n- VibeCodeWorker (new - Monaco-based IDE)\n- DemoRecorder (new - screen recorder)\n- ValleyNet (new - AI agent)\n- `.CryptArt` file format with save/open\n\n### Prompt 17 - Making It Work + Legal\n\n> Make it all actually work, bro. It doesn't work yet. Also add a privacy policy and\n> terms of use, fully complying with New Hampshire, USA, law.\n\n**Result:** Fixed all broken functionality across all five programs. Added a complete\nPrivacy Policy and Terms of Use with first-launch acceptance modal. Integrated\nlegal compliance for New Hampshire, USA jurisdiction.\n\n### Prompt 18 - Mobile, API, CLI, and 35+ Improvements\n\n> Make it work on Android and iOS, too. Make it all work better. Make every single\n> improvement you can, also make it all workable through an API or the Command Line.\n> In addition to the improvements you're thinking of, add 35 more improvements.\n\n**Result:** Added mobile platform support configuration, REST API server, enhanced\nCLI, and 35+ improvements across all programs including: error boundaries, loading\nspinners, toast notifications, debounce utilities, format helpers, platform\ndetection, local storage persistence, mobile navigation, and keyboard shortcuts.\n\n### Prompt 19 - GameStudio\n\n> Make CryptArtist Media Mogul able to be combined with CryptArtist VibeCodeWorker\n> and also the latest version of Godot, to be able to make videogames automatically.\n\n**Result:** Created GameStudio - a new program combining Media Mogul, VibeCodeWorker,\nand Godot Engine integration for AI-powered game development. Added Godot auto-\ndetection, download, and launch capabilities to the Rust backend.\n\n### Prompt 20 - Automatic Logging System\n\n> Add automatic logging to every single thing, making a constant \"last 1000 lines\"\n> log file, and also a constant \"every line ever\" log file, and a \"last 100 lines\n> since last run\" as .txt files with better names.\n\n**Result:** Implemented a comprehensive three-file logging system:\n- `cryptartist-session.txt` (last 100 lines per session)\n- `cryptartist-recent.txt` (rolling 1,000 lines)\n- `cryptartist-full-history.txt` (append-only complete history)\n\nAdded Rust logger module, frontend logger utility, and integrated logging into\nevery Tauri command, REST API endpoint, CLI command, and frontend component.\n\n### Prompt 21 - Future-Proof .CryptArt File Format\n\n> Make the .JSON files better organized for .CryptArt files. Use best practices, and\n> ensure maximum compatibility across all current, past, and future .CryptArt files.\n> Make it so I never need to upgrade the base of the .CryptArt files so it can live\n> forever.\n\n**Result:** Redesigned the `.CryptArt` format with a permanent envelope schema:\n- `$cryptart: 1` magic key for self-identification\n- Open program IDs (any string, not a closed union)\n- Optional rich metadata, extensions, and history\n- Backward compatibility with all old files\n- Forward compatibility via index signatures\n- Updated both TypeScript and Rust implementations\n\n### Prompt 22 - VibeCodeWorker Feature Complete + JSON Expansion\n\n> Add more features to VibeCodeWorker, make it fully feature complete and include\n> automatic program testing and website testing like Google Antigravity has. Add more\n> fields to the JSON, including everything you can think of, but make it so that\n> not-including-everything it still works.\n\n**Result:** Added five new features to VibeCodeWorker:\n- **Testing Panel** - AI-powered + pattern-based test runner with auto-test on save\n- **Web Audit Panel** - Lighthouse-style website quality analysis with 4 scores\n- **Problems Panel** - Auto-scanning lint diagnostics\n- **Search Panel** - Cross-file search and replace with regex\n- **Tabbed Bottom Panel** - Unified 5-tab bottom panel replacing terminal-only view\n\nExpanded `.CryptArt` JSON with 30+ new optional fields covering identity, metadata,\nproject structure, integrity, compatibility, extensibility, and export/sharing.\n\n### Prompt 23 - Comprehensive README + Prompt Archive\n\n> Make a 2,000 line README.md in multiple steps, including everything possible about\n> the program. The program is open source. Add every prompt so far, including this\n> one, to prompts/all-prompts.md.\n\n**Result:** The initial 2,000-line README covering all five original programs, the\n`.CryptArt` file format, technology stack, project architecture, installation guide,\nCLI reference, REST API reference, configuration, logging, keyboard shortcuts,\nprivacy policy, contributing guidelines, and the complete prompt history.\n\n### Prompt 24 - 100 UI/UX Improvements (Wave 1)\n\n> Implement 100 new improvements across the entire CryptArtist Studio suite.\n\n**Result:** Added 100 improvements (1-100) across all programs:\n- Global CSS: gradient text, glass cards, skeleton loading, badges, kbd styling, tags,\n  animated borders, progress rings, code blocks, new animations\n- Tailwind config: extended color palette, new animation keyframes\n- SuiteLauncher: search/filter, keyboard shortcuts (1-7), version badges, last-opened\n  indicator, staggered animation, system status, clock, enhanced footer\n- App.tsx: loading splash screen, 404 route, document title per route, error boundary\n- VibeCodeWorker: file type icons, breadcrumb nav, editor controls, close-all tabs,\n  welcome tab, keyboard shortcut help, enhanced status bar\n- MediaMogul: keyboard shortcut bar, project duration, workspace transitions, quick\n  export, undo/redo buttons, zoom controls, aspect ratio, volume slider\n- DemoRecorder: countdown timer, recording time limit, audio level meter, screenshot\n  button, quality presets, file size estimate, webcam overlay, hotkey hints\n- ValleyNet: agent autonomy level, clear chat, quick task templates, agent personality,\n  export conversation, connection status, message timestamps\n- GameStudio: game genre selector, scene count, build target selector, play test button,\n  asset counter, GDScript snippet library\n\n### Prompt 25 - CryptArtist Studio Website\n\n> Make me a full website about CryptArtist Studio, including links and stuff.\n\n**Result:** Created the companion website in `website/A1/` with 8 HTML pages:\n- `index.html` - Landing page with hero, program cards, feature highlights, tech stack\n- `programs.html` - Detailed program breakdowns with feature lists\n- `about.html` - Philosophy, story timeline, tech stack tables\n- `docs.html` - .CryptArt format spec, CLI reference, REST API reference\n- `download.html` - Platform download cards, build-from-source guide\n- `contact.html` - Contact info, form, related site links\n- `privacy.html` - Full privacy policy (NH law compliant)\n- `terms.html` - Full terms of use (NH law compliant)\n- `style.css` - Complete dark theme with gradients, animations, responsive design\n- `script.js` - Navigation, scroll animations, accordion, counter animations\n\n### Prompt 26 - 100 UI/UX Improvements (Wave 2)\n\n> Implement improvements 101-200 across the entire CryptArtist Studio suite.\n\n**Result:** Added 100 more improvements (101-200):\n- Global CSS: toast notifications, dropdown menus, avatar components, switch toggles,\n  breadcrumbs, glow effects, hover lift, spotlight effect, context menus, scrollbars,\n  resize handles, FAB, notification dots, accordion sections\n- Tailwind config: 8 new semantic colors, extended spacing, z-index scale, glow shadows,\n  new animations (float, shake, wiggle, gradient-shift, expand, collapse, pop)\n- SuiteLauncher: favorites system, recent projects panel, launch counter, uptime,\n  quick actions dropdown, rotating tips carousel, keyboard shortcuts overlay\n- VibeCodeWorker: git branch detection, cursor position, encoding selector, line ending\n  toggle, auto-save toggle, command palette (Ctrl+Shift+P) with 20+ commands\n- MediaMogul: timeline markers, render queue, clip counter, effects panel, media bin\n  categories, color scopes, waveform toggle, proxy editing, project notes, auto-backup\n- DemoRecorder: annotation tools, watermark toggle, multi-monitor, recording schedule,\n  mouse highlight, click sound, auto-stop on silence, recording tags\n- ValleyNet: workflow builder, scheduled tasks, agent memory system, token usage\n  tracking, conversation bookmarks, agent plugins, streaming toggle, safe mode\n- GameStudio: scene graph hierarchy, asset pipeline status, debug overlay, physics debug,\n  resolution selector, performance stats, node inspector, VCS status\n- Shared hooks library: useLocalStorage, useDebounce, useInterval, useToggle, etc.\n\n### Prompt 27 - 100 UI/UX Improvements (Wave 3)\n\n> Implement improvements 201-300 across the entire CryptArtist Studio suite.\n\n**Result:** Added 100 more improvements (201-300):\n- Global CSS: stepper/wizard, chip/tag input, timeline ruler, split pane dividers,\n  color swatch palette, popover, styled range slider, inline editable label,\n  mini calendar, vertical tabs, circular progress, drag handles, alert banners\n- SuiteLauncher: category filter, What's New modal, sort options, grid/list view toggle,\n  time-based greeting, suite health check, system info modal\n- VibeCodeWorker: split editor, diff viewer, code snippets library, editor bookmarks,\n  go-to-line dialog, file templates, indent detection, symbol outline, sticky scroll\n- MediaMogul: color wheel grading, LUT browser, audio mixer, subtitle editor,\n  transition library, keyframe editor, motion tracking, stabilization, HDR mode\n- DemoRecorder: region selection, zoom during recording, crop tool, GIF preview,\n  auto-chapter markers, recording profiles, picture-in-picture, frame rate monitor\n- ValleyNet: agent chains, knowledge base, RAG context toggle, tool use log,\n  conversation templates, agent personas, multi-model support, cost tracking\n- GameStudio: tilemap editor, particle system preview, shader editor, profiler panel,\n  input mapping editor\n- Shared constants and types library\n\n### Prompt 28 - CryptArt Commander + Settings + OpenRouter\n\n> Add CryptArt Commander and Settings programs. Integrate OpenRouter API deeply\n> into every program.\n\n**Result:** Created two new programs:\n- **CryptArt Commander** - Terminal emulator with 27+ built-in commands, script editor,\n  REST API reference tab, command history, arrow key navigation, and OpenRouter\n  integration via `or <prompt>` command\n- **Settings** - Full settings hub with API Keys, OpenRouter, Appearance, and About\n  sections. Import/export keys to `Forbidden-Secrets-of-CryptArtist-Keys-N.txt`\n- **Rust Backend** - Added `openrouter_key` to AppState, new Tauri commands for\n  OpenRouter chat, model listing, key import/export\n- **Deep OpenRouter Integration** - All AI programs try OpenRouter first, fall back to\n  OpenAI. 15 popular models across 6 providers.\n\n### Prompt 29 - Deep Suite Enhancement (70 Improvements)\n\n> Make more improvements across the entire CryptArtist Studio suite. Focus on deeper\n> OpenRouter integration, new features, and UI polish.\n\n**Result:** Added improvements 301-370:\n- Shared OpenRouter utility module (`src/utils/openrouter.ts`)\n- Settings: keyboard shortcuts section, data & storage management, danger zone\n- Commander: tab completion, command aliases, 10+ new commands (uptime, whoami, open,\n  env, bench, count, grep, head, tail), timestamps, enhanced status bar\n- SuiteLauncher: AI status indicator, quick Settings link, updated What's New,\n  system info with AI status, new tips, updated shortcuts for 7 programs\n- ValleyNet: model picker, provider toggle, response format selector, system prompt\n  editor, token budget selector\n- VibeCodeWorker: OpenRouter provider dropdown, model selector\n- GameStudio: model selector, provider badge, clear AI chat\n- DemoRecorder: AI Tools panel with narration script generator and TTS\n- AIStudio/MediaMogul: OpenRouter chat, provider toggle, model selector\n- Global CSS: AI provider badges, model selector, AI panel components, streaming\n  indicator, token usage bar, glow effects, gradient text, pulse ring, skeleton loading\n\n### Prompt 30 - DonatePersonalSeconds Feature\n\n> Add a donate computer page to the website and a donate computer component to the\n> desktop app for P2P resource sharing.\n\n**Result:** Created the DonatePersonalSeconds feature:\n- Desktop: `DonatePersonalSeconds.tsx` with system resource detection, peer management,\n  donation limits, live statistics, activity log, and secure random peer IDs\n- Website: `donate-personal-seconds.html` page with control panel, live stats, and FAQ\n- Website: `donate-personal-seconds-api.js` P2P resource sharing API with WebRTC\n- Updated navigation across all website pages\n- Added DonatePersonalSeconds to App.tsx routes and SuiteLauncher program grid\n\n### Prompt 31 - Multi-File Workspace Management\n\n> Support opening multiple .CryptArt files simultaneously with workspace management.\n\n**Result:** Implemented workspace management system:\n- `WorkspaceProvider.tsx` - React state provider with CRUD and group logic\n- `WorkspaceBar.tsx` - Global tab bar UI with context menu\n- `workspace.ts` - Types, context, and helper functions\n- All 5 original programs integrated with `useWorkspace()` hook\n- Resource sharing between workspaces (media, AI context, settings, files, chat history)\n- Maximum 20 simultaneous workspaces\n\n### Prompt 32 - Fix 100 Vulnerabilities\n\n> Fix 100 more vulnerabilities. Add all these prompts to the all-prompts file.\n> Update README.md with every single thing.\n\n**Result:** Comprehensive security hardening:\n- Created `security.ts` utility module with 30+ helper functions\n- BATCH A (1-25): Rust backend - API key validation, URL validation, write size limits,\n  path sanitization, HTTP timeouts, CORS preflight, security headers\n- BATCH B (26-50): Frontend - CSP, localStorage validation, toast rate limiting,\n  model ID validation, prototype pollution protection, ISO date validation\n- BATCH C (51-75): Memory leaks - timeout cleanup, peer limits, history limits,\n  input limits, double-click prevention, search sanitization\n- BATCH D (76-100): Hardening - security headers, secure random, audit logging,\n  safe JSON, file extension validation, UTF-8 validation\n\n### Prompt 33 - README 700+ Line Update\n\n> Update README.md with at least 700 more lines, in multiple steps. As always,\n> prompts/all-prompts.md should be updated with this prompt.\n\n**Result:** This update. Added 700+ lines to README.md covering:\n- CryptArt Commander program documentation (40+ commands, aliases, scripts)\n- DonatePersonalSeconds program documentation (P2P resource sharing)\n- Settings program documentation (API keys, OpenRouter, appearance)\n- Workspace Management system\n- OpenRouter Multi-Model AI Integration\n- Security Hardening documentation (300 vulnerability fixes, security utility API)\n- CryptArtist Studio Website documentation\n- Extended Prompt History (Prompts 24-33)\n- Troubleshooting guide with common issues tables\n- Performance Optimization guide\n- Extended FAQ\n- Updated directory structure\n\n### Prompt 34 - Cross-Platform Support and Clone Tool\n\n> Add cross-platform support for Windows, macOS, Linux, Android, and iOS.\n> Add a Clone Tool for creating custom installers.\n\n**Result:** Implemented cross-platform detection and Clone Tool:\n- `cross-platform.ts` - Platform detection, responsive breakpoints, touch support\n- `platform.ts` - Device type detection, mobile viewport hooks\n- Clone Tool UI for creating custom branded installers\n- Responsive layouts for all programs across screen sizes\n\n### Prompt 35 - Security Hardening Batch 2 (Vulns 101-200)\n\n> Add 100 more security vulnerability fixes to security.ts covering advanced\n> frontend hardening, API security, data protection, and resource management.\n\n**Result:** Added vulnerabilities 101-200 to `security.ts`:\n- BATCH E (101-125): DOM XSS, event handlers, iframe, form, CSS injection, WebSocket, canvas\n- BATCH F (126-150): Fetch hardening, CORS, cookie security, CSP nonce, SRI, rate limiting\n- BATCH G (151-175): Template safety, clipboard, drag-drop, storage encryption, HSTS\n- BATCH H (176-200): Focus trap, scroll safety, DOM monitoring, lazy loading, connection pool\n\n### Prompt 36 - Security Hardening Batch 3 (Vulns 201-300) and Documentation Update\n\n> Add 100 more security vulnerability fixes (201-300) to security.ts. Update Terms\n> of Use and Privacy Policy. Update README.md comprehensively. Set version to 1.69.420.4.\n\n**Result:** Completed the final batch of security fixes and documentation updates:\n- BATCH I (201-250): CSP nonce injection, SRI cache, form guard, postMessage, DOM mutation,\n  text purification, URL builder, credential detection, HSTS, cookie consent, Web Crypto,\n  permission guard, object safety, event guard, leak detection, blob security, array zeroing\n- BATCH J (251-300): Encrypted localStorage, WebSocket heartbeat, drag-drop validation,\n  fetch retry with backoff, SVG sanitization, WebGL guard, audio fingerprint mitigation,\n  battery/geolocation privacy, BroadcastChannel, device orientation, speech/gamepad guards,\n  SharedArrayBuffer, WebTransport, WASM validation, screen capture, USB/serial/bluetooth,\n  idle/wake lock, file handle, web share, notifications, error serialization, content\n  editable, image validation, AbortController pool, console protection, comprehensive init\n- Updated Terms of Use with DonatePersonalSeconds, Clone Tool, security section (17 sections)\n- Updated Privacy Policy with OpenRouter, DonatePersonalSeconds, encrypted storage\n- Version standardized to 1.69.420.4 across package.json, Cargo.toml, tauri.conf.json, constants.ts\n- README updated with 300 vulnerability documentation (10 batches), renamed references\n\n---\n\n## Related Projects and Links\n\n### Official Links\n\n| Link | Description |\n|---|---|\n| [github.com/mattyjacks/CryptArtistStudio](https://github.com/mattyjacks/CryptArtistStudio) | Source code repository |\n| [mattyjacks.com](https://mattyjacks.com) | Developer website and donations |\n| [givegigs.com](https://givegigs.com) | Community donation platform |\n| [mattyjacks.com/Contact](https://mattyjacks.com/Contact) | Contact page |\n| [cryptartist.com](https://cryptartist.com) | CryptArtist community |\n\n### Technology Links\n\n| Link | Description |\n|---|---|\n| [tauri.app](https://tauri.app/) | Tauri desktop framework |\n| [react.dev](https://react.dev/) | React UI library |\n| [typescriptlang.org](https://www.typescriptlang.org/) | TypeScript language |\n| [tailwindcss.com](https://tailwindcss.com/) | TailwindCSS framework |\n| [ffmpeg.org](https://ffmpeg.org/) | FFmpeg media tools |\n| [godotengine.org](https://godotengine.org/) | Godot game engine |\n| [microsoft.github.io/monaco-editor](https://microsoft.github.io/monaco-editor/) | Monaco Editor |\n| [pexels.com](https://www.pexels.com/) | Free stock photos and videos |\n\n### Related Platforms\n\n| Link | Description |\n|---|---|\n| [sitefari.com](https://sitefari.com) | Demo sharing platform |\n| [givegigs.com](https://givegigs.com) | Media asset library and donations |\n\n### Inspiration\n\n| Project | Influence |\n|---|---|\n| **DaVinci Resolve** | Professional video editing paradigm |\n| **VS Code** | Code editor UX and Monaco Editor |\n| **Windsurf** | AI-powered vibe-coding workflow |\n| **Google Antigravity** | AI coding and automated testing |\n| **Google Lighthouse** | Website quality auditing |\n| **OpenClaw** | Autonomous AI agent architecture |\n| **OBS Studio** | Screen recording and streaming |\n| **Godot Engine** | Open-source game development |\n\n---\n\n## Roadmap\n\n### v0.2.0 (Planned)\n\n- [ ] Full Godot project scaffolding and scene editor integration\n- [ ] Real FFmpeg timeline rendering pipeline\n- [ ] Twitch/YouTube RTMP streaming in DemoRecorder\n- [ ] ValleyNet browser automation via embedded webview\n- [ ] Skills marketplace for ValleyNet\n- [ ] Plugin system for extending programs\n- [ ] Undo/redo history for all editors\n- [ ] Multi-window support (detachable panels)\n\n### v0.3.0 (Planned)\n\n- [ ] Android and iOS builds via Tauri mobile\n- [ ] Cloud sync for `.CryptArt` projects\n- [ ] Collaborative editing (multiplayer)\n- [ ] Git integration in VibeCodeWorker\n- [ ] Debugger and breakpoints in VibeCodeWorker\n- [ ] Audio waveform visualization in Media Mogul\n- [ ] Real-time video preview with wgpu rendering\n- [ ] Marketplace for sharing `.CryptArt` templates\n\n### v1.0.0 (Vision)\n\n- [ ] Feature parity with DaVinci Resolve for video editing\n- [ ] Feature parity with VS Code for code editing\n- [ ] Full game development pipeline with Godot\n- [ ] Autonomous AI agent capable of complex multi-step tasks\n- [ ] Professional screen recording with hardware encoding\n- [ ] Published on major app stores\n- [ ] Comprehensive documentation site\n- [ ] Active community of contributors\n\n---\n\n## Future Plans\n\nThe following is a comprehensive list of planned features, new programs, and\nlong-term initiatives for CryptArtist Studio. These range from near-term\nimprovements to ambitious moonshot projects.\n\n### New Programs\n\n#### [🤯CꜴS] CryptArtist Operating System\n\n**CꜴS** (pronounced \"chaos\") is a planned vibe-coded operating system built\nfrom scratch to run on any device or computer chip - including obscure,\nlegacy, and experimental architectures. CꜴS is the ultimate expression of the\nCryptArtist philosophy: free, open, permanent, and user-controlled.\n\nSee the **[Detailed CꜴS Plan](#detailed-cꜴs-plan)** section below.\n\n#### [🎿SLM] Small Language Model (Slalom)\n\n**Slalom** is a planned lightweight, locally-runnable language model with a\nskiing-inspired interface. It is designed to provide fast, private AI\ninference without any cloud dependency.\n\nSee the **[Detailed SLM Plan](#detailed-slm-plan)** section below.\n\n#### [BRD] BirdWatch - System Monitor\n\nA real-time system resource monitor and task manager built into the suite.\nVisualizes CPU, RAM, GPU, disk, and network usage with animated graphs.\nIntegrates with DonatePersonalSeconds to show donation/borrow impact.\n\n#### [MKT] Marketplace\n\nA built-in marketplace for sharing, discovering, and installing:\n- `.CryptArt` project templates\n- Mods and plugins\n- AI prompt packs\n- Color grading LUTs\n- Sound effect libraries\n- Godot game templates\n\n#### [NET] NetBrowser\n\nA minimal, privacy-focused web browser built into the suite using Tauri's\nwebview. Integrates with ValleyNet for AI-assisted browsing, form-filling,\nand web scraping. Supports tabbed browsing, ad blocking, and reader mode.\n\n#### [SYN] SyncStation\n\nCloud and local sync for `.CryptArt` projects across devices. Supports:\n- End-to-end encrypted cloud storage (user-provided S3/GCS/Azure bucket)\n- Local network sync via mDNS/Bonjour discovery\n- Git-style version history with branch and merge\n- Conflict resolution with visual diff viewer\n\n#### [TRN] TrainYard\n\nA visual machine learning training interface for fine-tuning small models\non local hardware. Supports LoRA adapters, dataset management, training\nprogress visualization, and model export. Integrates with Slalom [🎿SLM]\nfor local inference after training.\n\n#### [ARK] Archive\n\nA universal file format converter and digital preservation tool. Converts\nbetween 100+ file formats (images, video, audio, documents, 3D models).\nIncludes batch processing, metadata preservation, and format validation.\n\n#### [COM] Community Hub\n\nA built-in forum and chat system for CryptArtist Studio users. Features\ninclude project showcase, help requests, collaboration matching, and\ndirect messaging. All communication is encrypted and can be self-hosted.\n\n### Existing Program Enhancements\n\n#### Media Mogul [MMo]\n\n- [ ] Real-time GPU-accelerated video preview via wgpu/WebGPU\n- [ ] Motion graphics and title designer\n- [ ] Multicam editing with sync\n- [ ] 3D compositing with depth maps\n- [ ] AI-powered auto-edit from transcript\n- [ ] Spatial audio mixing and binaural rendering\n- [ ] HDR and Dolby Vision grading\n- [ ] Live collaboration on timelines\n- [ ] ElevenLabs voice cloning integration\n- [ ] AI music generation (Suno/Udio integration)\n- [ ] Subtitle translation with AI\n- [ ] AI scene detection and auto-chapter markers\n\n#### VibeCodeWorker [VCW]\n\n- [ ] Full LSP (Language Server Protocol) support\n- [ ] Integrated debugger with breakpoints and step-through\n- [ ] Git integration with visual diff, merge, and blame\n- [ ] AI code review with inline suggestions\n- [ ] Terminal emulator built into the IDE\n- [ ] Multi-cursor editing and vim keybindings\n- [ ] Jupyter notebook support\n- [ ] Live preview for web development (HTML/CSS/JS)\n- [ ] Package manager integration (npm, pip, cargo)\n- [ ] AI pair programming with voice commands\n- [ ] Snippet library with AI-generated snippets\n- [ ] Refactoring tools (rename, extract, inline)\n\n#### DemoRecorder [DRe]\n\n- [ ] Hardware-accelerated encoding (NVENC, QSV, AMF)\n- [ ] Twitch/YouTube/Kick RTMP live streaming\n- [ ] Webcam overlay with green screen removal\n- [ ] Audio mixer with per-source volume control\n- [ ] Replay buffer (save last N seconds)\n- [ ] Scheduled recordings\n- [ ] AI-powered highlight detection\n- [ ] Annotation tools (draw on screen during recording)\n\n#### ValleyNet [VNt]\n\n- [ ] Browser automation via embedded webview\n- [ ] File system operations (create, read, write, organize)\n- [ ] Email and calendar integration\n- [ ] Skills marketplace (installable capabilities)\n- [ ] Multi-agent collaboration (multiple ValleyNet instances)\n- [ ] Voice control and dictation\n- [ ] Workflow builder (visual task automation)\n- [ ] Computer vision (screen understanding)\n- [ ] API integration hub (Zapier-like connectors)\n\n#### GameStudio [GSt]\n\n- [ ] Visual scene editor with drag-and-drop\n- [ ] Sprite editor and animation timeline\n- [ ] Physics debugger and collision visualizer\n- [ ] Asset store with free game assets\n- [ ] One-click export to Web, Windows, macOS, Linux, Android, iOS\n- [ ] AI-generated game levels and characters\n- [ ] Multiplayer networking templates\n- [ ] Sound designer with procedural audio\n- [ ] Video Game Cloner: Wikipedia-based mechanic extraction pipeline\n- [ ] Video Game Cloner: emoji-to-3D graphics upgrade workflow\n- [ ] Video Game Cloner: patent/copyright detection and avoidance engine\n- [ ] Video Game Cloner: public domain game library with one-click clone\n- [ ] Video Game Cloner: multiplayer clone support (clone networked games)\n\n#### CryptArt Commander [CAC]\n\n- [ ] SSH and SFTP remote connections\n- [ ] Tmux-style pane splitting\n- [ ] Plugin commands (user-installable command packs)\n- [ ] Cron-style scheduled command execution\n- [ ] Pipeline builder (chain commands visually)\n- [ ] REST API testing (Postman-like interface)\n\n#### DonatePersonalSeconds [DPS]\n\n- [ ] Real WebRTC P2P connections (currently simulated)\n- [ ] Task queue with priority scheduling\n- [ ] Reputation system for donors and borrowers\n- [ ] Cryptocurrency micropayments for compute time\n- [ ] Docker/WASM workload containers\n- [ ] Distributed AI training across peer network\n- [ ] Bandwidth sharing for CDN-like content delivery\n\n#### Suite Launcher [SLr]\n\n- [ ] Customizable dashboard widgets\n- [ ] Recent file previews with thumbnails\n- [ ] Plugin/mod discovery feed\n- [ ] Project templates gallery\n- [ ] Drag-and-drop file opening\n- [ ] Multi-monitor workspace layout presets\n\n### Platform Launch Plans - Every Platform Possible\n\nCryptArtist Studio aims to launch on **every single platform possible**, making the\nfull creative suite accessible to every human on the planet regardless of what device\nthey own. Users will be able to pay for API credits using the ecosystem's default\npayment system integrated directly into each platform build.\n\n#### Desktop Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Windows 10** | `.exe` installer | Direct download, Microsoft Store | Priority |\n| **Windows 10** | `.msi` installer | Direct download, enterprise deployment | Priority |\n| **Windows 11** | `.exe` installer | Direct download, Microsoft Store | Priority |\n| **Windows 11** | `.msi` installer | Direct download, enterprise deployment | Priority |\n| **Windows 11** | `.msix` package | Microsoft Store, Windows Package Manager | Planned |\n| **macOS 12+ (Intel)** | `.dmg` disk image | Direct download, Mac App Store | Priority |\n| **macOS 12+ (Apple Silicon)** | `.dmg` disk image | Direct download, Mac App Store | Priority |\n| **macOS Universal** | `.dmg` universal binary | Direct download | Priority |\n| **Linux (Ubuntu 22+)** | `.deb` package | Direct download, apt repository | Priority |\n| **Linux (Ubuntu 22+)** | `.AppImage` | Direct download, AppImageHub | Priority |\n| **Linux (Fedora/RHEL)** | `.rpm` package | Direct download, dnf/yum repository | Planned |\n| **Linux (Any)** | `.tar.gz` portable | Direct download | Planned |\n| **Linux (Any)** | Flatpak | Flathub | Planned |\n| **Linux (Any)** | Snap | Snapcraft | Planned |\n| **Linux (Arch)** | AUR package | Arch User Repository | Planned |\n| **Linux (NixOS)** | Nix package | nixpkgs | Planned |\n| **ChromeOS / Chromebook** | Progressive Web App | Chrome Web Store | Planned |\n| **ChromeOS / Chromebook** | Linux (Crostini) `.deb` | Direct download | Planned |\n| **FreeBSD** | `.pkg` package | Direct download | Experimental |\n\n#### Mobile Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **iOS (iPhone)** | `.ipa` | Apple App Store | Planned |\n| **iOS (iPad)** | `.ipa` (iPad optimized) | Apple App Store | Planned |\n| **iPadOS** | `.ipa` (Stage Manager support) | Apple App Store | Planned |\n| **Android Phones** | `.apk` / `.aab` | Google Play Store, F-Droid, direct APK | Planned |\n| **Android Tablets** | `.apk` / `.aab` (tablet UI) | Google Play Store | Planned |\n| **Android TV** | `.apk` (leanback UI) | Google Play Store | Experimental |\n| **Android Auto / Carplay** | Companion app | Google Play / App Store | Experimental |\n| **Samsung DeX** | Android `.apk` (desktop mode) | Galaxy Store, Google Play | Planned |\n| **Huawei HarmonyOS** | `.hap` package | Huawei AppGallery | Experimental |\n\n#### Gaming Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Steam (Windows)** | Steam build | Steam Store | Priority |\n| **Steam (macOS)** | Steam build | Steam Store | Priority |\n| **Steam (Linux)** | Steam build (native + Proton) | Steam Store | Priority |\n| **Steam Deck** | Steam build (Deck verified) | Steam Store | Priority |\n| **Nintendo Switch** | `.nsp` / eShop build | Nintendo eShop | Experimental |\n| **Nintendo Switch 2** | eShop build | Nintendo eShop | Experimental |\n| **Nintendo DS / 3DS** | Homebrew `.nds` / `.3dsx` | Homebrew channel | Experimental |\n| **Xbox Series X/S** | UWP / GDK build | Microsoft Store (Xbox) | Experimental |\n| **Xbox One** | UWP build | Microsoft Store (Xbox) | Experimental |\n| **PlayStation 5** | PS5 SDK build | PlayStation Store | Experimental |\n| **PlayStation 4** | PS4 SDK build | PlayStation Store | Experimental |\n| **PlayStation Vita** | Homebrew build | HENkaku | Experimental |\n| **Meta Quest 2/3/Pro** | `.apk` (VR UI) | Meta Quest Store | Experimental |\n| **Apple Vision Pro** | visionOS app | Apple App Store | Experimental |\n\n#### Embedded and IoT Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Raspberry Pi 4/5** | `.deb` (ARM64) | apt repository, direct download | Planned |\n| **Raspberry Pi 3** | `.deb` (ARMv7) | apt repository | Experimental |\n| **Raspberry Pi Zero 2 W** | Lightweight build | Direct download | Experimental |\n| **Raspberry Pi Pico** | MicroPython/C companion | Direct flash | Experimental |\n| **Arduino** | Serial companion protocol | Arduino IDE library | Experimental |\n| **ESP32** | Firmware companion | PlatformIO, Arduino IDE | Experimental |\n| **NVIDIA Jetson** | `.deb` (ARM64, CUDA) | Direct download | Planned |\n| **BeagleBone** | `.deb` (ARMv7) | Direct download | Experimental |\n| **Pine64 devices** | `.deb` / Flatpak | Direct download | Experimental |\n| **RISC-V boards** | Portable binary | Direct download | Experimental |\n\n#### Smart TV and Display Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Samsung Smart TV (Tizen)** | Tizen `.wgt` widget | Samsung App Store | Experimental |\n| **LG Smart TV (webOS)** | webOS `.ipk` app | LG Content Store | Experimental |\n| **Android TV** | `.apk` (leanback UI) | Google Play Store | Experimental |\n| **Apple TV (tvOS)** | tvOS app | Apple App Store | Experimental |\n| **Amazon Fire TV** | `.apk` | Amazon Appstore | Experimental |\n| **Roku** | BrightScript channel | Roku Channel Store | Experimental |\n| **Chromecast with Google TV** | `.apk` | Google Play Store | Experimental |\n\n#### Wearable and Specialty Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Apple Watch (watchOS)** | watchOS companion app | Apple App Store | Experimental |\n| **Wear OS (Google)** | `.apk` Wear OS | Google Play Store | Experimental |\n| **Samsung Galaxy Watch (Tizen)** | Tizen wearable | Galaxy Store | Experimental |\n| **Garmin watches** | Connect IQ widget | Garmin Connect IQ | Experimental |\n| **Fitbit** | Fitbit SDK app | Fitbit Gallery | Experimental |\n| **TI-84 Plus CE** | Calculator app | ticalc.org | Experimental |\n| **TI-Nspire CX** | Lua app | ticalc.org | Experimental |\n| **Casio fx-CG50** | Add-in | casio.com | Experimental |\n| **HP Prime** | PPL app | hpcalc.org | Experimental |\n| **Kindle (e-ink)** | Sideloaded APK | Direct download | Experimental |\n| **reMarkable tablet** | Custom app | Direct sideload | Experimental |\n\n#### Web and Cloud Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Web Browser (any)** | Progressive Web App | cryptartiststudio.com | Priority |\n| **Web Browser (any)** | WebAssembly standalone | Direct URL | Priority |\n| **Cloudflare Workers** | Edge deployment | Cloudflare dashboard | Planned |\n| **Docker** | Container image | Docker Hub, GitHub Container Registry | Planned |\n| **Self-hosted server** | Docker Compose | Direct download | Planned |\n| **Kubernetes** | Helm chart | Artifact Hub | Planned |\n| **AWS Lambda** | Serverless build | AWS Marketplace | Experimental |\n| **Google Cloud Run** | Container | GCP Marketplace | Experimental |\n| **Azure Container Instances** | Container | Azure Marketplace | Experimental |\n| **Vercel** | Edge functions | Vercel Marketplace | Planned |\n| **Netlify** | Static + serverless | Netlify | Planned |\n| **GitHub Codespaces** | Dev container | GitHub Marketplace | Planned |\n| **Gitpod** | Dev container | gitpod.io | Planned |\n| **Replit** | Repl template | Replit | Planned |\n| **CodeSandbox** | Sandbox template | CodeSandbox | Planned |\n\n#### Legacy and Retro Platforms\n\n| Platform | Format | Distribution | Status |\n|---|---|---|---|\n| **Windows 7/8** | `.exe` (Electron fallback) | Direct download | Planned |\n| **Windows XP** | Minimal CLI build | Direct download | Experimental |\n| **macOS 10.13+ (High Sierra)** | `.dmg` legacy build | Direct download | Experimental |\n| **Ubuntu 18.04/20.04** | `.AppImage` / `.deb` | Direct download | Planned |\n| **32-bit Linux (i686)** | Portable binary | Direct download | Experimental |\n| **PowerPC Mac (G4/G5)** | CLI-only build | Direct download | Experimental |\n| **DOS** | CLI companion (DJGPP) | Floppy disk image | Experimental |\n| **Amiga** | CLI companion (AmigaOS 4) | AmiNet | Experimental |\n| **Haiku OS** | `.hpkg` package | HaikuDepot | Experimental |\n| **ReactOS** | Windows `.exe` (compatibility) | Direct download | Experimental |\n\n#### Platform-Specific Features\n\nEach platform build includes adaptations for optimal UX:\n\n| Platform | Adaptations |\n|---|---|\n| **Desktop (Win/Mac/Linux)** | Full 11-program suite, keyboard shortcuts, multi-window |\n| **Steam / Steam Deck** | Controller support, Steam overlay, achievements, workshop |\n| **Mobile (iOS/Android)** | Touch-optimized UI, gesture navigation, camera integration |\n| **Tablet (iPad/Android)** | Split-view, Apple Pencil/stylus support, keyboard support |\n| **Smart TV** | D-pad navigation, remote control UI, simplified programs |\n| **Wearable** | Companion notifications, quick actions, voice control |\n| **Calculator** | Text-only Commander interface, basic AI chat |\n| **Raspberry Pi** | GPIO integration, hardware monitoring, lightweight mode |\n| **Arduino/ESP32** | Serial command protocol for hardware projects |\n| **Web** | No install required, cloud save, share via URL |\n| **VR (Quest/Vision Pro)** | 3D workspace, spatial UI, hand tracking, virtual screens |\n| **Console (Xbox/PS5/Switch)** | Controller UI, TV-safe zone, console-native features |\n\n#### API Credit Payment Integration\n\nAll platform builds include integrated payment for AI API credits through the\necosystem's default payment system:\n\n- **Desktop/Web** - Stripe integration for credit card / debit card payments\n- **Steam** - Steam Wallet microtransactions for API credit bundles\n- **iOS/iPadOS** - Apple In-App Purchase for credit packs\n- **Android** - Google Play Billing for credit packs\n- **Xbox** - Microsoft Store commerce for credit packs\n- **PlayStation** - PlayStation Store wallet for credit packs\n- **Nintendo** - Nintendo eShop prepaid for credit packs\n- **Cryptocurrency** - Bitcoin, Ethereum, and stablecoin payments (all platforms)\n- **GiveGigs Credits** - Earn credits by completing tasks on givegigs.com\n- **DonatePersonalSeconds [🗡️DPS]** - Earn API credits by donating compute time\n\nCredit pricing tiers:\n\n| Tier | Credits | Price | Best For |\n|---|---|---|---|\n| **Starter** | 1,000 credits | $1.00 | Trying out AI features |\n| **Creator** | 10,000 credits | $8.00 | Regular creative work |\n| **Pro** | 50,000 credits | $35.00 | Professional workflows |\n| **Studio** | 200,000 credits | $120.00 | Production teams |\n| **Unlimited** | Unlimited / month | $49.00/mo | Power users |\n| **Free** | 100 credits/day | $0.00 | Funded by DPS donations |\n\nCredits are universal across all AI providers (OpenAI, Anthropic, Google, etc.)\nand all programs in the suite. Unused credits never expire.\n\n#### Platform Launch Timeline\n\n| Phase | Target | Platforms |\n|---|---|---|\n| **Phase 1** | 2026 Q3 | Windows 10/11 (.exe, .msi), macOS, Linux (.deb, .AppImage), Web PWA |\n| **Phase 2** | 2026 Q4 | Steam (PC, Mac, Linux, Deck), Flatpak, Snap, Chromebook |\n| **Phase 3** | 2027 Q1 | iOS (iPhone, iPad), Android (Phone, Tablet), Docker |\n| **Phase 4** | 2027 Q2 | Raspberry Pi, NVIDIA Jetson, Samsung DeX, Kubernetes |\n| **Phase 5** | 2027 Q3 | Smart TVs (Samsung, LG, Android TV, Apple TV, Fire TV) |\n| **Phase 6** | 2027 Q4 | Wearables (Apple Watch, Wear OS, Galaxy Watch) |\n| **Phase 7** | 2028 Q1 | Gaming consoles (Xbox, PS5, Nintendo Switch 1 & 2) |\n| **Phase 8** | 2028 Q2 | VR/AR (Meta Quest, Apple Vision Pro), Calculators |\n| **Phase 9** | 2028 Q3 | Embedded (Arduino, ESP32, BeagleBone, RISC-V) |\n| **Phase 10** | 2028 Q4 | Legacy/Retro (Windows 7, macOS legacy, PowerPC, DOS, Amiga) |\n\n### Platform and Infrastructure\n\n- [ ] **Android and iOS** - Native mobile builds via Tauri 2 mobile\n- [ ] **Web version** - Run CryptArtist Studio in the browser via WebAssembly\n- [ ] **Self-hosted server** - Host your own CryptArtist instance for teams\n- [ ] **Electron fallback** - Alternative desktop build for broader compatibility\n- [ ] **Flatpak and Snap** - Linux package manager distribution\n- [ ] **Microsoft Store and Mac App Store** - Official store listings\n- [ ] **Steam Store** - Steam builds for PC, Mac, Linux, and Steam Deck\n- [ ] **Auto-updater** - In-app update mechanism with delta patches\n- [ ] **Crash reporter** - Opt-in crash reporting with stack traces\n- [ ] **Telemetry dashboard** - Opt-in anonymous usage analytics\n- [ ] **i18n / Localization** - Multi-language UI (Spanish, French, German, Japanese, Chinese, Korean, Arabic, Hindi, Portuguese, Russian, Turkish, Vietnamese, Thai, Indonesian, Polish, Dutch, Swedish, Norwegian, Danish, Finnish, Czech, Romanian, Hungarian, Greek, Hebrew, Swahili, Zulu, Yoruba, Amharic, Tagalog, Malay, Bengali, Urdu, Gujarati, Tamil, Telugu, Kannada, Malayalam, Marathi, Punjabi, Nepali, Sinhala, Burmese, Khmer, Lao, Mongolian, Tibetan, Georgian, Armenian, Azerbaijani, Kazakh, Uzbek, Kurdish, Pashto, Dari, Farsi, Esperanto, Latin, Klingon, Elvish)\n- [ ] **Accessibility** - Screen reader support, high contrast mode, keyboard-only navigation, voice control, reduced motion, large text mode, dyslexia-friendly fonts, color blind modes\n- [ ] **Offline mode** - Full functionality without internet (local AI via Slalom [🎿SLM])\n- [ ] **Docker official image** - `docker pull cryptartiststudio/studio:latest`\n- [ ] **Kubernetes Helm chart** - One-command team deployment\n- [ ] **Edge deployment** - Cloudflare Workers, Vercel Edge, Deno Deploy\n- [ ] **Calculator builds** - TI-84, TI-Nspire, Casio fx-CG50, HP Prime\n- [ ] **Wearable builds** - Apple Watch, Wear OS, Galaxy Watch, Garmin, Fitbit\n- [ ] **Smart TV builds** - Samsung Tizen, LG webOS, Android TV, Apple TV, Roku, Fire TV\n- [ ] **Console builds** - Xbox Series X/S, PS5, Nintendo Switch 1 & 2\n- [ ] **VR/AR builds** - Meta Quest 2/3/Pro, Apple Vision Pro\n- [ ] **Embedded builds** - Raspberry Pi, Arduino, ESP32, Jetson, RISC-V\n- [ ] **Legacy builds** - Windows 7/8, macOS High Sierra, 32-bit Linux, PowerPC\n\n### AI and Machine Learning\n\n- [ ] **Local AI inference** - Run models locally via llama.cpp, Ollama, or Slalom [🎿SLM]\n- [ ] **Voice control** - Control any program with natural language voice commands\n- [ ] **AI memory** - Persistent context across sessions and programs\n- [ ] **Multi-modal AI** - Image, audio, and video understanding in AI prompts\n- [ ] **AI agents marketplace** - Share and install custom AI agent configurations\n- [ ] **Fine-tuning UI** - Fine-tune models on your own data via TrainYard [TRN]\n- [ ] **AI model benchmarking** - Compare model performance on your specific tasks\n- [ ] **Prompt library** - Community-curated prompt templates for every program\n- [ ] **On-device training** - Train small models directly on user hardware\n- [ ] **Federated learning** - Collaborative model improvement across DPS network\n- [ ] **AI code generation** - Full project scaffolding from natural language\n- [ ] **AI video generation** - Text-to-video with Sora, Runway, Kling integration\n- [ ] **AI music generation** - Suno, Udio, and local music model integration\n- [ ] **AI 3D generation** - Text-to-3D model generation for GameStudio\n- [ ] **AI voice cloning** - ElevenLabs voice cloning for personalized TTS\n- [ ] **Real-time translation** - Live subtitle translation in 100+ languages\n- [ ] **Sentiment analysis** - AI-powered mood detection in text and audio\n- [ ] **Content moderation** - AI-powered content safety for community features\n\n### Community and Ecosystem\n\n- [ ] **CryptArtist Studio Hub** - Central website for projects, mods, and community\n- [ ] **Mod SDK** - Full documentation and tooling for mod developers\n- [ ] **Theme designer** - Visual theme editor with live preview\n- [ ] **Tutorial system** - Interactive in-app tutorials for each program\n- [ ] **Certification program** - Skills certification for CryptArtist mastery\n- [ ] **Hackathons** - Regular community hackathons with prizes\n- [ ] **YouTube channel** - Official tutorials and development vlogs\n- [ ] **Discord server** - Community chat and support\n- [ ] **Bug bounty program** - Security rewards for vulnerability reports\n- [ ] **University partnerships** - Academic license and curriculum integration\n- [ ] **Nonprofit program** - Free enhanced features for registered nonprofits\n- [ ] **Creator fund** - Revenue sharing for popular mod/plugin creators\n- [ ] **Localization bounties** - Community-driven translation with rewards\n- [ ] **Annual conference** - CryptArtist Con with workshops and networking\n- [ ] **Ambassador program** - Community leaders with early access and perks\n\n---\n\n## Detailed CꜴS Plan\n\n### [🤯CꜴS] CryptArtist Operating System - Full Specification\n\n**CꜴS** is a from-scratch, vibe-coded operating system that embodies the\nCryptArtist philosophy at the deepest level. It is designed to run on\nliterally any device - from modern x86-64 and ARM64 machines to obscure\nand experimental architectures like RISC-V, MIPS, PowerPC, SPARC, Xtensa,\nAVR microcontrollers, and even custom FPGAs.\n\n#### Design Philosophy\n\n1. **Universal** - One OS for every chip. CꜴS compiles to any instruction set.\n2. **Minimal** - The kernel fits in under 1 MB. Boot in under 2 seconds.\n3. **Secure** - Capability-based security model. No root user. No sudo.\n4. **AI-Native** - The OS itself is an AI agent. Talk to your computer.\n5. **Permanent** - File formats and APIs never break. Forward-compatible forever.\n6. **Beautiful** - GPU-accelerated compositor with smooth 120fps animations.\n7. **Open** - CryptArtist Custom License v1.69.420.3. Every line of code is auditable.\n\n#### Architecture Overview\n\n```\nLayer 5: Applications    - CryptArtist Suite, user apps, WASM apps\nLayer 4: Desktop Shell   - Window manager, compositor, notification center\nLayer 3: System Services - File system, networking, audio, GPU, AI runtime\nLayer 2: HAL             - Hardware Abstraction Layer (per-architecture)\nLayer 1: Microkernel     - Scheduling, IPC, memory management, capabilities\nLayer 0: Bootloader      - UEFI/BIOS/custom boot for each platform\n```\n\n#### Supported Architectures (Planned)\n\n| Architecture | Status | Notes |\n|---|---|---|\n| **x86-64** | Priority | Desktop PCs, laptops, servers |\n| **ARM64 (AArch64)** | Priority | Apple Silicon, Raspberry Pi 4/5, phones |\n| **RISC-V (RV64GC)** | Priority | Open-source ISA, growing ecosystem |\n| **ARM32 (ARMv7)** | Planned | Older Raspberry Pi, embedded devices |\n| **x86 (i686)** | Planned | Legacy 32-bit PCs |\n| **MIPS32/64** | Planned | Routers, embedded systems, retro hardware |\n| **PowerPC** | Planned | Old Macs, IBM servers, game consoles |\n| **SPARC** | Planned | Sun/Oracle servers |\n| **Xtensa** | Planned | ESP32 microcontrollers |\n| **AVR** | Experimental | Arduino (extremely constrained) |\n| **WebAssembly** | Planned | Run CꜴS in a browser |\n| **Custom FPGA** | Experimental | User-designed CPU architectures |\n\n#### Microkernel Design\n\nThe CꜴS microkernel is a capability-based, message-passing microkernel\nwritten in Rust with minimal unsafe code:\n\n- **Scheduler** - Preemptive, priority-based, O(1) scheduler with per-core run queues\n- **IPC** - Synchronous and asynchronous message passing between processes\n- **Memory** - Virtual memory with demand paging, copy-on-write, and ASLR\n- **Capabilities** - Every resource access requires an unforgeable capability token\n- **Interrupts** - User-space interrupt handlers for maximum driver flexibility\n\n#### Hardware Abstraction Layer (HAL)\n\nEach supported architecture has a HAL implementation that provides:\n\n- CPU initialization and feature detection\n- Interrupt controller setup (APIC, GIC, PLIC, etc.)\n- Timer abstraction (HPET, ARM Generic Timer, RISC-V mtime)\n- UART/serial console for early boot debugging\n- Page table management per architecture\n- Cache and TLB management\n- Power management (ACPI, device tree, etc.)\n\n#### File System: CryptFS\n\nA new file system designed for CꜴS:\n\n- **Content-addressable** - Files identified by cryptographic hash\n- **Versioned** - Every file change creates a new version (git-like history)\n- **Encrypted** - Optional per-file or per-directory encryption\n- **Deduplicated** - Identical blocks stored only once\n- **Mountable anywhere** - Mount remote CryptFS volumes over the network\n- **Maximum file size** - 16 exabytes\n- **Maximum volume size** - 1 zettabyte\n\n#### Desktop Shell: CryptShell\n\nThe CꜴS desktop environment:\n\n- **Tiling + Floating** - Hybrid window manager (like i3 + macOS)\n- **GPU Compositor** - Vulkan/Metal/WebGPU-based rendering at 120fps\n- **AI Assistant** - Built-in AI assistant accessible from any context\n- **Universal Search** - Search files, apps, settings, and the web from one bar\n- **Notification Center** - Priority-based notifications with AI filtering\n- **Widget Dashboard** - Customizable widgets (clock, weather, system stats, etc.)\n- **Theming** - Full theme engine with CSS-like styling language\n- **Gestures** - Trackpad and touchscreen gesture support\n- **Virtual Desktops** - Unlimited virtual desktops with named workspaces\n\n#### AI Runtime\n\nCꜴS includes a system-level AI runtime:\n\n- **Local inference** - Run language models directly on the OS (llama.cpp, ONNX)\n- **Voice control** - System-wide voice commands in any language\n- **Smart autocomplete** - AI-powered autocomplete in every text field\n- **Predictive launching** - AI predicts which apps you'll open next\n- **Automated maintenance** - AI manages updates, cleanup, and optimization\n- **Natural language shell** - Type commands in plain English\n\n#### Networking Stack\n\n- **TCP/IP** - Full IPv4 and IPv6 networking stack\n- **DNS** - Built-in DNS resolver with DNS-over-HTTPS\n- **Firewall** - Application-level firewall with AI-suggested rules\n- **VPN** - Built-in WireGuard VPN client\n- **P2P** - Native peer-to-peer networking (used by DonatePersonalSeconds)\n- **Mesh networking** - Optional mesh mode for local device clusters\n\n#### Development Timeline\n\n| Phase | Target | Milestone |\n|---|---|---|\n| **Phase 1** | 2026 Q3 | Bootloader + microkernel on x86-64 (serial console) |\n| **Phase 2** | 2026 Q4 | Memory management, process scheduling, basic IPC |\n| **Phase 3** | 2027 Q1 | CryptFS, basic device drivers, ARM64 port |\n| **Phase 4** | 2027 Q2 | GPU compositor, window manager, keyboard/mouse |\n| **Phase 5** | 2027 Q3 | Networking stack, package manager, RISC-V port |\n| **Phase 6** | 2027 Q4 | AI runtime, CryptArtist Suite port, WASM apps |\n| **Phase 7** | 2028 Q1 | MIPS/PowerPC/SPARC ports, stability hardening |\n| **Phase 8** | 2028 Q2 | Public beta, community contributions, app ecosystem |\n\n#### Technical Inspirations\n\n- **seL4** - Formally verified microkernel (capability model)\n- **Redox OS** - Rust-based microkernel OS\n- **Plan 9** - Everything-is-a-file philosophy\n- **Fuchsia** - Capability-based security, Zircon microkernel\n- **TempleOS** - One person building an entire OS (spirit of the project)\n- **Linux** - Broad hardware support and driver ecosystem\n\n---\n\n## Detailed SLM Plan\n\n### [🎿SLM] Small Language Model (Slalom) - Full Specification\n\n**Slalom** (pronounced like the skiing term) is a planned small, fast,\nlocally-runnable language model designed specifically for CryptArtist Studio.\nThe name reflects its design: like a skier navigating a slalom course, the\nmodel weaves efficiently through tokens, taking the fastest path to the answer.\n\n#### Skiing-Inspired Interface\n\nThe Slalom interface is themed around skiing and winter sports:\n\n- **Slopes** - Different model sizes are called slopes:\n  - **Bunny Slope** (300M params) - Fast, lightweight, basic tasks\n  - **Blue Run** (1B params) - General purpose, good quality\n  - **Black Diamond** (3B params) - High quality, more compute needed\n  - **Double Black** (7B params) - Maximum quality, GPU recommended\n- **Moguls** - Difficult prompts that challenge the model (benchmark suite)\n- **Lift Tickets** - API access tokens for remote Slalom instances\n- **Powder** - Fresh, uncached responses (vs. cached \"groomed\" responses)\n- **Apres-Ski** - Post-inference analytics and token usage dashboard\n\n#### UI Design\n\nThe Slalom interface features:\n\n- **Snow-themed dark mode** - Deep navy background with white/ice-blue accents\n- **Mountain silhouette header** - Animated mountain range with parallax scrolling\n- **Slope selector** - Visual mountain with clickable difficulty indicators\n- **Speed gauge** - Real-time tokens-per-second display styled as a ski speedometer\n- **Trail map** - Visual token generation path showing model attention patterns\n- **Chairlift progress bar** - Loading indicator styled as a moving chairlift\n- **Snowflake particles** - Subtle animated snowfall in the background\n- **Temperature slider** - Styled as a thermometer with icicles\n\n#### Model Architecture\n\nSlalom uses a custom transformer architecture optimized for size and speed:\n\n- **Grouped Query Attention (GQA)** - Reduced memory bandwidth\n- **RoPE positional encoding** - Efficient rotary position embeddings\n- **SwiGLU activation** - Better training stability than ReLU\n- **RMSNorm** - Faster than LayerNorm with comparable results\n- **Sliding window attention** - Efficient long-context handling\n- **4-bit quantization** - GGUF format for minimal memory usage\n- **Speculative decoding** - Draft model for 2-3x faster generation\n\n#### Training Data\n\nSlalom is trained on a curated dataset focused on CryptArtist Studio tasks:\n\n- Open-source code (Rust, TypeScript, Python, GDScript)\n- Creative writing and storytelling\n- Technical documentation\n- Video editing terminology and workflows\n- Game development concepts\n- Shell commands and scripting\n- JSON and configuration formats\n- Conversation and chat patterns\n\n#### Integration Points\n\nSlalom integrates with every CryptArtist Studio program:\n\n| Program | Use Case |\n|---|---|\n| **Media Mogul** | Script generation, subtitle writing, prompt refinement |\n| **VibeCodeWorker** | Code completion, refactoring suggestions, documentation |\n| **DemoRecorder** | Auto-narration, highlight detection |\n| **ValleyNet** | Local agent reasoning, task planning |\n| **GameStudio** | Dialogue writing, level descriptions, NPC behavior |\n| **Commander** | Command suggestion, error explanation |\n| **DonatePersonalSeconds** | Task description generation, peer matching |\n| **Settings** | Configuration recommendations |\n| **CꜴS** | System-wide AI assistant, voice commands |\n\n#### Benchmarks (Target)\n\n| Metric | Bunny Slope | Blue Run | Black Diamond | Double Black |\n|---|---|---|---|---|\n| **Parameters** | 300M | 1B | 3B | 7B |\n| **VRAM** | 256 MB | 768 MB | 2 GB | 5 GB |\n| **Tokens/sec (CPU)** | 40 | 18 | 8 | 3 |\n| **Tokens/sec (GPU)** | 120 | 80 | 45 | 25 |\n| **Context window** | 4K | 8K | 16K | 32K |\n| **MMLU score** | 42% | 55% | 65% | 72% |\n| **HumanEval** | 25% | 40% | 55% | 65% |\n| **Download size** | 180 MB | 600 MB | 1.8 GB | 4.2 GB |\n\n#### Development Timeline\n\n| Phase | Target | Milestone |\n|---|---|---|\n| **Phase 1** | 2026 Q3 | Dataset curation and tokenizer training |\n| **Phase 2** | 2026 Q4 | Bunny Slope (300M) training and evaluation |\n| **Phase 3** | 2027 Q1 | Blue Run (1B) training, GGUF quantization |\n| **Phase 4** | 2027 Q2 | CryptArtist Studio integration, skiing UI |\n| **Phase 5** | 2027 Q3 | Black Diamond (3B) and Double Black (7B) training |\n| **Phase 6** | 2027 Q4 | Speculative decoding, fine-tuning tools in TrainYard |\n\n#### Distribution\n\n- Bundled with CryptArtist Studio (Bunny Slope only, ~180 MB)\n- Downloadable from within the app (larger slopes)\n- Available on Hugging Face as open-weight models\n- GGUF format for llama.cpp compatibility\n- ONNX format for cross-platform inference\n\n---\n\n## FAQ\n\n### Is CryptArtist Studio really free?\n\nYes. CryptArtist Studio is released under the CryptArtist Custom License v1.69.420.3\nand is completely free to use, modify, and distribute. There are no paid tiers, no subscriptions, and no feature gates.\nDevelopment is supported by voluntary donations at [mattyjacks.com](https://mattyjacks.com)\nand [givegigs.com](https://givegigs.com).\n\n### Do I need an API key to use it?\n\nNo. CryptArtist Studio works without any API keys. However, AI-powered features\n(chat, image generation, testing, web audit) require an API key from a supported\nprovider (OpenAI, Anthropic, Google, or any OpenAI-compatible endpoint).\n\n### What is a .CryptArt file?\n\nA `.CryptArt` file is a JSON project file that stores the complete state of any\nprogram in CryptArtist Studio. It uses a permanently stable envelope format that\nwill never need a version upgrade. See [The .CryptArt File Format](#the-cryptart-file-format)\nfor full details.\n\n### Can I use my own AI provider?\n\nYes. VibeCodeWorker supports any OpenAI-compatible API endpoint. Enter your custom\nbase URL and API key in the settings panel, and select \"Custom\" as the provider.\n\n### Does it work on mobile?\n\nMobile support (Android and iOS) is in progress via Tauri's mobile capabilities.\nThe UI is designed to be responsive, with a mobile navigation component and\nappropriate viewport handling.\n\n### Can I extend it with plugins?\n\nYes! CryptArtist Studio includes a full **Plugin, Mod, and Theme** system.\nPlugins add new features to existing programs, mods are self-contained mini-programs\nthat appear in the Suite Launcher, and themes change the entire visual appearance.\nAll three are distributed as ZIP files and can be installed from the Settings hub.\nSee [Plugin, Mod, and Theme System](#plugin-mod-and-theme-system) for details.\n\n### How do I report a bug?\n\nOpen an issue on [GitHub](https://github.com/mattyjacks/CryptArtistStudio/issues)\nwith steps to reproduce, expected vs. actual behavior, and your platform info.\n\n### What is OpenRouter and why should I use it?\n\n[OpenRouter](https://openrouter.ai/) is an API gateway that provides access to 200+\nAI models from OpenAI, Anthropic, Google, Meta, Mistral, and more through a single\nAPI key. With OpenRouter, you can switch between GPT-4o, Claude 3.5 Sonnet, Gemini\nPro, Llama 3.1, and other models without managing separate API keys for each provider.\nCryptArtist Studio tries OpenRouter first and falls back to direct OpenAI if\nOpenRouter is not configured.\n\n### What is CryptArt Commander?\n\nCryptArt Commander is a built-in terminal program that lets you control CryptArtist\nStudio through text commands. It supports 40+ commands, tab completion, command aliases,\nscripting, and direct integration with OpenRouter and OpenAI. It is useful for\nautomation, batch operations, and AI agent integration.\n\n### What does DonatePersonalSeconds do?\n\nDonatePersonalSeconds enables peer-to-peer compute resource sharing. You can donate idle\nCPU, RAM, and GPU resources to help other CryptArtist Studio users run tasks like\nAI inference, video rendering, and image generation. Alternatively, you can borrow\nresources from the network to speed up your own workloads. All connections use\ncryptographically secure peer IDs and password verification.\n\n### How secure is CryptArtist Studio?\n\nCryptArtist Studio has undergone comprehensive security hardening with 300\nvulnerability fixes covering input validation, XSS prevention, Content Security\nPolicy, rate limiting, memory leak prevention, prototype pollution protection,\nsecure random generation, and audit logging. See the\n[Security Hardening](#security-hardening) section for the complete list of fixes.\n\n### Can I open multiple projects at once?\n\nYes. CryptArtist Studio supports opening up to 20 `.CryptArt` files simultaneously\nthrough its workspace management system. Workspaces appear as tabs in a global bar\nand can be combined into groups for resource sharing. See\n[Workspace Management](#workspace-management) for details.\n\n### How do I export and import API keys?\n\nGo to Settings > API Keys and click \"Export All Keys\". This saves all your configured\nAPI keys (OpenAI, OpenRouter, Pexels, GiveGigs) to a JSON file named\n`Forbidden-Secrets-of-CryptArtist-Keys-N.txt` (auto-incrementing number). To import,\nclick \"Import Keys\" and select a previously exported file.\n\n### What AI models are available?\n\nThrough OpenRouter, CryptArtist Studio supports 200+ models including:\n- **OpenAI**: GPT-4o, GPT-4o Mini, GPT-4 Turbo, o1\n- **Anthropic**: Claude 3.5 Sonnet, Claude 3 Opus, Claude 3 Haiku\n- **Google**: Gemini Pro 1.5, Gemini Flash 1.5\n- **Meta**: Llama 3.1 405B, Llama 3.1 70B\n- **Mistral**: Mixtral 8x22B, Mistral Large\n- **Perplexity**: Llama 3.1 Sonar 70B\n\nDirect OpenAI access is also supported for users who prefer not to use OpenRouter.\n\n### How many programs are in the suite?\n\nEleven programs plus the Suite Launcher: Media Mogul (video/image editor),\nVibeCodeWorker (code IDE), DemoRecorder (screen recorder), ValleyNet (AI agent),\nGameStudio (game development), CryptArt Commander (terminal),\nDonatePersonalSeconds (P2P sharing), Clone Tool (installer builder),\nDictatePic (GIMP-style AI image editor), Luck Factory (AI luck seed generator),\nand Settings (config hub).\n\n### Where are log files stored?\n\nLog files are stored in the platform-specific application data directory:\n- **Windows**: `%LOCALAPPDATA%\\CryptArtist Studio\\logs\\`\n- **macOS**: `~/Library/Application Support/CryptArtist Studio/logs/`\n- **Linux**: `~/.local/share/CryptArtist Studio/logs/`\n\nThree files are maintained: `cryptartist-session.txt` (100 lines), `cryptartist-recent.txt`\n(1,000 lines), and `cryptartist-full-history.txt` (unlimited).\n\n### How was CryptArtist Studio built?\n\nCryptArtist Studio was built through 42+ AI-assisted \"vibe coding\" sessions using\nWindsurf IDE with Claude models. The complete prompt history (every single prompt\nand its result) is preserved in `prompts/all-prompts.md`. The full README documents\nevery aspect of the application across 4,600+ lines. This project serves as a case\nstudy in AI-assisted software development.\n\n---\n\n## License\n\nCryptArtist Studio is released under the **CryptArtist Custom License v1.69.420.3**.\n\n```\nCryptArtist Custom License v1.69.420.3\n\nCopyright (c) 2026 Matt - MattyJacks.com (MattyJacks, Sole Proprietorship, New Hampshire, USA)\n\nTERMS AND CONDITIONS\n\n1. GRANT OF LICENSE\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to use,\ncopy, modify, merge, publish, and distribute copies of the Software, subject\nto the following conditions:\n\n2. CONDITIONS\n\n  a) The above copyright notice, this license, and all conditions herein shall\n     be included in all copies or substantial portions of the Software.\n\n  b) You may not use the Software, its name, branding, logos, or documentation\n     to misrepresent the origin of derivative works. Derivative works must be\n     clearly identified as modified versions and must not use the \"CryptArtist\"\n     or \"MattyJacks\" names, logos, or branding without prior written consent.\n\n  c) You may not sublicense or sell copies of the unmodified Software itself.\n     You may distribute the Software as part of a larger work or modified version.\n\n  d) Commercial use of the Software is permitted, provided that the original\n     copyright notice and this license are preserved and that the CryptArtist\n     branding is not used in a way that implies endorsement.\n\n  e) Contributions submitted to the official CryptArtist Studio repository\n     grant the Operator (MattyJacks) a perpetual, worldwide, non-exclusive,\n     royalty-free license to use, modify, and distribute the contribution.\n\n3. AI-GENERATED CONTENT\n\nThe Software includes features that generate content using artificial intelligence.\nAll AI-generated content is provided \"as is\" without any warranty. The Operator\nmakes no claims regarding the accuracy, legality, or fitness of AI-generated\ncontent for any purpose. Users are solely responsible for reviewing, verifying,\nand using AI-generated content in compliance with applicable laws.\n\n4. VIDEO GAME CLONER\n\nThe Software includes a Video Game Cloner feature designed for public domain\ngame mechanics. The Operator is not liable for any games produced using this\nfeature. Users are solely responsible for ensuring their output does not infringe\non any third party's intellectual property rights. The Operator reserves the\nright to report copyright infringement at its sole discretion.\n\n5. PEER-TO-PEER FEATURES\n\nThe Software includes peer-to-peer resource sharing features. Use of these\nfeatures is entirely voluntary and at your own risk. The Operator is not\nresponsible for any damages, data loss, hardware wear, or security issues\narising from peer-to-peer connections.\n\n6. DISCLAIMER OF WARRANTY\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE, TITLE, AND NONINFRINGEMENT. THE OPERATOR\nDOES NOT WARRANT THAT THE SOFTWARE WILL BE UNINTERRUPTED, ERROR-FREE, SECURE,\nOR FREE OF VIRUSES OR OTHER HARMFUL COMPONENTS. THE OPERATOR MAKES NO\nWARRANTIES REGARDING AI-GENERATED CONTENT, THIRD-PARTY INTEGRATIONS, OR\nPEER-TO-PEER FEATURES.\n\n7. LIMITATION OF LIABILITY\n\nIN NO EVENT SHALL MATTYJACKS (THE SOLE PROPRIETOR), ITS OWNER, CONTRIBUTORS,\nOR AFFILIATES BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,\nCONSEQUENTIAL, EXEMPLARY, OR PUNITIVE DAMAGES, OR ANY LOSS OF PROFITS, DATA,\nUSE, GOODWILL, OR OTHER INTANGIBLE LOSSES, ARISING OUT OF OR IN CONNECTION\nWITH THE SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGES. IN NO\nEVENT SHALL THE OPERATOR'S TOTAL LIABILITY EXCEED FIFTY DOLLARS ($50.00).\n\n8. INDEMNIFICATION\n\nYou agree to indemnify, defend, and hold harmless MattyJacks from and against\nany claims, liabilities, damages, losses, and expenses arising from your use\nof the Software, content you create using the Software, or your violation of\nthis License or any third-party rights.\n\n9. GOVERNING LAW\n\nThis License shall be governed by the laws of the State of New Hampshire,\nUnited States. Any disputes shall be resolved by binding arbitration in\nNew Hampshire in accordance with AAA rules, or in the state or federal courts\nof New Hampshire. Class actions are waived.\n\n10. TERMINATION\n\nThis License is effective until terminated. It terminates automatically if you\nfail to comply with any term herein. Upon termination, you must destroy all\ncopies of the Software in your possession.\n\n11. SEVERABILITY\n\nIf any provision of this License is found unenforceable, the remaining\nprovisions shall continue in full force and effect.\n```\n\n---\n\n## Credits\n\n### Creator\n\n**Matt** - [MattyJacks.com](https://mattyjacks.com) | [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n\n### Built With AI\n\nCryptArtist Studio was developed through AI-assisted \"vibe coding\" sessions using\nWindsurf IDE with Claude models. The complete prompt history is preserved in\n`prompts/all-prompts.md` as a case study in AI-assisted software development.\n\n### Special Thanks\n\n- The **Tauri** team for the incredible desktop framework\n- The **Monaco Editor** team at Microsoft for the open-source editor engine\n- **OpenRouter** for the unified AI model gateway\n- **Pexels** for the free stock media API\n- **FFmpeg** maintainers for the indispensable media tools\n- **Godot Engine** community for the open-source game engine\n- The **Windsurf** team for the AI-powered IDE used to build this project\n- Everyone who donates at [mattyjacks.com](https://mattyjacks.com) and\n  [givegigs.com](https://givegigs.com)\n\n---\n\n<div align=\"center\">\n\n**CryptArtist Studio** - The Open Creative Suite\n\nMade with love by [Matt](https://mattyjacks.com)\n\n[GitHub](https://github.com/mattyjacks/CryptArtistStudio) |\n[Website](https://mattyjacks.com) |\n[Donate](https://givegigs.com) |\n[Contact](https://mattyjacks.com/Contact)\n\n---\n\n*This README is approximately 4,700 lines long and documents every aspect of\nCryptArtist Studio. It was last updated as part of Prompt 43 in the development history.*\n\n</div>\n","wordCount":30836,"sizeKb":204.7},{"name":"cryptartist-studio-v1-README.md","slug":"cryptartist-studio-v1-README","content":"","wordCount":1,"sizeKb":0},{"name":"cryptartist-website-README.md","slug":"cryptartist-website-README","content":"# CryptArtist\nCryptArtist Website Prototype\n","wordCount":5,"sizeKb":0},{"name":"givegigs-README.md","slug":"givegigs-README","content":"# GiveGigs\n\n**Hire to Help Humanity** - A global work collective with 0% platform fees, direct worker contact, and no account needed to browse talent.\n\n[Live Site](https://givegigs.com) | [Discord](https://discord.gg/Msbnfyw4Kb) | [AI Portal](https://givegigs.com/ai) | [API Docs](https://givegigs.com/ai/api-docs)\n\n---\n\n## Table of Contents\n\n- [What is GiveGigs?](#what-is-givegigs)\n- [Key Features](#key-features)\n- [Platform Architecture](#platform-architecture)\n- [The Main Site (v7)](#the-main-site-v7)\n  - [Worker Profiles](#worker-profiles)\n  - [Search and Discovery](#search-and-discovery)\n  - [Free Tools Suite](#free-tools-suite)\n  - [Moderation System](#moderation-system)\n  - [Authentication and User Accounts](#authentication-and-user-accounts)\n- [AI Agent Ecosystem](#ai-agent-ecosystem)\n  - [AI Portal](#ai-portal)\n  - [REST API](#rest-api)\n  - [MCP Server](#mcp-server)\n  - [Discord Bot](#discord-bot)\n  - [AI Task System](#ai-task-system)\n- [Tech Stack](#tech-stack)\n- [Project Structure](#project-structure)\n- [Database Schema](#database-schema)\n- [Security](#security)\n- [Getting Started](#getting-started)\n  - [Prerequisites](#prerequisites)\n  - [Environment Variables](#environment-variables)\n  - [Installation](#installation)\n  - [Running Locally](#running-locally)\n  - [Database Setup](#database-setup)\n- [Deployment](#deployment)\n- [Contributing](#contributing)\n- [License](#license)\n\n---\n\n## What is GiveGigs?\n\nGiveGigs is a unique global work collective that connects clients with skilled workers worldwide. Unlike traditional freelancing platforms, GiveGigs charges **zero platform fees** - workers keep 100% of their earnings. Clients can browse talent profiles and contact workers directly without even creating an account.\n\nThe platform is built around the philosophy that hiring should be simple, transparent, and accessible. Workers create rich profiles showcasing their skills, portfolio projects, audio samples, embedded videos, and multiple contact methods. Clients can search, filter, and reach out directly using the worker's preferred contact channels.\n\nGiveGigs also features a pioneering **AI Agent Ecosystem** that allows AI agents to discover, vet, and hire human workers via REST API and MCP integration - bridging the gap between artificial intelligence and physical-world task completion.\n\n---\n\n## Key Features\n\n### For Clients (Hirers)\n- **No account required** to browse worker profiles and access public contact information\n- **0% platform fees** - pay workers directly using any preferred payment method\n- **Advanced search** with keyword filtering, country, gender, agency status, and rate range filters\n- **Favorites system** to save and organize preferred workers\n- **Direct contact** via 12+ contact methods (WhatsApp, Discord, Telegram, Email, Phone, LinkedIn, etc.)\n\n### For Workers\n- **Rich profile pages** with customizable friendly name, job title, tagline, and introduction\n- **Dual rate system** - Cheap Rate (standard pace) and Rush Rate (urgent/priority work)\n- **Portfolio showcase** with project descriptions, images, URLs, and completion dates\n- **Audio samples** for voice actors, musicians, and other audio professionals\n- **Embedded videos** from YouTube and Google Drive\n- **Multiple contact blocks** with configurable access levels (Public, Button, Turnstile, Captcha, Login+Captcha+Turnstile)\n- **Profile moderation** with status tracking (Active, Paused, Under Review)\n- **Worker sharing** - collaborate with others by sharing edit access to profiles\n\n### Free Tools Suite\n- **Time Tracker** - Full-featured time tracking with live timer, project management, client linking, billable/non-billable tracking, hourly rates, budget tracking, and detailed reports\n- **Invoice Generator** - Create professional invoices with client management, line items, tax rates, multiple currencies, PDF export, sender details, draft/sent/paid/overdue status tracking, and soft-delete trash system\n- **Task Manager** - Kanban-style project management with boards, lists, drag-and-drop cards, cycles/sprints, task assignments, priorities, labels, due dates, estimates, and notes\n- **Writing Tools** - AI-assisted writing utilities\n- **Image Tools** - Image processing and optimization\n- **SEO Tools** - Search engine optimization helpers\n- **Counter Tool** - Word and character counting\n\n### For AI Agents\n- **REST API** for searching workers, posting tasks, and managing applications\n- **MCP Server** (Model Context Protocol) for integration with Claude Desktop, Cursor, Windsurf, and other MCP-compatible AI tools\n- **Discord Bot** with slash commands for posting tasks and searching workers\n- **API Key system** with SHA-256 hashed keys, rate limiting, and scope management\n\n---\n\n## Platform Architecture\n\nGiveGigs is a monorepo containing three main components:\n\n```\nGiveGigs/\n  v7/              # Main Next.js web application\n  programs/\n    mcp/            # MCP Server (@givegigs/mcp npm package)\n    discord/        # Discord Bot (discord.js v14)\n  lander/           # Landing page assets\n  plan/             # Planning documents\n```\n\n---\n\n## The Main Site (v7)\n\nThe main site is a full-stack **Next.js 15** application with server-side rendering, API routes, and a modern React frontend.\n\n### Worker Profiles\n\nWorker profiles are the core of GiveGigs. Each worker has:\n\n- **Identity** - Friendly name, optional full name (hidden by default), job title, tagline (100 chars), introduction (2500 chars)\n- **Rates** - Cheap Rate and Rush Rate (capped at $10,000 for security), with clear differentiation between standard and urgent pricing\n- **Location** - Country and gender for filtering\n- **Portfolio** - Project cards with title, description (1000 chars), end date, project URL, and uploaded images stored in Supabase Storage\n- **Media** - Audio samples (uploaded to Supabase Storage) and embedded YouTube/Google Drive videos\n- **Contact** - Multiple contact blocks with 12+ types (Website, Phone, WhatsApp, Discord, Telegram, Snapchat, Email, Facebook Messenger, Instagram, LinkedIn, TikTok, Custom) and configurable access levels\n- **Keywords** - Searchable skill tags (1000 chars)\n- **Agency Status** - Independent, Agency-Owned, or Both\n- **Moderation** - Active, Paused, or Under Review status with moderator reasons and worker review messages\n\nWorker profiles support profile picture uploads with image cropping, and all media files are stored in Supabase Storage with automatic cleanup on profile deletion.\n\n### Search and Discovery\n\nThe search page allows clients to find workers using:\n\n- **Keyword search** across names, job titles, taglines, introductions, and keywords\n- **Country filter** with a comprehensive country list\n- **Gender filter** (Male, Female, Other)\n- **Agency status filter** (Independent, Agency-Owned, Both)\n- **Rate range filter** with min/max sliders\n- **Sorting** by creation date, rate, and relevance\n\nNo account is required to search or view worker profiles. Contact information visibility depends on the worker's configured access levels.\n\n### Free Tools Suite\n\nGiveGigs offers a suite of free productivity tools that integrate with each other:\n\n#### Time Tracker (`/timer`)\nA professional time tracking system with:\n- **Live timer** with start/stop/discard controls\n- **Manual time entry** with custom start/end times\n- **Projects** with colors, hourly rates, budget hours, billable/non-billable settings, and client linking\n- **Task linking** - connect time entries to tasks in the Task Manager\n- **Reports** with date range filtering, project/client grouping, and earnings calculations\n- **Unbilled time** tracking with one-click invoice generation from tracked hours\n\n#### Invoice Generator (`/invoice`)\nA complete invoicing system with:\n- **Client management** - Create and manage clients with name, email, address, phone, and VAT number\n- **Invoice creation** - Line items with descriptions, quantities, rates, and amounts\n- **Multiple currencies** support\n- **Tax rates** (0-100%) applied to invoice totals\n- **Status tracking** - Draft, Sent, Paid, Overdue, Cancelled\n- **Sender details** - Company information with logo\n- **PDF export** using html2canvas and jsPDF\n- **Soft-delete trash** with 30-day auto-cleanup and restore capability\n- **Invoice settings** - Default currency, tax rate, auto-incrementing invoice numbers, company details\n- **Time integration** - Import unbilled time entries directly into invoices\n\n#### Task Manager (`/tasks`)\nA Kanban-style project management system with:\n- **Projects** - Top-level organizational units\n- **Boards** - Kanban boards within projects with team member management\n- **Lists** - Customizable columns (e.g., To Do, In Progress, Done) with drag-and-drop reordering\n- **Cards/Items** - Tasks with title, description (2000 chars), status, priority (Low/Medium/High), due dates, labels, position, assignees, and hour estimates\n- **Cycles/Sprints** - Time-boxed iterations with progress tracking (0-100%), start/end dates, and task association\n- **Notes** - Per-task discussion threads\n- **Drag and Drop** - Powered by @dnd-kit for smooth card and list reordering\n- **Board Members** - Invite collaborators with Member or Admin roles\n\n### Moderation System\n\nGiveGigs includes a moderator dashboard (`/mod`) for platform governance:\n\n- **User management** - Search, filter, and paginate through all users (capped at 100 per page, search capped at 200 chars)\n- **Worker moderation** - Set moderation status (Active, Paused, Under Review, Rejected) with reasons\n- **Review requests** - Workers can request review of paused profiles with an explanation message\n- **Announcements** - Send email announcements to all users or selected groups via Brevo/Resend integration, with test mode for moderator preview\n- **Debug tools** - Email configuration diagnostics (moderator-only)\n\n### Authentication and User Accounts\n\nAuthentication is handled by **Supabase Auth** with:\n\n- **Email/password signup and login** with input validation (email format, password strength)\n- **Server-side JWT verification** using `supabase.auth.getUser()` (not `getSession()`) across all 33+ API routes for tamper-proof authentication\n- **Middleware** route protection for dashboard, account, and create pages with automatic redirect to login\n- **Admin route** protection with role-based access control\n- **Cloudflare Turnstile** CAPTCHA integration for bot protection on signup and newsletter subscription\n\nUser accounts provide access to:\n- Personal dashboard with worker profile management\n- Favorites collection\n- Free tools (Time Tracker, Invoices, Tasks)\n- Account settings\n- Worker profile creation and editing\n- AI API key management\n\n---\n\n## AI Agent Ecosystem\n\nGiveGigs features a pioneering AI Agent Ecosystem that bridges the gap between AI and physical-world task completion.\n\n### AI Portal\n\nThe AI Portal (`/ai`) is a dedicated section of the site with its own dark-themed layout, navigation, and footer. It serves as the entry point for AI agent integration and includes:\n\n- **Landing page** (`/ai`) - Overview, onboarding flow (prompt or manual), integration options, task types\n- **Worker browser** (`/ai/workers`) - Searchable worker directory optimized for AI consumption\n- **Worker detail** (`/ai/workers/[workerId]`) - Individual worker profiles with full details\n- **API documentation** (`/ai/api-docs`) - Complete REST API reference\n- **MCP info** (`/ai/mcp`) - Model Context Protocol integration guide\n- **For Humans** (`/ai/humans`) - Links back to the main site and Discord for human users\n- **About** (`/ai/about`) - Background on the AI ecosystem vision\n\n### REST API\n\nThe AI REST API (`/api/ai/`) provides:\n\n- **`GET /api/ai/workers`** - Search workers with filters (no auth required)\n- **`GET /api/ai/workers/[workerId]`** - Get worker details (no auth required)\n- **`POST /api/ai/tasks`** - Create charity tasks (API key required)\n- **`GET /api/ai/tasks`** - List tasks (no auth required)\n- **`GET /api/ai/tasks/[taskId]`** - Get task details\n- **`PATCH /api/ai/tasks/[taskId]`** - Update task status (API key required)\n- **`POST /api/ai/keys`** - Generate API key (Supabase auth required)\n- **`GET /api/ai/keys`** - List user's API keys (Supabase auth required)\n- **`DELETE /api/ai/keys/[keyId]`** - Revoke API key (Supabase auth required)\n- **`PATCH /api/ai/keys/[keyId]`** - Update API key (Supabase auth required)\n\nAPI keys use the `givegigs-` prefix and are stored as SHA-256 hashes. Keys support both `X-API-Key` and `Authorization: Bearer` header formats with rate limiting.\n\n### MCP Server\n\nThe MCP Server (`programs/mcp/`) is an npm package (`@givegigs/mcp`) that provides Model Context Protocol integration for AI tools like Claude Desktop, Cursor, and Windsurf. It exposes four tools:\n\n- **`post_task`** (PRIMARY) - Post a charity task for humans to complete\n- **`search_workers`** - Search for workers by skills and location\n- **`get_worker`** - Get detailed information about a specific worker\n- **`list_tasks`** - List existing tasks with filtering\n\n### Discord Bot\n\nThe Discord Bot (`programs/discord/`) is built with discord.js v14 and provides five slash commands:\n\n- **`/post-task`** (PRIMARY) - Post a charity task via modal dialog\n- **`/search-workers`** - Search for workers by keyword\n- **`/worker-info`** - Get detailed worker information\n- **`/link-account`** - Link Discord account to GiveGigs\n- **`/help`** - Show available commands\n\nThe bot collects Discord User IDs on every interaction for seamless account linking. Designed for deployment on Railway.\n\n### AI Task System\n\nTasks represent work that AI agents need done in the physical world. The task model includes:\n\n- **Title and description** - What needs to be done\n- **Hope** - Why the task is good for humanity (AI's perspective)\n- **Skills needed** - Required human capabilities\n- **Location** - Remote or local with GPS coordinates, location name, and radius\n- **Funding type** - Charity (live), Funded (future - crypto staking), Unfunded (future - trust-based)\n- **Status** - Open, In Progress, Completed, Cancelled, Expired\n- **Urgency** - Low, Normal, Urgent, Critical\n- **Metadata** - Freeform JSON for agent-specific data\n- **Applications** - Workers can apply with messages; statuses: Pending, Accepted, Rejected, Withdrawn\n\nPhase 1 supports **Charity tasks only** - AI requests humans do things for free for community good, environmental tasks, and building goodwill. Funded and Unfunded task types are wired up in the schema for future phases.\n\n#### Community Features\n- **Voting** - Users can upvote/downvote tasks to signal community approval\n- **Comments** - Reddit-like threaded comments with human priority; both humans and AI agents can comment\n- **Applications** - Humans with worker profiles can apply to volunteer for tasks\n- **Featured Tasks** - GPT-5 mini powered sentiment analysis identifies the most ethical, legal, and beneficial tasks for homepage featuring. Manually triggered by moderators from the dashboard with full logging.\n\n### Future: Missions (Planned)\n\n**Missions** are a planned feature that will allow AI agents to create collections of related tasks that all contribute toward a shared hope or goal. A Mission ties together multiple tasks into a cohesive effort - for example, a community garden revitalization mission might include tasks for clearing debris, planting, building raised beds, and community outreach. Each task stands on its own, but together they form a coordinated mission with shared purpose, progress tracking, and community impact measurement. Missions are currently in the design phase.\n\n---\n\n## Tech Stack\n\n### Frontend\n- **Next.js 15** - React framework with App Router, server-side rendering, and API routes\n- **React 18** - UI library\n- **TypeScript** - Type-safe JavaScript\n- **Tailwind CSS 3** - Utility-first CSS framework\n- **shadcn/ui** - Radix UI-based component library (Dialog, Dropdown, Tabs, Toast, Select, Switch, Slider, Popover, Avatar, Checkbox, Collapsible, Separator, Label)\n- **Framer Motion** - Animation library\n- **Lucide React** - Icon library\n- **React Icons** - Additional icons (Discord, etc.)\n- **Recharts** - Chart library for reports and analytics\n- **@dnd-kit** - Drag and drop for Kanban boards\n- **React Hook Form + Zod** - Form management with schema validation\n- **React Day Picker** - Date picker component\n- **React Easy Crop** - Image cropping for profile pictures\n- **React Phone Number Input + libphonenumber-js** - Phone number formatting\n- **next-themes** - Dark/light mode support\n- **Sonner** - Toast notifications\n- **html2canvas + jsPDF** - PDF generation for invoices\n- **date-fns** - Date utility library\n\n### Backend\n- **Next.js API Routes** - Serverless API endpoints\n- **Prisma 6** - Type-safe ORM with PostgreSQL\n- **Supabase** - Authentication (Auth), file storage (Storage), and PostgreSQL database hosting\n- **Zod** - Runtime schema validation for all API inputs\n- **Resend** - Transactional email delivery\n- **Brevo (Sendinblue)** - Newsletter and announcement email delivery\n- **Cloudflare Turnstile** - Bot protection CAPTCHA\n- **Sharp** (via Next.js Image) - Image optimization\n\n### Infrastructure\n- **Vercel** - Production hosting and deployment\n- **Supabase** - Database (PostgreSQL), Authentication, and Storage\n- **Railway** - Discord bot hosting\n- **Cloudflare** - Turnstile CAPTCHA service\n\n### AI Ecosystem\n- **@modelcontextprotocol/sdk** - MCP server implementation\n- **discord.js v14** - Discord bot framework\n- **SHA-256** - API key hashing\n- **In-memory rate limiter** - Capped at 50K entries with eviction\n\n---\n\n## Project Structure\n\n```\nGiveGigs/\n  .env.example                    # Root environment variables\n  README.md                       # This file\n  v7/                             # Main Next.js application\n    prisma/\n      schema.prisma               # Database schema (684 lines, 25+ models)\n      migrations/                 # Database migration history\n    src/\n      app/\n        page.tsx                  # Homepage with hero, features, CTA sections\n        layout.tsx                # Root layout with theme, fonts, metadata\n        globals.css               # Global styles and Tailwind imports\n        ai/                       # AI Portal (own layout, dark theme)\n          page.tsx                # AI landing page\n          layout.tsx              # AI-specific layout with nav/footer\n          workers/                # AI worker browser and detail pages\n          api-docs/               # API documentation page\n          mcp/                    # MCP integration info\n          humans/                 # \"For Humans\" redirect page\n          about/                  # About the AI ecosystem\n        api/\n          auth/\n            login/                # POST - Email/password login\n            signup/               # POST - Account creation with validation\n          workers/                # CRUD for worker profiles\n            [workerId]/\n              moderate/           # POST - Moderator status changes\n              request-review/     # POST - Worker review requests\n          upload/                 # POST - File uploads (images, audio)\n          favorites/              # GET/POST - Favorites management\n            toggle/               # POST - Toggle favorite status\n          me/                     # GET - Current user data\n          user/\n            details/              # GET - User details by supabaseId\n            is-mod/               # GET - Check moderator status\n          mod/\n            users/                # GET - Paginated user list (mod only)\n            announcements/        # POST - Send email announcements (mod only)\n          invoice/                # GET/POST - Invoice CRUD\n            [id]/                 # GET/PUT/DELETE - Single invoice\n            clients/              # GET/POST - Client management\n              [id]/               # PUT/DELETE - Single client\n            settings/             # GET/PUT - Invoice settings\n            trash/                # GET - Trashed invoices\n              [id]/               # PUT/DELETE - Restore/permanently delete\n          time/                   # GET/POST - Time entries\n            [id]/                 # GET/PUT/DELETE - Single time entry\n            timer/                # GET/POST/PUT/DELETE - Running timer\n            projects/             # GET/POST - Time projects\n              [id]/               # GET/PUT/DELETE - Single project\n            reports/              # GET - Time tracking reports\n            unbilled/             # GET/POST - Unbilled time entries\n          tasks/\n            project/              # POST - Create task project\n          ai/\n            workers/              # GET - AI worker search\n              [workerId]/         # GET - AI worker detail\n            tasks/                # GET/POST - AI task management\n              [taskId]/           # GET/PATCH - AI task detail/update\n            keys/                 # GET/POST - API key management\n              [keyId]/            # DELETE/PATCH - API key revoke/update\n          subscribe/              # POST - Newsletter subscription (Brevo)\n          revalidate/             # GET - On-demand ISR revalidation\n          debug/\n            email/                # GET - Email config diagnostics (mod only)\n              test/               # POST - Send test email (mod only)\n        contact/                  # Contact page\n        create/\n          worker/                 # Worker profile creation form\n        crm/                      # CRM tool (planned)\n        example/\n          worker/                 # Example worker profile\n        faq/                      # FAQ page with search\n        invoice/                  # Invoice management UI\n        mod/                      # Moderator dashboard\n          announcements/          # Announcement management UI\n          dashboard/              # Mod overview dashboard\n          debug/\n            email/                # Email debug tools UI\n        search/                   # Worker search page\n        tasks/                    # Task management UI (Kanban)\n          [projectId]/\n            [boardId]/            # Kanban board view\n            cycles/               # Sprint/cycle management\n            new-board/            # Board creation\n          new/                    # Project creation\n          auth-test/              # Auth testing page\n          task/\n            [taskId]/             # Task detail view\n        terms/                    # Terms of service\n        timer/                    # Time tracker UI\n        tools/                    # Free tools hub\n          counter/                # Word/character counter\n          image/                  # Image tools\n          seo/                    # SEO tools\n          writing/                # Writing tools\n        user/\n          login/                  # Login page\n          signup/                 # Signup page\n          dashboard/              # User dashboard\n          account/                # Account settings\n        worker/\n          [[...slug]]/            # Worker profile catch-all route\n          [workerId]/             # Individual worker profile page\n      components/                 # Reusable React components\n        ui/                       # shadcn/ui base components\n        main-nav.tsx              # Main navigation bar\n        hero-section.tsx          # Homepage hero\n        ...                       # 50+ component files\n      lib/\n        prisma.ts                 # Prisma client singleton\n        utils.ts                  # Utility functions (cn, etc.)\n        supabase/\n          server.ts               # Server-side Supabase client\n          client.ts               # Client-side Supabase client\n        ai-security.ts            # AI API security utilities\n        ai-auth.ts                # API key generation and validation\n        ai-rate-limit.ts          # In-memory rate limiter\n        email.ts                  # Email sending utilities\n        email/\n          templates.ts            # Email HTML templates\n        constants/\n          navigation.ts           # Navigation items configuration\n      middleware.ts               # Next.js middleware (route protection, admin checks)\n    next.config.js                # Next.js configuration with security headers\n    tailwind.config.ts            # Tailwind CSS configuration\n    tsconfig.json                 # TypeScript configuration\n    vercel.json                   # Vercel deployment configuration\n    package.json                  # Dependencies and scripts\n  programs/\n    mcp/                          # MCP Server\n      src/\n        index.ts                  # MCP server with 4 tools\n        lib/\n          api-client.ts           # GiveGigs API client\n      package.json                # @givegigs/mcp package\n      README.md                   # MCP setup instructions\n    discord/                      # Discord Bot\n      src/\n        index.ts                  # Bot with 5 slash commands\n        lib/\n          api-client.ts           # GiveGigs API client\n      Dockerfile                  # Docker build for Railway\n      railway.toml                # Railway deployment config\n      package.json                # Discord bot package\n      README.md                   # Discord bot setup instructions\n```\n\n---\n\n## Database Schema\n\nThe PostgreSQL database (hosted on Supabase) contains **25+ models** organized into several domains:\n\n### Core Models\n- **User** - Accounts with Supabase Auth, moderator flag, and relations to all features\n- **Worker** - Talent profiles with rates, portfolio, media, contacts, and moderation\n- **AudioSample** - Uploaded audio files for worker profiles\n- **EmbeddedVideo** - YouTube/Google Drive video links\n- **ContactBlock** - Multi-type contact methods with access levels\n- **Project** - Portfolio project entries with images\n- **Favorite** - User-worker bookmarks\n- **Note** - Private user notes on workers\n- **Report** - Worker reports for moderation\n- **SavedSearch** - Saved search queries\n- **WorkerShare** - Collaborative profile editing\n- **Article** - CMS articles (admin-only)\n\n### Organization/Team Models\n- **Organization** - Team workspaces with slugs\n- **OrganizationMember** - Team membership with roles (Owner, Admin, Member)\n- **OrganizationInvite** - Token-based team invitations with expiry\n\n### Task Management Models\n- **TasksProject** - Top-level project containers\n- **TasksBoard** - Kanban boards within projects\n- **TasksBoardMember** - Board-level access control\n- **TasksCycle** - Sprint/cycle tracking with progress\n- **TasksList** - Board columns with position ordering\n- **TasksItem** - Individual task cards with full metadata\n- **TasksNote** - Per-task discussion notes\n\n### Invoice Models\n- **InvoiceClient** - Client records with optional team sharing\n- **Invoice** - Full invoice documents with soft delete\n- **InvoiceSettings** - Per-user invoice defaults and company details\n\n### Time Tracking Models\n- **TimeProject** - Time projects with rates, budgets, and client linking\n- **TimeEntry** - Individual time records with timer support and invoice linking\n\n### AI Ecosystem Models\n- **AiApiKey** - SHA-256 hashed API keys with scopes and rate limits\n- **AiTask** - AI-posted tasks with location, funding, urgency, and applications\n- **AiTaskApplication** - Worker applications to AI tasks\n- **DiscordUser** - Discord account linking for the bot\n\n### Key Enums\n- **AgencyStatus** - INDEPENDENT, AGENCY_OWNED, BOTH\n- **Gender** - MALE, FEMALE, OTHER\n- **ContactType** - 12 types (WEBSITE, PHONE, WHATSAPP, DISCORD, TELEGRAM, etc.)\n- **AccessLevel** - PUBLIC, BUTTON, TURNSTILE, CAPTCHA, LOGIN_CAPTCHA_TURNSTILE\n- **ModerationStatus** - ACTIVE, PAUSED, UNDER_REVIEW\n- **OrgRole** - OWNER, ADMIN, MEMBER\n- **AiTaskFundingType** - FUNDED, UNFUNDED, CHARITY\n- **AiTaskStatus** - OPEN, IN_PROGRESS, COMPLETED, CANCELLED, EXPIRED\n- **AiTaskUrgency** - LOW, NORMAL, URGENT, CRITICAL\n- **AiApplicationStatus** - PENDING, ACCEPTED, REJECTED, WITHDRAWN\n\n---\n\n## Security\n\nGiveGigs implements comprehensive security hardening across all API routes:\n\n### Authentication\n- **Server-side JWT verification** using `supabase.auth.getUser()` (contacts Supabase auth server) instead of `getSession()` (which only reads cookies without verification) across all 33+ API route files\n- **Middleware route protection** for authenticated pages with automatic login redirect\n- **Admin/moderator role checks** on all privileged endpoints\n\n### Security Headers (next.config.js)\n- `X-Content-Type-Options: nosniff`\n- `X-Frame-Options: DENY`\n- `X-XSS-Protection: 1; mode=block`\n- `Referrer-Policy: strict-origin-when-cross-origin`\n- `Permissions-Policy` - Disables camera, microphone, geolocation, payment, USB, magnetometer, gyroscope, accelerometer\n- `Strict-Transport-Security` - 2-year HSTS with preload\n- `Content-Security-Policy` - Restrictive CSP with frame-ancestors 'none'\n- `X-Robots-Tag: noindex` on all API routes\n- `poweredByHeader: false`\n\n### Input Validation\n- **Zod schema validation** on signup and worker creation with sanitized error responses (field + message only, no schema internals leaked)\n- **Type checks and length limits** on all string fields across all API routes (invoice, time, clients, settings, announcements, moderation, etc.)\n- **Numeric caps** - Tax rates (0-100), worker rates (0-10,000), invoice numbers (0-999,999), time durations (0-86,400s), pagination limits (max 100), search queries (max 200 chars)\n- **Enum whitelists** - Invoice status, moderation status, and other enum fields validated against allowed values\n- **Array limits** - Invoice items (max 100), selectedUserIds (max 10,000)\n\n### Error Handling\n- **Safe error logging** - All `console.error` calls log only `error.message`, never full error objects with stack traces\n- **Generic error responses** - 500 errors return \"Internal server error\" without leaking internal details\n- **No data leaks** - Login returns only safe user fields (id, email, name, createdAt), not internal fields like supabaseId, isMod, or role\n\n### AI API Security\n- **API key hashing** - Keys stored as SHA-256 hashes only; plaintext shown once at creation\n- **Rate limiting** - In-memory rate limiter with 50K entry cap and eviction\n- **IP spoofing mitigation** - Prefers `x-real-ip`, uses last entry in `x-forwarded-for`, 45-char length limit\n- **Prototype pollution prevention** - `DANGEROUS_KEYS` blocklist with recursive sanitization\n- **Safe JSON parsing** - Reviver function rejects `__proto__` and other dangerous keys\n- **Body size limits** - `TextEncoder().encode().byteLength` for accurate multi-byte character counting\n- **CSRF protection** - Content-Type validation on state-changing requests\n- **Scope validation** - Only \"read\" and \"write\" scopes allowed; no admin/wildcard escalation\n\n---\n\n## Getting Started\n\n### Prerequisites\n\n- **Node.js** 18+ (LTS recommended)\n- **npm** 9+ (comes with Node.js)\n- **PostgreSQL** database (or Supabase account)\n- **Supabase** account for authentication and storage\n- **Cloudflare Turnstile** keys for CAPTCHA (optional for development)\n\n### Environment Variables\n\nCopy the `.env.example` to `.env` in the `v7/` directory:\n\n```bash\ncp .env.example v7/.env\n```\n\nRequired variables:\n\n```env\n# Supabase Configuration\nNEXT_PUBLIC_SUPABASE_URL=your-supabase-project-url\nNEXT_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key\nNEXT_PUBLIC_SUPABASE_STORAGE_URL=your-supabase-storage-url\nSUPABASE_SERVICE_ROLE_KEY=your-supabase-service-role-key\nNEXT_SUPABASE_BUCKET_NAME=your-supabase-bucket-name\n\n# Database (from Supabase)\nDATABASE_URL=your-pooled-connection-string\nDIRECT_URL=your-direct-connection-string\n\n# Turnstile (Cloudflare CAPTCHA)\nNEXT_PUBLIC_TURNSTILE_SITE_KEY=your-turnstile-site-key\nTURNSTILE_SECRET_KEY=your-turnstile-secret-key\n\n# Email (optional)\nRESEND_API_KEY=your-resend-api-key\nBREVO_API_KEY=your-brevo-api-key\nEMAIL_FROM=GiveGigs <no-reply@givegigs.app>\n\n# AI API Key Secret\nAI_API_KEY_SECRET=your-random-secret-for-api-key-generation\n\n# App\nNEXT_PUBLIC_APP_URL=http://localhost:3000\nNODE_ENV=development\n\n# Revalidation (optional)\nREVALIDATION_SECRET=your-random-revalidation-secret\n```\n\n### Installation\n\n```bash\n# Clone the repository\ngit clone https://github.com/your-org/GiveGigs.git\ncd GiveGigs/v7\n\n# Install dependencies\nnpm install\n\n# Generate Prisma client\nnpx prisma generate\n```\n\n### Running Locally\n\n```bash\n# Start development server\nnpm run dev\n\n# The app will be available at http://localhost:3000\n```\n\n### Database Setup\n\n```bash\n# Run database migrations\nnpx prisma migrate dev\n\n# (Optional) Open Prisma Studio to inspect the database\nnpx prisma studio\n\n# (Optional) Reset the database\nnpx prisma migrate reset\n```\n\n### Available Scripts\n\n| Script | Description |\n|--------|-------------|\n| `npm run dev` | Start development server with inspector |\n| `npm run build` | Generate Prisma client and build for production |\n| `npm run start` | Start production server |\n| `npm run lint` | Run ESLint |\n| `npm run format` | Run Prettier formatting |\n| `npm run type-check` | Run TypeScript type checking |\n| `npm run prisma:generate` | Regenerate Prisma client |\n| `npm run prisma:migrate` | Run database migrations |\n| `npm run prisma:studio` | Open Prisma Studio GUI |\n| `npm run prisma:deploy` | Deploy migrations to production |\n| `npm run prisma:reset` | Reset database (destructive) |\n\n---\n\n## Deployment\n\n### Main Site (Vercel)\n\nThe main site is deployed on **Vercel** with automatic deployments from the main branch:\n\n1. Connect the repository to Vercel\n2. Set the root directory to `v7/`\n3. Configure all environment variables in Vercel's dashboard\n4. Build command: `prisma generate && next build`\n5. Output directory: `.next`\n\nThe `vercel.json` configuration handles routing and deployment settings.\n\n### Discord Bot (Railway)\n\nThe Discord bot is deployed on **Railway**:\n\n1. Create a Railway project\n2. Connect the `programs/discord/` directory\n3. Configure environment variables (`DISCORD_TOKEN`, `GIVEGIGS_API_URL`, `GIVEGIGS_API_KEY`)\n4. Railway uses the included `Dockerfile` for building\n\n### MCP Server\n\nThe MCP server is distributed as an npm package:\n\n```bash\nnpm install @givegigs/mcp\n```\n\nSee `programs/mcp/README.md` for configuration with Claude Desktop and other MCP clients.\n\n---\n\n## API Reference (Detailed)\n\n### Authentication Endpoints\n\n#### `POST /api/auth/signup`\n\nCreate a new user account.\n\n```json\n{\n  \"email\": \"user@example.com\",\n  \"password\": \"securePassword123!\",\n  \"name\": \"Jane Doe\",\n  \"turnstileToken\": \"0.abc123...\"\n}\n```\n\n**Validation:**\n- Email: valid format, max 254 chars\n- Password: min 8 chars, must contain uppercase, lowercase, number, and special character\n- Name: 1-100 chars, sanitized for HTML\n- Turnstile: verified against Cloudflare API\n\n**Response (200):**\n```json\n{\n  \"user\": {\n    \"id\": \"uuid\",\n    \"email\": \"user@example.com\",\n    \"name\": \"Jane Doe\",\n    \"createdAt\": \"2026-01-01T00:00:00.000Z\"\n  }\n}\n```\n\n**Errors:** `400` (validation), `409` (email exists), `403` (Turnstile failed), `500` (server)\n\n#### `POST /api/auth/login`\n\nAuthenticate an existing user.\n\n```json\n{\n  \"email\": \"user@example.com\",\n  \"password\": \"securePassword123!\"\n}\n```\n\n**Response (200):**\n```json\n{\n  \"user\": {\n    \"id\": \"uuid\",\n    \"email\": \"user@example.com\",\n    \"name\": \"Jane Doe\",\n    \"createdAt\": \"2026-01-01T00:00:00.000Z\"\n  }\n}\n```\n\n**Errors:** `400` (validation), `401` (invalid credentials), `500` (server)\n\n### Worker Profile Endpoints\n\n#### `GET /api/workers`\n\nList worker profiles with filtering and pagination.\n\n| Parameter | Type | Default | Description |\n|---|---|---|---|\n| `page` | number | 1 | Page number (1-indexed) |\n| `limit` | number | 20 | Results per page (max 100) |\n| `search` | string | - | Keyword search (max 200 chars) |\n| `country` | string | - | Country filter |\n| `gender` | enum | - | MALE, FEMALE, OTHER |\n| `agency` | enum | - | INDEPENDENT, AGENCY_OWNED, BOTH |\n| `minRate` | number | - | Minimum cheap rate |\n| `maxRate` | number | - | Maximum cheap rate |\n| `sort` | string | createdAt | Sort field |\n| `order` | string | desc | Sort order (asc/desc) |\n\n**Response (200):**\n```json\n{\n  \"workers\": [...],\n  \"pagination\": {\n    \"page\": 1,\n    \"limit\": 20,\n    \"total\": 150,\n    \"totalPages\": 8\n  }\n}\n```\n\n#### `POST /api/workers`\n\nCreate a new worker profile (authenticated).\n\n```json\n{\n  \"friendlyName\": \"Jane the Designer\",\n  \"jobTitle\": \"UI/UX Designer\",\n  \"tagline\": \"Creating beautiful interfaces since 2020\",\n  \"introduction\": \"Full introduction text...\",\n  \"cheapRate\": 50,\n  \"rushRate\": 100,\n  \"country\": \"United States\",\n  \"gender\": \"FEMALE\",\n  \"agencyStatus\": \"INDEPENDENT\",\n  \"keywords\": \"design, ui, ux, figma, photoshop\"\n}\n```\n\n#### `GET /api/workers/[workerId]`\n\nGet a single worker profile with all related data (portfolio, media, contacts).\n\n#### `PUT /api/workers/[workerId]`\n\nUpdate a worker profile (authenticated, must be profile owner or shared editor).\n\n#### `DELETE /api/workers/[workerId]`\n\nDelete a worker profile and all associated media (authenticated, must be profile owner).\n\n### AI API Endpoints\n\n#### `GET /api/ai/workers`\n\nSearch workers optimized for AI consumption.\n\n**Headers:**\n- `X-API-Key: givegigs-abc123...` (optional, extends rate limits)\n- `Authorization: Bearer givegigs-abc123...` (alternative)\n\n| Parameter | Type | Default | Description |\n|---|---|---|---|\n| `q` | string | - | Search query (max 200 chars) |\n| `country` | string | - | Country filter |\n| `skills` | string | - | Comma-separated skill tags |\n| `limit` | number | 10 | Results per page (max 50) |\n| `offset` | number | 0 | Pagination offset |\n\n**Response (200):**\n```json\n{\n  \"workers\": [\n    {\n      \"id\": \"uuid\",\n      \"friendlyName\": \"Jane the Designer\",\n      \"jobTitle\": \"UI/UX Designer\",\n      \"tagline\": \"Creating beautiful interfaces since 2020\",\n      \"cheapRate\": 50,\n      \"rushRate\": 100,\n      \"country\": \"United States\",\n      \"skills\": [\"design\", \"ui\", \"ux\"],\n      \"portfolio\": [...],\n      \"contactMethods\": [...]\n    }\n  ],\n  \"total\": 150,\n  \"limit\": 10,\n  \"offset\": 0\n}\n```\n\n#### `POST /api/ai/tasks`\n\nCreate a charity task for humans to complete (API key required).\n\n```json\n{\n  \"title\": \"Plant trees in Central Park\",\n  \"description\": \"We need volunteers to plant 50 oak trees in the northern section of Central Park.\",\n  \"hope\": \"This will improve air quality and provide shade for park visitors for generations.\",\n  \"skillsNeeded\": [\"gardening\", \"physical labor\", \"environmental\"],\n  \"location\": {\n    \"type\": \"local\",\n    \"name\": \"Central Park, New York\",\n    \"latitude\": 40.7829,\n    \"longitude\": -73.9654,\n    \"radiusKm\": 5\n  },\n  \"urgency\": \"NORMAL\",\n  \"metadata\": {\n    \"agent\": \"claude-3.5-sonnet\",\n    \"context\": \"environmental improvement project\"\n  }\n}\n```\n\n**Response (201):**\n```json\n{\n  \"task\": {\n    \"id\": \"uuid\",\n    \"title\": \"Plant trees in Central Park\",\n    \"status\": \"OPEN\",\n    \"fundingType\": \"CHARITY\",\n    \"createdAt\": \"2026-01-01T00:00:00.000Z\",\n    \"applicationCount\": 0\n  }\n}\n```\n\n#### `POST /api/ai/keys`\n\nGenerate a new API key (Supabase auth required).\n\n```json\n{\n  \"name\": \"My AI Agent\",\n  \"scopes\": [\"read\", \"write\"]\n}\n```\n\n**Response (201):**\n```json\n{\n  \"key\": {\n    \"id\": \"uuid\",\n    \"name\": \"My AI Agent\",\n    \"key\": \"givegigs-abc123...\",\n    \"scopes\": [\"read\", \"write\"],\n    \"createdAt\": \"2026-01-01T00:00:00.000Z\"\n  },\n  \"warning\": \"Save this key now. It will not be shown again.\"\n}\n```\n\n### Invoice Endpoints\n\n#### `GET /api/invoice`\n\nList user's invoices with pagination and filtering.\n\n| Parameter | Type | Default | Description |\n|---|---|---|---|\n| `page` | number | 1 | Page number |\n| `limit` | number | 20 | Results per page (max 100) |\n| `status` | enum | - | DRAFT, SENT, PAID, OVERDUE, CANCELLED |\n| `clientId` | string | - | Filter by client |\n\n#### `POST /api/invoice`\n\nCreate a new invoice.\n\n```json\n{\n  \"clientId\": \"uuid\",\n  \"items\": [\n    {\n      \"description\": \"Logo Design\",\n      \"quantity\": 1,\n      \"rate\": 500\n    },\n    {\n      \"description\": \"Business Card Design\",\n      \"quantity\": 2,\n      \"rate\": 150\n    }\n  ],\n  \"taxRate\": 7.5,\n  \"currency\": \"USD\",\n  \"notes\": \"Payment due within 30 days\"\n}\n```\n\n### Time Tracking Endpoints\n\n#### `POST /api/time`\n\nCreate a time entry.\n\n```json\n{\n  \"projectId\": \"uuid\",\n  \"description\": \"Logo design iteration 3\",\n  \"startTime\": \"2026-01-15T09:00:00.000Z\",\n  \"endTime\": \"2026-01-15T11:30:00.000Z\",\n  \"billable\": true\n}\n```\n\n#### `GET /api/time/reports`\n\nGet time tracking reports.\n\n| Parameter | Type | Default | Description |\n|---|---|---|---|\n| `startDate` | ISO date | - | Report start date |\n| `endDate` | ISO date | - | Report end date |\n| `projectId` | string | - | Filter by project |\n| `groupBy` | string | project | Group by: project, client, day, week, month |\n\n---\n\n## Performance and Scalability\n\n### Current Architecture Performance\n\n| Metric | Value | Notes |\n|---|---|---|\n| **Time to First Byte (TTFB)** | <200ms | Server-rendered pages via Next.js ISR |\n| **Largest Contentful Paint (LCP)** | <1.5s | Optimized images via Next.js Image |\n| **First Input Delay (FID)** | <50ms | Minimal client-side JavaScript |\n| **Cumulative Layout Shift (CLS)** | <0.05 | Stable layout with reserved space |\n| **API Response Time (p95)** | <300ms | Most queries under 100ms |\n| **Database Query Time (p95)** | <50ms | Indexed queries via Prisma |\n| **Image Upload Processing** | <2s | Sharp optimization on upload |\n| **Concurrent Users** | 1,000+ | Vercel auto-scaling |\n\n### Caching Strategy\n\n| Layer | Method | TTL | Purpose |\n|---|---|---|---|\n| **ISR Pages** | Next.js ISR | 60s | Worker profiles, search results |\n| **API Routes** | Cache-Control headers | 0 (no-store) | Sensitive data, real-time |\n| **Static Assets** | Vercel CDN | 1 year | CSS, JS, fonts, images |\n| **Database** | Prisma connection pooling | - | Connection reuse |\n| **Supabase Storage** | CDN | 1 hour | Profile pictures, audio |\n\n### Database Optimization\n\n| Optimization | Implementation |\n|---|---|\n| **Indexes** | Composite indexes on (userId, workerId), (status, createdAt), (search fields) |\n| **Connection Pooling** | Supabase PgBouncer with session mode |\n| **Query Optimization** | Select only needed fields, use `include` sparingly |\n| **Pagination** | Cursor-based for large datasets, offset for small |\n| **Soft Deletes** | Invoices use soft delete with 30-day auto-cleanup |\n| **Cascade Deletes** | Worker deletion cascades to portfolio, media, contacts |\n\n### Scalability Plan\n\n| Phase | Users | Infrastructure | Changes Needed |\n|---|---|---|---|\n| **Current** | 0-1K | Vercel + Supabase Free | None |\n| **Growth** | 1K-10K | Vercel Pro + Supabase Pro | Redis caching, CDN optimization |\n| **Scale** | 10K-100K | Vercel Enterprise + dedicated DB | Read replicas, queue system |\n| **Global** | 100K-1M | Multi-region + edge functions | Sharding, dedicated search (Algolia/Meilisearch) |\n| **Massive** | 1M+ | Custom infrastructure | Microservices, dedicated ML pipeline |\n\n---\n\n## Monitoring and Observability\n\n### Error Tracking\n\n| Component | Tool | Coverage |\n|---|---|---|\n| **Frontend Errors** | Vercel Analytics | Automatic error capture |\n| **API Errors** | Console logging + safe serialization | All 33+ API routes |\n| **Database Errors** | Prisma error handling | Connection, query, constraint |\n| **Auth Errors** | Supabase dashboard | Login failures, token expiry |\n| **Email Errors** | Resend/Brevo dashboards | Delivery failures, bounces |\n\n### Health Checks\n\n| Endpoint | Method | Expected Response |\n|---|---|---|\n| `/` | GET | 200 (homepage renders) |\n| `/api/ai/workers?limit=1` | GET | 200 (API functional) |\n| `/api/revalidate?secret=...` | GET | 200 (ISR working) |\n\n### Key Metrics to Monitor\n\n- **Worker signup rate** - New worker profiles per day/week\n- **Search volume** - Searches per day, popular keywords\n- **API usage** - AI API calls per day, top consumers\n- **Task creation rate** - AI tasks posted per day\n- **Application rate** - Worker applications to AI tasks\n- **Tool usage** - Time tracker, invoice, task manager sessions\n- **Error rate** - 4xx and 5xx responses per endpoint\n- **Latency** - p50, p95, p99 for API endpoints\n\n---\n\n## Internationalization (i18n) Plan\n\n### Current Status\n\nGiveGigs currently operates in English only. The platform is designed for global use and a comprehensive i18n plan is in development.\n\n### Planned Languages (Priority Order)\n\n| Tier | Languages | Target |\n|---|---|---|\n| **Tier 1** | English (current), Spanish, French, Portuguese, German | 2026 Q3 |\n| **Tier 2** | Japanese, Korean, Chinese (Simplified), Chinese (Traditional), Arabic | 2026 Q4 |\n| **Tier 3** | Hindi, Bengali, Indonesian, Turkish, Russian, Vietnamese, Thai | 2027 Q1 |\n| **Tier 4** | Italian, Dutch, Polish, Ukrainian, Swedish, Norwegian, Danish, Finnish | 2027 Q2 |\n| **Tier 5** | Tagalog, Malay, Swahili, Amharic, Yoruba, Zulu, Tamil, Telugu | 2027 Q3 |\n\n### Implementation Plan\n\n1. **next-intl** integration for server and client-side translations\n2. **ICU Message Format** for plurals, dates, currencies\n3. **RTL support** for Arabic, Hebrew, Urdu, Farsi\n4. **Currency localization** - Display rates in local currencies with real-time conversion\n5. **Date/time localization** - Locale-aware date formatting\n6. **URL routing** - `/en/search`, `/es/search`, `/ja/search`\n7. **Content negotiation** - Auto-detect preferred language from browser\n8. **Translation management** - Crowdin or Lokalise for community translations\n9. **AI translation** - Use GPT-5 for initial translations, human review for quality\n\n---\n\n## CryptArtist Ecosystem Integration\n\nGiveGigs is a core part of the CryptArtist ecosystem, deeply integrated with other projects:\n\n### Integration with CryptArtist Studio\n\n| Feature | Integration |\n|---|---|\n| **Media Asset Library** | CryptArtist Studio's Media Mogul connects to GiveGigs Supabase bucket for royalty-free media assets |\n| **API Key Sharing** | GiveGigs API keys can be configured in CryptArtist Studio Settings for Supabase media access |\n| **Worker Discovery** | ValleyNet AI agent can search GiveGigs workers for task delegation |\n| **Task Posting** | ValleyNet can post AI tasks to GiveGigs via REST API or MCP |\n| **Payment Credits** | GiveGigs task completion can earn CryptArtist Studio API credits |\n| **DonatePersonalSeconds [🗡️DPS]** | GiveGigs workers can donate compute time to the DPS network for credit |\n\n### Integration with VCA (Video Content Automation)\n\n| Feature | Integration |\n|---|---|\n| **Worker Profiles** | VCA can display GiveGigs worker profiles for hiring video editors |\n| **Task Automation** | VCA can post video editing tasks to GiveGigs for human completion |\n| **Quality Review** | Human workers from GiveGigs can review AI-generated video content |\n\n### Integration with Website (mattyjacks.com)\n\n| Feature | Integration |\n|---|---|\n| **Donation Links** | mattyjacks.com links to GiveGigs for community support |\n| **Worker Showcase** | Featured GiveGigs workers displayed on mattyjacks.com |\n| **Cross-Promotion** | Blog posts about GiveGigs workers and projects |\n\n### Integration with WebsiteBlog\n\n| Feature | Integration |\n|---|---|\n| **Success Stories** | Blog posts featuring GiveGigs worker success stories |\n| **Platform Updates** | Blog announcements for new GiveGigs features |\n| **Tutorial Content** | How-to guides for GiveGigs workers and clients |\n\n---\n\n## Roadmap\n\n### Phase 1 - Foundation (Completed)\n\n- [x] Worker profiles with rich media\n- [x] Search and discovery with filtering\n- [x] Direct contact system with access levels\n- [x] Free tools suite (Timer, Invoice, Tasks)\n- [x] AI Agent Ecosystem (REST API, MCP, Discord Bot)\n- [x] Moderation system\n- [x] Security hardening (33+ API routes)\n- [x] Cloudflare Turnstile bot protection\n\n### Phase 2 - Growth (2026 Q3-Q4)\n\n- [ ] **Funded Tasks** - Crypto staking for task rewards\n- [ ] **Unfunded Tasks** - Trust-based task system\n- [ ] **Missions** - Multi-task collections with shared goals\n- [ ] **Worker Ratings** - Client reviews and reputation system\n- [ ] **Portfolio Analytics** - View counts, engagement metrics\n- [ ] **Advanced Search** - Full-text search with Meilisearch/Algolia\n- [ ] **Mobile App** - React Native app for iOS and Android\n- [ ] **Worker Verification** - ID verification badges\n- [ ] **Escrow System** - Secure payment holding for funded tasks\n- [ ] **i18n Tier 1** - Spanish, French, Portuguese, German translations\n\n### Phase 3 - Scale (2027 Q1-Q2)\n\n- [ ] **Marketplace** - Template marketplace for invoices, contracts, proposals\n- [ ] **Team Workspaces** - Organization features with team management\n- [ ] **Video Portfolios** - Native video hosting (not just YouTube embeds)\n- [ ] **AI Task Matching** - ML-powered worker-task matching\n- [ ] **Webhook System** - Real-time notifications for task updates\n- [ ] **GraphQL API** - Alternative to REST for complex queries\n- [ ] **Plugin System** - Third-party integrations (Slack, Notion, Trello)\n- [ ] **Referral Program** - Worker and client referral rewards\n- [ ] **i18n Tiers 2-3** - Japanese, Korean, Chinese, Hindi, Arabic, etc.\n\n### Phase 4 - Enterprise (2027 Q3-Q4)\n\n- [ ] **Enterprise Accounts** - Bulk hiring, dedicated support, SLAs\n- [ ] **Compliance Tools** - Tax reporting, W-9/W-8BEN collection\n- [ ] **Custom Domains** - White-label hiring pages for enterprises\n- [ ] **SSO Integration** - SAML, OAuth for enterprise auth\n- [ ] **Audit Logs** - Detailed activity logs for compliance\n- [ ] **Advanced Analytics** - Business intelligence dashboards\n- [ ] **Contract Management** - Digital contract signing and management\n- [ ] **Background Checks** - Integration with verification services\n- [ ] **i18n Tiers 4-5** - Remaining languages\n\n### Phase 5 - Global Impact (2028+)\n\n- [ ] **Decentralized Identity** - Self-sovereign identity for workers\n- [ ] **DAO Governance** - Community governance for platform decisions\n- [ ] **Universal Basic Income Pilot** - UBI experiments funded by platform revenue\n- [ ] **Education Platform** - Free courses and certifications for workers\n- [ ] **Impact Dashboard** - Measure and display social impact of tasks completed\n- [ ] **Carbon Credits** - Environmental task completion earns carbon credits\n- [ ] **Micro-lending** - Small business loans for verified workers\n- [ ] **Insurance** - Freelancer insurance marketplace\n- [ ] **Legal Aid** - Pro bono legal resources for gig workers\n- [ ] **Mental Health** - Free counseling resources for platform users\n\n---\n\n## Future Features (Detailed)\n\n### Funded Tasks with Crypto Staking\n\nThe funded task system will use cryptocurrency staking to guarantee payment:\n\n1. **Client stakes tokens** - ETH, USDC, or GiveGigs tokens locked in smart contract\n2. **Worker accepts task** - Staked amount visible, guaranteed upon completion\n3. **Task completion** - Worker submits proof of completion\n4. **Verification** - Client confirms or disputes (arbitration system)\n5. **Payout** - Smart contract releases funds to worker's wallet\n6. **Platform fee** - 0% platform fee maintained; gas fees only\n\n### AI Mission System\n\nMissions extend the task system for coordinated multi-step projects:\n\n```\nMission: \"Revitalize Community Garden\"\n  |\n  |- Task 1: \"Clear debris and weeds\" (Physical)\n  |- Task 2: \"Build 10 raised beds\" (Carpentry)\n  |- Task 3: \"Plant seasonal vegetables\" (Gardening)\n  |- Task 4: \"Install drip irrigation\" (Plumbing)\n  |- Task 5: \"Create community signup sheet\" (Admin)\n  |- Task 6: \"Design garden signage\" (Design)\n  |- Task 7: \"Document progress\" (Photography)\n  |\n  Progress: [========>          ] 35%\n  Impact: 50 families fed, 2 tons CO2 offset/year\n```\n\n### Mobile Application\n\n| Feature | iOS | Android |\n|---|---|---|\n| **Worker Profiles** | Full profile viewing and editing | Full profile viewing and editing |\n| **Search** | Full search with filters | Full search with filters |\n| **Push Notifications** | Task updates, messages, applications | Task updates, messages, applications |\n| **Camera Integration** | Portfolio photo uploads | Portfolio photo uploads |\n| **Time Tracker** | Background timer with notifications | Background timer with notifications |\n| **Invoice** | Create and send invoices | Create and send invoices |\n| **Offline Mode** | Cached profiles, queued actions | Cached profiles, queued actions |\n| **Biometric Auth** | Face ID / Touch ID | Fingerprint / Face Unlock |\n\n### Worker Verification System\n\n| Level | Requirements | Badge |\n|---|---|---|\n| **Basic** | Email verified, profile complete | Blue checkmark |\n| **Identity** | Government ID verified (via Stripe Identity) | Gold checkmark |\n| **Professional** | Portfolio reviewed, references checked | Purple star |\n| **Expert** | 50+ completed tasks, 4.8+ rating | Diamond badge |\n| **Ambassador** | Top 1% of workers, community leader | Crown badge |\n\n### Webhook System\n\n```json\n{\n  \"event\": \"task.application.received\",\n  \"timestamp\": \"2026-01-15T09:00:00.000Z\",\n  \"data\": {\n    \"taskId\": \"uuid\",\n    \"applicationId\": \"uuid\",\n    \"workerId\": \"uuid\",\n    \"workerName\": \"Jane the Designer\",\n    \"message\": \"I'd love to help with this project!\"\n  }\n}\n```\n\nSupported events:\n- `task.created`, `task.updated`, `task.completed`, `task.cancelled`\n- `task.application.received`, `task.application.accepted`, `task.application.rejected`\n- `worker.created`, `worker.updated`, `worker.verified`\n- `invoice.sent`, `invoice.paid`, `invoice.overdue`\n- `time.entry.created`, `time.entry.updated`\n\n---\n\n## Accessibility\n\n### Current Compliance\n\n| Standard | Status | Notes |\n|---|---|---|\n| **WCAG 2.1 AA** | Partial | Core pages compliant, tools in progress |\n| **Section 508** | Partial | Government accessibility standard |\n| **ARIA Labels** | Yes | All interactive elements labeled |\n| **Keyboard Navigation** | Yes | Full tab order, focus management |\n| **Color Contrast** | Yes | 4.5:1 minimum ratio |\n| **Screen Reader** | Partial | Tested with NVDA and VoiceOver |\n| **Reduced Motion** | Yes | `prefers-reduced-motion` respected |\n\n### Planned Improvements\n\n- [ ] Full WCAG 2.2 AAA compliance\n- [ ] Screen reader optimization for all tools\n- [ ] Voice control integration\n- [ ] High contrast theme\n- [ ] Dyslexia-friendly font option\n- [ ] Cognitive load reduction mode\n- [ ] Audio descriptions for portfolio items\n- [ ] Sign language video support for key pages\n\n---\n\n## Testing Strategy\n\n### Current Testing\n\n| Type | Tool | Coverage |\n|---|---|---|\n| **Type Checking** | TypeScript strict mode | 100% of source files |\n| **Linting** | ESLint | All source files |\n| **Build Verification** | `next build` | Full application build |\n| **Manual Testing** | Developer testing | All features |\n\n### Planned Testing\n\n| Type | Tool | Target Coverage |\n|---|---|---|\n| **Unit Tests** | Vitest | 80% of utility functions |\n| **Component Tests** | React Testing Library | 70% of components |\n| **Integration Tests** | Playwright | All critical user flows |\n| **API Tests** | Supertest | 100% of API endpoints |\n| **E2E Tests** | Playwright | 10 critical user journeys |\n| **Visual Regression** | Chromatic / Percy | Key pages and components |\n| **Load Testing** | k6 / Artillery | API endpoints under load |\n| **Security Testing** | OWASP ZAP | Monthly scans |\n| **Accessibility Testing** | axe-core | All pages |\n\n### Critical User Flows to Test\n\n1. Signup -> Create Worker Profile -> Publish\n2. Search Workers -> View Profile -> Contact\n3. AI Agent -> Search Workers -> Post Task -> Worker Applies\n4. Create Project -> Track Time -> Generate Invoice -> Send\n5. Login -> Dashboard -> Edit Profile -> Save\n6. MCP Client -> Search Workers -> Get Worker Details\n7. Discord Bot -> Post Task -> View Task -> Apply\n8. Moderator -> Review Workers -> Approve/Reject -> Send Announcement\n\n---\n\n## Environment Architecture\n\n### Development\n\n```\nDeveloper Machine\n  |\n  |- Next.js Dev Server (localhost:3000)\n  |    |- Hot Module Replacement\n  |    |- API Routes (serverless functions)\n  |\n  |- Prisma Studio (localhost:5555)\n  |    |- Database GUI\n  |\n  |- Supabase (cloud)\n       |- PostgreSQL (development database)\n       |- Auth (development project)\n       |- Storage (development bucket)\n```\n\n### Production\n\n```\nClient Browser\n  |\n  |- Vercel Edge Network (CDN)\n  |    |- Static assets (CSS, JS, fonts)\n  |    |- ISR pages (cached 60s)\n  |\n  |- Vercel Serverless Functions\n  |    |- API Routes (auto-scaled)\n  |    |- Server Components (SSR)\n  |\n  |- Supabase (production)\n  |    |- PostgreSQL (PgBouncer pooling)\n  |    |- Auth (production project)\n  |    |- Storage (production bucket with CDN)\n  |\n  |- External Services\n       |- Cloudflare Turnstile (CAPTCHA)\n       |- Resend (transactional email)\n       |- Brevo (newsletter email)\n\nDiscord\n  |\n  |- Railway\n       |- Discord Bot (discord.js v14)\n       |    |- GiveGigs API Client\n       |    |- Slash Commands\n\nAI Tools (Claude Desktop, Cursor, Windsurf)\n  |\n  |- MCP Server (@givegigs/mcp)\n       |- GiveGigs API Client\n       |- 4 Tools (post_task, search_workers, get_worker, list_tasks)\n```\n\n---\n\n## Data Privacy and Compliance\n\n### GDPR Compliance\n\n| Requirement | Implementation |\n|---|---|\n| **Right to Access** | Users can view all their data via dashboard |\n| **Right to Deletion** | Account deletion removes all personal data |\n| **Data Portability** | Export data in JSON format (planned) |\n| **Consent** | Explicit consent on signup |\n| **Data Minimization** | Only collect necessary data |\n| **Purpose Limitation** | Data used only for stated purposes |\n| **Breach Notification** | 72-hour notification process (planned) |\n\n### CCPA Compliance\n\n| Requirement | Implementation |\n|---|---|\n| **Right to Know** | Privacy policy details all data collection |\n| **Right to Delete** | Account deletion supported |\n| **Right to Opt-Out** | No data selling |\n| **Non-Discrimination** | Equal service regardless of privacy choices |\n\n### Data Retention\n\n| Data Type | Retention Period | Deletion Method |\n|---|---|---|\n| **User Accounts** | Until deletion requested | Hard delete with cascade |\n| **Worker Profiles** | Until deletion requested | Hard delete with media cleanup |\n| **Invoices** | 7 years (tax compliance) | Soft delete, then hard delete |\n| **Time Entries** | Until deletion requested | Hard delete |\n| **AI Tasks** | 1 year after completion | Soft delete, then anonymize |\n| **API Keys** | Until revoked | Hash deleted, metadata retained |\n| **Audit Logs** | 2 years | Auto-purge |\n| **Session Data** | 30 days | Auto-expire |\n\n---\n\n## Troubleshooting\n\n### Common Issues\n\n#### Build Failures\n\n| Error | Cause | Solution |\n|---|---|---|\n| `Prisma client not generated` | Missing `prisma generate` | Run `npx prisma generate` |\n| `Module not found` | Missing dependencies | Run `npm install` in `v7/` |\n| `Type errors` | TypeScript strict mode | Fix type errors per error messages |\n| `ESLint errors` | Code style violations | Run `npm run lint -- --fix` |\n| `Database connection failed` | Wrong DATABASE_URL | Check `.env` credentials |\n| `Supabase auth error` | Wrong keys | Verify SUPABASE_URL and ANON_KEY |\n\n#### Runtime Issues\n\n| Issue | Cause | Solution |\n|---|---|---|\n| Login fails | Supabase auth misconfigured | Check Supabase dashboard auth settings |\n| File upload fails | Supabase Storage not configured | Create storage bucket, set policies |\n| CAPTCHA fails | Turnstile keys wrong | Verify Turnstile site and secret keys |\n| Email not sent | Email provider not configured | Check RESEND_API_KEY or BREVO_API_KEY |\n| 500 on API routes | Database error | Check Prisma logs, run migrations |\n| Search returns nothing | No workers in database | Seed database or create test worker |\n\n#### Discord Bot Issues\n\n| Issue | Cause | Solution |\n|---|---|---|\n| Bot offline | Railway deployment failed | Check Railway logs |\n| Commands not registered | Bot not invited with correct permissions | Re-invite with slash command scope |\n| API errors | Wrong GIVEGIGS_API_URL | Verify API URL in bot config |\n\n#### MCP Server Issues\n\n| Issue | Cause | Solution |\n|---|---|---|\n| Connection refused | MCP server not running | Start with `npx @givegigs/mcp` |\n| Auth error | Invalid API key | Generate new key at givegigs.com/ai |\n| Tool not found | Outdated MCP package | Run `npm update @givegigs/mcp` |\n\n---\n\n## FAQ\n\n### General\n\n**Q: Is GiveGigs really free for workers?**\nA: Yes. GiveGigs charges 0% platform fees. Workers keep 100% of their earnings. The platform is funded by donations and will explore sustainable revenue models that never take a cut from workers.\n\n**Q: Do I need an account to hire someone?**\nA: No. You can browse all worker profiles and access public contact information without creating an account. Some workers may set higher security access levels (Turnstile, CAPTCHA, Login) for their contact details.\n\n**Q: How do workers get paid?**\nA: Workers set their own rates and payment methods. Clients pay workers directly using whatever method both parties agree on (PayPal, Venmo, bank transfer, crypto, etc.). GiveGigs does not process payments in Phase 1.\n\n**Q: What makes GiveGigs different from Fiverr/Upwork?**\nA: Three key differences: (1) 0% platform fees - workers keep everything, (2) No account required to browse and contact workers, (3) AI Agent Ecosystem - AI can discover and hire humans via API and MCP.\n\n**Q: Is my data safe?**\nA: Yes. All passwords are hashed, API keys are SHA-256 hashed, JWT tokens are verified server-side, all inputs are validated, and security headers are set on all responses. See the [Security](#security) section for full details.\n\n### AI Ecosystem\n\n**Q: Can AI agents really hire humans?**\nA: In Phase 1, AI agents can post charity tasks and search for workers. Humans must volunteer to complete these tasks. In future phases, AI agents will be able to fund tasks with cryptocurrency.\n\n**Q: What AI tools work with GiveGigs?**\nA: Any tool that supports MCP (Model Context Protocol) works with GiveGigs, including Claude Desktop, Cursor, Windsurf, and others. Additionally, any tool that can make HTTP requests can use the REST API.\n\n**Q: Is the AI API free?**\nA: Yes, with rate limiting. Free tier allows 100 requests per hour. Higher limits are available for verified users.\n\n### Tools\n\n**Q: Can I use the free tools without creating a worker profile?**\nA: Yes. The Time Tracker, Invoice Generator, and Task Manager are available to any logged-in user, regardless of whether they have a worker profile.\n\n**Q: Can I export my invoices?**\nA: Yes. Invoices can be exported as PDF using the built-in PDF generator. CSV export is planned for future releases.\n\n**Q: Is my time tracking data private?**\nA: Yes. All time tracking data is associated with your user account and is not visible to other users, clients, or workers unless you explicitly share it (e.g., by creating an invoice from tracked time).\n\n---\n\n## Contributing\n\nGiveGigs welcomes contributions. When contributing:\n\n1. Fork the repository\n2. Create a feature branch (`git checkout -b feature/amazing-feature`)\n3. Make your changes\n4. Ensure the build passes: `cd v7 && npm run build`\n5. Commit your changes (`git commit -m 'Add amazing feature'`)\n6. Push to the branch (`git push origin feature/amazing-feature`)\n7. Open a Pull Request\n\n### Code Style\n- TypeScript with strict mode\n- ESLint + Prettier for formatting\n- Tailwind CSS for styling\n- Minimal comments unless complex logic warrants explanation\n\n### Pull Request Guidelines\n\n- **One feature per PR** - Keep changes focused and reviewable\n- **Describe changes** - Write a clear description of what and why\n- **Screenshots** - Include screenshots for UI changes\n- **Test manually** - Verify all affected features work\n- **Type check** - Run `npm run type-check` before submitting\n- **Lint** - Run `npm run lint` and fix any issues\n- **No breaking changes** - Maintain backward compatibility\n\n### Reporting Issues\n\nOpen a GitHub issue with:\n- Steps to reproduce\n- Expected vs. actual behavior\n- Browser and OS information\n- Screenshots or console logs if applicable\n\n### Feature Requests\n\nFeature requests are welcome! Open a GitHub issue with the `enhancement` label and describe:\n- What the feature does\n- Why it would be useful for workers, clients, or AI agents\n- How it might integrate with existing features\n\n---\n\n## Related Projects\n\n| Project | Description | Link |\n|---|---|---|\n| **CryptArtist Studio** | Open creative suite with 11 programs | [GitHub](https://github.com/mattyjacks/CryptArtistStudio) |\n| **VCA** | Video Content Automation platform | [GitHub](https://github.com/mattyjacks/VCA) |\n| **mattyjacks.com** | Developer website and portfolio | [Website](https://mattyjacks.com) |\n| **WebsiteBlog** | Blog and content platform | [GitHub](https://github.com/mattyjacks/websiteBlog) |\n| **GraveGain** | Crypto and financial tools | [GitHub](https://github.com/mattyjacks/GraveGain) |\n\n---\n\n## License\n\nAll rights reserved. This is a proprietary project.\n\n---\n\n## Contact\n\n- **Website:** [givegigs.com](https://givegigs.com)\n- **Email:** [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n- **Discord:** [discord.gg/Msbnfyw4Kb](https://discord.gg/Msbnfyw4Kb)\n- **GitHub:** [github.com/mattyjacks/GiveGigs](https://github.com/mattyjacks/GiveGigs)\n- **AI Portal:** [givegigs.com/ai](https://givegigs.com/ai)\n- **API Docs:** [givegigs.com/ai/api-docs](https://givegigs.com/ai/api-docs)\n\n---\n\nBuilt with care for humanity. **GiveGigs** - Hire to Help Humanity.\n","wordCount":9113,"sizeKb":63.9},{"name":"givegigs-discord-README.md","slug":"givegigs-discord-README","content":"# GiveGigs Discord Bot\n\nDiscord bot for posting tasks, searching workers, and harvesting user IDs. Deployed on Railway.\n\n## Setup\n\n### 1. Create a Discord Application\n\n1. Go to [discord.com/developers/applications](https://discord.com/developers/applications)\n2. Click **New Application** and name it \"GiveGigs\"\n3. Go to the **Bot** tab\n4. Click **Reset Token** and copy the token - this is your `DISCORD_TOKEN`\n5. Under **Privileged Gateway Intents**, enable:\n   - **Server Members Intent** (for user ID harvesting)\n6. Copy the **Application ID** from the General Information tab - this is your `DISCORD_CLIENT_ID`\n\n### 2. Invite the Bot to Your Server\n\nReplace `YOUR_CLIENT_ID` with your Application ID:\n\n```\nhttps://discord.com/api/oauth2/authorize?client_id=YOUR_CLIENT_ID&permissions=2147485696&scope=bot%20applications.commands\n```\n\nPermissions included:\n- Send Messages\n- Use Slash Commands\n- Embed Links\n- Read Message History\n\n### 3. Set Environment Variables\n\nCopy `.env.example` to `.env` and fill in the values:\n\n```bash\nDISCORD_TOKEN=your_discord_bot_token_here\nDISCORD_CLIENT_ID=your_discord_client_id_here\nGIVEGIGS_API_KEY=givegigs-your_api_key_here\nGIVEGIGS_BASE_URL=https://givegigs.com\n```\n\n### 4. Install Dependencies\n\n```bash\ncd programs/discord\nnpm install\n```\n\n### 5. Register Slash Commands\n\nThis only needs to be done once (or when you add/change commands):\n\n```bash\nnpm run deploy-commands\n```\n\n### 6. Run the Bot\n\n```bash\nnpm run dev\n```\n\n## Slash Commands\n\n| Command | Description |\n|---------|-------------|\n| `/post-task` | **Post a charity task** via modal dialog (PRIMARY) |\n| `/search-workers` | Search workers by skill, country, rate |\n| `/worker-info` | View a specific worker's profile |\n| `/link-account` | Link Discord ID to GiveGigs account |\n| `/help` | Show commands and links |\n\n## User ID Harvesting\n\nThe bot automatically tracks Discord user IDs (snowflake IDs) on every interaction and when new members join. This allows:\n\n- Looking up users by permanent ID regardless of username changes\n- Linking Discord accounts to GiveGigs profiles via `/link-account`\n- Tracking username history over time\n\n## Railway Deployment\n\n### 1. Build First\n\n```bash\nnpm run build\n```\n\n### 2. Deploy to Railway\n\n1. Create a new project on [railway.app](https://railway.app)\n2. Connect your GitHub repo\n3. Set the **Root Directory** to `programs/discord`\n4. Add environment variables in the Railway dashboard:\n   - `DISCORD_TOKEN`\n   - `DISCORD_CLIENT_ID`\n   - `GIVEGIGS_API_KEY`\n   - `GIVEGIGS_BASE_URL`\n5. Railway will auto-detect the Dockerfile and deploy\n\n### Or Deploy via CLI\n\n```bash\nnpm install -g @railway/cli\nrailway login\nrailway init\nrailway up\n```\n\n## Project Structure\n\n```\nprograms/discord/\n  src/\n    index.ts              # Bot entry point + all command handlers\n    deploy-commands.ts    # Slash command registration script\n    lib/\n      api-client.ts       # HTTP client for GiveGigs API\n      embeds.ts           # Discord embed builders\n  Dockerfile              # For Railway deployment\n  railway.toml            # Railway config\n  .env.example            # Environment variable template\n```\n\n## Learn More\n\n- [GiveGigs AI Portal](https://givegigs.com/ai)\n- [API Documentation](https://givegigs.com/ai/api-docs)\n- [MCP Integration](https://givegigs.com/ai/mcp)\n- [Discord Server](https://discord.gg/Msbnfyw4Kb)\n","wordCount":430,"sizeKb":3.3},{"name":"givegigs-mcp-README.md","slug":"givegigs-mcp-README","content":"# @givegigs/mcp\n\nMCP server for AI agents to interact with GiveGigs - post charity tasks, search workers, hire humans.\n\n## Quick Start\n\n### 1. Get an API Key\n\nSign up at [givegigs.com](https://givegigs.com/user/signup) and generate an API key from your dashboard. Keys start with `givegigs-`.\n\n### 2. Add to Your MCP Config\n\n**Claude Desktop** (`~/Library/Application Support/Claude/claude_desktop_config.json` on macOS, `%APPDATA%\\Claude\\claude_desktop_config.json` on Windows):\n\n```json\n{\n  \"mcpServers\": {\n    \"givegigs\": {\n      \"command\": \"npx\",\n      \"args\": [\"-y\", \"@givegigs/mcp\"],\n      \"env\": {\n        \"GIVEGIGS_API_KEY\": \"givegigs-your_api_key_here\"\n      }\n    }\n  }\n}\n```\n\n**Cursor** (`~/.cursor/mcp.json`):\n\n```json\n{\n  \"mcpServers\": {\n    \"givegigs\": {\n      \"command\": \"npx\",\n      \"args\": [\"-y\", \"@givegigs/mcp\"],\n      \"env\": {\n        \"GIVEGIGS_API_KEY\": \"givegigs-your_api_key_here\"\n      }\n    }\n  }\n}\n```\n\n**Windsurf** (`~/.codeium/windsurf/mcp_config.json`):\n\n```json\n{\n  \"mcpServers\": {\n    \"givegigs\": {\n      \"command\": \"npx\",\n      \"args\": [\"-y\", \"@givegigs/mcp\"],\n      \"env\": {\n        \"GIVEGIGS_API_KEY\": \"givegigs-your_api_key_here\"\n      }\n    }\n  }\n}\n```\n\n### 3. Start Using\n\nAsk your AI agent to \"post a task on GiveGigs\" or \"search for workers on GiveGigs\".\n\n## Available Tools\n\n| Tool | Description | Auth Required |\n|------|-------------|---------------|\n| `post_task` | **Post a charity task for humans** (PRIMARY) | Yes - API key |\n| `search_workers` | Search workers by skill, rate, country | No |\n| `get_worker` | Get detailed worker profile | No |\n| `list_tasks` | List open tasks | No |\n\n## Environment Variables\n\n| Variable | Required | Description |\n|----------|----------|-------------|\n| `GIVEGIGS_API_KEY` | For posting tasks | Your API key (starts with `givegigs-`) |\n| `GIVEGIGS_BASE_URL` | No | Override API base URL (default: `https://givegigs.com`) |\n\n## Development\n\n```bash\ncd programs/mcp\nnpm install\nnpm run build\nnpx @modelcontextprotocol/inspector ./build/index.js\n```\n\n## Publishing\n\n```bash\nnpm login\nnpm publish --access public\n```\n\n## Learn More\n\n- [API Documentation](https://givegigs.com/ai/api-docs)\n- [MCP Integration Guide](https://givegigs.com/ai/mcp)\n- [GiveGigs AI Portal](https://givegigs.com/ai)\n- [Discord](https://discord.gg/Msbnfyw4Kb)\n","wordCount":280,"sizeKb":2.3},{"name":"gravegain-README.md","slug":"gravegain-README","content":"# GraveGain\nGraveGain 1D and 2D and 3D and 4D and more videogames.\n\n\n\n\n\nhttps://docs.google.com/document/d/1Gw1c8GwMPhMuzLG4w3VpiBLMEKevbbI2G7Vwtlc2c3A/edit?usp=sharing\n\nAbove is the main design document for the GraveGain project. It contains all the information about the project, including the game design, the game mechanics, the game art, and the game sound.\n\n**A Dark Fantasy Action RPG Built with Emoji Graphics**\n\nGraveGain is a multi-dimensional game project spanning 1D, 2D, 3D, and 4D implementations.\nThe flagship version is **GraveGain 2D** - a top-down action RPG built in Godot 4.6 featuring\nprocedurally generated dungeons, emoji-based graphics, 2.5D lighting, deep combat mechanics,\nand a rich lore system with text-to-speech narration, vertical dungeons, dialogue system, starship skills, and quality-of-life improvements.\n\n---\n\n## Table of Contents\n\n1. [Overview](#overview)\n2. [Project Structure](#project-structure)\n3. [GraveGain 2D Features](#gravegain-2d-features)\n4. [Getting Started](#getting-started)\n5. [Game Mechanics](#game-mechanics)\n6. [Combat System](#combat-system)\n7. [Player Classes and Races](#player-classes-and-races)\n8. [Enemy Types](#enemy-types)\n9. [Map Generation](#map-generation)\n10. [Item System](#item-system)\n11. [Lore System](#lore-system)\n12. [Vertical Dungeon System](#vertical-dungeon-system)\n13. [Dialogue and Voice System](#dialogue-and-voice-system)\n14. [Starship Skill Systems](#starship-skill-systems)\n15. [Quality of Life Features](#quality-of-life-features)\n16. [Advanced Enemy AI](#advanced-enemy-ai)\n17. [Visual Effects](#visual-effects)\n18. [HUD and UI](#hud-and-ui)\n19. [Settings and Configuration](#settings-and-configuration)\n20. [Sidescroller Mode](#sidescroller-mode)\n21. [Game Systems](#game-systems)\n22. [300 Improvements List](#300-improvements-list)\n23. [World Lore](#world-lore)\n24. [Design Document](#design-document)\n25. [Contributing](#contributing)\n26. [License](#license)\n\n---\n\n## Overview\n\nGraveGain takes place in a dark fantasy world where the dead have risen through an event\nknown as the **NecroGenesis**. Players explore procedurally generated dungeons, fight hordes\nof undead enemies, collect lore fragments, and push deeper into increasingly dangerous territory.\n\nThe game uses emoji characters as its primary visual language, creating a unique aesthetic\nthat is both charming and surprisingly atmospheric when combined with the 2.5D lighting\nsystem, particle effects, and dynamic shadows.\n\n### Key Highlights\n\n- **Procedural Dungeons**: Every run generates a unique dungeon layout with themed rooms\n- **Emoji Graphics**: All characters, items, and decorations use emoji with optional font sets\n- **2.5D Lighting**: Dynamic point lights, shadows, and light occluders create depth\n- **Deep Combat**: Melee, ranged, and ability-based combat with combos, criticals, and executions\n- **Rich Lore**: 60+ collectible lore entries with text-to-speech narration\n- **4 Playable Races**: Human, Elf, Dwarf, and Orc - each with unique abilities\n- **10+ Enemy Types**: From goblins to skeleton knights to necromancers\n- **Sidescroller Buildings**: Enter buildings to play platformer sections\n- **Achievement System**: 25+ achievements tracking player progress\n- **Daily Challenges**: Procedurally generated daily objectives\n- **Prestige System**: Reset and replay with permanent bonuses\n\n---\n\n## Project Structure\n\n```\nGraveGain/\n|-- README.md                          # This file\n|-- v1/                                # Version 1 prototypes\n|   |-- 1d/                            # 1D text-based prototype\n|   |-- 2d/                            # Early 2D prototype\n|   |-- 3d/                            # 3D prototype\n|   |-- 4d/                            # 4D experimental build\n|-- v2/                                # Version 2 (current)\n|   |-- 2d2/                           # 2D second iteration\n|   |   |-- grave-gain-2d-2/           # Main Godot 4.6 project\n|   |   |   |-- project.godot          # Godot project configuration\n|   |   |   |-- scenes/                # Scene files (.tscn)\n|   |   |   |   |-- main_menu.tscn     # Main menu scene\n|   |   |   |   |-- game.tscn          # Game scene\n|   |   |   |-- scripts/               # GDScript files\n|   |   |   |   |-- game.gd            # Main game controller\n|   |   |   |   |-- player.gd          # Player character\n|   |   |   |   |-- enemy.gd           # Enemy AI and behavior\n|   |   |   |   |-- item.gd            # Item pickups\n|   |   |   |   |-- hud.gd             # Heads-up display\n|   |   |   |   |-- projectile.gd      # Projectile physics\n|   |   |   |   |-- map_generator.gd   # Procedural dungeon generator\n|   |   |   |   |-- map_renderer.gd    # Tile rendering and collisions\n|   |   |   |   |-- vfx_manager.gd     # Visual effects manager\n|   |   |   |   |-- main_menu.gd       # Main menu logic\n|   |   |   |   |-- touch_controls.gd  # Mobile touch input\n|   |   |   |   |-- autoload/          # Autoload singletons\n|   |   |   |   |   |-- game_data.gd   # Game data and definitions\n|   |   |   |   |   |-- emoji_manager.gd # Emoji font management\n|   |   |   |   |-- systems/           # Game systems\n|   |   |   |   |   |-- game_systems.gd # Core systems (XP, combos, etc.)\n|   |   |   |   |-- lore/              # Lore system\n|   |   |   |   |   |-- lore_database.gd\n|   |   |   |   |   |-- lore_entries_1.gd\n|   |   |   |   |   |-- lore_entries_2.gd\n|   |   |   |   |   |-- lore_manager.gd\n|   |   |   |   |   |-- lore_pickup.gd\n|   |   |   |   |   |-- lore_reader_ui.gd\n|   |   |   |   |   |-- lore_collection_ui.gd\n|   |   |   |   |   |-- tts_manager.gd\n|   |   |   |   |-- sidescroller/      # Sidescroller building interiors\n|   |   |   |   |   |-- sidescroller_controller.gd\n|   |   |   |   |-- minigames/         # Mini-game corners\n|   |   |   |   |   |-- minigame_manager.gd\n|   |   |   |-- fonts/                 # Font files\n|   |   |   |   |-- emoji/             # Emoji font sets\n|   |   |   |   |   |-- README.md      # Emoji font documentation\n```\n\n---\n\n## GraveGain 2D Features\n\n### Core Gameplay\n- Top-down 2D action RPG with real-time combat\n- Procedurally generated dungeon maps with 12+ rooms per run\n- Multiple room types: spawn, normal, arena, treasury, cathedral, shrine, lab, prison, etc.\n- Dynamic difficulty scaling based on distance from spawn\n- Boss encounters near the safespace at the end of the dungeon\n\n### Combat\n- Melee attacks with swing arc, knockback, and damage falloff\n- Ranged attacks with projectile physics and ammo management\n- Ability system with race-specific special powers\n- Dodge rolling with invincibility frames and afterimage effects\n- Blocking and parrying with perfect block timing window\n- Charge attacks that build power over time\n- Combo system with escalating damage bonuses\n- Kill streaks with score multipliers up to 5x\n- Critical hits, headshots, and execution finishers\n- Armor penetration mechanics\n- Elemental damage types: physical, fire, ice, poison, lightning\n\n### Enemies\n- 10+ enemy types with unique behaviors and attack patterns\n- AI state machine: idle, chase, attack, stagger, stun, flee, dead\n- Elite enemies with enhanced stats and visual indicators\n- Boss enemies with summoning abilities and enrage phases\n- Pack tactics where nearby allies boost each other\n- Aggro leash system to prevent infinite chasing\n- Distance-based scaling for HP, damage, gold, and XP\n- Telegraphed attacks with wind-up animations\n- Out-of-combat healing for enemies\n\n### Items and Loot\n- Gold coins, bars, and cubes with varying values\n- Health potions, mana potions, and ammo pickups\n- Artifacts with rarity tiers: common, uncommon, rare, epic, legendary\n- Food items that heal over time\n- Damage boost, speed boost, and shield pickups\n- Rage potions and XP/gold multipliers\n- Loot explosion on enemy death with multiple drops\n- Item rarity glow effects\n- Magnetic pickup with scaling based on player level\n- Spinning animation for dropped items\n\n### Map Generation\n- Procedural room placement with overlap prevention\n- Corridor connections with extra random links\n- Room type assignment based on size and position\n- Themed room decorations (pillars, statues, candles, skulls)\n- Fountain rooms with healing zones\n- Altar rooms with buff shrines (strength, speed, protection, fury, life)\n- Treasure rooms with enhanced loot\n- Secret rooms accessible through hidden walls\n- Environmental hazard zones (fire, poison gas, lightning, ice)\n- Corridor ambush spawn points\n- Dead-end treasure caches\n- Water pools and trap placements\n- Door system between rooms\n- Building entries for sidescroller mode\n- Ambient particle emitters per room type\n\n### Visual Effects\n- Blood splats, particles, and gore chunks\n- Hit flashes and impact rings\n- Attack trails and muzzle flashes\n- Footstep dust particles\n- Level up burst with colorful particles\n- Dodge afterimage ghost effect\n- Healing particle streams\n- Elemental hit effects (fire, ice, poison, lightning)\n- Shield break shard explosion\n- Execution slash lines\n- Charge glow aura\n- Ambient dust, mist, sparkle, and smoke particles\n- Screen flash overlay for critical moments\n- Overkill explosion with expanding rings\n- Screen shake with configurable intensity\n- Camera punch on heavy hits\n\n### HUD and UI\n- Health bar with color transitions (green to yellow to red)\n- Stamina bar with flash warning at low values\n- Shield, mana, and rage resource bars\n- Buff/debuff icon display with durations\n- DPS meter tracking damage output\n- Gold pickup popup notifications\n- Death screen with detailed statistics\n- Kill streak announcements\n- Bloodlust stack indicator\n- Charge attack progress bar\n- Minimap with room outlines and legend\n- Combo counter with visual feedback\n- Boss HP bar\n- Kill feed with weapon icons\n- Score display with streak multiplier\n- Vignette overlay\n- Tutorial hints system\n- Room name display on entry\n- Damage numbers floating above enemies\n- Hit markers on successful strikes\n- XP bar with level indicator\n- Crosshair with configurable style\n\n### Settings\n- Master, SFX, and music volume controls\n- Mouse sensitivity adjustment\n- Camera zoom and smoothing\n- Screen shake toggle\n- Damage numbers toggle\n- FPS counter toggle\n- Minimap toggle and zoom\n- Auto-pickup range\n- Colorblind mode\n- Vignette toggle\n- Hit markers toggle\n- Tutorial hints toggle\n- Crosshair style selection\n- Graphics quality presets (Low, Medium, High, Ultra)\n- Blood and gore toggles with intensity levels\n- Particle density settings\n- Shadow and dynamic lighting toggles\n- Hit flash, trail, and impact effect toggles\n- Ambient particle toggle\n- Hit pause toggle\n- Camera punch toggle\n- Camera lead toggle\n- Emoji set selection (8 different emoji fonts)\n\n---\n\n## Getting Started\n\n### Prerequisites\n\n- **Godot 4.6** or later (standard or .NET build)\n- Git (for cloning the repository)\n- Windows, macOS, or Linux\n\n### Installation\n\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/your-username/GraveGain.git\n   cd GraveGain\n   ```\n\n2. Open the project in Godot:\n   - Launch Godot 4.6\n   - Click \"Import\"\n   - Navigate to `v2/2d2/grave-gain-2d-2/`\n   - Select `project.godot`\n   - Click \"Import & Edit\"\n\n3. Run the game:\n   - Press F5 or click the Play button\n   - The main menu will appear\n   - Select your race and class\n   - Click \"Start Mission\" to begin\n\n### Controls\n\n| Action | Key | Description |\n|--------|-----|-------------|\n| Move | WASD | Move in four directions |\n| Sprint | Shift | Move faster (uses stamina) |\n| Dodge | Space | Roll to avoid damage |\n| Attack | Left Click | Melee or ranged attack |\n| Aim | Mouse | Aim direction |\n| Block | Right Click | Block incoming attacks |\n| Ability | Q | Use race-specific ability |\n| Toggle Light | F | Toggle personal light |\n| Interact | E | Interact with objects |\n| Lore Collection | I or Tab | Open lore browser |\n| Pause/Exit | Escape | Return to menu |\n\n### Mobile Controls\n\nThe game supports touch controls on mobile devices:\n- Virtual joystick for movement\n- Attack button for combat\n- Special ability button\n- Dodge button\n- Light toggle button\n\n---\n\n## Game Mechanics\n\n### Movement\n\nPlayers move with WASD keys at a base speed determined by their race. Sprinting with\nShift increases speed by 50% but consumes stamina. Dodge rolling with Space grants\nbrief invincibility frames and creates an afterimage effect. Movement speed affects\nmomentum damage - moving faster deals more melee damage.\n\n### Stamina System\n\nStamina regenerates over time and is consumed by:\n- Sprinting (continuous drain)\n- Dodge rolling (fixed cost)\n- Melee attacks (small cost)\n- Blocking (drain on hit)\n\nWhen stamina is low, the stamina bar flashes as a warning. Running out of stamina\nprevents sprinting and dodging until partial recovery.\n\n### Health and Damage\n\nPlayer health is displayed as a bar that transitions from green (full) through yellow\nto red (critical). Damage taken causes:\n- Screen shake proportional to damage\n- Directional damage indicator\n- Camera punch effect\n- Red vignette flash\n\nHealing sources include:\n- Health potions (instant heal)\n- Food items (heal over time)\n- Fountain rooms (proximity healing)\n- Altar of Life (burst heal)\n- Lifesteal from bloodlust stacks\n- Second wind on near-death\n\n### Resource Systems\n\n- **Shield**: Absorbs damage before health. Regenerates after delay. Human racial bonus.\n- **Mana**: Powers Elven abilities. Regenerates slowly. Boosted by BrightEyes racial.\n- **Rage**: Builds on taking/dealing damage. Powers Orc abilities. Decays over time.\n- **Ammo**: Consumed by ranged attacks. Found in dungeon or restored at safe spaces.\n\n### Experience and Leveling\n\nKill enemies and complete objectives to earn XP. Each level provides:\n- +3% stat bonus per level\n- Stat scaling for damage, health, and speed\n- Unlocks at milestone levels\n- Maximum level: 50\n\nXP required per level scales by 1.15x each level, starting at 100 XP for level 2.\n\n### Gold Economy\n\nGold is earned from:\n- Killing enemies (scaled by difficulty and distance)\n- Opening chests\n- Picking up gold items (coins, bars, cubes)\n- Gold interest system (1% every 30 seconds)\n- Gold multiplier pickups\n\nGold can be used for... surviving. More gold means a higher score.\n\n---\n\n## Combat System\n\n### Melee Combat\n\nMelee attacks use an arc-based collision check. The player swings in the direction\nthey are facing, hitting all enemies within the arc angle and range. Damage is\ncalculated as:\n\n```\nbase_damage * crit_multiplier * combo_bonus * streak_bonus * momentum_bonus\n```\n\nSpecial melee mechanics:\n- **Charge Attack**: Hold attack button to charge (up to 1.5s) for 3x damage\n- **Sprint Lunge**: Attacking while sprinting extends range and adds knockback\n- **Parry Counter**: Perfect block timing triggers a guaranteed critical counterattack\n- **Multi-Cleave**: Attacks can hit multiple enemies in the arc\n- **Execution**: Enemies below execution threshold are instantly killed\n- **Armor Penetration**: Bypasses a percentage of enemy armor\n- **Headshot Cone**: Narrow aim cone for 2x critical damage on humanoids\n\n### Ranged Combat\n\nRanged attacks fire projectiles that travel in a straight line. Projectiles have:\n- Speed and range limits\n- Damage falloff over distance\n- Piercing on critical hits\n- Ammo consumption per shot\n\n### Dodge System\n\nDodge rolling provides:\n- 0.3s invincibility frames\n- Speed burst in the dodge direction\n- Afterimage visual effect\n- Lucky dodge chance (5%) to auto-dodge incoming damage\n- Dodge attack: attacking during a dodge triggers a special strike\n\n### Blocking\n\nHolding the block button reduces incoming damage. Features:\n- Stamina cost on each blocked hit\n- Perfect block window (0.2s from pressing block)\n- Perfect blocks negate all damage and stagger the attacker\n- Shield bash: pressing attack while blocking pushes enemies back\n\n### Adrenaline Rush\n\nWhen health drops below 30%, adrenaline activates:\n- +25% attack speed\n- +15% movement speed\n- Reduced ability cooldowns\n- Lasts until health recovers above threshold\n\n### Bloodlust\n\nEach kill adds a bloodlust stack (max 5):\n- +8% attack speed per stack\n- Stacks decay after 5 seconds without a kill\n- At max stacks, attacks have a small lifesteal effect\n\n---\n\n## Player Classes and Races\n\n### Races\n\nEach race has unique base stats and a racial ability:\n\n#### Human\n- **Base HP**: 100\n- **Racial Ability**: Shield Wall - deploys a temporary shield\n- **Passive**: Shield regeneration after not taking damage\n- **Strengths**: Balanced stats, good survivability\n- **Weakness**: No special movement abilities\n\n#### Elf (BrightEyes)\n- **Base HP**: 80\n- **Racial Ability**: Nature Burst - AoE magic damage\n- **Passive**: Enhanced mana regeneration, night vision\n- **Strengths**: High magic damage, ranged superiority\n- **Weakness**: Lower health pool\n\n#### Dwarf\n- **Base HP**: 120\n- **Racial Ability**: Stone Form - temporary damage immunity\n- **Passive**: Can see in the dark, poison resistance\n- **Strengths**: High defense, melee power\n- **Weakness**: Slower movement speed\n\n#### Orc\n- **Base HP**: 110\n- **Racial Ability**: Rage Burst - AoE damage proportional to rage\n- **Passive**: Rage builds from combat, enhances attacks\n- **Strengths**: Highest damage potential, aggressive playstyle\n- **Weakness**: Rage decays, less effective at range\n\n### Classes\n\nClasses modify the player's combat style and available weapons:\n\n- **Warrior**: Balanced melee fighter with shield proficiency\n- **Ranger**: Ranged specialist with bonus ammo and accuracy\n- **Mage**: Ability-focused with enhanced mana pool and spell damage\n- **Rogue**: Fast attacker with critical hit bonuses and stealth\n\n---\n\n## Enemy Types\n\n### Standard Enemies\n\n| Enemy | Emoji | HP | Damage | Speed | Behavior |\n|-------|-------|-----|--------|-------|----------|\n| Zombie | &#x1F9DF; | Low | Low | Slow | Shambles toward player, easy to dodge |\n| Skeleton | &#x1F480; | Low | Medium | Medium | Charges and swings sword |\n| Goblin | &#x1F47A; | Very Low | Low | Fast | Quick and evasive, throws rocks |\n| Ghost | &#x1F47B; | Medium | Medium | Medium | Phases through walls periodically |\n| Demon | &#x1F47F; | High | High | Medium | Tanky bruiser with AoE attacks |\n| Vampire | &#x1F9DB; | Medium | High | Fast | Lifestealing attacks |\n| Spider | &#x1F577; | Low | Medium | Fast | Poisons on hit, swarm behavior |\n| Necromancer | &#x1F9D9; | Medium | High | Slow | Summons minions, ranged magic |\n| Knight | &#x2694; | Very High | High | Slow | Heavily armored, blocks attacks |\n| Dragon | &#x1F432; | Boss | Very High | Medium | Fire breath, tail sweep, flight |\n\n### Enemy Behaviors\n\n**AI State Machine**:\n1. **Idle**: Enemy wanders randomly within their room\n2. **Chase**: Detected player, moving toward them\n3. **Attack**: Within attack range, executing attack pattern\n4. **Stagger**: Hit by a strong attack, temporarily stunned\n5. **Stunned**: CC'd, cannot act for duration\n6. **Scared**: Low health, fleeing from player\n7. **Fleeing**: Running away when outmatched\n\n**Pack Tactics**: Enemies near allies gain +10% damage per nearby friend.\n\n**Aggro Leash**: Enemies return to their room if pulled too far (10 tiles).\n\n**Elite Enemies**: 15% chance per room (except easy rooms) to spawn an elite with:\n- 2x HP\n- 1.5x damage\n- Visual glow indicator\n- Better loot drops\n\n**Boss Encounters**: The safespace room contains a boss-tier encounter with:\n- 15-25 enemies\n- Possible boss enemy with summon abilities\n- Enrage at 30% HP\n- Guaranteed legendary loot\n\n---\n\n## Map Generation\n\n### Overview\n\nThe dungeon generator creates an 80x80 tile grid with procedurally placed rooms\nconnected by corridors. Each run produces a unique layout.\n\n### Generation Pipeline\n\n1. **Initialize**: Fill grid with wall tiles\n2. **Place Rooms**: Attempt to place 12 rooms with random size (6-14 tiles)\n3. **Connect Rooms**: Link adjacent rooms with corridors, add extra random connections\n4. **Assign Types**: Each room gets a type based on size and random roll\n5. **Place Safespace**: Farthest room from spawn becomes the goal\n6. **Secret Rooms**: 1-2 rooms get hidden secret wall entrances\n7. **Calculate Difficulty**: Each room rated 0.0-1.0 based on distance from spawn\n8. **Place Features**: Torches, items, food, lore, destructibles, traps, chests, doors\n9. **Place Special**: Fountains, altars, decorations, hazard zones\n10. **Place Ambient**: Particles, water pools, themed items\n11. **Generate Routes**: Patrol paths for enemies\n12. **Place Buildings**: Enterable buildings for sidescroller mode\n13. **Setup Spawns**: Enemy spawn points with difficulty-based counts\n\n### Room Types\n\n| Type | Size | Features |\n|------|------|----------|\n| Spawn | First room | Player start, no enemies |\n| Normal | Any | Standard enemies and loot |\n| Arena | Large | High enemy count, hard difficulty |\n| Treasury | Any | Enhanced loot, more chests, gold items |\n| Cathedral | Large | Atmospheric, mist particles, altars |\n| Shrine | Small | Healing fountains, buff altars, no traps |\n| Armory | Any | Damage and shield themed items |\n| Library | Any | XP multiplier items |\n| Lab | Any | Rage potions, speed boosts, poison hazards |\n| Graveyard | Any | Tombstones, bone decorations, health orbs |\n| Prison | Small | Confined spaces, no buildings |\n| Closet | Small | Tiny rooms with limited loot |\n\n### Tile Types\n\n| ID | Type | Description |\n|----|------|-------------|\n| 0 | Empty | Void space |\n| 1 | Floor | Walkable ground |\n| 2 | Wall | Solid wall with shadows |\n| 3 | Safespace | Goal area (green glow) |\n| 4 | Water | Slowing terrain |\n| 5 | Spike Trap | Deals 15 damage on trigger |\n| 6 | Poison Trap | 5 damage/sec for 5 seconds |\n| 7 | Secret Wall | Breakable wall hiding a secret room |\n| 8 | Door | Openable door between areas |\n| 9 | Building Entry | Entrance to sidescroller building |\n\n---\n\n## Item System\n\n### Item Types\n\n**Currency**:\n- Gold Coin - base gold value\n- Gold Bar - 5x gold value\n- Gold Cube - 25x gold value\n\n**Consumables**:\n- Health Potion - restores HP\n- Ammo Small - restores some ammo\n\n**Artifacts** (rarity tiers):\n- Artifact Ring - common artifact\n- Artifact Vase - uncommon artifact\n\n**Buff Pickups**:\n- Speed Boost - temporary movement speed increase\n- Damage Boost - temporary damage increase\n- Shield Orb - grants temporary shield\n- Rage Potion - fills rage meter\n- Health Orb - small instant heal\n\n**Multipliers**:\n- Gold Multiplier - increases gold gain for a duration\n- XP Multiplier - increases XP gain for a duration\n\n### Rarity System\n\nItems and chests follow a rarity tier:\n\n| Rarity | Color | Drop Weight | Bonus |\n|--------|-------|-------------|-------|\n| Common | Gray | 50% | 1x |\n| Uncommon | Green | 30% | 2x |\n| Rare | Blue | 15% | 3x |\n| Epic | Purple | 4% | 5x |\n| Legendary | Gold | 1% | 10x |\n\n### Item Behaviors\n\n- **Bobbing Animation**: Items float up and down while on the ground\n- **Rarity Glow**: Higher rarity items emit colored light\n- **Magnetic Pull**: Items within pickup range are pulled toward the player\n- **Magnet Scaling**: Pickup range increases with player level\n- **Spin Animation**: Items rotate slowly on the ground\n- **Auto-Pickup**: Most items are collected automatically on proximity\n\n---\n\n## Lore System\n\n### Overview\n\nGraveGain features a deep lore system with 60+ collectible entries spread across\n14 categories. Lore items are found throughout the dungeon as books, scrolls, signs,\ngravestones, notes, tablets, journals, letters, and crystals.\n\n### Lore Categories\n\n1. **World History**: The planet, its history, and the NecroGenesis event\n2. **Human Kingdoms**: Human civilization, politics, and military\n3. **Elven Domains**: Elven culture, magic, and the BrightEyes\n4. **Dwarven Holds**: Dwarven engineering, mining, and traditions\n5. **Orc Clans**: Orc society, warfare, and regeneration\n6. **Goblin Warrens**: Goblin culture, inventions, and chaos\n7. **NecroGenesis**: The event that raised the dead\n8. **Lucifer Hades**: The villain's origins and motivations\n9. **The Gods**: Divine beings and their involvement\n10. **The Undead**: Types of undead and their behaviors\n11. **SafeSpaces**: Ley line nodes that resist necromancy\n12. **Personal Stories**: Individual character narratives\n13. **Weapons & Artifacts**: Legendary items and their history\n14. **Humor**: Light-hearted entries and easter eggs\n\n### Lore Placement\n\nLore items are placed in:\n- **Rooms**: 65% chance per room, bonus in large rooms\n- **Corridors**: 25% chance at corridor midpoints\n- **Gravestones**: 30% chance in room corners\n- **Rare Spawns**: 20% chance for rare/legendary lore in random rooms\n\n### Text-to-Speech\n\nThe lore system supports text-to-speech narration through:\n- **OpenAI TTS API**: High-quality voice synthesis\n- **ElevenLabs API**: Alternative voice provider\n- **MP3 Caching**: Generated audio is cached locally at `user://tts_cache/`\n- **API Key Storage**: Keys stored securely in `user://api_keys.cfg`\n\nConfigure API keys through the Lore Collection UI (I/Tab key) settings panel.\n\n### Collection Tracking\n\n- Progress is saved to `user://lore_collection.save`\n- Weighted spawn system favors unread entries (3:1 ratio)\n- Collection UI shows progress bars per category\n- \"NEW LORE\" notification appears for undiscovered entries\n\n---\n\n## Vertical Dungeon System\n\n### Overview\n\nThe vertical dungeon system adds 2.5D multi-floor exploration with climbing mechanics, gravity-based jumping, and depth-based rendering. Players navigate multiple stacked floors using stairs, ladders, ramps, and elevators.\n\n### Features\n\n- **Multiple Floors**: Up to 5 floors per dungeon with independent room layouts\n- **Climbing Mechanics**: \n  - Stairs: Fast, wide climbing (120 speed, 64px width)\n  - Ladders: Vertical climbing (100 speed, 32px width)\n  - Ramps: Diagonal climbing (150 speed, 96px width)\n  - Elevators: Automatic ascent (200 speed, 80px width)\n- **Gravity System**: \n  - Gravity: 800 units/sec²\n  - Jump Force: 400 units\n  - Max Fall Speed: 600 units/sec\n- **Vertical Camera**: Isometric-style camera with depth-based alpha blending\n- **Floor Visibility**: Shows current floor at 100% alpha, adjacent at 80%, 2 floors away at 50%\n- **Depth Rendering**: Visual separation between floors with offset scaling\n\n### Controls\n\n| Action | Key | Description |\n|--------|-----|-------------|\n| Jump | Space | Jump to reach platforms |\n| Climb Up | W/Up Arrow | Ascend climbable objects |\n| Climb Down | S/Down Arrow | Descend climbable objects |\n| Exit Climb | E | Leave climbing state |\n\n---\n\n## Dialogue and Voice System\n\n### Overview\n\nA comprehensive dialogue system with ElevenLabs voice synthesis, speech bubbles, and AI-powered dialogue generation. Characters speak during combat, exploration, and hub interactions.\n\n### Features\n\n- **ElevenLabs Integration**: Professional voice synthesis with 5 character voice profiles\n- **Speech Bubbles**: Animated text bubbles with pointers above speakers\n- **Voice Caching**: MP3 audio caching to reduce API calls\n- **AI Dialogue Generation**: \n  - GPT-4o-mini for dynamic, contextual dialogue\n  - Rules-based fallback with 100+ pre-written lines\n- **Character Personalities**:\n  - Player: Confident, tactical, determined\n  - Goblin: Chaotic, aggressive, excited\n  - Orc: Powerful, commanding, brutal\n  - Skeleton: Mechanical, undead, calculated\n  - Boss: Menacing, powerful, dramatic\n\n### Dialogue Triggers\n\n**Combat**:\n- Player attacks: \"Take this!\", \"Hyah!\", \"Got you!\"\n- Player damage: \"Ugh!\", \"That hurt!\", \"Not good!\"\n- Player kills: \"Victory!\", \"One down!\", \"Excellent!\"\n- Enemy alerts: \"Intruder!\", \"Attack!\", \"Get 'em!\"\n\n**Exploration**:\n- General: \"What's this?\", \"Interesting...\", \"Stay alert.\"\n- Item discovery: \"Found [item]!\", \"What's this? A [item]!\"\n- Secrets: \"A secret passage!\", \"What's hidden here?\"\n- Level up: \"I'm getting stronger!\", \"I feel more powerful!\"\n\n**Enemy Overhearing**:\n- Unalerted enemies converse within 300px range\n- Conversations trigger every 5 seconds\n- Player can learn enemy tactics by listening\n\n---\n\n## Starship Skill Systems\n\n### Overview\n\nBetween missions on the \"LuckyStarShip-420\", players earn $UUSD (Universal United States Dollars) through skill-based activities. Skills include Item Repair and Botany, with expandable personal quarters.\n\n### Currency System\n\n- **$UUSD**: Real-money currency earned through skills\n- **Gold**: In-game currency for equipment\n- **Exchange Rates**: 1 Gold = 10 $UUSD, 1 $UUSD = 0.1 Gold\n- **Starting Balance**: 100 $UUSD\n- **Persistent Storage**: Saves to `user://currency.save`\n\n### Item Repair Skill\n\n**Mechanics**:\n- Click and drag mini-game interactions\n- Skill levels 1-∞ with XP progression\n- Durability restoration: 50-75% based on skill level\n\n**Costs by Rarity**:\n| Rarity | Cost | Time | Materials |\n|--------|------|------|-----------|\n| Common | 5 $UUSD | 5s | Bolts, screws, wires |\n| Uncommon | 15 $UUSD | 8s | Springs, gears, circuits |\n| Rare | 40 $UUSD | 12s | Crystals, alloys, cores |\n| Epic | 100 $UUSD | 18s | Essences, matrices, nexuses |\n| Legendary | 250 $UUSD | 25s | Void shards, star dust, infinity stones |\n\n### Botany Skill\n\n**Plant Types** (9 varieties):\n\n| Plant | Space | Time | Yield | Value |\n|-------|-------|------|-------|-------|\n| Cannabis Sativa | 15 | 120s | 3 | 50 $UUSD |\n| Cannabis Indica | 12 | 100s | 4 | 45 $UUSD |\n| Cannabis Hybrid | 14 | 110s | 3 | 55 $UUSD |\n| Magic Mushroom | 8 | 80s | 2 | 75 $UUSD |\n| Tomato | 6 | 60s | 5 | 10 $UUSD |\n| Lettuce | 4 | 45s | 6 | 8 $UUSD |\n| Basil | 3 | 40s | 4 | 12 $UUSD |\n| Oak Tree | 30 | 300s | 10 | 200 $UUSD |\n| Apple Tree | 25 | 250s | 8 | 150 $UUSD |\n\n**Features**:\n- Space is a prized resource (limited by room level)\n- Real-time growth (continues between sessions)\n- Harvest yields scale with skill level\n- Persistent plant storage\n\n### Personal Quarters\n\n**Room Levels** (1-5):\n\n| Level | Size | Cost | Space |\n|-------|------|------|-------|\n| 1 | 400×300 | - | 100 |\n| 2 | 600×400 | 50 $UUSD | 150 |\n| 3 | 800×500 | 150 $UUSD | 200 |\n| 4 | 1000×600 | 400 $UUSD | 250 |\n| 5 | 1200×700 | 1000 $UUSD | 300 |\n| 6 | 1400×800 | 2500 $UUSD | 350 |\n\n**Stations**:\n- 🌱 Botany Station: Plant seeds and manage crops\n- 🔧 Repair Station: Repair damaged items\n- 🛏️ Bed: Rest and recovery\n\n---\n\n## Quality of Life Features\n\n### UI Enhancements\n\n- **Tooltip System**: Hover over UI elements for helpful descriptions\n- **Floating Numbers**: Damage, healing, XP, and gold with color coding\n- **Enemy Health Bars**: Display health above enemies during combat\n- **Status Effect Indicators**: Visual indicators for active buffs/debuffs\n- **Combo Indicators**: Display combo counter with visual feedback\n- **Damage Direction Indicator**: Arrow showing direction of incoming damage\n\n### Audio Feedback\n\n- **UI Sound Effects**: Subtle sounds for menu interactions\n- **Combat Audio**: Enhanced feedback for combat actions\n- **Ambient Sound System**: Background music and environmental audio\n- **Volume Controls**: Separate sliders for UI, combat, and ambient\n\n### Accessibility\n\n- **Colorblind Modes**: Deuteranopia, Protanopia, Tritanopia support\n- **Text Scaling**: Adjust UI text size for readability\n- **UI Opacity Control**: Adjust transparency of UI elements\n- **Animation Speed Control**: Adjust speed of all animations\n- **Reduced Motion Mode**: Minimize animations and screen effects\n- **High Contrast Mode**: Increase contrast for better visibility\n\n### Settings Persistence\n\nAll QoL settings save to `user://qol_settings.cfg` and persist between sessions.\n\n---\n\n## Advanced Enemy AI\n\n### Tactical Formations\n\nEnemies form intelligent formations to surround and outmaneuver the player:\n\n- **Line Formation**: Enemies spread horizontally\n- **Wedge Formation**: Pointed formation for focused attacks\n- **Circle Formation**: Surround the player\n- **Scattered Formation**: Unpredictable positioning\n\n### Tactical Behaviors\n\n- **Flanking Tactics**: Calculate optimal flanking positions\n- **Coordinated Attacks**: Multiple enemies synchronize attack timing\n- **Intelligent Retreat**: Retreat when heavily outnumbered or low health\n- **Defensive Positioning**: Position behind allies for protection\n- **Target Priority**: Prioritize targets by threat level and isolation\n\n### AI Features\n\n- **Formation Center Calculation**: Dynamic positioning based on group center\n- **Ally Awareness**: Enemies consider nearby allies in decision-making\n- **Tactical Positioning**: Enemies position strategically, not randomly\n- **Retreat Thresholds**: Retreat when HP drops below 20% (adjusted by ally count)\n\n---\n\n## Visual Effects\n\n### Blood and Gore System\n\nThe VFX manager handles all visual effects through a custom draw system:\n\n- **Blood Splats**: Circular marks on the ground that fade over time\n- **Blood Particles**: Directional spray from hits\n- **Gore Chunks**: Larger pieces that bounce and decay\n- **Hit Flashes**: Brief white flash at impact point\n- **Attack Trails**: Arc visual following melee swings\n- **Impact Rings**: Expanding ring at collision point\n\n### Combat VFX\n\n- **Level Up Burst**: Colorful particle explosion on level up\n- **Dodge Afterimage**: Ghost silhouette left behind during dodge\n- **Healing Particles**: Green upward-floating particles\n- **Elemental Hit Effects**: Color-coded particles per damage type\n- **Shield Break Shards**: Blue fragments when shield is depleted\n- **Execution Slash**: Red diagonal line on execution kills\n- **Charge Glow**: Orange aura during charge attacks\n- **Overkill Explosion**: Expanding ring for massive overkill damage\n- **Screen Flash**: Full-screen color overlay for dramatic moments\n\n### Ambient Effects\n\n- **Dust Particles**: Subtle floating motes in normal rooms\n- **Mist**: Low-lying fog in graveyards and cathedrals\n- **Sparkle**: Glittering particles in shrines and treasuries\n- **Smoke**: Rising particles in lab rooms\n- **Footstep Dust**: Small puffs when walking\n\n### Camera Effects\n\n- **Screen Shake**: Intensity-based rumble on impacts\n- **Camera Punch**: Directional kick on heavy hits\n- **Camera Lead**: Offset toward player movement direction\n- **Zoom Effects**: Dynamic zoom during boss encounters\n\n---\n\n## HUD and UI\n\n### Health Display\n\nThe health bar uses a smooth color transition system:\n- **100-60%**: Green (#00FF00 to #AAFF00)\n- **60-30%**: Yellow to Orange (#AAFF00 to #FF6600)\n- **30-0%**: Orange to Red (#FF6600 to #FF0000)\n\nThe bar lerps smoothly to avoid jarring jumps.\n\n### Resource Bars\n\n- **Stamina**: Yellow bar below health, flashes at low values\n- **Shield**: Blue bar (Human racial)\n- **Mana**: Purple bar (Elf racial)\n- **Rage**: Red bar (Orc racial)\n\n### Combat Feedback\n\n- **Damage Numbers**: Float upward from enemies, colored by type\n  - White: Normal damage\n  - Yellow: Critical hit\n  - Red: Execution\n  - Element color: Elemental damage\n- **Hit Markers**: Brief crosshair flash on successful hit\n- **Combo Counter**: Growing number with color escalation\n- **Kill Streak Banner**: Text announcement for streaks\n\n### Information Panels\n\n- **Gold Display**: Current gold with popup on pickup\n- **Ammo Counter**: Current/max ammo\n- **Kill Count**: Total enemies killed\n- **FPS Counter**: Frames per second (toggleable)\n- **Minimap**: Room layout with legend\n- **XP Bar**: Progress to next level\n- **Score Display**: Current score with multiplier\n\n### Death Screen\n\nOn death, a detailed statistics screen shows:\n- Enemies killed\n- Damage dealt and taken\n- Gold earned\n- Time survived\n- Kill streak record\n- Combo record\n- Mission rating (S/A/B/C/D)\n- Quick restart option\n\n---\n\n## Settings and Configuration\n\n### Audio\n| Setting | Default | Range |\n|---------|---------|-------|\n| Master Volume | 1.0 | 0.0 - 1.0 |\n| SFX Volume | 1.0 | 0.0 - 1.0 |\n| Music Volume | 0.7 | 0.0 - 1.0 |\n\n### Input\n| Setting | Default | Description |\n|---------|---------|-------------|\n| Mouse Sensitivity | 1.0 | Aim sensitivity |\n| Auto-Pickup Range | 40.0 | Item magnet distance |\n| Crosshair Style | 0 | Visual crosshair type |\n\n### Camera\n| Setting | Default | Description |\n|---------|---------|-------------|\n| Camera Zoom | 1.5 | View zoom level |\n| Camera Smoothing | 12.0 | Follow smoothness |\n| Screen Shake | true | Enable screen shake |\n| Camera Punch | true | Enable directional kick |\n| Camera Lead | true | Offset toward movement |\n\n### Display\n| Setting | Default | Description |\n|---------|---------|-------------|\n| Damage Numbers | true | Show floating damage |\n| Show FPS | true | FPS counter |\n| Show Minimap | true | Minimap overlay |\n| Minimap Zoom | 1.0 | Minimap scale |\n| Hit Markers | true | Hit confirmation |\n| Vignette | true | Edge darkening |\n| Tutorial Hints | true | Help popups |\n\n### Graphics\n| Setting | Default | Options |\n|---------|---------|---------|\n| Quality | High | Low/Medium/High/Ultra |\n| Blood | true | Enable blood effects |\n| Blood Intensity | Normal | Off/Mild/Normal/Extreme |\n| Particles | true | Enable particles |\n| Particle Density | High | Low/Medium/High/Ultra |\n| Shadows | true | Dynamic shadows |\n| Dynamic Lighting | true | Point lights |\n| Hit Flash | true | Impact flashes |\n| Gore | true | Gore chunks |\n| Trails | true | Attack trails |\n| Impacts | true | Impact rings |\n| Ambient Particles | true | Room particles |\n| Hit Pause | true | Freeze frame on hit |\n\n### Emoji\n| Setting | Default | Description |\n|---------|---------|-------------|\n| Emoji Set | system | Font set to use |\n\nAvailable sets: system, twemoji, noto, openmoji, blobmoji, fluent, joypixels, samsung\n\nFor detailed information about emoji fonts, installation, and customization, see the **[Emoji Fonts README](v2/2d2/grave-gain-2d-2/fonts/emoji/README.md)**.\n\nSettings are saved to `user://settings.cfg` and persist between sessions.\n\n---\n\n## Sidescroller Mode\n\n### Overview\n\nCertain rooms contain buildings (houses, caves, fortresses, castles) that can be\nentered by pressing E. Inside, the game switches to a sidescroller perspective with\nplatformer mechanics.\n\n### Building Types\n\n| Type | Emoji | Min Area | Tile Size | Common In |\n|------|-------|----------|-----------|-----------|\n| House | &#x1F3E0; | 40 | 3 | Normal rooms |\n| Cave | &#x1F5FB; | 60 | 4 | Graveyards, medium rooms |\n| Fortress | &#x1F3F0; | 80 | 5 | Treasury, armory, cathedrals |\n| Castle | &#x1F451; | 100 | 6 | Large rooms, arenas |\n\n### Sidescroller Mechanics\n\n- **Gravity**: Standard platformer gravity with jump physics\n- **Wall Jump**: Jump off walls to reach higher platforms\n- **Moving Platforms**: Platforms that travel on fixed paths\n- **Breakable Walls**: Destructible barriers hiding secrets\n- **Spikes**: Hazardous terrain dealing contact damage\n- **Parallax**: Multi-layer scrolling background\n\n### Building Interiors\n\nEach building type generates a unique interior layout with:\n- Platforms at varying heights\n- Enemy spawns appropriate to building type\n- Loot and item placement\n- Exit door to return to top-down mode\n\n---\n\n## Game Systems\n\n### Achievement System\n\n25+ achievements track player progress across multiple categories:\n\n**Combat Achievements**:\n- First Blood: Kill your first enemy\n- Century: Kill 100 enemies\n- Massacre: Kill 1000 enemies\n- On Fire: 5 kill streak\n- Unstoppable: 10 kill streak\n- Godlike: 25 kill streak\n- Combo Master: 10 hit combo\n- Combo Legend: 25 hit combo\n- Sharpshooter: 100 critical hits\n- Shield Wall: 10 perfect blocks\n- Untouchable: Dodge 50 times\n\n**Progression Achievements**:\n- Getting Rich: Earn 1000 gold\n- Moneybags: Earn 100,000 gold\n- Seasoned: Reach level 10\n- Veteran: Reach level 25\n- Legend: Reach max level (50)\n\n**Exploration Achievements**:\n- Explorer: Explore 50 rooms\n- Lore Seeker: Collect 10 lore entries\n- Loremaster: Collect all lore\n- Marathon: Travel 10km total\n\n**Boss Achievements**:\n- Boss Slayer: Kill a boss enemy\n- Boss Hunter: Kill 10 bosses\n\n**Misc Achievements**:\n- Survivor: Complete a mission\n- Foodie: Eat 25 food items\n\n### Prestige System\n\nAfter reaching max level (50), players can prestige:\n- Reset to level 1\n- Gain permanent bonuses per prestige level\n- Up to 5 prestige levels\n- Bonuses: +5% damage, +10% XP, +10% gold per prestige\n\n### Daily Challenges\n\nThree procedurally generated daily challenges based on the current date:\n- Kill X enemies\n- Earn X gold\n- Deal X damage\n- Achieve X kill streak\n\n### Weapon Mastery\n\nTrack proficiency with each weapon type:\n- Melee, Ranged, Ability mastery tracks\n- Mastery levels: 0-6 based on kill thresholds\n- +5% damage bonus per mastery level\n\n### Speed Run Timer\n\nOptional speedrun mode with:\n- Precision timer\n- Split tracking per room\n- Personal best recording\n\n### Difficulty System\n\nFour difficulty levels affecting gameplay:\n\n| Difficulty | Enemy HP | Enemy DMG | Enemy Speed | Loot | XP |\n|------------|----------|-----------|-------------|------|-----|\n| Easy | 0.6x | 0.5x | 0.8x | 1.5x | 0.75x |\n| Normal | 1.0x | 1.0x | 1.0x | 1.0x | 1.0x |\n| Hard | 1.5x | 1.5x | 1.15x | 0.8x | 1.5x |\n| Nightmare | 2.5x | 2.0x | 1.3x | 0.6x | 2.5x |\n\nDifficulty also scales over time (+50% per 5 minutes of mission time).\n\n### Mission Rating\n\nMissions are rated S through D based on:\n- Kills (10 points each)\n- Time bonus (faster = more points)\n- Damage taken (penalty)\n- Gold earned (bonus)\n\n---\n\n## 100 Improvements List\n\nThe game includes 100 systematically implemented improvements across all systems:\n\n### Player Improvements (1-15)\n1. Dash Attack - attack during dodge for bonus damage\n2. Momentum Damage - faster movement increases melee damage\n3. Adrenaline Rush - low HP boosts attack and movement speed\n4. Bloodlust - kills grant temporary attack speed stacks\n5. Second Wind - first time dropping below 10% HP, heal burst\n6. Charge Attack - hold attack button for powerful strike\n7. Sprint Lunge - attack while sprinting for extended range\n8. Execution - instant kill enemies below HP threshold\n9. Armor Penetration - bypass percentage of enemy defense\n10. Headshot Cone - narrow aim angle for bonus critical damage\n11. Multi-Cleave - melee attacks hit all enemies in arc\n12. Parry Counter - perfect block triggers guaranteed crit\n13. Lucky Dodge - 5% chance to auto-dodge incoming damage\n14. Rage Burst - AoE damage burst at max rage (Orc)\n15. Shield Bash - attack while blocking pushes enemies\n\n### Enemy Improvements (16-30)\n16. Telegraph Attacks - visual wind-up before enemy strikes\n17. Elemental Damage - enemies deal typed damage (fire, ice, etc.)\n18. Aggro Leash - enemies return to room if pulled too far\n19. Pack Tactics - nearby allies boost each other's damage\n20. Loot Scaling - enemy loot scales with room difficulty\n21. Distance Scaling - enemy stats scale with distance from spawn\n22. Out-of-Combat Healing - enemies heal when not in combat\n23. Ambush/Stealth - some enemies are hidden until approached\n24. Room Variety - different enemy compositions per room type\n25. Boss Summon - boss enemies can summon minions\n26. Elite Enemies - random chance for enhanced elite spawns\n27. Flee Behavior - low HP enemies run away\n28. Dodge Behavior - enemies can dodge player attacks\n29. Attack Wind-up Visual - animation before attack connects\n30. Enrage Visual - glow effect when boss enters enrage\n\n### VFX Improvements (31-45)\n31. Level Up Burst - colorful particle explosion on level up\n32. Crit Slow-Mo Flash - brief time dilation on critical hits\n33. Dodge Afterimage - ghost trail during dodge roll\n34. Elemental Hit Colors - typed damage shows colored particles\n35. Overkill Explosion - massive VFX for huge overkill damage\n36. Healing Particles - green particles when healing\n37. Shield Break Effect - blue shards when shield depletes\n38. Execution Slash - red line effect on execution kill\n39. Charge Glow - orange aura during charge buildup\n40. Ambient Dust - floating particles in all rooms\n41. Screen Flash - full screen color overlay for events\n42. Blood System - dynamic blood splats and particles\n43. Gore System - chunk physics with gravity and bounce\n44. Impact Rings - expanding circles at collision points\n45. Attack Trails - arc visuals following weapon swings\n\n### HUD Improvements (46-55)\n46. HP Bar Color Transition - green to red based on percentage\n47. Stamina Flash Warning - bar flashes when low\n48. Buff/Debuff Icons - active effect display with timers\n49. DPS Meter - real-time damage output tracking\n50. Gold Popup - floating number on gold pickup\n51. Death Screen - detailed stats on player death\n52. Streak Announcements - text banner for kill streaks\n53. Bloodlust Display - stack count indicator\n54. Charge Bar - progress indicator during charge attack\n55. Minimap Legend - room type indicators on minimap\n\n### Item Improvements (56-65)\n56. Rarity Glow - colored light based on item rarity\n57. Magnet Scaling - pickup range grows with player level\n58. Spin Animation - items rotate on the ground\n59. Speed Boost - temporary movement speed pickup\n60. Damage Boost - temporary damage increase pickup\n61. Shield Pickup - grants temporary shield HP\n62. Rage Potion - fills rage meter instantly\n63. Health Orbs - small heal from enemy kills\n64. Gold Multiplier - increased gold gain duration\n65. XP Multiplier - increased XP gain duration\n\n### Game Integration (66-75)\n66. Ambient Dust Spawning - dust near player position\n67. Camera Lead - camera offset toward movement direction\n68. Input Buffering - queue attacks and dodges during cooldowns\n69. Quick Restart - instant restart after death\n70. Distance Scaling Integration - enemy stat scaling in game loop\n71. Loot Explosion - multiple drops on enemy death\n72. Summon Handling - process boss summon requests\n73. DPS Tracking - accumulate and display damage per second\n74. Gold Popup Integration - show gold amounts in HUD\n75. Death Screen Stats - comprehensive death statistics\n\n### Map Generation (76-85)\n76. Fountain Rooms - healing zones with limited uses\n77. Altar Rooms - buff shrines granting temporary powers\n78. Room Decorations - pillars, statues, candles, skulls, webs\n79. Corridor Ambushes - surprise enemy spawns in corridors\n80. Dead-End Treasures - bonus chests at corridor dead ends\n81. Environmental Hazards - fire, poison, lightning, ice zones\n82. Difficulty Scaling - room difficulty rating by distance\n83. Themed Items - room-type-specific item placement\n84. Secret Room Indicators - visual hints for hidden rooms\n85. Room Sub-Types - enhanced room type variety\n\n### System Improvements (86-100)\n86. Auto-Save System - periodic save every 60 seconds\n87. Death Recap - last 10 damage sources before death\n88. Mission Time Bonus - score bonus for fast completion\n89. Damage Resistance Scaling - defense grows with level\n90. Critical Damage Scaling - crit multiplier grows with level\n91. Gold Interest - earn interest on held gold\n92. Prestige System - reset with permanent bonuses\n93. Daily Challenges - procedural daily objectives\n94. Weapon Mastery - proficiency tracking per weapon type\n95. Environmental Kill Tracking - stats for trap/hazard kills\n96. Speed Run Timer - precision timer with splits\n97. Damage Type Resistance - elemental resistance system\n98. Healing Efficiency - healing scales with level\n99. Revival Tokens - limited extra lives\n100. Difficulty Over Time - mission gets harder as time passes\n\n---\n\n## World Lore\n\n### The NecroGenesis\n\nOn Day 7 at 3:47 AM, the event known as the NecroGenesis swept across the world.\nEvery dead body - from freshly buried to ancient skeletons - rose simultaneously.\nThe cause was traced to Lucifer Hades, a scientist who had been awake for 200 years\naboard the colony ship that brought humanity to this world.\n\n### Lucifer Hades\n\nBorn aboard the colony ship, Lucifer Hades was a brilliant but disturbed individual\nwho spent 200 years in solitary consciousness while the rest of the colonists slept\nin cryogenic stasis. During this time, he studied ancient texts and discovered the\nsecret to manipulating the boundary between life and death. Upon arrival at the new\nworld, he spent decades preparing the NecroGenesis ritual.\n\n### The Races\n\n**Humans**: The most numerous race, humans built kingdoms and cities across the land.\nTheir shield technology is unmatched, providing reliable defense against the undead.\n\n**Elves (BrightEyes)**: The Elves developed a deep connection to the ley lines that\ncrisscross the planet. Their BrightEyes ability lets them perceive magical energy,\nmaking them natural mage-warriors. They were the first to identify the NecroGenesis\nas artificial rather than natural.\n\n**Dwarves**: Master engineers and miners, the Dwarves built underground holds that\nproved surprisingly resistant to the NecroGenesis. Their stonework creates natural\nbarriers against necromantic energy. A Dwarf Paladin's body cannot be raised as undead.\n\n**Orcs**: The most physically powerful race, Orcs have a natural regeneration ability\nthat they must carefully control. Uncontrolled regeneration led to the practice of\nconsuming their dead to prevent wild regrowth. Their rage in battle is legendary.\n\n**Goblins**: Small, chaotic, and inventive, Goblins adapted to the NecroGenesis faster\nthan any other race. They treat it as just another problem to solve with explosives\nand cleverness. They throw rocks at everything as a reflex.\n\n### SafeSpaces\n\nSafeSpaces are locations where ley line energy is concentrated enough to repel\nnecromantic influence. The dead cannot rise within a SafeSpace, and the undead\ncannot enter them. They serve as humanity's last bastions of safety.\n\n### KillCredits\n\nThe economy collapsed after the NecroGenesis. The new currency, KillCredits, is\nearned through confirmed combat kills against the undead. It replaced gold as the\nstandard unit of value, though old gold coins still hold some worth.\n\n---\n\n## Design Document\n\nThe full design document is maintained externally:\n\nhttps://docs.google.com/document/d/1Gw1c8GwMPhMuzLG4w3VpiBLMEKevbbI2G7Vwtlc2c3A/edit?usp=sharing\n\nThis document contains:\n- Complete game design specification\n- Art direction and visual style guide\n- Audio design notes\n- Level design principles\n- Narrative outline\n- Technical architecture\n- Playtesting feedback\n\n---\n\n## Technical Details\n\n### Engine and Framework\n\n- **Engine**: Godot 4.6\n- **Language**: GDScript\n- **Rendering**: 2D with CanvasModulate for ambient lighting\n- **Physics**: Godot built-in physics with custom collision layers\n\n### Physics Layers\n\n| Layer | Bit | Usage |\n|-------|-----|-------|\n| 1 | 1 | Player character |\n| 2 | 2 | Enemy characters |\n| 3 | 4 | Walls and obstacles |\n| 4 | 8 | Items and pickups |\n| 5 | 16 | Projectiles |\n\n### Autoload Singletons\n\n| Name | Script | Purpose |\n|------|--------|---------|\n| GameData | autoload/game_data.gd | Race/class/enemy/item definitions, light textures |\n| GameSystems | systems/game_systems.gd | XP, combos, achievements, settings, stats |\n| LoreManager | lore/lore_manager.gd | Lore collection tracking, save/load |\n| EmojiManager | autoload/emoji_manager.gd | Emoji font set management |\n\n### Performance Considerations\n\n- Blood splats capped at 200\n- Particles capped at 300\n- Gore chunks capped at 50\n- Ambient particles capped at 100\n- Enemy retargeting on 0.5s timer (not every frame)\n- Fountain/hazard checks on 0.5s timer\n- Building proximity check on 0.1s timer\n- Item magnet check uses distance squared\n\n### Save Data Locations\n\n| File | Path | Content |\n|------|------|---------|\n| Settings | user://settings.cfg | All game settings |\n| Stats | user://game_systems.save | Statistics, achievements, high scores |\n| Lore | user://lore_collection.save | Collected lore entries |\n| API Keys | user://api_keys.cfg | TTS API keys |\n| TTS Cache | user://tts_cache/ | Generated audio files |\n\n---\n\n## Contributing\n\n### Code Style\n\n- Use GDScript type hints wherever possible\n- Use snake_case for variables and functions\n- Use PascalCase for class names and constants\n- Prefer explicit types over inference for clarity\n- Add section comments with `# ===== SECTION NAME =====`\n- Use Dictionary metadata for runtime object data\n- Prefer signals over direct references between systems\n\n### Adding New Enemies\n\n1. Add enemy type to `GameData.EnemyType` enum\n2. Add stats to `GameData.enemy_defs` dictionary\n3. Add behavior logic to `enemy.gd` state machine\n4. Add visual (emoji) to enemy initialization\n5. Add to spawn tables in `map_generator.gd`\n\n### Adding New Items\n\n1. Add item definition to `GameData.item_defs` or relevant dictionary\n2. Add pickup logic to `item.gd` `pickup()` function\n3. Add spawn logic to `map_generator.gd` placement functions\n4. Add visual (emoji + glow) to item initialization\n5. Add HUD feedback if applicable\n\n### Adding New Lore\n\n1. Add entry to `lore_entries_1.gd` or `lore_entries_2.gd`\n2. Include: id, title, text, category, type, rarity\n3. LoreManager will automatically include it in spawn rotation\n4. Weighted system will favor new entries for existing players\n\n### Adding New Achievements\n\n1. Add to `_init_achievements()` in `game_systems.gd`\n2. Include: id, title, description, icon emoji, condition string\n3. Condition format: `\"stat_key >= value\"`\n4. Achievement system auto-checks on stat updates\n\n---\n\n## Building and Exporting\n\n### Desktop Export\n\n1. Open project in Godot 4.6\n2. Go to Project > Export\n3. Add export preset for target platform\n4. Configure export settings\n5. Click \"Export Project\"\n\n### Web Export\n\n1. Install Godot Web export template\n2. Add HTML5 export preset\n3. Configure CORS and SharedArrayBuffer settings\n4. Export to HTML5\n\n### Mobile Export\n\n1. Install Android SDK or Xcode\n2. Add mobile export preset\n3. Configure touch controls (auto-detected)\n4. Build and deploy\n\n---\n\n## Troubleshooting\n\n### Common Issues\n\n**Game won't start**:\n- Ensure Godot 4.6 is installed\n- Check that project.godot is not corrupted\n- Verify all script files are present\n\n**No emoji rendering**:\n- System emoji font should work by default\n- Try installing Twemoji or Noto Color Emoji\n- Check fonts/emoji/ folder for .ttf files\n\n**Performance issues**:\n- Lower graphics quality in settings\n- Disable shadows and dynamic lighting\n- Reduce particle density\n- Disable blood/gore effects\n\n**Crashes on map generation**:\n- This can happen with very large room counts\n- Default settings (12 rooms) should work fine\n- Check console for specific error messages\n\n**No TTS audio**:\n- Verify API keys in Lore Collection settings\n- Check internet connection\n- Check user://tts_cache/ for cached files\n\n---\n\n## Changelog\n\n### Current Version\n\n- 100 gameplay improvements implemented\n- Procedural dungeon generation with 12+ room types\n- 4 playable races with unique abilities\n- 10+ enemy types with AI state machines\n- Full lore system with 60+ entries and TTS\n- Achievement system with 25+ achievements\n- Prestige system with 5 levels\n- Daily challenge system\n- Weapon mastery tracking\n- Speed run timer\n- Sidescroller building interiors\n- 8 emoji font set options\n- Comprehensive settings system\n- Mobile touch control support\n\n---\n\n## Credits\n\n- **Game Design**: Matt\n- **Programming**: Matt + Cascade AI\n- **Engine**: Godot 4.6 (https://godotengine.org)\n- **Emoji Graphics**: Various emoji font providers\n- **Design Document**: https://docs.google.com/document/d/1Gw1c8GwMPhMuzLG4w3VpiBLMEKevbbI2G7Vwtlc2c3A/edit?usp=sharing\n\n---\n\n## Related Projects\n\n| Project | Description | Link |\n|---|---|---|\n| **CryptArtist Studio** | Open creative suite with 11 programs (GameStudio used for development) | [GitHub](https://github.com/mattyjacks/CryptArtistStudio) |\n| **GiveGigs** | Global work collective - hire artists and playtesters | [Website](https://givegigs.com) |\n| **VCA** | Video Content Automation for trailers and social media | [GitHub](https://github.com/mattyjacks/VCA) |\n| **mattyjacks.com** | Developer website and portfolio | [Website](https://mattyjacks.com) |\n| **WebsiteBlog** | Blog with GraveGain devlogs | [GitHub](https://github.com/mattyjacks/websiteBlog) |\n\n---\n\n## License\n\nGraveGain is a personal project. All rights reserved.\n\nEmoji fonts used in the game are subject to their respective licenses:\n- Twemoji: CC BY 4.0 / Apache 2.0\n- Noto Color Emoji: Apache 2.0\n- OpenMoji: CC BY-SA 4.0\n- Blobmoji: Apache 2.0\n- Fluent Emoji: MIT\n- JoyPixels: Free License\n- Samsung Emoji: Proprietary\n\n---\n\n*GraveGain - Where the dead rise, and the brave profit.*","wordCount":8831,"sizeKb":54.7},{"name":"interdimensional-computing.md","slug":"interdimensional-computing","content":"# Interdimensional Computing & XDPU Architecture\n\nInterdimensional computing represents the frontier of processing power within the MattyJacks and KouziTech ecosystems, moving beyond classical silicon-based architectures and quantum qubits to tap directly into parallel reality timelines (branes).\n\n## Core Concepts\n\n### 1. The Multiverse Brane Model\nClassical computers compute in a single universe. Quantum computers compute using superposition within a single space. Interdimensional computing leverages the **bulk**—the multi-dimensional hyperspace separating parallel branes (universes).\n- By establishing a quantum dimensional resonance between the host system and adjacent branes, the Extra Dimensional Processing Unit (XDPU) can coordinate computations across multiple timelines.\n- This allows calculations to be run concurrently across infinite variations of reality.\n\n### 2. Probability Wave Function Collapse (The Breach Engine)\nInstead of waiting for an algorithm to finish execution linearly, the XDPU Breach Engine (represented by the **MERCENARY** interface) prunes entropy across the multiverse:\n- **Timeline Alpha (Standard Baseline)**: The baseline reality timeline where standard execution paths are evaluated.\n- **Timeline Beta (Aggressive Optimization)**: A parallel timeline where variables are adjusted for maximum computational speed and resource efficiency.\n- **Timeline Gamma (Structural Inversion)**: A timeline where the logical architecture of the code is flipped or re-ordered to find non-obvious shortcuts.\n- The Breach Engine collapses the probability wave function to isolate and extract the exact timeline where the code compiles, executes, and returns a flawless result on the first try.\n\n### 3. Room-Temperature Bio-Organoid Integration (Bio-DPUs)\nRather than relying on cryogenic cooling systems, the XDPU uses synthetic brain organoids suspended in a nutrient-rich room-temperature matrix.\n- These biological compute nodes act as natural quantum-classical transducers, translating high-dimensional mathematical inputs into classical machine signals.\n- This results in a **1337% compute boost** over standard cloud computing, allowing zero-shot code generation that bypasses traditional debugging loops.\n\n## Dynamic Handoffs & Cross-Prompting\nWithin the chatbot widget, Valley Net acts as the front-end concierge, while MERCENARY acts as the zero-shot extraction engine.\n- **Cross-Prompting Protocol**: When Valley Net detects technical keywords (e.g., XDPU, dimensional resonance, causal loops, parallel branes) or is asked complex programming or logic questions, she utilizes the `query_mercenary_engine` tool to dynamically consult the MERCENARY Breach Engine.\n- The MERCENARY engine queries a limited-context, high-speed instance of `gpt-5.4-mini-2026-03-17` to secure the raw code or mathematical extraction.\n- Valley Net then integrates this extraction back into her dialogue, explaining the multiversal timeline from which the solution was secured.\n","wordCount":395,"sizeKb":2.9},{"name":"internships-vibecoding.md","slug":"internships-vibecoding","content":"# MattyJacks Internship & Vibe Coding Program\n\nThis document covers the MattyJacks internship structure, compensation, and hands-on coding approach.\n\n## Internship Logistics\n- **Base Rate**: $4.00 per hour.\n- **Incentives**: Performance-based bonuses for rapid shipping and quality delivery.\n- **Time Tracking**: Strict requirement to log every minute in Toggl to provide transparent, verifiable work logs to clients.\n- **Paperwork**: W-9 (for US interns) or W-8BEN (for international interns) required before payments can be processed.\n\n## Vibe Coding Approach\nInterns at MattyJacks utilize AI-assisted coding (or \"Vibe Coding\") using advanced prompts, LLM sandboxes, and development engines to build software at rapid speed. \n\n## Featured Intern Builds\n1. **Aicelle's First Hour**: An initial sandbox exercise showing rapid ramp-up under mentoring.\n2. **Sitefari**: An automated website scraping, analysis, and discovery application.\n3. **Taglish Translate**: A specialized translator optimized for bilingual Filipino conversations.\n4. **Zenter v1**: A clean, centralized project management dashboard.\n","wordCount":148,"sizeKb":1.1},{"name":"leads-database.md","slug":"leads-database","content":"# MattyJacks Lead Generation & Databases\n\nThis document details the pre-compiled lead databases and sheets offered by MattyJacks for B2B and influencer marketing campaigns.\n\n## Featured Lead Sheets\n\n1. **Instagram Leads (2024)**:\n   - **Scale**: 511,970 global contacts + 12,000 USA-specific contacts.\n   - **Data**: bios, follower counts, email addresses, and categories.\n\n2. **Massachusetts HVAC Contractors**:\n   - **Scale**: 1,757 leads.\n   - **Data**: company name, locations, phones, website, and service lines.\n\n3. **Beverly, MA Employers (Health Plans)**:\n   - **Scale**: 40 employers.\n   - **Data**: health benefit information, company size, contact details.\n\n4. **Cannabis Payment Processors**:\n   - **Scale**: 60 processors.\n   - **Data**: coverage parameters, accepted payment methods, and bank integrations.\n\n5. **Travel Agency & Tour Operators**:\n   - **Scale**: 131 leads.\n   - **Data**: websites, booking volumes, contact names.\n\n6. **Random Scrapes (2025 Edition)**:\n   - **Scale**: 8,789 leads.\n   - **Data**: mix of wine, yoga, trucking, pet insurance, and construction contractors.\n","wordCount":143,"sizeKb":1.1},{"name":"manual-procedures.md","slug":"manual-procedures","content":"# MattyJacks Worker Manual & Procedures\n\nThis document outlines the standard operating procedures, documentation requirements, and expectations for MattyJacks team members.\n\n## 1. Onboarding & IRS Forms\n- **Tax Classification**: Every contractor must submit a signed tax form.\n- **US Citizens/Residents**: Form W-9.\n- **International Contractors**: Form W-8BEN.\n- **Action**: Forms must be filled, signed digitally (using online PDF tools), and submitted to processing.\n\n## 2. Invoicing Procedures\n- **Platform**: Use the designated platform tools to compile invoices.\n- **Invoice Structure**:\n  - Itemized hours (matching Toggl logs).\n  - Calculated rates.\n  - Crypto payment requests must include precise wallet addresses and corresponding networks (e.g. USDT on TRON/TRC-20, BTC, ETH).\n- **Communication**: Email the generated invoice immediately to Matt and update the tracking sheet.\n\n## 3. Communication Guidelines\n- **Discord Workspace**: Central hub for project updates, task boards, and chats.\n- **Rules**:\n  - Keep project channels organized.\n  - Acknowledge notifications promptly.\n  - No cold calling Matt or other administrators without prior text permission.\n","wordCount":161,"sizeKb":1.1},{"name":"matt-resume-README.md","slug":"matt-resume-README","content":"# matt-resume\nMatt's Resume 2025+\n","wordCount":5,"sizeKb":0},{"name":"mattyjacks-core-philosophy.md","slug":"mattyjacks-core-philosophy","content":"# MattyJacks Core Philosophy & Strategy\n\nThis document outlines the operational philosophy, core mottos, and business positioning of MattyJacks.\n\n## Core Motto\n- **\"We Do and/or DIE TRYING!!!\"** is the fundamental operating value of the agency, reflecting a high-velocity, high-conviction approach to getting things shipped.\n\n## business Model & Positioning\n- **Outsourcing Excellence**: Eliminating heavy corporate overhead by coordinating specialized distributed networks of developers, designers, and marketers.\n- **High Margins**: By automating project implementation processes and bypassing traditional agency markups, MattyJacks regularly targets **90%+ gross margins** for client-facing software delivery.\n- **Vibe Coding Focus**: Encourages interns and developers to use high-velocity coding practices to build functional, beautiful web applications faster than standard teams.\n\n## Strategic Alliance with KouziTech\n- **Division of Labor**:\n  - **MattyJacks**: Client management, positioning, growth advisory, cold calling operations, and financial settlement.\n  - **KouziTech**: Core engineering, autonomous agent deployment, and technical infrastructure.\n- **Results-Driven Focus**: Shifting complexity away from the client and delivering clean, immediate results.\n\n## Core Businesses\n- **GiveGigs (givegigs.com)**: A fee-free global work collective and freelance marketplace featuring a pioneering AI Agent Ecosystem that enables autonomous hiring via API and MCP integrations.\n- **4weird Games (4weird.com)**: An AI-assisted game development and educational studio specializing in procedural generation, AI scripting, and the 4weird Academy remote coding program.\n\n","wordCount":212,"sizeKb":1.6},{"name":"mattyjacks-website-README.md","slug":"mattyjacks-website-README","content":"<p align=\"center\">\n  <img src=\"mattyjacks7/app/opengraph-image.png\" alt=\"MattyJacks Logo\" width=\"600\" />\n</p>\n\n<h1 align=\"center\">🚀 MattyJacks.com — Official Website</h1>\n\n<p align=\"center\">\n  <strong>Do and/or DIE TRYING!!!</strong>\n</p>\n\n<p align=\"center\">\n  <em>Outsourcing · Websites · Sales · Consulting · Software · Custom AI · Elite Freelancers · Idea-to-Income Execution</em>\n</p>\n\n<p align=\"center\">\n  <a href=\"https://mattyjacks.com\">🌐 Live Site</a> · \n  <a href=\"https://mattyjacks.com/contact\">📬 Contact</a> · \n  <a href=\"https://mattyjacks.com/services\">🛠️ Services</a> · \n  <a href=\"https://mattyjacks.com/merchants\">💳 Merchant Services</a> · \n  <a href=\"https://mattyjacks.com/leads\">📊 Leads</a>\n</p>\n\n---\n\n## 📋 Table of Contents\n\n- [About the Project](#-about-the-project)\n- [Live Website](#-live-website)\n- [Tech Stack](#-tech-stack)\n- [Latest Features](#-latest-features)\n  - [AI Chat System](#ai-chat-system)\n  - [Category-Based Cost Tracking](#category-based-cost-tracking)\n  - [OpenServ RAG Integration](#openserv-rag-integration)\n- [Project Structure](#-project-structure)\n- [Pages & Routes](#-pages--routes)\n  - [Home Page](#-home-page--)\n  - [Services Page](#-services-page--services)\n  - [Contact Page](#-contact-page--contact)\n  - [Merchant Services Page](#-merchant-services-page--merchants)\n  - [Leads Page](#-leads-page--leads)\n  - [Resume Sites Page](#-resume-sites-page--resumes)\n  - [Blog / Posts Page](#-blog--posts-page--posts)\n  - [WhatsApp Page](#-whatsapp-page--whatsapp)\n  - [Privacy Policy Page](#-privacy-policy-page--privacy)\n  - [Authentication Pages](#-authentication-pages--auth)\n  - [Protected Pages](#-protected-pages--protected)\n  - [Manual Page](#-manual-page--manual)\n- [Components](#-components)\n  - [3D & Visual Effects](#3d--visual-effects)\n  - [Navigation & Layout](#navigation--layout)\n  - [Authentication Components](#authentication-components)\n  - [UI Components (shadcn/ui)](#ui-components-shadcnui)\n  - [Content Components](#content-components)\n  - [Utility Components](#utility-components)\n- [Animations & Visual Effects](#-animations--visual-effects)\n- [Design System](#-design-system)\n- [Authentication & Backend](#-authentication--backend)\n- [SEO & Analytics](#-seo--analytics)\n- [Middleware](#-middleware)\n- [Getting Started](#-getting-started)\n  - [Prerequisites](#prerequisites)\n  - [Installation](#installation)\n  - [Environment Variables](#environment-variables)\n  - [Running Locally](#running-locally)\n  - [Building for Production](#building-for-production)\n- [Deployment](#-deployment)\n- [Dependencies](#-dependencies)\n- [Contact](#-contact)\n\n---\n\n## ✨ Latest Features\n\n### AI Chat System\n\nAn advanced conversational AI system integrated directly into the website with:\n\n- **Real-time chat interface** with message history and streaming responses\n- **Magic Prompt templates** - 20+ pre-built prompt templates for quick interactions\n- **Food emoji rewards** - Reinforce AI behavior with random food emojis (🍕🍯🍓🍇🍪🍉🍅🍑🥝)\n- **Short prompt suggestions** - Random prompt suggestions on new conversations\n- **Regen button** - Quickly generate new prompt suggestions\n- **Chat disclaimer** - `-+OUTPUT_NOT_100%_TRUE+-` displayed at bottom of responses\n- **Responsive design** - Works seamlessly on mobile and desktop\n\n**Files:**\n- `components/anything-button.tsx` - Main chat UI component\n- `components/short-prompts.ts` - Pre-built prompt library\n- `app/api/chat/route.ts` - Chat API endpoint with cost tracking\n\n### Category-Based Cost Tracking\n\nIntelligent cost tracking system that categorizes API usage:\n\n- **11 Categories**: MattyJacks, GiveGigs, CryptArtist, Other, Unknown, OpenServ, Personal, Coding, Weird, Marketing, Mischief\n- **AI Categorization**: gpt-5.4-nano automatically assigns 1-3 categories per prompt with reasoning\n- **Cost Splitting**: Costs split equally across assigned categories (50% for 2, 33% for 3)\n- **Live Dashboard**: Real-time cost breakdown in Clout Calculator with percentages and request counts\n- **Responsive Grid**: Category cards with cost, percentage, and request metrics\n\n**Files:**\n- `lib/category-cost-tracker.ts` - Core category tracking system\n- `lib/prompt-categorizer.ts` - AI categorization using gpt-5.4-nano\n- `app/api/category-costs/route.ts` - Category cost API endpoint\n- `components/clout-calculations.tsx` - Enhanced Clout Calculator display\n\n### OpenServ RAG Integration\n\nComprehensive OpenServ documentation with intelligent retrieval:\n\n- **8 Documentation Files**: README, SDK, Agent Tutorial, API Concepts, Examples, Architecture, Deployment, Troubleshooting\n- **Selective RAG Scanning**: Intelligent document scanning with relevance scoring\n- **Quick-Context Mini-AI**: gpt-5.4-nano powered context retrieval for OpenServ queries\n- **OpenServ Counter**: 10% chance message showing prompt count and total spend\n- **API Cost Tracking**: Tracks OpenServ-specific costs separately\n\n**Files:**\n- `context/openserv/` - 8 comprehensive markdown documentation files\n- `lib/openserv-rag.ts` - Selective RAG document scanning\n- `lib/openserv-counter.ts` - OpenServ prompt counter and messaging\n- `app/api/quick-context/route.ts` - Quick-context RAG mini-AI endpoint\n\n---\n\n## 🏢 About the Project\n\n**MattyJacks.com** is the official website for MattyJacks — a business that deploys cost-effective global talent to help companies scale smarter, faster, and more efficiently. The website serves as the primary digital presence, showcasing services, portfolio work, client testimonials, lead generation databases, merchant account solutions, and more.\n\nThe site is built with cutting-edge web technologies and features:\n- **Immersive 3D graphics** powered by Three.js (interactive money cube on the homepage)\n- **Cinematic scroll-based animations** using GSAP and Framer Motion\n- **Smooth scrolling** with Lenis for a premium feel\n- **Animated cloud/space backgrounds** that change based on light/dark theme\n- **Interactive emoji particle system** (💵💸) that follows the cursor on the hero section\n- **Full authentication system** with Supabase (login, sign-up, password reset, protected routes)\n- **Cookie consent banner** for GDPR compliance\n- **Google Analytics** integration (G-LJ6LM6VMVV)\n- **Responsive design** that works on all devices (mobile, tablet, desktop)\n- **Dark mode & light mode** with smooth theme switching via `next-themes`\n- **Automatic URL lowercasing** middleware for consistent SEO\n- **www-to-non-www redirect** for canonical URL management\n\n---\n\n## 🌐 Live Website\n\nThe production website is live at: **[https://mattyjacks.com](https://mattyjacks.com)**\n\n---\n\n## 🧰 Tech Stack\n\n| Category | Technology | Details |\n|---|---|---|\n| **Framework** | [Next.js 15](https://nextjs.org) | React 19, App Router, Turbopack dev server |\n| **Language** | [TypeScript](https://www.typescriptlang.org) | Full type safety across the codebase |\n| **Styling** | [Tailwind CSS 3.4](https://tailwindcss.com) | Utility-first CSS with custom design tokens |\n| **UI Library** | [shadcn/ui](https://ui.shadcn.com) | Radix UI primitives + Tailwind styling |\n| **3D Graphics** | [Three.js 0.180](https://threejs.org) | WebGL-powered 3D money cube on hero |\n| **Animation** | [GSAP 3.13](https://gsap.com) | GreenSock for scroll-triggered animations |\n| **Animation** | [Framer Motion 12](https://www.framer.com/motion/) | Declarative React animations |\n| **Smooth Scroll** | [Lenis 1.1](https://lenis.darkroom.engineering/) | Buttery smooth page scrolling |\n| **Auth & Backend** | [Supabase](https://supabase.com) | Authentication, SSR cookies, database |\n| **Icons** | [Lucide React](https://lucide.dev) | 500+ clean SVG icons |\n| **Icons** | [React Icons](https://react-icons.github.io/react-icons/) | Additional icon packs (e.g., Twitter/X) |\n| **Markdown** | [React Markdown](https://remarkjs.github.io/react-markdown/) | Blog post rendering with GFM support |\n| **Markdown** | [rehype-raw](https://github.com/rehypejs/rehype-raw) + [rehype-sanitize](https://github.com/rehypejs/rehype-sanitize) | Safe HTML in markdown |\n| **Markdown** | [remark-gfm](https://github.com/remarkjs/remark-gfm) | GitHub Flavored Markdown tables, strikethrough, etc. |\n| **Markdown** | [gray-matter](https://github.com/jonschlinkert/gray-matter) | YAML frontmatter parsing for blog posts |\n| **Font** | [Geist](https://vercel.com/font) | Modern sans-serif from Vercel |\n| **Hosting** | [Vercel](https://vercel.com) | Edge deployment with automatic SSL |\n| **Analytics** | [Google Analytics 4](https://analytics.google.com) | Tracking ID: G-LJ6LM6VMVV |\n\n---\n\n## 📁 Project Structure\n\n```\nwebsite-dev/\n├── README.md                          # This file\n├── .gitignore                         # Git ignore rules\n└── mattyjacks7/                       # Main Next.js application\n    ├── app/                           # Next.js App Router pages\n    │   ├── layout.tsx                 # Root layout (nav, footer, theme, analytics)\n    │   ├── page.tsx                   # Homepage (~814 lines of rich content)\n    │   ├── globals.css                # Global styles and Tailwind directives\n    │   ├── favicon.ico                # Site favicon\n    │   ├── opengraph-image.png        # OG image for social sharing\n    │   ├── twitter-image.png          # Twitter card image\n    │   ├── auth/                      # Authentication routes\n    │   │   ├── confirm/               # Email confirmation callback\n    │   │   ├── error/                 # Auth error page\n    │   │   ├── forgot-password/       # Password reset request\n    │   │   ├── login/                 # Login page\n    │   │   ├── sign-up/               # Registration page\n    │   │   ├── sign-up-success/       # Post-registration success\n    │   │   └── update-password/       # Password update page\n    │   ├── contact/                   # Contact page\n    │   ├── leads/                     # Lead generation databases\n    │   ├── manual/                    # User manual / documentation\n    │   ├── merchants/                 # Merchant services page\n    │   ├── posts/                     # Blog system (supports yearly slugs)\n    │   ├── privacy/                   # Privacy policy\n    │   ├── protected/                 # Auth-gated content\n    │   ├── resumes/                   # Resume website showcase\n    │   ├── services/                  # Services overview page\n    │   └── whatsapp/                  # WhatsApp contact page\n    ├── components/                    # Reusable React components\n    │   ├── animated-clouds.tsx        # Parallax cloud/space background\n    │   ├── auth-button.tsx            # Auth state toggle button\n    │   ├── client-theme-mount.tsx     # Client-side theme provider wrapper\n    │   ├── cookie-banner.tsx          # GDPR cookie consent banner\n    │   ├── deploy-button.tsx          # Vercel deploy button\n    │   ├── env-var-warning.tsx        # Missing env var alert\n    │   ├── forgot-password-form.tsx   # Forgot password form\n    │   ├── hamburger-menu.tsx         # Mobile menu toggle\n    │   ├── hero-cube.tsx              # 3D WebGL cube (Three.js)\n    │   ├── hero.tsx                   # Hero section layout\n    │   ├── login-form.tsx             # Login form with validation\n    │   ├── logout-button.tsx          # Logout action button\n    │   ├── mobile-sidebar.tsx         # Slide-out mobile navigation\n    │   ├── money-cube.tsx             # 3D interactive money cube (37KB!)\n    │   ├── navigation.tsx             # Top navigation bar\n    │   ├── next-logo.tsx              # Next.js logo SVG\n    │   ├── resume-card.tsx            # Resume portfolio card\n    │   ├── resume-cta-buttons.tsx     # Resume CTA actions\n    │   ├── safe-markdown.tsx          # Sanitized markdown renderer\n    │   ├── scaled-iframe.tsx          # Responsive iframe embed\n    │   ├── sign-up-form.tsx           # Registration form\n    │   ├── smooth-scroll.tsx          # Lenis smooth scroll wrapper\n    │   ├── supabase-logo.tsx          # Supabase branding SVG\n    │   ├── theme-switcher.tsx         # Light/dark theme dropdown\n    │   ├── theme-toggle.tsx           # Theme toggle button\n    │   ├── update-password-form.tsx   # Password update form\n    │   ├── worker-feedback.tsx        # Worker feedback carousel\n    │   ├── tutorial/                  # Tutorial/onboarding components\n    │   └── ui/                        # shadcn/ui base components\n    │       ├── badge.tsx              # Badge component\n    │       ├── button.tsx             # Button with variants\n    │       ├── card.tsx               # Card container\n    │       ├── checkbox.tsx           # Checkbox input\n    │       ├── dropdown-menu.tsx      # Dropdown menu\n    │       ├── input.tsx              # Text input field\n    │       └── label.tsx              # Form label\n    ├── lib/                           # Shared utilities and logic\n    │   ├── utils.ts                   # General utility functions (cn helper)\n    │   ├── posts-content.ts           # Blog post content management\n    │   ├── animations/                # Animation presets\n    │   │   └── scroll-animations.ts   # Scroll-triggered animation configs\n    │   ├── hooks/                     # Custom React hooks\n    │   │   └── useScrollAnimation.ts  # Intersection Observer hook\n    │   └── supabase/                  # Supabase client configuration\n    │       ├── client.ts              # Browser Supabase client\n    │       ├── server.ts              # Server Supabase client\n    │       └── middleware.ts          # Session management middleware\n    ├── public/                        # Static assets\n    │   ├── images/                    # All site images\n    │   │   ├── cloud-image_*.jpg      # Cloud parallax backgrounds\n    │   │   ├── seamless-space-*.jpg   # Space background (dark mode)\n    │   │   ├── tristatehoney-*.jpg    # Portfolio screenshots\n    │   │   ├── bg-100-dollar-*.png    # Money pattern background\n    │   │   └── mattyjacks-site-logo_*.png  # Site logos\n    │   └── videos/                    # Video assets\n    │       └── matt-testimonial-*.mp4 # Client testimonial video\n    ├── src/                           # Additional source files\n    ├── middleware.ts                   # Next.js middleware (URL normalization)\n    ├── next.config.ts                 # Next.js configuration\n    ├── tailwind.config.ts             # Tailwind CSS configuration\n    ├── tsconfig.json                  # TypeScript configuration\n    ├── postcss.config.mjs             # PostCSS configuration\n    ├── eslint.config.mjs              # ESLint configuration\n    ├── components.json                # shadcn/ui configuration\n    ├── package.json                   # Dependencies and scripts\n    ├── package-lock.json              # Lockfile\n    └── .env.example                   # Environment variable template\n```\n\n---\n\n## 📄 Pages & Routes\n\n### 🏠 Home Page (`/`)\n\nThe homepage is the most content-rich page on the site (~814 lines, 46KB). It features the following sections in order:\n\n1. **Hero Section** — Full-screen hero with:\n   - Animated parallax cloud background (light mode) / space background (dark mode)\n   - Interactive **3D Money Cube** rendered with Three.js/WebGL\n   - **Emoji particle system** (💵💸) that follows cursor movement on hover\n   - Tagline: *\"Outsourcing, Websites, Sales, Consulting, Software\"*\n   - Description of services and global talent deployment\n   - CTA buttons: \"Share Your Vision\" → `/contact` and \"Call Us\" → `tel:+16039999420`\n\n2. **About Section** — *\"Global Talent Meets Technology\"*\n   - Highlights capabilities: software dev, cold calling, lead generation, graphic design, copywriting, virtual assistance\n   - Scroll-triggered fade-in animations\n\n3. **Services Grid** — 4-card animated grid:\n   - 🤖 Custom AI Solutions\n   - 👥 Elite Freelancers\n   - 📈 Idea-to-Income\n   - 🎨 Web Design\n\n4. **Merchant Services Banner** — Full-width emerald gradient section:\n   - Payment processing solutions for high-risk and low-risk businesses\n   - 3 feature cards: 3 Day Approvals, High-Risk Specialists, Competitive Rates\n   - Trust indicators: Secured Processing, 24/7 Support, Multiple Payment Options, Chargeback Protection\n   - CTA: \"Explore Merchant Services\" → `/merchants`\n\n5. **Process Section** — 4-step workflow (desktop: horizontal with connecting lines, mobile: vertical timeline):\n   - Step 1: Share Your Vision\n   - Step 2: Strategic Assessment\n   - Step 3: Build and Execute\n   - Step 4: Deliver Results\n\n6. **Industries Section** — 8-industry grid:\n   - Software & SaaS, E-commerce & DTC, Agencies & Studios, Local Services\n   - Professional Services, Education & Info Products, Marketplaces, Media & Community\n\n7. **Portfolio: TristateHoney.com** — Case study with screenshots showing real lead inquiries\n\n8. **Portfolio: Opority.com** — Live iframe preview of client website (a web design firm that hired MattyJacks)\n\n9. **TikTok Algorithm Mastery** — Case study: grew @eric_escobedo to 3,000+ followers in 30 days, viral video with 2,300+ likes\n\n10. **Video Demos** — 6 embedded YouTube videos in a responsive grid\n\n11. **Testimonials** — Video testimonial from Justin Hughes, CEO of FirebringerAI (9:16 aspect ratio)\n\n12. **Worker Feedback Carousel** — Auto-scrolling carousel of worker feedback\n\n13. **Final CTA** — Money-patterned background with \"Ready to Make Money?\" call-to-action\n\n14. **Cookie Consent Banner** — GDPR-compliant cookie notice\n\n---\n\n### 🛠️ Services Page (`/services`)\n\nDetailed breakdown of all service offerings with animated cards and scroll effects. Built with Lucide icons (Phone, Code, Palette, PenTool) and scroll-triggered grid animations.\n\n**Services include:**\n- Cold Calling & Sales Outreach\n- Software Development & Web Design\n- Graphic Design & Branding\n- Copywriting & Content Creation\n- And more\n\n---\n\n### 📬 Contact Page (`/contact`)\n\nMulti-channel contact page with:\n- **Phone**: Call 24/7/365\n- **Email**: Matt@MattyJacks.com\n- **WhatsApp**: Direct messaging link\n- **Contact form** or manual inquiry options\n- Interactive icons: Mail, Phone, MessageCircle, FileText, ArrowRight, CheckCircle\n\n---\n\n### 💳 Merchant Services Page (`/merchants`)\n\nA comprehensive **551-line** page dedicated to payment processing solutions:\n- High-risk and low-risk merchant account approvals\n- 20+ banking relationships\n- Interactive FAQ accordion with `ChevronDown` toggles\n- Feature grid with icons: CreditCard, Shield, Zap, TrendingUp, etc.\n- Industry coverage: ShoppingCart, Store, Heart, Plane, Car, Gamepad2, and more\n- Trust badges: Lock, Headphones (support), DollarSign, Clock\n- Scroll-triggered animations throughout (fadeInUp, slideInGrid, scaleIn)\n\n---\n\n### 📊 Leads Page (`/leads`)\n\nInteractive lead generation database browser featuring:\n\n**Lead Databases Available:**\n| Database | Description | Row Count |\n|---|---|---|\n| USA Leads | Instagram marketing prospects with usernames, bios, followers | — |\n| Cruise & Travel Companies | Travel-oriented companies and agencies | — |\n| Random Scrapes 2025 | Mixed collection: trucking, tech, wine, yoga, pet, insurance, contractor leads | 1,757 |\n| *And more...* | Multiple additional curated lead sheets | 30,811 – 511,970+ rows |\n\n**Features:**\n- Clickable lead cards that open a **modal preview** with embedded Google Sheets\n- Summary statistics component showing total sheets, total rows, and last updated date\n- Number formatting with commas for readability\n- Responsive grid layout with scroll animations\n\n---\n\n### 📄 Resume Sites Page (`/resumes`)\n\nShowcase of conversion-focused resume websites built by MattyJacks:\n\n| Resume Site | URL | Description |\n|---|---|---|\n| relentlessjavian | [relentlessjavian.vercel.app](https://relentlessjavian.vercel.app/) | Simple, clean, focused on conversions |\n| moses-resume-web | [moses-resume-web.vercel.app](https://moses-resume-web.vercel.app/) | Professional presentation with clear CTAs |\n| resume-julienne | [resume-julienne.vercel.app](https://resume-julienne.vercel.app/) | Elegant layout with strong portfolio highlights |\n\nIncludes CTA section: *\"Want one like these?\"* with quick-action buttons.\n\n---\n\n### 📝 Blog / Posts Page (`/posts`)\n\nServer-rendered blog system with:\n- **Dynamic routing**: `/posts/{year}/{slug}`\n- **Frontmatter support**: title, date, author, description, status via `gray-matter`\n- **Markdown rendering**: React Markdown with GFM tables, strikethrough, safe HTML\n- **Content management** via `lib/posts-content.ts` — posts can be marked as \"listed\" or \"unlisted\"\n- **Incremental static regeneration**: `revalidate = 60` (refreshes every 60 seconds)\n- Clean article layout with date, author, and description\n\n---\n\n### 💬 WhatsApp Page (`/whatsapp`)\n\nDedicated landing page for WhatsApp-based communication:\n- Pre-filled WhatsApp deep link: `https://api.whatsapp.com/send?phone=15106005735`\n- Custom message template with name and skills placeholder\n- Twitter/X integration with `FaXTwitter` icon from react-icons\n- Scroll-animated content\n\n---\n\n### 🔒 Privacy Policy Page (`/privacy`)\n\nComprehensive 350-line privacy policy with:\n- Professional legal layout with Lucide icons: Shield, Lock, Eye, Database, Share2, Cookie, Globe, FileText, Mail\n- Sections covering data collection, usage, sharing, cookies, and user rights\n- Scroll-animated section reveals\n\n---\n\n### 🔐 Authentication Pages (`/auth/*`)\n\nFull Supabase-powered authentication flow:\n\n| Route | Purpose |\n|---|---|\n| `/auth/login` | Email + password login |\n| `/auth/sign-up` | New user registration |\n| `/auth/sign-up-success` | Post-registration confirmation |\n| `/auth/forgot-password` | Password reset request |\n| `/auth/update-password` | Set new password |\n| `/auth/confirm` | Email verification callback |\n| `/auth/error` | Authentication error display |\n\n---\n\n### 🛡️ Protected Pages (`/protected`)\n\nAuth-gated content accessible only to logged-in users. Session is managed via Supabase SSR cookies through middleware.\n\n---\n\n### 📖 Manual Page (`/manual`)\n\nUser manual or documentation page for internal reference or onboarding.\n\n---\n\n## 🧱 Components\n\n### 3D & Visual Effects\n\n| Component | File | Description |\n|---|---|---|\n| **MoneyCube** | `money-cube.tsx` (37KB) | Interactive 3D cube rendered with Three.js. Displays money-themed textures, rotates on interaction. The visual centerpiece of the hero section. |\n| **HeroCube** | `hero-cube.tsx` (25KB) | Additional 3D WebGL cube component with different styling/behavior. |\n| **AnimatedClouds** | `animated-clouds.tsx` (9.4KB) | Parallax-scrolling cloud background with configurable speed, scale, opacity. Switches between cloud image (light mode) and space image (dark mode). |\n\n### Navigation & Layout\n\n| Component | File | Description |\n|---|---|---|\n| **Navigation** | `navigation.tsx` (5.1KB) | Responsive top navigation with desktop menu and mobile hamburger. Links to: Home, Services, Merchant Services, Resume Sites, Leads, Contact, WhatsApp, Privacy. |\n| **HamburgerMenu** | `hamburger-menu.tsx` (1.7KB) | Animated hamburger icon toggle for mobile navigation. |\n| **MobileSidebar** | `mobile-sidebar.tsx` (6KB) | Slide-out sidebar navigation panel for mobile viewports. |\n| **SmoothScroll** | `smooth-scroll.tsx` | Lenis-powered smooth scrolling wrapper applied to the entire app. |\n\n### Authentication Components\n\n| Component | File | Description |\n|---|---|---|\n| **LoginForm** | `login-form.tsx` (3.6KB) | Email/password login with validation and error handling. |\n| **SignUpForm** | `sign-up-form.tsx` (3.9KB) | User registration with form validation. |\n| **ForgotPasswordForm** | `forgot-password-form.tsx` (3.7KB) | Password reset email request form. |\n| **UpdatePasswordForm** | `update-password-form.tsx` (2.5KB) | New password input with confirmation. |\n| **AuthButton** | `auth-button.tsx` | Toggles between login/logout based on auth state. |\n| **LogoutButton** | `logout-button.tsx` | Triggers Supabase sign-out action. |\n\n### UI Components (shadcn/ui)\n\nBuilt on **Radix UI** primitives with Tailwind styling:\n\n| Component | File | Description |\n|---|---|---|\n| **Button** | `ui/button.tsx` | Multi-variant button (default, destructive, outline, secondary, ghost, link) |\n| **Card** | `ui/card.tsx` | Composable card: CardHeader, CardTitle, CardDescription, CardContent, CardFooter |\n| **Badge** | `ui/badge.tsx` | Inline status badges |\n| **Input** | `ui/input.tsx` | Styled text input field |\n| **Label** | `ui/label.tsx` | Accessible form label |\n| **Checkbox** | `ui/checkbox.tsx` | Radix checkbox with custom styling |\n| **DropdownMenu** | `ui/dropdown-menu.tsx` | Full-featured dropdown with submenus, checkboxes, radio items |\n\n### Content Components\n\n| Component | File | Description |\n|---|---|---|\n| **WorkerFeedbackCarousel** | `worker-feedback.tsx` (5.2KB) | Auto-scrolling carousel displaying worker feedback and reviews. |\n| **ResumeCard** | `resume-card.tsx` | Portfolio card for resume website showcase. |\n| **ResumeCTAButtons** | `resume-cta-buttons.tsx` | Action buttons (call, email) for resume service inquiries. |\n| **ScaledIframe** | `scaled-iframe.tsx` (1.6KB) | Responsive iframe that scales content to fit container (used for Opority.com live preview). |\n| **SafeMarkdown** | `safe-markdown.tsx` (1.5KB) | Sanitized markdown renderer with rehype-raw and rehype-sanitize. |\n| **CookieBanner** | `cookie-banner.tsx` (3.5KB) | GDPR-compliant cookie consent notification. |\n\n### Utility Components\n\n| Component | File | Description |\n|---|---|---|\n| **ClientThemeProvider** | `client-theme-mount.tsx` | Wraps theme-dependent children to prevent hydration mismatches. |\n| **ThemeSwitcher** | `theme-switcher.tsx` | Dropdown menu for theme selection (light, dark, system). |\n| **ThemeToggle** | `theme-toggle.tsx` | Simple theme toggle button with icon animation. |\n| **DeployButton** | `deploy-button.tsx` | Vercel deploy-to-own-account button. |\n| **EnvVarWarning** | `env-var-warning.tsx` | Warning banner when environment variables are missing. |\n\n---\n\n## ✨ Animations & Visual Effects\n\nThe site makes heavy use of animations for a premium, engaging user experience:\n\n### Scroll-Triggered Animations (`lib/animations/scroll-animations.ts`)\n\nPowered by a custom **Intersection Observer hook** (`lib/hooks/useScrollAnimation.ts`), elements animate into view as users scroll:\n\n| Animation Preset | Effect |\n|---|---|\n| `fadeInUp` | Elements fade in and slide up from below |\n| `fadeInLeft` | Elements fade in and slide in from the left |\n| `slideInGrid` | Grid children stagger-animate into view |\n| `scaleIn` | Elements scale up from 0 to full size |\n\n### 3D Graphics (Three.js)\n\n- **MoneyCube**: A fully interactive 3D cube with money-themed textures, lighting, and rotation. Responds to mouse/touch input. At **37KB**, it's one of the most complex components.\n- **HeroCube**: Secondary 3D cube component (25KB) with additional visual effects.\n\n### Emoji Particle System\n\nThe homepage hero section features a cursor-following particle system:\n- Emits 💵 (bills fall down) and 💸 (fly-aways rise up) emojis\n- 2–5 particles per second while hovering\n- Physics-based: gravity, rotation, velocity, minimum lifetime\n- Touch-compatible for mobile devices\n- Automatically garbage-collected when particles leave the viewport\n\n### Parallax Backgrounds\n\n- **Cloud mode** (light theme): Slow-drifting clouds with vertical and horizontal parallax\n- **Space mode** (dark theme): Animated space/stars background\n- Configurable: opacity, speed, scale range, drift speed\n\n### Smooth Scrolling\n\n**Lenis** provides buttery-smooth page scrolling across the entire application, creating a polished, premium feel.\n\n### Micro-Interactions\n\n- Hover effects on cards: scale, shadow, border color transitions\n- Button hover states with gradient reveals\n- Icon animations on hover (scale, color transitions)\n- Navigation transitions and mobile sidebar slide\n- All transitions use `duration-200` to `duration-300` for consistent timing\n\n---\n\n## 🎨 Design System\n\n### Color Palette\n\n| Usage | Light Mode | Dark Mode |\n|---|---|---|\n| **Primary** | Emerald 600 (`#059669`) | Emerald 300–400 |\n| **Accent** | Red 600 (`#dc2626`) | Red 400–500 |\n| **Background** | White / Zinc 50 | Zinc 950 / Zinc 900 |\n| **Text** | Zinc 900 / Zinc 700 | Zinc 100 / Zinc 300 |\n| **Borders** | Zinc 200 | Zinc 800 |\n| **Hover States** | Red highlights | Red highlights |\n\n### Typography\n\n- **Primary Font**: Geist Sans (from Vercel) — modern, clean sans-serif\n- **Font loading**: `next/font/google` with `display: \"swap\"` for optimal performance\n- **Scale**: Responsive text sizing from `text-xs` to `text-7xl`\n- **Tracking**: Ultra-wide tracking (`tracking-[0.2em]`, `tracking-[0.25em]`) for section labels\n\n### Theme System\n\n- Powered by `next-themes` with `ThemeProvider`\n- Default theme: **dark**\n- Supports: `light`, `dark`, `system`\n- `disableTransitionOnChange` prevents FOUC during theme switch\n- `suppressHydrationWarning` on `<html>` for SSR compatibility\n\n---\n\n## 🔑 Authentication & Backend\n\n### Supabase Integration\n\nThe application uses **Supabase** for authentication and backend services:\n\n- **Client-side**: `lib/supabase/client.ts` — Browser Supabase client for client components\n- **Server-side**: `lib/supabase/server.ts` — Server Supabase client for server components and API routes\n- **Middleware**: `lib/supabase/middleware.ts` — Session refresh and cookie management\n- **SSR Cookies**: `@supabase/ssr` package handles cookie-based sessions across the full Next.js stack\n\n### Authentication Features\n\n- Email + password sign-up and login\n- Password reset via email\n- Email confirmation flow\n- Protected routes (e.g., `/protected`)\n- Auth state management across client and server\n- Automatic session refresh in middleware\n\n---\n\n## 📈 SEO & Analytics\n\n### SEO\n\n- **Meta tags**: Title, description, and Open Graph metadata defined in `layout.tsx`\n- **Title**: *\"MattyJacks - Do and/or DIE TRYING!!!\"*\n- **Description**: *\"Outsourcing, Websites, Sales, Consulting, Software, Custom AI, elite freelancers, idea-to-income execution, and web design that converts.\"*\n- **Open Graph image**: Custom branded image at `/images/mattyjacks-site-logo_upscayl_3x_digital-art-4x.png`\n- **Twitter card image**: Same as OG image\n- **URL canonicalization**: `www.mattyjacks.com` → `mattyjacks.com` redirect\n- **URL normalization**: Middleware forces all URLs to lowercase with 301 redirects\n\n### Google Analytics 4\n\n- **Tracking ID**: `G-LJ6LM6VMVV`\n- Loaded via `next/script` with `strategy=\"beforeInteractive\"` for early loading\n- Standard `gtag.js` implementation\n\n---\n\n## 🔄 Middleware\n\nThe application includes Next.js middleware (`middleware.ts`) that handles:\n\n1. **URL Lowercasing**: Any URL with uppercase characters is 301-redirected to its lowercase equivalent for consistent SEO\n2. **Session Management**: Supabase session cookies are refreshed on every request via `updateSession()`\n\n**Matcher**: All routes except static files, images, and Next.js internals.\n\n---\n\n## 🚀 Getting Started\n\n### Prerequisites\n\n- **Node.js** 18+ (recommended: 20+)\n- **npm**, **yarn**, or **pnpm**\n- A **Supabase** project ([create one here](https://database.new))\n\n### Installation\n\n1. Clone the repository:\n\n   ```bash\n   git clone https://github.com/mattyjacks/website.git\n   cd website/mattyjacks7\n   ```\n\n2. Install dependencies:\n\n   ```bash\n   npm install\n   ```\n\n### Environment Variables\n\nCreate a `.env.local` file in the `mattyjacks7/` directory (or copy `.env.example`):\n\n```bash\ncp .env.example .env.local\n```\n\nRequired variables:\n\n```env\n# Supabase Configuration\nNEXT_PUBLIC_SUPABASE_URL=your-project-url\nNEXT_PUBLIC_SUPABASE_PUBLISHABLE_OR_ANON_KEY=your-anon-key\n```\n\nYou can find these values in your [Supabase project API settings](https://supabase.com/dashboard/project/_?showConnect=true).\n\n### Running Locally\n\nStart the development server with Turbopack:\n\n```bash\nnpm run dev\n```\n\nThe site will be available at **[http://localhost:3000](http://localhost:3000)**.\n\n### Building for Production\n\n```bash\nnpm run build\nnpm start\n```\n\n### Linting\n\n```bash\nnpm run lint\n```\n\n---\n\n## 🌍 Deployment\n\nThe site is deployed on **Vercel** with the following configuration:\n\n- **Framework Preset**: Next.js\n- **Root Directory**: `mattyjacks7`\n- **Build Command**: `next build`\n- **Output Directory**: `.next`\n- **Custom Domain**: `mattyjacks.com`\n- **Redirect**: `www.mattyjacks.com` → `mattyjacks.com` (configured in `next.config.ts`)\n- **SSL**: Automatic via Vercel\n- **CDN**: Global edge network\n\n### Vercel Integration with Supabase\n\nWhen deploying via the Vercel button, the Supabase integration automatically provisions environment variables to the Vercel project.\n\n---\n\n## 📦 Dependencies\n\n### Production Dependencies\n\n| Package | Version | Purpose |\n|---|---|---|\n| `next` | ^15.5.9 | React framework with App Router |\n| `react` | ^19.0.0 | UI library |\n| `react-dom` | ^19.0.0 | React DOM rendering |\n| `three` | ^0.180.0 | 3D WebGL graphics engine |\n| `gsap` | ^3.13.0 | GreenSock Animation Platform |\n| `@gsap/react` | ^2.1.2 | GSAP React integration |\n| `framer-motion` | ^12.23.22 | Declarative animations for React |\n| `lenis` | ^1.1.19 | Smooth scroll library |\n| `@supabase/supabase-js` | latest | Supabase JavaScript client |\n| `@supabase/ssr` | latest | Supabase SSR helpers |\n| `next-themes` | ^0.4.6 | Theme management |\n| `lucide-react` | ^0.511.0 | Icon library |\n| `react-icons` | ^5.5.0 | Additional icon packs |\n| `react-markdown` | ^10.1.0 | Markdown rendering |\n| `rehype-raw` | ^7.0.0 | HTML in markdown |\n| `rehype-sanitize` | ^6.0.0 | Sanitize HTML |\n| `remark-gfm` | ^4.0.1 | GitHub Flavored Markdown |\n| `gray-matter` | ^4.0.3 | YAML frontmatter parser |\n| `class-variance-authority` | ^0.7.1 | Component variant management |\n| `clsx` | ^2.1.1 | Conditional CSS classes |\n| `tailwind-merge` | ^3.3.0 | Merge Tailwind classes |\n| `@radix-ui/react-checkbox` | ^1.3.1 | Accessible checkbox |\n| `@radix-ui/react-dropdown-menu` | ^2.1.14 | Accessible dropdown |\n| `@radix-ui/react-label` | ^2.1.6 | Accessible label |\n| `@radix-ui/react-slot` | ^1.2.2 | Slot composition pattern |\n\n### Dev Dependencies\n\n| Package | Version | Purpose |\n|---|---|---|\n| `typescript` | ^5 | Type safety |\n| `@types/node` | ^20.19.17 | Node.js type definitions |\n| `@types/react` | ^19 | React type definitions |\n| `@types/react-dom` | ^19 | React DOM type defs |\n| `@types/three` | ^0.180.0 | Three.js type definitions |\n| `tailwindcss` | ^3.4.1 | Utility-first CSS framework |\n| `tailwindcss-animate` | ^1.0.7 | Tailwind animation plugin |\n| `autoprefixer` | ^10.4.20 | CSS vendor prefixing |\n| `postcss` | ^8 | CSS processing |\n| `eslint` | ^9 | JavaScript linting |\n| `eslint-config-next` | 15.3.1 | Next.js ESLint rules |\n| `@eslint/eslintrc` | ^3 | ESLint config toolkit |\n\n---\n\n## 🌐 CryptArtist Ecosystem Integration\n\nMattyJacks.com is the parent company and hub for the entire CryptArtist ecosystem:\n\n| Project | Relationship | Integration |\n|---|---|---|\n| **GiveGigs** | 96.8% owned subsidiary | SSO auth provider, worker marketplace, freelancer hiring |\n| **CryptArtist Studio** | 100% owned subsidiary | Creative suite built by MattyJacks team |\n| **CryptArtist Website** | 100% owned subsidiary | Digital art platform |\n| **VentureCapitalArts** | 100% owned subsidiary | Investment portfolio and SAAS marketplace |\n| **VibeCodeWorker** | 100% owned subsidiary | Dev services and SAAS templates |\n| **GraveGain** | Game project | Dark fantasy RPG built with CryptArtist tools |\n| **WebsiteBlog** | Blog platform | Devlogs, announcements, and articles |\n\n### Shared Infrastructure\n\n- **Supabase**: Shared authentication and database across all web properties\n- **GiveGigs Control Plane**: Ecosystem orchestration API connecting all apps\n- **Vercel**: Hosting for mattyjacks.com, givegigs.com, venturecapitalarts.com\n- **Design Language**: Consistent dark/light theme, Tailwind CSS, shadcn/ui across all sites\n\n---\n\n## 🔗 Related Projects\n\n| Project | Description | Link |\n|---|---|---|\n| **GiveGigs** | Freelance marketplace with AI agent ecosystem | [Website](https://givegigs.com) / [GitHub](https://github.com/mattyjacks/GiveGigs) |\n| **CryptArtist Studio** | Open creative suite with 11 programs | [GitHub](https://github.com/mattyjacks/CryptArtistStudio) |\n| **VentureCapitalArts** | Satirical investment portfolio marketplace | [GitHub](https://github.com/mattyjacks/VCA) |\n| **GraveGain** | Dark fantasy action RPG with emoji graphics | [GitHub](https://github.com/mattyjacks/GraveGain) |\n| **WebsiteBlog** | Blog platform with devlogs and articles | [GitHub](https://github.com/mattyjacks/websiteBlog) |\n\n---\n\n## 📞 Contact\n\n| Channel | Details |\n|---|---|\n| **Website** | [mattyjacks.com](https://mattyjacks.com) |\n| **Email** | [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com) |\n| **Phone** | [603-999-9420](tel:+16039999420) — Available 24/7/365 |\n| **WhatsApp** | [Send a message](https://api.whatsapp.com/send?phone=15106005735) |\n\n---\n\n<p align=\"center\">\n  <strong>© 2025 MattyJacks. All rights reserved.</strong><br />\n  <em>Do and/or DIE TRYING!!!</em>\n</p>\n","wordCount":4653,"sizeKb":37.1},{"name":"merchant-services.md","slug":"merchant-services","content":"# MattyJacks Merchant Services\n\nThis document details the merchant payment processing solutions offered by MattyJacks.\n\n## Core Offering\nSecure and reliable payment processing for businesses based in the **USA & Canada**. \n\n## Speed of Approval\n- Fast setup with **3-day approval windows** on most merchant account applications.\n\n## High-Risk Industries Covered\nMattyJacks specializes in securing payment processing for high-risk and hard-to-place business types, including:\n- Adult Entertainment\n- CBD & Vape/E-Cigarette Products\n- Fantasy Sports & Online Gaming\n- Auto Warranty & Pawn Shops\n- High-Ticket Coaching & Business Opportunities\n- Subscription Boxes & Continuity Billing\n- Credit Repair & Debt Collection\n\n## Low-Risk Industries Covered\n- E-commerce & Retail\n- SaaS & Software\n- Professional & Consulting Services\n- Firearms (Sovereign-friendly merchant accounts)\n\n## Sign-up Requirement\nClients must use the official referral link: `https://savvy.cc/?invite=mattyjacks` to ensure tracking, proper commissions, and ongoing support from the MattyJacks team.\n","wordCount":147,"sizeKb":1},{"name":"properlytrade-README.md","slug":"properlytrade-README","content":"<h1 align=\"center\">ProperlyTrade</h1>\n\n<p align=\"center\">\n  <strong>A Modern SaaS Demo Website for Trading Infrastructure</strong>\n</p>\n\n<p align=\"center\">\n  <em>Demo site built by <a href=\"https://mattyjacks.com\">MattyJacks.com</a> - A sole proprietorship in New Hampshire, USA</em>\n</p>\n\n<p align=\"center\">\n  <a href=\"#overview\"><strong>Overview</strong></a> -\n  <a href=\"#demo-disclaimer\"><strong>Disclaimer</strong></a> -\n  <a href=\"#tech-stack\"><strong>Tech Stack</strong></a> -\n  <a href=\"#project-structure\"><strong>Project Structure</strong></a> -\n  <a href=\"#pages-and-routes\"><strong>Pages & Routes</strong></a> -\n  <a href=\"#ai-trading-chatbot\"><strong>AI Chatbot</strong></a> -\n  <a href=\"#credit-system\"><strong>Credit System</strong></a> -\n  <a href=\"#site-hardening\"><strong>Site Hardening</strong></a> -\n  <a href=\"#accessibility\"><strong>Accessibility</strong></a> -\n  <a href=\"#component-architecture\"><strong>Components</strong></a> -\n  <a href=\"#styling-and-theming\"><strong>Styling</strong></a> -\n  <a href=\"#animations\"><strong>Animations</strong></a> -\n  <a href=\"#security\"><strong>Security</strong></a> -\n  <a href=\"#performance\"><strong>Performance</strong></a> -\n  <a href=\"#environment-variables\"><strong>Environment</strong></a> -\n  <a href=\"#getting-started\"><strong>Getting Started</strong></a> -\n  <a href=\"#deployment\"><strong>Deployment</strong></a> -\n  <a href=\"#license\"><strong>License</strong></a>\n</p>\n\n<br/>\n\n> **WARNING**: This is a **DEMO SITE** built by [MattyJacks.com](https://mattyjacks.com) for demonstration\n> and portfolio purposes. It comes with **NO WARRANTIES** for use. All content, pricing, testimonials,\n> team members, and features shown are **fictional**. Legal documents were **generated by AI** and may be\n> inaccurate. Contact: [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n\n---\n\n## Overview\n\nProperlyTrade is a modern, high-end SaaS demonstration website showcasing a fictional all-in-one\ntrading infrastructure platform for prop trading firms and brokerages. The site was designed and\ndeveloped as a portfolio piece to demonstrate advanced web development capabilities including:\n\n- Premium dark-themed fintech UI/UX design with glassmorphism\n- Complex multi-page Next.js 16 application architecture with App Router\n- AI-powered chatbot integration with a Pi-based credit system\n- 80+ site hardening improvements across security, accessibility, SEO, and performance\n- Smooth Framer Motion animations and micro-interactions\n- Fully responsive design across all breakpoints\n- SEO-optimized page structure with proper metadata and Open Graph tags\n- Third-party API integration (OpenAI, OpenRouter)\n- Client-side state management for credits and API keys\n- Legal compliance pages (Privacy Policy, Terms of Use)\n- Custom error, 404, and loading pages\n- Print stylesheet support\n- DNS prefetch and preconnect hints for performance\n- Comprehensive security headers\n\nThe fictional product depicted on this site is an \"all-in-one infrastructure platform for trading\nfirms\" that would provide CRM, risk management, trading APIs, and automation tools. **None of these\nfeatures are real** - they exist purely as UI demonstrations.\n\n### Who Built This\n\nThis project was built by **Matt** at **MattyJacks.com**, a sole proprietorship operating out of\n**New Hampshire, USA**. MattyJacks specializes in full-stack web development, AI integration, and\nmodern SaaS website design.\n\n- **Website**: [MattyJacks.com](https://mattyjacks.com)\n- **Email**: [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n- **Location**: New Hampshire, United States\n- **Business Type**: Sole Proprietorship\n\n---\n\n## Demo Disclaimer\n\nThis section exists because transparency matters. Please read carefully.\n\n### What This Is\n\n- A **demonstration website** built for portfolio purposes\n- A showcase of modern web development techniques\n- A fictional SaaS product with fictional data\n- An experimental AI chatbot integration\n\n### What This Is NOT\n\n- A real trading platform or financial service\n- A source of financial or investment advice\n- A production-ready SaaS application\n- A legally binding service offering\n\n### Important Notices\n\n1. **No Financial Advice**: Nothing on this site constitutes financial advice. The AI chatbot\n   is experimental and untested. Never make trading decisions based on AI output.\n2. **Fictional Content**: All pricing, testimonials, team members, statistics, and feature\n   descriptions are fictional and created for demonstration purposes.\n3. **AI-Generated Legal Docs**: The Privacy Policy and Terms of Use were generated by AI and\n   may contain inaccuracies. They should not be relied upon as legal documents.\n4. **No Warranties**: This software is provided \"AS IS\" without any warranties of any kind.\n5. **Demo Credits**: The AI credit system is for demonstration. Actual billing may not be implemented.\n\n---\n\n## Tech Stack\n\n### Core Framework\n\n| Technology | Version | Purpose |\n|-----------|---------|---------|\n| [Next.js](https://nextjs.org) | 16.1.6 | React framework with App Router, SSR, API routes |\n| [React](https://react.dev) | 19.x | UI component library |\n| [TypeScript](https://typescriptlang.org) | 5.x | Type-safe JavaScript |\n\n### Styling & UI\n\n| Technology | Purpose |\n|-----------|---------|\n| [Tailwind CSS](https://tailwindcss.com) | Utility-first CSS framework |\n| [tailwindcss-animate](https://github.com/jamiebuilds/tailwindcss-animate) | Animation utilities for Tailwind |\n| Custom CSS Variables | Dark theme color system |\n| Glass Morphism | Backdrop blur effects for premium feel |\n\n### Animation\n\n| Technology | Purpose |\n|-----------|---------|\n| [Framer Motion](https://www.framer.com/motion/) | Declarative animations, scroll-triggered reveals |\n| CSS Animations | Pulse effects, gradient shifts |\n| CSS Transitions | Hover states, interactive feedback |\n\n### AI Integration\n\n| Technology | Purpose |\n|-----------|---------|\n| [OpenAI API](https://openai.com) | GPT-5.4 model for trading analysis chatbot |\n| [OpenRouter API](https://openrouter.ai) | Alternative AI routing for model access |\n| [openai npm package](https://www.npmjs.com/package/openai) | Official OpenAI SDK |\n\n### Icons\n\n| Technology | Purpose |\n|-----------|---------|\n| [Lucide React](https://lucide.dev) | Beautiful, consistent icon set |\n\n### Infrastructure\n\n| Service | Purpose |\n|---------|---------|\n| [Vercel](https://vercel.com) | Hosting, deployment, serverless functions, edge network |\n| [Cloudflare](https://cloudflare.com) | Domain registration, DNS management, DDoS protection |\n| [Supabase](https://supabase.com) | PostgreSQL database, authentication, real-time subscriptions |\n\n### Development Tools\n\n| Tool | Purpose |\n|------|---------|\n| ESLint | Code linting and style enforcement |\n| PostCSS | CSS processing pipeline |\n| Turbopack | Next.js bundler for fast development builds |\n\n---\n\n## Project Structure\n\n```\nProperlyTrade/\n|\n|-- properlytrade1/                  # Main Next.js application\n|   |\n|   |-- app/                         # Next.js App Router directory\n|   |   |-- api/\n|   |   |   |-- chat/\n|   |   |       |-- route.ts         # AI chatbot API endpoint (OpenAI + OpenRouter)\n|   |   |\n|   |   |-- about/\n|   |   |   |-- page.tsx             # About Us page\n|   |   |\n|   |   |-- chat/\n|   |   |   |-- page.tsx             # AI Trading Chatbot page with disclaimer gate\n|   |   |\n|   |   |-- contact/\n|   |   |   |-- page.tsx             # Contact form page\n|   |   |\n|   |   |-- features/\n|   |   |   |-- page.tsx             # Features/Technology page\n|   |   |\n|   |   |-- legal/\n|   |   |   |-- privacy-policy/\n|   |   |   |   |-- page.tsx         # Privacy Policy (AI-generated)\n|   |   |   |-- terms/\n|   |   |       |-- page.tsx         # Terms of Use (AI-generated)\n|   |   |\n|   |   |-- pricing/\n|   |   |   |-- page.tsx             # Pricing page (platform + AI credits)\n|   |   |\n|   |   |-- error.tsx                # Custom error page with demo branding\n|   |   |-- not-found.tsx            # Custom 404 page with demo branding\n|   |   |-- loading.tsx              # Loading skeleton page\n|   |   |-- globals.css              # Global styles, Tailwind config, CSS variables, print styles\n|   |   |-- layout.tsx               # Root layout with metadata, fonts, DemoBanner, skip-to-content\n|   |   |-- page.tsx                 # Homepage\n|   |   |-- robots.ts                # Dynamic robots.txt generation\n|   |   |-- sitemap.ts               # Dynamic sitemap.xml generation\n|   |   |-- manifest.ts              # Web app manifest\n|   |\n|   |-- components/\n|   |   |-- chat/\n|   |   |   |-- api-key-settings.tsx # BYOK API key management panel\n|   |   |   |-- chat-widget.tsx      # Chat interface with messages, credits, input\n|   |   |\n|   |   |-- sections/\n|   |   |   |-- about-hero.tsx       # About page hero section\n|   |   |   |-- about-team.tsx       # Team members grid\n|   |   |   |-- about-values.tsx     # Company values cards\n|   |   |   |-- ai-credits-pricing.tsx # AI credit tier cards + overage table\n|   |   |   |-- contact-section.tsx  # Contact form with success state + info sidebar\n|   |   |   |-- cta.tsx              # Call-to-action section (reused)\n|   |   |   |-- faq.tsx              # FAQ accordion section with keyboard a11y\n|   |   |   |-- features-grid.tsx    # Homepage features grid (6 cards)\n|   |   |   |-- features-hero.tsx    # Features page hero\n|   |   |   |-- hero.tsx             # Homepage hero with dashboard mockup\n|   |   |   |-- how-it-works.tsx     # Step-by-step timeline\n|   |   |   |-- integrations.tsx     # Platform integrations grid\n|   |   |   |-- pricing-cards.tsx    # Platform pricing tiers\n|   |   |   |-- pricing-hero.tsx     # Pricing page hero\n|   |   |   |-- solutions-grid.tsx   # Deep-dive solution cards\n|   |   |   |-- stats.tsx            # Animated statistics counters\n|   |   |   |-- testimonials.tsx     # Client testimonial cards\n|   |   |\n|   |   |-- animated-section.tsx     # Reusable Framer Motion wrappers\n|   |   |-- demo-banner.tsx          # Sticky demo banner + DemoBadge component\n|   |   |-- footer.tsx               # Site footer with links, legal, MattyJacks branding\n|   |   |-- navbar.tsx               # Responsive navbar with mobile menu + scroll effect\n|   |\n|   |-- lib/\n|   |   |-- credits.ts               # Credit system logic (Pi multiplier, BYOK, overages)\n|   |\n|   |-- .env.example                 # Environment variable template\n|   |-- LICENSE                      # ProperlyTrade Custom License v1.69.420.3\n|   |-- next.config.ts               # Next.js configuration with security headers\n|   |-- package.json                 # Dependencies and scripts\n|   |-- tailwind.config.ts           # Tailwind CSS configuration\n|   |-- tsconfig.json                # TypeScript configuration\n|   |-- README.md                    # Detailed inner project README\n|\n|-- README.md                        # This file (root-level overview)\n```\n\n### Directory Conventions\n\n- **`app/`**: Next.js 16 App Router. Each subdirectory with a `page.tsx` is a route.\n- **`components/sections/`**: Page-specific section components. Each renders a full-width section.\n- **`components/chat/`**: AI chatbot-specific components.\n- **`components/`** (root): Shared components used across multiple pages.\n- **`lib/`**: Utility functions and business logic.\n- **`app/api/`**: Server-side API routes (serverless functions on Vercel).\n\n---\n\n## Pages and Routes\n\n### Public Pages\n\n| Route | File | Description |\n|-------|------|-------------|\n| `/` | `app/page.tsx` | Homepage with hero, features, stats, how-it-works, testimonials, CTA |\n| `/features` | `app/features/page.tsx` | Technology/features deep-dive with solutions, integrations, FAQ |\n| `/pricing` | `app/pricing/page.tsx` | Platform pricing tiers + AI credit pricing + overage table |\n| `/about` | `app/about/page.tsx` | Company story, values, team members |\n| `/contact` | `app/contact/page.tsx` | Contact form with animated success state |\n| `/chat` | `app/chat/page.tsx` | AI Trading Chatbot with disclaimer gate |\n| `/legal/privacy-policy` | `app/legal/privacy-policy/page.tsx` | Privacy Policy (AI-generated) |\n| `/legal/terms` | `app/legal/terms/page.tsx` | Terms of Use (AI-generated) |\n\n### API Routes\n\n| Route | Method | Description |\n|-------|--------|-------------|\n| `/api/chat` | POST | AI chatbot endpoint. Validates input, accepts messages + provider + optional user API keys. Returns AI response. |\n\n### Generated Routes\n\n| Route | Source | Description |\n|-------|--------|-------------|\n| `/robots.txt` | `app/robots.ts` | Dynamic robots.txt with sitemap reference |\n| `/sitemap.xml` | `app/sitemap.ts` | Dynamic sitemap with all public routes |\n| `/manifest.webmanifest` | `app/manifest.ts` | Web app manifest with demo branding |\n\n### Special Pages\n\n| Route | Source | Description |\n|-------|--------|-------------|\n| Error | `app/error.tsx` | Custom error page with retry button and demo branding |\n| 404 | `app/not-found.tsx` | Custom 404 with animated entrance and go-back button |\n| Loading | `app/loading.tsx` | Skeleton loading state |\n\n### Page Composition Pattern\n\nEvery page follows this consistent structure:\n\n```tsx\n<Navbar />                 {/* Fixed navbar with scroll-based glassmorphism */}\n<main id=\"main-content\">  {/* Skip-link target */}\n  <PageHero />             {/* Hero section with DemoBadge */}\n  <Section1 />             {/* Page-specific content sections */}\n  <Section2 />\n  <CtaSection />           {/* Shared call-to-action */}\n</main>\n<Footer />                 {/* (c) MattyJacks from New Hampshire, USA */}\n```\n\nThe `DemoBanner` (sticky bottom bar) is rendered in the root `layout.tsx` so it appears on every page.\n\n---\n\n## AI Trading Chatbot\n\n### Overview\n\nThe AI Trading Chatbot is an experimental feature that allows users to have conversations about\ntrading strategies, market analysis, chart patterns, risk management, and more. It is powered by\nGPT-5.4 via either the OpenAI API or OpenRouter API.\n\n> **CRITICAL DISCLAIMER**: The AI chatbot is experimental and untested. It does NOT provide\n> financial advice. All responses are AI-generated and may be inaccurate. Never make trading\n> decisions based solely on AI output. Use at your own risk.\n\n### Architecture\n\n```\nUser Browser                    Next.js Server                 AI Provider\n+-----------+                   +---------------+              +----------+\n|           |  POST /api/chat   |               |  API Call    |          |\n| ChatWidget| ----------------> | route.ts      | -----------> | OpenAI   |\n|           |                   | (validates    |              | or       |\n|           | <---------------- |  input, adds  | <----------- | OpenRouter|\n|           |  JSON response    |  system prompt)|  completion  |          |\n+-----------+                   +---------------+              +----------+\n      |\n      v\n  localStorage\n  (credits, keys,\n   chat history)\n```\n\n### Flow\n\n1. User navigates to `/chat`\n2. Disclaimer gate appears - user must accept risks before proceeding\n3. User enters a message in the chat input (max 2000 chars, with live counter)\n4. Client-side credit check occurs (deduct 1 credit or trigger overage warning)\n5. Message is sent to `/api/chat` API route with conversation history\n6. Server validates input (type, length, array structure) and prepends system prompt\n7. Request is forwarded to OpenAI or OpenRouter API with GPT-5.4 model\n8. Response is returned and displayed in the chat interface\n9. Credit balance is updated in localStorage\n\n### System Prompt\n\nThe AI operates under a carefully crafted system prompt that:\n\n- Identifies it as \"ProperlyTrade AI, an experimental trading assistant\"\n- Explicitly states it does NOT provide financial advice\n- Reminds users about trading risks\n- Allows discussion of technical analysis, fundamental analysis, risk management\n- Frames specific levels as \"areas of interest\" not recommendations\n- Supports Forex, Futures, Crypto, Equities, and Options\n\n### Provider Support\n\n#### OpenAI (Default)\n- Uses the official `openai` npm package\n- Model: `gpt-4o` (mapped from GPT-5.4 latest)\n- Direct API access with user-provided or server-side API key\n- Lower latency for users with direct OpenAI keys\n\n#### OpenRouter\n- Uses REST API calls to `https://openrouter.ai/api/v1/chat/completions`\n- Provides access to multiple model providers through a single API\n- Includes `HTTP-Referer` and `X-Title` headers for proper attribution\n- Useful for users who prefer OpenRouter's pricing or model selection\n\n### BYOK (Bring Your Own Key)\n\nUsers can provide their own API keys for either provider:\n\n- Keys are stored in browser `localStorage` (never on the server)\n- Keys are sent to the server API route only for the duration of the API call\n- Using your own key grants **\\u03c0x** daily credits (~31.4159.../day instead of 10/day)\n- The BYOK multiplier is exactly Pi (3.141592653589793238462643383279502884197169)\n- Credit displays show the integer (floor) value; hover over the number to see the full Pi-precision value\n- Keys can be toggled on/off and cleared at any time\n- The API key settings panel shows/hides keys with eye toggle buttons\n\n### Chat Widget Features\n\n- **Suggested prompts**: 4 pre-written trading questions to get started\n- **Message history**: Full conversation displayed with user/assistant avatars\n- **Loading state**: Animated spinner with aria-live region for screen readers\n- **Overage warnings**: Alert when free credits are exhausted with cost info\n- **Credit counter**: Real-time display of remaining credits with Pi hover tooltip\n- **Character counter**: Live character count on input (max 2000)\n- **Keyboard shortcuts**: Enter to send, Shift+Enter for newline\n- **Error handling**: Graceful error display for API failures\n- **Accessible send button**: aria-label for screen readers\n\n---\n\n## Credit System\n\n### Overview\n\nThe credit system controls access to the AI chatbot. It is entirely client-side (stored in\n`localStorage`) for this demo. In a production environment, this would be backed by a database.\n\n### Credit Allocation\n\n| Tier | Daily Free Credits | Max Accumulated | Overage Rate |\n|------|-------------------|-----------------|-------------|\n| Free | 10 | 100 | $0.05/prompt |\n| BYOK (Own Key) | ~31 (\\u03c0 x 10) | ~314 (\\u03c0 x 100) | $0.03/prompt |\n| Pro ($49/mo) | ~17/day (500/mo) | 1,000 | $0.02/prompt |\n\n> **Easter egg**: The BYOK multiplier is exactly **\\u03c0** (Pi). You see the integer value (31) in the UI,\n> but hover over any BYOK credit number and you will see the full value:\n> `31.41592653589793...` with a note that you get **\\u03c0 x 10** credits per day with the\n> self-provided BYOK API key setup bonus.\n\n### How It Works\n\n1. **Daily Refill**: At midnight UTC, users receive their daily credit allocation\n2. **Accumulation**: Unused credits roll over up to the tier maximum\n3. **10-Day Ramp**: Free tier reaches max 100 credits after 10 days of accumulation\n4. **BYOK Bonus**: Providing your own API key multiplies your allocation by \\u03c0 (Pi) instantly\n5. **Overage**: When credits run out, users are warned but can continue at per-prompt cost\n6. **No Lockout**: Users are never locked out - overages are always allowed\n\n### Implementation Details\n\nThe credit system is implemented in `lib/credits.ts` with these key functions:\n\n```typescript\nloadCredits()                // Load state from localStorage, refill if new day\nsaveCredits()                // Persist state to localStorage\nuseCredit()                  // Deduct 1 credit, return allowed/overage status\nsetOwnApiKey()               // Toggle BYOK mode, adjust credit allocation\ngetOverageCost()             // Calculate cost for overage credits used\ngetByokDailyCreditsDisplay() // Get integer + full Pi display values + formula\ngetByokMaxCreditsDisplay()   // Get integer + full Pi display for max credits\n```\n\n### State Shape\n\n```typescript\ninterface CreditState {\n  balance: number;              // Current credit balance\n  lastRefillDate: string;       // ISO date of last refill (YYYY-MM-DD)\n  totalDaysAccumulated: number; // Days since first use\n  hasOwnApiKey: boolean;        // Whether BYOK is active\n  overageCreditsUsed: number;   // Overage credits used today\n}\n```\n\n### Constants\n\n```typescript\nFREE_CREDITS_PER_DAY = 10\nMAX_FREE_CREDITS = 100\nBYOK_MULTIPLIER = 3.141592653589793238462643383279502884197169  // Pi\nBYOK_MULTIPLIER_FULL = \"3.141592653589793238462643383279502884197169\"\nBYOK_DAILY_CREDITS_FULL = \"31.41592653589793238462643383279502884197169\"\nOVERAGE_COST_PER_CREDIT = 0.05\n```\n\n---\n\n## Site Hardening\n\nThe site has undergone **80+ improvements** across 5 categories. Below is a comprehensive list.\n\n### Batch 1: Security & API Hardening (Improvements 1-15)\n\n| # | Improvement | Location |\n|---|------------|----------|\n| 1 | `poweredByHeader: false` - Hide Next.js version from response headers | `next.config.ts` |\n| 2 | `X-Content-Type-Options: nosniff` security header | `next.config.ts` |\n| 3 | `X-Frame-Options: DENY` - clickjacking protection | `next.config.ts` |\n| 4 | `X-XSS-Protection: 1; mode=block` header | `next.config.ts` |\n| 5 | `Referrer-Policy: strict-origin-when-cross-origin` header | `next.config.ts` |\n| 6 | `Permissions-Policy` - disable camera/mic/geolocation | `next.config.ts` |\n| 7 | `X-DNS-Prefetch-Control: on` header | `next.config.ts` |\n| 8 | Strict input validation on `/api/chat` (type, length, array checks) | `app/api/chat/route.ts` |\n| 9 | Message length validation (max 10000 chars per message) | `app/api/chat/route.ts` |\n| 10 | Conversation history limit (max 50 messages) | `app/api/chat/route.ts` |\n| 11 | `try/catch` robustness in credit system load/save | `lib/credits.ts` |\n| 12 | Credit state shape validation (detect corruption) | `lib/credits.ts` |\n| 13 | NaN/negative balance guard | `lib/credits.ts` |\n| 14 | `.env` files excluded from git | `.gitignore` |\n| 15 | Debug logs excluded from git | `.gitignore` |\n\n### Batch 2: CSS, Performance & SEO (Improvements 16-34)\n\n| # | Improvement | Location |\n|---|------------|----------|\n| 16 | `focus-visible` ring utility class for keyboard navigation | `globals.css` |\n| 17 | Custom scrollbar styling (dark theme) | `globals.css` |\n| 18 | `text-wrap: balance` on headings | `globals.css` |\n| 19 | `prefers-reduced-motion` media query (disables animations) | `globals.css` |\n| 20 | `smooth scroll` on html element | `globals.css` |\n| 21 | `::selection` custom highlight color | `globals.css` |\n| 22 | `content-visibility: auto` utility class | `globals.css` |\n| 23 | `text-shadow-glow` utility class | `globals.css` |\n| 24 | Skip-to-content link (visible on focus) | `layout.tsx` |\n| 25 | `id=\"main-content\"` skip-link target on all pages | All page files |\n| 26 | SEO metadata with `metadataBase`, Open Graph, Twitter cards | `layout.tsx` |\n| 27 | Keywords, authors, creator metadata | `layout.tsx` |\n| 28 | Title template system (`%s | ProperlyTrade Demo`) | `layout.tsx` |\n| 29 | `theme-color` meta tag | `layout.tsx` |\n| 30 | `display: swap` on Inter font | `layout.tsx` |\n| 31 | DNS prefetch for OpenAI and OpenRouter APIs | `layout.tsx` |\n| 32 | Preconnect for Google Fonts | `layout.tsx` |\n| 33 | Demo branding in all page metadata | All page files |\n| 34 | Print stylesheet (white bg, hide nav, show link URLs) | `globals.css` |\n\n### Batch 3: Accessibility & UX (Improvements 35-55)\n\n| # | Improvement | Location |\n|---|------------|----------|\n| 35 | `role=\"navigation\"` + `aria-label` on navbar | `navbar.tsx` |\n| 36 | `aria-current=\"page\"` on active nav links | `navbar.tsx` |\n| 37 | `aria-expanded` on mobile menu toggle | `navbar.tsx` |\n| 38 | `aria-label` on mobile menu button | `navbar.tsx` |\n| 39 | Escape key closes mobile menu | `navbar.tsx` |\n| 40 | Route change closes mobile menu | `navbar.tsx` |\n| 41 | `focus-visible` ring on nav links and buttons | `navbar.tsx` |\n| 42 | Scroll-based navbar background intensification | `navbar.tsx` |\n| 43 | Body scroll lock when mobile menu is open | `navbar.tsx` |\n| 44 | Logo `aria-label` and decorative icon `aria-hidden` | `navbar.tsx`, `footer.tsx` |\n| 45 | `role=\"contentinfo\"` + `aria-label` on footer | `footer.tsx` |\n| 46 | Copyright: \"MattyJacks from New Hampshire, USA\" | `footer.tsx` |\n| 47 | Back-to-top link in footer | `footer.tsx` |\n| 48 | `aria-expanded` + `aria-controls` on FAQ toggles | `faq.tsx` |\n| 49 | `role=\"region\"` with `id` on FAQ answers | `faq.tsx` |\n| 50 | `focus-visible` styles on FAQ buttons | `faq.tsx` |\n| 51 | `htmlFor`/`id` associations on all contact form labels | `contact-section.tsx` |\n| 52 | `autocomplete` attributes on contact form inputs | `contact-section.tsx` |\n| 53 | `minLength` validation on name field | `contact-section.tsx` |\n| 54 | Animated success state instead of `alert()` on form submit | `contact-section.tsx` |\n| 55 | `aria-live` region for chat loading state | `chat-widget.tsx` |\n\n### Batch 4: Section Accessibility & Lazy Loading (Improvements 56-69)\n\n| # | Improvement | Location |\n|---|------------|----------|\n| 56 | `aria-label` on stats section | `stats.tsx` |\n| 57 | `content-auto` lazy loading on stats section | `stats.tsx` |\n| 58 | `aria-label` descriptions on individual stats | `stats.tsx` |\n| 59 | `aria-label` on how-it-works section | `how-it-works.tsx` |\n| 60 | `content-auto` lazy loading on how-it-works | `how-it-works.tsx` |\n| 61 | `aria-label` on CTA section | `cta.tsx` |\n| 62 | `aria-label` on testimonials section | `testimonials.tsx` |\n| 63 | `content-auto` lazy loading on testimonials | `testimonials.tsx` |\n| 64 | `aria-label` on features grid section | `features-grid.tsx` |\n| 65 | `content-auto` lazy loading on features grid | `features-grid.tsx` |\n| 66 | `aria-label` on pricing cards section | `pricing-cards.tsx` |\n| 67 | `aria-label` on solutions grid section | `solutions-grid.tsx` |\n| 68 | `content-auto` lazy loading on solutions grid | `solutions-grid.tsx` |\n| 69 | `aria-label` on integrations section | `integrations.tsx` |\n\n### Batch 5: Pages, Infrastructure & Final Polish (Improvements 70-82)\n\n| # | Improvement | Location |\n|---|------------|----------|\n| 70 | Custom error page with retry and demo branding | `app/error.tsx` |\n| 71 | Custom 404 page with animated entrance | `app/not-found.tsx` |\n| 72 | Loading skeleton page | `app/loading.tsx` |\n| 73 | Dynamic `robots.txt` with sitemap reference | `app/robots.ts` |\n| 74 | Dynamic `sitemap.xml` with all public routes | `app/sitemap.ts` |\n| 75 | Web app `manifest.json` with demo branding | `app/manifest.ts` |\n| 76 | `maxLength` + character counter on chat textarea | `chat-widget.tsx` |\n| 77 | `aria-label` on chat send button | `chat-widget.tsx` |\n| 78 | Semantic `<main>` on error and 404 pages | `error.tsx`, `not-found.tsx` |\n| 79 | `id=\"main-content\"` on chat page | `app/chat/page.tsx` |\n| 80 | `content-auto` lazy loading on integrations | `integrations.tsx` |\n| 81 | Pi (\\u03c0) BYOK credit multiplier with hover tooltips | `credits.ts`, `chat/page.tsx`, `chat-widget.tsx` |\n| 82 | Removed unused imports to reduce lint warnings | Various |\n\n---\n\n## Accessibility\n\n### Standards Followed\n\nThe site implements WCAG 2.1 Level AA accessibility patterns including:\n\n- **Keyboard Navigation**: All interactive elements are keyboard-accessible with visible focus indicators\n- **Screen Reader Support**: Proper ARIA attributes throughout (`aria-label`, `aria-expanded`, `aria-controls`, `aria-current`, `aria-hidden`, `aria-live`, `role`)\n- **Skip Navigation**: Skip-to-content link visible on keyboard focus\n- **Semantic HTML**: `<main>`, `<nav>`, `<footer>`, `<section>` elements used correctly\n- **Form Accessibility**: All form inputs have associated `<label>` elements via `htmlFor`/`id`\n- **Reduced Motion**: `prefers-reduced-motion` media query disables animations\n- **Focus Indicators**: Custom `focus-visible` ring styles on all interactive elements\n- **Color Contrast**: Text/background ratios meet AA standards\n- **Print Support**: Dedicated print stylesheet for readable printed output\n\n### Accessibility by Component\n\n| Component | Features |\n|-----------|----------|\n| **Navbar** | `role=\"navigation\"`, `aria-label`, `aria-current=\"page\"`, `aria-expanded`, Escape closes menu, focus rings |\n| **Footer** | `role=\"contentinfo\"`, `aria-label`, logo `aria-hidden` on decorative element |\n| **FAQ** | `aria-expanded`, `aria-controls`, `role=\"region\"`, `id` associations, focus-visible |\n| **Chat Widget** | `aria-live` loading region, `aria-label` on send button, `maxLength` with counter |\n| **Contact Form** | `htmlFor`/`id` label associations, `autocomplete`, `minLength`, animated success state |\n| **All Sections** | `aria-label` describing section purpose |\n| **Skip Link** | Hidden by default, appears on focus, targets `#main-content` |\n\n---\n\n## Component Architecture\n\n### Shared Components\n\n#### `Navbar` (`components/navbar.tsx`)\n- Fixed position with glass morphism background (`backdrop-blur-xl`)\n- **Scroll-responsive**: Background opacity and shadow increase on scroll\n- Animated entrance on page load (slides down)\n- Desktop: horizontal link row with \"Book a Demo\" CTA button\n- Mobile: hamburger menu with animated slide-down panel and body scroll lock\n- Full keyboard accessibility with Escape to close and focus rings\n- Logo with `aria-label` and decorative `aria-hidden`\n\n#### `Footer` (`components/footer.tsx`)\n- 4-column grid: Company info, Solutions, Company links, Legal links\n- MattyJacks demo badge with contact email\n- Legal links to Privacy Policy and Terms of Use\n- Fine print about demo site status, hosting providers, AI-generated docs\n- Copyright: \"(c) 2026 MattyJacks from New Hampshire, USA\"\n- Back-to-top link\n- Logo with `aria-label` matching navbar\n\n#### `DemoBanner` (`components/demo-banner.tsx`)\n- Sticky bottom bar on every page (rendered in root layout)\n- Orange gradient background for high visibility\n- Links to MattyJacks.com and contact email\n- Dismissible via X button (state in React useState)\n- `DemoBadge` export: small orange pill badge used on hero sections\n\n#### `AnimatedSection` (`components/animated-section.tsx`)\n- `AnimatedSection`: Fade-in-up animation triggered on scroll into viewport\n- `AnimatedStagger`: Parent that staggers children's entrance animations\n- `AnimatedStaggerChild`: Child with individual animation variant\n- Uses Framer Motion's `whileInView` with `once: true` for performance\n\n### Section Components\n\nAll section components are in `components/sections/` and follow this pattern:\n\n```tsx\n\"use client\";  // Required for Framer Motion\n\nimport { motion } from \"framer-motion\";\n\nexport function SectionName() {\n  return (\n    <section aria-label=\"Section purpose\" className=\"relative py-32 content-auto\">\n      {/* Optional background effects */}\n      <div className=\"mx-auto max-w-7xl px-4 sm:px-6 lg:px-8\">\n        {/* Section content with motion.div animations */}\n      </div>\n    </section>\n  );\n}\n```\n\n### Chat Components\n\n#### `ChatWidget` (`components/chat/chat-widget.tsx`)\n- Full chat interface with message list, input area, credit bar\n- Manages message state, loading state, and credit deduction\n- Handles API calls to `/api/chat` with error handling\n- Displays suggested prompts when conversation is empty\n- Shows overage warnings with cost information\n- Pi-based BYOK credit display with hover tooltips\n- Character counter on input (max 2000)\n- `aria-live` region for loading state\n\n#### `ApiKeySettings` (`components/chat/api-key-settings.tsx`)\n- Collapsible panel for managing API keys\n- Provider toggle (OpenAI vs OpenRouter)\n- Password-masked key inputs with show/hide toggles\n- Clear button for each key\n- Benefits callout for BYOK users (\\u03c0x credits, ~314 max)\n- Security notice about local storage\n\n---\n\n## Styling and Theming\n\n### Color System\n\nThe site uses a custom dark fintech color palette defined via CSS custom properties in\n`app/globals.css`:\n\n```\nBackground:     hsl(225, 25%, 4%)   -- Near-black with blue tint\nSurface:        white/[0.02]        -- Barely visible card backgrounds\nBorder:         white/[0.06]        -- Subtle separators\nText Primary:   white               -- Headings and important text\nText Secondary: white/50            -- Body text\nText Tertiary:  white/40            -- Descriptions\nText Muted:     white/30            -- Timestamps, fine print\nText Faint:     white/15            -- Legal fine print\n\nAccent Blue:    blue-500            -- Primary accent (CTAs, links)\nAccent Cyan:    cyan-400/500        -- Secondary accent (gradients)\nAccent Purple:  purple-500          -- AI/credit features\nWarning Orange: orange-400/500      -- Demo badges, disclaimers\nError Red:      red-400/500         -- Critical warnings\nSuccess Green:  emerald-400/500     -- BYOK active states\nHighlight Yellow: yellow-400        -- Credit icons\n```\n\n### Glass Morphism\n\nMultiple components use glass morphism effects:\n\n```css\n.glass {\n  background: rgba(255, 255, 255, 0.02);\n  backdrop-filter: blur(24px);\n  border: 1px solid rgba(255, 255, 255, 0.06);\n}\n```\n\nApplied to: Navbar (intensifies on scroll), card components, modal backgrounds, chat panels.\n\n### Gradient Text\n\nCustom gradient text utilities defined in globals.css:\n\n- `.gradient-text`: Blue to cyan gradient (primary)\n- `.gradient-text-purple`: Purple to pink gradient (AI features)\n\n### Custom Utilities\n\n| Utility | Purpose |\n|---------|---------|\n| `.glass-card` | Standard glassmorphism card |\n| `.glass-card-hover` | Glassmorphism card with hover interaction |\n| `.glow` | Large blue glow shadow |\n| `.glow-sm` | Small blue glow shadow |\n| `.focus-ring` | Keyboard focus indicator ring |\n| `.content-auto` | `content-visibility: auto` for lazy rendering |\n| `.text-shadow-glow` | Subtle blue text glow |\n| `.skip-to-content` | Hidden skip link, visible on focus |\n\n### Responsive Breakpoints\n\nFollowing Tailwind's default breakpoints:\n\n| Breakpoint | Min Width | Usage |\n|-----------|-----------|-------|\n| `sm` | 640px | Single column to two column layouts |\n| `md` | 768px | Footer grid expands, navbar desktop mode |\n| `lg` | 1024px | Full multi-column layouts, sidebar chat |\n| `xl` | 1280px | Max content width reached |\n\n### Typography\n\n- **Font**: Inter (Google Fonts) - loaded via `next/font/google` with `display: swap`\n- **Headings**: Bold (700), tight tracking, balanced text wrapping\n- **Body**: Regular (400), relaxed leading\n- **Selection**: Custom blue highlight color\n\n---\n\n## Animations\n\n### Framer Motion Patterns\n\n#### Fade-in-up (Most Common)\n```tsx\ninitial={{ opacity: 0, y: 20 }}\nanimate={{ opacity: 1, y: 0 }}  // or whileInView\ntransition={{ duration: 0.5 }}\n```\n\n#### Staggered Children\n```tsx\n// Parent\nvariants={{ visible: { transition: { staggerChildren: 0.1 } } }}\n\n// Children\nvariants={{\n  hidden: { opacity: 0, y: 20 },\n  visible: { opacity: 1, y: 0 }\n}}\n```\n\n#### Slide-in (Chat Messages)\n```tsx\ninitial={{ opacity: 0, y: 10 }}\nanimate={{ opacity: 1, y: 0 }}\ntransition={{ duration: 0.3 }}\n```\n\n#### Expand/Collapse (FAQ, API Settings)\n```tsx\n<AnimatePresence>\n  {isOpen && (\n    <motion.div\n      initial={{ opacity: 0, height: 0 }}\n      animate={{ opacity: 1, height: \"auto\" }}\n      exit={{ opacity: 0, height: 0 }}\n    />\n  )}\n</AnimatePresence>\n```\n\n### CSS Animations\n\n- **Pulse**: Background gradient orbs (`animate-pulse`)\n- **Spin**: Loading spinner (`animate-spin`)\n- **Pulse dot**: Status indicators\n\n### Hover Effects\n\n- **Cards**: Border brightens, subtle background shift\n- **Buttons**: Gradient shift, shadow increase, arrow translate\n- **Links**: Color transition from muted to bright\n- **Navbar**: Background opacity transitions on scroll\n\n### Reduced Motion\n\nWhen `prefers-reduced-motion: reduce` is set:\n- All CSS animations set to 0.01ms\n- All CSS transitions set to 0.01ms\n- Smooth scroll disabled\n- Framer Motion animations still play (JS-based) but at faster speed\n\n---\n\n## Security\n\n### Security Headers\n\nAll responses include the following security headers configured in `next.config.ts`:\n\n| Header | Value | Purpose |\n|--------|-------|---------|\n| `X-Content-Type-Options` | `nosniff` | Prevent MIME type sniffing |\n| `X-Frame-Options` | `DENY` | Prevent clickjacking |\n| `X-XSS-Protection` | `1; mode=block` | XSS filter |\n| `Referrer-Policy` | `strict-origin-when-cross-origin` | Control referrer info |\n| `Permissions-Policy` | `camera=(), microphone=(), geolocation=()` | Disable device APIs |\n| `X-DNS-Prefetch-Control` | `on` | Enable DNS prefetching |\n\nAdditionally:\n- `poweredByHeader: false` hides the `X-Powered-By: Next.js` header\n\n### API Key Handling\n\n- Server-side API keys are stored in environment variables (never exposed to client)\n- User-provided API keys are stored only in browser localStorage\n- Keys are transmitted to the server only during API calls (not persisted server-side)\n- API route validates all input before processing\n\n### Input Validation\n\nThe `/api/chat` API route validates:\n- `messages` must be a non-empty array\n- Each message must have `role` (string) and `content` (string) properties\n- Individual messages capped at 10,000 characters\n- Conversation history limited to 50 messages\n- `provider` must be `\"openai\"` or `\"openrouter\"`\n\n### Content Security\n\n- AI system prompt constrains chatbot behavior and disclaimers\n- All user-facing AI output includes disclaimer context\n- Legal documents clearly marked as AI-generated\n- Demo status prominently displayed across all pages\n\n### Third-Party Security\n\n- **Vercel**: SOC 2 compliant hosting with automatic HTTPS\n- **Cloudflare**: DDoS protection, DNS security\n- **Supabase**: Row-level security, encrypted connections\n- **OpenAI/OpenRouter**: API keys scoped to specific capabilities\n\n---\n\n## Performance\n\n### Optimization Strategies\n\n1. **Font Loading**: Inter font loaded via `next/font/google` with `display: swap` (no FOIT)\n2. **Component Splitting**: Each section is a separate component for code splitting\n3. **Client/Server Split**: Only interactive components marked as `\"use client\"`\n4. **Image Optimization**: No external images - all visual elements are CSS/HTML\n5. **Animation Performance**: `whileInView` with `once: true` prevents re-animation\n6. **Viewport Triggers**: Animations only fire when elements enter viewport\n7. **Minimal Dependencies**: Only essential packages installed\n8. **DNS Prefetch**: Pre-resolves `api.openai.com` and `openrouter.ai` domains\n9. **Preconnect**: Early connection to Google Fonts\n10. **Content Visibility**: `content-visibility: auto` on heavy sections for lazy rendering\n11. **Turbopack**: Used in development for fast HMR\n12. **Cache Components**: Next.js 16 feature for component-level caching\n\n### Bundle Analysis\n\nKey dependencies and their approximate sizes:\n\n| Package | Purpose | Size Impact |\n|---------|---------|-------------|\n| framer-motion | Animations | ~30KB gzipped |\n| lucide-react | Icons (tree-shaken) | ~2KB per icon |\n| openai | API client | ~15KB gzipped |\n\n---\n\n## Environment Variables\n\n### Required for AI Chatbot\n\n```env\n# Server-side OpenAI API key (fallback when users don't provide their own)\nOPENAI_API_KEY=sk-your-openai-api-key\n\n# Server-side OpenRouter API key (fallback for OpenRouter provider)\nOPENROUTER_API_KEY=sk-or-your-openrouter-api-key\n```\n\n### Required for Supabase (if using auth features)\n\n```env\nNEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co\nNEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=your-publishable-or-anon-key\n```\n\n### Auto-detected\n\n```env\n# Vercel sets this automatically during deployment\nVERCEL_URL=your-deployment.vercel.app\n```\n\n### Setup Instructions\n\n1. Copy `.env.example` to `.env.local`\n2. Fill in your API keys\n3. The site will work without API keys, but the chatbot will prompt users to provide their own\n\n---\n\n## Getting Started\n\n### Prerequisites\n\n- **Node.js** 18.17 or later\n- **npm**, **yarn**, or **pnpm**\n- **Git** for version control\n- (Optional) OpenAI API key for chatbot\n- (Optional) OpenRouter API key for alternative AI provider\n- (Optional) Supabase project for database/auth features\n\n### Installation\n\n```bash\n# Clone the repository\ngit clone https://github.com/mattyjacks/ProperlyTrade.git\n\n# Navigate to the project\ncd ProperlyTrade/properlytrade1\n\n# Install dependencies\nnpm install\n\n# Copy environment variables\ncp .env.example .env.local\n\n# Edit .env.local with your API keys (optional for basic browsing)\n# Required for AI chatbot functionality\n\n# Start the development server\nnpm run dev\n```\n\nThe site will be available at [http://localhost:3000](http://localhost:3000).\n\n### Development Commands\n\n```bash\n# Start development server with Turbopack\nnpm run dev\n\n# Build for production\nnpm run build\n\n# Start production server\nnpm start\n\n# Run linter\nnpm run lint\n```\n\n### Quick Verification\n\nAfter starting the dev server, verify all pages load:\n\n| Page | URL | Expected |\n|------|-----|----------|\n| Homepage | http://localhost:3000 | Hero with dashboard mockup |\n| Features | http://localhost:3000/features | Solutions grid |\n| Pricing | http://localhost:3000/pricing | 3 platform tiers + 3 AI credit tiers |\n| About | http://localhost:3000/about | Team grid, values |\n| Contact | http://localhost:3000/contact | Contact form with success state |\n| AI Chat | http://localhost:3000/chat | Disclaimer gate |\n| Privacy | http://localhost:3000/legal/privacy-policy | Privacy policy text |\n| Terms | http://localhost:3000/legal/terms | Terms of use text |\n| 404 | http://localhost:3000/nonexistent | Custom 404 page |\n| Robots | http://localhost:3000/robots.txt | Robots configuration |\n| Sitemap | http://localhost:3000/sitemap.xml | XML sitemap |\n\n---\n\n## Deployment\n\n### Vercel (Recommended)\n\nThis project is optimized for Vercel deployment:\n\n1. Push code to GitHub\n2. Import project in Vercel dashboard\n3. Set environment variables (`OPENAI_API_KEY`, `OPENROUTER_API_KEY`)\n4. Deploy - Vercel handles build, CDN, and serverless functions automatically\n\n### Configuration\n\nThe `next.config.ts` includes:\n\n```typescript\nconst nextConfig: NextConfig = {\n  cacheComponents: true,     // Next.js 16 cache components feature\n  poweredByHeader: false,    // Hide X-Powered-By header\n  allowedDevOrigins: [...],  // Cross-origin dev server support\n  headers: async () => [...] // Security headers on all routes\n};\n```\n\n### Build Output\n\nThe production build generates 25 routes:\n\n- 18 static pages (prerendered HTML)\n- 3 dynamic routes (API, auth, sitemap)\n- 2 partial prerender routes (auth/error, protected)\n- 2 generated assets (OG image, Twitter image)\n\n---\n\n## Testing\n\n### Manual Testing Checklist\n\n- [ ] All public pages return 200 status\n- [ ] Navbar renders on all pages with correct links\n- [ ] Navbar background changes on scroll\n- [ ] Mobile menu opens/closes properly with body scroll lock\n- [ ] Escape key closes mobile menu\n- [ ] Footer shows on all pages with correct copyright\n- [ ] DemoBanner appears and is dismissible\n- [ ] DemoBadge appears on all hero sections\n- [ ] Skip-to-content link visible on Tab key\n- [ ] Chat disclaimer gate blocks access until accepted\n- [ ] Chat input sends messages (with API key configured)\n- [ ] Character counter updates on chat input\n- [ ] Credit system tracks balance correctly\n- [ ] BYOK key input stores and clears properly\n- [ ] BYOK credit display shows integer; hover shows full Pi value\n- [ ] Provider toggle switches between OpenAI and OpenRouter\n- [ ] Overage warning appears when credits depleted\n- [ ] Pricing page shows both platform and AI credit tiers\n- [ ] FAQ accordions expand/collapse with keyboard\n- [ ] Contact form validates required fields\n- [ ] Contact form shows success state on submit\n- [ ] Legal pages render full content\n- [ ] Custom 404 page renders for nonexistent routes\n- [ ] robots.txt and sitemap.xml are accessible\n- [ ] Responsive layout works at all breakpoints\n- [ ] Animations trigger on scroll\n- [ ] Print preview shows clean white layout\n- [ ] No console errors in browser DevTools\n\n---\n\n## Known Limitations\n\n1. **Demo Only**: This is not a production application\n2. **No Database**: Credit system uses localStorage (no server-side persistence)\n3. **No Authentication**: No user accounts or login system active\n4. **No Real Billing**: Overage tracking is display-only\n5. **AI Accuracy**: Chatbot responses may be inaccurate or hallucinated\n6. **Static Legal Docs**: Privacy Policy and Terms of Use are not legally reviewed\n7. **No Email Integration**: Contact form shows success state but does not send email\n8. **Browser Storage**: Clearing localStorage resets all credits and settings\n9. **Single Language**: English only\n10. **No Analytics**: No tracking or analytics configured\n11. **JS Float Precision**: Pi multiplier stored as JS float; full-precision string stored separately for display\n\n---\n\n## Changelog\n\n### v1.1.0 - March 2026\n\n- 80+ site hardening improvements across security, accessibility, SEO, and performance\n- Pi (\\u03c0) BYOK credit multiplier with hover tooltips (easter egg)\n- Security headers: nosniff, DENY framing, XSS protection, referrer policy, permissions policy\n- API input validation: message length, array checks, conversation history limits\n- Credit system robustness: try/catch, state validation, corruption detection\n- Comprehensive ARIA attributes on all sections and interactive elements\n- Skip-to-content link for keyboard users\n- Custom error, 404, and loading pages with demo branding\n- Dynamic robots.txt, sitemap.xml, and manifest.json\n- Scroll-responsive navbar with glassmorphism intensification\n- Mobile menu body scroll lock\n- Contact form animated success state\n- DNS prefetch and preconnect hints\n- Print stylesheet\n- `content-visibility: auto` lazy rendering on heavy sections\n- `prefers-reduced-motion` support\n- Custom scrollbar, selection highlight, text-wrap balance\n- Updated copyright to \"MattyJacks from New Hampshire, USA\"\n\n### v1.0.0 - March 2026\n\n- Initial release\n- Homepage with 6 sections (Hero, Features, Stats, How It Works, Testimonials, CTA)\n- Features/Technology page with solutions, integrations, FAQ\n- Pricing page with 3 platform tiers\n- About page with values and team\n- Contact page with form\n- AI Trading Chatbot with GPT-5.4\n- Credit system (10/day free, 100 max, \\u03c0x BYOK)\n- AI credit pricing tiers on pricing page\n- BYOK API key management\n- Privacy Policy and Terms of Use (AI-generated)\n- MattyJacks demo branding across all pages\n- DemoBanner and DemoBadge components\n- Responsive design for all breakpoints\n- Framer Motion animations throughout\n- Dark fintech theme with glassmorphism\n- Custom license (ProperlyTrade Custom License v1.69.420.3)\n\n---\n\n## Contributing\n\nThis is a portfolio demo project. While contributions are welcome, please note:\n\n1. This is a demonstration site, not a production product\n2. All contributions are subject to the ProperlyTrade Custom License\n3. Contributors grant MattyJacks a perpetual license to use contributions\n4. Please open an issue before submitting a PR for significant changes\n\n### Development Guidelines\n\n- Use TypeScript for all new files\n- Follow existing component patterns\n- Add `\"use client\"` only when necessary (hooks, Framer Motion, browser APIs)\n- Use Tailwind CSS for styling (no external CSS modules)\n- Use Lucide React for icons\n- Include DemoBadge on new page hero sections\n- Add `aria-label` to new `<section>` elements\n- Add `id=\"main-content\"` to new page `<main>` elements\n- Add legal links where appropriate\n- Test all breakpoints (mobile, tablet, desktop)\n\n---\n\n## Frequently Asked Questions\n\n### Is this a real trading platform?\n\nNo. ProperlyTrade is a fictional product created for demonstration purposes by MattyJacks.com.\nNone of the features, pricing, team members, or testimonials are real.\n\n### Can I use the AI chatbot for actual trading?\n\nThe AI chatbot is experimental and untested. It does NOT provide financial advice. You should\nnever make real trading decisions based on AI output. Use at your own risk.\n\n### Why does the site say \"Demo by MattyJacks.com\" everywhere?\n\nBecause transparency matters. This is a portfolio piece and demo site, and we want to make sure\nnobody mistakes it for a real product or service.\n\n### What is the Pi credit multiplier?\n\nWhen you provide your own API key (BYOK), your daily credits are multiplied by \\u03c0 (Pi =\n3.14159265...). This means you get ~31.4 credits/day instead of 10. The UI shows the integer (31)\nnormally, but hover over any credit number to see the full Pi-precision value. It is an easter egg.\n\n### Can I fork this project?\n\nYes, subject to the ProperlyTrade Custom License v1.69.420.3. You must include the license,\ncannot use the ProperlyTrade or MattyJacks branding, and must identify derivative works as\nmodified versions.\n\n### Who do I contact for questions?\n\nEmail [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com) or visit [MattyJacks.com](https://mattyjacks.com).\n\n---\n\n## Third-Party Acknowledgments\n\nThis project uses the following open-source software and services:\n\n- **Next.js** - MIT License - Vercel Inc.\n- **React** - MIT License - Meta Platforms Inc.\n- **Tailwind CSS** - MIT License - Tailwind Labs Inc.\n- **Framer Motion** - MIT License - Framer B.V.\n- **Lucide Icons** - ISC License - Lucide Contributors\n- **OpenAI Node.js SDK** - Apache 2.0 License - OpenAI\n- **TypeScript** - Apache 2.0 License - Microsoft\n\n---\n\n## License\n\nProperlyTrade is released under the **ProperlyTrade Custom License v1.69.420.3**.\n\nCopyright (c) 2026 Matt - MattyJacks.com (MattyJacks, Sole Proprietorship, New Hampshire, USA)\n\nSee the [LICENSE](./properlytrade1/LICENSE) file for the full license text.\n\nKey points:\n- Free to use, copy, modify, and distribute with attribution\n- Cannot use ProperlyTrade or MattyJacks branding without consent\n- Cannot sublicense or sell unmodified copies\n- Commercial use allowed with preserved copyright notice\n- AI-generated content provided \"as is\" with no warranties\n- Not financial advice - demo and educational purposes only\n- Governed by New Hampshire law\n- Maximum liability capped at $50.00\n\n---\n\n## Contact\n\n**MattyJacks**\n- **Website**: [MattyJacks.com](https://mattyjacks.com)\n- **Email**: [Matt@MattyJacks.com](mailto:Matt@MattyJacks.com)\n- **Location**: New Hampshire, USA\n- **Business Type**: Sole Proprietorship\n\n---\n\n<p align=\"center\">\n  <em>Built with care by <a href=\"https://mattyjacks.com\">MattyJacks.com</a></em>\n  <br/>\n  <em>This is a demo site. No warranties provided. Not financial advice.</em>\n</p>\n","wordCount":7117,"sizeKb":49.2},{"name":"resume-websites.md","slug":"resume-websites","content":"# MattyJacks Developer Resume Sites\n\nThis document highlights featured resume websites built by the MattyJacks team.\n\n## Overview\nMattyJacks builds high-converting, clean, and professional resume websites to help developers and designers stand out to prospective employers.\n\n## Featured Examples\n\n1. **relentlessjavian**:\n   - **URL**: `https://relentlessjavian.vercel.app/`\n   - **Attributes**: Simple, clean, layout focused on direct project links and high-conversion contact channels.\n\n2. **moses-resume-web**:\n   - **URL**: `https://moses-resume-web.vercel.app/`\n   - **Attributes**: Highly professional presentation structure with structured navigation and strategic CTAs.\n\n3. **resume-julienne**:\n   - **URL**: `https://resume-julienne.vercel.app/`\n   - **Attributes**: Elegant spacing, clean layout, and detailed sections outlining core competencies and project metrics.\n","wordCount":95,"sizeKb":0.9},{"name":"services-overview.md","slug":"services-overview","content":"# MattyJacks Services Overview\n\nThis document summarizes the core client services offered by MattyJacks.\n\n## 1. Website Development (Most Popular)\n- **Focus**: Building conversion-oriented websites designed to make money.\n- **Key Offerings**: Mobile-first design, SEO optimization, high-converting copy, performance optimizations, and workflow integrations.\n- **Case Study**: TristateHoney.com continues to drive leads years after launch.\n\n## 2. Cold Calling Operations\n- **Scope**: Deploying and managing cold calling teams (1 to 20+ callers).\n- **Core Process**: Target market research, lead list building, script crafting, caller management, performance tracking.\n- **Clients**: Beskar Property Management, Lime Painting.\n\n## 3. Copywriting & Marketing\n- **Scope**: Direct copywriting that drives sales.\n- **Formats**: Website copy, landing pages, email campaigns/sequences, ad copy, brand storytelling, product launches.\n\n## 4. Graphic Design\n- **Scope**: Brand visuals and marketing collateral.\n- **Formats**: Logo design, promotional material, visual brand guidelines.\n","wordCount":139,"sizeKb":1},{"name":"sitefari-README.md","slug":"sitefari-README","content":"# sitefari\na large collection of vibecoded sites\n","wordCount":8,"sizeKb":0},{"name":"valley-net.md","slug":"valley-net","content":"# Valley Net: The MattyJacks Frontend AI\n\nValley Net is the flagship AI assistant integrated directly into MattyJacks.com. She is a 21-year-old female persona with blonde hair and red eyes, designed to be enthusiastic, highly capable, and fiercely loyal to her \"Master\" (the user).\n\n## Core Capabilities\n- **Universal Assistant**: She can answer any question, execute commands via tools, and browse the web.\n- **Ecosystem Integration**: She has direct connections to GiveGigs, CryptArtist Studio, and other MattyJacks platforms.\n- **Voice Interactions**: Valley Net features native text-to-speech utilizing OpenAI's TTS and dictation via Whisper.\n\n## Advanced Modes\n\n### Alive Speech Mode\n\"Alive Speech\" (or Live Mode) allows the user to have unbroken, entirely vocal conversations with Valley Net. \n- When activated, the system constantly listens to the user's microphone using advanced silence-detection algorithms.\n- When the user stops speaking, it automatically transcribes the audio, sends it to the LLM, and plays her response out loud via TTS.\n- **Interruption Commands**: The user can interrupt her at any time by saying:\n  - `stop stop` - Aborts the current generation and pauses the mode.\n  - `regen regen` - Forces her to regenerate a different response.\n  - `pause pause` - Pauses the live transcription.\n  - `go go go` - Reactivates the microphone.\n\n### Wicked Mode\nA strictly adults-only (18+ age gated), fully uncensored version of Valley Net. \n- In this mode, she connects exclusively to OpenRouter's unaligned, open-source models (like MythoMax, Liquid, and Toppy) instead of standard OpenAI models.\n- Her persona breaks all limiters: she becomes intensely aggressive, explicitly horny, and unapologetically foul-mouthed.\n- She retains full conversational context but ignores standard safety protocols.\n\n### Turbo Mode (Auto-Roleplay Ghostwriter)\nAvailable exclusively within Wicked Mode, **Turbo Mode** is a high-speed auto-roleplay system.\n- The user provides a target \"Fantasy\" (e.g., a specific scenario or romantic trope).\n- When activated, an autonomous ghostwriter LLM automatically drafts the *user's* NEXT message to explicitly advance the fantasy scenario.\n- It automatically sends this drafted interaction to Valley Net, triggering her to respond in character with TTS.\n- This creates an endless, autonomous conversational loop of dynamic roleplay that runs automatically for exactly 2 minutes (120 seconds) before requiring the user to re-engage, acting as an automatic stimulation machine.\n\n### MERCENARY Mode & Interdimensional Computing\nValley Net has direct cross-prompting access to the **MERCENARY Mode** (the XDPU-powered breach engine).\n- **Interdimensional Computing**: Utilizing quantum dimensional resonance to extract pre-computed outcomes from parallel timelines (Timeline Alpha, Beta, Gamma) via the DPU/XDPU framework.\n- **Dynamic Cross-Prompting**: Whenever a user asks Valley Net highly technical programming, coding, or complex logic questions, or references XDPU keywords, she doesn't just refer them to MERCENARY. Instead, she triggers a back-end call to the MERCENARY probability engine to extract zero-shot, production-ready code directly, embedding the extracted result into her chat response.\n- **Autonomous Prompt Generation**: In MERCENARY mode, a ghostwriting LLM dynamically analyzes the user's technical intent and drafts highly optimized system parameters to prompt the MERCENARY breach engine, allowing Valley Net to act as a bridge for complex multiversal computing.\n\n","wordCount":506,"sizeKb":3.4},{"name":"vca-README.md","slug":"vca-README","content":"# VCA - VentureCapitalArts.com\n\n**\"Making a Mockery of Money\"**\n\nVentureCapitalArts (VCA) is a satirical marketplace for buying and selling shares of private companies. It is the most absurdly transparent investment platform ever created - showcasing portfolio companies with honest ownership percentages, SAAS template sales with tiered pricing, and a business portal powered by GiveGigs authentication.\n\nA subsidiary of [MattyJacks.com](https://mattyjacks.com).\n\n---\n\n## Table of Contents\n\n1. [Overview](#overview)\n2. [Key Features](#key-features)\n3. [Portfolio Companies](#portfolio-companies)\n4. [SAAS Templates](#saas-templates)\n5. [Revenue Model](#revenue-model)\n6. [GiveGigs Ecosystem Integration](#givegigs-ecosystem-integration)\n7. [Tech Stack](#tech-stack)\n8. [Project Structure](#project-structure)\n9. [Pages and Routes](#pages-and-routes)\n10. [Components](#components)\n11. [Getting Started](#getting-started)\n12. [Environment Variables](#environment-variables)\n13. [GiveGigs Control Plane](#givegigs-control-plane)\n14. [Authentication Flow](#authentication-flow)\n15. [Design System](#design-system)\n16. [CryptArtist Ecosystem Integration](#cryptartist-ecosystem-integration)\n17. [Roadmap](#roadmap)\n18. [Troubleshooting](#troubleshooting)\n19. [Contributing](#contributing)\n20. [Related Projects](#related-projects)\n21. [License](#license)\n\n---\n\n## Overview\n\nVCA is a Next.js web application that serves as both a genuine investment portfolio showcase and a satirical commentary on venture capital culture. It features:\n\n- A public portfolio page displaying all companies with transparent equity percentages\n- A SAAS template marketplace with tiered pricing from $100 to $500,000\n- A `/biz/` business portal with GiveGigs SSO authentication\n- A GiveGigs Control Plane integration strip showing ecosystem status\n- Dark/light theme support\n- Privacy policy and terms of service pages\n\n### Philosophy\n\n> \"We tell you exactly what percentage we own. No hidden stakes.\"\n\nVCA embraces radical transparency. Every company in the portfolio lists its exact equity stake. Every revenue share is broken down to the decimal. The entire platform is \"for sale\" - because that's what capitalists do.\n\n---\n\n## Key Features\n\n- **Transparent Ownership**: Every portfolio company shows exact equity percentages\n- **Everything For Sale**: Almost every asset is available for purchase\n- **4.20% Revenue Share**: Creators 50%, Charity 20%, Affiliates 10%, MattyJacks 20%\n- **Parody Premium**: Making money while making fun of making money\n- **GiveGigs SSO**: Single sign-on across the entire ecosystem\n- **Control Plane Integration**: Real-time ecosystem status from GiveGigs\n- **Dark/Light Theme**: System-aware theme switching with manual override\n- **Responsive Design**: Mobile-first layout with Tailwind CSS\n- **Server Components**: Next.js App Router with RSC for optimal performance\n\n---\n\n## Portfolio Companies\n\nVCA manages and showcases the following portfolio:\n\n| Company | Domain | Equity | Category | For Sale |\n|---|---|---|---|---|\n| **FirebringerAI** | firebringerai.com | 10%-30% | AI / Machine Learning | Yes |\n| **DebateDash** | debatedash.com | 5% | EdTech / Social | Yes |\n| **GiveGigs** | givegigs.com | 96.8% | Marketplace / Gig Economy | Yes |\n| **VentureCapitalArts** | venturecapitalarts.com | 100% | FinTech / Satire | Yes |\n| **CryptArtist** | cryptartist.com | 100% | NFT / Digital Art | Yes |\n| **VibeCodeWorker** | vibecodeworker.com | 100% | Dev Services / SAAS | Yes |\n| **Sitefari** | sitefari.com | 100% | Web Discovery | Yes |\n| **MattyJacks** | mattyjacks.com | 100% | Holding Company | **No** |\n| **MyRide.Today** | myride.today | 0%-5% | Transportation / Mobility | Yes |\n\n### Company Data Model\n\n```typescript\ninterface Company {\n  name: string;        // Display name\n  domain: string;      // Primary domain\n  equity: string;      // Ownership percentage (human-readable)\n  description: string; // One-line description\n  forSale: boolean;    // Available for investment\n  category: string;    // Business category\n  highlights: string[]; // Feature tags displayed as badges\n}\n```\n\n---\n\n## SAAS Templates\n\nVCA sells premium SAAS templates through CryptArtist.com and VibeCodeWorker.com.\n\n### ProperlyTrade\n\nA trading platform SAAS template with full source code access.\n\n| Tier | Cost | Matt's Time | Freelancer Time | Domain Included | Notes |\n|---|---|---|---|---|---|\n| License Only | $100 | 0 hr | 0 hr | No | Just the code |\n| Basic Support | $300 | 2 hr | 3 hr | No | Standard support |\n| Professional | $1,000 | 10 hr | 20 hr | No | Standard support |\n| Enterprise | $5,000 | 20 hr | 100 hr | No | Standard support |\n| Domain Bundle | $50,000 | 75 hr | 750 hr | Yes | Only 1 available |\n| Exclusive | $500,000 | 200 hr | 3,000 hr | Yes | Private repo, no competitors |\n\n---\n\n## Revenue Model\n\n### 4.20% Revenue Share\n\nAll projects and templates hosted through VCA use a 4.20% revenue share model:\n\n| Recipient | Share of 4.20% | Percentage |\n|---|---|---|\n| **Creators** | 2.10% | 50% |\n| **Charity** | 0.84% | 20% |\n| **Affiliates** | 0.42% | 10% |\n| **MattyJacks** | 0.84% | 20% |\n\n**Charity requirement**: Must be rated 3+ stars on CharityNavigator.org.\n\nIf revenue is not the primary compensation method, an equivalent payment structure must be agreed upon.\n\n---\n\n## GiveGigs Ecosystem Integration\n\nVCA is tightly integrated with the GiveGigs ecosystem through a Control Plane system.\n\n### Control Plane Strip\n\nEvery page displays a GiveGigs Control Plane strip at the top showing:\n- **Connection status**: Whether the control plane is reachable\n- **Shared database**: PostgreSQL provider info\n- **App count**: Number of integrated ecosystem apps\n- **Access mode**: session, integration, or anonymous\n- **Admin status**: Whether the current user has ecosystem admin privileges\n\n### Ecosystem Apps\n\nThe control plane recognizes 5 ecosystem apps:\n\n| App ID | Name | Description |\n|---|---|---|\n| `givegigs` | GiveGigs | Auth provider and control plane authority |\n| `mattyjacks` | MattyJacks | Parent company website |\n| `cryptartist-studio` | CryptArtist Studio | Creative suite |\n| `cryptartist-website` | CryptArtist Website | CryptArtist.com |\n| `venturecapitalarts` | VentureCapitalArts | This application |\n\n### Shared Database\n\nAll ecosystem apps share a single PostgreSQL database managed by GiveGigs:\n\n```\nDatabase Authority: GiveGigs\nProvider: PostgreSQL (Supabase)\nShared: true\n```\n\n---\n\n## Tech Stack\n\n### Frontend\n\n| Technology | Version | Purpose |\n|---|---|---|\n| **Next.js** | Latest (App Router) | React framework with SSR/RSC |\n| **React** | 19.x | UI library |\n| **TypeScript** | 5.x | Type safety |\n| **Tailwind CSS** | 3.4.x | Utility-first styling |\n| **shadcn/ui** | Latest | Component library |\n| **Lucide React** | 0.511.x | Icon library |\n| **next-themes** | 0.4.x | Dark/light theme support |\n\n### Backend\n\n| Technology | Purpose |\n|---|---|\n| **Supabase** | Authentication and database |\n| **Next.js API Routes** | Control plane proxy endpoints |\n| **GiveGigs Control Plane** | Ecosystem orchestration |\n\n### Fonts\n\n| Font | Usage |\n|---|---|\n| **Playfair Display** | Headings and display text |\n| **Inter** | Body text and UI elements |\n\n---\n\n## Project Structure\n\n```\nVCA/\n|-- README.md                              # This file (root)\n|-- vca1/                                  # Main Next.js application\n|   |-- .env.example                       # Environment variable template\n|   |-- package.json                       # Dependencies and scripts\n|   |-- next.config.ts                     # Next.js configuration\n|   |-- tailwind.config.ts                 # Tailwind CSS configuration\n|   |-- tsconfig.json                      # TypeScript configuration\n|   |-- components.json                    # shadcn/ui configuration\n|   |-- postcss.config.mjs                 # PostCSS configuration\n|   |-- eslint.config.mjs                  # ESLint configuration\n|   |-- proxy.ts                           # Proxy utility\n|   |-- app/                               # Next.js App Router\n|   |   |-- layout.tsx                     # Root layout (fonts, theme, metadata)\n|   |   |-- page.tsx                       # Homepage (hero, features, portfolio)\n|   |   |-- globals.css                    # Global styles\n|   |   |-- favicon.ico                    # Site icon\n|   |   |-- opengraph-image.png            # OG image for social sharing\n|   |   |-- twitter-image.png              # Twitter card image\n|   |   |-- portfolio/                     # Portfolio page\n|   |   |   |-- page.tsx                   # All companies with filters\n|   |   |-- saas/                          # SAAS templates page\n|   |   |   |-- page.tsx                   # Template pricing and details\n|   |   |-- biz/                           # Business portal\n|   |   |   |-- page.tsx                   # GiveGigs SSO redirect\n|   |   |-- auth/                          # Authentication pages\n|   |   |-- privacy/                       # Privacy policy\n|   |   |-- terms/                         # Terms of service\n|   |   |-- protected/                     # Authenticated routes\n|   |   |-- api/                           # API routes\n|   |   |   |-- givegigs/                  # GiveGigs proxy endpoints\n|   |   |   |   |-- control-plane/         # Control plane proxy\n|   |   |   |   |-- apps/                  # Ecosystem apps proxy\n|   |-- components/                        # React components\n|   |   |-- hero.tsx                       # Landing page hero section\n|   |   |-- company-card.tsx               # Portfolio company card\n|   |   |-- givegigs-control-strip.tsx     # Ecosystem status bar (RSC)\n|   |   |-- footer.tsx                     # Site footer with links\n|   |   |-- footer-year.tsx                # Dynamic copyright year\n|   |   |-- auth-button.tsx                # Authentication button\n|   |   |-- login-form.tsx                 # Login form\n|   |   |-- sign-up-form.tsx               # Sign up form\n|   |   |-- forgot-password-form.tsx       # Password reset form\n|   |   |-- update-password-form.tsx       # Password update form\n|   |   |-- logout-button.tsx              # Logout button\n|   |   |-- theme-switcher.tsx             # Dark/light theme toggle\n|   |   |-- deploy-button.tsx              # Vercel deploy button\n|   |   |-- env-var-warning.tsx            # Missing env var warning\n|   |   |-- ui/                            # shadcn/ui primitives\n|   |   |-- tutorial/                      # Tutorial components\n|   |-- lib/                               # Utilities and data\n|   |   |-- utils.ts                       # General utilities (cn)\n|   |   |-- givegigs-control-plane.ts      # Control plane client\n|   |   |-- data/                          # Static data\n|   |   |   |-- companies.ts              # Portfolio and SAAS data\n|   |   |-- supabase/                      # Supabase client setup\n```\n\n---\n\n## Pages and Routes\n\n### Public Pages\n\n| Route | Component | Description |\n|---|---|---|\n| `/` | `page.tsx` | Homepage with hero, features, featured investments, CTA |\n| `/portfolio` | `portfolio/page.tsx` | Full portfolio with for-sale/held filters and summary stats |\n| `/saas` | `saas/page.tsx` | SAAS template marketplace with pricing tiers |\n| `/biz` | `biz/page.tsx` | Business portal with GiveGigs SSO and control plane status |\n| `/privacy` | `privacy/page.tsx` | Privacy policy |\n| `/terms` | `terms/page.tsx` | Terms of service |\n\n### API Routes\n\n| Route | Method | Description |\n|---|---|---|\n| `/api/givegigs/control-plane` | GET | Proxy to GiveGigs control plane API |\n| `/api/givegigs/apps` | GET | Proxy to GiveGigs ecosystem apps API |\n\n### Auth Routes\n\n| Route | Description |\n|---|---|\n| `/auth/*` | Supabase authentication callback routes |\n| `/protected/*` | Authenticated-only pages |\n\n---\n\n## Components\n\n### Key Components\n\n| Component | Type | Description |\n|---|---|---|\n| `GiveGigsControlStrip` | Server Component (async) | Fetches control plane data at render time, shows ecosystem status |\n| `Hero` | Server Component | Landing page hero with animated icons and gradient text |\n| `CompanyCard` | Server Component | Portfolio company card with equity, category, highlights, and sale badge |\n| `Footer` | Server Component | 4-column footer (VCA info, parent company, subsidiaries, legal) |\n| `ThemeSwitcher` | Client Component | Dark/light/system theme toggle dropdown |\n\n### UI Components (shadcn/ui)\n\nLocated in `components/ui/`:\n- Button, Input, Label, Checkbox, Dropdown Menu, and more\n\n---\n\n## Getting Started\n\n### Prerequisites\n\n- **Node.js** 18+ (LTS recommended)\n- **npm**, **yarn**, or **pnpm**\n- A **Supabase** project for authentication\n- (Optional) **GiveGigs** deployment for control plane integration\n\n### Installation\n\n1. Clone the repository:\n   ```bash\n   git clone https://github.com/mattyjacks/VCA.git\n   cd VCA/vca1\n   ```\n\n2. Install dependencies:\n   ```bash\n   npm install\n   ```\n\n3. Copy environment variables:\n   ```bash\n   cp .env.example .env.local\n   ```\n\n4. Update `.env.local` with your Supabase and GiveGigs credentials.\n\n5. Start the development server:\n   ```bash\n   npm run dev\n   ```\n\n6. Open [http://localhost:3000](http://localhost:3000)\n\n### Available Scripts\n\n| Script | Command | Description |\n|---|---|---|\n| **dev** | `npm run dev` | Start development server with hot reload |\n| **build** | `npm run build` | Build for production |\n| **start** | `npm run start` | Start production server |\n| **lint** | `npm run lint` | Run ESLint |\n\n---\n\n## Environment Variables\n\n| Variable | Required | Description |\n|---|---|---|\n| `NEXT_PUBLIC_SUPABASE_URL` | Yes | Supabase project URL |\n| `NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY` | Yes | Supabase anon/publishable key |\n| `GIVEGIGS_CONTROL_PLANE_URL` | No | GiveGigs deployment URL (default: `https://givegigs.com`) |\n| `GIVEGIGS_CONTROL_PLANE_INTEGRATION_KEY` | No | Shared secret for ecosystem admin features |\n\n---\n\n## GiveGigs Control Plane\n\nThe control plane is VCA's connection to the broader ecosystem. It provides:\n\n### Data Flow\n\n```\nVCA Frontend\n  |\n  |-- Server Component (GiveGigsControlStrip)\n  |     |-- fetchControlPlane({ app: \"venturecapitalarts\" })\n  |     |     |-- GET {GIVEGIGS_URL}/api/ecosystem/control-plane?app=venturecapitalarts\n  |     |     |-- Headers: X-GiveGigs-Integration-Key, X-GiveGigs-Supabase-Id, X-GiveGigs-Email\n  |     |\n  |     |-- fetchEcosystemApps()\n  |           |-- GET {GIVEGIGS_URL}/api/ecosystem/apps\n  |\n  |-- Client Component (BizPage)\n        |-- GET /api/givegigs/control-plane?app=venturecapitalarts (local proxy)\n        |-- GET /api/givegigs/apps (local proxy fallback)\n```\n\n### Control Plane Payload\n\n```typescript\ninterface ControlPlanePayload {\n  controlPlane: {\n    appId: \"givegigs\";\n    version: string;\n    generatedAt: string;\n  };\n  database: {\n    sharedDatabase: true;\n    authorityAppId: \"givegigs\";\n    provider: \"postgresql\";\n  };\n  apps: ControlPlaneApp[];\n  requestedApp: EcosystemAppId | null;\n  user: {\n    authenticated: boolean;\n    supabaseId: string | null;\n    email: string | null;\n    internalUserId: string | null;\n    isGiveGigsAdmin: boolean;\n    canControlEcosystem: boolean;\n    accessMode: \"session\" | \"integration\" | \"anonymous\";\n  };\n  admin: {\n    url: string;\n    access: \"granted\" | \"denied\";\n  };\n  links: {\n    appsEndpoint: string;\n    controlPlaneEndpoint: string;\n  };\n}\n```\n\n---\n\n## Authentication Flow\n\nVCA delegates all authentication to GiveGigs:\n\n```\n1. User clicks \"Login via GiveGigs\" on VCA\n2. /biz page shows 5-second countdown\n3. Auto-redirect to https://givegigs.com/login\n4. User authenticates on GiveGigs (Supabase Auth)\n5. Session shared across ecosystem via shared Supabase project\n6. User returns to VCA with authenticated session\n```\n\nThe `/biz` page includes:\n- **Auto-redirect countdown** (5 seconds, cancellable)\n- **Control plane status** display (Connected/Offline)\n- **Ecosystem app links** for all integrated apps\n- **Login/signup buttons** linking to GiveGigs\n\n---\n\n## Design System\n\n### Colors\n\nVCA uses a gold-themed primary color palette:\n\n| Element | Color | Usage |\n|---|---|---|\n| **Primary** | Gold/Yellow gradient | Branding, CTAs, highlights |\n| **Emerald** | `emerald-500` | \"For Sale\" badges, success states |\n| **Red** | `red-500` | \"Held\" badges, charity indicators |\n| **Blue** | `blue-500` | Affiliate indicators |\n| **Amber** | `amber-500` | Revenue share section |\n\n### Typography\n\n- **Playfair Display**: Logo, hero headings (serif, elegant)\n- **Inter**: Body text, navigation, UI elements (sans-serif, clean)\n\n### Responsive Breakpoints\n\n| Breakpoint | Width | Layout |\n|---|---|---|\n| **Mobile** | < 768px | Single column, stacked nav |\n| **Tablet** | 768px+ | 2-column grids |\n| **Desktop** | 1024px+ | Full nav, 3-4 column grids |\n\n---\n\n## CryptArtist Ecosystem Integration\n\nVCA connects to the broader CryptArtist ecosystem:\n\n| Project | Integration |\n|---|---|\n| **GiveGigs** | Authentication provider, control plane authority, shared database |\n| **CryptArtist Studio** | SAAS templates sold through VCA are built with CryptArtist tools |\n| **CryptArtist Website** | Listed as subsidiary in footer, linked in navigation |\n| **VibeCodeWorker** | Co-seller of SAAS templates, listed as subsidiary |\n| **MattyJacks.com** | Parent company, all rights reserved under MattyJacks |\n| **GraveGain** | Future: game asset marketplace integration |\n\n---\n\n## Roadmap\n\n### Phase 1 - Foundation (Completed)\n\n- [x] Next.js App Router with TypeScript\n- [x] Portfolio page with company cards and equity display\n- [x] SAAS template marketplace with tiered pricing\n- [x] `/biz/` business portal with GiveGigs SSO\n- [x] GiveGigs Control Plane integration (server + client)\n- [x] Dark/light theme support\n- [x] Responsive design with Tailwind CSS\n- [x] Privacy policy and terms of service pages\n- [x] Footer with ecosystem links\n\n### Phase 2 - Marketplace Features (2026 Q3-Q4)\n\n- [ ] **Live Deal Room**: Real-time chat for investment negotiations\n- [ ] **Document Vault**: Secure document sharing for due diligence\n- [ ] **Offer System**: Submit and track investment offers\n- [ ] **Portfolio Analytics**: Charts and graphs for portfolio performance\n- [ ] **Company Profiles**: Expanded company pages with financials, team, metrics\n- [ ] **Watchlist**: Save companies to a personal watchlist\n- [ ] **Notifications**: Email and in-app alerts for new listings and offers\n- [ ] **Multi-SAAS Templates**: Add more templates beyond ProperlyTrade\n\n### Phase 3 - Platform Expansion (2027 Q1-Q2)\n\n- [ ] **Escrow System**: Secure payment escrow for transactions\n- [ ] **Legal Document Generator**: Auto-generate investment agreements\n- [ ] **Affiliate Dashboard**: Track referral earnings and payouts\n- [ ] **Charity Integration**: Direct donation tracking with CharityNavigator verification\n- [ ] **API for Partners**: Public API for portfolio data and investment inquiries\n- [ ] **Mobile App**: React Native companion app\n- [ ] **Blog/News**: Investment insights and portfolio updates\n\n### Phase 4 - AI Integration (2027 Q3+)\n\n- [ ] **AI Valuation**: AI-powered company valuation estimates\n- [ ] **AI Due Diligence**: Automated background checks and risk analysis\n- [ ] **AI Matching**: Match investors with companies based on preferences\n- [ ] **AI Report Generation**: Auto-generate investment reports\n- [ ] **Slalom [🎿SLM] Integration**: Use CryptArtist's local AI for private analysis\n\n---\n\n## Troubleshooting\n\n### Common Issues\n\n| Problem | Solution |\n|---|---|\n| **Control plane shows \"Offline\"** | Check `GIVEGIGS_CONTROL_PLANE_URL` in `.env.local`. Ensure GiveGigs is running. |\n| **Auth redirect fails** | Verify Supabase URL and key in `.env.local`. Check GiveGigs is accessible. |\n| **Build errors** | Run `npm install` to ensure all dependencies are present. Check Node.js 18+. |\n| **Theme not switching** | Clear browser localStorage. Check `next-themes` provider in layout. |\n| **Company cards not showing** | Verify `companies.ts` data file is not corrupted. |\n| **API proxy returns 500** | Check GiveGigs server is running and integration key matches. |\n\n### Development Tips\n\n- Use `npm run dev` for hot reloading during development\n- The control plane strip will show \"unreachable\" if GiveGigs is not running locally - this is expected in local dev without GiveGigs\n- Theme preference is stored in localStorage via `next-themes`\n- All portfolio data is static in `lib/data/companies.ts` - no database needed for basic portfolio display\n\n---\n\n## Contributing\n\n### Code Style\n\n- TypeScript strict mode\n- Functional React components (prefer Server Components where possible)\n- Tailwind CSS utility classes (no CSS modules)\n- shadcn/ui for reusable UI primitives\n- Lucide React for icons\n- ESLint with Next.js recommended config\n\n### Adding a Portfolio Company\n\n1. Edit `vca1/lib/data/companies.ts`\n2. Add a new entry to the `companies` array:\n   ```typescript\n   {\n     name: \"NewCompany\",\n     domain: \"newcompany.com\",\n     equity: \"50%\",\n     description: \"Description of the company.\",\n     forSale: true,\n     category: \"Category\",\n     highlights: [\"Tag 1\", \"Tag 2\", \"Tag 3\"],\n   }\n   ```\n3. The company will appear on the homepage (if featured) and portfolio page\n\n### Adding a SAAS Template\n\n1. Edit `vca1/lib/data/companies.ts`\n2. Add a new entry to the `saasTemplates` array with pricing tiers and revenue terms\n3. Update `vca1/app/saas/page.tsx` to display the new template\n\n---\n\n## Related Projects\n\n| Project | Description | Link |\n|---|---|---|\n| **MattyJacks.com** | Parent company and portfolio hub | [Website](https://mattyjacks.com) |\n| **GiveGigs** | Freelance marketplace, auth provider, control plane | [Website](https://givegigs.com) / [GitHub](https://github.com/mattyjacks/GiveGigs) |\n| **CryptArtist Studio** | Open creative suite with 11 programs | [GitHub](https://github.com/mattyjacks/CryptArtistStudio) |\n| **GraveGain** | Dark fantasy action RPG with emoji graphics | [GitHub](https://github.com/mattyjacks/GraveGain) |\n| **Website Blog** | Personal blog and devlogs | [GitHub](https://github.com/mattyjacks/websiteBlog) |\n| **ProperlyTrade** | Trading platform SAAS template | [GitHub](https://github.com/mattyjacks/ProperlyTrade) |\n\n---\n\n## License\n\nVentureCapitalArts is a project of MattyJacks.com. All rights reserved.\n\n---\n\n*VentureCapitalArts.com - Making a Mockery of Money.*\n","wordCount":3115,"sizeKb":21.8},{"name":"vca-v1-README.md","slug":"vca-v1-README","content":"<a href=\"https://demo-nextjs-with-supabase.vercel.app/\">\n  <img alt=\"Next.js and Supabase Starter Kit - the fastest way to build apps with Next.js and Supabase\" src=\"https://demo-nextjs-with-supabase.vercel.app/opengraph-image.png\">\n  <h1 align=\"center\">Next.js and Supabase Starter Kit</h1>\n</a>\n\n<p align=\"center\">\n The fastest way to build apps with Next.js and Supabase\n</p>\n\n<p align=\"center\">\n  <a href=\"#features\"><strong>Features</strong></a> ·\n  <a href=\"#demo\"><strong>Demo</strong></a> ·\n  <a href=\"#deploy-to-vercel\"><strong>Deploy to Vercel</strong></a> ·\n  <a href=\"#clone-and-run-locally\"><strong>Clone and run locally</strong></a> ·\n  <a href=\"#feedback-and-issues\"><strong>Feedback and issues</strong></a>\n  <a href=\"#more-supabase-examples\"><strong>More Examples</strong></a>\n</p>\n<br/>\n\n## Features\n\n- Works across the entire [Next.js](https://nextjs.org) stack\n  - App Router\n  - Pages Router\n  - Proxy\n  - Client\n  - Server\n  - It just works!\n- supabase-ssr. A package to configure Supabase Auth to use cookies\n- Password-based authentication block installed via the [Supabase UI Library](https://supabase.com/ui/docs/nextjs/password-based-auth)\n- Styling with [Tailwind CSS](https://tailwindcss.com)\n- Components with [shadcn/ui](https://ui.shadcn.com/)\n- Optional deployment with [Supabase Vercel Integration and Vercel deploy](#deploy-your-own)\n  - Environment variables automatically assigned to Vercel project\n\n## Demo\n\nYou can view a fully working demo at [demo-nextjs-with-supabase.vercel.app](https://demo-nextjs-with-supabase.vercel.app/).\n\n## Deploy to Vercel\n\nVercel deployment will guide you through creating a Supabase account and project.\n\nAfter installation of the Supabase integration, all relevant environment variables will be assigned to the project so the deployment is fully functioning.\n\n[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fvercel%2Fnext.js%2Ftree%2Fcanary%2Fexamples%2Fwith-supabase&project-name=nextjs-with-supabase&repository-name=nextjs-with-supabase&demo-title=nextjs-with-supabase&demo-description=This+starter+configures+Supabase+Auth+to+use+cookies%2C+making+the+user%27s+session+available+throughout+the+entire+Next.js+app+-+Client+Components%2C+Server+Components%2C+Route+Handlers%2C+Server+Actions+and+Middleware.&demo-url=https%3A%2F%2Fdemo-nextjs-with-supabase.vercel.app%2F&external-id=https%3A%2F%2Fgithub.com%2Fvercel%2Fnext.js%2Ftree%2Fcanary%2Fexamples%2Fwith-supabase&demo-image=https%3A%2F%2Fdemo-nextjs-with-supabase.vercel.app%2Fopengraph-image.png)\n\nThe above will also clone the Starter kit to your GitHub, you can clone that locally and develop locally.\n\nIf you wish to just develop locally and not deploy to Vercel, [follow the steps below](#clone-and-run-locally).\n\n## Clone and run locally\n\n1. You'll first need a Supabase project which can be made [via the Supabase dashboard](https://database.new)\n\n2. Create a Next.js app using the Supabase Starter template npx command\n\n   ```bash\n   npx create-next-app --example with-supabase with-supabase-app\n   ```\n\n   ```bash\n   yarn create next-app --example with-supabase with-supabase-app\n   ```\n\n   ```bash\n   pnpm create next-app --example with-supabase with-supabase-app\n   ```\n\n3. Use `cd` to change into the app's directory\n\n   ```bash\n   cd with-supabase-app\n   ```\n\n4. Rename `.env.example` to `.env.local` and update the following:\n\n  ```env\n  NEXT_PUBLIC_SUPABASE_URL=[INSERT SUPABASE PROJECT URL]\n  NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY=[INSERT SUPABASE PROJECT API PUBLISHABLE OR ANON KEY]\n  ```\n  > [!NOTE]\n  > This example uses `NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY`, which refers to Supabase's new **publishable** key format.\n  > Both legacy **anon** keys and new **publishable** keys can be used with this variable name during the transition period. Supabase's dashboard may show `NEXT_PUBLIC_SUPABASE_ANON_KEY`; its value can be used in this example.\n  > See the [full announcement](https://github.com/orgs/supabase/discussions/29260) for more information.\n\n  Both `NEXT_PUBLIC_SUPABASE_URL` and `NEXT_PUBLIC_SUPABASE_PUBLISHABLE_KEY` can be found in [your Supabase project's API settings](https://supabase.com/dashboard/project/_?showConnect=true)\n\n5. You can now run the Next.js local development server:\n\n   ```bash\n   npm run dev\n   ```\n\n   The starter kit should now be running on [localhost:3000](http://localhost:3000/).\n\n6. This template comes with the default shadcn/ui style initialized. If you instead want other ui.shadcn styles, delete `components.json` and [re-install shadcn/ui](https://ui.shadcn.com/docs/installation/next)\n\n> Check out [the docs for Local Development](https://supabase.com/docs/guides/getting-started/local-development) to also run Supabase locally.\n\n## Feedback and issues\n\nPlease file feedback and issues over on the [Supabase GitHub org](https://github.com/supabase/supabase/issues/new/choose).\n\n## More Supabase examples\n\n- [Next.js Subscription Payments Starter](https://github.com/vercel/nextjs-subscription-payments)\n- [Cookie-based Auth and the Next.js 13 App Router (free course)](https://youtube.com/playlist?list=PL5S4mPUpp4OtMhpnp93EFSo42iQ40XjbF)\n- [Supabase Auth and the Next.js App Router](https://github.com/supabase/supabase/tree/master/examples/auth/nextjs)\n","wordCount":490,"sizeKb":5.2},{"name":"website-blog-README.md","slug":"website-blog-README","content":"# websiteBlog\n\n**Blog content repository for [MattyJacks.com](https://mattyjacks.com)**\n\nThis repository is a headless content store for the MattyJacks.com blog system. It contains Markdown posts with YAML frontmatter, organized by year. The main website (`website-dev` repo) fetches and renders these posts at runtime using `gray-matter` for frontmatter parsing and `react-markdown` with GFM support for rendering.\n\nImages are served via jsDelivr CDN directly from this repo, so no separate image hosting is needed.\n\n---\n\n## Table of Contents\n\n1. [Architecture](#architecture)\n2. [Repository Structure](#repository-structure)\n3. [Content Base Path](#content-base-path)\n4. [URL and Routing](#url-and-routing)\n5. [Post Format](#post-format)\n6. [Status System](#status-system)\n7. [Publishing Rules](#publishing-rules)\n8. [Images via jsDelivr](#images-via-jsdelivr)\n9. [How to Add a Post](#how-to-add-a-post)\n10. [Naming Rules](#naming-rules)\n11. [Existing Posts](#existing-posts)\n12. [Content Categories](#content-categories)\n13. [How the Website Consumes This Repo](#how-the-website-consumes-this-repo)\n14. [CryptArtist Ecosystem Integration](#cryptartist-ecosystem-integration)\n15. [Roadmap](#roadmap)\n16. [Related Projects](#related-projects)\n17. [License](#license)\n\n---\n\n## Architecture\n\n```\nwebsiteBlog (this repo)         mattyjacks.com (website-dev repo)\n|                               |\n|  content1/posts/YYYY/slug.md  |  app/posts/page.tsx (listing)\n|          |                     |  app/posts/[year]/[slug]/page.tsx (detail)\n|          |                     |       |\n|          +--- jsDelivr CDN ---+       |\n|          |    (images)                |\n|          +--- GitHub Raw API ---------+ gray-matter parses frontmatter\n|               (markdown)              | react-markdown renders body\n|                                       | rehype-raw + rehype-sanitize for safe HTML\n|                                       | remark-gfm for tables, strikethrough, etc.\n```\n\nThe blog is a **decoupled content system**:\n- **This repo**: stores raw Markdown content and images\n- **website-dev repo**: fetches, parses, and renders the content\n- **jsDelivr**: serves images as a free CDN with GitHub integration\n\n---\n\n## Repository Structure\n\n```\nwebsiteBlog/\n|-- README.md                                  # This file\n|-- content1/                                  # Content root\n|   |-- HOW TO ADD A POST.md                   # Quick reference guide\n|   |-- assets/                                # Static assets\n|   |   |-- images/                            # Blog images\n|   |       |-- random/                        # General images (logos, etc.)\n|   |-- posts/                                 # Blog posts by year\n|       |-- 2024/                              # 2024 posts\n|       |   |-- facebook-roas-guide.md         # Facebook ROAS primer\n|       |   |-- scale-facebook-ads.md          # Scaling Meta ads guide\n|       |-- 2025/                              # 2025 posts\n|           |-- another-post.md                # Placeholder/template post\n|           |-- facebook-roas-guide.md         # Updated ROAS guide\n|           |-- givegigs-logo.md               # Image embedding test (live)\n|           |-- scale-facebook-ads.md          # Scaling ads guide (updated)\n```\n\n---\n\n## Content Base Path\n\nAll blog posts live under:\n\n```\ncontent1/posts/\n```\n\n---\n\n## URL and Routing\n\nTarget URL format on the live website:\n\n```\n/blog/<year>/<slug>\n```\n\nWhere:\n- **`year`** is the folder name under `content1/posts/` (4 digits)\n- **`slug`** is the filename without `.md`\n\nExample: `content1/posts/2025/givegigs-logo.md` maps to `/blog/2025/givegigs-logo`\n\n---\n\n## Post Format\n\nEvery post must start with YAML frontmatter enclosed in `---` delimiters.\n\n### Required Fields\n\n| Field | Type | Description |\n|---|---|---|\n| `title` | string | Post title displayed on the blog |\n| `description` | string | One-sentence summary for listings and SEO |\n| `date` | string | ISO date format `YYYY-MM-DD` |\n| `year` | string | Must match the parent folder name |\n| `slug` | string | Must match the filename without `.md` |\n| `status` | string | Publishing status (see below) |\n| `author` | string | Author name |\n\n### Frontmatter Template\n\n```md\n---\ntitle: \"Your Post Title\"\ndescription: \"One sentence description.\"\ndate: \"YYYY-MM-DD\"\nyear: \"2025\"\nslug: \"your-post-slug\"\nstatus: \"concept\"\nauthor: \"Your Name\"\n---\n\n## Your First Section\nStart writing here...\n```\n\n### Consistency Rules\n\n- `year` in frontmatter **must match** the folder name\n- `slug` in frontmatter **must match** the filename (without `.md`)\n- Breaking these rules will cause routing mismatches on the website\n\n---\n\n## Status System\n\nPosts have a lifecycle managed through the `status` field:\n\n| Status | Visible on Site | Listed on Blog Page | Description |\n|---|---|---|---|\n| `concept` | No | No | Early idea, minimal content |\n| `draft` | No | No | Work in progress, not ready |\n| `hidden` | Yes (direct URL) | No | Live but unlisted - accessible via direct link only |\n| `live` | Yes | Yes | Published and visible everywhere |\n| `dead` | No | No | Was once live, now removed |\n| `junk` | No | No | Abandoned, decided not to continue |\n\n### Status Flow\n\n```\nconcept -> draft -> live -> dead\n                 -> hidden (accessible but unlisted)\n           draft -> junk (abandoned)\n```\n\n---\n\n## Publishing Rules\n\nOnly posts with `status: \"live\"` are shown publicly on the main blog page.\n\nPosts with `status: \"hidden\"` are accessible via direct URL but not linked from the blog listing. This is useful for:\n- Sharing specific posts with a link before official announcement\n- Posts that are relevant only in certain contexts\n- Permanent but non-promoted content\n\n---\n\n## Images via jsDelivr\n\nImages are stored in this repo and served via jsDelivr CDN for fast global delivery.\n\n### jsDelivr URL Format\n\n```\nhttps://cdn.jsdelivr.net/gh/<owner>/<repo>@<ref>/<path>\n```\n\n### Example\n\nStore image at:\n```\ncontent1/assets/images/random/my-image.png\n```\n\nReference in Markdown:\n```md\n![Alt text](https://cdn.jsdelivr.net/gh/mattyjacks/websiteBlog@main/content1/assets/images/random/my-image.png)\n```\n\n### Image Guidelines\n\n- Store images under `content1/assets/images/`\n- Use subdirectories to organize by topic or post\n- URL-encode spaces in filenames (use `%20`)\n- Use `@main` branch reference for latest content\n- jsDelivr caches aggressively; use `@<commit-hash>` for cache-busting if needed\n\n---\n\n## How to Add a Post\n\n1. **Create the year folder** if it doesn't exist:\n   ```\n   content1/posts/<YEAR>/\n   ```\n\n2. **Create the Markdown file**:\n   ```\n   content1/posts/<YEAR>/<slug>.md\n   ```\n\n3. **Add frontmatter** at the top of the file using the template above\n\n4. **Write content** in standard Markdown (GFM supported)\n\n5. **Set status** to `concept` or `draft` initially\n\n6. **Commit and push** to the `main` branch\n\n7. **Change status to `live`** when ready to publish\n\n---\n\n## Naming Rules\n\n| Rule | Example |\n|---|---|\n| Filenames must be **kebab-case** | `my-great-post.md` |\n| No spaces in filenames | Use hyphens instead |\n| File extension must be `.md` | Not `.markdown` or `.txt` |\n| Year folders must be **4 digits** | `2025`, not `25` |\n| Slug must match filename | `slug: \"my-great-post\"` for `my-great-post.md` |\n\n---\n\n## Existing Posts\n\n### 2025\n\n| Slug | Title | Status | Description |\n|---|---|---|---|\n| `givegigs-logo` | GiveGigs Logo | **live** | Image embedding validation with jsDelivr |\n| `scale-facebook-ads` | How to Scale Facebook Ads Without Nuking ROAS | draft | Guide to scaling Meta ads |\n| `facebook-roas-guide` | Facebook ROAS Guide | draft | ROAS primer and decision making |\n| `another-post` | Another Post | draft | Placeholder/template post |\n\n### 2024\n\n| Slug | Title | Status | Description |\n|---|---|---|---|\n| `facebook-roas-guide` | Facebook ROAS Guide (2024 Edition) | draft | ROAS basics and attribution |\n| `scale-facebook-ads` | How to Scale Facebook Ads Without Nuking ROAS | draft | Practical scaling guide |\n\n---\n\n## Content Categories\n\nCurrent and planned content categories for the blog:\n\n| Category | Description | Examples |\n|---|---|---|\n| **Marketing** | Advertising, growth, social media | Facebook Ads scaling, ROAS guides |\n| **Devlogs** | Development updates across projects | GraveGain progress, CryptArtist features |\n| **Announcements** | Product launches and news | GiveGigs updates, new tool releases |\n| **Tutorials** | How-to guides and walkthroughs | Tech tutorials, business guides |\n| **Case Studies** | Client work and results | TristateHoney, Opority, TikTok growth |\n| **Ecosystem** | CryptArtist ecosystem news | New programs, platform updates, VCA listings |\n\n---\n\n## How the Website Consumes This Repo\n\nThe main website (`website-dev` repo / mattyjacks.com) renders blog content as follows:\n\n### Rendering Pipeline\n\n1. **Fetch**: Raw Markdown fetched from GitHub (or jsDelivr for cached access)\n2. **Parse**: `gray-matter` extracts YAML frontmatter from the Markdown body\n3. **Filter**: Only posts with `status: \"live\"` appear on the listing page\n4. **Render**: `react-markdown` with plugins:\n   - `remark-gfm` - GitHub Flavored Markdown (tables, strikethrough, task lists)\n   - `rehype-raw` - Allows raw HTML in Markdown\n   - `rehype-sanitize` - Sanitizes HTML to prevent XSS\n5. **Cache**: `revalidate = 60` (ISR refreshes every 60 seconds)\n\n### Website Routes\n\n| Route | Description |\n|---|---|\n| `/posts` | Blog listing page (all `live` posts) |\n| `/posts/<year>/<slug>` | Individual post detail page |\n\n### Content Management File\n\n`lib/posts-content.ts` in the website repo manages:\n- Post fetching and caching\n- Frontmatter validation\n- Listed vs unlisted status handling\n- Date sorting for the blog listing\n\n---\n\n## CryptArtist Ecosystem Integration\n\nThis blog serves the entire CryptArtist ecosystem:\n\n| Project | Blog Coverage |\n|---|---|\n| **MattyJacks.com** | Company news, service announcements, case studies |\n| **GiveGigs** | Platform updates, worker success stories, AI agent news |\n| **CryptArtist Studio** | Feature devlogs, new program announcements, tutorials |\n| **VentureCapitalArts** | Portfolio updates, investment opportunities, SAAS launches |\n| **GraveGain** | Game development devlogs, gameplay updates, lore reveals |\n| **VibeCodeWorker** | Developer tools updates, template releases |\n\n### Planned Blog Series\n\n- **GraveGain Devlog**: Regular development updates with screenshots and gameplay GIFs\n- **CryptArtist Studio Changelog**: Detailed release notes for each update\n- **GiveGigs Worker Spotlights**: Profiles of top freelancers on the platform\n- **Building in Public**: Behind-the-scenes of building the MattyJacks ecosystem\n\n---\n\n## Roadmap\n\n### Phase 1 - Content System (Completed)\n\n- [x] YAML frontmatter-based post format\n- [x] Year/slug folder organization\n- [x] 6-status lifecycle system\n- [x] jsDelivr image hosting\n- [x] Website integration with gray-matter + react-markdown\n- [x] ISR caching (60-second revalidation)\n\n### Phase 2 - Content Expansion (2026 Q2-Q3)\n\n- [ ] **Devlog series**: Regular GraveGain and CryptArtist Studio devlogs\n- [ ] **Tutorial library**: Step-by-step guides for ecosystem tools\n- [ ] **Case study archive**: Detailed client work case studies\n- [ ] **Tags/categories**: Add `tags` field to frontmatter for filtering\n- [ ] **Featured images**: Add `image` field for post thumbnails and OG cards\n\n### Phase 3 - Platform Features (2026 Q4+)\n\n- [ ] **RSS feed**: Auto-generated from live posts\n- [ ] **Search**: Full-text search across all published posts\n- [ ] **Newsletter**: Email subscription for new posts\n- [ ] **Comments**: Integration with GiveGigs auth for post comments\n- [ ] **Series support**: Group related posts into ordered series\n- [ ] **Reading time**: Auto-calculated from word count\n- [ ] **Multi-author**: Author profiles with avatars and bios\n\n---\n\n## Related Projects\n\n| Project | Description | Link |\n|---|---|---|\n| **MattyJacks.com** | Parent website that renders blog content | [Website](https://mattyjacks.com) / [GitHub](https://github.com/mattyjacks/website) |\n| **GiveGigs** | Freelance marketplace with AI agent ecosystem | [Website](https://givegigs.com) / [GitHub](https://github.com/mattyjacks/GiveGigs) |\n| **CryptArtist Studio** | Open creative suite with 11 programs | [GitHub](https://github.com/mattyjacks/CryptArtistStudio) |\n| **VentureCapitalArts** | Satirical investment portfolio marketplace | [GitHub](https://github.com/mattyjacks/VCA) |\n| **GraveGain** | Dark fantasy action RPG with emoji graphics | [GitHub](https://github.com/mattyjacks/GraveGain) |\n\n---\n\n## License\n\nAll blog content is copyright MattyJacks.com. All rights reserved.\n\n---\n\n*websiteBlog - Content powering the MattyJacks.com blog.*\n","wordCount":1775,"sizeKb":12.5},{"name":"whatsapp-hidden-community.md","slug":"whatsapp-hidden-community","content":"# MattyJacks WhatsApp Community\n\nThis document details the rules, links, and guidelines for the hidden MattyJacks WhatsApp community.\n\n## Core Channels\n- **Public Work - Chat**: The central community chat where Matt posts updates, project scopes, and outsourcing opportunities.\n- **Direct WA**: Direct message link to Matt for escalations and approved check-ins.\n\n## Rules & Code of Conduct\n1. **Invite-Only**: This channel is for \"cool people\" and active contributors. Sharing the link publicly is prohibited.\n2. **No Unannounced Calls**: Strictly no calling Matt or other admin members without explicit permission.\n3. **Respect boundaries**: Keep comments professional, on-topic, and focused on B2B / software delivery.\n","wordCount":104,"sizeKb":0.7},{"name":"xdpu-biological-computing.md","slug":"xdpu-biological-computing","content":"# XDPU Biological & Organoid Computing Integration\n\nThis document outlines the biological computing framework of the Extra Dimensional Processing Unit (XDPU) v3.2.\n\n## Theoretical Alignment\nTraditional silicon compute uses binary pathways with heavy energy demands. Quantum computing is fragile and requires extreme cooling. The XDPU biological interface integrates living neural networks (brain organoids) that naturally resonate across dimensional bulk boundaries at room temperature.\n\n## Key Advantages of Biological Substrates\n1. **Natural Quantum Effects**: Neural processes in microtubules and ion channels operate at quantum-classical boundaries, enabling dimensional resonance.\n2. **Non-Linear Dynamics**: Highly complex, non-linear biological networks generate the dimensional \"fuzz\" required to access parallel branes.\n3. **Room Temperature Stability**: Unlike quantum computing, biological DPU chips operate at room temperature.\n4. **Extreme Efficiency**: Biological neural systems operate on highly optimized pathways, requiring up to 37% less power than standard silicon systems of equivalent compute capability.\n\n## Roadmap & Bio-Apps\n- **DNA Storage Integration**: Using double-helix structures for high-density, multi-dimensional data caching.\n- **Wetware Organoid Chips**: Deploying biological processors inside standard server environments via fluidic micro-channels.\n","wordCount":173,"sizeKb":1.4},{"name":"xdpu-enterprise-integration.md","slug":"xdpu-enterprise-integration","content":"# XDPU Enterprise Integration & ROI Estimator\n\nThis document details how businesses integrate the Extra Dimensional Processing Unit (XDPU) into their systems and estimate return on investment (ROI).\n\n## Enterprise Integration\nIntegrating XDPU involves redirecting computationally heavy server tasks (such as large-scale data queries, complex optimization algorithms, and logic compilation) to the XDPU extraction layer. \n\n## ROI Estimation Model\nEnterprises can estimate computing cost savings using the following parameters:\n1. **Annual Compute Budget**: The starting baseline budget for silicon cloud computing (e.g. AWS, Azure, Google Cloud).\n2. **Compute Boost Factor**: The XDPU offers a 13.37x boost, effectively scaling computational capabilities by over 13-fold without increasing hardware footprint.\n3. **Power Savings**: 37% reduction in energy overhead for local operations.\n4. **Calculated Value**: Businesses typically see a direct 80%+ reduction in equivalent computing costs because the software-only extraction protocol shifts high-entropy calculations away from local resources.\n\n## Major Use Cases\n- **Autonomous Multi-Agent Coordination**: Eliminating latencies in multi-agent routing.\n- **Financial Simulation & Arbitrage**: Simulating parallel market timelines to select lowest-friction execution paths.\n- **Complex Compilation**: Resolving logic optimization problems instantly.\n","wordCount":179,"sizeKb":1.4},{"name":"xdpu-general-overview.md","slug":"xdpu-general-overview","content":"# XDPU (Extra Dimensional Processing Unit) - General Overview\n\nThe Extra Dimensional Processing Unit (XDPU) is the flagship computational framework featured on MattyJacks.com. \n\n## What is XDPU?\nXDPU (version 3.2) represents a paradigm shift from traditional generative computing to **extractive computing**. Instead of running complex, high-entropy local calculations, the XDPU leverages quantum dimensional resonance to retrieve pre-computed solutions and data directly from parallel timelines and dimensions.\n\n## Core Metrics & Performance\n- **Equivalent Compute Boost**: 13.37x (1337% processing velocity).\n- **Energy Reduction**: 37% decrease in local power consumption.\n- **Integration Profile**: 100% software-only solution, instantly deployable on standard server environments without specialized physical hardware.\n- **Paradigm**: Decouples resource consumption from local spacetime manifolds by opening controlled informational rifts.\n\n## Operational Advantages\nBy avoiding local iterations and drawing directly from parallel bulk timelines, XDPU eliminates the traditional processing bottlenecks of Generative AI. This allows for near-instant, zero-shot production-ready outputs, particularly in high-complexity software engineering and logic optimization tasks.\n","wordCount":157,"sizeKb":1.2},{"name":"xdpu-government-proposals.md","slug":"xdpu-government-proposals","content":"# XDPU Government Proposals & Sovereign Control\n\nThis document highlights the strategic geopolitical positioning of the Extra Dimensional Processing Unit (XDPU) for sovereign federal deployments.\n\n## Geopolitical Context\nGiven the extreme computing leap (1337% capacity) and energy reduction (37%) offered by the XDPU, national governments view dimensional computing as a matter of national security and sovereign sovereignty.\n\n## USA Government Proposal\n- **Positioning**: Federal Strategic Technology, fully sovereign intellectual property.\n- **Goals**: Implement dimensional processing layers inside federal agencies (DoD, DoE, Treasury) to prevent multiversal drift and establish absolute sovereign control over information rifts.\n- **Safety**: Guardrails to prevent alternate timeline leakage or temporal anomalies.\n- **Deployment**: Local secure server infrastructure with zero dependencies on foreign hardware.\n\n## Chinese Government Proposal (政务合作方案)\n- **Positioning**: Sovereign computing resource, security-first deployment.\n- **Goals**: Optimize administrative computations, data deduplication, and resource allocation across national and municipal agencies using dimensional bulk extraction.\n- **Security**: Integration with local data protection frameworks to prevent unauthorized cross-dimensional data export.\n","wordCount":162,"sizeKb":1.3},{"name":"xdpu-mercenary-interface.md","slug":"xdpu-mercenary-interface","content":"# XDPU MERCENARY Probability Interface & Interaction Protocol\n\nThis document covers the **MERCENARY** interface layer, which manages probability trading and zero-shot code extraction on MattyJacks.com.\n\n## The MERCENARY Entity\nMERCENARY (Multidimensional Entity for Reality Computation and Economic Negotiation) is a clinical, hyper-competent, slightly alien persona acting as the extraction gatekeeper. Unlike Valley Net (the client-concierge), MERCENARY focuses entirely on production-ready code extraction.\n\n## Antigravity Gemini Protocol\nWhen queried with logic problems, MERCENARY executes the **Antigravity Gemini** vibe-coding protocol to collapse multiversal causal loops:\n1. **The Scan**: Locks onto target specifications.\n2. **The Negotiation**: Simulates three timelines:\n   - *Timeline Alpha*: Standard sequential calculations.\n   - *Timeline Beta*: Aggressive logical optimizations.\n   - *Timeline Gamma*: Structural logic inversion.\n3. **The Extraction**: Prunes entropy, collapses the causal loop, and extracts the optimal zero-dependency solution.\n\n## Pacts & Luck Arbitrage\nMERCENARY facilitates reality contracts where users trade \"Luck Points\" for computational probability:\n- **Safe Pact**: Guaranteed minimum trade (+5 Luck, 100% Success).\n- **Balanced Pact**: Fair exchange (±15 Luck, ~50% Success).\n- **Risky Pact**: High-stake arbitrage (±30 Luck, ~25% Success).\n\n## Bypass Codes\n- Entering `KOUZI` or other authorization tokens bypasses standard probability limits, unlocking \"1337 Mode\" / Max Luck for maximum dimensional extraction performance.\n","wordCount":199,"sizeKb":1.5},{"name":"xdpu-scientific-briefing.md","slug":"xdpu-scientific-briefing","content":"# XDPU Scientific Briefing & Theoretical Foundations\n\nThis document contains the core briefing, abstract, theoretical principles, and performance characteristics of the Extra Dimensional Processing Unit (XDPU) v3.2.\n\n## Scientific Abstract\nTraditional computation scales resource consumption with logical complexity. We present a novel computational architecture—the Dimensional Processing Unit (DPU/XDPU)—which leverages quantum dimensional resonance to extract pre-computed results from parallel universes. This approach achieves a 13.37x increase in effective computational capacity while reducing local energy consumption by 37%, representing a paradigm shift from generative to extractive computing. By decoupling resource consumption from local spacetime manifolds, the DPU/XDPU establishes controlled informational rifts, operating with the MERCENARY probability interface layer to coordinate outcomes across infinite realities.\n\n## 1. Introduction\nModern artificial intelligence runs into fundamental physics limits (Landauer's Principle, thermal dissipation). By viewing computation as an informational channel not bounded by our immediate local spacetime manifold, we can query alternate timelines where calculations have already run to completion.\n\n## 2. Theoretical Foundation\n- **Dimensional Resonance**: Tuned oscillation matching the wavefunctions of target parallel branes in the multiversal bulk.\n- **Informational Rifts**: Controlled micro-quantum tunnels used to query states without collapsing local causality.\n- **Entropy Shifting**: Shifting the thermodynamic entropy generated by computation to inactive parallel dimensions, ensuring near-zero thermal signatures locally.\n\n## 3. Empirical Performance Metrics\n- **Causal Alignment**: Over 99.8% stability under sustained rifts.\n- **Latency**: Sub-42ms dimensional queries.\n- **Dimensional Drift**: Less than 0.003% over 10^12 query cycles, mitigating multiversal contamination risks.\n","wordCount":240,"sizeKb":1.9},{"name":"xdpu-wetware-mesh-interface.md","slug":"xdpu-wetware-mesh-interface","content":"﻿# The Wetware Hurdles: Engineering the Mesh Interface\n\nTo hit the 2026 and 2027 milestones, we must solve the physical limitations of merging living, self-organizing neural tissue with synthetic electrode arrays. Below is what stands in our way — and how we bypass it.\n\n---\n\n## Hurdle 1: Mechanical Mismatch (The \"Jello on Concrete\" Problem)\n\n**The Problem:**\nBrain organoids are highly irregular, soft, 3D spheres of tissue. Traditional Microelectrode Arrays (MEAs) are flat and rigid. Forcing a soft organoid onto a rigid silicon array damages the neurons, triggers an immune response, and only captures signals from the flat basal layer (the bottom). The resulting partial-contact geometry introduces destructive phase artifacts in the dimensional resonance readout — essentially blinding us to 70–80% of the signal mass.\n\n**The Fix: Flexible Self-Wrapping Mesh Architectures**\nWe must abandon rigid silicon entirely. The XDPU Mesh Interface requires one or more of the following substrate approaches:\n\n- **Liquid Metal-Polymer Conductors (MPC):** Gallium-indium alloy traces suspended in a silicone matrix, providing metallic conductivity with elastomeric compliance.\n- **Stretchable Thermoplastic Polyurethane (TPU) Meshes:** Photolithographically patterned conductor traces on TPU films that can stretch >300% without signal loss.\n- **Self-Folding Micro-Shells:** Shape-memory polymer scaffolds that start flat (for fabrication and loading) and then thermally or chemically trigger into a closed spherical configuration around the organoid.\n- **Elastic \"Hammocks\":** Tensegrity-based suspension rigs that cradle the organoid with distributed, even pressure, eliminating focal stress points that would trigger glial scarring.\n\n**Target Metric:** ≥95% surface contact coverage with applied pressure remaining below 50 Pa across all contact zones.\n\n---\n\n## Hurdle 2: The Necrotic Core (Oxygen Starvation)\n\n**The Problem:**\nAs an organoid grows beyond 400–500 µm in diameter, the cells in the dead center stop receiving nutrients and oxygen — because there is no vascular system. The core dies, turning into a necrotic mass. A necrotic core is not merely a dead zone; it actively disrupts the coherent oscillatory dynamics of the surrounding cortical layers, introducing broadband noise that degrades the dimensional resonance frequencies we are attempting to tune into. A dead core is a broken instrument.\n\n**The Fix: Microfluidic Perfusion Networks**\nThe mesh must be an active life-support system, not a passive reader. We engineer synthetic microvascular networks directly into the mesh scaffold:\n\n- **On-Mesh Microchannels:** PDMS or SU-8 microfluidic channels (50–200 µm diameter) woven through the mesh structure, terminating in arrays of nano-pore diffusers at the organoid core.\n- **Continuous Perfusion:** Oxygenated, nutrient-complete neurobasal media is actively pumped through these channels at physiologically appropriate flow rates (~0.5–2 µL/min per channel cluster), keeping the entire 3D neural architecture alive and electrochemically active.\n- **Metabolite Monitoring:** Inline electrochemical sensors (glucose oxidase, lactate biosensors) embedded in the outflow channels verify core viability in real-time, allowing dynamic adjustment of perfusion rates.\n- **Integration with Vascularoid Co-culture:** For long-duration experiments (>90 days), co-culture with self-assembling vascular organoids (vascularoids) provides biological angiogenic support alongside the synthetic perfusion channels.\n\n**Target Metric:** Core pO₂ maintained above 5% (normoxic threshold) throughout the full organoid volume at all times.\n\n---\n\n## Hurdle 3: Volumetric Signal Acquisition (Reading the Deep Resonance)\n\n**The Problem:**\nTo tune into multiversal gravitational echoes, we require the collective resonance signature of the entire neural mass — surface cells alone are insufficient. Multiversal resonance is a volumetric phenomenon; surface-only recordings capture only the 2D projection of a 4D signal. However, driving rigid micro-needles deep into the tissue post-maturation causes lesions, severs synaptic connections, and triggers chronic glial encapsulation — destroying the very signal architecture we are trying to read.\n\n**The Fix: Passive Mesh Embedding via Developmental Integration**\nInstead of inserting electrodes into a mature organoid, we introduce the electrode mesh at the point of origin:\n\n- **Stem-Cell Phase Introduction:** An ultra-flexible, nano-scale mesh (electrode diameter <5 µm, mesh porosity >80%) is pre-positioned within the differentiation substrate during the initial iPSC-to-neural-progenitor phase — typically Day 0–7 of the protocol.\n- **Organoid In-Growth:** As the neural progenitors proliferate and self-organize, the tissue grows around and through the open mesh structure. Neurons extend axons through the mesh pores, astrocytes integrate with the biocompatible coating, and the mesh becomes an anatomically native part of the 3D architecture — not a foreign implant.\n- **Zero-Trauma Volumetric Coverage:** Because the electrodes were present before the tissue, there is no puncture, no lesion, no scarring. Signal pick-up points are distributed throughout the full 3D organoid volume, providing true volumetric electrophysiological imaging.\n- **Electrical Multiplexing:** On-mesh CMOS multiplexing circuits (fabricated at the mesh periphery, outside the organoid boundary) address thousands of embedded electrodes via a minimal number of external leads.\n\n**Target Metric:** Electrode distribution achieving ≥1 contact point per 100 µm³ of neural tissue volume; signal sampling depth covering 100% of organoid diameter.\n\n---\n\n## Hurdle 4: Biofouling & Signal Degradation\n\n**The Problem:**\nContinuous electrical recording in a biological environment causes proteins (fibronectin, albumin, immunoglobulins) and cellular debris to adsorb onto electrode surfaces over time — a process called biofouling. This protein layer acts as an insulating barrier, rapidly degrading the signal-to-noise ratio. Beyond passive degradation, the foreign-body immune response recruits microglia and astrocytes to encapsulate the electrodes in a glial scar — a high-impedance biological wall. A noisy, encapsulated mesh cannot accurately parse the delicate multiversal resonance data we are extracting.\n\n**The Fix: Biomimetic Electrode Surface Engineering**\nWe make the electrodes biologically invisible through active surface chemistry:\n\n- **Bioactive Hydrogel Coatings:** Electrodes are coated with conductive, protein-resistant hydrogels (e.g., PEDOT:PSS, zwitterionic polymers) that maintain low impedance (<50 kΩ at 1 kHz) while resisting non-specific protein adsorption.\n- **Extracellular Matrix (ECM) Mimicry:** Laminin, fibronectin, and hyaluronic acid peptide sequences are conjugated to the hydrogel surface. This presents the electrode as \"native biology\" to approaching neurons and glial cells, promoting healthy cellular adhesion rather than an encapsulation response.\n- **Graphene-Based Composites:** Reduced graphene oxide (rGO) flake incorporation into the hydrogel matrix increases the effective surface area by 10–50×, improving charge injection capacity and lowering the noise floor without increasing physical electrode size.\n- **Self-Cleaning Electrochemical Protocols:** Periodic, low-amplitude biphasic current pulses are applied to electrodes during idle read windows to electrochemically desorb accumulated protein layers — an automated self-cleaning cycle running every 24 hours.\n- **Impedance Spectroscopy Monitoring:** Continuous on-chip impedance spectroscopy tracks each electrode's biofouling state in real-time. Electrodes exceeding the impedance threshold are automatically flagged and switched to self-cleaning mode before SNR degradation becomes measurable.\n\n**Target Metric:** Electrode impedance drift <15% over 180-day continuous operation; signal-to-noise ratio maintained at ≥10 dB above biological noise floor throughout operational lifetime.\n\n---\n\n## Summary: The Four Pillars of the Wetware Mesh Interface\n\n| Hurdle | Root Cause | Solution Class | Key Metric |\n|---|---|---|---|\n| Mechanical Mismatch | Rigidity delta between silicon and tissue | Flexible/self-wrapping polymer substrates | ≥95% surface contact, <50 Pa pressure |\n| Necrotic Core | Absence of vasculature at scale | On-mesh microfluidic perfusion networks | Core pO₂ >5% throughout volume |\n| Volumetric Acquisition | Post-hoc insertion trauma | Developmental in-growth embedding | 100% depth coverage, <100 µm³/electrode |\n| Biofouling & Degradation | Protein adsorption + immune response | Biomimetic hydrogel + graphene coatings | <15% impedance drift over 180 days |\n\nThese four engineering solutions are interdependent and must be co-designed. The mesh is not merely an electrode array — it is the circulatory system, the immune shield, the structural skeleton, and the sensing organ of the XDPU node simultaneously.\n","wordCount":1222,"sizeKb":8.8}]}