@danieltmn/tamnora 0.25.1 → 0.26.0

package/harness/packages/server/public/settings.js

@@ -1,1322 +1,1255 @@
-import { deleteEntity, importEntity, toggleEntity } from './chat.js';
-import {
-  agentControlsSlot,
-  applySessionAgent,
-  loadModels,
-  modelSelect,
-  moveAgentControls,
-  persistAgent,
-  providerSelect,
-  setSummaryText,
-  updateStatus,
-} from './chrome.js';
-import { $, api, button, clear, el, emptyState, icon, state } from './core.js';
-import { filterSettings } from './settingsNav.js';
-
-/* --- providers ----------------------------------------------------------- */
-
-export const providerListEl = $('#provider-list');
-export const providerForm = $('#provider-form');
-export const providerModal = $('#provider-modal');
-
-export async function refreshProviders() {
-  const data = await api('/api/providers').catch(() => null);
-  if (!data) return;
-  state.providers = data.providers;
-  state.active = data.active;
-  syncTopbar();
-  renderProviderList();
-  const record = state.panes.get(state.sessionId);
-  if (record) await applySessionAgent(record);
-}
-
-export function isConfigured(p) {
-  return Boolean(p.hasKey) || !p.requiresKey;
-}
-
-export function syncTopbar() {
-  clear(providerSelect);
-  const configured = state.providers.filter(isConfigured);
-  for (const p of configured) {
-    const option = document.createElement('option');
-    option.value = p.id;
-    option.textContent = p.label && p.label !== p.id ? `${p.label} (${p.id})` : p.id;
-    providerSelect.appendChild(option);
-  }
-  const record = state.panes.get(state.sessionId);
-  const active = record?.provider || state.active.provider;
-  if (active && !configured.some((p) => p.id === active)) {
-    const current = state.providers.find((p) => p.id === active);
-    const option = document.createElement('option');
-    option.value = active;
-    option.textContent = `${current?.label ?? active} (sin configurar)`;
-    providerSelect.appendChild(option);
-  }
-  if (!providerSelect.options.length) {
-    const option = document.createElement('option');
-    option.value = '';
-    option.textContent = 'sin proveedores configurados';
-    providerSelect.appendChild(option);
-    providerSelect.disabled = true;
-  } else {
-    providerSelect.disabled = false;
-    if (active) providerSelect.value = active;
-  }
-  updateStatus();
-}
-
-export function renderProviderList() {
-  clear(providerListEl);
-  for (const p of state.providers) {
-    const li = el('li', p.id === state.active.provider ? 'active' : '');
-    li.appendChild(el('span', `pdot${p.hasKey || !p.requiresKey ? ' on' : ''}`));
-    const main = el('div', 'grow');
-    const title = el('div');
-    title.append(el('span', 'pid', p.id), document.createTextNode(' '), el('span', 'pmeta', p.label));
-    main.append(
-      title,
-      el(
-        'div',
-        'pmeta',
-        `${p.baseUrl || p.defaultBaseUrl || 'sin base URL'} · ${p.models.length} modelos · ${p.apiKeyHint || (p.requiresKey ? 'sin key' : 'sin key requerida')}`
-      )
-    );
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    actions.appendChild(button('usar', (event) => { event.stopPropagation(); useProvider(p.id); }));
-    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openProviderForm(p); }));
-    if (p.stored) actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeProvider(p.id); }, 'btn danger'));
-    li.appendChild(actions);
-    li.addEventListener('click', () => openProviderForm(p));
-    providerListEl.appendChild(li);
-  }
-}
-
-export async function useProvider(id) {
-  providerSelect.value = id;
-  await loadModels({ save: false, force: true });
-  await persistAgent({ provider: id, model: modelSelect.value || undefined });
-  await refreshProviders();
-}
-
-export function openProviderForm(provider = null) {
-  $('#provider-title').textContent = provider ? `editar ${provider.id}` : 'nuevo proveedor';
-  $('#pf-id').value = provider?.id ?? '';
-  $('#pf-id').readOnly = Boolean(provider);
-  $('#pf-label').value = provider?.label ?? '';
-  $('#pf-baseurl').value = provider?.baseUrl ?? '';
-  $('#pf-key').value = '';
-  $('#pf-key').placeholder = provider?.apiKeyHint ? `guardada (${provider.apiKeyHint})` : 'dejar vacío para no cambiar';
-  $('#pf-models').value = (provider?.models ?? []).join(', ');
-  setProviderStatus('');
-  providerModal.showModal();
-  if (!provider) $('#pf-id').focus();
-}
-
-export function closeProviderForm() {
-  if (providerModal.open) providerModal.close();
-}
-
-export function setProviderStatus(text, cls = '') {
-  setSummaryText($('#pf-status'), text, cls);
-}
-
-export async function submitProvider(event) {
-  event.preventDefault();
-  const id = $('#pf-id').value.trim();
-  if (!id) return setProviderStatus('Falta el id.', 'err');
-  const body = {
-    label: $('#pf-label').value.trim() || id,
-    baseUrl: $('#pf-baseurl').value.trim(),
-    models: $('#pf-models').value.split(',').map((s) => s.trim()).filter(Boolean),
-  };
-  const key = $('#pf-key').value;
-  if (key) body.apiKey = key;
-  try {
-    await api(`/api/providers/${encodeURIComponent(id)}`, { method: 'PUT', body });
-    closeProviderForm();
-    await refreshProviders();
-    await loadModels({ force: true });
-  } catch (error) {
-    setProviderStatus(error.message, 'err');
-  }
-}
-
-export async function removeProvider(id) {
-  await deleteEntity(`/api/providers/${encodeURIComponent(id)}`, {
-    confirmText: `¿Borrar la configuración de "${id}"?`,
-    after: () => loadModels({ force: true }),
-    refresh: refreshProviders,
-  });
-}
-
-export async function testProvider() {
-  const id = $('#pf-id').value.trim();
-  if (!id) return setProviderStatus('Guardá primero el proveedor para probarlo.', 'err');
-  setProviderStatus('probando…');
-  const out = await api(`/api/providers/${encodeURIComponent(id)}/test`, { method: 'POST' }).catch((error) => ({
-    ok: false,
-    error: error.message,
-  }));
-  if (!out.ok) return setProviderStatus(`error: ${out.error}`, 'err');
-
-  const ids = (out.models ?? []).map((m) => m.id ?? m).filter(Boolean);
-  let note = '';
-  if (out.source === 'api' && ids.length) {
-    $('#pf-models').value = ids.join(', ');
-    note = ' · modelos autocompletados';
-  }
-  if (id === state.active.provider) await loadModels({ force: true });
-  setProviderStatus(`ok · ${out.count} modelos (${out.source})${note}`, 'ok');
-}
-
-/* --- ajustes: MCP + Skills ----------------------------------------------- */
-
-export const mcpListEl = $('#mcp-list');
-export const mcpSearchResultsEl = $('#mcp-search-results');
-export const mcpCatalogEl = $('#mcp-catalog');
-export const mcpModal = $('#mcp-modal');
-export const mcpForm = $('#mcp-form');
-export const mcpModeEl = $('#mcp-mode');
-export const mcpCountEl = $('#mcp-count');
-export const mcpPinnedEl = $('#mcp-pinned');
-export const skillListEl = $('#skill-list');
-export const skillSearchResultsEl = $('#skill-search-results');
-export const skillCatalogEl = $('#skill-catalog');
-export const skillModal = $('#skill-modal');
-export const skillForm = $('#skill-form');
-export const agentListEl = $('#agent-list');
-export const agentModal = $('#agent-modal');
-export const agentForm = $('#agent-form');
-export const memoryListEl = $('#memory-list');
-export const memoryIndexEl = $('#memory-index');
-export const memoryModal = $('#memory-modal');
-export const memoryForm = $('#memory-form');
-export const scheduleListEl = $('#schedule-list');
-export const scheduleModal = $('#schedule-modal');
-export const scheduleForm = $('#schedule-form');
-export const tgTokenEl = $('#tg-token');
-export const tgChatsEl = $('#tg-chats');
-export const tgTranscribeEl = $('#tg-transcribe');
-export const tgTranscribeProviderEl = $('#tg-transcribe-provider');
-export const tgNotifyEl = $('#tg-notify');
-export const tgNotifyDoneEl = $('#tg-notify-done');
-export const tgNotifyErrorEl = $('#tg-notify-error');
-export const tgNotifyPermissionEl = $('#tg-notify-permission');
-export const tgNotifyAgentEl = $('#tg-notify-agent');
-export const tgStatusEl = $('#tg-status');
-export const vozEnabledEl = $('#voz-enabled');
-export const vozVoiceEl = $('#voz-voice');
-export const vozRateEl = $('#voz-rate');
-export const vozRateValEl = $('#voz-rate-val');
-export const vozPitchEl = $('#voz-pitch');
-export const vozPitchValEl = $('#voz-pitch-val');
-export const vozAnnStartEl = $('#voz-ann-start');
-export const vozAnnToolsEl = $('#voz-ann-tools');
-export const vozAnnEndEl = $('#voz-ann-end');
-export const vozAnnAdviceEl = $('#voz-ann-advice');
-export const vozAnnSummaryEl = $('#voz-ann-summary');
-export const vozAnnAnswerEl = $('#voz-ann-answer');
-export const vozFfmpegEl = $('#voz-ffmpeg');
-export const asesorEnabledEl = $('#asesor-enabled');
-export const asesorCodeEl = $('#asesor-code');
-export const asesorExplainEl = $('#asesor-explain');
-export const asesorAdviceEl = $('#asesor-advice');
-export const asesorSummaryEl = $('#asesor-summary');
-export const asesorWordsEl = $('#asesor-words');
-export const asesorNotesEl = $('#asesor-notes');
-export const asesorProviderEl = $('#asesor-provider');
-export const asesorModelEl = $('#asesor-model');
-export const trProviderEl = $('#tr-provider');
-export const trModelEl = $('#tr-model');
-
-/* --- ajustes: pestañas internas + límites del agente --------------------- */
-
-export const ajustesTabs = document.querySelectorAll('.ajustes-tab');
-export const ajustesWrap = document.querySelector('.ajustes-wrap');
-export const ajustesSearchEl = $('#ajustes-search');
-
-/** En móvil los ajustes son dos pantallas (lista y detalle); en escritorio el nivel no importa. */
-export function setAjustesLevel(level) {
-  if (ajustesWrap) ajustesWrap.dataset.level = level === 'panel' ? 'panel' : 'list';
-}
-
-export function activateAjustesPanel(name) {
-  ajustesTabs.forEach((tab) => {
-    const on = tab.dataset.panel === name;
-    tab.classList.toggle('active', on);
-    tab.setAttribute('aria-selected', on ? 'true' : 'false');
-    tab.tabIndex = on ? 0 : -1;
-  });
-  document
-    .querySelectorAll('.ajustes-panel')
-    .forEach((panel) => panel.classList.toggle('active', panel.dataset.panel === name));
-  setAjustesLevel('panel');
-  if (name === 'agente') moveAgentControls(agentControlsSlot);
-}
-
-/** Muestra solo las secciones que coinciden con la búsqueda y oculta los grupos vacíos. */
-export function filterAjustesNav(query) {
-  const hits = new Set(filterSettings(query).map((section) => section.id));
-  ajustesTabs.forEach((tab) => {
-    tab.hidden = !hits.has(tab.dataset.panel);
-  });
-  document.querySelectorAll('.ajustes-group').forEach((group) => {
-    group.hidden = !group.querySelector('.ajustes-tab:not([hidden])');
-  });
-  const empty = $('#ajustes-empty');
-  if (empty) empty.hidden = hits.size > 0;
-  return [...ajustesTabs].filter((tab) => !tab.hidden);
-}
-
-function focusAjustesTab(tab) {
-  if (!tab) return;
-  ajustesTabs.forEach((other) => {
-    other.tabIndex = other === tab ? 0 : -1;
-  });
-  tab.focus();
-}
-
-export function wireAjustesNav() {
-  ajustesTabs.forEach((tab) => tab.addEventListener('click', () => activateAjustesPanel(tab.dataset.panel)));
-
-  $('#ajustes-back')?.addEventListener('click', () => {
-    setAjustesLevel('list');
-    focusAjustesTab(document.querySelector('.ajustes-tab.active'));
-  });
-
-  $('.ajustes-tabs')?.addEventListener('keydown', (event) => {
-    const visible = [...ajustesTabs].filter((tab) => !tab.hidden);
-    const index = visible.indexOf(document.activeElement);
-    if (index < 0) return;
-    const step = { ArrowDown: 1, ArrowRight: 1, ArrowUp: -1, ArrowLeft: -1 }[event.key];
-    let next = null;
-    if (step) next = visible[(index + step + visible.length) % visible.length];
-    else if (event.key === 'Home') next = visible[0];
-    else if (event.key === 'End') next = visible[visible.length - 1];
-    if (!next) return;
-    event.preventDefault();
-    focusAjustesTab(next);
-  });
-
-  ajustesSearchEl?.addEventListener('input', () => filterAjustesNav(ajustesSearchEl.value));
-  ajustesSearchEl?.addEventListener('keydown', (event) => {
-    if (event.key === 'Escape' && ajustesSearchEl.value) {
-      event.preventDefault();
-      ajustesSearchEl.value = '';
-      filterAjustesNav('');
-    } else if (event.key === 'Enter') {
-      event.preventDefault();
-      const first = [...ajustesTabs].find((tab) => !tab.hidden);
-      if (first) activateAjustesPanel(first.dataset.panel);
-    } else if (event.key === 'ArrowDown') {
-      event.preventDefault();
-      focusAjustesTab([...ajustesTabs].find((tab) => !tab.hidden));
-    }
-  });
-}
-
-export const limitsRoundsEl = $('#limits-rounds');
-export const limitsTokensEl = $('#limits-tokens');
-export const limitsDurationEl = $('#limits-duration');
-export const limitsOutputEl = $('#limits-output');
-export const limitsCachingEl = $('#limits-caching');
-
-export async function refreshLimits() {
-  const data = await api('/api/settings').catch(() => null);
-  const settings = data?.settings;
-  if (!settings) return;
-  if (limitsRoundsEl) limitsRoundsEl.value = settings.maxRounds ?? 0;
-  if (limitsTokensEl) limitsTokensEl.value = settings.maxTokens ?? 0;
-  if (limitsDurationEl) limitsDurationEl.value = Math.round((settings.maxDurationMs ?? 0) / 1000);
-  if (limitsOutputEl) limitsOutputEl.value = settings.maxOutputTokens ?? 0;
-  if (limitsCachingEl) limitsCachingEl.checked = settings.promptCaching === true;
-}
-
-export function setStatus(node, text, cls = '') {
-  const elNode = $(node);
-  if (!elNode) return;
-  setSummaryText(elNode, text, cls);
-}
-
-export async function refreshMcp({ connect = false } = {}) {
-  const data = await api(`/api/mcp${connect ? '?connect=1' : ''}`).catch(() => null);
-  if (!data) return;
-  if (mcpModeEl && data.mode) mcpModeEl.value = data.mode;
-  if (mcpPinnedEl && Array.isArray(data.pinned) && document.activeElement !== mcpPinnedEl) {
-    mcpPinnedEl.value = data.pinned.join(', ');
-  }
-  if (mcpCountEl) {
-    mcpCountEl.textContent =
-      data.toolCount == null
-        ? ''
-        : `${data.toolCount} herramientas · ${data.lazy ? 'diferidas (mcp_call)' : 'completas en contexto'}`;
-  }
-  clear(mcpListEl);
-  if (!data.servers.length) {
-    mcpListEl.appendChild(emptyState('Sin servidores MCP', 'Tocá «+ nuevo» o prendé uno de los sugeridos de abajo.'));
-    return;
-  }
-  for (const s of data.servers) {
-    const li = el('li', s.enabled ? 'active' : '');
-    li.appendChild(el('span', `pdot${s.ok !== false ? ' on' : ''}`));
-    const main = el('div', 'grow');
-    const title = el('div');
-    title.append(el('span', 'pid', s.id), document.createTextNode(' '), el('span', 'pmeta', s.name || ''));
-    const detail = s.transport === 'http' ? s.url || '' : `${s.command || ''} ${(s.args || []).join(' ')}`.trim();
-    const parts = [s.transport, detail || '(sin destino)', s.source === 'config' ? 'tamnora.json' : 'guardado'];
-    if (connect) {
-      if (s.ok === false) parts.push(`error: ${s.error}`);
-      else parts.push(`${(s.tools || []).length} tools`);
-    }
-    main.append(title, el('div', 'pmeta', parts.join(' · ')));
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    actions.appendChild(button(s.enabled ? 'deshabilitar' : 'habilitar', (event) => { event.stopPropagation(); toggleMcp(s); }));
-    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openMcpForm(s); }));
-    if (s.source !== 'config') actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeMcp(s.id); }, 'btn danger'));
-    li.appendChild(actions);
-    li.addEventListener('click', () => openMcpForm(s));
-    mcpListEl.appendChild(li);
-  }
-}
-
-export function syncMcpFormFields() {
-  const http = $('#mf-transport').value === 'http';
-  $('#mf-command-field').hidden = http;
-  $('#mf-args-field').hidden = http;
-  $('#mf-env-field').hidden = http;
-  $('#mf-inherit-field').hidden = http;
-  $('#mf-url-field').hidden = !http;
-}
-
-export function openMcpForm(server = null) {
-  $('#mcp-title').textContent = server ? `editar ${server.id}` : 'nuevo servidor MCP';
-  $('#mf-id').value = server?.id ?? '';
-  $('#mf-id').readOnly = Boolean(server);
-  $('#mf-name').value = server?.name ?? '';
-  $('#mf-transport').value = server?.transport === 'http' ? 'http' : 'stdio';
-  $('#mf-command').value = server?.command ?? '';
-  $('#mf-args').value = (server?.args ?? []).join(' ');
-  $('#mf-url').value = server?.url ?? '';
-  $('#mf-env').value = Object.entries(server?.env ?? {})
-    .map(([key, value]) => `${key}=${value ?? ''}`)
-    .join('\n');
-  $('#mf-inherit-env').checked = server?.inheritEnv === true;
-  $('#mf-enabled').checked = server ? server.enabled !== false : true;
-  syncMcpFormFields();
-  setStatus('#mf-status', '');
-  mcpModal.showModal();
-  if (!server) $('#mf-id').focus();
-}
-
-export function closeMcpForm() {
-  if (mcpModal.open) mcpModal.close();
-}
-
-export async function toggleMcp(server) {
-  await toggleEntity(`/api/mcp/servers/${encodeURIComponent(server.id)}`, {
-    body: {
-      name: server.name,
-      transport: server.transport,
-      command: server.command,
-      args: server.args,
-      url: server.url,
-      env: server.env,
-      enabled: !server.enabled,
-    },
-    errorLabel: 'actualizar MCP',
-    refresh: refreshMcp,
-  });
-}
-
-export async function removeMcp(id) {
-  await deleteEntity(`/api/mcp/servers/${encodeURIComponent(id)}`, {
-    confirmText: `¿Eliminar el servidor MCP "${id}"?`,
-    refresh: refreshMcp,
-  });
-}
-
-export function parseEnv(text) {
-  const out = {};
-  for (const line of String(text ?? '').split('\n')) {
-    const trimmed = line.trim();
-    if (!trimmed || trimmed.startsWith('#')) continue;
-    const eq = trimmed.indexOf('=');
-    if (eq === -1) continue;
-    out[trimmed.slice(0, eq).trim()] = trimmed.slice(eq + 1);
-  }
-  return out;
-}
-
-export async function submitMcp(event) {
-  event.preventDefault();
-  const id = $('#mf-id').value.trim();
-  if (!id) return setStatus('#mf-status', 'Falta el id.', 'err');
-  const body = {
-    name: $('#mf-name').value.trim() || id,
-    transport: $('#mf-transport').value,
-    command: $('#mf-command').value.trim(),
-    args: $('#mf-args').value.trim(),
-    url: $('#mf-url').value.trim(),
-    env: parseEnv($('#mf-env').value),
-    inheritEnv: $('#mf-inherit-env').checked,
-    enabled: $('#mf-enabled').checked,
-  };
-  try {
-    await api(`/api/mcp/servers/${encodeURIComponent(id)}`, { method: 'PUT', body });
-  } catch (error) {
-    return setStatus('#mf-status', error.message, 'err');
-  }
-  closeMcpForm();
-  refreshMcp();
-}
-
-export async function refreshSkills() {
-  const data = await api('/api/skills').catch(() => null);
-  if (!data) return;
-  clear(skillListEl);
-  if (!data.skills.length) {
-    skillListEl.appendChild(emptyState('Sin skills todavía', 'Tocá «+ nueva» o instalá una de las sugeridas del catálogo.'));
-    return;
-  }
-  for (const s of data.skills) {
-    const li = el('li', s.enabled ? 'active' : '');
-    li.appendChild(el('span', `pdot${s.enabled ? ' on' : ''}`));
-    const main = el('div', 'grow');
-    main.append(
-      el('div', '', s.name || s.id),
-      el('div', 'pmeta', s.description || s.when || '(sin descripción)')
-    );
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    actions.appendChild(button(s.enabled ? 'deshabilitar' : 'habilitar', (event) => { event.stopPropagation(); toggleSkill(s.id); }));
-    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openSkillForm(s.id); }));
-    if (s.removable) actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeSkill(s.id); }, 'btn danger'));
-    li.appendChild(actions);
-    li.addEventListener('click', () => openSkillForm(s.id));
-    skillListEl.appendChild(li);
-  }
-}
-
-export async function openSkillForm(id = null) {
-  $('#skill-title').textContent = id ? `editar ${id}` : 'nueva skill';
-  $('#sf-id').value = id ?? '';
-  $('#sf-id').readOnly = Boolean(id);
-  $('#sf-name').value = '';
-  $('#sf-description').value = '';
-  $('#sf-when').value = '';
-  $('#sf-body').value = '';
-  setStatus('#sf-status', '');
-  if (id) {
-    const data = await api(`/api/skills/${encodeURIComponent(id)}`).catch(() => null);
-    if (data?.skill) {
-      $('#sf-name').value = data.skill.name ?? '';
-      $('#sf-description').value = data.skill.description ?? '';
-      $('#sf-when').value = data.skill.when ?? '';
-      $('#sf-body').value = data.skill.body ?? '';
-    }
-  }
-  skillModal.showModal();
-  if (!id) $('#sf-id').focus();
-}
-
-export function closeSkillForm() {
-  if (skillModal.open) skillModal.close();
-}
-
-export async function toggleSkill(id) {
-  await toggleEntity(`/api/skills/${encodeURIComponent(id)}/toggle`, {
-    method: 'POST',
-    errorLabel: 'cambiar la skill',
-    refresh: refreshSkills,
-  });
-}
-
-export async function removeSkill(id) {
-  await deleteEntity(`/api/skills/${encodeURIComponent(id)}`, {
-    confirmText: `¿Eliminar la skill "${id}"?`,
-    refresh: refreshSkills,
-  });
-}
-
-export async function submitSkill(event) {
-  event.preventDefault();
-  const id = $('#sf-id').value.trim();
-  if (!id) return setStatus('#sf-status', 'Falta el id.', 'err');
-  const body = {
-    name: $('#sf-name').value.trim() || id,
-    description: $('#sf-description').value.trim(),
-    when: $('#sf-when').value.trim(),
-    body: $('#sf-body').value,
-  };
-  try {
-    await api(`/api/skills/${encodeURIComponent(id)}`, { method: 'PUT', body });
-  } catch (error) {
-    return setStatus('#sf-status', error.message, 'err');
-  }
-  closeSkillForm();
-  refreshSkills();
-}
-
-/* --- ajustes: Subagentes ------------------------------------------------- */
-
-export async function refreshAgents() {
-  if (!agentListEl) return;
-  const data = await api('/api/agents').catch(() => null);
-  if (!data) return;
-  clear(agentListEl);
-  if (!data.agents.length) {
-    agentListEl.appendChild(
-      emptyState(
-        'Sin subagentes todavía',
-        'Tocá «+ nuevo» para crear uno: el agente principal va a verlo en su catálogo y podrá delegarle tareas con task.'
-      )
-    );
-    return;
-  }
-  for (const agent of data.agents) {
-    const li = el('li', agent.enabled ? 'active' : '');
-    li.appendChild(el('span', `pdot${agent.enabled ? ' on' : ''}`));
-    const main = el('div', 'grow');
-    const details = [
-      agent.provider || 'proveedor heredado',
-      agent.model || 'modelo heredado',
-      agent.mode || 'modo heredado',
-      agent.effort ? `esfuerzo ${agent.effort}` : '',
-      Array.isArray(agent.skills) ? `${agent.skills.length} skill(s)` : 'todas las skills',
-    ].filter(Boolean);
-    main.append(
-      el('div', '', `${agent.name || agent.id} · ${agent.id}`),
-      el('div', 'pmeta', agent.description || details.join(' · '))
-    );
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    actions.appendChild(button(agent.enabled ? 'deshabilitar' : 'habilitar', (event) => { event.stopPropagation(); toggleAgent(agent.id); }));
-    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openAgentForm(agent.id); }));
-    if (agent.removable) {
-      actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeAgent(agent.id); }, 'btn danger'));
-    }
-    li.appendChild(actions);
-    li.addEventListener('click', () => openAgentForm(agent.id));
-    agentListEl.appendChild(li);
-  }
-}
-
-function fillAgentProviders() {
-  const select = $('#af-provider');
-  if (!select) return;
-  const current = select.value;
-  clear(select);
-  const inherit = document.createElement('option');
-  inherit.value = '';
-  inherit.textContent = 'heredar';
-  select.appendChild(inherit);
-  for (const provider of state.providers ?? []) {
-    const option = document.createElement('option');
-    option.value = provider.id;
-    option.textContent = provider.label && provider.label !== provider.id ? `${provider.label} (${provider.id})` : provider.id;
-    select.appendChild(option);
-  }
-  select.value = current;
-}
-
-function fillAgentSkills(selected = null) {
-  const select = $('#af-skills');
-  if (!select) return;
-  clear(select);
-  for (const skill of state.skills ?? []) {
-    const option = document.createElement('option');
-    option.value = skill.id;
-    option.textContent = `${skill.name || skill.id}${skill.enabled ? '' : ' (deshabilitada)'}`;
-    option.disabled = !skill.enabled;
-    select.appendChild(option);
-  }
-  const wanted = new Set(Array.isArray(selected) ? selected : []);
-  for (const option of select.options) option.selected = wanted.has(option.value);
-}
-
-export async function openAgentForm(id = null) {
-  $('#agent-title').textContent = id ? `editar ${id}` : 'nuevo subagente';
-  $('#af-id').value = id ?? '';
-  $('#af-id').readOnly = Boolean(id);
-  $('#af-name').value = '';
-  $('#af-description').value = '';
-  $('#af-model').value = '';
-  $('#af-rounds').value = '';
-  $('#af-tools').value = '';
-  $('#af-body').value = '';
-  setStatus('#af-status', '');
-  const providers = await api('/api/providers').catch(() => null);
-  if (providers?.providers) state.providers = providers.providers;
-  const skills = await api('/api/skills').catch(() => null);
-  state.skills = skills?.skills ?? [];
-  const effort = $('#af-effort');
-  if (effort) effort.value = '';
-  fillAgentProviders();
-  $('#af-provider').value = '';
-  $('#af-mode').value = '';
-  fillAgentSkills([]);
-  if (id) {
-    const data = await api(`/api/agents/${encodeURIComponent(id)}`).catch(() => null);
-    if (data?.agent) {
-      const agent = data.agent;
-      $('#af-name').value = agent.name ?? '';
-      $('#af-description').value = agent.description ?? '';
-      $('#af-model').value = agent.model ?? '';
-      $('#af-provider').value = agent.provider ?? '';
-      $('#af-mode').value = agent.mode ?? '';
-      $('#af-effort').value = agent.effort ?? '';
-      $('#af-rounds').value = agent.maxRounds || '';
-      $('#af-tools').value = (agent.tools ?? []).join(', ');
-      fillAgentSkills(agent.skills ?? null);
-      $('#af-body').value = agent.body ?? '';
-    }
-  }
-  agentModal.showModal();
-  if (!id) $('#af-id').focus();
-}
-
-export function closeAgentForm() {
-  if (agentModal?.open) agentModal.close();
-}
-
-export async function toggleAgent(id) {
-  await toggleEntity(`/api/agents/${encodeURIComponent(id)}/toggle`, {
-    method: 'POST',
-    errorLabel: 'cambiar el subagente',
-    refresh: refreshAgents,
-  });
-}
-
-export async function removeAgent(id) {
-  await deleteEntity(`/api/agents/${encodeURIComponent(id)}`, {
-    confirmText: `¿Eliminar el subagente "${id}"?`,
-    refresh: refreshAgents,
-  });
-}
-
-export async function submitAgent(event) {
-  event.preventDefault();
-  const id = $('#af-id').value.trim();
-  if (!id) return setStatus('#af-status', 'Falta el id.', 'err');
-  const skillsSelect = $('#af-skills');
-  const selectedSkills = skillsSelect ? [...skillsSelect.selectedOptions].map((option) => option.value) : [];
-  const body = {
-    name: $('#af-name').value.trim() || id,
-    description: $('#af-description').value.trim(),
-    provider: $('#af-provider').value.trim(),
-    model: $('#af-model').value.trim(),
-    mode: $('#af-mode').value,
-    effort: $('#af-effort').value,
-    maxRounds: Number($('#af-rounds').value) || 0,
-    tools: $('#af-tools').value.split(',').map((item) => item.trim()).filter(Boolean),
-    skills: selectedSkills.length ? selectedSkills : null,
-    body: $('#af-body').value,
-  };
-  try {
-    await api(`/api/agents/${encodeURIComponent(id)}`, { method: 'PUT', body });
-  } catch (error) {
-    return setStatus('#af-status', error.message, 'err');
-  }
-  closeAgentForm();
-  refreshAgents();
-}
-
-/* --- ajustes: Memoria ---------------------------------------------------- */
-
-export async function refreshMemory() {
-  if (!memoryListEl) return;
-  const data = await api('/api/memory').catch(() => null);
-  if (!data) return;
-  if (memoryIndexEl && document.activeElement !== memoryIndexEl) memoryIndexEl.value = data.index ?? '';
-  clear(memoryListEl);
-  if (!data.topics?.length) {
-    memoryListEl.appendChild(emptyState('Sin memoria todavía', 'El agente guarda acá lo que conviene recordar del proyecto; también podés crear un tema con «+ tema».'));
-    return;
-  }
-  for (const t of data.topics) {
-    const li = el('li', 'active');
-    const main = el('div', 'grow');
-    main.append(
-      el('div', '', t.title || t.name),
-      el('div', 'pmeta', `${t.name}${t.bytes ? ` · ${Math.max(1, Math.round(t.bytes / 1024))} KB` : ''}`)
-    );
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openMemoryForm(t.name); }));
-    actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeMemory(t.name); }, 'btn danger'));
-    li.appendChild(actions);
-    li.addEventListener('click', () => openMemoryForm(t.name));
-    memoryListEl.appendChild(li);
-  }
-}
-
-export async function openMemoryForm(name = null) {
-  $('#memory-title').textContent = name ? `editar ${name}` : 'nuevo tema';
-  $('#mem-name').value = name ? name.replace(/\.md$/i, '') : '';
-  $('#mem-name').readOnly = Boolean(name);
-  $('#mem-title').value = '';
-  $('#mem-body').value = '';
-  setStatus('#mem-status', '');
-  if (name) {
-    const data = await api(`/api/memory/${encodeURIComponent(name)}`).catch(() => null);
-    if (data?.topic) {
-      $('#mem-title').value = data.topic.title ?? '';
-      $('#mem-body').value = data.topic.body ?? '';
-    }
-  }
-  memoryModal.showModal();
-  if (!name) $('#mem-name').focus();
-}
-
-export function closeMemoryForm() {
-  if (memoryModal.open) memoryModal.close();
-}
-
-export async function removeMemory(name) {
-  await deleteEntity(`/api/memory/${encodeURIComponent(name)}`, {
-    confirmText: `¿Borrar la memoria "${name}"?`,
-    refresh: refreshMemory,
-  });
-}
-
-export async function submitMemory(event) {
-  event.preventDefault();
-  const name = $('#mem-name').value.trim();
-  if (!name) return setStatus('#mem-status', 'Falta el tema.', 'err');
-  const body = { title: $('#mem-title').value.trim(), body: $('#mem-body').value };
-  try {
-    await api(`/api/memory/${encodeURIComponent(name)}`, { method: 'PUT', body });
-  } catch (error) {
-    return setStatus('#mem-status', error.message, 'err');
-  }
-  closeMemoryForm();
-  refreshMemory();
-}
-
-export async function saveMemoryIndex() {
-  try {
-    await api('/api/memory', { method: 'PUT', body: { index: memoryIndexEl.value } });
-  } catch (error) {
-    return setStatus('#memory-status', error.message, 'err');
-  }
-  setStatus('#memory-status', 'guardado', 'ok');
-  refreshMemory();
-}
-
-/* --- ajustes: Tareas programadas ----------------------------------------- */
-
-export function fmtWhen(ms) {
-  try {
-    return new Date(ms).toLocaleString();
-  } catch {
-    return '';
-  }
-}
-
-export function scheduleTypeFields() {
-  const type = $('#sc-type').value;
-  const agent = type === 'agent';
-  $('#sc-agent-prompt-row').hidden = !agent;
-  $('#sc-agent-mode-row').hidden = !agent;
-  $('#sc-shell-cmd-row').hidden = agent;
-  $('#sc-shell-args-row').hidden = agent;
-}
-
-export async function refreshSchedules() {
-  if (!scheduleListEl) return;
-  const data = await api('/api/schedules').catch(() => null);
-  if (!data) return;
-  clear(scheduleListEl);
-  if (!data.schedules.length) {
-    scheduleListEl.appendChild(emptyState('Sin tareas programadas', 'Con «+ tarea» programás un comando o un turno del agente: cada tanto, a diario o con cron.'));
-    return;
-  }
-  for (const s of data.schedules) {
-    const li = el('li', s.enabled ? 'active' : '');
-    li.appendChild(el('span', `pdot${s.enabled ? ' on' : ''}`));
-    const main = el('div', 'grow');
-    const meta = [s.type, s.spec];
-    if (s.nextRun) meta.push(`próxima ${fmtWhen(s.nextRun)}`);
-    if (s.lastStatus) meta.push(s.lastStatus);
-    main.append(el('div', '', s.name || s.id), el('div', 'pmeta', meta.join(' · ')));
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    actions.appendChild(button('correr', (event) => { event.stopPropagation(); runSchedule(s.id); }));
-    actions.appendChild(button(s.enabled ? 'pausar' : 'activar', (event) => { event.stopPropagation(); toggleSchedule(s.id); }));
-    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openScheduleForm(s.id); }));
-    actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeSchedule(s.id); }, 'btn danger'));
-    li.appendChild(actions);
-    li.addEventListener('click', () => openScheduleForm(s.id));
-    scheduleListEl.appendChild(li);
-  }
-}
-
-export async function openScheduleForm(id = null) {
-  $('#schedule-title').textContent = id ? `editar ${id}` : 'nueva tarea';
-  $('#sc-id').value = id ?? '';
-  $('#sc-id').readOnly = Boolean(id);
-  $('#sc-name').value = '';
-  $('#sc-type').value = 'agent';
-  $('#sc-spec').value = '';
-  $('#sc-prompt').value = '';
-  $('#sc-mode').value = 'agent';
-  $('#sc-command').value = '';
-  $('#sc-args').value = '';
-  $('#sc-cwd').value = '';
-  $('#sc-enabled').checked = true;
-  setStatus('#sc-status', '');
-  if (id) {
-    const data = await api('/api/schedules').catch(() => null);
-    const s = data?.schedules?.find((item) => item.id === id);
-    if (s) {
-      $('#sc-name').value = s.name ?? '';
-      $('#sc-type').value = s.type ?? 'agent';
-      $('#sc-spec').value = s.spec ?? '';
-      $('#sc-cwd').value = s.cwd ?? '';
-      $('#sc-enabled').checked = s.enabled !== false;
-      const payload = s.payload ?? {};
-      if (s.type === 'shell') {
-        $('#sc-command').value = payload.command ?? '';
-        $('#sc-args').value = Array.isArray(payload.args) ? payload.args.join(' ') : payload.args ?? '';
-      } else {
-        $('#sc-prompt').value = payload.prompt ?? '';
-        $('#sc-mode').value = payload.mode ?? 'agent';
-      }
-    }
-  }
-  scheduleTypeFields();
-  scheduleModal.showModal();
-  if (!id) $('#sc-id').focus();
-}
-
-export function closeScheduleForm() {
-  if (scheduleModal.open) scheduleModal.close();
-}
-
-export async function submitSchedule(event) {
-  event.preventDefault();
-  const id = $('#sc-id').value.trim();
-  if (!id) return setStatus('#sc-status', 'Falta el id.', 'err');
-  const type = $('#sc-type').value;
-  const body = {
-    id,
-    name: $('#sc-name').value.trim() || id,
-    type,
-    spec: $('#sc-spec').value.trim(),
-    cwd: $('#sc-cwd').value.trim() || undefined,
-    enabled: $('#sc-enabled').checked,
-  };
-  if (type === 'shell') {
-    body.command = $('#sc-command').value.trim();
-    body.args = $('#sc-args').value.trim();
-  } else {
-    body.prompt = $('#sc-prompt').value.trim();
-    body.mode = $('#sc-mode').value;
-  }
-  try {
-    const exists = $('#sc-id').readOnly;
-    await api(exists ? `/api/schedules/${encodeURIComponent(id)}` : '/api/schedules', {
-      method: exists ? 'PUT' : 'POST',
-      body,
-    });
-  } catch (error) {
-    return setStatus('#sc-status', error.message, 'err');
-  }
-  closeScheduleForm();
-  refreshSchedules();
-}
-
-export async function toggleSchedule(id) {
-  await toggleEntity(`/api/schedules/${encodeURIComponent(id)}/toggle`, {
-    method: 'POST',
-    errorLabel: 'cambiar la tarea',
-    refresh: refreshSchedules,
-  });
-}
-
-export async function removeSchedule(id) {
-  await deleteEntity(`/api/schedules/${encodeURIComponent(id)}`, {
-    confirmText: `¿Eliminar la tarea "${id}"?`,
-    refresh: refreshSchedules,
-  });
-}
-
-export async function runSchedule(id) {
-  setStatus('#schedule-status', `corriendo ${id}…`);
-  try {
-    await api(`/api/schedules/${encodeURIComponent(id)}/run`, { method: 'POST' });
-  } catch (error) {
-    setStatus('#schedule-status', error.message, 'err');
-    refreshSchedules();
-    return;
-  }
-  setStatus('#schedule-status', `${id}: listo`, 'ok');
-  refreshSchedules();
-}
-
-export async function refreshChannels() {
-  if (!tgStatusEl) return;
-  const data = await api('/api/channels').catch(() => null);
-  if (!data?.telegram) return;
-  const tg = data.telegram;
-  tgStatusEl.className = `summary${tg.running ? ' ok' : ''}`;
-  tgStatusEl.textContent = tg.running
-    ? `activo${tg.tokenHint ? ` · ${tg.tokenHint}` : ''}`
-    : tg.tokenSet
-      ? 'token guardado (bot detenido)'
-      : 'sin configurar';
-  if (tgChatsEl && document.activeElement !== tgChatsEl) {
-    tgChatsEl.value = (tg.allowedChatIds ?? []).join(', ');
-  }
-  if (tgTranscribeEl && document.activeElement !== tgTranscribeEl) {
-    tgTranscribeEl.value = tg.transcribeModel ?? 'whisper-1';
-  }
-  if (tgTranscribeProviderEl && document.activeElement !== tgTranscribeProviderEl) {
-    tgTranscribeProviderEl.value = tg.transcribeProvider ?? '';
-  }
-  const notify = tg.notify ?? {};
-  if (tgNotifyEl) tgNotifyEl.checked = notify.enabled === true;
-  if (tgNotifyDoneEl) tgNotifyDoneEl.checked = notify.done !== false;
-  if (tgNotifyErrorEl) tgNotifyErrorEl.checked = notify.error !== false;
-  if (tgNotifyPermissionEl) tgNotifyPermissionEl.checked = notify.permission !== false;
-  if (tgNotifyAgentEl) tgNotifyAgentEl.checked = notify.agent !== false;
-  if (tgTokenEl && document.activeElement !== tgTokenEl) {
-    tgTokenEl.value = '';
-    tgTokenEl.placeholder = tg.tokenHint ? `${tg.tokenHint} (dejar vacío para no cambiar)` : '123456:ABC…';
-  }
-}
-
-export async function submitChannel() {
-  if (!tgTokenEl) return;
-  setStatus('#tg-msg', 'guardando…');
-  const body = {
-    allowedChatIds: tgChatsEl?.value ?? '',
-    transcribeModel: tgTranscribeEl?.value.trim() || 'whisper-1',
-    transcribeProvider: tgTranscribeProviderEl?.value.trim() || '',
-    notify: {
-      enabled: tgNotifyEl?.checked === true,
-      done: tgNotifyDoneEl?.checked !== false,
-      error: tgNotifyErrorEl?.checked !== false,
-      permission: tgNotifyPermissionEl?.checked !== false,
-      agent: tgNotifyAgentEl?.checked !== false,
-    },
-  };
-  const token = tgTokenEl.value.trim();
-  if (token) body.token = token;
-  const data = await api('/api/channels/telegram', { method: 'PUT', body }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#tg-msg', data.error, 'err');
-  setStatus('#tg-msg', data.telegram?.running ? 'guardado · bot activo' : 'guardado', 'ok');
-  refreshChannels();
-}
-
-export async function testChannel() {
-  if (!tgTokenEl) return;
-  setStatus('#tg-msg', 'probando…');
-  const data = await api('/api/channels/telegram/test', {
-    method: 'POST',
-    body: { token: tgTokenEl.value.trim() },
-  }).catch((e) => ({ ok: false, error: e.message }));
-  if (data?.ok) setStatus('#tg-msg', `token OK${data.username ? ` · @${data.username}` : ''}`, 'ok');
-  else setStatus('#tg-msg', data?.error || 'token inválido', 'err');
-}
-
-/* --- ajustes: asesor ------------------------------------------------------- */
-
-export function aplicarAsesor(data) {
-  if (!data) return;
-  if (asesorEnabledEl) asesorEnabledEl.checked = data.enabled === true;
-  if (asesorCodeEl) asesorCodeEl.checked = data.code !== false;
-  if (asesorExplainEl) asesorExplainEl.checked = data.explain !== false;
-  if (asesorAdviceEl) asesorAdviceEl.checked = data.advice !== false;
-  if (asesorSummaryEl) asesorSummaryEl.checked = data.summary === true;
-  if (asesorWordsEl) asesorWordsEl.value = data.maxWords ?? 40;
-  if (asesorNotesEl) asesorNotesEl.value = data.notes ?? '';
-  if (asesorProviderEl) asesorProviderEl.value = data.provider ?? '';
-  if (asesorModelEl) asesorModelEl.value = data.model ?? '';
-  const estado = $('#asesor-status');
-  if (estado) {
-    estado.className = `summary${data.enabled ? ' ok' : ''}`;
-    estado.textContent = data.enabled ? 'activo' : 'apagado';
-  }
-}
-
-export async function refreshAsesor() {
-  if (!asesorEnabledEl) return;
-  const data = await api('/api/advisor/settings').catch(() => null);
-  if (data) aplicarAsesor(data);
-}
-
-export function asesorBody() {
-  return {
-    enabled: asesorEnabledEl?.checked === true,
-    code: asesorCodeEl?.checked !== false,
-    explain: asesorExplainEl?.checked !== false,
-    advice: asesorAdviceEl?.checked !== false,
-    summary: asesorSummaryEl?.checked === true,
-    maxWords: Number(asesorWordsEl?.value) || 40,
-    notes: asesorNotesEl?.value ?? '',
-    provider: asesorProviderEl?.value ?? '',
-    model: asesorModelEl?.value ?? '',
-  };
-}
-
-export async function submitAsesor() {
-  setStatus('#asesor-msg', 'guardando…');
-  const data = await api('/api/advisor/settings', { method: 'PUT', body: asesorBody() }).catch((e) => ({
-    error: e.message,
-  }));
-  if (data?.error) return setStatus('#asesor-msg', data.error, 'err');
-  aplicarAsesor(data);
-  setStatus('#asesor-msg', 'guardado', 'ok');
-}
-
-export async function testAsesor() {
-  setStatus('#asesor-msg', 'consultando…');
-  const data = await api('/api/advisor/test', { method: 'POST' }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#asesor-msg', data.error, 'err');
-  setStatus('#asesor-msg', data?.speak && data.text ? data.text : '(no diría nada en este caso)', 'ok');
-}
-
-/* --- ajustes: perfil del usuario ------------------------------------------ */
-
-export const perfil = {
-  address: $('#perfil-address'),
-  name: $('#perfil-name'),
-  language: $('#perfil-language'),
-  notes: $('#perfil-notes'),
-  fields: $('#perfil-fields'),
-  add: $('#perfil-add-field'),
-  save: $('#perfil-save'),
-};
-
-export function addPerfilFieldRow(key = '', value = '') {
-  if (!perfil.fields) return;
-  const row = el('div', 'perfil-field');
-  const keyInput = el('input', 'pf-key');
-  keyInput.placeholder = 'clave';
-  keyInput.value = key;
-  keyInput.spellcheck = false;
-  const valueInput = el('input', 'pf-value');
-  valueInput.placeholder = 'valor';
-  valueInput.value = value;
-  valueInput.spellcheck = false;
-  const remove = button('', () => row.remove(), 'btn icon');
-  remove.appendChild(icon('x', 12));
-  row.append(keyInput, valueInput, remove);
-  perfil.fields.appendChild(row);
-}
-
-export function renderPerfilFields(fields = {}) {
-  if (!perfil.fields) return;
-  clear(perfil.fields);
-  for (const [key, value] of Object.entries(fields)) addPerfilFieldRow(key, value);
-}
-
-export function collectPerfilFields() {
-  const out = {};
-  for (const row of perfil.fields?.querySelectorAll('.perfil-field') ?? []) {
-    const key = row.querySelector('.pf-key').value.trim();
-    const value = row.querySelector('.pf-value').value.trim();
-    if (key && value) out[key] = value;
-  }
-  return out;
-}
-
-export async function refreshProfile() {
-  if (!perfil.address) return;
-  const data = await api('/api/profile').catch(() => null);
-  if (!data?.profile) return;
-  const p = data.profile;
-  perfil.address.value = p.address ?? '';
-  perfil.name.value = p.name ?? '';
-  perfil.language.value = p.language ?? '';
-  perfil.notes.value = p.notes ?? '';
-  renderPerfilFields(p.fields ?? {});
-  setStatus('#perfil-status', p.address || p.name ? `trato: ${p.address || p.name}` : 'sin datos', '');
-}
-
-export async function submitProfile() {
-  if (!perfil.address) return;
-  setStatus('#perfil-msg', 'guardando…');
-  const body = {
-    address: perfil.address.value.trim(),
-    name: perfil.name.value.trim(),
-    language: perfil.language.value.trim(),
-    notes: perfil.notes.value.trim(),
-    fields: collectPerfilFields(),
-  };
-  const data = await api('/api/profile', { method: 'PUT', body }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#perfil-msg', data.error, 'err');
-  setStatus('#perfil-msg', 'guardado', 'ok');
-  refreshProfile();
-}
-
-export async function importMcp() {
-  const input = $('#mcp-import');
-  const value = input.value.trim();
-  if (!value) return;
-  const payload = value.startsWith('{')
-    ? { json: value }
-    : /^https?:\/\//i.test(value)
-      ? { url: value }
-      : { name: value };
-  await importEntity({
-    url: '/api/mcp/import',
-    body: payload,
-    input,
-    statusSel: '#mcp-import-status',
-    refresh: refreshMcp,
-    okMessage: (data) => {
-      const required = (data.requiredEnv ?? []).length ? ` · requiere env: ${data.requiredEnv.join(', ')}` : '';
-      return `Importado ${data.imported}${required}`;
-    },
-  });
-}
-
-export async function importSkill() {
-  const input = $('#skill-import');
-  const ref = input.value.trim();
-  if (!ref) return;
-  await importEntity({
-    url: '/api/skills/import',
-    body: { ref },
-    input,
-    statusSel: '#skill-import-status',
-    refresh: refreshSkills,
-    okMessage: (data) => `Importada ${data.installed} (${data.source})`,
-  });
-}
-
-/* --- ajustes: biblioteca y buscador de MCP y skills ----------------------- */
-
-export async function refreshMcpCatalog() {
-  if (!mcpCatalogEl) return;
-  const data = await api('/api/mcp/catalog').catch(() => null);
-  if (!data) return;
-  clear(mcpCatalogEl);
-  for (const entry of data.catalog) {
-    const li = el('li', entry.installed ? 'active' : '');
-    const main = el('div', 'grow');
-    main.append(el('div', '', entry.name), el('div', 'pmeta', entry.description || ''));
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    if (entry.requiredEnv?.length) actions.appendChild(el('span', 'pmeta', `env: ${entry.requiredEnv.join(', ')}`));
-    if (entry.installed) actions.appendChild(el('span', 'pmeta', 'instalado'));
-    else actions.appendChild(button('agregar', (event) => { event.stopPropagation(); installCatalogMcp(entry.id); }));
-    li.appendChild(actions);
-    mcpCatalogEl.appendChild(li);
-  }
-}
-
-export async function installCatalogMcp(id) {
-  setStatus('#mcp-import-status', `agregando ${id}…`);
-  const data = await api('/api/mcp/import', { method: 'POST', body: { catalog: id } }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#mcp-import-status', data.error, 'err');
-  setStatus('#mcp-import-status', `agregado ${id} (deshabilitado)`, 'ok');
-  await refreshMcp();
-  await refreshMcpCatalog();
-}
-
-export async function searchMcp() {
-  const input = $('#mcp-search');
-  const q = input?.value.trim();
-  if (!q) return;
-  setStatus('#mcp-search-status', 'buscando…');
-  const data = await api(`/api/mcp/search?q=${encodeURIComponent(q)}`).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#mcp-search-status', data.error, 'err');
-  clear(mcpSearchResultsEl);
-  if (!data.results.length) {
-    setStatus('#mcp-search-status', 'sin resultados');
-    return;
-  }
-  setStatus('#mcp-search-status', `${data.results.length} resultado(s)`);
-  for (const r of data.results) {
-    const li = el('li', r.installed ? 'active' : '');
-    const main = el('div', 'grow');
-    main.append(el('div', '', r.name || r.id), el('div', 'pmeta', r.description || r.id));
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    if (r.requiredEnv?.length) actions.appendChild(el('span', 'pmeta', `env: ${r.requiredEnv.join(', ')}`));
-    if (r.installed) actions.appendChild(el('span', 'pmeta', 'instalado'));
-    else actions.appendChild(button('instalar', (event) => { event.stopPropagation(); installMcpFromRegistry(r.registry || r.name); }));
-    li.appendChild(actions);
-    mcpSearchResultsEl.appendChild(li);
-  }
-}
-
-export async function installMcpFromRegistry(name) {
-  setStatus('#mcp-search-status', `instalando ${name}…`);
-  const data = await api('/api/mcp/import', { method: 'POST', body: { name } }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#mcp-search-status', data.error, 'err');
-  const required = (data.requiredEnv ?? []).length ? ` · requiere env: ${data.requiredEnv.join(', ')}` : '';
-  setStatus('#mcp-search-status', `instalado ${data.imported}${required}`, 'ok');
-  await refreshMcp();
-  await refreshMcpCatalog();
-  await searchMcp();
-}
-
-export async function refreshSkillCatalog() {
-  if (!skillCatalogEl) return;
-  const data = await api('/api/skills/catalog').catch(() => null);
-  if (!data) return;
-  clear(skillCatalogEl);
-  for (const entry of data.catalog) {
-    const li = el('li', entry.installed ? 'active' : '');
-    const main = el('div', 'grow');
-    main.append(el('div', '', entry.name), el('div', 'pmeta', entry.description || ''));
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    if (entry.installed) actions.appendChild(el('span', 'pmeta', 'instalada'));
-    else actions.appendChild(button('instalar', (event) => { event.stopPropagation(); installCatalogSkill(entry.id); }));
-    li.appendChild(actions);
-    skillCatalogEl.appendChild(li);
-  }
-}
-
-export async function installCatalogSkill(id) {
-  setStatus('#skill-import-status', `instalando ${id}…`);
-  const data = await api('/api/skills', { method: 'POST', body: { id } }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#skill-import-status', data.error, 'err');
-  setStatus('#skill-import-status', `instalada ${id} (deshabilitada)`, 'ok');
-  await refreshSkills();
-  await refreshSkillCatalog();
-}
-
-export async function searchSkills() {
-  const input = $('#skill-search');
-  const q = input?.value.trim();
-  if (!q) return;
-  setStatus('#skill-search-status', 'buscando…');
-  const data = await api(`/api/skills/search?q=${encodeURIComponent(q)}`).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#skill-search-status', data.error, 'err');
-  clear(skillSearchResultsEl);
-  if (!data.results.length) {
-    setStatus('#skill-search-status', 'sin resultados');
-    return;
-  }
-  setStatus('#skill-search-status', `${data.results.length} resultado(s)`);
-  for (const r of data.results) {
-    const li = el('li', r.installed ? 'active' : '');
-    const main = el('div', 'grow');
-    main.append(el('div', '', r.source), el('div', 'pmeta', r.description || r.ref));
-    li.appendChild(main);
-    const actions = el('div', 'pactions');
-    if (r.installed) actions.appendChild(el('span', 'pmeta', 'instalada'));
-    else actions.appendChild(button('instalar', (event) => { event.stopPropagation(); installSkillRef(r.ref); }));
-    li.appendChild(actions);
-    skillSearchResultsEl.appendChild(li);
-  }
-}
-
-export async function installSkillRef(ref) {
-  setStatus('#skill-search-status', `instalando ${ref}…`);
-  const data = await api('/api/skills/import', { method: 'POST', body: { ref } }).catch((e) => ({ error: e.message }));
-  if (data?.error) return setStatus('#skill-search-status', data.error, 'err');
-  setStatus('#skill-search-status', `instalada ${data.installed}`, 'ok');
-  await refreshSkills();
-  await refreshSkillCatalog();
-  await searchSkills();
-}
-
+import { deleteEntity, importEntity, toggleEntity } from './chat.js';
+import {
+  agentControlsSlot,
+  applySessionAgent,
+  loadModels,
+  modelSelect,
+  moveAgentControls,
+  persistAgent,
+  providerSelect,
+  setSummaryText,
+  updateStatus,
+} from './chrome.js';
+import { $, api, button, clear, el, emptyState, icon, state } from './core.js';
+import { filterSettings } from './settingsNav.js';
+
+/* --- providers ----------------------------------------------------------- */
+
+export const providerListEl = $('#provider-list');
+export const providerForm = $('#provider-form');
+export const providerModal = $('#provider-modal');
+
+export async function refreshProviders() {
+  const data = await api('/api/providers').catch(() => null);
+  if (!data) return;
+  state.providers = data.providers;
+  state.active = data.active;
+  syncTopbar();
+  renderProviderList();
+  const record = state.panes.get(state.sessionId);
+  if (record) await applySessionAgent(record);
+}
+
+export function isConfigured(p) {
+  return Boolean(p.hasKey) || !p.requiresKey;
+}
+
+export function syncTopbar() {
+  clear(providerSelect);
+  const configured = state.providers.filter(isConfigured);
+  for (const p of configured) {
+    const option = document.createElement('option');
+    option.value = p.id;
+    option.textContent = p.label && p.label !== p.id ? `${p.label} (${p.id})` : p.id;
+    providerSelect.appendChild(option);
+  }
+  const record = state.panes.get(state.sessionId);
+  const active = record?.provider || state.active.provider;
+  if (active && !configured.some((p) => p.id === active)) {
+    const current = state.providers.find((p) => p.id === active);
+    const option = document.createElement('option');
+    option.value = active;
+    option.textContent = `${current?.label ?? active} (sin configurar)`;
+    providerSelect.appendChild(option);
+  }
+  if (!providerSelect.options.length) {
+    const option = document.createElement('option');
+    option.value = '';
+    option.textContent = 'sin proveedores configurados';
+    providerSelect.appendChild(option);
+    providerSelect.disabled = true;
+  } else {
+    providerSelect.disabled = false;
+    if (active) providerSelect.value = active;
+  }
+  updateStatus();
+}
+
+export function renderProviderList() {
+  clear(providerListEl);
+  for (const p of state.providers) {
+    const li = el('li', p.id === state.active.provider ? 'active' : '');
+    li.appendChild(el('span', `pdot${p.hasKey || !p.requiresKey ? ' on' : ''}`));
+    const main = el('div', 'grow');
+    const title = el('div');
+    title.append(el('span', 'pid', p.id), document.createTextNode(' '), el('span', 'pmeta', p.label));
+    main.append(
+      title,
+      el(
+        'div',
+        'pmeta',
+        `${p.baseUrl || p.defaultBaseUrl || 'sin base URL'} · ${p.models.length} modelos · ${p.apiKeyHint || (p.requiresKey ? 'sin key' : 'sin key requerida')}`
+      )
+    );
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    actions.appendChild(button('usar', (event) => { event.stopPropagation(); useProvider(p.id); }));
+    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openProviderForm(p); }));
+    if (p.stored) actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeProvider(p.id); }, 'btn danger'));
+    li.appendChild(actions);
+    li.addEventListener('click', () => openProviderForm(p));
+    providerListEl.appendChild(li);
+  }
+}
+
+export async function useProvider(id) {
+  providerSelect.value = id;
+  await loadModels({ save: false, force: true });
+  await persistAgent({ provider: id, model: modelSelect.value || undefined });
+  await refreshProviders();
+}
+
+export function openProviderForm(provider = null) {
+  $('#provider-title').textContent = provider ? `editar ${provider.id}` : 'nuevo proveedor';
+  $('#pf-id').value = provider?.id ?? '';
+  $('#pf-id').readOnly = Boolean(provider);
+  $('#pf-label').value = provider?.label ?? '';
+  $('#pf-baseurl').value = provider?.baseUrl ?? '';
+  $('#pf-key').value = '';
+  $('#pf-key').placeholder = provider?.apiKeyHint ? `guardada (${provider.apiKeyHint})` : 'dejar vacío para no cambiar';
+  $('#pf-models').value = (provider?.models ?? []).join(', ');
+  setProviderStatus('');
+  providerModal.showModal();
+  if (!provider) $('#pf-id').focus();
+}
+
+export function closeProviderForm() {
+  if (providerModal.open) providerModal.close();
+}
+
+export function setProviderStatus(text, cls = '') {
+  setSummaryText($('#pf-status'), text, cls);
+}
+
+export async function submitProvider(event) {
+  event.preventDefault();
+  const id = $('#pf-id').value.trim();
+  if (!id) return setProviderStatus('Falta el id.', 'err');
+  const body = {
+    label: $('#pf-label').value.trim() || id,
+    baseUrl: $('#pf-baseurl').value.trim(),
+    models: $('#pf-models').value.split(',').map((s) => s.trim()).filter(Boolean),
+  };
+  const key = $('#pf-key').value;
+  if (key) body.apiKey = key;
+  try {
+    await api(`/api/providers/${encodeURIComponent(id)}`, { method: 'PUT', body });
+    closeProviderForm();
+    await refreshProviders();
+    await loadModels({ force: true });
+  } catch (error) {
+    setProviderStatus(error.message, 'err');
+  }
+}
+
+export async function removeProvider(id) {
+  await deleteEntity(`/api/providers/${encodeURIComponent(id)}`, {
+    confirmText: `¿Borrar la configuración de "${id}"?`,
+    after: () => loadModels({ force: true }),
+    refresh: refreshProviders,
+  });
+}
+
+export async function testProvider() {
+  const id = $('#pf-id').value.trim();
+  if (!id) return setProviderStatus('Guardá primero el proveedor para probarlo.', 'err');
+  setProviderStatus('probando…');
+  const out = await api(`/api/providers/${encodeURIComponent(id)}/test`, { method: 'POST' }).catch((error) => ({
+    ok: false,
+    error: error.message,
+  }));
+  if (!out.ok) return setProviderStatus(`error: ${out.error}`, 'err');
+
+  const ids = (out.models ?? []).map((m) => m.id ?? m).filter(Boolean);
+  let note = '';
+  if (out.source === 'api' && ids.length) {
+    $('#pf-models').value = ids.join(', ');
+    note = ' · modelos autocompletados';
+  }
+  if (id === state.active.provider) await loadModels({ force: true });
+  setProviderStatus(`ok · ${out.count} modelos (${out.source})${note}`, 'ok');
+}
+
+/* --- ajustes: MCP + Skills ----------------------------------------------- */
+
+export const mcpListEl = $('#mcp-list');
+export const mcpSearchResultsEl = $('#mcp-search-results');
+export const mcpCatalogEl = $('#mcp-catalog');
+export const mcpModal = $('#mcp-modal');
+export const mcpForm = $('#mcp-form');
+export const mcpModeEl = $('#mcp-mode');
+export const mcpCountEl = $('#mcp-count');
+export const mcpPinnedEl = $('#mcp-pinned');
+export const skillListEl = $('#skill-list');
+export const skillSearchResultsEl = $('#skill-search-results');
+export const skillCatalogEl = $('#skill-catalog');
+export const skillModal = $('#skill-modal');
+export const skillForm = $('#skill-form');
+export const agentListEl = $('#agent-list');
+export const agentModal = $('#agent-modal');
+export const agentForm = $('#agent-form');
+export const memoryListEl = $('#memory-list');
+export const memoryIndexEl = $('#memory-index');
+export const memoryModal = $('#memory-modal');
+export const memoryForm = $('#memory-form');
+export const scheduleListEl = $('#schedule-list');
+export const scheduleModal = $('#schedule-modal');
+export const scheduleForm = $('#schedule-form');
+export const tgTokenEl = $('#tg-token');
+export const tgChatsEl = $('#tg-chats');
+export const tgTranscribeEl = $('#tg-transcribe');
+export const tgTranscribeProviderEl = $('#tg-transcribe-provider');
+export const tgNotifyEl = $('#tg-notify');
+export const tgNotifyDoneEl = $('#tg-notify-done');
+export const tgNotifyErrorEl = $('#tg-notify-error');
+export const tgNotifyPermissionEl = $('#tg-notify-permission');
+export const tgNotifyAgentEl = $('#tg-notify-agent');
+export const tgStatusEl = $('#tg-status');
+export const vozEnabledEl = $('#voz-enabled');
+export const vozVoiceEl = $('#voz-voice');
+export const vozRateEl = $('#voz-rate');
+export const vozRateValEl = $('#voz-rate-val');
+export const vozPitchEl = $('#voz-pitch');
+export const vozPitchValEl = $('#voz-pitch-val');
+export const vozAnnStartEl = $('#voz-ann-start');
+export const vozAnnToolsEl = $('#voz-ann-tools');
+export const vozAnnEndEl = $('#voz-ann-end');
+export const vozAnnAnswerEl = $('#voz-ann-answer');
+export const vozFfmpegEl = $('#voz-ffmpeg');
+export const trProviderEl = $('#tr-provider');
+export const trModelEl = $('#tr-model');
+
+/* --- ajustes: pestañas internas + límites del agente --------------------- */
+
+export const ajustesTabs = document.querySelectorAll('.ajustes-tab');
+export const ajustesWrap = document.querySelector('.ajustes-wrap');
+export const ajustesSearchEl = $('#ajustes-search');
+
+/** En móvil los ajustes son dos pantallas (lista y detalle); en escritorio el nivel no importa. */
+export function setAjustesLevel(level) {
+  if (ajustesWrap) ajustesWrap.dataset.level = level === 'panel' ? 'panel' : 'list';
+}
+
+export function activateAjustesPanel(name) {
+  ajustesTabs.forEach((tab) => {
+    const on = tab.dataset.panel === name;
+    tab.classList.toggle('active', on);
+    tab.setAttribute('aria-selected', on ? 'true' : 'false');
+    tab.tabIndex = on ? 0 : -1;
+  });
+  document
+    .querySelectorAll('.ajustes-panel')
+    .forEach((panel) => panel.classList.toggle('active', panel.dataset.panel === name));
+  setAjustesLevel('panel');
+  if (name === 'agente') moveAgentControls(agentControlsSlot);
+}
+
+/** Muestra solo las secciones que coinciden con la búsqueda y oculta los grupos vacíos. */
+export function filterAjustesNav(query) {
+  const hits = new Set(filterSettings(query).map((section) => section.id));
+  ajustesTabs.forEach((tab) => {
+    tab.hidden = !hits.has(tab.dataset.panel);
+  });
+  document.querySelectorAll('.ajustes-group').forEach((group) => {
+    group.hidden = !group.querySelector('.ajustes-tab:not([hidden])');
+  });
+  const empty = $('#ajustes-empty');
+  if (empty) empty.hidden = hits.size > 0;
+  return [...ajustesTabs].filter((tab) => !tab.hidden);
+}
+
+function focusAjustesTab(tab) {
+  if (!tab) return;
+  ajustesTabs.forEach((other) => {
+    other.tabIndex = other === tab ? 0 : -1;
+  });
+  tab.focus();
+}
+
+export function wireAjustesNav() {
+  ajustesTabs.forEach((tab) => tab.addEventListener('click', () => activateAjustesPanel(tab.dataset.panel)));
+
+  $('#ajustes-back')?.addEventListener('click', () => {
+    setAjustesLevel('list');
+    focusAjustesTab(document.querySelector('.ajustes-tab.active'));
+  });
+
+  $('.ajustes-tabs')?.addEventListener('keydown', (event) => {
+    const visible = [...ajustesTabs].filter((tab) => !tab.hidden);
+    const index = visible.indexOf(document.activeElement);
+    if (index < 0) return;
+    const step = { ArrowDown: 1, ArrowRight: 1, ArrowUp: -1, ArrowLeft: -1 }[event.key];
+    let next = null;
+    if (step) next = visible[(index + step + visible.length) % visible.length];
+    else if (event.key === 'Home') next = visible[0];
+    else if (event.key === 'End') next = visible[visible.length - 1];
+    if (!next) return;
+    event.preventDefault();
+    focusAjustesTab(next);
+  });
+
+  ajustesSearchEl?.addEventListener('input', () => filterAjustesNav(ajustesSearchEl.value));
+  ajustesSearchEl?.addEventListener('keydown', (event) => {
+    if (event.key === 'Escape' && ajustesSearchEl.value) {
+      event.preventDefault();
+      ajustesSearchEl.value = '';
+      filterAjustesNav('');
+    } else if (event.key === 'Enter') {
+      event.preventDefault();
+      const first = [...ajustesTabs].find((tab) => !tab.hidden);
+      if (first) activateAjustesPanel(first.dataset.panel);
+    } else if (event.key === 'ArrowDown') {
+      event.preventDefault();
+      focusAjustesTab([...ajustesTabs].find((tab) => !tab.hidden));
+    }
+  });
+}
+
+export const limitsRoundsEl = $('#limits-rounds');
+export const limitsTokensEl = $('#limits-tokens');
+export const limitsDurationEl = $('#limits-duration');
+export const limitsOutputEl = $('#limits-output');
+export const limitsCachingEl = $('#limits-caching');
+
+export async function refreshLimits() {
+  const data = await api('/api/settings').catch(() => null);
+  const settings = data?.settings;
+  if (!settings) return;
+  if (limitsRoundsEl) limitsRoundsEl.value = settings.maxRounds ?? 0;
+  if (limitsTokensEl) limitsTokensEl.value = settings.maxTokens ?? 0;
+  if (limitsDurationEl) limitsDurationEl.value = Math.round((settings.maxDurationMs ?? 0) / 1000);
+  if (limitsOutputEl) limitsOutputEl.value = settings.maxOutputTokens ?? 0;
+  if (limitsCachingEl) limitsCachingEl.checked = settings.promptCaching === true;
+}
+
+export function setStatus(node, text, cls = '') {
+  const elNode = $(node);
+  if (!elNode) return;
+  setSummaryText(elNode, text, cls);
+}
+
+export async function refreshMcp({ connect = false } = {}) {
+  const data = await api(`/api/mcp${connect ? '?connect=1' : ''}`).catch(() => null);
+  if (!data) return;
+  if (mcpModeEl && data.mode) mcpModeEl.value = data.mode;
+  if (mcpPinnedEl && Array.isArray(data.pinned) && document.activeElement !== mcpPinnedEl) {
+    mcpPinnedEl.value = data.pinned.join(', ');
+  }
+  if (mcpCountEl) {
+    mcpCountEl.textContent =
+      data.toolCount == null
+        ? ''
+        : `${data.toolCount} herramientas · ${data.lazy ? 'diferidas (mcp_call)' : 'completas en contexto'}`;
+  }
+  clear(mcpListEl);
+  if (!data.servers.length) {
+    mcpListEl.appendChild(emptyState('Sin servidores MCP', 'Tocá «+ nuevo» o prendé uno de los sugeridos de abajo.'));
+    return;
+  }
+  for (const s of data.servers) {
+    const li = el('li', s.enabled ? 'active' : '');
+    li.appendChild(el('span', `pdot${s.ok !== false ? ' on' : ''}`));
+    const main = el('div', 'grow');
+    const title = el('div');
+    title.append(el('span', 'pid', s.id), document.createTextNode(' '), el('span', 'pmeta', s.name || ''));
+    const detail = s.transport === 'http' ? s.url || '' : `${s.command || ''} ${(s.args || []).join(' ')}`.trim();
+    const parts = [s.transport, detail || '(sin destino)', s.source === 'config' ? 'tamnora.json' : 'guardado'];
+    if (connect) {
+      if (s.ok === false) parts.push(`error: ${s.error}`);
+      else parts.push(`${(s.tools || []).length} tools`);
+    }
+    main.append(title, el('div', 'pmeta', parts.join(' · ')));
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    actions.appendChild(button(s.enabled ? 'deshabilitar' : 'habilitar', (event) => { event.stopPropagation(); toggleMcp(s); }));
+    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openMcpForm(s); }));
+    if (s.source !== 'config') actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeMcp(s.id); }, 'btn danger'));
+    li.appendChild(actions);
+    li.addEventListener('click', () => openMcpForm(s));
+    mcpListEl.appendChild(li);
+  }
+}
+
+export function syncMcpFormFields() {
+  const http = $('#mf-transport').value === 'http';
+  $('#mf-command-field').hidden = http;
+  $('#mf-args-field').hidden = http;
+  $('#mf-env-field').hidden = http;
+  $('#mf-inherit-field').hidden = http;
+  $('#mf-url-field').hidden = !http;
+}
+
+export function openMcpForm(server = null) {
+  $('#mcp-title').textContent = server ? `editar ${server.id}` : 'nuevo servidor MCP';
+  $('#mf-id').value = server?.id ?? '';
+  $('#mf-id').readOnly = Boolean(server);
+  $('#mf-name').value = server?.name ?? '';
+  $('#mf-transport').value = server?.transport === 'http' ? 'http' : 'stdio';
+  $('#mf-command').value = server?.command ?? '';
+  $('#mf-args').value = (server?.args ?? []).join(' ');
+  $('#mf-url').value = server?.url ?? '';
+  $('#mf-env').value = Object.entries(server?.env ?? {})
+    .map(([key, value]) => `${key}=${value ?? ''}`)
+    .join('\n');
+  $('#mf-inherit-env').checked = server?.inheritEnv === true;
+  $('#mf-enabled').checked = server ? server.enabled !== false : true;
+  syncMcpFormFields();
+  setStatus('#mf-status', '');
+  mcpModal.showModal();
+  if (!server) $('#mf-id').focus();
+}
+
+export function closeMcpForm() {
+  if (mcpModal.open) mcpModal.close();
+}
+
+export async function toggleMcp(server) {
+  await toggleEntity(`/api/mcp/servers/${encodeURIComponent(server.id)}`, {
+    body: {
+      name: server.name,
+      transport: server.transport,
+      command: server.command,
+      args: server.args,
+      url: server.url,
+      env: server.env,
+      enabled: !server.enabled,
+    },
+    errorLabel: 'actualizar MCP',
+    refresh: refreshMcp,
+  });
+}
+
+export async function removeMcp(id) {
+  await deleteEntity(`/api/mcp/servers/${encodeURIComponent(id)}`, {
+    confirmText: `¿Eliminar el servidor MCP "${id}"?`,
+    refresh: refreshMcp,
+  });
+}
+
+export function parseEnv(text) {
+  const out = {};
+  for (const line of String(text ?? '').split('\n')) {
+    const trimmed = line.trim();
+    if (!trimmed || trimmed.startsWith('#')) continue;
+    const eq = trimmed.indexOf('=');
+    if (eq === -1) continue;
+    out[trimmed.slice(0, eq).trim()] = trimmed.slice(eq + 1);
+  }
+  return out;
+}
+
+export async function submitMcp(event) {
+  event.preventDefault();
+  const id = $('#mf-id').value.trim();
+  if (!id) return setStatus('#mf-status', 'Falta el id.', 'err');
+  const body = {
+    name: $('#mf-name').value.trim() || id,
+    transport: $('#mf-transport').value,
+    command: $('#mf-command').value.trim(),
+    args: $('#mf-args').value.trim(),
+    url: $('#mf-url').value.trim(),
+    env: parseEnv($('#mf-env').value),
+    inheritEnv: $('#mf-inherit-env').checked,
+    enabled: $('#mf-enabled').checked,
+  };
+  try {
+    await api(`/api/mcp/servers/${encodeURIComponent(id)}`, { method: 'PUT', body });
+  } catch (error) {
+    return setStatus('#mf-status', error.message, 'err');
+  }
+  closeMcpForm();
+  refreshMcp();
+}
+
+export async function refreshSkills() {
+  const data = await api('/api/skills').catch(() => null);
+  if (!data) return;
+  clear(skillListEl);
+  if (!data.skills.length) {
+    skillListEl.appendChild(emptyState('Sin skills todavía', 'Tocá «+ nueva» o instalá una de las sugeridas del catálogo.'));
+    return;
+  }
+  for (const s of data.skills) {
+    const li = el('li', s.enabled ? 'active' : '');
+    li.appendChild(el('span', `pdot${s.enabled ? ' on' : ''}`));
+    const main = el('div', 'grow');
+    main.append(
+      el('div', '', s.name || s.id),
+      el('div', 'pmeta', s.description || s.when || '(sin descripción)')
+    );
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    actions.appendChild(button(s.enabled ? 'deshabilitar' : 'habilitar', (event) => { event.stopPropagation(); toggleSkill(s.id); }));
+    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openSkillForm(s.id); }));
+    if (s.removable) actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeSkill(s.id); }, 'btn danger'));
+    li.appendChild(actions);
+    li.addEventListener('click', () => openSkillForm(s.id));
+    skillListEl.appendChild(li);
+  }
+}
+
+export async function openSkillForm(id = null) {
+  $('#skill-title').textContent = id ? `editar ${id}` : 'nueva skill';
+  $('#sf-id').value = id ?? '';
+  $('#sf-id').readOnly = Boolean(id);
+  $('#sf-name').value = '';
+  $('#sf-description').value = '';
+  $('#sf-when').value = '';
+  $('#sf-body').value = '';
+  setStatus('#sf-status', '');
+  if (id) {
+    const data = await api(`/api/skills/${encodeURIComponent(id)}`).catch(() => null);
+    if (data?.skill) {
+      $('#sf-name').value = data.skill.name ?? '';
+      $('#sf-description').value = data.skill.description ?? '';
+      $('#sf-when').value = data.skill.when ?? '';
+      $('#sf-body').value = data.skill.body ?? '';
+    }
+  }
+  skillModal.showModal();
+  if (!id) $('#sf-id').focus();
+}
+
+export function closeSkillForm() {
+  if (skillModal.open) skillModal.close();
+}
+
+export async function toggleSkill(id) {
+  await toggleEntity(`/api/skills/${encodeURIComponent(id)}/toggle`, {
+    method: 'POST',
+    errorLabel: 'cambiar la skill',
+    refresh: refreshSkills,
+  });
+}
+
+export async function removeSkill(id) {
+  await deleteEntity(`/api/skills/${encodeURIComponent(id)}`, {
+    confirmText: `¿Eliminar la skill "${id}"?`,
+    refresh: refreshSkills,
+  });
+}
+
+export async function submitSkill(event) {
+  event.preventDefault();
+  const id = $('#sf-id').value.trim();
+  if (!id) return setStatus('#sf-status', 'Falta el id.', 'err');
+  const body = {
+    name: $('#sf-name').value.trim() || id,
+    description: $('#sf-description').value.trim(),
+    when: $('#sf-when').value.trim(),
+    body: $('#sf-body').value,
+  };
+  try {
+    await api(`/api/skills/${encodeURIComponent(id)}`, { method: 'PUT', body });
+  } catch (error) {
+    return setStatus('#sf-status', error.message, 'err');
+  }
+  closeSkillForm();
+  refreshSkills();
+}
+
+/* --- ajustes: Subagentes ------------------------------------------------- */
+
+export async function refreshAgents() {
+  if (!agentListEl) return;
+  const data = await api('/api/agents').catch(() => null);
+  if (!data) return;
+  clear(agentListEl);
+  if (!data.agents.length) {
+    agentListEl.appendChild(
+      emptyState(
+        'Sin subagentes todavía',
+        'Tocá «+ nuevo» para crear uno: el agente principal va a verlo en su catálogo y podrá delegarle tareas con task.'
+      )
+    );
+    return;
+  }
+  for (const agent of data.agents) {
+    const li = el('li', agent.enabled ? 'active' : '');
+    li.appendChild(el('span', `pdot${agent.enabled ? ' on' : ''}`));
+    const main = el('div', 'grow');
+    const details = [
+      agent.provider || 'proveedor heredado',
+      agent.model || 'modelo heredado',
+      agent.mode || 'modo heredado',
+      agent.effort ? `esfuerzo ${agent.effort}` : '',
+      Array.isArray(agent.skills) ? `${agent.skills.length} skill(s)` : 'todas las skills',
+    ].filter(Boolean);
+    main.append(
+      el('div', '', `${agent.name || agent.id} · ${agent.id}`),
+      el('div', 'pmeta', agent.description || details.join(' · '))
+    );
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    actions.appendChild(button(agent.enabled ? 'deshabilitar' : 'habilitar', (event) => { event.stopPropagation(); toggleAgent(agent.id); }));
+    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openAgentForm(agent.id); }));
+    if (agent.removable) {
+      actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeAgent(agent.id); }, 'btn danger'));
+    }
+    li.appendChild(actions);
+    li.addEventListener('click', () => openAgentForm(agent.id));
+    agentListEl.appendChild(li);
+  }
+}
+
+function fillAgentProviders() {
+  const select = $('#af-provider');
+  if (!select) return;
+  const current = select.value;
+  clear(select);
+  const inherit = document.createElement('option');
+  inherit.value = '';
+  inherit.textContent = 'heredar';
+  select.appendChild(inherit);
+  for (const provider of state.providers ?? []) {
+    const option = document.createElement('option');
+    option.value = provider.id;
+    option.textContent = provider.label && provider.label !== provider.id ? `${provider.label} (${provider.id})` : provider.id;
+    select.appendChild(option);
+  }
+  select.value = current;
+}
+
+function fillAgentSkills(selected = null) {
+  const select = $('#af-skills');
+  if (!select) return;
+  clear(select);
+  for (const skill of state.skills ?? []) {
+    const option = document.createElement('option');
+    option.value = skill.id;
+    option.textContent = `${skill.name || skill.id}${skill.enabled ? '' : ' (deshabilitada)'}`;
+    option.disabled = !skill.enabled;
+    select.appendChild(option);
+  }
+  const wanted = new Set(Array.isArray(selected) ? selected : []);
+  for (const option of select.options) option.selected = wanted.has(option.value);
+}
+
+export async function openAgentForm(id = null) {
+  $('#agent-title').textContent = id ? `editar ${id}` : 'nuevo subagente';
+  $('#af-id').value = id ?? '';
+  $('#af-id').readOnly = Boolean(id);
+  $('#af-name').value = '';
+  $('#af-description').value = '';
+  $('#af-model').value = '';
+  $('#af-rounds').value = '';
+  $('#af-tools').value = '';
+  $('#af-body').value = '';
+  setStatus('#af-status', '');
+  const providers = await api('/api/providers').catch(() => null);
+  if (providers?.providers) state.providers = providers.providers;
+  const skills = await api('/api/skills').catch(() => null);
+  state.skills = skills?.skills ?? [];
+  const effort = $('#af-effort');
+  if (effort) effort.value = '';
+  fillAgentProviders();
+  $('#af-provider').value = '';
+  $('#af-mode').value = '';
+  fillAgentSkills([]);
+  if (id) {
+    const data = await api(`/api/agents/${encodeURIComponent(id)}`).catch(() => null);
+    if (data?.agent) {
+      const agent = data.agent;
+      $('#af-name').value = agent.name ?? '';
+      $('#af-description').value = agent.description ?? '';
+      $('#af-model').value = agent.model ?? '';
+      $('#af-provider').value = agent.provider ?? '';
+      $('#af-mode').value = agent.mode ?? '';
+      $('#af-effort').value = agent.effort ?? '';
+      $('#af-rounds').value = agent.maxRounds || '';
+      $('#af-tools').value = (agent.tools ?? []).join(', ');
+      fillAgentSkills(agent.skills ?? null);
+      $('#af-body').value = agent.body ?? '';
+    }
+  }
+  agentModal.showModal();
+  if (!id) $('#af-id').focus();
+}
+
+export function closeAgentForm() {
+  if (agentModal?.open) agentModal.close();
+}
+
+export async function toggleAgent(id) {
+  await toggleEntity(`/api/agents/${encodeURIComponent(id)}/toggle`, {
+    method: 'POST',
+    errorLabel: 'cambiar el subagente',
+    refresh: refreshAgents,
+  });
+}
+
+export async function removeAgent(id) {
+  await deleteEntity(`/api/agents/${encodeURIComponent(id)}`, {
+    confirmText: `¿Eliminar el subagente "${id}"?`,
+    refresh: refreshAgents,
+  });
+}
+
+export async function submitAgent(event) {
+  event.preventDefault();
+  const id = $('#af-id').value.trim();
+  if (!id) return setStatus('#af-status', 'Falta el id.', 'err');
+  const skillsSelect = $('#af-skills');
+  const selectedSkills = skillsSelect ? [...skillsSelect.selectedOptions].map((option) => option.value) : [];
+  const body = {
+    name: $('#af-name').value.trim() || id,
+    description: $('#af-description').value.trim(),
+    provider: $('#af-provider').value.trim(),
+    model: $('#af-model').value.trim(),
+    mode: $('#af-mode').value,
+    effort: $('#af-effort').value,
+    maxRounds: Number($('#af-rounds').value) || 0,
+    tools: $('#af-tools').value.split(',').map((item) => item.trim()).filter(Boolean),
+    skills: selectedSkills.length ? selectedSkills : null,
+    body: $('#af-body').value,
+  };
+  try {
+    await api(`/api/agents/${encodeURIComponent(id)}`, { method: 'PUT', body });
+  } catch (error) {
+    return setStatus('#af-status', error.message, 'err');
+  }
+  closeAgentForm();
+  refreshAgents();
+}
+
+/* --- ajustes: Memoria ---------------------------------------------------- */
+
+export async function refreshMemory() {
+  if (!memoryListEl) return;
+  const data = await api('/api/memory').catch(() => null);
+  if (!data) return;
+  if (memoryIndexEl && document.activeElement !== memoryIndexEl) memoryIndexEl.value = data.index ?? '';
+  clear(memoryListEl);
+  if (!data.topics?.length) {
+    memoryListEl.appendChild(emptyState('Sin memoria todavía', 'El agente guarda acá lo que conviene recordar del proyecto; también podés crear un tema con «+ tema».'));
+    return;
+  }
+  for (const t of data.topics) {
+    const li = el('li', 'active');
+    const main = el('div', 'grow');
+    main.append(
+      el('div', '', t.title || t.name),
+      el('div', 'pmeta', `${t.name}${t.bytes ? ` · ${Math.max(1, Math.round(t.bytes / 1024))} KB` : ''}`)
+    );
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openMemoryForm(t.name); }));
+    actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeMemory(t.name); }, 'btn danger'));
+    li.appendChild(actions);
+    li.addEventListener('click', () => openMemoryForm(t.name));
+    memoryListEl.appendChild(li);
+  }
+}
+
+export async function openMemoryForm(name = null) {
+  $('#memory-title').textContent = name ? `editar ${name}` : 'nuevo tema';
+  $('#mem-name').value = name ? name.replace(/\.md$/i, '') : '';
+  $('#mem-name').readOnly = Boolean(name);
+  $('#mem-title').value = '';
+  $('#mem-body').value = '';
+  setStatus('#mem-status', '');
+  if (name) {
+    const data = await api(`/api/memory/${encodeURIComponent(name)}`).catch(() => null);
+    if (data?.topic) {
+      $('#mem-title').value = data.topic.title ?? '';
+      $('#mem-body').value = data.topic.body ?? '';
+    }
+  }
+  memoryModal.showModal();
+  if (!name) $('#mem-name').focus();
+}
+
+export function closeMemoryForm() {
+  if (memoryModal.open) memoryModal.close();
+}
+
+export async function removeMemory(name) {
+  await deleteEntity(`/api/memory/${encodeURIComponent(name)}`, {
+    confirmText: `¿Borrar la memoria "${name}"?`,
+    refresh: refreshMemory,
+  });
+}
+
+export async function submitMemory(event) {
+  event.preventDefault();
+  const name = $('#mem-name').value.trim();
+  if (!name) return setStatus('#mem-status', 'Falta el tema.', 'err');
+  const body = { title: $('#mem-title').value.trim(), body: $('#mem-body').value };
+  try {
+    await api(`/api/memory/${encodeURIComponent(name)}`, { method: 'PUT', body });
+  } catch (error) {
+    return setStatus('#mem-status', error.message, 'err');
+  }
+  closeMemoryForm();
+  refreshMemory();
+}
+
+export async function saveMemoryIndex() {
+  try {
+    await api('/api/memory', { method: 'PUT', body: { index: memoryIndexEl.value } });
+  } catch (error) {
+    return setStatus('#memory-status', error.message, 'err');
+  }
+  setStatus('#memory-status', 'guardado', 'ok');
+  refreshMemory();
+}
+
+/* --- ajustes: Tareas programadas ----------------------------------------- */
+
+export function fmtWhen(ms) {
+  try {
+    return new Date(ms).toLocaleString();
+  } catch {
+    return '';
+  }
+}
+
+export function scheduleTypeFields() {
+  const type = $('#sc-type').value;
+  const agent = type === 'agent';
+  $('#sc-agent-prompt-row').hidden = !agent;
+  $('#sc-agent-mode-row').hidden = !agent;
+  $('#sc-shell-cmd-row').hidden = agent;
+  $('#sc-shell-args-row').hidden = agent;
+}
+
+export async function refreshSchedules() {
+  if (!scheduleListEl) return;
+  const data = await api('/api/schedules').catch(() => null);
+  if (!data) return;
+  clear(scheduleListEl);
+  if (!data.schedules.length) {
+    scheduleListEl.appendChild(emptyState('Sin tareas programadas', 'Con «+ tarea» programás un comando o un turno del agente: cada tanto, a diario o con cron.'));
+    return;
+  }
+  for (const s of data.schedules) {
+    const li = el('li', s.enabled ? 'active' : '');
+    li.appendChild(el('span', `pdot${s.enabled ? ' on' : ''}`));
+    const main = el('div', 'grow');
+    const meta = [s.type, s.spec];
+    if (s.nextRun) meta.push(`próxima ${fmtWhen(s.nextRun)}`);
+    if (s.lastStatus) meta.push(s.lastStatus);
+    main.append(el('div', '', s.name || s.id), el('div', 'pmeta', meta.join(' · ')));
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    actions.appendChild(button('correr', (event) => { event.stopPropagation(); runSchedule(s.id); }));
+    actions.appendChild(button(s.enabled ? 'pausar' : 'activar', (event) => { event.stopPropagation(); toggleSchedule(s.id); }));
+    actions.appendChild(button('editar', (event) => { event.stopPropagation(); openScheduleForm(s.id); }));
+    actions.appendChild(button('borrar', (event) => { event.stopPropagation(); removeSchedule(s.id); }, 'btn danger'));
+    li.appendChild(actions);
+    li.addEventListener('click', () => openScheduleForm(s.id));
+    scheduleListEl.appendChild(li);
+  }
+}
+
+export async function openScheduleForm(id = null) {
+  $('#schedule-title').textContent = id ? `editar ${id}` : 'nueva tarea';
+  $('#sc-id').value = id ?? '';
+  $('#sc-id').readOnly = Boolean(id);
+  $('#sc-name').value = '';
+  $('#sc-type').value = 'agent';
+  $('#sc-spec').value = '';
+  $('#sc-prompt').value = '';
+  $('#sc-mode').value = 'agent';
+  $('#sc-command').value = '';
+  $('#sc-args').value = '';
+  $('#sc-cwd').value = '';
+  $('#sc-enabled').checked = true;
+  setStatus('#sc-status', '');
+  if (id) {
+    const data = await api('/api/schedules').catch(() => null);
+    const s = data?.schedules?.find((item) => item.id === id);
+    if (s) {
+      $('#sc-name').value = s.name ?? '';
+      $('#sc-type').value = s.type ?? 'agent';
+      $('#sc-spec').value = s.spec ?? '';
+      $('#sc-cwd').value = s.cwd ?? '';
+      $('#sc-enabled').checked = s.enabled !== false;
+      const payload = s.payload ?? {};
+      if (s.type === 'shell') {
+        $('#sc-command').value = payload.command ?? '';
+        $('#sc-args').value = Array.isArray(payload.args) ? payload.args.join(' ') : payload.args ?? '';
+      } else {
+        $('#sc-prompt').value = payload.prompt ?? '';
+        $('#sc-mode').value = payload.mode ?? 'agent';
+      }
+    }
+  }
+  scheduleTypeFields();
+  scheduleModal.showModal();
+  if (!id) $('#sc-id').focus();
+}
+
+export function closeScheduleForm() {
+  if (scheduleModal.open) scheduleModal.close();
+}
+
+export async function submitSchedule(event) {
+  event.preventDefault();
+  const id = $('#sc-id').value.trim();
+  if (!id) return setStatus('#sc-status', 'Falta el id.', 'err');
+  const type = $('#sc-type').value;
+  const body = {
+    id,
+    name: $('#sc-name').value.trim() || id,
+    type,
+    spec: $('#sc-spec').value.trim(),
+    cwd: $('#sc-cwd').value.trim() || undefined,
+    enabled: $('#sc-enabled').checked,
+  };
+  if (type === 'shell') {
+    body.command = $('#sc-command').value.trim();
+    body.args = $('#sc-args').value.trim();
+  } else {
+    body.prompt = $('#sc-prompt').value.trim();
+    body.mode = $('#sc-mode').value;
+  }
+  try {
+    const exists = $('#sc-id').readOnly;
+    await api(exists ? `/api/schedules/${encodeURIComponent(id)}` : '/api/schedules', {
+      method: exists ? 'PUT' : 'POST',
+      body,
+    });
+  } catch (error) {
+    return setStatus('#sc-status', error.message, 'err');
+  }
+  closeScheduleForm();
+  refreshSchedules();
+}
+
+export async function toggleSchedule(id) {
+  await toggleEntity(`/api/schedules/${encodeURIComponent(id)}/toggle`, {
+    method: 'POST',
+    errorLabel: 'cambiar la tarea',
+    refresh: refreshSchedules,
+  });
+}
+
+export async function removeSchedule(id) {
+  await deleteEntity(`/api/schedules/${encodeURIComponent(id)}`, {
+    confirmText: `¿Eliminar la tarea "${id}"?`,
+    refresh: refreshSchedules,
+  });
+}
+
+export async function runSchedule(id) {
+  setStatus('#schedule-status', `corriendo ${id}…`);
+  try {
+    await api(`/api/schedules/${encodeURIComponent(id)}/run`, { method: 'POST' });
+  } catch (error) {
+    setStatus('#schedule-status', error.message, 'err');
+    refreshSchedules();
+    return;
+  }
+  setStatus('#schedule-status', `${id}: listo`, 'ok');
+  refreshSchedules();
+}
+
+export async function refreshChannels() {
+  if (!tgStatusEl) return;
+  const data = await api('/api/channels').catch(() => null);
+  if (!data?.telegram) return;
+  const tg = data.telegram;
+  tgStatusEl.className = `summary${tg.running ? ' ok' : ''}`;
+  tgStatusEl.textContent = tg.running
+    ? `activo${tg.tokenHint ? ` · ${tg.tokenHint}` : ''}`
+    : tg.tokenSet
+      ? 'token guardado (bot detenido)'
+      : 'sin configurar';
+  if (tgChatsEl && document.activeElement !== tgChatsEl) {
+    tgChatsEl.value = (tg.allowedChatIds ?? []).join(', ');
+  }
+  if (tgTranscribeEl && document.activeElement !== tgTranscribeEl) {
+    tgTranscribeEl.value = tg.transcribeModel ?? 'whisper-1';
+  }
+  if (tgTranscribeProviderEl && document.activeElement !== tgTranscribeProviderEl) {
+    tgTranscribeProviderEl.value = tg.transcribeProvider ?? '';
+  }
+  const notify = tg.notify ?? {};
+  if (tgNotifyEl) tgNotifyEl.checked = notify.enabled === true;
+  if (tgNotifyDoneEl) tgNotifyDoneEl.checked = notify.done !== false;
+  if (tgNotifyErrorEl) tgNotifyErrorEl.checked = notify.error !== false;
+  if (tgNotifyPermissionEl) tgNotifyPermissionEl.checked = notify.permission !== false;
+  if (tgNotifyAgentEl) tgNotifyAgentEl.checked = notify.agent !== false;
+  if (tgTokenEl && document.activeElement !== tgTokenEl) {
+    tgTokenEl.value = '';
+    tgTokenEl.placeholder = tg.tokenHint ? `${tg.tokenHint} (dejar vacío para no cambiar)` : '123456:ABC…';
+  }
+}
+
+export async function submitChannel() {
+  if (!tgTokenEl) return;
+  setStatus('#tg-msg', 'guardando…');
+  const body = {
+    allowedChatIds: tgChatsEl?.value ?? '',
+    transcribeModel: tgTranscribeEl?.value.trim() || 'whisper-1',
+    transcribeProvider: tgTranscribeProviderEl?.value.trim() || '',
+    notify: {
+      enabled: tgNotifyEl?.checked === true,
+      done: tgNotifyDoneEl?.checked !== false,
+      error: tgNotifyErrorEl?.checked !== false,
+      permission: tgNotifyPermissionEl?.checked !== false,
+      agent: tgNotifyAgentEl?.checked !== false,
+    },
+  };
+  const token = tgTokenEl.value.trim();
+  if (token) body.token = token;
+  const data = await api('/api/channels/telegram', { method: 'PUT', body }).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#tg-msg', data.error, 'err');
+  setStatus('#tg-msg', data.telegram?.running ? 'guardado · bot activo' : 'guardado', 'ok');
+  refreshChannels();
+}
+
+export async function testChannel() {
+  if (!tgTokenEl) return;
+  setStatus('#tg-msg', 'probando…');
+  const data = await api('/api/channels/telegram/test', {
+    method: 'POST',
+    body: { token: tgTokenEl.value.trim() },
+  }).catch((e) => ({ ok: false, error: e.message }));
+  if (data?.ok) setStatus('#tg-msg', `token OK${data.username ? ` · @${data.username}` : ''}`, 'ok');
+  else setStatus('#tg-msg', data?.error || 'token inválido', 'err');
+}
+
+
+/* --- ajustes: perfil del usuario ------------------------------------------ */
+
+export const perfil = {
+  address: $('#perfil-address'),
+  name: $('#perfil-name'),
+  language: $('#perfil-language'),
+  notes: $('#perfil-notes'),
+  fields: $('#perfil-fields'),
+  add: $('#perfil-add-field'),
+  save: $('#perfil-save'),
+};
+
+export function addPerfilFieldRow(key = '', value = '') {
+  if (!perfil.fields) return;
+  const row = el('div', 'perfil-field');
+  const keyInput = el('input', 'pf-key');
+  keyInput.placeholder = 'clave';
+  keyInput.value = key;
+  keyInput.spellcheck = false;
+  const valueInput = el('input', 'pf-value');
+  valueInput.placeholder = 'valor';
+  valueInput.value = value;
+  valueInput.spellcheck = false;
+  const remove = button('', () => row.remove(), 'btn icon');
+  remove.appendChild(icon('x', 12));
+  row.append(keyInput, valueInput, remove);
+  perfil.fields.appendChild(row);
+}
+
+export function renderPerfilFields(fields = {}) {
+  if (!perfil.fields) return;
+  clear(perfil.fields);
+  for (const [key, value] of Object.entries(fields)) addPerfilFieldRow(key, value);
+}
+
+export function collectPerfilFields() {
+  const out = {};
+  for (const row of perfil.fields?.querySelectorAll('.perfil-field') ?? []) {
+    const key = row.querySelector('.pf-key').value.trim();
+    const value = row.querySelector('.pf-value').value.trim();
+    if (key && value) out[key] = value;
+  }
+  return out;
+}
+
+export async function refreshProfile() {
+  if (!perfil.address) return;
+  const data = await api('/api/profile').catch(() => null);
+  if (!data?.profile) return;
+  const p = data.profile;
+  perfil.address.value = p.address ?? '';
+  perfil.name.value = p.name ?? '';
+  perfil.language.value = p.language ?? '';
+  perfil.notes.value = p.notes ?? '';
+  renderPerfilFields(p.fields ?? {});
+  setStatus('#perfil-status', p.address || p.name ? `trato: ${p.address || p.name}` : 'sin datos', '');
+}
+
+export async function submitProfile() {
+  if (!perfil.address) return;
+  setStatus('#perfil-msg', 'guardando…');
+  const body = {
+    address: perfil.address.value.trim(),
+    name: perfil.name.value.trim(),
+    language: perfil.language.value.trim(),
+    notes: perfil.notes.value.trim(),
+    fields: collectPerfilFields(),
+  };
+  const data = await api('/api/profile', { method: 'PUT', body }).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#perfil-msg', data.error, 'err');
+  setStatus('#perfil-msg', 'guardado', 'ok');
+  refreshProfile();
+}
+
+export async function importMcp() {
+  const input = $('#mcp-import');
+  const value = input.value.trim();
+  if (!value) return;
+  const payload = value.startsWith('{')
+    ? { json: value }
+    : /^https?:\/\//i.test(value)
+      ? { url: value }
+      : { name: value };
+  await importEntity({
+    url: '/api/mcp/import',
+    body: payload,
+    input,
+    statusSel: '#mcp-import-status',
+    refresh: refreshMcp,
+    okMessage: (data) => {
+      const required = (data.requiredEnv ?? []).length ? ` · requiere env: ${data.requiredEnv.join(', ')}` : '';
+      return `Importado ${data.imported}${required}`;
+    },
+  });
+}
+
+export async function importSkill() {
+  const input = $('#skill-import');
+  const ref = input.value.trim();
+  if (!ref) return;
+  await importEntity({
+    url: '/api/skills/import',
+    body: { ref },
+    input,
+    statusSel: '#skill-import-status',
+    refresh: refreshSkills,
+    okMessage: (data) => `Importada ${data.installed} (${data.source})`,
+  });
+}
+
+/* --- ajustes: biblioteca y buscador de MCP y skills ----------------------- */
+
+export async function refreshMcpCatalog() {
+  if (!mcpCatalogEl) return;
+  const data = await api('/api/mcp/catalog').catch(() => null);
+  if (!data) return;
+  clear(mcpCatalogEl);
+  for (const entry of data.catalog) {
+    const li = el('li', entry.installed ? 'active' : '');
+    const main = el('div', 'grow');
+    main.append(el('div', '', entry.name), el('div', 'pmeta', entry.description || ''));
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    if (entry.requiredEnv?.length) actions.appendChild(el('span', 'pmeta', `env: ${entry.requiredEnv.join(', ')}`));
+    if (entry.installed) actions.appendChild(el('span', 'pmeta', 'instalado'));
+    else actions.appendChild(button('agregar', (event) => { event.stopPropagation(); installCatalogMcp(entry.id); }));
+    li.appendChild(actions);
+    mcpCatalogEl.appendChild(li);
+  }
+}
+
+export async function installCatalogMcp(id) {
+  setStatus('#mcp-import-status', `agregando ${id}…`);
+  const data = await api('/api/mcp/import', { method: 'POST', body: { catalog: id } }).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#mcp-import-status', data.error, 'err');
+  setStatus('#mcp-import-status', `agregado ${id} (deshabilitado)`, 'ok');
+  await refreshMcp();
+  await refreshMcpCatalog();
+}
+
+export async function searchMcp() {
+  const input = $('#mcp-search');
+  const q = input?.value.trim();
+  if (!q) return;
+  setStatus('#mcp-search-status', 'buscando…');
+  const data = await api(`/api/mcp/search?q=${encodeURIComponent(q)}`).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#mcp-search-status', data.error, 'err');
+  clear(mcpSearchResultsEl);
+  if (!data.results.length) {
+    setStatus('#mcp-search-status', 'sin resultados');
+    return;
+  }
+  setStatus('#mcp-search-status', `${data.results.length} resultado(s)`);
+  for (const r of data.results) {
+    const li = el('li', r.installed ? 'active' : '');
+    const main = el('div', 'grow');
+    main.append(el('div', '', r.name || r.id), el('div', 'pmeta', r.description || r.id));
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    if (r.requiredEnv?.length) actions.appendChild(el('span', 'pmeta', `env: ${r.requiredEnv.join(', ')}`));
+    if (r.installed) actions.appendChild(el('span', 'pmeta', 'instalado'));
+    else actions.appendChild(button('instalar', (event) => { event.stopPropagation(); installMcpFromRegistry(r.registry || r.name); }));
+    li.appendChild(actions);
+    mcpSearchResultsEl.appendChild(li);
+  }
+}
+
+export async function installMcpFromRegistry(name) {
+  setStatus('#mcp-search-status', `instalando ${name}…`);
+  const data = await api('/api/mcp/import', { method: 'POST', body: { name } }).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#mcp-search-status', data.error, 'err');
+  const required = (data.requiredEnv ?? []).length ? ` · requiere env: ${data.requiredEnv.join(', ')}` : '';
+  setStatus('#mcp-search-status', `instalado ${data.imported}${required}`, 'ok');
+  await refreshMcp();
+  await refreshMcpCatalog();
+  await searchMcp();
+}
+
+export async function refreshSkillCatalog() {
+  if (!skillCatalogEl) return;
+  const data = await api('/api/skills/catalog').catch(() => null);
+  if (!data) return;
+  clear(skillCatalogEl);
+  for (const entry of data.catalog) {
+    const li = el('li', entry.installed ? 'active' : '');
+    const main = el('div', 'grow');
+    main.append(el('div', '', entry.name), el('div', 'pmeta', entry.description || ''));
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    if (entry.installed) actions.appendChild(el('span', 'pmeta', 'instalada'));
+    else actions.appendChild(button('instalar', (event) => { event.stopPropagation(); installCatalogSkill(entry.id); }));
+    li.appendChild(actions);
+    skillCatalogEl.appendChild(li);
+  }
+}
+
+export async function installCatalogSkill(id) {
+  setStatus('#skill-import-status', `instalando ${id}…`);
+  const data = await api('/api/skills', { method: 'POST', body: { id } }).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#skill-import-status', data.error, 'err');
+  setStatus('#skill-import-status', `instalada ${id} (deshabilitada)`, 'ok');
+  await refreshSkills();
+  await refreshSkillCatalog();
+}
+
+export async function searchSkills() {
+  const input = $('#skill-search');
+  const q = input?.value.trim();
+  if (!q) return;
+  setStatus('#skill-search-status', 'buscando…');
+  const data = await api(`/api/skills/search?q=${encodeURIComponent(q)}`).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#skill-search-status', data.error, 'err');
+  clear(skillSearchResultsEl);
+  if (!data.results.length) {
+    setStatus('#skill-search-status', 'sin resultados');
+    return;
+  }
+  setStatus('#skill-search-status', `${data.results.length} resultado(s)`);
+  for (const r of data.results) {
+    const li = el('li', r.installed ? 'active' : '');
+    const main = el('div', 'grow');
+    main.append(el('div', '', r.source), el('div', 'pmeta', r.description || r.ref));
+    li.appendChild(main);
+    const actions = el('div', 'pactions');
+    if (r.installed) actions.appendChild(el('span', 'pmeta', 'instalada'));
+    else actions.appendChild(button('instalar', (event) => { event.stopPropagation(); installSkillRef(r.ref); }));
+    li.appendChild(actions);
+    skillSearchResultsEl.appendChild(li);
+  }
+}
+
+export async function installSkillRef(ref) {
+  setStatus('#skill-search-status', `instalando ${ref}…`);
+  const data = await api('/api/skills/import', { method: 'POST', body: { ref } }).catch((e) => ({ error: e.message }));
+  if (data?.error) return setStatus('#skill-search-status', data.error, 'err');
+  setStatus('#skill-search-status', `instalada ${data.installed}`, 'ok');
+  await refreshSkills();
+  await refreshSkillCatalog();
+  await searchSkills();
+}
+