Repository: ChenghengLi/leaseCare-Public
Primary language: JavaScript

# LeaseCare Switzerland - AI-Powered Tenant Protection Platform

A comprehensive tenant protection platform leveraging multi-agent AI systems, computer vision, and Swiss legal expertise to help tenants manage lease agreements, document property conditions, and defend against unfair damage claims.

## 🌐 Live Demo

**Deployed on Vercel**: https://leasecare.chlc.top/

---

## 🚀 Features

### Core Capabilities
- **🤖 Multi-Agent AI Pipeline**: 3-stage defense analysis system with specialized AI agents
- **📄 Smart Document Analysis**: NLP-powered lease agreement parsing with risk assessment
- **🎯 Auto Asset Detection**: ML-based classification (property, vehicles, equipment)
- **📸 Guided Photo Documentation**: Timestamped evidence collection with metadata
- **💬 Live Lease Chat**: Context-aware AI assistant with clickable law citations
- **🔍 Checkout Comparison**: Computer vision damage detection with before/after analysis
- **⚖️ Defense Report Generation**: Automated legal defense with Swiss CO compliance
- **🇨🇭 Swiss Law Integration**: Real-time legal explanations via OpenJustice API

---

## 🏗️ Architecture Overview

### System Architecture

```
┌─────────────────────────────────────────────────────────────┐
│                        Frontend Layer                        │
│  Vue 3 + TypeScript + Tailwind CSS + Vite                   │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                     State Management                         │
│  Pinia Store (Lease Data, User Context, Evidence)           │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                      Service Layer                           │
│  ┌──────────────┐  ┌──────────────┐  ┌──────────────┐      │
│  │  Together AI │  │  OpenJustice │  │   Firebase   │      │
│  │   Service    │  │   Service    │  │   Service    │      │
│  └──────────────┘  └──────────────┘  └──────────────┘      │
└─────────────────────────────────────────────────────────────┘
                              │
                              ▼
┌─────────────────────────────────────────────────────────────┐
│                    External Services                         │
│  ┌──────────────┐  ┌──────────────┐  ┌──────────────┐      │
│  │  Together AI │  │  OpenJustice │  │   Firebase   │      │
│  │  (Llama-4)   │  │     API      │  │  (Storage)   │      │
│  └──────────────┘  └──────────────┘  └──────────────┘      │
└─────────────────────────────────────────────────────────────┘
```

### Data Flow

```
User Upload → Document Parser → AI Analysis → Review Stage
                                      ↓
                              Guided Intake → Photo Storage
                                      ↓
                              Live Chat ← Context Retrieval
                                      ↓
                              Checkout → Damage Detection
                                      ↓
                              Defense Pipeline → Report Generation
```

## 🛠️ Technology Stack

### Frontend Framework
- **Vue 3.5+** - Composition API with `<script setup>`
- **TypeScript 5.5+** - Full type safety across codebase
- **Vite 5.4+** - Lightning-fast HMR and optimized builds
- **Vue Router 4** - SPA navigation with route guards

### UI & Styling
- **Tailwind CSS 3.4+** - Utility-first styling with JIT compiler
- **Lucide Vue Next** - 1000+ consistent SVG icons
- **SweetAlert2** - Beautiful, responsive modals
- **Custom CSS Animations** - Smooth transitions and micro-interactions

### State Management
- **Pinia 2.2+** - Vue 3 native store with TypeScript support
- **Composables** - Reusable reactive logic (useLawCitations)
- **Local Storage** - Persistent user preferences

### AI & ML Services
- **Together AI** - Llama-4-Maverick-17B-128E (FP8 quantized)
  - Chat completions for conversational AI
  - Vision model for image analysis
  - Streaming responses for real-time feedback
- **OpenJustice AI** - Swiss legal knowledge base
  - GPT-4o-mini for law explanations
  - Streaming conversation API
  - Dialog flow integration

### Backend & Storage
- **Firebase 11+**
  - **Authentication** - Email/password with session management
  - **Firestore** - NoSQL database for lease data
  - **Storage** - Image hosting with security rules
  - **Hosting** - Static asset delivery

### Document Processing
- **PDF.js (pdfjs-dist)** - Client-side PDF parsing
- **Custom Parser** - Regex-based clause extraction
- **Text Analysis** - NLP for key information extraction

### Development Tools
- **ESLint** - Code quality and consistency
- **Prettier** - Code formatting
- **TypeScript ESLint** - TS-specific linting
- **Vite Plugin Vue** - Vue 3 SFC support

