genoma-evolution 1.0.0

package/install.sh

@@ -0,0 +1,245 @@
+#!/usr/bin/env bash
+# ═══════════════════════════════════════════════════════════════════
+# Hermes Dashboard — Universal Installer
+# Works on Linux (x86_64/aarch64) and macOS (Intel/Apple Silicon)
+# ═══════════════════════════════════════════════════════════════════
+set -euo pipefail
+
+DASHBOARD_DIR="$(cd "$(dirname "$0")" && pwd)"
+BACKEND_DIR="$DASHBOARD_DIR/backend"
+PYTHON=""
+
+# ── Colors ──────────────────────────────────────────────────────────
+RED='\033[0;31m'; GREEN='\033[0;32m'; YELLOW='\033[1;33m'
+CYAN='\033[0;36m'; BOLD='\033[1m'; NC='\033[0m'
+
+info()  { echo -e "${CYAN}▸${NC} $*"; }
+ok()    { echo -e "${GREEN}✓${NC} $*"; }
+warn()  { echo -e "${YELLOW}⚠${NC} $*"; }
+err()   { echo -e "${RED}✗${NC} $*" >&2; }
+banner(){ echo -e "\n${BOLD}${CYAN}$*${NC}\n"; }
+
+# ── Detect OS ───────────────────────────────────────────────────────
+detect_os() {
+    case "$(uname -s)" in
+        Linux*)  OS="linux";;
+        Darwin*) OS="macos";;
+        *)       err "Unsupported OS: $(uname -s)"; exit 1;;
+    esac
+    ARCH="$(uname -m)"
+    ok "Detected: $OS ($ARCH)"
+}
+
+# ── Find Python ─────────────────────────────────────────────────────
+find_python() {
+    for candidate in python3.12 python3.11 python3; do
+        if command -v "$candidate" &>/dev/null; then
+            local ver
+            ver=$("$candidate" -c "import sys; print(f'{sys.version_info.major}.{sys.version_info.minor}')" 2>/dev/null || echo "0.0")
+            local major=${ver%%.*}
+            local minor=${ver#*.}
+            if [[ "$major" -ge 3 && "$minor" -ge 10 ]]; then
+                PYTHON="$candidate"
+                ok "Python: $PYTHON ($ver)"
+                return 0
+            fi
+        fi
+    done
+    err "Python 3.10+ not found. Install it first."
+    exit 1
+}
+
+# ── Find hermes-agent ───────────────────────────────────────────────
+find_hermes() {
+    local candidates=(
+        "${HERMES_AGENT_REPO:-}"
+        "$HOME/.hermes/hermes-agent"
+        "$HOME/.local/share/hermes/hermes-agent"
+        "/usr/local/share/hermes/hermes-agent"
+        "$DASHBOARD_DIR/../hermes-agent"
+    )
+    for p in "${candidates[@]}"; do
+        [[ -z "$p" ]] && continue
+        if [[ -d "$p/skills" ]]; then
+            HERMES_REPO="$p"
+            ok "hermes-agent: $HERMES_REPO"
+            return 0
+        fi
+    done
+    err "hermes-agent not found. Set HERMES_AGENT_REPO or install to ~/.hermes/hermes-agent"
+    exit 1
+}
+
+# ── Find hermes-agent-self-evolution ────────────────────────────────
+find_evolution() {
+    local candidates=(
+        "$HOME/.hermes/hermes-agent-self-evolution"
+        "$DASHBOARD_DIR/../hermes-agent-self-evolution"
+        "$HOME/dev/hermes-agent-self-evolution"
+    )
+    for p in "${candidates[@]}"; do
+        if [[ -d "$p/evolution" ]]; then
+            EVOLUTION_DIR="$p"
+            ok "self-evolution: $EVOLUTION_DIR"
+            return 0
+        fi
+    done
+    warn "hermes-agent-self-evolution not found (evolution features will be limited)"
+    EVOLUTION_DIR=""
+}
+
+# ── Setup Python venv ───────────────────────────────────────────────
+setup_python_deps() {
+    banner "Setting up Python backend"
+
+    if [[ ! -d "$BACKEND_DIR/venv" ]]; then
+        info "Creating venv..."
+        "$PYTHON" -m venv "$BACKEND_DIR/venv"
+    fi
+
+    # Activate venv
+    source "$BACKEND_DIR/venv/bin/activate"
+
+    info "Installing Python deps..."
+    pip install -q --upgrade pip
+    pip install -q -r "$BACKEND_DIR/requirements.txt"
+
+    # Also install evolution deps if available
+    if [[ -n "$EVOLUTION_DIR" && -f "$EVOLUTION_DIR/pyproject.toml" ]]; then
+        info "Installing evolution deps..."
+        pip install -q dspy click rich pyyaml openai 2>/dev/null || warn "Some evolution deps failed (non-critical)"
+    fi
+
+    ok "Python deps installed"
+}
+
+# ── Setup Node deps ─────────────────────────────────────────────────
+setup_node_deps() {
+    banner "Setting up Node.js frontend"
+
+    if ! command -v node &>/dev/null; then
+        err "Node.js not found. Install from https://nodejs.org"
+        exit 1
+    fi
+
+    local node_ver
+    node_ver=$(node -v | tr -d 'v' | cut -d. -f1)
+    if [[ "$node_ver" -lt 18 ]]; then
+        err "Node.js 18+ required (found $(node -v))"
+        exit 1
+    fi
+    ok "Node.js: $(node -v)"
+
+    if [[ ! -d "$DASHBOARD_DIR/node_modules" ]]; then
+        info "Installing npm deps..."
+        cd "$DASHBOARD_DIR"
+        npm install --silent
+    fi
+    ok "Node deps installed"
+}
+
+# ── Generate .env ───────────────────────────────────────────────────
+generate_env() {
+    banner "Generating configuration"
+
+    local env_file="$DASHBOARD_DIR/.env.local"
+    cat > "$env_file" << EOF
+# Auto-generated by install.sh — $(date -u +%Y-%m-%dT%H:%M:%SZ)
+NEXT_PUBLIC_API_URL=http://localhost:8787
+HERMES_AGENT_REPO=$HERMES_REPO
+EVOLUTION_DIR=$EVOLUTION_DIR
+PYTHON=$(which "$PYTHON" 2>/dev/null || echo "$PYTHON")
+EOF
+    ok "Config: $env_file"
+}
+
+# ── Create start script ─────────────────────────────────────────────
+create_start_script() {
+    local start_script="$DASHBOARD_DIR/start.sh"
+    cat > "$start_script" << 'STARTEOF'
+#!/usr/bin/env bash
+# Hermes Dashboard — Start script
+set -euo pipefail
+DIR="$(cd "$(dirname "$0")" && pwd)"
+
+# Load env
+[[ -f "$DIR/.env.local" ]] && set -a && source "$DIR/.env.local" && set +a
+
+echo "╔══════════════════════════════════════════╗"
+echo "║  Hermes Evolution Dashboard              ║"
+echo "╚══════════════════════════════════════════╝"
+echo ""
+
+# Start backend
+echo "▸ Starting backend (port 8787)..."
+source "$DIR/backend/venv/bin/activate"
+export HERMES_AGENT_REPO="${HERMES_AGENT_REPO:-$HOME/.hermes/hermes-agent}"
+export PYTHONPATH="${EVOLUTION_DIR:-$HOME/.hermes/hermes-agent-self-evolution}"
+uvicorn backend.main:app --host 0.0.0.0 --port 8787 &
+BACKEND_PID=$!
+
+# Wait for backend
+for i in $(seq 1 15); do
+    curl -sf http://localhost:8787/api/health >/dev/null 2>&1 && break
+    sleep 0.5
+done
+echo "✓ Backend online (PID $BACKEND_PID)"
+
+# Start frontend
+echo "▸ Starting frontend (port 3001)..."
+PORT=3001 npm run dev --prefix "$DIR" &
+FRONTEND_PID=$!
+echo "✓ Frontend starting..."
+echo ""
+echo "  Dashboard: http://localhost:3001"
+echo "  API:       http://localhost:8787"
+echo ""
+echo "  Press Ctrl+C to stop"
+echo ""
+
+# Cleanup on exit
+cleanup() {
+    echo ""
+    echo "Stopping..."
+    kill $BACKEND_PID 2>/dev/null || true
+    kill $FRONTEND_PID 2>/dev/null || true
+    exit 0
+}
+trap cleanup INT TERM
+
+wait
+STARTEOF
+    chmod +x "$start_script"
+    ok "Start script: $start_script"
+}
+
+# ── Count skills (for verification) ─────────────────────────────────
+count_skills() {
+    if [[ -d "$HERMES_REPO/skills" ]]; then
+        local md_count desc_count total
+        md_count=$(find "$HERMES_REPO/skills" -name "SKILL.md" 2>/dev/null | wc -l | tr -d ' ')
+        desc_count=$(find "$HERMES_REPO/skills" -name "DESCRIPTION.md" 2>/dev/null | wc -l | tr -d ' ')
+        total=$((md_count + desc_count))
+        ok "Skills found: $total ($md_count SKILL.md + $desc_count DESCRIPTION.md)"
+    fi
+}
+
+# ═══════════════════════════════════════════════════════════════════
+# Main
+# ═══════════════════════════════════════════════════════════════════
+banner "Hermes Dashboard Installer"
+
+detect_os
+find_python
+find_hermes
+find_evolution
+count_skills
+setup_python_deps
+setup_node_deps
+generate_env
+create_start_script
+
+banner "Installation complete!"
+echo "  Start with:  ./start.sh"
+echo "  Dashboard:   http://localhost:3001"
+echo ""

package/next-env.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+import "./.next/dev/types/routes.d.ts";
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.

package/next.config.ts

@@ -0,0 +1,32 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+  // Standalone output — reduces node_modules in production
+  output: "standalone",
+
+
+  // Proxy API calls to FastAPI backend (:8000)
+  async rewrites() {
+    return [
+      {
+        source: "/api/:path*",
+        destination: "http://localhost:8000/api/:path*",
+      },
+    ];
+  },
+
+  // Bundle optimization: tree-shake unused deps
+  experimental: {
+    optimizePackageImports: [
+      "lucide-react",
+      "framer-motion",
+      "radix-ui",
+      "react-bits",
+    ],
+  },
+
+  // Keep source maps manageable
+  productionBrowserSourceMaps: false,
+};
+
+export default nextConfig;

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "genoma-evolution",
+  "version": "1.0.0",
+  "private": false,
+  "bin": {
+    "genoma": "./bin/genoma.js"
+  },
+  "postinstall": "node scripts/postinstall.js",
+  "prepublishOnly": "pnpm build",
+  "dependencies": {
+    "@chenglou/pretext": "^0.0.6",
+    "@tanstack/react-query": "^5.99.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "framer-motion": "^12.38.0",
+    "lucide-react": "^1.8.0",
+    "next": "^16.2.6",
+    "next-themes": "^0.4.6",
+    "radix-ui": "^1.4.3",
+    "react": "19.2.4",
+    "react-bits": "^1.0.5",
+    "react-dom": "19.2.4",
+    "shadcn": "^4.4.0",
+    "tailwind-merge": "^3.5.0",
+    "tw-animate-css": "^1.4.0",
+    "vis-data": "^8.0.3",
+    "vis-network": "^10.0.2"
+  },
+  "devDependencies": {
+    "@next/bundle-analyzer": "^16.2.4",
+    "@tailwindcss/postcss": "^4",
+    "@types/node": "^20",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
+    "eslint": "^9",
+    "eslint-config-next": "16.2.4",
+    "tailwindcss": "^4",
+    "typescript": "^5"
+  },
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "eslint"
+  }
+}

