feat: Full UI/UX overhaul with Seed Data and Agentic Sync

backend/requirements.txt

@@ -6,3 +6,6 @@ pydantic-settings==2.4.0
 google-generativeai==0.7.2
 pypdf==4.2.0
 python-multipart==0.0.9
+sqlalchemy==2.0.25
+pymysql==1.1.0
+cryptography==42.0.2

backend/seed_db.py

@@ -0,0 +1,96 @@
+import sys
+import os
+from sqlalchemy.orm import Session
+from datetime import datetime, timedelta
+
+# Add parent dir to path to import app
+sys.path.append(os.path.dirname(os.path.dirname(os.path.abspath(__file__))))
+
+from app.database import SessionLocal, engine, Base
+from app.models.tender import TenderModel
+from app.models.analysis import AnalysisHistoryModel
+from app.models.company import CompanyProfileModel
+
+def seed():
+    Base.metadata.drop_all(bind=engine)
+    Base.metadata.create_all(bind=engine)
+    
+    db = SessionLocal()
+    
+    # 1. Company Profile
+    profile = CompanyProfileModel(
+        name="Andes Digital Solutions",
+        industry="Software & AI Engineering",
+        services="Machine Learning, Web Development, Cloud Infrastructure",
+        experience="Over 10 years delivering high-impact digital products in Latin America.",
+        certifications="AWS Certified, ISO 27001",
+        regions="Metropolitana, Valparaíso, Biobío",
+        documents_available="RUT, Financial Statements 2023, Portfolio, Technical Team CVs"
+    )
+    db.add(profile)
+    
+    # 2. Sample Tenders
+    tenders = [
+        TenderModel(
+            code="1234-56-LE24",
+            name="Plataforma de Gestión Documental para el MINVU",
+            description="Desarrollo e implementación de una plataforma basada en la nube para la gestión de subsidios habitacionales.",
+            buyer="Ministerio de Vivienda y Urbanismo",
+            status="Publicada",
+            closing_date=(datetime.now() + timedelta(days=15)).strftime("%Y-%m-%d"),
+            estimated_amount=120000000,
+            region="Metropolitana",
+            sector="Tecnología de la Información",
+            source="Mercado Público"
+        ),
+        TenderModel(
+            code="7890-12-LP24",
+            name="Servicio de Consultoría IA para Modernización del Estado",
+            description="Estudio y prototipado de agentes de IA para atención ciudadana automatizada.",
+            buyer="Secretaría General de la Presidencia",
+            status="Publicada",
+            closing_date=(datetime.now() + timedelta(days=5)).strftime("%Y-%m-%d"),
+            estimated_amount=45000000,
+            region="Metropolitana",
+            sector="Consultoría",
+            source="Mercado Público"
+        ),
+        TenderModel(
+            code="5544-33-LE24",
+            name="Soporte y Mantención Infraestructura Crítica",
+            description="Mantenimiento preventivo y correctivo de servidores y redes institucionales.",
+            buyer="Gobierno Regional de Valparaíso",
+            status="Publicada",
+            closing_date=(datetime.now() + timedelta(days=2)).strftime("%Y-%m-%d"),
+            estimated_amount=75000000,
+            region="Valparaíso",
+            sector="Servicios Técnicos",
+            source="Mercado Público"
+        )
+    ]
+    for t in tenders:
+        db.add(t)
+    
+    # 3. Sample Analysis History
+    history = AnalysisHistoryModel(
+        tender_code="1234-56-LE24",
+        tender_name="Plataforma de Gestión Documental para el MINVU",
+        decision="Recommended",
+        score=85,
+        summary="La licitación se alinea perfectamente con las capacidades de Andes Digital en desarrollo cloud y gestión de datos.",
+        risks='[{"severity": "Low", "description": "Plazos de entrega ajustados"}, {"severity": "Medium", "description": "Requisito de boleta de garantía alta"}]',
+        technical_analysis="Factibilidad técnica alta. Requiere stack de Python/React.",
+        legal_analysis="Cumplimos con todas las bases administrativas.",
+        commercial_analysis="Margen proyectado del 25% tras costos operacionales.",
+        proposal_draft="Se propone una arquitectura basada en microservicios...",
+        report_markdown="# Reporte Ejecutivo: MINVU Platform\n\n## Conclusión\nLicitación ganable...",
+        created_at=datetime.now()
+    )
+    db.add(history)
+    
+    db.commit()
+    print("Database seeded successfully!")
+    db.close()
+
+if __name__ == "__main__":
+    seed()

frontend/.env.local

@@ -0,0 +1 @@
+NEXT_PUBLIC_API_BASE=https://tidy-glasses-cover.loca.lt

frontend/app/page.tsx

