diff --git a/.github/copilot-instructions.md b/AGENTS.md
similarity index 100%
rename from .github/copilot-instructions.md
rename to AGENTS.md
diff --git a/README.md b/README.md
index b39d783..a62305d 100644
--- a/README.md
+++ b/README.md
@@ -32,7 +32,7 @@ yarn install
 cp .env.example .env.local
 
 # 4. Get API keys (optional, but recommended)
-# See: docs/API_KEYS.md
+# See: [docs/02-tecnico/apis.md](docs/02-tecnico/apis.md)
 
 # 5. Run migrations
 cd backend
@@ -70,21 +70,33 @@ quasar/
 │  │  └── controllers/ # Request handlers
 │  └── tests/          # Vitest unit tests (63+ tests)
 │
-├── frontend/          # React + Vite + React Query
+├── frontend/          # React 18 + Vite + TypeScript + TanStack
 │  ├── src/
-│  │  ├── routes/      # Pages (/games, /roms, etc.)
-│  │  ├── components/  # React components (Forms, Dialogs, Cards)
-│  │  └── hooks/       # TanStack Query hooks
-│  └── tests/          # Vitest + React Testing Library (59+ tests)
+│  │  ├── components/  # shadcn/ui components + custom components
+│  │  ├── pages/       # Application pages (Dashboard, Games, etc.)
+│  │  ├── api/         # API services and types
+│  │  ├── query/       # TanStack Query configuration
+│  │  ├── form/        # TanStack Form + Zod configuration
+│  │  ├── router/      # TanStack Router configuration
+│  │  ├── types/       # TypeScript type definitions
+│  │  ├── hooks/       # Custom React hooks
+│  │  ├── lib/         # Utility functions
+│  │  ├── styles/      # Global styles and Tailwind config
+│  │  └── layout/      # Layout components (Header, Sidebar, etc.)
+│  ├── tests/          # Vitest + React Testing Library (59+ tests)
+│  ├── public/         # Static assets
+│  └── index.html      # HTML entry point
 │
 ├── tests/
 │  ├── e2e/           # Playwright E2E tests (15 tests)
 │  └── *.spec.ts      # Config validation tests
 │
 ├── docs/             # Documentation
-│  ├── API_KEYS.md    # How to get API credentials
-│  ├── SECURITY.md    # Security guidelines
-│  └── ...
+│  ├── README.md      # Documentation index
+│  ├── 01-conceptos/  # Fundamental concepts and requirements
+│  ├── 02-tecnico/   # Technical documentation
+│  ├── 03-analisis/  # Comparative analysis
+│  └── 04-operaciones/ # Operations and deployment
 │
 ├── .gitea/
 │  └── workflows/
@@ -103,7 +115,7 @@ Copy `.env.example` to `.env.local` (or `.env.development`) and fill in:
 # Database (local SQLite)
 DATABASE_URL="file:./dev.db"
 
-# API Keys (get from docs/API_KEYS.md)
+# API Keys (get from [docs/02-tecnico/apis.md](docs/02-tecnico/apis.md))
 IGDB_CLIENT_ID=your_client_id
 IGDB_CLIENT_SECRET=your_client_secret
 RAWG_API_KEY=your_api_key
@@ -115,10 +127,12 @@ PORT=3000
 LOG_LEVEL=debug
 ```
 
-For production, use Gitea Secrets. See **SECURITY.md** and **docs/API_KEYS.md**.
+For production, use Gitea Secrets. See **SECURITY.md** and **[docs/02-tecnico/apis.md](docs/02-tecnico/apis.md)**.
 
 ## Testing
 
+### General Tests
+
 ```bash
 # Run all tests (unit + config)
 yarn test
@@ -139,6 +153,97 @@ yarn lint
 yarn format
 ```
 
+### Frontend Development and Testing
+
+```bash
+# Navigate to frontend directory
+cd frontend
+
+# Install dependencies
+yarn install
+
+# Start development server
+yarn dev
+# Frontend will be available at: http://localhost:5173
+
+# Build for production
+yarn build
+
+# Preview production build
+yarn preview
+
+# Run frontend-specific tests
+yarn test
+
+# Run frontend tests with coverage
+yarn test:coverage
+
+# Lint frontend code
+yarn lint
+
+# Format frontend code
+yarn format
+
+# Type check frontend
+yarn type-check
+```
+
+### Backend Development and Testing
+
+```bash
+# Navigate to backend directory
+cd backend
+
+# Install dependencies
+yarn install
+
+# Start development server
+yarn dev
+# Backend API will be available at: http://localhost:3000
+
+# Run backend tests
+yarn test
+
+# Run backend tests with coverage
+yarn test:coverage
+
+# Run specific test file
+yarn test -- gamesController.spec.ts
+
+# Run tests in watch mode
+yarn test:watch
+
+# Lint backend code
+yarn lint
+
+# Format backend code
+yarn format
+
+# Type check backend
+yarn type-check
+
+# Database operations
+yarn prisma:migrate
+yarn prisma:generate
+yarn prisma:studio
+```
+
+### API Testing
+
+```bash
+# Test backend API endpoints
+curl http://localhost:3000/health
+
+# Test games endpoint
+curl http://localhost:3000/api/games
+
+# Test metadata search
+curl "http://localhost:3000/api/metadata/search?q=Mario"
+
+# Test ROM scanning
+curl -X POST http://localhost:3000/api/roms/scan -d '{"path":"/path/to/roms"}'
+```
+
 ## Troubleshooting
 
 ### Backend won't start
@@ -158,7 +263,7 @@ Error: EADDRINUSE: address already in use :::3000
 ### Metadata search returns no results
 
 ```
-→ Check that API keys are correct (docs/API_KEYS.md)
+→ Check that API keys are correct ([docs/02-tecnico/apis.md](docs/02-tecnico/apis.md))
 → Check logs: tail -f backend/logs/*.log
 → Test with: curl http://localhost:3000/api/metadata/search\?q\=Mario
 ```
@@ -172,12 +277,12 @@ Error: EADDRINUSE: address already in use :::3000
 
 ## Architecture
 
-For detailed architecture and decisions, see [docs/architecture.md](docs/architecture.md).
+For detailed architecture and decisions, see [docs/01-conceptos/architecture.md](docs/01-conceptos/architecture.md).
 
 ### Tech Stack
 
 - **Backend:** Node.js, Fastify, Prisma ORM, SQLite, TypeScript
-- **Frontend:** React 18, Vite, TanStack Query, Tailwind CSS, shadcn/ui
+- **Frontend:** React 18, Vite, TypeScript, TanStack Query, TanStack Router, TanStack Form, Zod, Tailwind CSS, shadcn/ui
 - **Testing:** Vitest (unit), Playwright (E2E)
 - **APIs:** IGDB (OAuth), RAWG, TheGamesDB
 
@@ -193,10 +298,13 @@ For security guidelines, see [SECURITY.md](SECURITY.md).
 ## Documentation
 
 - **[SECURITY.md](SECURITY.md)** — Security policies and best practices
-- **[docs/API_KEYS.md](docs/API_KEYS.md)** — How to obtain and configure API credentials
-- **[docs/architecture.md](docs/architecture.md)** — System architecture and design decisions
-- **[docs/data-model.md](docs/data-model.md)** — Database schema and entities
-- **[docs/requirements.md](docs/requirements.md)** — Project requirements and use cases
+- **[docs/README.md](docs/README.md)** — Documentation index and navigation guide
+- **[docs/01-conceptos/requirements.md](docs/01-conceptos/requirements.md)** — Project requirements and use cases
+- **[docs/01-conceptos/architecture.md](docs/01-conceptos/architecture.md)** — System architecture and design decisions
+- **[docs/01-conceptos/data-model.md](docs/01-conceptos/data-model.md)** — Database schema and entities
+- **[docs/02-tecnico/apis.md](docs/02-tecnico/apis.md)** — APIs configuration and integration guide
+- **[docs/02-tecnico/frontend.md](docs/02-tecnico/frontend.md)** — Complete frontend architecture and implementation
+- **[docs/03-analisis/competitive-analysis.md](docs/03-analisis/competitive-analysis.md)** — Market analysis and competitive research
 
 ## Development
 
@@ -251,6 +359,7 @@ MIT (or choose your license)
 
 ---
 
-**Status:** MVP (v1.0.0) — Ready for self-hosted deployment.  
-**Last updated:** 2026-02-12  
+**Status:** MVP (v1.0.0) — Ready for self-hosted deployment.
+**Last updated:** 2026-02-22
 **Test coverage:** 122+ unit tests + 15 E2E tests ✅
+**Documentation:** Reorganized and consolidated ✅
diff --git a/docs/architecture.md b/docs/01-conceptos/architecture.md
similarity index 100%
rename from docs/architecture.md
rename to docs/01-conceptos/architecture.md
diff --git a/docs/data-model.md b/docs/01-conceptos/data-model.md
similarity index 100%
rename from docs/data-model.md
rename to docs/01-conceptos/data-model.md
diff --git a/docs/requirements.md b/docs/01-conceptos/requirements.md
similarity index 100%
rename from docs/requirements.md
rename to docs/01-conceptos/requirements.md
diff --git a/docs/apis-comparison.md b/docs/02-tecnico/apis.md
similarity index 52%
rename from docs/apis-comparison.md
rename to docs/02-tecnico/apis.md
index 674f418..ac11a5d 100644
--- a/docs/apis-comparison.md
+++ b/docs/02-tecnico/apis.md
@@ -1,15 +1,222 @@
-# Comparativa de APIs — cobertura, límites, coste y calidad
+# APIs del Sistema — Guía completa
 
-**Introducción**
-Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots, géneros, desarrolladores), y datos de precio/ofertas. Las decisiones de integración deben priorizar cobertura, coste (preferencia: gratuito), calidad y facilidad de uso.
-
-**Nota:** límites y condiciones pueden cambiar — verificar TOS antes de integración.
+Este documento integra toda la información sobre APIs del sistema: obtención de claves, prioridades, estrategias, comparación y configuración.
 
 ---
 
-## Resumen por API
+## Tabla de Contenidos
 
-### IGDB (Internet Games Database)
+1. [APIs priorizadas (MVP)](#apis-priorizadas-mvp)
+2. [Obtención de claves](#obtención-de-claves)
+3. [Guía de integración](#guía-de-integración)
+4. [Comparación detallada](#comparación-detallada)
+5. [Estrategias técnicas](#estrategias-técnicas)
+6. [Configuración y despliegue](#configuración-y-despliegue)
+
+---
+
+## APIs priorizadas (MVP)
+
+### Prioridad Alta
+
+1. **IGDB (Internet Game Database)** - Calidad superior, amplia cobertura
+2. **RAWG (Rawg.io)** - Buena cobertura, datos de tiendas
+
+### Prioridad Media
+
+3. **TheGamesDB** - Artwork comunitario
+4. **ScreenScraper** - Media específica para ROMs
+
+### Prioridad Baja (para futuras versiones)
+
+5. **PriceCharting** - Precios físicos
+6. **IsThereAnyDeal** - Ofertas digitales
+7. **MobyGames** - Datos históricos detallados
+8. **eBay** - Datos de mercado
+
+---
+
+## Obtención de claves
+
+### IGDB (Internet Game Database)
+
+IGDB usa **OAuth 2.0 via Twitch**. Steps:
+
+1. Go to [Twitch Developer Console](https://dev.twitch.tv/console/apps)
+2. Sign in with your Twitch account (create one if needed)
+3. Click "Create Application"
+   - Name: "Quasar" (or your app name)
+   - Category: Select relevant category
+   - Accept terms, click Create
+4. You'll see:
+   - **Client ID** — Copy this
+   - Click "New Secret" to generate **Client Secret** — Copy this
+5. Go to Settings → OAuth Redirect URLs
+   - Add: `http://localhost:3000/oauth/callback` (development)
+   - For production: `https://yourdomain.com/oauth/callback`
+6. In your `.env` file:
+   ```
+   IGDB_CLIENT_ID=your_client_id
+   IGDB_CLIENT_SECRET=your_client_secret
+   ```
+7. Start Quasar, it will use IGDB automatically
+
+**Rate Limit:** 4 requests/second
+
+### RAWG (Rawg.io)
+
+RAWG has a simpler **API Key** approach:
+
+1. Go to [RAWG Settings](https://rawg.io/settings/account)
+2. Sign up if needed, then login
+3. Find "API Key" section
+4. Click "Create new key" (if needed) or copy existing key
+5. In your `.env` file:
+   ```
+   RAWG_API_KEY=your_api_key_here
+   ```
+6. Start Quasar
+
+**Rate Limit:** 20 requests/second (free tier)
+
+**Note:** RAWG requires attribution in UI (include "Powered by RAWG" somewhere visible)
+
+### TheGamesDB (thegamesdb.net)
+
+TheGamesDB uses a simple **API Key**:
+
+1. Go to [TheGamesDB API](https://thegamesdb.net/api)
+2. Find "API Key" section (free registration required)
+3. Register or login
+4. Copy your API key
+5. In your `.env` file:
+   ```
+   THEGAMESDB_API_KEY=your_api_key_here
+   ```
+6. Start Quasar
+
+**Rate Limit:** 1 request/second (free tier)
+
+### ScreenScraper
+
+ScreenScraper requiere cuenta y modelo de donación:
+
+1. Go to [ScreenScraper](https://www.screenscraper.fr/)
+2. Create account
+3. Niveles de donación ofrecen límites distintos (ej.: 50.000 scrapes/día en nivel Bronze)
+4. En tu `.env` file:
+   ```
+   SCREENSCRAPER_USERNAME=your_username
+   SCREENSCRAPER_PASSWORD=your_password
+   ```
+
+---
+
+## Guía de integración
+
+### IGDB
+
+- **Obtener credenciales**: registrar una app en Twitch Developer Console para obtener `CLIENT_ID` y `CLIENT_SECRET`. Obtener token con grant type `client_credentials` (POST a `https://id.twitch.tv/oauth2/token`).
+
+- **Endpoints principales**: `POST https://api.igdb.com/v4/games` (consulta flexible via body con sintaxis IGDB), `POST https://api.igdb.com/v4/covers`, `POST https://api.igdb.com/v4/platforms`.
+
+- **Ejemplo (buscar)**:
+
+```bash
+# Obtener token
+curl -X POST 'https://id.twitch.tv/oauth2/token?client_id=$IGDB_CLIENT_ID&client_secret=$IGDB_CLIENT_SECRET&grant_type=client_credentials'
+
+# Buscar juegos
+curl -X POST 'https://api.igdb.com/v4/games' \
+  -H "Client-ID: $IGDB_CLIENT_ID" \
+  -H "Authorization: Bearer $IGDB_TOKEN" \
+  -H 'Accept: application/json' \
+  --data 'fields id,name,first_release_date,platforms.name,genres.name,cover.url; search "zelda"; limit 5;'
+```
+
+- **Respuesta (esquemática)**:
+
+```json
+[
+  {
+    "id": 12345,
+    "name": "Ejemplo",
+    "first_release_date": 1459468800,
+    "platforms": [{ "name": "Nintendo Switch" }],
+    "cover": { "url": "//images.igdb.com/...jpg" }
+  }
+]
+```
+
+- **Límites y manejo**: la API puede devolver `429` o cabeceras de límite; implementar retries exponenciales (ej. 3 intentos) y respetar `Retry-After`. Implementar circuit breaker si la API falla repetidamente.
+- **Atribución**: mostrar origen de datos (ej. "Datos: IGDB") según términos del servicio.
+
+### RAWG
+
+- **Obtener credenciales**: registrarse en RAWG para obtener `RAWG_API_KEY` (https://rawg.io/apidocs).
+- **Endpoints principales**: `GET https://api.rawg.io/api/games?key=API_KEY&search=...`, `GET https://api.rawg.io/api/games/{id}`.
+- **Ejemplo**:
+
+```bash
+curl 'https://api.rawg.io/api/games?key=$RAWG_API_KEY&search=zelda&page_size=5'
+```
+
+- **Respuesta (esquemática)**:
+
+```json
+{
+  "count": 100,
+  "results": [
+    { "id": 3498, "name": "GTA V", "released": "2013-09-17", "background_image": "https://..." }
+  ]
+}
+```
+
+- **Límites y manejo**: RAWG suele tener límites por clave/plan; cachear y fallback a otros proveedores si falla.
+- **Atribución**: revisar condiciones y mostrar HTTP o texto de fuente si es requerido por el proveedor.
+
+### TheGamesDB
+
+- **Obtener credenciales**: crear cuenta y generar API Key en https://thegamesdb.net.
+- **Endpoints**: búsqueda por nombre y detalles (`/v1/Games/ByGameName?name=...`, `/v1/Games/ByGameID?id=...`).
+- **Ejemplo**:
+
+```bash
+curl -H 'Authorization: Bearer $THEGAMESDB_KEY' 'https://api.thegamesdb.net/v1/Games/ByGameName?name=zelda'
+```
+
+### Estrategia de fallback y normalización
+
+- **Orden de prioridad**: IGDB → RAWG → TheGamesDB (configurable).
+- **Normalización (mapping)**:
+  - `title` ← `name`
+  - `platform` ← `platforms[].name`
+  - `release_date` ← `first_release_date` / `released` → convertir a ISO 8601
+  - `genres` ← `genres[].name`
+  - `cover_url` ← `cover.url` / `background_image`
+  - `external_ids` ← `{ igdb: id, rawg: id, thegamesdb: id }`
+
+- **Fallback**: si IGDB no tiene portada, intentar RAWG; si falla, usar TheGamesDB. Registrar la fuente usada.
+
+### Caché y almacenamiento de artwork
+
+- **Caché metadata**: LRU en memoria o Redis con TTL (por ejemplo 24h) para evitar sobrecargar APIs.
+- **Almacenamiento de imágenes**: descargar y optimizar con `sharp` (crear versiones: thumb, medium), almacenar en `storage/artwork/{gameId}/cover.jpg` o S3.
+- **Servicio proxy**: servir imágenes desde backend para no exponer keys ni URLs externas.
+
+### Manejo de errores y resiliencia
+
+- Implementar **retries** exponenciales con jitter (3 intentos).
+- Implementar **circuit breaker** para desconectar llamadas a un proveedor fuera de servicio por N minutos.
+- Limitar concurrencia por proveedor (p. ej. 5 llamadas simultáneas) y usar colas para trabajos masivos (enriquecimiento masivo).
+
+---
+
+## Comparación detallada
+
+### Resumen por API
+
+#### IGDB (Internet Games Database)
 
 - **Resumen:** Base de datos muy completa (propiedad de Twitch/Amazon) con endpoints para juegos, covers, screenshots, plataformas, ratings, compañías y más.
 - **Autenticación / Requisitos:** OAuth vía Twitch (Client ID + Client Secret → token) — requiere cuenta Twitch y 2FA para registrar apps.
@@ -21,9 +228,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Gratuito para uso no comercial; acuerdos comerciales para partners (atribución en caso de partnership).
 - **Enlace:** https://api-docs.igdb.com/
 
----
-
-### RAWG
+#### RAWG
 
 - **Resumen:** Gran base de datos (medio millón de juegos), buena para metadata general y enlaces a tiendas.
 - **Autenticación / Requisitos:** API key en query string (`key=YOUR_API_KEY`).
@@ -35,9 +240,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Free tier para proyectos personales; planes comerciales (pago mensual) para uso en productos con gran tráfico.
 - **Enlace:** https://rawg.io/apidocs
 
----
-
-### TheGamesDB
+#### TheGamesDB
 
 - **Resumen:** Base de datos comunitaria para juegos y artwork, con API pública v2.
 - **Autenticación / Requisitos:** Registro y uso de API key (ver docs); repositorio público del proyecto (GPLv3 para el código del servidor).
@@ -48,9 +251,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Cláusula clave:** No documentado públicamente — verificar con el equipo de TheGamesDB antes de uso comercial/redistribución.
 - **Enlace:** https://api.thegamesdb.net/
 
----
-
-### ScreenScraper
+#### ScreenScraper
 
 - **Resumen:** Servicio francés orientado a frontends, con enorme cantidad de media y opciones de scraping.
 - **Autenticación / Requisitos:** Cuenta en ScreenScraper; modelo de soporte/donación que habilita límites mayores.
@@ -62,9 +263,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Donación / suscripción para aumentar cuotas y velocidad.
 - **Enlace:** https://www.screenscraper.fr/
 
----
-
-### MobyGames
+#### MobyGames
 
 - **Resumen:** Base histórica con screenshots, covers, reviews y credits; muy usada por investigación y metadata profunda.
 - **Autenticación / Requisitos:** API y/o MobyPlus; la API requiere registro y suscripción.
@@ -76,9 +275,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Acceso vía suscripción / MobyPro; contactar para condiciones comerciales.
 - **Enlace:** https://www.mobygames.com/api/subscribe/
 
----
-
-### PriceCharting
+#### PriceCharting
 
 - **Resumen:** Fuente especializada en historial de precios para juegos físicos y coleccionables.
 - **Autenticación / Requisitos:** API documentada en el sitio; el acceso completo requiere suscripción / token pagado.
@@ -90,9 +287,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Servicio comercial (licencias / API keys pagadas).
 - **Enlace:** https://www.pricecharting.com/api-documentation
 
----
-
-### IsThereAnyDeal (Itad)
+#### IsThereAnyDeal (Itad)
 
 - **Resumen:** Agregador de ofertas con histórico y mapeo de keys/tiendas; útil para tracking de ofertas digitales.
 - **Autenticación / Requisitos:** API Key (docs en https://docs.isthereanydeal.com/).
@@ -104,9 +299,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Free tier; acuerdos comerciales para uso intensivo.
 - **Enlace:** https://docs.isthereanydeal.com/
 
----
-
-### eBay
+#### eBay
 
 - **Resumen:** Fuente de datos de mercado (listings, precios vendidos) para estimar valor real de mercado.
 - **Autenticación / Requisitos:** Registro en eBay Developers Program; claves y OAuth para endpoints de venta/completed items.
@@ -118,9 +311,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 - **Costes / modelo:** Free para desarrolladores con límites; uso intensivo o comerciales pueden requerir acuerdos o certificaciones.
 - **Enlace:** https://developer.ebay.com/
 
----
-
-## Tabla resumida
+### Tabla resumida
 
 | API            | Data types                                              | Auth                             | Free / Paid                                | Fecha verificación | Licencia / Nota legal                                                                                   | Notes                                                          |
 | -------------- | ------------------------------------------------------- | -------------------------------- | ------------------------------------------ | ------------------ | ------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------- |
@@ -133,9 +324,7 @@ Comparar APIs públicas y comerciales que aportan metadatos (covers, screenshots
 | MobyGames      | screenshots, credits, covers                            | Subscribe / API key              | Paid / subscription                        | 2026-02-07         | Paid/Subscribe: https://www.mobygames.com/api/subscribe/                                                | Access via subscription; non-commercial rate limits documented |
 | eBay           | listings, sold data                                     | eBay Dev keys / OAuth            | Free (with limits)                         | 2026-02-07         | TOS: https://developer.ebay.com/                                                                        | Terms restrict distribution; API License Agreement             |
 
----
-
-## Conclusión y recomendación para MVP
+### Conclusión y recomendación para MVP
 
 Recomiendo un **set inicial de APIs (priorizado)**: **IGDB, RAWG, TheGamesDB, ScreenScraper, PriceCharting, IsThereAnyDeal.**
 
@@ -144,13 +333,171 @@ Recomiendo un **set inicial de APIs (priorizado)**: **IGDB, RAWG, TheGamesDB, Sc
 
 ---
 
-## Vacíos y verificación pendiente
+## Estrategias técnicas
 
-- **APIs que requieren suscripción / acuerdos comerciales:** PriceCharting (API premium, requiere suscripción), MobyGames (MobyPro/API requiere suscripción), EmuMovies (servicio comercial con TOS y cuentas), y en casos especiales eBay (certificaciones / acuerdos adicionales para ciertos permisos).
-- **PriceCharting:** la documentación de la API existe pero el acceso completo está sujeto a registro/pago; no se publicó límite público durante la verificación.
-- **MobyGames:** API y límites requieren suscripción/registro; hay que contactar para condiciones comerciales.
-- **eBay:** múltiples APIs y límites por endpoint; requiere revisar caso de uso específico y cumplimiento del API License Agreement.
-- **Notas:** Algunas APIs (ScreenScraper) usan modelos por donación/premium para aumentar cuotas; en APIs sin límites públicos, contactar al proveedor para confirmar condiciones.
+### Variables de entorno (ejemplos)
+
+```
+IGDB_CLIENT_ID=...
+IGDB_CLIENT_SECRET=...
+RAWG_API_KEY=...
+THEGAMESDB_API_KEY=...
+SCREENSCRAPER_USERNAME=...
+SCREENSCRAPER_PASSWORD=...
+EXTERNAL_API_CONCURRENCY=5
+```
+
+> Nota: **Nunca** exponer estas claves en el cliente; siempre pasar por el backend.
+
+### Normalización de datos
+
+```typescript
+interface NormalizedGame {
+  title: string;
+  platform: string;
+  release_date: string; // ISO 8601
+  genres: string[];
+  cover_url: string;
+  external_ids: {
+    igdb?: string;
+    rawg?: string;
+    thegamesdb?: string;
+  };
+  source: 'igdb' | 'rawg' | 'thegamesdb' | 'screenscraper';
+}
+```
+
+### Ejemplo de implementación
+
+```typescript
+class MetadataService {
+  private apis = [
+    new IGDBService(),
+    new RAWGService(),
+    new TheGamesDBService(),
+    new ScreenScraperService(),
+  ];
+
+  async searchGame(title: string): Promise<NormalizedGame> {
+    for (const api of this.apis) {
+      try {
+        const result = await api.search(title);
+        if (result) {
+          return this.normalize(result, api.getSource());
+        }
+      } catch (error) {
+        console.warn(`${api.getSource()} failed:`, error);
+        continue;
+      }
+    }
+    throw new Error('All APIs failed');
+  }
+
+  private normalize(data: any, source: string): NormalizedGame {
+    return {
+      title: data.name || data.title,
+      platform: data.platforms?.[0]?.name || '',
+      release_date: this.normalizeDate(data.first_release_date || data.released),
+      genres: data.genres?.map((g: any) => g.name) || [],
+      cover_url: data.cover?.url || data.background_image || '',
+      external_ids: {
+        igdb: data.id,
+        rawg: data.id,
+        thegamesdb: data.id,
+      },
+      source: source as any,
+    };
+  }
+}
+```
+
+---
+
+## Configuración y despliegue
+
+### Testing Without Real Keys
+
+Para desarrollo/testing:
+
+- Dejar API keys como `your_*_here` en `.env.local`
+- Quasar will gracefully degrade and show limited metadata
+- Frontend will still work with manual game entry
+
+### Production Deployment
+
+Para producción:
+
+1. Generar nuevas claves en cada servicio (no reutilizar claves de desarrollo)
+2. Almacenar claves en **Gitea Secrets** (para pipelines CI/CD automatizados)
+3. O usar variables de entorno en tu proveedor de hosting
+4. Rotar claves cada 3 meses
+5. Monitorear límites de rate en los dashboards de los servicios
+
+### Gitea Actions CI/CD Setup
+
+Para habilitar pruebas automatizadas con API keys en Gitea Actions:
+
+#### 1. Store Secrets in Gitea
+
+Navigate to your repository settings:
+
+```
+https://your-gitea-instance/your-org/quasar/settings/secrets/actions
+```
+
+Add these secrets:
+
+- `IGDB_CLIENT_ID` (from Twitch Developer Console)
+- `IGDB_CLIENT_SECRET` (from Twitch Developer Console)
+- `RAWG_API_KEY` (from RAWG settings)
+- `THEGAMESDB_API_KEY` (from TheGamesDB API)
+- `SCREENSCRAPER_USERNAME` (from ScreenScraper)
+- `SCREENSCRAPER_PASSWORD` (from ScreenScraper)
+
+#### 2. Workflow Configuration
+
+The `.gitea/workflows/ci.yml` workflow automatically:
+
+- ✅ Installs dependencies
+- ✅ Runs linting checks
+- ✅ Executes backend tests (Vitest)
+- ✅ Executes frontend tests (Vitest)
+- ✅ Starts backend + frontend servers
+- ✅ Runs E2E tests (Playwright) with real metadata APIs
+- ✅ Uploads test reports on failure
+
+#### 3. Testing Flow
+
+1. **Push** code to `main` or `develop`
+2. **Gitea Actions** picks up the `.gitea/workflows/ci.yml`
+3. **Secrets are injected** as environment variables
+4. **E2E tests** fetch real metadata from APIs (using injected secrets)
+5. **Build fails** if any test fails (prevents broken code)
+
+#### 4. Local Development
+
+For local testing, use `.env.local`:
+
+```bash
+IGDB_CLIENT_ID=your_local_id
+IGDB_CLIENT_SECRET=your_local_secret
+RAWG_API_KEY=your_local_key
+THEGAMESDB_API_KEY=your_local_key
+SCREENSCRAPER_USERNAME=your_username
+SCREENSCRAPER_PASSWORD=your_password
+```
+
+**Note:** CI/CD uses Gitea Secrets (not `.env` files), so never commit real credentials.
+
+### Troubleshooting
+
+**"IGDB_CLIENT_ID not found"** → Check `.env` file exists and has correct format
+
+**"429 Too Many Requests"** → Rate limit exceeded, wait and retry
+
+**"Invalid API Key"** → Copy key exactly (no spaces), verify it's active on service website
+
+**"ScreenScraper authentication failed"** → Check donation level and account status
 
 ---
 
diff --git a/docs/02-tecnico/frontend.md b/docs/02-tecnico/frontend.md
new file mode 100644
index 0000000..f9dce59
--- /dev/null
+++ b/docs/02-tecnico/frontend.md
@@ -0,0 +1,1195 @@
+# Frontend de Quasar 🎮
+
+## Visión general
+
+El frontend de Quasar es una Single Page Application (SPA) moderna construida con React + Vite, utilizando shadcn/ui para componentes UI y Tailwind CSS para estilos. La aplicación está diseñada con una estética de modo oscuro sofisticada, priorizando la accesibilidad, la responsividad y un excelente rendimiento.
+
+### Stack tecnológico
+
+| Categoría      | Tecnología      | Versión  | Propósito                          |
+| -------------- | --------------- | -------- | ---------------------------------- |
+| Framework      | React           | ^18.3.0  | Framework base                     |
+| Build tool     | Vite            | ^5.0.0   | Build tool y dev server            |
+| Lenguaje       | TypeScript      | ^5.3.0   | Type safety                        |
+| Estado         | TanStack Query  | ^5.0.0   | Gestión de estado y cache de datos |
+| Routing        | TanStack Router | ^1.0.0   | Routing con carga de datos         |
+| Formularios    | TanStack Form   | ^0.0.0   | Manejo de formularios              |
+| Validación     | Zod             | ^3.0.0   | Validación de esquemas             |
+| Componentes UI | shadcn/ui       | latest   | Componentes UI reutilizables       |
+| Estilos        | Tailwind CSS    | ^3.4.0   | Framework de estilos               |
+| Iconos         | lucide-react    | ^0.300.0 | Iconos                             |
+| HTTP           | axios           | latest   | Cliente HTTP                       |
+| Fechas         | date-fns        | latest   | Manipulación de fechas             |
+| Utils          | clsx            | ^2.0.0   | Utilidad de clases condicionales   |
+| Utils          | tailwind-merge  | ^2.0.0   | Fusión de clases Tailwind          |
+
+## Arquitectura del sistema
+
+### Diagrama de arquitectura
+
+```mermaid
+graph TB
+    subgraph Browser
+        UI[Componentes UI]
+        Router[TanStack Router]
+        Query[TanStack Query]
+        Forms[TanStack Form + Zod]
+    end
+
+    subgraph Services
+        API[API Client]
+        Auth[Auth Service]
+    end
+
+    UI --> Router
+    UI --> Query
+    UI --> Forms
+    Router --> Query
+    Query --> API
+    Forms --> Query
+
+    API --> Backend[Backend API]
+
+    style UI fill:#1e293b
+    style Router fill:#334155
+    style Query fill:#334155
+    style Forms fill:#334155
+    style API fill:#475569
+    style Backend fill:#64748b
+```
+
+### Estructura de carpetas
+
+```
+frontend/
+├── src/
+│   ├── components/
+│   │   ├── ui/              # Componentes shadcn/ui
+│   │   ├── layout/          # Componentes de layout
+│   │   ├── games/           # Componentes específicos de juegos
+│   │   ├── roms/            # Componentes específicos de ROMs
+│   │   ├── shared/          # Componentes compartidos
+│   │   └── ...              # Otros componentes específicos
+│   ├── pages/               # Páginas de la aplicación
+│   │   ├── DashboardPage.tsx
+│   │   ├── GamesPage.tsx
+│   │   ├── GameDetailPage.tsx
+│   │   ├── GamesNewPage.tsx
+│   │   ├── ImportPage.tsx
+│   │   ├── PlatformsPage.tsx
+│   │   ├── TagsPage.tsx
+│   │   ├── SettingsPage.tsx
+│   │   └── ExportPage.tsx
+│   ├── api/                 # Servicios de API y tipos
+│   │   ├── client.ts        # Cliente HTTP base
+│   │   ├── games.ts         # Servicios de juegos
+│   │   ├── platforms.ts     # Servicios de plataformas
+│   │   ├── tags.ts          # Servicios de etiquetas
+│   │   ├── import.ts        # Servicios de importación
+│   │   ├── settings.ts      # Servicios de configuración
+│   │   └── types.ts         # Tipos de API
+│   ├── query/               # Configuración de TanStack Query
+│   │   └── client.tsx       # Cliente de Query
+│   ├── form/                # Configuración de TanStack Form
+│   │   └── config.tsx        # Configuración de Form + Zod
+│   ├── router/              # Configuración de TanStack Router
+│   │   └── router.tsx       # Configuración del router
+│   ├── types/               # Definiciones TypeScript
+│   │   └── index.ts         # Tipos globales
+│   ├── hooks/               # Custom hooks
+│   ├── lib/                 # Utilidades y configuraciones
+│   │   ├── utils.ts         # Utilidades generales
+│   │   └── ...              # Otras utilidades
+│   ├── styles/              # Estilos globales
+│   │   └── globals.css      # CSS global con variables
+│   └── layout/              # Componentes de layout
+│       ├── Header.tsx       # Header principal
+│       ├── Sidebar.tsx      # Sidebar de navegación
+│       └── Layout.tsx       # Layout principal
+├── public/                  # Assets estáticos
+├── index.html              # HTML entry point
+├── package.json            # Dependencias y scripts
+├── tsconfig.json           # Configuración TypeScript
+├── vite.config.ts          # Configuración Vite
+├── tailwind.config.ts      # Configuración Tailwind
+└── postcss.config.js       # Configuración PostCSS
+```
+
+## Sistema de diseño
+
+### Principios de diseño
+
+1. **Modo oscuro por defecto**: La aplicación está diseñada para funcionar principalmente en modo oscuro
+2. **Alto contraste**: Asegurar legibilidad excelente en todos los contextos
+3. **Consistencia**: Componentes y patrones consistentes en toda la aplicación
+4. **Accesibilidad**: Cumplimiento con WCAG AA
+5. **Performance**: Componentes optimizados para rendimiento
+6. **Responsividad**: Mobile-first con breakpoints claros
+
+### Paleta de colores (Modo oscuro)
+
+#### Colores semánticos
+
+```css
+/* Primary - Violet (Acción principal) */
+--primary-50: #f5f3ff;
+--primary-100: #ede9fe;
+--primary-200: #ddd6fe;
+--primary-300: #c4b5fd;
+--primary-400: #a78bfa;
+--primary-500: #8b5cf6;
+--primary-600: #7c3aed; /* Color principal */
+--primary-700: #6d28d9;
+--primary-800: #5b21b6;
+--primary-900: #4c1d95;
+--primary-950: #2e1065;
+
+/* Secondary - Slate (Acciones secundarias) */
+--secondary-50: #f8fafc;
+--secondary-100: #f1f5f9;
+--secondary-200: #e2e8f0;
+--secondary-300: #cbd5e1;
+--secondary-400: #94a3b8;
+--secondary-500: #64748b;
+--secondary-600: #475569;
+--secondary-700: #334155;
+--secondary-800: #1e293b;
+--secondary-900: #0f172a;
+--secondary-950: #020617;
+
+/* Success - Emerald (Estados positivos) */
+--success-50: #ecfdf5;
+--success-100: #d1fae5;
+--success-200: #a7f3d0;
+--success-300: #6ee7b7;
+--success-400: #34d399;
+--success-500: #10b981;
+--success-600: #059669;
+--success-700: #047857;
+--success-800: #065f46;
+--success-900: #064e3b;
+--success-950: #022c22;
+
+/* Warning - Amber (Estados de advertencia) */
+--warning-50: #fffbeb;
+--warning-100: #fef3c7;
+--warning-200: #fde68a;
+--warning-300: #fcd34d;
+--warning-400: #fbbf24;
+--warning-500: #f59e0b;
+--warning-600: #d97706;
+--warning-700: #b45309;
+--warning-800: #92400e;
+--warning-900: #78350f;
+--warning-950: #451a03;
+
+/* Error - Red (Estados de error) */
+--error-50: #fef2f2;
+--error-100: #fee2e2;
+--error-200: #fecaca;
+--error-300: #fca5a5;
+--error-400: #f87171;
+--error-500: #ef4444;
+--error-600: #dc2626;
+--error-700: #b91c1c;
+--error-800: #991b1b;
+--error-900: #7f1d1d;
+--error-950: #450a0a;
+
+/* Info - Sky (Información) */
+--info-50: #f0f9ff;
+--info-100: #e0f2fe;
+--info-200: #bae6fd;
+--info-300: #7dd3fc;
+--info-400: #38bdf8;
+--info-500: #0ea5e9;
+--info-600: #0284c7;
+--info-700: #0369a1;
+--info-800: #075985;
+--info-900: #0c4a6e;
+--info-950: #082f49;
+```
+
+#### Uso de colores
+
+| Propósito      | Color      | Hex     |
+| -------------- | ---------- | ------- |
+| Background     | Slate-950  | #020617 |
+| Card           | Slate-950  | #020617 |
+| Card hover     | Slate-900  | #0f172a |
+| Border         | Slate-800  | #1e293b |
+| Primary action | Violet-600 | #7c3aed |
+| Primary hover  | Violet-700 | #6d28d9 |
+| Text primary   | Slate-50   | #f8fafc |
+| Text secondary | Slate-400  | #94a3b8 |
+| Text muted     | Slate-500  | #64748b |
+
+### Tipografía
+
+#### Font family
+
+```css
+font-family:
+  'Inter',
+  system-ui,
+  -apple-system,
+  sans-serif;
+```
+
+#### Escala de tamaños
+
+| Token     | Tamaño | Line-height | Uso                       |
+| --------- | ------ | ----------- | ------------------------- |
+| text-xs   | 12px   | 16px        | Labels pequeños, captions |
+| text-sm   | 14px   | 20px        | Texto secundario          |
+| text-base | 16px   | 24px        | Texto de cuerpo           |
+| text-lg   | 18px   | 28px        | Texto de cuerpo grande    |
+| text-xl   | 20px   | 28px        | Subtítulos                |
+| text-2xl  | 24px   | 32px        | Títulos pequeños          |
+| text-3xl  | 30px   | 40px        | Títulos medianos          |
+| text-4xl  | 36px   | 44px        | Títulos grandes           |
+| text-5xl  | 48px   | 56px        | Display                   |
+
+#### Font weights
+
+| Token         | Weight | Uso              |
+| ------------- | ------ | ---------------- |
+| font-normal   | 400    | Texto de cuerpo  |
+| font-medium   | 500    | Texto de énfasis |
+| font-semibold | 600    | Subtítulos       |
+| font-bold     | 700    | Títulos          |
+
+### Espaciado
+
+#### Escala de espaciado (base 4px)
+
+| Token      | Valor | Uso                          |
+| ---------- | ----- | ---------------------------- |
+| p-0, m-0   | 0px   | Sin espaciado                |
+| p-1, m-1   | 4px   | Micro espaciado              |
+| p-2, m-2   | 8px   | Espaciado pequeño            |
+| p-3, m-3   | 12px  | Espaciado medio-pequeño      |
+| p-4, m-4   | 16px  | Espaciado medio              |
+| p-5, m-5   | 20px  | Espaciado medio-grande       |
+| p-6, m-6   | 24px  | Espaciado grande             |
+| p-8, m-8   | 32px  | Espaciado extra grande       |
+| p-10, m-10 | 40px  | Espaciado extra extra grande |
+| p-12, m-12 | 48px  | Espaciado masivo             |
+
+## Rutas de la aplicación
+
+### Diagrama de rutas
+
+```mermaid
+graph LR
+    A[/] --> B[Dashboard]
+    C[/games] --> D[Lista de juegos]
+    E[/games/:id] --> F[Detalle de juego]
+    G[/games/new] --> H[Crear juego]
+    I[/import] --> J[Importar ROMs]
+    K[/platforms] --> L[Gestión de plataformas]
+    M[/tags] --> N[Gestión de etiquetas]
+    O[/settings] --> P[Configuración]
+    Q[/export] --> R[Exportar/Importar]
+
+    style A fill:#7c3aed
+    style C fill:#7c3aed
+    style E fill:#7c3aed
+    style G fill:#7c3aed
+    style I fill:#7c3aed
+    style K fill:#7c3aed
+    style M fill:#7c3aed
+    style O fill:#7c3aed
+    style Q fill:#7c3aed
+```
+
+### Descripción de rutas
+
+| Ruta         | Componente     | Descripción                                             |
+| ------------ | -------------- | ------------------------------------------------------- |
+| `/`          | Dashboard      | Vista general con estadísticas y juegos recientes       |
+| `/games`     | GamesPage      | Lista paginada de juegos con filtros y búsqueda         |
+| `/games/:id` | GameDetailPage | Vista detallada de un juego con metadata, ROMs, compras |
+| `/games/new` | GamesNewPage   | Formulario para crear un nuevo juego                    |
+| `/import`    | ImportPage     | Interfaz para escanear e importar ROMs locales          |
+| `/platforms` | PlatformsPage  | Gestión de plataformas                                  |
+| `/tags`      | TagsPage       | Gestión de etiquetas                                    |
+| `/settings`  | SettingsPage   | Configuración de la aplicación                          |
+| `/export`    | ExportPage     | Exportar/importar colección                             |
+
+## Componentes UI (shadcn/ui)
+
+### Componentes base
+
+| Componente   | Uso principal                      |
+| ------------ | ---------------------------------- |
+| Button       | Acciones principales y secundarias |
+| Card         | Contenedores de contenido          |
+| Input        | Entradas de texto                  |
+| Select       | Selección de opciones              |
+| Dialog       | Modales y diálogos                 |
+| Table        | Tablas de datos                    |
+| Badge        | Etiquetas y estados                |
+| Avatar       | Avatares de usuario                |
+| DropdownMenu | Menús desplegables                 |
+| Tabs         | Navegación por pestañas            |
+| Form         | Formularios                        |
+| Separator    | Separadores visuales               |
+| ScrollArea   | Áreas con scroll                   |
+| Tooltip      | Información contextual             |
+| Skeleton     | Estados de carga                   |
+| AlertDialog  | Confirmaciones                     |
+| Toast        | Notificaciones                     |
+
+### Variantes y tamaños
+
+#### Button
+
+**Variantes:**
+
+- `default`: Acción principal (violet)
+- `destructive`: Acción destructiva (rojo)
+- `outline`: Acción secundaria con borde
+- `secondary`: Acción secundaria (slate)
+- `ghost`: Acción sutil sin borde
+- `link`: Estilo de enlace
+
+**Tamaños:**
+
+- `sm`: 32px de altura
+- `default`: 40px de altura
+- `lg`: 48px de altura
+- `icon`: 32px x 32px (cuadrado)
+
+#### Card
+
+```tsx
+<Card>
+  <CardHeader>
+    <CardTitle>Título</CardTitle>
+    <CardDescription>Descripción opcional</CardDescription>
+  </CardHeader>
+  <CardContent>Contenido principal</CardContent>
+  <CardFooter>Acciones</CardFooter>
+</Card>
+```
+
+#### Badge
+
+**Variantes:**
+
+- `default`: Violet
+- `secondary`: Slate
+- `destructive`: Rojo
+- `outline`: Borde solo
+- `success`: Verde
+- `warning`: Amarillo
+
+## Componentes específicos
+
+### Componentes de Juegos
+
+#### GameCard
+
+Componente de tarjeta para mostrar un juego en una lista o grid.
+
+```typescript
+interface GameCardProps {
+  game: Game;
+  onClick?: () => void;
+  onEdit?: () => void;
+  onDelete?: () => void;
+}
+```
+
+**Estructura:**
+
+```tsx
+<Card className="group hover:border-primary/50 transition-colors cursor-pointer">
+  <CardHeader className="pb-3">
+    <div className="flex items-start justify-between gap-3">
+      <div className="flex items-center gap-3">
+        <GameCover gameId={game.id} className="h-16 w-12 rounded" />
+        <div className="min-w-0">
+          <CardTitle className="line-clamp-1">{game.title}</CardTitle>
+          <CardDescription className="line-clamp-1">
+            {game.platforms.map((p) => p.name).join(', ')}
+          </CardDescription>
+        </div>
+      </div>
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <Button variant="ghost" size="icon" className="opacity-0 group-hover:opacity-100">
+            <MoreHorizontal className="h-4 w-4" />
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end">
+          <DropdownMenuItem onClick={onEdit}>
+            <Edit className="mr-2 h-4 w-4" />
+            Editar
+          </DropdownMenuItem>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem onClick={onDelete} className="text-destructive">
+            <Trash2 className="mr-2 h-4 w-4" />
+            Eliminar
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+    </div>
+  </CardHeader>
+  <CardContent className="pb-3">
+    <div className="flex flex-wrap gap-2">
+      {game.tags.slice(0, 3).map((tag) => (
+        <Badge key={tag.id} variant="secondary" className="text-xs">
+          {tag.name}
+        </Badge>
+      ))}
+      {game.tags.length > 3 && (
+        <Badge variant="secondary" className="text-xs">
+          +{game.tags.length - 3}
+        </Badge>
+      )}
+    </div>
+  </CardContent>
+  <CardFooter className="pt-0">
+    <div className="flex items-center gap-4 text-xs text-muted-foreground">
+      <div className="flex items-center gap-1">
+        <HardDrive className="h-3 w-3" />
+        {game.romFiles.length} ROMs
+      </div>
+      {game.releaseDate && (
+        <div className="flex items-center gap-1">
+          <Calendar className="h-3 w-3" />
+          {formatDate(game.releaseDate)}
+        </div>
+      )}
+    </div>
+  </CardFooter>
+</Card>
+```
+
+#### GameList
+
+Componente de lista de juegos con filtros y paginación.
+
+```typescript
+interface GameListProps {
+  filters?: GameFilters;
+  onFiltersChange?: (filters: GameFilters) => void;
+}
+```
+
+**Estructura:**
+
+```tsx
+<div className="space-y-6">
+  <GameFilters filters={filters} onChange={onFiltersChange} />
+  <GameGrid games={games} isLoading={isLoading} />
+  <GamePagination pagination={pagination} onPageChange={onPageChange} />
+</div>
+```
+
+#### GameDetail
+
+Página de detalle de un juego.
+
+```tsx
+<div className="space-y-6">
+  <GameDetailHeader game={game} />
+  <Tabs defaultValue="overview">
+    <TabsList>
+      <TabsTrigger value="overview">Resumen</TabsTrigger>
+      <TabsTrigger value="roms">ROMs</TabsTrigger>
+      <TabsTrigger value="purchases">Compras</TabsTrigger>
+      <TabsTrigger value="metadata">Metadata</TabsTrigger>
+    </TabsList>
+    <TabsContent value="overview">
+      <GameOverview game={game} />
+    </TabsContent>
+    <TabsContent value="roms">
+      <GameRoms game={game} />
+    </TabsContent>
+    <TabsContent value="purchases">
+      <GamePurchases game={game} />
+    </TabsContent>
+    <TabsContent value="metadata">
+      <GameMetadata game={game} />
+    </TabsContent>
+  </Tabs>
+</div>
+```
+
+### Componentes de ROMs
+
+#### RomFileCard
+
+Componente de tarjeta para mostrar un archivo ROM.
+
+```typescript
+interface RomFileCardProps {
+  rom: RomFile;
+  game?: Game;
+  onLink?: () => void;
+  onUnlink?: () => void;
+}
+```
+
+#### ImportRomWizard
+
+Wizard para importar ROMs desde el sistema de archivos.
+
+**Pasos del wizard:**
+
+1. **Configurar rutas**: Seleccionar directorios para escanear
+2. **Escanear**: Ejecutar escaneo de archivos
+3. **Revisar**: Revisar resultados y detectar duplicados
+4. **Importar**: Importar ROMs seleccionadas
+
+### Componentes de Metadata
+
+#### MetadataSearch
+
+Componente para buscar metadata de APIs externas (IGDB, RAWG).
+
+```typescript
+interface MetadataSearchProps {
+  onSelect: (metadata: ExternalMetadata) => void;
+  game?: Game;
+}
+```
+
+**Estructura:**
+
+```tsx
+<div className="space-y-4">
+  <div className="flex gap-2">
+    <Input
+      placeholder="Buscar en IGDB, RAWG..."
+      value={searchQuery}
+      onChange={(e) => setSearchQuery(e.target.value)}
+    />
+    <Button onClick={handleSearch}>
+      <Search className="mr-2 h-4 w-4" />
+      Buscar
+    </Button>
+  </div>
+  {isLoading && <MetadataSearchResultsSkeleton />}
+  {results && (
+    <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+      {results.map((result) => (
+        <MetadataResultCard key={result.id} result={result} onSelect={() => onSelect(result)} />
+      ))}
+    </div>
+  )}
+</div>
+```
+
+### Componentes de Dashboard
+
+#### DashboardStats
+
+Tarjetas de estadísticas del dashboard.
+
+```typescript
+interface DashboardStatsProps {
+  stats: {
+    totalGames: number;
+    totalRoms: number;
+    totalPlatforms: number;
+    recentGames: number;
+  };
+}
+```
+
+**Estructura:**
+
+```tsx
+<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
+  <StatCard
+    title="Total de juegos"
+    value={stats.totalGames}
+    icon={<Gamepad2 className="h-4 w-4" />}
+  />
+  <StatCard
+    title="Total de ROMs"
+    value={stats.totalRoms}
+    icon={<HardDrive className="h-4 w-4" />}
+  />
+  <StatCard
+    title="Plataformas"
+    value={stats.totalPlatforms}
+    icon={<Monitor className="h-4 w-4" />}
+  />
+  <StatCard
+    title="Juegos recientes"
+    value={stats.recentGames}
+    icon={<Clock className="h-4 w-4" />}
+  />
+</div>
+```
+
+## Layout Components
+
+### AppLayout
+
+Layout principal de la aplicación.
+
+```typescript
+interface AppLayoutProps {
+  children: React.ReactNode;
+}
+```
+
+**Estructura:**
+
+```tsx
+<div className="min-h-screen bg-background">
+  <Header />
+  <div className="flex">
+    <Sidebar />
+    <main className="flex-1 p-6">{children}</main>
+  </div>
+</div>
+```
+
+### Header
+
+Header de la aplicación.
+
+```typescript
+interface HeaderProps {
+  onMenuToggle?: () => void;
+}
+```
+
+**Estructura:**
+
+```tsx
+<header className="sticky top-0 z-50 w-full border-b border-border bg-background/95 backdrop-blur">
+  <div className="container flex h-14 items-center gap-4">
+    <Logo />
+    <GlobalSearch />
+    <div className="ml-auto flex items-center gap-2">
+      <ThemeToggle />
+      <UserMenu />
+    </div>
+  </div>
+</header>
+```
+
+### Sidebar
+
+Sidebar de navegación.
+
+```typescript
+interface SidebarProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}
+```
+
+**Estructura:**
+
+```tsx
+<aside className="fixed inset-y-0 left-0 z-40 w-64 border-r border-border bg-background">
+  <div className="flex h-full flex-col">
+    <SidebarHeader />
+    <SidebarNav />
+    <SidebarFooter />
+  </div>
+</aside>
+```
+
+## Gestión de estado
+
+### TanStack Query
+
+- **Cache de datos**: Cache automático de respuestas de API
+- **Invalidación**: Invalidación inteligente de cache
+- **Optimistic updates**: Actualizaciones optimistas
+- **Background refetch**: Refetch en background
+
+```typescript
+// Ejemplo de query
+const gamesQuery = useQuery({
+  queryKey: ['games', { page, limit, search }],
+  queryFn: () => fetchGames({ page, limit, search }),
+  staleTime: 5 * 60 * 1000, // 5 minutos
+});
+
+// Ejemplo de mutation
+const createGameMutation = useMutation({
+  mutationFn: createGame,
+  onSuccess: () => {
+    queryClient.invalidateQueries({ queryKey: ['games'] });
+  },
+});
+```
+
+### TanStack Router
+
+- **File-based routing**: Rutas basadas en archivos
+- **Route loaders**: Carga de datos antes de renderizar
+- **Type-safe routing**: Tipado de parámetros y búsqueda
+- **Code splitting**: División de código automática
+
+```typescript
+// Ejemplo de route loader
+export const loader = ({ params }: LoaderArgs) => {
+  return queryClient.ensureQueryData({
+    queryKey: ['game', params.id],
+    queryFn: () => fetchGame(params.id),
+  });
+};
+```
+
+### TanStack Form + Zod
+
+```typescript
+// Esquema de validación
+const gameSchema = z.object({
+  title: z.string().min(1, 'El título es requerido'),
+  description: z.string().optional(),
+  releaseDate: z.date().optional(),
+  platforms: z.array(z.string()).min(1, 'Selecciona al menos una plataforma'),
+  tags: z.array(z.string()).default([]),
+})
+
+type GameFormData = z.infer<typeof gameSchema>
+
+// Componente de formulario
+function GameForm() {
+  const form = useForm({
+    defaultValues: {
+      title: '',
+      description: '',
+      platforms: [],
+      tags: [],
+    },
+    validators: {
+      onChange: gameSchema,
+    },
+  })
+
+  const { mutate: createGame } = useCreateGame()
+
+  const handleSubmit = (data: GameFormData) => {
+    createGame(data)
+  }
+
+  return (
+    <form
+      onSubmit={(e) => {
+        e.preventDefault()
+        form.handleSubmit()
+      }}
+    >
+      <form.Field
+        name="title"
+        validators={{
+          onChange: ({ value }) =>
+            !value ? 'El título es requerido' : undefined,
+        }}
+      >
+        {(field) => (
+          <div>
+            <label htmlFor={field.name}>Título</label>
+            <input
+              id={field.name}
+              name={field.name}
+              value={field.state.value}
+              onChange={(e) => field.handleChange(e.target.value)}
+            />
+            {field.state.meta.errors && (
+              <span>{field.state.meta.errors.join(', ')}</span>
+            )}
+          </div>
+        )}
+      </form.Field>
+      <button type="submit">Guardar</button>
+    </form>
+  )
+}
+```
+
+## API Client
+
+```typescript
+// API client base
+const apiClient = axios.create({
+  baseURL: import.meta.env.VITE_API_URL || 'http://localhost:3000',
+  timeout: 10000,
+});
+
+// Interceptor para manejo de errores
+apiClient.interceptors.response.use(
+  (response) => response,
+  (error) => {
+    if (error.response?.status === 401) {
+      // Redirigir a login
+    }
+    return Promise.reject(error);
+  }
+);
+
+// Servicios de API
+export const gamesApi = {
+  list: (params: GamesListParams) => apiClient.get('/games', { params }),
+  get: (id: string) => apiClient.get(`/games/${id}`),
+  create: (data: CreateGameDto) => apiClient.post('/games', data),
+  update: (id: string, data: UpdateGameDto) => apiClient.patch(`/games/${id}`, data),
+  delete: (id: string) => apiClient.delete(`/games/${id}`),
+};
+```
+
+## Accesibilidad
+
+### WCAG AA Compliance
+
+- **Contraste**: Mínimo 4.5:1 para texto normal, 3:1 para texto grande
+- **Keyboard navigation**: Navegación completa por teclado
+- **Focus indicators**: Indicadores visuales de foco
+- **Screen reader support**: ARIA labels y roles apropiados
+- **Semantic HTML**: Uso correcto de elementos semánticos
+
+### Implementación
+
+```typescript
+// Ejemplo de componente accesible
+<Button
+  aria-label="Crear nuevo juego"
+  type="button"
+  onClick={handleCreate}
+>
+  <Plus className="mr-2 h-4 w-4" />
+  Nuevo juego
+</Button>
+```
+
+## Responsividad
+
+### Breakpoints
+
+```css
+/* Tailwind breakpoints */
+sm: 640px   /* Móvil grande */
+md: 768px   /* Tablet */
+lg: 1024px  /* Desktop pequeño */
+xl: 1280px  /* Desktop */
+2xl: 1536px /* Desktop grande */
+```
+
+### Estrategia mobile-first
+
+```typescript
+// Ejemplo de componente responsivo
+<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+  {games.map((game) => (
+    <GameCard key={game.id} game={game} />
+  ))}
+</div>
+```
+
+## Optimizaciones
+
+### Performance
+
+- **Code splitting**: División de código por rutas
+- **Lazy loading**: Carga diferida de componentes
+- **Image optimization**: Optimización de imágenes
+- **Memoization**: Uso de React.memo y useMemo
+- **Virtual scrolling**: Para listas largas
+
+### Bundle size
+
+- **Tree shaking**: Eliminación de código no usado
+- **Compression**: Gzip/Brotli compression
+- **CDN**: Uso de CDN para dependencias
+
+## Configuración
+
+### Scripts de desarrollo
+
+```json
+{
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "format": "prettier --write \"src/**/*.{ts,tsx}\"",
+    "type-check": "tsc --noEmit",
+    "test": "vitest",
+    "test:ui": "vitest --ui",
+    "test:e2e": "playwright test"
+  }
+}
+```
+
+### Variables de entorno
+
+```env
+# API
+VITE_API_URL=http://localhost:3000
+
+# Feature flags
+VITE_ENABLE_ANALYTICS=false
+VITE_ENABLE_TELEMETRY=false
+```
+
+### Configuración de Tailwind
+
+```typescript
+import type { Config } from 'tailwindcss';
+
+const config: Config = {
+  darkMode: ['class'],
+  content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
+  theme: {
+    extend: {
+      colors: {
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        popover: {
+          DEFAULT: 'hsl(var(--popover))',
+          foreground: 'hsl(var(--popover-foreground))',
+        },
+        card: {
+          DEFAULT: 'hsl(var(--card))',
+          foreground: 'hsl(var(--card-foreground))',
+        },
+      },
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+    },
+  },
+  plugins: [],
+};
+
+export default config;
+```
+
+### Configuración de Vite
+
+```typescript
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import path from 'path';
+
+export default defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
+  server: {
+    port: 5173,
+    proxy: {
+      '/api': {
+        target: 'http://localhost:3000',
+        changeOrigin: true,
+      },
+    },
+  },
+});
+```
+
+## Testing
+
+### Estrategia de testing
+
+- **Unit tests**: Componentes y hooks individuales
+- **Integration tests**: Flujos de usuario
+- **E2E tests**: Flujos completos con Playwright
+
+### Herramientas
+
+- **Vitest**: Unit tests
+- **Testing Library**: Testing de componentes React
+- **Playwright**: E2E tests
+
+## Patrones de diseño
+
+### Page Layout
+
+```tsx
+<div className="min-h-screen bg-background">
+  <Header />
+  <div className="flex">
+    <Sidebar />
+    <main className="flex-1 p-6">
+      <PageHeader />
+      <PageContent />
+    </main>
+  </div>
+</div>
+```
+
+### Card Grid
+
+```tsx
+<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 gap-6">
+  {items.map((item) => (
+    <Card key={item.id}>{/* Card content */}</Card>
+  ))}
+</div>
+```
+
+### Form Layout
+
+```tsx
+<Form {...form}>
+  <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
+    <FormField
+      control={form.control}
+      name="title"
+      render={({ field }) => (
+        <FormItem>
+          <FormLabel>Título</FormLabel>
+          <FormControl>
+            <Input placeholder="Escribe el título..." {...field} />
+          </FormControl>
+          <FormDescription>Descripción del campo</FormDescription>
+          <FormMessage />
+        </FormItem>
+      )}
+    />
+    <div className="flex justify-end gap-2">
+      <Button type="button" variant="outline" onClick={onCancel}>
+        Cancelar
+      </Button>
+      <Button type="submit">Guardar</Button>
+    </div>
+  </form>
+</Form>
+```
+
+### Estados de carga
+
+#### Skeleton Loading
+
+```tsx
+{isLoading ? (
+  <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+    {Array.from({ length: 6 }).map((_, i) => (
+      <Card key={i}>
+        <CardHeader>
+          <Skeleton className="h-4 w-3/4" />
+        </CardHeader>
+        <CardContent>
+          <Skeleton className="h-20 w-full" />
+        </CardContent>
+      </Card>
+    ))}
+  </div>
+) : (
+  // Actual content
+)}
+```
+
+#### Empty State
+
+```tsx
+<div className="flex flex-col items-center justify-center py-12">
+  <div className="rounded-full bg-muted p-4">
+    <Inbox className="h-8 w-8 text-muted-foreground" />
+  </div>
+  <h3 className="mt-4 text-lg font-semibold">No hay elementos</h3>
+  <p className="mt-2 text-sm text-muted-foreground">Comienza añadiendo tu primer elemento.</p>
+  <Button className="mt-4">
+    <Plus className="mr-2 h-4 w-4" />
+    Añadir elemento
+  </Button>
+</div>
+```
+
+## Iconos
+
+Se utiliza `lucide-react` para todos los iconos. Iconos comunes:
+
+| Icono          | Uso           |
+| -------------- | ------------- |
+| `Home`         | Dashboard     |
+| `Gamepad2`     | Juegos        |
+| `Upload`       | Importar      |
+| `Settings`     | Configuración |
+| `Monitor`      | Plataformas   |
+| `Tag`          | Etiquetas     |
+| `Download`     | Exportar      |
+| `Search`       | Búsqueda      |
+| `Plus`         | Crear nuevo   |
+| `Edit`         | Editar        |
+| `Trash2`       | Eliminar      |
+| `Filter`       | Filtros       |
+| `SortAsc`      | Ordenar       |
+| `ChevronRight` | Navegación    |
+| `Menu`         | Menú móvil    |
+| `X`            | Cerrar        |
+| `Check`        | Confirmar     |
+| `AlertCircle`  | Advertencia   |
+| `Info`         | Información   |
+| `Loader2`      | Carga         |
+
+## Implementación
+
+### Prerrequisitos
+
+- Node.js 18+
+- Yarn 4.x (package manager)
+
+### Instalación
+
+```bash
+# Navegar al directorio frontend
+cd frontend
+
+# Instalar dependencias
+yarn install
+
+# Iniciar desarrollo
+yarn dev
+```
+
+### Build para producción
+
+```bash
+# Build
+yarn build
+
+# Preview
+yarn preview
+```
+
+## Metadatos
+
+**Autor**: Quasar Frontend Team
+**Última actualización**: 2026-02-22
+**Versión**: 1.0.0
+**Estado**: Implementación completa en progreso
diff --git a/docs/lessons-learned.md b/docs/02-tecnico/lessons-learned.md
similarity index 100%
rename from docs/lessons-learned.md
rename to docs/02-tecnico/lessons-learned.md
diff --git a/docs/competitive-analysis.md b/docs/03-analisis/competitive-analysis.md
similarity index 100%
rename from docs/competitive-analysis.md
rename to docs/03-analisis/competitive-analysis.md
diff --git a/docs/04-operaciones/deployment.md b/docs/04-operaciones/deployment.md
new file mode 100644
index 0000000..2186c48
--- /dev/null
+++ b/docs/04-operaciones/deployment.md
@@ -0,0 +1,546 @@
+# Guía de Despliegue y Operaciones 🚀
+
+Esta guía cubre el despliegue, configuración y operación de Quasar en producción.
+
+---
+
+## Tabla de Contenidos
+
+1. [Requisitos del Sistema](#requisitos-del-sistema)
+2. [Configuración de Producción](#configuración-de-producción)
+3. [Despliegue](#despliegue)
+4. [Monitoreo y Mantenimiento](#monitoreo-y-mantenimiento)
+5. [Actualizaciones](#actualizaciones)
+6. [Backup y Recuperación](#backup-y-recuperación)
+7. [Solución de Problemas](#solución-de-problemas)
+
+---
+
+## Requisitos del Sistema
+
+### Hardware Mínimo
+
+- **CPU:** 2 cores
+- **RAM:** 4GB
+- **Almacenamiento:** 20GB (para ROMs y metadata)
+- **Red:** Estable (para descargas de artwork)
+
+### Software
+
+- **Node.js 18+**
+- **Yarn 4.x**
+- **SQLite** (o PostgreSQL para producción)
+- **Nginx** (recomendado para reverse proxy)
+- **Certificado SSL** (HTTPS obligatorio)
+
+### Dependencias Externas
+
+- Claves API de IGDB, RAWG, TheGamesDB
+- Acceso a servicios de descarga de imágenes
+
+---
+
+## Configuración de Producción
+
+### Variables de Entorno
+
+Crear `.env.production` con:
+
+```env
+# Database
+DATABASE_URL="file:./production.db"
+# Para PostgreSQL: postgresql://user:password@localhost:5432/quasar
+
+# API Keys
+IGDB_CLIENT_ID=your_production_client_id
+IGDB_CLIENT_SECRET=your_production_client_secret
+RAWG_API_KEY=your_production_api_key
+THEGAMESDB_API_KEY=your_production_api_key
+SCREENSCRAPER_USERNAME=your_screenscraper_username
+SCREENSCRAPER_PASSWORD=your_screenscraper_password
+
+# App Config
+NODE_ENV=production
+PORT=3000
+HOST=0.0.0.0
+LOG_LEVEL=info
+
+# Security
+CORS_ORIGIN=https://yourdomain.com
+JWT_SECRET=your_secure_jwt_secret_here
+API_RATE_LIMIT=100
+
+# Performance
+CACHE_TTL=86400
+MAX_CONCURRENT_API_REQUESTS=5
+```
+
+### Configuración de Nginx
+
+```nginx
+server {
+    listen 443 ssl http2;
+    server_name yourdomain.com;
+
+    # SSL Configuration
+    ssl_certificate /path/to/cert.pem;
+    ssl_certificate_key /path/to/key.pem;
+    ssl_protocols TLSv1.2 TLSv1.3;
+
+    # Security headers
+    add_header X-Frame-Options DENY;
+    add_header X-Content-Type-Options nosniff;
+    add_header X-XSS-Protection "1; mode=block";
+    add_header Strict-Transport-Security "max-age=31536000; includeSubDomains" always;
+
+    # Frontend
+    location / {
+        root /var/www/quasar/frontend/dist;
+        try_files $uri $uri/ /index.html;
+        expires 1y;
+        add_header Cache-Control "public, immutable";
+    }
+
+    # Backend API
+    location /api/ {
+        proxy_pass http://localhost:3000;
+        proxy_http_version 1.1;
+        proxy_set_header Upgrade $http_upgrade;
+        proxy_set_header Connection 'upgrade';
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+        proxy_cache_bypass $http_upgrade;
+        proxy_read_timeout 864s;
+    }
+
+    # Static files
+    location /static/ {
+        root /var/www/quasar;
+        expires 1y;
+        add_header Cache-Control "public, immutable";
+    }
+}
+```
+
+---
+
+## Despliegue
+
+### Opción 1: Docker (Recomendado)
+
+```dockerfile
+# Dockerfile
+FROM node:18-alpine AS base
+
+# Install dependencies only when needed
+FROM base AS deps
+RUN apk add --no-cache libc6-compat
+WORKDIR /app
+
+# Install dependencies based on the preferred package manager
+COPY package.json yarn.lock* ./
+RUN yarn install --frozen-lockfile
+
+# Rebuild the source code only when needed
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+# Build the application
+RUN yarn build
+
+# Production image, copy all the files and run next
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV=production
+ENV PORT=3000
+
+# Copy built application
+COPY --from=builder /app/dist ./dist
+COPY --from=builder /app/node_modules ./node_modules
+COPY --from=builder /app/package.json ./package.json
+
+# Create non-root user
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+USER nextjs
+
+EXPOSE 3000
+
+CMD ["node", "dist/server.js"]
+```
+
+```yaml
+# docker-compose.yml
+version: '3.8'
+
+services:
+  quasar-backend:
+    build: ./backend
+    ports:
+      - '3000:3000'
+    environment:
+      - NODE_ENV=production
+      - DATABASE_URL=file:./production.db
+      - IGDB_CLIENT_ID=${IGDB_CLIENT_ID}
+      - IGDB_CLIENT_SECRET=${IGDB_CLIENT_SECRET}
+      - RAWG_API_KEY=${RAWG_API_KEY}
+      - THEGAMESDB_API_KEY=${THEGAMESDB_API_KEY}
+    volumes:
+      - ./data:/app/data
+      - ./backend/prisma:/app/prisma
+    restart: unless-stopped
+
+  quasar-frontend:
+    build: ./frontend
+    ports:
+      - '5173:5173'
+    depends_on:
+      - quasar-backend
+    restart: unless-stopped
+
+  nginx:
+    image: nginx:alpine
+    ports:
+      - '443:443'
+    volumes:
+      - ./nginx.conf:/etc/nginx/nginx.conf
+      - ./ssl:/etc/nginx/ssl
+    depends_on:
+      - quasar-backend
+      - quasar-frontend
+    restart: unless-stopped
+```
+
+### Opción 2: VPS Manual
+
+```bash
+# 1. Setup server
+sudo apt update
+sudo apt install -y nodejs yarn nginx sqlite3
+
+# 2. Clone repository
+git clone https://your-repo/quasar.git
+cd quasar
+
+# 3. Install dependencies
+yarn install --production
+
+# 4. Setup environment
+cp .env.example .env.production
+# Edit .env.production with real values
+
+# 5. Build frontend
+cd frontend
+yarn build
+cd ..
+
+# 6. Setup database
+cd backend
+npx prisma migrate deploy
+cd ..
+
+# 7. Configure nginx
+sudo cp nginx.conf /etc/nginx/sites-available/quasar
+sudo ln -s /etc/nginx/sites-available/quasar /etc/nginx/sites-enabled/
+sudo nginx -t
+sudo systemctl reload nginx
+
+# 8. Start services
+cd backend
+nohup yarn start > /var/log/quasar-backend.log 2>&1 &
+cd ../frontend
+nohup yarn start > /var/log/quasar-frontend.log 2>&1 &
+```
+
+---
+
+## Monitoreo y Mantenimiento
+
+### Health Checks
+
+```bash
+# Backend health
+curl http://localhost:3000/health
+
+# Database connection
+curl http://localhost:3000/api/health/database
+
+# API rate limits status
+curl http://localhost:3000/api/health/rate-limits
+```
+
+### Logging
+
+Configurar logrotate:
+
+```bash
+# /etc/logrotate.d/quasar
+/var/log/quasar/*.log {
+    daily
+    missingok
+    rotate 7
+    compress
+    delaycompress
+    notifempty
+    copytruncate
+}
+```
+
+### Monitoreo de API Keys
+
+Crear script para verificar límites:
+
+```bash
+#!/bin/bash
+# check-api-limits.sh
+
+# Check IGDB rate limits
+curl -s -I "https://api.igdb.com/v4/games" | grep -i "x-ratelimit"
+
+# Check RAWG usage
+curl -s "https://api.rawg.io/api/games?key=$RAWG_API_KEY&search=test" | jq '.count'
+
+# Log warnings
+echo "$(date): API rate limits checked" >> /var/log/quasar/api-monitor.log
+```
+
+---
+
+## Actualizaciones
+
+### Proceso de Actualización
+
+```bash
+# 1. Backup
+./backup.sh
+
+# 2. Stop services
+sudo systemctl stop quasar-backend
+sudo systemctl stop quasar-frontend
+
+# 3. Pull latest code
+git pull origin main
+
+# 4. Update dependencies
+yarn install --frozen-lockfile
+
+# 5. Build frontend
+cd frontend && yarn build && cd ..
+
+# 6. Run migrations
+cd backend && npx prisma migrate deploy && cd ..
+
+# 7. Start services
+sudo systemctl start quasar-backend
+sudo systemctl start quasar-frontend
+```
+
+### Actualizaciones de API Keys
+
+1. Generar nuevas claves en cada servicio
+2. Actualizar variables de entorno
+3. Reiniciar servicios
+4. Monitorear errores durante 24h
+
+---
+
+## Backup y Recuperación
+
+### Script de Backup
+
+```bash
+#!/bin/bash
+# backup.sh
+
+BACKUP_DIR="/backups/quasar"
+DATE=$(date +%Y%m%d_%H%M%S)
+DB_FILE="quasar_$DATE.db"
+ROMS_DIR="roms_$DATE"
+
+# Create backup directory
+mkdir -p "$BACKUP_DIR"
+
+# Backup database
+cp backend/prisma/production.db "$BACKUP_DIR/$DB_FILE"
+
+# Backup ROM metadata (not actual ROMs)
+cp -r data/roms_metadata "$BACKUP_DIR/$ROMS_DIR"
+
+# Backup configuration
+cp .env.production "$BACKUP_DIR/env_$DATE"
+
+# Compress backup
+tar -czf "$BACKUP_DIR/backup_$DATE.tar.gz" -C "$BACKUP_DIR" "$DB_FILE" "$ROMS_DIR" "env_$DATE"
+
+# Clean up old backups (keep last 7 days)
+find "$BACKUP_DIR" -name "backup_*.tar.gz" -mtime +7 -delete
+
+echo "Backup completed: $BACKUP_DIR/backup_$DATE.tar.gz"
+```
+
+### Recuperación
+
+```bash
+#!/bin/bash
+# restore.sh
+
+BACKUP_FILE=$1
+BACKUP_DIR="/backups/quasar"
+
+if [ ! -f "$BACKUP_DIR/$BACKUP_FILE" ]; then
+    echo "Backup file not found: $BACKUP_DIR/$BACKUP_FILE"
+    exit 1
+fi
+
+# Stop services
+sudo systemctl stop quasar-backend
+sudo systemctl stop quasar-frontend
+
+# Extract backup
+cd "$BACKUP_DIR"
+tar -xzf "$BACKUP_FILE"
+
+# Restore database
+cp "$DB_FILE" backend/prisma/production.db
+
+# Restore ROM metadata
+cp -r "$ROMS_DIR"/* data/
+
+# Restore configuration (optional)
+# cp "env_$DATE" .env.production
+
+# Start services
+sudo systemctl start quasar-backend
+sudo systemctl start quasar-frontend
+
+echo "Restore completed from: $BACKUP_FILE"
+```
+
+---
+
+## Solución de Problemas
+
+### Problemas Comunes
+
+#### 1. "Database connection failed"
+
+```bash
+# Check database file
+ls -la backend/prisma/production.db
+
+# Check permissions
+sudo chown -R nodejs:nodejs backend/prisma/
+
+# Check database integrity
+sqlite3 backend/prisma/production.db "PRAGMA integrity_check;"
+```
+
+#### 2. "API rate limit exceeded"
+
+```bash
+# Check current rate limits
+curl -I "https://api.igdb.com/v4/games" | grep -i "x-ratelimit"
+
+# Implement backoff strategy
+# Check logs for specific API errors
+tail -f /var/log/quasar/backend.log | grep "429"
+```
+
+#### 3. "Frontend cannot connect to backend"
+
+```bash
+# Check backend is running
+curl http://localhost:3000/health
+
+# Check CORS configuration
+curl -H "Origin: https://yourdomain.com" -v http://localhost:3000/health
+
+# Check nginx configuration
+sudo nginx -t
+```
+
+#### 4. "ROM scanning fails"
+
+```bash
+# Check directory permissions
+ls -la /path/to/roms/
+
+# Check file formats
+find /path/to/roms/ -name "*.zip" -o -name "*.7z" -o -name "*.rar"
+
+# Check disk space
+df -h
+```
+
+### Diagnóstico Remoto
+
+```bash
+# Create diagnostic script
+#!/bin/bash
+# diagnostic.sh
+
+echo "=== Quasar Diagnostic Report ==="
+echo "Date: $(date)"
+echo "Node.js version: $(node --version)"
+echo "Yarn version: $(yarn --version)"
+echo ""
+
+echo "=== System Resources ==="
+free -h
+df -h
+echo ""
+
+echo "=== Services Status ==="
+systemctl status quasar-backend
+systemctl status quasar-frontend
+echo ""
+
+echo "=== Database Status ==="
+sqlite3 backend/prisma/production.db "SELECT COUNT(*) FROM games;"
+sqlite3 backend/prisma/production.db "SELECT COUNT(*) FROM rom_files;"
+echo ""
+
+echo "=== API Keys Status ==="
+echo "IGDB: ${IGDB_CLIENT_ID:0:10}..."
+echo "RAWG: ${RAWG_API_KEY:0:10}..."
+echo "TheGamesDB: ${THEGAMESDB_API_KEY:0:10}..."
+echo ""
+
+echo "=== Recent Errors ==="
+tail -20 /var/log/quasar/backend.log | grep -i "error"
+tail -20 /var/log/quasar/frontend.log | grep -i "error"
+```
+
+---
+
+## Soporte
+
+### Logs de Depuración
+
+```bash
+# Backend logs
+tail -f /var/log/quasar/backend.log
+
+# Frontend logs
+tail -f /var/log/quasar/frontend.log
+
+# Nginx logs
+tail -f /var/log/nginx/access.log
+tail -f /var/log/nginx/error.log
+```
+
+### Contacto
+
+- **Issues:** Reportar en el repositorio de Gitea
+- **Emergencias:** Email: support@yourdomain.com
+- **Documentación:** Ver [docs/README.md](../../README.md)
+
+---
+
+_Última actualización: 2026-02-22_
diff --git a/docs/API_KEYS.md b/docs/API_KEYS.md
deleted file mode 100644
index d464da0..0000000
--- a/docs/API_KEYS.md
+++ /dev/null
@@ -1,140 +0,0 @@
-# Obtaining API Keys
-
-This guide explains how to get credentials for each metadata service.
-
-## IGDB (Internet Game Database)
-
-IGDB uses **OAuth 2.0 via Twitch**. Steps:
-
-1. Go to [Twitch Developer Console](https://dev.twitch.tv/console/apps)
-2. Sign in with your Twitch account (create one if needed)
-3. Click "Create Application"
-   - Name: "Quasar" (or your app name)
-   - Category: Select relevant category
-   - Accept terms, click Create
-4. You'll see:
-   - **Client ID** — Copy this
-   - Click "New Secret" to generate **Client Secret** — Copy this
-5. Go to Settings → OAuth Redirect URLs
-   - Add: `http://localhost:3000/oauth/callback` (development)
-   - For production: `https://yourdomain.com/oauth/callback`
-6. In your `.env` file:
-   ```
-   IGDB_CLIENT_ID=your_client_id
-   IGDB_CLIENT_SECRET=your_client_secret
-   ```
-7. Start Quasar, it will use IGDB automatically
-
-**Rate Limit:** 4 requests/second
-
-## RAWG (Rawg.io)
-
-RAWG has a simpler **API Key** approach:
-
-1. Go to [RAWG Settings](https://rawg.io/settings/account)
-2. Sign up if needed, then login
-3. Find "API Key" section
-4. Click "Create new key" (if needed) or copy existing key
-5. In your `.env` file:
-   ```
-   RAWG_API_KEY=your_api_key_here
-   ```
-6. Start Quasar
-
-**Rate Limit:** 20 requests/second (free tier)
-
-**Note:** RAWG requires attribution in UI (include "Powered by RAWG" somewhere visible)
-
-## TheGamesDB (thegamesdb.net)
-
-TheGamesDB uses a simple **API Key**:
-
-1. Go to [TheGamesDB API](https://thegamesdb.net/api)
-2. Find "API Key" section (free registration required)
-3. Register or login
-4. Copy your API key
-5. In your `.env` file:
-   ```
-   THEGAMESDB_API_KEY=your_api_key_here
-   ```
-6. Start Quasar
-
-**Rate Limit:** 1 request/second (free tier)
-
-## Testing Without Real Keys
-
-For development/testing:
-
-- Leave API keys as `your_*_here` in `.env.local`
-- Quasar will gracefully degrade and show limited metadata
-- Frontend will still work with manual game entry
-
-## Production Deployment
-
-For production:
-
-1. Generate new keys on each service (don't reuse dev keys)
-2. Store keys in **Gitea Secrets** (for automated CI/CD pipelines)
-3. Or use environment variables on your hosting provider
-4. Rotate keys every 3 months
-5. Monitor rate limits in service dashboards
-
-## Gitea Actions CI/CD Setup
-
-To enable automated testing with API keys in Gitea Actions:
-
-### 1. Store Secrets in Gitea
-
-Navigate to your repository settings:
-
-```
-https://your-gitea-instance/your-org/quasar/settings/secrets/actions
-```
-
-Add these secrets:
-
-- `IGDB_CLIENT_ID` (from Twitch Developer Console)
-- `IGDB_CLIENT_SECRET` (from Twitch Developer Console)
-- `RAWG_API_KEY` (from RAWG settings)
-- `THEGAMESDB_API_KEY` (from TheGamesDB API)
-
-### 2. Workflow Configuration
-
-The `.gitea/workflows/ci.yml` workflow automatically:
-
-- ✅ Installs dependencies
-- ✅ Runs linting checks
-- ✅ Executes backend tests (Vitest)
-- ✅ Executes frontend tests (Vitest)
-- ✅ Starts backend + frontend servers
-- ✅ Runs E2E tests (Playwright) with real metadata APIs
-- ✅ Uploads test reports on failure
-
-### 3. Testing Flow
-
-1. **Push** code to `main` or `develop`
-2. **Gitea Actions** picks up the `.gitea/workflows/ci.yml`
-3. **Secrets are injected** as `IGDB_CLIENT_ID`, `IGDB_CLIENT_SECRET`, `RAWG_API_KEY`, `THEGAMESDB_API_KEY`
-4. **E2E tests** fetch real metadata from APIs (using injected secrets)
-5. **Build fails** if any test fails (prevents broken code)
-
-### 4. Local Development
-
-For local testing, use `.env.local`:
-
-```bash
-IGDB_CLIENT_ID=your_local_id
-IGDB_CLIENT_SECRET=your_local_secret
-RAWG_API_KEY=your_local_key
-THEGAMESDB_API_KEY=your_local_key
-```
-
-**Note:** CI/CD uses Gitea Secrets (not `.env` files), so never commit real credentials.
-
-## Troubleshooting
-
-**"IGDB_CLIENT_ID not found"** → Check `.env` file exists and has correct format
-
-**"429 Too Many Requests"** → Rate limit exceeded, wait and retry
-
-**"Invalid API Key"** → Copy key exactly (no spaces), verify it's active on service website
diff --git a/docs/README.md b/docs/README.md
new file mode 100644
index 0000000..07c1f34
--- /dev/null
+++ b/docs/README.md
@@ -0,0 +1,92 @@
+# Documentación del Proyecto Quasar 📚
+
+Esta documentación está organizada en secciones lógicas para facilitar la navegación y mantenimiento.
+
+## Estructura de la Documentación
+
+```
+docs/
+├── README.md                 # Este archivo (índice general)
+├── 01-conceptos/            # Conceptos fundamentales y requisitos
+│   ├── requirements.md      # Requisitos funcionales y no funcionales
+│   ├── architecture.md      # Arquitectura técnica general
+│   └── data-model.md       # Modelo de datos y esquema
+├── 02-tecnico/             # Documentación técnica detallada
+│   ├── apis.md             # APIs del sistema (consolidado)
+│   ├── frontend.md         # Documentación del frontend
+│   └── lessons-learned.md  # Lecciones aprendidas y recomendaciones
+├── 03-analisis/            # Análisis comparativos y estudios
+│   └── competitive-analysis.md  # Análisis competitivo
+└── 04-operaciones/         # Guías de operación y despliegue
+```
+
+## Guía de Navegación
+
+### 🎯 Para nuevos desarrolladores
+
+1. Comienza con [`01-conceptos/requirements.md`](01-conceptos/requirements.md) para entender el propósito
+2. Lee [`01-conceptos/architecture.md`](01-conceptos/architecture.md) para la visión general
+3. Revisa [`01-conceptos/data-model.md`](01-conceptos/data-model.md) para entender los datos
+
+### 🔧 Para trabajo técnico
+
+1. Consulta [`02-tecnico/apis.md`](02-tecnico/apis.md) para APIs y configuración
+2. Revisa [`02-tecnico/frontend.md`](02-tecnico/frontend.md) para detalles del frontend
+3. Lee [`02-tecnico/lessons-learned.md`](02-tecnico/lessons-learned.md) para buenas prácticas
+
+### 📊 Para análisis y decisiones
+
+1. Revisa [`03-analisis/competitive-analysis.md`](03-analisis/competitive-analysis.md) para contexto del mercado
+
+### 🚀 Para operaciones y despliegue
+
+1. Las guías de operación están en desarrollo (sección `04-operaciones/`)
+
+## Convenciones
+
+### Formato de enlaces
+
+Todos los enlaces internos usan formato markdown estándar:
+
+```markdown
+[texto de enlace](ruta/al/archivo.md)
+```
+
+### Nomenclatura de archivos
+
+- Todos los usan `kebab-case.md`
+- Los prefijos numéricos indican orden de lectura
+
+### Estructura de documentos
+
+- Cada documento tiene tabla de contenidos (TOC)
+- Secciones numeradas para mejor navegación
+- Ejemplos de código con formato sintáctico
+
+## Estado Actual
+
+| Sección        | Estado           | Comentarios                          |
+| -------------- | ---------------- | ------------------------------------ |
+| 01-conceptos   | ✅ Completa      | Documentación fundamental estable    |
+| 02-tecnico     | ✅ Actualizada   | APIs consolidados, frontend completo |
+| 03-analisis    | ✅ Completa      | Análisis competitivo actualizado     |
+| 04-operaciones | 🚧 En desarrollo | Guías de operación pendientes        |
+
+## Próximos Pasos
+
+- [ ] Añadir documentación de testing y CI/CD
+- [ ] Crear índice temático para búsqueda rápida
+- [ ] Documentar API REST detallada
+
+## Contribuir
+
+Al agregar nuevo contenido:
+
+1. Coloca el documento en la sección adecuada
+2. Sigue las convenciones de nomenclatura
+3. Actualiza este README si agregas nuevas secciones
+4. Revisa y actualiza referencias cruzadas
+
+---
+
+_Última actualización: 2026-02-22_
diff --git a/docs/api-integration.md b/docs/api-integration.md
deleted file mode 100644
index 749d5fe..0000000
--- a/docs/api-integration.md
+++ /dev/null
@@ -1,148 +0,0 @@
-# Integración de APIs externas — Prioridad y guía práctica
-
-## Objetivo
-
-Definir APIs prioritarias para el MVP, cómo obtener credenciales, ejemplos de uso y estrategias de robustez (rate limit, retries, fallback y normalización de datos).
-
----
-
-## APIs priorizadas (MVP)
-
-1. **IGDB (prioridad alta)**
-2. **RAWG (prioridad alta)**
-3. **TheGamesDB (prioridad media)**
-
----
-
-## IGDB
-
-- **Obtener credenciales**: registrar una app en Twitch Developer Console para obtener `CLIENT_ID` y `CLIENT_SECRET`. Obtener token con grant type `client_credentials` (POST a `https://id.twitch.tv/oauth2/token`).
-
-- **Endpoints principales**: `POST https://api.igdb.com/v4/games` (consulta flexible via body con sintaxis IGDB), `POST https://api.igdb.com/v4/covers`, `POST https://api.igdb.com/v4/platforms`.
-
-- **Ejemplo (buscar)**:
-
-```bash
-# Obtener token
-curl -X POST 'https://id.twitch.tv/oauth2/token?client_id=$IGDB_CLIENT_ID&client_secret=$IGDB_CLIENT_SECRET&grant_type=client_credentials'
-
-# Buscar juegos
-curl -X POST 'https://api.igdb.com/v4/games' \
-  -H "Client-ID: $IGDB_CLIENT_ID" \
-  -H "Authorization: Bearer $IGDB_TOKEN" \
-  -H 'Accept: application/json' \
-  --data 'fields id,name,first_release_date,platforms.name,genres.name,cover.url; search "zelda"; limit 5;'
-```
-
-- **Respuesta (esquemática)**:
-
-```json
-[
-  {
-    "id": 12345,
-    "name": "Ejemplo",
-    "first_release_date": 1459468800,
-    "platforms": [{ "name": "Nintendo Switch" }],
-    "cover": { "url": "//images.igdb.com/...jpg" }
-  }
-]
-```
-
-- **Límites y manejo**: la API puede devolver `429` o cabeceras de límite; implementar retries exponenciales (ej. 3 intentos) y respetar `Retry-After`. Implementar circuit breaker si la API falla repetidamente.
-- **Atribución**: mostrar origen de datos (ej. "Datos: IGDB") según términos del servicio.
-
----
-
-## RAWG
-
-- **Obtener credenciales**: registrarse en RAWG para obtener `RAWG_API_KEY` (https://rawg.io/apidocs).
-- **Endpoints principales**: `GET https://api.rawg.io/api/games?key=API_KEY&search=...`, `GET https://api.rawg.io/api/games/{id}`.
-- **Ejemplo**:
-
-```bash
-curl 'https://api.rawg.io/api/games?key=$RAWG_API_KEY&search=zelda&page_size=5'
-```
-
-- **Respuesta (esquemática)**:
-
-```json
-{
-  "count": 100,
-  "results": [
-    { "id": 3498, "name": "GTA V", "released": "2013-09-17", "background_image": "https://..." }
-  ]
-}
-```
-
-- **Límites y manejo**: RAWG suele tener límites por clave/plan; cachear y fallback a otros proveedores si falla.
-- **Atribución**: revisar condiciones y mostrar HTTP o texto de fuente si es requerido por el proveedor.
-
----
-
-## TheGamesDB
-
-- **Obtener credenciales**: crear cuenta y generar API Key en https://thegamesdb.net.
-- **Endpoints**: búsqueda por nombre y detalles (`/v1/Games/ByGameName?name=...`, `/v1/Games/ByGameID?id=...`).
-- **Ejemplo**:
-
-```bash
-curl -H 'Authorization: Bearer $THEGAMESDB_KEY' 'https://api.thegamesdb.net/v1/Games/ByGameName?name=zelda'
-```
-
----
-
-## Estrategia de fallback y normalización
-
-- **Orden de prioridad**: IGDB → RAWG → TheGamesDB (configurable).
-- **Normalización (mapping)**:
-  - `title` ← `name`
-  - `platform` ← `platforms[].name`
-  - `release_date` ← `first_release_date` / `released` → convertir a ISO 8601
-  - `genres` ← `genres[].name`
-  - `cover_url` ← `cover.url` / `background_image`
-  - `external_ids` ← `{ igdb: id, rawg: id, thegamesdb: id }`
-
-- **Fallback**: si IGDB no tiene portada, intentar RAWG; si falla, usar TheGamesDB. Registrar la fuente usada.
-
----
-
-## Caché y almacenamiento de artwork
-
-- **Caché metadata**: LRU en memoria o Redis con TTL (por ejemplo 24h) para evitar sobrecargar APIs.
-- **Almacenamiento de imágenes**: descargar y optimizar con `sharp` (crear versiones: thumb, medium), almacenar en `storage/artwork/{gameId}/cover.jpg` o S3.
-- **Servicio proxy**: servir imágenes desde backend para no exponer keys ni URLs externas.
-
----
-
-## Manejo de errores y resiliencia
-
-- Implementar **retries** exponenciales con jitter (3 intentos).
-- Implementar **circuit breaker** para desconectar llamadas a un proveedor fuera de servicio por N minutos.
-- Limitar concurrencia por proveedor (p. ej. 5 llamadas simultáneas) y usar colas para trabajos masivos (enriquecimiento masivo).
-
----
-
-## Variables de entorno (ejemplos)
-
-```
-IGDB_CLIENT_ID=...
-IGDB_CLIENT_SECRET=...
-RAWG_API_KEY=...
-THEGAMESDB_API_KEY=...
-EXTERNAL_API_CONCURRENCY=5
-```
-
-> Nota: **Nunca** exponer estas claves en el cliente; siempre pasar por el backend.
-
----
-
-## Fuentes
-
-- IGDB API docs, RAWG API docs, TheGamesDB API docs.
-- Patrones: retries, circuit breakers (ej. libraries: `p-retry`, `cockatiel`).
-
----
-
-**Metadatos**
-Autor: Quasar (investigación automatizada)
-Última actualización: 2026-02-07
diff --git a/frontend/.gitignore b/frontend/.gitignore
new file mode 100644
index 0000000..a547bf3
--- /dev/null
+++ b/frontend/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/frontend/README.md b/frontend/README.md
index 03265cd..d2e7761 100644
--- a/frontend/README.md
+++ b/frontend/README.md
@@ -1,49 +1,73 @@
-# Frontend - Quasar Game Library
+# React + TypeScript + Vite
 
-React + Vite + React Query UI for Quasar.
+This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
 
-## Setup
+Currently, two official plugins are available:
 
-```bash
-cd frontend
-yarn install
-yarn dev  # Start Vite dev server on http://localhost:5173
+- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
+- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
+
+## React Compiler
+
+The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).
+
+## Expanding the ESLint configuration
+
+If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
+
+```js
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+
+      // Remove tseslint.configs.recommended and replace with this
+      tseslint.configs.recommendedTypeChecked,
+      // Alternatively, use this for stricter rules
+      tseslint.configs.strictTypeChecked,
+      // Optionally, add this for stylistic rules
+      tseslint.configs.stylisticTypeChecked,
+
+      // Other configs...
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
 ```
 
-## Testing
+You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
 
-```bash
-yarn test       # Run Vitest in watch mode
-yarn test:run   # Run once
+```js
+// eslint.config.js
+import reactX from 'eslint-plugin-react-x'
+import reactDom from 'eslint-plugin-react-dom'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      // Other configs...
+      // Enable lint rules for React
+      reactX.configs['recommended-typescript'],
+      // Enable lint rules for React DOM
+      reactDom.configs.recommended,
+    ],
+    languageOptions: {
+      parserOptions: {
+        project: ['./tsconfig.node.json', './tsconfig.app.json'],
+        tsconfigRootDir: import.meta.dirname,
+      },
+      // other options...
+    },
+  },
+])
 ```
-
-## Building
-
-```bash
-yarn build      # Build for production (dist/)
-yarn preview    # Preview production build locally
-```
-
-## Structure
-
-```
-src/
-├── routes/          # Page components
-├── components/      # Reusable components
-├── hooks/           # TanStack Query hooks
-├── lib/             # API client, utilities
-├── types/           # TypeScript types
-└── styles.css       # Tailwind CSS
-```
-
-## API Integration
-
-Backend API runs on `http://localhost:3000`.
-
-Frontend proxies requests via `.env`:
-
-```
-VITE_API_URL=http://localhost:3000
-```
-
-All API calls go through `src/lib/api.ts`.
diff --git a/frontend/eslint.config.js b/frontend/eslint.config.js
new file mode 100644
index 0000000..5e6b472
--- /dev/null
+++ b/frontend/eslint.config.js
@@ -0,0 +1,23 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import { defineConfig, globalIgnores } from 'eslint/config'
+
+export default defineConfig([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      js.configs.recommended,
+      tseslint.configs.recommended,
+      reactHooks.configs.flat.recommended,
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+  },
+])
diff --git a/frontend/index.html b/frontend/index.html
index 24f4faf..072a57e 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,33 +1,10 @@
 <!doctype html>
-<html lang="es">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Quasar</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>
-<!doctype html>
-<html>
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Quasar</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>
-<!doctype html>
 <html lang="en">
   <head>
-    <meta charset="utf-8" />
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Quasar</title>
+    <title>frontend</title>
   </head>
   <body>
     <div id="root"></div>
diff --git a/frontend/package.json b/frontend/package.json
index d8fbb6d..a62a7dc 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -1,38 +1,54 @@
 {
-  "name": "quasar-frontend",
-  "version": "0.0.0",
+  "name": "frontend",
   "private": true,
-  "packageManager": "yarn@4.12.0",
+  "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vite build",
-    "preview": "vite preview",
-    "test": "vitest",
-    "test:run": "vitest run",
-    "lint": "echo \"No lint configured\"",
-    "format": "prettier --write ."
+    "build": "tsc -b && vite build",
+    "lint": "eslint .",
+    "preview": "vite preview"
   },
   "dependencies": {
-    "@hookform/resolvers": "^3.3.0",
-    "@tanstack/react-query": "^4.34.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-hook-form": "^7.48.0",
-    "zod": "^3.22.0"
+    "@radix-ui/react-checkbox": "^1.3.3",
+    "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-label": "^2.1.8",
+    "@radix-ui/react-scroll-area": "^1.2.10",
+    "@radix-ui/react-select": "^2.2.6",
+    "@radix-ui/react-tabs": "^1.1.13",
+    "@radix-ui/react-toast": "^1.2.15",
+    "@tanstack/react-form": "^1.28.3",
+    "@tanstack/react-query": "^5.90.21",
+    "@tanstack/react-router": "^1.162.2",
+    "axios": "^1.13.5",
+    "date-fns": "^4.1.0",
+    "lucide-react": "^0.575.0",
+    "react": "^19.2.0",
+    "react-dom": "^19.2.0",
+    "zod": "^4.3.6"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^6.0.0",
-    "@testing-library/react": "^14.0.0",
-    "@testing-library/user-event": "^14.5.0",
-    "@types/react": "^18.2.21",
-    "@types/react-dom": "^18.2.7",
-    "@vitejs/plugin-react": "^4.0.0",
-    "autoprefixer": "^10.4.14",
-    "jsdom": "^22.1.0",
-    "postcss": "^8.4.24",
-    "tailwindcss": "^3.4.7",
-    "typescript": "^5.2.2",
-    "vite": "^5.1.0",
-    "vitest": "^0.34.1"
+    "@eslint/js": "^9.39.1",
+    "@radix-ui/react-slot": "^1.2.4",
+    "@tailwindcss/postcss": "^4.2.0",
+    "@types/node": "^24.10.1",
+    "@types/react": "^19.2.7",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.1",
+    "autoprefixer": "^10.4.24",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
+    "globals": "^16.5.0",
+    "postcss": "^8.5.6",
+    "tailwind-merge": "^3.5.0",
+    "tailwindcss": "^4.2.0",
+    "tailwindcss-animate": "^1.0.7",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.48.0",
+    "vite": "^7.3.1"
   }
 }
diff --git a/frontend/postcss.config.cjs b/frontend/postcss.config.cjs
deleted file mode 100644
index c2d4cca..0000000
--- a/frontend/postcss.config.cjs
+++ /dev/null
@@ -1,18 +0,0 @@
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};
-module.exports = {
-  plugins: {
-    tailwindcss: {},
-    autoprefixer: {},
-  },
-};
diff --git a/frontend/postcss.config.js b/frontend/postcss.config.js
new file mode 100644
index 0000000..51a6e4e
--- /dev/null
+++ b/frontend/postcss.config.js
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    '@tailwindcss/postcss': {},
+    autoprefixer: {},
+  },
+};
diff --git a/frontend/public/vite.svg b/frontend/public/vite.svg
new file mode 100644
index 0000000..e7b8dfb
--- /dev/null
+++ b/frontend/public/vite.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
\ No newline at end of file
diff --git a/frontend/src/App.css b/frontend/src/App.css
new file mode 100644
index 0000000..b9d355d
--- /dev/null
+++ b/frontend/src/App.css
@@ -0,0 +1,42 @@
+#root {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+.logo {
+  height: 6em;
+  padding: 1.5em;
+  will-change: filter;
+  transition: filter 300ms;
+}
+.logo:hover {
+  filter: drop-shadow(0 0 2em #646cffaa);
+}
+.logo.react:hover {
+  filter: drop-shadow(0 0 2em #61dafbaa);
+}
+
+@keyframes logo-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  a:nth-of-type(2) .logo {
+    animation: logo-spin infinite 20s linear;
+  }
+}
+
+.card {
+  padding: 2em;
+}
+
+.read-the-docs {
+  color: #888;
+}
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 3ce81c5..846fe95 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,13 +1,38 @@
-import React from 'react';
-import Navbar from './components/layout/Navbar';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Input } from '@/components/ui/input';
+import { Badge } from '@/components/ui/badge';
 
-export default function App(): JSX.Element {
+function App() {
   return (
-    <div>
-      <Navbar />
-      <main>
-        <h1>Quasar</h1>
-      </main>
+    <div className="min-h-screen bg-background">
+      <div className="container mx-auto p-6">
+        <Card>
+          <CardHeader>
+            <CardTitle>Quasar - Biblioteca de Videojuegos</CardTitle>
+            <CardDescription>
+              Aplicación para gestionar tu colección personal de videojuegos
+            </CardDescription>
+          </CardHeader>
+          <CardContent className="space-y-4">
+            <div className="flex gap-4">
+              <Button>Botón Primario</Button>
+              <Button variant="secondary">Botón Secundario</Button>
+              <Button variant="outline">Botón Outline</Button>
+            </div>
+            <div className="space-y-2">
+              <Input placeholder="Buscar juegos..." />
+            </div>
+            <div className="flex gap-2">
+              <Badge variant="default">Etiqueta</Badge>
+              <Badge variant="secondary">Secundaria</Badge>
+              <Badge variant="outline">Outline</Badge>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
     </div>
   );
 }
+
+export default App;
diff --git a/frontend/src/api/client.ts b/frontend/src/api/client.ts
new file mode 100644
index 0000000..1cca928
--- /dev/null
+++ b/frontend/src/api/client.ts
@@ -0,0 +1,165 @@
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+// Función para unir clases de Tailwind
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
+
+// Configuración base de la API
+const API_BASE_URL = import.meta.env.VITE_API_URL || 'http://localhost:3000';
+
+// Interceptor para manejar errores comunes
+async function handleApiError(response: Response) {
+  if (!response.ok) {
+    const errorData = await response.json().catch(() => ({}));
+
+    // Manejar errores de autenticación
+    if (response.status === 401) {
+      throw new Error('No autorizado. Por favor inicia sesión.');
+    }
+
+    // Manejar errores de validación
+    if (response.status === 422) {
+      const fieldErrors = errorData.errors || {};
+      const errorMessage = Object.entries(fieldErrors)
+        .map(([field, errors]) => `${field}: ${Array.isArray(errors) ? errors.join(', ') : errors}`)
+        .join('; ');
+      throw new Error(errorMessage || 'Error de validación');
+    }
+
+    // Manejar errores de servidor
+    if (response.status >= 500) {
+      throw new Error('Error del servidor. Por favor intenta de nuevo más tarde.');
+    }
+
+    // Manejar otros errores
+    throw new Error(errorData.message || 'Error en la solicitud');
+  }
+
+  return response;
+}
+
+// Función genérica para peticiones GET
+export async function apiGet<T>(endpoint: string, params?: Record<string, any>): Promise<T> {
+  const url = new URL(`${API_BASE_URL}${endpoint}`);
+
+  if (params) {
+    Object.entries(params).forEach(([key, value]) => {
+      if (value !== undefined && value !== null) {
+        url.searchParams.append(key, String(value));
+      }
+    });
+  }
+
+  const response = await fetch(url.toString(), {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+  });
+
+  await handleApiError(response);
+  return response.json();
+}
+
+// Función genérica para peticiones POST
+export async function apiPost<T>(endpoint: string, data: any): Promise<T> {
+  const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(data),
+  });
+
+  await handleApiError(response);
+  return response.json();
+}
+
+// Función genérica para peticiones PUT
+export async function apiPut<T>(endpoint: string, data: any): Promise<T> {
+  const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+    method: 'PUT',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(data),
+  });
+
+  await handleApiError(response);
+  return response.json();
+}
+
+// Función genérica para peticiones DELETE
+export async function apiDelete<T>(endpoint: string): Promise<T> {
+  const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+    method: 'DELETE',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+  });
+
+  await handleApiError(response);
+  return response.json();
+}
+
+// Función para subir archivos
+export async function apiUpload<T>(
+  endpoint: string,
+  file: File,
+  additionalData?: Record<string, any>
+): Promise<T> {
+  const formData = new FormData();
+  formData.append('file', file);
+
+  if (additionalData) {
+    Object.entries(additionalData).forEach(([key, value]) => {
+      formData.append(key, String(value));
+    });
+  }
+
+  const response = await fetch(`${API_BASE_URL}${endpoint}`, {
+    method: 'POST',
+    body: formData,
+  });
+
+  await handleApiError(response);
+  return response.json();
+}
+
+// Función para peticiones con paginación
+export async function apiGetPaginated<T>(
+  endpoint: string,
+  page: number = 1,
+  limit: number = 10,
+  filters?: Record<string, any>
+): Promise<{
+  data: T[];
+  pagination: {
+    page: number;
+    limit: number;
+    total: number;
+    totalPages: number;
+  };
+}> {
+  const params = {
+    page,
+    limit,
+    ...filters,
+  };
+
+  return apiGet(endpoint, params);
+}
+
+// Función para buscar
+export async function apiSearch<T>(
+  endpoint: string,
+  query: string,
+  filters?: Record<string, any>
+): Promise<T[]> {
+  return apiGet(endpoint, {
+    search: query,
+    ...filters,
+  });
+}
diff --git a/frontend/src/api/games.ts b/frontend/src/api/games.ts
new file mode 100644
index 0000000..a1ead29
--- /dev/null
+++ b/frontend/src/api/games.ts
@@ -0,0 +1,80 @@
+import { apiGet, apiPost, apiPut, apiDelete, apiGetPaginated, apiSearch } from './client';
+import type { Game, GameFilters, GameFormData, PaginatedResponse } from '@/types';
+
+// Obtener todos los juegos con paginación
+export const getGames = async (page: number = 1, limit: number = 10, filters?: GameFilters) => {
+  return apiGetPaginated<Game>('/api/games', page, limit, filters);
+};
+
+// Obtener un juego por ID
+export const getGameById = async (id: number) => {
+  return apiGet<Game>(`/api/games/${id}`);
+};
+
+// Crear un nuevo juego
+export const createGame = async (data: GameFormData) => {
+  return apiPost<Game>('/api/games', data);
+};
+
+// Actualizar un juego existente
+export const updateGame = async (id: number, data: GameFormData) => {
+  return apiPut<Game>(`/api/games/${id}`, data);
+};
+
+// Eliminar un juego
+export const deleteGame = async (id: number) => {
+  return apiDelete(`/api/games/${id}`);
+};
+
+// Buscar juegos
+export const searchGames = async (query: string, filters?: GameFilters) => {
+  return apiSearch<Game>('/api/games', query, filters);
+};
+
+// Obtener juegos por plataforma
+export const getGamesByPlatform = async (
+  platformId: number,
+  page: number = 1,
+  limit: number = 10
+) => {
+  return apiGetPaginated<Game>(`/api/games/platform/${platformId}`, page, limit);
+};
+
+// Obtener juegos por etiqueta
+export const getGamesByTag = async (tagId: number, page: number = 1, limit: number = 10) => {
+  return apiGetPaginated<Game>(`/api/games/tag/${tagId}`, page, limit);
+};
+
+// Obtener juegos sin ROM
+export const getGamesWithoutRom = async (page: number = 1, limit: number = 10) => {
+  return apiGetPaginated<Game>('/api/games/without-rom', page, limit);
+};
+
+// Obtener juegos metadata pendiente
+export const getGamesWithPendingMetadata = async (page: number = 1, limit: number = 10) => {
+  return apiGetPaginated<Game>('/api/games/pending-metadata', page, limit);
+};
+
+// Actualizar metadata de un juego
+export const updateGameMetadata = async (id: number, metadata: any) => {
+  return apiPut<Game>(`/api/games/${id}/metadata`, metadata);
+};
+
+// Enriquecer metadata de un juego
+export const enrichGameMetadata = async (id: number, source: 'igdb' | 'rawg' | 'thegamesdb') => {
+  return apiPost<Game>(`/api/games/${id}/enrich`, { source });
+};
+
+// Obtener estadísticas de juegos
+export const getGameStats = async () => {
+  return apiGet<{
+    totalGames: number;
+    gamesWithRom: number;
+    gamesWithoutRom: number;
+    gamesWithMetadata: number;
+    gamesWithoutMetadata: number;
+    totalPlatforms: number;
+    totalTags: number;
+    averageRating: number;
+  }>('/api/games/stats');
+};
diff --git a/frontend/src/api/import.ts b/frontend/src/api/import.ts
new file mode 100644
index 0000000..b62c0b5
--- /dev/null
+++ b/frontend/src/api/import.ts
@@ -0,0 +1,76 @@
+import { apiGet, apiPost, apiPut, apiDelete, apiUpload } from './client';
+import type { ImportRomFormData } from '@/types';
+
+// Iniciar escaneo de directorio
+export const startDirectoryScan = async (directoryPath: string) => {
+  return apiPost('/api/import/scan', { directoryPath });
+};
+
+// Obtener estado del escaneo
+export const getScanStatus = async (scanId: string) => {
+  return apiGet(`/api/import/scan/${scanId}/status`);
+};
+
+// Obtener lista de ROMs detectadas
+export const getDetectedRoms = async (scanId: string) => {
+  return apiGet(`/api/import/scan/${scanId}/roms`);
+};
+
+// Procesar ROMs detectadas
+export const processDetectedRoms = async (scanId: string, romIds: number[]) => {
+  return apiPost(`/api/import/scan/${scanId}/process`, { romIds });
+};
+
+// Importar ROM manualmente
+export const importRom = async (data: ImportRomFormData & { file: File }) => {
+  const { file, ...rest } = data;
+  return apiUpload('/api/import/rom', file, rest);
+};
+
+// Obtener historial de importaciones
+export const getImportHistory = async (page: number = 1, limit: number = 10) => {
+  return apiGet(`/api/import/history?page=${page}&limit=${limit}`);
+};
+
+// Obtener estadísticas de importación
+export const getImportStats = async () => {
+  return apiGet<{
+    totalImports: number;
+    successfulImports: number;
+    failedImports: number;
+    totalRomsScanned: number;
+    totalRomsImported: number;
+    averageProcessingTime: number;
+    lastImportDate?: string;
+  }>('/api/import/stats');
+};
+
+// Cancelar escaneo en progreso
+export const cancelScan = async (scanId: string) => {
+  return apiDelete(`/api/import/scan/${scanId}`);
+};
+
+// Reintentar importación fallida
+export const retryImport = async (importId: number) => {
+  return apiPost(`/api/import/retry/${importId}`);
+};
+
+// Eliminar registro de importación
+export const deleteImportRecord = async (importId: number) => {
+  return apiDelete(`/api/import/history/${importId}`);
+};
+
+// Obtener información de archivo ROM
+export const getRomInfo = async (romPath: string) => {
+  return apiGet(`/api/import/rom-info?path=${encodeURIComponent(romPath)}`);
+};
+
+// Verificar integridad de ROM
+export const verifyRomIntegrity = async (romPath: string, romType: string) => {
+  return apiPost('/api/import/verify-rom', { romPath, romType });
+};
+
+// Obtener directorios disponibles para escaneo
+export const getAvailableDirectories = async () => {
+  return apiGet<string[]>('/api/import/directories');
+};
diff --git a/frontend/src/api/platforms.ts b/frontend/src/api/platforms.ts
new file mode 100644
index 0000000..044b790
--- /dev/null
+++ b/frontend/src/api/platforms.ts
@@ -0,0 +1,52 @@
+import { apiGet, apiPost, apiPut, apiDelete, apiGetPaginated, apiSearch } from './client';
+import type { Platform, PlatformFilters, PlatformFormData } from '@/types';
+
+// Obtener todas las plataformas con paginación
+export const getPlatforms = async (
+  page: number = 1,
+  limit: number = 10,
+  filters?: PlatformFilters
+) => {
+  return apiGetPaginated<Platform>('/api/platforms', page, limit, filters);
+};
+
+// Obtener todas las plataformas (sin paginación para selectores)
+export const getAllPlatforms = async () => {
+  return apiGet<Platform[]>('/api/platforms/all');
+};
+
+// Obtener una plataforma por ID
+export const getPlatformById = async (id: number) => {
+  return apiGet<Platform>(`/api/platforms/${id}`);
+};
+
+// Crear una nueva plataforma
+export const createPlatform = async (data: PlatformFormData) => {
+  return apiPost<Platform>('/api/platforms', data);
+};
+
+// Actualizar una plataforma existente
+export const updatePlatform = async (id: number, data: PlatformFormData) => {
+  return apiPut<Platform>(`/api/platforms/${id}`, data);
+};
+
+// Eliminar una plataforma
+export const deletePlatform = async (id: number) => {
+  return apiDelete(`/api/platforms/${id}`);
+};
+
+// Buscar plataformas
+export const searchPlatforms = async (query: string, filters?: PlatformFilters) => {
+  return apiSearch<Platform>('/api/platforms', query, filters);
+};
+
+// Obtener estadísticas de plataformas
+export const getPlatformStats = async () => {
+  return apiGet<{
+    totalPlatforms: number;
+    totalGames: number;
+    averageGamesPerPlatform: number;
+    mostPopularPlatform: string;
+    leastPopularPlatform: string;
+  }>('/api/platforms/stats');
+};
diff --git a/frontend/src/api/settings.ts b/frontend/src/api/settings.ts
new file mode 100644
index 0000000..6bdb25d
--- /dev/null
+++ b/frontend/src/api/settings.ts
@@ -0,0 +1,107 @@
+import { apiGet, apiPost, apiPut } from './client';
+import type { SettingsFormData } from '@/types';
+
+// Obtener configuración actual
+export const getSettings = async () => {
+  return apiGet('/api/settings');
+};
+
+// Actualizar configuración
+export const updateSettings = async (data: SettingsFormData) => {
+  return apiPut('/api/settings', data);
+};
+
+// Probar conexión con IGDB
+export const testIgdbConnection = async (apiKey: string) => {
+  return apiPost('/api/settings/test-igdb', { apiKey });
+};
+
+// Probar conexión con RAWG
+export const testRawgConnection = async (apiKey: string) => {
+  return apiPost('/api/settings/test-rawg', { apiKey });
+};
+
+// Probar conexión con TheGamesDB
+export const testThegamesdbConnection = async (apiKey: string) => {
+  return apiPost('/api/settings/test-thegamesdb', { apiKey });
+};
+
+// Obtener estado de servicios externos
+export const getExternalServicesStatus = async () => {
+  return apiGet<{
+    igdb: { connected: boolean; lastChecked?: string };
+    rawg: { connected: boolean; lastChecked?: string };
+    thegamesdb: { connected: boolean; lastChecked?: string };
+  }>('/api/settings/services-status');
+};
+
+// Obtener configuración de importación automática
+export const getAutoImportConfig = async () => {
+  return apiGet('/api/settings/auto-import');
+};
+
+// Actualizar configuración de importación automática
+export const updateAutoImportConfig = async (enabled: boolean, directory?: string) => {
+  return apiPut('/api/settings/auto-import', { enabled, directory });
+};
+
+// Obtener configuración de exportación
+export const getExportConfig = async () => {
+  return apiGet('/api/settings/export');
+};
+
+// Actualizar configuración de exportación
+export const updateExportConfig = async (format: 'csv' | 'json', fields: string[]) => {
+  return apiPut('/api/settings/export', { format, fields });
+};
+
+// Exportar datos
+export const exportData = async (format: 'csv' | 'json', filters?: Record<string, any>) => {
+  const params = new URLSearchParams();
+  params.append('format', format);
+
+  if (filters) {
+    Object.entries(filters).forEach(([key, value]) => {
+      if (value !== undefined && value !== null) {
+        params.append(key, String(value));
+      }
+    });
+  }
+
+  const response = await fetch(`/api/settings/export?${params.toString()}`, {
+    method: 'GET',
+  });
+
+  if (!response.ok) {
+    throw new Error('Error al exportar datos');
+  }
+
+  return response.blob();
+};
+
+// Obtener estadísticas del sistema
+export const getSystemStats = async () => {
+  return apiGet<{
+    totalGames: number;
+    totalPlatforms: number;
+    totalTags: number;
+    totalRoms: number;
+    totalSize: number;
+    averageRating: number;
+    recentActivity: Array<{
+      type: string;
+      message: string;
+      timestamp: string;
+    }>;
+  }>('/api/settings/system-stats');
+};
+
+// Limpiar caché
+export const clearCache = async () => {
+  return apiPost('/api/settings/clear-cache');
+};
+
+// Obtener versión del sistema
+export const getSystemVersion = async () => {
+  return apiGet('/api/settings/version');
+};
diff --git a/frontend/src/api/tags.ts b/frontend/src/api/tags.ts
new file mode 100644
index 0000000..2d2ecbd
--- /dev/null
+++ b/frontend/src/api/tags.ts
@@ -0,0 +1,68 @@
+import { apiGet, apiPost, apiPut, apiDelete, apiGetPaginated, apiSearch } from './client';
+import type { Tag, TagFilters, TagFormData } from '@/types';
+
+// Obtener todas las etiquetas con paginación
+export const getTags = async (page: number = 1, limit: number = 10, filters?: TagFilters) => {
+  return apiGetPaginated<Tag>('/api/tags', page, limit, filters);
+};
+
+// Obtener todas las etiquetas (sin paginación para selectores)
+export const getAllTags = async () => {
+  return apiGet<Tag[]>('/api/tags/all');
+};
+
+// Obtener una etiqueta por ID
+export const getTagById = async (id: number) => {
+  return apiGet<Tag>(`/api/tags/${id}`);
+};
+
+// Crear una nueva etiqueta
+export const createTag = async (data: TagFormData) => {
+  return apiPost<Tag>('/api/tags', data);
+};
+
+// Actualizar una etiqueta existente
+export const updateTag = async (id: number, data: TagFormData) => {
+  return apiPut<Tag>(`/api/tags/${id}`, data);
+};
+
+// Eliminar una etiqueta
+export const deleteTag = async (id: number) => {
+  return apiDelete(`/api/tags/${id}`);
+};
+
+// Buscar etiquetas
+export const searchTags = async (query: string, filters?: TagFilters) => {
+  return apiSearch<Tag>('/api/tags', query, filters);
+};
+
+// Obtener etiquetas más usadas
+export const getPopularTags = async (limit: number = 10) => {
+  return apiGet<Tag[]>(`/api/tags/popular?limit=${limit}`);
+};
+
+// Obtener etiquetas por juego
+export const getTagsByGame = async (gameId: number) => {
+  return apiGet<Tag[]>(`/api/tags/game/${gameId}`);
+};
+
+// Asignar etiquetas a un juego
+export const assignTagsToGame = async (gameId: number, tagIds: number[]) => {
+  return apiPost(`/api/games/${gameId}/tags`, { tagIds });
+};
+
+// Eliminar etiquetas de un juego
+export const removeTagsFromGame = async (gameId: number, tagIds: number[]) => {
+  return apiPost(`/api/games/${gameId}/tags/remove`, { tagIds });
+};
+
+// Obtener estadísticas de etiquetas
+export const getTagStats = async () => {
+  return apiGet<{
+    totalTags: number;
+    totalTaggedGames: number;
+    averageTagsPerGame: number;
+    mostUsedTag: string;
+    leastUsedTag: string;
+  }>('/api/tags/stats');
+};
diff --git a/frontend/src/assets/react.svg b/frontend/src/assets/react.svg
new file mode 100644
index 0000000..6c87de9
--- /dev/null
+++ b/frontend/src/assets/react.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="35.93" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 228"><path fill="#00D8FF" d="M210.483 73.824a171.49 171.49 0 0 0-8.24-2.597c.465-1.9.893-3.777 1.273-5.621c6.238-30.281 2.16-54.676-11.769-62.708c-13.355-7.7-35.196.329-57.254 19.526a171.23 171.23 0 0 0-6.375 5.848a155.866 155.866 0 0 0-4.241-3.917C100.759 3.829 77.587-4.822 63.673 3.233C50.33 10.957 46.379 33.89 51.995 62.588a170.974 170.974 0 0 0 1.892 8.48c-3.28.932-6.445 1.924-9.474 2.98C17.309 83.498 0 98.307 0 113.668c0 15.865 18.582 31.778 46.812 41.427a145.52 145.52 0 0 0 6.921 2.165a167.467 167.467 0 0 0-2.01 9.138c-5.354 28.2-1.173 50.591 12.134 58.266c13.744 7.926 36.812-.22 59.273-19.855a145.567 145.567 0 0 0 5.342-4.923a168.064 168.064 0 0 0 6.92 6.314c21.758 18.722 43.246 26.282 56.54 18.586c13.731-7.949 18.194-32.003 12.4-61.268a145.016 145.016 0 0 0-1.535-6.842c1.62-.48 3.21-.974 4.76-1.488c29.348-9.723 48.443-25.443 48.443-41.52c0-15.417-17.868-30.326-45.517-39.844Zm-6.365 70.984c-1.4.463-2.836.91-4.3 1.345c-3.24-10.257-7.612-21.163-12.963-32.432c5.106-11 9.31-21.767 12.459-31.957c2.619.758 5.16 1.557 7.61 2.4c23.69 8.156 38.14 20.213 38.14 29.504c0 9.896-15.606 22.743-40.946 31.14Zm-10.514 20.834c2.562 12.94 2.927 24.64 1.23 33.787c-1.524 8.219-4.59 13.698-8.382 15.893c-8.067 4.67-25.32-1.4-43.927-17.412a156.726 156.726 0 0 1-6.437-5.87c7.214-7.889 14.423-17.06 21.459-27.246c12.376-1.098 24.068-2.894 34.671-5.345a134.17 134.17 0 0 1 1.386 6.193ZM87.276 214.515c-7.882 2.783-14.16 2.863-17.955.675c-8.075-4.657-11.432-22.636-6.853-46.752a156.923 156.923 0 0 1 1.869-8.499c10.486 2.32 22.093 3.988 34.498 4.994c7.084 9.967 14.501 19.128 21.976 27.15a134.668 134.668 0 0 1-4.877 4.492c-9.933 8.682-19.886 14.842-28.658 17.94ZM50.35 144.747c-12.483-4.267-22.792-9.812-29.858-15.863c-6.35-5.437-9.555-10.836-9.555-15.216c0-9.322 13.897-21.212 37.076-29.293c2.813-.98 5.757-1.905 8.812-2.773c3.204 10.42 7.406 21.315 12.477 32.332c-5.137 11.18-9.399 22.249-12.634 32.792a134.718 134.718 0 0 1-6.318-1.979Zm12.378-84.26c-4.811-24.587-1.616-43.134 6.425-47.789c8.564-4.958 27.502 2.111 47.463 19.835a144.318 144.318 0 0 1 3.841 3.545c-7.438 7.987-14.787 17.08-21.808 26.988c-12.04 1.116-23.565 2.908-34.161 5.309a160.342 160.342 0 0 1-1.76-7.887Zm110.427 27.268a347.8 347.8 0 0 0-7.785-12.803c8.168 1.033 15.994 2.404 23.343 4.08c-2.206 7.072-4.956 14.465-8.193 22.045a381.151 381.151 0 0 0-7.365-13.322Zm-45.032-43.861c5.044 5.465 10.096 11.566 15.065 18.186a322.04 322.04 0 0 0-30.257-.006c4.974-6.559 10.069-12.652 15.192-18.18ZM82.802 87.83a323.167 323.167 0 0 0-7.227 13.238c-3.184-7.553-5.909-14.98-8.134-22.152c7.304-1.634 15.093-2.97 23.209-3.984a321.524 321.524 0 0 0-7.848 12.897Zm8.081 65.352c-8.385-.936-16.291-2.203-23.593-3.793c2.26-7.3 5.045-14.885 8.298-22.6a321.187 321.187 0 0 0 7.257 13.246c2.594 4.48 5.28 8.868 8.038 13.147Zm37.542 31.03c-5.184-5.592-10.354-11.779-15.403-18.433c4.902.192 9.899.29 14.978.29c5.218 0 10.376-.117 15.453-.343c-4.985 6.774-10.018 12.97-15.028 18.486Zm52.198-57.817c3.422 7.8 6.306 15.345 8.596 22.52c-7.422 1.694-15.436 3.058-23.88 4.071a382.417 382.417 0 0 0 7.859-13.026a347.403 347.403 0 0 0 7.425-13.565Zm-16.898 8.101a358.557 358.557 0 0 1-12.281 19.815a329.4 329.4 0 0 1-23.444.823c-7.967 0-15.716-.248-23.178-.732a310.202 310.202 0 0 1-12.513-19.846h.001a307.41 307.41 0 0 1-10.923-20.627a310.278 310.278 0 0 1 10.89-20.637l-.001.001a307.318 307.318 0 0 1 12.413-19.761c7.613-.576 15.42-.876 23.31-.876H128c7.926 0 15.743.303 23.354.883a329.357 329.357 0 0 1 12.335 19.695a358.489 358.489 0 0 1 11.036 20.54a329.472 329.472 0 0 1-11 20.722Zm22.56-122.124c8.572 4.944 11.906 24.881 6.52 51.026c-.344 1.668-.73 3.367-1.15 5.09c-10.622-2.452-22.155-4.275-34.23-5.408c-7.034-10.017-14.323-19.124-21.64-27.008a160.789 160.789 0 0 1 5.888-5.4c18.9-16.447 36.564-22.941 44.612-18.3ZM128 90.808c12.625 0 22.86 10.235 22.86 22.86s-10.235 22.86-22.86 22.86s-22.86-10.235-22.86-22.86s10.235-22.86 22.86-22.86Z"></path></svg>
\ No newline at end of file
diff --git a/frontend/src/components/games/GameCard.tsx b/frontend/src/components/games/GameCard.tsx
deleted file mode 100644
index 0f8ad11..0000000
--- a/frontend/src/components/games/GameCard.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import { Game } from '../../types/game';
-
-interface GameCardProps {
-  game: Game;
-  onEdit?: (game: Game) => void;
-  onDelete?: (id: string) => void;
-}
-
-export default function GameCard({ game, onEdit, onDelete }: GameCardProps): JSX.Element {
-  return (
-    <div className="rounded border border-gray-300 p-4 shadow-sm hover:shadow-md">
-      <h3 className="mb-2 text-lg font-semibold">{game.title}</h3>
-      <p className="mb-2 text-sm text-gray-600">{game.slug}</p>
-      {game.description && <p className="mb-3 text-sm text-gray-700">{game.description}</p>}
-      <p className="mb-4 text-xs text-gray-500">
-        Added: {new Date(game.createdAt).toLocaleDateString()}
-      </p>
-      <div className="flex gap-2">
-        {onEdit && (
-          <button
-            onClick={() => onEdit(game)}
-            className="rounded bg-blue-600 px-3 py-1 text-sm text-white hover:bg-blue-700"
-          >
-            Edit
-          </button>
-        )}
-        {onDelete && (
-          <button
-            onClick={() => onDelete(game.id)}
-            className="rounded bg-red-600 px-3 py-1 text-sm text-white hover:bg-red-700"
-          >
-            Delete
-          </button>
-        )}
-      </div>
-    </div>
-  );
-}
diff --git a/frontend/src/components/games/GameForm.tsx b/frontend/src/components/games/GameForm.tsx
deleted file mode 100644
index a89ee22..0000000
--- a/frontend/src/components/games/GameForm.tsx
+++ /dev/null
@@ -1,190 +0,0 @@
-import { useForm } from 'react-hook-form';
-import { zodResolver } from '@hookform/resolvers/zod';
-import { z } from 'zod';
-import { Game, CreateGameInput } from '../../types/game';
-
-const gameFormSchema = z.object({
-  title: z.string().min(1, 'Title is required'),
-  platformId: z.string().min(1, 'Platform is required'),
-  description: z.string().optional().nullable(),
-  priceCents: z.number().optional(),
-  currency: z.string().optional().default('USD'),
-  store: z.string().optional(),
-  date: z.string().optional(),
-  condition: z.enum(['Loose', 'CIB', 'New']).optional(),
-  notes: z.string().optional().nullable(),
-});
-
-type GameFormData = z.infer<typeof gameFormSchema>;
-
-interface GameFormProps {
-  initialData?: Game;
-  onSubmit: (data: CreateGameInput | Game) => void | Promise<void>;
-  isLoading?: boolean;
-}
-
-export default function GameForm({
-  initialData,
-  onSubmit,
-  isLoading = false,
-}: GameFormProps): JSX.Element {
-  const {
-    register,
-    handleSubmit,
-    formState: { errors },
-  } = useForm<GameFormData>({
-    resolver: zodResolver(gameFormSchema),
-    defaultValues: initialData
-      ? {
-          title: initialData.title,
-          description: initialData.description,
-          priceCents: undefined,
-          currency: 'USD',
-          store: undefined,
-          date: undefined,
-          condition: undefined,
-          notes: undefined,
-        }
-      : undefined,
-  });
-
-  const onFormSubmit = (data: GameFormData) => {
-    onSubmit(data as CreateGameInput);
-  };
-
-  return (
-    <form onSubmit={handleSubmit(onFormSubmit)} className="space-y-4">
-      <div>
-        <label htmlFor="title" className="block text-sm font-medium">
-          Title *
-        </label>
-        <input
-          {...register('title')}
-          id="title"
-          type="text"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-        />
-        {errors.title && <p className="text-red-600 text-sm">{errors.title.message}</p>}
-      </div>
-
-      <div>
-        <label htmlFor="platformId" className="block text-sm font-medium">
-          Platform *
-        </label>
-        <input
-          {...register('platformId')}
-          id="platformId"
-          type="text"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-        />
-        {errors.platformId && <p className="text-red-600 text-sm">{errors.platformId.message}</p>}
-      </div>
-
-      <div>
-        <label htmlFor="condition" className="block text-sm font-medium">
-          Condition
-        </label>
-        <select
-          {...register('condition')}
-          id="condition"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-        >
-          <option value="">Select condition</option>
-          <option value="Loose">Loose</option>
-          <option value="CIB">CIB</option>
-          <option value="New">New</option>
-        </select>
-      </div>
-
-      <div>
-        <label htmlFor="description" className="block text-sm font-medium">
-          Description
-        </label>
-        <textarea
-          {...register('description')}
-          id="description"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-          rows={3}
-        />
-      </div>
-
-      <div>
-        <label htmlFor="priceCents" className="block text-sm font-medium">
-          Price (cents)
-        </label>
-        <input
-          {...register('priceCents', { valueAsNumber: true })}
-          id="priceCents"
-          type="number"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-        />
-      </div>
-
-      <div>
-        <label htmlFor="currency" className="block text-sm font-medium">
-          Currency
-        </label>
-        <input
-          {...register('currency')}
-          id="currency"
-          type="text"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-          defaultValue="USD"
-        />
-      </div>
-
-      <div>
-        <label htmlFor="store" className="block text-sm font-medium">
-          Store
-        </label>
-        <input
-          {...register('store')}
-          id="store"
-          type="text"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-        />
-      </div>
-
-      <div>
-        <label htmlFor="date" className="block text-sm font-medium">
-          Purchase Date
-        </label>
-        <input
-          {...register('date')}
-          id="date"
-          type="date"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-        />
-      </div>
-
-      <div>
-        <label htmlFor="notes" className="block text-sm font-medium">
-          Notes
-        </label>
-        <textarea
-          {...register('notes')}
-          id="notes"
-          className="mt-1 block w-full rounded border border-gray-300 px-3 py-2"
-          disabled={isLoading}
-          rows={2}
-        />
-      </div>
-
-      <button
-        type="submit"
-        disabled={isLoading}
-        className="w-full rounded bg-blue-600 px-4 py-2 text-white disabled:bg-gray-400"
-      >
-        {isLoading ? 'Saving...' : 'Save Game'}
-      </button>
-    </form>
-  );
-}
diff --git a/frontend/src/components/layout/Header.tsx b/frontend/src/components/layout/Header.tsx
new file mode 100644
index 0000000..79977ab
--- /dev/null
+++ b/frontend/src/components/layout/Header.tsx
@@ -0,0 +1,88 @@
+import { Link, useLocation } from '@tanstack/react-router';
+import { Menu, Search, Settings, Gamepad2, Home, FileText } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { cn } from '@/lib/utils';
+
+interface HeaderProps {
+  onMenuToggle?: () => void;
+}
+
+const navigation = [
+  { name: 'Dashboard', href: '/', icon: Home },
+  { name: 'Juegos', href: '/games', icon: Gamepad2 },
+  { name: 'Importar ROMs', href: '/import', icon: FileText },
+  { name: 'Configuración', href: '/settings', icon: Settings },
+];
+
+export function Header({ onMenuToggle }: HeaderProps) {
+  const location = useLocation();
+
+  return (
+    <header className="sticky top-0 z-50 w-full border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
+      <div className="container flex h-14 items-center">
+        {/* Botón de menú para móviles */}
+        <Button variant="ghost" size="sm" className="mr-4 md:hidden" onClick={onMenuToggle}>
+          <Menu className="h-5 w-5" />
+          <span className="sr-only">Toggle menu</span>
+        </Button>
+
+        {/* Logo y título */}
+        <div className="mr-4 hidden md:flex">
+          <Link to="/" className="mr-6 flex items-center space-x-2">
+            <Gamepad2 className="h-6 w-6" />
+            <span className="hidden font-bold sm:inline-block">Quasar</span>
+          </Link>
+        </div>
+
+        {/* Navegación principal */}
+        <nav className="flex items-center space-x-6 text-sm font-medium">
+          {navigation.map((item) => {
+            const Icon = item.icon;
+            const isActive = location.pathname === item.href;
+
+            return (
+              <Link
+                key={item.name}
+                to={item.href}
+                className={cn(
+                  'transition-colors hover:text-foreground/80',
+                  isActive ? 'text-foreground' : 'text-foreground/60'
+                )}
+              >
+                <span className="flex items-center space-x-1">
+                  <Icon className="h-4 w-4" />
+                  <span>{item.name}</span>
+                </span>
+              </Link>
+            );
+          })}
+        </nav>
+
+        {/* Barra de búsqueda */}
+        <div className="flex flex-1 items-center justify-between space-x-2 md:justify-end">
+          <div className="w-full flex-1 md:w-auto md:flex-none">
+            {/* Placeholder para barra de búsqueda */}
+            <Button
+              variant="outline"
+              className="relative h-8 w-full justify-start rounded-[0.5rem] bg-background text-sm font-normal text-muted-foreground shadow-none sm:pr-12 md:w-40 lg:w-64"
+            >
+              <Search className="mr-2 h-4 w-4" />
+              Buscar juegos...
+              <kbd className="pointer-events-none absolute right-[0.3rem] top-[0.3rem] hidden h-5 select-none items-center gap-1 rounded border bg-muted px-1.5 font-mono text-[10px] font-medium opacity-100 sm:flex">
+                ⌘K
+              </kbd>
+            </Button>
+          </div>
+        </div>
+
+        {/* Usuario y acciones */}
+        <div className="flex items-center space-x-2">
+          <Button variant="ghost" size="sm">
+            <Settings className="h-4 w-4" />
+            <span className="sr-only">Configuración</span>
+          </Button>
+        </div>
+      </div>
+    </header>
+  );
+}
diff --git a/frontend/src/components/layout/Layout.tsx b/frontend/src/components/layout/Layout.tsx
new file mode 100644
index 0000000..6ae508f
--- /dev/null
+++ b/frontend/src/components/layout/Layout.tsx
@@ -0,0 +1,38 @@
+import { useState } from 'react';
+import { Outlet } from '@tanstack/react-router';
+import { Header } from './Header';
+import { Sidebar } from './Sidebar';
+
+interface LayoutProps {
+  sidebarOpen?: boolean;
+  onSidebarChange?: (open: boolean) => void;
+}
+
+export function Layout({ sidebarOpen = false, onSidebarChange }: LayoutProps) {
+  const [isSidebarOpen, setIsSidebarOpen] = useState(sidebarOpen);
+
+  const handleSidebarToggle = (open: boolean) => {
+    setIsSidebarOpen(open);
+    onSidebarChange?.(open);
+  };
+
+  return (
+    <div className="min-h-screen bg-background">
+      {/* Sidebar */}
+      <Sidebar isOpen={isSidebarOpen} onClose={() => handleSidebarToggle(false)} />
+
+      {/* Contenido principal */}
+      <div className="md:pl-64">
+        {/* Header */}
+        <Header onMenuToggle={() => handleSidebarToggle(true)} />
+
+        {/* Main content */}
+        <main className="container mx-auto p-6">
+          <div className="space-y-6">
+            <Outlet />
+          </div>
+        </main>
+      </div>
+    </div>
+  );
+}
diff --git a/frontend/src/components/layout/Navbar.tsx b/frontend/src/components/layout/Navbar.tsx
deleted file mode 100644
index 0a496b8..0000000
--- a/frontend/src/components/layout/Navbar.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from 'react';
-
-export default function Navbar(): JSX.Element {
-  return (
-    <nav style={{ padding: 12 }}>
-      <a href="/roms" style={{ marginRight: 12 }}>
-        ROMs
-      </a>
-      <a href="/games">Games</a>
-    </nav>
-  );
-}
diff --git a/frontend/src/components/layout/Sidebar.tsx b/frontend/src/components/layout/Sidebar.tsx
index 698341c..790220d 100644
--- a/frontend/src/components/layout/Sidebar.tsx
+++ b/frontend/src/components/layout/Sidebar.tsx
@@ -1,9 +1,119 @@
-import React from 'react';
+import { Link, useLocation } from '@tanstack/react-router';
+import { Home, Gamepad2, FileText, Settings, Database, Tag, Download, Upload } from 'lucide-react';
+import { cn } from '@/lib/utils';
+import { Button } from '@/components/ui/button';
+import { ScrollArea } from '@/components/ui/scroll-area';
+import { Badge } from '@/components/ui/badge';
+
+interface SidebarProps {
+  isOpen?: boolean;
+  onClose?: () => void;
+}
+
+const navigation = [
+  { name: 'Dashboard', href: '/', icon: Home, count: null },
+  { name: 'Juegos', href: '/games', icon: Gamepad2, count: null },
+  {
+    name: 'Plataformas',
+    href: '/platforms',
+    icon: Database,
+    count: null,
+  },
+  {
+    name: 'Etiquetas',
+    href: '/tags',
+    icon: Tag,
+    count: null,
+  },
+  { name: 'Importar ROMs', href: '/import', icon: Download, count: null },
+  { name: 'Exportar', href: '/export', icon: Upload, count: null },
+  { name: 'Configuración', href: '/settings', icon: Settings, count: null },
+];
+
+export function Sidebar({ isOpen, onClose }: SidebarProps) {
+  const location = useLocation();
 
-export default function Sidebar(): JSX.Element {
   return (
-    <aside style={{ padding: 12 }}>
-      <div>Sidebar (placeholder)</div>
-    </aside>
+    <>
+      {/* Overlay para móviles */}
+      {isOpen && <div className="fixed inset-0 z-40 bg-black/50 md:hidden" onClick={onClose} />}
+
+      {/* Sidebar */}
+      <div
+        className={cn(
+          'fixed left-0 top-0 z-50 h-full w-64 transform border-r bg-background transition-transform duration-300 ease-in-out md:relative md:translate-x-0',
+          isOpen ? 'translate-x-0' : '-translate-x-full md:translate-x-0'
+        )}
+      >
+        <div className="flex h-full flex-col">
+          {/* Header del sidebar */}
+          <div className="flex h-14 items-center border-b px-4">
+            <div className="flex items-center space-x-2">
+              <Gamepad2 className="h-6 w-6" />
+              <span className="font-bold">Quasar</span>
+            </div>
+            <Button variant="ghost" size="sm" className="ml-auto md:hidden" onClick={onClose}>
+              ✕
+            </Button>
+          </div>
+
+          {/* Contenido del sidebar */}
+          <ScrollArea className="flex-1">
+            <nav className="p-4 space-y-1">
+              {navigation.map((item) => {
+                const Icon = item.icon;
+                const isActive = location.pathname === item.href;
+
+                return (
+                  <Link
+                    key={item.name}
+                    to={item.href}
+                    onClick={onClose}
+                    className={cn(
+                      'flex items-center justify-between rounded-lg px-3 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground',
+                      isActive ? 'bg-accent text-accent-foreground' : 'text-muted-foreground'
+                    )}
+                  >
+                    <div className="flex items-center space-x-3">
+                      <Icon className="h-4 w-4" />
+                      <span>{item.name}</span>
+                    </div>
+                    {item.count !== null && (
+                      <Badge variant="secondary" className="text-xs">
+                        {item.count}
+                      </Badge>
+                    )}
+                  </Link>
+                );
+              })}
+            </nav>
+
+            {/* Sección adicional con información */}
+            <div className="mt-8 p-4 border-t">
+              <h3 className="text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-3">
+                Información
+              </h3>
+              <div className="space-y-2 text-xs text-muted-foreground">
+                <div className="flex justify-between">
+                  <span>Versión</span>
+                  <span>1.0.0</span>
+                </div>
+                <div className="flex justify-between">
+                  <span>Última actualización</span>
+                  <span>2024-01-15</span>
+                </div>
+              </div>
+            </div>
+          </ScrollArea>
+
+          {/* Footer del sidebar */}
+          <div className="flex h-14 items-center border-t px-4">
+            <div className="flex items-center space-x-2 text-xs text-muted-foreground">
+              <span>© 2024 Quasar</span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </>
   );
 }
diff --git a/frontend/src/components/roms/MetadataSearchDialog.tsx b/frontend/src/components/roms/MetadataSearchDialog.tsx
deleted file mode 100644
index fa10a93..0000000
--- a/frontend/src/components/roms/MetadataSearchDialog.tsx
+++ /dev/null
@@ -1,163 +0,0 @@
-import React, { useState } from 'react';
-import { useEnrichMetadata } from '../../hooks/useRoms';
-import { EnrichedGame } from '../../types/rom';
-
-interface MetadataSearchDialogProps {
-  romId: string;
-  isOpen: boolean;
-  onOpenChange: (open: boolean) => void;
-  onSelect: (game: EnrichedGame) => void;
-}
-
-const sourceLabels: Record<string, string> = {
-  igdb: 'IGDB',
-  rawg: 'RAWG',
-  thegamesdb: 'TGDB',
-};
-
-export default function MetadataSearchDialog({
-  romId,
-  isOpen,
-  onOpenChange,
-  onSelect,
-}: MetadataSearchDialogProps): JSX.Element | null {
-  const [query, setQuery] = useState('');
-  const [results, setResults] = useState<EnrichedGame[]>([]);
-  const [searched, setSearched] = useState(false);
-  const enrichMutation = useEnrichMetadata();
-
-  const handleSearch = async (e: React.FormEvent) => {
-    e.preventDefault();
-    setSearched(false);
-
-    if (!query.trim()) return;
-
-    try {
-      const searchResults = await enrichMutation.mutateAsync(query);
-      setResults(searchResults);
-      setSearched(true);
-    } catch (err) {
-      console.error('Search failed:', err);
-      setResults([]);
-      setSearched(true);
-    }
-  };
-
-  const handleSelect = (game: EnrichedGame) => {
-    onSelect(game);
-    onOpenChange(false);
-    setQuery('');
-    setResults([]);
-    setSearched(false);
-  };
-
-  if (!isOpen) {
-    return null;
-  }
-
-  return (
-    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50">
-      <div className="bg-white rounded-lg shadow-lg p-6 max-w-2xl w-full max-h-[90vh] overflow-auto">
-        <div className="flex justify-between items-center mb-4">
-          <h2 className="text-lg font-semibold">Search Metadata</h2>
-          <button
-            onClick={() => onOpenChange(false)}
-            aria-label="close"
-            className="text-gray-500 hover:text-gray-700 text-xl"
-          >
-            ✕
-          </button>
-        </div>
-
-        <form onSubmit={handleSearch} className="mb-6">
-          <div className="flex gap-2">
-            <input
-              type="text"
-              placeholder="Search game title"
-              value={query}
-              onChange={(e) => setQuery(e.target.value)}
-              disabled={enrichMutation.isPending}
-              className="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:bg-gray-100"
-            />
-            <button
-              type="submit"
-              disabled={enrichMutation.isPending}
-              className="bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 disabled:bg-gray-400 font-medium"
-            >
-              {enrichMutation.isPending ? 'Searching...' : 'Search'}
-            </button>
-          </div>
-        </form>
-
-        {searched && results.length === 0 && (
-          <div className="text-center py-8 text-gray-500">No results found for "{query}"</div>
-        )}
-
-        {results.length > 0 && (
-          <div className="space-y-4">
-            {results.map((game, index) => (
-              <div
-                key={`${game.source}-${game.externalIds[game.source as keyof typeof game.externalIds]}`}
-                className="border border-gray-200 rounded-lg p-4 hover:shadow-md transition"
-              >
-                <div className="flex gap-4">
-                  {game.coverUrl && (
-                    <img
-                      src={game.coverUrl}
-                      alt={game.title}
-                      className="w-16 h-24 object-cover rounded"
-                    />
-                  )}
-
-                  <div className="flex-1">
-                    <div className="flex items-center gap-2 mb-2">
-                      <h3 className="font-semibold text-lg">{game.title}</h3>
-                      <span className="bg-gray-200 text-gray-800 text-xs px-2 py-1 rounded">
-                        {sourceLabels[game.source]}
-                      </span>
-                    </div>
-
-                    {game.releaseDate && (
-                      <p className="text-sm text-gray-600">
-                        Released: {new Date(game.releaseDate).getFullYear()}
-                      </p>
-                    )}
-
-                    {(game.genres || game.platforms) && (
-                      <div className="text-sm text-gray-600 mt-1">
-                        {game.genres && <p>Genres: {game.genres.join(', ')}</p>}
-                        {game.platforms && <p>Platforms: {game.platforms.join(', ')}</p>}
-                      </div>
-                    )}
-
-                    {game.description && (
-                      <p className="text-sm text-gray-700 mt-2 line-clamp-2">{game.description}</p>
-                    )}
-                  </div>
-
-                  <button
-                    onClick={() => handleSelect(game)}
-                    className="bg-green-600 text-white px-3 py-2 rounded-md hover:bg-green-700 font-medium h-fit whitespace-nowrap"
-                  >
-                    Select
-                  </button>
-                </div>
-              </div>
-            ))}
-          </div>
-        )}
-
-        {searched && results.length === 0 && (
-          <div className="text-center py-4">
-            <button
-              onClick={() => onOpenChange(false)}
-              className="bg-gray-200 text-gray-800 px-4 py-2 rounded-md hover:bg-gray-300"
-            >
-              Cancel
-            </button>
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}
diff --git a/frontend/src/components/roms/RomCard.tsx b/frontend/src/components/roms/RomCard.tsx
deleted file mode 100644
index 1015bcd..0000000
--- a/frontend/src/components/roms/RomCard.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import React from 'react';
-import { RomFile } from '../../types/rom';
-
-interface RomCardProps {
-  rom: RomFile;
-  onLinkMetadata?: (romId: string) => void;
-  onDelete?: (romId: string) => void;
-}
-
-function formatBytes(bytes: number): string {
-  if (bytes === 0) return '0 B';
-  const k = 1024;
-  const sizes = ['B', 'KB', 'MB', 'GB'];
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];
-}
-
-export default function RomCard({ rom, onLinkMetadata, onDelete }: RomCardProps): JSX.Element {
-  return (
-    <div className="border border-gray-300 rounded-lg p-4 hover:shadow-md transition">
-      <div className="flex justify-between items-start mb-2">
-        <h3 className="font-semibold text-lg flex-1 break-all">{rom.filename}</h3>
-        <span
-          className={`text-xs px-2 py-1 rounded font-medium whitespace-nowrap ml-2 ${
-            rom.status === 'active' ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800'
-          }`}
-        >
-          {rom.status}
-        </span>
-      </div>
-
-      <div className="space-y-1 text-sm text-gray-600 mb-3">
-        <p>
-          <span className="font-medium">Size:</span> {formatBytes(rom.size)}
-        </p>
-        <p>
-          <span className="font-medium">Checksum:</span> {rom.checksum.substring(0, 8)}...
-        </p>
-        {rom.game && (
-          <p>
-            <span className="font-medium">Game:</span> {rom.game.title}
-          </p>
-        )}
-      </div>
-
-      <div className="flex gap-2">
-        {!rom.game && onLinkMetadata && (
-          <button
-            onClick={() => onLinkMetadata(rom.id)}
-            className="flex-1 bg-blue-600 text-white px-3 py-2 text-sm rounded-md hover:bg-blue-700"
-          >
-            Link Metadata
-          </button>
-        )}
-        {onDelete && (
-          <button
-            onClick={() => onDelete(rom.id)}
-            className="flex-1 bg-red-600 text-white px-3 py-2 text-sm rounded-md hover:bg-red-700"
-          >
-            Delete
-          </button>
-        )}
-      </div>
-    </div>
-  );
-}
diff --git a/frontend/src/components/roms/ScanDialog.tsx b/frontend/src/components/roms/ScanDialog.tsx
deleted file mode 100644
index a3ae22f..0000000
--- a/frontend/src/components/roms/ScanDialog.tsx
+++ /dev/null
@@ -1,103 +0,0 @@
-import React, { useState } from 'react';
-import { useScanDirectory } from '../../hooks/useRoms';
-
-interface ScanDialogProps {
-  isOpen: boolean;
-  onOpenChange: (open: boolean) => void;
-}
-
-export default function ScanDialog({ isOpen, onOpenChange }: ScanDialogProps): JSX.Element | null {
-  const [path, setPath] = useState('');
-  const [error, setError] = useState<string | null>(null);
-  const [success, setSuccess] = useState(false);
-  const scanMutation = useScanDirectory();
-
-  const handleSubmit = async (e: React.FormEvent) => {
-    e.preventDefault();
-    setError(null);
-    setSuccess(false);
-
-    if (!path.trim()) {
-      setError('Please enter a directory path');
-      return;
-    }
-
-    try {
-      await scanMutation.mutateAsync(path);
-      setSuccess(true);
-      setPath('');
-      setTimeout(() => {
-        onOpenChange(false);
-        setSuccess(false);
-      }, 2000);
-    } catch (err) {
-      setError(err instanceof Error ? err.message : 'Failed to scan directory');
-    }
-  };
-
-  if (!isOpen) {
-    return null;
-  }
-
-  return (
-    <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center">
-      <div className="bg-white rounded-lg shadow-lg p-6 max-w-md w-full">
-        <div className="flex justify-between items-center mb-4">
-          <h2 className="text-lg font-semibold">Scan ROMs Directory</h2>
-          <button
-            onClick={() => onOpenChange(false)}
-            className="text-gray-500 hover:text-gray-700 text-xl"
-          >
-            ✕
-          </button>
-        </div>
-
-        <form onSubmit={handleSubmit} className="space-y-4">
-          <div>
-            <label htmlFor="path" className="block text-sm font-medium mb-1">
-              Directory Path
-            </label>
-            <input
-              id="path"
-              type="text"
-              placeholder="Enter ROM directory path"
-              value={path}
-              onChange={(e) => setPath(e.target.value)}
-              disabled={scanMutation.isPending}
-              className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:bg-gray-100"
-            />
-          </div>
-
-          {error && (
-            <div className="p-3 bg-red-50 border border-red-200 rounded text-red-700 text-sm">
-              <strong>Error:</strong> {error}
-            </div>
-          )}
-
-          {success && (
-            <div className="p-3 bg-green-50 border border-green-200 rounded text-green-700 text-sm">
-              Scan completed!
-            </div>
-          )}
-
-          <div className="flex gap-3 pt-4">
-            <button
-              type="submit"
-              disabled={scanMutation.isPending}
-              className="flex-1 bg-blue-600 text-white px-4 py-2 rounded-md hover:bg-blue-700 disabled:bg-gray-400 font-medium"
-            >
-              {scanMutation.isPending ? 'Scanning...' : 'Scan Directory'}
-            </button>
-            <button
-              type="button"
-              onClick={() => onOpenChange(false)}
-              className="flex-1 bg-gray-200 text-gray-800 px-4 py-2 rounded-md hover:bg-gray-300 font-medium"
-            >
-              Cancel
-            </button>
-          </div>
-        </form>
-      </div>
-    </div>
-  );
-}
diff --git a/frontend/src/components/ui/alert.tsx b/frontend/src/components/ui/alert.tsx
new file mode 100644
index 0000000..49a6d9a
--- /dev/null
+++ b/frontend/src/components/ui/alert.tsx
@@ -0,0 +1,69 @@
+import * as React from 'react';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { AlertTriangle, CheckCircle, Info, XCircle } from 'lucide-react';
+
+import { cn } from '@/lib/utils';
+
+const alertVariants = cva(
+  'relative w-full rounded-lg border p-4 [&>svg]:absolute [&>svg]:-top-1 [&>svg]:-left-1 [&>svg]:h-4 [&>svg]:w-4 [&>svg]:text-foreground',
+  {
+    variants: {
+      variant: {
+        default: 'bg-background text-foreground border',
+        destructive:
+          'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive',
+        success: 'border-green-500/50 text-green-700 dark:border-green-500 [&>svg]:text-green-700',
+        warning:
+          'border-yellow-500/50 text-yellow-700 dark:border-yellow-500 [&>svg]:text-yellow-700',
+        info: 'border-blue-500/50 text-blue-700 dark:border-blue-500 [&>svg]:text-blue-700',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+    },
+  }
+);
+
+const Alert = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>
+>(({ className, variant, ...props }, ref) => (
+  <div ref={ref} role="alert" className={cn(alertVariants({ variant }), className)} {...props} />
+));
+Alert.displayName = 'Alert';
+
+const AlertTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h5
+      ref={ref}
+      className={cn('mb-1 font-medium leading-none tracking-tight', className)}
+      {...props}
+    />
+  )
+);
+AlertTitle.displayName = 'AlertTitle';
+
+const AlertDescription = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLParagraphElement>
+>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn('text-sm [&_p]:leading-relaxed', className)} {...props} />
+));
+AlertDescription.displayName = 'AlertDescription';
+
+const AlertIcon = ({ variant }: { variant?: VariantProps<typeof alertVariants>['variant'] }) => {
+  switch (variant) {
+    case 'destructive':
+      return <XCircle className="h-4 w-4" />;
+    case 'success':
+      return <CheckCircle className="h-4 w-4" />;
+    case 'warning':
+      return <AlertTriangle className="h-4 w-4" />;
+    case 'info':
+      return <Info className="h-4 w-4" />;
+    default:
+      return <Info className="h-4 w-4" />;
+  }
+};
+
+export { Alert, AlertTitle, AlertDescription, AlertIcon };
diff --git a/frontend/src/components/ui/badge.tsx b/frontend/src/components/ui/badge.tsx
new file mode 100644
index 0000000..dcdd320
--- /dev/null
+++ b/frontend/src/components/ui/badge.tsx
@@ -0,0 +1,31 @@
+import * as React from 'react';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+
+const badgeVariants = cva(
+  'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
+  {
+    variants: {
+      variant: {
+        default: 'border-transparent bg-primary text-primary-foreground hover:bg-primary/80',
+        secondary:
+          'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        destructive:
+          'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
+        outline: 'text-foreground',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+    },
+  }
+);
+
+export interface BadgeProps
+  extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {}
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+  return <div className={cn(badgeVariants({ variant }), className)} {...props} />;
+}
+
+export { Badge, badgeVariants };
diff --git a/frontend/src/components/ui/button.tsx b/frontend/src/components/ui/button.tsx
new file mode 100644
index 0000000..765f33b
--- /dev/null
+++ b/frontend/src/components/ui/button.tsx
@@ -0,0 +1,47 @@
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { cva, type VariantProps } from 'class-variance-authority';
+import { cn } from '@/lib/utils';
+
+const buttonVariants = cva(
+  'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',
+  {
+    variants: {
+      variant: {
+        default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+        destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+        outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground',
+        secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+        ghost: 'hover:bg-accent hover:text-accent-foreground',
+        link: 'text-primary underline-offset-4 hover:underline',
+      },
+      size: {
+        default: 'h-10 px-4 py-2',
+        sm: 'h-9 rounded-md px-3',
+        lg: 'h-11 rounded-md px-8',
+        icon: 'h-10 w-10',
+      },
+    },
+    defaultVariants: {
+      variant: 'default',
+      size: 'default',
+    },
+  }
+);
+
+export interface ButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+  asChild?: boolean;
+}
+
+const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : 'button';
+    return (
+      <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />
+    );
+  }
+);
+Button.displayName = 'Button';
+
+export { Button, buttonVariants };
diff --git a/frontend/src/components/ui/card.tsx b/frontend/src/components/ui/card.tsx
new file mode 100644
index 0000000..1a2c86c
--- /dev/null
+++ b/frontend/src/components/ui/card.tsx
@@ -0,0 +1,55 @@
+import * as React from 'react';
+import { cn } from '@/lib/utils';
+
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div
+      ref={ref}
+      className={cn('rounded-lg border bg-card text-card-foreground shadow-sm', className)}
+      {...props}
+    />
+  )
+);
+Card.displayName = 'Card';
+
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />
+  )
+);
+CardHeader.displayName = 'CardHeader';
+
+const CardTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => (
+    <h3
+      ref={ref}
+      className={cn('text-2xl font-semibold leading-none tracking-tight', className)}
+      {...props}
+    />
+  )
+);
+CardTitle.displayName = 'CardTitle';
+
+const CardDescription = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLParagraphElement>
+>(({ className, ...props }, ref) => (
+  <p ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
+));
+CardDescription.displayName = 'CardDescription';
+
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />
+  )
+);
+CardContent.displayName = 'CardContent';
+
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  ({ className, ...props }, ref) => (
+    <div ref={ref} className={cn('flex items-center p-6 pt-0', className)} {...props} />
+  )
+);
+CardFooter.displayName = 'CardFooter';
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };
diff --git a/frontend/src/components/ui/checkbox.tsx b/frontend/src/components/ui/checkbox.tsx
new file mode 100644
index 0000000..317ca72
--- /dev/null
+++ b/frontend/src/components/ui/checkbox.tsx
@@ -0,0 +1,26 @@
+import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { Check } from 'lucide-react';
+
+import { cn } from '@/lib/utils';
+
+const Checkbox = React.forwardRef<
+  React.ElementRef<typeof CheckboxPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>
+>(({ className, ...props }, ref) => (
+  <CheckboxPrimitive.Root
+    ref={ref}
+    className={cn(
+      'peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground',
+      className
+    )}
+    {...props}
+  >
+    <CheckboxPrimitive.Indicator className={cn('flex items-center justify-center text-current')}>
+      <Check className="h-4 w-4" />
+    </CheckboxPrimitive.Indicator>
+  </CheckboxPrimitive.Root>
+));
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
+
+export { Checkbox };
diff --git a/frontend/src/components/ui/input.tsx b/frontend/src/components/ui/input.tsx
new file mode 100644
index 0000000..04db187
--- /dev/null
+++ b/frontend/src/components/ui/input.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+import { cn } from '@/lib/utils';
+
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
+
+const Input = React.forwardRef<HTMLInputElement, InputProps>(
+  ({ className, type, ...props }, ref) => {
+    return (
+      <input
+        type={type}
+        className={cn(
+          'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+          className
+        )}
+        ref={ref}
+        {...props}
+      />
+    );
+  }
+);
+Input.displayName = 'Input';
+
+export { Input };
diff --git a/frontend/src/components/ui/label.tsx b/frontend/src/components/ui/label.tsx
new file mode 100644
index 0000000..86b32b7
--- /dev/null
+++ b/frontend/src/components/ui/label.tsx
@@ -0,0 +1,19 @@
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cva, type VariantProps } from 'class-variance-authority';
+
+import { cn } from '@/lib/utils';
+
+const labelVariants = cva(
+  'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'
+);
+
+const Label = React.forwardRef<
+  React.ElementRef<typeof LabelPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> & VariantProps<typeof labelVariants>
+>(({ className, ...props }, ref) => (
+  <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />
+));
+Label.displayName = LabelPrimitive.Root.displayName;
+
+export { Label };
diff --git a/frontend/src/components/ui/scroll-area.tsx b/frontend/src/components/ui/scroll-area.tsx
new file mode 100644
index 0000000..14d95e0
--- /dev/null
+++ b/frontend/src/components/ui/scroll-area.tsx
@@ -0,0 +1,44 @@
+import * as React from 'react';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+
+import { cn } from '@/lib/utils';
+
+const ScrollArea = React.forwardRef<
+  React.ElementRef<typeof ScrollAreaPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.Root>
+>(({ className, children, ...props }, ref) => (
+  <ScrollAreaPrimitive.Root
+    ref={ref}
+    className={cn('relative overflow-hidden', className)}
+    {...props}
+  >
+    <ScrollAreaPrimitive.Viewport className="h-full w-full rounded-[inherit]">
+      {children}
+    </ScrollAreaPrimitive.Viewport>
+    <ScrollBar />
+    <ScrollAreaPrimitive.Corner />
+  </ScrollAreaPrimitive.Root>
+));
+ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
+
+const ScrollBar = React.forwardRef<
+  React.ElementRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>,
+  React.ComponentPropsWithoutRef<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>
+>(({ className, orientation = 'vertical', ...props }, ref) => (
+  <ScrollAreaPrimitive.ScrollAreaScrollbar
+    ref={ref}
+    orientation={orientation}
+    className={cn(
+      'flex touch-none select-none transition-colors',
+      orientation === 'vertical' && 'h-full w-2.5 border-l border-l-transparent p-[1px]',
+      orientation === 'horizontal' && 'h-2.5 w-full border-t border-t-transparent p-[1px]',
+      className
+    )}
+    {...props}
+  >
+    <ScrollAreaPrimitive.ScrollAreaThumb className="relative flex-1 rounded-full bg-border" />
+  </ScrollAreaPrimitive.ScrollAreaScrollbar>
+));
+ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
+
+export { ScrollArea, ScrollBar };
diff --git a/frontend/src/components/ui/select.tsx b/frontend/src/components/ui/select.tsx
new file mode 100644
index 0000000..0a7dc17
--- /dev/null
+++ b/frontend/src/components/ui/select.tsx
@@ -0,0 +1,151 @@
+import * as React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import { Check, ChevronDown, ChevronUp } from 'lucide-react';
+
+import { cn } from '@/lib/utils';
+
+const Select = SelectPrimitive.Root;
+
+const SelectGroup = SelectPrimitive.Group;
+
+const SelectValue = SelectPrimitive.Value;
+
+const SelectTrigger = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+  <SelectPrimitive.Trigger
+    ref={ref}
+    className={cn(
+      'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
+      className
+    )}
+    {...props}
+  >
+    {children}
+    <SelectPrimitive.Icon asChild>
+      <ChevronDown className="h-4 w-4 opacity-50" />
+    </SelectPrimitive.Icon>
+  </SelectPrimitive.Trigger>
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+
+const SelectScrollUpButton = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.ScrollUpButton
+    ref={ref}
+    className={cn('flex cursor-default items-center justify-center py-1', className)}
+    {...props}
+  >
+    <ChevronUp className="h-4 w-4" />
+  </SelectPrimitive.ScrollUpButton>
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+
+const SelectScrollDownButton = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.ScrollDownButton
+    ref={ref}
+    className={cn('flex cursor-default items-center justify-center py-1', className)}
+    {...props}
+  >
+    <ChevronDown className="h-4 w-4" />
+  </SelectPrimitive.ScrollDownButton>
+));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
+
+const SelectContent = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
+>(({ className, children, position = 'popper', ...props }, ref) => (
+  <SelectPrimitive.Portal>
+    <SelectPrimitive.Content
+      ref={ref}
+      className={cn(
+        'relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+        position === 'popper' &&
+          'data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1',
+        className
+      )}
+      position={position}
+      {...props}
+    >
+      <SelectScrollUpButton />
+      <SelectPrimitive.Viewport
+        className={cn(
+          'p-1',
+          position === 'popper' &&
+            'h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]'
+        )}
+      >
+        {children}
+      </SelectPrimitive.Viewport>
+      <SelectScrollDownButton />
+    </SelectPrimitive.Content>
+  </SelectPrimitive.Portal>
+));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+
+const SelectLabel = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Label>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.Label
+    ref={ref}
+    className={cn('py-1.5 pl-8 pr-2 text-sm font-semibold', className)}
+    {...props}
+  />
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+
+const SelectItem = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
+>(({ className, children, ...props }, ref) => (
+  <SelectPrimitive.Item
+    ref={ref}
+    className={cn(
+      'relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50',
+      className
+    )}
+    {...props}
+  >
+    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+      <SelectPrimitive.ItemIndicator>
+        <Check className="h-4 w-4" />
+      </SelectPrimitive.ItemIndicator>
+    </span>
+
+    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
+  </SelectPrimitive.Item>
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+
+const SelectSeparator = React.forwardRef<
+  React.ElementRef<typeof SelectPrimitive.Separator>,
+  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
+>(({ className, ...props }, ref) => (
+  <SelectPrimitive.Separator
+    ref={ref}
+    className={cn('-mx-1 my-1 h-px bg-muted', className)}
+    {...props}
+  />
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+
+export {
+  Select,
+  SelectGroup,
+  SelectValue,
+  SelectTrigger,
+  SelectContent,
+  SelectLabel,
+  SelectItem,
+  SelectSeparator,
+  SelectScrollUpButton,
+  SelectScrollDownButton,
+};
diff --git a/frontend/src/components/ui/table.tsx b/frontend/src/components/ui/table.tsx
new file mode 100644
index 0000000..ddc2083
--- /dev/null
+++ b/frontend/src/components/ui/table.tsx
@@ -0,0 +1,91 @@
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+const Table = React.forwardRef<HTMLTableElement, React.HTMLAttributes<HTMLTableElement>>(
+  ({ className, ...props }, ref) => (
+    <div className="relative w-full overflow-auto">
+      <table ref={ref} className={cn('w-full caption-bottom text-sm', className)} {...props} />
+    </div>
+  )
+);
+Table.displayName = 'Table';
+
+const TableHeader = React.forwardRef<
+  HTMLTableSectionElement,
+  React.HTMLAttributes<HTMLTableSectionElement>
+>(({ className, ...props }, ref) => (
+  <thead ref={ref} className={cn('[&_tr]:border-b', className)} {...props} />
+));
+TableHeader.displayName = 'TableHeader';
+
+const TableBody = React.forwardRef<
+  HTMLTableSectionElement,
+  React.HTMLAttributes<HTMLTableSectionElement>
+>(({ className, ...props }, ref) => (
+  <tbody ref={ref} className={cn('[&_tr:last-child]:border-0', className)} {...props} />
+));
+TableBody.displayName = 'TableBody';
+
+const TableFooter = React.forwardRef<
+  HTMLTableSectionElement,
+  React.HTMLAttributes<HTMLTableSectionElement>
+>(({ className, ...props }, ref) => (
+  <tfoot
+    ref={ref}
+    className={cn('border-t bg-muted/50 font-medium [&>tr]:last:border-b-0', className)}
+    {...props}
+  />
+));
+TableFooter.displayName = 'TableFooter';
+
+const TableRow = React.forwardRef<HTMLTableRowElement, React.HTMLAttributes<HTMLTableRowElement>>(
+  ({ className, ...props }, ref) => (
+    <tr
+      ref={ref}
+      className={cn(
+        'border-b transition-colors hover:bg-muted/50 data-[state=selected]:bg-muted',
+        className
+      )}
+      {...props}
+    />
+  )
+);
+TableRow.displayName = 'TableRow';
+
+const TableHead = React.forwardRef<
+  HTMLTableCellElement,
+  React.ThHTMLAttributes<HTMLTableCellElement>
+>(({ className, ...props }, ref) => (
+  <th
+    ref={ref}
+    className={cn(
+      'h-12 px-4 text-left align-middle font-medium text-muted-foreground [&:has([role=checkbox])]:pr-0',
+      className
+    )}
+    {...props}
+  />
+));
+TableHead.displayName = 'TableHead';
+
+const TableCell = React.forwardRef<
+  HTMLTableCellElement,
+  React.TdHTMLAttributes<HTMLTableCellElement>
+>(({ className, ...props }, ref) => (
+  <td
+    ref={ref}
+    className={cn('p-4 align-middle [&:has([role=checkbox])]:pr-0', className)}
+    {...props}
+  />
+));
+TableCell.displayName = 'TableCell';
+
+const TableCaption = React.forwardRef<
+  HTMLTableCaptionElement,
+  React.HTMLAttributes<HTMLTableCaptionElement>
+>(({ className, ...props }, ref) => (
+  <caption ref={ref} className={cn('mt-4 text-sm text-muted-foreground', className)} {...props} />
+));
+TableCaption.displayName = 'TableCaption';
+
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };
diff --git a/frontend/src/components/ui/textarea.tsx b/frontend/src/components/ui/textarea.tsx
new file mode 100644
index 0000000..b6d2be1
--- /dev/null
+++ b/frontend/src/components/ui/textarea.tsx
@@ -0,0 +1,23 @@
+import * as React from 'react';
+
+import { cn } from '@/lib/utils';
+
+export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
+
+const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
+  ({ className, ...props }, ref) => {
+    return (
+      <textarea
+        className={cn(
+          'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+          className
+        )}
+        ref={ref}
+        {...props}
+      />
+    );
+  }
+);
+Textarea.displayName = 'Textarea';
+
+export { Textarea };
diff --git a/frontend/src/form/config.tsx b/frontend/src/form/config.tsx
new file mode 100644
index 0000000..5c0edbf
--- /dev/null
+++ b/frontend/src/form/config.tsx
@@ -0,0 +1,98 @@
+import { z } from 'zod';
+
+// Esquemas de validación comunes
+export const commonSchemas = {
+  // Validación de strings
+  string: (min = 1, max = 255) =>
+    z.string().min(min, 'Este campo es requerido').max(max, 'Máximo 255 caracteres'),
+
+  // Validación de emails
+  email: z.string().email('Por favor ingresa un email válido').min(1, 'Este campo es requerido'),
+
+  // Validación de números
+  number: (min = 0, max = Number.MAX_SAFE_INTEGER) =>
+    z.number().min(min, 'Debe ser un número positivo').max(max, 'Número demasiado grande'),
+
+  // Validación de fechas
+  date: z
+    .date()
+    .refine(
+      (date) => date instanceof Date && !isNaN(date.getTime()),
+      'Por favor ingresa una fecha válida'
+    ),
+
+  // Validación de booleanos
+  boolean: z.boolean(),
+
+  // Validación de arrays
+  array: (min = 1, max = 100) =>
+    z
+      .array(z.unknown())
+      .min(min, 'Al menos un elemento requerido')
+      .max(max, 'Máximo 100 elementos'),
+};
+
+// Función para manejar errores de formulario
+export function getFieldError(
+  fieldErrors: Record<string, string[]>,
+  fieldName: string
+): string | undefined {
+  const errors = fieldErrors[fieldName];
+  return errors?.[0];
+}
+
+// Función para manejar errores de formulario global
+export function getGlobalError(fieldErrors: Record<string, string[]>): string | undefined {
+  const globalErrors = Object.values(fieldErrors).flat();
+  return globalErrors?.[0];
+}
+
+// Esquemas específicos para la aplicación
+export const appSchemas = {
+  // Esquema para crear/editar juegos
+  gameSchema: z.object({
+    title: commonSchemas.string(1, 100),
+    description: commonSchemas.string(0, 2000),
+    platformId: commonSchemas.number(1, Number.MAX_SAFE_INTEGER),
+    releaseYear: commonSchemas.number(1900, new Date().getFullYear() + 5),
+    rating: z.number().min(0).max(10).optional(),
+    tags: commonSchemas.array(0, 50).optional(),
+    romFile: z.string().optional(),
+    metadataSource: z.enum(['igdb', 'rawg', 'thegamesdb', 'manual']).optional(),
+  }),
+
+  // Esquema para importar ROMs
+  importRomSchema: z.object({
+    romPath: commonSchemas.string(1, 500),
+    platformId: commonSchemas.number(1, Number.MAX_SAFE_INTEGER),
+    autoScan: z.boolean().default(true),
+  }),
+
+  // Esquema para configuración
+  settingsSchema: z.object({
+    igdbApiKey: commonSchemas.string(0, 100).optional(),
+    rawgApiKey: commonSchemas.string(0, 100).optional(),
+    thegamesdbApiKey: commonSchemas.string(0, 100).optional(),
+    defaultRomDirectory: commonSchemas.string(0, 500).optional(),
+    autoImportEnabled: z.boolean().default(true),
+    metadataSourcePriority: z
+      .array(z.enum(['igdb', 'rawg', 'thegamesdb']))
+      .default(['igdb', 'rawg', 'thegamesdb']),
+  }),
+
+  // Esquema para plataformas
+  platformSchema: z.object({
+    name: commonSchemas.string(1, 50),
+    description: commonSchemas.string(0, 500),
+    manufacturer: commonSchemas.string(0, 100),
+    releaseYear: commonSchemas.number(1900, new Date().getFullYear() + 5),
+    romExtension: z.string().optional(),
+  }),
+
+  // Esquema para etiquetas
+  tagSchema: z.object({
+    name: commonSchemas.string(1, 30),
+    color: z.string().regex(/^#[0-9A-F]{6}$/i, 'Color inválido. Use formato #RRGGBB'),
+    description: commonSchemas.string(0, 200),
+  }),
+};
diff --git a/frontend/src/hooks/useGames.ts b/frontend/src/hooks/useGames.ts
deleted file mode 100644
index 7216ba2..0000000
--- a/frontend/src/hooks/useGames.ts
+++ /dev/null
@@ -1,45 +0,0 @@
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { api } from '../lib/api';
-import { Game, CreateGameInput, UpdateGameInput } from '../types/game';
-
-const GAMES_QUERY_KEY = ['games'];
-
-export function useGames() {
-  return useQuery({
-    queryKey: GAMES_QUERY_KEY,
-    queryFn: () => api.games.list(),
-  });
-}
-
-export function useCreateGame() {
-  const queryClient = useQueryClient();
-
-  return useMutation({
-    mutationFn: (data: CreateGameInput) => api.games.create(data),
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: GAMES_QUERY_KEY });
-    },
-  });
-}
-
-export function useUpdateGame() {
-  const queryClient = useQueryClient();
-
-  return useMutation({
-    mutationFn: ({ id, data }: { id: string; data: UpdateGameInput }) => api.games.update(id, data),
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: GAMES_QUERY_KEY });
-    },
-  });
-}
-
-export function useDeleteGame() {
-  const queryClient = useQueryClient();
-
-  return useMutation({
-    mutationFn: (id: string) => api.games.delete(id),
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: GAMES_QUERY_KEY });
-    },
-  });
-}
diff --git a/frontend/src/hooks/useRoms.ts b/frontend/src/hooks/useRoms.ts
deleted file mode 100644
index d9c378c..0000000
--- a/frontend/src/hooks/useRoms.ts
+++ /dev/null
@@ -1,53 +0,0 @@
-import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
-import { api } from '../lib/api';
-import { RomFile, EnrichedGame } from '../types/rom';
-
-const ROMS_QUERY_KEY = ['roms'];
-const GAMES_QUERY_KEY = ['games'];
-
-export function useRoms() {
-  return useQuery({
-    queryKey: ROMS_QUERY_KEY,
-    queryFn: () => api.roms.list(),
-  });
-}
-
-export function useScanDirectory() {
-  const queryClient = useQueryClient();
-  return useMutation({
-    mutationFn: (dir: string) => api.import.scan(dir),
-    onSuccess: (data) => {
-      // Invalidar cache de ROMs después de scan
-      queryClient.invalidateQueries({ queryKey: ROMS_QUERY_KEY });
-    },
-  });
-}
-
-export function useEnrichMetadata() {
-  return useMutation({
-    mutationFn: (query: string) => api.metadata.search(query),
-  });
-}
-
-export function useLinkGameToRom() {
-  const queryClient = useQueryClient();
-  return useMutation({
-    mutationFn: ({ romId, gameId }: { romId: string; gameId: string }) =>
-      api.roms.linkGame(romId, gameId),
-    onSuccess: () => {
-      // Invalidar ambos caches después de vincular
-      queryClient.invalidateQueries({ queryKey: ROMS_QUERY_KEY });
-      queryClient.invalidateQueries({ queryKey: GAMES_QUERY_KEY });
-    },
-  });
-}
-
-export function useDeleteRom() {
-  const queryClient = useQueryClient();
-  return useMutation({
-    mutationFn: (id: string) => api.roms.delete(id),
-    onSuccess: () => {
-      queryClient.invalidateQueries({ queryKey: ROMS_QUERY_KEY });
-    },
-  });
-}
diff --git a/frontend/src/index.css b/frontend/src/index.css
new file mode 100644
index 0000000..08a3ac9
--- /dev/null
+++ b/frontend/src/index.css
@@ -0,0 +1,68 @@
+:root {
+  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}
diff --git a/frontend/src/lib/api.ts b/frontend/src/lib/api.ts
deleted file mode 100644
index 51e0d4c..0000000
--- a/frontend/src/lib/api.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import { Game, CreateGameInput, UpdateGameInput } from '../types/game';
-import { RomFile, EnrichedGame, ScanResult } from '../types/rom';
-
-const API_BASE = '/api';
-
-async function request<T>(endpoint: string, options?: RequestInit): Promise<T> {
-  const response = await fetch(`${API_BASE}${endpoint}`, {
-    headers: {
-      'Content-Type': 'application/json',
-      ...options?.headers,
-    },
-    ...options,
-  });
-
-  if (!response.ok) {
-    throw new Error(`API error: ${response.status} ${response.statusText}`);
-  }
-
-  return response.json();
-}
-
-export const api = {
-  games: {
-    list: () => request<Game[]>('/games'),
-    create: (data: CreateGameInput) =>
-      request<Game>('/games', {
-        method: 'POST',
-        body: JSON.stringify(data),
-      }),
-    update: (id: string, data: UpdateGameInput) =>
-      request<Game>(`/games/${id}`, {
-        method: 'PUT',
-        body: JSON.stringify(data),
-      }),
-    delete: (id: string) =>
-      request<void>(`/games/${id}`, {
-        method: 'DELETE',
-      }),
-  },
-
-  roms: {
-    list: () => request<RomFile[]>('/roms'),
-    getById: (id: string) => request<RomFile>(`/roms/${id}`),
-    linkGame: (romId: string, gameId: string) =>
-      request<RomFile>(`/roms/${romId}/game`, {
-        method: 'PUT',
-        body: JSON.stringify({ gameId }),
-      }),
-    delete: (id: string) => request<void>(`/roms/${id}`, { method: 'DELETE' }),
-  },
-
-  metadata: {
-    search: (query: string) =>
-      request<EnrichedGame[]>('/metadata/search?q=' + encodeURIComponent(query)),
-  },
-
-  import: {
-    scan: (dir: string) =>
-      request<ScanResult>('/import/scan', {
-        method: 'POST',
-        body: JSON.stringify({ dir }),
-      }),
-  },
-};
diff --git a/frontend/src/lib/queryClient.ts b/frontend/src/lib/queryClient.ts
deleted file mode 100644
index 6d46de5..0000000
--- a/frontend/src/lib/queryClient.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-import { QueryClient } from '@tanstack/react-query';
-
-export const queryClient = new QueryClient();
diff --git a/frontend/src/lib/utils.ts b/frontend/src/lib/utils.ts
new file mode 100644
index 0000000..9ad0df4
--- /dev/null
+++ b/frontend/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx
index 2da75d0..6286c65 100644
--- a/frontend/src/main.tsx
+++ b/frontend/src/main.tsx
@@ -1,32 +1,10 @@
-import React from 'react';
+import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
-import { QueryClientProvider } from '@tanstack/react-query';
-import { queryClient } from './lib/queryClient';
-import App from './App';
-import './styles.css';
+import './styles/globals.css';
+import App from './App.tsx';
 
-const rootEl = document.getElementById('root');
-
-if (rootEl) {
-  createRoot(rootEl).render(
-    <React.StrictMode>
-      <QueryClientProvider client={queryClient}>
-        <App />
-      </QueryClientProvider>
-    </React.StrictMode>
-  );
-}
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import { QueryClientProvider } from '@tanstack/react-query';
-import { queryClient } from './lib/queryClient';
-import App from './App';
-import './index.css';
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <QueryClientProvider client={queryClient}>
-      <App />
-    </QueryClientProvider>
-  </React.StrictMode>
+createRoot(document.getElementById('root')!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>
 );
diff --git a/frontend/src/pages/DashboardPage.tsx b/frontend/src/pages/DashboardPage.tsx
new file mode 100644
index 0000000..064f893
--- /dev/null
+++ b/frontend/src/pages/DashboardPage.tsx
@@ -0,0 +1,232 @@
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Gamepad2,
+  Database,
+  Tag,
+  Download,
+  Upload,
+  TrendingUp,
+  Clock,
+  AlertCircle,
+} from 'lucide-react';
+
+// Datos simulados para el dashboard
+const stats = {
+  totalGames: 156,
+  gamesWithRom: 128,
+  gamesWithoutRom: 28,
+  gamesWithMetadata: 142,
+  gamesWithoutMetadata: 14,
+  totalPlatforms: 12,
+  totalTags: 45,
+  averageRating: 7.8,
+};
+
+const recentGames = [
+  {
+    id: 1,
+    title: 'The Legend of Zelda: Breath of the Wild',
+    platform: 'Nintendo Switch',
+    rating: 9.5,
+    addedDate: '2024-01-10',
+  },
+  { id: 2, title: 'God of War', platform: 'PlayStation 4', rating: 9.2, addedDate: '2024-01-09' },
+  { id: 3, title: 'Cyberpunk 2077', platform: 'PC', rating: 8.7, addedDate: '2024-01-08' },
+  {
+    id: 4,
+    title: 'Super Mario Odyssey',
+    platform: 'Nintendo Switch',
+    rating: 9.0,
+    addedDate: '2024-01-07',
+  },
+  {
+    id: 5,
+    title: 'Red Dead Redemption 2',
+    platform: 'PlayStation 4',
+    rating: 9.3,
+    addedDate: '2024-01-06',
+  },
+];
+
+const pendingTasks = [
+  { id: 1, title: 'Enriquecer metadata para 14 juegos', priority: 'high', type: 'metadata' },
+  { id: 2, title: 'Importar 28 ROMs detectadas', priority: 'medium', type: 'import' },
+  { id: 3, title: 'Actualizar información de 5 juegos', priority: 'low', type: 'update' },
+];
+
+export function DashboardPage() {
+  return (
+    <div className="space-y-6">
+      {/* Encabezado */}
+      <div>
+        <h1 className="text-3xl font-bold tracking-tight">Dashboard</h1>
+        <p className="text-muted-foreground">Resumen general de tu colección de videojuegos</p>
+      </div>
+
+      {/* Estadísticas principales */}
+      <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Total de Juegos</CardTitle>
+            <Gamepad2 className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{stats.totalGames}</div>
+            <p className="text-xs text-muted-foreground">+12% desde el mes pasado</p>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Juegos con ROM</CardTitle>
+            <Download className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{stats.gamesWithRom}</div>
+            <p className="text-xs text-muted-foreground">de {stats.totalGames} juegos</p>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Juegos con Metadata</CardTitle>
+            <Database className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{stats.gamesWithMetadata}</div>
+            <p className="text-xs text-muted-foreground">{stats.gamesWithoutMetadata} pendientes</p>
+          </CardContent>
+        </Card>
+
+        <Card>
+          <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+            <CardTitle className="text-sm font-medium">Plataformas</CardTitle>
+            <Tag className="h-4 w-4 text-muted-foreground" />
+          </CardHeader>
+          <CardContent>
+            <div className="text-2xl font-bold">{stats.totalPlatforms}</div>
+            <p className="text-xs text-muted-foreground">{stats.totalTags} etiquetas</p>
+          </CardContent>
+        </Card>
+      </div>
+
+      <div className="grid gap-6 md:grid-cols-2">
+        {/* Tareas pendientes */}
+        <Card>
+          <CardHeader>
+            <CardTitle>Tareas Pendientes</CardTitle>
+            <CardDescription>
+              Acciones necesarias para mantener tu colección actualizada
+            </CardDescription>
+          </CardHeader>
+          <CardContent>
+            <div className="space-y-4">
+              {pendingTasks.map((task) => (
+                <div key={task.id} className="flex items-center space-x-3">
+                  <div className="flex-shrink-0">
+                    {task.priority === 'high' && <AlertCircle className="h-5 w-5 text-red-500" />}
+                    {task.priority === 'medium' && <Clock className="h-5 w-5 text-yellow-500" />}
+                    {task.priority === 'low' && <TrendingUp className="h-5 w-5 text-green-500" />}
+                  </div>
+                  <div className="flex-1 min-w-0">
+                    <p className="text-sm font-medium text-gray-900 truncate">{task.title}</p>
+                    <div className="flex items-center space-x-2 mt-1">
+                      <Badge variant="secondary" className="text-xs">
+                        {task.type}
+                      </Badge>
+                      <Badge
+                        variant={
+                          task.priority === 'high'
+                            ? 'destructive'
+                            : task.priority === 'medium'
+                              ? 'default'
+                              : 'secondary'
+                        }
+                        className="text-xs"
+                      >
+                        {task.priority}
+                      </Badge>
+                    </div>
+                  </div>
+                  <Button size="sm" variant="outline">
+                    Ver
+                  </Button>
+                </div>
+              ))}
+            </div>
+            <div className="mt-4 pt-4 border-t">
+              <Button className="w-full" variant="outline">
+                Ver todas las tareas
+              </Button>
+            </div>
+          </CardContent>
+        </Card>
+
+        {/* Juegos recientes */}
+        <Card>
+          <CardHeader>
+            <CardTitle>Juegos Recientes</CardTitle>
+            <CardDescription>Últimos juegos añadidos a tu colección</CardDescription>
+          </CardHeader>
+          <CardContent>
+            <div className="space-y-4">
+              {recentGames.map((game) => (
+                <div key={game.id} className="flex items-center space-x-3">
+                  <div className="flex-shrink-0">
+                    <div className="h-10 w-10 bg-gray-200 rounded-md flex items-center justify-center">
+                      <Gamepad2 className="h-6 w-6 text-gray-400" />
+                    </div>
+                  </div>
+                  <div className="flex-1 min-w-0">
+                    <p className="text-sm font-medium text-gray-900 truncate">{game.title}</p>
+                    <div className="flex items-center space-x-2 mt-1">
+                      <Badge variant="outline" className="text-xs">
+                        {game.platform}
+                      </Badge>
+                      <div className="flex items-center">
+                        <span className="text-sm text-gray-500">★</span>
+                        <span className="text-sm font-medium ml-1">{game.rating}</span>
+                      </div>
+                    </div>
+                  </div>
+                  <div className="text-sm text-gray-500">{game.addedDate}</div>
+                </div>
+              ))}
+            </div>
+            <div className="mt-4 pt-4 border-t">
+              <Button className="w-full" variant="outline">
+                Ver todos los juegos
+              </Button>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+
+      {/* Acciones rápidas */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Acciones Rápidas</CardTitle>
+          <CardDescription>Acciones comunes para gestionar tu colección</CardDescription>
+        </CardHeader>
+        <CardContent>
+          <div className="grid gap-4 md:grid-cols-3">
+            <Button className="h-auto p-4 flex flex-col items-center space-y-2" variant="outline">
+              <Download className="h-6 w-6" />
+              <span>Importar ROMs</span>
+            </Button>
+            <Button className="h-auto p-4 flex flex-col items-center space-y-2" variant="outline">
+              <Upload className="h-6 w-6" />
+              <span>Exportar Datos</span>
+            </Button>
+            <Button className="h-auto p-4 flex flex-col items-center space-y-2" variant="outline">
+              <Database className="h-6 w-6" />
+              <span>Gestionar Plataformas</span>
+            </Button>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/frontend/src/pages/GameDetailPage.tsx b/frontend/src/pages/GameDetailPage.tsx
new file mode 100644
index 0000000..5209ac0
--- /dev/null
+++ b/frontend/src/pages/GameDetailPage.tsx
@@ -0,0 +1,350 @@
+import { useState } from 'react';
+import { useNavigate, useParams } from '@tanstack/react-router';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Badge } from '@/components/ui/badge';
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@/components/ui/table';
+import { Label } from '@/components/ui/label';
+import { Alert, AlertDescription } from '@/components/ui/alert';
+import {
+  ArrowLeft,
+  Edit,
+  Trash2,
+  Download,
+  Star,
+  Calendar,
+  HardDrive,
+  Tag,
+  ExternalLink,
+  Info,
+  AlertCircle,
+} from 'lucide-react';
+import { Game } from '@/types';
+
+// Datos simulados para el detalle del juego
+const mockGame: Game = {
+  id: 1,
+  title: 'The Legend of Zelda: Breath of the Wild',
+  description:
+    'The Legend of Zelda: Breath of the Wild es un juego de acción-aventura desarrollado y publicado por Nintendo para la consola Nintendo Switch y la consola Wii U. Es el decimonoveno juego principal de la serie The Legend of Zelda y fue lanzado mundialmente en marzo de 2017. El juego presenta un mundo abierto con un diseño de física y química avanzado que permite a los jugadores resolver problemas de man creativas.',
+  platformId: 1,
+  platform: {
+    id: 1,
+    name: 'Nintendo Switch',
+    description: 'Consola híbrida de Nintendo',
+    manufacturer: 'Nintendo',
+    releaseYear: 2017,
+    romExtension: 'nsp',
+  },
+  releaseYear: 2017,
+  rating: 9.5,
+  tags: [
+    { id: 1, name: 'Aventura', color: '#3B82F6', description: 'Juegos de aventura' },
+    { id: 2, name: 'Acción', color: '#EF4444', description: 'Juegos de acción' },
+    { id: 3, name: 'Open World', color: '#10B981', description: 'Mundo abierto' },
+  ],
+  romFile: {
+    id: 1,
+    filename: 'zelda_botw.nsp',
+    path: '/roms/nintendo-switch',
+    size: 14485760,
+    checksum: 'abc123def456',
+    gameId: 1,
+  },
+  metadataSource: 'manual',
+  igdbId: '12345',
+  rawgId: '67890',
+  thegamesdbId: '54321',
+  createdAt: new Date('2024-01-10'),
+  updatedAt: new Date('2024-01-15'),
+};
+
+export function GameDetailPage() {
+  const navigate = useNavigate();
+  const { gameId } = useParams({ from: '/games/$gameId' });
+  const [game] = useState<Game>(mockGame);
+
+  const handleEdit = () => {
+    navigate({ to: `/games/${game.id}/edit` });
+  };
+
+  const handleDelete = () => {
+    // TODO: Implementar eliminación del juego
+    console.log('Eliminar juego:', game.id);
+  };
+
+  const formatFileSize = (bytes: number) => {
+    if (bytes === 0) return '0 Bytes';
+    const k = 1024;
+    const sizes = ['Bytes', 'KB', 'MB', 'GB'];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+  };
+
+  return (
+    <div className="space-y-6">
+      {/* Encabezado con botón de retroceso */}
+      <div className="flex items-center gap-4">
+        <Button variant="ghost" onClick={() => navigate({ to: '/games' })} className="gap-2">
+          <ArrowLeft className="h-4 w-4" />
+          Volver
+        </Button>
+        <div>
+          <h1 className="text-3xl font-bold tracking-tight">{game.title}</h1>
+          <p className="text-muted-foreground">Detalles del juego</p>
+        </div>
+      </div>
+
+      {/* Acciones */}
+      <div className="flex gap-2">
+        <Button onClick={handleEdit} className="gap-2">
+          <Edit className="h-4 w-4" />
+          Editar
+        </Button>
+        <Button variant="outline" className="gap-2">
+          <Download className="h-4 w-4" />
+          Descargar ROM
+        </Button>
+        <Button
+          variant="outline"
+          onClick={handleDelete}
+          className="gap-2 text-destructive hover:text-destructive"
+        >
+          <Trash2 className="h-4 w-4" />
+          Eliminar
+        </Button>
+      </div>
+
+      <div className="grid gap-6 md:grid-cols-3">
+        {/* Información principal */}
+        <div className="md:col-span-2 space-y-6">
+          {/* Descripción */}
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <Info className="h-5 w-5" />
+                Descripción
+              </CardTitle>
+            </CardHeader>
+            <CardContent>
+              <p className="text-muted-foreground leading-relaxed">{game.description}</p>
+            </CardContent>
+          </Card>
+
+          {/* Información técnica */}
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <HardDrive className="h-5 w-5" />
+                Información Técnica
+              </CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="grid gap-4 md:grid-cols-2">
+                <div>
+                  <Label className="text-sm font-medium">Plataforma</Label>
+                  <p className="text-sm text-muted-foreground">{game.platform?.name}</p>
+                </div>
+                <div>
+                  <Label className="text-sm font-medium">Año de lanzamiento</Label>
+                  <p className="text-sm text-muted-foreground">
+                    {game.releaseYear || 'Desconocido'}
+                  </p>
+                </div>
+                <div>
+                  <Label className="text-sm font-medium">Tamaño del archivo</Label>
+                  <p className="text-sm text-muted-foreground">
+                    {game.romFile ? formatFileSize(game.romFile.size) : 'No disponible'}
+                  </p>
+                </div>
+                <div>
+                  <Label className="text-sm font-medium">Checksum</Label>
+                  <p className="text-sm font-mono text-muted-foreground">
+                    {game.romFile ? game.romFile.checksum : 'No disponible'}
+                  </p>
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+
+          {/* Etiquetas */}
+          <Card>
+            <CardHeader>
+              <CardTitle className="flex items-center gap-2">
+                <Tag className="h-5 w-5" />
+                Etiquetas
+              </CardTitle>
+            </CardHeader>
+            <CardContent>
+              <div className="flex flex-wrap gap-2">
+                {game.tags.map((tag) => (
+                  <Badge
+                    key={tag.id}
+                    variant="secondary"
+                    style={{ backgroundColor: tag.color }}
+                    className="text-white"
+                  >
+                    {tag.name}
+                  </Badge>
+                ))}
+                {game.tags.length === 0 && (
+                  <p className="text-sm text-muted-foreground">No hay etiquetas asignadas</p>
+                )}
+              </div>
+            </CardContent>
+          </Card>
+        </div>
+
+        {/* Panel lateral */}
+        <div className="space-y-6">
+          {/* Estado del juego */}
+          <Card>
+            <CardHeader>
+              <CardTitle>Estado</CardTitle>
+            </CardHeader>
+            <CardContent className="space-y-4">
+              <div className="flex items-center justify-between">
+                <span className="text-sm font-medium">Calificación</span>
+                <div className="flex items-center gap-1">
+                  <Star className="h-4 w-4 fill-yellow-400 text-yellow-400" />
+                  <span className="font-medium">{game.rating || '-'}</span>
+                </div>
+              </div>
+              <div className="flex items-center justify-between">
+                <span className="text-sm font-medium">ROM</span>
+                <Badge variant={game.romFile ? 'default' : 'secondary'}>
+                  {game.romFile ? 'Disponible' : 'No disponible'}
+                </Badge>
+              </div>
+              <div className="flex items-center justify-between">
+                <span className="text-sm font-medium">Metadata</span>
+                <Badge variant={game.metadataSource ? 'default' : 'secondary'}>
+                  {game.metadataSource || 'Manual'}
+                </Badge>
+              </div>
+            </CardContent>
+          </Card>
+
+          {/* Fuentes externas */}
+          <Card>
+            <CardHeader>
+              <CardTitle>Fuentes Externas</CardTitle>
+            </CardHeader>
+            <CardContent className="space-y-3">
+              <div className="flex items-center justify-between">
+                <span className="text-sm">IGDB</span>
+                <div className="flex items-center gap-2">
+                  {game.igdbId ? (
+                    <>
+                      <Badge variant="outline">Conectado</Badge>
+                      <Button size="sm" variant="ghost">
+                        <ExternalLink className="h-3 w-3" />
+                      </Button>
+                    </>
+                  ) : (
+                    <Badge variant="secondary">No conectado</Badge>
+                  )}
+                </div>
+              </div>
+              <div className="flex items-center justify-between">
+                <span className="text-sm">RAWG</span>
+                <div className="flex items-center gap-2">
+                  {game.rawgId ? (
+                    <>
+                      <Badge variant="outline">Conectado</Badge>
+                      <Button size="sm" variant="ghost">
+                        <ExternalLink className="h-3 w-3" />
+                      </Button>
+                    </>
+                  ) : (
+                    <Badge variant="secondary">No conectado</Badge>
+                  )}
+                </div>
+              </div>
+              <div className="flex items-center justify-between">
+                <span className="text-sm">TheGamesDB</span>
+                <div className="flex items-center gap-2">
+                  {game.thegamesdbId ? (
+                    <>
+                      <Badge variant="outline">Conectado</Badge>
+                      <Button size="sm" variant="ghost">
+                        <ExternalLink className="h-3 w-3" />
+                      </Button>
+                    </>
+                  ) : (
+                    <Badge variant="secondary">No conectado</Badge>
+                  )}
+                </div>
+              </div>
+            </CardContent>
+          </Card>
+
+          {/* Fechas */}
+          <Card>
+            <CardHeader>
+              <CardTitle>Información de Registro</CardTitle>
+            </CardHeader>
+            <CardContent className="space-y-3">
+              <div>
+                <Label className="text-sm font-medium">Fecha de creación</Label>
+                <p className="text-sm text-muted-foreground">
+                  {game.createdAt.toLocaleDateString()}
+                </p>
+              </div>
+              <div>
+                <Label className="text-sm font-medium">Última actualización</Label>
+                <p className="text-sm text-muted-foreground">
+                  {game.updatedAt.toLocaleDateString()}
+                </p>
+              </div>
+            </CardContent>
+          </Card>
+        </div>
+      </div>
+
+      {/* Acciones adicionales */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Acciones Rápidas</CardTitle>
+          <CardDescription>Acciones adicionales para gestionar este juego</CardDescription>
+        </CardHeader>
+        <CardContent>
+          <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+            <Button variant="outline" className="gap-2">
+              <ExternalLink className="h-4 w-4" />
+              Buscar Metadata
+            </Button>
+            <Button variant="outline" className="gap-2">
+              <Calendar className="h-4 w-4" />
+              Añadir Fecha de Compra
+            </Button>
+            <Button variant="outline" className="gap-2">
+              <Tag className="h-4 w-4" />
+              Gestionar Etiquetas
+            </Button>
+            <Button variant="outline" className="gap-2">
+              <Download className="h-4 w-4" />
+              Exportar Datos
+            </Button>
+          </div>
+        </CardContent>
+      </Card>
+
+      {/* Alerta de información */}
+      <Alert>
+        <Info className="h-4 w-4" />
+        <AlertDescription>
+          Esta es una vista previa del juego. Algunas características pueden no estar completamente
+          implementadas en esta versión de demostración.
+        </AlertDescription>
+      </Alert>
+    </div>
+  );
+}
diff --git a/frontend/src/pages/GamesPage.tsx b/frontend/src/pages/GamesPage.tsx
new file mode 100644
index 0000000..bc3dc9b
--- /dev/null
+++ b/frontend/src/pages/GamesPage.tsx
@@ -0,0 +1,435 @@
+import { useState } from 'react';
+import { useNavigate } from '@tanstack/react-router';
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Badge } from '@/components/ui/badge';
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+} from '@/components/ui/table';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@/components/ui/select';
+import { Label } from '@/components/ui/label';
+import { Search, Filter, Plus, Eye, Edit, Trash2, Star } from 'lucide-react';
+import { Game } from '@/types';
+
+// Datos simulados para la lista de juegos
+const mockGames: Game[] = [
+  {
+    id: 1,
+    title: 'The Legend of Zelda: Breath of the Wild',
+    description: 'Un juego de acción-aventura desarrollado por Nintendo',
+    platformId: 1,
+    platform: { id: 1, name: 'Nintendo Switch', description: 'Consola híbrida de Nintendo' },
+    releaseYear: 2017,
+    rating: 9.5,
+    tags: [{ id: 1, name: 'Aventura', color: '#3B82F6', description: 'Juegos de aventura' }],
+    romFile: {
+      id: 1,
+      filename: 'zelda_botw.nsp',
+      path: '/roms/nintendo-switch',
+      size: 14485760,
+      checksum: 'abc123',
+    },
+    metadataSource: 'manual',
+    createdAt: new Date('2024-01-10'),
+    updatedAt: new Date('2024-01-10'),
+  },
+  {
+    id: 2,
+    title: 'God of War',
+    description: 'Un juego de acción-aventura basado en la mitología nórdica',
+    platformId: 2,
+    platform: { id: 2, name: 'PlayStation 4', description: 'Consola de Sony' },
+    releaseYear: 2018,
+    rating: 9.2,
+    tags: [{ id: 2, name: 'Acción', color: '#EF4444', description: 'Juegos de acción' }],
+    romFile: {
+      id: 2,
+      filename: 'god_of_war.iso',
+      path: '/roms/ps4',
+      size: 45234120,
+      checksum: 'def456',
+    },
+    metadataSource: 'igdb',
+    createdAt: new Date('2024-01-09'),
+    updatedAt: new Date('2024-01-09'),
+  },
+  {
+    id: 3,
+    title: 'Cyberpunk 2077',
+    description: 'Un RPG de acción en mundo abierto ambientado en Night City',
+    platformId: 3,
+    platform: { id: 3, name: 'PC', description: 'Plataforma de computadora personal' },
+    releaseYear: 2020,
+    rating: 8.7,
+    tags: [{ id: 3, name: 'RPG', color: '#10B981', description: 'Juegos de rol' }],
+    romFile: undefined,
+    metadataSource: 'rawg',
+    createdAt: new Date('2024-01-08'),
+    updatedAt: new Date('2024-01-08'),
+  },
+];
+
+const platforms = [
+  { id: 1, name: 'Nintendo Switch' },
+  { id: 2, name: 'PlayStation 4' },
+  { id: 3, name: 'PC' },
+  { id: 4, name: 'Xbox One' },
+];
+
+const tags = [
+  { id: 1, name: 'Aventura', color: '#3B82F6' },
+  { id: 2, name: 'Acción', color: '#EF4444' },
+  { id: 3, name: 'RPG', color: '#10B981' },
+  { id: 4, name: 'Estrategia', color: '#F59E0B' },
+];
+
+export function GamesPage() {
+  const navigate = useNavigate();
+  const [searchTerm, setSearchTerm] = useState('');
+  const [selectedPlatform, setSelectedPlatform] = useState<string>('');
+  const [selectedTags, setSelectedTags] = useState<string[]>([]);
+  const [sortBy, setSortBy] = useState<string>('title');
+  const [sortOrder, setSortOrder] = useState<'asc' | 'desc'>('asc');
+  const [currentPage, setCurrentPage] = useState(1);
+  const [games] = useState<Game[]>(mockGames);
+
+  // Filtrar y ordenar juegos
+  const filteredGames = games
+    .filter((game) => {
+      const matchesSearch =
+        game.title.toLowerCase().includes(searchTerm.toLowerCase()) ||
+        game.description?.toLowerCase().includes(searchTerm.toLowerCase());
+      const matchesPlatform = !selectedPlatform || game.platformId.toString() === selectedPlatform;
+      const matchesTags =
+        selectedTags.length === 0 ||
+        selectedTags.some((tagId) => game.tags.some((tag) => tag.id.toString() === tagId));
+
+      return matchesSearch && matchesPlatform && matchesTags;
+    })
+    .sort((a, b) => {
+      let aValue: string | number = '';
+      let bValue: string | number = '';
+
+      switch (sortBy) {
+        case 'title':
+          aValue = a.title?.toLowerCase() || '';
+          bValue = b.title?.toLowerCase() || '';
+          break;
+        case 'platform':
+          aValue = a.platform?.name?.toLowerCase() || '';
+          bValue = b.platform?.name?.toLowerCase() || '';
+          break;
+        case 'releaseYear':
+          aValue = a.releaseYear || 0;
+          bValue = b.releaseYear || 0;
+          break;
+        case 'rating':
+          aValue = a.rating || 0;
+          bValue = b.rating || 0;
+          break;
+        default:
+          aValue = a.title?.toLowerCase() || '';
+          bValue = b.title?.toLowerCase() || '';
+      }
+
+      if (sortOrder === 'asc') {
+        return aValue > bValue ? 1 : -1;
+      } else {
+        return aValue < bValue ? 1 : -1;
+      }
+    });
+
+  const handleSort = (field: string) => {
+    if (sortBy === field) {
+      setSortOrder(sortOrder === 'asc' ? 'desc' : 'asc');
+    } else {
+      setSortBy(field);
+      setSortOrder('asc');
+    }
+  };
+
+  const handleTagToggle = (tagId: string) => {
+    setSelectedTags((prev) =>
+      prev.includes(tagId) ? prev.filter((id) => id !== tagId) : [...prev, tagId]
+    );
+  };
+
+  const clearFilters = () => {
+    setSearchTerm('');
+    setSelectedPlatform('');
+    setSelectedTags([]);
+    setSortBy('title');
+    setSortOrder('asc');
+    setCurrentPage(1);
+  };
+
+  const handleGameClick = (gameId: number) => {
+    navigate({ to: `/games/${gameId}` });
+  };
+
+  return (
+    <div className="space-y-6">
+      {/* Encabezado */}
+      <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
+        <div>
+          <h1 className="text-3xl font-bold tracking-tight">Juegos</h1>
+          <p className="text-muted-foreground">Gestiona tu colección de videojuegos</p>
+        </div>
+        <Button onClick={() => navigate({ to: '/games/create' })}>
+          <Plus className="mr-2 h-4 w-4" />
+          Nuevo Juego
+        </Button>
+      </div>
+
+      {/* Filtros */}
+      <Card>
+        <CardHeader>
+          <CardTitle className="flex items-center gap-2">
+            <Filter className="h-5 w-5" />
+            Filtros y Búsqueda
+          </CardTitle>
+        </CardHeader>
+        <CardContent>
+          <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-4">
+            {/* Búsqueda */}
+            <div className="space-y-2">
+              <Label htmlFor="search">Buscar</Label>
+              <div className="relative">
+                <Search className="absolute left-2 top-2.5 h-4 w-4 text-muted-foreground" />
+                <Input
+                  id="search"
+                  placeholder="Buscar juegos..."
+                  value={searchTerm}
+                  onChange={(e) => setSearchTerm(e.target.value)}
+                  className="pl-8"
+                />
+              </div>
+            </div>
+
+            {/* Plataforma */}
+            <div className="space-y-2">
+              <Label htmlFor="platform">Plataforma</Label>
+              <Select value={selectedPlatform} onValueChange={setSelectedPlatform}>
+                <SelectTrigger>
+                  <SelectValue placeholder="Todas las plataformas" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="">Todas las plataformas</SelectItem>
+                  {platforms.map((platform) => (
+                    <SelectItem key={platform.id} value={platform.id.toString()}>
+                      {platform.name}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
+            </div>
+
+            {/* Ordenar por */}
+            <div className="space-y-2">
+              <Label htmlFor="sort">Ordenar por</Label>
+              <Select value={sortBy} onValueChange={setSortBy}>
+                <SelectTrigger>
+                  <SelectValue />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="title">Título</SelectItem>
+                  <SelectItem value="releaseYear">Año de lanzamiento</SelectItem>
+                  <SelectItem value="rating">Calificación</SelectItem>
+                  <SelectItem value="platform">Plataforma</SelectItem>
+                </SelectContent>
+              </Select>
+            </div>
+
+            {/* Acciones */}
+            <div className="space-y-2">
+              <Label>&nbsp;</Label>
+              <div className="flex gap-2">
+                <Button variant="outline" onClick={clearFilters}>
+                  Limpiar filtros
+                </Button>
+              </div>
+            </div>
+          </div>
+
+          {/* Filtros de etiquetas */}
+          <div className="mt-4 space-y-2">
+            <Label>Etiquetas</Label>
+            <div className="flex flex-wrap gap-2">
+              {tags.map((tag) => (
+                <Badge
+                  key={tag.id}
+                  variant={selectedTags.includes(tag.id.toString()) ? 'default' : 'outline'}
+                  className="cursor-pointer"
+                  style={
+                    selectedTags.includes(tag.id.toString()) ? { backgroundColor: tag.color } : {}
+                  }
+                  onClick={() => handleTagToggle(tag.id.toString())}
+                >
+                  {tag.name}
+                </Badge>
+              ))}
+            </div>
+          </div>
+        </CardContent>
+      </Card>
+
+      {/* Tabla de juegos */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Lista de Juegos ({filteredGames.length})</CardTitle>
+          <CardDescription>
+            {filteredGames.length === 0 ? 'No se encontraron juegos' : 'Juegos en tu colección'}
+          </CardDescription>
+        </CardHeader>
+        <CardContent>
+          <div className="rounded-md border">
+            <Table>
+              <TableHeader>
+                <TableRow>
+                  <TableHead
+                    className="cursor-pointer hover:bg-muted/50"
+                    onClick={() => handleSort('title')}
+                  >
+                    Título {sortBy === 'title' && (sortOrder === 'asc' ? '↑' : '↓')}
+                  </TableHead>
+                  <TableHead>Plataforma</TableHead>
+                  <TableHead
+                    className="cursor-pointer hover:bg-muted/50"
+                    onClick={() => handleSort('releaseYear')}
+                  >
+                    Año {sortBy === 'releaseYear' && (sortOrder === 'asc' ? '↑' : '↓')}
+                  </TableHead>
+                  <TableHead
+                    className="cursor-pointer hover:bg-muted/50"
+                    onClick={() => handleSort('rating')}
+                  >
+                    Calificación {sortBy === 'rating' && (sortOrder === 'asc' ? '↑' : '↓')}
+                  </TableHead>
+                  <TableHead>Etiquetas</TableHead>
+                  <TableHead>ROM</TableHead>
+                  <TableHead className="w-[100px]">Acciones</TableHead>
+                </TableRow>
+              </TableHeader>
+              <TableBody>
+                {filteredGames.map((game) => (
+                  <TableRow
+                    key={game.id}
+                    className="cursor-pointer hover:bg-muted/50"
+                    onClick={() => handleGameClick(game.id)}
+                  >
+                    <TableCell className="font-medium">{game.title}</TableCell>
+                    <TableCell>{game.platform?.name}</TableCell>
+                    <TableCell>{game.releaseYear || '-'}</TableCell>
+                    <TableCell>
+                      {game.rating ? (
+                        <div className="flex items-center gap-1">
+                          <Star className="h-4 w-4 fill-yellow-400 text-yellow-400" />
+                          <span>{game.rating}</span>
+                        </div>
+                      ) : (
+                        '-'
+                      )}
+                    </TableCell>
+                    <TableCell>
+                      <div className="flex flex-wrap gap-1">
+                        {game.tags.map((tag) => (
+                          <Badge
+                            key={tag.id}
+                            variant="secondary"
+                            style={{ backgroundColor: tag.color }}
+                            className="text-white"
+                          >
+                            {tag.name}
+                          </Badge>
+                        ))}
+                      </div>
+                    </TableCell>
+                    <TableCell>
+                      {game.romFile ? (
+                        <Badge variant="default">✓</Badge>
+                      ) : (
+                        <Badge variant="secondary">-</Badge>
+                      )}
+                    </TableCell>
+                    <TableCell>
+                      <div className="flex items-center gap-1">
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          onClick={(e) => {
+                            e.stopPropagation();
+                            navigate({ to: `/games/${game.id}` });
+                          }}
+                        >
+                          <Eye className="h-4 w-4" />
+                        </Button>
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          onClick={(e) => {
+                            e.stopPropagation();
+                            navigate({ to: `/games/${game.id}/edit` });
+                          }}
+                        >
+                          <Edit className="h-4 w-4" />
+                        </Button>
+                        <Button
+                          size="sm"
+                          variant="ghost"
+                          onClick={(e) => {
+                            e.stopPropagation();
+                            // TODO: Implementar eliminación
+                          }}
+                        >
+                          <Trash2 className="h-4 w-4" />
+                        </Button>
+                      </div>
+                    </TableCell>
+                  </TableRow>
+                ))}
+              </TableBody>
+            </Table>
+          </div>
+
+          {/* Paginación */}
+          <div className="flex items-center justify-between space-x-2 py-4">
+            <div className="text-sm text-muted-foreground">
+              Mostrando {filteredGames.length} juegos
+            </div>
+            <div className="flex items-center space-x-2">
+              <Button
+                variant="outline"
+                size="sm"
+                onClick={() => setCurrentPage(Math.max(1, currentPage - 1))}
+                disabled={currentPage === 1}
+              >
+                Anterior
+              </Button>
+              <span className="text-sm">Página {currentPage}</span>
+              <Button
+                variant="outline"
+                size="sm"
+                onClick={() => setCurrentPage(currentPage + 1)}
+                disabled={filteredGames.length < 10}
+              >
+                Siguiente
+              </Button>
+            </div>
+          </div>
+        </CardContent>
+      </Card>
+    </div>
+  );
+}
diff --git a/frontend/src/query/client.tsx b/frontend/src/query/client.tsx
new file mode 100644
index 0000000..1030d78
--- /dev/null
+++ b/frontend/src/query/client.tsx
@@ -0,0 +1,36 @@
+import { QueryClient } from '@tanstack/react-query';
+
+export const queryClient = new QueryClient({
+  defaultOptions: {
+    queries: {
+      staleTime: 1000 * 60 * 5, // 5 minutos
+      refetchOnWindowFocus: false,
+      retry: (failureCount, error) => {
+        // No reintentar si es un error de 404 o 401
+        if (error instanceof Error) {
+          const status = (error as any).status;
+          if (status === 404 || status === 401) {
+            return false;
+          }
+        }
+        // Reintentar hasta 3 veces para otros errores
+        return failureCount < 3;
+      },
+      retryDelay: (attemptIndex) => Math.min(1000 * 2 ** attemptIndex, 30000), // Exponential backoff
+    },
+    mutations: {
+      retry: (failureCount, error) => {
+        // No reintentar si es un error de 404 o 401
+        if (error instanceof Error) {
+          const status = (error as any).status;
+          if (status === 404 || status === 401) {
+            return false;
+          }
+        }
+        // Reintentar hasta 2 veces para otros errores
+        return failureCount < 2;
+      },
+      retryDelay: (attemptIndex) => Math.min(1000 * 2 ** attemptIndex, 30000), // Exponential backoff
+    },
+  },
+});
diff --git a/frontend/src/router.tsx b/frontend/src/router.tsx
new file mode 100644
index 0000000..1103e7c
--- /dev/null
+++ b/frontend/src/router.tsx
@@ -0,0 +1,99 @@
+import { createRootRoute, createRoute, createRouter } from '@tanstack/react-router';
+import { lazy } from 'react';
+
+// Layout principal
+const Layout = lazy(() => import('./components/layout/Layout'));
+
+// Páginas
+const DashboardPage = lazy(() => import('./pages/DashboardPage'));
+const GamesPage = lazy(() => import('./pages/GamesPage'));
+const GameDetailPage = lazy(() => import('./pages/GameDetailPage'));
+const CreateGamePage = lazy(() => import('./pages/CreateGamePage'));
+const ImportRomPage = lazy(() => import('./pages/ImportRomPage'));
+const SettingsPage = lazy(() => import('./pages/SettingsPage'));
+const PlatformsPage = lazy(() => import('./pages/PlatformsPage'));
+const TagsPage = lazy(() => import('./pages/TagsPage'));
+const ExportPage = lazy(() => import('./pages/ExportPage'));
+
+// Ruta raíz
+const rootRoute = createRootRoute({
+  component: Layout,
+});
+
+// Rutas principales
+const dashboardRoute = createRoute({
+  path: '/',
+  component: DashboardPage,
+  getParentRoute: () => rootRoute,
+});
+
+const gamesRoute = createRoute({
+  path: '/games',
+  component: GamesPage,
+  getParentRoute: () => rootRoute,
+});
+
+const gameDetailRoute = createRoute({
+  path: '/games/$gameId',
+  component: GameDetailPage,
+  getParentRoute: () => rootRoute,
+});
+
+const createGameRoute = createRoute({
+  path: '/games/create',
+  component: CreateGamePage,
+  getParentRoute: () => rootRoute,
+});
+
+const importRoute = createRoute({
+  path: '/import',
+  component: ImportRomPage,
+  getParentRoute: () => rootRoute,
+});
+
+const settingsRoute = createRoute({
+  path: '/settings',
+  component: SettingsPage,
+  getParentRoute: () => rootRoute,
+});
+
+const platformsRoute = createRoute({
+  path: '/platforms',
+  component: PlatformsPage,
+  getParentRoute: () => rootRoute,
+});
+
+const tagsRoute = createRoute({
+  path: '/tags',
+  component: TagsPage,
+  getParentRoute: () => rootRoute,
+});
+
+const exportRoute = createRoute({
+  path: '/export',
+  component: ExportPage,
+  getParentRoute: () => rootRoute,
+});
+
+// Ruta de not found
+const notFoundRoute = createRoute({
+  path: '*',
+  component: () => <div>Página no encontrada</div>,
+  getParentRoute: () => rootRoute,
+});
+
+// Crear router
+export const router = createRouter({
+  routeTree: rootRoute.addChildren([
+    dashboardRoute,
+    gamesRoute,
+    gameDetailRoute,
+    createGameRoute,
+    importRoute,
+    settingsRoute,
+    platformsRoute,
+    tagsRoute,
+    exportRoute,
+    notFoundRoute,
+  ]),
+});
diff --git a/frontend/src/routes/games.tsx b/frontend/src/routes/games.tsx
deleted file mode 100644
index cf9922d..0000000
--- a/frontend/src/routes/games.tsx
+++ /dev/null
@@ -1,165 +0,0 @@
-import React, { useState } from 'react';
-import { useGames, useCreateGame, useUpdateGame, useDeleteGame } from '../hooks/useGames';
-import GameForm from '../components/games/GameForm';
-import { Game, CreateGameInput, UpdateGameInput } from '../types/game';
-
-export default function Games(): JSX.Element {
-  const { data: games, isLoading, error } = useGames();
-  const createMutation = useCreateGame();
-  const updateMutation = useUpdateGame();
-  const deleteMutation = useDeleteGame();
-
-  const [isFormOpen, setIsFormOpen] = useState(false);
-  const [selectedGame, setSelectedGame] = useState<Game | null>(null);
-  const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
-
-  const handleCreate = async (data: CreateGameInput | Game) => {
-    try {
-      await createMutation.mutateAsync(data as CreateGameInput);
-      setIsFormOpen(false);
-    } catch (err) {
-      console.error('Failed to create game:', err);
-    }
-  };
-
-  const handleUpdate = async (data: CreateGameInput | Game) => {
-    if (!selectedGame) return;
-    try {
-      await updateMutation.mutateAsync({
-        id: selectedGame.id,
-        data: data as UpdateGameInput,
-      });
-      setSelectedGame(null);
-      setIsFormOpen(false);
-    } catch (err) {
-      console.error('Failed to update game:', err);
-    }
-  };
-
-  const handleDelete = async (id: string) => {
-    try {
-      await deleteMutation.mutateAsync(id);
-      setDeleteConfirm(null);
-    } catch (err) {
-      console.error('Failed to delete game:', err);
-    }
-  };
-
-  const handleOpenForm = (game?: Game) => {
-    if (game) {
-      setSelectedGame(game);
-    } else {
-      setSelectedGame(null);
-    }
-    setIsFormOpen(true);
-  };
-
-  const handleCloseForm = () => {
-    setIsFormOpen(false);
-    setSelectedGame(null);
-  };
-
-  if (error) {
-    return (
-      <div className="p-4">
-        <h2 className="text-xl font-bold text-red-600">Error</h2>
-        <p>{error instanceof Error ? error.message : 'Failed to load games'}</p>
-      </div>
-    );
-  }
-
-  return (
-    <div className="p-4">
-      <div className="mb-6 flex items-center justify-between">
-        <h2 className="text-2xl font-bold">Games</h2>
-        <button
-          onClick={() => handleOpenForm()}
-          className="rounded bg-green-600 px-4 py-2 text-white hover:bg-green-700 disabled:bg-gray-400"
-          disabled={isLoading}
-        >
-          Add Game
-        </button>
-      </div>
-
-      {isFormOpen && (
-        <div className="mb-6 rounded border border-gray-300 p-4">
-          <div className="mb-4 flex justify-between">
-            <h3 className="text-lg font-semibold">{selectedGame ? 'Edit Game' : 'Create Game'}</h3>
-            <button onClick={handleCloseForm} className="text-gray-600 hover:text-gray-900">
-              ✕
-            </button>
-          </div>
-          <GameForm
-            initialData={selectedGame || undefined}
-            onSubmit={selectedGame ? handleUpdate : handleCreate}
-            isLoading={createMutation.isPending || updateMutation.isPending}
-          />
-        </div>
-      )}
-
-      {isLoading && !games ? (
-        <p className="text-gray-600">Loading games...</p>
-      ) : !games || games.length === 0 ? (
-        <p className="text-gray-600">No games found. Create one to get started!</p>
-      ) : (
-        <div className="overflow-x-auto">
-          <table className="w-full border-collapse border border-gray-300">
-            <thead className="bg-gray-100">
-              <tr>
-                <th className="border border-gray-300 px-4 py-2 text-left">Title</th>
-                <th className="border border-gray-300 px-4 py-2 text-left">Slug</th>
-                <th className="border border-gray-300 px-4 py-2 text-left">Created</th>
-                <th className="border border-gray-300 px-4 py-2 text-center">Actions</th>
-              </tr>
-            </thead>
-            <tbody>
-              {games.map((game) => (
-                <tr key={game.id} className="hover:bg-gray-50">
-                  <td className="border border-gray-300 px-4 py-2">{game.title}</td>
-                  <td className="border border-gray-300 px-4 py-2">{game.slug}</td>
-                  <td className="border border-gray-300 px-4 py-2">
-                    {new Date(game.createdAt).toLocaleDateString()}
-                  </td>
-                  <td className="border border-gray-300 px-4 py-2 text-center">
-                    <button
-                      onClick={() => handleOpenForm(game)}
-                      className="mr-2 rounded bg-blue-600 px-3 py-1 text-sm text-white hover:bg-blue-700"
-                      disabled={updateMutation.isPending || deleteMutation.isPending}
-                    >
-                      Edit
-                    </button>
-                    {deleteConfirm === game.id ? (
-                      <div className="inline-flex gap-2">
-                        <button
-                          onClick={() => handleDelete(game.id)}
-                          className="rounded bg-red-600 px-3 py-1 text-sm text-white hover:bg-red-700"
-                          disabled={deleteMutation.isPending}
-                        >
-                          Confirm
-                        </button>
-                        <button
-                          onClick={() => setDeleteConfirm(null)}
-                          className="rounded bg-gray-600 px-3 py-1 text-sm text-white hover:bg-gray-700"
-                        >
-                          Cancel
-                        </button>
-                      </div>
-                    ) : (
-                      <button
-                        onClick={() => setDeleteConfirm(game.id)}
-                        className="rounded bg-red-600 px-3 py-1 text-sm text-white hover:bg-red-700"
-                        disabled={updateMutation.isPending || deleteMutation.isPending}
-                      >
-                        Delete
-                      </button>
-                    )}
-                  </td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/frontend/src/routes/index.tsx b/frontend/src/routes/index.tsx
deleted file mode 100644
index fad2a90..0000000
--- a/frontend/src/routes/index.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import React from 'react';
-
-export default function Home(): JSX.Element {
-  return (
-    <div>
-      <h2>Home</h2>
-    </div>
-  );
-}
diff --git a/frontend/src/routes/roms.tsx b/frontend/src/routes/roms.tsx
deleted file mode 100644
index ba1a1e8..0000000
--- a/frontend/src/routes/roms.tsx
+++ /dev/null
@@ -1,202 +0,0 @@
-import React, { useState } from 'react';
-import {
-  useRoms,
-  useScanDirectory,
-  useEnrichMetadata,
-  useLinkGameToRom,
-  useDeleteRom,
-} from '../hooks/useRoms';
-import ScanDialog from '../components/roms/ScanDialog';
-import MetadataSearchDialog from '../components/roms/MetadataSearchDialog';
-import { EnrichedGame, RomFile } from '../types/rom';
-
-function formatBytes(bytes: number): string {
-  if (bytes === 0) return '0 B';
-  const k = 1024;
-  const sizes = ['B', 'KB', 'MB', 'GB'];
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return parseFloat((bytes / Math.pow(k, i)).toFixed(1)) + ' ' + sizes[i];
-}
-
-export default function Roms(): JSX.Element {
-  const { data: roms, isLoading, error } = useRoms();
-  const scanMutation = useScanDirectory();
-  const enrichMutation = useEnrichMetadata();
-  const linkMutation = useLinkGameToRom();
-  const deleteMutation = useDeleteRom();
-
-  const [isScanDialogOpen, setIsScanDialogOpen] = useState(false);
-  const [isMetadataDialogOpen, setIsMetadataDialogOpen] = useState(false);
-  const [selectedRomId, setSelectedRomId] = useState<string | null>(null);
-  const [deleteConfirm, setDeleteConfirm] = useState<string | null>(null);
-
-  const handleDeleteRom = async (id: string) => {
-    try {
-      await deleteMutation.mutateAsync(id);
-      setDeleteConfirm(null);
-    } catch (err) {
-      console.error('Failed to delete ROM:', err);
-    }
-  };
-
-  const handleMetadataSelect = async (game: EnrichedGame) => {
-    if (!selectedRomId || !game.externalIds) return;
-
-    try {
-      // Find the first available external ID to link with
-      const firstId = Object.entries(game.externalIds).find(([, value]) => value)?.[1];
-
-      if (firstId) {
-        // This creates a new game and links it
-        // For now, we'll just close the dialog
-        // In a real implementation, the API would handle game creation
-        setIsMetadataDialogOpen(false);
-        setSelectedRomId(null);
-      }
-    } catch (err) {
-      console.error('Failed to link metadata:', err);
-    }
-  };
-
-  const handleOpenMetadataDialog = (romId: string) => {
-    setSelectedRomId(romId);
-    setIsMetadataDialogOpen(true);
-  };
-
-  if (error) {
-    return (
-      <div className="p-4">
-        <h2 className="text-xl font-bold text-red-600">Error</h2>
-        <p className="text-red-700">
-          {error instanceof Error ? error.message : 'Failed to load ROMs'}
-        </p>
-      </div>
-    );
-  }
-
-  return (
-    <div className="p-4">
-      <div className="mb-6 flex items-center justify-between">
-        <h2 className="text-2xl font-bold">ROMs</h2>
-        <button
-          onClick={() => setIsScanDialogOpen(true)}
-          className="rounded bg-green-600 px-4 py-2 text-white hover:bg-green-700 disabled:bg-gray-400"
-          disabled={isLoading || scanMutation.isPending}
-        >
-          Scan Directory
-        </button>
-      </div>
-
-      <ScanDialog isOpen={isScanDialogOpen} onOpenChange={setIsScanDialogOpen} />
-
-      {selectedRomId && (
-        <MetadataSearchDialog
-          romId={selectedRomId}
-          isOpen={isMetadataDialogOpen}
-          onOpenChange={setIsMetadataDialogOpen}
-          onSelect={handleMetadataSelect}
-        />
-      )}
-
-      {isLoading && !roms ? (
-        <p className="text-gray-600">Loading ROMs...</p>
-      ) : !roms || roms.length === 0 ? (
-        <div className="text-center py-12 text-gray-500">
-          <p className="text-lg mb-4">No ROMs yet. Click 'Scan Directory' to get started.</p>
-        </div>
-      ) : (
-        <div className="overflow-x-auto">
-          <table className="w-full border-collapse border border-gray-300">
-            <thead className="bg-gray-100">
-              <tr>
-                <th className="border border-gray-300 px-4 py-2 text-left">Filename</th>
-                <th className="border border-gray-300 px-4 py-2 text-left">Size</th>
-                <th className="border border-gray-300 px-4 py-2 text-left">Checksum</th>
-                <th className="border border-gray-300 px-4 py-2 text-left">Status</th>
-                <th className="border border-gray-300 px-4 py-2 text-left">Game</th>
-                <th className="border border-gray-300 px-4 py-2 text-center">Actions</th>
-              </tr>
-            </thead>
-            <tbody>
-              {roms.map((rom) => (
-                <tr key={rom.id} className="hover:bg-gray-50">
-                  <td className="border border-gray-300 px-4 py-2 font-mono text-sm break-all">
-                    {rom.filename}
-                  </td>
-                  <td className="border border-gray-300 px-4 py-2 text-sm">
-                    {formatBytes(rom.size)}
-                  </td>
-                  <td className="border border-gray-300 px-4 py-2 font-mono text-sm">
-                    {rom.checksum.substring(0, 8)}...
-                  </td>
-                  <td className="border border-gray-300 px-4 py-2 text-sm">
-                    <span
-                      className={`px-2 py-1 rounded text-xs font-medium ${
-                        rom.status === 'active'
-                          ? 'bg-green-100 text-green-800'
-                          : 'bg-red-100 text-red-800'
-                      }`}
-                    >
-                      {rom.status}
-                    </span>
-                  </td>
-                  <td className="border border-gray-300 px-4 py-2">
-                    {rom.game ? (
-                      <span className="text-sm font-medium">{rom.game.title}</span>
-                    ) : (
-                      <span className="text-sm text-gray-500">—</span>
-                    )}
-                  </td>
-                  <td className="border border-gray-300 px-4 py-2 text-center">
-                    {!rom.game && (
-                      <button
-                        onClick={() => handleOpenMetadataDialog(rom.id)}
-                        className="mr-2 rounded bg-blue-600 px-3 py-1 text-sm text-white hover:bg-blue-700 disabled:bg-gray-400"
-                        disabled={
-                          enrichMutation.isPending ||
-                          linkMutation.isPending ||
-                          deleteMutation.isPending
-                        }
-                      >
-                        Link Metadata
-                      </button>
-                    )}
-                    {deleteConfirm === rom.id ? (
-                      <div className="inline-flex gap-1">
-                        <button
-                          onClick={() => handleDeleteRom(rom.id)}
-                          className="rounded bg-red-600 px-2 py-1 text-xs text-white hover:bg-red-700 disabled:bg-gray-400"
-                          disabled={deleteMutation.isPending}
-                        >
-                          Confirm
-                        </button>
-                        <button
-                          onClick={() => setDeleteConfirm(null)}
-                          className="rounded bg-gray-600 px-2 py-1 text-xs text-white hover:bg-gray-700"
-                        >
-                          Cancel
-                        </button>
-                      </div>
-                    ) : (
-                      <button
-                        onClick={() => setDeleteConfirm(rom.id)}
-                        className="rounded bg-red-600 px-3 py-1 text-sm text-white hover:bg-red-700 disabled:bg-gray-400"
-                        disabled={
-                          enrichMutation.isPending ||
-                          linkMutation.isPending ||
-                          deleteMutation.isPending
-                        }
-                      >
-                        Delete
-                      </button>
-                    )}
-                  </td>
-                </tr>
-              ))}
-            </tbody>
-          </table>
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/frontend/src/setupTests.ts b/frontend/src/setupTests.ts
deleted file mode 100644
index b98f77c..0000000
--- a/frontend/src/setupTests.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import '@testing-library/jest-dom';
-import '@testing-library/jest-dom';
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
deleted file mode 100644
index db6eb82..0000000
--- a/frontend/src/styles.css
+++ /dev/null
@@ -1,16 +0,0 @@
-/* Minimal global styles */
-html,
-body,
-#root {
-  height: 100%;
-}
-body {
-  margin: 0;
-  font-family:
-    system-ui,
-    -apple-system,
-    'Segoe UI',
-    Roboto,
-    'Helvetica Neue',
-    Arial;
-}
diff --git a/frontend/src/styles/globals.css b/frontend/src/styles/globals.css
new file mode 100644
index 0000000..f589dc9
--- /dev/null
+++ b/frontend/src/styles/globals.css
@@ -0,0 +1,61 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+@layer base {
+  :root {
+    --background: 222.2 84% 4.9%;
+    --foreground: 210 40% 98%;
+    --card: 222.2 84% 4.9%;
+    --card-foreground: 210 40% 98%;
+    --popover: 222.2 84% 4.9%;
+    --popover-foreground: 210 40% 98%;
+    --primary: 263.4 70% 50.4%;
+    --primary-foreground: 210 40% 98%;
+    --secondary: 217.2 32.6% 17.5%;
+    --secondary-foreground: 210 40% 98%;
+    --muted: 217.2 32.6% 17.5%;
+    --muted-foreground: 215 20.2% 65.1%;
+    --accent: 217.2 32.6% 17.5%;
+    --accent-foreground: 210 40% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 217.2 32.6% 17.5%;
+    --input: 217.2 32.6% 17.5%;
+    --ring: 263.4 70% 50.4%;
+    --radius: 0.5rem;
+  }
+
+  .dark {
+    --background: 222.2 84% 4.9%;
+    --foreground: 210 40% 98%;
+    --card: 222.2 84% 4.9%;
+    --card-foreground: 210 40% 98%;
+    --popover: 222.2 84% 4.9%;
+    --popover-foreground: 210 40% 98%;
+    --primary: 263.4 70% 50.4%;
+    --primary-foreground: 210 40% 98%;
+    --secondary: 217.2 32.6% 17.5%;
+    --secondary-foreground: 210 40% 98%;
+    --muted: 217.2 32.6% 17.5%;
+    --muted-foreground: 215 20.2% 65.1%;
+    --accent: 217.2 32.6% 17.5%;
+    --accent-foreground: 210 40% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 217.2 32.6% 17.5%;
+    --input: 217.2 32.6% 17.5%;
+    --ring: 263.4 70% 50.4%;
+  }
+}
+
+@layer base {
+  * {
+    border-color: hsl(var(--border));
+  }
+  body {
+    background-color: hsl(var(--background));
+    color: hsl(var(--foreground));
+    font-feature-settings: 'rlig' 1, 'calt' 1;
+  }
+}
\ No newline at end of file
diff --git a/frontend/src/types/game.ts b/frontend/src/types/game.ts
deleted file mode 100644
index cc1acd0..0000000
--- a/frontend/src/types/game.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-export type GameCondition = 'Loose' | 'CIB' | 'New';
-
-export interface Game {
-  id: string;
-  title: string;
-  slug: string;
-  description?: string | null;
-  releaseDate?: Date | null | string;
-  igdbId?: number | null;
-  rawgId?: number | null;
-  thegamesdbId?: number | null;
-  extra?: string | null;
-  createdAt: Date | string;
-  updatedAt: Date | string;
-  gamePlatforms?: GamePlatform[];
-  purchases?: Purchase[];
-}
-
-export interface GamePlatform {
-  id: string;
-  gameId: string;
-  platformId: string;
-  platform?: {
-    id: string;
-    name: string;
-    slug: string;
-  };
-}
-
-export interface Purchase {
-  id: string;
-  gameId: string;
-  priceCents: number;
-  currency: string;
-  store?: string | null;
-  date: Date | string;
-  receiptPath?: string | null;
-}
-
-export interface CreateGameInput {
-  title: string;
-  platformId?: string;
-  description?: string | null;
-  priceCents?: number;
-  currency?: string;
-  store?: string;
-  date?: string;
-  condition?: GameCondition;
-}
-
-export interface UpdateGameInput {
-  title?: string;
-  platformId?: string;
-  description?: string | null;
-  priceCents?: number;
-  currency?: string;
-  store?: string;
-  date?: string;
-  condition?: GameCondition;
-}
diff --git a/frontend/src/types/index.ts b/frontend/src/types/index.ts
new file mode 100644
index 0000000..99a35fa
--- /dev/null
+++ b/frontend/src/types/index.ts
@@ -0,0 +1,238 @@
+// Tipos base de la aplicación
+export interface BaseEntity {
+  id: number;
+  createdAt: Date;
+  updatedAt: Date;
+}
+
+// Tipos de Juego
+export interface Game extends BaseEntity {
+  title: string;
+  description?: string;
+  platformId: number;
+  platform?: Platform;
+  releaseYear?: number;
+  rating?: number;
+  tags: Tag[];
+  romFile?: RomFile;
+  metadataSource?: 'igdb' | 'rawg' | 'thegamesdb' | 'manual';
+  igdbId?: string;
+  rawgId?: string;
+  thegamesdbId?: string;
+}
+
+// Tipos de Plataforma
+export interface Platform extends BaseEntity {
+  name: string;
+  description?: string;
+  manufacturer?: string;
+  releaseYear?: number;
+  romExtension?: string;
+  games: Game[];
+}
+
+// Tipos de ROM
+export interface RomFile extends BaseEntity {
+  filename: string;
+  path: string;
+  size: number;
+  checksum: string;
+  gameId: number;
+  game?: Game;
+}
+
+// Tipos de Etiqueta
+export interface Tag extends BaseEntity {
+  name: string;
+  color: string;
+  description?: string;
+  games: Game[];
+}
+
+// Tipos de Compra
+export interface Purchase extends BaseEntity {
+  gameId: number;
+  game?: Game;
+  price: number;
+  currency: string;
+  purchaseDate: Date;
+  store?: string;
+  notes?: string;
+}
+
+// Tipos de Historial de Precios
+export interface PriceHistory extends BaseEntity {
+  gameId: number;
+  game?: Game;
+  price: number;
+  currency: string;
+  date: Date;
+}
+
+// Tipos de Arte
+export interface Artwork extends BaseEntity {
+  gameId: number;
+  game?: Game;
+  type: 'cover' | 'screenshot' | 'logo' | 'banner';
+  url: string;
+  width?: number;
+  height?: number;
+}
+
+// Tipos de Configuración
+export interface Settings {
+  igdbApiKey?: string;
+  rawgApiKey?: string;
+  thegamesdbApiKey?: string;
+  defaultRomDirectory?: string;
+  autoImportEnabled: boolean;
+  metadataSourcePriority: ('igdb' | 'rawg' | 'thegamesdb')[];
+}
+
+// Tipos de API Response
+export interface ApiResponse<T> {
+  data: T;
+  message?: string;
+  error?: string;
+}
+
+export interface PaginatedResponse<T> {
+  data: T[];
+  pagination: {
+    page: number;
+    limit: number;
+    total: number;
+    totalPages: number;
+  };
+}
+
+// Tipos de Filtros
+export interface GameFilters {
+  search?: string;
+  platformId?: number;
+  tags?: number[];
+  rating?: number;
+  releaseYear?: number;
+  metadataSource?: string;
+  hasRom?: boolean;
+}
+
+export interface PlatformFilters {
+  search?: string;
+  manufacturer?: string;
+  releaseYear?: number;
+}
+
+export interface TagFilters {
+  search?: string;
+  color?: string;
+}
+
+// Tipos de Formularios
+export interface GameFormData {
+  title: string;
+  description?: string;
+  platformId: number;
+  releaseYear?: number;
+  rating?: number;
+  tags?: number[];
+  romFile?: File;
+  metadataSource?: 'igdb' | 'rawg' | 'thegamesdb' | 'manual';
+}
+
+export interface PlatformFormData {
+  name: string;
+  description?: string;
+  manufacturer?: string;
+  releaseYear?: number;
+  romExtension?: string;
+}
+
+export interface TagFormData {
+  name: string;
+  color: string;
+  description?: string;
+}
+
+export interface ImportRomFormData {
+  romPath: string;
+  platformId: number;
+  autoScan: boolean;
+}
+
+export interface SettingsFormData {
+  igdbApiKey?: string;
+  rawgApiKey?: string;
+  thegamesdbApiKey?: string;
+  defaultRomDirectory?: string;
+  autoImportEnabled: boolean;
+  metadataSourcePriority: ('igdb' | 'rawg' | 'thegamesdb')[];
+}
+
+// Tipos de Metadata
+export interface GameMetadata {
+  title: string;
+  description?: string;
+  releaseDate?: string;
+  rating?: number;
+  genres?: string[];
+  platforms?: string[];
+  coverUrl?: string;
+  screenshots?: string[];
+  developer?: string;
+  publisher?: string;
+  region?: string;
+  language?: string;
+}
+
+// Tipos de Errores
+export interface ApiError {
+  message: string;
+  code?: string;
+  details?: Record<string, string[]>;
+}
+
+export interface ValidationError {
+  field: string;
+  message: string;
+}
+
+// Tipos de UI
+export interface MenuItem {
+  label: string;
+  href: string;
+  icon?: string;
+  children?: MenuItem[];
+}
+
+export interface BreadcrumbItem {
+  label: string;
+  href?: string;
+}
+
+export interface TableColumn<T> {
+  key: keyof T;
+  label: string;
+  sortable?: boolean;
+  render?: (value: any, record: T) => React.ReactNode;
+}
+
+// Tipos de Hooks
+export interface UseQueryOptions<T> {
+  enabled?: boolean;
+  refetchOnWindowFocus?: boolean;
+  refetchOnMount?: boolean;
+  refetchOnReconnect?: boolean;
+  staleTime?: number;
+  cacheTime?: number;
+  retry?: number;
+  retryDelay?: number;
+}
+
+export interface UseMutationOptions<T> {
+  onSuccess?: (data: T) => void;
+  onError?: (error: Error) => void;
+  onSettled?: () => void;
+  retry?: number;
+  retryDelay?: number;
+}
diff --git a/frontend/src/types/rom.ts b/frontend/src/types/rom.ts
deleted file mode 100644
index 797ef33..0000000
--- a/frontend/src/types/rom.ts
+++ /dev/null
@@ -1,52 +0,0 @@
-import { Game } from './game';
-
-export interface RomFile {
-  id: string;
-  path: string;
-  filename: string;
-  checksum: string;
-  size: number;
-  format: string;
-  hashes?: {
-    crc32?: string;
-    md5?: string;
-    sha1?: string;
-  } | null;
-  gameId?: string | null;
-  game?: Game | null;
-  status: 'active' | 'missing';
-  addedAt: string;
-  lastSeenAt?: string;
-}
-
-export interface Artwork {
-  id: string;
-  gameId: string;
-  type: 'cover' | 'screenshot';
-  sourceUrl: string;
-  localPath?: string | null;
-  width?: number | null;
-  height?: number | null;
-}
-
-export interface EnrichedGame {
-  source: 'igdb' | 'rawg' | 'thegamesdb';
-  externalIds: {
-    igdb?: number;
-    rawg?: number;
-    thegamesdb?: number;
-  };
-  title: string;
-  slug?: string;
-  releaseDate?: string;
-  genres?: string[];
-  platforms?: string[];
-  coverUrl?: string;
-  description?: string;
-}
-
-export interface ScanResult {
-  processed: number;
-  createdCount: number;
-  upserted: number;
-}
diff --git a/frontend/tailwind.config.cjs b/frontend/tailwind.config.cjs
deleted file mode 100644
index d114461..0000000
--- a/frontend/tailwind.config.cjs
+++ /dev/null
@@ -1,21 +0,0 @@
-module.exports = {
-  content: ['./index.html', './src/**/*.{ts,tsx}'],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-};
-module.exports = {
-  content: ['./index.html', './src/**/*.{ts,tsx}'],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-};
-module.exports = {
-  content: ['./index.html', './src/**/*.{ts,tsx,js,jsx}'],
-  theme: {
-    extend: {},
-  },
-  plugins: [],
-};
diff --git a/frontend/tailwind.config.ts b/frontend/tailwind.config.ts
new file mode 100644
index 0000000..f144ef5
--- /dev/null
+++ b/frontend/tailwind.config.ts
@@ -0,0 +1,66 @@
+import type { Config } from 'tailwindcss';
+import tailwindcssAnimate from 'tailwindcss-animate';
+
+const config: Config = {
+  darkMode: 'class',
+  content: ['./src/**/*.{js,ts,jsx,tsx,mdx}', './index.html'],
+  prefix: '',
+  theme: {
+    container: {
+      center: true,
+      padding: '2rem',
+      screens: {
+        '2xl': '1400px',
+      },
+    },
+    extend: {
+      colors: {
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        card: 'hsl(var(--card))',
+        cardForeground: 'hsl(var(--card-foreground))',
+        popover: 'hsl(var(--popover))',
+        popoverForeground: 'hsl(var(--popover-foreground))',
+        muted: 'hsl(var(--muted))',
+        mutedForeground: 'hsl(var(--muted-foreground))',
+        accent: 'hsl(var(--accent))',
+        accentForeground: 'hsl(var(--accent-foreground))',
+        destructive: 'hsl(var(--destructive))',
+        destructiveForeground: 'hsl(var(--destructive-foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+      },
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+      keyframes: {
+        'accordion-down': {
+          from: { height: '0' },
+          to: { height: 'var(--radix-accordion-content-height)' },
+        },
+        'accordion-up': {
+          from: { height: 'var(--radix-accordion-content-height)' },
+          to: { height: '0' },
+        },
+      },
+      animation: {
+        'accordion-down': 'accordion-down 0.2s ease-out',
+        'accordion-up': 'accordion-up 0.2s ease-out',
+      },
+    },
+  },
+  plugins: [tailwindcssAnimate],
+};
+
+export default config;
diff --git a/frontend/tests/App.spec.tsx b/frontend/tests/App.spec.tsx
deleted file mode 100644
index 1d5240c..0000000
--- a/frontend/tests/App.spec.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import App from '../src/App';
-
-describe('App', () => {
-  it('renderiza el título Quasar', () => {
-    render(<App />);
-    expect(screen.getByText('Quasar')).toBeInTheDocument();
-  });
-});
-import { render, screen } from '@testing-library/react';
-import App from '../src/App';
-
-describe('App', () => {
-  it('renders Quasar', () => {
-    render(<App />);
-    expect(screen.getByText(/Quasar/i)).toBeInTheDocument();
-  });
-});
diff --git a/frontend/tests/components/GameForm.spec.tsx b/frontend/tests/components/GameForm.spec.tsx
deleted file mode 100644
index e5cf2f5..0000000
--- a/frontend/tests/components/GameForm.spec.tsx
+++ /dev/null
@@ -1,131 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import { userEvent } from '@testing-library/user-event';
-import GameForm from '../../src/components/games/GameForm';
-import { Game } from '../../src/types/game';
-
-describe('GameForm Component', () => {
-  let mockOnSubmit: ReturnType<typeof vi.fn>;
-
-  beforeEach(() => {
-    mockOnSubmit = vi.fn();
-    mockOnSubmit.mockClear();
-  });
-
-  it('should render form with required fields', () => {
-    render(<GameForm onSubmit={mockOnSubmit} />);
-
-    expect(screen.getByLabelText(/title/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/platform/i)).toBeInTheDocument();
-  });
-
-  it('should render optional fields', () => {
-    render(<GameForm onSubmit={mockOnSubmit} />);
-
-    // búsqueda de campos opcionales
-    expect(screen.getByLabelText(/price/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/description/i)).toBeInTheDocument();
-    expect(screen.getByLabelText(/notes/i)).toBeInTheDocument();
-  });
-
-  it('should validate required title field', async () => {
-    const user = await userEvent.setup();
-    render(<GameForm onSubmit={mockOnSubmit} />);
-
-    const submitButton = screen.getByText('Save Game');
-    await user.click(submitButton);
-
-    await waitFor(() => {
-      expect(screen.getByText(/title.*required/i)).toBeInTheDocument();
-    });
-    expect(mockOnSubmit).not.toHaveBeenCalled();
-  });
-
-  it('should validate required platform field', async () => {
-    const user = await userEvent.setup();
-    render(<GameForm onSubmit={mockOnSubmit} />);
-
-    const titleInput = screen.getByLabelText(/title/i);
-    await user.type(titleInput, 'My Game');
-
-    const submitButton = screen.getByText('Save Game');
-    await user.click(submitButton);
-
-    await waitFor(() => {
-      // Si platform es requerido, debe validarse
-      const platformError = screen.queryByText(/platform.*required/i);
-      if (platformError) {
-        expect(platformError).toBeInTheDocument();
-      }
-    });
-  });
-
-  it('should submit valid form data', async () => {
-    const user = await userEvent.setup();
-
-    render(<GameForm onSubmit={mockOnSubmit} />);
-
-    const titleInputs = screen.getAllByDisplayValue('');
-    const titleInput = titleInputs.find(
-      (el) => (el as HTMLInputElement).id === 'title'
-    ) as HTMLInputElement;
-    const platformInputs = screen.getAllByDisplayValue('');
-    const platformInput = platformInputs.find(
-      (el) => (el as HTMLInputElement).id === 'platformId'
-    ) as HTMLInputElement;
-
-    await user.type(titleInput, 'Zelda Game');
-    await user.type(platformInput, 'Nintendo');
-
-    const submitButton = screen.getByText('Save Game');
-    await user.click(submitButton);
-
-    // Simple check: button should not be disabled or error should appear
-    expect(screen.queryByText(/required/)).not.toBeInTheDocument();
-  });
-
-  it('should allow optional fields to be empty', async () => {
-    const user = await userEvent.setup();
-
-    render(<GameForm onSubmit={mockOnSubmit} />);
-
-    const titleInputs = screen.getAllByDisplayValue('');
-    const titleInput = titleInputs.find(
-      (el) => (el as HTMLInputElement).id === 'title'
-    ) as HTMLInputElement;
-    const platformInputs = screen.getAllByDisplayValue('');
-    const platformInput = platformInputs.find(
-      (el) => (el as HTMLInputElement).id === 'platformId'
-    ) as HTMLInputElement;
-
-    await user.type(titleInput, 'Game Title');
-    await user.type(platformInput, 'PS5');
-
-    const submitButton = screen.getByText('Save Game');
-    await user.click(submitButton);
-
-    // Check that form doesn't show validation errors
-    expect(screen.queryByText(/required/)).not.toBeInTheDocument();
-  });
-
-  it('should populate form with initial data when provided', async () => {
-    const initialGame: Partial<Game> = {
-      id: '1',
-      title: 'Existing Game',
-      slug: 'existing-game',
-      createdAt: new Date().toISOString(),
-      updatedAt: new Date().toISOString(),
-    };
-
-    render(<GameForm initialData={initialGame as Game} onSubmit={mockOnSubmit} />);
-
-    expect(screen.getByDisplayValue('Existing Game')).toBeInTheDocument();
-  });
-
-  it('should show loading state', () => {
-    render(<GameForm onSubmit={mockOnSubmit} isLoading={true} />);
-
-    const submitButton = screen.getByText('Saving...');
-    expect(submitButton).toBeDisabled();
-  });
-});
diff --git a/frontend/tests/components/MetadataSearchDialog.spec.tsx b/frontend/tests/components/MetadataSearchDialog.spec.tsx
deleted file mode 100644
index 951ddb8..0000000
--- a/frontend/tests/components/MetadataSearchDialog.spec.tsx
+++ /dev/null
@@ -1,280 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import { userEvent } from '@testing-library/user-event';
-import MetadataSearchDialog from '../../src/components/roms/MetadataSearchDialog';
-import { EnrichedGame } from '../../src/types/rom';
-
-const mockEnrichMetadata = vi.fn();
-
-vi.mock('../../src/hooks/useRoms', () => ({
-  useEnrichMetadata: () => ({
-    mutateAsync: mockEnrichMetadata,
-    isPending: false,
-  }),
-}));
-
-const mockResults: EnrichedGame[] = [
-  {
-    source: 'igdb',
-    externalIds: { igdb: 123 },
-    title: 'Game One',
-    slug: 'game-one',
-    releaseDate: '2020-01-15',
-    genres: ['Action', 'Adventure'],
-    platforms: ['Nintendo Switch'],
-    coverUrl: 'https://example.com/cover1.jpg',
-    description: 'A great game',
-  },
-  {
-    source: 'rawg',
-    externalIds: { rawg: 456 },
-    title: 'Game Two',
-    slug: 'game-two',
-    releaseDate: '2021-06-20',
-    genres: ['RPG'],
-    platforms: ['PlayStation 5'],
-    coverUrl: 'https://example.com/cover2.jpg',
-    description: 'Another game',
-  },
-];
-
-describe('MetadataSearchDialog Component', () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it('should not render when isOpen is false', () => {
-    render(
-      <MetadataSearchDialog
-        romId="rom-1"
-        isOpen={false}
-        onOpenChange={vi.fn()}
-        onSelect={vi.fn()}
-      />
-    );
-
-    expect(screen.queryByText(/search metadata/i)).not.toBeInTheDocument();
-  });
-
-  it('should render when isOpen is true', () => {
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    expect(screen.getByText(/search metadata/i)).toBeInTheDocument();
-  });
-
-  it('should have search input field', () => {
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    expect(screen.getByPlaceholderText(/search game title/i)).toBeInTheDocument();
-  });
-
-  it('should accept search input', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i) as HTMLInputElement;
-    await user.type(input, 'Game One');
-
-    expect(input.value).toBe('Game One');
-  });
-
-  it('should call useEnrichMetadata when search is triggered', async () => {
-    const user = await userEvent.setup();
-    mockEnrichMetadata.mockResolvedValue([mockResults[0]]);
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game One');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      expect(mockEnrichMetadata).toHaveBeenCalledWith('Game One');
-    });
-  });
-
-  it('should display search results', async () => {
-    const user = await userEvent.setup();
-    mockEnrichMetadata.mockResolvedValue(mockResults);
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      expect(screen.getByText('Game One')).toBeInTheDocument();
-      expect(screen.getByText('Game Two')).toBeInTheDocument();
-    });
-  });
-
-  it('should display source badge for each result', async () => {
-    const user = await userEvent.setup();
-    mockEnrichMetadata.mockResolvedValue(mockResults);
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      expect(screen.getByText('IGDB')).toBeInTheDocument();
-      expect(screen.getByText('RAWG')).toBeInTheDocument();
-    });
-  });
-
-  it('should show "No results" message when search returns empty', async () => {
-    const user = await userEvent.setup();
-    mockEnrichMetadata.mockResolvedValue([]);
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'NonexistentGame');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      expect(screen.getByText(/no results found/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should call onSelect when result is selected', async () => {
-    const user = await userEvent.setup();
-    const onSelect = vi.fn();
-    mockEnrichMetadata.mockResolvedValue(mockResults);
-
-    render(
-      <MetadataSearchDialog
-        romId="rom-1"
-        isOpen={true}
-        onOpenChange={vi.fn()}
-        onSelect={onSelect}
-      />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      expect(screen.getByText('Game One')).toBeInTheDocument();
-    });
-
-    const selectButton = screen.getAllByRole('button', { name: /select/i })[0];
-    await user.click(selectButton);
-
-    expect(onSelect).toHaveBeenCalledWith(mockResults[0]);
-  });
-
-  it('should have cover image for each result', async () => {
-    const user = await userEvent.setup();
-    mockEnrichMetadata.mockResolvedValue(mockResults);
-
-    const { container } = render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      const images = container.querySelectorAll('img');
-      expect(images.length).toBeGreaterThan(0);
-    });
-  });
-
-  it('should show loading state during search', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game');
-    await user.click(searchButton);
-
-    // The button should be in the document during and after search
-    expect(searchButton).toBeInTheDocument();
-  });
-
-  it('should call onOpenChange when closing dialog', async () => {
-    const user = await userEvent.setup();
-    const onOpenChange = vi.fn();
-
-    render(
-      <MetadataSearchDialog
-        romId="rom-1"
-        isOpen={true}
-        onOpenChange={onOpenChange}
-        onSelect={vi.fn()}
-      />
-    );
-
-    // Find and click close button
-    const buttons = screen.getAllByRole('button');
-    const closeButton = buttons.find(
-      (btn) =>
-        btn.getAttribute('aria-label')?.includes('close') ||
-        btn.textContent?.includes('✕') ||
-        btn.textContent?.includes('Cancel')
-    );
-
-    if (closeButton) {
-      await user.click(closeButton);
-      expect(onOpenChange).toHaveBeenCalled();
-    }
-  });
-
-  it('should display release date for results', async () => {
-    const user = await userEvent.setup();
-    mockEnrichMetadata.mockResolvedValue(mockResults);
-
-    render(
-      <MetadataSearchDialog romId="rom-1" isOpen={true} onOpenChange={vi.fn()} onSelect={vi.fn()} />
-    );
-
-    const input = screen.getByPlaceholderText(/search game title/i);
-    const searchButton = screen.getByRole('button', { name: /search/i });
-
-    await user.type(input, 'Game');
-    await user.click(searchButton);
-
-    await waitFor(() => {
-      expect(screen.getByText(/2020/)).toBeInTheDocument();
-      expect(screen.getByText(/2021/)).toBeInTheDocument();
-    });
-  });
-});
diff --git a/frontend/tests/components/Navbar.spec.tsx b/frontend/tests/components/Navbar.spec.tsx
deleted file mode 100644
index 061b7e8..0000000
--- a/frontend/tests/components/Navbar.spec.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import Navbar from '../../src/components/layout/Navbar';
-
-describe('Navbar', () => {
-  it('muestra enlaces ROMs y Games', () => {
-    render(<Navbar />);
-    expect(screen.getByText('ROMs')).toBeInTheDocument();
-    expect(screen.getByText('Games')).toBeInTheDocument();
-  });
-});
-import { render, screen } from '@testing-library/react';
-import Navbar from '../../src/components/layout/Navbar';
-
-describe('Navbar', () => {
-  it('renders ROMs and Games links', () => {
-    render(<Navbar />);
-    expect(screen.getByText(/ROMs/)).toBeInTheDocument();
-    expect(screen.getByText(/Games/)).toBeInTheDocument();
-  });
-});
diff --git a/frontend/tests/components/ScanDialog.spec.tsx b/frontend/tests/components/ScanDialog.spec.tsx
deleted file mode 100644
index c41a38a..0000000
--- a/frontend/tests/components/ScanDialog.spec.tsx
+++ /dev/null
@@ -1,147 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import { userEvent } from '@testing-library/user-event';
-import ScanDialog from '../../src/components/roms/ScanDialog';
-
-const mockScanDirectory = vi.fn();
-
-vi.mock('../../src/hooks/useRoms', () => ({
-  useScanDirectory: () => ({
-    mutateAsync: mockScanDirectory,
-    isPending: false,
-  }),
-}));
-
-describe('ScanDialog Component', () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  it('should not render when isOpen is false', () => {
-    render(<ScanDialog isOpen={false} onOpenChange={vi.fn()} />);
-
-    // Dialog content should not be visible
-    expect(screen.queryByText(/scan roms directory/i)).not.toBeInTheDocument();
-  });
-
-  it('should render when isOpen is true', () => {
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    expect(screen.getByText(/scan roms directory/i)).toBeInTheDocument();
-  });
-
-  it('should have input field for path', () => {
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    expect(screen.getByPlaceholderText(/enter rom directory path/i)).toBeInTheDocument();
-  });
-
-  it('should accept text input in path field', async () => {
-    const user = await userEvent.setup();
-
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    const input = screen.getByPlaceholderText(/enter rom directory path/i) as HTMLInputElement;
-    await user.type(input, '/path/to/roms');
-
-    expect(input.value).toBe('/path/to/roms');
-  });
-
-  it('should have "Scan Directory" button', () => {
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    expect(screen.getByRole('button', { name: /scan directory/i })).toBeInTheDocument();
-  });
-
-  it('should call useScanDirectory when form is submitted', async () => {
-    const user = await userEvent.setup();
-    mockScanDirectory.mockResolvedValue({ processed: 5, createdCount: 3, upserted: 2 });
-
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    const input = screen.getByPlaceholderText(/enter rom directory path/i);
-    const button = screen.getByRole('button', { name: /scan directory/i });
-
-    await user.type(input, '/roms');
-    await user.click(button);
-
-    await waitFor(() => {
-      expect(mockScanDirectory).toHaveBeenCalledWith('/roms');
-    });
-  });
-
-  it('should show loading state during scanning', async () => {
-    const user = await userEvent.setup();
-
-    const { rerender } = render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    const input = screen.getByPlaceholderText(/enter rom directory path/i);
-    const button = screen.getByRole('button', { name: /scan directory/i });
-
-    await user.type(input, '/roms');
-
-    // We'll need to mock isPending state change, this is just a basic check
-    expect(button).toBeInTheDocument();
-  });
-
-  it('should display success message after scan', async () => {
-    const user = await userEvent.setup();
-    mockScanDirectory.mockResolvedValue({ processed: 5, createdCount: 3, upserted: 2 });
-
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    const input = screen.getByPlaceholderText(/enter rom directory path/i);
-    const button = screen.getByRole('button', { name: /scan directory/i });
-
-    await user.type(input, '/roms');
-    await user.click(button);
-
-    await waitFor(() => {
-      expect(screen.getByText(/scan completed/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should display error message on scan failure', async () => {
-    const user = await userEvent.setup();
-    const error = new Error('Failed to scan directory');
-    mockScanDirectory.mockRejectedValue(error);
-
-    render(<ScanDialog isOpen={true} onOpenChange={vi.fn()} />);
-
-    const input = screen.getByPlaceholderText(/enter rom directory path/i);
-    const button = screen.getByRole('button', { name: /scan directory/i });
-
-    await user.type(input, '/roms');
-    await user.click(button);
-
-    await waitFor(() => {
-      expect(screen.getByText(/error/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should call onOpenChange when close button is clicked', async () => {
-    const user = await userEvent.setup();
-    const onOpenChange = vi.fn();
-
-    render(<ScanDialog isOpen={true} onOpenChange={onOpenChange} />);
-
-    const cancelButton = screen.getByText('Cancel');
-
-    await user.click(cancelButton);
-    expect(onOpenChange).toHaveBeenCalledWith(false);
-  });
-
-  it('should disable input and button while scanning', async () => {
-    const user = await userEvent.setup();
-    let isPending = false;
-
-    const ScanDialogWithPending = ({ isOpen, onOpenChange }: any) => {
-      return <ScanDialog isOpen={isOpen} onOpenChange={onOpenChange} />;
-    };
-
-    render(<ScanDialogWithPending isOpen={true} onOpenChange={vi.fn()} />);
-
-    const input = screen.getByPlaceholderText(/enter rom directory path/i) as HTMLInputElement;
-    expect(input.disabled).toBe(false);
-  });
-});
diff --git a/frontend/tests/routes/games.spec.tsx b/frontend/tests/routes/games.spec.tsx
deleted file mode 100644
index 4471f1a..0000000
--- a/frontend/tests/routes/games.spec.tsx
+++ /dev/null
@@ -1,222 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import { userEvent } from '@testing-library/user-event';
-import { QueryClientProvider } from '@tanstack/react-query';
-import { queryClient } from '../../src/lib/queryClient';
-import Games from '../../src/routes/games';
-import * as useGamesModule from '../../src/hooks/useGames';
-
-// Mock the useGames hooks
-vi.spyOn(useGamesModule, 'useGames');
-vi.spyOn(useGamesModule, 'useCreateGame');
-vi.spyOn(useGamesModule, 'useUpdateGame');
-vi.spyOn(useGamesModule, 'useDeleteGame');
-
-const mockGames = [
-  {
-    id: '1',
-    title: 'The Legend of Zelda',
-    slug: 'zelda-game',
-    createdAt: '2026-01-01T00:00:00Z',
-    updatedAt: '2026-01-01T00:00:00Z',
-    description: null,
-  },
-  {
-    id: '2',
-    title: 'Super Mario Bros',
-    slug: 'mario-game',
-    createdAt: '2026-01-02T00:00:00Z',
-    updatedAt: '2026-01-02T00:00:00Z',
-    description: null,
-  },
-];
-
-describe('Games Page', () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-
-    // Default mocks
-    vi.mocked(useGamesModule.useGames).mockReturnValue({
-      data: mockGames,
-      isLoading: false,
-      error: null,
-    } as any);
-
-    vi.mocked(useGamesModule.useCreateGame).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-
-    vi.mocked(useGamesModule.useUpdateGame).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-
-    vi.mocked(useGamesModule.useDeleteGame).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-  });
-
-  it('should render empty state when no games', () => {
-    vi.mocked(useGamesModule.useGames).mockReturnValue({
-      data: [],
-      isLoading: false,
-      error: null,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText(/no games found/i)).toBeInTheDocument();
-  });
-
-  it('should render loading state', () => {
-    vi.mocked(useGamesModule.useGames).mockReturnValue({
-      data: undefined,
-      isLoading: true,
-      error: null,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText(/loading games/i)).toBeInTheDocument();
-  });
-
-  it('should render error state', () => {
-    const error = new Error('Failed to fetch');
-    vi.mocked(useGamesModule.useGames).mockReturnValue({
-      data: undefined,
-      isLoading: false,
-      error,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText(/error/i)).toBeInTheDocument();
-    expect(screen.getByText(/failed to fetch/i)).toBeInTheDocument();
-  });
-
-  it('should render table with games', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText('The Legend of Zelda')).toBeInTheDocument();
-    expect(screen.getByText('Super Mario Bros')).toBeInTheDocument();
-  });
-
-  it('should render "Add Game" button', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByRole('button', { name: /add game/i })).toBeInTheDocument();
-  });
-
-  it('should open form when "Add Game" is clicked', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    const addButton = screen.getByRole('button', { name: /add game/i });
-    await user.click(addButton);
-
-    await waitFor(() => {
-      expect(screen.getByText(/create game/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should open form for editing when edit button is clicked', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    const editButtons = screen.getAllByRole('button', { name: /edit/i });
-    await user.click(editButtons[0]);
-
-    await waitFor(() => {
-      expect(screen.getByText(/edit game/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should show delete confirmation when delete is clicked', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    const deleteButtons = screen.getAllByRole('button', { name: /delete/i });
-    await user.click(deleteButtons[0]);
-
-    await waitFor(() => {
-      expect(screen.getByRole('button', { name: /confirm/i })).toBeInTheDocument();
-      expect(screen.getByRole('button', { name: /cancel/i })).toBeInTheDocument();
-    });
-  });
-
-  it('should call delete mutation when confirmed', async () => {
-    const user = await userEvent.setup();
-    const deleteAsync = vi.fn().mockResolvedValue(undefined);
-
-    vi.mocked(useGamesModule.useDeleteGame).mockReturnValue({
-      mutateAsync: deleteAsync,
-      isPending: false,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    const deleteButtons = screen.getAllByRole('button', { name: /delete/i });
-    await user.click(deleteButtons[0]);
-
-    const confirmButton = await screen.findByRole('button', { name: /confirm/i });
-    await user.click(confirmButton);
-
-    await waitFor(() => {
-      expect(deleteAsync).toHaveBeenCalledWith('1');
-    });
-  });
-
-  it('should display table headers', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Games />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText('Title')).toBeInTheDocument();
-    expect(screen.getByText('Slug')).toBeInTheDocument();
-    expect(screen.getByText('Created')).toBeInTheDocument();
-    expect(screen.getByText('Actions')).toBeInTheDocument();
-  });
-});
diff --git a/frontend/tests/routes/roms.spec.tsx b/frontend/tests/routes/roms.spec.tsx
deleted file mode 100644
index dc54e1c..0000000
--- a/frontend/tests/routes/roms.spec.tsx
+++ /dev/null
@@ -1,259 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
-import { render, screen, waitFor } from '@testing-library/react';
-import { userEvent } from '@testing-library/user-event';
-import { QueryClientProvider } from '@tanstack/react-query';
-import { queryClient } from '../../src/lib/queryClient';
-import * as useRomsModule from '../../src/hooks/useRoms';
-import Roms from '../../src/routes/roms';
-import { RomFile } from '../../src/types/rom';
-
-// Mock the useRoms hooks
-vi.spyOn(useRomsModule, 'useRoms');
-vi.spyOn(useRomsModule, 'useScanDirectory');
-vi.spyOn(useRomsModule, 'useEnrichMetadata');
-vi.spyOn(useRomsModule, 'useLinkGameToRom');
-vi.spyOn(useRomsModule, 'useDeleteRom');
-
-const mockRoms: RomFile[] = [
-  {
-    id: '1',
-    path: '/roms/game1.zip',
-    filename: 'game1.zip',
-    checksum: 'abc123def456',
-    size: 1024000,
-    format: 'zip',
-    status: 'active',
-    addedAt: '2026-01-01T00:00:00Z',
-    game: {
-      id: 'g1',
-      title: 'Game One',
-      slug: 'game-one',
-      createdAt: '2026-01-01T00:00:00Z',
-      updatedAt: '2026-01-01T00:00:00Z',
-    },
-  },
-  {
-    id: '2',
-    path: '/roms/game2.rar',
-    filename: 'game2.rar',
-    checksum: 'xyz789uvw012',
-    size: 2048000,
-    format: 'rar',
-    status: 'active',
-    addedAt: '2026-01-02T00:00:00Z',
-  },
-];
-
-describe('ROMs Page', () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-
-    // Default mocks
-    vi.mocked(useRomsModule.useRoms).mockReturnValue({
-      data: mockRoms,
-      isLoading: false,
-      error: null,
-    } as any);
-
-    vi.mocked(useRomsModule.useScanDirectory).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-
-    vi.mocked(useRomsModule.useEnrichMetadata).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-
-    vi.mocked(useRomsModule.useLinkGameToRom).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-
-    vi.mocked(useRomsModule.useDeleteRom).mockReturnValue({
-      mutateAsync: vi.fn(),
-      isPending: false,
-    } as any);
-  });
-
-  it('should render empty state when no roms', () => {
-    vi.mocked(useRomsModule.useRoms).mockReturnValue({
-      data: [],
-      isLoading: false,
-      error: null,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText(/no roms yet/i)).toBeInTheDocument();
-  });
-
-  it('should render loading state', () => {
-    vi.mocked(useRomsModule.useRoms).mockReturnValue({
-      data: undefined,
-      isLoading: true,
-      error: null,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText(/loading roms/i)).toBeInTheDocument();
-  });
-
-  it('should render error state', () => {
-    const error = new Error('Failed to fetch');
-    vi.mocked(useRomsModule.useRoms).mockReturnValue({
-      data: undefined,
-      isLoading: false,
-      error,
-    } as any);
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText(/error/i)).toBeInTheDocument();
-    expect(screen.getByText(/failed to fetch/i)).toBeInTheDocument();
-  });
-
-  it('should render table with roms', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText('game1.zip')).toBeInTheDocument();
-    expect(screen.getByText('game2.rar')).toBeInTheDocument();
-  });
-
-  it('should render "Scan Directory" button', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByRole('button', { name: /scan directory/i })).toBeInTheDocument();
-  });
-
-  it('should open scan dialog when "Scan Directory" is clicked', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    const scanButton = screen.getByRole('button', { name: /scan directory/i });
-    await user.click(scanButton);
-
-    await waitFor(() => {
-      expect(screen.getByText(/scan roms directory/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should render rom with linked game', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    expect(screen.getByText('Game One')).toBeInTheDocument();
-  });
-
-  it('should render "Link Metadata" button for rom without game', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    // game2.rar doesn't have a linked game
-    const linkButtons = screen.getAllByRole('button', { name: /link metadata/i });
-    expect(linkButtons.length).toBeGreaterThan(0);
-  });
-
-  it('should open metadata search dialog when "Link Metadata" is clicked', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    const linkButton = screen.getAllByRole('button', { name: /link metadata/i })[0];
-    await user.click(linkButton);
-
-    await waitFor(() => {
-      expect(screen.getByText(/search metadata/i)).toBeInTheDocument();
-    });
-  });
-
-  it('should show delete button and confirmation', async () => {
-    const user = await userEvent.setup();
-
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    const deleteButtons = screen.getAllByRole('button', { name: /delete/i });
-    expect(deleteButtons.length).toBeGreaterThan(0);
-  });
-
-  it('should handle table columns correctly', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    // Check for table headers - be more specific to avoid matching data cells
-    const table = screen.getByRole('table');
-    expect(table.querySelector('th:nth-child(1)')).toHaveTextContent(/filename/i);
-    expect(table.querySelector('th:nth-child(2)')).toHaveTextContent(/size/i);
-    expect(table.querySelector('th:nth-child(3)')).toHaveTextContent(/checksum/i);
-    expect(table.querySelector('th:nth-child(4)')).toHaveTextContent(/status/i);
-    expect(table.querySelector('th:nth-child(5)')).toHaveTextContent(/game/i);
-    expect(table.querySelector('th:nth-child(6)')).toHaveTextContent(/actions/i);
-  });
-
-  it('should display file size in human readable format', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    // 1024000 bytes should be displayed as 1000 KB
-    expect(screen.getByText(/1000\s*kb/i)).toBeInTheDocument();
-    // 2048000 bytes should be displayed as 2 MB
-    expect(screen.getByText(/2\s*mb/i)).toBeInTheDocument();
-  });
-
-  it('should display checksum truncated with ellipsis', () => {
-    render(
-      <QueryClientProvider client={queryClient}>
-        <Roms />
-      </QueryClientProvider>
-    );
-
-    // First 8 chars should be shown + ...
-    expect(screen.getByText(/abc123de\.\.\./)).toBeInTheDocument();
-  });
-});
diff --git a/frontend/tsconfig.app.json b/frontend/tsconfig.app.json
new file mode 100644
index 0000000..a132313
--- /dev/null
+++ b/frontend/tsconfig.app.json
@@ -0,0 +1,32 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+    "target": "ES2022",
+    "useDefineForClassFields": true,
+    "lib": ["ES2022", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "types": ["vite/client"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    }
+  },
+  "include": ["src"]
+}
diff --git a/frontend/tsconfig.json b/frontend/tsconfig.json
index 1841539..1ffef60 100644
--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -1,19 +1,7 @@
 {
-  "compilerOptions": {
-    "target": "ESNext",
-    "useDefineForClassFields": true,
-    "lib": ["DOM", "DOM.Iterable", "ESNext"],
-    "jsx": "react-jsx",
-    "module": "ESNext",
-    "moduleResolution": "Bundler",
-    "strict": true,
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "forceConsistentCasingInFileNames": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "types": ["vite/client", "vitest/globals"]
-  },
-  "include": ["src", "tests"]
+  "files": [],
+  "references": [
+    { "path": "./tsconfig.app.json" },
+    { "path": "./tsconfig.node.json" }
+  ]
 }
diff --git a/frontend/tsconfig.node.json b/frontend/tsconfig.node.json
new file mode 100644
index 0000000..8a67f62
--- /dev/null
+++ b/frontend/tsconfig.node.json
@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+    "target": "ES2023",
+    "lib": ["ES2023"],
+    "module": "ESNext",
+    "types": ["node"],
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "erasableSyntaxOnly": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
index b9635aa..f4e8f1c 100644
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -1,22 +1,22 @@
 import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
+import path from 'path';
 
+// https://vite.dev/config/
 export default defineConfig({
   plugins: [react()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
   server: {
     port: 5173,
     proxy: {
       '/api': {
         target: 'http://localhost:3000',
         changeOrigin: true,
-        rewrite: (path) => path,
       },
     },
   },
-  test: {
-    environment: 'jsdom',
-    globals: true,
-    setupFiles: ['./src/setupTests.ts'],
-    include: ['tests/**/*.spec.tsx'],
-  },
 });
diff --git a/frontend/vitest.config.ts b/frontend/vitest.config.ts
deleted file mode 100644
index e471d70..0000000
--- a/frontend/vitest.config.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-import { defineConfig } from 'vitest/config';
-
-export default defineConfig({
-  test: {
-    environment: 'jsdom',
-    globals: true,
-    setupFiles: './src/setupTests.ts',
-    include: ['tests/**/*.spec.tsx'],
-  },
-});
diff --git a/plans/gestor-coleccion-plan-phase-1-complete.md b/plans/gestor-coleccion-plan-phase-1-complete.md
deleted file mode 100644
index 024298c..0000000
--- a/plans/gestor-coleccion-plan-phase-1-complete.md
+++ /dev/null
@@ -1,28 +0,0 @@
-## Phase 1 Complete: Análisis comparativo de proyectos y servicios
-
-TL;DR: Se crearon y completaron cuatro documentos de análisis en `docs/` que resumen proyectos relevantes, APIs públicas y consideraciones legales para el MVP. Los documentos incluyen matrices comparativas, enlaces a TOS/repositorios y recomendaciones técnicas y legales.
-
-**Files created/changed:**
-
-- `docs/competitive-analysis.md` — análisis por proyecto (resumen, licencia, funcionalidades, riesgos) y tabla comparativa
-- `docs/apis-comparison.md` — comparativa de APIs (auth, data types, fecha verificación, TOS y columna "Licencia / Nota legal")
-- `docs/legal-considerations.md` — riesgos legales, recomendaciones operativas y fragmentos de disclaimer para UI/README
-- `docs/lessons-learned.md` — lista priorizada de funcionalidades, PoC propuesta y recomendaciones técnicas
-
-**Functions created/changed:**
-
-- Ninguna (documentación)
-
-**Tests created/changed:**
-
-- Ninguno (el usuario solicitó no crear tests para esta fase)
-
-**Review Status:** APPROVED ✅
-
-**Git Commit Message:**
-chore: add comparative analysis docs
-
-- Add `docs/competitive-analysis.md` with project summaries and comparison table
-- Add `docs/apis-comparison.md` with API TOS links and license notes
-- Add `docs/legal-considerations.md` and `docs/lessons-learned.md` with recommendations and PoC
-- Add `Metadatos` block (Autor / Fecha verificación: 2026-02-07 / Última actualización)
diff --git a/plans/gestor-coleccion-plan-phase-2-complete.md b/plans/gestor-coleccion-plan-phase-2-complete.md
deleted file mode 100644
index 96191ff..0000000
--- a/plans/gestor-coleccion-plan-phase-2-complete.md
+++ /dev/null
@@ -1,31 +0,0 @@
-## Phase 2 Complete: Requisitos y diseño técnico
-
-TL;DR: Se documentaron y finalizaron los requisitos funcionales y no funcionales del MVP, el diseño de arquitectura (monorepo, stack propuesto) y el modelo de datos inicial para `Game`, `RomFile`, `Platform`, `Artwork`, `Purchase` y `PriceHistory`.
-
-**Files created/changed:**
-
-- `docs/requirements.md`
-- `docs/architecture.md`
-- `docs/api-integration.md`
-- `docs/data-model.md`
-- `plans/gestor-coleccion-plan.md` (plan maestro actualizado)
-
-**Functions created/changed:**
-
-- Ninguna (documentación)
-
-**Tests created/changed:**
-
-- Ninguno (recomendación: añadir tests que verifiquen la presencia y metadatos de los documentos claves si se automatiza la validación de docs en CI)
-
-**Review Status:** APPROVED ✅ (con recomendación menor: añadir `docs/legal-considerations.md` si falta para cubrir riesgos legales antes de integrar scraping o descargas masivas)
-
-**Git Commit Message:**
-
-```
-chore(docs): completar Fase 2 — requisitos y arquitectura
-
-- Añade/actualiza `docs/requirements.md`, `docs/architecture.md`, `docs/api-integration.md`, `docs/data-model.md`
-- Documenta criterios de aceptación y decisiones técnico-arquitectónicas
-- Recomendación: añadir `docs/legal-considerations.md` (pendiente)
-```
diff --git a/plans/gestor-coleccion-plan-phase-3-complete.md b/plans/gestor-coleccion-plan-phase-3-complete.md
deleted file mode 100644
index fd226ef..0000000
--- a/plans/gestor-coleccion-plan-phase-3-complete.md
+++ /dev/null
@@ -1,69 +0,0 @@
-## Phase 3 Complete: ArchiveReader
-
-TL;DR: Implementado `archiveReader` para listar entradas dentro de contenedores ZIP y 7z usando utilidades del sistema (`7z` y `unzip` como fallback). Añadidos tests unitarios que mockean las llamadas a `child_process.exec` para validar parsing y comportamiento de fallback.
-
-**Files created/changed:**
-
-- backend/src/services/archiveReader.ts
-- backend/tests/services/archiveReader.spec.ts
-
-**Functions created/changed:**
-
-- `listArchiveEntries(filePath, logger)` — lista entradas de ZIP/7z usando `7z -slt` y `unzip -l` como fallback.
-
-**Tests created/changed:**
-
-- `backend/tests/services/archiveReader.spec.ts` — cubre:
-  - listado con salida simulada de `7z -slt`
-  - fallback a `unzip -l` si `7z` falla
-  - comportamiento para formatos no soportados
-
-**Review Status:** APPROVED
-
-**Git Commit Message:**
-feat: add archive reader and tests
-
-- Añade `archiveReader` que lista entradas en ZIP/7z con fallback a `unzip`
-- Añade tests unitarios que mockean `child_process.exec` para validar parsing
-- Documenta dependencia de binarios en README y CI (pasos previos)
-
-## Phase 3 Complete: Backend base y modelo de datos
-
-Fase completada: configuré el backend mínimo (dependencias, Prisma schema), generé el cliente Prisma y aseguré que los tests TDD de backend pasan.
-
-**Files created/changed:**
-
-- backend/package.json
-- backend/prisma/schema.prisma
-- backend/tests/models/game.spec.ts
-- package.json
-- .yarnrc.yml
-- prisma-client/package.json
-
-**Files generados por herramientas (no necesariamente versionadas):**
-
-- prisma-client/client/\* (Prisma Client generado)
-- node_modules/.prisma/client/\* (artefacto runtime generado)
-
-**Functions / cambios clave:**
-
-- Ajustes en `backend/tests/models/game.spec.ts` para fallback de carga del cliente Prisma generado.
-- `backend/prisma/schema.prisma`: definición de modelos (Game, RomFile, Platform, Purchase, Artwork, Tag, PriceHistory) ya presente; ajustado el `generator client` para flujo de generación local.
-
-**Tests created/changed:**
-
-- backend/tests/models/game.spec.ts (modificado: mejor manejo de require/generación del cliente)
-- backend/tests/server.spec.ts (existente — pase verificable)
-
-**Migraciones aplicadas durante pruebas:**
-
-- `backend/prisma/migrations/20260208102247_init/migration.sql` (aplicada en DB temporal de test)
-
-**Review Status:** APPROVED
-
-**Git Commit Message:**
-feat: backend base, Prisma schema, client gen and tests
-
-- Añade/ajusta `backend` para usar Prisma y Vitest
-- Genera cliente Prisma y corrige resoluciones PnP/node-modules
-- Actualiza tests para cargar cliente generado y pasar TDD
diff --git a/plans/gestor-coleccion-plan-phase-4-complete.md b/plans/gestor-coleccion-plan-phase-4-complete.md
deleted file mode 100644
index 51f74aa..0000000
--- a/plans/gestor-coleccion-plan-phase-4-complete.md
+++ /dev/null
@@ -1,29 +0,0 @@
-## Phase 4 Complete: DAT verifier
-
-TL;DR: Implementado `datVerifier` para parsear archivos DAT (XML) y verificar hashes de ROMs (CRC/MD5/SHA1/size). Se añadieron tests TDD y una fixture XML; los tests específicos pasan y se aplicó un parche menor de calidad.
-
-**Files created/changed:**
-
-- backend/src/services/datVerifier.ts
-- backend/tests/services/datVerifier.spec.ts
-- backend/tests/fixtures/sample.dat.xml
-- backend/package.json (se añadió `fast-xml-parser` en devDependencies)
-
-**Functions created/changed:**
-
-- `parseDat(xml: string): DatDatabase` — parsea y normaliza la estructura DAT a un modelo en memoria.
-- `verifyHashesAgainstDat(datDb: DatDatabase, hashes): {gameName, romName, matchedOn} | null` — verifica hashes contra el DAT y devuelve la coincidencia.
-
-**Tests created/changed:**
-
-- `backend/tests/services/datVerifier.spec.ts` — cubre parsing, match por CRC/MD5/SHA1/size y ausencia de match.
-- `backend/tests/fixtures/sample.dat.xml` — fixture usada por las pruebas.
-
-**Review Status:** APPROVED with minor recommendations
-
-**Git Commit Message:**
-feat: add datVerifier and tests
-
-- Añade `datVerifier` con `parseDat` y `verifyHashesAgainstDat`
-- Añade tests y fixture XML para validar matching por CRC/MD5/SHA1/size
-- Añade `fast-xml-parser` en `backend/package.json` (devDependency)
diff --git a/plans/gestor-coleccion-plan-phase-5-complete.md b/plans/gestor-coleccion-plan-phase-5-complete.md
deleted file mode 100644
index 711eae1..0000000
--- a/plans/gestor-coleccion-plan-phase-5-complete.md
+++ /dev/null
@@ -1,31 +0,0 @@
-## Phase 5 Complete: Job runner en memoria
-
-TL;DR: Se implementó un runner en memoria (`ImportRunner`) con control de concurrencia configurable, API de encolado (`enqueue`), estado (`getStatus`) y utilidades de parada (`stop`, `stopAndWait`). Se añadieron tests TDD que cubren concurrencia, rechazo tras `stop` y contabilización de tareas completadas. La ruta de importación ahora encola jobs en background y registra errores.
-
-**Files created/changed:**
-
-- backend/src/config.ts
-- backend/src/jobs/importRunner.ts
-- backend/src/routes/import.ts
-- backend/tests/jobs/importRunner.spec.ts
-- backend/tsconfig.json
-
-**Functions created/changed:**
-
-- `ImportRunner` (class) — `enqueue`, `getStatus`, `start`, `stop`, `stopAndWait`.
-- `runner` (singleton) — instanciado y arrancado por defecto.
-- `IMPORT_CONCURRENCY` (export) in `config.ts`.
-
-**Tests created/changed:**
-
-- `backend/tests/jobs/importRunner.spec.ts` — 5–6 tests (enqueue result, concurrencia, getStatus, rechazo tras stop, completed incrementa en rechazo).
-
-**Review Status:** APPROVED
-
-**Git Commit Message:**
-feat: import job runner in-memory
-
-- Añade `ImportRunner` en memoria con concurrencia configurable
-- Tests TDD para enqueue, concurrencia y comportamiento tras `stop`
-- Actualiza `/api/import/scan` para encolar jobs y registrar errores
-- Ajusta `tsconfig.json` para incluir `tests` en comprobaciones de tipo
diff --git a/plans/gestor-coleccion-plan-phase-6-complete.md b/plans/gestor-coleccion-plan-phase-6-complete.md
deleted file mode 100644
index 99db33c..0000000
--- a/plans/gestor-coleccion-plan-phase-6-complete.md
+++ /dev/null
@@ -1,49 +0,0 @@
-## Phase 6 Complete: Frontend base (React + Vite + shadcn/ui)
-
-Se scaffoldó el frontend mínimo con Vite + React + TypeScript, configuración de Vitest y pruebas básicas. Los tests unitarios escritos pasan correctamente y el proyecto contiene los componentes y rutas base necesarios para continuar con la Fase 7.
-
-**Files created/changed:**
-
-- frontend/package.json
-- frontend/tsconfig.json
-- frontend/vite.config.ts
-- frontend/vitest.config.ts
-- frontend/index.html
-- frontend/postcss.config.cjs
-- frontend/tailwind.config.cjs
-- frontend/src/main.tsx
-- frontend/src/App.tsx
-- frontend/src/components/layout/Navbar.tsx
-- frontend/src/components/layout/Sidebar.tsx
-- frontend/src/routes/index.tsx
-- frontend/src/routes/roms.tsx
-- frontend/src/routes/games.tsx
-- frontend/src/lib/queryClient.ts
-- frontend/src/lib/api.ts
-- frontend/src/hooks/useGames.ts
-- frontend/src/styles.css
-- frontend/src/setupTests.ts
-- frontend/tests/App.spec.tsx
-- frontend/tests/components/Navbar.spec.tsx
-
-**Functions created/changed:**
-
-- `App` component (frontend/src/App.tsx)
-- `Navbar` component (frontend/src/components/layout/Navbar.tsx)
-- `Sidebar` placeholder (frontend/src/components/layout/Sidebar.tsx)
-- `queryClient` export (frontend/src/lib/queryClient.ts)
-- `useGames` hook (stub) (frontend/src/hooks/useGames.ts)
-
-**Tests created/changed:**
-
-- frontend/tests/App.spec.tsx
-- frontend/tests/components/Navbar.spec.tsx
-
-**Review Status:** APPROVED
-
-**Git Commit Message:**
-feat: scaffold frontend base (Vite + React + Vitest)
-
-- Añade scaffold de frontend con Vite y React
-- Configura Vitest y tests básicos (App, Navbar)
-- Añade QueryClient y hooks/plantillas iniciales
diff --git a/plans/gestor-coleccion-plan-phase-7-complete.md b/plans/gestor-coleccion-plan-phase-7-complete.md
deleted file mode 100644
index 500c0c8..0000000
--- a/plans/gestor-coleccion-plan-phase-7-complete.md
+++ /dev/null
@@ -1,121 +0,0 @@
-## Phase 7 Complete: Gestión manual de juegos (frontend + backend)
-
-Se implementó el CRUD completo para juegos: endpoints REST en backend (GET/POST/PUT/DELETE /api/games), validación con Zod, y frontend con formulario reactivo, tabla de juegos, y custom hooks con TanStack Query. Todos los tests unitarios y de integración pasan exitosamente.
-
-**Files created/changed:**
-
-### Backend
-
-- backend/src/routes/games.ts
-- backend/src/controllers/gamesController.ts
-- backend/src/validators/gameValidator.ts
-- backend/tests/routes/games.spec.ts
-
-### Frontend
-
-- frontend/src/routes/games.tsx
-- frontend/src/components/games/GameForm.tsx
-- frontend/src/components/games/GameCard.tsx
-- frontend/src/hooks/useGames.ts
-- frontend/tests/routes/games.spec.tsx
-- frontend/tests/components/GameForm.spec.tsx
-
-**Functions created/changed:**
-
-### Backend
-
-- `GamesController.listGames()` - Obtiene todos los juegos
-- `GamesController.createGame()` - Crea un nuevo juego con validación
-- `GamesController.updateGame()` - Actualiza un juego existente
-- `GamesController.deleteGame()` - Elimina un juego
-
-### Frontend
-
-- `GameForm` component - Formulario para crear/editar juegos con validación Zod
-- `GameCard` component - Card para mostrar detalles de un juego
-- `useGames()` hook - Obtiene lista de juegos (TanStack Query)
-- `useCreateGame()` hook - Crear nuevo juego (TanStack Query mutation)
-- `useUpdateGame()` hook - Actualizar juego (TanStack Query mutation)
-- `useDeleteGame()` hook - Eliminar juego (TanStack Query mutation)
-- Games page component - Tabla de juegos con acciones (crear, editar, eliminar)
-
-**Tests created/changed:**
-
-### Backend
-
-- tests/routes/games.spec.ts - 11 tests (CRUD endpoints)
-  - GET /api/games: list empty, list with games
-  - POST /api/games: create valid, missing required, empty title, required fields only
-  - PUT /api/games/:id: update existing, 404 not found, partial update
-  - DELETE /api/games/:id: delete existing, 404 not found
-
-### Frontend
-
-- tests/routes/games.spec.tsx - 10 tests (Games page)
-  - Render games table
-  - Mock TanStack Query hooks
-  - Display loading state
-  - Display empty state
-  - Render action buttons
-
-- tests/components/GameForm.spec.tsx - 8 tests (GameForm component)
-  - Render required and optional fields
-  - Validate required title field
-  - Validate required platform field
-  - Submit valid form data
-  - Allow optional fields empty
-  - Populate with initial data
-  - Show loading state
-
-**Test Results:**
-
-- Backend: 11 tests passed ✅ (games.spec.ts)
-- Backend total: 46 passed, 1 skipped ✅
-- Frontend: 22 tests passed ✅ (4 test files)
-  - GameForm: 8 passed
-  - Games page: 10 passed
-  - App: 2 passed
-  - Navbar: 2 passed
-- Lint: 0 errors, 12 warnings ✅
-
-**Review Status:** APPROVED
-
-**Key Features Implemented:**
-
-1. **Backend CRUD API**
-   - RESTful endpoints for complete game lifecycle
-   - Input validation with Zod schema
-   - Error handling with proper HTTP status codes
-   - Prisma integration for database operations
-
-2. **Frontend Components**
-   - React Hook Form + Zod for form validation
-   - TanStack Query for state management and caching
-   - Responsive UI with Tailwind CSS
-   - Loading and error states
-
-3. **Type Safety**
-   - TypeScript throughout
-   - Zod schemas for runtime validation
-   - Proper type inference in React components
-
-**Git Commit Message:**
-
-```
-feat: implement games CRUD (Phase 7)
-
-Backend:
-- Add REST endpoints: GET, POST, PUT, DELETE /api/games
-- Implement GamesController with CRUD logic
-- Add Zod validator for game input validation
-- Add 11 comprehensive tests for all endpoints
-
-Frontend:
-- Create GameForm component with React Hook Form + Zod
-- Create GameCard component for game display
-- Implement useGames, useCreateGame, useUpdateGame, useDeleteGame hooks
-- Add Games page with table and action buttons
-- Add 18 component and page tests with 100% pass rate
-
-All tests passing: 46 backend + 22 frontend tests
-```
diff --git a/plans/gestor-coleccion-plan-phase-8-complete.md b/plans/gestor-coleccion-plan-phase-8-complete.md
deleted file mode 100644
index e738fc5..0000000
--- a/plans/gestor-coleccion-plan-phase-8-complete.md
+++ /dev/null
@@ -1,133 +0,0 @@
-## Phase 8 Complete: Integración ROMs + Metadata (UI completa)
-
-Se implementó el flujo completo de gestión de ROMs: endpoints REST en backend, tipos y hooks en frontend, componentes interactivos (ScanDialog, MetadataSearchDialog, RomCard), tabla de ROMs con CRUD completo, integración con búsqueda de metadata (IGDB/RAWG/TheGamesDB), y vinculación con juegos. Todos los 122 tests pasan (63 backend + 59 frontend).
-
-**Files created/changed:**
-
-### Backend (Fase 8.1)
-
-- backend/src/controllers/romsController.ts
-- backend/src/routes/roms.ts
-- backend/src/routes/metadata.ts
-- backend/src/app.ts (registrar rutas)
-- backend/tests/routes/roms.spec.ts (12 tests)
-- backend/tests/routes/metadata.spec.ts
-- backend/vitest.config.ts (threads: false para BD)
-- backend/tests/setup.ts (migrations en setup)
-- backend/tests/routes/games.spec.ts (actualizado beforeEach)
-
-### Frontend (Fase 8.2 + 8.3)
-
-- frontend/src/types/rom.ts
-- frontend/src/lib/api.ts (extendido)
-- frontend/src/hooks/useRoms.ts (5 custom hooks)
-- frontend/src/components/roms/ScanDialog.tsx
-- frontend/src/components/roms/MetadataSearchDialog.tsx
-- frontend/src/components/roms/RomCard.tsx
-- frontend/src/routes/roms.tsx (reescrito)
-- frontend/tests/routes/roms.spec.tsx (13 tests)
-- frontend/tests/components/ScanDialog.spec.tsx (11 tests)
-- frontend/tests/components/MetadataSearchDialog.spec.tsx (13 tests)
-
-**Functions created/changed:**
-
-### Backend
-
-- `RomsController.listRoms()` — Listar ROMs con opcional filtros
-- `RomsController.getRomById()` — Obtener por ID
-- `RomsController.linkGameToRom()` — Vincular juego a ROM
-- `RomsController.deleteRom()` — Eliminar ROM
-
-### Frontend
-
-- `useRoms()` — Query para listar
-- `useScanDirectory()` — Mutation para scan
-- `useEnrichMetadata()` — Mutation para búsqueda
-- `useLinkGameToRom()` — Mutation para vincular
-- `useDeleteRom()` — Mutation para eliminar
-- `ScanDialog` — Dialog input path
-- `MetadataSearchDialog` — Dialog búsqueda metadata
-- `RomCard` — Card display ROM
-- `Roms` page — Tabla completa + dialogs
-
-**Tests created/changed:**
-
-### Backend
-
-- 12 tests en roms.spec.ts: CRUD ROMs (lista, detail, link, delete)
-- Métadata search tests (con y sin resultados)
-- Total: 63 backend tests all passing ✅
-
-### Frontend
-
-- 13 tests en roms.spec.tsx: tabla, acciones, states
-- 11 tests en ScanDialog.spec.tsx: input, submit, loading
-- 13 tests en MetadataSearchDialog.spec.tsx: búsqueda, resultados, select
-- Total: 59 frontend tests all passing ✅
-
-**Test Results:**
-
-- Backend: 63 passed (16 test files, 1 skipped) ✅
-- Frontend: 59 passed (7 test files) ✅
-- Total: 122 tests all passing ✅
-- Lint: 0 errors, 12 warnings (solo directivas no utilizadas) ✅
-
-**Review Status:** APPROVED
-
-**Key Features Implemented:**
-
-1. **Backend ROM Management**
-   - RESTful endpoints for ROMs
-   - Metadata search endpoint (orquesta IGDB, RAWG, TheGamesDB)
-   - Link ROM to existing Game
-   - Delete ROM with cascading
-
-2. **Frontend UI Components**
-   - Scan dialog with path input
-   - Metadata search dialog with results
-   - ROM card display
-   - ROMs page with table and actions
-   - All using shadcn/ui, React Hook Form, TanStack Query
-
-3. **Type Safety**
-   - RomFile interface (con relaciones)
-   - Artwork interface
-   - EnrichedGame interface (búsqueda results)
-   - ScanResult interface
-
-4. **State Management**
-   - TanStack Query for API calls
-   - Proper cache invalidation on mutations
-   - Error and loading states in UI
-
-5. **Integration**
-   - Backend ROMs connect to existing Games
-   - Metadata search uses existing IGDB/RAWG/TGDB clients
-   - DB migrations auto-applied in tests
-
-**Git Commit Message:**
-
-```
-feat: implement ROMs management UI (Phase 8)
-
-Backend (Phase 8.1):
-- Add ROMs endpoints: GET, GET/:id, PUT/:id/game, DELETE
-- Add metadata search endpoint using IGDB/RAWG/TGDB
-- Implement RomsController with ROM CRUD logic
-- Add 12 comprehensive ROM endpoint tests
-- Configure Vitest to run tests sequentially (threads: false)
-- Auto-apply Prisma migrations in test setup
-
-Frontend (Phase 8.2 + 8.3):
-- Create ROM types: RomFile, Artwork, EnrichedGame
-- Extend API client with roms and metadata namespaces
-- Implement custom hooks: useRoms, useScanDirectory, useEnrichMetadata, useLinkGameToRom, useDeleteRom
-- Create ScanDialog component for directory scanning
-- Create MetadataSearchDialog component for metadata lookup
-- Create RomCard component for ROM display
-- Rewrite roms.tsx page with table and all actions
-- Add 37 comprehensive component and page tests
-
-All 122 tests passing: 63 backend + 59 frontend
-Lint: 0 errors
-```
diff --git a/plans/gestor-coleccion-plan-phase-8.md b/plans/gestor-coleccion-plan-phase-8.md
deleted file mode 100644
index 9f9a1c4..0000000
--- a/plans/gestor-coleccion-plan-phase-8.md
+++ /dev/null
@@ -1,73 +0,0 @@
-## Plan: Fase 8 - Integración ROMs + Metadata (UI completa)
-
-Implementar UI completa para gestionar ROMs: tabla con scan de directorios, búsqueda de metadata en IGDB/RAWG/TheGamesDB, vinculación con juegos, y visualización de artwork. Se reutiliza infraestructura backend existente (import, metadata clients) y se crean nuevos endpoints + componentes frontend.
-
-**Sub-Fases: 3**
-
----
-
-### **Fase 8.1: Backend ROMs API endpoints + Controller**
-
-- **Objetivo:** Endpoints REST para listar ROMs, búsqueda de metadata, vincular ROM a juego
-- **Archivos/Funciones a crear/modificar:**
-  - `backend/src/controllers/romsController.ts` — `listRoms()`, `getRomById()`, `linkGameToRom()`, `deleteRom()`
-  - `backend/src/routes/roms.ts` — `GET /api/roms`, `GET /api/roms/:id`, `PUT /api/roms/:id/game`, `DELETE /api/roms/:id`
-  - `backend/src/routes/metadata.ts` — `GET /api/metadata/search?q=query` (orquesta metadataService)
-- **Tests a escribir:**
-  - `backend/tests/routes/roms.spec.ts` — lista vacía/con ROMs, get by id, link game, delete
-  - `backend/tests/routes/metadata.spec.ts` — búsqueda con results, sin results, mixed sources
-- **Steps:**
-  1. Write tests (failing) — casos para CRUD + search
-  2. Implement romsController + routes
-  3. Run tests → pass
-  4. Lint + format
-
----
-
-### **Fase 8.2: Frontend Types + API client + Custom Hooks**
-
-- **Objetivo:** Tipos, cliente HTTP extendido, custom hooks con TanStack Query
-- **Archivos/Funciones a crear/modificar:**
-  - `frontend/src/types/rom.ts` — `RomFile`, `Artwork`, `EnrichedGame`
-  - `frontend/src/lib/api.ts` — extender con `api.roms.*` y `api.metadata.*` namespaces
-  - `frontend/src/hooks/useRoms.ts` — `useRoms()`, `useScanDirectory()`, `useEnrichMetadata()`, `useLinkGameToRom()`
-- **Tests a escribir:**
-  - Skipped por ahora (cubiertos en 8.3 con integration tests de páginas)
-- **Steps:**
-  1. Create ROM types (RomFile, Artwork templates from Prisma schema)
-  2. Extend api.ts with roms and metadata namespaces
-  3. Implement hooks with TanStack Query (useQuery for list, useMutation for actions)
-  4. Format
-
----
-
-### **Fase 8.3: Frontend Components + ROMs Page**
-
-- **Objetivo:** Componentes UI para ROMs y tabla interactiva
-- **Archivos/Funciones a crear/modificar:**
-  - `frontend/src/components/roms/ScanDialog.tsx` — input path + button submit, loading state
-  - `frontend/src/components/roms/MetadataSearchDialog.tsx` — search input + results list + select
-  - `frontend/src/components/roms/RomCard.tsx` — card display (simple card con info ROM)
-  - `frontend/src/routes/roms.tsx` — reescribir con tabla, botones (scan, link, delete), dialogs
-- **Tests a escribir:**
-  - `frontend/tests/routes/roms.spec.tsx` — tabla, botones, acciones, empty/loading states
-  - `frontend/tests/components/ScanDialog.spec.tsx` — input validation, submit
-  - `frontend/tests/components/MetadataSearchDialog.spec.tsx` — search results display
-- **Steps:**
-  1. Write tests (failing) para página y componentes
-  2. Crear componentes (ScanDialog, MetadataSearchDialog, RomCard, roms.tsx page)
-  3. Tests → pass
-  4. Format + lint
-
----
-
-### **Open Questions**
-
-1. ¿Agregar endpoint `GET /api/artwork/:gameId` (P1) o mantenerlo para Fase 9?
-   - **Respuesta:** Mantener para Fase 9 (artwork.ts). Fase 8 usa URLs directas de IGDB/RAWG.
-
-2. ¿Cachear artwork localmente o usar proxy directo desde IGDB/RAWG?
-   - **Respuesta:** URLs directas de APIs (simples para Fase 8). Caché en Fase 9.
-
-3. ¿Permitir batch scan (múltiples directorios) en Fase 8?
-   - **Respuesta:** No, un directorio por operación.
diff --git a/plans/gestor-coleccion-plan-phase-9-complete.md b/plans/gestor-coleccion-plan-phase-9-complete.md
deleted file mode 100644
index 8b02006..0000000
--- a/plans/gestor-coleccion-plan-phase-9-complete.md
+++ /dev/null
@@ -1,214 +0,0 @@
-# Phase 9 Complete: CI/CD, Tests E2E, Documentación y Seguridad
-
-**Fase 9** cierra el MVP con automación completa, documentación de seguridad, tests E2E, y asegura que el proyecto es reproducible y listo para deployment público.
-
-## Fases Completadas: 5 de 5
-
-✅ **9.1**: Variables de Entorno (.env.example templates)
-✅ **9.2**: Documentación de Seguridad (SECURITY.md, docs/API_KEYS.md)
-✅ **9.3**: Tests E2E con Playwright (15 tests multi-navegador)
-✅ **9.4**: Gitea Actions CI Workflow (.gitea/workflows/ci.yml)
-✅ **9.5**: README Actualizado y Verificación Final
-
-## Archivos Creados/Modificados
-
-### Configuración de Entorno
-
-- [.env.example](.env.example) — Variables globales template
-- [backend/.env.example](backend/.env.example) — Variables backend template
-- [frontend/.env.example](frontend/.env.example) — Variables frontend template
-
-### Documentación
-
-- [README.md](README.md) — Actualizado con setup mínimo y links a docs
-- [SECURITY.md](SECURITY.md) — Políticas de seguridad, vulnerabilidades, secrets
-- [docs/API_KEYS.md](docs/API_KEYS.md) — Guía paso-a-paso para IGDB, RAWG, TheGamesDB
-- [frontend/README.md](frontend/README.md) — Setup específico del frontend
-
-### CI/CD
-
-- [.gitea/workflows/ci.yml](.gitea/workflows/ci.yml) — Workflow Gitea Actions completo
-  - Job lint (ESLint)
-  - Job test-backend (Vitest + SQLite)
-  - Job test-frontend (Vitest)
-  - Job test-e2e (Playwright) - BLOQUEANTE
-
-### Tests
-
-- [tests/env-example.spec.ts](tests/env-example.spec.ts) — 13 tests validando .env.example files
-- [tests/documentation.spec.ts](tests/documentation.spec.ts) — 12 tests validando SECURITY.md y API_KEYS.md
-- [tests/gitea-workflow.spec.ts](tests/gitea-workflow.spec.ts) — 12 tests validando estructura del workflow
-- [tests/readme-validation.spec.ts](tests/readme-validation.spec.ts) — 12 tests validando README
-- [tests/e2e/full-flow.spec.ts](tests/e2e/full-flow.spec.ts) — 15 tests E2E (5 scenarios × 3 navegadores)
-
-## Tests Creados/Modificados
-
-### Tests de Fase 9 (49 tests nuevos)
-
-- ✅ 13 tests env-example (validar .env.example files)
-- ✅ 12 tests documentation (validar SECURITY.md y API_KEYS.md)
-- ✅ 12 tests gitea-workflow (validar .gitea/workflows/ci.yml)
-- ✅ 12 tests readme-validation (validar README.md structure)
-- ✅ 15 tests E2E (5 scenarios × 3 navegadores: chromium, firefox, webkit)
-
-### Total de Tests del Proyecto
-
-- Backend Unit Tests: 63+ ✅
-- Frontend Unit Tests: 59+ ✅
-- Configuration Tests: 49+ ✅ (nuevos en Fase 9)
-- E2E Tests: 15 ✅
-- **TOTAL: 186+ tests ✅**
-
-## Validación Final
-
-### ✅ Lint Status
-
-```
-0 errores nuevos
-12 warnings pre-existentes (no-console, no-var-requires)
-```
-
-### ✅ Tests Fase 9
-
-```
-✓ tests/env-example.spec.ts (13 tests)
-✓ tests/documentation.spec.ts (12 tests)
-✓ tests/gitea-workflow.spec.ts (12 tests)
-✓ tests/readme-validation.spec.ts (12 tests)
-✓ tests/e2e/full-flow.spec.ts (15 tests)
-```
-
-### ✅ Estructura del Proyecto
-
-```
-.env.example ✓
-.env.*.example ✓
-backend/.env.example ✓
-frontend/.env.example ✓
-.gitea/workflows/ci.yml ✓
-SECURITY.md ✓
-docs/API_KEYS.md ✓
-README.md (actualizado) ✓
-frontend/README.md ✓
-tests/e2e/ ✓
-```
-
-### ✅ Reproducibilidad End-to-End
-
-- Clone → ✓
-- Install (yarn install) → ✓
-- .env setup → ✓
-- Migrations → ✓
-- All tests pass → ✓
-- Build frontend → ✓
-
-## Git Commits Sugeridos
-
-### Commit 9.1
-
-```
-feat: add .env.example templates for development setup
-
-- Create .env.example with database and API key placeholders
-- Add backend/.env.example for backend development
-- Add frontend/.env.example for Vite frontend config
-- Add tests/env-example.spec.ts with 13 validation tests
-- Verify .gitignore correctly ignores .env files
-```
-
-### Commit 9.2
-
-```
-docs: add SECURITY.md and API_KEYS.md documentation
-
-- Create SECURITY.md with vulnerability reporting policy
-- Add environment variables & secrets best practices
-- Document input validation and rate limiting strategies
-- Create docs/API_KEYS.md with step-by-step API credential guides
-- Update README.md with security and API configuration sections
-- Add tests/documentation.spec.ts with 12 validation tests
-```
-
-### Commit 9.3
-
-```
-test: add E2E tests covering full user journeys
-
-- Create tests/e2e/full-flow.spec.ts with 5 E2E scenarios
-- Test home page navigation and layout
-- Test game creation via form
-- Test metadata search functionality
-- Test ROM-to-game linking workflow
-- Test complete user journey: create → search → link → view
-- Configure Playwright for multi-browser testing (chromium, firefox, webkit)
-```
-
-### Commit 9.4
-
-```
-ci: add Gitea Actions workflow for automated testing
-
-- Create .gitea/workflows/ci.yml with 4 sequential jobs
-- Add lint, test-backend, test-frontend, test-e2e jobs
-- Configure Gitea Secrets for IGDB, RAWG, TheGamesDB API keys
-- Add artifact upload for Playwright reports on failure
-- Update SECURITY.md with CI/CD Secrets setup instructions
-- Update docs/API_KEYS.md with production Gitea workflow guide
-- Add tests/gitea-workflow.spec.ts with 12 validation tests
-```
-
-### Commit 9.5
-
-```
-docs: update README and add frontend documentation
-
-- Rewrite README.md with minimal but complete structure
-- Add Features, Quick Start, Installation, Testing sections
-- Add Project Structure with folder tree
-- Add Configuration, Troubleshooting guides
-- Add links to SECURITY.md and docs/API_KEYS.md
-- Create frontend/README.md with React-specific setup
-- Add tests/readme-validation.spec.ts with 12 validation tests
-- Verify end-to-end reproducibility
-```
-
-## Review Status
-
-✅ **APPROVED** — Todas las fases de Fase 9 completadas
-
-## Next Steps
-
-1. **Commit todas las fases** (git commit y push)
-2. **Trigger Gitea Actions** (push a main or develop)
-3. **Verificar CI workflow** en Gitea UI
-4. **Setup API Secrets** en Gitea (repo settings)
-5. **Documentar deployment** en docs/ si es necesario
-
-## Recomendaciones para Siguiente Fase (v1.1.0)
-
-Si hay Fase 10+, considerar:
-
-- [ ] OAuth Twitch integration (IGDB)
-- [ ] Game screenshots/gallery view
-- [ ] More metadata APIs (MobyGames, HLTB)
-- [ ] Platform/genre filtering
-- [ ] Favorites/ratings system
-- [ ] Backup/restore functionality
-- [ ] Docker deployment guide
-
----
-
-## MVP v1.0.0 Status: 🚀 LISTO
-
-**Quasar es un proyecto MVP completo, documentado, testeado y listo para deployment público en Gitea.**
-
-- ✅ 186+ tests pasando
-- ✅ Documentación completa
-- ✅ CI/CD automatizado
-- ✅ E2E tests validando flujos reales
-- ✅ Seguridad documentada
-- ✅ Reproducible desde cero
-
-**Date**: 2026-02-12
-**Version**: v1.0.0
-**Status**: Production Ready (MVP) 🎮
diff --git a/plans/gestor-coleccion-plan.md b/plans/gestor-coleccion-plan.md
deleted file mode 100644
index badb454..0000000
--- a/plans/gestor-coleccion-plan.md
+++ /dev/null
@@ -1,237 +0,0 @@
-## Plan: Gestor de biblioteca de videojuegos y ROMs (Quasar)
-
-Aplicación web self-hosted para gestionar una biblioteca de ROMs y videojuegos físicos/digitales. Permite escanear directorios de ROMs, enriquecer metadatos vía APIs públicas (IGDB, RAWG, TheGamesDB), y registrar manualmente juegos físicos/digitales con precio, condición y notas. Stack: TypeScript + React + Vite + shadcn/ui (frontend), Node.js + Fastify + TypeScript + Prisma + SQLite (backend).
-
-**Fases: 9**
-
----
-
-### **Fase 1: Análisis comparativo de proyectos y servicios**
-
-- **Objetivo:** Documentar todos los proyectos, herramientas y APIs analizados durante la investigación inicial, describiendo qué hace cada uno, sus características principales, licencias, y lecciones aprendidas para aplicar a Quasar.
-- **Archivos/Funciones a crear/modificar:**
-  - `docs/competitive-analysis.md` — análisis detallado de proyectos (Playnite, LaunchBox, OpenEmu, EmulationStation, RetroArch, ROMVault, etc.)
-  - `docs/apis-comparison.md` — comparativa de APIs (IGDB, RAWG, TheGamesDB, Screenscraper, MobyGames, PriceCharting, ITAD, eBay)
-  - `docs/lessons-learned.md` — patrones y mejores prácticas extraídas del análisis
-- **Pasos:**
-  1. Crear documentos con información estructurada de la investigación inicial
-  2. Incluir tablas comparativas, enlaces, y conclusiones
-  3. Documentar patrones útiles y mejores prácticas aplicables a Quasar
-
----
-
-### **Fase 2: Requisitos y diseño técnico**
-
-- **Objetivo:** Definir arquitectura (monorepo o separado), estructura de carpetas, stack definitivo (Fastify + Prisma, SQLite), APIs a integrar (IGDB, RAWG, TheGamesDB), y documento de modelo de datos inicial.
-- **Archivos/Funciones a crear/modificar:**
-  - `docs/requirements.md` — requisitos funcionales y no funcionales
-  - `docs/architecture.md` — decisiones arquitectónicas (monorepo vs multi-repo, API REST structure)
-  - `docs/api-integration.md` — descripción de APIs públicas a usar, endpoints, rate limits, autenticación
-  - `docs/data-model.md` — entidades (Game, RomFile, Platform, Purchase, Artwork)
-- **Pasos:**
-  1. Crear documentos `docs/requirements.md`, `docs/architecture.md`, `docs/api-integration.md`, `docs/data-model.md` con contenido inicial
-  2. Definir estructura de carpetas y convenciones de código
-  3. Documentar decisiones técnicas y justificaciones
-
----
-
-### **Fase 3: Backend base y modelo de datos**
-
-- **Objetivo:** Configurar backend (Fastify + TypeScript + Prisma + SQLite), definir schema de BD (Game, RomFile, Platform, Purchase, Artwork), migraciones y seeders básicos.
-- **Archivos/Funciones a crear/modificar:**
-  - `backend/package.json` — dependencias (fastify, prisma, @fastify/cors, dotenv, etc.)
-  - `backend/tsconfig.json` — configuración TypeScript backend
-  - `backend/src/index.ts` — servidor Fastify inicial
-  - `backend/prisma/schema.prisma` — modelos (Game, RomFile, Platform, Purchase, Artwork)
-  - `backend/prisma/migrations/` — migraciones Prisma
-  - `backend/src/routes/healthcheck.ts` — endpoint `/api/health`
-- **Tests a escribir:**
-  - `backend/tests/server.spec.ts` — test del servidor (inicia y responde en `/api/health`)
-  - `backend/tests/models/game.spec.ts` — validaciones del modelo Game (TDD)
-  - `backend/tests/models/romFile.spec.ts` — validaciones del modelo RomFile
-- **Pasos:**
-  1. Escribir tests que fallen (healthcheck endpoint, crear modelo Game y validar)
-  2. Configurar Fastify + Prisma, definir schema, ejecutar migración
-  3. Implementar endpoint `/api/health`
-  4. Ejecutar tests y verificar que pasan
-
----
-
-### **Fase 4: Importadores y gestión de ROMs**
-
-- **Objetivo:** Implementar servicio para escanear directorios locales, calcular checksums (CRC32/MD5/SHA1), detectar formatos (ZIP/7z/CHD), y almacenar en BD. Incluir soporte básico para DAT verification (No-Intro/Redump).
-- **Archivos/Funciones a crear/modificar:**
-  - `backend/src/services/fsScanner.ts` — función `scanDirectory(path: string)`
-  - `backend/src/services/checksumService.ts` — funciones `calculateCRC32()`, `calculateMD5()`, `calculateSHA1()`
-  - `backend/src/services/datVerifier.ts` — función `verifyAgainstDAT(romFiles, datPath)`
-  - `backend/src/routes/import.ts` — endpoint `POST /api/import/scan` (body: {path})
-  - `backend/src/utils/archiveReader.ts` — leer contenido de ZIP/7z/CHD
-- **Tests a escribir:**
-  - `backend/tests/services/fsScanner.spec.ts` — casos: carpeta vacía, carpeta con ROMs, carpeta con subdirectorios
-  - `backend/tests/services/checksumService.spec.ts` — calcular checksum de archivo fixture
-  - `backend/tests/services/datVerifier.spec.ts` — verificar ROM válido/inválido contra DAT fixture
-  - `backend/tests/routes/import.spec.ts` — test E2E de endpoint `/api/import/scan`
-- **Pasos:**
-  1. Crear fixtures (ROMs de prueba, DAT de prueba)
-  2. Escribir tests que fallen (escaneo de carpeta, checksum, DAT verification)
-  3. Implementar `fsScanner`, `checksumService`, `datVerifier` mínimos
-  4. Implementar endpoint `/api/import/scan`
-  5. Ejecutar tests y verificar que pasan
-
----
-
-### **Fase 5: Integración con APIs de metadata**
-
-- **Objetivo:** Clientes para IGDB (OAuth Twitch), RAWG (API key), TheGamesDB (API key); lógica de matching heurística (nombre + plataforma), caché local de respuestas para evitar rate limits.
-- **Archivos/Funciones a crear/modificar:**
-  - `backend/src/services/igdbClient.ts` — `searchGames(query, platform?)`, `getGameById(id)`
-  - `backend/src/services/rawgClient.ts` — `searchGames(query)`, `getGameById(id)`
-  - `backend/src/services/thegamesdbClient.ts` — `searchGames(query)`, `getGameById(id)`
-  - `backend/src/services/metadataService.ts` — `enrichGame(romFile)` (orquesta clientes, fallbacks, matching heurística)
-  - `backend/src/utils/cache.ts` — caché en memoria o Redis (simple LRU)
-  - `backend/src/routes/metadata.ts` — endpoints `GET /api/metadata/search?q=...&platform=...`, `POST /api/metadata/enrich/:romFileId`
-- **Tests a escribir:**
-  - `backend/tests/services/igdbClient.spec.ts` — mock de respuestas IGDB, test de OAuth flow, test de búsqueda
-  - `backend/tests/services/rawgClient.spec.ts` — mock de respuestas RAWG
-  - `backend/tests/services/metadataService.spec.ts` — casos: match exacto, match parcial, sin match (fallback)
-  - `backend/tests/routes/metadata.spec.ts` — test E2E de endpoints metadata
-- **Pasos:**
-  1. Escribir tests con mocks (respuestas API simuladas)
-  2. Implementar clientes (IGDB OAuth, RAWG key, TheGamesDB key) con retry y timeout
-  3. Implementar `metadataService` con lógica de matching y fallbacks
-  4. Implementar endpoints REST
-  5. Ejecutar tests y verificar que pasan
-
----
-
-### **Fase 6: Frontend base (React + Vite + shadcn/ui)**
-
-- **Objetivo:** Configurar proyecto frontend con Vite, React, TypeScript, Tailwind CSS, shadcn/ui, TanStack Query, TanStack Router. Implementar layout base (navbar, sidebar), rutas (Home, ROMs, Games, Settings) y componentes UI básicos (Button, Card, Table, Dialog de shadcn/ui).
-- **Archivos/Funciones a crear/modificar:**
-  - `frontend/package.json` — dependencias (react, vite, @shadcn/ui, tailwindcss, @tanstack/react-router, @tanstack/react-query)
-  - `frontend/tsconfig.json` — configuración TypeScript frontend
-  - `frontend/vite.config.ts` — configuración Vite (proxy a backend, aliases, TanStack Router plugin)
-  - `frontend/tailwind.config.js` — configuración Tailwind para shadcn/ui
-  - `frontend/src/main.tsx` — entry point con QueryClientProvider y RouterProvider
-  - `frontend/src/routes/__root.tsx` — layout raíz con navbar y sidebar
-  - `frontend/src/routes/index.tsx` — ruta Home
-  - `frontend/src/routes/roms.tsx` — ruta ROMs
-  - `frontend/src/routes/games.tsx` — ruta Games
-  - `frontend/src/components/layout/Navbar.tsx`
-  - `frontend/src/components/layout/Sidebar.tsx`
-  - `frontend/src/lib/api.ts` — cliente HTTP base (fetch/axios wrapper)
-  - `frontend/src/lib/queryClient.ts` — configuración de TanStack Query
-  - `frontend/src/hooks/useGames.ts` — custom hook con TanStack Query para juegos
-- **Tests a escribir:**
-  - `frontend/tests/App.spec.tsx` — renderizado de rutas (usando Vitest + React Testing Library)
-  - `frontend/tests/components/Navbar.spec.tsx` — navegación básica
-  - `tests/e2e/navigation.spec.ts` — E2E con Playwright (navegar entre páginas)
-- **Pasos:**
-  1. Escribir tests que fallen (renderizado de App, navegación E2E)
-  2. Configurar Vite + React + TypeScript + Tailwind + shadcn/ui + TanStack Query
-  3. Implementar layout, rutas, páginas vacías, configuración de QueryClient
-  4. Ejecutar tests y verificar que pasan
-
----
-
-### **Fase 7: Gestión manual de juegos (frontend + backend)**
-
-- **Objetivo:** CRUD completo para juegos: crear/editar/eliminar juegos manualmente (frontend form con shadcn/ui + TanStack Query), registrar juegos físicos/digitales con campos: nombre, plataforma, precio, condición (Loose/CIB/New), fecha de compra, vendedor, notas.
-- **Archivos/Funciones a crear/modificar:**
-  - `backend/src/routes/games.ts` — `GET /api/games`, `POST /api/games`, `PUT /api/games/:id`, `DELETE /api/games/:id`
-  - `backend/src/controllers/gamesController.ts` — lógica de CRUD
-  - `backend/src/validators/gameValidator.ts` — validación de input (Zod/Joi)
-  - `frontend/src/routes/games.tsx` — tabla de juegos con acciones (editar, eliminar)
-  - `frontend/src/components/games/GameForm.tsx` — formulario para crear/editar juego
-  - `frontend/src/components/games/GameCard.tsx` — card de vista de juego
-  - `frontend/src/hooks/useGames.ts` — custom hooks con TanStack Query (useGames, useCreateGame, useUpdateGame, useDeleteGame)
-  - `frontend/src/components/ui/*` — shadcn/ui components (Form, Input, Select, Textarea, DatePicker)
-- **Tests a escribir:**
-  - `backend/tests/routes/games.spec.ts` — CRUD endpoints (casos: crear juego válido, crear juego con datos faltantes, actualizar, eliminar)
-  - `frontend/tests/routes/games.spec.tsx` — renderizado de lista, acciones
-  - `frontend/tests/components/GameForm.spec.tsx` — validación de formulario
-  - `tests/e2e/games-crud.spec.ts` — E2E completo (crear/editar/eliminar juego)
-- **Pasos:**
-  1. Escribir tests que fallen (endpoints CRUD, renderizado de form, E2E CRUD)
-  2. Implementar backend endpoints y validators
-  3. Implementar frontend page, form, custom hooks con TanStack Query
-  4. Ejecutar tests y verificar que pasan
-
----
-
-### **Fase 8: Integración ROMs + Metadata (UI completa)**
-
-- **Objetivo:** Vista de ROMs escaneados en frontend, botón para scan de directorio, búsqueda/asociación de metadata (UI para seleccionar resultado de IGDB/RAWG con TanStack Query), y vincular ROM con juego. Incluir vista de artwork (covers, screenshots).
-- **Archivos/Funciones a crear/modificar:**
-  - `frontend/src/routes/roms.tsx` — tabla de ROMs escaneados, botón "Scan Directory", acciones (asociar metadata, ver detalles)
-  - `frontend/src/components/roms/ScanDialog.tsx` — dialog para input de path y scan
-  - `frontend/src/components/roms/MetadataSearchDialog.tsx` — búsqueda y selección de metadata
-  - `frontend/src/components/roms/RomCard.tsx` — card con info de ROM + artwork
-  - `frontend/src/hooks/useRoms.ts` — custom hooks con TanStack Query (useRoms, useScanDirectory, useEnrichMetadata)
-  - `backend/src/routes/artwork.ts` — `GET /api/artwork/:gameId` (proxy/cache de imágenes)
-- **Tests a escribir:**
-  - `frontend/tests/routes/roms.spec.tsx` — renderizado de tabla, acciones
-  - `frontend/tests/components/ScanDialog.spec.tsx` — submit de path, loading state
-  - `tests/e2e/roms-import.spec.ts` — E2E: scan → ver ROMs → asociar metadata → ver juego enriquecido
-- **Pasos:**
-  1. Escribir tests que fallen (UI de ROMs, scan dialog, E2E import completo)
-  2. Implementar componentes frontend y custom hooks con TanStack Query
-  3. Implementar endpoint de artwork (cache/proxy)
-  4. Ejecutar tests y verificar que pasan
-
----
-
-### **Fase 9: CI, tests E2E, docs y seguridad**
-
-- **Objetivo:** GitHub Actions para CI (lint, tests unitarios, tests E2E con Playwright), configuración de ESLint/Prettier, docs de uso de APIs (cómo obtener keys), seguridad (env vars, .gitignore actualizado, SECURITY.md), y README completo.
-- **Archivos/Funciones a crear/modificar:**
-  - `.github/workflows/ci.yml` — pipeline (install, lint, test, e2e)
-  - `.eslintrc.cjs` — ajustar para backend + frontend
-  - `.prettierrc` — ajustar formatos
-  - `README.md` — actualizar con: setup, features, screenshots, roadmap
-  - `SECURITY.md` — políticas de seguridad, reporte de vulnerabilidades
-  - `docs/API_KEYS.md` — instrucciones para obtener keys de IGDB, RAWG, TheGamesDB
-  - `.env.example` — template de variables de entorno
-  - `backend/.env.example`, `frontend/.env.example` — templates específicos
-- **Tests a escribir:**
-  - `tests/e2e/full-flow.spec.ts` — E2E completo end-to-end (scan → enrich → crear juego manual → view)
-  - Asegurar que CI ejecuta todos los tests y Playwright genera reporte
-- **Pasos:**
-  1. Configurar GitHub Actions workflow
-  2. Ejecutar pipeline en CI (puede fallar inicialmente)
-  3. Corregir issues de lint/format/tests
-  4. Actualizar docs (README, SECURITY, API_KEYS)
-  5. Ejecutar CI nuevamente y verificar que todo pasa
-
----
-
-## **Preguntas abiertas resueltas** ✅
-
-1. ✅ App web self-hosted (server + frontend separados)
-2. ✅ Frontend: TypeScript + React + Vite + shadcn/ui + TanStack Query + TanStack Router
-3. ✅ Solo APIs públicas: IGDB (OAuth Twitch gratuito), RAWG (API key gratuita con atribución), TheGamesDB (API key gratuita)
-4. ✅ Sin integración con tiendas (Steam/GOG/PSN) en MVP; dejar preparado para futuro (campo `storeId`, `storePlatform` en modelo Game)
-5. ✅ Prioridad: gestión de ROMs de directorio + creación manual de juegos físicos/digitales
-
----
-
-## **Decisiones técnicas clave** 🔧
-
-- **Monorepo:** `/backend` y `/frontend` en el mismo repo, con workspaces de Yarn
-- **Backend:** Node.js + Fastify + TypeScript + Prisma + SQLite (migration a PostgreSQL posible en futuro)
-- **Frontend:** React + Vite + TypeScript + Tailwind CSS + shadcn/ui + TanStack Query + TanStack Router
-- **APIs de metadata:** IGDB (primary), RAWG (fallback), TheGamesDB (artwork/retro)
-- **Tests:** Backend (Vitest + Supertest), Frontend (Vitest + React Testing Library), E2E (Playwright)
-- **CI:** GitHub Actions con pipeline: install → lint → test → e2e
-- **Seguridad:** API keys en `.env`, no commitear secrets
-
----
-
-## **Roadmap futuro (fuera del MVP)** 🚀
-
-- Integración con tiendas (Steam/GOG/PSN/Xbox) para import automático de compras
-- Price tracking con PriceCharting/IsThereAnyDeal (requiere suscripción/API paga)
-- Plugins/extensiones (LaunchBox export, Playnite sync)
-- Sincronización en nube (opcional, con cifrado E2E)
-- Soporte para multiple usuarios (autenticación/autorización)
-- Mobile app (React Native o PWA)
diff --git a/yarn.lock b/yarn.lock
index 970090a..5f4f70c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -11,13 +11,6 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@adobe/css-tools@npm:^4.4.0":
-  version: 4.4.4
-  resolution: "@adobe/css-tools@npm:4.4.4"
-  checksum: 10c0/8f3e6cfaa5e6286e6f05de01d91d060425be2ebaef490881f5fe6da8bbdb336835c5d373ea337b0c3b0a1af4be048ba18780f0f6021d30809b4545922a7e13d9
-  languageName: node
-  linkType: hard
-
 "@alloc/quick-lru@npm:^5.2.0":
   version: 5.2.0
   resolution: "@alloc/quick-lru@npm:5.2.0"
@@ -25,7 +18,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/code-frame@npm:^7.10.4, @babel/code-frame@npm:^7.28.6, @babel/code-frame@npm:^7.29.0":
+"@babel/code-frame@npm:^7.28.6, @babel/code-frame@npm:^7.29.0":
   version: 7.29.0
   resolution: "@babel/code-frame@npm:7.29.0"
   dependencies:
@@ -43,7 +36,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/core@npm:^7.28.0":
+"@babel/core@npm:^7.24.4, @babel/core@npm:^7.29.0":
   version: 7.29.0
   resolution: "@babel/core@npm:7.29.0"
   dependencies:
@@ -160,7 +153,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.20.7, @babel/parser@npm:^7.28.6, @babel/parser@npm:^7.29.0":
+"@babel/parser@npm:^7.1.0, @babel/parser@npm:^7.20.7, @babel/parser@npm:^7.24.4, @babel/parser@npm:^7.28.6, @babel/parser@npm:^7.29.0":
   version: 7.29.0
   resolution: "@babel/parser@npm:7.29.0"
   dependencies:
@@ -193,13 +186,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@babel/runtime@npm:^7.12.5":
-  version: 7.28.6
-  resolution: "@babel/runtime@npm:7.28.6"
-  checksum: 10c0/358cf2429992ac1c466df1a21c1601d595c46930a13c1d4662fde908d44ee78ec3c183aaff513ecb01ef8c55c3624afe0309eeeb34715672dbfadb7feedb2c0d
-  languageName: node
-  linkType: hard
-
 "@babel/template@npm:^7.28.6":
   version: 7.28.6
   resolution: "@babel/template@npm:7.28.6"
@@ -245,6 +231,34 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@emnapi/core@npm:^1.7.1, @emnapi/core@npm:^1.8.1":
+  version: 1.8.1
+  resolution: "@emnapi/core@npm:1.8.1"
+  dependencies:
+    "@emnapi/wasi-threads": "npm:1.1.0"
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/2c242f4b49779bac403e1cbcc98edacdb1c8ad36562408ba9a20663824669e930bc8493be46a2522d9dc946b8d96cd7073970bae914928c7671b5221c85b432e
+  languageName: node
+  linkType: hard
+
+"@emnapi/runtime@npm:^1.7.1, @emnapi/runtime@npm:^1.8.1":
+  version: 1.8.1
+  resolution: "@emnapi/runtime@npm:1.8.1"
+  dependencies:
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/f4929d75e37aafb24da77d2f58816761fe3f826aad2e37fa6d4421dac9060cbd5098eea1ac3c9ecc4526b89deb58153852fa432f87021dc57863f2ff726d713f
+  languageName: node
+  linkType: hard
+
+"@emnapi/wasi-threads@npm:1.1.0, @emnapi/wasi-threads@npm:^1.1.0":
+  version: 1.1.0
+  resolution: "@emnapi/wasi-threads@npm:1.1.0"
+  dependencies:
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/e6d54bf2b1e64cdd83d2916411e44e579b6ae35d5def0dea61a3c452d9921373044dff32a8b8473ae60c80692bdc39323e98b96a3f3d87ba6886b24dd0ef7ca1
+  languageName: node
+  linkType: hard
+
 "@esbuild/aix-ppc64@npm:0.21.5":
   version: 0.21.5
   resolution: "@esbuild/aix-ppc64@npm:0.21.5"
@@ -252,6 +266,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/aix-ppc64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/aix-ppc64@npm:0.27.3"
+  conditions: os=aix & cpu=ppc64
+  languageName: node
+  linkType: hard
+
 "@esbuild/android-arm64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/android-arm64@npm:0.18.20"
@@ -266,6 +287,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/android-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/android-arm64@npm:0.27.3"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/android-arm@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/android-arm@npm:0.18.20"
@@ -280,6 +308,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/android-arm@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/android-arm@npm:0.27.3"
+  conditions: os=android & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@esbuild/android-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/android-x64@npm:0.18.20"
@@ -294,6 +329,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/android-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/android-x64@npm:0.27.3"
+  conditions: os=android & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/darwin-arm64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/darwin-arm64@npm:0.18.20"
@@ -308,6 +350,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/darwin-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/darwin-arm64@npm:0.27.3"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/darwin-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/darwin-x64@npm:0.18.20"
@@ -322,6 +371,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/darwin-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/darwin-x64@npm:0.27.3"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/freebsd-arm64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/freebsd-arm64@npm:0.18.20"
@@ -336,6 +392,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/freebsd-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/freebsd-arm64@npm:0.27.3"
+  conditions: os=freebsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/freebsd-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/freebsd-x64@npm:0.18.20"
@@ -350,6 +413,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/freebsd-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/freebsd-x64@npm:0.27.3"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-arm64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-arm64@npm:0.18.20"
@@ -364,6 +434,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-arm64@npm:0.27.3"
+  conditions: os=linux & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-arm@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-arm@npm:0.18.20"
@@ -378,6 +455,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-arm@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-arm@npm:0.27.3"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-ia32@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-ia32@npm:0.18.20"
@@ -392,6 +476,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-ia32@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-ia32@npm:0.27.3"
+  conditions: os=linux & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-loong64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-loong64@npm:0.18.20"
@@ -406,6 +497,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-loong64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-loong64@npm:0.27.3"
+  conditions: os=linux & cpu=loong64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-mips64el@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-mips64el@npm:0.18.20"
@@ -420,6 +518,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-mips64el@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-mips64el@npm:0.27.3"
+  conditions: os=linux & cpu=mips64el
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-ppc64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-ppc64@npm:0.18.20"
@@ -434,6 +539,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-ppc64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-ppc64@npm:0.27.3"
+  conditions: os=linux & cpu=ppc64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-riscv64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-riscv64@npm:0.18.20"
@@ -448,6 +560,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-riscv64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-riscv64@npm:0.27.3"
+  conditions: os=linux & cpu=riscv64
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-s390x@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-s390x@npm:0.18.20"
@@ -462,6 +581,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-s390x@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-s390x@npm:0.27.3"
+  conditions: os=linux & cpu=s390x
+  languageName: node
+  linkType: hard
+
 "@esbuild/linux-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/linux-x64@npm:0.18.20"
@@ -476,6 +602,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/linux-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/linux-x64@npm:0.27.3"
+  conditions: os=linux & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/netbsd-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/netbsd-arm64@npm:0.27.3"
+  conditions: os=netbsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/netbsd-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/netbsd-x64@npm:0.18.20"
@@ -490,6 +630,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/netbsd-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/netbsd-x64@npm:0.27.3"
+  conditions: os=netbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/openbsd-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/openbsd-arm64@npm:0.27.3"
+  conditions: os=openbsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/openbsd-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/openbsd-x64@npm:0.18.20"
@@ -504,6 +658,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/openbsd-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/openbsd-x64@npm:0.27.3"
+  conditions: os=openbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@esbuild/openharmony-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/openharmony-arm64@npm:0.27.3"
+  conditions: os=openharmony & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/sunos-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/sunos-x64@npm:0.18.20"
@@ -518,6 +686,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/sunos-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/sunos-x64@npm:0.27.3"
+  conditions: os=sunos & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@esbuild/win32-arm64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/win32-arm64@npm:0.18.20"
@@ -532,6 +707,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/win32-arm64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/win32-arm64@npm:0.27.3"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@esbuild/win32-ia32@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/win32-ia32@npm:0.18.20"
@@ -546,6 +728,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/win32-ia32@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/win32-ia32@npm:0.27.3"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@esbuild/win32-x64@npm:0.18.20":
   version: 0.18.20
   resolution: "@esbuild/win32-x64@npm:0.18.20"
@@ -560,6 +749,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@esbuild/win32-x64@npm:0.27.3":
+  version: 0.27.3
+  resolution: "@esbuild/win32-x64@npm:0.27.3"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@eslint-community/eslint-utils@npm:^4.2.0, @eslint-community/eslint-utils@npm:^4.8.0, @eslint-community/eslint-utils@npm:^4.9.1":
   version: 4.9.1
   resolution: "@eslint-community/eslint-utils@npm:4.9.1"
@@ -571,13 +767,24 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@eslint-community/regexpp@npm:^4.12.2, @eslint-community/regexpp@npm:^4.6.1":
+"@eslint-community/regexpp@npm:^4.12.1, @eslint-community/regexpp@npm:^4.12.2, @eslint-community/regexpp@npm:^4.6.1":
   version: 4.12.2
   resolution: "@eslint-community/regexpp@npm:4.12.2"
   checksum: 10c0/fddcbc66851b308478d04e302a4d771d6917a0b3740dc351513c0da9ca2eab8a1adf99f5e0aa7ab8b13fa0df005c81adeee7e63a92f3effd7d367a163b721c2d
   languageName: node
   linkType: hard
 
+"@eslint/config-array@npm:^0.21.1":
+  version: 0.21.1
+  resolution: "@eslint/config-array@npm:0.21.1"
+  dependencies:
+    "@eslint/object-schema": "npm:^2.1.7"
+    debug: "npm:^4.3.1"
+    minimatch: "npm:^3.1.2"
+  checksum: 10c0/2f657d4edd6ddcb920579b72e7a5b127865d4c3fb4dda24f11d5c4f445a93ca481aebdbd6bf3291c536f5d034458dbcbb298ee3b698bc6c9dd02900fe87eec3c
+  languageName: node
+  linkType: hard
+
 "@eslint/config-array@npm:^0.23.0":
   version: 0.23.1
   resolution: "@eslint/config-array@npm:0.23.1"
@@ -589,6 +796,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@eslint/config-helpers@npm:^0.4.2":
+  version: 0.4.2
+  resolution: "@eslint/config-helpers@npm:0.4.2"
+  dependencies:
+    "@eslint/core": "npm:^0.17.0"
+  checksum: 10c0/92efd7a527b2d17eb1a148409d71d80f9ac160b565ac73ee092252e8bf08ecd08670699f46b306b94f13d22e88ac88a612120e7847570dd7cdc72f234d50dcb4
+  languageName: node
+  linkType: hard
+
 "@eslint/config-helpers@npm:^0.5.2":
   version: 0.5.2
   resolution: "@eslint/config-helpers@npm:0.5.2"
@@ -598,6 +814,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@eslint/core@npm:^0.17.0":
+  version: 0.17.0
+  resolution: "@eslint/core@npm:0.17.0"
+  dependencies:
+    "@types/json-schema": "npm:^7.0.15"
+  checksum: 10c0/9a580f2246633bc752298e7440dd942ec421860d1946d0801f0423830e67887e4aeba10ab9a23d281727a978eb93d053d1922a587d502942a713607f40ed704e
+  languageName: node
+  linkType: hard
+
 "@eslint/core@npm:^1.1.0":
   version: 1.1.0
   resolution: "@eslint/core@npm:1.1.0"
@@ -624,7 +849,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@eslint/eslintrc@npm:^3.3.3":
+"@eslint/eslintrc@npm:^3.3.1, @eslint/eslintrc@npm:^3.3.3":
   version: 3.3.3
   resolution: "@eslint/eslintrc@npm:3.3.3"
   dependencies:
@@ -648,6 +873,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@eslint/js@npm:9.39.3, @eslint/js@npm:^9.39.1":
+  version: 9.39.3
+  resolution: "@eslint/js@npm:9.39.3"
+  checksum: 10c0/df1c70d6681c8daf4a3c86dfac159fcd98a73c4620c4fbe2be6caab1f30a34c7de0ad88ab0e81162376d2cde1a2eed1c32eff5f917ca369870930a51f8e818f1
+  languageName: node
+  linkType: hard
+
+"@eslint/object-schema@npm:^2.1.7":
+  version: 2.1.7
+  resolution: "@eslint/object-schema@npm:2.1.7"
+  checksum: 10c0/936b6e499853d1335803f556d526c86f5fe2259ed241bc665000e1d6353828edd913feed43120d150adb75570cae162cf000b5b0dfc9596726761c36b82f4e87
+  languageName: node
+  linkType: hard
+
 "@eslint/object-schema@npm:^3.0.1":
   version: 3.0.1
   resolution: "@eslint/object-schema@npm:3.0.1"
@@ -655,6 +894,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@eslint/plugin-kit@npm:^0.4.1":
+  version: 0.4.1
+  resolution: "@eslint/plugin-kit@npm:0.4.1"
+  dependencies:
+    "@eslint/core": "npm:^0.17.0"
+    levn: "npm:^0.4.1"
+  checksum: 10c0/51600f78b798f172a9915dffb295e2ffb44840d583427bc732baf12ecb963eb841b253300e657da91d890f4b323d10a1bd12934bf293e3018d8bb66fdce5217b
+  languageName: node
+  linkType: hard
+
 "@eslint/plugin-kit@npm:^0.6.0":
   version: 0.6.0
   resolution: "@eslint/plugin-kit@npm:0.6.0"
@@ -773,12 +1022,41 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@hookform/resolvers@npm:^3.3.0":
-  version: 3.10.0
-  resolution: "@hookform/resolvers@npm:3.10.0"
+"@floating-ui/core@npm:^1.7.4":
+  version: 1.7.4
+  resolution: "@floating-ui/core@npm:1.7.4"
+  dependencies:
+    "@floating-ui/utils": "npm:^0.2.10"
+  checksum: 10c0/b1175d92c0edbd0053c4ba014ad1f798ccc107de87a43a099e97af6265610cc25ef600f2b15d3763d39a79f7d36db11fcb84d0c28027beb3317e13a7ba197516
+  languageName: node
+  linkType: hard
+
+"@floating-ui/dom@npm:^1.7.5":
+  version: 1.7.5
+  resolution: "@floating-ui/dom@npm:1.7.5"
+  dependencies:
+    "@floating-ui/core": "npm:^1.7.4"
+    "@floating-ui/utils": "npm:^0.2.10"
+  checksum: 10c0/94bd262127fbf1177e542f4908cb07c17392782b1ca0ab9f2dfd7e102cabcc77b4de807847304dcb4c864d4b48e8ba292b27cdcfaca3ad4e3525ab397b766a3a
+  languageName: node
+  linkType: hard
+
+"@floating-ui/react-dom@npm:^2.0.0":
+  version: 2.1.7
+  resolution: "@floating-ui/react-dom@npm:2.1.7"
+  dependencies:
+    "@floating-ui/dom": "npm:^1.7.5"
   peerDependencies:
-    react-hook-form: ^7.0.0
-  checksum: 10c0/7ee44533b4cdc28c4fa2a94894c735411e5a1f830f4a617c580533321a9b901df0cc8c1e2fad81ad8d55154ebc5cb844cf9c116a3148ffae2bc48758c33cbb8e
+    react: ">=16.8.0"
+    react-dom: ">=16.8.0"
+  checksum: 10c0/3ef4a53ac93d2757e7995ce0313b3c14c5c5c66f2cb893256cc70c74713ff1c192f88a1bde02e2f50e951a7a3d8513b14611a4dbcc2d313def1f7003f7296dba
+  languageName: node
+  linkType: hard
+
+"@floating-ui/utils@npm:^0.2.10":
+  version: 0.2.10
+  resolution: "@floating-ui/utils@npm:0.2.10"
+  checksum: 10c0/e9bc2a1730ede1ee25843937e911ab6e846a733a4488623cd353f94721b05ec2c9ec6437613a2ac9379a94c2fd40c797a2ba6fa1df2716f5ce4aa6ddb1cf9ea4
   languageName: node
   linkType: hard
 
@@ -865,7 +1143,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@jridgewell/gen-mapping@npm:^0.3.12, @jridgewell/gen-mapping@npm:^0.3.2, @jridgewell/gen-mapping@npm:^0.3.5":
+"@jridgewell/gen-mapping@npm:^0.3.12, @jridgewell/gen-mapping@npm:^0.3.5":
   version: 0.3.13
   resolution: "@jridgewell/gen-mapping@npm:0.3.13"
   dependencies:
@@ -926,6 +1204,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@napi-rs/wasm-runtime@npm:^1.1.1":
+  version: 1.1.1
+  resolution: "@napi-rs/wasm-runtime@npm:1.1.1"
+  dependencies:
+    "@emnapi/core": "npm:^1.7.1"
+    "@emnapi/runtime": "npm:^1.7.1"
+    "@tybys/wasm-util": "npm:^0.10.1"
+  checksum: 10c0/04d57b67e80736e41fe44674a011878db0a8ad893f4d44abb9d3608debb7c174224cba2796ed5b0c1d367368159f3ca6be45f1c59222f70e32ddc880f803d447
+  languageName: node
+  linkType: hard
+
 "@nodelib/fs.scandir@npm:2.1.5":
   version: 2.1.5
   resolution: "@nodelib/fs.scandir@npm:2.1.5"
@@ -936,14 +1225,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@nodelib/fs.stat@npm:2.0.5, @nodelib/fs.stat@npm:^2.0.2":
+"@nodelib/fs.stat@npm:2.0.5":
   version: 2.0.5
   resolution: "@nodelib/fs.stat@npm:2.0.5"
   checksum: 10c0/88dafe5e3e29a388b07264680dc996c17f4bda48d163a9d4f5c1112979f0ce8ec72aa7116122c350b4e7976bc5566dc3ddb579be1ceaacc727872eb4ed93926d
   languageName: node
   linkType: hard
 
-"@nodelib/fs.walk@npm:^1.2.3, @nodelib/fs.walk@npm:^1.2.8":
+"@nodelib/fs.walk@npm:^1.2.8":
   version: 1.2.8
   resolution: "@nodelib/fs.walk@npm:1.2.8"
   dependencies:
@@ -1073,10 +1362,740 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@rolldown/pluginutils@npm:1.0.0-beta.27":
-  version: 1.0.0-beta.27
-  resolution: "@rolldown/pluginutils@npm:1.0.0-beta.27"
-  checksum: 10c0/9658f235b345201d4f6bfb1f32da9754ca164f892d1cb68154fe5f53c1df42bd675ecd409836dff46884a7847d6c00bdc38af870f7c81e05bba5c2645eb4ab9c
+"@radix-ui/number@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/number@npm:1.1.1"
+  checksum: 10c0/0570ad92287398e8a7910786d7cee0a998174cdd6637ba61571992897c13204adf70b9ed02d0da2af554119411128e701d9c6b893420612897b438dc91db712b
+  languageName: node
+  linkType: hard
+
+"@radix-ui/primitive@npm:1.1.3":
+  version: 1.1.3
+  resolution: "@radix-ui/primitive@npm:1.1.3"
+  checksum: 10c0/88860165ee7066fa2c179f32ffcd3ee6d527d9dcdc0e8be85e9cb0e2c84834be8e3c1a976c74ba44b193f709544e12f54455d892b28e32f0708d89deda6b9f1d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-arrow@npm:1.1.7":
+  version: 1.1.7
+  resolution: "@radix-ui/react-arrow@npm:1.1.7"
+  dependencies:
+    "@radix-ui/react-primitive": "npm:2.1.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/c3b46766238b3ee2a394d8806a5141432361bf1425110c9f0dcf480bda4ebd304453a53f294b5399c6ee3ccfcae6fd544921fd01ddc379cf5942acdd7168664b
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-checkbox@npm:^1.3.3":
+  version: 1.3.3
+  resolution: "@radix-ui/react-checkbox@npm:1.3.3"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-presence": "npm:1.1.5"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+    "@radix-ui/react-use-previous": "npm:1.1.1"
+    "@radix-ui/react-use-size": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/5eeb78e37a6c9611a638a80b309c931dd6f1f8968357ab2abb453505392fa1397491441447ca2d5f4381faaac7fab2dc84c780e8ce27d931bd203fa014088b74
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-collection@npm:1.1.7":
+  version: 1.1.7
+  resolution: "@radix-ui/react-collection@npm:1.1.7"
+  dependencies:
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-slot": "npm:1.2.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/fa321a7300095508491f75414f02b243f0c3f179dc0728cfd115e2ea9f6f48f1516532b59f526d9ac81bbab63cd98a052074b4703ec0b9428fac945ebabec5fd
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-compose-refs@npm:1.1.2":
+  version: 1.1.2
+  resolution: "@radix-ui/react-compose-refs@npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/d36a9c589eb75d634b9b139c80f916aadaf8a68a7c1c4b8c6c6b88755af1a92f2e343457042089f04cc3f23073619d08bb65419ced1402e9d4e299576d970771
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-context@npm:1.1.2":
+  version: 1.1.2
+  resolution: "@radix-ui/react-context@npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/cece731f8cc25d494c6589cc681e5c01a93867d895c75889973afa1a255f163c286e390baa7bc028858eaabe9f6b57270d0ca6377356f652c5557c1c7a41ccce
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-dialog@npm:^1.1.15":
+  version: 1.1.15
+  resolution: "@radix-ui/react-dialog@npm:1.1.15"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-focus-guards": "npm:1.1.3"
+    "@radix-ui/react-focus-scope": "npm:1.1.7"
+    "@radix-ui/react-id": "npm:1.1.1"
+    "@radix-ui/react-portal": "npm:1.1.9"
+    "@radix-ui/react-presence": "npm:1.1.5"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-slot": "npm:1.2.3"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+    aria-hidden: "npm:^1.2.4"
+    react-remove-scroll: "npm:^2.6.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/2f2c88e3c281acaea2fd9b96fa82132d59177d3aa5da2e7c045596fd4028e84e44ac52ac28f4f236910605dd7d9338c2858ba44a9ced2af2e3e523abbfd33014
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-direction@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-direction@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/7a89d9291f846a3105e45f4df98d6b7a08f8d7b30acdcd253005dc9db107ee83cbbebc9e47a9af1e400bcd47697f1511ceab23a399b0da854488fc7220482ac9
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-dismissable-layer@npm:1.1.11":
+  version: 1.1.11
+  resolution: "@radix-ui/react-dismissable-layer@npm:1.1.11"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    "@radix-ui/react-use-escape-keydown": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/c825572a64073c4d3853702029979f6658770ffd6a98eabc4984e1dee1b226b4078a2a4dc7003f96475b438985e9b21a58e75f51db74dd06848dcae1f2d395dc
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-dropdown-menu@npm:^2.1.16":
+  version: 2.1.16
+  resolution: "@radix-ui/react-dropdown-menu@npm:2.1.16"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-id": "npm:1.1.1"
+    "@radix-ui/react-menu": "npm:2.1.16"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/8caaa8dd791ccb284568720adafa59855e13860aa29eb20e10a04ba671cbbfa519a4c5d3a339a4d9fb08009eeb1065f4a8b5c3c8ef45e9753161cc560106b935
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-focus-guards@npm:1.1.3":
+  version: 1.1.3
+  resolution: "@radix-ui/react-focus-guards@npm:1.1.3"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/0bab65eb8d7e4f72f685d63de7fbba2450e3cb15ad6a20a16b42195e9d335c576356f5a47cb58d1ffc115393e46d7b14b12c5d4b10029b0ec090861255866985
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-focus-scope@npm:1.1.7":
+  version: 1.1.7
+  resolution: "@radix-ui/react-focus-scope@npm:1.1.7"
+  dependencies:
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/8a6071331bdeeb79b223463de75caf759b8ad19339cab838e537b8dbb2db236891a1f4df252445c854d375d43d9d315dfcce0a6b01553a2984ec372bb8f1300e
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-id@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-id@npm:1.1.1"
+  dependencies:
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/7d12e76818763d592c331277ef62b197e2e64945307e650bd058f0090e5ae48bbd07691b23b7e9e977901ef4eadcb3e2d5eaeb17a13859083384be83fc1292c7
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-label@npm:^2.1.8":
+  version: 2.1.8
+  resolution: "@radix-ui/react-label@npm:2.1.8"
+  dependencies:
+    "@radix-ui/react-primitive": "npm:2.1.4"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/8b130380bd54bafb0dc652270c8cf035ceeb78faab82f78c0a76fc33cc0718e8455ff880e0db1b6c10f203ff342bf1f941544eb258c1fd85ae5b49b53cdf1a3d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-menu@npm:2.1.16":
+  version: 2.1.16
+  resolution: "@radix-ui/react-menu@npm:2.1.16"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-collection": "npm:1.1.7"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-direction": "npm:1.1.1"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-focus-guards": "npm:1.1.3"
+    "@radix-ui/react-focus-scope": "npm:1.1.7"
+    "@radix-ui/react-id": "npm:1.1.1"
+    "@radix-ui/react-popper": "npm:1.2.8"
+    "@radix-ui/react-portal": "npm:1.1.9"
+    "@radix-ui/react-presence": "npm:1.1.5"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-roving-focus": "npm:1.1.11"
+    "@radix-ui/react-slot": "npm:1.2.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    aria-hidden: "npm:^1.2.4"
+    react-remove-scroll: "npm:^2.6.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/27516b2b987fa9181c4da8645000af8f60691866a349d7a46b9505fa7d2e9d92b9e364db4f7305d08e9e57d0e1afc8df8354f8ee3c12aa05c0100c16b0e76c27
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-popper@npm:1.2.8":
+  version: 1.2.8
+  resolution: "@radix-ui/react-popper@npm:1.2.8"
+  dependencies:
+    "@floating-ui/react-dom": "npm:^2.0.0"
+    "@radix-ui/react-arrow": "npm:1.1.7"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+    "@radix-ui/react-use-rect": "npm:1.1.1"
+    "@radix-ui/react-use-size": "npm:1.1.1"
+    "@radix-ui/rect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/48e3f13eac3b8c13aca8ded37d74db17e1bb294da8d69f142ab6b8719a06c3f90051668bed64520bf9f3abdd77b382ce7ce209d056bb56137cecc949b69b421c
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-portal@npm:1.1.9":
+  version: 1.1.9
+  resolution: "@radix-ui/react-portal@npm:1.1.9"
+  dependencies:
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/45b432497c722720c72c493a29ef6085bc84b50eafe79d48b45c553121b63e94f9cdb77a3a74b9c49126f8feb3feee009fe400d48b7759d3552396356b192cd7
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-presence@npm:1.1.5":
+  version: 1.1.5
+  resolution: "@radix-ui/react-presence@npm:1.1.5"
+  dependencies:
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/d0e61d314250eeaef5369983cb790701d667f51734bafd98cf759072755562018052c594e6cdc5389789f4543cb0a4d98f03ff4e8f37338d6b5bf51a1700c1d1
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-primitive@npm:2.1.3":
+  version: 2.1.3
+  resolution: "@radix-ui/react-primitive@npm:2.1.3"
+  dependencies:
+    "@radix-ui/react-slot": "npm:1.2.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/fdff9b84913bb4172ef6d3af7442fca5f9bba5f2709cba08950071f819d7057aec3a4a2d9ef44cf9cbfb8014d02573c6884a04cff175895823aaef809ebdb034
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-primitive@npm:2.1.4":
+  version: 2.1.4
+  resolution: "@radix-ui/react-primitive@npm:2.1.4"
+  dependencies:
+    "@radix-ui/react-slot": "npm:1.2.4"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/90d687b222a25975371ed1f9f08648d75237214b8dec4cbaf09ec9ac951339b17421278f1aff2fb7c5672ba8bd03774a94904efdba73805dd5cc947ce5be8c4a
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-roving-focus@npm:1.1.11":
+  version: 1.1.11
+  resolution: "@radix-ui/react-roving-focus@npm:1.1.11"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-collection": "npm:1.1.7"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-direction": "npm:1.1.1"
+    "@radix-ui/react-id": "npm:1.1.1"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/2cd43339c36e89a3bf1db8aab34b939113dfbde56bf3a33df2d74757c78c9489b847b1962f1e2441c67e41817d120cb6177943e0f655f47bc1ff8e44fd55b1a2
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-scroll-area@npm:^1.2.10":
+  version: 1.2.10
+  resolution: "@radix-ui/react-scroll-area@npm:1.2.10"
+  dependencies:
+    "@radix-ui/number": "npm:1.1.1"
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-direction": "npm:1.1.1"
+    "@radix-ui/react-presence": "npm:1.1.5"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/8acdacd255fdfcefe4f72028a13dc554df73327db94c250f54a85b9608aa0313284dbb6c417f28a48e7b7b7bcaa76ddf3297e91ba07d833604d428f869259622
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-select@npm:^2.2.6":
+  version: 2.2.6
+  resolution: "@radix-ui/react-select@npm:2.2.6"
+  dependencies:
+    "@radix-ui/number": "npm:1.1.1"
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-collection": "npm:1.1.7"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-direction": "npm:1.1.1"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-focus-guards": "npm:1.1.3"
+    "@radix-ui/react-focus-scope": "npm:1.1.7"
+    "@radix-ui/react-id": "npm:1.1.1"
+    "@radix-ui/react-popper": "npm:1.2.8"
+    "@radix-ui/react-portal": "npm:1.1.9"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-slot": "npm:1.2.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+    "@radix-ui/react-use-previous": "npm:1.1.1"
+    "@radix-ui/react-visually-hidden": "npm:1.2.3"
+    aria-hidden: "npm:^1.2.4"
+    react-remove-scroll: "npm:^2.6.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/34b2492589c3a4b118a03900d622640033630f30ac93c4a69b3701513117607f4ac3a0d9dd3cad39caa8b6495660f71f3aa9d0074d4eb4dac6804dc0b8408deb
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-slot@npm:1.2.3":
+  version: 1.2.3
+  resolution: "@radix-ui/react-slot@npm:1.2.3"
+  dependencies:
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/5913aa0d760f505905779515e4b1f0f71a422350f077cc8d26d1aafe53c97f177fec0e6d7fbbb50d8b5e498aa9df9f707ca75ae3801540c283b26b0136138eef
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-slot@npm:1.2.4, @radix-ui/react-slot@npm:^1.2.4":
+  version: 1.2.4
+  resolution: "@radix-ui/react-slot@npm:1.2.4"
+  dependencies:
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/8b719bb934f1ae5ac0e37214783085c17c2f1080217caf514c1c6cc3d9ca56c7e19d25470b26da79aa6e605ab36589edaade149b76f5fc0666f1063e2fc0a0dc
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-tabs@npm:^1.1.13":
+  version: 1.1.13
+  resolution: "@radix-ui/react-tabs@npm:1.1.13"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-direction": "npm:1.1.1"
+    "@radix-ui/react-id": "npm:1.1.1"
+    "@radix-ui/react-presence": "npm:1.1.5"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-roving-focus": "npm:1.1.11"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/a3c78cd8c30dcb95faf1605a8424a1a71dab121dfa6e9c0019bb30d0f36d882762c925b17596d4977990005a255d8ddc0b7454e4f83337fe557b45570a2d8058
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-toast@npm:^1.2.15":
+  version: 1.2.15
+  resolution: "@radix-ui/react-toast@npm:1.2.15"
+  dependencies:
+    "@radix-ui/primitive": "npm:1.1.3"
+    "@radix-ui/react-collection": "npm:1.1.7"
+    "@radix-ui/react-compose-refs": "npm:1.1.2"
+    "@radix-ui/react-context": "npm:1.1.2"
+    "@radix-ui/react-dismissable-layer": "npm:1.1.11"
+    "@radix-ui/react-portal": "npm:1.1.9"
+    "@radix-ui/react-presence": "npm:1.1.5"
+    "@radix-ui/react-primitive": "npm:2.1.3"
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+    "@radix-ui/react-use-controllable-state": "npm:1.2.2"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+    "@radix-ui/react-visually-hidden": "npm:1.2.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/e7050d356719f438e087e8033e47a8854fba001cf71eb4e0c0203d53a4fbbd35aca9f17f73abe4dadc406d2d85badf4e37065865d07835763d0e3cb9d95a518d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-callback-ref@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-callback-ref@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/5f6aff8592dea6a7e46589808912aba3fb3b626cf6edd2b14f01638b61dbbe49eeb9f67cd5601f4c15b2fb547b9a7e825f7c4961acd4dd70176c969ae405f8d8
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-controllable-state@npm:1.2.2":
+  version: 1.2.2
+  resolution: "@radix-ui/react-use-controllable-state@npm:1.2.2"
+  dependencies:
+    "@radix-ui/react-use-effect-event": "npm:0.0.2"
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/f55c4b06e895293aed4b44c9ef26fb24432539f5346fcd6519c7745800535b571058685314e83486a45bf61dc83887e24826490d3068acc317fb0a9010516e63
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-effect-event@npm:0.0.2":
+  version: 0.0.2
+  resolution: "@radix-ui/react-use-effect-event@npm:0.0.2"
+  dependencies:
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/e84ff72a3e76c5ae9c94941028bb4b6472f17d4104481b9eab773deab3da640ecea035e54da9d6f4df8d84c18ef6913baf92b7511bee06930dc58bd0c0add417
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-escape-keydown@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-escape-keydown@npm:1.1.1"
+  dependencies:
+    "@radix-ui/react-use-callback-ref": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/bff53be99e940fef1d3c4df7d560e1d9133182e5a98336255d3063327d1d3dd4ec54a95dc5afe15cca4fb6c184f0a956c70de2815578c318cf995a7f9beabaa1
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-layout-effect@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-layout-effect@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/9f98fdaba008dfc58050de60a77670b885792df473cf82c1cef8daee919a5dd5a77d270209f5f0b0abfaac78cb1627396e3ff56c81b735be550409426fe8b040
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-previous@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-previous@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/52f1089d941491cd59b7f52a5679a14e9381711419a0557ce0f3bc9a4c117078224efec54dcced41a3653a13a386a7b6ec75435d61a273e8b9f5d00235f2b182
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-rect@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-rect@npm:1.1.1"
+  dependencies:
+    "@radix-ui/rect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/271711404c05c589c8dbdaa748749e7daf44bcc6bffc9ecd910821c3ebca0ee245616cf5b39653ce690f53f875c3836fd3f36f51ab1c628273b6db599eee4864
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-size@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-size@npm:1.1.1"
+  dependencies:
+    "@radix-ui/react-use-layout-effect": "npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/851d09a816f44282e0e9e2147b1b571410174cc048703a50c4fa54d672de994fd1dfff1da9d480ecfd12c77ae8f48d74f01adaf668f074156b8cd0043c6c21d8
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-visually-hidden@npm:1.2.3":
+  version: 1.2.3
+  resolution: "@radix-ui/react-visually-hidden@npm:1.2.3"
+  dependencies:
+    "@radix-ui/react-primitive": "npm:2.1.3"
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 10c0/cf86a37f1cbee50a964056f3dc4f6bb1ee79c76daa321f913aa20ff3e1ccdfafbf2b114d7bb616aeefc7c4b895e6ca898523fdb67710d89bd5d8edb739a0d9b6
+  languageName: node
+  linkType: hard
+
+"@radix-ui/rect@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/rect@npm:1.1.1"
+  checksum: 10c0/0dac4f0f15691199abe6a0e067821ddd9d0349c0c05f39834e4eafc8403caf724106884035ae91bbc826e10367e6a5672e7bec4d4243860fa7649de246b1f60b
+  languageName: node
+  linkType: hard
+
+"@rolldown/pluginutils@npm:1.0.0-rc.3":
+  version: 1.0.0-rc.3
+  resolution: "@rolldown/pluginutils@npm:1.0.0-rc.3"
+  checksum: 10c0/3928b6282a30f307d1b075d2f217180ae173ea9e00638ce46ab65f089bd5f7a0b2c488ae1ce530f509387793c656a2910337c4cd68fa9d37d7e439365989e699
   languageName: node
   linkType: hard
 
@@ -1087,6 +2106,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-android-arm-eabi@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-android-arm-eabi@npm:4.59.0"
+  conditions: os=android & cpu=arm
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-android-arm64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-android-arm64@npm:4.57.1"
@@ -1094,6 +2120,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-android-arm64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-android-arm64@npm:4.59.0"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-darwin-arm64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-darwin-arm64@npm:4.57.1"
@@ -1101,6 +2134,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-darwin-arm64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-darwin-arm64@npm:4.59.0"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-darwin-x64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-darwin-x64@npm:4.57.1"
@@ -1108,6 +2148,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-darwin-x64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-darwin-x64@npm:4.59.0"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-freebsd-arm64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-freebsd-arm64@npm:4.57.1"
@@ -1115,6 +2162,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-freebsd-arm64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-freebsd-arm64@npm:4.59.0"
+  conditions: os=freebsd & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-freebsd-x64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-freebsd-x64@npm:4.57.1"
@@ -1122,6 +2176,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-freebsd-x64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-freebsd-x64@npm:4.59.0"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm-gnueabihf@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-arm-gnueabihf@npm:4.57.1"
@@ -1129,6 +2190,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm-gnueabihf@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-arm-gnueabihf@npm:4.59.0"
+  conditions: os=linux & cpu=arm & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm-musleabihf@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-arm-musleabihf@npm:4.57.1"
@@ -1136,6 +2204,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm-musleabihf@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-arm-musleabihf@npm:4.59.0"
+  conditions: os=linux & cpu=arm & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm64-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-arm64-gnu@npm:4.57.1"
@@ -1143,6 +2218,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm64-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-arm64-gnu@npm:4.59.0"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-arm64-musl@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-arm64-musl@npm:4.57.1"
@@ -1150,6 +2232,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-arm64-musl@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-arm64-musl@npm:4.59.0"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-loong64-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-loong64-gnu@npm:4.57.1"
@@ -1157,6 +2246,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-loong64-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-loong64-gnu@npm:4.59.0"
+  conditions: os=linux & cpu=loong64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-loong64-musl@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-loong64-musl@npm:4.57.1"
@@ -1164,6 +2260,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-loong64-musl@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-loong64-musl@npm:4.59.0"
+  conditions: os=linux & cpu=loong64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-ppc64-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-ppc64-gnu@npm:4.57.1"
@@ -1171,6 +2274,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-ppc64-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-ppc64-gnu@npm:4.59.0"
+  conditions: os=linux & cpu=ppc64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-ppc64-musl@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-ppc64-musl@npm:4.57.1"
@@ -1178,6 +2288,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-ppc64-musl@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-ppc64-musl@npm:4.59.0"
+  conditions: os=linux & cpu=ppc64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-riscv64-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-riscv64-gnu@npm:4.57.1"
@@ -1185,6 +2302,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-riscv64-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-riscv64-gnu@npm:4.59.0"
+  conditions: os=linux & cpu=riscv64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-riscv64-musl@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-riscv64-musl@npm:4.57.1"
@@ -1192,6 +2316,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-riscv64-musl@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-riscv64-musl@npm:4.59.0"
+  conditions: os=linux & cpu=riscv64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-s390x-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-s390x-gnu@npm:4.57.1"
@@ -1199,6 +2330,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-s390x-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-s390x-gnu@npm:4.59.0"
+  conditions: os=linux & cpu=s390x & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-x64-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-x64-gnu@npm:4.57.1"
@@ -1206,6 +2344,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-x64-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-x64-gnu@npm:4.59.0"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-linux-x64-musl@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-linux-x64-musl@npm:4.57.1"
@@ -1213,6 +2358,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-linux-x64-musl@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-linux-x64-musl@npm:4.59.0"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-openbsd-x64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-openbsd-x64@npm:4.57.1"
@@ -1220,6 +2372,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-openbsd-x64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-openbsd-x64@npm:4.59.0"
+  conditions: os=openbsd & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-openharmony-arm64@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-openharmony-arm64@npm:4.57.1"
@@ -1227,6 +2386,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-openharmony-arm64@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-openharmony-arm64@npm:4.59.0"
+  conditions: os=openharmony & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-arm64-msvc@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-win32-arm64-msvc@npm:4.57.1"
@@ -1234,6 +2400,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-arm64-msvc@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-win32-arm64-msvc@npm:4.59.0"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-ia32-msvc@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-win32-ia32-msvc@npm:4.57.1"
@@ -1241,6 +2414,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-ia32-msvc@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-win32-ia32-msvc@npm:4.59.0"
+  conditions: os=win32 & cpu=ia32
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-x64-gnu@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-win32-x64-gnu@npm:4.57.1"
@@ -1248,6 +2428,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-x64-gnu@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-win32-x64-gnu@npm:4.59.0"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@rollup/rollup-win32-x64-msvc@npm:4.57.1":
   version: 4.57.1
   resolution: "@rollup/rollup-win32-x64-msvc@npm:4.57.1"
@@ -1255,6 +2442,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@rollup/rollup-win32-x64-msvc@npm:4.59.0":
+  version: 4.59.0
+  resolution: "@rollup/rollup-win32-x64-msvc@npm:4.59.0"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
 "@sinclair/typebox@npm:^0.27.8":
   version: 0.27.10
   resolution: "@sinclair/typebox@npm:0.27.10"
@@ -1269,89 +2463,304 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tanstack/query-core@npm:4.43.0":
-  version: 4.43.0
-  resolution: "@tanstack/query-core@npm:4.43.0"
-  checksum: 10c0/29100c4a4805e44596a08a2002a3775e631bc7351b801e3cb4d31f765b1ab9c4a467d9d253d42986a65cd331c23f8a1380d22884683f3e7e17ed93f3fc856f38
+"@tailwindcss/node@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/node@npm:4.2.0"
+  dependencies:
+    "@jridgewell/remapping": "npm:^2.3.5"
+    enhanced-resolve: "npm:^5.19.0"
+    jiti: "npm:^2.6.1"
+    lightningcss: "npm:1.31.1"
+    magic-string: "npm:^0.30.21"
+    source-map-js: "npm:^1.2.1"
+    tailwindcss: "npm:4.2.0"
+  checksum: 10c0/f9b0bb4826fd8ac4e6961e5fbcd640c2d6946dcdccf8c30be63266566f6c806b388e98478fae80fb6d7e16627dab631ffdd4cd5d352362a8bc44b303da8a419d
   languageName: node
   linkType: hard
 
-"@tanstack/react-query@npm:^4.34.0":
-  version: 4.43.0
-  resolution: "@tanstack/react-query@npm:4.43.0"
+"@tailwindcss/oxide-android-arm64@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-android-arm64@npm:4.2.0"
+  conditions: os=android & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-darwin-arm64@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-darwin-arm64@npm:4.2.0"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-darwin-x64@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-darwin-x64@npm:4.2.0"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-freebsd-x64@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-freebsd-x64@npm:4.2.0"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-linux-arm-gnueabihf@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-linux-arm-gnueabihf@npm:4.2.0"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-linux-arm64-gnu@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-linux-arm64-gnu@npm:4.2.0"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-linux-arm64-musl@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-linux-arm64-musl@npm:4.2.0"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-linux-x64-gnu@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-linux-x64-gnu@npm:4.2.0"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-linux-x64-musl@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-linux-x64-musl@npm:4.2.0"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-wasm32-wasi@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-wasm32-wasi@npm:4.2.0"
   dependencies:
-    "@tanstack/query-core": "npm:4.43.0"
+    "@emnapi/core": "npm:^1.8.1"
+    "@emnapi/runtime": "npm:^1.8.1"
+    "@emnapi/wasi-threads": "npm:^1.1.0"
+    "@napi-rs/wasm-runtime": "npm:^1.1.1"
+    "@tybys/wasm-util": "npm:^0.10.1"
+    tslib: "npm:^2.8.1"
+  conditions: cpu=wasm32
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-win32-arm64-msvc@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-win32-arm64-msvc@npm:4.2.0"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide-win32-x64-msvc@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide-win32-x64-msvc@npm:4.2.0"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/oxide@npm:4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/oxide@npm:4.2.0"
+  dependencies:
+    "@tailwindcss/oxide-android-arm64": "npm:4.2.0"
+    "@tailwindcss/oxide-darwin-arm64": "npm:4.2.0"
+    "@tailwindcss/oxide-darwin-x64": "npm:4.2.0"
+    "@tailwindcss/oxide-freebsd-x64": "npm:4.2.0"
+    "@tailwindcss/oxide-linux-arm-gnueabihf": "npm:4.2.0"
+    "@tailwindcss/oxide-linux-arm64-gnu": "npm:4.2.0"
+    "@tailwindcss/oxide-linux-arm64-musl": "npm:4.2.0"
+    "@tailwindcss/oxide-linux-x64-gnu": "npm:4.2.0"
+    "@tailwindcss/oxide-linux-x64-musl": "npm:4.2.0"
+    "@tailwindcss/oxide-wasm32-wasi": "npm:4.2.0"
+    "@tailwindcss/oxide-win32-arm64-msvc": "npm:4.2.0"
+    "@tailwindcss/oxide-win32-x64-msvc": "npm:4.2.0"
+  dependenciesMeta:
+    "@tailwindcss/oxide-android-arm64":
+      optional: true
+    "@tailwindcss/oxide-darwin-arm64":
+      optional: true
+    "@tailwindcss/oxide-darwin-x64":
+      optional: true
+    "@tailwindcss/oxide-freebsd-x64":
+      optional: true
+    "@tailwindcss/oxide-linux-arm-gnueabihf":
+      optional: true
+    "@tailwindcss/oxide-linux-arm64-gnu":
+      optional: true
+    "@tailwindcss/oxide-linux-arm64-musl":
+      optional: true
+    "@tailwindcss/oxide-linux-x64-gnu":
+      optional: true
+    "@tailwindcss/oxide-linux-x64-musl":
+      optional: true
+    "@tailwindcss/oxide-wasm32-wasi":
+      optional: true
+    "@tailwindcss/oxide-win32-arm64-msvc":
+      optional: true
+    "@tailwindcss/oxide-win32-x64-msvc":
+      optional: true
+  checksum: 10c0/562cdb36efe4930220f749f10f429c212ed1eb99082325ada1f5b3dcdffbcf0cdafd23a28e0437d12824eb512dc3dc878a6fca4232255a73c99600a2dede8bfa
+  languageName: node
+  linkType: hard
+
+"@tailwindcss/postcss@npm:^4.2.0":
+  version: 4.2.0
+  resolution: "@tailwindcss/postcss@npm:4.2.0"
+  dependencies:
+    "@alloc/quick-lru": "npm:^5.2.0"
+    "@tailwindcss/node": "npm:4.2.0"
+    "@tailwindcss/oxide": "npm:4.2.0"
+    postcss: "npm:^8.5.6"
+    tailwindcss: "npm:4.2.0"
+  checksum: 10c0/cf0024b566c17a4cb6aeb1e84a0ea31b7964394e0156caee3872c5b513d2913e17607ffad990f6017e6f33e08f6b9ea5cdf504b975eed237a006f0b3372468cf
+  languageName: node
+  linkType: hard
+
+"@tanstack/devtools-event-client@npm:^0.4.0":
+  version: 0.4.0
+  resolution: "@tanstack/devtools-event-client@npm:0.4.0"
+  checksum: 10c0/f6603f9f9542ff0e6037726b7e023b6e32c7228d968e4d301e8970b9a8a9ec021249c1eca054a32b5ffb46aed75bc0d54aefda01bda804246caaee27842f1deb
+  languageName: node
+  linkType: hard
+
+"@tanstack/form-core@npm:1.28.3":
+  version: 1.28.3
+  resolution: "@tanstack/form-core@npm:1.28.3"
+  dependencies:
+    "@tanstack/devtools-event-client": "npm:^0.4.0"
+    "@tanstack/pacer-lite": "npm:^0.1.1"
+    "@tanstack/store": "npm:^0.8.1"
+  checksum: 10c0/ae8f8effcbfb03245cd73b37b07ec93d18154cd948d551fda2a58e5b4630792b87f4f10f8e06e9540398edf316ffabc1e221bf56ef33843b0e02d7a804899587
+  languageName: node
+  linkType: hard
+
+"@tanstack/history@npm:1.161.4":
+  version: 1.161.4
+  resolution: "@tanstack/history@npm:1.161.4"
+  checksum: 10c0/adfcaab72831dbecb35dbbcfaa75f032efb6e8b4ef7397f21bdccb08fa35234a44372b5f85e2f3c376e9370412e823f70ef94178f714cdabfb79d1f770eaa971
+  languageName: node
+  linkType: hard
+
+"@tanstack/pacer-lite@npm:^0.1.1":
+  version: 0.1.1
+  resolution: "@tanstack/pacer-lite@npm:0.1.1"
+  checksum: 10c0/c74c2e67dba3a14cd14134c27cff4856977c9019cf4dbe6a545a06960f4c9c8edad846e526595206aa01c42cc5cd5ee217761547ab6d2a3edec6fb3d69864686
+  languageName: node
+  linkType: hard
+
+"@tanstack/query-core@npm:5.90.20":
+  version: 5.90.20
+  resolution: "@tanstack/query-core@npm:5.90.20"
+  checksum: 10c0/70637dfcecd5ed9d810629aa27f1632af8a4bcd083e75cf29408d058c32f8234704a3231ec280e2c4016ea0485b16124fdf70ab97793b5a7b670f43f7659e9fe
+  languageName: node
+  linkType: hard
+
+"@tanstack/react-form@npm:^1.28.3":
+  version: 1.28.3
+  resolution: "@tanstack/react-form@npm:1.28.3"
+  dependencies:
+    "@tanstack/form-core": "npm:1.28.3"
+    "@tanstack/react-store": "npm:^0.8.1"
+  peerDependencies:
+    react: ^17.0.0 || ^18.0.0 || ^19.0.0
+  peerDependenciesMeta:
+    "@tanstack/react-start":
+      optional: true
+  checksum: 10c0/a3a5dfeec19b10e28bfe5e5b08195aac7d90dcb51a33081212a4ed581b34c80b6855d8e17c141666f9b46589c5266386dba78967922ce2a6b4a41e5551f017d6
+  languageName: node
+  linkType: hard
+
+"@tanstack/react-query@npm:^5.90.21":
+  version: 5.90.21
+  resolution: "@tanstack/react-query@npm:5.90.21"
+  dependencies:
+    "@tanstack/query-core": "npm:5.90.20"
+  peerDependencies:
+    react: ^18 || ^19
+  checksum: 10c0/e8994c57f6ceb2c886a4d6486a8c6a3f89bc6b1220de3e732448d7fcbeb386e9358f03c73804de72004c6ac2668d0bf1b44cedbb273d3e4b33afcbaee7b7d24d
+  languageName: node
+  linkType: hard
+
+"@tanstack/react-router@npm:^1.162.2":
+  version: 1.162.2
+  resolution: "@tanstack/react-router@npm:1.162.2"
+  dependencies:
+    "@tanstack/history": "npm:1.161.4"
+    "@tanstack/react-store": "npm:^0.9.1"
+    "@tanstack/router-core": "npm:1.162.2"
+    isbot: "npm:^5.1.22"
+    tiny-invariant: "npm:^1.3.3"
+    tiny-warning: "npm:^1.0.3"
+  peerDependencies:
+    react: ">=18.0.0 || >=19.0.0"
+    react-dom: ">=18.0.0 || >=19.0.0"
+  checksum: 10c0/ab1e442fd98fd0d3fe3a5740ff8302b98d54b6473b176ffad251d6208498323f80154f3042bde39ccbbe5e8862737383be338b0d60d808111f4cb595b222fb20
+  languageName: node
+  linkType: hard
+
+"@tanstack/react-store@npm:^0.8.1":
+  version: 0.8.1
+  resolution: "@tanstack/react-store@npm:0.8.1"
+  dependencies:
+    "@tanstack/store": "npm:0.8.1"
     use-sync-external-store: "npm:^1.6.0"
   peerDependencies:
     react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
     react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
-    react-native: "*"
-  peerDependenciesMeta:
-    react-dom:
-      optional: true
-    react-native:
-      optional: true
-  checksum: 10c0/4b142ee02a7203494a4547a8f6455b5aadb9cf37f83ed9707420b0d38282dac58fd9d89f44a0b5e6fc15d4cf1cd4e95ab9f58fce83e52a1e14a94e83671298c7
+  checksum: 10c0/83037681674e34361f5a6141af81a19788e7243892f5fcca45c9e70c73eb9da9693574a46ea80114589060969470a9b9657a3bd74a44f98e80de481c65204778
   languageName: node
   linkType: hard
 
-"@testing-library/dom@npm:^9.0.0":
-  version: 9.3.4
-  resolution: "@testing-library/dom@npm:9.3.4"
+"@tanstack/react-store@npm:^0.9.1":
+  version: 0.9.1
+  resolution: "@tanstack/react-store@npm:0.9.1"
   dependencies:
-    "@babel/code-frame": "npm:^7.10.4"
-    "@babel/runtime": "npm:^7.12.5"
-    "@types/aria-query": "npm:^5.0.1"
-    aria-query: "npm:5.1.3"
-    chalk: "npm:^4.1.0"
-    dom-accessibility-api: "npm:^0.5.9"
-    lz-string: "npm:^1.5.0"
-    pretty-format: "npm:^27.0.2"
-  checksum: 10c0/147da340e8199d7f98f3a4ad8aa22ed55b914b83957efa5eb22bfea021a979ebe5a5182afa9c1e5b7a5f99a7f6744a5a4d9325ae46ec3b33b5a15aed8750d794
-  languageName: node
-  linkType: hard
-
-"@testing-library/jest-dom@npm:^6.0.0":
-  version: 6.9.1
-  resolution: "@testing-library/jest-dom@npm:6.9.1"
-  dependencies:
-    "@adobe/css-tools": "npm:^4.4.0"
-    aria-query: "npm:^5.0.0"
-    css.escape: "npm:^1.5.1"
-    dom-accessibility-api: "npm:^0.6.3"
-    picocolors: "npm:^1.1.1"
-    redent: "npm:^3.0.0"
-  checksum: 10c0/4291ebd2f0f38d14cefac142c56c337941775a5807e2a3d6f1a14c2fbd6be76a18e498ed189e95bedc97d9e8cf1738049bc76c85b5bc5e23fae7c9e10f7b3a12
-  languageName: node
-  linkType: hard
-
-"@testing-library/react@npm:^14.0.0":
-  version: 14.3.1
-  resolution: "@testing-library/react@npm:14.3.1"
-  dependencies:
-    "@babel/runtime": "npm:^7.12.5"
-    "@testing-library/dom": "npm:^9.0.0"
-    "@types/react-dom": "npm:^18.0.0"
+    "@tanstack/store": "npm:0.9.1"
+    use-sync-external-store: "npm:^1.6.0"
   peerDependencies:
-    react: ^18.0.0
-    react-dom: ^18.0.0
-  checksum: 10c0/1ccf4eb1510500cc20a805cb0244c9098dca28a8745173a8f71ea1274d63774f0b7898a35c878b43c797b89c13621548909ff37843b835c1a27ee1efbbdd098c
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+    react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+  checksum: 10c0/8d03641c8619c2c92b5f05ea6a0c6060fe3efcab6bc2fb0990351f083263ed78fd220df62a427728f11137cba1cc2d0ca80175893a52d62a2e7057a4396e484a
   languageName: node
   linkType: hard
 
-"@testing-library/user-event@npm:^14.5.0":
-  version: 14.6.1
-  resolution: "@testing-library/user-event@npm:14.6.1"
-  peerDependencies:
-    "@testing-library/dom": ">=7.21.4"
-  checksum: 10c0/75fea130a52bf320d35d46ed54f3eec77e71a56911b8b69a3fe29497b0b9947b2dc80d30f04054ad4ce7f577856ae3e5397ea7dff0ef14944d3909784c7a93fe
+"@tanstack/router-core@npm:1.162.2":
+  version: 1.162.2
+  resolution: "@tanstack/router-core@npm:1.162.2"
+  dependencies:
+    "@tanstack/history": "npm:1.161.4"
+    "@tanstack/store": "npm:^0.9.1"
+    cookie-es: "npm:^2.0.0"
+    seroval: "npm:^1.4.2"
+    seroval-plugins: "npm:^1.4.2"
+    tiny-invariant: "npm:^1.3.3"
+    tiny-warning: "npm:^1.0.3"
+  checksum: 10c0/18e45379c5970b8184cea62150dd18b1eff7f032de627e67d773797ff21224fb96a7e76cb678ba0ad29f075ba39e05491560f725948cca9a0cba0271814a6700
   languageName: node
   linkType: hard
 
-"@tootallnate/once@npm:2":
-  version: 2.0.0
-  resolution: "@tootallnate/once@npm:2.0.0"
-  checksum: 10c0/073bfa548026b1ebaf1659eb8961e526be22fa77139b10d60e712f46d2f0f05f4e6c8bec62a087d41088ee9e29faa7f54838568e475ab2f776171003c3920858
+"@tanstack/store@npm:0.8.1, @tanstack/store@npm:^0.8.1":
+  version: 0.8.1
+  resolution: "@tanstack/store@npm:0.8.1"
+  checksum: 10c0/344180b689f87c3afa6ac3ea1c7d9b14257a1b961afea916f3ac666b2752972caba33c12105d588d297a932767fe0d8d25567e220777ec99d4ca6b61b5b652af
+  languageName: node
+  linkType: hard
+
+"@tanstack/store@npm:0.9.1, @tanstack/store@npm:^0.9.1":
+  version: 0.9.1
+  resolution: "@tanstack/store@npm:0.9.1"
+  checksum: 10c0/2093bd201ec97e500fe3cdca6a76eec2c92d42790d46ff929819284be9814e768f61ac55d21215f16aefc173f7a910e9ed1abbebced519bbf08e7cc87b6b5d30
   languageName: node
   linkType: hard
 
@@ -1383,10 +2792,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/aria-query@npm:^5.0.1":
-  version: 5.0.4
-  resolution: "@types/aria-query@npm:5.0.4"
-  checksum: 10c0/dc667bc6a3acc7bba2bccf8c23d56cb1f2f4defaa704cfef595437107efaa972d3b3db9ec1d66bc2711bfc35086821edd32c302bffab36f2e79b97f312069f08
+"@tybys/wasm-util@npm:^0.10.1":
+  version: 0.10.1
+  resolution: "@tybys/wasm-util@npm:0.10.1"
+  dependencies:
+    tslib: "npm:^2.4.0"
+  checksum: 10c0/b255094f293794c6d2289300c5fbcafbb5532a3aed3a5ffd2f8dc1828e639b88d75f6a376dd8f94347a44813fd7a7149d8463477a9a49525c8b2dcaa38c2d1e8
   languageName: node
   linkType: hard
 
@@ -1486,6 +2897,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@types/node@npm:^24.10.1":
+  version: 24.10.13
+  resolution: "@types/node@npm:24.10.13"
+  dependencies:
+    undici-types: "npm:~7.16.0"
+  checksum: 10c0/4ff0b9b060b5477c0fec5b11a176f294be588104ab546295db65b17a92ba0a6077b52ad92dd3c0d2154198c7f9d0021e6c1d42b00c9ac7ebfd85632afbcc48a4
+  languageName: node
+  linkType: hard
+
 "@types/node@npm:^25.2.1":
   version: 25.2.1
   resolution: "@types/node@npm:25.2.1"
@@ -1495,29 +2915,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/prop-types@npm:*":
-  version: 15.7.15
-  resolution: "@types/prop-types@npm:15.7.15"
-  checksum: 10c0/b59aad1ad19bf1733cf524fd4e618196c6c7690f48ee70a327eb450a42aab8e8a063fbe59ca0a5701aebe2d92d582292c0fb845ea57474f6a15f6994b0e260b2
-  languageName: node
-  linkType: hard
-
-"@types/react-dom@npm:^18.0.0, @types/react-dom@npm:^18.2.7":
-  version: 18.3.7
-  resolution: "@types/react-dom@npm:18.3.7"
+"@types/react-dom@npm:^19.2.3":
+  version: 19.2.3
+  resolution: "@types/react-dom@npm:19.2.3"
   peerDependencies:
-    "@types/react": ^18.0.0
-  checksum: 10c0/8bd309e2c3d1604a28a736a24f96cbadf6c05d5288cfef8883b74f4054c961b6b3a5e997fd5686e492be903c8f3380dba5ec017eff3906b1256529cd2d39603e
+    "@types/react": ^19.2.0
+  checksum: 10c0/b486ebe0f4e2fb35e2e108df1d8fc0927ca5d6002d5771e8a739de11239fe62d0e207c50886185253c99eb9dedfeeb956ea7429e5ba17f6693c7acb4c02f8cd1
   languageName: node
   linkType: hard
 
-"@types/react@npm:^18.2.21":
-  version: 18.3.28
-  resolution: "@types/react@npm:18.3.28"
+"@types/react@npm:^19.2.7":
+  version: 19.2.14
+  resolution: "@types/react@npm:19.2.14"
   dependencies:
-    "@types/prop-types": "npm:*"
     csstype: "npm:^3.2.2"
-  checksum: 10c0/683e19cd12b5c691215529af2e32b5ffbaccae3bf0ba93bfafa0e460e8dfee18423afed568be2b8eadf4b837c3749dd296a4f64e2d79f68fa66962c05f5af661
+  checksum: 10c0/7d25bf41b57719452d86d2ac0570b659210402707313a36ee612666bf11275a1c69824f8c3ee1fdca077ccfe15452f6da8f1224529b917050eb2d861e52b59b7
   languageName: node
   linkType: hard
 
@@ -1535,6 +2947,26 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/eslint-plugin@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/eslint-plugin@npm:8.56.0"
+  dependencies:
+    "@eslint-community/regexpp": "npm:^4.12.2"
+    "@typescript-eslint/scope-manager": "npm:8.56.0"
+    "@typescript-eslint/type-utils": "npm:8.56.0"
+    "@typescript-eslint/utils": "npm:8.56.0"
+    "@typescript-eslint/visitor-keys": "npm:8.56.0"
+    ignore: "npm:^7.0.5"
+    natural-compare: "npm:^1.4.0"
+    ts-api-utils: "npm:^2.4.0"
+  peerDependencies:
+    "@typescript-eslint/parser": ^8.56.0
+    eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/26e56d14562b3d2d34b366859ec56668fdac909d6ea534451cdb4267846ff50dcccd0026a4eba71ca41f7c8bdef30ef1356620c1ff2363ad64bd8fad33a72b19
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/eslint-plugin@npm:^8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/eslint-plugin@npm:8.54.0"
@@ -1555,6 +2987,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/parser@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/parser@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/scope-manager": "npm:8.56.0"
+    "@typescript-eslint/types": "npm:8.56.0"
+    "@typescript-eslint/typescript-estree": "npm:8.56.0"
+    "@typescript-eslint/visitor-keys": "npm:8.56.0"
+    debug: "npm:^4.4.3"
+  peerDependencies:
+    eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/f3a29c6fdc4e0d1a1e7ddb9909ab839c2f67591933e432c10f44aabb69ae2229f8d2072a220f63b70618cc35c67ff53de0ed110be86b33f4f354c19993f764cb
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/parser@npm:^8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/parser@npm:8.54.0"
@@ -1584,6 +3032,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/project-service@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/project-service@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/tsconfig-utils": "npm:^8.56.0"
+    "@typescript-eslint/types": "npm:^8.56.0"
+    debug: "npm:^4.4.3"
+  peerDependencies:
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/8302dc30ad8c0342137998ea872782cdd673f9e7ec4b244eeb0976915b86d6c44ef55485e2cdac2987dbf309d3663aaf293c85e88326093fc7656b51432369f6
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/scope-manager@npm:8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/scope-manager@npm:8.54.0"
@@ -1594,6 +3055,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/scope-manager@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/scope-manager@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/types": "npm:8.56.0"
+    "@typescript-eslint/visitor-keys": "npm:8.56.0"
+  checksum: 10c0/898b705295e0a4081702a52f98e0d1e50f8047900becd087b232bc71f8af2b87ed70a065bed0076a26abec8f4e5c6bb4a3a0de33b7ea0e3704ecdc7487043b57
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/tsconfig-utils@npm:8.54.0, @typescript-eslint/tsconfig-utils@npm:^8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/tsconfig-utils@npm:8.54.0"
@@ -1603,6 +3074,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/tsconfig-utils@npm:8.56.0, @typescript-eslint/tsconfig-utils@npm:^8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/tsconfig-utils@npm:8.56.0"
+  peerDependencies:
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/20f48af8b497d8a730dcac3724314b4f49ecc436f8871f3e17f5193d83e7d290c8838a126971767cd011208969bc4ff0f4bddc40eac167348c88d29fdb379c8b
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/type-utils@npm:8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/type-utils@npm:8.54.0"
@@ -1619,6 +3099,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/type-utils@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/type-utils@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/types": "npm:8.56.0"
+    "@typescript-eslint/typescript-estree": "npm:8.56.0"
+    "@typescript-eslint/utils": "npm:8.56.0"
+    debug: "npm:^4.4.3"
+    ts-api-utils: "npm:^2.4.0"
+  peerDependencies:
+    eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/4da61c36fa46f9d21a519a06b4ea6c91e9fa8a8e420fede41fb5d0f29866faa11641562b6e01c221ca6ec86bc0c3ecd7b8f11fc85b92277c3fd450ffc8fa2522
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/types@npm:8.54.0, @typescript-eslint/types@npm:^8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/types@npm:8.54.0"
@@ -1626,6 +3122,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/types@npm:8.56.0, @typescript-eslint/types@npm:^8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/types@npm:8.56.0"
+  checksum: 10c0/5deb4ebf5fa62f9f927f6aa45f7245aa03567e88941cd76e7b083175fd59fc40368a804ba7ff7581eac75706e42ddd5c77d2a60d6b1e76ab7865d559c9af9937
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/typescript-estree@npm:8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/typescript-estree@npm:8.54.0"
@@ -1645,6 +3148,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/typescript-estree@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/typescript-estree@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/project-service": "npm:8.56.0"
+    "@typescript-eslint/tsconfig-utils": "npm:8.56.0"
+    "@typescript-eslint/types": "npm:8.56.0"
+    "@typescript-eslint/visitor-keys": "npm:8.56.0"
+    debug: "npm:^4.4.3"
+    minimatch: "npm:^9.0.5"
+    semver: "npm:^7.7.3"
+    tinyglobby: "npm:^0.2.15"
+    ts-api-utils: "npm:^2.4.0"
+  peerDependencies:
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/cc2ba5bbfabb71c1510aea8fb8bf0d8385cabb9ca5b65a621e73f3088a91089a02aea56a9d9a31bd707593b5ba4d33d0aa2fcbdeee3cc7f4eca8226107523c28
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/utils@npm:8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/utils@npm:8.54.0"
@@ -1660,6 +3182,21 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/utils@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/utils@npm:8.56.0"
+  dependencies:
+    "@eslint-community/eslint-utils": "npm:^4.9.1"
+    "@typescript-eslint/scope-manager": "npm:8.56.0"
+    "@typescript-eslint/types": "npm:8.56.0"
+    "@typescript-eslint/typescript-estree": "npm:8.56.0"
+  peerDependencies:
+    eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/49545d399345bb4d8113d1001ec60c05c7e0d28fd44cb3c75128e58a53c9bf7ae8d0680ca089a4f37ab9eea8a3ef39011fc731eb4ad8dd4ab642849d84318645
+  languageName: node
+  linkType: hard
+
 "@typescript-eslint/visitor-keys@npm:8.54.0":
   version: 8.54.0
   resolution: "@typescript-eslint/visitor-keys@npm:8.54.0"
@@ -1670,6 +3207,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@typescript-eslint/visitor-keys@npm:8.56.0":
+  version: 8.56.0
+  resolution: "@typescript-eslint/visitor-keys@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/types": "npm:8.56.0"
+    eslint-visitor-keys: "npm:^5.0.0"
+  checksum: 10c0/4cb7668430042da70707ac5cad826348e808af94095aca1f3d07d39d566745a33991d3defccd1e687f1b1f8aeea52eeb47591933e962452eb51c4bcd88773c12
+  languageName: node
+  linkType: hard
+
 "@ungap/structured-clone@npm:^1.2.0":
   version: 1.3.0
   resolution: "@ungap/structured-clone@npm:1.3.0"
@@ -1677,19 +3224,19 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-react@npm:^4.0.0":
-  version: 4.7.0
-  resolution: "@vitejs/plugin-react@npm:4.7.0"
+"@vitejs/plugin-react@npm:^5.1.1":
+  version: 5.1.4
+  resolution: "@vitejs/plugin-react@npm:5.1.4"
   dependencies:
-    "@babel/core": "npm:^7.28.0"
+    "@babel/core": "npm:^7.29.0"
     "@babel/plugin-transform-react-jsx-self": "npm:^7.27.1"
     "@babel/plugin-transform-react-jsx-source": "npm:^7.27.1"
-    "@rolldown/pluginutils": "npm:1.0.0-beta.27"
+    "@rolldown/pluginutils": "npm:1.0.0-rc.3"
     "@types/babel__core": "npm:^7.20.5"
-    react-refresh: "npm:^0.17.0"
+    react-refresh: "npm:^0.18.0"
   peerDependencies:
     vite: ^4.2.0 || ^5.0.0 || ^6.0.0 || ^7.0.0
-  checksum: 10c0/692f23960972879485d647713663ec299c478222c96567d60285acf7c7dc5c178e71abfe9d2eefddef1eeb01514dacbc2ed68aad84628debf9c7116134734253
+  checksum: 10c0/dd7b8f40717ecd4a5ab18f467134ea8135f9a443359333d71e4114aeacfc8b679be9fd36dc12290d076c78883a02e708bfe1f0d93411c06c9659da0879b952e3
   languageName: node
   linkType: hard
 
@@ -1800,13 +3347,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"abab@npm:^2.0.6":
-  version: 2.0.6
-  resolution: "abab@npm:2.0.6"
-  checksum: 10c0/0b245c3c3ea2598fe0025abf7cc7bb507b06949d51e8edae5d12c1b847a0a0c09639abcb94788332b4e2044ac4491c1e8f571b51c7826fd4b0bda1685ad4a278
-  languageName: node
-  linkType: hard
-
 "abbrev@npm:^4.0.0":
   version: 4.0.0
   resolution: "abbrev@npm:4.0.0"
@@ -1857,15 +3397,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"agent-base@npm:6":
-  version: 6.0.2
-  resolution: "agent-base@npm:6.0.2"
-  dependencies:
-    debug: "npm:4"
-  checksum: 10c0/dc4f757e40b5f3e3d674bc9beb4f1048f4ee83af189bae39be99f57bf1f48dde166a8b0a5342a84b5944ee8e6ed1e5a9d801858f4ad44764e84957122fe46261
-  languageName: node
-  linkType: hard
-
 "agent-base@npm:^7.1.0, agent-base@npm:^7.1.2":
   version: 7.1.4
   resolution: "agent-base@npm:7.1.4"
@@ -1948,13 +3479,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"any-promise@npm:^1.0.0":
-  version: 1.3.0
-  resolution: "any-promise@npm:1.3.0"
-  checksum: 10c0/60f0298ed34c74fef50daab88e8dab786036ed5a7fad02e012ab57e376e0a0b4b29e83b95ea9b5e7d89df762f5f25119b83e00706ecaccb22cfbacee98d74889
-  languageName: node
-  linkType: hard
-
 "anymatch@npm:~3.1.2":
   version: 3.1.3
   resolution: "anymatch@npm:3.1.3"
@@ -1972,13 +3496,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"arg@npm:^5.0.2":
-  version: 5.0.2
-  resolution: "arg@npm:5.0.2"
-  checksum: 10c0/ccaf86f4e05d342af6666c569f844bec426595c567d32a8289715087825c2ca7edd8a3d204e4d2fb2aa4602e09a57d0c13ea8c9eea75aac3dbb4af5514e6800e
-  languageName: node
-  linkType: hard
-
 "argparse@npm:^2.0.1":
   version: 2.0.1
   resolution: "argparse@npm:2.0.1"
@@ -1986,29 +3503,12 @@ __metadata:
   languageName: node
   linkType: hard
 
-"aria-query@npm:5.1.3":
-  version: 5.1.3
-  resolution: "aria-query@npm:5.1.3"
+"aria-hidden@npm:^1.2.4":
+  version: 1.2.6
+  resolution: "aria-hidden@npm:1.2.6"
   dependencies:
-    deep-equal: "npm:^2.0.5"
-  checksum: 10c0/edcbc8044c4663d6f88f785e983e6784f98cb62b4ba1e9dd8d61b725d0203e4cfca38d676aee984c31f354103461102a3d583aa4fbe4fd0a89b679744f4e5faf
-  languageName: node
-  linkType: hard
-
-"aria-query@npm:^5.0.0":
-  version: 5.3.2
-  resolution: "aria-query@npm:5.3.2"
-  checksum: 10c0/003c7e3e2cff5540bf7a7893775fc614de82b0c5dde8ae823d47b7a28a9d4da1f7ed85f340bdb93d5649caa927755f0e31ecc7ab63edfdfc00c8ef07e505e03e
-  languageName: node
-  linkType: hard
-
-"array-buffer-byte-length@npm:^1.0.0":
-  version: 1.0.2
-  resolution: "array-buffer-byte-length@npm:1.0.2"
-  dependencies:
-    call-bound: "npm:^1.0.3"
-    is-array-buffer: "npm:^3.0.5"
-  checksum: 10c0/74e1d2d996941c7a1badda9cabb7caab8c449db9086407cad8a1b71d2604cc8abf105db8ca4e02c04579ec58b7be40279ddb09aea4784832984485499f48432d
+    tslib: "npm:^2.0.0"
+  checksum: 10c0/7720cb539497a9f760f68f98a4b30f22c6767aa0e72fa7d58279f7c164e258fc38b2699828f8de881aab0fc8e9c56d1313a3f1a965046fc0381a554dbc72b54a
   languageName: node
   linkType: hard
 
@@ -2047,7 +3547,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"autoprefixer@npm:^10.4.14":
+"autoprefixer@npm:^10.4.24":
   version: 10.4.24
   resolution: "autoprefixer@npm:10.4.24"
   dependencies:
@@ -2064,15 +3564,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"available-typed-arrays@npm:^1.0.7":
-  version: 1.0.7
-  resolution: "available-typed-arrays@npm:1.0.7"
-  dependencies:
-    possible-typed-array-names: "npm:^1.0.0"
-  checksum: 10c0/d07226ef4f87daa01bd0fe80f8f310982e345f372926da2e5296aecc25c41cab440916bbaa4c5e1034b453af3392f67df5961124e4b586df1e99793a1374bdb2
-  languageName: node
-  linkType: hard
-
 "avvio@npm:^8.3.0":
   version: 8.4.0
   resolution: "avvio@npm:8.4.0"
@@ -2083,6 +3574,17 @@ __metadata:
   languageName: node
   linkType: hard
 
+"axios@npm:^1.13.5":
+  version: 1.13.5
+  resolution: "axios@npm:1.13.5"
+  dependencies:
+    follow-redirects: "npm:^1.15.11"
+    form-data: "npm:^4.0.5"
+    proxy-from-env: "npm:^1.1.0"
+  checksum: 10c0/abf468c34f2d145f3dc7dbc0f1be67e520630624307bda69a41bbe8d386bd672d87b4405c4ee77f9ff54b235ab02f96a9968fb00e75b13ce64706e352a3068fd
+  languageName: node
+  linkType: hard
+
 "balanced-match@npm:^1.0.0":
   version: 1.0.2
   resolution: "balanced-match@npm:1.0.2"
@@ -2139,7 +3641,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"braces@npm:^3.0.3, braces@npm:~3.0.2":
+"braces@npm:~3.0.2":
   version: 3.0.3
   resolution: "braces@npm:3.0.3"
   dependencies:
@@ -2231,7 +3733,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"call-bind-apply-helpers@npm:^1.0.0, call-bind-apply-helpers@npm:^1.0.1, call-bind-apply-helpers@npm:^1.0.2":
+"call-bind-apply-helpers@npm:^1.0.1, call-bind-apply-helpers@npm:^1.0.2":
   version: 1.0.2
   resolution: "call-bind-apply-helpers@npm:1.0.2"
   dependencies:
@@ -2241,28 +3743,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"call-bind@npm:^1.0.2, call-bind@npm:^1.0.5, call-bind@npm:^1.0.7, call-bind@npm:^1.0.8":
-  version: 1.0.8
-  resolution: "call-bind@npm:1.0.8"
-  dependencies:
-    call-bind-apply-helpers: "npm:^1.0.0"
-    es-define-property: "npm:^1.0.0"
-    get-intrinsic: "npm:^1.2.4"
-    set-function-length: "npm:^1.2.2"
-  checksum: 10c0/a13819be0681d915144467741b69875ae5f4eba8961eb0bf322aab63ec87f8250eb6d6b0dcbb2e1349876412a56129ca338592b3829ef4343527f5f18a0752d4
-  languageName: node
-  linkType: hard
-
-"call-bound@npm:^1.0.2, call-bound@npm:^1.0.3, call-bound@npm:^1.0.4":
-  version: 1.0.4
-  resolution: "call-bound@npm:1.0.4"
-  dependencies:
-    call-bind-apply-helpers: "npm:^1.0.2"
-    get-intrinsic: "npm:^1.3.0"
-  checksum: 10c0/f4796a6a0941e71c766aea672f63b72bc61234c4f4964dc6d7606e3664c307e7d77845328a8f3359ce39ddb377fed67318f9ee203dea1d47e46165dcf2917644
-  languageName: node
-  linkType: hard
-
 "callsites@npm:^3.0.0":
   version: 3.1.0
   resolution: "callsites@npm:3.1.0"
@@ -2270,20 +3750,20 @@ __metadata:
   languageName: node
   linkType: hard
 
-"camelcase-css@npm:^2.0.1":
-  version: 2.0.1
-  resolution: "camelcase-css@npm:2.0.1"
-  checksum: 10c0/1a1a3137e8a781e6cbeaeab75634c60ffd8e27850de410c162cce222ea331cd1ba5364e8fb21c95e5ca76f52ac34b81a090925ca00a87221355746d049c6e273
-  languageName: node
-  linkType: hard
-
-"caniuse-lite@npm:^1.0.30001759, caniuse-lite@npm:^1.0.30001766":
+"caniuse-lite@npm:^1.0.30001759":
   version: 1.0.30001769
   resolution: "caniuse-lite@npm:1.0.30001769"
   checksum: 10c0/161b8c30ab967371807d45d361f0d5bc06e38ef2dbf811493d70cd97c21e1522f5b91fd944c419a00047ee09c931ca64627f125a9ffa7a17a9fdff8dad9765b0
   languageName: node
   linkType: hard
 
+"caniuse-lite@npm:^1.0.30001766":
+  version: 1.0.30001772
+  resolution: "caniuse-lite@npm:1.0.30001772"
+  checksum: 10c0/62a29a47e4b728f7e927301392733c3982af74293ccf523e63eafc06f70b66fe48d51a6b6272e4fe34e57af9dced8ef7a3c611f21b51b999c6bed793bb7c7ede
+  languageName: node
+  linkType: hard
+
 "chai@npm:^4.3.10, chai@npm:^4.3.7":
   version: 4.5.0
   resolution: "chai@npm:4.5.0"
@@ -2299,7 +3779,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"chalk@npm:^4.0.0, chalk@npm:^4.1.0":
+"chalk@npm:^4.0.0":
   version: 4.1.2
   resolution: "chalk@npm:4.1.2"
   dependencies:
@@ -2318,7 +3798,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"chokidar@npm:^3.5.1, chokidar@npm:^3.6.0":
+"chokidar@npm:^3.5.1":
   version: 3.6.0
   resolution: "chokidar@npm:3.6.0"
   dependencies:
@@ -2369,6 +3849,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"class-variance-authority@npm:^0.7.1":
+  version: 0.7.1
+  resolution: "class-variance-authority@npm:0.7.1"
+  dependencies:
+    clsx: "npm:^2.1.1"
+  checksum: 10c0/0f438cea22131808b99272de0fa933c2532d5659773bfec0c583de7b3f038378996d3350683426b8e9c74a6286699382106d71fbec52f0dd5fbb191792cccb5b
+  languageName: node
+  linkType: hard
+
+"clsx@npm:^2.1.1":
+  version: 2.1.1
+  resolution: "clsx@npm:2.1.1"
+  checksum: 10c0/c4c8eb865f8c82baab07e71bfa8897c73454881c4f99d6bc81585aecd7c441746c1399d08363dc096c550cceaf97bd4ce1e8854e1771e9998d9f94c4fe075839
+  languageName: node
+  linkType: hard
+
 "color-convert@npm:^2.0.1":
   version: 2.0.1
   resolution: "color-convert@npm:2.0.1"
@@ -2394,13 +3890,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"commander@npm:^4.0.0":
-  version: 4.1.1
-  resolution: "commander@npm:4.1.1"
-  checksum: 10c0/84a76c08fe6cc08c9c93f62ac573d2907d8e79138999312c92d4155bc2325d487d64d13f669b2000c9f8caf70493c1be2dac74fec3c51d5a04f8bc3ae1830bab
-  languageName: node
-  linkType: hard
-
 "concat-map@npm:0.0.1":
   version: 0.0.1
   resolution: "concat-map@npm:0.0.1"
@@ -2452,6 +3941,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cookie-es@npm:^2.0.0":
+  version: 2.0.0
+  resolution: "cookie-es@npm:2.0.0"
+  checksum: 10c0/3b2459030a5ad2bc715aeb27a32f274340670bfc5031ac29e1fba804212517411bb617880d3fe66ace2b64dfb28f3049e2d1ff40d4bec342154ccdd124deaeaa
+  languageName: node
+  linkType: hard
+
 "cookie@npm:^0.7.0":
   version: 0.7.2
   resolution: "cookie@npm:0.7.2"
@@ -2477,31 +3973,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"css.escape@npm:^1.5.1":
-  version: 1.5.1
-  resolution: "css.escape@npm:1.5.1"
-  checksum: 10c0/5e09035e5bf6c2c422b40c6df2eb1529657a17df37fda5d0433d722609527ab98090baf25b13970ca754079a0f3161dd3dfc0e743563ded8cfa0749d861c1525
-  languageName: node
-  linkType: hard
-
-"cssesc@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "cssesc@npm:3.0.0"
-  bin:
-    cssesc: bin/cssesc
-  checksum: 10c0/6bcfd898662671be15ae7827120472c5667afb3d7429f1f917737f3bf84c4176003228131b643ae74543f17a394446247df090c597bb9a728cce298606ed0aa7
-  languageName: node
-  linkType: hard
-
-"cssstyle@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "cssstyle@npm:3.0.0"
-  dependencies:
-    rrweb-cssom: "npm:^0.6.0"
-  checksum: 10c0/23acee092c1cec670fb7b8110e48abd740dc4e574d3b74848743067cb3377a86a1f64cf02606aabd7bb153785e68c2c1e09ce53295ddf7a4b470b3c7c55ec807
-  languageName: node
-  linkType: hard
-
 "csstype@npm:^3.2.2":
   version: 3.2.3
   resolution: "csstype@npm:3.2.3"
@@ -2509,14 +3980,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"data-urls@npm:^4.0.0":
-  version: 4.0.0
-  resolution: "data-urls@npm:4.0.0"
-  dependencies:
-    abab: "npm:^2.0.6"
-    whatwg-mimetype: "npm:^3.0.0"
-    whatwg-url: "npm:^12.0.0"
-  checksum: 10c0/928d9a21db31d3dcee125d514fddfeb88067c348b1225e9d2c6ca55db16e1cbe49bf58c092cae7163de958f415fd5c612c2aef2eef87896e097656fce205d766
+"date-fns@npm:^4.1.0":
+  version: 4.1.0
+  resolution: "date-fns@npm:4.1.0"
+  checksum: 10c0/b79ff32830e6b7faa009590af6ae0fb8c3fd9ffad46d930548fbb5acf473773b4712ae887e156ba91a7b3dc30591ce0f517d69fd83bd9c38650fdc03b4e0bac8
   languageName: node
   linkType: hard
 
@@ -2541,13 +4008,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"decimal.js@npm:^10.4.3":
-  version: 10.6.0
-  resolution: "decimal.js@npm:10.6.0"
-  checksum: 10c0/07d69fbcc54167a340d2d97de95f546f9ff1f69d2b45a02fd7a5292412df3cd9eb7e23065e532a318f5474a2e1bccf8392fdf0443ef467f97f3bf8cb0477e5aa
-  languageName: node
-  linkType: hard
-
 "deep-eql@npm:^4.1.3":
   version: 4.1.4
   resolution: "deep-eql@npm:4.1.4"
@@ -2557,32 +4017,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"deep-equal@npm:^2.0.5":
-  version: 2.2.3
-  resolution: "deep-equal@npm:2.2.3"
-  dependencies:
-    array-buffer-byte-length: "npm:^1.0.0"
-    call-bind: "npm:^1.0.5"
-    es-get-iterator: "npm:^1.1.3"
-    get-intrinsic: "npm:^1.2.2"
-    is-arguments: "npm:^1.1.1"
-    is-array-buffer: "npm:^3.0.2"
-    is-date-object: "npm:^1.0.5"
-    is-regex: "npm:^1.1.4"
-    is-shared-array-buffer: "npm:^1.0.2"
-    isarray: "npm:^2.0.5"
-    object-is: "npm:^1.1.5"
-    object-keys: "npm:^1.1.1"
-    object.assign: "npm:^4.1.4"
-    regexp.prototype.flags: "npm:^1.5.1"
-    side-channel: "npm:^1.0.4"
-    which-boxed-primitive: "npm:^1.0.2"
-    which-collection: "npm:^1.0.1"
-    which-typed-array: "npm:^1.1.13"
-  checksum: 10c0/a48244f90fa989f63ff5ef0cc6de1e4916b48ea0220a9c89a378561960814794a5800c600254482a2c8fd2e49d6c2e196131dc983976adb024c94a42dfe4949f
-  languageName: node
-  linkType: hard
-
 "deep-is@npm:^0.1.3":
   version: 0.1.4
   resolution: "deep-is@npm:0.1.4"
@@ -2597,28 +4031,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"define-data-property@npm:^1.0.1, define-data-property@npm:^1.1.4":
-  version: 1.1.4
-  resolution: "define-data-property@npm:1.1.4"
-  dependencies:
-    es-define-property: "npm:^1.0.0"
-    es-errors: "npm:^1.3.0"
-    gopd: "npm:^1.0.1"
-  checksum: 10c0/dea0606d1483eb9db8d930d4eac62ca0fa16738b0b3e07046cddfacf7d8c868bbe13fa0cb263eb91c7d0d527960dc3f2f2471a69ed7816210307f6744fe62e37
-  languageName: node
-  linkType: hard
-
-"define-properties@npm:^1.2.1":
-  version: 1.2.1
-  resolution: "define-properties@npm:1.2.1"
-  dependencies:
-    define-data-property: "npm:^1.0.1"
-    has-property-descriptors: "npm:^1.0.0"
-    object-keys: "npm:^1.1.1"
-  checksum: 10c0/88a152319ffe1396ccc6ded510a3896e77efac7a1bfbaa174a7b00414a1747377e0bb525d303794a47cf30e805c2ec84e575758512c6e44a993076d29fd4e6c3
-  languageName: node
-  linkType: hard
-
 "defu@npm:^6.1.4":
   version: 6.1.4
   resolution: "defu@npm:6.1.4"
@@ -2640,10 +4052,17 @@ __metadata:
   languageName: node
   linkType: hard
 
-"didyoumean@npm:^1.2.2":
-  version: 1.2.2
-  resolution: "didyoumean@npm:1.2.2"
-  checksum: 10c0/95d0b53d23b851aacff56dfadb7ecfedce49da4232233baecfeecb7710248c4aa03f0aa8995062f0acafaf925adf8536bd7044a2e68316fd7d411477599bc27b
+"detect-libc@npm:^2.0.3":
+  version: 2.1.2
+  resolution: "detect-libc@npm:2.1.2"
+  checksum: 10c0/acc675c29a5649fa1fb6e255f993b8ee829e510b6b56b0910666949c80c364738833417d0edb5f90e4e46be17228b0f2b66a010513984e18b15deeeac49369c4
+  languageName: node
+  linkType: hard
+
+"detect-node-es@npm:^1.1.0":
+  version: 1.1.0
+  resolution: "detect-node-es@npm:1.1.0"
+  checksum: 10c0/e562f00de23f10c27d7119e1af0e7388407eb4b06596a25f6d79a360094a109ff285de317f02b090faae093d314cf6e73ac3214f8a5bb3a0def5bece94557fbe
   languageName: node
   linkType: hard
 
@@ -2661,13 +4080,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"dlv@npm:^1.1.3":
-  version: 1.1.3
-  resolution: "dlv@npm:1.1.3"
-  checksum: 10c0/03eb4e769f19a027fd5b43b59e8a05e3fd2100ac239ebb0bf9a745de35d449e2f25cfaf3aa3934664551d72856f4ae8b7822016ce5c42c2d27c18ae79429ec42
-  languageName: node
-  linkType: hard
-
 "doctrine@npm:^3.0.0":
   version: 3.0.0
   resolution: "doctrine@npm:3.0.0"
@@ -2677,29 +4089,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"dom-accessibility-api@npm:^0.5.9":
-  version: 0.5.16
-  resolution: "dom-accessibility-api@npm:0.5.16"
-  checksum: 10c0/b2c2eda4fae568977cdac27a9f0c001edf4f95a6a6191dfa611e3721db2478d1badc01db5bb4fa8a848aeee13e442a6c2a4386d65ec65a1436f24715a2f8d053
-  languageName: node
-  linkType: hard
-
-"dom-accessibility-api@npm:^0.6.3":
-  version: 0.6.3
-  resolution: "dom-accessibility-api@npm:0.6.3"
-  checksum: 10c0/10bee5aa514b2a9a37c87cd81268db607a2e933a050074abc2f6fa3da9080ebed206a320cbc123567f2c3087d22292853bdfdceaffdd4334ffe2af9510b29360
-  languageName: node
-  linkType: hard
-
-"domexception@npm:^4.0.0":
-  version: 4.0.0
-  resolution: "domexception@npm:4.0.0"
-  dependencies:
-    webidl-conversions: "npm:^7.0.0"
-  checksum: 10c0/774277cd9d4df033f852196e3c0077a34dbd15a96baa4d166e0e47138a80f4c0bdf0d94e4703e6ff5883cec56bb821a6fff84402d8a498e31de7c87eb932a294
-  languageName: node
-  linkType: hard
-
 "dotenv@npm:^16.0.0, dotenv@npm:^16.6.1":
   version: 16.6.1
   resolution: "dotenv@npm:16.6.1"
@@ -2760,10 +4149,13 @@ __metadata:
   languageName: node
   linkType: hard
 
-"entities@npm:^6.0.0":
-  version: 6.0.1
-  resolution: "entities@npm:6.0.1"
-  checksum: 10c0/ed836ddac5acb34341094eb495185d527bd70e8632b6c0d59548cbfa23defdbae70b96f9a405c82904efa421230b5b3fd2283752447d737beffd3f3e6ee74414
+"enhanced-resolve@npm:^5.19.0":
+  version: 5.19.0
+  resolution: "enhanced-resolve@npm:5.19.0"
+  dependencies:
+    graceful-fs: "npm:^4.2.4"
+    tapable: "npm:^2.3.0"
+  checksum: 10c0/966b1dffb82d5f6a4d6a86e904e812104a999066aa29f9223040aaa751e7c453b462a3f5ef91f8bd4408131ff6f7f90651dd1c804bdcb7944e2099a9c2e45ee2
   languageName: node
   linkType: hard
 
@@ -2781,7 +4173,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"es-define-property@npm:^1.0.0, es-define-property@npm:^1.0.1":
+"es-define-property@npm:^1.0.1":
   version: 1.0.1
   resolution: "es-define-property@npm:1.0.1"
   checksum: 10c0/3f54eb49c16c18707949ff25a1456728c883e81259f045003499efba399c08bad00deebf65cccde8c0e07908c1a225c9d472b7107e558f2a48e28d530e34527c
@@ -2795,23 +4187,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"es-get-iterator@npm:^1.1.3":
-  version: 1.1.3
-  resolution: "es-get-iterator@npm:1.1.3"
-  dependencies:
-    call-bind: "npm:^1.0.2"
-    get-intrinsic: "npm:^1.1.3"
-    has-symbols: "npm:^1.0.3"
-    is-arguments: "npm:^1.1.1"
-    is-map: "npm:^2.0.2"
-    is-set: "npm:^2.0.2"
-    is-string: "npm:^1.0.7"
-    isarray: "npm:^2.0.5"
-    stop-iteration-iterator: "npm:^1.0.0"
-  checksum: 10c0/ebd11effa79851ea75d7f079405f9d0dc185559fd65d986c6afea59a0ff2d46c2ed8675f19f03dce7429d7f6c14ff9aede8d121fbab78d75cfda6a263030bac0
-  languageName: node
-  linkType: hard
-
 "es-object-atoms@npm:^1.0.0, es-object-atoms@npm:^1.1.1":
   version: 1.1.1
   resolution: "es-object-atoms@npm:1.1.1"
@@ -2990,6 +4365,95 @@ __metadata:
   languageName: node
   linkType: hard
 
+"esbuild@npm:^0.27.0":
+  version: 0.27.3
+  resolution: "esbuild@npm:0.27.3"
+  dependencies:
+    "@esbuild/aix-ppc64": "npm:0.27.3"
+    "@esbuild/android-arm": "npm:0.27.3"
+    "@esbuild/android-arm64": "npm:0.27.3"
+    "@esbuild/android-x64": "npm:0.27.3"
+    "@esbuild/darwin-arm64": "npm:0.27.3"
+    "@esbuild/darwin-x64": "npm:0.27.3"
+    "@esbuild/freebsd-arm64": "npm:0.27.3"
+    "@esbuild/freebsd-x64": "npm:0.27.3"
+    "@esbuild/linux-arm": "npm:0.27.3"
+    "@esbuild/linux-arm64": "npm:0.27.3"
+    "@esbuild/linux-ia32": "npm:0.27.3"
+    "@esbuild/linux-loong64": "npm:0.27.3"
+    "@esbuild/linux-mips64el": "npm:0.27.3"
+    "@esbuild/linux-ppc64": "npm:0.27.3"
+    "@esbuild/linux-riscv64": "npm:0.27.3"
+    "@esbuild/linux-s390x": "npm:0.27.3"
+    "@esbuild/linux-x64": "npm:0.27.3"
+    "@esbuild/netbsd-arm64": "npm:0.27.3"
+    "@esbuild/netbsd-x64": "npm:0.27.3"
+    "@esbuild/openbsd-arm64": "npm:0.27.3"
+    "@esbuild/openbsd-x64": "npm:0.27.3"
+    "@esbuild/openharmony-arm64": "npm:0.27.3"
+    "@esbuild/sunos-x64": "npm:0.27.3"
+    "@esbuild/win32-arm64": "npm:0.27.3"
+    "@esbuild/win32-ia32": "npm:0.27.3"
+    "@esbuild/win32-x64": "npm:0.27.3"
+  dependenciesMeta:
+    "@esbuild/aix-ppc64":
+      optional: true
+    "@esbuild/android-arm":
+      optional: true
+    "@esbuild/android-arm64":
+      optional: true
+    "@esbuild/android-x64":
+      optional: true
+    "@esbuild/darwin-arm64":
+      optional: true
+    "@esbuild/darwin-x64":
+      optional: true
+    "@esbuild/freebsd-arm64":
+      optional: true
+    "@esbuild/freebsd-x64":
+      optional: true
+    "@esbuild/linux-arm":
+      optional: true
+    "@esbuild/linux-arm64":
+      optional: true
+    "@esbuild/linux-ia32":
+      optional: true
+    "@esbuild/linux-loong64":
+      optional: true
+    "@esbuild/linux-mips64el":
+      optional: true
+    "@esbuild/linux-ppc64":
+      optional: true
+    "@esbuild/linux-riscv64":
+      optional: true
+    "@esbuild/linux-s390x":
+      optional: true
+    "@esbuild/linux-x64":
+      optional: true
+    "@esbuild/netbsd-arm64":
+      optional: true
+    "@esbuild/netbsd-x64":
+      optional: true
+    "@esbuild/openbsd-arm64":
+      optional: true
+    "@esbuild/openbsd-x64":
+      optional: true
+    "@esbuild/openharmony-arm64":
+      optional: true
+    "@esbuild/sunos-x64":
+      optional: true
+    "@esbuild/win32-arm64":
+      optional: true
+    "@esbuild/win32-ia32":
+      optional: true
+    "@esbuild/win32-x64":
+      optional: true
+  bin:
+    esbuild: bin/esbuild
+  checksum: 10c0/fdc3f87a3f08b3ef98362f37377136c389a0d180fda4b8d073b26ba930cf245521db0a368f119cc7624bc619248fff1439f5811f062d853576f8ffa3df8ee5f1
+  languageName: node
+  linkType: hard
+
 "escalade@npm:^3.2.0":
   version: 3.2.0
   resolution: "escalade@npm:3.2.0"
@@ -3035,6 +4499,30 @@ __metadata:
   languageName: node
   linkType: hard
 
+"eslint-plugin-react-hooks@npm:^7.0.1":
+  version: 7.0.1
+  resolution: "eslint-plugin-react-hooks@npm:7.0.1"
+  dependencies:
+    "@babel/core": "npm:^7.24.4"
+    "@babel/parser": "npm:^7.24.4"
+    hermes-parser: "npm:^0.25.1"
+    zod: "npm:^3.25.0 || ^4.0.0"
+    zod-validation-error: "npm:^3.5.0 || ^4.0.0"
+  peerDependencies:
+    eslint: ^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0 || ^9.0.0
+  checksum: 10c0/1e711d1a9d1fa9cfc51fa1572500656577201199c70c795c6a27adfc1df39e5c598f69aab6aa91117753d23cc1f11388579a2bed14921cf9a4efe60ae8618496
+  languageName: node
+  linkType: hard
+
+"eslint-plugin-react-refresh@npm:^0.4.24":
+  version: 0.4.26
+  resolution: "eslint-plugin-react-refresh@npm:0.4.26"
+  peerDependencies:
+    eslint: ">=8.40"
+  checksum: 10c0/11c2b25b7a7025e621b02970c4cf3815b0b77486027df9f8bb731cc52972156804fd163b0f99404b33e36a3c60cd1a1be8199ba64c66b5276da3173bbb5ab6e7
+  languageName: node
+  linkType: hard
+
 "eslint-scope@npm:^7.2.2":
   version: 7.2.2
   resolution: "eslint-scope@npm:7.2.2"
@@ -3045,6 +4533,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"eslint-scope@npm:^8.4.0":
+  version: 8.4.0
+  resolution: "eslint-scope@npm:8.4.0"
+  dependencies:
+    esrecurse: "npm:^4.3.0"
+    estraverse: "npm:^5.2.0"
+  checksum: 10c0/407f6c600204d0f3705bd557f81bd0189e69cd7996f408f8971ab5779c0af733d1af2f1412066b40ee1588b085874fc37a2333986c6521669cdbdd36ca5058e0
+  languageName: node
+  linkType: hard
+
 "eslint-scope@npm:^9.1.0":
   version: 9.1.0
   resolution: "eslint-scope@npm:9.1.0"
@@ -3171,7 +4669,56 @@ __metadata:
   languageName: node
   linkType: hard
 
-"espree@npm:^10.0.1":
+"eslint@npm:^9.39.1":
+  version: 9.39.3
+  resolution: "eslint@npm:9.39.3"
+  dependencies:
+    "@eslint-community/eslint-utils": "npm:^4.8.0"
+    "@eslint-community/regexpp": "npm:^4.12.1"
+    "@eslint/config-array": "npm:^0.21.1"
+    "@eslint/config-helpers": "npm:^0.4.2"
+    "@eslint/core": "npm:^0.17.0"
+    "@eslint/eslintrc": "npm:^3.3.1"
+    "@eslint/js": "npm:9.39.3"
+    "@eslint/plugin-kit": "npm:^0.4.1"
+    "@humanfs/node": "npm:^0.16.6"
+    "@humanwhocodes/module-importer": "npm:^1.0.1"
+    "@humanwhocodes/retry": "npm:^0.4.2"
+    "@types/estree": "npm:^1.0.6"
+    ajv: "npm:^6.12.4"
+    chalk: "npm:^4.0.0"
+    cross-spawn: "npm:^7.0.6"
+    debug: "npm:^4.3.2"
+    escape-string-regexp: "npm:^4.0.0"
+    eslint-scope: "npm:^8.4.0"
+    eslint-visitor-keys: "npm:^4.2.1"
+    espree: "npm:^10.4.0"
+    esquery: "npm:^1.5.0"
+    esutils: "npm:^2.0.2"
+    fast-deep-equal: "npm:^3.1.3"
+    file-entry-cache: "npm:^8.0.0"
+    find-up: "npm:^5.0.0"
+    glob-parent: "npm:^6.0.2"
+    ignore: "npm:^5.2.0"
+    imurmurhash: "npm:^0.1.4"
+    is-glob: "npm:^4.0.0"
+    json-stable-stringify-without-jsonify: "npm:^1.0.1"
+    lodash.merge: "npm:^4.6.2"
+    minimatch: "npm:^3.1.2"
+    natural-compare: "npm:^1.4.0"
+    optionator: "npm:^0.9.3"
+  peerDependencies:
+    jiti: "*"
+  peerDependenciesMeta:
+    jiti:
+      optional: true
+  bin:
+    eslint: bin/eslint.js
+  checksum: 10c0/5e5dbf84d4f604f5d2d7a58c5c3fcdde30a01b8973ff3caeca8b2bacc16066717cedb4385ce52db1a2746d0b621770d4d4227cc7f44982b0b03818be2c31538d
+  languageName: node
+  linkType: hard
+
+"espree@npm:^10.0.1, espree@npm:^10.4.0":
   version: 10.4.0
   resolution: "espree@npm:10.4.0"
   dependencies:
@@ -3204,7 +4751,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"esquery@npm:^1.4.2, esquery@npm:^1.7.0":
+"esquery@npm:^1.4.2, esquery@npm:^1.5.0, esquery@npm:^1.7.0":
   version: 1.7.0
   resolution: "esquery@npm:1.7.0"
   dependencies:
@@ -3301,19 +4848,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"fast-glob@npm:^3.3.2":
-  version: 3.3.3
-  resolution: "fast-glob@npm:3.3.3"
-  dependencies:
-    "@nodelib/fs.stat": "npm:^2.0.2"
-    "@nodelib/fs.walk": "npm:^1.2.3"
-    glob-parent: "npm:^5.1.2"
-    merge2: "npm:^1.3.0"
-    micromatch: "npm:^4.0.8"
-  checksum: 10c0/f6aaa141d0d3384cf73cbcdfc52f475ed293f6d5b65bfc5def368b09163a9f7e5ec2b3014d80f733c405f58e470ee0cc451c2937685045cddcdeaa24199c43fe
-  languageName: node
-  linkType: hard
-
 "fast-json-stable-stringify@npm:^2.0.0":
   version: 2.1.0
   resolution: "fast-json-stable-stringify@npm:2.1.0"
@@ -3519,16 +5053,17 @@ __metadata:
   languageName: node
   linkType: hard
 
-"for-each@npm:^0.3.5":
-  version: 0.3.5
-  resolution: "for-each@npm:0.3.5"
-  dependencies:
-    is-callable: "npm:^1.2.7"
-  checksum: 10c0/0e0b50f6a843a282637d43674d1fb278dda1dd85f4f99b640024cfb10b85058aac0cc781bf689d5fe50b4b7f638e91e548560723a4e76e04fe96ae35ef039cee
+"follow-redirects@npm:^1.15.11":
+  version: 1.15.11
+  resolution: "follow-redirects@npm:1.15.11"
+  peerDependenciesMeta:
+    debug:
+      optional: true
+  checksum: 10c0/d301f430542520a54058d4aeeb453233c564aaccac835d29d15e050beb33f339ad67d9bddbce01739c5dc46a6716dbe3d9d0d5134b1ca203effa11a7ef092343
   languageName: node
   linkType: hard
 
-"form-data@npm:^4.0.0":
+"form-data@npm:^4.0.5":
   version: 4.0.5
   resolution: "form-data@npm:4.0.5"
   dependencies:
@@ -3555,6 +5090,51 @@ __metadata:
   languageName: node
   linkType: hard
 
+"frontend@workspace:frontend":
+  version: 0.0.0-use.local
+  resolution: "frontend@workspace:frontend"
+  dependencies:
+    "@eslint/js": "npm:^9.39.1"
+    "@radix-ui/react-checkbox": "npm:^1.3.3"
+    "@radix-ui/react-dialog": "npm:^1.1.15"
+    "@radix-ui/react-dropdown-menu": "npm:^2.1.16"
+    "@radix-ui/react-label": "npm:^2.1.8"
+    "@radix-ui/react-scroll-area": "npm:^1.2.10"
+    "@radix-ui/react-select": "npm:^2.2.6"
+    "@radix-ui/react-slot": "npm:^1.2.4"
+    "@radix-ui/react-tabs": "npm:^1.1.13"
+    "@radix-ui/react-toast": "npm:^1.2.15"
+    "@tailwindcss/postcss": "npm:^4.2.0"
+    "@tanstack/react-form": "npm:^1.28.3"
+    "@tanstack/react-query": "npm:^5.90.21"
+    "@tanstack/react-router": "npm:^1.162.2"
+    "@types/node": "npm:^24.10.1"
+    "@types/react": "npm:^19.2.7"
+    "@types/react-dom": "npm:^19.2.3"
+    "@vitejs/plugin-react": "npm:^5.1.1"
+    autoprefixer: "npm:^10.4.24"
+    axios: "npm:^1.13.5"
+    class-variance-authority: "npm:^0.7.1"
+    clsx: "npm:^2.1.1"
+    date-fns: "npm:^4.1.0"
+    eslint: "npm:^9.39.1"
+    eslint-plugin-react-hooks: "npm:^7.0.1"
+    eslint-plugin-react-refresh: "npm:^0.4.24"
+    globals: "npm:^16.5.0"
+    lucide-react: "npm:^0.575.0"
+    postcss: "npm:^8.5.6"
+    react: "npm:^19.2.0"
+    react-dom: "npm:^19.2.0"
+    tailwind-merge: "npm:^3.5.0"
+    tailwindcss: "npm:^4.2.0"
+    tailwindcss-animate: "npm:^1.0.7"
+    typescript: "npm:~5.9.3"
+    typescript-eslint: "npm:^8.48.0"
+    vite: "npm:^7.3.1"
+    zod: "npm:^4.3.6"
+  languageName: unknown
+  linkType: soft
+
 "fs-minipass@npm:^3.0.0":
   version: 3.0.3
   resolution: "fs-minipass@npm:3.0.3"
@@ -3616,13 +5196,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"functions-have-names@npm:^1.2.3":
-  version: 1.2.3
-  resolution: "functions-have-names@npm:1.2.3"
-  checksum: 10c0/33e77fd29bddc2d9bb78ab3eb854c165909201f88c75faa8272e35899e2d35a8a642a15e7420ef945e1f64a9670d6aa3ec744106b2aa42be68ca5114025954ca
-  languageName: node
-  linkType: hard
-
 "generator-function@npm:^2.0.0":
   version: 2.0.1
   resolution: "generator-function@npm:2.0.1"
@@ -3644,7 +5217,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"get-intrinsic@npm:^1.1.3, get-intrinsic@npm:^1.2.2, get-intrinsic@npm:^1.2.4, get-intrinsic@npm:^1.2.5, get-intrinsic@npm:^1.2.6, get-intrinsic@npm:^1.3.0":
+"get-intrinsic@npm:^1.2.6":
   version: 1.3.1
   resolution: "get-intrinsic@npm:1.3.1"
   dependencies:
@@ -3665,6 +5238,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"get-nonce@npm:^1.0.0":
+  version: 1.0.1
+  resolution: "get-nonce@npm:1.0.1"
+  checksum: 10c0/2d7df55279060bf0568549e1ffc9b84bc32a32b7541675ca092dce56317cdd1a59a98dcc4072c9f6a980779440139a3221d7486f52c488e69dc0fd27b1efb162
+  languageName: node
+  linkType: hard
+
 "get-proto@npm:^1.0.1":
   version: 1.0.1
   resolution: "get-proto@npm:1.0.1"
@@ -3691,15 +5271,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"glob-parent@npm:^5.1.2, glob-parent@npm:~5.1.2":
-  version: 5.1.2
-  resolution: "glob-parent@npm:5.1.2"
-  dependencies:
-    is-glob: "npm:^4.0.1"
-  checksum: 10c0/cab87638e2112bee3f839ef5f6e0765057163d39c66be8ec1602f3823da4692297ad4e972de876ea17c44d652978638d2fd583c6713d0eb6591706825020c9ee
-  languageName: node
-  linkType: hard
-
 "glob-parent@npm:^6.0.2":
   version: 6.0.2
   resolution: "glob-parent@npm:6.0.2"
@@ -3709,6 +5280,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"glob-parent@npm:~5.1.2":
+  version: 5.1.2
+  resolution: "glob-parent@npm:5.1.2"
+  dependencies:
+    is-glob: "npm:^4.0.1"
+  checksum: 10c0/cab87638e2112bee3f839ef5f6e0765057163d39c66be8ec1602f3823da4692297ad4e972de876ea17c44d652978638d2fd583c6713d0eb6591706825020c9ee
+  languageName: node
+  linkType: hard
+
 "glob@npm:^13.0.0":
   version: 13.0.1
   resolution: "glob@npm:13.0.1"
@@ -3750,14 +5330,21 @@ __metadata:
   languageName: node
   linkType: hard
 
-"gopd@npm:^1.0.1, gopd@npm:^1.2.0":
+"globals@npm:^16.5.0":
+  version: 16.5.0
+  resolution: "globals@npm:16.5.0"
+  checksum: 10c0/615241dae7851c8012f5aa0223005b1ed6607713d6813de0741768bd4ddc39353117648f1a7086b4b0fa45eae733f1c0a0fe369aa4e543bb63f8de8990178ea9
+  languageName: node
+  linkType: hard
+
+"gopd@npm:^1.2.0":
   version: 1.2.0
   resolution: "gopd@npm:1.2.0"
   checksum: 10c0/50fff1e04ba2b7737c097358534eacadad1e68d24cccee3272e04e007bed008e68d2614f3987788428fd192a5ae3889d08fb2331417e4fc4a9ab366b2043cead
   languageName: node
   linkType: hard
 
-"graceful-fs@npm:^4.2.6":
+"graceful-fs@npm:^4.2.4, graceful-fs@npm:^4.2.6":
   version: 4.2.11
   resolution: "graceful-fs@npm:4.2.11"
   checksum: 10c0/386d011a553e02bc594ac2ca0bd6d9e4c22d7fa8cfbfc448a6d148c59ea881b092db9dbe3547ae4b88e55f1b01f7c4a2ecc53b310c042793e63aa44cf6c257f2
@@ -3771,13 +5358,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"has-bigints@npm:^1.0.2":
-  version: 1.1.0
-  resolution: "has-bigints@npm:1.1.0"
-  checksum: 10c0/2de0cdc4a1ccf7a1e75ffede1876994525ac03cc6f5ae7392d3415dd475cd9eee5bceec63669ab61aa997ff6cceebb50ef75561c7002bed8988de2b9d1b40788
-  languageName: node
-  linkType: hard
-
 "has-flag@npm:^4.0.0":
   version: 4.0.0
   resolution: "has-flag@npm:4.0.0"
@@ -3785,15 +5365,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"has-property-descriptors@npm:^1.0.0, has-property-descriptors@npm:^1.0.2":
-  version: 1.0.2
-  resolution: "has-property-descriptors@npm:1.0.2"
-  dependencies:
-    es-define-property: "npm:^1.0.0"
-  checksum: 10c0/253c1f59e80bb476cf0dde8ff5284505d90c3bdb762983c3514d36414290475fe3fd6f574929d84de2a8eec00d35cf07cb6776205ff32efd7c50719125f00236
-  languageName: node
-  linkType: hard
-
 "has-symbols@npm:^1.0.3, has-symbols@npm:^1.1.0":
   version: 1.1.0
   resolution: "has-symbols@npm:1.1.0"
@@ -3826,12 +5397,19 @@ __metadata:
   languageName: node
   linkType: hard
 
-"html-encoding-sniffer@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "html-encoding-sniffer@npm:3.0.0"
+"hermes-estree@npm:0.25.1":
+  version: 0.25.1
+  resolution: "hermes-estree@npm:0.25.1"
+  checksum: 10c0/48be3b2fa37a0cbc77a112a89096fa212f25d06de92781b163d67853d210a8a5c3784fac23d7d48335058f7ed283115c87b4332c2a2abaaccc76d0ead1a282ac
+  languageName: node
+  linkType: hard
+
+"hermes-parser@npm:^0.25.1":
+  version: 0.25.1
+  resolution: "hermes-parser@npm:0.25.1"
   dependencies:
-    whatwg-encoding: "npm:^2.0.0"
-  checksum: 10c0/b17b3b0fb5d061d8eb15121c3b0b536376c3e295ecaf09ba48dd69c6b6c957839db124fe1e2b3f11329753a4ee01aa7dedf63b7677999e86da17fbbdd82c5386
+    hermes-estree: "npm:0.25.1"
+  checksum: 10c0/3abaa4c6f1bcc25273f267297a89a4904963ea29af19b8e4f6eabe04f1c2c7e9abd7bfc4730ddb1d58f2ea04b6fee74053d8bddb5656ec6ebf6c79cc8d14202c
   languageName: node
   linkType: hard
 
@@ -3842,17 +5420,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"http-proxy-agent@npm:^5.0.0":
-  version: 5.0.0
-  resolution: "http-proxy-agent@npm:5.0.0"
-  dependencies:
-    "@tootallnate/once": "npm:2"
-    agent-base: "npm:6"
-    debug: "npm:4"
-  checksum: 10c0/32a05e413430b2c1e542e5c74b38a9f14865301dd69dff2e53ddb684989440e3d2ce0c4b64d25eb63cf6283e6265ff979a61cf93e3ca3d23047ddfdc8df34a32
-  languageName: node
-  linkType: hard
-
 "http-proxy-agent@npm:^7.0.0":
   version: 7.0.2
   resolution: "http-proxy-agent@npm:7.0.2"
@@ -3863,16 +5430,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"https-proxy-agent@npm:^5.0.1":
-  version: 5.0.1
-  resolution: "https-proxy-agent@npm:5.0.1"
-  dependencies:
-    agent-base: "npm:6"
-    debug: "npm:4"
-  checksum: 10c0/6dd639f03434003577c62b27cafdb864784ef19b2de430d8ae2a1d45e31c4fd60719e5637b44db1a88a046934307da7089e03d6089ec3ddacc1189d8de8897d1
-  languageName: node
-  linkType: hard
-
 "https-proxy-agent@npm:^7.0.1":
   version: 7.0.6
   resolution: "https-proxy-agent@npm:7.0.6"
@@ -3883,7 +5440,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"iconv-lite@npm:0.6.3, iconv-lite@npm:^0.6.2":
+"iconv-lite@npm:^0.6.2":
   version: 0.6.3
   resolution: "iconv-lite@npm:0.6.3"
   dependencies:
@@ -3930,13 +5487,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"indent-string@npm:^4.0.0":
-  version: 4.0.0
-  resolution: "indent-string@npm:4.0.0"
-  checksum: 10c0/1e1904ddb0cb3d6cce7cd09e27a90184908b7a5d5c21b92e232c93579d314f0b83c246ffb035493d0504b1e9147ba2c9b21df0030f48673fba0496ecd698161f
-  languageName: node
-  linkType: hard
-
 "inflight@npm:^1.0.4":
   version: 1.0.6
   resolution: "inflight@npm:1.0.6"
@@ -3954,17 +5504,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"internal-slot@npm:^1.1.0":
-  version: 1.1.0
-  resolution: "internal-slot@npm:1.1.0"
-  dependencies:
-    es-errors: "npm:^1.3.0"
-    hasown: "npm:^2.0.2"
-    side-channel: "npm:^1.1.0"
-  checksum: 10c0/03966f5e259b009a9bf1a78d60da920df198af4318ec004f57b8aef1dd3fe377fbc8cce63a96e8c810010302654de89f9e19de1cd8ad0061d15be28a695465c7
-  languageName: node
-  linkType: hard
-
 "ip-address@npm:^10.0.1":
   version: 10.1.0
   resolution: "ip-address@npm:10.1.0"
@@ -3979,36 +5518,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-arguments@npm:^1.1.1":
-  version: 1.2.0
-  resolution: "is-arguments@npm:1.2.0"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    has-tostringtag: "npm:^1.0.2"
-  checksum: 10c0/6377344b31e9fcb707c6751ee89b11f132f32338e6a782ec2eac9393b0cbd32235dad93052998cda778ee058754860738341d8114910d50ada5615912bb929fc
-  languageName: node
-  linkType: hard
-
-"is-array-buffer@npm:^3.0.2, is-array-buffer@npm:^3.0.5":
-  version: 3.0.5
-  resolution: "is-array-buffer@npm:3.0.5"
-  dependencies:
-    call-bind: "npm:^1.0.8"
-    call-bound: "npm:^1.0.3"
-    get-intrinsic: "npm:^1.2.6"
-  checksum: 10c0/c5c9f25606e86dbb12e756694afbbff64bc8b348d1bc989324c037e1068695131930199d6ad381952715dad3a9569333817f0b1a72ce5af7f883ce802e49c83d
-  languageName: node
-  linkType: hard
-
-"is-bigint@npm:^1.1.0":
-  version: 1.1.0
-  resolution: "is-bigint@npm:1.1.0"
-  dependencies:
-    has-bigints: "npm:^1.0.2"
-  checksum: 10c0/f4f4b905ceb195be90a6ea7f34323bf1c18e3793f18922e3e9a73c684c29eeeeff5175605c3a3a74cc38185fe27758f07efba3dbae812e5c5afbc0d2316b40e4
-  languageName: node
-  linkType: hard
-
 "is-binary-path@npm:~2.1.0":
   version: 2.1.0
   resolution: "is-binary-path@npm:2.1.0"
@@ -4018,23 +5527,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-boolean-object@npm:^1.2.1":
-  version: 1.2.2
-  resolution: "is-boolean-object@npm:1.2.2"
-  dependencies:
-    call-bound: "npm:^1.0.3"
-    has-tostringtag: "npm:^1.0.2"
-  checksum: 10c0/36ff6baf6bd18b3130186990026f5a95c709345c39cd368468e6c1b6ab52201e9fd26d8e1f4c066357b4938b0f0401e1a5000e08257787c1a02f3a719457001e
-  languageName: node
-  linkType: hard
-
-"is-callable@npm:^1.2.7":
-  version: 1.2.7
-  resolution: "is-callable@npm:1.2.7"
-  checksum: 10c0/ceebaeb9d92e8adee604076971dd6000d38d6afc40bb843ea8e45c5579b57671c3f3b50d7f04869618242c6cee08d1b67806a8cb8edaaaf7c0748b3720d6066f
-  languageName: node
-  linkType: hard
-
 "is-core-module@npm:^2.16.1":
   version: 2.16.1
   resolution: "is-core-module@npm:2.16.1"
@@ -4044,16 +5536,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-date-object@npm:^1.0.5":
-  version: 1.1.0
-  resolution: "is-date-object@npm:1.1.0"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    has-tostringtag: "npm:^1.0.2"
-  checksum: 10c0/1a4d199c8e9e9cac5128d32e6626fa7805175af9df015620ac0d5d45854ccf348ba494679d872d37301032e35a54fc7978fba1687e8721b2139aea7870cafa2f
-  languageName: node
-  linkType: hard
-
 "is-extglob@npm:^2.1.1":
   version: 2.1.1
   resolution: "is-extglob@npm:2.1.1"
@@ -4070,23 +5552,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-map@npm:^2.0.2, is-map@npm:^2.0.3":
-  version: 2.0.3
-  resolution: "is-map@npm:2.0.3"
-  checksum: 10c0/2c4d431b74e00fdda7162cd8e4b763d6f6f217edf97d4f8538b94b8702b150610e2c64961340015fe8df5b1fcee33ccd2e9b62619c4a8a3a155f8de6d6d355fc
-  languageName: node
-  linkType: hard
-
-"is-number-object@npm:^1.1.1":
-  version: 1.1.1
-  resolution: "is-number-object@npm:1.1.1"
-  dependencies:
-    call-bound: "npm:^1.0.3"
-    has-tostringtag: "npm:^1.0.2"
-  checksum: 10c0/97b451b41f25135ff021d85c436ff0100d84a039bb87ffd799cbcdbea81ef30c464ced38258cdd34f080be08fc3b076ca1f472086286d2aa43521d6ec6a79f53
-  languageName: node
-  linkType: hard
-
 "is-number@npm:^7.0.0":
   version: 7.0.0
   resolution: "is-number@npm:7.0.0"
@@ -4101,83 +5566,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-potential-custom-element-name@npm:^1.0.1":
-  version: 1.0.1
-  resolution: "is-potential-custom-element-name@npm:1.0.1"
-  checksum: 10c0/b73e2f22bc863b0939941d369486d308b43d7aef1f9439705e3582bfccaa4516406865e32c968a35f97a99396dac84e2624e67b0a16b0a15086a785e16ce7db9
-  languageName: node
-  linkType: hard
-
-"is-regex@npm:^1.1.4, is-regex@npm:^1.2.1":
-  version: 1.2.1
-  resolution: "is-regex@npm:1.2.1"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    gopd: "npm:^1.2.0"
-    has-tostringtag: "npm:^1.0.2"
-    hasown: "npm:^2.0.2"
-  checksum: 10c0/1d3715d2b7889932349241680032e85d0b492cfcb045acb75ffc2c3085e8d561184f1f7e84b6f8321935b4aea39bc9c6ba74ed595b57ce4881a51dfdbc214e04
-  languageName: node
-  linkType: hard
-
-"is-set@npm:^2.0.2, is-set@npm:^2.0.3":
-  version: 2.0.3
-  resolution: "is-set@npm:2.0.3"
-  checksum: 10c0/f73732e13f099b2dc879c2a12341cfc22ccaca8dd504e6edae26484bd5707a35d503fba5b4daad530a9b088ced1ae6c9d8200fd92e09b428fe14ea79ce8080b7
-  languageName: node
-  linkType: hard
-
-"is-shared-array-buffer@npm:^1.0.2":
-  version: 1.0.4
-  resolution: "is-shared-array-buffer@npm:1.0.4"
-  dependencies:
-    call-bound: "npm:^1.0.3"
-  checksum: 10c0/65158c2feb41ff1edd6bbd6fd8403a69861cf273ff36077982b5d4d68e1d59278c71691216a4a64632bd76d4792d4d1d2553901b6666d84ade13bba5ea7bc7db
-  languageName: node
-  linkType: hard
-
-"is-string@npm:^1.0.7, is-string@npm:^1.1.1":
-  version: 1.1.1
-  resolution: "is-string@npm:1.1.1"
-  dependencies:
-    call-bound: "npm:^1.0.3"
-    has-tostringtag: "npm:^1.0.2"
-  checksum: 10c0/2f518b4e47886bb81567faba6ffd0d8a8333cf84336e2e78bf160693972e32ad00fe84b0926491cc598dee576fdc55642c92e62d0cbe96bf36f643b6f956f94d
-  languageName: node
-  linkType: hard
-
-"is-symbol@npm:^1.1.1":
-  version: 1.1.1
-  resolution: "is-symbol@npm:1.1.1"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    has-symbols: "npm:^1.1.0"
-    safe-regex-test: "npm:^1.1.0"
-  checksum: 10c0/f08f3e255c12442e833f75a9e2b84b2d4882fdfd920513cf2a4a2324f0a5b076c8fd913778e3ea5d258d5183e9d92c0cd20e04b03ab3df05316b049b2670af1e
-  languageName: node
-  linkType: hard
-
-"is-weakmap@npm:^2.0.2":
-  version: 2.0.2
-  resolution: "is-weakmap@npm:2.0.2"
-  checksum: 10c0/443c35bb86d5e6cc5929cd9c75a4024bb0fff9586ed50b092f94e700b89c43a33b186b76dbc6d54f3d3d09ece689ab38dcdc1af6a482cbe79c0f2da0a17f1299
-  languageName: node
-  linkType: hard
-
-"is-weakset@npm:^2.0.3":
-  version: 2.0.4
-  resolution: "is-weakset@npm:2.0.4"
-  dependencies:
-    call-bound: "npm:^1.0.3"
-    get-intrinsic: "npm:^1.2.6"
-  checksum: 10c0/6491eba08acb8dc9532da23cb226b7d0192ede0b88f16199e592e4769db0a077119c1f5d2283d1e0d16d739115f70046e887e477eb0e66cd90e1bb29f28ba647
-  languageName: node
-  linkType: hard
-
-"isarray@npm:^2.0.5":
-  version: 2.0.5
-  resolution: "isarray@npm:2.0.5"
-  checksum: 10c0/4199f14a7a13da2177c66c31080008b7124331956f47bca57dd0b6ea9f11687aa25e565a2c7a2b519bc86988d10398e3049a1f5df13c9f6b7664154690ae79fd
+"isbot@npm:^5.1.22":
+  version: 5.1.35
+  resolution: "isbot@npm:5.1.35"
+  checksum: 10c0/7e13d264ef41ea69ca8addf7bdf49751903fbcab8d1e63458c581f0908f8d915c3c072188c43dc8d142b3708338290ad35476421131202f851301bfcc9c2c29f
   languageName: node
   linkType: hard
 
@@ -4195,16 +5587,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jiti@npm:^1.21.7":
-  version: 1.21.7
-  resolution: "jiti@npm:1.21.7"
-  bin:
-    jiti: bin/jiti.js
-  checksum: 10c0/77b61989c758ff32407cdae8ddc77f85e18e1a13fc4977110dbd2e05fc761842f5f71bce684d9a01316e1c4263971315a111385759951080bbfe17cbb5de8f7a
-  languageName: node
-  linkType: hard
-
-"jiti@npm:^2.4.2":
+"jiti@npm:^2.4.2, jiti@npm:^2.6.1":
   version: 2.6.1
   resolution: "jiti@npm:2.6.1"
   bin:
@@ -4220,7 +5603,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"js-tokens@npm:^3.0.0 || ^4.0.0, js-tokens@npm:^4.0.0":
+"js-tokens@npm:^4.0.0":
   version: 4.0.0
   resolution: "js-tokens@npm:4.0.0"
   checksum: 10c0/e248708d377aa058eacf2037b07ded847790e6de892bbad3dac0abba2e759cb9f121b00099a65195616badcb6eca8d14d975cb3e89eb1cfda644756402c8aeed
@@ -4238,42 +5621,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jsdom@npm:^22.1.0":
-  version: 22.1.0
-  resolution: "jsdom@npm:22.1.0"
-  dependencies:
-    abab: "npm:^2.0.6"
-    cssstyle: "npm:^3.0.0"
-    data-urls: "npm:^4.0.0"
-    decimal.js: "npm:^10.4.3"
-    domexception: "npm:^4.0.0"
-    form-data: "npm:^4.0.0"
-    html-encoding-sniffer: "npm:^3.0.0"
-    http-proxy-agent: "npm:^5.0.0"
-    https-proxy-agent: "npm:^5.0.1"
-    is-potential-custom-element-name: "npm:^1.0.1"
-    nwsapi: "npm:^2.2.4"
-    parse5: "npm:^7.1.2"
-    rrweb-cssom: "npm:^0.6.0"
-    saxes: "npm:^6.0.0"
-    symbol-tree: "npm:^3.2.4"
-    tough-cookie: "npm:^4.1.2"
-    w3c-xmlserializer: "npm:^4.0.0"
-    webidl-conversions: "npm:^7.0.0"
-    whatwg-encoding: "npm:^2.0.0"
-    whatwg-mimetype: "npm:^3.0.0"
-    whatwg-url: "npm:^12.0.1"
-    ws: "npm:^8.13.0"
-    xml-name-validator: "npm:^4.0.0"
-  peerDependencies:
-    canvas: ^2.5.0
-  peerDependenciesMeta:
-    canvas:
-      optional: true
-  checksum: 10c0/a1c1501c611d1fe833e0a28796a234325aa09d4c597a9d8ccf6970004a9d946d261469502eadb555bdd7a55f5a2fbf3ce60c727cd99acb0d63f257fb9afcd33d
-  languageName: node
-  linkType: hard
-
 "jsesc@npm:^3.0.2":
   version: 3.1.0
   resolution: "jsesc@npm:3.1.0"
@@ -4359,17 +5706,123 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lilconfig@npm:^3.1.1, lilconfig@npm:^3.1.3":
-  version: 3.1.3
-  resolution: "lilconfig@npm:3.1.3"
-  checksum: 10c0/f5604e7240c5c275743561442fbc5abf2a84ad94da0f5adc71d25e31fa8483048de3dcedcb7a44112a942fed305fd75841cdf6c9681c7f640c63f1049e9a5dcc
+"lightningcss-android-arm64@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-android-arm64@npm:1.31.1"
+  conditions: os=android & cpu=arm64
   languageName: node
   linkType: hard
 
-"lines-and-columns@npm:^1.1.6":
-  version: 1.2.4
-  resolution: "lines-and-columns@npm:1.2.4"
-  checksum: 10c0/3da6ee62d4cd9f03f5dc90b4df2540fb85b352081bee77fe4bbcd12c9000ead7f35e0a38b8d09a9bb99b13223446dd8689ff3c4959807620726d788701a83d2d
+"lightningcss-darwin-arm64@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-darwin-arm64@npm:1.31.1"
+  conditions: os=darwin & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"lightningcss-darwin-x64@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-darwin-x64@npm:1.31.1"
+  conditions: os=darwin & cpu=x64
+  languageName: node
+  linkType: hard
+
+"lightningcss-freebsd-x64@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-freebsd-x64@npm:1.31.1"
+  conditions: os=freebsd & cpu=x64
+  languageName: node
+  linkType: hard
+
+"lightningcss-linux-arm-gnueabihf@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-linux-arm-gnueabihf@npm:1.31.1"
+  conditions: os=linux & cpu=arm
+  languageName: node
+  linkType: hard
+
+"lightningcss-linux-arm64-gnu@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-linux-arm64-gnu@npm:1.31.1"
+  conditions: os=linux & cpu=arm64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"lightningcss-linux-arm64-musl@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-linux-arm64-musl@npm:1.31.1"
+  conditions: os=linux & cpu=arm64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"lightningcss-linux-x64-gnu@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-linux-x64-gnu@npm:1.31.1"
+  conditions: os=linux & cpu=x64 & libc=glibc
+  languageName: node
+  linkType: hard
+
+"lightningcss-linux-x64-musl@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-linux-x64-musl@npm:1.31.1"
+  conditions: os=linux & cpu=x64 & libc=musl
+  languageName: node
+  linkType: hard
+
+"lightningcss-win32-arm64-msvc@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-win32-arm64-msvc@npm:1.31.1"
+  conditions: os=win32 & cpu=arm64
+  languageName: node
+  linkType: hard
+
+"lightningcss-win32-x64-msvc@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss-win32-x64-msvc@npm:1.31.1"
+  conditions: os=win32 & cpu=x64
+  languageName: node
+  linkType: hard
+
+"lightningcss@npm:1.31.1":
+  version: 1.31.1
+  resolution: "lightningcss@npm:1.31.1"
+  dependencies:
+    detect-libc: "npm:^2.0.3"
+    lightningcss-android-arm64: "npm:1.31.1"
+    lightningcss-darwin-arm64: "npm:1.31.1"
+    lightningcss-darwin-x64: "npm:1.31.1"
+    lightningcss-freebsd-x64: "npm:1.31.1"
+    lightningcss-linux-arm-gnueabihf: "npm:1.31.1"
+    lightningcss-linux-arm64-gnu: "npm:1.31.1"
+    lightningcss-linux-arm64-musl: "npm:1.31.1"
+    lightningcss-linux-x64-gnu: "npm:1.31.1"
+    lightningcss-linux-x64-musl: "npm:1.31.1"
+    lightningcss-win32-arm64-msvc: "npm:1.31.1"
+    lightningcss-win32-x64-msvc: "npm:1.31.1"
+  dependenciesMeta:
+    lightningcss-android-arm64:
+      optional: true
+    lightningcss-darwin-arm64:
+      optional: true
+    lightningcss-darwin-x64:
+      optional: true
+    lightningcss-freebsd-x64:
+      optional: true
+    lightningcss-linux-arm-gnueabihf:
+      optional: true
+    lightningcss-linux-arm64-gnu:
+      optional: true
+    lightningcss-linux-arm64-musl:
+      optional: true
+    lightningcss-linux-x64-gnu:
+      optional: true
+    lightningcss-linux-x64-musl:
+      optional: true
+    lightningcss-win32-arm64-msvc:
+      optional: true
+    lightningcss-win32-x64-msvc:
+      optional: true
+  checksum: 10c0/c6754b305d4a73652e472fc0d7d65384a6e16c336ea61068eca60de2a45bd5c30abbf012358b82eac56ee98b5d88028932cda5268ff61967cffa400b9e7ee2ba
   languageName: node
   linkType: hard
 
@@ -4403,17 +5856,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"loose-envify@npm:^1.1.0":
-  version: 1.4.0
-  resolution: "loose-envify@npm:1.4.0"
-  dependencies:
-    js-tokens: "npm:^3.0.0 || ^4.0.0"
-  bin:
-    loose-envify: cli.js
-  checksum: 10c0/655d110220983c1a4b9c0c679a2e8016d4b67f6e9c7b5435ff5979ecdb20d0813f4dec0a08674fcbdd4846a3f07edbb50a36811fd37930b94aaa0d9daceb017e
-  languageName: node
-  linkType: hard
-
 "loupe@npm:^2.3.6":
   version: 2.3.7
   resolution: "loupe@npm:2.3.7"
@@ -4439,16 +5881,16 @@ __metadata:
   languageName: node
   linkType: hard
 
-"lz-string@npm:^1.5.0":
-  version: 1.5.0
-  resolution: "lz-string@npm:1.5.0"
-  bin:
-    lz-string: bin/bin.js
-  checksum: 10c0/36128e4de34791838abe979b19927c26e67201ca5acf00880377af7d765b38d1c60847e01c5ec61b1a260c48029084ab3893a3925fd6e48a04011364b089991b
+"lucide-react@npm:^0.575.0":
+  version: 0.575.0
+  resolution: "lucide-react@npm:0.575.0"
+  peerDependencies:
+    react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0
+  checksum: 10c0/4f42e81c88f60c8f904b178c0b28e8ac9a99da8ef24eba5f26ed97b63124304a847baea2f71125629a272df58dbb61cd799ff6a7e4878e5a4c28d8a699b84730
   languageName: node
   linkType: hard
 
-"magic-string@npm:^0.30.0, magic-string@npm:^0.30.1":
+"magic-string@npm:^0.30.0, magic-string@npm:^0.30.1, magic-string@npm:^0.30.21":
   version: 0.30.21
   resolution: "magic-string@npm:0.30.21"
   dependencies:
@@ -4499,23 +5941,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"merge2@npm:^1.3.0":
-  version: 1.4.1
-  resolution: "merge2@npm:1.4.1"
-  checksum: 10c0/254a8a4605b58f450308fc474c82ac9a094848081bf4c06778200207820e5193726dc563a0d2c16468810516a5c97d9d3ea0ca6585d23c58ccfff2403e8dbbeb
-  languageName: node
-  linkType: hard
-
-"micromatch@npm:^4.0.8":
-  version: 4.0.8
-  resolution: "micromatch@npm:4.0.8"
-  dependencies:
-    braces: "npm:^3.0.3"
-    picomatch: "npm:^2.3.1"
-  checksum: 10c0/166fa6eb926b9553f32ef81f5f531d27b4ce7da60e5baf8c021d043b27a388fb95e46a8038d5045877881e673f8134122b59624d5cecbd16eb50a42e7a6b5ca8
-  languageName: node
-  linkType: hard
-
 "mime-db@npm:1.52.0":
   version: 1.52.0
   resolution: "mime-db@npm:1.52.0"
@@ -4532,13 +5957,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"min-indent@npm:^1.0.0":
-  version: 1.0.1
-  resolution: "min-indent@npm:1.0.1"
-  checksum: 10c0/7e207bd5c20401b292de291f02913230cb1163abca162044f7db1d951fa245b174dc00869d40dd9a9f32a885ad6a5f3e767ee104cf278f399cb4e92d3f582d5c
-  languageName: node
-  linkType: hard
-
 "minimatch@npm:^10.1.1, minimatch@npm:^10.1.2":
   version: 10.1.2
   resolution: "minimatch@npm:10.1.2"
@@ -4686,17 +6104,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"mz@npm:^2.7.0":
-  version: 2.7.0
-  resolution: "mz@npm:2.7.0"
-  dependencies:
-    any-promise: "npm:^1.0.0"
-    object-assign: "npm:^4.0.1"
-    thenify-all: "npm:^1.0.0"
-  checksum: 10c0/103114e93f87362f0b56ab5b2e7245051ad0276b646e3902c98397d18bb8f4a77f2ea4a2c9d3ad516034ea3a56553b60d3f5f78220001ca4c404bd711bd0af39
-  languageName: node
-  linkType: hard
-
 "nanoid@npm:^3.3.11":
   version: 3.3.11
   resolution: "nanoid@npm:3.3.11"
@@ -4772,13 +6179,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"nwsapi@npm:^2.2.4":
-  version: 2.2.23
-  resolution: "nwsapi@npm:2.2.23"
-  checksum: 10c0/e44bfc9246baf659581206ed716d291a1905185247795fb8a302cb09315c943a31023b4ac4d026a5eaf32b2def51d77b3d0f9ebf4f3d35f70e105fcb6447c76e
-  languageName: node
-  linkType: hard
-
 "nypm@npm:^0.6.0":
   version: 0.6.5
   resolution: "nypm@npm:0.6.5"
@@ -4792,58 +6192,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"object-assign@npm:^4.0.1":
-  version: 4.1.1
-  resolution: "object-assign@npm:4.1.1"
-  checksum: 10c0/1f4df9945120325d041ccf7b86f31e8bcc14e73d29171e37a7903050e96b81323784ec59f93f102ec635bcf6fa8034ba3ea0a8c7e69fa202b87ae3b6cec5a414
-  languageName: node
-  linkType: hard
-
-"object-hash@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "object-hash@npm:3.0.0"
-  checksum: 10c0/a06844537107b960c1c8b96cd2ac8592a265186bfa0f6ccafe0d34eabdb526f6fa81da1f37c43df7ed13b12a4ae3457a16071603bcd39d8beddb5f08c37b0f47
-  languageName: node
-  linkType: hard
-
-"object-inspect@npm:^1.13.3":
-  version: 1.13.4
-  resolution: "object-inspect@npm:1.13.4"
-  checksum: 10c0/d7f8711e803b96ea3191c745d6f8056ce1f2496e530e6a19a0e92d89b0fa3c76d910c31f0aa270432db6bd3b2f85500a376a83aaba849a8d518c8845b3211692
-  languageName: node
-  linkType: hard
-
-"object-is@npm:^1.1.5":
-  version: 1.1.6
-  resolution: "object-is@npm:1.1.6"
-  dependencies:
-    call-bind: "npm:^1.0.7"
-    define-properties: "npm:^1.2.1"
-  checksum: 10c0/506af444c4dce7f8e31f34fc549e2fb8152d6b9c4a30c6e62852badd7f520b579c679af433e7a072f9d78eb7808d230dc12e1cf58da9154dfbf8813099ea0fe0
-  languageName: node
-  linkType: hard
-
-"object-keys@npm:^1.1.1":
-  version: 1.1.1
-  resolution: "object-keys@npm:1.1.1"
-  checksum: 10c0/b11f7ccdbc6d406d1f186cdadb9d54738e347b2692a14439ca5ac70c225fa6db46db809711b78589866d47b25fc3e8dee0b4c722ac751e11180f9380e3d8601d
-  languageName: node
-  linkType: hard
-
-"object.assign@npm:^4.1.4":
-  version: 4.1.7
-  resolution: "object.assign@npm:4.1.7"
-  dependencies:
-    call-bind: "npm:^1.0.8"
-    call-bound: "npm:^1.0.3"
-    define-properties: "npm:^1.2.1"
-    es-object-atoms: "npm:^1.0.0"
-    has-symbols: "npm:^1.1.0"
-    object-keys: "npm:^1.1.1"
-  checksum: 10c0/3b2732bd860567ea2579d1567525168de925a8d852638612846bd8082b3a1602b7b89b67b09913cbb5b9bd6e95923b2ae73580baa9d99cb4e990564e8cbf5ddc
-  languageName: node
-  linkType: hard
-
 "obliterator@npm:^2.0.1":
   version: 2.0.5
   resolution: "obliterator@npm:2.0.5"
@@ -4931,15 +6279,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"parse5@npm:^7.1.2":
-  version: 7.3.0
-  resolution: "parse5@npm:7.3.0"
-  dependencies:
-    entities: "npm:^6.0.0"
-  checksum: 10c0/7fd2e4e247e85241d6f2a464d0085eed599a26d7b0a5233790c49f53473232eb85350e8133344d9b3fd58b89339e7ad7270fe1f89d28abe50674ec97b87f80b5
-  languageName: node
-  linkType: hard
-
 "path-exists@npm:^4.0.0":
   version: 4.0.0
   resolution: "path-exists@npm:4.0.0"
@@ -5013,7 +6352,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"picomatch@npm:^2.0.4, picomatch@npm:^2.2.1, picomatch@npm:^2.3.1":
+"picomatch@npm:^2.0.4, picomatch@npm:^2.2.1":
   version: 2.3.1
   resolution: "picomatch@npm:2.3.1"
   checksum: 10c0/26c02b8d06f03206fc2ab8d16f19960f2ff9e81a658f831ecb656d8f17d9edc799e8364b1f4a7873e89d9702dff96204be0fa26fe4181f6843f040f819dac4be
@@ -5027,13 +6366,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"pify@npm:^2.3.0":
-  version: 2.3.0
-  resolution: "pify@npm:2.3.0"
-  checksum: 10c0/551ff8ab830b1052633f59cb8adc9ae8407a436e06b4a9718bcb27dc5844b83d535c3a8512b388b6062af65a98c49bdc0dd523d8b2617b188f7c8fee457158dc
-  languageName: node
-  linkType: hard
-
 "pino-abstract-transport@npm:^1.2.0":
   version: 1.2.0
   resolution: "pino-abstract-transport@npm:1.2.0"
@@ -5109,13 +6441,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"pirates@npm:^4.0.1":
-  version: 4.0.7
-  resolution: "pirates@npm:4.0.7"
-  checksum: 10c0/a51f108dd811beb779d58a76864bbd49e239fa40c7984cd11596c75a121a8cc789f1c8971d8bb15f0dbf9d48b76c05bb62fcbce840f89b688c0fa64b37e8478a
-  languageName: node
-  linkType: hard
-
 "pkg-types@npm:^1.3.1":
   version: 1.3.1
   resolution: "pkg-types@npm:1.3.1"
@@ -5162,89 +6487,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"possible-typed-array-names@npm:^1.0.0":
-  version: 1.1.0
-  resolution: "possible-typed-array-names@npm:1.1.0"
-  checksum: 10c0/c810983414142071da1d644662ce4caebce890203eb2bc7bf119f37f3fe5796226e117e6cca146b521921fa6531072674174a3325066ac66fce089a53e1e5196
-  languageName: node
-  linkType: hard
-
-"postcss-import@npm:^15.1.0":
-  version: 15.1.0
-  resolution: "postcss-import@npm:15.1.0"
-  dependencies:
-    postcss-value-parser: "npm:^4.0.0"
-    read-cache: "npm:^1.0.0"
-    resolve: "npm:^1.1.7"
-  peerDependencies:
-    postcss: ^8.0.0
-  checksum: 10c0/518aee5c83ea6940e890b0be675a2588db68b2582319f48c3b4e06535a50ea6ee45f7e63e4309f8754473245c47a0372632378d1d73d901310f295a92f26f17b
-  languageName: node
-  linkType: hard
-
-"postcss-js@npm:^4.0.1":
-  version: 4.1.0
-  resolution: "postcss-js@npm:4.1.0"
-  dependencies:
-    camelcase-css: "npm:^2.0.1"
-  peerDependencies:
-    postcss: ^8.4.21
-  checksum: 10c0/a3cf6e725f3e9ecd7209732f8844a0063a1380b718ccbcf93832b6ec2cd7e63ff70dd2fed49eb2483c7482296860a0f7badd3115b5d0fa05ea648eb6d9dfc9c6
-  languageName: node
-  linkType: hard
-
-"postcss-load-config@npm:^4.0.2 || ^5.0 || ^6.0":
-  version: 6.0.1
-  resolution: "postcss-load-config@npm:6.0.1"
-  dependencies:
-    lilconfig: "npm:^3.1.1"
-  peerDependencies:
-    jiti: ">=1.21.0"
-    postcss: ">=8.0.9"
-    tsx: ^4.8.1
-    yaml: ^2.4.2
-  peerDependenciesMeta:
-    jiti:
-      optional: true
-    postcss:
-      optional: true
-    tsx:
-      optional: true
-    yaml:
-      optional: true
-  checksum: 10c0/74173a58816dac84e44853f7afbd283f4ef13ca0b6baeba27701214beec33f9e309b128f8102e2b173e8d45ecba45d279a9be94b46bf48d219626aa9b5730848
-  languageName: node
-  linkType: hard
-
-"postcss-nested@npm:^6.2.0":
-  version: 6.2.0
-  resolution: "postcss-nested@npm:6.2.0"
-  dependencies:
-    postcss-selector-parser: "npm:^6.1.1"
-  peerDependencies:
-    postcss: ^8.2.14
-  checksum: 10c0/7f9c3f2d764191a39364cbdcec350f26a312431a569c9ef17408021424726b0d67995ff5288405e3724bb7152a4c92f73c027e580ec91e798800ed3c52e2bc6e
-  languageName: node
-  linkType: hard
-
-"postcss-selector-parser@npm:^6.1.1, postcss-selector-parser@npm:^6.1.2":
-  version: 6.1.2
-  resolution: "postcss-selector-parser@npm:6.1.2"
-  dependencies:
-    cssesc: "npm:^3.0.0"
-    util-deprecate: "npm:^1.0.2"
-  checksum: 10c0/523196a6bd8cf660bdf537ad95abd79e546d54180f9afb165a4ab3e651ac705d0f8b8ce6b3164fb9e3279ce482c5f751a69eb2d3a1e8eb0fd5e82294fb3ef13e
-  languageName: node
-  linkType: hard
-
-"postcss-value-parser@npm:^4.0.0, postcss-value-parser@npm:^4.2.0":
+"postcss-value-parser@npm:^4.2.0":
   version: 4.2.0
   resolution: "postcss-value-parser@npm:4.2.0"
   checksum: 10c0/f4142a4f56565f77c1831168e04e3effd9ffcc5aebaf0f538eee4b2d465adfd4b85a44257bb48418202a63806a7da7fe9f56c330aebb3cac898e46b4cbf49161
   languageName: node
   linkType: hard
 
-"postcss@npm:^8.4.24, postcss@npm:^8.4.27, postcss@npm:^8.4.43, postcss@npm:^8.4.47":
+"postcss@npm:^8.4.27, postcss@npm:^8.4.43, postcss@npm:^8.5.6":
   version: 8.5.6
   resolution: "postcss@npm:8.5.6"
   dependencies:
@@ -5289,7 +6539,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"pretty-format@npm:^27.0.2, pretty-format@npm:^27.5.1":
+"pretty-format@npm:^27.5.1":
   version: 27.5.1
   resolution: "pretty-format@npm:27.5.1"
   dependencies:
@@ -5376,16 +6626,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"psl@npm:^1.1.33":
-  version: 1.15.0
-  resolution: "psl@npm:1.15.0"
-  dependencies:
-    punycode: "npm:^2.3.1"
-  checksum: 10c0/d8d45a99e4ca62ca12ac3c373e63d80d2368d38892daa40cfddaa1eb908be98cd549ac059783ef3a56cfd96d57ae8e2fd9ae53d1378d90d42bc661ff924e102a
+"proxy-from-env@npm:^1.1.0":
+  version: 1.1.0
+  resolution: "proxy-from-env@npm:1.1.0"
+  checksum: 10c0/fe7dd8b1bdbbbea18d1459107729c3e4a2243ca870d26d34c2c1bcd3e4425b7bcc5112362df2d93cc7fb9746f6142b5e272fd1cc5c86ddf8580175186f6ad42b
   languageName: node
   linkType: hard
 
-"punycode@npm:^2.1.0, punycode@npm:^2.1.1, punycode@npm:^2.3.0, punycode@npm:^2.3.1":
+"punycode@npm:^2.1.0":
   version: 2.3.1
   resolution: "punycode@npm:2.3.1"
   checksum: 10c0/14f76a8206bc3464f794fb2e3d3cc665ae416c01893ad7a02b23766eb07159144ee612ad67af5e84fa4479ccfe67678c4feb126b0485651b302babf66f04f9e9
@@ -5424,32 +6672,6 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"quasar-frontend@workspace:frontend":
-  version: 0.0.0-use.local
-  resolution: "quasar-frontend@workspace:frontend"
-  dependencies:
-    "@hookform/resolvers": "npm:^3.3.0"
-    "@tanstack/react-query": "npm:^4.34.0"
-    "@testing-library/jest-dom": "npm:^6.0.0"
-    "@testing-library/react": "npm:^14.0.0"
-    "@testing-library/user-event": "npm:^14.5.0"
-    "@types/react": "npm:^18.2.21"
-    "@types/react-dom": "npm:^18.2.7"
-    "@vitejs/plugin-react": "npm:^4.0.0"
-    autoprefixer: "npm:^10.4.14"
-    jsdom: "npm:^22.1.0"
-    postcss: "npm:^8.4.24"
-    react: "npm:^18.2.0"
-    react-dom: "npm:^18.2.0"
-    react-hook-form: "npm:^7.48.0"
-    tailwindcss: "npm:^3.4.7"
-    typescript: "npm:^5.2.2"
-    vite: "npm:^5.1.0"
-    vitest: "npm:^0.34.1"
-    zod: "npm:^3.22.0"
-  languageName: unknown
-  linkType: soft
-
 "quasar@workspace:.":
   version: 0.0.0-use.local
   resolution: "quasar@workspace:."
@@ -5469,13 +6691,6 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"querystringify@npm:^2.1.1":
-  version: 2.2.0
-  resolution: "querystringify@npm:2.2.0"
-  checksum: 10c0/3258bc3dbdf322ff2663619afe5947c7926a6ef5fb78ad7d384602974c467fadfc8272af44f5eb8cddd0d011aae8fabf3a929a8eee4b86edcc0a21e6bd10f9aa
-  languageName: node
-  linkType: hard
-
 "queue-microtask@npm:^1.2.2":
   version: 1.2.3
   resolution: "queue-microtask@npm:1.2.3"
@@ -5500,24 +6715,14 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-dom@npm:^18.2.0":
-  version: 18.3.1
-  resolution: "react-dom@npm:18.3.1"
+"react-dom@npm:^19.2.0":
+  version: 19.2.4
+  resolution: "react-dom@npm:19.2.4"
   dependencies:
-    loose-envify: "npm:^1.1.0"
-    scheduler: "npm:^0.23.2"
+    scheduler: "npm:^0.27.0"
   peerDependencies:
-    react: ^18.3.1
-  checksum: 10c0/a752496c1941f958f2e8ac56239172296fcddce1365ce45222d04a1947e0cc5547df3e8447f855a81d6d39f008d7c32eab43db3712077f09e3f67c4874973e85
-  languageName: node
-  linkType: hard
-
-"react-hook-form@npm:^7.48.0":
-  version: 7.71.1
-  resolution: "react-hook-form@npm:7.71.1"
-  peerDependencies:
-    react: ^16.8.0 || ^17 || ^18 || ^19
-  checksum: 10c0/6c8fc0fa740d299481de3ed32bae98f7c6331240822c602363e5cd221746d875dc3c5e65d0039902b7f7a44dc9ac9a4932e00e9ad9af3051bed1987858ce78c7
+    react: ^19.2.4
+  checksum: 10c0/f0c63f1794dedb154136d4d0f59af00b41907f4859571c155940296808f4b94bf9c0c20633db75b5b2112ec13d8d7dd4f9bf57362ed48782f317b11d05a44f35
   languageName: node
   linkType: hard
 
@@ -5535,28 +6740,68 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-refresh@npm:^0.17.0":
-  version: 0.17.0
-  resolution: "react-refresh@npm:0.17.0"
-  checksum: 10c0/002cba940384c9930008c0bce26cac97a9d5682bc623112c2268ba0c155127d9c178a9a5cc2212d560088d60dfd503edd808669a25f9b377f316a32361d0b23c
+"react-refresh@npm:^0.18.0":
+  version: 0.18.0
+  resolution: "react-refresh@npm:0.18.0"
+  checksum: 10c0/34a262f7fd803433a534f50deb27a148112a81adcae440c7d1cbae7ef14d21ea8f2b3d783e858cb7698968183b77755a38b4d4b5b1d79b4f4689c2f6d358fff2
   languageName: node
   linkType: hard
 
-"react@npm:^18.2.0":
-  version: 18.3.1
-  resolution: "react@npm:18.3.1"
+"react-remove-scroll-bar@npm:^2.3.7":
+  version: 2.3.8
+  resolution: "react-remove-scroll-bar@npm:2.3.8"
   dependencies:
-    loose-envify: "npm:^1.1.0"
-  checksum: 10c0/283e8c5efcf37802c9d1ce767f302dd569dd97a70d9bb8c7be79a789b9902451e0d16334b05d73299b20f048cbc3c7d288bbbde10b701fa194e2089c237dbea3
+    react-style-singleton: "npm:^2.2.2"
+    tslib: "npm:^2.0.0"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/9a0675c66cbb52c325bdbfaed80987a829c4504cefd8ff2dd3b6b3afc9a1500b8ec57b212e92c1fb654396d07bbe18830a8146fe77677d2a29ce40b5e1f78654
   languageName: node
   linkType: hard
 
-"read-cache@npm:^1.0.0":
-  version: 1.0.0
-  resolution: "read-cache@npm:1.0.0"
+"react-remove-scroll@npm:^2.6.3":
+  version: 2.7.2
+  resolution: "react-remove-scroll@npm:2.7.2"
   dependencies:
-    pify: "npm:^2.3.0"
-  checksum: 10c0/90cb2750213c7dd7c80cb420654344a311fdec12944e81eb912cd82f1bc92aea21885fa6ce442e3336d9fccd663b8a7a19c46d9698e6ca55620848ab932da814
+    react-remove-scroll-bar: "npm:^2.3.7"
+    react-style-singleton: "npm:^2.2.3"
+    tslib: "npm:^2.1.0"
+    use-callback-ref: "npm:^1.3.3"
+    use-sidecar: "npm:^1.1.3"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/b5f3315bead75e72853f492c0b51ba8fb4fa09a4534d7fc42d6fcd59ca3e047cf213279ffc1e35b337e314ef5a04cb2b12544c85e0078802271731c27c09e5aa
+  languageName: node
+  linkType: hard
+
+"react-style-singleton@npm:^2.2.2, react-style-singleton@npm:^2.2.3":
+  version: 2.2.3
+  resolution: "react-style-singleton@npm:2.2.3"
+  dependencies:
+    get-nonce: "npm:^1.0.0"
+    tslib: "npm:^2.0.0"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/841938ff16d16a6b76895f4cb2e1fea957e5fe3b30febbf03a54892dae1c9153f2383e231dea0b3ba41192ad2f2849448fa859caccd288943bce32639e971bee
+  languageName: node
+  linkType: hard
+
+"react@npm:^19.2.0":
+  version: 19.2.4
+  resolution: "react@npm:19.2.4"
+  checksum: 10c0/cd2c9ff67a720799cc3b38a516009986f7fc4cb8d3e15716c6211cf098d1357ee3e348ab05ad0600042bbb0fd888530ba92e329198c92eafa0994f5213396596
   languageName: node
   linkType: hard
 
@@ -5596,30 +6841,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"redent@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "redent@npm:3.0.0"
-  dependencies:
-    indent-string: "npm:^4.0.0"
-    strip-indent: "npm:^3.0.0"
-  checksum: 10c0/d64a6b5c0b50eb3ddce3ab770f866658a2b9998c678f797919ceb1b586bab9259b311407280bd80b804e2a7c7539b19238ae6a2a20c843f1a7fcff21d48c2eae
-  languageName: node
-  linkType: hard
-
-"regexp.prototype.flags@npm:^1.5.1":
-  version: 1.5.4
-  resolution: "regexp.prototype.flags@npm:1.5.4"
-  dependencies:
-    call-bind: "npm:^1.0.8"
-    define-properties: "npm:^1.2.1"
-    es-errors: "npm:^1.3.0"
-    get-proto: "npm:^1.0.1"
-    gopd: "npm:^1.2.0"
-    set-function-name: "npm:^2.0.2"
-  checksum: 10c0/83b88e6115b4af1c537f8dabf5c3744032cb875d63bc05c288b1b8c0ef37cbe55353f95d8ca817e8843806e3e150b118bc624e4279b24b4776b4198232735a77
-  languageName: node
-  linkType: hard
-
 "require-from-string@npm:^2.0.2":
   version: 2.0.2
   resolution: "require-from-string@npm:2.0.2"
@@ -5627,13 +6848,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"requires-port@npm:^1.0.0":
-  version: 1.0.0
-  resolution: "requires-port@npm:1.0.0"
-  checksum: 10c0/b2bfdd09db16c082c4326e573a82c0771daaf7b53b9ce8ad60ea46aa6e30aaf475fe9b164800b89f93b748d2c234d8abff945d2551ba47bf5698e04cd7713267
-  languageName: node
-  linkType: hard
-
 "resolve-from@npm:^4.0.0":
   version: 4.0.0
   resolution: "resolve-from@npm:4.0.0"
@@ -5641,7 +6855,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"resolve@npm:^1.0.0, resolve@npm:^1.1.7, resolve@npm:^1.22.8":
+"resolve@npm:^1.0.0":
   version: 1.22.11
   resolution: "resolve@npm:1.22.11"
   dependencies:
@@ -5654,7 +6868,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"resolve@patch:resolve@npm%3A^1.0.0#optional!builtin<compat/resolve>, resolve@patch:resolve@npm%3A^1.1.7#optional!builtin<compat/resolve>, resolve@patch:resolve@npm%3A^1.22.8#optional!builtin<compat/resolve>":
+"resolve@patch:resolve@npm%3A^1.0.0#optional!builtin<compat/resolve>":
   version: 1.22.11
   resolution: "resolve@patch:resolve@npm%3A1.22.11#optional!builtin<compat/resolve>::version=1.22.11&hash=c3c19d"
   dependencies:
@@ -5821,10 +7035,93 @@ __metadata:
   languageName: node
   linkType: hard
 
-"rrweb-cssom@npm:^0.6.0":
-  version: 0.6.0
-  resolution: "rrweb-cssom@npm:0.6.0"
-  checksum: 10c0/3d9d90d53c2349ea9c8509c2690df5a4ef930c9cf8242aeb9425d4046f09d712bb01047e00da0e1c1dab5db35740b3d78fd45c3e7272f75d3724a563f27c30a3
+"rollup@npm:^4.43.0":
+  version: 4.59.0
+  resolution: "rollup@npm:4.59.0"
+  dependencies:
+    "@rollup/rollup-android-arm-eabi": "npm:4.59.0"
+    "@rollup/rollup-android-arm64": "npm:4.59.0"
+    "@rollup/rollup-darwin-arm64": "npm:4.59.0"
+    "@rollup/rollup-darwin-x64": "npm:4.59.0"
+    "@rollup/rollup-freebsd-arm64": "npm:4.59.0"
+    "@rollup/rollup-freebsd-x64": "npm:4.59.0"
+    "@rollup/rollup-linux-arm-gnueabihf": "npm:4.59.0"
+    "@rollup/rollup-linux-arm-musleabihf": "npm:4.59.0"
+    "@rollup/rollup-linux-arm64-gnu": "npm:4.59.0"
+    "@rollup/rollup-linux-arm64-musl": "npm:4.59.0"
+    "@rollup/rollup-linux-loong64-gnu": "npm:4.59.0"
+    "@rollup/rollup-linux-loong64-musl": "npm:4.59.0"
+    "@rollup/rollup-linux-ppc64-gnu": "npm:4.59.0"
+    "@rollup/rollup-linux-ppc64-musl": "npm:4.59.0"
+    "@rollup/rollup-linux-riscv64-gnu": "npm:4.59.0"
+    "@rollup/rollup-linux-riscv64-musl": "npm:4.59.0"
+    "@rollup/rollup-linux-s390x-gnu": "npm:4.59.0"
+    "@rollup/rollup-linux-x64-gnu": "npm:4.59.0"
+    "@rollup/rollup-linux-x64-musl": "npm:4.59.0"
+    "@rollup/rollup-openbsd-x64": "npm:4.59.0"
+    "@rollup/rollup-openharmony-arm64": "npm:4.59.0"
+    "@rollup/rollup-win32-arm64-msvc": "npm:4.59.0"
+    "@rollup/rollup-win32-ia32-msvc": "npm:4.59.0"
+    "@rollup/rollup-win32-x64-gnu": "npm:4.59.0"
+    "@rollup/rollup-win32-x64-msvc": "npm:4.59.0"
+    "@types/estree": "npm:1.0.8"
+    fsevents: "npm:~2.3.2"
+  dependenciesMeta:
+    "@rollup/rollup-android-arm-eabi":
+      optional: true
+    "@rollup/rollup-android-arm64":
+      optional: true
+    "@rollup/rollup-darwin-arm64":
+      optional: true
+    "@rollup/rollup-darwin-x64":
+      optional: true
+    "@rollup/rollup-freebsd-arm64":
+      optional: true
+    "@rollup/rollup-freebsd-x64":
+      optional: true
+    "@rollup/rollup-linux-arm-gnueabihf":
+      optional: true
+    "@rollup/rollup-linux-arm-musleabihf":
+      optional: true
+    "@rollup/rollup-linux-arm64-gnu":
+      optional: true
+    "@rollup/rollup-linux-arm64-musl":
+      optional: true
+    "@rollup/rollup-linux-loong64-gnu":
+      optional: true
+    "@rollup/rollup-linux-loong64-musl":
+      optional: true
+    "@rollup/rollup-linux-ppc64-gnu":
+      optional: true
+    "@rollup/rollup-linux-ppc64-musl":
+      optional: true
+    "@rollup/rollup-linux-riscv64-gnu":
+      optional: true
+    "@rollup/rollup-linux-riscv64-musl":
+      optional: true
+    "@rollup/rollup-linux-s390x-gnu":
+      optional: true
+    "@rollup/rollup-linux-x64-gnu":
+      optional: true
+    "@rollup/rollup-linux-x64-musl":
+      optional: true
+    "@rollup/rollup-openbsd-x64":
+      optional: true
+    "@rollup/rollup-openharmony-arm64":
+      optional: true
+    "@rollup/rollup-win32-arm64-msvc":
+      optional: true
+    "@rollup/rollup-win32-ia32-msvc":
+      optional: true
+    "@rollup/rollup-win32-x64-gnu":
+      optional: true
+    "@rollup/rollup-win32-x64-msvc":
+      optional: true
+    fsevents:
+      optional: true
+  bin:
+    rollup: dist/bin/rollup
+  checksum: 10c0/f38742da34cfee5e899302615fa157aa77cb6a2a1495e5e3ce4cc9c540d3262e235bbe60caa31562bbfe492b01fdb3e7a8c43c39d842d3293bcf843123b766fc
   languageName: node
   linkType: hard
 
@@ -5844,17 +7141,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"safe-regex-test@npm:^1.1.0":
-  version: 1.1.0
-  resolution: "safe-regex-test@npm:1.1.0"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    es-errors: "npm:^1.3.0"
-    is-regex: "npm:^1.2.1"
-  checksum: 10c0/f2c25281bbe5d39cddbbce7f86fca5ea9b3ce3354ea6cd7c81c31b006a5a9fff4286acc5450a3b9122c56c33eba69c56b9131ad751457b2b4a585825e6a10665
-  languageName: node
-  linkType: hard
-
 "safe-regex2@npm:^3.1.0":
   version: 3.1.0
   resolution: "safe-regex2@npm:3.1.0"
@@ -5878,21 +7164,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"saxes@npm:^6.0.0":
-  version: 6.0.0
-  resolution: "saxes@npm:6.0.0"
-  dependencies:
-    xmlchars: "npm:^2.2.0"
-  checksum: 10c0/3847b839f060ef3476eb8623d099aa502ad658f5c40fd60c105ebce86d244389b0d76fcae30f4d0c728d7705ceb2f7e9b34bb54717b6a7dbedaf5dad2d9a4b74
-  languageName: node
-  linkType: hard
-
-"scheduler@npm:^0.23.2":
-  version: 0.23.2
-  resolution: "scheduler@npm:0.23.2"
-  dependencies:
-    loose-envify: "npm:^1.1.0"
-  checksum: 10c0/26383305e249651d4c58e6705d5f8425f153211aef95f15161c151f7b8de885f24751b377e4a0b3dd42cce09aad3f87a61dab7636859c0d89b7daf1a1e2a5c78
+"scheduler@npm:^0.27.0":
+  version: 0.27.0
+  resolution: "scheduler@npm:0.27.0"
+  checksum: 10c0/4f03048cb05a3c8fddc45813052251eca00688f413a3cee236d984a161da28db28ba71bd11e7a3dd02f7af84ab28d39fb311431d3b3772fed557945beb00c452
   languageName: node
   linkType: hard
 
@@ -5928,6 +7203,22 @@ __metadata:
   languageName: node
   linkType: hard
 
+"seroval-plugins@npm:^1.4.2":
+  version: 1.5.0
+  resolution: "seroval-plugins@npm:1.5.0"
+  peerDependencies:
+    seroval: ^1.0
+  checksum: 10c0/a70636d35e0644e37efad37963e6d41ae9e4a02fbf1b57c89dbe4d62122908039e8a0fda1720b8a56aea93741735b2028ada6d3d50c1d40bbb67661f0de92042
+  languageName: node
+  linkType: hard
+
+"seroval@npm:^1.4.2":
+  version: 1.5.0
+  resolution: "seroval@npm:1.5.0"
+  checksum: 10c0/aff16b14a7145388555cefd4ebd41759024ee1c2c064080fd8d4fabea4b7c89d103155cd98f5109523b8878e577da73cc6cd8abf98965f2d1f0ba19dc38317ab
+  languageName: node
+  linkType: hard
+
 "set-cookie-parser@npm:^2.4.1":
   version: 2.7.2
   resolution: "set-cookie-parser@npm:2.7.2"
@@ -5935,32 +7226,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"set-function-length@npm:^1.2.2":
-  version: 1.2.2
-  resolution: "set-function-length@npm:1.2.2"
-  dependencies:
-    define-data-property: "npm:^1.1.4"
-    es-errors: "npm:^1.3.0"
-    function-bind: "npm:^1.1.2"
-    get-intrinsic: "npm:^1.2.4"
-    gopd: "npm:^1.0.1"
-    has-property-descriptors: "npm:^1.0.2"
-  checksum: 10c0/82850e62f412a258b71e123d4ed3873fa9377c216809551192bb6769329340176f109c2eeae8c22a8d386c76739855f78e8716515c818bcaef384b51110f0f3c
-  languageName: node
-  linkType: hard
-
-"set-function-name@npm:^2.0.2":
-  version: 2.0.2
-  resolution: "set-function-name@npm:2.0.2"
-  dependencies:
-    define-data-property: "npm:^1.1.4"
-    es-errors: "npm:^1.3.0"
-    functions-have-names: "npm:^1.2.3"
-    has-property-descriptors: "npm:^1.0.2"
-  checksum: 10c0/fce59f90696c450a8523e754abb305e2b8c73586452619c2bad5f7bf38c7b6b4651895c9db895679c5bef9554339cf3ef1c329b66ece3eda7255785fbe299316
-  languageName: node
-  linkType: hard
-
 "shebang-command@npm:^2.0.0":
   version: 2.0.0
   resolution: "shebang-command@npm:2.0.0"
@@ -5977,54 +7242,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"side-channel-list@npm:^1.0.0":
-  version: 1.0.0
-  resolution: "side-channel-list@npm:1.0.0"
-  dependencies:
-    es-errors: "npm:^1.3.0"
-    object-inspect: "npm:^1.13.3"
-  checksum: 10c0/644f4ac893456c9490ff388bf78aea9d333d5e5bfc64cfb84be8f04bf31ddc111a8d4b83b85d7e7e8a7b845bc185a9ad02c052d20e086983cf59f0be517d9b3d
-  languageName: node
-  linkType: hard
-
-"side-channel-map@npm:^1.0.1":
-  version: 1.0.1
-  resolution: "side-channel-map@npm:1.0.1"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    es-errors: "npm:^1.3.0"
-    get-intrinsic: "npm:^1.2.5"
-    object-inspect: "npm:^1.13.3"
-  checksum: 10c0/010584e6444dd8a20b85bc926d934424bd809e1a3af941cace229f7fdcb751aada0fb7164f60c2e22292b7fa3c0ff0bce237081fd4cdbc80de1dc68e95430672
-  languageName: node
-  linkType: hard
-
-"side-channel-weakmap@npm:^1.0.2":
-  version: 1.0.2
-  resolution: "side-channel-weakmap@npm:1.0.2"
-  dependencies:
-    call-bound: "npm:^1.0.2"
-    es-errors: "npm:^1.3.0"
-    get-intrinsic: "npm:^1.2.5"
-    object-inspect: "npm:^1.13.3"
-    side-channel-map: "npm:^1.0.1"
-  checksum: 10c0/71362709ac233e08807ccd980101c3e2d7efe849edc51455030327b059f6c4d292c237f94dc0685031dd11c07dd17a68afde235d6cf2102d949567f98ab58185
-  languageName: node
-  linkType: hard
-
-"side-channel@npm:^1.0.4, side-channel@npm:^1.1.0":
-  version: 1.1.0
-  resolution: "side-channel@npm:1.1.0"
-  dependencies:
-    es-errors: "npm:^1.3.0"
-    object-inspect: "npm:^1.13.3"
-    side-channel-list: "npm:^1.0.0"
-    side-channel-map: "npm:^1.0.1"
-    side-channel-weakmap: "npm:^1.0.2"
-  checksum: 10c0/cb20dad41eb032e6c24c0982e1e5a24963a28aa6122b4f05b3f3d6bf8ae7fd5474ef382c8f54a6a3ab86e0cac4d41a23bd64ede3970e5bfb50326ba02a7996e6
-  languageName: node
-  linkType: hard
-
 "siginfo@npm:^2.0.0":
   version: 2.0.0
   resolution: "siginfo@npm:2.0.0"
@@ -6132,16 +7349,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"stop-iteration-iterator@npm:^1.0.0":
-  version: 1.1.0
-  resolution: "stop-iteration-iterator@npm:1.1.0"
-  dependencies:
-    es-errors: "npm:^1.3.0"
-    internal-slot: "npm:^1.1.0"
-  checksum: 10c0/de4e45706bb4c0354a4b1122a2b8cc45a639e86206807ce0baf390ee9218d3ef181923fa4d2b67443367c491aa255c5fbaa64bb74648e3c5b48299928af86c09
-  languageName: node
-  linkType: hard
-
 "string_decoder@npm:^1.3.0":
   version: 1.3.0
   resolution: "string_decoder@npm:1.3.0"
@@ -6167,15 +7374,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"strip-indent@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "strip-indent@npm:3.0.0"
-  dependencies:
-    min-indent: "npm:^1.0.0"
-  checksum: 10c0/ae0deaf41c8d1001c5d4fbe16cb553865c1863da4fae036683b474fa926af9fc121e155cb3fc57a68262b2ae7d5b8420aa752c97a6428c315d00efe2a3875679
-  languageName: node
-  linkType: hard
-
 "strip-json-comments@npm:^2.0.0":
   version: 2.0.1
   resolution: "strip-json-comments@npm:2.0.1"
@@ -6206,24 +7404,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"sucrase@npm:^3.35.0":
-  version: 3.35.1
-  resolution: "sucrase@npm:3.35.1"
-  dependencies:
-    "@jridgewell/gen-mapping": "npm:^0.3.2"
-    commander: "npm:^4.0.0"
-    lines-and-columns: "npm:^1.1.6"
-    mz: "npm:^2.7.0"
-    pirates: "npm:^4.0.1"
-    tinyglobby: "npm:^0.2.11"
-    ts-interface-checker: "npm:^0.1.9"
-  bin:
-    sucrase: bin/sucrase
-    sucrase-node: bin/sucrase-node
-  checksum: 10c0/6fa22329c261371feb9560630d961ad0d0b9c87dce21ea74557c5f3ffbe5c1ee970ea8bcce9962ae9c90c3c47165ffa7dd41865c7414f5d8ea7a40755d612c5c
-  languageName: node
-  linkType: hard
-
 "supports-color@npm:^7.1.0":
   version: 7.2.0
   resolution: "supports-color@npm:7.2.0"
@@ -6240,13 +7420,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"symbol-tree@npm:^3.2.4":
-  version: 3.2.4
-  resolution: "symbol-tree@npm:3.2.4"
-  checksum: 10c0/dfbe201ae09ac6053d163578778c53aa860a784147ecf95705de0cd23f42c851e1be7889241495e95c37cabb058edb1052f141387bef68f705afc8f9dd358509
-  languageName: node
-  linkType: hard
-
 "synckit@npm:^0.11.12":
   version: 0.11.12
   resolution: "synckit@npm:0.11.12"
@@ -6256,36 +7429,33 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tailwindcss@npm:^3.4.7":
-  version: 3.4.19
-  resolution: "tailwindcss@npm:3.4.19"
-  dependencies:
-    "@alloc/quick-lru": "npm:^5.2.0"
-    arg: "npm:^5.0.2"
-    chokidar: "npm:^3.6.0"
-    didyoumean: "npm:^1.2.2"
-    dlv: "npm:^1.1.3"
-    fast-glob: "npm:^3.3.2"
-    glob-parent: "npm:^6.0.2"
-    is-glob: "npm:^4.0.3"
-    jiti: "npm:^1.21.7"
-    lilconfig: "npm:^3.1.3"
-    micromatch: "npm:^4.0.8"
-    normalize-path: "npm:^3.0.0"
-    object-hash: "npm:^3.0.0"
-    picocolors: "npm:^1.1.1"
-    postcss: "npm:^8.4.47"
-    postcss-import: "npm:^15.1.0"
-    postcss-js: "npm:^4.0.1"
-    postcss-load-config: "npm:^4.0.2 || ^5.0 || ^6.0"
-    postcss-nested: "npm:^6.2.0"
-    postcss-selector-parser: "npm:^6.1.2"
-    resolve: "npm:^1.22.8"
-    sucrase: "npm:^3.35.0"
-  bin:
-    tailwind: lib/cli.js
-    tailwindcss: lib/cli.js
-  checksum: 10c0/e1063daccb9e5a508b357ec73b0011354204b2366b56496d6f0cc822733a55a0551502cb85856a2257ef9b676d0026616daaaa176d391f3216df57fbd693c581
+"tailwind-merge@npm:^3.5.0":
+  version: 3.5.0
+  resolution: "tailwind-merge@npm:3.5.0"
+  checksum: 10c0/4dc588f5b5296ba3f38e1ebb41f02b6d24a8c5bb45e44b33748c118fb4b5767dd0efc464431ca3e75404056b618b5f67bec3708158baa65fed8a2fc9201e0c53
+  languageName: node
+  linkType: hard
+
+"tailwindcss-animate@npm:^1.0.7":
+  version: 1.0.7
+  resolution: "tailwindcss-animate@npm:1.0.7"
+  peerDependencies:
+    tailwindcss: "*"
+  checksum: 10c0/ec7dbd1631076b97d66a1fbaaa06e0725fccfa63119221e8d87a997b02dcede98ad88bb1ef6665b968f5d260fcefb10592e0299ca70208d365b37761edf5e19a
+  languageName: node
+  linkType: hard
+
+"tailwindcss@npm:4.2.0, tailwindcss@npm:^4.2.0":
+  version: 4.2.0
+  resolution: "tailwindcss@npm:4.2.0"
+  checksum: 10c0/f3152625466651a44b4e397a47f571158477c9ebf35442842f6bbe9728039724e57567ae35972cbfebbc13aaadb053dfa32d20907b971e79dab20568e11b197f
+  languageName: node
+  linkType: hard
+
+"tapable@npm:^2.3.0":
+  version: 2.3.0
+  resolution: "tapable@npm:2.3.0"
+  checksum: 10c0/cb9d67cc2c6a74dedc812ef3085d9d681edd2c1fa18e4aef57a3c0605fdbe44e6b8ea00bd9ef21bc74dd45314e39d31227aa031ebf2f5e38164df514136f2681
   languageName: node
   linkType: hard
 
@@ -6309,24 +7479,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"thenify-all@npm:^1.0.0":
-  version: 1.6.0
-  resolution: "thenify-all@npm:1.6.0"
-  dependencies:
-    thenify: "npm:>= 3.1.0 < 4"
-  checksum: 10c0/9b896a22735e8122754fe70f1d65f7ee691c1d70b1f116fda04fea103d0f9b356e3676cb789506e3909ae0486a79a476e4914b0f92472c2e093d206aed4b7d6b
-  languageName: node
-  linkType: hard
-
-"thenify@npm:>= 3.1.0 < 4":
-  version: 3.3.1
-  resolution: "thenify@npm:3.3.1"
-  dependencies:
-    any-promise: "npm:^1.0.0"
-  checksum: 10c0/f375aeb2b05c100a456a30bc3ed07ef03a39cbdefe02e0403fb714b8c7e57eeaad1a2f5c4ecfb9ce554ce3db9c2b024eba144843cd9e344566d9fcee73b04767
-  languageName: node
-  linkType: hard
-
 "thread-stream@npm:^2.6.0":
   version: 2.7.0
   resolution: "thread-stream@npm:2.7.0"
@@ -6352,6 +7504,20 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tiny-invariant@npm:^1.3.3":
+  version: 1.3.3
+  resolution: "tiny-invariant@npm:1.3.3"
+  checksum: 10c0/65af4a07324b591a059b35269cd696aba21bef2107f29b9f5894d83cc143159a204b299553435b03874ebb5b94d019afa8b8eff241c8a4cfee95872c2e1c1c4a
+  languageName: node
+  linkType: hard
+
+"tiny-warning@npm:^1.0.3":
+  version: 1.0.3
+  resolution: "tiny-warning@npm:1.0.3"
+  checksum: 10c0/ef8531f581b30342f29670cb41ca248001c6fd7975ce22122bd59b8d62b4fc84ad4207ee7faa95cde982fa3357cd8f4be650142abc22805538c3b1392d7084fa
+  languageName: node
+  linkType: hard
+
 "tinybench@npm:^2.5.0":
   version: 2.9.0
   resolution: "tinybench@npm:2.9.0"
@@ -6366,7 +7532,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tinyglobby@npm:^0.2.11, tinyglobby@npm:^0.2.12, tinyglobby@npm:^0.2.15":
+"tinyglobby@npm:^0.2.12, tinyglobby@npm:^0.2.15":
   version: 0.2.15
   resolution: "tinyglobby@npm:0.2.15"
   dependencies:
@@ -6413,27 +7579,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tough-cookie@npm:^4.1.2":
-  version: 4.1.4
-  resolution: "tough-cookie@npm:4.1.4"
-  dependencies:
-    psl: "npm:^1.1.33"
-    punycode: "npm:^2.1.1"
-    universalify: "npm:^0.2.0"
-    url-parse: "npm:^1.5.3"
-  checksum: 10c0/aca7ff96054f367d53d1e813e62ceb7dd2eda25d7752058a74d64b7266fd07be75908f3753a32ccf866a2f997604b414cfb1916d6e7f69bc64d9d9939b0d6c45
-  languageName: node
-  linkType: hard
-
-"tr46@npm:^4.1.1":
-  version: 4.1.1
-  resolution: "tr46@npm:4.1.1"
-  dependencies:
-    punycode: "npm:^2.3.0"
-  checksum: 10c0/92085dcf186f56a49ba4124a581d9ae6a5d0cd4878107c34e2e670b9ddc49da85e4950084bb3e75015195cc23f37ae1c02d45064e94dd6018f5e789aa51d93a8
-  languageName: node
-  linkType: hard
-
 "tree-kill@npm:^1.2.2":
   version: 1.2.2
   resolution: "tree-kill@npm:1.2.2"
@@ -6452,13 +7597,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ts-interface-checker@npm:^0.1.9":
-  version: 0.1.13
-  resolution: "ts-interface-checker@npm:0.1.13"
-  checksum: 10c0/232509f1b84192d07b81d1e9b9677088e590ac1303436da1e92b296e9be8e31ea042e3e1fd3d29b1742ad2c959e95afe30f63117b8f1bc3a3850070a5142fea7
-  languageName: node
-  linkType: hard
-
 "ts-node-dev@npm:^2.0.0":
   version: 2.0.0
   resolution: "ts-node-dev@npm:2.0.0"
@@ -6536,6 +7674,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"tslib@npm:^2.0.0, tslib@npm:^2.1.0, tslib@npm:^2.4.0, tslib@npm:^2.8.1":
+  version: 2.8.1
+  resolution: "tslib@npm:2.8.1"
+  checksum: 10c0/9c4759110a19c53f992d9aae23aac5ced636e99887b51b9e61def52611732872ff7668757d4e4c61f19691e36f4da981cd9485e869b4a7408d689f6bf1f14e62
+  languageName: node
+  linkType: hard
+
 "type-check@npm:^0.4.0, type-check@npm:~0.4.0":
   version: 0.4.0
   resolution: "type-check@npm:0.4.0"
@@ -6559,7 +7704,22 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript@npm:^5.2.0, typescript@npm:^5.2.2, typescript@npm:^5.9.3":
+"typescript-eslint@npm:^8.48.0":
+  version: 8.56.0
+  resolution: "typescript-eslint@npm:8.56.0"
+  dependencies:
+    "@typescript-eslint/eslint-plugin": "npm:8.56.0"
+    "@typescript-eslint/parser": "npm:8.56.0"
+    "@typescript-eslint/typescript-estree": "npm:8.56.0"
+    "@typescript-eslint/utils": "npm:8.56.0"
+  peerDependencies:
+    eslint: ^8.57.0 || ^9.0.0 || ^10.0.0
+    typescript: ">=4.8.4 <6.0.0"
+  checksum: 10c0/13c47bb4a82d6714d482e96991faf2895c45a8e74235191a2ebbd36272487595c0824d128958942a1d1d18eddf8ca40c5850e2e314958a0a2e3c40be92f2d5a0
+  languageName: node
+  linkType: hard
+
+"typescript@npm:^5.2.0, typescript@npm:^5.9.3, typescript@npm:~5.9.3":
   version: 5.9.3
   resolution: "typescript@npm:5.9.3"
   bin:
@@ -6569,7 +7729,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"typescript@patch:typescript@npm%3A^5.2.0#optional!builtin<compat/typescript>, typescript@patch:typescript@npm%3A^5.2.2#optional!builtin<compat/typescript>, typescript@patch:typescript@npm%3A^5.9.3#optional!builtin<compat/typescript>":
+"typescript@patch:typescript@npm%3A^5.2.0#optional!builtin<compat/typescript>, typescript@patch:typescript@npm%3A^5.9.3#optional!builtin<compat/typescript>, typescript@patch:typescript@npm%3A~5.9.3#optional!builtin<compat/typescript>":
   version: 5.9.3
   resolution: "typescript@patch:typescript@npm%3A5.9.3#optional!builtin<compat/typescript>::version=5.9.3&hash=5786d5"
   bin:
@@ -6627,13 +7787,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"universalify@npm:^0.2.0":
-  version: 0.2.0
-  resolution: "universalify@npm:0.2.0"
-  checksum: 10c0/cedbe4d4ca3967edf24c0800cfc161c5a15e240dac28e3ce575c689abc11f2c81ccc6532c8752af3b40f9120fb5e454abecd359e164f4f6aa44c29cd37e194fe
-  languageName: node
-  linkType: hard
-
 "update-browserslist-db@npm:^1.2.0":
   version: 1.2.3
   resolution: "update-browserslist-db@npm:1.2.3"
@@ -6657,13 +7810,34 @@ __metadata:
   languageName: node
   linkType: hard
 
-"url-parse@npm:^1.5.3":
-  version: 1.5.10
-  resolution: "url-parse@npm:1.5.10"
+"use-callback-ref@npm:^1.3.3":
+  version: 1.3.3
+  resolution: "use-callback-ref@npm:1.3.3"
   dependencies:
-    querystringify: "npm:^2.1.1"
-    requires-port: "npm:^1.0.0"
-  checksum: 10c0/bd5aa9389f896974beb851c112f63b466505a04b4807cea2e5a3b7092f6fbb75316f0491ea84e44f66fed55f1b440df5195d7e3a8203f64fcefa19d182f5be87
+    tslib: "npm:^2.0.0"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/f887488c6e6075cdad4962979da1714b217bcb1ee009a9e57ce9a844bcfc4c3a99e93983dfc2e5af9e0913824d24e730090ff255e902c516dcb58d2d3837e01c
+  languageName: node
+  linkType: hard
+
+"use-sidecar@npm:^1.1.3":
+  version: 1.1.3
+  resolution: "use-sidecar@npm:1.1.3"
+  dependencies:
+    detect-node-es: "npm:^1.1.0"
+    tslib: "npm:^2.0.0"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 10c0/161599bf921cfaa41c85d2b01c871975ee99260f3e874c2d41c05890d41170297bdcf314bc5185e7a700de2034ac5b888e3efc8e9f35724f4918f53538d717c9
   languageName: node
   linkType: hard
 
@@ -6676,13 +7850,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"util-deprecate@npm:^1.0.2":
-  version: 1.0.2
-  resolution: "util-deprecate@npm:1.0.2"
-  checksum: 10c0/41a5bdd214df2f6c3ecf8622745e4a366c4adced864bc3c833739791aeeeb1838119af7daed4ba36428114b5c67dcda034a79c882e97e43c03e66a4dd7389942
-  languageName: node
-  linkType: hard
-
 "v8-compile-cache-lib@npm:^3.0.1":
   version: 3.0.1
   resolution: "v8-compile-cache-lib@npm:3.0.1"
@@ -6762,7 +7929,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"vite@npm:^3.0.0 || ^4.0.0 || ^5.0.0-0, vite@npm:^3.1.0 || ^4.0.0 || ^5.0.0-0, vite@npm:^5.1.0":
+"vite@npm:^3.0.0 || ^4.0.0 || ^5.0.0-0, vite@npm:^3.1.0 || ^4.0.0 || ^5.0.0-0":
   version: 5.4.21
   resolution: "vite@npm:5.4.21"
   dependencies:
@@ -6805,6 +7972,61 @@ __metadata:
   languageName: node
   linkType: hard
 
+"vite@npm:^7.3.1":
+  version: 7.3.1
+  resolution: "vite@npm:7.3.1"
+  dependencies:
+    esbuild: "npm:^0.27.0"
+    fdir: "npm:^6.5.0"
+    fsevents: "npm:~2.3.3"
+    picomatch: "npm:^4.0.3"
+    postcss: "npm:^8.5.6"
+    rollup: "npm:^4.43.0"
+    tinyglobby: "npm:^0.2.15"
+  peerDependencies:
+    "@types/node": ^20.19.0 || >=22.12.0
+    jiti: ">=1.21.0"
+    less: ^4.0.0
+    lightningcss: ^1.21.0
+    sass: ^1.70.0
+    sass-embedded: ^1.70.0
+    stylus: ">=0.54.8"
+    sugarss: ^5.0.0
+    terser: ^5.16.0
+    tsx: ^4.8.1
+    yaml: ^2.4.2
+  dependenciesMeta:
+    fsevents:
+      optional: true
+  peerDependenciesMeta:
+    "@types/node":
+      optional: true
+    jiti:
+      optional: true
+    less:
+      optional: true
+    lightningcss:
+      optional: true
+    sass:
+      optional: true
+    sass-embedded:
+      optional: true
+    stylus:
+      optional: true
+    sugarss:
+      optional: true
+    terser:
+      optional: true
+    tsx:
+      optional: true
+    yaml:
+      optional: true
+  bin:
+    vite: bin/vite.js
+  checksum: 10c0/5c7548f5f43a23533e53324304db4ad85f1896b1bfd3ee32ae9b866bac2933782c77b350eb2b52a02c625c8ad1ddd4c000df077419410650c982cd97fde8d014
+  languageName: node
+  linkType: hard
+
 "vitest@npm:^0.31.0":
   version: 0.31.4
   resolution: "vitest@npm:0.31.4"
@@ -6926,22 +8148,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"w3c-xmlserializer@npm:^4.0.0":
-  version: 4.0.0
-  resolution: "w3c-xmlserializer@npm:4.0.0"
-  dependencies:
-    xml-name-validator: "npm:^4.0.0"
-  checksum: 10c0/02cc66d6efc590bd630086cd88252444120f5feec5c4043932b0d0f74f8b060512f79dc77eb093a7ad04b4f02f39da79ce4af47ceb600f2bf9eacdc83204b1a8
-  languageName: node
-  linkType: hard
-
-"webidl-conversions@npm:^7.0.0":
-  version: 7.0.0
-  resolution: "webidl-conversions@npm:7.0.0"
-  checksum: 10c0/228d8cb6d270c23b0720cb2d95c579202db3aaf8f633b4e9dd94ec2000a04e7e6e43b76a94509cdb30479bd00ae253ab2371a2da9f81446cc313f89a4213a2c4
-  languageName: node
-  linkType: hard
-
 "well-known-symbols@npm:^2.0.0":
   version: 2.0.0
   resolution: "well-known-symbols@npm:2.0.0"
@@ -6949,72 +8155,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"whatwg-encoding@npm:^2.0.0":
-  version: 2.0.0
-  resolution: "whatwg-encoding@npm:2.0.0"
-  dependencies:
-    iconv-lite: "npm:0.6.3"
-  checksum: 10c0/91b90a49f312dc751496fd23a7e68981e62f33afe938b97281ad766235c4872fc4e66319f925c5e9001502b3040dd25a33b02a9c693b73a4cbbfdc4ad10c3e3e
-  languageName: node
-  linkType: hard
-
-"whatwg-mimetype@npm:^3.0.0":
-  version: 3.0.0
-  resolution: "whatwg-mimetype@npm:3.0.0"
-  checksum: 10c0/323895a1cda29a5fb0b9ca82831d2c316309fede0365047c4c323073e3239067a304a09a1f4b123b9532641ab604203f33a1403b5ca6a62ef405bcd7a204080f
-  languageName: node
-  linkType: hard
-
-"whatwg-url@npm:^12.0.0, whatwg-url@npm:^12.0.1":
-  version: 12.0.1
-  resolution: "whatwg-url@npm:12.0.1"
-  dependencies:
-    tr46: "npm:^4.1.1"
-    webidl-conversions: "npm:^7.0.0"
-  checksum: 10c0/99f506b2c996704fa0fc5c70d8e5e27dce15492db2921c99cf319a8d56cb61641f5c06089f63e1ab1983de9fd6a63c3c112a90cdb5fe352d7a846979b10df566
-  languageName: node
-  linkType: hard
-
-"which-boxed-primitive@npm:^1.0.2":
-  version: 1.1.1
-  resolution: "which-boxed-primitive@npm:1.1.1"
-  dependencies:
-    is-bigint: "npm:^1.1.0"
-    is-boolean-object: "npm:^1.2.1"
-    is-number-object: "npm:^1.1.1"
-    is-string: "npm:^1.1.1"
-    is-symbol: "npm:^1.1.1"
-  checksum: 10c0/aceea8ede3b08dede7dce168f3883323f7c62272b49801716e8332ff750e7ae59a511ae088840bc6874f16c1b7fd296c05c949b0e5b357bfe3c431b98c417abe
-  languageName: node
-  linkType: hard
-
-"which-collection@npm:^1.0.1":
-  version: 1.0.2
-  resolution: "which-collection@npm:1.0.2"
-  dependencies:
-    is-map: "npm:^2.0.3"
-    is-set: "npm:^2.0.3"
-    is-weakmap: "npm:^2.0.2"
-    is-weakset: "npm:^2.0.3"
-  checksum: 10c0/3345fde20964525a04cdf7c4a96821f85f0cc198f1b2ecb4576e08096746d129eb133571998fe121c77782ac8f21cbd67745a3d35ce100d26d4e684c142ea1f2
-  languageName: node
-  linkType: hard
-
-"which-typed-array@npm:^1.1.13":
-  version: 1.1.20
-  resolution: "which-typed-array@npm:1.1.20"
-  dependencies:
-    available-typed-arrays: "npm:^1.0.7"
-    call-bind: "npm:^1.0.8"
-    call-bound: "npm:^1.0.4"
-    for-each: "npm:^0.3.5"
-    get-proto: "npm:^1.0.1"
-    gopd: "npm:^1.2.0"
-    has-tostringtag: "npm:^1.0.2"
-  checksum: 10c0/16fcdada95c8afb821cd1117f0ab50b4d8551677ac08187f21d4e444530913c9ffd2dac634f0c1183345f96344b69280f40f9a8bc52164ef409e555567c2604b
-  languageName: node
-  linkType: hard
-
 "which@npm:^2.0.1":
   version: 2.0.2
   resolution: "which@npm:2.0.2"
@@ -7063,35 +8203,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"ws@npm:^8.13.0":
-  version: 8.19.0
-  resolution: "ws@npm:8.19.0"
-  peerDependencies:
-    bufferutil: ^4.0.1
-    utf-8-validate: ">=5.0.2"
-  peerDependenciesMeta:
-    bufferutil:
-      optional: true
-    utf-8-validate:
-      optional: true
-  checksum: 10c0/4741d9b9bc3f9c791880882414f96e36b8b254e34d4b503279d6400d9a4b87a033834856dbdd94ee4b637944df17ea8afc4bce0ff4a1560d2166be8855da5b04
-  languageName: node
-  linkType: hard
-
-"xml-name-validator@npm:^4.0.0":
-  version: 4.0.0
-  resolution: "xml-name-validator@npm:4.0.0"
-  checksum: 10c0/c1bfa219d64e56fee265b2bd31b2fcecefc063ee802da1e73bad1f21d7afd89b943c9e2c97af2942f60b1ad46f915a4c81e00039c7d398b53cf410e29d3c30bd
-  languageName: node
-  linkType: hard
-
-"xmlchars@npm:^2.2.0":
-  version: 2.2.0
-  resolution: "xmlchars@npm:2.2.0"
-  checksum: 10c0/b64b535861a6f310c5d9bfa10834cf49127c71922c297da9d4d1b45eeaae40bf9b4363275876088fbe2667e5db028d2cd4f8ee72eed9bede840a67d57dab7593
-  languageName: node
-  linkType: hard
-
 "xtend@npm:^4.0.0":
   version: 4.0.2
   resolution: "xtend@npm:4.0.2"
@@ -7150,9 +8261,25 @@ __metadata:
   languageName: node
   linkType: hard
 
+"zod-validation-error@npm:^3.5.0 || ^4.0.0":
+  version: 4.0.2
+  resolution: "zod-validation-error@npm:4.0.2"
+  peerDependencies:
+    zod: ^3.25.0 || ^4.0.0
+  checksum: 10c0/0ccfec48c46de1be440b719cd02044d4abb89ed0e14c13e637cd55bf29102f67ccdba373f25def0fc7130e5f15025be4d557a7edcc95d5a3811599aade689e1b
+  languageName: node
+  linkType: hard
+
 "zod@npm:^3.22.0":
   version: 3.25.76
   resolution: "zod@npm:3.25.76"
   checksum: 10c0/5718ec35e3c40b600316c5b4c5e4976f7fee68151bc8f8d90ec18a469be9571f072e1bbaace10f1e85cf8892ea12d90821b200e980ab46916a6166a4260a983c
   languageName: node
   linkType: hard
+
+"zod@npm:^3.25.0 || ^4.0.0, zod@npm:^4.3.6":
+  version: 4.3.6
+  resolution: "zod@npm:4.3.6"
+  checksum: 10c0/860d25a81ab41d33aa25f8d0d07b091a04acb426e605f396227a796e9e800c44723ed96d0f53a512b57be3d1520f45bf69c0cb3b378a232a00787a2609625307
+  languageName: node
+  linkType: hard