package/pnpm-workspace.yaml

@@ -0,0 +1,4 @@
+allowBuilds:
+  msw: set this to true or false
+  sharp: set this to true or false
+  unrs-resolver: set this to true or false

package/postcss.config.mjs

@@ -0,0 +1,7 @@
+const config = {
+  plugins: {
+    "@tailwindcss/postcss": {},
+  },
+};
+
+export default config;

package/public/file.svg

@@ -0,0 +1 @@
+<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>

package/public/globe.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>

package/public/next.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>

package/public/theme-preview.html

@@ -0,0 +1,257 @@
+<!DOCTYPE html>
+<html lang="es">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Genoma — Light Theme Preview</title>
+  <script src="https://cdn.tailwindcss.com"></script>
+  <script>
+    tailwind.config = {
+      theme: {
+        extend: {
+          colors: {
+            base: '#F4F7FA',
+            surface: '#FFFFFF',
+            'surface-hover': '#F0F4F8',
+            primary: {
+              50: '#ECFEFF', 100: '#CFFAFE', 200: '#A5F3FC',
+              300: '#67E8F9', 400: '#22D3EE', 500: '#06B6D4',
+              600: '#0891B2', 700: '#0E7490', 800: '#155E75', 900: '#164E63',
+            },
+            semantic: {
+              success: '#2DD4BF', warning: '#FBBF24',
+              error: '#E11D48', info: '#0EA5E9',
+            },
+            txt: {
+              primary: '#0F172A', secondary: '#475569',
+              tertiary: '#94A3B8', inverse: '#F8FAFC',
+            }
+          },
+          boxShadow: {
+            'evo-sm': '0 1px 2px 0 rgba(15, 23, 42, 0.05)',
+            'evo-md': '0 4px 6px -1px rgba(15, 23, 42, 0.08), 0 2px 4px -2px rgba(15, 23, 42, 0.04)',
+            'evo-lg': '0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.04)',
+            'evo-glow': '0 0 0 3px rgba(6, 182, 212, 0.15)',
+          }
+        }
+      }
+    }
+  </script>
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
+  <style>body { font-family: 'Inter', sans-serif; }</style>
+</head>
+<body class="bg-base min-h-screen">
+  <!-- Sidebar -->
+  <div class="fixed left-0 top-0 h-full w-16 bg-surface border-r border-gray-200 flex flex-col items-center py-6 gap-4 z-50">
+    <div class="w-10 h-10 rounded-xl bg-primary-600 flex items-center justify-center text-white font-bold text-lg">G</div>
+    <div class="w-8 h-8 rounded-lg bg-primary-50 text-primary-700 flex items-center justify-center text-sm">🏠</div>
+    <div class="w-8 h-8 rounded-lg bg-primary-600 text-white flex items-center justify-center text-sm shadow-evo-md">⚡</div>
+    <div class="w-8 h-8 rounded-lg hover:bg-surface-hover text-txt-secondary flex items-center justify-center text-sm transition-colors">📊</div>
+    <div class="w-8 h-8 rounded-lg hover:bg-surface-hover text-txt-secondary flex items-center justify-center text-sm transition-colors">🧠</div>
+  </div>
+
+  <!-- Main Content -->
+  <div class="ml-16 p-8">
+    <!-- Header -->
+    <div class="flex items-center justify-between mb-8">
+      <div class="flex items-center gap-3">
+        <div class="w-10 h-10 rounded-xl bg-primary-100 flex items-center justify-center">
+          <span class="text-xl">⚡</span>
+        </div>
+        <div>
+          <h1 class="text-2xl font-bold text-txt-primary">Skill Hub</h1>
+          <p class="text-sm text-txt-secondary">Tus skills locales, organizadas por proveedor y categoría</p>
+        </div>
+      </div>
+      <div class="flex items-center gap-3">
+        <button class="px-4 py-2 bg-primary-600 text-white rounded-lg text-sm font-medium hover:bg-primary-700 transition-colors shadow-evo-md">
+          🎨 Aplicar Tema
+        </button>
+        <button class="px-4 py-2 bg-surface border border-gray-200 text-txt-secondary rounded-lg text-sm hover:bg-surface-hover transition-colors">
+          🔄 Refresh
+        </button>
+      </div>
+    </div>
+
+    <!-- Search + Filters -->
+    <div class="flex gap-4 mb-6">
+      <div class="relative flex-1">
+        <span class="absolute left-3 top-1/2 -translate-y-1/2 text-txt-tertiary">🔍</span>
+        <input type="text" placeholder="Buscar skills por nombre, descripción o categoría..."
+          class="w-full pl-10 pr-4 py-3 bg-surface border border-gray-200 rounded-xl focus:outline-none focus:ring-2 focus:ring-primary-500/30 focus:border-primary-400 text-txt-primary shadow-evo-sm"
+        />
+      </div>
+      <select class="px-4 py-3 bg-surface border border-gray-200 rounded-xl text-txt-secondary focus:outline-none focus:ring-2 focus:ring-primary-500/30 shadow-evo-sm">
+        <option>Todos los providers</option>
+        <option>Agency</option>
+        <option>Hermes</option>
+      </select>
+      <select class="px-4 py-3 bg-surface border border-gray-200 rounded-xl text-txt-secondary focus:outline-none focus:ring-2 focus:ring-primary-500/30 shadow-evo-sm">
+        <option>Todas las categorías</option>
+        <option>software-development</option>
+        <option>devops</option>
+      </select>
+    </div>
+
+    <!-- Stats Cards -->
+    <div class="grid grid-cols-4 gap-4 mb-8">
+      <div class="bg-surface rounded-2xl border border-gray-100 p-5 shadow-evo-md hover:shadow-evo-lg transition-shadow">
+        <div class="text-2xl mb-2">🏢</div>
+        <div class="text-sm font-medium text-txt-secondary capitalize">Agency</div>
+        <div class="text-3xl font-bold text-primary-700 mt-1">1173/1185</div>
+        <div class="text-xs text-txt-tertiary mt-1">habilitadas</div>
+      </div>
+      <div class="bg-surface rounded-2xl border border-gray-100 p-5 shadow-evo-md hover:shadow-evo-lg transition-shadow">
+        <div class="text-2xl mb-2">🪽</div>
+        <div class="text-sm font-medium text-txt-secondary capitalize">Hermes</div>
+        <div class="text-3xl font-bold text-primary-700 mt-1">127/127</div>
+        <div class="text-xs text-txt-tertiary mt-1">habilitadas</div>
+      </div>
+      <div class="bg-surface rounded-2xl border border-gray-100 p-5 shadow-evo-md hover:shadow-evo-lg transition-shadow">
+        <div class="text-2xl mb-2">🤖</div>
+        <div class="text-sm font-medium text-txt-secondary capitalize">Claude-Code</div>
+        <div class="text-3xl font-bold text-primary-700 mt-1">99/99</div>
+        <div class="text-xs text-txt-tertiary mt-1">habilitadas</div>
+      </div>
+      <div class="bg-surface rounded-2xl border border-gray-100 p-5 shadow-evo-md hover:shadow-evo-lg transition-shadow">
+        <div class="text-2xl mb-2">⚡</div>
+        <div class="text-sm font-medium text-txt-secondary capitalize">Kilocode</div>
+        <div class="text-3xl font-bold text-primary-700 mt-1">27/27</div>
+        <div class="text-xs text-txt-tertiary mt-1">habilitadas</div>
+      </div>
+    </div>
+
+    <!-- Provider: Hermes (Expanded) -->
+    <div class="bg-surface rounded-2xl border border-gray-100 shadow-evo-md overflow-hidden mb-6">
+      <div class="flex items-center justify-between p-5 cursor-pointer hover:bg-surface-hover transition-colors">
+        <div class="flex items-center gap-3">
+          <span class="text-2xl">🪽</span>
+          <div>
+            <h2 class="text-lg font-bold text-txt-primary capitalize">Hermes</h2>
+            <p class="text-xs text-txt-tertiary">25 categorías</p>
+          </div>
+        </div>
+        <div class="flex items-center gap-4">
+          <span class="text-sm text-txt-secondary">127/127 activas</span>
+          <span class="text-txt-tertiary">▼</span>
+        </div>
+      </div>
+
+      <div class="px-5 pb-5 space-y-3">
+        <!-- Category: software-development -->
+        <div class="border border-gray-100 rounded-xl overflow-hidden">
+          <div class="flex items-center justify-between p-3 hover:bg-base transition-colors cursor-pointer">
+            <div class="flex items-center gap-2">
+              <span class="text-gray-400">📁</span>
+              <span class="text-sm font-semibold text-primary-700 bg-primary-50 px-2 py-0.5 rounded-lg border border-primary-200">
+                software-development
+              </span>
+              <span class="text-xs text-txt-tertiary">32 skills</span>
+            </div>
+            <span class="text-txt-tertiary text-sm">▼</span>
+          </div>
+          <div class="p-3 pt-0 grid grid-cols-3 gap-2">
+            <div class="p-3 bg-base rounded-lg border border-gray-100 hover:border-primary-300 hover:shadow-evo-sm transition-all">
+              <div class="flex items-start justify-between">
+                <div>
+                  <h3 class="font-medium text-txt-primary text-sm">python-cli-to-dashboard</h3>
+                  <p class="text-xs text-txt-secondary mt-1">Wrap Python CLI in FastAPI</p>
+                </div>
+                <div class="w-8 h-8 rounded-lg bg-semantic-success/10 text-semantic-success flex items-center justify-center text-xs">✓</div>
+              </div>
+            </div>
+            <div class="p-3 bg-base rounded-lg border border-gray-100 hover:border-primary-300 hover:shadow-evo-sm transition-all">
+              <div class="flex items-start justify-between">
+                <div>
+                  <h3 class="font-medium text-txt-primary text-sm">tauri-linux-compat</h3>
+                  <p class="text-xs text-txt-secondary mt-1">Port Tauri to Linux</p>
+                </div>
+                <div class="w-8 h-8 rounded-lg bg-semantic-success/10 text-semantic-success flex items-center justify-center text-xs">✓</div>
+              </div>
+            </div>
+            <div class="p-3 bg-base rounded-lg border border-gray-100 hover:border-primary-300 hover:shadow-evo-sm transition-all">
+              <div class="flex items-start justify-between">
+                <div>
+                  <h3 class="font-medium text-txt-primary text-sm">test-driven-dev</h3>
+                  <p class="text-xs text-txt-secondary mt-1">TDD workflow</p>
+                </div>
+                <div class="w-8 h-8 rounded-lg bg-semantic-success/10 text-semantic-success flex items-center justify-center text-xs">✓</div>
+              </div>
+            </div>
+          </div>
+          <button class="w-full py-2 text-sm text-primary-600 hover:text-primary-700 hover:bg-primary-50 transition-colors border-t border-dashed border-gray-200">
+            Mostrar más (29 restantes)
+          </button>
+        </div>
+
+        <!-- Category: devops -->
+        <div class="border border-gray-100 rounded-xl overflow-hidden">
+          <div class="flex items-center justify-between p-3 hover:bg-base transition-colors cursor-pointer">
+            <div class="flex items-center gap-2">
+              <span class="text-gray-400">📁</span>
+              <span class="text-sm font-semibold text-semantic-info bg-sky-50 px-2 py-0.5 rounded-lg border border-sky-200">
+                devops
+              </span>
+              <span class="text-xs text-txt-tertiary">16 skills</span>
+            </div>
+            <span class="text-txt-tertiary text-sm">▼</span>
+          </div>
+        </div>
+
+        <!-- Category: github -->
+        <div class="border border-gray-100 rounded-xl overflow-hidden">
+          <div class="flex items-center justify-between p-3 hover:bg-base transition-colors cursor-pointer">
+            <div class="flex items-center gap-2">
+              <span class="text-gray-400">📁</span>
+              <span class="text-sm font-semibold text-orange-600 bg-orange-50 px-2 py-0.5 rounded-lg border border-orange-200">
+                github
+              </span>
+              <span class="text-xs text-txt-tertiary">6 skills</span>
+            </div>
+            <span class="text-txt-tertiary text-sm">▼</span>
+          </div>
+        </div>
+
+        <!-- Category: creative -->
+        <div class="border border-gray-100 rounded-xl overflow-hidden">
+          <div class="flex items-center justify-between p-3 hover:bg-base transition-colors cursor-pointer">
+            <div class="flex items-center gap-2">
+              <span class="text-gray-400">📁</span>
+              <span class="text-sm font-semibold text-purple-600 bg-purple-50 px-2 py-0.5 rounded-lg border border-purple-200">
+                creative
+              </span>
+              <span class="text-xs text-txt-tertiary">13 skills</span>
+            </div>
+            <span class="text-txt-tertiary text-sm">▼</span>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Provider: Claude-Code (Collapsed) -->
+    <div class="bg-surface rounded-2xl border border-gray-100 shadow-evo-sm overflow-hidden mb-6">
+      <div class="flex items-center justify-between p-5 cursor-pointer hover:bg-surface-hover transition-colors">
+        <div class="flex items-center gap-3">
+          <span class="text-2xl">🤖</span>
+          <div>
+            <h2 class="text-lg font-bold text-txt-primary capitalize">Claude-Code</h2>
+            <p class="text-xs text-txt-tertiary">1 categoría</p>
+          </div>
+        </div>
+        <div class="flex items-center gap-4">
+          <span class="text-sm text-txt-secondary">99/99 activas</span>
+          <span class="text-txt-tertiary">▶</span>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <!-- Floating Theme Toggle -->
+  <div class="fixed bottom-6 right-6 flex gap-2">
+    <div class="bg-surface border border-gray-200 rounded-xl p-1 shadow-evo-lg flex gap-1">
+      <button class="px-3 py-1.5 rounded-lg bg-primary-600 text-white text-sm font-medium">☀️ Light</button>
+      <button class="px-3 py-1.5 rounded-lg hover:bg-gray-100 text-txt-secondary text-sm transition-colors">🌙 Dark</button>
+    </div>
+  </div>
+</body>
+</html>

package/public/vercel.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>

package/public/window.svg

@@ -0,0 +1 @@
+<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>