@@ -9,6 +9,7 @@ import ProposalDraft from "../components/ProposalDraft";
 import Reports from "../components/Reports";
 import Sidebar from "../components/Sidebar";
 import AnalysisHistory from "../components/AnalysisHistory";
+import GlobalSync from "../components/GlobalSync";
 import { analyzeTender, fetchAnalysisHistory, fetchCompanyProfile, healthCheck, saveCompanyProfile, searchTenders } from "../lib/api";
 import type { AnalysisHistoryItem, AnalysisResult, CompanyProfile as CompanyProfileType, Tender } from "../lib/types";
 
@@ -27,6 +28,7 @@ type Tab = (typeof tabs)[number];
 
 export default function HomePage() {
   const [activeTab, setActiveTab] = useState<Tab>("Dashboard");
+  const [showSync, setShowSync] = useState(true);
   const [tenders, setTenders] = useState<Tender[]>([]);
   const [selectedTender, setSelectedTender] = useState<Tender | null>(null);
   const [companyProfile, setCompanyProfile] = useState<CompanyProfileType>({
@@ -120,6 +122,7 @@ export default function HomePage() {
 
   return (
     <div className="min-h-screen">
+      {showSync && <GlobalSync onComplete={() => setShowSync(false)} />}
       <div className="mx-auto flex min-h-screen max-w-[1500px] gap-8 px-8 py-6">
         <Sidebar
           tabs={tabs}

frontend/components/AgentAnalysis.tsx

@@ -12,9 +12,9 @@ type Props = {
 };
 
 const agents = [
-  { id: "legal", name: "Dra. Legal", role: "Compliance", avatar: "⚖️", color: "text-amber-400" },
-  { id: "tech", name: "Ing. Tech", role: "Architecture", avatar: "👨‍💻", color: "text-cyan" },
-  { id: "risk", name: "Sra. Estrategia", role: "ROI & Risk", avatar: "🕵️‍♀️", color: "text-purple-400" },
+  { id: "legal", name: "Dra. Legal", role: "Compliance", avatar: "⚖️", color: "text-amber-400", desc: "Verifies administrative bases and legal risks." },
+  { id: "tech", name: "Ing. Tech", role: "Architecture", avatar: "👨‍💻", color: "text-cyan", desc: "Evaluates technical feasibility and stack requirements." },
+  { id: "risk", name: "Sra. Estrategia", role: "ROI & Risk", avatar: "🕵️‍♀️", color: "text-purple-400", desc: "Calculates commercial impact and win probability." },
 ];
 
 export default function AgentAnalysis({ tender, companyProfile, analysis, onAnalyze }: Props) {
@@ -50,68 +50,103 @@ export default function AgentAnalysis({ tender, companyProfile, analysis, onAnal
     setIsRunning(false);
   };
 
+  if (!tender && !analysis) {
+    return (
+      <div className="flex flex-col items-center justify-center min-h-[60vh] space-y-12 animate-in fade-in duration-1000">
+        <div className="text-center space-y-4">
+          <div className="inline-block p-4 rounded-3xl bg-white/5 border border-white/10 mb-6">
+            <span className="text-5xl">🤖</span>
+          </div>
+          <h2 className="text-4xl font-bold text-white tracking-tight">Agent War Room</h2>
+          <p className="text-slate-400 max-w-md mx-auto text-lg leading-relaxed">
+            Our specialized agents are ready to analyze your next big opportunity. 
+            Select a tender from <span className="text-purple-400 font-bold italic">Tender Search</span> to begin.
+          </p>
+        </div>
+
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-6 max-w-5xl w-full px-4">
+          {agents.map(agent => (
+            <div key={agent.id} className="glass-card rounded-3xl p-8 space-y-4 border border-white/5">
+              <div className="text-4xl">{agent.avatar}</div>
+              <div>
+                <h4 className={`text-xs font-bold uppercase tracking-widest ${agent.color} mb-1`}>{agent.role}</h4>
+                <h3 className="text-xl font-bold text-white mb-2">{agent.name}</h3>
+                <p className="text-sm text-slate-500 leading-relaxed">{agent.desc}</p>
+              </div>
+            </div>
+          ))}
+        </div>
+        
+        <div className="flex items-center gap-3 text-slate-600 animate-bounce">
+          <span className="text-sm font-bold uppercase tracking-widest">Go to Tender Search</span>
+          <span className="text-xl">↓</span>
+        </div>
+      </div>
+    );
+  }
+
   return (
-    <div className="space-y-8">
+    <div className="space-y-8 animate-in fade-in slide-in-from-bottom-4 duration-700">
       {/* Tender Header Card */}
-      <div className="relative overflow-hidden rounded-3xl border border-slate-800 bg-slate-900/40 p-8 shadow-2xl">
-        <div className="absolute -right-20 -top-20 h-64 w-64 rounded-full bg-cyan/5 blur-[100px]" />
+      <div className="glass-card relative overflow-hidden rounded-3xl p-8 border border-white/10">
+        <div className="absolute -right-20 -top-20 h-64 w-64 rounded-full bg-purple-500/10 blur-[100px]" />
         <div className="relative z-10 flex flex-col gap-8 lg:flex-row lg:items-center lg:justify-between">
           <div className="max-w-3xl">
             <div className="flex items-center gap-3 mb-4">
-              <span className="rounded-full bg-cyan/10 px-3 py-1 text-[10px] font-bold uppercase tracking-widest text-cyan">Licitación Seleccionada</span>
+              <span className="rounded-full bg-purple-500/20 px-3 py-1 text-[10px] font-bold uppercase tracking-widest text-purple-300 border border-purple-500/30">Active Opportunity</span>
               <span className="text-xs text-slate-500 font-mono">{tender?.code}</span>
             </div>
-            <h2 className="text-4xl font-bold text-white tracking-tight leading-tight">{tender?.name ?? "Esperando selección..."}</h2>
-            <p className="mt-4 text-slate-400 font-medium">{tender?.buyer ?? "Busca una oportunidad en Tender Search para iniciar la mesa de expertos."}</p>
+            <h2 className="text-4xl font-bold text-white tracking-tight leading-tight mb-4">{tender?.name}</h2>
+            <p className="text-slate-400 text-lg leading-relaxed">{tender?.buyer}</p>
             
             {tender && (
               <div className="mt-8 flex flex-wrap gap-4">
-                <div className="rounded-2xl bg-slate-950/50 p-4 border border-slate-800/50">
-                   <p className="text-[10px] uppercase text-slate-500 font-bold mb-1">Monto Estimado</p>
+                <div className="rounded-2xl bg-white/5 p-4 border border-white/5">
+                   <p className="text-[10px] uppercase text-slate-500 font-bold mb-1">Estimated Amount</p>
                    <p className="text-lg font-semibold text-white">
-                      {tender.estimated_amount ? new Intl.NumberFormat("es-CL", { style: "currency", currency: "CLP", maximumFractionDigits: 0 }).format(tender.estimated_amount) : "No declarado"}
+                      {tender.estimated_amount ? new Intl.NumberFormat("es-CL", { style: "currency", currency: "CLP", maximumFractionDigits: 0 }).format(tender.estimated_amount) : "Not disclosed"}
                    </p>
                 </div>
-                <div className="rounded-2xl bg-slate-950/50 p-4 border border-slate-800/50">
-                   <p className="text-[10px] uppercase text-slate-500 font-bold mb-1">Cierre Técnico</p>
+                <div className="rounded-2xl bg-white/5 p-4 border border-white/5">
+                   <p className="text-[10px] uppercase text-slate-500 font-bold mb-1">Closing Date</p>
                    <p className="text-lg font-semibold text-white">{tender.closing_date}</p>
                 </div>
               </div>
             )}
           </div>
 
-          <div className="flex flex-col gap-4 lg:w-72">
-             <div className="rounded-2xl border border-slate-800 bg-slate-950 p-6">
-                <h4 className="text-xs font-bold uppercase text-slate-400 mb-4 tracking-tighter">Bases Técnicas (PDF)</h4>
-                <input type="file" accept=".pdf" onChange={handleFileChange} className="w-full text-xs text-slate-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-[10px] file:font-bold file:bg-slate-800 file:text-cyan hover:file:bg-slate-700 transition cursor-pointer" />
-                {file && <p className="mt-2 text-[10px] text-green-400">✓ Archivo cargado correctamente</p>}
+          <div className="flex flex-col gap-4 lg:w-80">
+             <div className="glass-card rounded-2xl p-6 bg-white/5 border border-white/10">
+                <h4 className="text-[10px] font-bold uppercase text-slate-400 mb-4 tracking-widest">Administrative Bases (PDF)</h4>
+                <input type="file" accept=".pdf" onChange={handleFileChange} className="w-full text-xs text-slate-500 file:mr-4 file:py-2 file:px-4 file:rounded-full file:border-0 file:text-[10px] file:font-bold file:bg-white/10 file:text-purple-300 hover:file:bg-white/20 transition cursor-pointer" />
+                {file && <p className="mt-2 text-[10px] text-green-400 font-bold">✓ Ready for extraction</p>}
              </div>
              
-             <label className="flex items-center gap-3 p-3 rounded-2xl bg-slate-950/50 cursor-pointer hover:bg-slate-950 transition">
-                <input type="checkbox" checked={approved} onChange={(e) => setApproved(e.target.checked)} className="h-5 w-5 rounded border-slate-700 bg-slate-950 text-cyan outline-none" />
-                <span className="text-[11px] font-semibold text-slate-300">Autorizar mesa de expertos</span>
+             <label className="flex items-center gap-3 p-4 rounded-2xl bg-white/5 cursor-pointer hover:bg-white/10 transition border border-white/5">
+                <input type="checkbox" checked={approved} onChange={(e) => setApproved(e.target.checked)} className="h-5 w-5 rounded border-white/20 bg-black text-purple-500 outline-none accent-purple-500" />
+                <span className="text-xs font-semibold text-slate-300">Authorize Agent War Room</span>
              </label>
 
              <button
                onClick={handleAnalyzeClick}
                disabled={!tender || !approved || isRunning || isUploading}
-               className="w-full rounded-2xl bg-cyan py-5 font-bold text-slate-950 transition hover:bg-sky disabled:opacity-30 disabled:cursor-not-allowed shadow-[0_0_20px_rgba(6,182,212,0.15)]"
+               className="w-full rounded-2xl premium-gradient py-5 font-bold text-white transition hover:opacity-90 disabled:opacity-30 disabled:cursor-not-allowed shadow-xl shadow-purple-500/20 active:scale-[0.98]"
              >
-               {isUploading ? "Cargando Bases..." : isRunning ? "Agentes Debatiendo..." : "Iniciar Sesión Agéntica"}
+               {isUploading ? "Extracting Text..." : isRunning ? "Agents Debating..." : "Launch Analysis Pipeline"}
              </button>
           </div>
         </div>
       </div>
 
-      {/* Agents Row (War Room) */}
-      <div className="grid gap-4 md:grid-cols-3">
+      {/* Agents Row (Visual feedback) */}
+      <div className="grid gap-6 md:grid-cols-3">
         {agents.map((agent) => (
-          <div key={agent.id} className={`rounded-3xl border border-slate-800 bg-slate-900/20 p-6 flex items-center gap-4 transition duration-500 ${isRunning ? 'animate-pulse' : ''} ${analysis ? 'border-slate-700 bg-slate-900/40' : ''}`}>
-             <div className="text-3xl grayscale-[0.5] hover:grayscale-0 transition">{agent.avatar}</div>
+          <div key={agent.id} className={`glass-card rounded-3xl p-6 flex items-center gap-4 transition-all duration-700 ${isRunning ? 'ring-2 ring-purple-500/50 animate-pulse' : ''} ${analysis ? 'border-purple-500/30' : 'border-white/5'}`}>
+             <div className={`text-4xl ${isRunning ? 'animate-bounce' : ''}`}>{agent.avatar}</div>
              <div>
-                <div className={`text-xs font-bold uppercase tracking-widest ${agent.color}`}>{agent.role}</div>
-                <div className="text-sm font-semibold text-white">{agent.name}</div>
-                {analysis && <div className="text-[10px] text-green-400 mt-1">Conclusión generada ✓</div>}
+                <div className={`text-[10px] font-bold uppercase tracking-widest ${agent.color}`}>{agent.role}</div>
+                <div className="text-sm font-bold text-white">{agent.name}</div>
+                {analysis && <div className="text-[9px] text-green-400 font-bold mt-1 uppercase tracking-tighter tracking-widest">Analysis Ready ✓</div>}
              </div>
           </div>
         ))}
@@ -120,54 +155,57 @@ export default function AgentAnalysis({ tender, companyProfile, analysis, onAnal
       {/* Analysis Results View */}
       {analysis && (
         <div className="grid gap-8 lg:grid-cols-12 animate-in fade-in slide-in-from-bottom-8 duration-1000">
-          {/* Main Fit Score & Summary */}
           <div className="lg:col-span-8 space-y-8">
-             <div className="rounded-3xl border border-slate-800 bg-slate-950/80 p-8 shadow-inner">
-                <div className="flex items-start justify-between">
+             <div className="glass-card rounded-3xl p-10 bg-white/[0.02]">
+                <div className="flex items-start justify-between mb-8">
                    <div>
-                      <div className="text-[11px] font-bold uppercase tracking-[0.3em] text-cyan mb-2">Consenso de la Mesa</div>
-                      <h3 className="text-5xl font-black text-white">{analysis.fit_score}% <span className="text-2xl font-normal text-slate-500">Fit Score</span></h3>
+                      <div className="text-[11px] font-bold uppercase tracking-[0.3em] text-purple-400 mb-2">Agent Consensus</div>
+                      <h3 className="text-6xl font-black text-white">{analysis.fit_score}% <span className="text-2xl font-light text-slate-500">Fit Score</span></h3>
                    </div>
-                   <div className={`rounded-2xl px-4 py-2 text-xs font-bold uppercase ${analysis.decision === 'Recommended' ? 'bg-green-500/20 text-green-400' : 'bg-amber-500/20 text-amber-400'}`}>
+                   <div className={`rounded-2xl px-6 py-3 text-[10px] font-black uppercase tracking-widest shadow-lg ${analysis.decision === 'Recommended' ? 'bg-green-500/20 text-green-400 border border-green-500/30 shadow-green-500/10' : 'bg-amber-500/20 text-amber-400 border border-amber-500/30 shadow-amber-500/10'}`}>
                       {analysis.decision}
                    </div>
                 </div>
-                <div className="mt-8 prose prose-invert max-w-none">
-                   <p className="text-slate-300 text-lg leading-relaxed italic border-l-4 border-cyan pl-6">{analysis.executive_summary}</p>
+                <div className="prose prose-invert max-w-none">
+                   <p className="text-slate-300 text-xl leading-relaxed italic border-l-4 border-purple-500 pl-8">{analysis.executive_summary}</p>
                 </div>
              </div>
 
              <div className="grid gap-6 md:grid-cols-2">
-                <div className="rounded-3xl border border-slate-800 bg-slate-900/40 p-6">
-                   <h4 className="text-[11px] font-bold uppercase tracking-widest text-amber-400 mb-6">Gaps de Cumplimiento (Legal)</h4>
+                <div className="glass-card rounded-3xl p-8 bg-white/[0.01]">
+                   <h4 className="text-[11px] font-bold uppercase tracking-widest text-amber-400 mb-6 flex items-center gap-2">
+                     <span>⚠️</span> Legal Compliance Gaps
+                   </h4>
                    <ul className="space-y-4">
                       {analysis.compliance_gaps.map((gap, i) => (
-                        <li key={i} className="flex gap-3 text-sm text-slate-300">
-                           <span className="text-amber-400">⚠</span> {gap}
+                        <li key={i} className="flex gap-4 text-sm text-slate-400 leading-relaxed">
+                           <span className="text-amber-500 font-bold">•</span> {gap}
                         </li>
                       ))}
                    </ul>
                 </div>
-                <div className="rounded-3xl border border-slate-800 bg-slate-900/40 p-6">
-                   <h4 className="text-[11px] font-bold uppercase tracking-widest text-cyan mb-6">Requerimientos Clave (Técnico)</h4>
+                <div className="glass-card rounded-3xl p-8 bg-white/[0.01]">
+                   <h4 className="text-[11px] font-bold uppercase tracking-widest text-cyan mb-6 flex items-center gap-2">
+                     <span>💎</span> Technical Requirements
+                   </h4>
                    <ul className="space-y-4">
                       {analysis.key_requirements.map((req, i) => (
-                        <li key={i} className="flex gap-3 text-sm text-slate-300">
-                           <span className="text-cyan">▹</span> {req}
+                        <li key={i} className="flex gap-4 text-sm text-slate-400 leading-relaxed">
+                           <span className="text-cyan font-bold">▹</span> {req}
                         </li>
                       ))}
                    </ul>
                 </div>
              </div>
 
-             <div className="rounded-3xl border border-slate-800 bg-slate-900/40 p-8">
-                <h4 className="text-[11px] font-bold uppercase tracking-widest text-purple-400 mb-8 text-center">Matriz de Riesgos Identificados</h4>
-                <div className="grid gap-4 md:grid-cols-2">
+             <div className="glass-card rounded-3xl p-10 bg-white/[0.01]">
+                <h4 className="text-[11px] font-bold uppercase tracking-widest text-purple-400 mb-8 text-center">Neural Risk Matrix</h4>
+                <div className="grid gap-6 md:grid-cols-2">
                    {analysis.risks.map((risk, i) => (
-                     <div key={i} className="group rounded-2xl bg-slate-950 p-5 border border-slate-800 hover:border-purple-500/50 transition">
-                        <div className="flex items-center justify-between mb-3">
-                           <span className="font-bold text-white group-hover:text-purple-400 transition">{risk.title}</span>
-                           <span className={`text-[9px] font-black px-2 py-0.5 rounded uppercase ${risk.severity === 'High' ? 'bg-red-500/20 text-red-500' : 'bg-slate-800 text-slate-400'}`}>{risk.severity}</span>
+                     <div key={i} className="group rounded-3xl bg-white/[0.02] p-6 border border-white/5 hover:border-purple-500/30 transition-all duration-300">
+                        <div className="flex items-center justify-between mb-4">
+                           <span className="font-bold text-white text-lg group-hover:text-purple-400 transition">{risk.title}</span>
+                           <span className={`text-[9px] font-black px-3 py-1 rounded-full uppercase tracking-widest ${risk.severity === 'High' ? 'bg-red-500/20 text-red-500 border border-red-500/20' : 'bg-white/5 text-slate-500 border border-white/5'}`}>{risk.severity}</span>
                         </div>
                         <p className="text-xs text-slate-500 leading-relaxed">{risk.explanation}</p>
                      </div>
@@ -176,22 +214,21 @@ export default function AgentAnalysis({ tender, companyProfile, analysis, onAnal
              </div>
           </div>
 
-          {/* Right Col: Audit Trail & Conversation */}
-          <div className="lg:col-span-4 space-y-6">
-             <div className="rounded-3xl border border-slate-800 bg-slate-950 p-6 flex flex-col h-full shadow-2xl">
-                <div className="flex items-center gap-3 mb-8 border-b border-slate-800 pb-4">
-                   <div className="h-2 w-2 rounded-full bg-cyan animate-pulse shadow-[0_0_10px_rgba(6,182,212,0.5)]" />
-                   <h4 className="text-[10px] font-bold uppercase tracking-widest text-slate-400">Audit Trail & Agents Log</h4>
+          <div className="lg:col-span-4">
+             <div className="glass-card rounded-3xl p-8 bg-black/40 h-full sticky top-32">
+                <div className="flex items-center gap-3 mb-8 border-b border-white/5 pb-6">
+                   <div className="h-2 w-2 rounded-full bg-purple-500 animate-pulse shadow-[0_0_12px_rgba(168,85,247,0.8)]" />
+                   <h4 className="text-[10px] font-bold uppercase tracking-widest text-slate-400">Agent Intelligence Log</h4>
                 </div>
-                <div className="flex-1 space-y-6 overflow-y-auto max-h-[600px] pr-2 custom-scrollbar">
+                <div className="space-y-8 overflow-y-auto max-h-[700px] pr-2 custom-scrollbar">
                    {analysis.audit_log?.map((log, i) => (
-                     <div key={i} className="flex gap-4 group">
+                     <div key={i} className="flex gap-5 group">
                         <div className="flex flex-col items-center">
-                           <div className="h-6 w-6 rounded-full bg-slate-900 flex items-center justify-center text-[10px] border border-slate-800 group-hover:border-cyan transition">🤖</div>
-                           {i < (analysis.audit_log?.length ?? 0) - 1 && <div className="w-[1px] flex-1 bg-slate-800 my-2" />}
+                           <div className="h-8 w-8 rounded-xl bg-white/5 flex items-center justify-center text-sm border border-white/10 group-hover:border-purple-500/50 transition-all duration-300 shadow-lg">🤖</div>
+                           {i < (analysis.audit_log?.length ?? 0) - 1 && <div className="w-px flex-1 bg-gradient-to-b from-purple-500/40 to-transparent my-3" />}
                         </div>
-                        <div className="pb-4">
-                           <p className="text-xs text-slate-400 leading-relaxed group-hover:text-slate-200 transition">{log}</p>
+                        <div className="pb-6">
+                           <p className="text-[13px] text-slate-400 leading-relaxed group-hover:text-white transition-colors duration-300">{log}</p>
                         </div>
                      </div>
                    ))}
@@ -200,14 +237,6 @@ export default function AgentAnalysis({ tender, companyProfile, analysis, onAnal
           </div>
         </div>
       )}
-
-      {!analysis && !isRunning && (
-        <div className="rounded-3xl border border-dashed border-slate-800 bg-slate-950/20 p-20 flex flex-col items-center justify-center text-center">
-           <div className="text-6xl mb-6 grayscale opacity-20">🤖⚖️👨‍💻🕵️‍♀️</div>
-           <h3 className="text-xl font-bold text-slate-500">Mesa de expertos inactiva</h3>
-           <p className="mt-2 text-sm text-slate-600 max-w-sm">Selecciona una licitación y carga las bases para iniciar el debate agéntico entre nuestros especialistas.</p>
-        </div>
-      )}
     </div>
   );
 }

frontend/components/AnalysisHistory.tsx

@@ -1,3 +1,5 @@
+"use client";
+
 import type { AnalysisHistoryItem } from "../lib/types";
 
 type Props = {
@@ -7,62 +9,69 @@ type Props = {
 export default function AnalysisHistory({ history }: Props) {
   if (!history.length) {
     return (
-      <div className="rounded-3xl border border-slate-800 bg-slate-950/80 p-8 text-slate-400">
-        No hay historial de análisis todavía. Ejecuta un análisis para comenzar a guardarlo.
+      <div className="flex flex-col items-center justify-center min-h-[40vh] glass-card rounded-3xl border border-white/5 p-12 text-center animate-in fade-in duration-700">
+        <div className="text-4xl mb-4 opacity-30">📜</div>
+        <h3 className="text-xl font-bold text-white mb-2">No Analysis History</h3>
+        <p className="text-slate-500 max-w-xs mx-auto">Your past agentic debates and reports will appear here for audit and review.</p>
       </div>
     );
   }
 
   return (
-    <div className="space-y-6">
-      <div className="rounded-3xl border border-slate-800 bg-slate-950/80 p-6">
-        <div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
-          <div>
-            <h2 className="text-2xl font-semibold text-white">Analysis History</h2>
-            <p className="mt-2 text-slate-400">Revisa los análisis previos generados por el agente para auditoría y seguimiento.</p>
-          </div>
-        </div>
-      </div>
-
-      <div className="space-y-4">
+    <div className="space-y-8 animate-in fade-in slide-in-from-bottom-4 duration-700">
+      <div className="space-y-6">
         {history.map((item) => (
-          <div key={`${item.tender_code}-${item.analyzed_at}`} className="rounded-3xl border border-slate-800 bg-slate-900/80 p-6">
-            <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
-              <div>
-                <div className="text-sm text-slate-500">Tender</div>
-                <div className="text-lg font-semibold text-white">{item.tender_name}</div>
-                <div className="text-sm text-slate-400">Código: {item.tender_code}</div>
+          <div key={`${item.tender_code}-${item.analyzed_at}`} className="glass-card rounded-3xl p-8 border border-white/5 hover:border-purple-500/30 transition-all duration-300">
+            <div className="flex flex-col gap-6 lg:flex-row lg:items-center lg:justify-between">
+              <div className="space-y-1">
+                <div className="flex items-center gap-3 mb-2">
+                   <span className="text-[10px] font-black uppercase tracking-widest text-purple-400 bg-purple-500/10 px-2 py-0.5 rounded border border-purple-500/20">Audit Record</span>
+                   <span className="text-xs text-slate-500 font-mono">{item.tender_code}</span>
+                </div>
+                <h3 className="text-2xl font-bold text-white tracking-tight">{item.tender_name}</h3>
+                <p className="text-xs text-slate-500">{new Date(item.analyzed_at).toLocaleString()}</p>
               </div>
-              <div className="text-right">
-                <div className="text-sm uppercase tracking-[0.25em] text-cyan-300/80">Fit score</div>
-                <div className="mt-2 text-3xl font-semibold text-white">{item.analysis.fit_score}%</div>
-                <div className="mt-1 text-sm text-slate-400">{new Date(item.analyzed_at).toLocaleString()}</div>
+              
+              <div className="flex items-center gap-8 bg-white/5 rounded-2xl p-6 border border-white/5">
+                <div className="text-center">
+                  <p className="text-[9px] uppercase tracking-widest text-slate-500 font-bold mb-1">Fit Score</p>
+                  <p className="text-3xl font-black text-white">{item.analysis.fit_score}%</p>
+                </div>
+                <div className="h-10 w-px bg-white/10" />
+                <div className="text-center">
+                  <p className="text-[9px] uppercase tracking-widest text-slate-500 font-bold mb-1">Decision</p>
+                  <p className={`text-xs font-black uppercase tracking-widest px-3 py-1 rounded-full ${item.analysis.decision === 'Recommended' ? 'bg-green-500/20 text-green-400' : 'bg-amber-500/20 text-amber-400'}`}>
+                    {item.analysis.decision}
+                  </p>
+                </div>
               </div>
             </div>
-            <div className="mt-6 grid gap-4 md:grid-cols-3">
-              <div className="rounded-2xl bg-slate-950/80 p-4 text-sm text-slate-300">
-                <div className="font-semibold text-white">Decision</div>
-                <div className="mt-2">{item.analysis.decision}</div>
+
+            <div className="mt-8 grid gap-4 grid-cols-2 md:grid-cols-4">
+              <div className="p-4 rounded-2xl bg-black/20 border border-white/5">
+                <p className="text-[9px] uppercase text-slate-500 font-bold mb-1">Risks Detected</p>
+                <p className="text-sm font-bold text-white">{item.analysis.risks.length}</p>
               </div>
-              <div className="rounded-2xl bg-slate-950/80 p-4 text-sm text-slate-300">
-                <div className="font-semibold text-white">Key Requirements</div>
-                <div className="mt-2">{item.analysis.key_requirements.length}</div>
+              <div className="p-4 rounded-2xl bg-black/20 border border-white/5">
+                <p className="text-[9px] uppercase text-slate-500 font-bold mb-1">Key Requirements</p>
+                <p className="text-sm font-bold text-white">{item.analysis.key_requirements.length}</p>
               </div>
-              <div className="rounded-2xl bg-slate-950/80 p-4 text-sm text-slate-300">
-                <div className="font-semibold text-white">Risks</div>
-                <div className="mt-2">{item.analysis.risks.length}</div>
+              <div className="p-4 rounded-2xl bg-black/20 border border-white/5">
+                <p className="text-[9px] uppercase text-slate-500 font-bold mb-1">Legal Gaps</p>
+                <p className="text-sm font-bold text-white">{item.analysis.compliance_gaps.length}</p>
               </div>
-            </div>
-            {item.analysis.audit_log?.length ? (
-              <div className="mt-6 rounded-2xl border border-amber-900/40 bg-amber-950/10 p-4 text-sm text-slate-200">
-                <div className="font-semibold text-amber-200">Audit trail</div>
-                <ul className="mt-3 list-disc space-y-2 pl-5">
-                  {item.analysis.audit_log.map((entry, index) => (
-                    <li key={index}>{entry}</li>
-                  ))}
-                </ul>
+              <div className="p-4 rounded-2xl bg-black/20 border border-white/5">
+                <p className="text-[9px] uppercase text-slate-500 font-bold mb-1">Audit Logs</p>
+                <p className="text-sm font-bold text-white">{item.analysis.audit_log?.length ?? 0}</p>
               </div>
-            ) : null}
+            </div>
+            
+            <div className="mt-6">
+              <button className="text-xs font-bold text-purple-400 hover:text-white transition-colors flex items-center gap-2">
+                <span>View Full Analysis Details</span>
+                <span>→</span>
+              </button>
+            </div>
           </div>
         ))}
       </div>

frontend/components/GlobalSync.tsx

@@ -0,0 +1,73 @@
+"use client";
+
+import { useEffect, useState } from "react";
+
+export default function GlobalSync({ onComplete }: { onComplete: () => void }) {
+  const [progress, setProgress] = useState(0);
+  const [message, setMessage] = useState("Initializing Neural Sync...");
+
+  const messages = [
+    "Establishing encrypted connection...",
+    "Synchronizing with Mercado Público...",
+    "Activating Legal Analyst Agent...",
+    "Activating Technical Reviewer Agent...",
+    "Activating Commercial Strategist Agent...",
+    "Orchestrating multi-agent pipeline...",
+    "Ready for analysis."
+  ];
+
+  useEffect(() => {
+    let currentMsg = 0;
+    const interval = setInterval(() => {
+      setProgress(prev => {
+        if (prev >= 100) {
+          clearInterval(interval);
+          setTimeout(onComplete, 500);
+          return 100;
+        }
+        
+        // Update message based on progress
+        const msgIdx = Math.floor((prev / 100) * messages.length);
+        if (msgIdx !== currentMsg && messages[msgIdx]) {
+          currentMsg = msgIdx;
+          setMessage(messages[msgIdx]);
+        }
+        
+        return prev + 2;
+      });
+    }, 40);
+
+    return () => clearInterval(interval);
+  }, [onComplete]);
+
+  return (
+    <div className="fixed inset-0 z-[100] flex flex-col items-center justify-center bg-[#030303] text-white">
+      <div className="relative w-64 h-64 flex items-center justify-center mb-12">
+        {/* Animated Rings */}
+        <div className="absolute inset-0 border-2 border-purple-500/20 rounded-full animate-[spin_10s_linear_infinite]" />
+        <div className="absolute inset-4 border-2 border-indigo-500/40 rounded-full animate-[spin_7s_linear_infinite_reverse]" />
+        <div className="absolute inset-8 border-2 border-cyan-500/60 rounded-full animate-[spin_5s_linear_infinite]" />
+        
+        {/* Progress Text */}
+        <div className="flex flex-col items-center">
+          <span className="text-4xl font-bold text-gradient mb-1">{progress}%</span>
+          <span className="text-[10px] uppercase tracking-[0.2em] text-slate-500 font-bold">Syncing</span>
+        </div>
+      </div>
+
+      <div className="space-y-4 text-center">
+        <h2 className="text-xl font-bold tracking-tight">{message}</h2>
+        <div className="w-64 h-1 bg-white/5 rounded-full overflow-hidden">
+          <div 
+            className="h-full premium-gradient transition-all duration-300 ease-out" 
+            style={{ width: `${progress}%` }} 
+          />
+        </div>
+      </div>
+      
+      <div className="absolute bottom-12 text-[10px] uppercase tracking-[0.4em] text-slate-700 font-bold">
+        AndesOps AI Framework v1.0
+      </div>
+    </div>
+  );
+}

start.sh

@@ -1,10 +1,17 @@
 #!/bin/bash
 
+# Seed Database with sample data for demo
+echo "Seeding database..."
+cd /app/backend && python seed_db.py
+
 # Start Backend
+echo "Starting Backend..."
 cd /app/backend && uvicorn app.main:app --host 0.0.0.0 --port 8000 &
 
 # Start Frontend
+echo "Starting Frontend..."
 cd /app/frontend && npm run start -- -p 3000 &
 
 # Start Nginx
+echo "Starting Nginx..."
 nginx -g "daemon off;"