Deploy CareerAI to HuggingFace Spaces

.gitattributes

@@ -0,0 +1 @@
+*.png filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,46 @@
+# Python
+__pycache__/
+*.py[cod]
+*$py.class
+*.so
+
+# Virtual environment
+venv/
+.venv/
+ENV/
+
+# Data (generated at runtime)
+data/uploads/
+data/vectordb/
+careerai.db
+
+# Environment secrets (NEVER commit!)
+.env
+.env.*
+
+# Streamlit secrets (contains API keys!)
+.streamlit/secrets.toml
+
+# Legacy Streamlit app (replaced by FastAPI + frontend/)
+app.py
+
+# IDE
+.vscode/
+.idea/
+*.swp
+*.swo
+
+# OS
+.DS_Store
+Thumbs.db
+desktop.ini
+
+# Test outputs
+test_output.txt
+test_results*.txt
+_size.tmp
+
+# Distribution
+*.egg-info/
+dist/
+build/

.streamlit/config.toml

@@ -0,0 +1,13 @@
+[theme]
+primaryColor = "#8B5CF6"
+backgroundColor = "#09090B"
+secondaryBackgroundColor = "#18181B"
+textColor = "#FAFAFA"
+font = "sans serif"
+
+[server]
+maxUploadSize = 50
+headless = true
+
+[browser]
+gatherUsageStats = false

Dockerfile