## 📋 Prerequisites

- Node.js 18+ 
- npm or yarn
- Together AI API key (required for AI features)
- Firebase account (for authentication and storage)
- OpenJustice API key (for law explanations)

## 🔧 Installation

1. **Clone the repository**
```sh
git clone <repository-url>
cd leasecare-vue
```

2. **Install dependencies**
```sh
npm install
```

3. **Configure Environment Variables**

Copy the `.env.example` file to `.env`:
```sh
cp .env.example .env
```

Edit `.env` and add your API keys:
```env
# Together AI (required)
VITE_TOGETHER_API_KEY=tgp_v1_your_key_here
VITE_TOGETHER_BASE_URL=https://api.together.xyz/v1
VITE_TOGETHER_CHAT_MODEL=meta-llama/Llama-4-Maverick-17B-128E-Instruct-FP8
VITE_TOGETHER_VISION_MODEL=meta-llama/Llama-4-Maverick-17B-128E-Instruct-FP8

# Firebase (required)
VITE_FIREBASE_API_KEY=your_firebase_api_key
VITE_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
VITE_FIREBASE_PROJECT_ID=your_project_id
VITE_FIREBASE_STORAGE_BUCKET=your_project.appspot.com
VITE_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
VITE_FIREBASE_APP_ID=your_app_id

# OpenJustice (required for law explanations)
VITE_OPENJUSTICE_API_KEY=nap_your_key_here
```

