[P1] Transformar HTML de superficie de lectura a herramienta de trabajo interactiva

[ramsani]

Problema

Los HTML generados son superficies de lectura, no superficies de trabajo. El usuario consume información pasivamente en lugar de interactuar con ella.

El veredicto se muestra como texto estático. No hay acciones posibles. No se adapta al contexto del usuario.

Referencia

https://thariqs.github.io/html-effectiveness/ — el gold standard donde cada HTML es una herramienta interactiva.

Solución propuesta

Transformar cada HTML en una herramienta de trabajo con:

1. Veredicto con botones de acción

   • [Aceptar ✓] [No me Convence] [Copiar] [Recalcular]
   • El veredicto debe ser visible en 3 segundos sin scroll

2. Panel de contexto parametrizable

   Tu stack: [Python ▾]
   Tu budget: [Medio ▾]
   Plazo: [2 semanas ▾]
   
   [🔄 Recalcular recomendación]
   

   • El usuario ingresa su contexto y el veredicto se recalcula

3. Persistencia de estado

   • LocalStorage para guardar acciones completadas, filtros activos, inputs
   • El documento funciona días/semanas después sin perder estado

Scope

• Modificar el template base del artifact para incluir componentes interactivos
• Agregar CSS para estados (hover, active, disabled)
• Agregar JS para handlers de acciones y persistencia

No-scope

• No cambiar la estructura de secciones (Evidence, Perspectives, etc.)
• No agregar dependencias externas
• No cambiar el sistema de calidad/auditoría

Acceptance

• El veredicto muestra 3+ botones de acción
• Panel de contexto permite cambiar al menos 3 parámetros
• El estado persiste al cerrar y reopen el archivo
• Los botones tienen feedback visual (hover, click)

Validación

# El artifact generado tiene botones de acción
grep -c "button" generated-artifact.html  # > 3

# El panel de contexto tiene inputs
grep -c "select\|input" generated-artifact.html  # > 2

# El JS tiene persistencia
grep "localStorage" generated-artifact.html  # existe

Rollback

Revertir cambios en template base. Los artifacts existentes mantienen su estructura actual.