feat(sprint-5/etapa-3): heatmap gradiente 4 stops + modo percentil + localStorage + fix zoom

- colors.ts: gradiente continuo verde→amarillo→naranja→rojo (interpolación N-stops genérica)
- Renombra modos: relative→percentile (rank-based), absolute→minmax
- Hook useHeatmapMode(): persiste selección en localStorage con clave inq-roi:heatmap-mode
- HeatmapLegend: barra de 4 stops, labels P0/P50/P100 en modo percentil
- HeatmapModeToggle: etiquetas "Percentil" / "Min-max"
- pdf-sections.ts: leyenda PDF con 4 stops interpolados
- BpmnCanvas: controles de zoom movidos a esquina inferior izquierda (evita logo bpmn.io)
- Tests: 528 unitarios pasan; E2E recalibrados con vecino más cercano (distancia euclidiana)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/features/report/ReportPage.tsx

@@ -26,7 +26,7 @@ import { TopSavingsChart } from './TopSavingsChart'
 import { TransparencySection } from './TransparencySection'
 import { AutomationScenarioNote } from './AutomationScenarioNote'
 import { MethodologyFooter } from './MethodologyFooter'
-import type { HeatmapMode } from '@/lib/colors'
+import { useHeatmapMode } from '@/lib/hooks/useHeatmapMode'
 import { useSimulationStore } from '@/store/simulation-store'
 import { AppHeader } from '@/components/AppHeader'
 
@@ -36,7 +36,7 @@ export function ReportPage() {
   const { process, simulation, activities, resources, isLoading, error } = useReportData(processId)
 
   const { toast } = useToast()
-  const [heatmapMode, setHeatmapMode] = useState<HeatmapMode>('relative')
+  const [heatmapMode, setHeatmapMode] = useHeatmapMode()
   const { lastPersistedExecutedAt, loadLatestForProcess } = useSimulationStore()
 
   // Cargar executedAt persistido si el usuario llega directo al reporte (sin pasar por workspace)