kingkont 0.6.2 → 0.7.1

package/index.html

@@ -38,6 +38,21 @@
   }
   .sidebar-footer .hint { color: #777; font-size: 11px; line-height: 1.4; }
   .sidebar-footer .jobs-info { color: #aaccdd; font-size: 11px; }
+  .sidebar-footer .balance-info {
+    display: flex; align-items: center; gap: 6px; font-size: 11px;
+    color: #c4c4c4; padding: 4px 8px; background: #2a2a2a;
+    border: 1px solid #3a3a3a; border-radius: 6px; cursor: pointer;
+    width: fit-content; max-width: 100%;
+    transition: background 0.1s;
+  }
+  .sidebar-footer .balance-info:hover { background: #333; }
+  .sidebar-footer .balance-info .dot {
+    width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0;
+    background: #16a34a;
+  }
+  .sidebar-footer .balance-info.low .dot { background: #f59e0b; }
+  .sidebar-footer .balance-info.empty .dot { background: #dc2626; }
+  .sidebar-footer .balance-info b { color: #fff; font-weight: 500; }
   /* Когда проект ещё не открыт — секции с персонажами/локациями/сценами
      не имеют смысла, скрываем их. Класс ставится в openFilm/closeFilm. */
   body.no-project .sidebar > .sidebar-section,
@@ -786,35 +801,8 @@
   .node-header .delete { cursor: pointer; color: #888; font-size: 16px; line-height: 1; padding: 0 4px; }
   .node-header .delete:hover { color: #f88; }
 
-  .node-name-row {
-    /* Снаружи ноды — под её нижней границей. Контент ноды никогда не перекрывается. */
-    position: absolute; top: 100%; left: 0; right: 0;
-    margin-top: 2px;
-    padding: 4px 8px; background: rgba(28,28,28,0.96);
-    border: 1px solid #383838; border-radius: 6px;
-    opacity: 0; pointer-events: none; z-index: 4;
-    transition: opacity 0.12s;
-    box-shadow: 0 4px 12px rgba(0,0,0,0.5);
-  }
-  /* Невидимая зона под нодой для удержания hover пока курсор «летит» к input.
-     Высота захватывает margin-top + name-row + небольшой запас. */
-  .node::after {
-    content: ''; position: absolute; top: 100%; left: 0; right: 0;
-    height: 44px; pointer-events: none;
-  }
-  .node:hover::after { pointer-events: auto; }
-  .node:hover .node-name-row,
-  .node-name-row:hover, .node-name-row:focus-within {
-    opacity: 1; pointer-events: auto;
-  }
-  .node-name-row .name {
-    width: 100%; background: transparent; border: 1px solid transparent;
-    color: #ddd; font-size: 12px; outline: none;
-    padding: 2px 6px; border-radius: 3px;
-    font-family: ui-monospace, "SF Mono", Menlo, monospace;
-  }
-  .node-name-row .name:hover { border-color: #383838; }
-  .node-name-row .name:focus { background: #1e1e1e; border-color: #6a8aaa; }
+  /* Имя ноды убрано из header — переименование через ПКМ → ✏ Переименовать.
+     Хедер теперь содержит только × delete (и слева пустое место для drag-grab). */
   .node-body { padding: 12px; }
   .node-body video, .node-body audio {
     width: 100%; max-height: 220px; background: #000;
@@ -961,7 +949,7 @@
 <aside class="sidebar">
   <div class="sidebar-header">
     <div class="brand">
-      <img src="assets/logo-square.svg" alt="" draggable="false">
+      <img src="assets/logo-square.svg" alt="" draggable="false" id="brandLogo" title="Дабл-клик — настройки" style="cursor:pointer;">
       <div style="min-width:0; flex:1;">
         <div class="title">KingKont</div>
         <div class="sub" id="brandSub">Видео-редактор</div>
@@ -991,6 +979,10 @@
     <div class="sidebar-list" id="episodeList"></div>
   </div>
   <div class="sidebar-footer">
+    <span id="balanceInfo" class="balance-info" style="display:none;" title="Баланс KingKont-аккаунта · клик — лог списаний" onclick="window.openTxLog && window.openTxLog()">
+      <span class="dot"></span>
+      <span id="balanceValue">— credits</span>
+    </span>
     <span id="jobsInfo" class="jobs-info" style="display:none;"></span>
     <span class="hint">Перетаскивай файлы на холст · @имя для ссылок</span>
   </div>
@@ -999,7 +991,7 @@
 <!-- Welcome-экран: виден только когда body.no-project -->
 <div class="welcome" id="welcome">
   <div class="welcome-inner">
-    <img class="welcome-logo" src="assets/logo-square.svg" alt="" draggable="false">
+    <img class="welcome-logo" src="assets/logo-square.svg" alt="" draggable="false" id="welcomeLogo" title="Дабл-клик — настройки" style="cursor:pointer;">
     <h1 class="welcome-title">KingKont</h1>
     <div class="welcome-sub">Видео-редактор</div>
     <button id="welcomeOpen" class="welcome-open primary">Открыть проект</button>
@@ -1150,6 +1142,37 @@
   </div>
 </div>
 
+<!-- ===== Лог списаний кредитов (Chatium) ===== -->
+<div class="modal hidden" id="txLogModal">
+  <div class="modal-card" style="width: 720px;">
+    <h3 style="display:flex; align-items:center; gap:10px;">
+      Лог списаний
+      <span id="txBalanceLine" style="color:#aaa; font-size:13px; font-weight:400;"></span>
+    </h3>
+    <div id="txLogBody" style="max-height: 60vh; overflow-y: auto; border: 1px solid #383838; border-radius: 4px; background: #1e1e1e;">
+      <div style="padding:24px; text-align:center; color:#888;">Загрузка…</div>
+    </div>
+    <div class="modal-actions">
+      <button id="txLogRefresh">Обновить</button>
+      <span class="spacer"></span>
+      <button id="txLogClose">Закрыть</button>
+    </div>
+  </div>
+</div>
+<style>
+  #txLogBody table { width: 100%; border-collapse: collapse; font-size: 12px; }
+  #txLogBody th { text-align: left; padding: 8px 10px; background: #262626;
+                  color: #888; font-weight: 500; border-bottom: 1px solid #333;
+                  position: sticky; top: 0; }
+  #txLogBody td { padding: 7px 10px; border-bottom: 1px solid #2a2a2a; color: #d4d4d4; vertical-align: top; }
+  #txLogBody tr:hover td { background: #232323; }
+  #txLogBody .tx-amount-neg { color: #ef4444; font-family: ui-monospace, monospace; text-align: right; }
+  #txLogBody .tx-amount-pos { color: #16a34a; font-family: ui-monospace, monospace; text-align: right; }
+  #txLogBody .tx-type { color: #888; font-size: 11px; }
+  #txLogBody .tx-model { color: #aaa; font-size: 11px; font-family: ui-monospace, monospace; }
+  #txLogBody .tx-empty { padding: 32px; text-align: center; color: #888; }
+</style>
+
 
 <!-- ===== Меню «что добавить» (двойной клик на пустом месте холста) ===== -->
 <div class="add-menu hidden" id="addMenu">
@@ -1278,6 +1301,48 @@
         <button class="seg" data-img-model="sdxl-lightning" type="button" title="Очень быстрая (3-5с)">⚡ SDXL Lightning</button>
       </div>
     </label>
+    <label id="videoModelRow" style="display: none;">Модель для видео
+      <div class="seg-control">
+        <button class="seg active" data-vid-model="seedance-2" type="button" title="ByteDance Seedance 2 — основная">Seedance 2</button>
+        <button class="seg" data-vid-model="seedance-2-fast" type="button" title="Быстрее, чуть проще качество">⚡ Seedance 2 Fast</button>
+        <button class="seg" data-vid-model="kling-o1" type="button" title="Kling O1 — креативный, поддерживает reference-видео">Kling O1</button>
+        <button class="seg" data-vid-model="kling-3.0" type="button" title="Kling 3.0 — multi-shot до 15с">Kling 3.0</button>
+      </div>
+    </label>
+    <label id="videoOptionsRow" style="display: none;">Параметры видео
+      <div style="display: flex; gap: 12px; flex-wrap: wrap; margin-top: 6px;">
+        <div style="flex: 1; min-width: 200px;">
+          <div style="font-size: 11px; color: #888; margin-bottom: 4px;">Длительность (сек)</div>
+          <div class="seg-control" id="videoDurationCtl">
+            <button class="seg" data-vid-dur="5" type="button">5</button>
+            <button class="seg" data-vid-dur="6" type="button">6</button>
+            <button class="seg" data-vid-dur="8" type="button">8</button>
+            <button class="seg" data-vid-dur="10" type="button">10</button>
+            <button class="seg" data-vid-dur="12" type="button">12</button>
+            <button class="seg" data-vid-dur="15" type="button">15</button>
+          </div>
+        </div>
+        <div style="flex: 1; min-width: 180px;">
+          <div style="font-size: 11px; color: #888; margin-bottom: 4px;">Разрешение</div>
+          <div class="seg-control" id="videoResolutionCtl">
+            <button class="seg" data-vid-res="480p" type="button">480p</button>
+            <button class="seg" data-vid-res="720p" type="button">720p</button>
+            <button class="seg" data-vid-res="1080p" type="button">1080p</button>
+          </div>
+        </div>
+        <div style="flex: 1; min-width: 240px;">
+          <div style="font-size: 11px; color: #888; margin-bottom: 4px;">Соотношение сторон</div>
+          <div class="seg-control" id="videoAspectCtl">
+            <button class="seg" data-vid-asp="16:9" type="button">16:9</button>
+            <button class="seg" data-vid-asp="9:16" type="button">9:16</button>
+            <button class="seg" data-vid-asp="1:1" type="button">1:1</button>
+            <button class="seg" data-vid-asp="4:3" type="button">4:3</button>
+            <button class="seg" data-vid-asp="3:4" type="button">3:4</button>
+            <button class="seg" data-vid-asp="21:9" type="button">21:9</button>
+          </div>
+        </div>
+      </div>
+    </label>
     <label id="voiceRow" style="display: none;">Голос (ElevenLabs v3)
       <select id="genVoice"></select>
     </label>
@@ -1304,7 +1369,7 @@
     <label id="locPickRow" style="display:none;">Локация
       <select id="locPickSelect"><option value="">— не выбрана —</option></select>
     </label>
-    <label>Описание (prompt) — используй <code style="background:#1e1e1e;padding:1px 4px;border-radius:2px;color:#aae06a;">@имя</code> для ссылок на ноды
+    <label><span style="white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block;">Описание · <span style="color:#aae06a; font-family:ui-monospace,monospace; text-transform:none;">@имя</span> для ссылки на ноду</span>
       <textarea id="genPrompt" placeholder="Опиши, что должно быть. Печатай @ чтобы вставить ссылку на ноду..."></textarea>
       <div id="mentionPopup" class="mention-popup hidden"></div>
     </label>
@@ -1662,7 +1727,11 @@ const state = {
   filmHandle: null,
   currentBoard: null,   // { kind, name, key, handle, metadata, urls }
   genKind: 'image',
-  imageModel: 'nano-banana-2',  // 'nano-banana-2' | 'grok'
+  imageModel: 'nano-banana-2',  // 'nano-banana-2' | 'grok' | ...
+  videoModel: localStorage.getItem('videoModel') || 'seedance-2',  // 'seedance-2' | 'kling-o1' | 'kling-3.0' | ...
+  videoDuration: +(localStorage.getItem('videoDuration') || 5),
+  videoResolution: localStorage.getItem('videoResolution') || '720p',
+  videoAspect: localStorage.getItem('videoAspect') || '9:16',
   jobs: new Map(),      // nodeId -> { boardKey, boardHandle, kind, taskId }
   undoStack: [],        // {type, ...payload}
   zoom: 1,
@@ -1693,6 +1762,36 @@ function logJob(nodeId, msg) {
   if (arr.length > 1000) arr.splice(0, arr.length - 1000);
   console.log(`[${nodeId.slice(0,8)}] ${msg}`);
 }
+
+// Зеркалит логику маршрутизации в server.js — для timeline-лога ноды,
+// чтобы юзер ВИДЕЛ ДО запроса, на какой провайдер уйдут данные. Если
+// настройки не позволяют ни один путь — возвращает 'none' (запрос либо
+// упадёт 503, либо отработает дефолтом — UI всё равно покажет факт).
+async function plannedProvider(kind) {
+  let s;
+  try { s = await window.appSettings.get(); } catch { s = {}; }
+  const hasChatium = !!(s.useChatium && s.chatium?.token && s.chatium?.base);
+  switch (kind) {
+    case 'text':
+      if (hasChatium) return 'chatium';
+      if (s.useOpenrouter !== false) return 'openrouter';
+      return 'none';
+    case 'audio': case 'tts': case 'sfx': case 'music':
+      if (hasChatium) return 'chatium';
+      if (s.useElevenlabs !== false) return 'elevenlabs';
+      return 'none';
+    case 'video':
+      if (hasChatium) return 'chatium';
+      if (s.useKie !== false) return 'kie';
+      return 'none';
+    case 'image':
+      if (hasChatium) return 'chatium';
+      if (s.useKie !== false) return 'kie';
+      return 'none';
+    default:
+      return '?';
+  }
+}
 // Безопасная сериализация для логов: обрезает длинные строки и убирает blob/handle
 function logSafe(obj) {
   try {
@@ -1878,7 +1977,7 @@ window.addEventListener('DOMContentLoaded', async () => {
   // Восстановить состояние панелей таймлайна/превью/реплик
   const tlOpen = localStorage.getItem('timelineOpen') === '1';
   const pvOpen = localStorage.getItem('previewOpen') === '1';
-  const rqOpen = localStorage.getItem('repliquesOpen') === '1';
+  const rqOpen = false; // localStorage.getItem('repliquesOpen') === '1';  — панель реплик скрыта
   if (tlOpen) $('timelinePanel').classList.remove('hidden');
   // Превью больше не скрывается — состояние управляется previewCollapsed
   if (rqOpen) $('repliquesPanel').classList.remove('hidden');
@@ -1913,8 +2012,153 @@ window.addEventListener('DOMContentLoaded', async () => {
     vlog('err', 'restore failed: ' + (e?.message || e));
   }
   await renderWelcomeRecents();
+  // Стартуем обновление баланса. Сразу + каждые 60 сек.
+  refreshBalance().catch(() => {});
+  setInterval(() => { refreshBalance().catch(() => {}); }, 60_000);
+
+  // Дабл-клик на логотипе (sidebar или welcome) → открытие окна настроек.
+  const openSettingsFromLogo = () => {
+    if (window.appSettings?.openSettingsWindow) window.appSettings.openSettingsWindow();
+  };
+  document.getElementById('brandLogo')?.addEventListener('dblclick', openSettingsFromLogo);
+  document.getElementById('welcomeLogo')?.addEventListener('dblclick', openSettingsFromLogo);
 });
 
+// === Баланс Chatium ===
+// Раз в минуту дёргает GET /api/balance (server.js → kingkont.ru). Если
+// chatium отключён или ключа нет — pill в sidebar-footer'е скрывается.
+// Цвет dot'а меняется в зависимости от баланса: green / yellow (<100) /
+// red (≤0). Также экспортирована глобально как window.refreshBalance —
+// чтобы settings-окно могло триггерить обновление после login/logout.
+async function refreshBalance() {
+  const pill = document.getElementById('balanceInfo');
+  const valueEl = document.getElementById('balanceValue');
+  if (!pill || !valueEl) return;
+  try {
+    const s = await window.appSettings.get();
+    if (!s.useChatium || !s.chatium?.token) {
+      pill.style.display = 'none';
+      return;
+    }
+    const r = await fetch('/api/balance');
+    if (!r.ok) {
+      pill.style.display = '';
+      pill.classList.remove('low'); pill.classList.add('empty');
+      valueEl.textContent = `— credits (HTTP ${r.status})`;
+      return;
+    }
+    const d = await r.json();
+    const balance = Number(d.balance) || 0;
+    pill.style.display = '';
+    pill.classList.toggle('low', balance > 0 && balance < 100);
+    pill.classList.toggle('empty', balance <= 0);
+    valueEl.innerHTML = `<b>${balance.toLocaleString('ru-RU')}</b>&nbsp;credits`;
+  } catch (e) {
+    pill.style.display = '';
+    pill.classList.remove('low'); pill.classList.add('empty');
+    valueEl.textContent = `— credits (offline)`;
+  }
+}
+window.refreshBalance = refreshBalance;
+
+// === Лог списаний (модал с историей кредитов) ===
+async function openTxLog() {
+  const modal = document.getElementById('txLogModal');
+  if (!modal) return;
+  modal.classList.remove('hidden');
+  await loadTxLog();
+}
+window.openTxLog = openTxLog;
+
+async function loadTxLog() {
+  const body = document.getElementById('txLogBody');
+  const balanceLine = document.getElementById('txBalanceLine');
+  if (!body) return;
+  body.innerHTML = '<div style="padding:24px; text-align:center; color:#888;">Загрузка…</div>';
+  if (balanceLine) balanceLine.textContent = '';
+  try {
+    const [txR, balR] = await Promise.all([
+      fetch('/api/transactions'),
+      fetch('/api/balance').catch(() => null),
+    ]);
+    if (!txR.ok) {
+      const t = await txR.text().catch(() => '');
+      body.innerHTML = `<div class="tx-empty">Ошибка: HTTP ${txR.status} ${escapeHtmlSafe(t.slice(0, 200))}</div>`;
+      return;
+    }
+    const txs = await txR.json();
+    if (balR && balR.ok) {
+      const b = await balR.json();
+      const n = Number(b.balance) || 0;
+      balanceLine.textContent = `· баланс ${n.toLocaleString('ru-RU')} credits`;
+    }
+    if (!Array.isArray(txs) || txs.length === 0) {
+      body.innerHTML = '<div class="tx-empty">Списаний нет</div>';
+      return;
+    }
+    const rows = txs.map(t => {
+      const amount = Number(t.amount) || 0;
+      const isNeg = amount < 0;
+      const amountStr = (isNeg ? '' : '+') + amount.toLocaleString('ru-RU');
+      const dateStr = formatTxDate(t.createdAt);
+      const typeLabel = formatTxType(t.type);
+      return `
+        <tr>
+          <td style="white-space:nowrap; color:#aaa; font-family:ui-monospace,monospace;">${escapeHtmlSafe(dateStr)}</td>
+          <td>
+            <div>${escapeHtmlSafe(t.description || '—')}</div>
+            <div class="tx-type">${escapeHtmlSafe(typeLabel)}${t.model ? ' · <span class="tx-model">' + escapeHtmlSafe(t.model) + '</span>' : ''}</div>
+          </td>
+          <td class="${isNeg ? 'tx-amount-neg' : 'tx-amount-pos'}">${escapeHtmlSafe(amountStr)}</td>
+        </tr>
+      `;
+    }).join('');
+    body.innerHTML = `
+      <table>
+        <thead>
+          <tr>
+            <th style="width:140px;">Время</th>
+            <th>Описание</th>
+            <th style="width:110px; text-align:right;">Кредиты</th>
+          </tr>
+        </thead>
+        <tbody>${rows}</tbody>
+      </table>
+    `;
+  } catch (e) {
+    body.innerHTML = `<div class="tx-empty">Ошибка: ${escapeHtmlSafe(e?.message || String(e))}</div>`;
+  }
+}
+
+function formatTxDate(ts) {
+  if (!ts) return '—';
+  const d = new Date(ts);
+  return d.toLocaleString('ru-RU', { day: '2-digit', month: '2-digit', year: '2-digit', hour: '2-digit', minute: '2-digit' });
+}
+
+function formatTxType(t) {
+  return ({
+    deduct: 'списание',
+    reserve: 'резерв',
+    reserve_cancelled: 'резерв отменён',
+    refund: 'возврат',
+    topup: 'пополнение',
+    bonus: 'бонус',
+    subscription: 'подписка',
+    renewal: 'продление',
+    correction: 'корректировка',
+  })[t] || t || '—';
+}
+
+function escapeHtmlSafe(s) {
+  return String(s).replace(/[&<>"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
+}
+
+document.getElementById('txLogClose')?.addEventListener('click', () => {
+  document.getElementById('txLogModal').classList.add('hidden');
+});
+document.getElementById('txLogRefresh')?.addEventListener('click', () => loadTxLog());
+
 // === Recents store ===
 // Метаданные ({ name, thumbDataUrl, ts }) — в JSON-файле через recentsStore
 // (переживают quota-reset IDB). FSAH-handle — параллельно в IDB под ключом
@@ -2668,13 +2912,14 @@ async function selectBoard(board) {
   }
   emptyState.classList.add('hidden');
   $('charSettingsBtn').style.display = board.kind === 'character' ? '' : 'none';
-  // Авто-открытие/закрытие панели реплик в зависимости от типа board.
-  if (board.kind === 'character') {
-    openRepliquesFor(board.name).catch(e => console.warn('replicas open failed', e));
-  } else {
-    $('repliquesPanel').classList.add('hidden');
-    localStorage.setItem('repliquesOpen', '0');
-  }
+  // Панель реплик скрыта (юзер попросил убрать из карточки персонажа).
+  // Сами данные реплик в scene.json не трогаем — таймлайн и character-озвучка
+  // продолжают работать. Если понадобится вернуть — расскомментируй ниже.
+  $('repliquesPanel').classList.add('hidden');
+  localStorage.setItem('repliquesOpen', '0');
+  // if (board.kind === 'character') {
+  //   openRepliquesFor(board.name).catch(e => console.warn('replicas open failed', e));
+  // }
   localStorage.setItem(`lastBoard:${state.filmHandle.name}`,
     JSON.stringify({ kind: board.kind, name: board.name }));
   await refreshSidebar();
@@ -2848,42 +3093,15 @@ async function createNodeEl(node) {
 
   const header = document.createElement('div');
   header.className = 'node-header';
-  header.title = 'Тяни, чтобы переместить (или брось на таймлайн — добавится клипом)';
+  header.title = 'Тяни, чтобы переместить. Переименовать — ПКМ → Переименовать.';
+
+  // Имя ноды НЕ показываем в header — было слишком тесно (overflow-проблемы),
+  // переименование вынесено в контекстное меню (ПКМ → ✏ Переименовать).
   const del = document.createElement('span');
   del.className = 'delete'; del.textContent = '×'; del.title = 'Удалить ноду';
   header.appendChild(del);
   el.appendChild(header);
 
-  const nameRow = document.createElement('div');
-  nameRow.className = 'node-name-row';
-  const nameInput = document.createElement('input');
-  nameInput.className = 'name';
-  nameInput.value = node.name || '';
-  nameInput.placeholder = 'имя для @ссылок';
-  nameInput.addEventListener('mousedown', e => e.stopPropagation());
-  nameInput.addEventListener('input', () => { node.name = nameInput.value.trim(); scheduleSave(); });
-  nameInput.addEventListener('blur', async () => {
-    const newName = nameInput.value.trim();
-    if (!newName) { nameInput.value = node.name || ''; return; }
-    if (node.type === 'text' && node.file) {
-      const baseDesired = newName + '.md';
-      const currentBase = node.file.split('/').pop();
-      if (baseDesired === currentBase) return;
-      try {
-        const fh = await resolveBoardFile(state.currentBoard.handle, node.file);
-        const content = await (await fh.getFile()).text();
-        const dir = await getOrCreateBoardSubdir(state.currentBoard.handle, 'texts');
-        const newBase = await uniqueName(dir, baseDesired);
-        await writeFile(dir, newBase, content);
-        await removeBoardFile(state.currentBoard.handle, node.file);
-        node.file = `texts/${newBase}`;
-        scheduleSave();
-      } catch (e) { console.error('rename .md failed', e); }
-    }
-  });
-  nameRow.appendChild(nameInput);
-  el.appendChild(nameRow);
-
   const body = document.createElement('div');
   body.className = 'node-body';
   el.appendChild(body);
@@ -2937,6 +3155,31 @@ async function createNodeEl(node) {
 }
 
 // =================== Контекстное меню ноды (ПКМ) ===================
+async function renameNode(node) {
+  const current = node.name || '';
+  const newName = await askName('Имя ноды (для @-ссылок):', '', current);
+  if (newName == null) return;
+  const trimmed = newName.trim();
+  // Текст-нода: переименовать соответствующий .md файл
+  if (trimmed && node.type === 'text' && node.file) {
+    const baseDesired = trimmed + '.md';
+    const currentBase = node.file.split('/').pop();
+    if (baseDesired !== currentBase) {
+      try {
+        const fh = await resolveBoardFile(state.currentBoard.handle, node.file);
+        const content = await (await fh.getFile()).text();
+        const dir = await getOrCreateBoardSubdir(state.currentBoard.handle, 'texts');
+        const newBase = await uniqueName(dir, baseDesired);
+        await writeFile(dir, newBase, content);
+        await removeBoardFile(state.currentBoard.handle, node.file);
+        node.file = `texts/${newBase}`;
+      } catch (e) { console.error('rename .md failed', e); }
+    }
+  }
+  node.name = trimmed;
+  scheduleSave();
+}
+
 function showNodeContextMenu(node, clientX, clientY) {
   const menu = $('nodeMenu');
   menu.innerHTML = '';
@@ -2948,6 +3191,7 @@ function showNodeContextMenu(node, clientX, clientY) {
     b.addEventListener('click', () => { if (b.disabled) return; menu.classList.add('hidden'); fn(); });
     menu.appendChild(b);
   };
+  add(node.name ? `✏ Переименовать (${node.name})` : '✏ Переименовать', () => renameNode(node));
   add('📋 Логи', () => showNodeLogs(node));
   if (node.generated) add('⚙ Параметры', () => showNodeSettings(node));
   if (node.status === 'generating') {
@@ -3038,6 +3282,9 @@ function showNodeLogs(node) {
     meta.push(`gen.model: ${node.generated.model || node.generated.modelKey || '—'}`);
     meta.push(`gen.taskId: ${node.generated.taskId || '—'}`);
     meta.push(`gen.state: ${node.generated.state || '—'}`);
+    if (typeof node.generated.creditsCharged === 'number') {
+      meta.push(`gen.cost: ${node.generated.creditsCharged} credits`);
+    }
     if (node.generated.voiceId) meta.push(`gen.voice: ${node.generated.voiceName || node.generated.voiceId}`);
     if (node.generated.tones?.length) meta.push(`gen.tones: ${node.generated.tones.join(', ')}`);
     if (node.generated.refs?.length) {
@@ -3263,7 +3510,19 @@ async function renderNodeBody(node, body) {
         node.error = undefined;
         scheduleSave();
         renderNodeBody(node, body);
-        startGenerationJob(node, node.generated.kind, node.generated.prompt, state.currentBoard.handle, state.currentBoard.key);
+        const kind = node.generated.kind;
+        const bH = state.currentBoard.handle;
+        const bK = state.currentBoard.key;
+        if (kind === 'audio') {
+          runTTSJob(node, node.generated.prompt, bH, bK, node.generated.voiceId);
+        } else if (kind === 'text') {
+          const imageRefs = (node.generated.refs || []).filter(r => r.type === 'image' && r.file);
+          const model = node.generated.model || node.generated.modelKey || 'anthropic/claude-sonnet-4';
+          runTextJob(node, node.generated.prompt, model, bH, bK, imageRefs);
+        } else {
+          const refs = (node.generated.refs || []).map(r => ({ name: r.name, type: r.type, file: r.file }));
+          startGenerationJob(node, kind, node.generated.prompt, refs, bH, bK, node.generated.modelKey);
+        }
       });
       wrap.appendChild(retry);
     }
@@ -3497,6 +3756,9 @@ async function openGenerateForRef(fromNode, clientX, clientY, forceKind) {
     document.querySelectorAll('#genModal [data-kind]').forEach(b =>
       b.classList.toggle('active', b.dataset.kind === forceKind));
     $('imageModelRow').style.display = forceKind === 'image' ? '' : 'none';
+    $('videoOptionsRow').style.display = forceKind === 'video' ? '' : 'none';
+
+    $('videoModelRow').style.display = forceKind === 'video' ? '' : 'none';
     $('voiceRow').style.display      = forceKind === 'audio' ? '' : 'none';
     $('tonesRow').style.display      = forceKind === 'audio' ? '' : 'none';
     const titleEl = $('genTitle');
@@ -3515,12 +3777,15 @@ async function openGenerateForRef(fromNode, clientX, clientY, forceKind) {
   $('genSubmit').disabled = false;
 
   resetPicks();
-  presetPicksForBoard();
+  // НЕ вызываем presetPicksForBoard() — иначе при вытягивании ноды из ноды
+  // на доске персонажа авто-подставится этот персонаж в picked-список,
+  // а юзер ожидает чистую форму (он явно не выбирал персонажа).
   renderCharsPickChips();
   renderLocPickSelect();
   syncCharLocRows();
 
-  // Если источник — картинка/видео, кладём его в "Исходный кадр" вместо @-ссылки в промпте
+  // Если источник — картинка/видео, кладём его в "Исходный кадр".
+  // Для VIDEO thumbnail НЕ показываем (юзер просил), только имя.
   if ((fromNode.type === 'image' || fromNode.type === 'video') && fromNode.file) {
     state.sourceRef = {
       file: fromNode.file,
@@ -3528,15 +3793,22 @@ async function openGenerateForRef(fromNode, clientX, clientY, forceKind) {
       boardHandle: state.currentBoard.handle,
       use: true,
     };
-    let thumbUrl = state.currentBoard.urls[fromNode.file];
-    if (!thumbUrl) {
-      try {
-        const fh = await resolveBoardFile(state.currentBoard.handle, fromNode.file);
-        thumbUrl = URL.createObjectURL(await fh.getFile());
-        state.currentBoard.urls[fromNode.file] = thumbUrl;
-      } catch {}
+    if (fromNode.type === 'image') {
+      let thumbUrl = state.currentBoard.urls[fromNode.file];
+      if (!thumbUrl) {
+        try {
+          const fh = await resolveBoardFile(state.currentBoard.handle, fromNode.file);
+          thumbUrl = URL.createObjectURL(await fh.getFile());
+          state.currentBoard.urls[fromNode.file] = thumbUrl;
+        } catch {}
+      }
+      $('sourceRefThumb').src = thumbUrl || '';
+      $('sourceRefThumb').style.display = '';
+    } else {
+      // video — без thumbnail, чтобы не дёргать декодер видео ради превьюшки.
+      $('sourceRefThumb').src = '';
+      $('sourceRefThumb').style.display = 'none';
     }
-    $('sourceRefThumb').src = thumbUrl || '';
     $('sourceRefName').textContent = fromNode.name || fromNode.file.split('/').pop();
     applySourceRefVisuals();
     $('genPrompt').value = '';
@@ -3582,7 +3854,7 @@ function attachResize(el, node, handle) {
 function attachDrag(el, node) {
   const header = el.querySelector('.node-header');
   header.addEventListener('mousedown', e => {
-    if (e.target.closest('.delete') || e.target.closest('.name')) return;
+    if (e.target.closest('.delete')) return;
     // Multi-select c модификаторами — без drag
     if (e.metaKey || e.ctrlKey || e.shiftKey) {
       e.preventDefault();
@@ -3608,6 +3880,22 @@ function attachDrag(el, node) {
       arr.splice(idx, 1);
       arr.push(node);
     }
+
+    // Multi-drag: если выделено несколько нод и кликнули по одной из них —
+    // двигаем всю группу с одинаковым delta. dragTargets: { node, el, origX, origY }.
+    const isMulti = state.selectedNodeIds.size > 1 && state.selectedNodeIds.has(node.id);
+    const dragTargets = isMulti
+      ? arr.filter(n => state.selectedNodeIds.has(n.id)).map(n => ({
+          node: n,
+          el: canvas.querySelector(`.node[data-id="${n.id}"]`),
+          origX: n.x,
+          origY: n.y,
+        })).filter(t => t.el)
+      : [{ node, el, origX, origY }];
+    if (isMulti) {
+      for (const t of dragTargets) t.el.classList.add('selected');
+    }
+
     let dragInitialized = false;     // снято на 1-м move ≥ 4px (избегаем «ложных» переносов)
     let lastTimelineHover = null;    // {trackEl, time} — чтобы рисовать индикатор drop
     let nodePosChanged = false;      // была ли реальная мутация node.x/y
@@ -3625,8 +3913,8 @@ function attachDrag(el, node) {
       const tlTrackEl = document.elementsFromPoint(ev.clientX, ev.clientY)
         .find(n => n.classList?.contains('timeline-track'));
       const isMedia = ['image','video','audio'].includes(node.type) && node.file;
-      if (tlTrackEl && isMedia) {
-        // Drag-out на таймлайн: показываем индикатор drop, не трогаем node.x/y
+      // Drop-on-timeline для multi-drag не имеет смысла — отключаем.
+      if (tlTrackEl && isMedia && !isMulti) {
         const kind = tlTrackEl.dataset.trackKind;
         const compat = (kind === 'video' && (node.type === 'video' || node.type === 'image'))
                     || (kind === 'audio' && node.type === 'audio');
@@ -3652,16 +3940,20 @@ function attachDrag(el, node) {
       dropMarker.style.display = 'none';
       lastTimelineHover = null;
       nodePosChanged = true;
-      node.x = Math.max(0, origX + (ev.clientX - startX) / state.zoom);
-      node.y = Math.max(0, origY + (ev.clientY - startY) / state.zoom);
-      el.style.left = node.x + 'px';
-      el.style.top  = node.y + 'px';
+      const dxNode = (ev.clientX - startX) / state.zoom;
+      const dyNode = (ev.clientY - startY) / state.zoom;
+      for (const t of dragTargets) {
+        t.node.x = Math.max(0, t.origX + dxNode);
+        t.node.y = Math.max(0, t.origY + dyNode);
+        t.el.style.left = t.node.x + 'px';
+        t.el.style.top  = t.node.y + 'px';
+      }
       renderConnections();
     };
     const onUp = async () => {
       document.removeEventListener('mousemove', onMove);
       document.removeEventListener('mouseup', onUp);
-      el.classList.remove('selected');
+      for (const t of dragTargets) t.el.classList.remove('selected');
       el.classList.remove('dragging-to-timeline');
       dropMarker.remove();
       if (lastTimelineHover) {
@@ -4620,6 +4912,11 @@ async function restartJob(nodeId) {
   const kind = node.generated.kind;
   if (kind === 'audio') {
     runTTSJob(node, node.generated.prompt, bHandle, bKey, node.generated.voiceId);
+  } else if (kind === 'text') {
+    // text → /api/text (OpenRouter / Chatium), а не /api/generate (KIE).
+    const imageRefs = (node.generated.refs || []).filter(r => r.type === 'image' && r.file);
+    const model = node.generated.model || node.generated.modelKey || 'anthropic/claude-sonnet-4';
+    runTextJob(node, node.generated.prompt, model, bHandle, bKey, imageRefs);
   } else {
     const refs = (node.generated.refs || []).map(r => ({ name: r.name, type: r.type, file: r.file }));
     startGenerationJob(node, kind, node.generated.prompt, refs, bHandle, bKey, node.generated.modelKey);
@@ -4661,23 +4958,46 @@ async function regenerateNode(node) {
   renderLocPickSelect();
   syncCharLocRows();
 
-  // Исходный кадр — текущий файл ноды (для image/video) станет референсом для модели.
-  if (node.file && (node.type === 'image' || node.type === 'video')) {
+  // Исходный кадр для regenerate:
+  // 1. Если нода была ВЫВЕДЕНА из другой ноды (node.generated.sourceRef есть)
+  //    — это связь с родительской нодой, её надо сохранить через regenerate
+  //    иначе модель сгенерирует не «вариацию из X», а просто новый по промпту.
+  // 2. Иначе video: текущий файл как референс (вариация первого кадра).
+  // 3. Иначе image: НЕ берём свою же картинку — модель просто скопирует.
+  if (node.generated?.sourceRef && node.generated.sourceRef.file) {
+    const sr = node.generated.sourceRef;
     state.sourceRef = {
-      file: node.file,
-      type: node.type,
+      file: sr.file,
+      type: sr.type,
       boardHandle: state.currentBoard.handle,
       use: true,
     };
-    let thumbUrl = state.currentBoard.urls[node.file];
-    if (!thumbUrl) {
-      try {
-        const fh = await resolveBoardFile(state.currentBoard.handle, node.file);
-        thumbUrl = URL.createObjectURL(await fh.getFile());
-        state.currentBoard.urls[node.file] = thumbUrl;
-      } catch {}
+    if (sr.type === 'image') {
+      let thumbUrl = state.currentBoard.urls[sr.file];
+      if (!thumbUrl) {
+        try {
+          const fh = await resolveBoardFile(state.currentBoard.handle, sr.file);
+          thumbUrl = URL.createObjectURL(await fh.getFile());
+          state.currentBoard.urls[sr.file] = thumbUrl;
+        } catch {}
+      }
+      $('sourceRefThumb').src = thumbUrl || '';
+      $('sourceRefThumb').style.display = '';
+    } else {
+      $('sourceRefThumb').src = '';
+      $('sourceRefThumb').style.display = 'none';
     }
-    $('sourceRefThumb').src = thumbUrl || '';
+    $('sourceRefName').textContent = sr.file.split('/').pop();
+    applySourceRefVisuals();
+  } else if (node.file && node.type === 'video') {
+    state.sourceRef = {
+      file: node.file,
+      type: 'video',
+      boardHandle: state.currentBoard.handle,
+      use: true,
+    };
+    $('sourceRefThumb').src = '';
+    $('sourceRefThumb').style.display = 'none';
     $('sourceRefName').textContent = node.name || node.file.split('/').pop();
     applySourceRefVisuals();
   } else {
@@ -4688,6 +5008,9 @@ async function regenerateNode(node) {
   document.querySelectorAll('#genModal [data-kind]').forEach(b =>
     b.classList.toggle('active', b.dataset.kind === state.genKind));
   $('imageModelRow').style.display = state.genKind === 'image' ? '' : 'none';
+  $('videoOptionsRow').style.display = state.genKind === 'video' ? '' : 'none';
+
+  $('videoModelRow').style.display = state.genKind === 'video' ? '' : 'none';
   $('voiceRow').style.display      = state.genKind === 'audio' ? '' : 'none';
 
   if (g.modelKey && state.genKind === 'image') {
@@ -4695,6 +5018,15 @@ async function regenerateNode(node) {
     document.querySelectorAll('#genModal [data-img-model]').forEach(b =>
       b.classList.toggle('active', b.dataset.imgModel === g.modelKey));
   }
+  // Видео: подставляем сохранённые duration/resolution/aspect для regenerate
+  if (state.genKind === 'video') {
+    if (g.duration) state.videoDuration = g.duration;
+    if (g.resolution) state.videoResolution = g.resolution;
+    if (g.aspectRatio) state.videoAspect = g.aspectRatio;
+    if (g.modelKey) state.videoModel = g.modelKey;
+    syncVideoOptionsActive();
+    syncVideoModelActive();
+  }
   if (state.genKind === 'audio') {
     await loadVoices();
     if (g.voiceId) $('genVoice').value = g.voiceId;
@@ -4753,8 +5085,37 @@ async function regenerateInto(node, kind, rawPrompt, opts = {}) {
     }
     const tonePrefix = state.activeTones.map(t => `[${t}]`).join(' ');
     resolvedPrompt = tonePrefix ? `${tonePrefix} ${resolvedRaw}` : resolvedRaw;
+  } else if (kind === 'text') {
+    // Текстовая модель: имя берём как есть (полный slug OpenRouter,
+    // напр. anthropic/claude-sonnet-4). Нет state.textModel — fallback
+    // на сохранённое в ноде или дефолт.
+    modelKey = node.generated?.modelKey || node.generated?.model || 'anthropic/claude-sonnet-4';
+    refs = gatherMediaRefs(rawPrompt);
+    if (opts.sourceRef && opts.sourceRef.file && opts.sourceRef.type === 'image') {
+      const sr = opts.sourceRef;
+      const dup = refs.some(r => r.file === sr.file && r.boardHandle === sr.boardHandle);
+      if (!dup) {
+        refs.unshift({
+          key: '__source__',
+          name: 'исходный кадр',
+          type: 'image',
+          file: sr.file,
+          boardHandle: sr.boardHandle,
+        });
+      }
+    }
+    for (const pr of (opts.pickedSheets || [])) {
+      if (refs.some(r => r.file === pr.file && r.boardHandle === pr.boardHandle)) continue;
+      refs.push(pr);
+    }
+    const missing = refs.filter(r => !r.file || r.status === 'generating');
+    if (missing.length) {
+      alert('Эти ноды ещё не готовы: ' + missing.map(m => '@' + (m.name || m.id)).join(', '));
+      return;
+    }
+    resolvedPrompt = resolveMentions(rawPrompt, refs);
   } else {
-    modelKey = kind === 'image' ? state.imageModel : 'seedance-2';
+    modelKey = kind === 'image' ? state.imageModel : (state.videoModel || 'seedance-2');
     refs = gatherMediaRefs(rawPrompt);
     // Подмешиваем "исходный кадр" — текущий файл ноды как референс при редактировании
     let sourceMarker = '';
@@ -4795,21 +5156,51 @@ async function regenerateInto(node, kind, rawPrompt, opts = {}) {
          'flux-schnell': 'flux/schnell',
          'sdxl-lightning': 'sdxl/lightning',
          'nano-banana-2': 'nano-banana-2' }[modelKey] || 'nano-banana-2')
-    : kind === 'video' ? 'bytedance/seedance-2'
-    : 'eleven_v3';
+    : kind === 'video' ? ({
+        'seedance-2':       'bytedance/seedance-2',
+        'seedance-2-fast':  'bytedance/seedance-2-fast',
+        'kling-o1':         'kwaivgi/kling-o1',
+        'kling-3.0':        'kling-3.0/video',
+      }[modelKey] || 'bytedance/seedance-2')
+    : kind === 'text' ? modelKey      // полный slug OpenRouter
+    : 'eleven_v3';                     // audio
+
+  // sourceRef нужно сохранить через regenerate, иначе при следующем
+  // открытии modal'а связь с родительской нодой потеряется.
+  // Приоритет: то что юзер активно выбрал в UI (opts.sourceRef);
+  // если не выбирал — оставляем то что было раньше в node.generated.sourceRef.
+  const carryoverSourceRef = opts.sourceRef && opts.sourceRef.file
+    ? { file: opts.sourceRef.file, type: opts.sourceRef.type }
+    : (node.generated?.sourceRef || null);
 
   const seedGen = kind === 'audio'
     ? { kind, prompt: resolvedPrompt, rawPrompt, model: modelId, voiceId, voiceName,
         tones: [...state.activeTones], state: 'submitting' }
     : { kind, prompt: resolvedPrompt, rawPrompt, modelKey, model: modelId,
         refs: refs ? refs.map(r => ({ name: r.name, type: r.type, file: r.file })) : [],
+        ...(carryoverSourceRef ? { sourceRef: carryoverSourceRef } : {}),
         state: 'submitting' };
 
-  const newSlot = { file: undefined, generated: seedGen, status: 'generating', error: undefined };
+  // Для text-ноды сохраняем существующий .md-файл (runTextJob перезапишет
+  // его содержимое). Если файла ещё нет — создаём пустой texts/text_X.md
+  // здесь, иначе writeBoardFile упадёт на split('/') от undefined.
+  let preservedFile;
+  if (kind === 'text') {
+    if (node.file) {
+      preservedFile = node.file;
+    } else {
+      const dir = await getOrCreateBoardSubdir(state.currentBoard.handle, 'texts');
+      const mdName = await uniqueName(dir, 'text.md');
+      await writeFile(dir, mdName, '');
+      preservedFile = `texts/${mdName}`;
+    }
+  }
+
+  const newSlot = { file: preservedFile, generated: seedGen, status: 'generating', error: undefined };
   node.history.push(newSlot);
   node.historyIndex = node.history.length - 1;
   node.type = kind;
-  node.file = undefined;
+  node.file = preservedFile;  // для не-text undefined; для text — путь к .md
   node.generated = newSlot.generated;
   node.status = 'generating';
   node.error = undefined;
@@ -4821,6 +5212,8 @@ async function regenerateInto(node, kind, rawPrompt, opts = {}) {
   const bKey = state.currentBoard.key;
   if (kind === 'audio') {
     runTTSJob(node, resolvedPrompt, bHandle, bKey, voiceId);
+  } else if (kind === 'text') {
+    runTextJob(node, resolvedPrompt, modelId, bHandle, bKey, refs);
   } else {
     startGenerationJob(node, kind, resolvedPrompt, refs, bHandle, bKey, modelKey);
   }
@@ -5564,6 +5957,9 @@ function openPhraseFor(charInfo) {
   document.querySelectorAll('#genModal [data-kind]').forEach(b =>
     b.classList.toggle('active', b.dataset.kind === 'audio'));
   $('imageModelRow').style.display = 'none';
+  $('videoOptionsRow').style.display = 'none';
+
+  $('videoModelRow').style.display = 'none';
   $('voiceRow').style.display = '';
   $('tonesRow').style.display = '';
   loadVoices().then(() => {
@@ -5742,6 +6138,9 @@ async function openGenModal(kind) {
     b.classList.toggle('active', b.dataset.kind === kind));
   // Видимость рядов под текущий kind
   $('imageModelRow').style.display = kind === 'image' ? '' : 'none';
+  $('videoOptionsRow').style.display = kind === 'video' ? '' : 'none';
+
+  $('videoModelRow').style.display = kind === 'video' ? '' : 'none';
   $('voiceRow').style.display      = kind === 'audio' ? '' : 'none';
   $('tonesRow').style.display      = kind === 'audio' ? '' : 'none';
   // Заголовок модалки = действие
@@ -5865,11 +6264,14 @@ async function runTextJob(node, prompt, model, boardHandle, bKey, imageRefs) {
       const url = await _imageRefToDataUrl(ref);
       if (url) images.push({ name: ref.name, url });
     }
+    const provider = await plannedProvider('text');
+    logJob(node.id, `→ POST /api/text → ${provider} (model=${model})`);
     const r = await fetch('/api/text', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ prompt, model, images }),
     });
+    logJob(node.id, `← via ${r.headers.get('x-provider') || '?'} HTTP ${r.status}`);
     const data = await r.json();
     if (!r.ok) throw new Error(data?.error || `HTTP ${r.status}`);
     const text = (data.text || '').trim();
@@ -5879,9 +6281,15 @@ async function runTextJob(node, prompt, model, boardHandle, bKey, imageRefs) {
     await mutateNode(bKey, boardHandle, node.id, n => {
       n.text = text;
       n.status = undefined;
-      n.generated = { ...(n.generated || {}), prompt, model: data.model || model, state: 'success' };
+      n.generated = {
+        ...(n.generated || {}),
+        prompt, model: data.model || model, state: 'success',
+        ...(typeof data.cost === 'number' ? { creditsCharged: data.cost } : {}),
+      };
     });
+    if (typeof data.cost === 'number') logJob(node.id, `списано ${data.cost} credits`);
     logJob(node.id, `text-gen done (${text.length} chars)`);
+    if (typeof window.refreshBalance === 'function') window.refreshBalance();
   } catch (e) {
     logJob(node.id, `text-gen failed: ${e?.message || e}`);
     await mutateNode(bKey, boardHandle, node.id, n => {
@@ -5992,11 +6400,15 @@ async function runSfxJob(node, text, durationSeconds, boardHandle, bKey) {
         n.generated = { ...(n.generated || {}), translatedPrompt: enText };
       });
     }
+    const provider = await plannedProvider('sfx');
+    logJob(node.id, `→ POST /api/sfx → ${provider} (dur=${durationSeconds || '-'}s)`);
     const r = await fetch('/api/sfx', {
       method: 'POST', headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ text: enText, durationSeconds }),
     });
+    logJob(node.id, `← via ${r.headers.get('x-provider') || '?'} HTTP ${r.status}`);
     if (!r.ok) throw new Error((await r.text()).slice(0, 300) || `HTTP ${r.status}`);
+    const cost = parseInt(r.headers.get('x-cost-credits') || '', 10);
     const blob = await r.blob();
     const dir = await getOrCreateBoardSubdir(boardHandle, 'audio');
     const baseName = await uniqueName(dir, `sfx_${Date.now()}.mp3`);
@@ -6005,9 +6417,14 @@ async function runSfxJob(node, text, durationSeconds, boardHandle, bKey) {
     await mutateNode(bKey, boardHandle, node.id, n => {
       n.file = relPath;
       n.status = undefined;
-      n.generated = { ...(n.generated || {}), state: 'success' };
+      n.generated = {
+        ...(n.generated || {}), state: 'success',
+        ...(Number.isFinite(cost) ? { creditsCharged: cost } : {}),
+      };
     });
+    if (Number.isFinite(cost)) logJob(node.id, `списано ${cost} credits`);
     logJob(node.id, `sfx saved → ${relPath}`);
+    if (typeof window.refreshBalance === 'function') window.refreshBalance();
   } catch (e) {
     logJob(node.id, `sfx failed: ${e?.message || e}\n${e?.stack || ''}`);
     await mutateNode(bKey, boardHandle, node.id, n => {
@@ -6090,11 +6507,15 @@ async function runMusicJob(node, prompt, durationMs, boardHandle, bKey) {
         n.generated = { ...(n.generated || {}), translatedPrompt: enPrompt };
       });
     }
+    const provider = await plannedProvider('music');
+    logJob(node.id, `→ POST /api/music → ${provider} (dur=${durationMs ? durationMs/1000 + 's' : '-'})`);
     const r = await fetch('/api/music', {
       method: 'POST', headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ prompt: enPrompt, durationMs }),
     });
+    logJob(node.id, `← via ${r.headers.get('x-provider') || '?'} HTTP ${r.status}`);
     if (!r.ok) throw new Error((await r.text()).slice(0, 300) || `HTTP ${r.status}`);
+    const cost = parseInt(r.headers.get('x-cost-credits') || '', 10);
     const blob = await r.blob();
     const dir = await getOrCreateBoardSubdir(boardHandle, 'audio');
     const baseName = await uniqueName(dir, `music_${Date.now()}.mp3`);
@@ -6103,9 +6524,14 @@ async function runMusicJob(node, prompt, durationMs, boardHandle, bKey) {
     await mutateNode(bKey, boardHandle, node.id, n => {
       n.file = relPath;
       n.status = undefined;
-      n.generated = { ...(n.generated || {}), state: 'success' };
+      n.generated = {
+        ...(n.generated || {}), state: 'success',
+        ...(Number.isFinite(cost) ? { creditsCharged: cost } : {}),
+      };
     });
+    if (Number.isFinite(cost)) logJob(node.id, `списано ${cost} credits`);
     logJob(node.id, `music saved → ${relPath}`);
+    if (typeof window.refreshBalance === 'function') window.refreshBalance();
   } catch (e) {
     logJob(node.id, `music failed: ${e?.message || e}`);
     await mutateNode(bKey, boardHandle, node.id, n => {
@@ -6132,6 +6558,9 @@ document.querySelectorAll('#genModal [data-kind]').forEach(b => {
     b.classList.add('active');
     state.genKind = b.dataset.kind;
     $('imageModelRow').style.display = state.genKind === 'image' ? '' : 'none';
+    $('videoOptionsRow').style.display = state.genKind === 'video' ? '' : 'none';
+
+    $('videoModelRow').style.display = state.genKind === 'video' ? '' : 'none';
     $('voiceRow').style.display      = state.genKind === 'audio' ? '' : 'none';
     $('tonesRow').style.display      = state.genKind === 'audio' ? '' : 'none';
     if (state.genKind === 'audio') { loadVoices(); renderTones(); }
@@ -6387,6 +6816,57 @@ document.querySelectorAll('#genModal [data-img-model]').forEach(b => {
     state.imageModel = b.dataset.imgModel;
   });
 });
+// Переключатель модели видео
+document.querySelectorAll('#genModal [data-vid-model]').forEach(b => {
+  b.addEventListener('click', () => {
+    document.querySelectorAll('#genModal [data-vid-model]').forEach(x => x.classList.remove('active'));
+    b.classList.add('active');
+    state.videoModel = b.dataset.vidModel;
+    localStorage.setItem('videoModel', state.videoModel);
+  });
+});
+// Подсветить активную video-модель при открытии modal'а
+function syncVideoModelActive() {
+  document.querySelectorAll('#genModal [data-vid-model]').forEach(b =>
+    b.classList.toggle('active', b.dataset.vidModel === state.videoModel));
+}
+// Переключатели длительности и разрешения для видео
+document.querySelectorAll('#genModal [data-vid-dur]').forEach(b => {
+  b.addEventListener('click', () => {
+    document.querySelectorAll('#genModal [data-vid-dur]').forEach(x => x.classList.remove('active'));
+    b.classList.add('active');
+    state.videoDuration = +b.dataset.vidDur;
+    localStorage.setItem('videoDuration', String(state.videoDuration));
+  });
+});
+document.querySelectorAll('#genModal [data-vid-res]').forEach(b => {
+  b.addEventListener('click', () => {
+    document.querySelectorAll('#genModal [data-vid-res]').forEach(x => x.classList.remove('active'));
+    b.classList.add('active');
+    state.videoResolution = b.dataset.vidRes;
+    localStorage.setItem('videoResolution', state.videoResolution);
+  });
+});
+document.querySelectorAll('#genModal [data-vid-asp]').forEach(b => {
+  b.addEventListener('click', () => {
+    document.querySelectorAll('#genModal [data-vid-asp]').forEach(x => x.classList.remove('active'));
+    b.classList.add('active');
+    state.videoAspect = b.dataset.vidAsp;
+    localStorage.setItem('videoAspect', state.videoAspect);
+  });
+});
+// Helper: подсветить активные кнопки duration/resolution/aspect согласно state.
+// Вызывать при открытии любой формы где видны videoOptions.
+function syncVideoOptionsActive() {
+  document.querySelectorAll('#genModal [data-vid-dur]').forEach(b =>
+    b.classList.toggle('active', +b.dataset.vidDur === state.videoDuration));
+  document.querySelectorAll('#genModal [data-vid-res]').forEach(b =>
+    b.classList.toggle('active', b.dataset.vidRes === state.videoResolution));
+  document.querySelectorAll('#genModal [data-vid-asp]').forEach(b =>
+    b.classList.toggle('active', b.dataset.vidAsp === state.videoAspect));
+}
+syncVideoOptionsActive();
+syncVideoModelActive();
 
 $('genCancel').addEventListener('click', () => {
   state.pendingConnectionFrom = null;
@@ -6519,10 +6999,16 @@ $('genSubmit').addEventListener('click', async () => {
   }
 
   const mediaRefs = gatherMediaRefs(rawPrompt);
-  // "Исходный кадр" — добавляем как первый референс, если включён
+  // "Исходный кадр" — добавляем как первый референс, если включён.
+  // Заодно запоминаем savedSourceRef для записи в node.generated, чтобы
+  // связь с родительской нодой пережила regenerate (см. regenerateNode —
+  // там при следующем открытии modal sourceRef восстанавливается из
+  // node.generated.sourceRef).
   let sourceMarker = '';
+  let savedSourceRef = null;
   if (state.sourceRef && state.sourceRef.use && state.sourceRef.file) {
     const sr = state.sourceRef;
+    savedSourceRef = { file: sr.file, type: sr.type };
     const dup = mediaRefs.some(r => r.file === sr.file && r.boardHandle === sr.boardHandle);
     if (!dup) {
       const refType = sr.type === 'video' ? 'video' : 'image';
@@ -6577,7 +7063,7 @@ $('genSubmit').addEventListener('click', async () => {
       kind,
       prompt: resolvedPrompt,
       rawPrompt,
-      modelKey: kind === 'image' ? state.imageModel : 'seedance-2',
+      modelKey: kind === 'image' ? state.imageModel : (state.videoModel || 'seedance-2'),
       model: kind === 'image'
         ? ({
             'grok': 'grok-imagine/text-to-image',
@@ -6585,8 +7071,22 @@ $('genSubmit').addEventListener('click', async () => {
             'seedream-5-lite': 'seedream/5-lite-text-to-image',
             'nano-banana-2': 'nano-banana-2',
           }[state.imageModel] || 'nano-banana-2')
-        : 'bytedance/seedance-2',
+        : ({
+            'seedance-2':       'bytedance/seedance-2',
+            'seedance-2-fast':  'bytedance/seedance-2-fast',
+            'kling-o1':         'kwaivgi/kling-o1',
+            'kling-3.0':        'kling-3.0/video',
+          }[state.videoModel || 'seedance-2'] || 'bytedance/seedance-2'),
       refs: mediaRefs.map(r => ({ name: r.name, type: r.type, file: r.file })),
+      // Связь с родительской нодой (выведена через "вытягивание"). Хранится
+      // даже если sourceRef.use=false в state — сохраняем структурную связь.
+      ...(savedSourceRef ? { sourceRef: savedSourceRef } : {}),
+      // Параметры видео сохраняем — при regenerate используем те же (предсказуемость).
+      ...(kind === 'video' ? {
+        duration: state.videoDuration,
+        resolution: state.videoResolution,
+        aspectRatio: state.videoAspect,
+      } : {}),
     },
   };
   if (saveOnly) node.status = 'draft';
@@ -6615,27 +7115,35 @@ async function runTTSJob(node, text, boardHandle, bKey, voiceId) {
     await mutateNode(bKey, boardHandle, node.id, n => {
       n.generated = { ...(n.generated || {}), state: 'submitting' };
     });
-    logJob(node.id, `POST /api/tts`);
+    const provider = await plannedProvider('tts');
+    logJob(node.id, `→ POST /api/tts → ${provider} (voice=${voiceId})`);
     const r = await fetch('/api/tts', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({ text, voiceId, modelId: 'eleven_v3' }),
     });
+    logJob(node.id, `← via ${r.headers.get('x-provider') || '?'} HTTP ${r.status}`);
     if (!r.ok) {
       const t = await r.text().catch(() => '');
       logJob(node.id, `tts HTTP ${r.status}: ${t.slice(0,200)}`);
       throw new Error(t || `HTTP ${r.status}`);
     }
+    const cost = parseInt(r.headers.get('x-cost-credits') || '', 10);
     const blob = await r.blob();
     logJob(node.id, `tts response blob ${blob.size} bytes`);
     const dir = await getOrCreateBoardSubdir(boardHandle, 'audio');
     const baseName = await uniqueName(dir, `tts_${Date.now()}.mp3`);
     await writeFile(dir, baseName, blob);
     const relPath = `audio/${baseName}`;
+    if (Number.isFinite(cost)) logJob(node.id, `списано ${cost} credits`);
     logJob(node.id, `tts saved → ${relPath}`);
     await mutateNode(bKey, boardHandle, node.id, n => {
       n.status = undefined; n.error = undefined; n.file = relPath;
+      if (Number.isFinite(cost)) {
+        n.generated = { ...(n.generated || {}), creditsCharged: cost };
+      }
     });
+    if (typeof window.refreshBalance === 'function') window.refreshBalance();
   } catch (e) {
     logJob(node.id, `tts ERROR: ${e.message}`);
     await mutateNode(bKey, boardHandle, node.id, n => {
@@ -6708,6 +7216,11 @@ async function startGenerationJob(node, kind, prompt, mediaRefs, boardHandle, bK
       n.generated = { ...(n.generated || {}), state: 'submitting' };
     });
     const submitBody = { kind, prompt, imageInputs, videoInputs, model: modelKey };
+    if (kind === 'video') {
+      submitBody.duration = node.generated?.duration ?? state.videoDuration;
+      submitBody.resolution = node.generated?.resolution ?? state.videoResolution;
+      submitBody.aspectRatio = node.generated?.aspectRatio ?? state.videoAspect;
+    }
     logJob(node.id, `POST /api/generate body: ${logSafe(submitBody)}`);
     logJob(node.id, `POST /api/generate (image_input=${imageInputs.length}, video_input=${videoInputs.length}, model=${modelKey})`);
     const submitStart = Date.now();
@@ -6720,11 +7233,13 @@ async function startGenerationJob(node, kind, prompt, mediaRefs, boardHandle, bK
       }).catch(() => {});
     }, 5000);
     let r, rawText, data;
+    const provider = await plannedProvider(kind);
+    logJob(node.id, `→ POST /api/generate → ${provider} (kind=${kind} model=${modelKey || '—'})`);
     try {
       r = await fetch('/api/generate', {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ kind, prompt, imageInputs, videoInputs, model: modelKey }),
+        body: JSON.stringify(submitBody),
       });
       rawText = await r.text();
       try { data = JSON.parse(rawText); }
@@ -6735,7 +7250,7 @@ async function startGenerationJob(node, kind, prompt, mediaRefs, boardHandle, bK
       throw e;
     }
     clearInterval(submitTimer);
-    logJob(node.id, `/api/generate → HTTP ${r.status} in ${Date.now() - submitStart}ms`);
+    logJob(node.id, `← via ${r.headers.get('x-provider') || '?'} HTTP ${r.status} in ${Date.now() - submitStart}ms`);
     if (!r.ok || data.error) {
       logJob(node.id, `generate ERROR: ${data.error || rawText.slice(0,200)}`);
       throw new Error(data.error || `HTTP ${r.status}: ${rawText.slice(0,200)}`);
@@ -6773,9 +7288,19 @@ async function resumeJob(node, bKey, boardHandle) {
       updateJobsBadge();
     }
   } else {
-    // Перезагрузка случилась до сабмита: рестарт с фазы upload+submit
-    const refs = (node.generated.refs || []).map(r => ({ name: r.name, type: r.type, file: r.file }));
-    await startGenerationJob(node, node.generated.kind, node.generated.prompt, refs, boardHandle, bKey, node.generated.modelKey);
+    // Перезагрузка случилась до сабмита: рестарт с фазы upload+submit.
+    // Маршрутизируем по kind — audio/text не идут через KIE.
+    const kind = node.generated.kind;
+    if (kind === 'audio') {
+      await runTTSJob(node, node.generated.prompt, boardHandle, bKey, node.generated.voiceId);
+    } else if (kind === 'text') {
+      const imageRefs = (node.generated.refs || []).filter(r => r.type === 'image' && r.file);
+      const model = node.generated.model || node.generated.modelKey || 'anthropic/claude-sonnet-4';
+      await runTextJob(node, node.generated.prompt, model, boardHandle, bKey, imageRefs);
+    } else {
+      const refs = (node.generated.refs || []).map(r => ({ name: r.name, type: r.type, file: r.file }));
+      await startGenerationJob(node, kind, node.generated.prompt, refs, boardHandle, bKey, node.generated.modelKey);
+    }
   }
 }
 
@@ -6813,14 +7338,17 @@ async function pollJob(job, nodeId, bKey, boardHandle, kind) {
       logJob(nodeId, `poll #${pollCount} network ERROR: ${e.message}`);
       continue;
     }
+    // Логируем провайдера только когда меняется state (раз в несколько polls'ов).
+    // Иначе таблица логов забьётся повторами «via kie» каждые 4 секунды.
+    const provider = pr.headers.get('x-provider') || '?';
     if (pd.state && pd.state !== lastState) {
-      logJob(nodeId, `poll #${pollCount} state=${pd.state}`);
+      logJob(nodeId, `poll #${pollCount} via ${provider} state=${pd.state}`);
       lastState = pd.state;
     } else if (pollCount % 6 === 0) {
-      logJob(nodeId, `poll #${pollCount} state=${pd.state || pd.status}`);
+      logJob(nodeId, `poll #${pollCount} via ${provider} state=${pd.state || pd.status}`);
     }
     if (pd.status === 'done') {
-      logJob(nodeId, `KIE done, downloading ${pd.url?.slice(0,80)}`);
+      logJob(nodeId, `done, downloading ${pd.url?.slice(0,80)}`);
       const blob = await (await fetch(`/api/proxy?url=${encodeURIComponent(pd.url)}`)).blob();
       const ext = kind === 'image' ? 'jpg' : 'mp4';
       const sub = kind === 'image' ? 'frames' : 'clips';
@@ -6828,12 +7356,18 @@ async function pollJob(job, nodeId, bKey, boardHandle, kind) {
       const baseName = await uniqueName(dir, `gen_${Date.now()}.${ext}`);
       await writeFile(dir, baseName, blob);
       const relPath = `${sub}/${baseName}`;
+      const cost = typeof pd.cost === 'number' ? pd.cost : null;
+      if (cost !== null) logJob(nodeId, `списано ${cost} credits`);
       logJob(nodeId, `done → file=${relPath} (${blob.size} bytes)`);
       await mutateNode(bKey, boardHandle, nodeId, n => {
         n.status = undefined; n.error = undefined; n.file = relPath;
+        if (cost !== null) {
+          n.generated = { ...(n.generated || {}), creditsCharged: cost };
+        }
       });
       state.jobs.delete(nodeId);
       updateJobsBadge();
+      if (typeof window.refreshBalance === 'function') window.refreshBalance();
       return;
     }
     if (pd.status === 'error') {
@@ -7247,6 +7781,9 @@ async function openGenAudioForTimeline(charInfo, track, time) {
   document.querySelectorAll('#genModal [data-kind]').forEach(b =>
     b.classList.toggle('active', b.dataset.kind === 'audio'));
   $('imageModelRow').style.display = 'none';
+  $('videoOptionsRow').style.display = 'none';
+
+  $('videoModelRow').style.display = 'none';
   $('voiceRow').style.display = '';
   $('tonesRow').style.display = '';
   $('sourceRefRow').style.display = 'none';
@@ -8509,6 +9046,7 @@ async function generateReplicaCached(charInfo, replica) {
     headers: { 'Content-Type': 'application/json' },
     body: JSON.stringify({ text: finalText, voiceId: charInfo.voice, modelId: 'eleven_v3' }),
   });
+  console.log(`[replica TTS] via ${r.headers.get('x-provider') || '?'}`);
   if (!r.ok) {
     const t = await r.text().catch(() => '');
     throw new Error(t || `HTTP ${r.status}`);