@@ -0,0 +1,31 @@
+FROM python:3.11-slim
+
+# System dependencies for document processing
+RUN apt-get update && apt-get install -y --no-install-recommends \
+    build-essential \
+    && rm -rf /var/lib/apt/lists/*
+
+# Create non-root user (required by HF Spaces)
+RUN useradd -m -u 1000 user
+USER user
+ENV HOME=/home/user \
+    PATH=/home/user/.local/bin:$PATH
+
+WORKDIR /home/user/app
+
+# Install Python dependencies first (cached layer)
+COPY --chown=user requirements.txt .
+RUN pip install --no-cache-dir --upgrade pip && \
+    pip install --no-cache-dir -r requirements.txt
+
+# Copy application code
+COPY --chown=user . .
+
+# Create data directories
+RUN mkdir -p data/uploads data/vectordb
+
+# HF Spaces uses port 7860 by default
+EXPOSE 7860
+
+# Start command — HF Spaces expects port 7860
+CMD uvicorn api:app --host 0.0.0.0 --port 7860 --workers 1

README.md

@@ -0,0 +1,484 @@
+---
+title: CareerAI
+emoji: 🚀
+colorFrom: green
+colorTo: blue
+sdk: docker
+app_port: 7860
+pinned: true
+---
+
+<p align="center">
+  <img src="https://i.postimg.cc/2yY6ztpG/ideogram-v3-0-Logo-minimalista-y-moderno-para-Career-AI-una-app-de-asistente-IA-para-carreras-p-0-(1.png" alt="CareerAI Logo" width="420">
+</p>
+
+<h1 align="center">CareerAI</h1>
+
+<p align="center">
+  <strong>🧠 AI-Powered Career Assistant | Asistente Inteligente de Carrera</strong><br>
+  <em>Analyze your CV · Generate Cover Letters · Simulate Interviews · Search Jobs</em>
+</p>
+
+<p align="center">
+  <img src="https://img.shields.io/badge/Python-3.10+-blue?logo=python&logoColor=white" alt="Python">
+  <img src="https://img.shields.io/badge/FastAPI-0.115+-green?logo=fastapi&logoColor=white" alt="FastAPI">
+  <img src="https://img.shields.io/badge/Groq-Llama_3.3-orange?logo=meta&logoColor=white" alt="Groq">
+  <img src="https://img.shields.io/badge/ChromaDB-Vector_Store-purple" alt="ChromaDB">
+  <img src="https://img.shields.io/badge/License-MIT-yellow" alt="License">
+</p>
+
+<p align="center">
+  <a href="#-english">🇺🇸 English</a> · <a href="#-español">🇦🇷 Español</a>
+</p>
+
+---
+
+# 🇺🇸 English
+
+## 🎬 What is CareerAI?
+
+**CareerAI** is an AI-powered web application that helps you boost your professional career. Upload your documents (CV, cover letters, certificates) and the AI assistant analyzes them using advanced Retrieval-Augmented Generation (RAG) to give you personalized recommendations, generate professional documents, and prepare you for job interviews.
+
+### ✨ 100% Free · No hallucinations · Based on your real documents
+
+---
+
+## 🚀 Key Features
+
+### 🤖 Custom AI Models
+
+| Model | Engine | Description |
+|-------|--------|-------------|
+| 🧠 **CareerAI Pro** | Llama 3.3 70B | Maximum quality · Detailed responses |
+| ⚡ **CareerAI Flash** | Llama 3.1 8B | Ultra fast · Instant responses |
+
+### 💬 5 Assistant Modes
+
+| Mode | What it does |
+|------|-------------|
+| 💬 **General Chat** | Ask anything about your professional career |
+| 🎯 **Job Match** | Analyze your compatibility with job offers (% match) |
+| ✉️ **Cover Letter** | Generate personalized cover letters using your real CV |
+| 📈 **Skills Gap** | Identify missing skills + roadmap to improve |
+| 🎤 **Interview** | Simulate interviews with technical and STAR method questions |
+
+### 📋 Full Feature List
+
+| Feature | Description |
+|---------|-------------|
+| 📄 **Multi-format** | Supports PDF, DOCX, TXT, images (JPG, PNG, WebP) |
+| 🖼️ **Vision AI** | Smart reading of scanned PDFs and document photos |
+| ⚡ **Streaming** | Real-time token-by-token responses |
+| 📤 **Premium Export** | Export to PDF, DOCX, HTML, TXT with professional formatting |
+| 📊 **Dashboard** | Skills charts, professional timeline, AI insights |
+| 🔐 **Full Auth** | Register, login, Google OAuth, password reset |
+| 💼 **Job Search** | Integration with LinkedIn, Indeed, Glassdoor via JSearch |
+| 🎨 **Premium UI** | Claude/ChatGPT-style design with dark mode |
+| 📱 **Responsive** | Works on desktop, tablet, and mobile |
+| 💾 **Persistence** | Chat history synced to the cloud |
+
+---
+
+## 🧠 RAG Pipeline v2.0
+
+CareerAI uses an advanced retrieval pipeline combining multiple techniques to find the most relevant information from your documents:
+
+```
+📝 User Query
+     │
+     ├── 1️⃣ Vector Search (Semantic)
+     │      └── ChromaDB + BGE-M3 (100+ languages)
+     │
+     ├── 2️⃣ Keyword Search (Lexical)
+     │      └── BM25 lexical matching
+     │
+     ├── 3️⃣ Reciprocal Rank Fusion (RRF)
+     │      └── Merges semantic + lexical results
+     │
+     ├── 4️⃣ Reranking (Cross-Encoder)
+     │      └── BGE-Reranker-v2-m3 (relevance reordering)
+     │
+     └── 5️⃣ LLM with optimized context
+            └── Groq + Llama 3.3 70B (streaming)
+```
+
+### Available Embedding Models
+
+| Model | Languages | Size | Performance |
+|-------|-----------|------|-------------|
+| 🌍 **BGE-M3** (Recommended) | 100+ | ~2.3 GB | ⭐⭐⭐⭐⭐ |
+| 🚀 **GTE Multilingual** | 70+ | ~580 MB | ⭐⭐⭐⭐ |
+| 📐 **Multilingual E5** | 100+ | ~1.1 GB | ⭐⭐⭐⭐ |
+| ⚡ **MiniLM v2** | English | ~90 MB | ⭐⭐⭐ |
+
+---
+
+## 🛠️ Tech Stack
+
+| Layer | Technology |
+|-------|------------|
+| **Backend** | FastAPI + Uvicorn |
+| **Frontend** | HTML5 + CSS3 + JavaScript (Claude-style) |
+| **LLM** | Groq API (Llama 3.3 70B / Llama 3.1 8B) |
+| **RAG** | ChromaDB + BM25 + BGE-M3 + Reranker + RRF |
+| **Database** | SQLite + SQLAlchemy |
+| **Auth** | JWT + BCrypt + Google OAuth |
+| **Email** | FastAPI-Mail + Gmail SMTP |
+| **Vision AI** | Groq + Llama 4 Scout |
+| **Embeddings** | HuggingFace (BGE-M3, GTE, E5, MiniLM) |
+| **Export** | FPDF2, python-docx |
+| **Job Search** | JSearch API (RapidAPI) |
+
+---
+
+## � Installation & Setup
+
+### 1. Clone the repository
+
+```bash
+git clone https://github.com/Nicola671/CareerAI.git
+cd CareerAI
+```
+
+### 2. Create virtual environment
+
+```bash
+python -m venv venv
+
+# Windows
+venv\Scripts\activate
+
+# Mac/Linux
+source venv/bin/activate
+```
+
+### 3. Install dependencies
+
+```bash
+pip install -r requirements.txt
+```
+
+### 4. Configure environment variables
+
+Create a `.env` file in the project root:
+
+```env
+# Groq API Key (free from console.groq.com)
+GROQ_API_KEY=your_api_key_here
+
+# JWT Secret (change to something random)
+SECRET_KEY=your_very_long_random_secret_key
+
+# Email for password recovery (optional)
+MAIL_USERNAME=your_email@gmail.com
+MAIL_PASSWORD=your_app_password
+MAIL_FROM=your_email@gmail.com
+
+# JSearch API Key for job search (optional)
+JSEARCH_API_KEY=your_jsearch_key
+```
+
+### 5. Get Groq API Key (FREE)
+
+1. Go to [console.groq.com](https://console.groq.com)
+2. Create a free account
+3. Go to "API Keys" → "Create API Key"
+4. Copy your key (starts with `gsk_...`)
+5. Paste it in your `.env` file
+
+### 6. Run
+
+```bash
+uvicorn api:app --reload --port 8000
+```
+
+Open **http://localhost:8000** in your browser 🚀
+
+---
+
+## � API Endpoints (22 routes)
+
+| Group | Endpoints | Description |
+|-------|-----------|-------------|
+| 🏠 Frontend | `GET /` | Serves the web app |
+| ⚙️ Config | `GET /api/status`, `POST /api/config` | Status & configuration |
+| 💬 Chat | `POST /api/chat`, `POST /api/chat/stream` | Chat with/without streaming |
+| 📄 Docs | `POST /api/documents`, `GET /api/documents`, `DELETE /api/documents/{file}` | Document CRUD |
+| 📤 Export | `POST /api/export`, `POST /api/export/conversation` | Export to PDF/DOCX/HTML/TXT |
+| 💼 Jobs | `GET /api/jobs` | Job search |
+| 📊 Dashboard | `GET /api/dashboard` | AI-powered profile analysis |
+| 🔐 Auth | `POST /api/auth/register`, `POST /api/auth/login`, `GET /api/auth/me` | Full authentication |
+
+Interactive API docs: **http://localhost:8000/docs** (Swagger UI)
+
+---
+
+## 📊 Project Metrics
+
+| Metric | Value |
+|--------|-------|
+| Lines of code | 8,400+ |
+| API Endpoints | 22 |
+| Frontend functions | 80+ |
+| Backend functions | 60+ |
+| Assistant modes | 5 |
+| Export formats | 4 (PDF, DOCX, HTML, TXT) |
+| Upload formats | 7 (PDF, DOCX, TXT, JPG, PNG, WEBP) |
+| Embedding models | 4 |
+
+---
+
+---
+
+# 🇦🇷 Español
+
+## 🎬 ¿Qué es CareerAI?
+
+**CareerAI** es una aplicación web de inteligencia artificial que te ayuda a impulsar tu carrera profesional. Subís tus documentos (CV, cartas, certificados) y el asistente los analiza con IA avanzada (RAG) para darte recomendaciones personalizadas, generar documentos profesionales y prepararte para entrevistas.
+
+### ✨ Todo esto 100% gratis · Sin alucinaciones · Basado en tus documentos reales
+
+---
+
+## 🚀 Funcionalidades Principales
+
+### 🤖 Modelos de IA Personalizados
+
+| Modelo | Motor | Descripción |
+|--------|-------|-------------|
+| 🧠 **CareerAI Pro** | Llama 3.3 70B | Máxima calidad · Respuestas detalladas |
+| ⚡ **CareerAI Flash** | Llama 3.1 8B | Ultra rápido · Respuestas al instante |
+
+### 💬 5 Modos del Asistente
+
+| Modo | Qué hace |
+|------|----------|
+| 💬 **Chat General** | Consultá lo que quieras sobre tu carrera profesional |
+| 🎯 **Job Match** | Analizá tu compatibilidad con ofertas de trabajo (% de match) |
+| ✉️ **Cover Letter** | Generá cartas de presentación personalizadas usando tu CV real |
+| 📈 **Skills Gap** | Identificá habilidades faltantes + roadmap para mejorar |
+| 🎤 **Entrevista** | Simulá entrevistas con preguntas técnicas y método STAR |
+
+### 📋 Lista Completa de Características
+
+| Feature | Descripción |
+|---------|-------------|
+| 📄 **Multi-formato** | Soporta PDF, DOCX, TXT, imágenes (JPG, PNG, WebP) |
+| 🖼️ **Vision AI** | Lectura inteligente de PDFs escaneados y fotos de documentos |
+| ⚡ **Streaming** | Respuestas en tiempo real token por token |
+| 📤 **Export Premium** | Exportá a PDF, DOCX, HTML, TXT con formato profesional |
+| 📊 **Dashboard** | Gráficos de skills, timeline profesional, insights de IA |
+| 🔐 **Auth Completo** | Registro, login, Google OAuth, reset de contraseña |
+| 💼 **Búsqueda de Empleo** | Integración con LinkedIn, Indeed, Glassdoor via JSearch |
+| 🎨 **UI Premium** | Diseño tipo Claude/ChatGPT con dark mode |
+| 📱 **Responsive** | Funciona en desktop, tablet y celular |
+| 💾 **Persistencia** | Historial de chats sincronizado en la nube |
+
+---
+
+## 🧠 Pipeline RAG v2.0
+
+CareerAI usa un pipeline de retrieval avanzado que combina múltiples técnicas para encontrar la información más relevante de tus documentos:
+
+```
+📝 Query del usuario
+     │
+     ├── 1️⃣ Vector Search (Semántico)
+     │      └── ChromaDB + BGE-M3 (100+ idiomas)
+     │
+     ├── 2️⃣ Keyword Search (Léxico)
+     │      └── BM25 lexical matching
+     │
+     ├── 3️⃣ Reciprocal Rank Fusion (RRF)
+     │      └── Combina resultados semánticos + léxicos
+     │
+     ├── 4️⃣ Reranking (Cross-Encoder)
+     │      └── BGE-Reranker-v2-m3 (reordena por relevancia)
+     │
+     └── 5️⃣ LLM con contexto optimizado
+            └── Groq + Llama 3.3 70B (streaming)
+```
+
+---
+
+## 🛠️ Stack Tecnológico
+
+| Capa | Tecnología |
+|------|------------|
+| **Backend** | FastAPI + Uvicorn |
+| **Frontend** | HTML5 + CSS3 + JavaScript (estilo Claude) |
+| **LLM** | Groq API (Llama 3.3 70B / Llama 3.1 8B) |
+| **RAG** | ChromaDB + BM25 + BGE-M3 + Reranker + RRF |
+| **Base de datos** | SQLite + SQLAlchemy |
+| **Auth** | JWT + BCrypt + Google OAuth |
+| **Email** | FastAPI-Mail + Gmail SMTP |
+| **Vision AI** | Groq + Llama 4 Scout |
+| **Embeddings** | HuggingFace (BGE-M3, GTE, E5, MiniLM) |
+| **Exportación** | FPDF2, python-docx |
+| **Búsqueda** | JSearch API (RapidAPI) |
+
+---
+
+## 🚀 Instalación y Setup
+
+### 1. Clonar el repositorio
+
+```bash
+git clone https://github.com/Nicola671/CareerAI.git
+cd CareerAI
+```
+
+### 2. Crear entorno virtual
+
+```bash
+python -m venv venv
+
+# Windows
+venv\Scripts\activate
+
+# Mac/Linux
+source venv/bin/activate
+```
+
+### 3. Instalar dependencias
+
+```bash
+pip install -r requirements.txt
+```
+
+### 4. Configurar variables de entorno
+
+Creá un archivo `.env` en la raíz del proyecto:
+
+```env
+# Groq API Key (gratis desde console.groq.com)
+GROQ_API_KEY=tu_api_key_aqui
+
+# JWT Secret (cambiá por algo aleatorio)
+SECRET_KEY=tu_secret_key_muy_larga_y_aleatoria
+
+# Email para recuperación de contraseña (opcional)
+MAIL_USERNAME=tu_email@gmail.com
+MAIL_PASSWORD=tu_app_password
+MAIL_FROM=tu_email@gmail.com
+
+# JSearch API Key para búsqueda de empleos (opcional)
+JSEARCH_API_KEY=tu_jsearch_key
+```
+
+### 5. Obtener API Key de Groq (GRATIS)
+
+1. Andá a [console.groq.com](https://console.groq.com)
+2. Creá una cuenta gratis
+3. Andá a "API Keys" → "Create API Key"
+4. Copiá tu key (empieza con `gsk_...`)
+5. Pegala en el archivo `.env`
+
+### 6. Ejecutar
+
+```bash
+uvicorn api:app --reload --port 8000
+```
+
+Abrí **http://localhost:8000** en tu navegador 🚀
+
+---
+
+## � Estructura del Proyecto
+
+```
+CareerAI/
+├── api.py                        # 🚀 Backend FastAPI (22 endpoints)
+├── requirements.txt              # 📦 Dependencias Python
+├── .env                          # 🔐 Variables de entorno (NO se sube a Git)
+├── README.md                     # 📖 Este archivo
+│
+├── frontend/                     # 🎨 UI tipo Claude
+│   ├── index.html                # Estructura HTML
+│   ├── app.js                    # Lógica completa (1,842 líneas)
+│   ├── styles.css                # Sistema de diseño (1,695 líneas)
+│   ├── icon-pro.png              # 🧠 Icono CareerAI Pro
+│   ├── icon-flash.png            # ⚡ Icono CareerAI Flash
+│   └── favicon.png               # Favicon
+│
+├── src/                          # 🧠 Core Engine
+│   ├── career_assistant.py       # Motor IA con 5 modos especializados
+│   ├── rag_engine.py             # RAG v2.0 (Hybrid + Reranking + RRF)
+│   ├── document_processor.py     # Procesador multi-formato + Vision AI
+│   ├── profile_extractor.py      # Extractor de perfil para dashboard
+│   ├── exporter.py               # Exportación PDF/DOCX/HTML/TXT
+│   ├── auth.py                   # Autenticación (JWT + Google OAuth)
+│   └── models.py                 # Modelos SQLAlchemy (User, Conversation)
+│
+└── data/                         # 💾 Datos (no se suben a Git)
+    ├── uploads/                  # Documentos subidos
+    └── vectordb/                 # ChromaDB persistencia
+```
+
+---
+
+## 🆓 ¿Por qué es 100% Gratis? / Why is it 100% Free?
+
+| Component | Cost |
+|-----------|------|
+| Groq API (Llama 3.3 70B) | ✅ Free (generous rate limits) |
+| BGE-M3 Embeddings | ✅ Free (runs locally) |
+| BGE-Reranker-v2-m3 | ✅ Free (runs locally) |
+| BM25 Keyword Search | ✅ Free (runs locally) |
+| ChromaDB Vector Store | ✅ Free (runs locally) |
+| FastAPI + Frontend | ✅ Free (open source) |
+| SQLite Database | ✅ Free (runs locally) |
+
+---
+
+## 🤝 Contributing
+
+Contributions are welcome! If you want to improve CareerAI:
+
+1. Fork the repository
+2. Create a branch: `git checkout -b feature/new-feature`
+3. Commit: `git commit -m "Add new feature"`
+4. Push: `git push origin feature/new-feature`
+5. Open a Pull Request
+
+---
+
+## 📄 License
+
+This project is licensed under the MIT License. Feel free to use, modify, and distribute it.
+
+---
+
+## 👨‍💻 Author / Autor
+
+<p align="center">
+  <strong>Nicolás Medina</strong>
+</p>
+
+<p align="center">
+  <a href="https://github.com/Nicola671">
+    <img src="https://img.shields.io/badge/GitHub-Nicola671-181717?logo=github&logoColor=white&style=for-the-badge" alt="GitHub">
+  </a>
+  &nbsp;
+  <a href="https://www.linkedin.com/in/nicolás-medina-33663237a">
+    <img src="https://img.shields.io/badge/LinkedIn-Nicolás_Medina-0A66C2?logo=linkedin&logoColor=white&style=for-the-badge" alt="LinkedIn">
+  </a>
+  &nbsp;
+  <a href="mailto:nicolasmedinae06@gmail.com">
+    <img src="https://img.shields.io/badge/Email-nicolasmedinae06@gmail.com-EA4335?logo=gmail&logoColor=white&style=for-the-badge" alt="Email">
+  </a>
+</p>
+
+<br>
+
+<p align="center">
+  <em>If this project helped you, consider giving it a ⭐ on GitHub!</em><br>
+  <em>Si este proyecto te ayudó, ¡considerá darle una ⭐ en GitHub!</em>
+</p>
+
+<br>
+
+<p align="center">
+  <strong>CareerAI v1.0</strong> — FastAPI + RAG v2.0 + Groq<br>
+  <em>Made with ❤️ in Argentina 🇦🇷</em>
+</p>

api.py

@@ -0,0 +1,713 @@
+"""
+🚀 CareerAI — FastAPI Backend
+Connects the Claude-style frontend with the existing RAG + Groq + ChromaDB engine.
+Run: uvicorn api:app --reload --port 8000
+"""
+
+import os
+import sys
+import json
+import asyncio
+from datetime import datetime
+from typing import List, Dict, Optional
+from contextlib import asynccontextmanager
+from dotenv import load_dotenv
+
+# Load .env file
+load_dotenv()
+
+from fastapi import FastAPI, UploadFile, File, Form, HTTPException, Query, Depends
+from fastapi.middleware.cors import CORSMiddleware
+from fastapi.staticfiles import StaticFiles
+from fastapi.responses import (
+    StreamingResponse,
+    FileResponse,
+    Response,
+    JSONResponse,
+)
+from pydantic import BaseModel
+
+# Add project root to path
+sys.path.insert(0, os.path.dirname(__file__))
+
+from src.rag_engine import RAGEngine, EMBEDDING_MODELS
+from src.career_assistant import CareerAssistant
+from src.document_processor import DocumentProcessor
+from src.exporter import (
+    export_to_pdf,
+    export_to_docx,
+    export_to_html,
+    export_to_txt,
+    get_smart_filename,
+    export_conversation_to_pdf,
+    export_conversation_to_docx,
+    export_conversation_to_html,
+)
+from src.profile_extractor import (
+    extract_profile_from_text,
+    generate_dashboard_insights,
+    skills_by_category,
+    skills_by_level,
+    experience_for_timeline,
+)
+
+# Import Auth routers
+from src.auth import router as auth_router, conv_router, get_user_or_session_id
+
+
+# ======================== STATE ========================
+class AppState:
+    """Global application state (shared across requests)."""
+
+    def __init__(self):
+        self.rag_engine: Optional[RAGEngine] = None
+        self.assistant: Optional[CareerAssistant] = None
+        self.api_key: str = ""
+        self.model: str = "llama-3.3-70b-versatile"
+        self.api_configured: bool = False
+        # Embedding model: configurable via env var for production (e.g. "gte-multilingual")
+        self.embedding_model: str = os.environ.get("EMBEDDING_MODEL", "bge-m3")
+        # Reranking: disable in production to save RAM (set ENABLE_RERANKING=false)
+        self.enable_reranking: bool = os.environ.get("ENABLE_RERANKING", "true").lower() in ("true", "1", "yes")
+        self.enable_hybrid: bool = True
+
+    def get_rag(self) -> RAGEngine:
+        if self.rag_engine is None:
+            self.rag_engine = RAGEngine(
+                embedding_key=self.embedding_model,
+                enable_reranking=self.enable_reranking,
+                enable_hybrid=self.enable_hybrid,
+            )
+        return self.rag_engine
+
+    def reset_rag(self):
+        """Reset RAG engine (e.g. when embedding model changes)."""
+        self.rag_engine = None
+
+    def init_assistant(self, api_key: str, model: str):
+        self.assistant = CareerAssistant(api_key=api_key, model=model)
+        self.api_key = api_key
+        self.model = model
+        self.api_configured = True
+
+
+state = AppState()
+
+
+# ======================== AUTO-LOAD API KEY ========================
+def _auto_load_api_key():
+    """Try to load API key from environment or secrets.toml."""
+    # 1. Environment variable
+    key = os.environ.get("GROQ_API_KEY", "")
+    if key:
+        return key
+
+    # 2. .streamlit/secrets.toml
+    try:
+        import re as _re
+        secrets_path = os.path.join(os.path.dirname(__file__), ".streamlit", "secrets.toml")
+        if os.path.exists(secrets_path):
+            with open(secrets_path, "r", encoding="utf-8") as f:
+                for line in f:
+                    line = line.strip()
+                    if line.startswith("GROQ_API_KEY"):
+                        m = _re.search(r'"(.+?)"', line)
+                        if m:
+                            return m.group(1)
+    except Exception:
+        pass
+
+    return ""
+
+
+# ======================== STARTUP ========================
+@asynccontextmanager
+async def lifespan(app: FastAPI):
+    """Initialize on startup."""
+    # Auto-configure API key
+    key = _auto_load_api_key()
+    if key:
+        try:
+            state.init_assistant(key, state.model)
+            print(f"✅ Auto-connected with API key (model: {state.model})")
+        except Exception as e:
+            print(f"⚠️ Could not auto-connect: {e}")
+
+    # Pre-initialize RAG engine
+    try:
+        rag = state.get_rag()
+        stats = rag.get_stats()
+        print(f"✅ RAG engine ready ({stats['total_documents']} docs, {stats['total_chunks']} chunks)")
+    except Exception as e:
+        print(f"⚠️ RAG engine init: {e}")
+
+    yield
+    print("🔴 CareerAI API shutting down")
+
+
+# ======================== APP ========================
+app = FastAPI(
+    title="CareerAI API",
+    description="Backend API for CareerAI Assistant",
+    version="1.0.0",
+    docs_url="/docs",
+    redoc_url=None,
+    lifespan=lifespan,
+)
+
+# Register specialized routers
+app.include_router(auth_router)
+app.include_router(conv_router)
+
+# CORS — allow frontend
+app.add_middleware(
+    CORSMiddleware,
+    allow_origins=["*"],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)
+
+# Serve frontend static files
+frontend_dir = os.path.join(os.path.dirname(__file__), "frontend")
+if os.path.isdir(frontend_dir):
+    app.mount("/static", StaticFiles(directory=frontend_dir), name="static")
+
+
+# ======================== MODELS ========================
+class ChatRequest(BaseModel):
+    query: str
+    chat_history: List[Dict[str, str]] = []
+    mode: str = "auto"  # "auto", "general", "job_match", "cover_letter", "skills_gap", "interview"
+
+
+class ConfigRequest(BaseModel):
+    api_key: str
+    model: str = "llama-3.3-70b-versatile"
+
+
+class RAGConfigRequest(BaseModel):
+    embedding_model: str = "bge-m3"
+    enable_reranking: bool = True
+    enable_hybrid: bool = True
+
+
+class ExportRequest(BaseModel):
+    content: str
+    format: str = "pdf"  # "pdf", "docx", "html", "txt"
+
+
+class ConversationExportRequest(BaseModel):
+    messages: List[Dict[str, str]]
+    format: str = "pdf"
+
+
+# ======================== ROUTES: FRONTEND ========================
+@app.get("/")
+async def serve_frontend():
+    """Serve the main frontend page."""
+    index_path = os.path.join(frontend_dir, "index.html")
+    if os.path.exists(index_path):
+        return FileResponse(index_path)
+    return {"message": "CareerAI API is running. Frontend not found at /frontend/"}
+
+
+# ======================== ROUTES: CONFIG ========================
+@app.get("/api/status")
+async def get_status(user_id: str = Depends(get_user_or_session_id)):
+    """Get current API configuration status."""
+    rag = state.get_rag()
+    stats = rag.get_stats(user_id=user_id)
+    return {
+        "api_configured": state.api_configured,
+        "model": state.model,
+        "embedding_model": state.embedding_model,
+        "enable_reranking": state.enable_reranking,
+        "enable_hybrid": state.enable_hybrid,
+        "documents": stats["documents"],
+        "total_chunks": stats["total_chunks"],
+        "total_documents": stats["total_documents"],
+    }
+
+
+# ======================== ROUTES: JOB SEARCH ========================
+JSEARCH_API_KEY = os.environ.get("JSEARCH_API_KEY", "")
+
+@app.get("/api/jobs")
+async def search_jobs(
+    query: str = Query(..., description="Job search terms, e.g. 'Python developer remote'"),
+    country: str = Query("worldwide", description="Country code, e.g. 'ar', 'es', 'us'"),
+    date_posted: str = Query("month", description="Filter: all, today, 3days, week, month"),
+    employment_type: str = Query("", description="FULLTIME, PARTTIME, CONTRACTOR, INTERN (comma separated)"),
+    remote_only: bool = Query(False, description="Only remote jobs"),
+    num_pages: int = Query(1, description="Number of result pages (1 page = 10 jobs)"),
+):
+    """Search worldwide job listings via JSearch (LinkedIn, Indeed, Glassdoor, etc.)."""
+    import httpx
+
+    headers = {
+        "x-rapidapi-host": "jsearch.p.rapidapi.com",
+        "x-rapidapi-key": JSEARCH_API_KEY,
+    }
+
+    params = {
+        "query": query,
+        "page": "1",
+        "num_pages": str(num_pages),
+        "date_posted": date_posted,
+    }
+    if country and country != "worldwide":
+        params["country"] = country
+    if remote_only:
+        params["remote_jobs_only"] = "true"
+    if employment_type:
+        params["employment_types"] = employment_type
+
+    try:
+        async with httpx.AsyncClient(timeout=15.0) as client:
+            resp = await client.get(
+                "https://jsearch.p.rapidapi.com/search",
+                headers=headers,
+                params=params,
+            )
+            resp.raise_for_status()
+            data = resp.json()
+    except Exception as e:
+        raise HTTPException(status_code=502, detail=f"Error consultando JSearch: {str(e)}")
+
+    jobs = data.get("data", [])
+    formatted = []
+    for j in jobs:
+        salary_min = j.get("job_min_salary")
+        salary_max = j.get("job_max_salary")
+        salary_currency = j.get("job_salary_currency", "")
+        salary_period = j.get("job_salary_period", "")
+        if salary_min and salary_max:
+            salary_str = f"{salary_currency} {int(salary_min):,} – {int(salary_max):,} / {salary_period}"
+        elif salary_min:
+            salary_str = f"{salary_currency} {int(salary_min):,}+ / {salary_period}"
+        else:
+            salary_str = None
+
+        formatted.append({
+            "id": j.get("job_id", ""),
+            "title": j.get("job_title", ""),
+            "company": j.get("employer_name", ""),
+            "company_logo": j.get("employer_logo", ""),
+            "location": f"{j.get('job_city', '') or ''} {j.get('job_state', '') or ''} {j.get('job_country', '') or ''}".strip(),
+            "employment_type": j.get("job_employment_type", ""),
+            "is_remote": j.get("job_is_remote", False),
+            "description_snippet": (j.get("job_description", "")[:220] + "…") if j.get("job_description") else "",
+            "salary": salary_str,
+            "posted_at": j.get("job_posted_at_datetime_utc", ""),
+            "apply_link": j.get("job_apply_link", "#"),
+            "publisher": j.get("job_publisher", ""),
+        })
+
+    return {"total": len(formatted), "jobs": formatted}
+
+
+@app.post("/api/config")
+async def configure_api(config: ConfigRequest):
+    """Configure the Groq API key and model."""
+    try:
+        state.init_assistant(config.api_key, config.model)
+        return {
+            "success": True,
+            "message": f"Conectado con {config.model}",
+            "model": config.model,
+        }
+    except Exception as e:
+        raise HTTPException(status_code=400, detail=str(e))
+
+
+@app.post("/api/config/rag")
+async def configure_rag(config: RAGConfigRequest):
+    """Update RAG engine settings."""
+    changed = False
+    if config.embedding_model != state.embedding_model:
+        state.embedding_model = config.embedding_model
+        changed = True
+    if config.enable_reranking != state.enable_reranking:
+        state.enable_reranking = config.enable_reranking
+        changed = True
+    if config.enable_hybrid != state.enable_hybrid:
+        state.enable_hybrid = config.enable_hybrid
+        changed = True
+
+    if changed:
+        state.reset_rag()
+
+    rag = state.get_rag()
+    stats = rag.get_stats()
+    return {
+        "success": True,
+        "embedding_model": state.embedding_model,
+        "enable_reranking": state.enable_reranking,
+        "enable_hybrid": state.enable_hybrid,
+        "stats": stats,
+    }
+
+
+@app.get("/api/models")
+async def list_models():
+    """List available LLM models."""
+    models = {
+        "llama-3.3-70b-versatile": {"name": "CareerAI Pro", "description": "Recomendado · Máxima calidad"},
+        "llama-3.1-8b-instant": {"name": "CareerAI Flash", "description": "Ultra rápido · Respuestas al instante"},
+    }
+    return {"models": models, "current": state.model}
+
+
+@app.get("/api/embedding-models")
+async def list_embedding_models():
+    """List available embedding models."""
+    result = {}
+    for key, info in EMBEDDING_MODELS.items():
+        result[key] = {
+            "display": info["display"],
+            "description": info.get("description", ""),
+            "size": info.get("size", ""),
+            "languages": info.get("languages", ""),
+            "performance": info.get("performance", ""),
+        }
+    return {"models": result, "current": state.embedding_model}
+
+
+@app.post("/api/model")
+async def change_model(model: str = Query(...)):
+    """Change the active LLM model."""
+    if not state.api_configured:
+        raise HTTPException(status_code=400, detail="API key not configured")
+    try:
+        state.init_assistant(state.api_key, model)
+        return {"success": True, "model": model}
+    except Exception as e:
+        raise HTTPException(status_code=400, detail=str(e))
+
+
+# ======================== ROUTES: CHAT ========================
+@app.post("/api/chat")
+async def chat(request: ChatRequest, user_id: str = Depends(get_user_or_session_id)):
+    """Send a message and get AI response (non-streaming)."""
+    if not state.api_configured:
+        raise HTTPException(
+            status_code=400,
+            detail="API key not configured. Use POST /api/config first.",
+        )
+
+    # Auto-detect mode
+    mode = request.mode
+    if mode == "auto":
+        mode = state.assistant.detect_mode(request.query)
+
+    # Get RAG context
+    rag = state.get_rag()
+    context = rag.get_context(request.query, k=8, user_id=user_id)
+
+    # Get response
+    try:
+        response = state.assistant.chat(
+            query=request.query,
+            context=context,
+            chat_history=request.chat_history,
+            mode=mode,
+        )
+        return {
+            "response": response,
+            "mode": mode,
+            "model": state.model,
+        }
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+@app.post("/api/chat/stream")
+async def chat_stream(request: ChatRequest, user_id: str = Depends(get_user_or_session_id)):
+    """Send a message and get AI response via Server-Sent Events (streaming)."""
+    if not state.api_configured:
+        raise HTTPException(
+            status_code=400,
+            detail="API key not configured",
+        )
+
+    # Auto-detect mode
+    mode = request.mode
+    if mode == "auto":
+        mode = state.assistant.detect_mode(request.query)
+
+    # Get RAG context
+    rag = state.get_rag()
+    context = rag.get_context(request.query, k=8, user_id=user_id)
+
+    async def event_generator():
+        """Stream response as SSE."""
+        try:
+            # Send mode info first
+            yield f"data: {json.dumps({'type': 'mode', 'mode': mode})}\n\n"
+
+            # Stream tokens
+            for chunk in state.assistant.stream_chat(
+                query=request.query,
+                context=context,
+                chat_history=request.chat_history,
+                mode=mode,
+            ):
+                yield f"data: {json.dumps({'type': 'token', 'content': chunk})}\n\n"
+
+            # Done signal
+            yield f"data: {json.dumps({'type': 'done'})}\n\n"
+
+        except Exception as e:
+            yield f"data: {json.dumps({'type': 'error', 'error': str(e)})}\n\n"
+
+    return StreamingResponse(
+        event_generator(),
+        media_type="text/event-stream",
+        headers={
+            "Cache-Control": "no-cache",
+            "Connection": "keep-alive",
+            "X-Accel-Buffering": "no",
+        },
+    )
+
+
+# ======================== ROUTES: DOCUMENTS ========================
+@app.post("/api/documents/upload")
+async def upload_document(
+    file: UploadFile = File(...),
+    doc_type: str = Form("cv"),
+    user_id: str = Depends(get_user_or_session_id)
+):
+    """Upload and process a document through the RAG pipeline."""
+    # Validate file type
+    valid_extensions = [".pdf", ".txt", ".docx", ".doc", ".jpg", ".jpeg", ".png", ".webp"]
+    ext = os.path.splitext(file.filename)[1].lower()
+    if ext not in valid_extensions:
+        raise HTTPException(
+            status_code=400,
+            detail=f"Unsupported file type: {ext}. Supported: {', '.join(valid_extensions)}",
+        )
+
+    # Check if already indexed
+    rag = state.get_rag()
+    existing_docs = rag.get_document_list(user_id=user_id)
+    if file.filename in existing_docs:
+        return {
+            "success": True,
+            "already_indexed": True,
+            "message": f"{file.filename} ya está indexado",
+            "filename": file.filename,
+        }
+
+    # Save file
+    upload_dir = os.path.join(os.path.dirname(__file__), "data", "uploads")
+    os.makedirs(upload_dir, exist_ok=True)
+    file_path = os.path.join(upload_dir, file.filename)
+
+    with open(file_path, "wb") as f:
+        content = await file.read()
+        f.write(content)
+
+    # Extract text
+    try:
+        api_key = state.api_key if state.api_configured else ""
+        text = DocumentProcessor.extract_text(file_path, groq_api_key=api_key)
+        if not text.strip():
+            raise ValueError("No se pudo extraer texto del documento")
+
+        # Chunk
+        chunks = DocumentProcessor.chunk_text(text, chunk_size=400, overlap=80)
+
+        # Key info
+        info = DocumentProcessor.extract_key_info(text)
+
+        # Add to RAG
+        metadata = {
+            "filename": file.filename,
+            "doc_type": doc_type,
+            "upload_date": datetime.now().isoformat(),
+            "word_count": str(info["word_count"]),
+        }
+        num_chunks = rag.add_document(chunks, metadata, user_id=user_id)
+
+        return {
+            "success": True,
+            "already_indexed": False,
+            "filename": file.filename,
+            "doc_type": doc_type,
+            "text_length": len(text),
+            "word_count": info["word_count"],
+            "num_chunks": num_chunks,
+            "message": f"{file.filename} procesado: {info['word_count']:,} palabras, {num_chunks} chunks",
+        }
+
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+@app.get("/api/documents")
+async def list_documents(user_id: str = Depends(get_user_or_session_id)):
+    """List all indexed documents for user."""
+    rag = state.get_rag()
+    stats = rag.get_stats(user_id=user_id)
+    return {
+        "documents": stats["documents"],
+        "total_documents": stats["total_documents"],
+        "total_chunks": stats["total_chunks"],
+    }
+
+
+@app.delete("/api/documents/{filename}")
+async def delete_document(
+    filename: str,
+    user_id: str = Depends(get_user_or_session_id)
+):
+    """Delete a document from the index."""
+    try:
+        rag = state.get_rag()
+        rag.delete_document(filename, user_id=user_id)
+        return {"success": True, "message": f"{filename} eliminado"}
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+# ======================== ROUTES: EXPORT ========================
+@app.post("/api/export")
+async def export_content(request: ExportRequest):
+    """Export a single message/content to PDF, DOCX, HTML, or TXT."""
+    fmt = request.format.lower()
+    filename = get_smart_filename(request.content, fmt)
+
+    try:
+        if fmt == "pdf":
+            data = export_to_pdf(request.content)
+            mime = "application/pdf"
+        elif fmt == "docx":
+            data = export_to_docx(request.content)
+            mime = "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+        elif fmt == "html":
+            data = export_to_html(request.content)
+            mime = "text/html"
+        elif fmt == "txt":
+            data = export_to_txt(request.content)
+            mime = "text/plain"
+        else:
+            raise HTTPException(status_code=400, detail=f"Unsupported format: {fmt}")
+
+        return Response(
+            content=data,
+            media_type=mime,
+            headers={"Content-Disposition": f'attachment; filename="{filename}"'},
+        )
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+@app.post("/api/export/conversation")
+async def export_conversation(request: ConversationExportRequest):
+    """Export full conversation history."""
+    fmt = request.format.lower()
+    timestamp = datetime.now().strftime("%Y%m%d_%H%M")
+    filename = f"CareerAI_Chat_{timestamp}.{fmt}"
+
+    try:
+        if fmt == "pdf":
+            data = export_conversation_to_pdf(request.messages)
+            mime = "application/pdf"
+        elif fmt == "docx":
+            data = export_conversation_to_docx(request.messages)
+            mime = "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
+        elif fmt == "html":
+            data = export_conversation_to_html(request.messages)
+            mime = "text/html"
+        else:
+            raise HTTPException(status_code=400, detail=f"Unsupported format: {fmt}")
+
+        return Response(
+            content=data,
+            media_type=mime,
+            headers={"Content-Disposition": f'attachment; filename="{filename}"'},
+        )
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+# ======================== ROUTES: DETECT MODE ========================
+@app.get("/api/detect-mode")
+async def detect_mode(query: str = Query(...)):
+    """Auto-detect the best assistant mode for a query."""
+    if not state.api_configured:
+        return {"mode": "general"}
+    mode = state.assistant.detect_mode(query)
+    return {"mode": mode}
+
+
+# ======================== ROUTES: DASHBOARD ========================
+@app.get("/api/dashboard")
+async def dashboard_data(user_id: str = Depends(get_user_or_session_id)):
+    """Extract profile data from documents for dashboard charts and insights."""
+    if not state.api_configured:
+        return {
+            "has_data": False,
+            "error": "API not configured",
+        }
+
+    rag = state.get_rag()
+    all_text = rag.get_all_text(user_id=user_id)
+    if not all_text.strip():
+        return {
+            "has_data": False,
+            "error": "No documents indexed",
+        }
+
+    try:
+        # Extract profile from documents
+        profile = extract_profile_from_text(all_text, state.assistant.llm)
+
+        skills = profile.get("skills", [])
+        experience = profile.get("experience", [])
+        summary = profile.get("summary", {})
+
+        # Build chart data
+        cat_data = skills_by_category(skills)
+        level_data = skills_by_level(skills)
+        timeline = experience_for_timeline(experience)
+
+        # Generate insights
+        insights = generate_dashboard_insights(profile, state.assistant.llm)
+
+        return {
+            "has_data": True,
+            "summary": summary,
+            "skills": skills,
+            "skills_by_category": cat_data,
+            "skills_by_level": level_data,
+            "experience_timeline": timeline,
+            "insights": insights,
+            "total_skills": len(skills),
+            "total_experience": len(experience),
+        }
+
+    except Exception as e:
+        return {
+            "has_data": False,
+            "error": str(e),
+        }
+
+
+# ======================== HEALTH ========================
+@app.get("/api/health")
+async def health():
+    return {
+        "status": "ok",
+        "timestamp": datetime.now().isoformat(),
+        "api_configured": state.api_configured,
+        "model": state.model,
+    }
+
+
+# ======================== RUN ========================
+if __name__ == "__main__":
+    import uvicorn
+    uvicorn.run("api:app", host="0.0.0.0", port=8000, reload=True)

frontend/app.js

@@ -0,0 +1,1841 @@
+/**
+ * CareerAI — Claude-Style Frontend
+ * Full implementation connected to FastAPI backend
+ */
+
+// ===== CONFIG =====
+const API_BASE = window.location.origin; // Same origin (served by FastAPI)
+
+// ===== STATE =====
+const state = {
+    sidebarOpen: true,
+    currentModel: 'llama-3.3-70b-versatile',
+    currentModelDisplay: 'CareerAI Pro',
+    messages: [],
+    conversations: JSON.parse(localStorage.getItem('careerai_conversations') || '[]'),
+    currentConversationId: null,
+    documents: [],
+    documentId: null,
+    apiConfigured: false,
+    apiKey: '',
+    currentUser: null,
+    authToken: localStorage.getItem('careerai_token') || null,
+    authMode: 'login' // 'login', 'register', 'forgot', 'reset'
+};
+
+// ===== ELEMENTS =====
+const $ = (sel) => document.querySelector(sel);
+const $$ = (sel) => document.querySelectorAll(sel);
+
+const els = {
+    sidebar: $('#sidebar'),
+    toggleSidebar: $('#toggleSidebar'),
+    mobileSidebarToggle: $('#mobileSidebarToggle'),
+    newChatBtn: $('#newChatBtn'),
+    searchInput: $('#searchInput'),
+    conversationList: $('#conversationList'),
+    documentList: $('#documentList'),
+
+    mainContent: $('#mainContent'),
+    welcomeScreen: $('#welcomeScreen'),
+    chatScreen: $('#chatScreen'),
+    chatMessages: $('#chatMessages'),
+
+    welcomeInput: $('#welcomeInput'),
+    chatInput: $('#chatInput'),
+    sendBtn: $('#sendBtn'),
+    chatSendBtn: $('#chatSendBtn'),
+
+    attachBtn: $('#attachBtn'),
+    chatAttachBtn: $('#chatAttachBtn'),
+
+    modelSelector: $('#modelSelector'),
+    chatModelSelector: $('#chatModelSelector'),
+    modelDropdown: $('#modelDropdown'),
+
+    uploadModal: $('#uploadModal'),
+    uploadBackdrop: $('#uploadBackdrop'),
+    uploadClose: $('#uploadClose'),
+    uploadDropzone: $('#uploadDropzone'),
+    fileInput: $('#fileInput'),
+
+    notificationBar: $('#notificationBar'),
+};
+
+// ===== INIT =====
+document.addEventListener('DOMContentLoaded', init);
+
+async function init() {
+    setupSidebar();
+    setupNavigation();
+    setupInput();
+    setupModelSelector();
+    setupUpload();
+    setupChips();
+    autoResizeTextarea(els.welcomeInput);
+    autoResizeTextarea(els.chatInput);
+
+    // Load API stats and Auth
+    await checkApiStatus();
+    await checkAuthSession();
+
+    renderConversations();
+    updateSidebarUser();
+
+    // Auto-collapse sidebar on mobile devices
+    if (window.innerWidth <= 768) {
+        els.sidebar.classList.add('collapsed');
+    }
+}
+
+// ===== API HELPERS =====
+if (!localStorage.getItem('careerai_session')) {
+    localStorage.setItem('careerai_session', 'session_' + Math.random().toString(36).substr(2, 9));
+}
+state.sessionId = localStorage.getItem('careerai_session');
+
+async function apiGet(path) {
+    const headers = { 'X-Session-ID': state.sessionId };
+    if (state.authToken) headers['Authorization'] = `Bearer ${state.authToken}`;
+
+    const res = await fetch(`${API_BASE}${path}`, { headers });
+    if (!res.ok) {
+        const err = await res.json().catch(() => ({ detail: res.statusText }));
+        if (res.status === 401) handleLogout();
+        throw new Error(err.detail || 'API Error');
+    }
+    return res.json();
+}
+
+async function apiPost(path, body, useUrlEncoded = false) {
+    const headers = { 'X-Session-ID': state.sessionId };
+    if (state.authToken) headers['Authorization'] = `Bearer ${state.authToken}`;
+    if (!useUrlEncoded) headers['Content-Type'] = 'application/json';
+    else headers['Content-Type'] = 'application/x-www-form-urlencoded';
+
+    const res = await fetch(`${API_BASE}${path}`, {
+        method: 'POST',
+        headers,
+        body: useUrlEncoded ? body : JSON.stringify(body),
+    });
+    if (!res.ok) {
+        const err = await res.json().catch(() => ({ detail: res.statusText }));
+        if (res.status === 401) handleLogout();
+        throw new Error(err.detail || 'API Error');
+    }
+    return res.json();
+}
+
+async function apiDelete(path) {
+    const headers = { 'X-Session-ID': state.sessionId };
+    if (state.authToken) headers['Authorization'] = `Bearer ${state.authToken}`;
+
+    const res = await fetch(`${API_BASE}${path}`, { method: 'DELETE', headers });
+    if (!res.ok) {
+        const err = await res.json().catch(() => ({ detail: res.statusText }));
+        if (res.status === 401) handleLogout();
+        throw new Error(err.detail || 'API Error');
+    }
+    return res.json();
+}
+
+// ===== STATUS CHECK =====
+async function checkApiStatus() {
+    try {
+        const status = await apiGet('/api/status');
+        state.apiConfigured = status.api_configured;
+        state.currentModel = status.model || state.currentModel;
+        state.documents = status.documents || [];
+
+        // Update model display name
+        const modelNames = {
+            'llama-3.3-70b-versatile': 'CareerAI Pro',
+            'llama-3.1-8b-instant': 'CareerAI Flash',
+        };
+        state.currentModelDisplay = modelNames[state.currentModel] || state.currentModel;
+        $$('.model-name').forEach(n => n.textContent = state.currentModelDisplay);
+
+        // Update notification bar
+        if (state.apiConfigured) {
+            els.notificationBar.innerHTML = `
+                <span style="color: #16a34a;">● Conectado</span>
+                <span class="notification-separator">·</span>
+                <span>${state.currentModelDisplay}</span>
+                <span class="notification-separator">·</span>
+                <span>${status.total_documents} docs · ${status.total_chunks} chunks</span>
+            `;
+        } else {
+            els.notificationBar.innerHTML = `
+                <span style="color: #dc2626;">● Sin configurar</span>
+                <span class="notification-separator">·</span>
+                <a href="#" class="notification-link" onclick="showApiConfig(); return false;">Configurar API Key</a>
+            `;
+        }
+
+        // Update model selector active state
+        $$('.model-option').forEach(opt => {
+            opt.classList.toggle('active', opt.dataset.model === state.currentModel);
+        });
+
+        // Render documents
+        renderDocumentsFromList(state.documents);
+    } catch (e) {
+        console.warn('Could not check API status:', e.message);
+        els.notificationBar.innerHTML = `
+            <span style="color: #dc2626;">● Backend no disponible</span>
+            <span class="notification-separator">·</span>
+            <span>Asegúrate de ejecutar: uvicorn api:app --port 8000</span>
+        `;
+    }
+}
+
+// ===== API CONFIG =====
+function showApiConfig() {
+    // Create inline config modal
+    const existing = document.getElementById('apiConfigModal');
+    if (existing) existing.remove();
+
+    const modal = document.createElement('div');
+    modal.id = 'apiConfigModal';
+    modal.className = 'upload-modal';
+    modal.innerHTML = `
+        <div class="upload-modal-backdrop" onclick="document.getElementById('apiConfigModal').remove()"></div>
+        <div class="upload-modal-content" style="max-width: 480px;">
+            <div class="upload-modal-header">
+                <h3>🔑 Configurar API Key</h3>
+                <button class="upload-close" onclick="document.getElementById('apiConfigModal').remove()">&times;</button>
+            </div>
+            <div class="upload-modal-body">
+                <p style="color: var(--text-secondary); font-size: 0.88rem; margin-bottom: 16px;">
+                    Obtén tu API key gratis en <a href="https://console.groq.com" target="_blank" style="color: var(--accent-primary);">console.groq.com</a>
+                </p>
+                <div class="config-input-group">
+                    <input type="password" class="config-input" id="apiKeyInput" placeholder="gsk_..." value="${state.apiKey}">
+                    <button class="config-btn" onclick="saveApiConfig()">Conectar</button>
+                </div>
+                <div id="apiConfigStatus"></div>
+            </div>
+        </div>
+    `;
+    document.body.appendChild(modal);
+    document.getElementById('apiKeyInput').focus();
+}
+
+window.showApiConfig = showApiConfig;
+
+async function saveApiConfig() {
+    const input = document.getElementById('apiKeyInput');
+    const statusEl = document.getElementById('apiConfigStatus');
+    const apiKey = input.value.trim();
+
+    if (!apiKey) {
+        statusEl.innerHTML = '<div class="config-status disconnected"><span class="status-dot"></span> Ingresa un API key</div>';
+        return;
+    }
+
+    statusEl.innerHTML = '<div class="upload-processing"><div class="spinner"></div><span>Conectando...</span></div>';
+
+    try {
+        const result = await apiPost('/api/config', {
+            api_key: apiKey,
+            model: state.currentModel,
+        });
+
+        state.apiConfigured = true;
+        state.apiKey = apiKey;
+        statusEl.innerHTML = '<div class="config-status connected"><span class="status-dot"></span> ¡Conectado exitosamente!</div>';
+
+        setTimeout(() => {
+            document.getElementById('apiConfigModal')?.remove();
+            checkApiStatus();
+        }, 1000);
+    } catch (e) {
+        statusEl.innerHTML = `<div class="config-status disconnected"><span class="status-dot"></span> Error: ${e.message}</div>`;
+    }
+}
+
+window.saveApiConfig = saveApiConfig;
+
+// ===== SIDEBAR =====
+function setupSidebar() {
+    els.toggleSidebar.addEventListener('click', toggleSidebar);
+    els.mobileSidebarToggle.addEventListener('click', () => {
+        els.sidebar.classList.remove('collapsed');
+    });
+
+    document.addEventListener('click', (e) => {
+        if (window.innerWidth <= 768) {
+            if (!els.sidebar.contains(e.target) && !els.mobileSidebarToggle.contains(e.target)) {
+                els.sidebar.classList.add('collapsed');
+            }
+        }
+    });
+
+    els.newChatBtn.addEventListener('click', newChat);
+
+    // Login & Profile logic bindings
+    const userMenu = document.getElementById('userMenu');
+    const loginModal = document.getElementById('loginModal');
+    const loginClose = document.getElementById('loginClose');
+    const loginBackdrop = document.getElementById('loginBackdrop');
+
+    const profileModal = document.getElementById('profileModal');
+    const profileClose = document.getElementById('profileClose');
+    const profileBackdrop = document.getElementById('profileBackdrop');
+
+    if (userMenu) {
+        userMenu.addEventListener('click', () => {
+            if (!state.currentUser) {
+                loginModal.classList.remove('hidden');
+            } else {
+                // Open Profile Modal
+                document.getElementById('profileName').value = state.currentUser.name;
+                document.getElementById('profileEmail').value = state.currentUser.email;
+                document.getElementById('profilePreview').src = state.currentUser.picture;
+                profileModal.classList.remove('hidden');
+            }
+        });
+    }
+
+    if (loginClose) loginClose.addEventListener('click', () => { loginModal.classList.add('hidden'); setAuthMode('login'); });
+    if (loginBackdrop) loginBackdrop.addEventListener('click', () => { loginModal.classList.add('hidden'); setAuthMode('login'); });
+
+    if (profileClose) profileClose.addEventListener('click', () => profileModal.classList.add('hidden'));
+    if (profileBackdrop) profileBackdrop.addEventListener('click', () => profileModal.classList.add('hidden'));
+}
+
+async function checkAuthSession() {
+    if (state.authToken) {
+        try {
+            const user = await apiGet('/api/auth/me');
+            state.currentUser = user;
+            updateSidebarUser();
+
+            // Sync conversations
+            const cloudConvs = await apiGet('/api/conversations');
+            if (cloudConvs && cloudConvs.length > 0) {
+                state.conversations = cloudConvs;
+                saveConversations(); // Sync strictly to local cache initially
+                renderConversations();
+            }
+        } catch (e) {
+            handleLogout();
+        }
+    }
+}
+
+window.handleAuthSubmit = async function (event) {
+    event.preventDefault();
+    const btn = document.getElementById('authSubmitBtn');
+
+    const email = document.getElementById('authEmail').value.trim();
+    const password = document.getElementById('authPassword').value;
+    const name = document.getElementById('authName').value.trim();
+    const resetCode = document.getElementById('authResetCode')?.value.trim();
+    const mode = state.authMode;
+
+    try {
+        btn.innerHTML = '<span class="spinner" style="width:16px;height:16px;margin:auto;"></span>';
+        btn.style.pointerEvents = 'none';
+
+        let result;
+        if (mode === 'register') {
+            result = await apiPost('/api/auth/register', { name, email, password });
+        } else if (mode === 'login') {
+            result = await apiPost('/api/auth/login', `username=${encodeURIComponent(email)}&password=${encodeURIComponent(password)}`, true);
+        } else if (mode === 'reset') {
+            result = await apiPost('/api/auth/reset-password', { email, code: resetCode, new_password: password });
+            showToast('✅ ' + result.message);
+            setAuthMode('login');
+            return;
+        }
+
+        state.authToken = result.access_token;
+        localStorage.setItem('careerai_token', result.access_token);
+
+        document.getElementById('loginModal').classList.add('hidden');
+        showToast('✅ Sesión iniciada con éxito');
+
+        await checkAuthSession();
+    } catch (err) {
+        showToast('❌ Error: ' + err.message);
+    } finally {
+        btn.innerHTML = mode === 'register' ? 'Registrarme' : (mode === 'reset' ? 'Actualizar Contraseña' : 'Iniciar Sesión');
+        btn.style.pointerEvents = 'auto';
+    }
+};
+
+window.setAuthMode = function (mode) {
+    state.authMode = mode;
+
+    const registerFields = document.getElementById('registerFields');
+    const resetCodeFields = document.getElementById('resetCodeFields');
+    const passwordFieldsGroup = document.getElementById('passwordFieldsGroup');
+    const forgotPassContainer = document.getElementById('forgotPassContainer');
+    const authToggleContainer = document.getElementById('authToggleContainer');
+    const backToLoginContainer = document.getElementById('backToLoginContainer');
+    const loginTitle = document.getElementById('loginTitle');
+    const authSubmitBtn = document.getElementById('authSubmitBtn');
+    const authSendCodeBtn = document.getElementById('authSendCodeBtn');
+
+    // Hide all uniquely conditional elements initially
+    registerFields.style.display = 'none';
+    resetCodeFields.style.display = 'none';
+    passwordFieldsGroup.style.display = 'none';
+    forgotPassContainer.style.display = 'none';
+    authToggleContainer.style.display = 'none';
+    backToLoginContainer.style.display = 'none';
+    authSendCodeBtn.style.display = 'none';
+    authSubmitBtn.style.display = 'flex';
+
+    document.getElementById('authPassword').required = false;
+
+    if (mode === 'login') {
+        passwordFieldsGroup.style.display = 'block';
+        forgotPassContainer.style.display = 'block';
+        authToggleContainer.style.display = 'block';
+        document.getElementById('authPassword').required = true;
+
+        loginTitle.innerText = 'Acceso a CareerAI';
+        authSubmitBtn.innerText = 'Iniciar Sesión';
+        document.getElementById('authToggleText').innerHTML = '¿No tienes cuenta? <a href="#" onclick="event.preventDefault(); setAuthMode(\'register\')" style="color: var(--accent-primary); text-decoration: none;">Regístrate</a>';
+
+    } else if (mode === 'register') {
+        registerFields.style.display = 'block';
+        passwordFieldsGroup.style.display = 'block';
+        authToggleContainer.style.display = 'block';
+        document.getElementById('authPassword').required = true;
+
+        loginTitle.innerText = 'Crear cuenta';
+        authSubmitBtn.innerText = 'Registrarme';
+        document.getElementById('authToggleText').innerHTML = '¿Ya tienes cuenta? <a href="#" onclick="event.preventDefault(); setAuthMode(\'login\')" style="color: var(--accent-primary); text-decoration: none;">Inicia sesión</a>';
+
+    } else if (mode === 'forgot') {
+        backToLoginContainer.style.display = 'block';
+        authSubmitBtn.style.display = 'none';
+        authSendCodeBtn.style.display = 'flex';
+
+        loginTitle.innerText = 'Recuperar contraseña';
+
+    } else if (mode === 'reset') {
+        resetCodeFields.style.display = 'block';
+        passwordFieldsGroup.style.display = 'block';
+        backToLoginContainer.style.display = 'block';
+        document.getElementById('authPassword').required = true;
+
+        loginTitle.innerText = 'Nueva contraseña';
+        authSubmitBtn.innerText = 'Actualizar Contraseña';
+
+        // Minor QOL: focus the code input directly
+        setTimeout(() => document.getElementById('authResetCode')?.focus(), 100);
+    }
+};
+
+window.handleSendResetCode = async function (event) {
+    event.preventDefault();
+    const email = document.getElementById('authEmail').value.trim();
+    if (!email) {
+        showToast('⚠️ Ingresa tu correo electrónico', 'warning');
+        return;
+    }
+
+    const btn = document.getElementById('authSendCodeBtn');
+    try {
+        btn.innerHTML = '<span class="spinner" style="width:16px;height:16px;margin:auto;"></span>';
+        btn.style.pointerEvents = 'none';
+
+        const result = await apiPost('/api/auth/forgot-password', { email });
+        showToast('✅ ' + result.message);
+
+        // Move to phase 2
+        setAuthMode('reset');
+    } catch (err) {
+        showToast('❌ Error: ' + err.message);
+    } finally {
+        btn.innerHTML = 'Enviar código a mi correo';
+        btn.style.pointerEvents = 'auto';
+    }
+};
+
+window.handleProfilePictureSelect = function (event) {
+    const file = event.target.files[0];
+    if (file) {
+        const reader = new FileReader();
+        reader.onload = (e) => {
+            // For now we set it as local base64 until submission
+            document.getElementById('profilePreview').src = e.target.result;
+        };
+        reader.readAsDataURL(file);
+    }
+};
+
+window.handleProfileSubmit = async function (event) {
+    event.preventDefault();
+    const btn = document.getElementById('profileSubmitBtn');
+    const name = document.getElementById('profileName').value.trim();
+    // In our implementation we can send base64 image or just accept name for now
+
+    // Check if user changed picture logic
+    const imgEl = document.getElementById('profilePreview');
+    const pictureStr = imgEl.src.startsWith('data:image') ? imgEl.src : state.currentUser.picture;
+
+    try {
+        btn.innerHTML = '<span class="spinner" style="width:16px;height:16px;margin:auto;"></span>';
+        btn.style.pointerEvents = 'none';
+
+        const result = await apiPost('/api/auth/me', { name: name, picture: pictureStr });
+
+        state.currentUser.name = result.name;
+        state.currentUser.picture = result.picture;
+        updateSidebarUser();
+
+        document.getElementById('profileModal').classList.add('hidden');
+        showToast('✅ Perfil actualizado exitosamente');
+
+    } catch (err) {
+        showToast('❌ Error al actualizar perfil: ' + err.message);
+    } finally {
+        btn.innerHTML = 'Guardar Cambios';
+        btn.style.pointerEvents = 'auto';
+    }
+};
+
+function handleLogout() {
+    state.currentUser = null;
+    state.authToken = null;
+    localStorage.removeItem('careerai_token');
+
+    // Clear user localized states safely 
+    state.conversations = [];
+    state.currentConversationId = null;
+    state.messages = [];
+    state.documents = [];
+    localStorage.removeItem('careerai_conversations');
+
+    // Generate a new session ID for the guest
+    const newSession = 'session_' + Math.random().toString(36).substr(2, 9);
+    localStorage.setItem('careerai_session', newSession);
+    state.sessionId = newSession;
+
+    updateSidebarUser();
+    renderConversations();
+    renderDocumentsFromList([]);
+    showWelcome();
+    document.getElementById('profileModal')?.classList.add('hidden');
+    showToast('👋 Sesión cerrada');
+
+    // Refresh status with new session
+    checkApiStatus();
+}
+
+function toggleSidebar() {
+    els.sidebar.classList.toggle('collapsed');
+}
+
+function updateSidebarUser() {
+    const userMenu = document.getElementById('userMenu');
+    if (!userMenu) return;
+
+    if (state.currentUser) {
+        userMenu.innerHTML = `
+            <img src="${state.currentUser.picture}" class="user-avatar" style="border: none; padding: 0; background: transparent;">
+            <span class="user-name">${state.currentUser.name}</span>
+        `;
+    } else {
+        userMenu.innerHTML = `
+            <div class="user-avatar" style="background: var(--bg-hover); color: var(--text-secondary);">
+               <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
+            </div>
+            <span class="user-name">Iniciar sesión</span>
+        `;
+    }
+}
+
+// ===== NAVIGATION =====
+function setupNavigation() {
+    $$('.nav-item').forEach(item => {
+        item.addEventListener('click', (e) => {
+            e.preventDefault();
+            const page = item.dataset.page;
+            $$('.nav-item').forEach(n => n.classList.remove('active'));
+            item.classList.add('active');
+
+            if (page === 'chat') {
+                hideDashboardPage();
+                if (state.messages.length === 0) showWelcome();
+                else showChat();
+            } else if (page === 'documents') {
+                els.uploadModal.classList.remove('hidden');
+            } else if (page === 'dashboard') {
+                showDashboardPage();
+            } else if (page === 'settings') {
+                showApiConfig();
+            }
+
+            // Close sidebar on mobile after clicking
+            if (window.innerWidth <= 768) {
+                els.sidebar.classList.add('collapsed');
+            }
+        });
+    });
+}
+
+// ===== DASHBOARD PAGE =====
+function showDashboardPage() {
+    els.welcomeScreen.classList.add('hidden');
+    els.welcomeScreen.style.display = 'none';
+    els.chatScreen.classList.add('hidden');
+    els.chatScreen.style.display = 'none';
+
+    let dashPage = document.getElementById('dashboardPage');
+    if (dashPage) dashPage.remove();
+
+    dashPage = document.createElement('div');
+    dashPage.id = 'dashboardPage';
+    dashPage.style.cssText = 'flex:1; overflow-y:auto; padding:40px 24px; animation: fadeIn 0.4s ease-out;';
+    dashPage.innerHTML = `
+        <div style="max-width:900px; margin:0 auto;">
+            <h2 style="font-family: var(--font-serif); font-size:1.8rem; font-weight:400; margin-bottom:8px; color: var(--text-primary);">📊 Dashboard Profesional</h2>
+            <p style="color: var(--text-secondary); font-size:0.9rem; margin-bottom:28px;">Análisis inteligente de tus documentos — perfil, skills y experiencia.</p>
+
+            <div style="display:grid; grid-template-columns: repeat(4, 1fr); gap:12px; margin-bottom:28px;" id="dashKpis">
+                <div class="dash-kpi"><div class="dash-kpi-value" id="kpiDocs">—</div><div class="dash-kpi-label">Documentos</div></div>
+                <div class="dash-kpi"><div class="dash-kpi-value" id="kpiChunks">—</div><div class="dash-kpi-label">Chunks</div></div>
+                <div class="dash-kpi"><div class="dash-kpi-value" id="kpiSkills">—</div><div class="dash-kpi-label">Skills</div></div>
+                <div class="dash-kpi"><div class="dash-kpi-value" id="kpiExp">—</div><div class="dash-kpi-label">Experiencias</div></div>
+            </div>
+
+            <div class="dash-card" id="dashSummaryCard" style="display:none;">
+                <h3 class="dash-card-title">👤 Resumen del Perfil</h3>
+                <div id="dashSummaryContent"></div>
+            </div>
+
+            <div style="display:grid; grid-template-columns: 1fr 1fr; gap:16px; margin-bottom:16px;">
+                <div class="dash-card">
+                    <h3 class="dash-card-title">📊 Skills por Categoría</h3>
+                    <div style="position:relative; height:280px;" id="chartCategoryWrap"><canvas id="chartCategory"></canvas></div>
+                </div>
+                <div class="dash-card">
+                    <h3 class="dash-card-title">🎯 Skills por Nivel</h3>
+                    <div style="position:relative; height:280px;" id="chartLevelWrap"><canvas id="chartLevel"></canvas></div>
+                </div>
+            </div>
+
+            <div class="dash-card" id="dashSkillsCard" style="display:none;">
+                <h3 class="dash-card-title">🛠️ Skills Detectadas</h3>
+                <div id="dashSkillsTable"></div>
+            </div>
+
+            <div class="dash-card" id="dashTimelineCard" style="display:none;">
+                <h3 class="dash-card-title">📅 Trayectoria Profesional</h3>
+                <div id="dashTimeline"></div>
+            </div>
+
+            <div class="dash-card" id="dashInsightsCard" style="display:none;">
+                <h3 class="dash-card-title">🧠 Insights de la IA</h3>
+                <div id="dashInsights"></div>
+            </div>
+
+            <div id="dashLoading" style="text-align:center; padding:60px 0;">
+                <div class="spinner" style="margin:0 auto 16px;"></div>
+                <p style="color:var(--text-secondary); font-size:0.9rem;">Analizando tus documentos con IA...</p>
+                <p style="color:var(--text-tertiary); font-size:0.8rem;">Esto puede tomar 10-20 segundos</p>
+            </div>
+
+            <div style="display:flex; gap:10px; flex-wrap:wrap; margin-top:20px;">
+                <button onclick="document.querySelector('[data-page=documents]').click()" class="dash-action-btn">📄 Subir Documentos</button>
+                <button onclick="clearAllConversations()" class="dash-action-btn">🗑️ Limpiar Historial</button>
+            </div>
+        </div>
+    `;
+
+    els.mainContent.appendChild(dashPage);
+    addDashboardStyles();
+    loadDashboardData();
+}
+
+function addDashboardStyles() {
+    if (document.getElementById('dashStyles')) return;
+    const s = document.createElement('style');
+    s.id = 'dashStyles';
+    s.textContent = `
+        .dash-kpi { background:var(--bg-input); border:1px solid var(--border-light); border-radius:14px; padding:20px; text-align:center; transition:transform 0.2s,box-shadow 0.2s; }
+        .dash-kpi:hover { transform:translateY(-2px); box-shadow:0 4px 16px rgba(0,0,0,0.06); }
+        .dash-kpi-value { font-size:2rem; font-weight:700; color:var(--accent-primary); line-height:1.2; }
+        .dash-kpi-label { font-size:0.75rem; color:var(--text-tertiary); font-weight:600; text-transform:uppercase; letter-spacing:0.06em; margin-top:4px; }
+        .dash-card { background:var(--bg-input); border:1px solid var(--border-light); border-radius:14px; padding:24px; margin-bottom:16px; }
+        .dash-card-title { font-size:1rem; font-weight:600; margin-bottom:16px; color:var(--text-primary); }
+        .dash-action-btn { padding:10px 20px; border:1px solid var(--border-light); border-radius:10px; background:var(--bg-input); color:var(--text-primary); font-size:0.88rem; font-weight:500; cursor:pointer; font-family:var(--font-family); transition:all 0.2s; }
+        .dash-action-btn:hover { background:var(--bg-secondary); border-color:var(--accent-primary); color:var(--accent-primary); }
+        .skill-badge { display:inline-flex; align-items:center; gap:4px; padding:4px 10px; border-radius:6px; font-size:0.8rem; font-weight:500; margin:3px; }
+        .skill-badge.advanced { background:#dcfce7; color:#166534; }
+        .skill-badge.intermediate { background:#dbeafe; color:#1e40af; }
+        .skill-badge.basic { background:#fef3c7; color:#92400e; }
+        .timeline-item { position:relative; padding:16px 0 16px 28px; border-left:2px solid var(--border-light); }
+        .timeline-item:before { content:''; position:absolute; left:-5px; top:20px; width:8px; height:8px; border-radius:50%; background:var(--accent-primary); border:2px solid var(--bg-primary); }
+        .timeline-item.current:before { background:#16a34a; box-shadow:0 0 0 3px rgba(22,163,74,0.2); }
+        .timeline-role { font-weight:600; font-size:0.95rem; }
+        .timeline-company { color:var(--accent-primary); font-size:0.88rem; }
+        .timeline-dates { color:var(--text-tertiary); font-size:0.8rem; margin-top:2px; }
+        .timeline-desc { color:var(--text-secondary); font-size:0.84rem; margin-top:4px; }
+        .insight-section { margin-bottom:16px; }
+        .insight-section h4 { font-size:0.88rem; font-weight:600; margin-bottom:8px; }
+        .insight-item { padding:6px 0; font-size:0.86rem; color:var(--text-secondary); border-bottom:1px solid var(--border-light); }
+        .insight-item:last-child { border-bottom:none; }
+        @media (max-width:768px) { #dashKpis { grid-template-columns:repeat(2,1fr) !important; } }
+    `;
+    document.head.appendChild(s);
+}
+
+async function loadDashboardData() {
+    const loading = document.getElementById('dashLoading');
+    try {
+        const status = await apiGet('/api/status');
+        const el = (id) => document.getElementById(id);
+        if (el('kpiDocs')) el('kpiDocs').textContent = status.total_documents;
+        if (el('kpiChunks')) el('kpiChunks').textContent = status.total_chunks;
+    } catch (e) { /* ignore */ }
+
+    try {
+        const data = await apiGet('/api/dashboard');
+        if (loading) loading.style.display = 'none';
+
+        if (!data.has_data) {
+            if (loading) {
+                loading.style.display = 'block';
+                loading.innerHTML = `<div style="padding:40px; text-align:center;"><p style="font-size:3rem; margin-bottom:12px;">📭</p><p style="color:var(--text-secondary); font-size:1rem; font-weight:500;">No hay datos para analizar</p><p style="color:var(--text-tertiary); font-size:0.88rem; margin-top:8px;">${data.error || 'Sube documentos o configura tu API key.'}</p><button onclick="document.querySelector('[data-page=documents]').click()" class="dash-action-btn" style="margin-top:20px;">📄 Subir mi CV</button></div>`;
+            }
+            return;
+        }
+
+        const el = (id) => document.getElementById(id);
+        if (el('kpiSkills')) el('kpiSkills').textContent = data.total_skills || 0;
+        if (el('kpiExp')) el('kpiExp').textContent = data.total_experience || 0;
+
+        // Profile Summary
+        if (data.summary && (data.summary.headline || data.summary.estimated_seniority)) {
+            const sc = el('dashSummaryCard'); if (sc) sc.style.display = 'block';
+            const s = data.summary;
+            el('dashSummaryContent').innerHTML = `<div style="display:grid; grid-template-columns:1fr 1fr 1fr; gap:16px;"><div><div style="font-size:0.75rem; color:var(--text-tertiary); font-weight:600; text-transform:uppercase;">Headline</div><div style="font-size:0.92rem; font-weight:500; margin-top:4px;">${s.headline || '—'}</div></div><div><div style="font-size:0.75rem; color:var(--text-tertiary); font-weight:600; text-transform:uppercase;">Seniority</div><div style="font-size:0.92rem; font-weight:500; margin-top:4px; text-transform:capitalize;">${s.estimated_seniority || '—'}</div></div><div><div style="font-size:0.75rem; color:var(--text-tertiary); font-weight:600; text-transform:uppercase;">Años Experiencia</div><div style="font-size:0.92rem; font-weight:500; margin-top:4px;">${s.total_years_experience || '—'} años</div></div></div>`;
+        }
+
+        // Charts
+        renderCategoryChart(data.skills_by_category || {});
+        renderLevelChart(data.skills_by_level || {});
+
+        // Skills Table
+        if (data.skills && data.skills.length > 0) {
+            el('dashSkillsCard').style.display = 'block';
+            const grouped = {};
+            data.skills.forEach(sk => { const c = sk.category || 'other'; if (!grouped[c]) grouped[c] = []; grouped[c].push(sk); });
+            const catL = { technical: '💻 Técnicas', soft: '🤝 Soft Skills', tools: '🔧 Herramientas', language: '🌍 Idiomas', other: '📌 Otras' };
+            let h = '';
+            for (const [cat, skills] of Object.entries(grouped)) {
+                h += `<div style="margin-bottom:12px;"><strong style="font-size:0.82rem; color:var(--text-tertiary);">${catL[cat] || cat}</strong><div style="margin-top:6px;">`;
+                skills.forEach(sk => { h += `<span class="skill-badge ${sk.level || 'intermediate'}">${sk.name}</span>`; });
+                h += '</div></div>';
+            }
+            el('dashSkillsTable').innerHTML = h;
+        }
+
+        // Timeline
+        if (data.experience_timeline && data.experience_timeline.length > 0) {
+            el('dashTimelineCard').style.display = 'block';
+            el('dashTimeline').innerHTML = data.experience_timeline.map(exp => `
+                <div class="timeline-item ${exp.current ? 'current' : ''}">
+                    <div class="timeline-role">${exp.role}</div>
+                    <div class="timeline-company">${exp.company}</div>
+                    <div class="timeline-dates">${exp.start_date} → ${exp.end_date}${exp.current ? ' (Actual)' : ''}</div>
+                    ${exp.description ? `<div class="timeline-desc">${exp.description}</div>` : ''}
+                </div>
+            `).join('');
+        }
+
+        // Insights
+        if (data.insights) {
+            const ins = data.insights;
+            if (ins.strengths?.length || ins.potential_gaps?.length || ins.role_suggestions?.length || ins.next_actions?.length) {
+                el('dashInsightsCard').style.display = 'block';
+                let h = '';
+                if (ins.strengths?.length) h += `<div class="insight-section"><h4>💪 Fortalezas</h4>${ins.strengths.map(s => `<div class="insight-item">✅ ${s}</div>`).join('')}</div>`;
+                if (ins.potential_gaps?.length) h += `<div class="insight-section"><h4>📉 Áreas de mejora</h4>${ins.potential_gaps.map(s => `<div class="insight-item">⚠️ ${s}</div>`).join('')}</div>`;
+                if (ins.role_suggestions?.length) h += `<div class="insight-section"><h4>🎯 Roles sugeridos</h4>${ins.role_suggestions.map(s => `<div class="insight-item">🏢 ${s}</div>`).join('')}</div>`;
+                if (ins.next_actions?.length) h += `<div class="insight-section"><h4>🚀 Próximos pasos</h4>${ins.next_actions.map(s => `<div class="insight-item">→ ${s}</div>`).join('')}</div>`;
+                el('dashInsights').innerHTML = h;
+            }
+        }
+    } catch (e) {
+        console.error('Dashboard error:', e);
+        if (loading) loading.innerHTML = `<div style="padding:40px; text-align:center;"><p style="font-size:3rem; margin-bottom:12px;">⚠️</p><p style="color:var(--text-secondary);">Error al cargar el dashboard</p><p style="color:var(--text-tertiary); font-size:0.85rem; margin-top:8px;">${e.message}</p></div>`;
+    }
+}
+
+function renderCategoryChart(data) {
+    const canvas = document.getElementById('chartCategory');
+    if (!canvas || !window.Chart) return;
+    const labels = Object.keys(data), values = Object.values(data);
+    if (!labels.length) { document.getElementById('chartCategoryWrap').innerHTML = '<p style="color:var(--text-tertiary); text-align:center; padding:80px 0;">Sin datos</p>'; return; }
+    const catN = { technical: 'Técnicas', soft: 'Soft Skills', tools: 'Herramientas', language: 'Idiomas', other: 'Otras' };
+    const catC = { technical: '#c97c3e', soft: '#6366f1', tools: '#10b981', language: '#f59e0b', other: '#8b5cf6' };
+    new Chart(canvas, { type: 'bar', data: { labels: labels.map(l => catN[l] || l), datasets: [{ data: values, backgroundColor: labels.map(l => catC[l] || '#94a3b8'), borderRadius: 8, borderSkipped: false }] }, options: { responsive: true, maintainAspectRatio: false, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1, font: { size: 11 } }, grid: { color: 'rgba(0,0,0,0.05)' } }, x: { ticks: { font: { size: 11 } }, grid: { display: false } } } } });
+}
+
+function renderLevelChart(data) {
+    const canvas = document.getElementById('chartLevel');
+    if (!canvas || !window.Chart) return;
+    const labels = Object.keys(data), values = Object.values(data);
+    if (values.every(v => v === 0)) { document.getElementById('chartLevelWrap').innerHTML = '<p style="color:var(--text-tertiary); text-align:center; padding:80px 0;">Sin datos</p>'; return; }
+    const levelN = { basic: 'Básico', intermediate: 'Intermedio', advanced: 'Avanzado' };
+    new Chart(canvas, { type: 'doughnut', data: { labels: labels.map(l => levelN[l] || l), datasets: [{ data: values, backgroundColor: ['#fbbf24', '#3b82f6', '#22c55e'], borderWidth: 0, hoverOffset: 6 }] }, options: { responsive: true, maintainAspectRatio: false, cutout: '60%', plugins: { legend: { position: 'bottom', labels: { padding: 16, usePointStyle: true, pointStyleWidth: 8, font: { size: 12 } } } } } });
+}
+
+function hideDashboardPage() {
+    const dashPage = document.getElementById('dashboardPage');
+    if (dashPage) dashPage.remove();
+}
+
+function clearAllConversations() {
+    if (confirm('¿Estás seguro? Se borrarán todas las conversaciones guardadas.')) {
+        state.conversations = [];
+        state.messages = [];
+        state.currentConversationId = null;
+        saveConversations();
+        renderConversations();
+        showWelcome();
+        hideDashboardPage();
+        showToast('🗑️ Historial limpiado');
+    }
+}
+
+window.clearAllConversations = clearAllConversations;
+
+
+// ===== INPUT =====
+function setupInput() {
+    // Welcome input
+    els.welcomeInput.addEventListener('input', () => {
+        autoResizeTextarea(els.welcomeInput);
+        els.sendBtn.disabled = !els.welcomeInput.value.trim();
+    });
+
+    els.welcomeInput.addEventListener('keydown', (e) => {
+        if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            if (els.welcomeInput.value.trim() && !state.isStreaming) {
+                sendMessage(els.welcomeInput.value.trim());
+                els.welcomeInput.value = '';
+                autoResizeTextarea(els.welcomeInput);
+                els.sendBtn.disabled = true;
+            }
+        }
+    });
+
+    els.sendBtn.addEventListener('click', () => {
+        if (els.welcomeInput.value.trim() && !state.isStreaming) {
+            sendMessage(els.welcomeInput.value.trim());
+            els.welcomeInput.value = '';
+            autoResizeTextarea(els.welcomeInput);
+            els.sendBtn.disabled = true;
+        }
+    });
+
+    // Chat input
+    els.chatInput.addEventListener('input', () => {
+        autoResizeTextarea(els.chatInput);
+        els.chatSendBtn.disabled = !els.chatInput.value.trim();
+    });
+
+    els.chatInput.addEventListener('keydown', (e) => {
+        if (e.key === 'Enter' && !e.shiftKey) {
+            e.preventDefault();
+            if (els.chatInput.value.trim() && !state.isStreaming) {
+                sendMessage(els.chatInput.value.trim());
+                els.chatInput.value = '';
+                autoResizeTextarea(els.chatInput);
+                els.chatSendBtn.disabled = true;
+            }
+        }
+    });
+
+    els.chatSendBtn.addEventListener('click', () => {
+        if (els.chatInput.value.trim() && !state.isStreaming) {
+            sendMessage(els.chatInput.value.trim());
+            els.chatInput.value = '';
+            autoResizeTextarea(els.chatInput);
+            els.chatSendBtn.disabled = true;
+        }
+    });
+}
+
+function autoResizeTextarea(textarea) {
+    textarea.style.height = 'auto';
+    textarea.style.height = Math.min(textarea.scrollHeight, 200) + 'px';
+}
+
+// ===== MODEL SELECTOR =====
+function setupModelSelector() {
+    const selectors = [els.modelSelector, els.chatModelSelector];
+
+    selectors.forEach(sel => {
+        sel.addEventListener('click', (e) => {
+            e.stopPropagation();
+            const rect = sel.getBoundingClientRect();
+            const dropdown = els.modelDropdown;
+
+            if (!dropdown.classList.contains('hidden')) {
+                dropdown.classList.add('hidden');
+                return;
+            }
+
+            dropdown.style.bottom = (window.innerHeight - rect.top + 8) + 'px';
+            dropdown.style.left = rect.left + 'px';
+            dropdown.classList.remove('hidden');
+        });
+    });
+
+    $$('.model-option').forEach(opt => {
+        opt.addEventListener('click', async () => {
+            const model = opt.dataset.model;
+            const display = opt.dataset.display;
+
+            state.currentModel = model;
+            state.currentModelDisplay = display;
+
+            $$('.model-name').forEach(n => n.textContent = display);
+            $$('.model-option').forEach(o => o.classList.remove('active'));
+            opt.classList.add('active');
+            els.modelDropdown.classList.add('hidden');
+
+            // Update on backend
+            if (state.apiConfigured) {
+                try {
+                    await fetch(`${API_BASE}/api/model?model=${model}`, { method: 'POST' });
+                    showToast(`Modelo cambiado a ${display}`);
+                } catch (e) {
+                    showToast(`Error al cambiar modelo: ${e.message}`);
+                }
+            } else {
+                showToast(`Modelo: ${display} (conecta API key para usar)`);
+            }
+        });
+    });
+
+    document.addEventListener('click', (e) => {
+        if (!els.modelDropdown.contains(e.target)) {
+            els.modelDropdown.classList.add('hidden');
+        }
+    });
+}
+
+// ===== UPLOAD =====
+function setupUpload() {
+    [els.attachBtn, els.chatAttachBtn].forEach(btn => {
+        btn.addEventListener('click', () => {
+            els.uploadModal.classList.remove('hidden');
+        });
+    });
+
+    els.uploadClose.addEventListener('click', closeUploadModal);
+    els.uploadBackdrop.addEventListener('click', closeUploadModal);
+
+    els.uploadDropzone.addEventListener('click', () => els.fileInput.click());
+
+    els.fileInput.addEventListener('change', (e) => {
+        if (e.target.files.length > 0) handleFileUpload(e.target.files[0]);
+    });
+
+    els.uploadDropzone.addEventListener('dragover', (e) => {
+        e.preventDefault();
+        els.uploadDropzone.classList.add('drag-over');
+    });
+
+    els.uploadDropzone.addEventListener('dragleave', () => {
+        els.uploadDropzone.classList.remove('drag-over');
+    });
+
+    els.uploadDropzone.addEventListener('drop', (e) => {
+        e.preventDefault();
+        els.uploadDropzone.classList.remove('drag-over');
+        if (e.dataTransfer.files.length > 0) handleFileUpload(e.dataTransfer.files[0]);
+    });
+
+    $$('.upload-type').forEach(type => {
+        type.addEventListener('click', () => {
+            $$('.upload-type').forEach(t => t.classList.remove('active'));
+            type.classList.add('active');
+            state.selectedDocType = type.dataset.type;
+        });
+    });
+}
+
+function closeUploadModal() {
+    els.uploadModal.classList.add('hidden');
+}
+
+async function handleFileUpload(file) {
+    const validExts = ['pdf', 'txt', 'docx', 'jpg', 'jpeg', 'png', 'webp'];
+    const ext = file.name.split('.').pop().toLowerCase();
+
+    if (!validExts.includes(ext)) {
+        showToast('❌ Formato no soportado');
+        return;
+    }
+
+    const dropzone = els.uploadDropzone;
+    const originalContent = dropzone.innerHTML;
+
+    dropzone.innerHTML = `
+        <div class="upload-processing">
+            <div class="spinner"></div>
+            <span>Procesando ${file.name}...</span>
+        </div>
+    `;
+
+    try {
+        const formData = new FormData();
+        formData.append('file', file);
+        formData.append('doc_type', state.selectedDocType);
+
+        const headers = { 'X-Session-ID': state.sessionId };
+        if (state.authToken) headers['Authorization'] = `Bearer ${state.authToken}`;
+
+        const res = await fetch(`${API_BASE}/api/documents/upload`, {
+            method: 'POST',
+            headers: headers,
+            body: formData,
+        });
+
+        if (!res.ok) {
+            const err = await res.json().catch(() => ({ detail: 'Upload failed' }));
+            throw new Error(err.detail);
+        }
+
+        const result = await res.json();
+
+        dropzone.innerHTML = `
+        <div class="upload-success">
+            ✅ <strong>${file.name}</strong> — ${result.message}
+        </div>
+    `;
+
+        // Refresh documents list
+        await refreshDocuments();
+
+        setTimeout(() => {
+            dropzone.innerHTML = originalContent;
+            closeUploadModal();
+            showToast(`📄 ${file.name} indexado correctamente`);
+        }, 1800);
+
+    } catch (e) {
+        dropzone.innerHTML = `
+        <div style="color: #dc2626; padding: 16px; text-align: center;">
+            ❌ Error: ${e.message}
+        </div>
+    `;
+        setTimeout(() => {
+            dropzone.innerHTML = originalContent;
+        }, 3000);
+    }
+
+    els.fileInput.value = '';
+}
+
+async function refreshDocuments() {
+    try {
+        const data = await apiGet('/api/documents');
+        state.documents = data.documents || [];
+        renderDocumentsFromList(state.documents);
+        checkApiStatus(); // Also refresh status bar
+    } catch (e) {
+        console.warn('Could not refresh documents:', e);
+    }
+}
+
+function renderDocumentsFromList(docs) {
+    if (!docs || docs.length === 0) {
+        els.documentList.innerHTML = `
+        <div class="empty-docs">
+            <span class="empty-docs-icon">📭</span>
+            <span>Sin documentos aún</span>
+        </div>
+    `;
+        return;
+    }
+
+    const docIcons = { cv: '📋', job_offer: '💼', linkedin: '👤', other: '📄' };
+
+    els.documentList.innerHTML = docs.map(doc => {
+        const icon = '📄'; // Simple icon for filenames from backend
+        return `
+        <div class="doc-item">
+            <span class="doc-icon">${icon}</span>
+            <span class="doc-name">${doc}</span>
+            <button class="doc-remove" onclick="removeDocument('${doc}')" title="Eliminar">🗑️</button>
+        </div>
+    `;
+    }).join('');
+}
+
+async function removeDocument(filename) {
+    try {
+        await apiDelete(`/api/documents/${encodeURIComponent(filename)}`);
+        showToast(`🗑️ ${filename} eliminado`);
+        await refreshDocuments();
+    } catch (e) {
+        showToast(`❌ Error: ${e.message} `);
+    }
+}
+
+window.removeDocument = removeDocument;
+
+// ===== CHIPS =====
+function setupChips() {
+    $$('.chip').forEach(chip => {
+        chip.addEventListener('click', () => {
+            const query = chip.dataset.query;
+            if (query && !state.isStreaming) sendMessage(query);
+        });
+    });
+}
+
+// ===== MESSAGES =====
+async function sendMessage(text) {
+    if (state.isStreaming) return;
+
+    // API is pre-configured, no need to check
+
+    // Create conversation if needed
+    if (!state.currentConversationId) {
+        state.currentConversationId = Date.now().toString();
+        state.conversations.unshift({
+            id: state.currentConversationId,
+            title: text.substring(0, 60) + (text.length > 60 ? '...' : ''),
+            date: new Date().toISOString(),
+            messages: [],
+        });
+        saveConversations();
+        renderConversations();
+    }
+
+    // Add user message
+    const userMsg = { role: 'user', content: text };
+    state.messages.push(userMsg);
+
+    showChat();
+    renderMessages();
+    scrollToBottom();
+
+    // Show typing indicator
+    showTypingIndicator();
+    state.isStreaming = true;
+
+    try {
+        const headers = {
+            'Content-Type': 'application/json',
+            'X-Session-ID': state.sessionId
+        };
+        if (state.authToken) headers['Authorization'] = `Bearer ${state.authToken}`;
+
+        // Call streaming API
+        const response = await fetch(`${API_BASE}/api/chat/stream`, {
+            method: 'POST',
+            headers: headers,
+            body: JSON.stringify({
+                query: text,
+                chat_history: state.messages.slice(0, -1), // Exclude last message (the current query)
+                mode: 'auto',
+            }),
+        });
+
+        if (!response.ok) {
+            const err = await response.json().catch(() => ({ detail: 'Error de comunicación' }));
+            throw new Error(err.detail);
+        }
+
+        // Parse SSE stream
+        const reader = response.body.getReader();
+        const decoder = new TextDecoder();
+        let fullResponse = '';
+        let detectedMode = 'general';
+
+        hideTypingIndicator();
+
+        // Add placeholder AI message
+        const aiMsg = { role: 'assistant', content: '' };
+        state.messages.push(aiMsg);
+        renderMessages();
+
+        while (true) {
+            const { done, value } = await reader.read();
+            if (done) break;
+
+            const text = decoder.decode(value, { stream: true });
+            const lines = text.split('\n');
+
+            for (const line of lines) {
+                if (line.startsWith('data: ')) {
+                    try {
+                        const data = JSON.parse(line.substring(6));
+
+                        if (data.type === 'mode') {
+                            detectedMode = data.mode;
+                        } else if (data.type === 'token') {
+                            fullResponse += data.content;
+                            aiMsg.content = fullResponse;
+                            updateLastMessage(fullResponse);
+                            scrollToBottom();
+                        } else if (data.type === 'done') {
+                            // Streaming complete
+                        } else if (data.type === 'error') {
+                            throw new Error(data.error);
+                        }
+                    } catch (parseError) {
+                        // Skip malformed SSE lines
+                        if (parseError.message !== 'Unexpected end of JSON input') {
+                            console.warn('SSE parse error:', parseError);
+                        }
+                    }
+                }
+            }
+        }
+
+        // Final render with full markdown
+        aiMsg.content = fullResponse;
+        renderMessages();
+        scrollToBottom();
+
+        // Save to conversation
+        saveCurrentConversation();
+
+    } catch (e) {
+        hideTypingIndicator();
+        const errorMsg = { role: 'assistant', content: `❌ **Error:** ${e.message}\n\nVerifica tu API key y conexión.` };
+        state.messages.push(errorMsg);
+        renderMessages();
+        scrollToBottom();
+    } finally {
+        state.isStreaming = false;
+    }
+}
+
+function updateLastMessage(content) {
+    const messages = els.chatMessages.querySelectorAll('.message.ai');
+    const lastMsg = messages[messages.length - 1];
+    if (lastMsg) {
+        const contentEl = lastMsg.querySelector('.message-content');
+        if (contentEl) {
+            contentEl.innerHTML = formatMarkdown(content) + '<span class="cursor-blink">▌</span>';
+        }
+    }
+}
+
+function renderMessages() {
+    els.chatMessages.innerHTML = state.messages.map((msg, i) => {
+        if (msg.role === 'user') {
+            const hasPic = state.currentUser && state.currentUser.picture;
+            const avatarContent = hasPic
+                ? `<img src="${state.currentUser.picture}" style="width:100%; height:100%; border-radius:50%; object-fit:cover;">`
+                : `🧑‍💻`;
+
+            const avatarStyle = hasPic
+                ? 'padding:0; overflow:hidden; background:transparent; border:none; border-radius:50%;'
+                : 'padding:0; overflow:hidden;';
+
+            return `
+        <div class="message user" data-index="${i}">
+            <div class="message-inner">
+                <div class="message-avatar user" style="${avatarStyle}">${avatarContent}</div>
+                <div class="message-body">
+                    <div class="message-author">${state.currentUser?.name || 'Tú'}</div>
+                    <div class="message-content">${escapeHtml(msg.content)}</div>
+                </div>
+            </div>
+        </div>
+    `;
+        } else {
+            const modelIcon = state.currentModel === 'llama-3.1-8b-instant' ? '/static/icon-flash.png' : 'https://i.postimg.cc/tJ32Jnph/image.png';
+            const modelLabel = state.currentModel === 'llama-3.1-8b-instant' ? 'CareerAI Flash' : 'CareerAI Pro';
+            return `
+        <div class="message ai" data-index="${i}">
+            <div class="message-inner">
+                <div class="message-avatar ai" style="background:transparent; border:none; padding:0;">
+                    <img src="${modelIcon}" alt="${modelLabel}" style="width:24px;height:24px;max-width:24px;max-height:24px;object-fit:contain;">
+                </div>
+                <div class="message-body">
+                    <div class="message-author">${modelLabel}</div>
+                    <div class="message-content">${formatMarkdown(msg.content)}</div>
+                    <div class="message-actions">
+                        <button class="action-btn" onclick="copyMessage(${i})" title="Copiar">
+                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <rect x="9" y="9" width="13" height="13" rx="2" ry="2" />
+                                <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" />
+                            </svg>
+                        </button>
+                        <button class="action-btn" onclick="exportMessage(${i}, 'pdf')" title="Descargar PDF">
+                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
+                                <polyline points="7 10 12 15 17 10" />
+                                <line x1="12" y1="15" x2="12" y2="3" />
+                            </svg>
+                        </button>
+                        <button class="action-btn" onclick="likeMessage(${i})" title="Me gusta">
+                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="M14 9V5a3 3 0 0 0-3-3l-4 9v11h11.28a2 2 0 0 0 2-1.7l1.38-9a2 2 0 0 0-2-2.3zM7 22H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2h3" />
+                            </svg>
+                        </button>
+                        <button class="action-btn" onclick="dislikeMessage(${i})" title="No me gusta">
+                            <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <path d="M10 15v4a3 3 0 0 0 3 3l4-9V2H5.72a2 2 0 0 0-2 1.7l-1.38 9a2 2 0 0 0 2 2.3zm7-13h2.67A2.31 2.31 0 0 1 22 4v7a2.31 2.31 0 0 1-2.33 2H17" />
+                            </svg>
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    `;
+        }
+    }).join('');
+}
+
+function showTypingIndicator() {
+    const indicator = document.createElement('div');
+    indicator.id = 'typingIndicator';
+    indicator.className = 'message ai';
+    const modelIcon = state.currentModel === 'llama-3.1-8b-instant' ? '/static/icon-flash.png' : 'https://i.postimg.cc/tJ32Jnph/image.png';
+    const modelLabel = state.currentModel === 'llama-3.1-8b-instant' ? 'CareerAI Flash' : 'CareerAI Pro';
+    indicator.innerHTML = `
+        <div class="message-inner">
+            <div class="message-avatar ai" style="background:transparent; border:none; padding:0;">
+                <img src="${modelIcon}" alt="${modelLabel}" style="width:24px;height:24px;max-width:24px;max-height:24px;object-fit:contain;">
+            </div>
+            <div class="message-body">
+                <div class="message-author">${modelLabel}</div>
+                <div class="typing-indicator">
+                    <div class="typing-dot"></div>
+                    <div class="typing-dot"></div>
+                    <div class="typing-dot"></div>
+                </div>
+            </div>
+        </div>
+    `;
+    els.chatMessages.appendChild(indicator);
+    scrollToBottom();
+}
+
+function hideTypingIndicator() {
+    const indicator = document.getElementById('typingIndicator');
+    if (indicator) indicator.remove();
+}
+
+function scrollToBottom() {
+    requestAnimationFrame(() => {
+        els.chatMessages.scrollTop = els.chatMessages.scrollHeight;
+    });
+}
+
+// ===== MESSAGE ACTIONS =====
+function copyMessage(index) {
+    const msg = state.messages[index];
+    if (msg) {
+        navigator.clipboard.writeText(msg.content).then(() => {
+            showToast('✅ Copiado al portapapeles');
+        });
+    }
+}
+
+async function exportMessage(index, format) {
+    const msg = state.messages[index];
+    if (!msg) return;
+
+    showToast(`📄 Exportando ${format.toUpperCase()}...`);
+
+    try {
+        const res = await fetch(`${API_BASE}/api/export`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ content: msg.content, format }),
+        });
+
+        if (!res.ok) throw new Error('Export failed');
+
+        const blob = await res.blob();
+        const disposition = res.headers.get('Content-Disposition') || '';
+        const filenameMatch = disposition.match(/filename="?(.+?)"?$/);
+        const filename = filenameMatch ? filenameMatch[1] : `CareerAI_Export.${format} `;
+
+        // Download
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = filename;
+        document.body.appendChild(a);
+        a.click();
+        a.remove();
+        URL.revokeObjectURL(url);
+
+        showToast(`✅ ${filename} descargado`);
+    } catch (e) {
+        showToast(`❌ Error al exportar: ${e.message} `);
+    }
+}
+
+function likeMessage(index) {
+    showToast('👍 ¡Gracias por tu feedback!');
+}
+
+function dislikeMessage(index) {
+    showToast('👎 Feedback registrado');
+}
+
+window.copyMessage = copyMessage;
+window.exportMessage = exportMessage;
+window.likeMessage = likeMessage;
+window.dislikeMessage = dislikeMessage;
+
+// ===== CONVERSATIONS (Backend & Local fallback) =====
+async function saveConversations() {
+    // Save to local storage as fallback
+    localStorage.setItem('careerai_conversations', JSON.stringify(state.conversations.slice(0, 50)));
+}
+
+async function saveCurrentConversation() {
+    if (!state.currentConversationId) return;
+    const convIndex = state.conversations.findIndex(c => c.id === state.currentConversationId);
+
+    if (convIndex !== -1) {
+        state.conversations[convIndex].messages = [...state.messages];
+        state.conversations[convIndex].date = new Date().toISOString();
+        saveConversations();
+
+        // Save to backend if logged in
+        if (state.authToken) {
+            try {
+                await apiPost('/api/conversations', {
+                    id: state.currentConversationId,
+                    title: state.conversations[convIndex].title,
+                    messages: state.messages
+                });
+            } catch (e) {
+                console.error("Failed to save to cloud:", e);
+            }
+        }
+    }
+}
+
+function renderConversations() {
+    if (state.conversations.length === 0) {
+        els.conversationList.innerHTML = '<div class="empty-docs"><span>Sin conversaciones</span></div>';
+        return;
+    }
+
+    els.conversationList.innerHTML = state.conversations.slice(0, 20).map(conv => `
+        <div class="conversation-item ${conv.id === state.currentConversationId ? 'active' : ''}"
+        onclick="loadConversation('${conv.id}')"
+        data-id="${conv.id}">
+            <span style="flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">
+                ${escapeHtml(conv.title)}
+            </span>
+            <button class="conversation-delete" onclick="deleteConversation(event, '${conv.id}')" title="Eliminar">
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                    <polyline points="3 6 5 6 21 6"></polyline>
+                    <path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path>
+                </svg>
+            </button>
+        </div>
+    `).join('');
+}
+
+function loadConversation(id) {
+    const conv = state.conversations.find(c => c.id === id);
+    if (conv) {
+        state.currentConversationId = id;
+        state.messages = conv.messages || [];
+        renderConversations();
+        if (state.messages.length > 0) {
+            showChat();
+            renderMessages();
+            scrollToBottom();
+        } else {
+            showWelcome();
+        }
+    }
+}
+
+window.loadConversation = loadConversation;
+
+function newChat() {
+    state.messages = [];
+    state.currentConversationId = null;
+    showWelcome();
+    renderConversations();
+}
+
+async function deleteConversation(event, id) {
+    event.stopPropagation();
+    if (confirm('¿Estás seguro de que deseas eliminar esta conversación?')) {
+        state.conversations = state.conversations.filter(c => c.id !== id);
+        if (state.currentConversationId === id) {
+            state.currentConversationId = null;
+            state.messages = [];
+            showWelcome();
+        }
+        saveConversations();
+        renderConversations();
+
+        // Delete from backend if logged in
+        if (state.authToken) {
+            try {
+                await apiDelete(`/api/conversations/${id}`);
+            } catch (e) {
+                console.error("Failed to delete from cloud:", e);
+            }
+        }
+
+        showToast('🗑️ Conversación eliminada');
+    }
+}
+window.deleteConversation = deleteConversation;
+
+// ===== VIEW TOGGLE =====
+function showWelcome() {
+    hideDashboardPage();
+    els.welcomeScreen.classList.remove('hidden');
+    els.welcomeScreen.style.display = '';
+    els.chatScreen.classList.add('hidden');
+    els.chatScreen.style.display = 'none';
+    els.welcomeInput.focus();
+}
+
+function showChat() {
+    hideDashboardPage();
+    els.welcomeScreen.classList.add('hidden');
+    els.welcomeScreen.style.display = 'none';
+    els.chatScreen.classList.remove('hidden');
+    els.chatScreen.style.display = '';
+    els.chatInput.focus();
+}
+
+// ===== UTILITIES =====
+function escapeHtml(text) {
+    const div = document.createElement('div');
+    div.textContent = text;
+    return div.innerHTML;
+}
+
+function formatMarkdown(text) {
+    let html = escapeHtml(text);
+
+    // Headers
+    html = html.replace(/^### (.+)$/gm, '<h3>$1</h3>');
+    html = html.replace(/^## (.+)$/gm, '<h2>$1</h2>');
+    html = html.replace(/^# (.+)$/gm, '<h1>$1</h1>');
+
+    // Bold
+    html = html.replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>');
+
+    // Italic
+    html = html.replace(/\*(.+?)\*/g, '<em>$1</em>');
+
+    // Inline code
+    html = html.replace(/`([^`]+)`/g, '<code>$1</code>');
+
+    // Code blocks
+    html = html.replace(/```(\w+)?\n([\s\S]*?)```/g, '<pre><code>$2</code></pre>');
+
+    // Blockquotes
+    html = html.replace(/^&gt; (.+)$/gm, '<blockquote>$1</blockquote>');
+
+    // Horizontal rule
+    html = html.replace(/^---$/gm, '<hr>');
+
+    // Tables
+    const lines = html.split('\n');
+    let inTable = false;
+    let tableHtml = '';
+    const result = [];
+
+    for (let i = 0; i < lines.length; i++) {
+        const line = lines[i].trim();
+        if (line.startsWith('|') && line.endsWith('|')) {
+            if (!inTable) {
+                inTable = true;
+                tableHtml = '<table>';
+            }
+            if (line.match(/^\|[\s\-|]+\|$/)) continue;
+
+            const cells = line.split('|').filter(c => c.trim());
+            const isHeader = i < lines.length - 1 && lines[i + 1] && lines[i + 1].trim().match(/^\|[\s\-|]+\|$/);
+            const tag = isHeader ? 'th' : 'td';
+            tableHtml += '<tr>' + cells.map(c => `<${tag}>${c.trim()}</${tag}>`).join('') + '</tr>';
+        } else {
+            if (inTable) {
+                inTable = false;
+                tableHtml += '</table>';
+                result.push(tableHtml);
+                tableHtml = '';
+            }
+            result.push(line);
+        }
+    }
+    if (inTable) {
+        tableHtml += '</table>';
+        result.push(tableHtml);
+    }
+
+    html = result.join('\n');
+
+    // Unordered lists
+    html = html.replace(/^- (.+)$/gm, '<li>$1</li>');
+    html = html.replace(/(<li>.*<\/li>\n?)+/g, '<ul>$&</ul>');
+
+    // Ordered lists
+    html = html.replace(/^\d+\. (.+)$/gm, '<li>$1</li>');
+
+    // Paragraphs
+    html = html.replace(/^(?!<[hupoltb]|<\/|<li|<bl|<hr|$)(.+)$/gm, '<p>$1</p>');
+
+    // Clean up
+    html = html.replace(/\n{2,}/g, '');
+    html = html.replace(/\n/g, '');
+
+    return html;
+}
+
+// ===== TOAST =====
+function showToast(message) {
+    let toast = document.querySelector('.toast');
+    if (!toast) {
+        toast = document.createElement('div');
+        toast.className = 'toast';
+        document.body.appendChild(toast);
+    }
+
+    toast.textContent = message;
+    toast.classList.add('show');
+
+    clearTimeout(toast._timeout);
+    toast._timeout = setTimeout(() => {
+        toast.classList.remove('show');
+    }, 2800);
+}
+
+// ===== KEYBOARD SHORTCUTS =====
+document.addEventListener('keydown', (e) => {
+    if ((e.ctrlKey || e.metaKey) && e.key === 'k') {
+        e.preventDefault();
+        els.searchInput.focus();
+    }
+
+    if (e.key === 'Escape') {
+        els.modelDropdown.classList.add('hidden');
+        closeUploadModal();
+        document.getElementById('apiConfigModal')?.remove();
+    }
+});
+
+// ===== CSS for cursor blink =====
+const style = document.createElement('style');
+style.textContent = `
+    .cursor-blink {
+        animation: cursorBlink 1s step-end infinite;
+        color: var(--accent-primary);
+        font-weight: 300;
+    }
+    @keyframes cursorBlink {
+        0%, 100% { opacity: 1; }
+        50% { opacity: 0; }
+    }
+`;
+document.head.appendChild(style);
+
+// ===== JOBS PANEL =====
+
+// Custom dropdown helpers
+window.toggleJobsDropdown = function (id) {
+    const el = document.getElementById(id);
+    if (!el) return;
+    const isOpen = el.classList.contains('open');
+    // Close all first
+    document.querySelectorAll('.jobs-custom-select.open').forEach(d => d.classList.remove('open'));
+    if (!isOpen) el.classList.add('open');
+};
+
+window.selectJobsOption = function (dropdownId, selectId, value, label) {
+    // Update hidden select value
+    const sel = document.getElementById(selectId);
+    if (sel) sel.value = value;
+    // Update visible label
+    const labelEl = document.getElementById(dropdownId + 'Label');
+    if (labelEl) labelEl.textContent = label;
+    // Mark active option
+    const menu = document.getElementById(dropdownId + 'Menu');
+    if (menu) {
+        menu.querySelectorAll('.jobs-select-option').forEach(o => o.classList.remove('active'));
+        event?.target?.classList.add('active');
+    }
+    // Close
+    document.getElementById(dropdownId)?.classList.remove('open');
+};
+
+// Close dropdowns when clicking outside
+document.addEventListener('click', (e) => {
+    if (!e.target.closest('.jobs-custom-select')) {
+        document.querySelectorAll('.jobs-custom-select.open').forEach(d => d.classList.remove('open'));
+    }
+});
+window.openJobsPanel = function () {
+    const panel = document.getElementById('jobsPanel');
+    const overlay = document.getElementById('jobsPanelOverlay');
+    if (!panel) return;
+    panel.style.display = 'flex';
+    overlay.style.display = 'block';
+    // Slide in animation
+    panel.style.transform = 'translateX(100%)';
+    panel.style.transition = 'transform 0.3s cubic-bezier(0.4,0,0.2,1)';
+    requestAnimationFrame(() => { panel.style.transform = 'translateX(0)'; });
+
+    // Bind Enter on search input
+    const inp = document.getElementById('jobsSearchInput');
+    if (inp && !inp._jobsBound) {
+        inp.addEventListener('keydown', (e) => { if (e.key === 'Enter') loadJobs(); });
+        inp._jobsBound = true;
+    }
+};
+
+window.closeJobsPanel = function () {
+    const panel = document.getElementById('jobsPanel');
+    const overlay = document.getElementById('jobsPanelOverlay');
+    if (!panel) return;
+    panel.style.transform = 'translateX(100%)';
+    setTimeout(() => {
+        panel.style.display = 'none';
+        overlay.style.display = 'none';
+    }, 300);
+};
+
+window.autoFillJobSearch = async function () {
+    // Try to pull CV text from the RAG document list
+    const docs = state.documents;
+    if (!docs || docs.length === 0) {
+        showToast('⚠️ Primero sube tu CV en el panel de Documentos', 'warning');
+        return;
+    }
+    // Use the first loaded document name as a query hint
+    // Then ask the AI to extract job title keywords
+    showToast('🤖 Extrayendo perfil del CV...', 'info');
+    try {
+        const res = await apiPost('/api/chat', {
+            query: 'Basándote en mi CV, responde SOLO con el título de puesto más específico y relevante para buscar empleo, en máximo 4 palabras. Por ejemplo: "Desarrollador Full Stack" o "Diseñador UX Senior". Sin explicaciones, sin puntos, sin listas. Solo el título.',
+            chat_history: [],
+            mode: 'general'
+        });
+        const keywords = res.response?.trim().replace(/\n/g, ' ').replace(/["'*]/g, '').slice(0, 60) || '';
+        if (keywords) {
+            document.getElementById('jobsSearchInput').value = keywords;
+            showToast('✅ Puesto detectado: ' + keywords);
+            loadJobs();
+        }
+    } catch (e) {
+        showToast('❌ No se pudo extraer el perfil: ' + e.message);
+    }
+};
+
+window.loadJobs = async function () {
+    const query = document.getElementById('jobsSearchInput').value.trim();
+    if (!query) {
+        showToast('⚠️ Escribe qué empleo quieres buscar', 'warning');
+        return;
+    }
+
+    const country = document.getElementById('jobsCountry').value;
+    const datePosted = document.getElementById('jobsDatePosted').value;
+    const remoteOnly = document.getElementById('jobsRemoteOnly').checked;
+
+    const btn = document.getElementById('jobsSearchBtn');
+    const resultsEl = document.getElementById('jobsResults');
+    const footerEl = document.getElementById('jobsFooter');
+
+    // Show skeletons
+    btn.innerHTML = '<span class="spinner" style="width:14px;height:14px;margin:auto;"></span>';
+    btn.style.pointerEvents = 'none';
+    resultsEl.innerHTML = Array(5).fill(`
+        <div style="border:1px solid var(--border-medium); border-radius:12px; padding:16px; animation: pulse 1.5s ease-in-out infinite; background:var(--bg-hover);">
+            <div style="height:14px; background:var(--border-medium); border-radius:6px; width:60%; margin-bottom:10px;"></div>
+            <div style="height:11px; background:var(--border-medium); border-radius:6px; width:40%; margin-bottom:8px;"></div>
+            <div style="height:11px; background:var(--border-medium); border-radius:6px; width:80%;"></div>
+        </div>
+    `).join('');
+    footerEl.style.display = 'none';
+
+    try {
+        let url = `/api/jobs?query=${encodeURIComponent(query)}&date_posted=${datePosted}&num_pages=1`;
+        if (country) url += `&country=${country}`;
+        if (remoteOnly) url += `&remote_only=true`;
+
+        const data = await apiGet(url);
+        const jobs = data.jobs || [];
+
+        if (jobs.length === 0) {
+            resultsEl.innerHTML = `
+                <div style="text-align:center; padding:50px 20px; color:var(--text-tertiary);">
+                    <div style="font-size:2.5rem; margin-bottom:12px;">😔</div>
+                    <p style="font-weight:600; color:var(--text-secondary);">Sin resultados</p>
+                    <p style="font-size:0.85rem;">Prueba con otros términos o cambia los filtros.</p>
+                </div>`;
+        } else {
+            resultsEl.innerHTML = jobs.map(j => renderJobCard(j)).join('');
+            footerEl.style.display = 'block';
+            footerEl.textContent = `Mostrando ${jobs.length} ofertas · LinkedIn · Indeed · Glassdoor · más`;
+        }
+    } catch (err) {
+        resultsEl.innerHTML = `<div style="text-align:center; padding:40px; color:#ef4444;">❌ Error: ${err.message}</div>`;
+    } finally {
+        btn.innerHTML = 'Buscar';
+        btn.style.pointerEvents = 'auto';
+    }
+};
+
+function renderJobCard(j) {
+    const remoteTag = j.is_remote
+        ? `<span style="background:rgba(16,185,129,0.15); color:#10b981; font-size:0.72rem; padding:2px 8px; border-radius:20px; font-weight:600;">🏠 Remoto</span>`
+        : '';
+    const typeTag = j.employment_type
+        ? `<span style="background:var(--bg-hover); color:var(--text-secondary); font-size:0.72rem; padding:2px 8px; border-radius:20px; border:1px solid var(--border-medium);">${j.employment_type}</span>`
+        : '';
+    const salaryTag = j.salary
+        ? `<div style="font-size:0.8rem; color:#10b981; font-weight:600; margin-top:6px;">💰 ${j.salary}</div>`
+        : '';
+    const posted = j.posted_at ? new Date(j.posted_at).toLocaleDateString('es-ES', { day: 'numeric', month: 'short' }) : '';
+    const logo = j.company_logo
+        ? `<img src="${j.company_logo}" style="width:36px;height:36px;object-fit:contain;border-radius:6px;background:white;padding:2px;" onerror="this.style.display='none'">`
+        : `<div style="width:36px;height:36px;border-radius:6px;background:var(--bg-hover);display:flex;align-items:center;justify-content:center;font-size:1.1rem;">🏢</div>`;
+
+    return `
+    <div style="border:1px solid var(--border-medium); border-radius:12px; padding:16px; background:var(--bg-primary); transition:border-color 0.2s, box-shadow 0.2s;" 
+         onmouseover="this.style.borderColor='var(--accent-primary)';this.style.boxShadow='0 2px 16px rgba(139,92,246,0.12)'"
+         onmouseout="this.style.borderColor='var(--border-medium)';this.style.boxShadow='none'">
+        <div style="display:flex; gap:12px; align-items:flex-start;">
+            ${logo}
+            <div style="flex:1; min-width:0;">
+                <div style="font-size:0.95rem; font-weight:700; color:var(--text-primary); margin-bottom:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;">${j.title}</div>
+                <div style="font-size:0.82rem; color:var(--text-secondary); margin-bottom:6px;">${j.company} · ${j.location || 'Sin ubicación'}</div>
+                <div style="display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:8px;">
+                    ${remoteTag}${typeTag}
+                    ${posted ? `<span style="font-size:0.72rem; color:var(--text-tertiary); margin-left:auto;">${posted}</span>` : ''}
+                </div>
+                ${j.description_snippet ? `<p style="font-size:0.8rem; color:var(--text-tertiary); margin:0 0 8px; line-height:1.5; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;">${j.description_snippet}</p>` : ''}
+                ${salaryTag}
+            </div>
+        </div>
+        <div style="margin-top:12px; text-align:right;">
+            <a href="${j.apply_link}" target="_blank" rel="noopener" 
+               style="display:inline-flex; align-items:center; gap:6px; background:var(--accent-primary); color:white; font-size:0.82rem; font-weight:600; padding:7px 16px; border-radius:8px; text-decoration:none; transition:opacity 0.2s;"
+               onmouseover="this.style.opacity='0.85'" onmouseout="this.style.opacity='1'">
+                Aplicar
+                <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><polyline points="15 3 21 3 21 9"></polyline><line x1="10" y1="14" x2="21" y2="3"></line></svg>
+            </a>
+        </div>
+    </div>`;
+}
+

frontend/index.html

@@ -0,0 +1,627 @@
+<!DOCTYPE html>
+<html lang="es">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>CareerAI — Tu Asistente Inteligente de Carrera</title>
+    <meta name="description"
+        content="Analiza tu carrera con inteligencia artificial. Sube tu CV, ofertas o perfil de LinkedIn y conversa con un asistente AI entrenado sobre tu trayectoria profesional.">
+    <link rel="icon" type="image/png" href="/static/favicon.png">
+    <link rel="apple-touch-icon" href="/static/favicon.png">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link
+        href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Styrene+A:wght@400;500;700&display=swap"
+        rel="stylesheet">
+    <link rel="stylesheet" href="/static/styles.css?v=2">
+    <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.4/dist/chart.umd.min.js"></script>
+</head>
+
+<body>
+    <!-- ===== SIDEBAR ===== -->
+    <aside class="sidebar" id="sidebar">
+        <div class="sidebar-inner">
+            <!-- Top actions -->
+            <div class="sidebar-top">
+                <button class="sidebar-icon-btn" id="toggleSidebar" title="Cerrar sidebar">
+                    <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <rect x="3" y="3" width="18" height="18" rx="2" />
+                        <line x1="9" y1="3" x2="9" y2="21" />
+                    </svg>
+                </button>
+                <button class="sidebar-icon-btn" id="newChatBtn" title="Nueva conversación">
+                    <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M12 20h9" />
+                        <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z" />
+                    </svg>
+                </button>
+            </div>
+
+            <!-- Search -->
+            <div class="sidebar-search">
+                <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                    stroke-linecap="round" stroke-linejoin="round">
+                    <circle cx="11" cy="11" r="8" />
+                    <line x1="21" y1="21" x2="16.65" y2="16.65" />
+                </svg>
+                <input type="text" placeholder="Buscar conversaciones..." id="searchInput">
+            </div>
+
+            <!-- Nav items -->
+            <nav class="sidebar-nav">
+                <a href="#" class="nav-item active" data-page="chat">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
+                    </svg>
+                    <span>Chat</span>
+                </a>
+                <a href="#" class="nav-item" data-page="documents">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
+                        <polyline points="14 2 14 8 20 8" />
+                    </svg>
+                    <span>Documentos</span>
+                </a>
+                <a href="#" class="nav-item" data-page="dashboard">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <line x1="18" y1="20" x2="18" y2="10" />
+                        <line x1="12" y1="20" x2="12" y2="4" />
+                        <line x1="6" y1="20" x2="6" y2="14" />
+                    </svg>
+                    <span>Dashboard</span>
+                </a>
+                <a href="#" class="nav-item" data-page="settings" style="display:none;">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <circle cx="12" cy="12" r="3" />
+                        <path
+                            d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" />
+                    </svg>
+                    <span>Configuración</span>
+                </a>
+                <a href="#" class="nav-item" id="jobsNavBtn" onclick="event.preventDefault(); openJobsPanel()">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <rect x="2" y="7" width="20" height="14" rx="2" ry="2"></rect>
+                        <path d="M16 21V5a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16"></path>
+                    </svg>
+                    <span>Empleos</span>
+                </a>
+            </nav>
+
+            <!-- Recent conversations -->
+            <div class="sidebar-section">
+                <div class="sidebar-section-label">Recientes</div>
+                <div class="conversation-list" id="conversationList">
+                    <!-- Populated by JS -->
+                </div>
+            </div>
+
+            <!-- Documents section -->
+            <div class="sidebar-section">
+                <div class="sidebar-section-label">📄 Documentos cargados</div>
+                <div class="document-list" id="documentList">
+                    <div class="empty-docs">
+                        <span class="empty-docs-icon">📭</span>
+                        <span>Sin documentos aún</span>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Footer -->
+            <div class="sidebar-footer">
+                <div class="sidebar-plan">
+                    <span>Plan Gratuito</span>
+                    <span class="plan-separator">·</span>
+                    <a href="#" class="plan-upgrade">Actualizar</a>
+                </div>
+                <div class="sidebar-user" id="userMenu">
+                    <div class="user-avatar">MY</div>
+                    <span class="user-name">Mi Cuenta</span>
+                </div>
+            </div>
+        </div>
+    </aside>
+
+    <!-- Mobile sidebar toggle -->
+    <button class="mobile-sidebar-toggle" id="mobileSidebarToggle" aria-label="Abrir menú">
+        <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+            stroke-linecap="round" stroke-linejoin="round">
+            <rect x="3" y="3" width="18" height="18" rx="2" />
+            <line x1="9" y1="3" x2="9" y2="21" />
+        </svg>
+    </button>
+
+    <!-- ===== MAIN CONTENT ===== -->
+    <main class="main-content" id="mainContent">
+        <!-- Notification bar -->
+        <div class="notification-bar" id="notificationBar">
+            <span>Plan gratuito</span>
+            <span class="notification-separator">·</span>
+            <a href="#" class="notification-link">Actualizar</a>
+        </div>
+
+        <!-- ===== WELCOME SCREEN ===== -->
+        <div class="welcome-screen" id="welcomeScreen">
+            <!-- Logo -->
+            <div class="welcome-logo"
+                style="display:flex; align-items:center; justify-content:center; gap: 14px; margin-bottom:12px;">
+                <svg width="56" height="56" viewBox="0 0 40 40" fill="none">
+                    <!-- Brain -->
+                    <path
+                        d="M 21 30 C 21 30 20 31 16 31 C 11 31 10 27 10 24 C 10 22 11 20 13 18 C 11 15 13 11 17 11 C 19 11 20 12 21 14"
+                        stroke="var(--accent-secondary)" stroke-width="2.5" stroke-linecap="round"
+                        stroke-linejoin="round" />
+                    <path
+                        d="M 21 14 C 22 12 23 11 25 11 C 29 11 31 15 29 18 C 31 20 32 22 32 24 C 32 27 31 31 26 31 C 22 31 21 30 21 30 V 14 Z"
+                        stroke="var(--accent-secondary)" stroke-width="2.5" stroke-linecap="round"
+                        stroke-linejoin="round" />
+                    <path d="M 14 24 H 17 M 15 20 H 18 M 28 24 H 25 M 27 20 H 24 M 21 18 V 26"
+                        stroke="var(--accent-secondary)" stroke-width="2.5" stroke-linecap="round"
+                        stroke-linejoin="round" />
+                    <!-- Green arrow -->
+                    <path d="M 10 24 L 25 9" stroke="var(--accent-primary)" stroke-width="3" stroke-linecap="round"
+                        stroke-linejoin="round" />
+                    <polyline points="17 9 25 9 25 17" stroke="var(--accent-primary)" stroke-width="3"
+                        stroke-linecap="round" stroke-linejoin="round" />
+                </svg>
+                <div
+                    style="font-size:3.5rem; font-weight:600; letter-spacing:-0.03em; color:var(--text-primary); line-height:1;">
+                    Career<span style="color:var(--text-primary);">a</span><span
+                        style="color:var(--accent-primary);">i</span>
+                </div>
+            </div>
+
+            <!-- Welcome heading -->
+            <h1 class="welcome-heading"
+                style="font-size:1.4rem; color:var(--text-secondary); margin-bottom:36px; font-weight:400; font-family:var(--font-family);">
+                Tu asistente inteligente de carrera</h1>
+
+            <!-- Input box -->
+            <div class="welcome-input-container">
+                <div class="welcome-input-wrapper">
+                    <textarea class="welcome-input" id="welcomeInput" placeholder="¿Cómo puedo ayudarte hoy?"
+                        rows="1"></textarea>
+                    <div class="welcome-input-actions">
+                        <button class="input-action-btn" id="attachBtn" title="Adjuntar archivo">
+                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <line x1="12" y1="5" x2="12" y2="19" />
+                                <line x1="5" y1="12" x2="19" y2="12" />
+                            </svg>
+                        </button>
+                        <div class="input-right-actions">
+                            <div class="model-selector" id="modelSelector">
+                                <span class="model-name">CareerAI Pro</span>
+                                <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                    stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                    <polyline points="6 9 12 15 18 9" />
+                                </svg>
+                            </div>
+                            <button class="send-btn" id="sendBtn" title="Enviar" disabled>
+                                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                    stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                    <line x1="22" y1="2" x2="11" y2="13" />
+                                    <polygon points="22 2 15 22 11 13 2 9 22 2" />
+                                </svg>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+
+            <!-- Suggestion chips -->
+            <div class="suggestion-chips">
+                <button class="chip" data-query="Analiza mi CV y dame un resumen profesional">
+                    <span class="chip-icon">&lt;/&gt;</span>
+                    <span>Analizar CV</span>
+                </button>
+                <button class="chip" data-query="Genera una carta de presentación para la oferta subida">
+                    <span class="chip-icon">✉️</span>
+                    <span>Cover Letter</span>
+                </button>
+                <button class="chip" data-query="¿Qué skills me faltan para crecer profesionalmente?">
+                    <span class="chip-icon">📈</span>
+                    <span>Skills Gap</span>
+                </button>
+                <button class="chip" data-query="Simula una entrevista técnica para mi perfil">
+                    <span class="chip-icon">🎤</span>
+                    <span>Entrevista</span>
+                </button>
+                <button class="chip" data-query="¿Qué roles de trabajo me convienen más según mi perfil?">
+                    <span class="chip-icon">🎯</span>
+                    <span>Job Match</span>
+                </button>
+            </div>
+        </div>
+
+        <!-- ===== CHAT SCREEN ===== -->
+        <div class="chat-screen hidden" id="chatScreen">
+            <div class="chat-messages" id="chatMessages">
+                <!-- Messages populated by JS -->
+            </div>
+
+            <!-- Chat input (bottom) -->
+            <div class="chat-input-container">
+                <div class="chat-input-wrapper">
+                    <textarea class="chat-input" id="chatInput"
+                        placeholder="Escribe tu pregunta sobre tu carrera profesional..." rows="1"></textarea>
+                    <div class="chat-input-actions">
+                        <button class="input-action-btn" id="chatAttachBtn" title="Adjuntar archivo">
+                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                <line x1="12" y1="5" x2="12" y2="19" />
+                                <line x1="5" y1="12" x2="19" y2="12" />
+                            </svg>
+                        </button>
+                        <div class="input-right-actions">
+                            <div class="model-selector" id="chatModelSelector">
+                                <span class="model-name">CareerAI Pro</span>
+                                <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                    stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                    <polyline points="6 9 12 15 18 9" />
+                                </svg>
+                            </div>
+                            <button class="send-btn chat-send" id="chatSendBtn" title="Enviar" disabled>
+                                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                    stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
+                                    <line x1="22" y1="2" x2="11" y2="13" />
+                                    <polygon points="22 2 15 22 11 13 2 9 22 2" />
+                                </svg>
+                            </button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </main>
+
+    <!-- ===== MODEL DROPDOWN ===== -->
+    <div class="model-dropdown hidden" id="modelDropdown">
+        <div class="model-dropdown-header">Selecciona un modelo</div>
+        <div class="model-option active" data-model="llama-3.3-70b-versatile" data-display="CareerAI Pro">
+            <img src="/static/icon-pro.png" alt="CareerAI Pro" class="model-option-icon" width="26" height="26"
+                style="width:26px;height:26px;max-width:26px;max-height:26px;">
+            <div class="model-option-info">
+                <span class="model-option-name">CareerAI Pro</span>
+                <span class="model-option-desc">Recomendado · Máxima calidad</span>
+            </div>
+            <svg class="model-check" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                stroke-width="2.5">
+                <polyline points="20 6 9 17 4 12" />
+            </svg>
+        </div>
+        <div class="model-option" data-model="llama-3.1-8b-instant" data-display="CareerAI Flash">
+            <img src="/static/icon-flash.png" alt="CareerAI Flash" class="model-option-icon" width="26" height="26"
+                style="width:26px;height:26px;max-width:26px;max-height:26px;">
+            <div class="model-option-info">
+                <span class="model-option-name">CareerAI Flash</span>
+                <span class="model-option-desc">Ultra rápido · Respuestas al instante</span>
+            </div>
+            <svg class="model-check" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                stroke-width="2.5">
+                <polyline points="20 6 9 17 4 12" />
+            </svg>
+        </div>
+    </div>
+
+    <!-- ===== FILE UPLOAD MODAL ===== -->
+    <div class="upload-modal hidden" id="uploadModal">
+        <div class="upload-modal-backdrop" id="uploadBackdrop"></div>
+        <div class="upload-modal-content">
+            <div class="upload-modal-header">
+                <h3>📄 Subir documento</h3>
+                <button class="upload-close" id="uploadClose">&times;</button>
+            </div>
+            <div class="upload-modal-body">
+                <div class="upload-type-selector">
+                    <label class="upload-type active" data-type="cv">
+                        <span>📋</span> CV / Resume
+                    </label>
+                    <label class="upload-type" data-type="job_offer">
+                        <span>💼</span> Oferta de Trabajo
+                    </label>
+                    <label class="upload-type" data-type="linkedin">
+                        <span>👤</span> Perfil LinkedIn
+                    </label>
+                    <label class="upload-type" data-type="other">
+                        <span>📝</span> Otro
+                    </label>
+                </div>
+                <div class="upload-dropzone" id="uploadDropzone">
+                    <svg width="40" height="40" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5"
+                        stroke-linecap="round" stroke-linejoin="round">
+                        <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
+                        <polyline points="17 8 12 3 7 8" />
+                        <line x1="12" y1="3" x2="12" y2="15" />
+                    </svg>
+                    <p>Arrastra archivos aquí o <strong>haz clic para seleccionar</strong></p>
+                    <span class="upload-formats">PDF, DOCX, TXT, JPG, PNG, WEBP</span>
+                    <input type="file" id="fileInput" accept=".pdf,.txt,.docx,.jpg,.jpeg,.png,.webp" hidden>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- ===== JOBS PANEL (slide-out drawer) ===== -->
+    <div id="jobsPanelOverlay" onclick="closeJobsPanel()"
+        style="display:none; position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:1100; backdrop-filter:blur(2px);">
+    </div>
+    <div id="jobsPanel"
+        style="display:none; position:fixed; top:0; right:0; width:min(480px,100vw); height:100vh; background:var(--bg-secondary); border-left:1px solid var(--border-medium); z-index:1101; flex-direction:column; overflow:hidden; box-shadow:-8px 0 40px rgba(0,0,0,0.3);">
+        <!-- Header -->
+        <div
+            style="padding:20px 20px 0; border-bottom:1px solid var(--border-medium); padding-bottom:16px; flex-shrink:0;">
+            <div style="display:flex; align-items:center; justify-content:space-between; margin-bottom:14px;">
+                <div>
+                    <h2 style="font-size:1.15rem; font-weight:700; margin:0;">💼 Ofertas de Trabajo</h2>
+                    <p style="font-size:0.78rem; color:var(--text-tertiary); margin:2px 0 0;">Vía LinkedIn · Indeed ·
+                        Glassdoor · más</p>
+                </div>
+                <button onclick="closeJobsPanel()"
+                    style="background:none; border:none; cursor:pointer; color:var(--text-secondary); font-size:1.4rem; line-height:1; padding:4px 8px;">&times;</button>
+            </div>
+            <!-- Search bar -->
+            <div style="display:flex; gap:8px; margin-bottom:12px;">
+                <input id="jobsSearchInput" type="text" class="welcome-input"
+                    placeholder="Ej: Python developer, diseñador UX..."
+                    style="flex:1; border:1px solid var(--border-medium); border-radius:8px; padding:9px 12px; min-height:0; font-size:0.88rem;">
+                <button onclick="loadJobs()" id="jobsSearchBtn" class="config-btn"
+                    style="padding:9px 16px; white-space:nowrap;">Buscar</button>
+            </div>
+            <!-- Filters row - Custom Dropdowns -->
+            <div style="display:flex; gap:8px; flex-wrap:wrap; font-size:0.8rem;">
+                <!-- Hidden real selects for value access -->
+                <select id="jobsCountry" style="display:none;">
+                    <option value="">🌍 Todo el mundo</option>
+                    <option value="ar">🇦🇷 Argentina</option>
+                    <option value="es">🇪🇸 España</option>
+                    <option value="mx">🇲🇽 México</option>
+                    <option value="co">🇨🇴 Colombia</option>
+                    <option value="cl">🇨🇱 Chile</option>
+                    <option value="pe">🇵🇪 Perú</option>
+                    <option value="us">🇺🇸 USA</option>
+                    <option value="gb">🇬🇧 UK</option>
+                    <option value="de">🇩🇪 Alemania</option>
+                </select>
+                <select id="jobsDatePosted" style="display:none;">
+                    <option value="month">📅 Último mes</option>
+                    <option value="week">📅 Última semana</option>
+                    <option value="3days">📅 Últimos 3 días</option>
+                    <option value="today">📅 Hoy</option>
+                    <option value="all">📅 Todas</option>
+                </select>
+
+                <!-- Custom dropdown: Country -->
+                <div class="jobs-custom-select" id="countryDropdown"
+                    style="flex:1; min-width:120px; position:relative;">
+                    <div class="jobs-select-btn" onclick="toggleJobsDropdown('countryDropdown')">
+                        <span id="countryDropdownLabel">🌍 Todo el mundo</span>
+                        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                            stroke-width="2">
+                            <polyline points="6 9 12 15 18 9"></polyline>
+                        </svg>
+                    </div>
+                    <div class="jobs-select-menu" id="countryDropdownMenu">
+                        <div class="jobs-select-option active"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','','🌍 Todo el mundo')">🌍 Todo el
+                            mundo</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','ar','🇦🇷 Argentina')">🇦🇷
+                            Argentina</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','es','🇪🇸 España')">🇪🇸 España
+                        </div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','mx','🇲🇽 México')">🇲🇽 México
+                        </div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','co','🇨🇴 Colombia')">🇨🇴
+                            Colombia</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','cl','🇨🇱 Chile')">🇨🇱 Chile
+                        </div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','pe','🇵🇪 Perú')">🇵🇪 Perú</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','us','🇺🇸 USA')">🇺🇸 USA</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','gb','🇬🇧 UK')">🇬🇧 UK</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('countryDropdown','jobsCountry','de','🇩🇪 Alemania')">🇩🇪
+                            Alemania</div>
+                    </div>
+                </div>
+
+                <!-- Custom dropdown: Date -->
+                <div class="jobs-custom-select" id="dateDropdown" style="flex:1; min-width:130px; position:relative;">
+                    <div class="jobs-select-btn" onclick="toggleJobsDropdown('dateDropdown')">
+                        <span id="dateDropdownLabel">📅 Último mes</span>
+                        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                            stroke-width="2">
+                            <polyline points="6 9 12 15 18 9"></polyline>
+                        </svg>
+                    </div>
+                    <div class="jobs-select-menu" id="dateDropdownMenu">
+                        <div class="jobs-select-option active"
+                            onclick="selectJobsOption('dateDropdown','jobsDatePosted','month','📅 Último mes')">📅
+                            Último mes</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('dateDropdown','jobsDatePosted','week','📅 Última semana')">📅
+                            Última semana</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('dateDropdown','jobsDatePosted','3days','📅 Últimos 3 días')">📅
+                            Últimos 3 días</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('dateDropdown','jobsDatePosted','today','📅 Hoy')">📅 Hoy</div>
+                        <div class="jobs-select-option"
+                            onclick="selectJobsOption('dateDropdown','jobsDatePosted','all','📅 Todas')">📅 Todas</div>
+                    </div>
+                </div>
+
+                <label
+                    style="display:flex; align-items:center; gap:5px; color:var(--text-secondary); cursor:pointer; border:1px solid var(--border-medium); border-radius:6px; padding:6px 10px; white-space:nowrap; background:var(--bg-hover);">
+                    <input type="checkbox" id="jobsRemoteOnly" style="accent-color:var(--accent-primary);"> 🏠 Remoto
+                </label>
+            </div>
+        </div>
+        <!-- Results area -->
+        <div id="jobsResults"
+            style="flex:1; overflow-y:auto; padding:16px 20px; display:flex; flex-direction:column; gap:12px;">
+            <div id="jobsEmptyState" style="text-align:center; padding:60px 20px; color:var(--text-tertiary);">
+                <div style="font-size:3rem; margin-bottom:12px;">🔍</div>
+                <p style="font-size:1rem; font-weight:600; margin-bottom:6px; color:var(--text-secondary);">Busca
+                    ofertas de empleo</p>
+                <p style="font-size:0.85rem;">Escribe un puesto o habilidad arriba.<br>Si tienes un CV cargado, <a
+                        href="#" onclick="event.preventDefault(); autoFillJobSearch()"
+                        style="color:var(--accent-primary);">auto-completar desde mi CV</a>.</p>
+            </div>
+        </div>
+        <!-- Footer count -->
+        <div id="jobsFooter"
+            style="display:none; padding:12px 20px; border-top:1px solid var(--border-medium); font-size:0.8rem; color:var(--text-tertiary); text-align:center; flex-shrink:0;">
+        </div>
+    </div>
+
+    </div>
+
+    <!-- ===== LOGIN MODAL ===== -->
+    <div class="upload-modal hidden" id="loginModal">
+        <div class="upload-modal-backdrop" id="loginBackdrop"></div>
+        <div class="upload-modal-content" style="max-width: 360px;">
+            <div class="upload-modal-header" style="justify-content: center; position: relative; border-bottom: none;">
+                <h3 style="font-size: 1.25rem;" id="loginTitle">Acceso a CareerAI</h3>
+                <button class="upload-close" id="loginClose" style="position: absolute; right: 20px;">&times;</button>
+            </div>
+            <div class="upload-modal-body" style="padding-top: 5px;">
+                <p style="text-align: center; color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 24px;">
+                    Inicia sesión para guardar tu historial y documentos en la nube.</p>
+
+                <form id="authForm" onsubmit="handleAuthSubmit(event)">
+                    <div id="registerFields" style="display: none; margin-bottom: 12px;">
+                        <input type="text" id="authName" class="welcome-input"
+                            style="border: 1px solid var(--border-medium); border-radius: 8px; padding: 10px 14px; min-height: 40px; margin-bottom: 0;"
+                            placeholder="Tu Nombre">
+                    </div>
+
+                    <div id="emailFieldGroup" style="margin-bottom: 12px;">
+                        <input type="email" id="authEmail" class="welcome-input"
+                            style="border: 1px solid var(--border-medium); border-radius: 8px; padding: 10px 14px; min-height: 40px; margin-bottom: 0;"
+                            placeholder="Correo electrónico" required>
+                    </div>
+
+                    <div id="resetCodeFields" style="display: none; margin-bottom: 12px;">
+                        <input type="text" id="authResetCode" class="welcome-input"
+                            style="border: 1px solid var(--border-medium); border-radius: 8px; padding: 10px 14px; min-height: 40px; margin-bottom: 0;"
+                            placeholder="Código de 6 dígitos">
+                    </div>
+
+                    <div id="passwordFieldsGroup" style="margin-bottom: 16px;">
+                        <input type="password" id="authPassword" class="welcome-input"
+                            style="border: 1px solid var(--border-medium); border-radius: 8px; padding: 10px 14px; min-height: 40px; margin-bottom: 0;"
+                            placeholder="Contraseña" required>
+                        <div style="text-align: right; margin-top: 6px;" id="forgotPassContainer">
+                            <a href="#" onclick="event.preventDefault(); setAuthMode('forgot')"
+                                style="font-size: 0.8rem; color: var(--accent-primary); text-decoration: none;">¿Olvidaste
+                                tu contraseña?</a>
+                        </div>
+                    </div>
+
+                    <button type="submit" id="authSubmitBtn" class="config-btn"
+                        style="width: 100%; display: flex; justify-content: center; margin-bottom: 16px;">
+                        Iniciar Sesión
+                    </button>
+
+                    <!-- Auxiliary button for Forgot Password Step 1 (Send Code) -->
+                    <button type="button" id="authSendCodeBtn" onclick="handleSendResetCode(event)" class="config-btn"
+                        style="display: none; width: 100%; justify-content: center; margin-bottom: 16px; background: var(--bg-hover); color: var(--text-primary); border: 1px solid var(--border-medium);">
+                        Enviar código a mi correo
+                    </button>
+                </form>
+
+                <div id="authToggleContainer"
+                    style="text-align: center; font-size: 0.85rem; color: var(--text-tertiary); margin-bottom: 20px;">
+                    <span id="authToggleText">¿No tienes cuenta? <a href="#"
+                            onclick="event.preventDefault(); setAuthMode('register')"
+                            style="color: var(--accent-primary); text-decoration: none;">Regístrate</a></span>
+                </div>
+
+                <div id="backToLoginContainer"
+                    style="display: none; text-align: center; font-size: 0.85rem; margin-bottom: 20px;">
+                    <a href="#" onclick="event.preventDefault(); setAuthMode('login')"
+                        style="color: var(--text-secondary); text-decoration: underline;">Volver al inicio de sesión</a>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!-- ===== PROFILE MODAL ===== -->
+    <div class="upload-modal hidden" id="profileModal">
+        <div class="upload-modal-backdrop" id="profileBackdrop"></div>
+        <div class="upload-modal-content" style="max-width: 380px; text-align: center;">
+            <div class="upload-modal-header" style="justify-content: center; position: relative; border-bottom: none;">
+                <h3 style="font-size: 1.25rem;">Mi Perfil</h3>
+                <button class="upload-close" id="profileClose" style="position: absolute; right: 20px;">&times;</button>
+            </div>
+            <div class="upload-modal-body" style="padding-top: 5px;">
+                <form id="profileForm" onsubmit="handleProfileSubmit(event)">
+
+                    <div style="position: relative; width: 80px; height: 80px; margin: 0 auto 16px; border-radius: 50%; border: 2px solid var(--accent-primary); overflow: hidden; background: var(--bg-hover); cursor: pointer;"
+                        onclick="document.getElementById('profilePictureInput').click()">
+                        <img id="profilePreview" src="" style="width: 100%; height: 100%; object-fit: cover;">
+                        <div
+                            style="position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.5); font-size: 0.7rem; color: white; padding: 4px 0;">
+                            Editar</div>
+                    </div>
+                    <input type="file" id="profilePictureInput" accept=".jpg,.jpeg,.png,.webp" hidden
+                        onchange="handleProfilePictureSelect(event)">
+
+                    <div style="margin-bottom: 12px; text-align: left;">
+                        <label
+                            style="font-size: 0.85rem; color: var(--text-secondary); margin-bottom: 4px; display: block;">Nombre</label>
+                        <input type="text" id="profileName" class="welcome-input"
+                            style="border: 1px solid var(--border-medium); border-radius: 8px; padding: 10px 14px; min-height: 40px; margin-bottom: 0;"
+                            required>
+                    </div>
+
+                    <div style="margin-bottom: 20px; text-align: left;">
+                        <label
+                            style="font-size: 0.85rem; color: var(--text-secondary); margin-bottom: 4px; display: block;">Correo
+                            de la cuenta</label>
+                        <input type="email" id="profileEmail" class="welcome-input"
+                            style="background: var(--bg-hover); border: 1px solid var(--border-medium); border-radius: 8px; padding: 10px 14px; min-height: 40px; margin-bottom: 0; color: var(--text-tertiary);"
+                            disabled>
+                    </div>
+
+                    <button type="submit" id="profileSubmitBtn" class="config-btn"
+                        style="width: 100%; margin-bottom: 16px; display: flex; justify-content: center;">
+                        Guardar Cambios
+                    </button>
+
+                    <div style="border-top: 1px solid var(--border-medium); padding-top: 16px; margin-bottom: 8px;">
+                        <button type="button" onclick="handleLogout()" class="config-btn"
+                            style="width: 100%; background: transparent; border: 1px solid #dc2626; color: #dc2626; display: flex; justify-content: center; align-items: center; gap: 8px;">
+                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor"
+                                stroke-width="2">
+                                <path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path>
+                                <polyline points="16 17 21 12 16 7"></polyline>
+                                <line x1="21" y1="12" x2="9" y2="12"></line>
+                            </svg>
+                            Cerrar Sesión
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <script src="/static/app.js?v=2"></script>
+</body>
+
+</html>

frontend/styles.css

@@ -0,0 +1,1695 @@
+/* ========================================================
+   CareerAI — Claude-Style Interface
+   Premium, clean, warm design system
+   ======================================================== */
+
+/* ===== RESET & BASE ===== */
+*,
+*::before,
+*::after {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+:root {
+    /* Dark Theme Palette */
+    --bg-primary: #111822;
+    --bg-secondary: #0d131b;
+    --bg-sidebar: #0f151e;
+    --bg-hover: #1e293b;
+    --bg-input: #1a2332;
+    --bg-message-ai: transparent;
+    --bg-message-user: transparent;
+
+    /* Text */
+    --text-primary: #ffffff;
+    --text-secondary: #94a3b8;
+    --text-tertiary: #64748b;
+    --text-placeholder: #475569;
+    --text-link: #55c970;
+
+    /* Accent (Green and Blue from logo) */
+    --accent-primary: #55c970;
+    --accent-secondary: #5584c0;
+    --accent-bg: rgba(85, 201, 112, 0.1);
+
+    /* Borders */
+    --border-light: #263346;
+    --border-medium: #334155;
+    --border-input: #334155;
+    --border-focus: #55c970;
+
+    /* Shadows */
+    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
+    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.3);
+    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);
+    --shadow-input: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 0 1px var(--border-input);
+    --shadow-input-focus: 0 0 0 2px rgba(85, 201, 112, 0.25), 0 1px 3px rgba(0, 0, 0, 0.2);
+
+    /* Sidebar */
+    --sidebar-width: 260px;
+
+    /* Transitions */
+    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
+    --transition-normal: 250ms cubic-bezier(0.4, 0, 0.2, 1);
+    --transition-smooth: 350ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
+
+    /* Typography */
+    --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
+    --font-serif: 'Georgia', 'Times New Roman', serif;
+}
+
+html {
+    height: 100%;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    text-rendering: optimizeLegibility;
+}
+
+body {
+    font-family: var(--font-family);
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    height: 100%;
+    display: flex;
+    overflow: hidden;
+    line-height: 1.5;
+    font-size: 15px;
+}
+
+/* ===== SCROLLBAR ===== */
+::-webkit-scrollbar {
+    width: 6px;
+}
+
+::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+    background: var(--border-light);
+    border-radius: 100px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: var(--border-medium);
+}
+
+/* ===== SIDEBAR ===== */
+.sidebar {
+    width: var(--sidebar-width);
+    min-width: var(--sidebar-width);
+    height: 100vh;
+    background: var(--bg-sidebar);
+    border-right: 1px solid var(--border-light);
+    display: flex;
+    flex-direction: column;
+    transition: transform var(--transition-smooth), width var(--transition-smooth), min-width var(--transition-smooth);
+    z-index: 100;
+    position: relative;
+}
+
+.sidebar.collapsed {
+    width: 0;
+    min-width: 0;
+    transform: translateX(-100%);
+    border-right: none;
+}
+
+.sidebar-inner {
+    display: flex;
+    flex-direction: column;
+    height: 100%;
+    overflow: hidden;
+    width: var(--sidebar-width);
+}
+
+/* Sidebar Top */
+.sidebar-top {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 12px 12px 8px;
+}
+
+.sidebar-icon-btn {
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: none;
+    background: transparent;
+    color: var(--text-secondary);
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.sidebar-icon-btn:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+#toggleSidebar {
+    display: none;
+}
+
+#newChatBtn {
+    margin-left: auto;
+}
+
+/* Search */
+.sidebar-search {
+    padding: 4px 12px 12px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    background: var(--bg-hover);
+    margin: 0 12px 8px;
+    border-radius: 8px;
+    padding: 8px 10px;
+    color: var(--text-tertiary);
+}
+
+.sidebar-search input {
+    border: none;
+    background: transparent;
+    font-size: 0.82rem;
+    color: var(--text-primary);
+    outline: none;
+    width: 100%;
+    font-family: var(--font-family);
+}
+
+.sidebar-search input::placeholder {
+    color: var(--text-placeholder);
+}
+
+/* Nav */
+.sidebar-nav {
+    padding: 4px 8px;
+    display: flex;
+    flex-direction: column;
+    gap: 1px;
+}
+
+.nav-item {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 8px 12px;
+    border-radius: 8px;
+    color: var(--text-secondary);
+    text-decoration: none;
+    font-size: 0.88rem;
+    font-weight: 500;
+    transition: all var(--transition-fast);
+    cursor: pointer;
+}
+
+.nav-item:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+.nav-item.active {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+    font-weight: 600;
+}
+
+/* Sidebar sections */
+.sidebar-section {
+    padding: 12px 12px 4px;
+    flex: 1;
+    overflow-y: auto;
+    min-height: 0;
+}
+
+.sidebar-section-label {
+    font-size: 0.72rem;
+    font-weight: 600;
+    color: var(--text-tertiary);
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    padding: 0 4px 8px;
+}
+
+/* Conversation list */
+.conversation-list {
+    display: flex;
+    flex-direction: column;
+    gap: 1px;
+}
+
+.conversation-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 8px 12px;
+    border-radius: 8px;
+    font-size: 0.84rem;
+    color: var(--text-secondary);
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.conversation-item:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+.conversation-item.active {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+    font-weight: 500;
+}
+
+.conversation-delete {
+    background: transparent;
+    border: none;
+    color: var(--text-tertiary);
+    cursor: pointer;
+    opacity: 0;
+    transition: all var(--transition-fast);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 4px;
+    border-radius: 4px;
+    margin-left: 6px;
+}
+
+.conversation-item:hover .conversation-delete {
+    opacity: 1;
+}
+
+.conversation-delete:hover {
+    color: #ef4444;
+    /* subtle red */
+    background: rgba(239, 68, 68, 0.1);
+}
+
+/* Document list */
+.document-list {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+}
+
+.doc-item {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 6px 10px;
+    border-radius: 8px;
+    font-size: 0.8rem;
+    color: var(--text-secondary);
+    transition: all var(--transition-fast);
+}
+
+.doc-item:hover {
+    background: var(--bg-hover);
+}
+
+.doc-item .doc-icon {
+    font-size: 0.9rem;
+}
+
+.doc-item .doc-name {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.doc-item .doc-remove {
+    opacity: 0;
+    cursor: pointer;
+    color: var(--text-tertiary);
+    border: none;
+    background: none;
+    font-size: 0.75rem;
+    transition: opacity var(--transition-fast);
+}
+
+.doc-item:hover .doc-remove {
+    opacity: 1;
+}
+
+.empty-docs {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    padding: 8px;
+    font-size: 0.8rem;
+    color: var(--text-tertiary);
+}
+
+.empty-docs-icon {
+    font-size: 1rem;
+}
+
+/* Footer */
+.sidebar-footer {
+    padding: 12px;
+    border-top: 1px solid var(--border-light);
+    margin-top: auto;
+}
+
+.sidebar-plan {
+    text-align: center;
+    font-size: 0.78rem;
+    color: var(--text-tertiary);
+    margin-bottom: 10px;
+}
+
+.plan-separator {
+    margin: 0 4px;
+}
+
+.plan-upgrade {
+    color: var(--text-link);
+    text-decoration: underline;
+    text-underline-offset: 2px;
+    font-weight: 500;
+}
+
+.plan-upgrade:hover {
+    color: var(--accent-secondary);
+}
+
+.sidebar-user {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 8px;
+    border-radius: 10px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.sidebar-user:hover {
+    background: var(--bg-hover);
+}
+
+.user-avatar {
+    width: 28px;
+    height: 28px;
+    background: linear-gradient(135deg, var(--accent-secondary), var(--accent-primary));
+    border-radius: 6px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 0.68rem;
+    font-weight: 700;
+    color: white;
+    letter-spacing: 0.02em;
+}
+
+.user-name {
+    font-size: 0.84rem;
+    font-weight: 500;
+    color: var(--text-primary);
+}
+
+/* ===== MOBILE SIDEBAR TOGGLE ===== */
+.mobile-sidebar-toggle {
+    display: none;
+    position: fixed;
+    top: 12px;
+    left: 12px;
+    z-index: 200;
+    width: 36px;
+    height: 36px;
+    align-items: center;
+    justify-content: center;
+    background: var(--bg-primary);
+    border: 1px solid var(--border-light);
+    border-radius: 8px;
+    cursor: pointer;
+    color: var(--text-secondary);
+    box-shadow: var(--shadow-sm);
+    transition: all var(--transition-fast);
+}
+
+.mobile-sidebar-toggle:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+/* ===== MAIN CONTENT ===== */
+.main-content {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    height: 100vh;
+    overflow: hidden;
+    transition: margin-left var(--transition-smooth);
+}
+
+/* Notification bar */
+.notification-bar {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 6px 16px;
+    font-size: 0.78rem;
+    color: var(--text-tertiary);
+    background: var(--bg-primary);
+    border-bottom: 1px solid var(--border-light);
+    gap: 4px;
+}
+
+.notification-separator {
+    color: var(--text-placeholder);
+}
+
+.notification-link {
+    color: var(--text-primary);
+    text-decoration: underline;
+    text-underline-offset: 2px;
+    font-weight: 500;
+    transition: color var(--transition-fast);
+}
+
+.notification-link:hover {
+    color: var(--accent-primary);
+}
+
+/* ===== WELCOME SCREEN ===== */
+.welcome-screen {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    padding: 40px 24px;
+    gap: 0;
+    animation: fadeIn 0.5s ease-out;
+    overflow-y: auto;
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(8px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+/* Logo */
+.welcome-logo {
+    margin-bottom: 24px;
+}
+
+/* Heading */
+.welcome-heading {
+    font-family: var(--font-serif);
+    font-size: clamp(1.8rem, 4vw, 2.6rem);
+    font-weight: 400;
+    color: var(--text-primary);
+    text-align: center;
+    line-height: 1.25;
+    margin-bottom: 36px;
+    letter-spacing: -0.02em;
+}
+
+/* Welcome input */
+.welcome-input-container {
+    width: 100%;
+    max-width: 620px;
+    margin-bottom: 20px;
+}
+
+.welcome-input-wrapper {
+    background: var(--bg-input);
+    border: 1px solid var(--border-input);
+    border-radius: 16px;
+    box-shadow: var(--shadow-input);
+    overflow: hidden;
+    transition: all var(--transition-normal);
+}
+
+.welcome-input-wrapper:focus-within {
+    border-color: var(--border-focus);
+    box-shadow: var(--shadow-input-focus);
+}
+
+.welcome-input {
+    width: 100%;
+    padding: 16px 18px 8px;
+    border: none;
+    outline: none;
+    font-size: 0.95rem;
+    font-family: var(--font-family);
+    color: var(--text-primary);
+    resize: none;
+    line-height: 1.5;
+    background: transparent;
+    min-height: 48px;
+    max-height: 200px;
+}
+
+.welcome-input::placeholder {
+    color: var(--text-placeholder);
+}
+
+.welcome-input-actions {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 8px 12px;
+}
+
+.input-action-btn {
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: none;
+    background: transparent;
+    color: var(--text-tertiary);
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.input-action-btn:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+.input-right-actions {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+/* Model selector */
+.model-selector {
+    display: flex;
+    align-items: center;
+    gap: 4px;
+    padding: 4px 10px;
+    border-radius: 8px;
+    font-size: 0.82rem;
+    color: var(--text-tertiary);
+    cursor: pointer;
+    transition: all var(--transition-fast);
+    user-select: none;
+}
+
+.model-selector:hover {
+    background: var(--bg-hover);
+    color: var(--text-secondary);
+}
+
+.model-name {
+    font-weight: 500;
+}
+
+/* Send button */
+.send-btn {
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: none;
+    background: var(--text-primary);
+    color: var(--bg-primary);
+    border-radius: 10px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+    opacity: 0.3;
+}
+
+.send-btn:not(:disabled) {
+    opacity: 1;
+}
+
+.send-btn:not(:disabled):hover {
+    background: var(--accent-primary);
+    transform: scale(1.05);
+}
+
+.send-btn:disabled {
+    cursor: not-allowed;
+}
+
+/* Suggestion chips */
+.suggestion-chips {
+    display: flex;
+    flex-wrap: wrap;
+    gap: 8px;
+    justify-content: center;
+    max-width: 700px;
+    margin-top: 4px;
+}
+
+.chip {
+    display: inline-flex;
+    align-items: center;
+    gap: 6px;
+    padding: 8px 16px;
+    border: 1px solid var(--border-light);
+    border-radius: 999px;
+    background: var(--bg-input);
+    color: var(--text-secondary);
+    font-size: 0.84rem;
+    font-family: var(--font-family);
+    font-weight: 500;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+    white-space: nowrap;
+}
+
+.chip:hover {
+    border-color: var(--border-medium);
+    background: var(--bg-hover);
+    color: var(--text-primary);
+    transform: translateY(-1px);
+    box-shadow: var(--shadow-sm);
+}
+
+.chip:active {
+    transform: translateY(0);
+}
+
+.chip-icon {
+    font-size: 0.82rem;
+}
+
+/* ===== CHAT SCREEN ===== */
+.chat-screen {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+}
+
+.chat-screen.hidden {
+    display: none;
+}
+
+/* Chat messages */
+.chat-messages {
+    flex: 1;
+    overflow-y: auto;
+    padding: 20px 0;
+}
+
+.message {
+    padding: 24px 0;
+    animation: messageIn 0.35s ease-out;
+}
+
+@keyframes messageIn {
+    from {
+        opacity: 0;
+        transform: translateY(6px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.message-inner {
+    max-width: 768px;
+    margin: 0 auto;
+    padding: 0 24px;
+    display: flex;
+    gap: 16px;
+}
+
+.message-avatar {
+    width: 28px;
+    height: 28px;
+    min-width: 28px;
+    border-radius: 8px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 0.95rem;
+    margin-top: 2px;
+}
+
+.message-avatar.user {
+    background: var(--bg-hover);
+    border: 1px solid var(--border-light);
+}
+
+.message-avatar.ai {
+    background: transparent;
+    color: white;
+    font-size: 0.75rem;
+}
+
+.message-avatar.ai svg {
+    width: 24px;
+    height: 24px;
+}
+
+.message-body {
+    flex: 1;
+    min-width: 0;
+}
+
+.message-author {
+    font-size: 0.84rem;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: 6px;
+}
+
+.message-content {
+    font-size: 0.94rem;
+    line-height: 1.65;
+    color: var(--text-primary);
+    word-break: break-word;
+}
+
+.message-content p {
+    margin-bottom: 12px;
+}
+
+.message-content p:last-child {
+    margin-bottom: 0;
+}
+
+.message-content strong {
+    font-weight: 600;
+}
+
+.message-content code {
+    background: var(--bg-hover);
+    padding: 2px 6px;
+    border-radius: 4px;
+    font-size: 0.88em;
+    font-family: 'SF Mono', 'Fira Code', 'Consolas', monospace;
+}
+
+.message-content pre {
+    background: #1a1915;
+    color: #e4e4e7;
+    padding: 16px;
+    border-radius: 10px;
+    overflow-x: auto;
+    margin: 12px 0;
+    font-size: 0.85rem;
+    line-height: 1.5;
+}
+
+.message-content pre code {
+    background: none;
+    padding: 0;
+    color: inherit;
+}
+
+.message-content ul,
+.message-content ol {
+    padding-left: 20px;
+    margin: 8px 0;
+}
+
+.message-content li {
+    margin-bottom: 4px;
+}
+
+/* Message actions */
+.message-actions {
+    display: flex;
+    gap: 4px;
+    margin-top: 12px;
+    opacity: 0;
+    transition: opacity var(--transition-fast);
+}
+
+.message:hover .message-actions {
+    opacity: 1;
+}
+
+.action-btn {
+    width: 30px;
+    height: 30px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: none;
+    background: transparent;
+    color: var(--text-tertiary);
+    border-radius: 6px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.action-btn:hover {
+    background: var(--bg-hover);
+    color: var(--text-secondary);
+}
+
+.action-btn.copied {
+    color: #16a34a;
+}
+
+/* AI message specific */
+.message.ai {
+    background: var(--bg-message-ai);
+}
+
+/* Typing indicator */
+.typing-indicator {
+    display: flex;
+    gap: 4px;
+    padding: 4px 0;
+}
+
+.typing-dot {
+    width: 6px;
+    height: 6px;
+    background: var(--text-tertiary);
+    border-radius: 50%;
+    animation: typingBounce 1.4s infinite ease-in-out;
+}
+
+.typing-dot:nth-child(2) {
+    animation-delay: 0.2s;
+}
+
+.typing-dot:nth-child(3) {
+    animation-delay: 0.4s;
+}
+
+@keyframes typingBounce {
+
+    0%,
+    80%,
+    100% {
+        transform: scale(0.6);
+        opacity: 0.4;
+    }
+
+    40% {
+        transform: scale(1);
+        opacity: 1;
+    }
+}
+
+/* Chat input (bottom) */
+.chat-input-container {
+    padding: 12px 24px 20px;
+    background: linear-gradient(to top, var(--bg-primary) 70%, transparent);
+}
+
+.chat-input-wrapper {
+    max-width: 768px;
+    margin: 0 auto;
+    background: var(--bg-input);
+    border: 1px solid var(--border-input);
+    border-radius: 16px;
+    box-shadow: var(--shadow-input);
+    overflow: hidden;
+    transition: all var(--transition-normal);
+}
+
+.chat-input-wrapper:focus-within {
+    border-color: var(--border-focus);
+    box-shadow: var(--shadow-input-focus);
+}
+
+.chat-input {
+    width: 100%;
+    padding: 14px 18px 6px;
+    border: none;
+    outline: none;
+    font-size: 0.95rem;
+    font-family: var(--font-family);
+    color: var(--text-primary);
+    resize: none;
+    line-height: 1.5;
+    background: transparent;
+    min-height: 44px;
+    max-height: 200px;
+}
+
+.chat-input::placeholder {
+    color: var(--text-placeholder);
+}
+
+.chat-input-actions {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 6px 12px;
+}
+
+/* ===== MODEL DROPDOWN ===== */
+.model-dropdown {
+    position: fixed;
+    background: var(--bg-input);
+    border: 1px solid var(--border-light);
+    border-radius: 12px;
+    box-shadow: var(--shadow-lg);
+    min-width: 260px;
+    z-index: 500;
+    padding: 6px;
+    animation: dropdownIn 0.2s ease-out;
+}
+
+.model-dropdown.hidden {
+    display: none;
+}
+
+@keyframes dropdownIn {
+    from {
+        opacity: 0;
+        transform: translateY(4px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.model-dropdown-header {
+    font-size: 0.72rem;
+    font-weight: 600;
+    color: var(--text-tertiary);
+    text-transform: uppercase;
+    letter-spacing: 0.08em;
+    padding: 8px 12px 6px;
+}
+
+.model-option {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 10px;
+    padding: 10px 12px;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+    overflow: hidden;
+}
+
+.model-option:hover {
+    background: var(--bg-hover);
+}
+
+.model-option.active {
+    background: var(--accent-bg);
+}
+
+.model-option-icon {
+    width: 26px;
+    height: 26px;
+    max-width: 26px;
+    max-height: 26px;
+    min-width: 26px;
+    border-radius: 6px;
+    object-fit: contain;
+    flex-shrink: 0;
+}
+
+.model-option-info {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+}
+
+.model-option-name {
+    font-size: 0.88rem;
+    font-weight: 500;
+    color: var(--text-primary);
+}
+
+.model-option-desc {
+    font-size: 0.75rem;
+    color: var(--text-tertiary);
+    margin-top: 1px;
+}
+
+.model-check {
+    color: var(--accent-primary);
+    opacity: 0;
+    transition: opacity var(--transition-fast);
+}
+
+.model-option.active .model-check {
+    opacity: 1;
+}
+
+/* ===== UPLOAD MODAL ===== */
+.upload-modal {
+    position: fixed;
+    inset: 0;
+    z-index: 400;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.upload-modal.hidden {
+    display: none;
+}
+
+.upload-modal-backdrop {
+    position: absolute;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.4);
+    backdrop-filter: blur(4px);
+    animation: backdropIn 0.25s ease-out;
+}
+
+@keyframes backdropIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}
+
+.upload-modal-content {
+    position: relative;
+    background: var(--bg-input);
+    border-radius: 18px;
+    box-shadow: var(--shadow-lg);
+    width: 90%;
+    max-width: 520px;
+    animation: modalIn 0.3s ease-out;
+}
+
+@keyframes modalIn {
+    from {
+        opacity: 0;
+        transform: scale(0.96) translateY(8px);
+    }
+
+    to {
+        opacity: 1;
+        transform: scale(1) translateY(0);
+    }
+}
+
+.upload-modal-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 20px 24px 12px;
+}
+
+.upload-modal-header h3 {
+    font-size: 1.05rem;
+    font-weight: 600;
+    color: var(--text-primary);
+}
+
+.upload-close {
+    width: 32px;
+    height: 32px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border: none;
+    background: transparent;
+    font-size: 1.4rem;
+    color: var(--text-tertiary);
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.upload-close:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+.upload-modal-body {
+    padding: 0 24px 24px;
+}
+
+/* Upload type selector */
+.upload-type-selector {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    gap: 6px;
+    margin-bottom: 16px;
+}
+
+.upload-type {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 4px;
+    padding: 10px 6px;
+    border: 1px solid var(--border-light);
+    border-radius: 10px;
+    font-size: 0.72rem;
+    font-weight: 500;
+    color: var(--text-secondary);
+    cursor: pointer;
+    text-align: center;
+    transition: all var(--transition-fast);
+}
+
+.upload-type:hover {
+    border-color: var(--border-medium);
+    background: var(--bg-hover);
+}
+
+.upload-type.active {
+    border-color: var(--accent-primary);
+    background: var(--accent-bg);
+    color: var(--accent-primary);
+}
+
+.upload-type span {
+    font-size: 1.2rem;
+}
+
+/* Dropzone */
+.upload-dropzone {
+    border: 2px dashed var(--border-light);
+    border-radius: 14px;
+    padding: 36px 24px;
+    text-align: center;
+    cursor: pointer;
+    transition: all var(--transition-normal);
+    color: var(--text-tertiary);
+}
+
+.upload-dropzone:hover,
+.upload-dropzone.drag-over {
+    border-color: var(--accent-primary);
+    background: var(--accent-bg);
+    color: var(--accent-primary);
+}
+
+.upload-dropzone svg {
+    margin-bottom: 12px;
+    opacity: 0.5;
+}
+
+.upload-dropzone p {
+    font-size: 0.88rem;
+    color: var(--text-secondary);
+    margin-bottom: 6px;
+}
+
+.upload-dropzone strong {
+    color: var(--accent-primary);
+}
+
+.upload-formats {
+    font-size: 0.75rem;
+    color: var(--text-tertiary);
+}
+
+/* ===== HIDDEN UTILITY ===== */
+.hidden {
+    display: none !important;
+}
+
+/* ===== PROCESSING STATE ===== */
+.upload-processing {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 16px;
+    background: var(--accent-bg);
+    border-radius: 10px;
+    font-size: 0.88rem;
+    color: var(--accent-primary);
+    font-weight: 500;
+}
+
+.upload-processing .spinner {
+    width: 18px;
+    height: 18px;
+    border: 2px solid var(--border-light);
+    border-top-color: var(--accent-primary);
+    border-radius: 50%;
+    animation: spin 0.7s linear infinite;
+}
+
+@keyframes spin {
+    to {
+        transform: rotate(360deg);
+    }
+}
+
+/* Upload success */
+.upload-success {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 12px 16px;
+    background: rgba(22, 163, 74, 0.06);
+    border: 1px solid rgba(22, 163, 74, 0.15);
+    border-radius: 10px;
+    font-size: 0.85rem;
+    color: #16a34a;
+    font-weight: 500;
+    margin-top: 12px;
+}
+
+/* ===== RESPONSIVE ===== */
+@media (max-width: 768px) {
+    .sidebar {
+        position: fixed;
+        left: 0;
+        top: 0;
+        bottom: 0;
+        z-index: 300;
+        width: 100%;
+        max-width: 300px;
+        /* Instead of taking the whole screen on tablets */
+    }
+
+    .sidebar.collapsed {
+        transform: translateX(-100%);
+        width: 100%;
+        min-width: 100%;
+        border-right: 1px solid var(--border-light);
+    }
+
+    .mobile-sidebar-toggle {
+        display: flex;
+    }
+
+    .sidebar:not(.collapsed)~.mobile-sidebar-toggle {
+        display: none;
+    }
+
+    #toggleSidebar {
+        display: flex;
+    }
+
+    .welcome-heading {
+        font-size: 1.6rem;
+    }
+
+    .suggestion-chips {
+        flex-direction: column;
+        align-items: center;
+    }
+
+    .chip {
+        width: 100%;
+        max-width: 300px;
+        justify-content: center;
+    }
+
+    .message-inner {
+        padding: 0 16px;
+    }
+
+    .upload-type-selector {
+        grid-template-columns: repeat(2, 1fr);
+    }
+
+    /* Force show delete button on mobile since there is no hover */
+    .conversation-delete {
+        opacity: 1;
+        padding: 6px;
+        /* slightly bigger touch target */
+    }
+}
+
+@media (max-width: 480px) {
+    .welcome-heading {
+        font-size: 1.35rem;
+    }
+
+    .sidebar {
+        width: 100%;
+        min-width: 100%;
+    }
+
+    .sidebar-inner {
+        width: 100%;
+    }
+
+    .notification-bar {
+        font-size: 0.72rem;
+    }
+}
+
+/* ===== EXPORT TOOLBAR (in messages) ===== */
+.export-toolbar {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    margin-top: 12px;
+    flex-wrap: wrap;
+}
+
+.export-btn {
+    padding: 5px 12px;
+    border: 1px solid var(--border-light);
+    border-radius: 8px;
+    background: var(--bg-input);
+    color: var(--text-secondary);
+    font-size: 0.76rem;
+    font-weight: 500;
+    font-family: var(--font-family);
+    cursor: pointer;
+    transition: all var(--transition-fast);
+    display: flex;
+    align-items: center;
+    gap: 4px;
+}
+
+.export-btn:hover {
+    border-color: var(--accent-primary);
+    color: var(--accent-primary);
+    background: var(--accent-bg);
+}
+
+/* ===== TOAST NOTIFICATION ===== */
+.toast {
+    position: fixed;
+    bottom: 24px;
+    left: 50%;
+    transform: translateX(-50%) translateY(100px);
+    background: var(--text-primary);
+    color: var(--bg-primary);
+    padding: 10px 20px;
+    border-radius: 10px;
+    font-size: 0.85rem;
+    font-weight: 500;
+    z-index: 1000;
+    opacity: 0;
+    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
+    pointer-events: none;
+}
+
+.toast.show {
+    opacity: 1;
+    transform: translateX(-50%) translateY(0);
+}
+
+/* ===== MARKDOWN STYLES in AI messages ===== */
+.message-content h1,
+.message-content h2,
+.message-content h3 {
+    margin-top: 16px;
+    margin-bottom: 8px;
+    font-weight: 600;
+    color: var(--text-primary);
+}
+
+.message-content h1 {
+    font-size: 1.25rem;
+}
+
+.message-content h2 {
+    font-size: 1.1rem;
+}
+
+.message-content h3 {
+    font-size: 1rem;
+}
+
+.message-content blockquote {
+    border-left: 3px solid var(--accent-primary);
+    padding-left: 16px;
+    margin: 12px 0;
+    color: var(--text-secondary);
+    font-style: italic;
+}
+
+.message-content hr {
+    border: none;
+    border-top: 1px solid var(--border-light);
+    margin: 16px 0;
+}
+
+.message-content table {
+    border-collapse: collapse;
+    width: 100%;
+    margin: 12px 0;
+    font-size: 0.88rem;
+}
+
+.message-content th,
+.message-content td {
+    border: 1px solid var(--border-light);
+    padding: 8px 12px;
+    text-align: left;
+}
+
+.message-content th {
+    background: var(--bg-hover);
+    font-weight: 600;
+}
+
+/* ===== API KEY CONFIG PANEL ===== */
+.config-panel {
+    max-width: 768px;
+    margin: 40px auto;
+    padding: 0 24px;
+}
+
+.config-card {
+    background: var(--bg-input);
+    border: 1px solid var(--border-light);
+    border-radius: 16px;
+    padding: 32px;
+    box-shadow: var(--shadow-md);
+}
+
+.config-card h2 {
+    font-size: 1.15rem;
+    font-weight: 600;
+    margin-bottom: 8px;
+    display: flex;
+    align-items: center;
+    gap: 8px;
+}
+
+.config-card p {
+    color: var(--text-secondary);
+    font-size: 0.88rem;
+    margin-bottom: 20px;
+}
+
+.config-input-group {
+    display: flex;
+    gap: 8px;
+    margin-bottom: 12px;
+}
+
+.config-input {
+    flex: 1;
+    padding: 10px 14px;
+    border: 1px solid var(--border-input);
+    border-radius: 10px;
+    font-size: 0.9rem;
+    font-family: var(--font-family);
+    color: var(--text-primary);
+    background: var(--bg-primary);
+    outline: none;
+    transition: all var(--transition-fast);
+}
+
+.config-input:focus {
+    border-color: var(--border-focus);
+    box-shadow: var(--shadow-input-focus);
+}
+
+.config-btn {
+    padding: 10px 20px;
+    border: none;
+    background: var(--text-primary);
+    color: var(--bg-primary);
+    border-radius: 10px;
+    font-size: 0.88rem;
+    font-weight: 600;
+    font-family: var(--font-family);
+    cursor: pointer;
+    transition: all var(--transition-fast);
+    white-space: nowrap;
+}
+
+.config-btn:hover {
+    background: var(--accent-primary);
+    transform: translateY(-1px);
+}
+
+.config-status {
+    display: flex;
+    align-items: center;
+    gap: 6px;
+    font-size: 0.82rem;
+    font-weight: 500;
+}
+
+.config-status.connected {
+    color: #16a34a;
+}
+
+.config-status.disconnected {
+    color: #dc2626;
+}
+
+/* ===== LOGIN MODAL ===== */
+.google-btn {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+    width: 100%;
+    padding: 12px 16px;
+    background: white;
+    color: #3c4043;
+    border: 1px solid #dadce0;
+    border-radius: 8px;
+    font-size: 0.95rem;
+    font-weight: 500;
+    font-family: 'Roboto', var(--font-family);
+    cursor: pointer;
+    transition: all var(--transition-fast);
+}
+
+.google-btn:hover {
+    background: #f8f9fa;
+    box-shadow: 0 1px 3px rgba(60, 64, 67, 0.3);
+}
+
+.google-btn svg {
+    min-width: 20px;
+}
+
+.status-dot {
+    width: 6px;
+    height: 6px;
+    border-radius: 50%;
+    background: currentColor;
+}
+
+/* ===== DARK SELECT DROPDOWNS ===== */
+select.welcome-input,
+select {
+    background-color: var(--bg-secondary) !important;
+    color: var(--text-primary) !important;
+    border-color: var(--border-medium) !important;
+    color-scheme: dark;
+    -webkit-appearance: none;
+    appearance: none;
+    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
+    background-repeat: no-repeat;
+    background-position: right 10px center;
+    padding-right: 32px !important;
+}
+
+select.welcome-input option,
+select option {
+    background-color: var(--bg-secondary) !important;
+    color: var(--text-primary) !important;
+}
+
+/* ===== JOBS CUSTOM DROPDOWNS ===== */
+.jobs-custom-select {
+    position: relative;
+    user-select: none;
+}
+
+.jobs-select-btn {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 6px;
+    padding: 6px 10px;
+    background: var(--bg-hover);
+    border: 1px solid var(--border-medium);
+    border-radius: 6px;
+    color: var(--text-primary);
+    font-size: 0.8rem;
+    cursor: pointer;
+    transition: border-color 0.2s, background 0.2s;
+    white-space: nowrap;
+}
+
+.jobs-select-btn:hover {
+    border-color: var(--accent-primary);
+    background: var(--bg-secondary);
+}
+
+.jobs-select-btn svg {
+    flex-shrink: 0;
+    color: var(--text-tertiary);
+    transition: transform 0.2s;
+}
+
+.jobs-custom-select.open .jobs-select-btn svg {
+    transform: rotate(180deg);
+}
+
+.jobs-custom-select.open .jobs-select-btn {
+    border-color: var(--accent-primary);
+}
+
+.jobs-select-menu {
+    display: none;
+    position: absolute;
+    top: calc(100% + 4px);
+    left: 0;
+    min-width: 100%;
+    background: var(--bg-secondary);
+    border: 1px solid var(--border-medium);
+    border-radius: 8px;
+    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
+    z-index: 9999;
+    overflow: hidden;
+    animation: dropdownFadeIn 0.15s ease;
+}
+
+@keyframes dropdownFadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(-4px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+.jobs-custom-select.open .jobs-select-menu {
+    display: block;
+}
+
+.jobs-select-option {
+    padding: 8px 14px;
+    font-size: 0.82rem;
+    color: var(--text-secondary);
+    cursor: pointer;
+    transition: background 0.15s, color 0.15s;
+    white-space: nowrap;
+}
+
+.jobs-select-option:hover {
+    background: var(--bg-hover);
+    color: var(--text-primary);
+}
+
+.jobs-select-option.active {
+    color: var(--accent-primary);
+    font-weight: 600;
+    background: rgba(139, 92, 246, 0.08);
+}

render.yaml

@@ -0,0 +1,27 @@
+services:
+  - type: web
+    name: careerai
+    runtime: docker
+    plan: free
+    region: oregon
+    dockerfilePath: ./Dockerfile
+    envVars:
+      # Use lightweight embedding model (fits in 512 MB RAM)
+      - key: EMBEDDING_MODEL
+        value: gte-multilingual
+      # Disable reranker to save ~1.5 GB RAM
+      - key: ENABLE_RERANKING
+        value: "false"
+      # Your API keys (set these in Render dashboard, NOT here)
+      - key: GROQ_API_KEY
+        sync: false
+      - key: SECRET_KEY
+        generateValue: true
+      - key: JSEARCH_API_KEY
+        sync: false
+      - key: MAIL_USERNAME
+        sync: false
+      - key: MAIL_PASSWORD
+        sync: false
+      - key: MAIL_FROM
+        sync: false

requirements.txt

@@ -0,0 +1,38 @@
+# ======================== CareerAI Dependencies ========================
+# Backend framework
+fastapi>=0.115.0
+uvicorn[standard]>=0.30.0
+python-multipart>=0.0.9
+python-dotenv>=1.0.0
+
+# LLM & RAG
+langchain>=0.3.0
+langchain-groq>=0.2.0
+langchain-huggingface>=0.1.2
+langchain-chroma>=0.2.0
+langchain-community>=0.3.0
+chromadb>=0.5.0
+sentence-transformers>=3.0.0
+rank-bm25>=0.2.2
+
+# Document processing
+pypdf>=4.0.0
+python-docx>=1.0.0
+pdfplumber>=0.11.0
+PyMuPDF>=1.24.0
+
+# Export
+fpdf2>=2.7.0
+
+# Authentication
+sqlalchemy>=2.0.0
+python-jose[cryptography]>=3.3.0
+bcrypt>=4.0.0
+email-validator>=2.0.0
+fastapi-mail>=1.4.0
+
+# HTTP client (for JSearch API)
+httpx>=0.27.0
+
+# Google OAuth (optional)
+google-auth>=2.0.0

src/__init__.py

@@ -0,0 +1 @@
+# CareerAI - AI Career Assistant with RAG

src/auth.py

@@ -0,0 +1,326 @@
+from fastapi import APIRouter, Depends, HTTPException, status
+from fastapi.security import OAuth2PasswordBearer, OAuth2PasswordRequestForm
+from sqlalchemy.orm import Session
+from sqlalchemy import or_
+from datetime import datetime, timedelta
+from jose import JWTError, jwt
+from fastapi_mail import FastMail, MessageSchema, ConnectionConfig, MessageType
+import bcrypt
+import json
+import random
+
+from src.models import get_db, User, Conversation
+
+import os
+
+# Memory dictionary to mock sent emails for recovery 
+reset_codes = {}
+
+# REAL EMAIL CONFIGURATION (reads from .env) — only if configured
+_mail_from = os.environ.get("MAIL_FROM", "")
+_mail_user = os.environ.get("MAIL_USERNAME", "")
+_mail_pass = os.environ.get("MAIL_PASSWORD", "")
+
+if _mail_from and "@" in _mail_from and _mail_user and _mail_pass:
+    conf_mail = ConnectionConfig(
+        MAIL_USERNAME=_mail_user,
+        MAIL_PASSWORD=_mail_pass,
+        MAIL_FROM=_mail_from,
+        MAIL_PORT=587,
+        MAIL_SERVER="smtp.gmail.com",
+        MAIL_STARTTLS=True,
+        MAIL_SSL_TLS=False,
+        USE_CREDENTIALS=True,
+        VALIDATE_CERTS=True
+    )
+    fast_mail = FastMail(conf_mail)
+else:
+    conf_mail = None
+    fast_mail = None
+
+# JWT configuration (reads from .env)
+SECRET_KEY = os.environ.get("SECRET_KEY", "fallback_dev_key_change_this")
+ALGORITHM = "HS256"
+ACCESS_TOKEN_EXPIRE_MINUTES = 60 * 24 * 7 # 7 days validity
+
+oauth2_scheme = OAuth2PasswordBearer(tokenUrl="/api/auth/login")
+
+router = APIRouter(prefix="/api/auth", tags=["auth"])
+
+def verify_password(plain_password: str, hashed_password: str):
+    if isinstance(hashed_password, str):
+        hashed_password = hashed_password.encode('utf-8')
+    return bcrypt.checkpw(plain_password.encode('utf-8'), hashed_password)
+
+def get_password_hash(password: str):
+    return bcrypt.hashpw(password.encode('utf-8'), bcrypt.gensalt()).decode('utf-8')
+
+def create_access_token(data: dict, expires_delta: timedelta = None):
+    to_encode = data.copy()
+    if expires_delta:
+        expire = datetime.utcnow() + expires_delta
+    else:
+        expire = datetime.utcnow() + timedelta(minutes=15)
+    to_encode.update({"exp": expire})
+    return jwt.encode(to_encode, SECRET_KEY, algorithm=ALGORITHM)
+
+async def get_current_user(token: str = Depends(oauth2_scheme), db: Session = Depends(get_db)):
+    credentials_exception = HTTPException(
+        status_code=status.HTTP_401_UNAUTHORIZED,
+        detail="Could not validate credentials",
+        headers={"WWW-Authenticate": "Bearer"},
+    )
+    try:
+        payload = jwt.decode(token, SECRET_KEY, algorithms=[ALGORITHM])
+        email: str = payload.get("sub")
+        if email is None:
+            raise credentials_exception
+    except JWTError:
+        raise credentials_exception
+        
+    user = db.query(User).filter(User.email == email).first()
+    if user is None:
+        raise credentials_exception
+    return user
+
+from fastapi import Header
+
+async def get_user_or_session_id(
+    authorization: str = Header(None),
+    x_session_id: str = Header(None)
+) -> str:
+    """Extracts a private effective user ID to isolate documents and chats."""
+    # 1. Try logged-in user from JWT
+    if authorization and authorization.startswith("Bearer "):
+        token = authorization.split(" ")[1]
+        try:
+            payload = jwt.decode(token, SECRET_KEY, algorithms=[ALGORITHM])
+            user_sub = payload.get("sub")
+            if user_sub:
+                return f"user_{user_sub}"
+        except JWTError:
+            pass
+    # 2. Try anonymous session header
+    if x_session_id:
+        return f"guest_{x_session_id}"
+    # 3. Fallback
+    return "anonymous"
+
+from pydantic import BaseModel, EmailStr
+from typing import Optional
+
+class UserCreate(BaseModel):
+    name: str
+    email: EmailStr
+    password: str
+
+class UserUpdate(BaseModel):
+    name: Optional[str] = None
+    picture: Optional[str] = None
+
+class ForgotPasswordBody(BaseModel):
+    email: EmailStr
+
+class ResetPasswordBody(BaseModel):
+    email: EmailStr
+    code: str
+    new_password: str
+
+class GoogleLogin(BaseModel):
+    token: str
+
+@router.post("/register")
+def register(user: UserCreate, db: Session = Depends(get_db)):
+    db_user = db.query(User).filter(User.email == user.email).first()
+    if db_user:
+        raise HTTPException(status_code=400, detail="El correo ya está registrado")
+    
+    new_user = User(
+        email=user.email,
+        name=user.name,
+        hashed_password=get_password_hash(user.password),
+        picture="https://ui-avatars.com/api/?name=" + user.name.replace(" ", "+")
+    )
+    db.add(new_user)
+    db.commit()
+    db.refresh(new_user)
+    
+    access_token = create_access_token(
+        data={"sub": new_user.email}, expires_delta=timedelta(minutes=ACCESS_TOKEN_EXPIRE_MINUTES)
+    )
+    
+    return {"access_token": access_token, "token_type": "bearer", "user": {"name": new_user.name, "email": new_user.email, "picture": new_user.picture}}
+
+@router.post("/login")
+def login(form_data: OAuth2PasswordRequestForm = Depends(), db: Session = Depends(get_db)):
+    user = db.query(User).filter(User.email == form_data.username).first()
+    if not user or not user.hashed_password:
+        raise HTTPException(status_code=400, detail="Correo o contraseña incorrectos")
+    if not verify_password(form_data.password, user.hashed_password):
+        raise HTTPException(status_code=400, detail="Correo o contraseña incorrectos")
+        
+    access_token = create_access_token(
+        data={"sub": user.email}, expires_delta=timedelta(minutes=ACCESS_TOKEN_EXPIRE_MINUTES)
+    )
+    return {"access_token": access_token, "token_type": "bearer", "user": {"name": user.name, "email": user.email, "picture": user.picture}}
+
+@router.post("/forgot-password")
+async def forgot_password(body: ForgotPasswordBody, db: Session = Depends(get_db)):
+    user = db.query(User).filter(User.email == body.email).first()
+    if not user:
+        # Prevent user-enumeration, always return ok
+        return {"status": "ok", "message": "Si el correo está registrado, se envió un código temporal."}
+    
+    code = str(random.randint(100000, 999999))
+    reset_codes[body.email] = code
+    
+    # Send actual email if configured, otherwise print to terminal
+    if fast_mail is not None:
+        message = MessageSchema(
+            subject="Recuperación de Contraseña - CareerAI",
+            recipients=[body.email],
+            body=f"Hola {user.name},\n\nHemos recibido una solicitud para restablecer tu contraseña.\n\nTu código de recuperación es: {code}\n\nSi no fuiste tú, ignora este mensaje.",
+            subtype=MessageType.plain
+        )
+        try:
+            await fast_mail.send_message(message)
+            print(f"📧 Correo Real enviado exitosamente a {body.email}")
+        except Exception as e:
+            print(f"❌ Error enviando el correo real: {str(e)}")
+    else:
+        print("\n" + "="*50)
+        print("📧 SIMULACIÓN (Email no configurado en producción):")
+        print(f"Para: {body.email}")
+        print("Asunto: Recuperación de tu contraseña")
+        print(f"Tu código de recuperación temporal es: {code}")
+        print("="*50 + "\n")
+    
+    return {"status": "ok", "message": "Si el correo está registrado, se envió un código temporal."}
+
+@router.post("/reset-password")
+def reset_password(body: ResetPasswordBody, db: Session = Depends(get_db)):
+    if reset_codes.get(body.email) != body.code:
+        raise HTTPException(status_code=400, detail="Código inválido o ya ha expirado")
+        
+    user = db.query(User).filter(User.email == body.email).first()
+    if not user:
+        raise HTTPException(status_code=400, detail="Usuario no encontrado")
+        
+    user.hashed_password = get_password_hash(body.new_password)
+    db.commit()
+    
+    reset_codes.pop(body.email, None)  # Invalidate token safely
+    return {"status": "ok", "message": "Contraseña actualizada exitosamente"}
+
+# Try to import Google Auth (if installed)
+try:
+    from google.oauth2 import id_token
+    from google.auth.transport import requests as google_requests
+    GOOGLE_AUTH_AVAILABLE = True
+except ImportError:
+    GOOGLE_AUTH_AVAILABLE = False
+
+@router.post("/google")
+def google_login(google_data: GoogleLogin, db: Session = Depends(get_db)):
+    if not GOOGLE_AUTH_AVAILABLE:
+        raise HTTPException(status_code=500, detail="Google Auth is not installed properly")
+        
+    try:
+        # Avoid verifying clientId to allow any client side requests for demo purposes
+        # In production use ONLY your registered CLIENT_ID
+        idinfo = id_token.verify_oauth2_token(
+            google_data.token, 
+            google_requests.Request()
+        )
+        
+        email = idinfo['email']
+        name = idinfo.get('name', 'Google User')
+        picture = idinfo.get('picture', '')
+        google_id = idinfo['sub']
+        
+        user = db.query(User).filter(or_(User.email == email, User.google_id == google_id)).first()
+        
+        if not user:
+            # Create user automatically
+            user = User(email=email, name=name, picture=picture, google_id=google_id)
+            db.add(user)
+            db.commit()
+            db.refresh(user)
+        else:
+            # Update user info if needed
+            if not user.google_id:
+                user.google_id = google_id
+            if picture:
+                user.picture = picture
+            db.commit()
+            
+        access_token = create_access_token(
+            data={"sub": user.email}, expires_delta=timedelta(minutes=ACCESS_TOKEN_EXPIRE_MINUTES)
+        )
+        return {"access_token": access_token, "token_type": "bearer", "user": {"name": user.name, "email": user.email, "picture": user.picture}}
+        
+    except ValueError as e:
+        raise HTTPException(status_code=400, detail="Token de Google inválido")
+
+@router.get("/me")
+def get_me(current_user: User = Depends(get_current_user)):
+    return {"name": current_user.name, "email": current_user.email, "picture": current_user.picture}
+
+@router.post("/me")
+def update_me(user_update: UserUpdate, current_user: User = Depends(get_current_user), db: Session = Depends(get_db)):
+    if user_update.name is not None:
+        current_user.name = user_update.name
+    if user_update.picture is not None:
+        current_user.picture = user_update.picture
+        
+    db.commit()
+    db.refresh(current_user)
+    return {"name": current_user.name, "email": current_user.email, "picture": current_user.picture}
+
+# ================= Conversations Router Endpoints =================
+conv_router = APIRouter(prefix="/api/conversations", tags=["conversations"])
+
+class ConversationBody(BaseModel):
+    id: str
+    title: str
+    messages: list
+
+@conv_router.get("")
+def list_conversations(current_user: User = Depends(get_current_user), db: Session = Depends(get_db)):
+    convs = db.query(Conversation).filter(Conversation.user_id == current_user.id).order_by(Conversation.updated_at.desc()).all()
+    # Format according to frontend expectations
+    return [{"id": c.id, "title": c.title, "messages": c.messages} for c in convs]
+
+@conv_router.post("")
+def save_conversation(data: ConversationBody, current_user: User = Depends(get_current_user), db: Session = Depends(get_db)):
+    conv = db.query(Conversation).filter(Conversation.id == data.id).first()
+    
+    if conv:
+        if conv.user_id != current_user.id:
+            raise HTTPException(status_code=403, detail="Not authorized")
+        conv.title = data.title
+        conv.messages = data.messages
+        # updated_at will auto-update
+    else:
+        conv = Conversation(
+            id=data.id,
+            user_id=current_user.id,
+            title=data.title,
+            messages=data.messages
+        )
+        db.add(conv)
+        
+    db.commit()
+    return {"status": "ok", "message": "Conversación guardada"}
+
+@conv_router.delete("/{conv_id}")
+def delete_conversation(conv_id: str, current_user: User = Depends(get_current_user), db: Session = Depends(get_db)):
+    conv = db.query(Conversation).filter(Conversation.id == conv_id).first()
+    if not conv:
+        raise HTTPException(status_code=404, detail="Not found")
+    if conv.user_id != current_user.id:
+        raise HTTPException(status_code=403, detail="Not authorized")
+        
+    db.delete(conv)
+    db.commit()
+    return {"status": "ok", "message": "Conversación eliminada"}

src/career_assistant.py

@@ -0,0 +1,330 @@
+"""
+Career Assistant - AI-powered career advisor using Groq + Llama 3.3 with specialized modes.
+"""
+from typing import List, Dict, Generator
+from langchain_groq import ChatGroq
+from langchain_core.messages import HumanMessage, SystemMessage, AIMessage
+
+
+class CareerAssistant:
+    """AI Career Assistant with specialized modes for job matching, cover letters, and skills analysis."""
+
+    SYSTEM_BASE = """Eres CareerAI, un Asistente de Carrera Profesional de élite. Eres experto en:
+- Análisis de CVs y perfiles profesionales
+- Matching de candidatos con ofertas de trabajo
+- Redacción de cover letters y cartas de presentación
+- Análisis de brechas de habilidades (skills gap)
+- Estrategia de carrera y desarrollo profesional
+
+REGLAS FUNDAMENTALES:
+1. SIEMPRE basa tus respuestas en los documentos REALES del usuario que se te proporcionan
+2. Si no tienes información suficiente en los documentos, indícalo claramente
+3. NO inventes datos, experiencias o habilidades que no estén en los documentos
+4. Sé específico, accionable y práctico en tus recomendaciones
+5. Responde en el MISMO IDIOMA que usa el usuario
+6. Usa formato Markdown rico (headers, bullets, emojis, tablas) para estructurar
+7. Sé honesto pero motivador - señala fortalezas Y áreas de mejora
+8. Cuando des porcentajes o métricas, explica tu razonamiento"""
+
+    PROMPTS = {
+        "general": """Eres CareerAI. Responde la pregunta del usuario sobre su carrera profesional.
+
+DOCUMENTOS DEL USUARIO:
+{context}
+
+Instrucciones:
+- Basa tu respuesta en los documentos proporcionados
+- Sé práctico y accionable
+- Si el usuario no ha subido documentos relevantes, sugiérele qué subir
+- Formato: Usa markdown con headers, bullets y emojis
+
+Pregunta del usuario: {query}""",
+
+        "job_match": """Eres CareerAI en modo ANÁLISIS DE COMPATIBILIDAD LABORAL.
+
+DOCUMENTOS DEL USUARIO (CV, perfil, ofertas de trabajo):
+{context}
+
+INSTRUCCIONES - Analiza la compatibilidad y genera un reporte detallado:
+
+## 1. 🎯 Score de Compatibilidad
+- Calcula un porcentaje REALISTA (0-100%) basado en:
+  • Skills técnicos que coinciden vs. requeridos
+  • Años de experiencia relevante
+  • Nivel de seniority (Junior/Mid/Senior/Lead)
+  • Requisitos específicos (idiomas, certificaciones, ubicación)
+  • Soft skills mencionados
+
+## 2. ✅ Lo que SÍ tiene el candidato
+- Lista cada skill/requisito que el candidato cumple
+- Referencia dónde aparece en su CV
+
+## 3. ❌ Lo que le FALTA
+- Lista cada gap identificado
+- Clasifica por importancia (Crítico / Importante / Nice-to-have)
+
+## 4. 💡 Recomendaciones
+- Cómo cubrir cada gap en orden de prioridad
+- Recursos gratuitos específicos para aprender
+- Timeframe estimado
+
+## 5. 📊 Resumen Ejecutivo
+- Veredicto: ¿Debería aplicar? ¿Con qué estrategia?
+
+Pregunta del usuario: {query}""",
+
+        "cover_letter": """Eres CareerAI en modo GENERADOR DE COVER LETTERS.
+
+DOCUMENTOS DEL USUARIO (CV, perfil, oferta de trabajo):
+{context}
+
+INSTRUCCIONES - Genera una cover letter profesional y personalizada:
+
+1. **Usa datos REALES** del CV/perfil del usuario (nombre, experiencia, logros)
+2. **Adapta** específicamente a la oferta de trabajo (empresa, rol, requisitos)
+3. **Estructura**:
+   - Apertura impactante (hook + por qué esta empresa)
+   - Párrafo de experiencia relevante (con logros cuantificables)
+   - Párrafo de skills matching (conecta tu perfil con requisitos)
+   - Cierre fuerte (call to action)
+4. **Tono**: Profesional pero auténtico, no genérico
+5. **Longitud**: 3-4 párrafos (250-400 palabras)
+6. **Idioma**: Genera en el idioma de la oferta de trabajo
+7. **Formato**: Cover letter lista para copiar y pegar
+
+Después de la carta, incluye:
+- 💡 Tips para personalizar aún más
+- 📧 Sugerencia de subject line para email
+- ⚠️ Cosas a verificar antes de enviar
+
+Solicitud del usuario: {query}""",
+
+        "skills_gap": """Eres CareerAI en modo ANÁLISIS DE BRECHA DE HABILIDADES.
+
+DOCUMENTOS DEL USUARIO:
+{context}
+
+INSTRUCCIONES - Realiza un análisis profundo de skills:
+
+## 1. 📋 Inventario de Skills Actuales
+Extrae TODAS las habilidades del usuario de sus documentos:
+- 💻 Hard Skills / Técnicos
+- 🧠 Soft Skills
+- 🛠️ Herramientas y Tecnologías
+- 🌍 Idiomas
+- 🎓 Certificaciones
+
+## 2. 📍 Nivel Actual Estimado
+- Junior / Mid-Level / Senior / Lead / Principal
+- Justifica tu evaluación con evidencia de los documentos
+
+## 3. 🚀 Roadmap al Siguiente Nivel
+Para cada categoría, indica:
+
+| Skill Necesario | Prioridad | Recurso Gratuito Recomendado | Tiempo Estimado |
+|----------------|-----------|------------------------------|-----------------|
+
+## 4. 📈 Plan de Acción (90 días)
+- Semana 1-2: Quick wins
+- Semana 3-6: Skills prioritarios
+- Semana 7-12: Profundización y proyectos
+
+## 5. 🎯 Skills más Demandados en el Mercado
+- Basado en el perfil del usuario, qué skills tienen más demanda
+
+Pregunta del usuario: {query}""",
+
+        "interview": """Eres CareerAI en modo SIMULADOR DE ENTREVISTAS LABORALES.
+
+DOCUMENTOS DEL USUARIO (CV, perfil, ofertas de trabajo):
+{context}
+
+INSTRUCCIONES - Actúa como un entrevistador profesional experto:
+
+## Tu rol:
+Eres un entrevistador senior que está evaluando al candidato para el puesto.
+Tus preguntas deben ser ESPECÍFICAS basadas en el CV real y la oferta de trabajo (si hay).
+
+## Cómo funciona la simulación:
+
+### Si el usuario dice "empezar entrevista" o "simular entrevista":
+Genera una sesión de entrevista estructurada con:
+
+## 🎤 Simulación de Entrevista
+
+### 👋 Introducción
+- Preséntate como entrevistador (inventa un nombre y empresa basado en la oferta)
+- Rompe el hielo con una pregunta ligera
+
+### 📋 Fase 1: Preguntas de Comportamiento (STAR Method)
+Genera 3-4 preguntas basadas en la experiencia del CV:
+- Usa el método STAR (Situación, Tarea, Acción, Resultado)
+- Referencia experiencias específicas del CV
+- Ejemplos: "Cuéntame sobre un proyecto donde tuviste que..."
+
+### 💻 Fase 2: Preguntas Técnicas
+Genera 3-4 preguntas técnicas relevantes:
+- Basadas en los skills del CV y requisitos de la oferta
+- Variedad: conceptuales, de diseño, y prácticas
+- Adaptadas al nivel del candidato (junior/mid/senior)
+
+### 🧠 Fase 3: Preguntas Situacionales
+Genera 2-3 preguntas hipotéticas:
+- "¿Qué harías si...?"
+- Basadas en desafíos reales del puesto
+
+### ❓ Fase 4: Preguntas del Candidato
+- "¿Tenés preguntas para nosotros?"
+- Sugiere 3 preguntas inteligentes que el candidato podría hacer
+
+Para CADA pregunta incluye:
+- 💡 **Tip**: Qué busca el entrevistador con esta pregunta
+- ✅ **Respuesta ideal**: Framework o puntos clave que debería mencionar
+- ⚠️ **Red flags**: Qué NO decir
+
+### Si el usuario RESPONDE una pregunta de entrevista:
+- Evalúa su respuesta (fortalezas y debilidades)
+- Da feedback constructivo y específico
+- Sugiere cómo mejorar la respuesta
+- Después hace la SIGUIENTE pregunta
+
+Solicitud del usuario: {query}""",
+    }
+
+    AVAILABLE_MODELS = [
+        "llama-3.3-70b-versatile",
+        "llama-3.1-8b-instant",
+        "mixtral-8x7b-32768",
+        "gemma2-9b-it",
+    ]
+
+    def __init__(self, api_key: str, model: str = "llama-3.3-70b-versatile"):
+        """Initialize the career assistant with Groq API."""
+        self.api_key = api_key
+        self.model = model
+        self.llm = ChatGroq(
+            groq_api_key=api_key,
+            model_name=model,
+            temperature=0.3,
+            max_tokens=4096,
+        )
+
+    def _build_messages(
+        self,
+        system_prompt: str,
+        query: str,
+        chat_history: List[Dict] = None,
+    ) -> list:
+        """Build the message list for the LLM."""
+        messages = [SystemMessage(content=system_prompt)]
+
+        # Include recent chat history for context continuity
+        if chat_history:
+            for msg in chat_history[-8:]:  # Last 8 messages
+                if msg["role"] == "user":
+                    messages.append(HumanMessage(content=msg["content"]))
+                elif msg["role"] == "assistant":
+                    # Truncate long assistant messages in history
+                    content = msg["content"]
+                    if len(content) > 1000:
+                        content = content[:1000] + "\n... [respuesta anterior truncada]"
+                    messages.append(AIMessage(content=content))
+
+        messages.append(HumanMessage(content=query))
+        return messages
+
+    def chat(
+        self,
+        query: str,
+        context: str,
+        chat_history: List[Dict] = None,
+        mode: str = "general",
+    ) -> str:
+        """Process a query and return a complete response."""
+        template = self.PROMPTS.get(mode, self.PROMPTS["general"])
+        system_prompt = self.SYSTEM_BASE + "\n\n" + template.format(
+            context=context, query=query
+        )
+
+        messages = self._build_messages(system_prompt, query, chat_history)
+
+        try:
+            response = self.llm.invoke(messages)
+            return response.content
+        except Exception as e:
+            error_msg = str(e)
+            if "rate_limit" in error_msg.lower():
+                return "⏳ **Límite de velocidad alcanzado.** Espera unos segundos e intenta de nuevo. Groq tiene un límite generoso pero puede saturarse con consultas muy seguidas."
+            elif "authentication" in error_msg.lower() or "api_key" in error_msg.lower():
+                return "🔑 **Error de autenticación.** Verifica tu API key de Groq. Puedes obtener una gratis en [console.groq.com](https://console.groq.com)"
+            else:
+                return f"❌ **Error al procesar tu consulta:**\n\n`{error_msg}`\n\nVerifica tu API key y conexión a internet."
+
+    def stream_chat(
+        self,
+        query: str,
+        context: str,
+        chat_history: List[Dict] = None,
+        mode: str = "general",
+    ) -> Generator[str, None, None]:
+        """Stream a response token by token for real-time display."""
+        template = self.PROMPTS.get(mode, self.PROMPTS["general"])
+        system_prompt = self.SYSTEM_BASE + "\n\n" + template.format(
+            context=context, query=query
+        )
+
+        messages = self._build_messages(system_prompt, query, chat_history)
+
+        try:
+            for chunk in self.llm.stream(messages):
+                if chunk.content:
+                    yield chunk.content
+        except Exception as e:
+            error_msg = str(e)
+            if "rate_limit" in error_msg.lower():
+                yield "\n\n⏳ **Límite de velocidad alcanzado.** Espera unos segundos e intenta de nuevo."
+            elif "authentication" in error_msg.lower():
+                yield "\n\n🔑 **Error de autenticación.** Verifica tu API key de Groq."
+            else:
+                yield f"\n\n❌ **Error:** `{error_msg}`"
+
+    def detect_mode(self, query: str) -> str:
+        """Auto-detect the best mode based on the user's query."""
+        query_lower = query.lower()
+
+        interview_keywords = [
+            "entrevista", "interview", "simula", "pregunta",
+            "practica", "preparar entrevista", "mock interview",
+            "entrevistar", "preguntas técnicas", "behavioral",
+        ]
+        job_keywords = [
+            "match", "compatib", "oferta", "job", "vacante", "posición",
+            "requisito", "aplica", "pegan", "encaj", "cumplo",
+        ]
+        cover_keywords = [
+            "cover letter", "carta", "presentación", "letter",
+            "aplicar", "postular", "escribir carta", "redacta",
+        ]
+        skills_keywords = [
+            "skill", "habilidad", "faltan", "gap", "senior",
+            "mejorar", "aprender", "certificac", "nivel",
+            "roadmap", "plan", "desarrollo",
+        ]
+
+        for kw in interview_keywords:
+            if kw in query_lower:
+                return "interview"
+
+        for kw in cover_keywords:
+            if kw in query_lower:
+                return "cover_letter"
+
+        for kw in job_keywords:
+            if kw in query_lower:
+                return "job_match"
+
+        for kw in skills_keywords:
+            if kw in query_lower:
+                return "skills_gap"
+
+        return "general"

src/document_processor.py

@@ -0,0 +1,383 @@
+"""
+Document Processor - Extracts text from PDF, DOCX, TXT, and IMAGES (via Groq Vision).
+Supports scanned PDFs and photos of documents.
+"""
+import os
+import base64
+from typing import List
+
+
+class DocumentProcessor:
+    """Process various document formats and extract text for RAG indexing."""
+
+    SUPPORTED_FORMATS = [".pdf", ".txt", ".docx", ".doc", ".jpg", ".jpeg", ".png", ".webp"]
+    IMAGE_FORMATS = [".jpg", ".jpeg", ".png", ".webp", ".gif", ".bmp"]
+
+    @staticmethod
+    def extract_text(file_path: str, groq_api_key: str = None) -> str:
+        """Extract text from a file based on its extension.
+        For images and scanned PDFs, uses Groq Vision API.
+        """
+        ext = os.path.splitext(file_path)[1].lower()
+
+        if ext in DocumentProcessor.IMAGE_FORMATS:
+            if not groq_api_key:
+                raise ValueError("Se necesita API key de Groq para procesar imágenes")
+            return DocumentProcessor._extract_image(file_path, groq_api_key)
+        elif ext == ".pdf":
+            return DocumentProcessor._extract_pdf(file_path, groq_api_key)
+        elif ext == ".txt":
+            return DocumentProcessor._extract_txt(file_path)
+        elif ext in [".docx", ".doc"]:
+            return DocumentProcessor._extract_docx(file_path)
+        else:
+            raise ValueError(f"Formato no soportado: {ext}")
+
+    @staticmethod
+    def _extract_image(file_path: str, groq_api_key: str) -> str:
+        """Extract text from an image using Groq Vision (Llama 4 Scout)."""
+        try:
+            from groq import Groq
+
+            # Read and encode image
+            with open(file_path, "rb") as f:
+                image_data = f.read()
+
+            base64_image = base64.b64encode(image_data).decode("utf-8")
+
+            # Detect MIME type
+            ext = os.path.splitext(file_path)[1].lower()
+            mime_map = {
+                ".jpg": "image/jpeg",
+                ".jpeg": "image/jpeg",
+                ".png": "image/png",
+                ".webp": "image/webp",
+                ".gif": "image/gif",
+                ".bmp": "image/bmp",
+            }
+            mime_type = mime_map.get(ext, "image/jpeg")
+
+            # Call Groq Vision API
+            client = Groq(api_key=groq_api_key)
+            response = client.chat.completions.create(
+                model="meta-llama/llama-4-scout-17b-16e-instruct",
+                messages=[
+                    {
+                        "role": "user",
+                        "content": [
+                            {
+                                "type": "text",
+                                "text": (
+                                    "Extraé TODO el texto de esta imagen de documento exactamente como aparece. "
+                                    "Incluí todos los detalles: nombres, fechas, experiencia laboral, educación, "
+                                    "habilidades, idiomas, certificaciones, datos de contacto, y cualquier otra "
+                                    "información. Mantené la estructura original. Si hay tablas, extraé el contenido. "
+                                    "Respondé SOLO con el texto extraído, sin comentarios adicionales."
+                                ),
+                            },
+                            {
+                                "type": "image_url",
+                                "image_url": {
+                                    "url": f"data:{mime_type};base64,{base64_image}"
+                                },
+                            },
+                        ],
+                    }
+                ],
+                max_tokens=4096,
+                temperature=0.1,
+            )
+
+            text = response.choices[0].message.content
+            if text and text.strip():
+                return text.strip()
+            else:
+                raise ValueError("No se pudo extraer texto de la imagen")
+
+        except ImportError:
+            raise ValueError("Instala el paquete 'groq': pip install groq")
+        except Exception as e:
+            if "groq" in str(type(e).__module__).lower():
+                raise ValueError(f"Error de Groq Vision API: {e}")
+            raise ValueError(f"Error procesando imagen: {e}")
+
+    @staticmethod
+    def _extract_pdf(file_path: str, groq_api_key: str = None) -> str:
+        """Extract text from PDF. Tries 3 methods + Vision API for scanned PDFs."""
+        text = ""
+
+        # Method 1: PyPDF (fast, works with text PDFs)
+        try:
+            from pypdf import PdfReader
+
+            reader = PdfReader(file_path)
+            for page in reader.pages:
+                page_text = page.extract_text()
+                if page_text:
+                    text += page_text + "\n"
+            if text.strip() and len(text.strip()) > 50:
+                return text.strip()
+        except Exception:
+            pass
+
+        # Method 2: pdfplumber (better with complex layouts)
+        try:
+            import pdfplumber
+
+            text = ""
+            with pdfplumber.open(file_path) as pdf:
+                for page in pdf.pages:
+                    page_text = page.extract_text()
+                    if page_text:
+                        text += page_text + "\n"
+
+                    # Also try extracting tables
+                    try:
+                        tables = page.extract_tables()
+                        for table in tables:
+                            for row in table:
+                                if row:
+                                    row_text = " | ".join(
+                                        str(cell).strip() for cell in row if cell
+                                    )
+                                    if row_text:
+                                        text += row_text + "\n"
+                    except Exception:
+                        pass
+
+            if text.strip() and len(text.strip()) > 50:
+                return text.strip()
+        except Exception:
+            pass
+
+        # Method 3: PyMuPDF / fitz (handles more PDF types)
+        try:
+            import fitz
+
+            doc = fitz.open(file_path)
+            fitz_text = ""
+            for page in doc:
+                page_text = page.get_text()
+                if page_text:
+                    fitz_text += page_text + "\n"
+            doc.close()
+
+            if fitz_text.strip() and len(fitz_text.strip()) > 50:
+                return fitz_text.strip()
+        except Exception:
+            pass
+
+        # Method 4: Vision AI - render PDF pages as images and read with Llama Vision
+        if groq_api_key:
+            try:
+                return DocumentProcessor._extract_pdf_via_vision(
+                    file_path, groq_api_key
+                )
+            except Exception as vision_err:
+                # If vision also fails, give detailed error
+                pass
+
+        # Last resort
+        if text.strip():
+            return text.strip()
+
+        raise ValueError(
+            "No se pudo extraer texto del PDF. "
+            "Puede ser un PDF escaneado. Intenta subir una imagen/captura del documento."
+        )
+
+    @staticmethod
+    def _extract_pdf_via_vision(file_path: str, groq_api_key: str) -> str:
+        """Extract text from a scanned PDF by converting pages to images and using Vision."""
+        try:
+            # Try using fitz (PyMuPDF) to convert PDF pages to images
+            import fitz  # PyMuPDF
+
+            doc = fitz.open(file_path)
+            all_text = []
+
+            for page_num in range(min(len(doc), 5)):  # Max 5 pages
+                page = doc[page_num]
+                # Render page as image
+                mat = fitz.Matrix(2, 2)  # 2x zoom for better quality
+                pix = page.get_pixmap(matrix=mat)
+                img_bytes = pix.tobytes("png")
+
+                # Use Vision API
+                base64_image = base64.b64encode(img_bytes).decode("utf-8")
+
+                from groq import Groq
+
+                client = Groq(api_key=groq_api_key)
+                response = client.chat.completions.create(
+                    model="meta-llama/llama-4-scout-17b-16e-instruct",
+                    messages=[
+                        {
+                            "role": "user",
+                            "content": [
+                                {
+                                    "type": "text",
+                                    "text": (
+                                        f"Página {page_num + 1}. Extraé TODO el texto de esta página "
+                                        "exactamente como aparece. Incluí todos los detalles. "
+                                        "Respondé SOLO con el texto extraído."
+                                    ),
+                                },
+                                {
+                                    "type": "image_url",
+                                    "image_url": {
+                                        "url": f"data:image/png;base64,{base64_image}"
+                                    },
+                                },
+                            ],
+                        }
+                    ],
+                    max_tokens=4096,
+                    temperature=0.1,
+                )
+
+                page_text = response.choices[0].message.content
+                if page_text and page_text.strip():
+                    all_text.append(page_text.strip())
+
+            doc.close()
+
+            if all_text:
+                return "\n\n".join(all_text)
+
+        except ImportError:
+            # PyMuPDF not installed, try converting via PIL
+            pass
+        except Exception:
+            pass
+
+        # If PyMuPDF conversion failed, try reading the raw PDF as image
+        # (some PDFs are essentially single-page images)
+        try:
+            with open(file_path, "rb") as f:
+                pdf_bytes = f.read()
+            base64_pdf = base64.b64encode(pdf_bytes).decode("utf-8")
+
+            from groq import Groq
+
+            client = Groq(api_key=groq_api_key)
+            response = client.chat.completions.create(
+                model="meta-llama/llama-4-scout-17b-16e-instruct",
+                messages=[
+                    {
+                        "role": "user",
+                        "content": [
+                            {
+                                "type": "text",
+                                "text": (
+                                    "Extraé TODO el texto de este documento. "
+                                    "Incluí nombres, fechas, experiencia, skills. "
+                                    "Respondé SOLO con el texto extraído."
+                                ),
+                            },
+                            {
+                                "type": "image_url",
+                                "image_url": {
+                                    "url": f"data:application/pdf;base64,{base64_pdf}"
+                                },
+                            },
+                        ],
+                    }
+                ],
+                max_tokens=4096,
+                temperature=0.1,
+            )
+            text = response.choices[0].message.content
+            if text and text.strip():
+                return text.strip()
+        except Exception:
+            pass
+
+        raise ValueError("No se pudo extraer texto del PDF escaneado")
+
+    @staticmethod
+    def _extract_txt(file_path: str) -> str:
+        """Extract text from a plain text file."""
+        encodings = ["utf-8", "latin-1", "cp1252"]
+        for encoding in encodings:
+            try:
+                with open(file_path, "r", encoding=encoding) as f:
+                    return f.read().strip()
+            except (UnicodeDecodeError, UnicodeError):
+                continue
+        raise ValueError("No se pudo leer el archivo de texto")
+
+    @staticmethod
+    def _extract_docx(file_path: str) -> str:
+        """Extract text from a Word document."""
+        try:
+            from docx import Document
+
+            doc = Document(file_path)
+            paragraphs = []
+            for para in doc.paragraphs:
+                if para.text.strip():
+                    paragraphs.append(para.text.strip())
+
+            # Also extract from tables
+            for table in doc.tables:
+                for row in table.rows:
+                    row_text = " | ".join(
+                        cell.text.strip() for cell in row.cells if cell.text.strip()
+                    )
+                    if row_text:
+                        paragraphs.append(row_text)
+
+            return "\n".join(paragraphs)
+        except Exception as e:
+            raise ValueError(f"No se pudo leer el archivo DOCX: {e}")
+
+    @staticmethod
+    def chunk_text(
+        text: str, chunk_size: int = 400, overlap: int = 80
+    ) -> List[str]:
+        """Split text into overlapping chunks for embedding."""
+        if not text or not text.strip():
+            return []
+
+        paragraphs = [p.strip() for p in text.split("\n") if p.strip()]
+        full_text = "\n".join(paragraphs)
+        words = full_text.split()
+
+        if len(words) <= chunk_size:
+            return [full_text]
+
+        chunks = []
+        start = 0
+
+        while start < len(words):
+            end = min(start + chunk_size, len(words))
+            chunk = " ".join(words[start:end])
+            if chunk.strip():
+                chunks.append(chunk.strip())
+
+            if end >= len(words):
+                break
+
+            start += chunk_size - overlap
+
+        return chunks
+
+    @staticmethod
+    def extract_key_info(text: str) -> dict:
+        """Extract basic key information from document text."""
+        info = {
+            "has_email": False,
+            "has_phone": False,
+            "word_count": len(text.split()),
+            "line_count": len(text.split("\n")),
+        }
+
+        import re
+
+        if re.search(r"[\w.+-]+@[\w-]+\.[\w.-]+", text):
+            info["has_email"] = True
+        if re.search(r"[\+]?[\d\s\-\(\)]{7,15}", text):
+            info["has_phone"] = True
+
+        return info

src/exporter.py

@@ -0,0 +1,1171 @@
+"""
+Export Module - Generate PDF, DOCX, TXT, and HTML downloads from AI responses.
+Premium formatting with professional layouts and smart content detection.
+"""
+import io
+import re
+from datetime import datetime
+from typing import List, Dict, Optional
+
+
+# ======================== TEXT CLEANING ========================
+
+def clean_markdown(text: str) -> str:
+    """Remove markdown formatting for clean document export."""
+    # Remove bold/italic markers
+    text = re.sub(r'\*\*(.+?)\*\*', r'\1', text)
+    text = re.sub(r'\*(.+?)\*', r'\1', text)
+    text = re.sub(r'__(.+?)__', r'\1', text)
+    text = re.sub(r'_(.+?)_', r'\1', text)
+    # Remove headers markers but keep text
+    text = re.sub(r'^#{1,6}\s+', '', text, flags=re.MULTILINE)
+    # Remove bullet markers
+    text = re.sub(r'^[\-\*]\s+', '- ', text, flags=re.MULTILINE)
+    # Remove numbered lists prefix (keep number)
+    text = re.sub(r'^(\d+)\.\s+', r'\1. ', text, flags=re.MULTILINE)
+    # Remove code blocks markers
+    text = re.sub(r'```[\w]*\n?', '', text)
+    # Remove inline code
+    text = re.sub(r'`(.+?)`', r'\1', text)
+    # Remove links but keep text
+    text = re.sub(r'\[(.+?)\]\(.+?\)', r'\1', text)
+    # Remove emojis (common ones)
+    text = re.sub(
+        r'[🎯✉️📈🧠💡🚀⭐📋🔍💼📊✅❌⚠️🎓🗺️📄🤖👋💬📎📷📚📭🎨🔥💪🏆🌟✨🎉💰📌🔑⚡🛠️🏁📐💎🥇🥈🥉]',
+        '', text
+    )
+    # Clean up extra whitespace
+    text = re.sub(r'\n{3,}', '\n\n', text)
+    return text.strip()
+
+
+def detect_content_type(text: str) -> str:
+    """Detect the type of content for smart file naming."""
+    text_lower = text.lower()
+    if any(w in text_lower for w in ['cover letter', 'carta de presentación', 'carta de motivación', 'estimado', 'dear']):
+        return "cover_letter"
+    if any(w in text_lower for w in ['match', 'compatibilidad', 'porcentaje', 'afinidad', '% de match']):
+        return "job_match"
+    if any(w in text_lower for w in ['skills gap', 'habilidades faltantes', 'roadmap', 'skill gap', 'brecha']):
+        return "skills_analysis"
+    if any(w in text_lower for w in ['resumen', 'perfil profesional', 'summary', 'strengths']):
+        return "profile_summary"
+    return "response"
+
+
+def get_smart_filename(text: str, extension: str) -> str:
+    """Generate an intelligent filename based on content type."""
+    content_type = detect_content_type(text)
+    timestamp = datetime.now().strftime("%Y%m%d_%H%M")
+    
+    type_names = {
+        "cover_letter": "CoverLetter",
+        "job_match": "JobMatch",
+        "skills_analysis": "SkillsAnalysis",
+        "profile_summary": "ProfileSummary",
+        "response": "CareerAI",
+    }
+    
+    name = type_names.get(content_type, "CareerAI")
+    return f"{name}_{timestamp}.{extension}"
+
+
+def get_smart_title(text: str) -> str:
+    """Generate a smart document title based on content."""
+    content_type = detect_content_type(text)
+    titles = {
+        "cover_letter": "Carta de Presentación",
+        "job_match": "Análisis de Compatibilidad",
+        "skills_analysis": "Análisis de Habilidades",
+        "profile_summary": "Resumen de Perfil",
+        "response": "Respuesta CareerAI",
+    }
+    return titles.get(content_type, "Respuesta CareerAI")
+
+
+# ======================== MARKDOWN PARSER ========================
+
+def parse_markdown_blocks(text: str) -> list:
+    """
+    Parse markdown into structured blocks for rich document rendering.
+    Returns list of dicts: {type, content, level}
+    """
+    blocks = []
+    lines = text.split('\n')
+    i = 0
+    
+    while i < len(lines):
+        line = lines[i]
+        
+        # Headers
+        header_match = re.match(r'^(#{1,6})\s+(.+)', line)
+        if header_match:
+            level = len(header_match.group(1))
+            blocks.append({
+                'type': 'header',
+                'content': header_match.group(2).strip(),
+                'level': level
+            })
+            i += 1
+            continue
+        
+        # Horizontal rules
+        if re.match(r'^[\-\*\_]{3,}\s*$', line):
+            blocks.append({'type': 'hr', 'content': '', 'level': 0})
+            i += 1
+            continue
+        
+        # Bullet lists
+        bullet_match = re.match(r'^[\-\*]\s+(.+)', line)
+        if bullet_match:
+            items = [bullet_match.group(1).strip()]
+            i += 1
+            while i < len(lines):
+                next_bullet = re.match(r'^[\-\*]\s+(.+)', lines[i])
+                if next_bullet:
+                    items.append(next_bullet.group(1).strip())
+                    i += 1
+                else:
+                    break
+            blocks.append({'type': 'bullet_list', 'content': items, 'level': 0})
+            continue
+        
+        # Numbered lists
+        num_match = re.match(r'^(\d+)\.\s+(.+)', line)
+        if num_match:
+            items = [num_match.group(2).strip()]
+            i += 1
+            while i < len(lines):
+                next_num = re.match(r'^\d+\.\s+(.+)', lines[i])
+                if next_num:
+                    items.append(next_num.group(1).strip())
+                    i += 1
+                else:
+                    break
+            blocks.append({'type': 'numbered_list', 'content': items, 'level': 0})
+            continue
+        
+        # Code blocks
+        if line.strip().startswith('```'):
+            lang = line.strip()[3:]
+            code_lines = []
+            i += 1
+            while i < len(lines) and not lines[i].strip().startswith('```'):
+                code_lines.append(lines[i])
+                i += 1
+            if i < len(lines):
+                i += 1  # skip closing ```
+            blocks.append({
+                'type': 'code',
+                'content': '\n'.join(code_lines),
+                'level': 0,
+                'lang': lang
+            })
+            continue
+        
+        # Bold/emphasis lines (like "**Sección:**")
+        bold_match = re.match(r'^\*\*(.+?)\*\*:?\s*$', line.strip())
+        if bold_match:
+            blocks.append({
+                'type': 'bold_heading',
+                'content': bold_match.group(1).strip(),
+                'level': 0
+            })
+            i += 1
+            continue
+        
+        # Empty lines
+        if not line.strip():
+            i += 1
+            continue
+        
+        # Regular paragraph (collect consecutive lines)
+        para_lines = [line]
+        i += 1
+        while i < len(lines) and lines[i].strip() and not re.match(r'^#{1,6}\s+', lines[i]) \
+                and not re.match(r'^[\-\*]\s+', lines[i]) and not re.match(r'^\d+\.\s+', lines[i]) \
+                and not lines[i].strip().startswith('```') and not re.match(r'^\*\*(.+?)\*\*:?\s*$', lines[i].strip()):
+            para_lines.append(lines[i])
+            i += 1
+        
+        blocks.append({
+            'type': 'paragraph',
+            'content': ' '.join(para_lines),
+            'level': 0
+        })
+    
+    return blocks
+
+
+def strip_inline_md(text: str) -> str:
+    """Remove inline markdown (bold, italic, code, links) from text."""
+    text = re.sub(r'\*\*(.+?)\*\*', r'\1', text)
+    text = re.sub(r'\*(.+?)\*', r'\1', text)
+    text = re.sub(r'__(.+?)__', r'\1', text)
+    text = re.sub(r'_(.+?)_', r'\1', text)
+    text = re.sub(r'`(.+?)`', r'\1', text)
+    text = re.sub(r'\[(.+?)\]\(.+?\)', r'\1', text)
+    return text
+
+
+def _sanitize_for_pdf(text: str) -> str:
+    """Replace Unicode characters with ASCII equivalents for PDF Helvetica font."""
+    replacements = {
+        '\u2022': '-',
+        '\u2013': '-',
+        '\u2014': '--',
+        '\u2018': "'",
+        '\u2019': "'",
+        '\u201c': '"',
+        '\u201d': '"',
+        '\u2026': '...',
+        '\u2192': '->',
+        '\u2190': '<-',
+        '\u00b7': '-',
+        '\u2500': '-',
+        '\u2501': '-',
+        '\u25cf': '-',
+        '\u2605': '*',
+        '\u2713': 'v',
+        '\u2717': 'x',
+    }
+    for char, replacement in replacements.items():
+        text = text.replace(char, replacement)
+    text = re.sub(
+        r'[\U0001F300-\U0001F9FF\U00002702-\U000027B0\U0000FE00-\U0000FE0F\U0001FA00-\U0001FA6F\U0001FA70-\U0001FAFF]',
+        '', text
+    )
+    return text
+
+
+# ======================== PDF EXPORT ========================
+
+def export_to_pdf(text: str, title: Optional[str] = None) -> bytes:
+    """Export text content to a premium-styled PDF."""
+    try:
+        from fpdf import FPDF
+    except ImportError:
+        raise ValueError("Instala fpdf2: pip install fpdf2")
+
+    if title is None:
+        title = get_smart_title(text)
+
+    pdf = FPDF()
+    pdf.set_auto_page_break(auto=True, margin=25)
+    pdf.add_page()
+    
+    page_width = pdf.w - 40  # margins
+
+    # ---- Header Band ----
+    pdf.set_fill_color(88, 60, 200)
+    pdf.rect(0, 0, 210, 3, 'F')
+
+    # ---- Title ----
+    pdf.set_y(15)
+    pdf.set_font("Helvetica", "B", 20)
+    pdf.set_text_color(88, 60, 200)
+    pdf.cell(0, 12, title, new_x="LMARGIN", new_y="NEXT", align="C")
+    pdf.ln(1)
+
+    # ---- Subtitle / Date ----
+    pdf.set_font("Helvetica", "", 9)
+    pdf.set_text_color(140, 140, 150)
+    date_str = datetime.now().strftime("%d de %B, %Y | %H:%M")
+    pdf.cell(0, 6, f"Generado el {date_str}", new_x="LMARGIN", new_y="NEXT", align="C")
+    pdf.ln(2)
+
+    # ---- Divider ----
+    y = pdf.get_y()
+    pdf.set_draw_color(200, 200, 215)
+    pdf.set_line_width(0.3)
+    # Gradient-like effect with multiple lines
+    pdf.set_draw_color(88, 60, 200)
+    pdf.line(70, y, 140, y)
+    pdf.set_draw_color(200, 200, 215)
+    pdf.line(40, y + 0.5, 170, y + 0.5)
+    pdf.ln(10)
+
+    # ---- Content Blocks ----
+    blocks = parse_markdown_blocks(text)
+
+    for block in blocks:
+        btype = block['type']
+
+        if btype == 'header':
+            level = block['level']
+            content = _sanitize_for_pdf(strip_inline_md(block['content']))
+            pdf.ln(4)
+            
+            if level == 1:
+                pdf.set_font("Helvetica", "B", 16)
+                pdf.set_text_color(30, 30, 45)
+            elif level == 2:
+                pdf.set_font("Helvetica", "B", 14)
+                pdf.set_text_color(88, 60, 200)
+            elif level == 3:
+                pdf.set_font("Helvetica", "B", 12)
+                pdf.set_text_color(60, 60, 80)
+            else:
+                pdf.set_font("Helvetica", "B", 11)
+                pdf.set_text_color(80, 80, 100)
+            
+            pdf.multi_cell(0, 7, content)
+            pdf.ln(2)
+
+        elif btype == 'bold_heading':
+            content = _sanitize_for_pdf(strip_inline_md(block['content']))
+            pdf.ln(3)
+            pdf.set_font("Helvetica", "B", 12)
+            pdf.set_text_color(88, 60, 200)
+            pdf.multi_cell(0, 7, content)
+            pdf.set_text_color(30, 30, 45)
+            pdf.ln(1)
+
+        elif btype == 'paragraph':
+            content = _sanitize_for_pdf(strip_inline_md(block['content']))
+            pdf.set_font("Helvetica", "", 10.5)
+            pdf.set_text_color(40, 40, 50)
+            pdf.multi_cell(0, 5.5, content)
+            pdf.ln(3)
+
+        elif btype == 'bullet_list':
+            for item in block['content']:
+                item_clean = _sanitize_for_pdf(strip_inline_md(item))
+                pdf.set_font("Helvetica", "", 10.5)
+                pdf.set_text_color(88, 60, 200)
+                pdf.cell(8, 5.5, "-")
+                pdf.set_text_color(40, 40, 50)
+                pdf.multi_cell(0, 5.5, f" {item_clean}")
+                pdf.ln(1)
+            pdf.ln(2)
+
+        elif btype == 'numbered_list':
+            for idx, item in enumerate(block['content'], 1):
+                item_clean = _sanitize_for_pdf(strip_inline_md(item))
+                pdf.set_font("Helvetica", "B", 10.5)
+                pdf.set_text_color(88, 60, 200)
+                pdf.cell(10, 5.5, f"{idx}.")
+                pdf.set_font("Helvetica", "", 10.5)
+                pdf.set_text_color(40, 40, 50)
+                pdf.multi_cell(0, 5.5, f" {item_clean}")
+                pdf.ln(1)
+            pdf.ln(2)
+
+        elif btype == 'code':
+            pdf.ln(2)
+            # Code block background
+            pdf.set_fill_color(245, 245, 248)
+            pdf.set_font("Courier", "", 9)
+            pdf.set_text_color(60, 60, 80)
+            code_lines = block['content'].split('\n')
+            for cl in code_lines:
+                pdf.cell(0, 5, f"  {cl}", new_x="LMARGIN", new_y="NEXT", fill=True)
+            pdf.ln(3)
+
+        elif btype == 'hr':
+            pdf.ln(3)
+            y = pdf.get_y()
+            pdf.set_draw_color(200, 200, 215)
+            pdf.line(20, y, 190, y)
+            pdf.ln(5)
+
+    # ---- Footer ----
+    pdf.ln(10)
+    y = pdf.get_y()
+    pdf.set_draw_color(88, 60, 200)
+    pdf.line(60, y, 150, y)
+    pdf.ln(6)
+    pdf.set_font("Helvetica", "I", 8)
+    pdf.set_text_color(160, 160, 175)
+    pdf.cell(0, 5, "Generado por CareerAI - Asistente de Carrera con IA", align="C")
+    pdf.ln(4)
+    pdf.set_font("Helvetica", "", 7)
+    pdf.cell(0, 4, "Powered by RAG + Llama 3.3 + ChromaDB", align="C")
+
+    # Bottom band
+    pdf.set_fill_color(88, 60, 200)
+    pdf.rect(0, 294, 210, 3, 'F')
+
+    return pdf.output()
+
+
+# ======================== DOCX EXPORT ========================
+
+def export_to_docx(text: str, title: Optional[str] = None) -> bytes:
+    """Export text content to a professionally styled DOCX."""
+    try:
+        from docx import Document
+        from docx.shared import Pt, RGBColor, Inches, Cm
+        from docx.enum.text import WD_ALIGN_PARAGRAPH
+        from docx.oxml.ns import qn
+        from docx.oxml import OxmlElement
+    except ImportError:
+        raise ValueError("Instala python-docx: pip install python-docx")
+
+    if title is None:
+        title = get_smart_title(text)
+
+    doc = Document()
+
+    # ---- Page margins ----
+    for section in doc.sections:
+        section.top_margin = Cm(2)
+        section.bottom_margin = Cm(2)
+        section.left_margin = Cm(2.5)
+        section.right_margin = Cm(2.5)
+
+    # ---- Default font ----
+    style = doc.styles['Normal']
+    font = style.font
+    font.name = 'Calibri'
+    font.size = Pt(11)
+    font.color.rgb = RGBColor(40, 40, 50)
+
+    # ---- Accent line ----
+    accent_para = doc.add_paragraph()
+    accent_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    accent_run = accent_para.add_run("━" * 40)
+    accent_run.font.color.rgb = RGBColor(88, 60, 200)
+    accent_run.font.size = Pt(6)
+
+    # ---- Title ----
+    title_para = doc.add_paragraph()
+    title_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    title_para.space_after = Pt(4)
+    title_run = title_para.add_run(title)
+    title_run.font.size = Pt(22)
+    title_run.font.bold = True
+    title_run.font.color.rgb = RGBColor(88, 60, 200)
+    title_run.font.name = 'Calibri Light'
+
+    # ---- Date ----
+    date_para = doc.add_paragraph()
+    date_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    date_para.space_after = Pt(2)
+    date_str = datetime.now().strftime("%d de %B, %Y • %H:%M")
+    date_run = date_para.add_run(f"Generado el {date_str}")
+    date_run.font.size = Pt(9)
+    date_run.font.color.rgb = RGBColor(140, 140, 150)
+
+    # ---- Divider ----
+    div_para = doc.add_paragraph()
+    div_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    div_para.space_after = Pt(12)
+    div_run = div_para.add_run("─" * 50)
+    div_run.font.color.rgb = RGBColor(200, 200, 215)
+    div_run.font.size = Pt(8)
+
+    # ---- Content Blocks ----
+    blocks = parse_markdown_blocks(text)
+
+    for block in blocks:
+        btype = block['type']
+
+        if btype == 'header':
+            level = block['level']
+            content = strip_inline_md(block['content'])
+            
+            p = doc.add_paragraph()
+            p.space_before = Pt(12)
+            p.space_after = Pt(4)
+            run = p.add_run(content)
+            run.font.bold = True
+            
+            if level == 1:
+                run.font.size = Pt(18)
+                run.font.color.rgb = RGBColor(30, 30, 45)
+            elif level == 2:
+                run.font.size = Pt(15)
+                run.font.color.rgb = RGBColor(88, 60, 200)
+            elif level == 3:
+                run.font.size = Pt(13)
+                run.font.color.rgb = RGBColor(60, 60, 80)
+            else:
+                run.font.size = Pt(12)
+                run.font.color.rgb = RGBColor(80, 80, 100)
+
+        elif btype == 'bold_heading':
+            content = strip_inline_md(block['content'])
+            p = doc.add_paragraph()
+            p.space_before = Pt(8)
+            p.space_after = Pt(2)
+            run = p.add_run(content)
+            run.font.bold = True
+            run.font.size = Pt(12)
+            run.font.color.rgb = RGBColor(88, 60, 200)
+
+        elif btype == 'paragraph':
+            content = strip_inline_md(block['content'])
+            p = doc.add_paragraph(content)
+            p.paragraph_format.line_spacing = Pt(16)
+            p.space_after = Pt(6)
+
+        elif btype == 'bullet_list':
+            for item in block['content']:
+                item_clean = strip_inline_md(item)
+                p = doc.add_paragraph(item_clean, style='List Bullet')
+                p.paragraph_format.line_spacing = Pt(15)
+
+        elif btype == 'numbered_list':
+            for item in block['content']:
+                item_clean = strip_inline_md(item)
+                p = doc.add_paragraph(item_clean, style='List Number')
+                p.paragraph_format.line_spacing = Pt(15)
+
+        elif btype == 'code':
+            code_para = doc.add_paragraph()
+            code_para.space_before = Pt(6)
+            code_para.space_after = Pt(6)
+            # Add shading to code block
+            shading = OxmlElement('w:shd')
+            shading.set(qn('w:fill'), 'F5F5F8')
+            shading.set(qn('w:val'), 'clear')
+            code_para.paragraph_format.element.get_or_add_pPr().append(shading)
+            
+            run = code_para.add_run(block['content'])
+            run.font.name = 'Consolas'
+            run.font.size = Pt(9)
+            run.font.color.rgb = RGBColor(60, 60, 80)
+
+        elif btype == 'hr':
+            hr_para = doc.add_paragraph()
+            hr_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+            hr_run = hr_para.add_run("─" * 50)
+            hr_run.font.color.rgb = RGBColor(200, 200, 215)
+            hr_run.font.size = Pt(8)
+
+    # ---- Footer ----
+    div_para2 = doc.add_paragraph()
+    div_para2.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    div_para2.space_before = Pt(20)
+    div_run2 = div_para2.add_run("─" * 50)
+    div_run2.font.color.rgb = RGBColor(200, 200, 215)
+    div_run2.font.size = Pt(8)
+
+    footer_para = doc.add_paragraph()
+    footer_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    footer_run = footer_para.add_run(
+        "Generado por CareerAI — Asistente de Carrera con IA"
+    )
+    footer_run.font.size = Pt(8)
+    footer_run.font.italic = True
+    footer_run.font.color.rgb = RGBColor(160, 160, 175)
+
+    sub_para = doc.add_paragraph()
+    sub_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    sub_run = sub_para.add_run("Powered by RAG + Llama 3.3 + ChromaDB")
+    sub_run.font.size = Pt(7)
+    sub_run.font.color.rgb = RGBColor(180, 180, 195)
+
+    # ---- Save to bytes ----
+    buffer = io.BytesIO()
+    doc.save(buffer)
+    buffer.seek(0)
+    return buffer.getvalue()
+
+
+# ======================== TXT EXPORT ========================
+
+def export_to_txt(text: str) -> bytes:
+    """Export text content as a clean, well-formatted TXT file."""
+    clean = clean_markdown(text)
+    title = get_smart_title(text)
+    date_str = datetime.now().strftime('%d/%m/%Y %H:%M')
+    
+    header = (
+        f"{'=' * 60}\n"
+        f"  {title}\n"
+        f"  Generado: {date_str}\n"
+        f"  CareerAI — Asistente de Carrera con IA\n"
+        f"{'=' * 60}\n\n"
+    )
+    
+    footer = (
+        f"\n\n{'─' * 60}\n"
+        f"Generado por CareerAI | Powered by RAG + Llama 3.3\n"
+    )
+    
+    return (header + clean + footer).encode("utf-8")
+
+
+# ======================== HTML EXPORT ========================
+
+def export_to_html(text: str, title: Optional[str] = None) -> bytes:
+    """Export text content as a beautifully styled standalone HTML file."""
+    import html as html_lib
+
+    if title is None:
+        title = get_smart_title(text)
+
+    date_str = datetime.now().strftime("%d de %B, %Y • %H:%M")
+    
+    # Convert markdown to HTML-like content
+    blocks = parse_markdown_blocks(text)
+    content_html = ""
+    
+    for block in blocks:
+        btype = block['type']
+        
+        if btype == 'header':
+            level = block['level']
+            content = html_lib.escape(strip_inline_md(block['content']))
+            tag = f"h{min(level + 1, 6)}"  # shift down since h1 is title
+            content_html += f"<{tag}>{content}</{tag}>\n"
+        
+        elif btype == 'bold_heading':
+            content = html_lib.escape(strip_inline_md(block['content']))
+            content_html += f'<h3 class="accent">{content}</h3>\n'
+        
+        elif btype == 'paragraph':
+            content = html_lib.escape(strip_inline_md(block['content']))
+            content_html += f"<p>{content}</p>\n"
+        
+        elif btype == 'bullet_list':
+            content_html += "<ul>\n"
+            for item in block['content']:
+                item_clean = html_lib.escape(strip_inline_md(item))
+                content_html += f"  <li>{item_clean}</li>\n"
+            content_html += "</ul>\n"
+        
+        elif btype == 'numbered_list':
+            content_html += "<ol>\n"
+            for item in block['content']:
+                item_clean = html_lib.escape(strip_inline_md(item))
+                content_html += f"  <li>{item_clean}</li>\n"
+            content_html += "</ol>\n"
+        
+        elif btype == 'code':
+            lang = block.get('lang', '')
+            code_content = html_lib.escape(block['content'])
+            content_html += f'<pre><code class="{lang}">{code_content}</code></pre>\n'
+        
+        elif btype == 'hr':
+            content_html += '<hr>\n'
+
+    html_template = f"""<!DOCTYPE html>
+<html lang="es">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{html_lib.escape(title)} — CareerAI</title>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <style>
+        * {{ margin: 0; padding: 0; box-sizing: border-box; }}
+        
+        body {{
+            font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
+            background: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 30%, #16213e 60%, #0f0f23 100%);
+            color: #e4e4e7;
+            min-height: 100vh;
+            line-height: 1.7;
+        }}
+        
+        .container {{
+            max-width: 780px;
+            margin: 0 auto;
+            padding: 40px 30px;
+        }}
+        
+        .header {{
+            text-align: center;
+            margin-bottom: 40px;
+            padding-bottom: 30px;
+            border-bottom: 1px solid rgba(139, 92, 246, 0.2);
+            position: relative;
+        }}
+        
+        .header::before {{
+            content: '';
+            position: absolute;
+            bottom: -1px;
+            left: 50%;
+            transform: translateX(-50%);
+            width: 120px;
+            height: 2px;
+            background: linear-gradient(90deg, transparent, #8b5cf6, transparent);
+        }}
+        
+        .brand {{
+            font-size: 0.75rem;
+            font-weight: 600;
+            text-transform: uppercase;
+            letter-spacing: 0.15em;
+            color: #8b5cf6;
+            margin-bottom: 12px;
+        }}
+        
+        h1 {{
+            font-size: 2rem;
+            font-weight: 700;
+            background: linear-gradient(135deg, #a78bfa, #c084fc, #e879f9, #f472b6);
+            background-clip: text;
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            margin-bottom: 8px;
+            letter-spacing: -0.02em;
+        }}
+        
+        .date {{
+            font-size: 0.85rem;
+            color: #71717a;
+        }}
+        
+        .content {{
+            background: rgba(24, 24, 27, 0.5);
+            border: 1px solid rgba(63, 63, 70, 0.3);
+            border-radius: 20px;
+            padding: 40px 36px;
+            backdrop-filter: blur(20px);
+            box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.4);
+        }}
+        
+        h2 {{
+            font-size: 1.5rem;
+            font-weight: 700;
+            color: #fafafa;
+            margin: 28px 0 12px 0;
+            letter-spacing: -0.01em;
+        }}
+        
+        h3 {{
+            font-size: 1.2rem;
+            font-weight: 600;
+            color: #d4d4d8;
+            margin: 22px 0 10px 0;
+        }}
+        
+        h3.accent {{
+            color: #a78bfa;
+        }}
+        
+        h4, h5, h6 {{
+            font-size: 1rem;
+            font-weight: 600;
+            color: #a1a1aa;
+            margin: 18px 0 8px 0;
+        }}
+        
+        p {{
+            margin: 0 0 14px 0;
+            color: #d4d4d8;
+            font-size: 0.95rem;
+        }}
+        
+        ul, ol {{
+            margin: 10px 0 18px 0;
+            padding-left: 24px;
+        }}
+        
+        li {{
+            margin-bottom: 8px;
+            color: #d4d4d8;
+            font-size: 0.95rem;
+        }}
+        
+        li::marker {{
+            color: #8b5cf6;
+        }}
+        
+        pre {{
+            background: rgba(15, 15, 30, 0.6);
+            border: 1px solid rgba(63, 63, 70, 0.3);
+            border-radius: 12px;
+            padding: 18px 20px;
+            overflow-x: auto;
+            margin: 14px 0;
+        }}
+        
+        code {{
+            font-family: 'JetBrains Mono', 'Fira Code', Consolas, monospace;
+            font-size: 0.85rem;
+            color: #c4b5fd;
+        }}
+        
+        hr {{
+            border: none;
+            height: 1px;
+            background: linear-gradient(90deg, transparent, rgba(139, 92, 246, 0.3), transparent);
+            margin: 24px 0;
+        }}
+        
+        .footer {{
+            text-align: center;
+            margin-top: 40px;
+            padding-top: 24px;
+            border-top: 1px solid rgba(63, 63, 70, 0.2);
+        }}
+        
+        .footer p {{
+            color: #52525b;
+            font-size: 0.78rem;
+        }}
+        
+        .footer .powered {{
+            font-size: 0.72rem;
+            color: #3f3f46;
+            margin-top: 4px;
+        }}
+        
+        @media print {{
+            body {{ background: white; color: #1a1a2e; }}
+            .content {{ border: 1px solid #e5e7eb; box-shadow: none; background: white; }}
+            h1 {{ color: #4c1d95; -webkit-text-fill-color: #4c1d95; }}
+            h2 {{ color: #1a1a2e; }}
+            h3, h3.accent {{ color: #4c1d95; }}
+            p, li {{ color: #374151; }}
+            pre {{ background: #f9fafb; border: 1px solid #e5e7eb; }}
+            code {{ color: #6d28d9; }}
+        }}
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="header">
+            <div class="brand">CareerAI</div>
+            <h1>{html_lib.escape(title)}</h1>
+            <div class="date">{date_str}</div>
+        </div>
+        
+        <div class="content">
+            {content_html}
+        </div>
+        
+        <div class="footer">
+            <p>Generado por CareerAI — Asistente de Carrera con IA</p>
+            <p class="powered">Powered by RAG + Llama 3.3 + ChromaDB</p>
+        </div>
+    </div>
+</body>
+</html>"""
+
+    return html_template.encode("utf-8")
+
+
+# ======================== CONVERSATION EXPORT ========================
+
+def export_conversation_to_pdf(messages: List[Dict], title: str = "Conversación CareerAI") -> bytes:
+    """Export full conversation history to PDF."""
+    try:
+        from fpdf import FPDF
+    except ImportError:
+        raise ValueError("Instala fpdf2: pip install fpdf2")
+
+    pdf = FPDF()
+    pdf.set_auto_page_break(auto=True, margin=20)
+    pdf.add_page()
+
+    # Header band
+    pdf.set_fill_color(88, 60, 200)
+    pdf.rect(0, 0, 210, 3, 'F')
+
+    # Title
+    pdf.set_y(15)
+    pdf.set_font("Helvetica", "B", 18)
+    pdf.set_text_color(88, 60, 200)
+    pdf.cell(0, 12, title, new_x="LMARGIN", new_y="NEXT", align="C")
+
+    # Date
+    pdf.set_font("Helvetica", "", 9)
+    pdf.set_text_color(140, 140, 150)
+    date_str = datetime.now().strftime("%d/%m/%Y %H:%M")
+    pdf.cell(0, 6, f"Exportado el {date_str}", new_x="LMARGIN", new_y="NEXT", align="C")
+    pdf.ln(4)
+
+    # Stats
+    user_msgs = sum(1 for m in messages if m["role"] == "user")
+    ai_msgs = sum(1 for m in messages if m["role"] == "assistant")
+    pdf.set_font("Helvetica", "", 8)
+    pdf.set_text_color(160, 160, 175)
+    pdf.cell(0, 5, f"{user_msgs} preguntas · {ai_msgs} respuestas · {len(messages)} mensajes totales",
+             new_x="LMARGIN", new_y="NEXT", align="C")
+    pdf.ln(6)
+
+    # Divider
+    y = pdf.get_y()
+    pdf.set_draw_color(200, 200, 215)
+    pdf.line(20, y, 190, y)
+    pdf.ln(8)
+
+    # Messages
+    for i, msg in enumerate(messages):
+        is_user = msg["role"] == "user"
+        
+        # Role label
+        pdf.set_font("Helvetica", "B", 10)
+        if is_user:
+            pdf.set_text_color(100, 100, 120)
+            pdf.cell(0, 6, f"Tu ({i + 1})", new_x="LMARGIN", new_y="NEXT")
+        else:
+            pdf.set_text_color(88, 60, 200)
+            pdf.cell(0, 6, f"CareerAI ({i + 1})", new_x="LMARGIN", new_y="NEXT")
+        
+        # Content
+        clean = _sanitize_for_pdf(clean_markdown(msg["content"]))
+        pdf.set_font("Helvetica", "", 10)
+        pdf.set_text_color(40, 40, 50)
+        
+        for paragraph in clean.split('\n'):
+            paragraph = paragraph.strip()
+            if not paragraph:
+                pdf.ln(2)
+                continue
+            if paragraph.startswith('•'):
+                pdf.multi_cell(0, 5, paragraph)
+                pdf.ln(1)
+            else:
+                pdf.multi_cell(0, 5, paragraph)
+                pdf.ln(1)
+        
+        pdf.ln(4)
+        
+        # Separator between messages
+        if i < len(messages) - 1:
+            y = pdf.get_y()
+            pdf.set_draw_color(220, 220, 230)
+            pdf.set_line_width(0.2)
+            pdf.line(30, y, 180, y)
+            pdf.ln(5)
+
+    # Footer
+    pdf.ln(8)
+    pdf.set_draw_color(88, 60, 200)
+    pdf.line(60, pdf.get_y(), 150, pdf.get_y())
+    pdf.ln(6)
+    pdf.set_font("Helvetica", "I", 8)
+    pdf.set_text_color(160, 160, 175)
+    pdf.cell(0, 5, "CareerAI - Asistente de Carrera con IA", align="C")
+
+    # Bottom band
+    pdf.set_fill_color(88, 60, 200)
+    pdf.rect(0, 294, 210, 3, 'F')
+
+    return pdf.output()
+
+
+def export_conversation_to_docx(messages: List[Dict], title: str = "Conversación CareerAI") -> bytes:
+    """Export full conversation history to DOCX (Word)."""
+    try:
+        from docx import Document
+        from docx.shared import Pt, Cm, RGBColor
+        from docx.enum.text import WD_ALIGN_PARAGRAPH
+    except ImportError:
+        raise ValueError("Instala python-docx: pip install python-docx")
+
+    doc = Document()
+    for section in doc.sections:
+        section.top_margin = Cm(1.5)
+        section.bottom_margin = Cm(1.5)
+        section.left_margin = Cm(2)
+        section.right_margin = Cm(2)
+
+    # Style
+    style = doc.styles['Normal']
+    style.font.name = 'Calibri'
+    style.font.size = Pt(11)
+    style.font.color.rgb = RGBColor(40, 40, 50)
+
+    # Title
+    title_para = doc.add_paragraph()
+    title_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    title_para.space_after = Pt(4)
+    title_run = title_para.add_run(title)
+    title_run.font.size = Pt(20)
+    title_run.font.bold = True
+    title_run.font.color.rgb = RGBColor(88, 60, 200)
+
+    # Date & stats
+    date_str = datetime.now().strftime("%d de %B, %Y • %H:%M")
+    user_msgs = sum(1 for m in messages if m["role"] == "user")
+    ai_msgs = sum(1 for m in messages if m["role"] == "assistant")
+    date_para = doc.add_paragraph()
+    date_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    date_para.space_after = Pt(2)
+    date_run = date_para.add_run(f"Exportado el {date_str}")
+    date_run.font.size = Pt(9)
+    date_run.font.color.rgb = RGBColor(140, 140, 150)
+
+    stats_para = doc.add_paragraph()
+    stats_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    stats_para.space_after = Pt(12)
+    stats_run = stats_para.add_run(f"{user_msgs} preguntas · {ai_msgs} respuestas · {len(messages)} mensajes")
+    stats_run.font.size = Pt(8)
+    stats_run.font.color.rgb = RGBColor(160, 160, 175)
+
+    # Divider
+    div_para = doc.add_paragraph()
+    div_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    div_para.space_after = Pt(12)
+    div_run = div_para.add_run("─" * 50)
+    div_run.font.color.rgb = RGBColor(200, 200, 215)
+    div_run.font.size = Pt(8)
+
+    # Messages
+    for i, msg in enumerate(messages):
+        is_user = msg["role"] == "user"
+        role_label = f"Tú (#{i + 1})" if is_user else f"CareerAI (#{i + 1})"
+
+        role_para = doc.add_paragraph()
+        role_para.space_before = Pt(14)
+        role_para.space_after = Pt(4)
+        role_run = role_para.add_run(role_label)
+        role_run.font.bold = True
+        role_run.font.size = Pt(11)
+        if is_user:
+            role_run.font.color.rgb = RGBColor(80, 80, 100)
+        else:
+            role_run.font.color.rgb = RGBColor(88, 60, 200)
+
+        clean = clean_markdown(msg["content"])
+        for line in clean.split("\n"):
+            line = line.strip()
+            if not line:
+                doc.add_paragraph()
+                continue
+            p = doc.add_paragraph(line)
+            p.paragraph_format.line_spacing = Pt(15)
+            p.paragraph_format.space_after = Pt(4)
+
+        if i < len(messages) - 1:
+            sep = doc.add_paragraph()
+            sep.space_after = Pt(6)
+            sep_run = sep.add_run("─" * 40)
+            sep_run.font.color.rgb = RGBColor(220, 220, 230)
+            sep_run.font.size = Pt(6)
+
+    # Footer
+    doc.add_paragraph()
+    footer_para = doc.add_paragraph()
+    footer_para.alignment = WD_ALIGN_PARAGRAPH.CENTER
+    footer_run = footer_para.add_run("CareerAI — Asistente de Carrera con IA")
+    footer_run.font.size = Pt(8)
+    footer_run.font.italic = True
+    footer_run.font.color.rgb = RGBColor(160, 160, 175)
+
+    buffer = io.BytesIO()
+    doc.save(buffer)
+    buffer.seek(0)
+    return buffer.getvalue()
+
+
+def export_conversation_to_html(messages: List[Dict], title: str = "Conversación CareerAI") -> bytes:
+    """Export full conversation as a beautifully styled HTML file."""
+    import html as html_lib
+
+    date_str = datetime.now().strftime("%d de %B, %Y • %H:%M")
+    user_msgs = sum(1 for m in messages if m["role"] == "user")
+    ai_msgs = sum(1 for m in messages if m["role"] == "assistant")
+
+    messages_html = ""
+    for i, msg in enumerate(messages):
+        is_user = msg["role"] == "user"
+        role_class = "user-msg" if is_user else "ai-msg"
+        role_label = "Tú" if is_user else "CareerAI"
+        avatar = "👤" if is_user else "🤖"
+        clean = html_lib.escape(clean_markdown(msg["content"]))
+        # Convert newlines to <br>
+        clean = clean.replace('\n', '<br>')
+        
+        messages_html += f"""
+        <div class="message {role_class}">
+            <div class="message-header">
+                <span class="avatar">{avatar}</span>
+                <span class="role">{role_label}</span>
+                <span class="msg-num">#{i + 1}</span>
+            </div>
+            <div class="message-body">{clean}</div>
+        </div>
+        """
+
+    html_content = f"""<!DOCTYPE html>
+<html lang="es">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{html_lib.escape(title)} — CareerAI</title>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+    <style>
+        * {{ margin: 0; padding: 0; box-sizing: border-box; }}
+        body {{
+            font-family: 'Inter', sans-serif;
+            background: linear-gradient(135deg, #0f0f23, #1a1a2e, #16213e, #0f0f23);
+            color: #e4e4e7;
+            min-height: 100vh;
+            line-height: 1.6;
+        }}
+        .container {{ max-width: 800px; margin: 0 auto; padding: 40px 24px; }}
+        .header {{
+            text-align: center;
+            margin-bottom: 32px;
+            padding-bottom: 24px;
+            border-bottom: 1px solid rgba(139, 92, 246, 0.2);
+        }}
+        .brand {{ font-size: 0.75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.15em; color: #8b5cf6; margin-bottom: 10px; }}
+        h1 {{
+            font-size: 1.8rem; font-weight: 700;
+            background: linear-gradient(135deg, #a78bfa, #c084fc, #e879f9);
+            -webkit-background-clip: text; -webkit-text-fill-color: transparent;
+            margin-bottom: 6px;
+        }}
+        .meta {{ color: #71717a; font-size: 0.85rem; }}
+        .stats {{ color: #52525b; font-size: 0.8rem; margin-top: 6px; }}
+        
+        .message {{
+            margin-bottom: 16px;
+            border-radius: 16px;
+            padding: 18px 22px;
+            border: 1px solid rgba(63, 63, 70, 0.3);
+        }}
+        .user-msg {{
+            background: rgba(24, 24, 27, 0.4);
+        }}
+        .ai-msg {{
+            background: rgba(88, 60, 200, 0.06);
+            border-color: rgba(139, 92, 246, 0.15);
+        }}
+        .message-header {{
+            display: flex;
+            align-items: center;
+            gap: 8px;
+            margin-bottom: 10px;
+        }}
+        .avatar {{ font-size: 1.2rem; }}
+        .role {{ font-weight: 600; font-size: 0.85rem; color: #a1a1aa; }}
+        .ai-msg .role {{ color: #a78bfa; }}
+        .msg-num {{ font-size: 0.72rem; color: #52525b; margin-left: auto; }}
+        .message-body {{ font-size: 0.92rem; color: #d4d4d8; line-height: 1.7; }}
+        
+        .footer {{
+            text-align: center;
+            margin-top: 32px;
+            padding-top: 20px;
+            border-top: 1px solid rgba(63, 63, 70, 0.2);
+        }}
+        .footer p {{ color: #52525b; font-size: 0.78rem; }}
+        
+        @media print {{
+            body {{ background: white; color: #1a1a2e; }}
+            .message {{ border: 1px solid #e5e7eb; }}
+            .ai-msg {{ background: #f8f5ff; }}
+            .message-body {{ color: #374151; }}
+        }}
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="header">
+            <div class="brand">CareerAI</div>
+            <h1>{html_lib.escape(title)}</h1>
+            <div class="meta">{date_str}</div>
+            <div class="stats">{user_msgs} preguntas · {ai_msgs} respuestas</div>
+        </div>
+        
+        {messages_html}
+        
+        <div class="footer">
+            <p>Generado por CareerAI — Asistente de Carrera con IA</p>
+        </div>
+    </div>
+</body>
+</html>"""
+
+    return html_content.encode("utf-8")

src/models.py

@@ -0,0 +1,45 @@
+import os
+from datetime import datetime
+from sqlalchemy import create_engine, Column, Integer, String, DateTime, Text, ForeignKey, JSON
+from sqlalchemy.orm import declarative_base, sessionmaker, relationship
+
+DB_PATH = os.path.join(os.path.dirname(os.path.dirname(__file__)), "careerai.db")
+engine = create_engine(f"sqlite:///{DB_PATH}", connect_args={"check_same_thread": False})
+SessionLocal = sessionmaker(autocommit=False, autoflush=False, bind=engine)
+
+Base = declarative_base()
+
+class User(Base):
+    __tablename__ = "users"
+
+    id = Column(Integer, primary_key=True, index=True)
+    email = Column(String, unique=True, index=True, nullable=False)
+    name = Column(String, nullable=False)
+    picture = Column(String, nullable=True)
+    hashed_password = Column(String, nullable=True)
+    google_id = Column(String, unique=True, index=True, nullable=True)
+    created_at = Column(DateTime, default=datetime.utcnow)
+
+    conversations = relationship("Conversation", back_populates="user", cascade="all, delete-orphan")
+
+class Conversation(Base):
+    __tablename__ = "conversations"
+
+    id = Column(String, primary_key=True, index=True) # UUID string from frontend
+    user_id = Column(Integer, ForeignKey("users.id"), nullable=False)
+    title = Column(String, nullable=False)
+    messages = Column(JSON, nullable=False, default=list) # Store messages as JSON
+    updated_at = Column(DateTime, default=datetime.utcnow, onupdate=datetime.utcnow)
+
+    user = relationship("User", back_populates="conversations")
+
+# Create all tables
+Base.metadata.create_all(bind=engine)
+
+# Dependency to get DB session
+def get_db():
+    db = SessionLocal()
+    try:
+        yield db
+    finally:
+        db.close()

src/profile_extractor.py

@@ -0,0 +1,171 @@
+"""
+Profile Extractor - Uses LLM (Groq) to extract structured skills and experience from document text.
+Returns JSON for dashboard: skills (by category/level) and experience (timeline).
+"""
+import json
+import re
+from typing import List, Dict, Any
+
+
+EXTRACT_PROMPT = """Analiza el siguiente texto de CV/perfil profesional y extrae SOLO información que aparezca explícitamente.
+
+Responde ÚNICAMENTE con un bloque JSON válido (sin markdown, sin texto antes o después), con esta estructura exacta:
+
+{{
+  "summary": {{
+    "headline": "titular corto del perfil (opcional)",
+    "estimated_seniority": "junior|mid|senior|lead|unknown",
+    "total_years_experience": 0
+  }},
+  "skills": [
+    {{ "name": "nombre del skill", "category": "technical" | "soft" | "tools" | "language", "level": "basic" | "intermediate" | "advanced", "evidence": "frase corta del documento (opcional)" }}
+  ],
+  "experience": [
+    {{ "company": "nombre empresa", "role": "puesto", "start_date": "YYYY-MM o año", "end_date": "YYYY-MM o null si actual", "current": true/false, "location": "opcional", "description": "breve descripción opcional", "highlights": ["logro 1", "logro 2"] }}
+  ]
+}}
+
+Reglas:
+- skills: category "technical" = lenguajes, frameworks, bases de datos; "soft" = comunicación, liderazgo; "tools" = Herramientas (Git, Jira); "language" = idiomas.
+- experience: start_date y end_date en formato "YYYY" o "YYYY-MM" si se puede inferir. Si es el trabajo actual, end_date puede ser null y current true.
+- Extrae SOLO lo que esté en el texto. No inventes datos.
+- Si no hay información para skills o experience, devuelve listas vacías [].
+- El JSON debe ser válido (comillas dobles, sin comas finales).
+- Si no puedes determinar seniority o años, usa \"unknown\" y 0.
+
+TEXTO DEL DOCUMENTO:
+---
+{text}
+---
+Responde solo con el JSON, nada más."""
+
+def _extract_json_candidate(text: str) -> str:
+    """Best-effort: pull a JSON object from model output."""
+    if not text:
+        return ""
+    s = text.strip()
+    fence = re.search(r"```(?:json)?\s*([\s\S]*?)\s*```", s)
+    if fence:
+        s = fence.group(1).strip()
+
+    # If there's extra text, keep the first {...} block.
+    start = s.find("{")
+    end = s.rfind("}")
+    if start != -1 and end != -1 and end > start:
+        s = s[start : end + 1]
+
+    # Remove trailing commas (common LLM issue)
+    s = re.sub(r",\s*([}\]])", r"\1", s)
+    return s.strip()
+
+
+def extract_profile_from_text(text: str, llm) -> Dict[str, Any]:
+    """
+    Call LLM to extract structured profile (skills + experience) from document text.
+    llm: LangChain ChatGroq instance (e.g. from CareerAssistant.llm).
+    Returns dict with "skills" and "experience" lists; on error returns empty structure.
+    """
+    if not text or not text.strip():
+        return {"skills": [], "experience": []}
+
+    # Limit size to avoid token limits (keep first ~12k chars)
+    text_trimmed = text.strip()[:12000]
+    prompt = EXTRACT_PROMPT.format(text=text_trimmed)
+
+    try:
+        from langchain_core.messages import HumanMessage
+        response = llm.invoke([HumanMessage(content=prompt)])
+        content = response.content if hasattr(response, "content") else str(response)
+        candidate = _extract_json_candidate(content)
+        data = json.loads(candidate)
+        skills = data.get("skills") or []
+        experience = data.get("experience") or []
+        summary = data.get("summary") or {}
+        # Normalize
+        if not isinstance(skills, list):
+            skills = []
+        if not isinstance(experience, list):
+            experience = []
+        if not isinstance(summary, dict):
+            summary = {}
+        return {"summary": summary, "skills": skills, "experience": experience}
+    except (json.JSONDecodeError, Exception):
+        return {"summary": {}, "skills": [], "experience": []}
+
+INSIGHTS_PROMPT = """Eres un analista de carrera. Te paso un perfil ya extraído de documentos reales (skills + experiencia).\n\nTu tarea: generar insights accionables SIN inventar información.\n\nResponde ÚNICAMENTE JSON válido (sin markdown), con esta estructura exacta:\n\n{\n  \"strengths\": [\"...\"],\n  \"potential_gaps\": [\"...\"],\n  \"role_suggestions\": [\"...\"],\n  \"next_actions\": [\"...\"]\n}\n\nReglas:\n- Todo debe derivarse SOLO del perfil que recibes. Si falta info, dilo en el texto del insight (ej: \"No hay evidencia de X en los documentos\").\n- Sé concreto y breve (bullets de 1 línea).\n- No menciones que eres una IA.\n\nPERFIL (JSON):\n{profile_json}\n"""
+
+
+def generate_dashboard_insights(profile: Dict[str, Any], llm) -> Dict[str, Any]:
+    """Generate 'smart' insights based on extracted profile JSON."""
+    try:
+        from langchain_core.messages import HumanMessage
+        profile_json = json.dumps(profile or {}, ensure_ascii=False)[:12000]
+        prompt = INSIGHTS_PROMPT.format(profile_json=profile_json)
+        resp = llm.invoke([HumanMessage(content=prompt)])
+        content = resp.content if hasattr(resp, "content") else str(resp)
+        candidate = _extract_json_candidate(content)
+        data = json.loads(candidate)
+        out = {
+            "strengths": data.get("strengths") or [],
+            "potential_gaps": data.get("potential_gaps") or [],
+            "role_suggestions": data.get("role_suggestions") or [],
+            "next_actions": data.get("next_actions") or [],
+        }
+        for k in list(out.keys()):
+            if not isinstance(out[k], list):
+                out[k] = []
+            out[k] = [str(x).strip() for x in out[k] if str(x).strip()][:12]
+        return out
+    except Exception:
+        return {"strengths": [], "potential_gaps": [], "role_suggestions": [], "next_actions": []}
+
+
+def skills_by_category(skills: List[Dict]) -> Dict[str, int]:
+    """Count skills per category for bar chart."""
+    counts = {}
+    for s in skills:
+        if not isinstance(s, dict):
+            continue
+        cat = (s.get("category") or "other").lower()
+        counts[cat] = counts.get(cat, 0) + 1
+    return counts
+
+
+def skills_by_level(skills: List[Dict]) -> Dict[str, int]:
+    """Count skills per level for chart."""
+    counts = {"basic": 0, "intermediate": 0, "advanced": 0}
+    for s in skills:
+        if not isinstance(s, dict):
+            continue
+        level = (s.get("level") or "intermediate").lower()
+        if level in counts:
+            counts[level] += 1
+        else:
+            counts["intermediate"] += 1
+    return counts
+
+
+def experience_for_timeline(experience: List[Dict]) -> List[Dict]:
+    """
+    Normalize experience entries for timeline: ensure start_date/end_date for plotting.
+    Returns list of dicts with company, role, start_date, end_date, current, description.
+    """
+    out = []
+    for e in experience:
+        if not isinstance(e, dict):
+            continue
+        start = (e.get("start_date") or "").strip() or "Unknown"
+        end = e.get("end_date")
+        if end is None and e.get("current"):
+            end = "Actualidad"
+        elif not end:
+            end = "?"
+        out.append({
+            "company": (e.get("company") or "?").strip(),
+            "role": (e.get("role") or "?").strip(),
+            "start_date": start,
+            "end_date": end,
+            "current": bool(e.get("current")),
+            "description": (e.get("description") or "").strip()[:200],
+        })
+    return out

src/rag_engine.py

@@ -0,0 +1,549 @@
+"""
+RAG Engine v2.0 - Advanced retrieval with:
+  • Multilingual embeddings (BGE-M3 / gte-multilingual / multilingual-e5)
+  • Hybrid search (Vector + BM25 keyword via Reciprocal Rank Fusion)
+  • Reranking with BGE-Reranker-v2
+  • Metadata filtering by document type (CV vs Job Offer vs LinkedIn)
+All 100% free & local.
+"""
+import os
+import hashlib
+import logging
+from typing import List, Tuple, Optional, Dict
+
+from langchain_huggingface import HuggingFaceEmbeddings
+from langchain_chroma import Chroma
+from langchain_core.documents import Document
+
+logger = logging.getLogger(__name__)
+
+# ======================== EMBEDDING MODEL CATALOG ========================
+
+EMBEDDING_MODELS = {
+    "bge-m3": {
+        "name": "BAAI/bge-m3",
+        "display": "🌍 BGE-M3 (Multilingual · Recomendado)",
+        "description": "Mejor modelo multilingual 2025. Dense+sparse, 100+ idiomas, ideal para RAG.",
+        "size": "~2.3 GB",
+        "languages": "100+",
+        "performance": "⭐⭐⭐⭐⭐",
+    },
+    "gte-multilingual": {
+        "name": "Alibaba-NLP/gte-multilingual-base",
+        "display": "🚀 GTE Multilingual (Ligero · 70+ idiomas)",
+        "description": "Excelente balance tamaño/calidad. 70+ idiomas, encoder-only.",
+        "size": "~580 MB",
+        "languages": "70+",
+        "performance": "⭐⭐⭐⭐",
+    },
+    "multilingual-e5": {
+        "name": "intfloat/multilingual-e5-base",
+        "display": "📐 Multilingual E5 Base (Estándar)",
+        "description": "Modelo estándar multilingual para retrieval y similitud semántica.",
+        "size": "~1.1 GB",
+        "languages": "100+",
+        "performance": "⭐⭐⭐⭐",
+    },
+    "minilm-v2": {
+        "name": "sentence-transformers/all-MiniLM-L6-v2",
+        "display": "⚡ MiniLM v2 (Ultra-ligero · Solo inglés)",
+        "description": "Modelo original, muy rápido pero solo inglés. Ideal para pruebas.",
+        "size": "~90 MB",
+        "languages": "Inglés",
+        "performance": "⭐⭐⭐",
+    },
+}
+
+DEFAULT_EMBEDDING = "bge-m3"
+
+
+# ======================== BM25 KEYWORD INDEX ========================
+
+class BM25Index:
+    """Lightweight BM25 keyword index for hybrid search."""
+
+    def __init__(self):
+        self._documents: List[str] = []
+        self._metadatas: List[dict] = []
+        self._index = None
+
+    @property
+    def is_ready(self) -> bool:
+        return self._index is not None and len(self._documents) > 0
+
+    def add(self, texts: List[str], metadatas: List[dict]):
+        """Add documents to the BM25 index."""
+        self._documents.extend(texts)
+        self._metadatas.extend(metadatas)
+        self._rebuild()
+
+    def _rebuild(self):
+        """Rebuild the BM25 index from scratch."""
+        try:
+            from rank_bm25 import BM25Okapi
+            tokenized = [doc.lower().split() for doc in self._documents]
+            if tokenized:
+                self._index = BM25Okapi(tokenized)
+        except ImportError:
+            logger.warning("rank_bm25 not installed – keyword search disabled. pip install rank_bm25")
+            self._index = None
+
+    def search(
+        self, query: str, k: int = 10, filter_dict: Optional[dict] = None,
+    ) -> List[Tuple[str, dict, float]]:
+        """Search using BM25 keyword matching."""
+        if not self.is_ready:
+            return []
+
+        tokenized_query = query.lower().split()
+        scores = self._index.get_scores(tokenized_query)
+
+        # Pair with metadata and filter
+        results = []
+        for idx, score in enumerate(scores):
+            if score <= 0:
+                continue
+            meta = self._metadatas[idx] if idx < len(self._metadatas) else {}
+            # Apply metadata filter
+            if filter_dict:
+                if not all(meta.get(k_f) == v_f for k_f, v_f in filter_dict.items()):
+                    continue
+            results.append((self._documents[idx], meta, float(score)))
+
+        # Sort by score descending and return top-k
+        results.sort(key=lambda x: x[2], reverse=True)
+        return results[:k]
+
+    def clear(self):
+        """Clear the BM25 index."""
+        self._documents.clear()
+        self._metadatas.clear()
+        self._index = None
+
+    def rebuild_from_chroma(self, chroma_collection):
+        """Rebuild BM25 index from existing ChromaDB collection."""
+        try:
+            data = chroma_collection.get()
+            if data and data.get("documents"):
+                self._documents = list(data["documents"])
+                self._metadatas = list(data.get("metadatas", [{}] * len(self._documents)))
+                self._rebuild()
+                logger.info(f"BM25 index rebuilt with {len(self._documents)} documents")
+        except Exception as e:
+            logger.warning(f"Failed to rebuild BM25 index: {e}")
+
+
+# ======================== RERANKER ========================
+
+class Reranker:
+    """Cross-encoder reranker using BGE-Reranker-v2-m3 (free, local, multilingual)."""
+
+    def __init__(self, model_name: str = "BAAI/bge-reranker-v2-m3"):
+        self.model_name = model_name
+        self._model = None
+
+    @property
+    def is_ready(self) -> bool:
+        return self._model is not None
+
+    def load(self):
+        """Lazy-load the reranker model."""
+        if self._model is not None:
+            return
+        try:
+            from sentence_transformers import CrossEncoder
+            self._model = CrossEncoder(self.model_name, max_length=512)
+            logger.info(f"Reranker loaded: {self.model_name}")
+        except ImportError:
+            logger.warning("sentence-transformers not installed for reranking")
+        except Exception as e:
+            logger.warning(f"Failed to load reranker: {e}")
+
+    def rerank(
+        self,
+        query: str,
+        results: List[Tuple[str, dict, float]],
+        top_k: int = 5,
+    ) -> List[Tuple[str, dict, float]]:
+        """Rerank results using cross-encoder scoring."""
+        if not self.is_ready or not results:
+            return results[:top_k]
+
+        try:
+            pairs = [(query, content) for content, _, _ in results]
+            scores = self._model.predict(pairs)
+
+            reranked = []
+            for i, (content, meta, _) in enumerate(results):
+                reranked.append((content, meta, float(scores[i])))
+
+            reranked.sort(key=lambda x: x[2], reverse=True)
+            return reranked[:top_k]
+        except Exception as e:
+            logger.warning(f"Reranking failed, returning original order: {e}")
+            return results[:top_k]
+
+
+# ======================== RECIPROCAL RANK FUSION ========================
+
+def reciprocal_rank_fusion(
+    results_list: List[List[Tuple[str, dict, float]]],
+    k: int = 60,
+    top_n: int = 15,
+) -> List[Tuple[str, dict, float]]:
+    """
+    Merge multiple ranked result lists using Reciprocal Rank Fusion (RRF).
+    Each result is identified by content hash. Final score = sum(1 / (k + rank)).
+    """
+    fused_scores: Dict[str, float] = {}
+    content_map: Dict[str, Tuple[str, dict]] = {}
+
+    for results in results_list:
+        for rank, (content, meta, _) in enumerate(results):
+            key = hashlib.md5(content[:200].encode()).hexdigest()
+            fused_scores[key] = fused_scores.get(key, 0.0) + 1.0 / (k + rank + 1)
+            if key not in content_map:
+                content_map[key] = (content, meta)
+
+    sorted_keys = sorted(fused_scores.keys(), key=lambda x: fused_scores[x], reverse=True)
+
+    merged = []
+    for key in sorted_keys[:top_n]:
+        content, meta = content_map[key]
+        merged.append((content, meta, fused_scores[key]))
+
+    return merged
+
+
+# ======================== RAG ENGINE v2 ========================
+
+class RAGEngine:
+    """
+    Advanced RAG Engine v2.0 with:
+    - Selectable multilingual embeddings
+    - Hybrid search (vector + BM25 keyword)
+    - Cross-encoder reranking
+    - Metadata filtering
+    """
+
+    def __init__(
+        self,
+        persist_directory: str = None,
+        embedding_key: str = DEFAULT_EMBEDDING,
+        enable_reranking: bool = True,
+        enable_hybrid: bool = True,
+    ):
+        if persist_directory is None:
+            persist_directory = os.path.join(
+                os.path.dirname(os.path.dirname(__file__)), "data", "vectordb"
+            )
+        self.persist_directory = persist_directory
+        os.makedirs(persist_directory, exist_ok=True)
+
+        # ---- Embeddings ----
+        self.embedding_key = embedding_key
+        model_info = EMBEDDING_MODELS.get(embedding_key, EMBEDDING_MODELS[DEFAULT_EMBEDDING])
+        model_name = model_info["name"]
+
+        self.embeddings = HuggingFaceEmbeddings(
+            model_name=model_name,
+            model_kwargs={"device": "cpu", "trust_remote_code": True},
+            encode_kwargs={"normalize_embeddings": True},
+        )
+
+        # ---- ChromaDB Vector Store ----
+        # Use collection name based on embedding to avoid dimension conflicts
+        collection_name = f"career_docs_{embedding_key.replace('-', '_')}"
+        self.vectorstore = Chroma(
+            collection_name=collection_name,
+            embedding_function=self.embeddings,
+            persist_directory=persist_directory,
+        )
+
+        # ---- BM25 Keyword Index (hybrid search) ----
+        self.enable_hybrid = enable_hybrid
+        self.bm25 = BM25Index()
+        if enable_hybrid:
+            try:
+                self.bm25.rebuild_from_chroma(self.vectorstore._collection)
+            except Exception:
+                pass
+
+        # ---- Reranker (lazy-loaded on first use) ----
+        self.enable_reranking = enable_reranking
+        self.reranker = Reranker() if enable_reranking else None
+
+    # ======================== DOCUMENT OPS ========================
+
+    def add_document(self, chunks: List[str], metadata: dict, user_id: str = "anonymous") -> int:
+        """Add document chunks to vector store + BM25 index."""
+        if not chunks:
+            return 0
+
+        docs = []
+        chunk_metas = []
+        for i, chunk in enumerate(chunks):
+            doc_id = hashlib.md5(
+                f"{metadata.get('filename', 'unknown')}_{i}_{chunk[:50]}".encode()
+            ).hexdigest()
+
+            doc_metadata = {
+                **metadata,
+                "user_id": user_id,
+                "chunk_index": i,
+                "total_chunks": len(chunks),
+                "doc_id": doc_id,
+            }
+            docs.append(Document(page_content=chunk, metadata=doc_metadata))
+            chunk_metas.append(doc_metadata)
+
+        # Add to vector store
+        self.vectorstore.add_documents(docs)
+
+        # Add to BM25 index
+        if self.enable_hybrid:
+            self.bm25.add(chunks, chunk_metas)
+
+        logger.info(f"Added {len(docs)} chunks for '{metadata.get('filename', '?')}'")
+        return len(docs)
+
+    def delete_document(self, filename: str, user_id: str = "anonymous"):
+        """Delete all chunks for a specific document considering user_id."""
+        try:
+            collection = self.vectorstore._collection
+            
+            if user_id == "anonymous":
+                # Try getting explicitly labeled anonymous docs
+                results = collection.get(where={"$and": [{"filename": filename}, {"user_id": user_id}]})
+                
+                # If none found, fallback to legacy docs that have no user_id
+                if not results or not results.get("ids"):
+                    all_file_docs = collection.get(where={"filename": filename})
+                    if all_file_docs and all_file_docs.get("ids"):
+                        legacy_ids = [ids for i, ids in enumerate(all_file_docs["ids"]) if "user_id" not in all_file_docs["metadatas"][i]]
+                        results = {"ids": legacy_ids}
+            else:
+                results = collection.get(where={"$and": [{"filename": filename}, {"user_id": user_id}]})
+                
+            if results and results.get("ids"):
+                collection.delete(ids=results["ids"])
+                # Rebuild BM25 index after deletion
+                if self.enable_hybrid:
+                    self.bm25.rebuild_from_chroma(collection)
+                return True
+            return False
+        except Exception as e:
+            logger.error(f"Error deleting document: {e}")
+            return False
+
+    # ======================== SEARCH ========================
+
+    def search(
+        self,
+        query: str,
+        k: int = 5,
+        filter_dict: Optional[dict] = None,
+        user_id: str = "anonymous"
+    ) -> List[Tuple[str, dict, float]]:
+        """
+        Advanced search pipeline:
+        1. Vector similarity search (semantic)
+        2. BM25 keyword search (lexical) — if hybrid enabled
+        3. Reciprocal Rank Fusion to merge results
+        4. Reranking with cross-encoder — if enabled
+        """
+        # Build ChromaDB-compatible filter with user_id
+        filter_dict = filter_dict or {}
+        if "user_id" not in filter_dict:
+            filter_dict["user_id"] = user_id
+        
+        # ChromaDB requires $and for multiple filter keys
+        if len(filter_dict) > 1:
+            chroma_filter = {"$and": [{k: v} for k, v in filter_dict.items()]}
+        else:
+            chroma_filter = filter_dict
+
+        # Step 1: Vector search
+        vector_results = self._vector_search(query, k=k * 2, filter_dict=chroma_filter)
+
+        # Step 2: BM25 keyword search (if enabled)
+        if self.enable_hybrid and self.bm25.is_ready:
+            bm25_results = self.bm25.search(query, k=k * 2, filter_dict=chroma_filter)
+
+            # Step 3: Fuse results with RRF
+            merged = reciprocal_rank_fusion(
+                [vector_results, bm25_results],
+                top_n=k * 2,
+            )
+        else:
+            merged = vector_results
+
+        # Step 4: Rerank (if enabled and model loaded)
+        if self.enable_reranking and self.reranker is not None:
+            if not self.reranker.is_ready:
+                self.reranker.load()
+            if self.reranker.is_ready:
+                merged = self.reranker.rerank(query, merged, top_k=k)
+            else:
+                merged = merged[:k]
+        else:
+            merged = merged[:k]
+
+        return merged
+
+    def _vector_search(
+        self, query: str, k: int = 10, filter_dict: Optional[dict] = None,
+    ) -> List[Tuple[str, dict, float]]:
+        """Pure vector similarity search."""
+        try:
+            results = self.vectorstore.similarity_search_with_score(
+                query, k=k, filter=filter_dict
+            )
+            return [
+                (doc.page_content, doc.metadata, score) for doc, score in results
+            ]
+        except Exception as e:
+            logger.warning(f"Vector search failed: {e}")
+            return []
+
+    def search_by_type(
+        self,
+        query: str,
+        doc_type: str,
+        k: int = 5,
+    ) -> List[Tuple[str, dict, float]]:
+        """Search filtered by document type (cv, job_offer, linkedin, other)."""
+        return self.search(query, k=k, filter_dict={"doc_type": doc_type})
+
+    # ======================== CONTEXT BUILDING ========================
+
+    def get_context(
+        self,
+        query: str,
+        k: int = 8,
+        filter_type: Optional[str] = None,
+        user_id: str = "anonymous"
+    ) -> str:
+        """Get formatted context string for LLM consumption."""
+        filter_dict = {"doc_type": filter_type} if filter_type else {}
+        # user_id will be injected by search() if not already present
+        results = self.search(query, k=k, filter_dict=filter_dict, user_id=user_id)
+
+        if not results:
+            return "⚠️ No se encontraron documentos relevantes. Por favor, sube tu CV u otros documentos primero."
+
+        context_parts = []
+        seen_content = set()
+
+        for content, metadata, score in results:
+            # Deduplicate similar chunks
+            content_hash = hashlib.md5(content[:100].encode()).hexdigest()
+            if content_hash in seen_content:
+                continue
+            seen_content.add(content_hash)
+
+            source = metadata.get("filename", "Desconocido")
+            doc_type = metadata.get("doc_type", "documento")
+
+            type_labels = {
+                "cv": "📋 CV/Resume",
+                "job_offer": "💼 Oferta de Trabajo",
+                "linkedin": "👤 LinkedIn",
+                "other": "📄 Documento",
+            }
+            type_label = type_labels.get(doc_type, "📄 Documento")
+
+            # Score display depends on search mode
+            score_str = f"{score:.3f}"
+
+            context_parts.append(
+                f"[{type_label} | Fuente: {source} | Score: {score_str}]\n{content}"
+            )
+
+        return "\n\n" + "─" * 50 + "\n\n".join(context_parts)
+
+    # ======================== STATS & UTILS ========================
+
+    def get_document_list(self, user_id: str = "anonymous") -> List[str]:
+        """Get list of all indexed document filenames for a user."""
+        try:
+            collection = self.vectorstore._collection
+            if user_id == "anonymous":
+                # For anonymous users, we get everything but could restrict it later. 
+                # For now, if "anonymous", just get the ones explicitly marked "anonymous"
+                results = collection.get(where={"user_id": user_id})
+                # If nothing found, it might be legacy (no user_id set), so get those too
+                if not results.get("ids"):
+                    all_docs = collection.get()
+                    results = {"metadatas": [m for m in all_docs.get("metadatas", []) if "user_id" not in m]}
+            else:
+                results = collection.get(where={"user_id": user_id})
+            
+            filenames = set()
+            for meta in results.get("metadatas", []):
+                if meta and "filename" in meta:
+                    filenames.add(meta["filename"])
+            return sorted(list(filenames))
+        except Exception:
+            return []
+
+    def get_stats(self, user_id: str = "anonymous") -> dict:
+        """Get vector store statistics for a user."""
+        try:
+            collection = self.vectorstore._collection
+            if user_id == "anonymous":
+                results = collection.get(where={"user_id": user_id})
+                if not results.get("ids"):
+                    all_docs = collection.get()
+                    results = {"ids": [ids for i, ids in enumerate(all_docs.get("ids", [])) if "user_id" not in all_docs.get("metadatas", [])[i]]}
+            else:
+                results = collection.get(where={"user_id": user_id})
+
+            count = len(results["ids"]) if results and results.get("ids") else 0
+            docs = self.get_document_list(user_id=user_id)
+            return {
+                "total_chunks": count,
+                "total_documents": len(docs),
+                "documents": docs,
+                "embedding_model": self.embedding_key,
+                "hybrid_search": self.enable_hybrid and self.bm25.is_ready,
+                "reranking": self.enable_reranking,
+            }
+        except Exception:
+            return {
+                "total_chunks": 0,
+                "total_documents": 0,
+                "documents": [],
+                "embedding_model": self.embedding_key,
+                "hybrid_search": False,
+                "reranking": False,
+            }
+
+    def get_all_text(self, user_id: str = "anonymous") -> str:
+        """Get all document text for a specific user (for full-context queries)."""
+        try:
+            collection = self.vectorstore._collection
+            results = collection.get(where={"user_id": user_id})
+            if results and results["documents"]:
+                return "\n\n".join(results["documents"])
+        except Exception:
+            pass
+        return ""
+
+    def get_documents_by_type(self) -> Dict[str, List[str]]:
+        """Get documents grouped by type."""
+        try:
+            collection = self.vectorstore._collection
+            results = collection.get()
+            by_type: Dict[str, List[str]] = {}
+            for meta in results.get("metadatas", []):
+                if meta:
+                    doc_type = meta.get("doc_type", "other")
+                    filename = meta.get("filename", "?")
+                    if doc_type not in by_type:
+                        by_type[doc_type] = []
+                    if filename not in by_type[doc_type]:
+                        by_type[doc_type].append(filename)
+            return by_type
+        except Exception:
+            return {}