**Getting API Keys**:
- **Together AI**: Visit [together.ai](https://together.ai) → Sign up → API Keys
- **Firebase**: Visit [console.firebase.google.com](https://console.firebase.google.com) → Create project → Project settings
- **OpenJustice**: Visit [openjustice.ai](https://openjustice.ai) → Sign up → API Keys

## 🚀 Development

Start the development server:
```sh
npm run dev
```

The application will be available at `http://localhost:5173`

## 🏗️ Build for Production

```sh
npm run build
```

Preview the production build:
```sh
npm run preview
```

## 🚀 Deploy to Vercel

See [DEPLOYMENT.md](./DEPLOYMENT.md) for complete deployment instructions.

**Quick Deploy:**
```sh
# Install Vercel CLI
npm i -g vercel

# Deploy
vercel
```

**Important**: Configure environment variables in Vercel dashboard before deploying!

## 📁 Project Structure

```
leasecare-vue/
├── src/
│   ├── components/              # Vue 3 SFC components
│   │   ├── AuthScreen.vue       # Authentication UI
│   │   ├── DashboardView.vue    # Main dashboard
│   │   ├── UploadAnalyzer.vue   # Document upload & parsing
│   │   ├── ReviewStage.vue      # AI analysis results display
│   │   ├── GuidedIntake.vue     # Photo documentation wizard
│   │   ├── LiveLeaseChat.vue    # AI chat interface
│   │   ├── CheckoutComparison.vue  # Damage detection UI
│   │   ├── DefenseHub.vue       # Defense pipeline orchestrator
│   │   ├── DefenseAnalysis.vue  # Defense report display
│   │   └── LawExplanationModal.vue  # OpenJustice integration
│   │
│   ├── services/                # Business logic layer
│   │   ├── togetherService.ts   # Together AI integration
│   │   ├── openJusticeService.ts  # OpenJustice API client
│   │   ├── authService.ts       # Firebase auth wrapper
│   │   ├── leaseService.ts      # Firestore CRUD operations
│   │   └── storageService.ts    # Firebase Storage client
│   │
│   ├── stores/                  # Pinia state management
│   │   └── leaseStore.ts        # Global lease state
│   │
│   ├── composables/             # Reusable composition functions
│   │   └── useLawCitations.ts   # Law citation detection & modal
│   │
│   ├── utils/                   # Helper functions
│   │   ├── documentParser.ts    # PDF text extraction
│   │   └── logger.ts            # Structured logging
│   │
│   ├── constants/               # TypeScript types & constants
│   │   └── index.ts             # Shared interfaces
│   │
│   ├── config/                  # Configuration files
│   │   └── firebase.ts          # Firebase initialization
│   │
│   └── assets/                  # Static assets
│       └── main.css             # Global styles & animations
│
├── public/                      # Static files
│   ├── favicon.ico
│   └── pdf.worker.min.mjs       # PDF.js worker
│
├── .env                         # Environment variables (gitignored)
├── .env.example                 # Environment template
├── vercel.json                  # Vercel deployment config
├── vite.config.ts               # Vite configuration
├── tailwind.config.js           # Tailwind CSS config
├── tsconfig.json                # TypeScript configuration
├── firebase.json                # Firebase config
├── firestore.rules              # Firestore security rules
├── storage.rules                # Storage security rules
├── DEPLOYMENT.md                # Deployment guide
└── SECURITY-CHECKLIST.md        # Security verification
```

---

## 🔄 AI Pipeline Architecture

### 1. Document Analysis Pipeline

**Input**: PDF lease document
**Output**: Structured lease data with risk assessment

```
┌─────────────────────────────────────────────────────────────┐
│                    Document Upload                           │
│  User uploads PDF → Client-side validation → Base64 encode  │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    PDF Text Extraction                       │
│  PDF.js Worker → Text extraction → Clause detection         │
│  Technology: pdfjs-dist 4.8+                                │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    AI Document Analysis                      │
│  Model: Llama-4-Maverick-17B-128E-Instruct-FP8             │
│  Context: Swiss CO Art. 253-274g + Canton jurisdiction      │
│  Tasks:                                                      │
│    1. Asset type classification (property/vehicle/equipment)│
│    2. Clause extraction & legal risk assessment             │
│    3. Irregularity detection (illegal terms)                │
│    4. Inspection item generation (adaptive to asset type)   │
│    5. Benchmark comparison vs standard Swiss leases         │
│  Output: JSON with 10-20 clauses, risk flags, items         │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Review Stage Display                      │
│  Render: Clauses, irregularities, inspection checklist      │
│  Features: Clickable law citations, risk badges             │
└─────────────────────────────────────────────────────────────┘
```

**Key Technologies**:
- PDF.js for text extraction
- Together AI (Llama-4-Maverick) for NLP analysis
- Regex patterns for clause detection
- JSON schema validation

---

### 2. Photo Documentation Pipeline

**Input**: Camera/file upload
**Output**: Timestamped evidence with metadata

```
┌─────────────────────────────────────────────────────────────┐
│                    Guided Intake Wizard                      │
│  Dynamic checklist based on asset type & lease clauses      │
│  Items: Kitchen, Bathroom, Exterior, Tires, Equipment, etc. │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Photo Capture                             │
│  Multiple angles per item (Overall, Close-up, Specific)     │
│  Metadata: Timestamp, GPS (optional), Device info           │
│  Format: JPEG/PNG, max 5MB per photo                        │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Firebase Storage Upload                   │
│  Path: /leases/{leaseId}/intake/{itemId}/{photoIndex}.jpg   │
│  Security: User-specific read/write rules                   │
│  CDN: Global edge caching for fast retrieval                │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Firestore Metadata Storage                │
│  Collection: leases/{leaseId}/evidence                      │
│  Fields: photoUrls[], timestamp, itemName, angles[]         │
└─────────────────────────────────────────────────────────────┘
```

**Key Technologies**:
- HTML5 File API for uploads
- Firebase Storage SDK
- Firestore for metadata
- Base64 encoding for preview

---

### 3. Live Chat Pipeline

**Input**: User question + lease context
**Output**: AI response with clickable law citations

```
┌─────────────────────────────────────────────────────────────┐
│                    User Query Input                          │
│  Examples: "Can I paint?", "What's my notice period?"       │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Context Assembly                          │
│  Gather:                                                     │
│    - Full lease document text                               │
│    - All intake photo URLs                                  │
│    - Lease clauses & irregularities                         │
│    - User info (name, canton)                               │
│    - Jurisdiction-specific rules                            │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    AI Chat Completion                        │
│  Model: Llama-4-Maverick-17B-128E-Instruct-FP8             │
│  System Prompt:                                             │
│    - Swiss rental law expert (Art. 253-274g CO)            │
│    - Canton-specific regulations                            │
│    - Lease context awareness                               │
│    - Format: Markdown with **Art. XXX CO** citations       │
│  Temperature: 0.7 (balanced creativity/accuracy)            │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Response Processing                       │
│  1. Parse markdown formatting                               │
│  2. Detect law citations (regex: **Art. XXX CO**)          │
│  3. Convert to clickable spans                              │
│  4. Render with syntax highlighting                         │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Law Citation Click                        │
│  → OpenJustice API call                                     │
│  → Stream legal explanation                                 │
│  → Display in modal with structured sections                │
└─────────────────────────────────────────────────────────────┘
```

**Key Technologies**:
- Together AI streaming API
- Regex for citation detection
- Vue composables for modal state
- OpenJustice API integration

---

### 4. Checkout Comparison Pipeline

**Input**: Intake photos + new checkout photos
**Output**: Damage detection with severity assessment

```
┌─────────────────────────────────────────────────────────────┐
│                    Photo Pair Selection                      │
│  For each item: Load intake photos from Firebase Storage    │
│  User uploads: New checkout photos (same angles)            │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    AI Vision Analysis                        │
│  Model: Llama-4-Maverick-17B-128E-Instruct-FP8 (Vision)    │
│  Input: Before & After image pairs                          │
│  Context:                                                    │
│    - Lease duration (for normal wear assessment)           │
│    - Asset type (property/vehicle/equipment)               │
│    - Swiss CO Art. 267 (normal wear exemption)             │
│  Analysis:                                                   │
│    1. Detect changes between photos                         │
│    2. Classify: Normal wear vs. Damage                      │
│    3. Severity: Minor / Moderate / Major                    │
│    4. Tenant liability assessment                           │
│    5. Estimated repair cost                                 │
│  Output: JSON with findings per item                        │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Results Display                           │
│  Side-by-side photo comparison                              │
│  Damage highlights with severity badges                     │
│  Liability determination with legal basis                   │
└─────────────────────────────────────────────────────────────┘
```

**Key Technologies**:
- Together AI Vision API
- Image preprocessing (resize, compress)
- Base64 encoding for API transmission
- Canvas API for annotations

---

### 5. Defense Report Pipeline (3-Agent System)

**Input**: Lease data + evidence + landlord claim
**Output**: Comprehensive legal defense report

```
┌─────────────────────────────────────────────────────────────┐
│                    AGENT 1: Context Extraction               │
│  Model: Llama-4-Maverick-17B-128E-Instruct-FP8             │
│  Role: Evidence Analyst                                      │
│  Tasks:                                                      │
│    1. Extract all relevant facts from lease                 │
│    2. Catalog all photo evidence (intake + checkout)        │
│    3. Identify missing documentation gaps                   │
│    4. Assess evidence quality & completeness                │
│    5. Flag procedural issues (e.g., no joint inspection)    │
│  Output: Structured evidence summary (JSON)                 │
│  Context: Swiss CO Art. 268a (inspection requirements)      │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    AGENT 2: Defense Report Writer            │
│  Model: Llama-4-Maverick-17B-128E-Instruct-FP8             │
│  Role: Swiss Rental Law Expert                              │
│  Input: Agent 1 output + user query                         │
│  Context:                                                    │
│    - Full Swiss CO Art. 253-274g knowledge                  │
│    - Canton-specific regulations                            │
│    - Burden of proof rules (Art. 267 CO)                    │
│    - Normal wear vs damage standards                        │
│    - Deposit limits (Art. 257e CO)                          │
│  Tasks:                                                      │
│    1. Analyze landlord's claim legality                     │
│    2. Build defense arguments with CO citations             │
│    3. Reference photo evidence                              │
│    4. Identify procedural violations                        │
│    5. Calculate fair deduction (if any)                     │
│    6. Draft negotiation strategy                            │
│    7. Provide escalation path (conciliation/court)          │
│  Output: 2000+ word defense report with **Art. XXX CO**     │
│  Format: Markdown with structured sections                  │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    AGENT 3: Case Evaluator                   │
│  Model: Llama-4-Maverick-17B-128E-Instruct-FP8             │
│  Role: Legal Strategist                                      │
│  Input: Agent 2 defense report                              │
│  Tasks:                                                      │
│    1. Evaluate case strength (0-100 score)                  │
│    2. Identify key weaknesses                               │
│    3. Assess missing evidence impact                        │
│    4. Predict likely outcome                                │
│    5. Risk factor analysis                                  │
│    6. Recommend next steps with timeline                    │
│  Output: Strategic assessment (JSON)                        │
│  Scoring:                                                    │
│    - Evidence Quality: 0-30 points                          │
│    - Legal Merit: 0-40 points                               │
│    - Financial Reasonableness: 0-15 points                  │
│    - Procedural Compliance: 0-15 points                     │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Final Report Assembly                     │
│  Combine all 3 agent outputs                                │
│  Add clickable law citations                                │
│  Generate PDF export option                                 │
│  Save to Firestore for future reference                     │
└─────────────────────────────────────────────────────────────┘
```

**Key Technologies**:
- Multi-agent orchestration
- Sequential API calls with context passing
- JSON schema validation between agents
- Markdown rendering with citation detection
- PDF generation (future feature)

---

### 6. Law Citation Pipeline (OpenJustice Integration)

**Input**: Swiss CO article reference (e.g., "Art. 267 CO")
**Output**: Structured legal explanation

```
┌─────────────────────────────────────────────────────────────┐
│                    Citation Detection                        │
│  Regex: /\*\*((?:OR\s+)?Art\.?\s*\d+[a-z]?(?:\s+(?:CO|OR))?)\*\*/gi │
│  Fallback: /\b((?:OR\s+)?Art\.?\s*\d+[a-z]?(?:\s+(?:CO|OR))?)\b/gi  │
│  Convert to clickable spans with data-article attribute     │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    User Clicks Citation                      │
│  Event listener on law-citation class                       │
│  Extract article from data-article attribute                │
│  Open modal with loading state                              │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    OpenJustice API Call                      │
│  Step 1: Create conversation                                │
│    POST /conversation/create-new                            │
│    Body: { name, dialogFlowId: "o13pubarfej" }             │
│  Step 2: Send message                                       │
│    POST /conversation/send-message                          │
│    Prompt: "Explain Art. XXX CO in rental law context"     │
│    Context: Swiss CO Art. 253-274g, tenant protections     │
│  Step 3: Stream response                                    │
│    GET /conversation/stream/{conversationId}                │
│    Format: Server-Sent Events (SSE)                        │
│    Parse: data: {text: "..."} chunks                        │
└─────────────────────────────────────────────────────────────┘
                              ↓
┌─────────────────────────────────────────────────────────────┐
│                    Response Parsing                          │
│  Detect sections: 1. **Title**: content                    │
│  Assign icons: 📋 Summary, 👤 Implications, 💡 Example     │
│  Color-code: Blue, Emerald, Amber, Purple, Rose            │
│  Render in modal with gradients & hover effects            │
└─────────────────────────────────────────────────────────────┘
```

**Key Technologies**:
- OpenJustice AI (GPT-4o-mini)
- Server-Sent Events (SSE) streaming
- Regex-based section parsing
- Vue composables for modal state
- Tailwind CSS for styling

---

## 🎯 Usage Flow

1. **Login**: Enter your name and select your Swiss canton
2. **Dashboard**: View your leases and start a new one
3. **Upload**: Upload a lease PDF (or try demo files)
4. **Review**: AI analyzes the contract and identifies risks
5. **Intake**: Photograph all required items with guided checklist
6. **Live Lease**: Chat with AI assistant about your lease
7. **Checkout**: Compare photos to detect new damages
8. **Defense**: Generate defense letters for unfair claims

## 🤖 Together AI Integration

The application uses Together AI's Llama-4-Maverick model for all AI features:

- **Chat Completions**: Live Lease assistant with context awareness
- **Document Analysis**: Lease agreement parsing and risk assessment
- **Vision Analysis**: Damage detection with before/after photo comparison
- **Streaming Responses**: Real-time AI output for better UX

### Model Configuration

Default: `meta-llama/Llama-4-Maverick-17B-128E-Instruct-FP8`

This model provides:
- Fast inference (FP8 quantization)
- High accuracy for legal text analysis
- Vision capabilities for image comparison
- Cost-effective API usage

## 🌍 Swiss Cantons Supported

All 26 Swiss cantons are supported with jurisdiction-specific legal advice:
- Aargau, Appenzell (AR/AI), Basel (BL/BS), Bern, Fribourg, Geneva, Glarus, Graubünden, Jura, Lucerne, Neuchâtel, Nidwalden, Obwalden, Schaffhausen, Schwyz, Solothurn, St. Gallen, Thurgau, Ticino, Uri, Valais, Vaud, Zug, Zurich

---

## ⚡ Performance & Optimization

### Build Optimizations
- **Code Splitting**: Dynamic imports for route-based chunks
- **Tree Shaking**: Unused code elimination via Vite
- **Asset Optimization**: Image compression, lazy loading
- **CSS Purging**: Tailwind JIT removes unused styles
- **Minification**: Terser for JS, cssnano for CSS

### Runtime Performance
- **Virtual Scrolling**: Large lists (photo galleries)
- **Debounced Inputs**: Search, chat typing indicators
- **Memoization**: Computed properties, cached API responses
- **Lazy Components**: Modal, heavy UI components
- **Service Workers**: Offline capability (future)

### API Optimization
- **Streaming Responses**: Real-time AI output (Together AI, OpenJustice)
- **Request Batching**: Multiple photos in single Firebase upload
- **Caching Strategy**: LocalStorage for user preferences, Firestore for lease data
- **Error Retry Logic**: Exponential backoff for failed requests

### Bundle Size
- **Initial Load**: ~250KB (gzipped)
- **Vendor Chunk**: ~180KB (Vue, Firebase, PDF.js)
- **App Chunk**: ~70KB (application code)
- **Total Assets**: ~500KB (including fonts, icons)

---

## 🔒 Security Features

### Authentication & Authorization
- **Firebase Auth**: Secure email/password authentication
- **Session Management**: Persistent login with token refresh
- **Route Guards**: Protected routes require authentication
- **User Isolation**: Firestore rules enforce user-specific data access

### Data Protection
- **Environment Variables**: All API keys in Vercel environment (never in code)
- **HTTPS Only**: Enforced via Vercel deployment
- **CORS Configuration**: Restricted to app domain
- **Input Validation**: Client-side and server-side validation
- **XSS Prevention**: Vue's built-in template escaping
- **SQL Injection**: N/A (NoSQL Firestore)

### Firestore Security Rules
```javascript
rules_version = '2';
service cloud.firestore {
  match /databases/{database}/documents {
    match /leases/{leaseId} {
      allow read, write: if request.auth != null && 
                          request.auth.uid == resource.data.userId;
    }
  }
}
```

### Storage Security Rules
```javascript
rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    match /leases/{leaseId}/{allPaths=**} {
      allow read, write: if request.auth != null;
    }
  }
}
```

---

## 📊 Technical Specifications

### System Requirements
- **Browser**: Chrome 90+, Firefox 88+, Safari 14+, Edge 90+
- **Mobile**: iOS 14+, Android 10+
- **Network**: 3G minimum (4G/WiFi recommended for photo uploads)
- **Storage**: 50MB local storage for caching

### API Rate Limits
- **Together AI**: 60 requests/minute (configurable)
- **OpenJustice**: 100 requests/hour
- **Firebase**: 50,000 reads/day (free tier), 20,000 writes/day

### Data Limits
- **PDF Upload**: Max 10MB per document
- **Photo Upload**: Max 5MB per photo, 20 photos per item
- **Firestore Document**: Max 1MB per lease document
- **Storage**: 5GB total per user (Firebase free tier)

### Response Times (Average)
- **Document Analysis**: 5-10 seconds
- **Chat Response**: 2-5 seconds (streaming)
- **Photo Upload**: 1-3 seconds per photo
- **Law Explanation**: 3-7 seconds (streaming)
- **Defense Report**: 15-30 seconds (3-agent pipeline)

---

## 🚀 Deployment Architecture

### Vercel Edge Network
- **Global CDN**: 70+ edge locations worldwide
- **Automatic HTTPS**: SSL/TLS certificates
- **DDoS Protection**: Built-in security
- **Serverless Functions**: API routes (if needed)
- **Preview Deployments**: Per-branch automatic deploys

### Environment Configuration
```bash
# Production
VITE_TOGETHER_API_KEY=***
VITE_OPENJUSTICE_API_KEY=***
VITE_FIREBASE_*=***

# Staging (optional)
VITE_TOGETHER_API_KEY=***_staging
VITE_OPENJUSTICE_API_KEY=***_staging
```

### CI/CD Pipeline
```
Git Push → GitHub → Vercel Build → Deploy to Edge
   ↓
Automatic:
- Install dependencies
- Run TypeScript checks
- Build with Vite
- Deploy to CDN
- Invalidate cache
```

### Monitoring & Analytics
- **Vercel Analytics**: Page views, performance metrics
- **Firebase Analytics**: User behavior, feature usage
- **Error Tracking**: Console logging with structured format
- **Performance**: Core Web Vitals monitoring

---

## 🐛 Known Issues

- TypeScript warnings about `currentItem` being possibly undefined are false positives (array bounds are checked)
- Tailwind CSS warnings in IDE are expected (directives processed by PostCSS)

## 📝 License

This project is for educational and demonstration purposes.

## 🤝 Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

## 📧 Support

For issues or questions, please open an issue on GitHub.