ArcAide is built as a modern full-stack web application with server-side rendering capabilities. This document provides a high-level overview of the system architecture and guides you to detailed documentation for each area.

• Technology Stack - Frontend, backend, and tooling choices
• Domain Models - Core business logic and data structures
• Database Design - Schema, relationships, and patterns
• Component Architecture - Frontend structure and patterns
• State Management - Data flow and state patterns
• Security Model - Authentication, authorization, and protection
• Performance - Optimization strategies and considerations
• Development Patterns - Code organization and best practices
• Theme System - D&D-inspired design and styling
• File Organization - Project structure and conventions

1. Type Safety First - TypeScript throughout the entire stack
2. Component-Based Architecture - Modular, reusable components
3. Server-Side Rendering - Performance and SEO optimization
4. Progressive Enhancement - Works without JavaScript, enhanced with it
5. Domain-Driven Design - Clear separation of business logic
6. Security by Default - Authentication and authorization built-in

graph TD
    A[Frontend Layer] --> B[Backend Layer]
    B --> C[Database Layer]

    A1[Astro + React] --> A
    A2[Tailwind CSS] --> A
    A3[Slate.js] --> A
    A4[TanStack Query] --> A

    B1[Astro API] --> B
    B2[Better Auth] --> B
    B3[Zod Validation] --> B
    B4[Error Handling] --> B

    C1[Turso/LibSQL] --> C
    C2[Drizzle ORM] --> C
    C3[FTS Search] --> C
    C4[Migrations] --> C

• Campaign Management - Create and organize RPG campaigns
• Arc System - Structured storytelling framework
• Entity Management - NPCs, locations, items, and plot devices
• Search Functionality - Full-text search across all content
• Rich Text Editing - Slate.js-powered content creation
• Internal Linking - Wiki-style cross-references between content
• View/Edit Modes - Dual interface for creation and presentation

For detailed information on each architectural component, please refer to the specific sections linked above. If you’re new to the codebase, we recommend starting with:

1. Technology Stack - Understand the tools and frameworks
2. Domain Models - Learn the core business concepts
3. Component Architecture - Understand the frontend structure
4. Development Patterns - Learn coding conventions