kingkont 0.20.16 → 0.20.17

package/index.html

@@ -126,6 +126,7 @@
 
 <main class="main">
   <div class="toolbar">
+    <button id="sidebarToggle" class="kk-mobile-burger" title="Меню сцен" aria-label="Меню сцен">☰</button>
     <button id="addText" class="kk-edit-only" disabled title="Создать пустую текстовую ноду">✏️ Написать</button>
     <button id="genText"  class="kk-edit-only" disabled title="Сгенерировать текст">📝 Текст</button>
     <button id="genAudio" class="kk-edit-only" disabled title="Сгенерировать голос">🎙 Голос</button>

package/lib/providers.js

@@ -110,11 +110,27 @@ const CHATIUM_VIDEO_MODELS = {
   'grok-t2v':         'grok-imagine/text-to-video',
 };
 
-// OpenRouter image-gen модели. Раньше пробовали google/gemini-2.5-flash-image-preview,
-// но OpenRouter отдаёт 404 «No endpoints found» — slug устарел / модель за paywall.
-// Пока пусто = роутинг через OpenRouter не активен → fall through на KIE / Chatium.
-// Если найдётся рабочий slug — вернём.
-const OPENROUTER_IMAGE_MODELS = {};
+// OpenRouter image-gen модели — приоритетный путь для nano-banana
+// (см. startGeneration: orAvailable && orSupportsModel → OpenRouter).
+// OpenRouter регистрирует их буквально как "Nano Banana ..." —
+// сопоставление по их official-названиям:
+//   nano-banana-2 (Gemini 3.1 Flash Image Preview)  → preview, дешевле
+//   nano-banana-pro (Gemini 3 Pro Image Preview)    → выше качество
+// (Slug google/gemini-2.5-flash-image-preview из старого кода устарел —
+//  OpenRouter возвращал «No endpoints found».)
+const OPENROUTER_IMAGE_MODELS = {
+  'nano-banana-2':   'google/gemini-3.1-flash-image-preview',
+  'nano-banana-pro': 'google/gemini-3-pro-image-preview',
+};
+
+// OpenRouter video-gen модели — отдельный API endpoint POST /api/v1/videos
+// (не /chat/completions). Подтверждено: bytedance/seedance-2.0 и -fast
+// доступны (см. /api/v1/videos/models). duration: 4-15s, resolution: 480p/720p
+// (для -2.0 ещё 1080p), aspects: 1:1, 3:4, 9:16, 4:3, 16:9, 21:9, 9:21.
+const OPENROUTER_VIDEO_MODELS = {
+  'seedance-2':      'bytedance/seedance-2.0',
+  'seedance-2-fast': 'bytedance/seedance-2.0-fast',
+};
 
 function resolveModel(map, key, fallback) {
   if (!key) return fallback;
@@ -302,12 +318,18 @@ async function startGeneration(args) {
   //   1) KIE — если useKie=true И KIE_API_KEY И модель поддерживается KIE.
   //   2) Chatium — fallback, либо если модель не входит в KIE.
   //   3) Если ни один не доступен — ошибка.
-  const orKey = modelKey || (kind === 'image' ? 'nano-banana-2' : null);
+  const orKey = modelKey || (kind === 'image' ? 'nano-banana-2' : (kind === 'video' ? 'seedance-2' : null));
   const orAvailable = s.useOpenrouter && process.env.OPENROUTER_API_KEY;
-  const orSupportsModel = kind === 'image' && !!OPENROUTER_IMAGE_MODELS[orKey];
-  if (orAvailable && orSupportsModel) {
+  const orImgModel = kind === 'image' && OPENROUTER_IMAGE_MODELS[orKey];
+  const orVidModel = kind === 'video' && OPENROUTER_VIDEO_MODELS[orKey];
+  if (orAvailable && orImgModel) {
     return await _startGenerationViaOpenRouter({ key: orKey, prompt, imageInputs, aspectRatio });
   }
+  if (orAvailable && orVidModel) {
+    return await _startGenerationViaOpenRouterVideo({
+      key: orKey, prompt, imageInputs, firstFrame, aspectRatio, resolution, duration,
+    });
+  }
 
   const kieMap = kind === 'video' ? KIE_VIDEO_MODELS : KIE_IMAGE_MODELS;
   const kieKey = modelKey || (kind === 'video' ? 'seedance-2' : 'nano-banana-2');
@@ -470,6 +492,48 @@ async function _startGenerationViaOpenRouter({ key, prompt, imageInputs, aspectR
   return { taskId, provider: 'openrouter' };
 }
 
+// OpenRouter video API (отдельный POST /api/v1/videos).
+// Response shape:
+//   POST {prompt, model, duration, aspect_ratio, resolution, image_input?}
+//   → { id, polling_url, status: 'pending' }
+//   GET /videos/<id> → status 'pending' | 'completed' с unsigned_urls
+// taskId формата 'openrouter-vid:<openrouter-id>' — pollGeneration ниже
+// делает GET к polling_url (требует Bearer), при completed возвращает
+// первый из unsigned_urls (тоже с auth — клиент идёт через /api/proxy,
+// proxy-handler в server.js добавит Authorization для openrouter.ai/...).
+async function _startGenerationViaOpenRouterVideo({ key, prompt, imageInputs, firstFrame, aspectRatio, resolution, duration }) {
+  const apiKey = process.env.OPENROUTER_API_KEY;
+  const model = OPENROUTER_VIDEO_MODELS[key];
+  if (!model) throw new Error(`OpenRouter не поддерживает video-модель "${key}"`);
+  const body = { prompt, model };
+  if (duration) body.duration = +duration;
+  if (aspectRatio) body.aspect_ratio = aspectRatio;
+  if (resolution) body.resolution = resolution;
+  // image-to-video: первый кадр или первая ref-картинка.
+  const startImage = firstFrame || (Array.isArray(imageInputs) && imageInputs[0]) || null;
+  if (startImage) body.image_input = startImage;
+  logCall('POST', 'OpenRouter', 'https://openrouter.ai/api/v1/videos',
+    `model=${model} dur=${duration || '-'}s asp=${aspectRatio || '-'} res=${resolution || '-'}`);
+  const r = await fetch('https://openrouter.ai/api/v1/videos', {
+    method: 'POST',
+    headers: {
+      'Authorization': `Bearer ${apiKey}`,
+      'Content-Type': 'application/json',
+      'HTTP-Referer': 'http://localhost',
+      'X-Title': 'KingKont',
+    },
+    body: JSON.stringify(body),
+  });
+  const text = await r.text();
+  let data; try { data = JSON.parse(text); } catch { data = { raw: text }; }
+  if (!r.ok) {
+    const baseMsg = data?.error?.message || data?.raw || `HTTP ${r.status}`;
+    throw new Error(`OpenRouter /videos: ${baseMsg}`);
+  }
+  if (!data.id) throw new Error(`OpenRouter не вернул id: ${text.slice(0, 200)}`);
+  return { taskId: 'openrouter-vid:' + data.id, provider: 'openrouter' };
+}
+
 // Внутренний helper: KIE-путь startGeneration. Вынесен чтобы не дублировать
 // логику между «KIE первичный» и старым «KIE fallback».
 async function _startGenerationViaKie({ kind, prompt, key, imageInputs, videoInputs, aspectRatio, resolution, duration, quality }) {
@@ -557,6 +621,32 @@ async function pollGeneration(taskId, settings) {
     if (r.status === 'error') return { status: 'error', error: r.error, provider: 'openrouter' };
     return { status: 'pending', state: 'generating', provider: 'openrouter' };
   }
+  // OpenRouter video-gen — async, polling-API.
+  if (taskId.startsWith('openrouter-vid:')) {
+    const id = taskId.slice('openrouter-vid:'.length);
+    const apiKey = process.env.OPENROUTER_API_KEY;
+    if (!apiKey) return { status: 'error', error: 'OPENROUTER_API_KEY не задан', provider: 'openrouter' };
+    try {
+      const r = await fetch(`https://openrouter.ai/api/v1/videos/${encodeURIComponent(id)}`, {
+        headers: { 'Authorization': `Bearer ${apiKey}` },
+      });
+      const text = await r.text();
+      let d; try { d = JSON.parse(text); } catch { d = {}; }
+      if (!r.ok) return { status: 'error', error: d?.error?.message || `HTTP ${r.status}`, provider: 'openrouter' };
+      if (d.status === 'completed') {
+        const url = Array.isArray(d.unsigned_urls) && d.unsigned_urls[0];
+        if (!url) return { status: 'error', error: 'OpenRouter video без unsigned_urls', provider: 'openrouter' };
+        const cost = d.usage?.cost ?? null;
+        return { status: 'done', url, cost, provider: 'openrouter' };
+      }
+      if (d.status === 'failed' || d.status === 'error') {
+        return { status: 'error', error: d.error || d.error?.message || 'failed', provider: 'openrouter' };
+      }
+      return { status: 'pending', state: d.status || 'generating', provider: 'openrouter' };
+    } catch (e) {
+      return { status: 'error', error: 'OpenRouter video poll: ' + (e?.message || e), provider: 'openrouter' };
+    }
+  }
 
   if (taskId.startsWith('chatium:')) {
     const realId = taskId.slice('chatium:'.length);

package/main.js

@@ -15,6 +15,50 @@ const { start } = require('./server');
 let win = null;
 let port = null;
 
+// ===== File-логгер для агента-помощника =====
+// Все console.log/warn/error из main + renderer пишутся в один файл,
+// который Claude (помощник разработки) может читать и анализировать.
+// Юзер: «давай ты сам будешь анализировать логи. я использую electron».
+const LOG_FILE_PATH = () => path.join(app.getPath('userData'), 'app.log');
+const LOG_MAX_BYTES = 5 * 1024 * 1024;            // 5MB → ротация в .log.1
+function _rotateLogIfNeeded(p) {
+  try {
+    const st = fs.statSync(p);
+    if (st.size > LOG_MAX_BYTES) {
+      const bak = p + '.1';
+      try { fs.unlinkSync(bak); } catch {}
+      fs.renameSync(p, bak);
+    }
+  } catch {}
+}
+function appLog(prefix, ...args) {
+  const ts = new Date().toISOString();
+  const msg = args.map(a => {
+    if (a instanceof Error) return a.stack || a.message || String(a);
+    if (typeof a === 'string') return a;
+    try { return JSON.stringify(a); } catch { return String(a); }
+  }).join(' ');
+  const line = `${ts} [${prefix}] ${msg}\n`;
+  try {
+    const p = LOG_FILE_PATH();
+    _rotateLogIfNeeded(p);
+    fs.appendFileSync(p, line);
+  } catch {}
+}
+// Hook console.* — origin'ы оставляем, чтобы видеть в stdout тоже.
+const _origLog = console.log.bind(console);
+const _origWarn = console.warn.bind(console);
+const _origErr = console.error.bind(console);
+console.log = (...a) => { _origLog(...a); appLog('main', ...a); };
+console.warn = (...a) => { _origWarn(...a); appLog('warn', ...a); };
+console.error = (...a) => { _origErr(...a); appLog('error', ...a); };
+process.on('uncaughtException',  e => appLog('uncaught', e));
+process.on('unhandledRejection', e => appLog('unhandled', e));
+// IPC из renderer'а — пишем под префиксом renderer:<level>.
+ipcMain.on('app-log:write', (_evt, level, msg) => {
+  appLog('renderer:' + (level || 'log'), msg);
+});
+
 // ===== Native player (опциональный, питон-процесс с mpv) =====
 let nativeProc = null;
 let nativeWsUrl = null;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kingkont",
-  "version": "0.20.16",
+  "version": "0.20.17",
   "description": "KingKont \u00b7 Chatium \u2014 \u043d\u043e\u0434-\u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440 \u0441\u0446\u0435\u043d \u0441 AI-\u0433\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u0435\u0439 (\u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0438/\u0432\u0438\u0434\u0435\u043e/\u0433\u043e\u043b\u043e\u0441/SFX/\u043c\u0443\u0437\u044b\u043a\u0430/\u0442\u0435\u043a\u0441\u0442)",
   "main": "main.js",
   "bin": {

package/preload.js

@@ -112,6 +112,12 @@ contextBridge.exposeInMainWorld('appPath', {
 // Используется renderer'ом в режиме «облачного проекта» (без showDirectoryPicker).
 // На веб-версии (без preload) — undefined; web-shell использует in-memory модель
 // + сразу-на-сервер (см. renderer/cloudFs.js fallback).
+// Renderer → main file-логгер. Используется для проброса console.* в файл,
+// который агент-помощник (Claude) может читать. См. main.js appLog.
+contextBridge.exposeInMainWorld('appLog', {
+  write: (level, msg) => ipcRenderer.send('app-log:write', level, msg),
+});
+
 contextBridge.exposeInMainWorld('cloudFs', {
   ensureProject: (id)             => ipcRenderer.invoke('cloudFs:ensureProject', id),
   list:          (id, rel)        => ipcRenderer.invoke('cloudFs:list', id, rel),

package/renderer/board.js

@@ -256,6 +256,32 @@ window.addEventListener('DOMContentLoaded', async () => {
         e.stopPropagation();
         showProjectContextMenu(e.clientX, e.clientY);
     });
+    // Mobile-burger toggle: открыть/закрыть sidebar в template-просмотре
+    // на узких экранах. CSS показывает кнопку только в view-only-mode @media
+    // (max-width:768px). Клик добавляет/убирает body.sidebar-open → slide-in.
+    // Клик по backdrop'у (::before) тоже закрывает — wire'им через body click.
+    const burger = document.getElementById('sidebarToggle');
+    if (burger) {
+        burger.addEventListener('click', e => {
+            e.stopPropagation();
+            document.body.classList.toggle('sidebar-open');
+        });
+    }
+    document.body.addEventListener('click', e => {
+        if (!document.body.classList.contains('sidebar-open')) return;
+        // Клик в любом месте ВНЕ sidebar/toolbar — закрываем.
+        if (e.target.closest('.sidebar') || e.target.closest('.toolbar')) return;
+        document.body.classList.remove('sidebar-open');
+    });
+    // Клик по элементу sidebar-list (board-item) — закрываем шторку, чтобы
+    // юзер сразу увидел выбранную сцену.
+    document.querySelectorAll('.sidebar-list').forEach(list => {
+        list.addEventListener('click', e => {
+            if (e.target.closest('.item')) {
+                document.body.classList.remove('sidebar-open');
+            }
+        });
+    });
     // Версия приложения на welcome-экране и в шапке проекта (после слова
     // "KingKont"). appInfo.version() — IPC к main → app.getVersion().
     // На веб-версии (без preload) — пропускаем, версия не показывается.
@@ -1643,18 +1669,17 @@ async function openShareModal(p) {
         // В Electron location.origin === http://localhost:17893 — кому
         // отправлять такую ссылку? Принимающий открывает в обычном браузере,
         // там приложение живёт на kingkont.ru. В web используем origin.
-        // Через /app/spaces/client/index.html (auth-aware stub) — он редиректит
-        // на свежую версионированную /static/web-<sha>.html. /static/web.html
-        // напрямую chatium edge-cache намертво держит stale, шарить эту ссылку
-        // нельзя — получатель увидит старую версию.
         const isLocal = /^https?:\/\/(localhost|127\.0\.0\.1)/.test(location.origin);
         const base = isLocal ? 'https://kingkont.ru' : location.origin;
-        return base + '/app/spaces/client/index.html#template=' + proj.id;
+        return base + '/static/web.html#template=' + proj.id;
     }
     function render() {
         const isPub = !!proj.isPublic;
         box.innerHTML = `
-      <h2 style="margin:0 0 16px;font-size:18px;">🤝 Расшарить «${escapeHtml(proj.name || p.name || '')}»</h2>
+      <div style="display:flex;align-items:center;gap:10px;margin:0 0 16px;">
+        <h2 style="margin:0;font-size:18px;flex:1;">🤝 Расшарить «${escapeHtml(proj.name || p.name || '')}»</h2>
+        <button id="shareGoto" title="Открыть проект как зритель (template-view)" style="padding:6px 12px;background:#2a3854;color:#aac8e6;border:1px solid #4a6a9a;border-radius:4px;cursor:pointer;font-size:12px;white-space:nowrap;">↗ Перейти</button>
+      </div>
 
       <div style="background:#1a1a1a;padding:14px;border-radius:6px;margin-bottom:16px;">
         <label style="display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;">
@@ -1730,6 +1755,14 @@ async function openShareModal(p) {
                 pubT.disabled = false;
             }
         });
+        // «Перейти» — открыть зрительскую template-ссылку в новой вкладке.
+        // Полезно автору проверить как проект выглядит для получателя.
+        box.querySelector('#shareGoto')?.addEventListener('click', () => {
+            const url = templateUrl();
+            // В Electron setWindowOpenHandler → shell.openExternal (системный
+            // браузер). В web — обычная новая вкладка.
+            window.open(url, '_blank', 'noopener');
+        });
         // Copy URL
         box.querySelector('#pubCopy')?.addEventListener('click', async () => {
             const inp = box.querySelector('#pubUrl');
@@ -2946,12 +2979,18 @@ function askName(title, placeholder = '', initialValue = '', opts = {}) {
         const h = document.createElement('h3');
         h.textContent = title;
         h.style.cssText = 'margin:0 0 12px; font-size:14px; color:#e0e0e0;';
-        const inp = document.createElement('input');
-        inp.type = 'text';
+        // multiline=true → textarea вместо input (для длинных описаний).
+        const inp = document.createElement(opts.multiline ? 'textarea' : 'input');
+        if (!opts.multiline) inp.type = 'text';
         inp.placeholder = placeholder;
         if (initialValue)
             inp.value = initialValue;
-        inp.style.cssText = 'width:100%; padding:8px 10px; background:#1a1a1a; color:#e0e0e0; border:1px solid #444; border-radius:4px; font-size:14px; margin-bottom:14px;';
+        if (opts.multiline) {
+            inp.rows = 6;
+            inp.style.cssText = 'width:100%; padding:10px; background:#1a1a1a; color:#e0e0e0; border:1px solid #444; border-radius:4px; font-size:13px; line-height:1.5; resize:vertical; min-height:120px; margin-bottom:14px; font-family:inherit;';
+        } else {
+            inp.style.cssText = 'width:100%; padding:8px 10px; background:#1a1a1a; color:#e0e0e0; border:1px solid #444; border-radius:4px; font-size:14px; margin-bottom:14px;';
+        }
         const row = document.createElement('div');
         row.style.cssText = 'display:flex; gap:8px; justify-content:flex-end;';
         const cancel = document.createElement('button');
@@ -2976,6 +3015,8 @@ function askName(title, placeholder = '', initialValue = '', opts = {}) {
         ok.addEventListener('click', () => close(inp.value.trim()));
         inp.addEventListener('keydown', e => {
             if (e.key === 'Enter') {
+                // В textarea Enter добавляет перенос; Cmd/Ctrl+Enter — submit.
+                if (opts.multiline && !(e.metaKey || e.ctrlKey)) return;
                 e.preventDefault();
                 close(inp.value.trim());
             }
@@ -3154,14 +3195,16 @@ $('newLocation').addEventListener('click', async () => {
 //   handle резолвится в момент перехода (через listEpisodes/listCharacters
 //   /listLocations), хранить нельзя — FSAH-handle не сериализуется в JSON.
 function refreshNodeLinkBadge(el, node) {
-    const badge = el.querySelector('.link-badge');
-    if (!badge) return;
-    if (node.linkedBoard?.name) {
-        badge.style.display = '';
-        badge.title = `Дабл-клик / клик: открыть → ${node.linkedBoard.name}`;
-    } else {
-        badge.style.display = 'none';
-    }
+    const goBtn = el.querySelector('.link-go-btn');
+    const has = !!node.linkedBoard?.name;
+    if (goBtn) {
+        goBtn.style.display = has ? '' : 'none';
+        if (has) goBtn.textContent = `Перейти → ${node.linkedBoard.name}`;
+    }
+    // Legacy: удаляем .link-badge из старых нод (если она была вставлена
+    // прежней версией кода). Юзер просил убрать иконку из угла.
+    const legacy = el.querySelector('.link-badge');
+    if (legacy) legacy.remove();
 }
 async function _resolveLinkedBoardHandle(target) {
     if (!state.filmHandle || !target?.name) return null;
@@ -3380,26 +3423,55 @@ async function selectBoard(board) {
     const z = state.zoom || 1;
     document.querySelector('.canvas-frame').style.width = (6000 * z + 2 * padX) + 'px';
     document.querySelector('.canvas-frame').style.height = (4000 * z + 2 * padY) + 'px';
-    if (view) {
-        // Backward-compat старых view (без padding) — добавляем.
-        if (typeof view.scrollLeft === 'number') {
-            canvasWrap.scrollLeft = view.scrollLeft >= padX ? view.scrollLeft : view.scrollLeft + padX;
-        }
-        else
+    // Восстановление scroll-позиции:
+    //   1) Сохранённый view (юзер сам прокрутил и сохранил) → восстанавливаем.
+    //   2) Иначе — скроллим к верхней-левой ноде доски (с 20px gap).
+    //      Юзер: «любую сцену для которой нет сохранённой позиции —
+    //      открывать с верхнего-левого угла». Покрывает и view-only
+    //      template-link, и любые свежесозданные сцены без view.
+    //   3) Если нод нет — fallback на канвас-origin (padX, padY).
+    // Хелпер: scroll к верхней-левой ноде доски (с 20px gap).
+    const scrollToTopLeftNode = () => {
+        const nodes = state.currentBoard.metadata?.nodes || [];
+        if (nodes.length) {
+            const minX = Math.min(...nodes.map(n => n.x ?? 0));
+            const minY = Math.min(...nodes.map(n => n.y ?? 0));
+            const z = state.zoom || 1;
+            canvasWrap.scrollLeft = (minX - 20) * z + padX;
+            canvasWrap.scrollTop  = (minY - 20) * z + padY;
+        } else {
             canvasWrap.scrollLeft = padX;
-        if (typeof view.scrollTop === 'number') {
-            canvasWrap.scrollTop = view.scrollTop >= padY ? view.scrollTop : view.scrollTop + padY;
+            canvasWrap.scrollTop  = padY;
         }
-        else
-            canvasWrap.scrollTop = padY;
+    };
+    // В view-only / #template= ВСЕГДА скроллим к top-left, независимо от
+    // сохранённого автором view. Юзер: «при показе template любую сцену
+    // нужно грузить с верхнего левого угла».
+    const isViewOnly = document.body.classList.contains('view-only-mode')
+        || /^#template=/.test(location.hash || '');
+    const hasSavedView = view && (typeof view.scrollLeft === 'number' || typeof view.scrollTop === 'number');
+    if (isViewOnly) {
+        scrollToTopLeftNode();
+    } else if (hasSavedView) {
+        // view.scrollLeft/Top — это снэпшот canvasWrap.scrollLeft/Top на
+        // момент сохранения, в координатах viewport'а (с учётом padX/padY).
+        // Раньше тут была heuristic-compat: `value >= padX ? value : value+padX`
+        // — предполагалось что старые сохранения без padding'а маленькие.
+        // Но юзер может валидно скроллить В padding-зону (negative canvas-
+        // coords) → новый save имеет scrollLeft < padX → heuristic считал
+        // это legacy и добавлял padX → восстановление в неправильное место.
+        // Юзер: «сохранение не происходит когда мы сдвигаемся в область
+        // отрицательных значений». Теперь восстанавливаем как-есть.
+        if (typeof view.scrollLeft === 'number') canvasWrap.scrollLeft = view.scrollLeft;
+        else canvasWrap.scrollLeft = padX;
+        if (typeof view.scrollTop === 'number') canvasWrap.scrollTop = view.scrollTop;
+        else canvasWrap.scrollTop = padY;
     }
     else {
-        canvasWrap.scrollLeft = padX;
-        canvasWrap.scrollTop = padY;
+        scrollToTopLeftNode();
     }
-    // Auto-scroll к bbox нод если ни одна не попадает в viewport.
-    // Frame уже ресайзнут синхронно выше, scroll проставлен корректно —
-    // в next frame _autoScrollToNodesIfHidden имеет валидную картинку.
+    // Auto-scroll к bbox нод если ни одна не попадает в viewport
+    // (защита для legacy-проектов с сохранённым view далеко от нод).
     requestAnimationFrame(() => _autoScrollToNodesIfHidden(padX, padY));
     // Возобновить незавершённые джобы текущей доски
     for (const n of state.currentBoard.metadata.nodes) {
@@ -3837,16 +3909,20 @@ async function createNodeEl(node) {
     el.appendChild(anchor);
     attachAnchor(node, el, anchor);
     attachDrag(el, node);
-    // Link-badge: показывает 🔗 если у ноды есть linkedBoard (ссылка на сцену).
-    // Сам badge кликабельный — переход выполняется также через dblclick по ноде.
-    const linkBadge = document.createElement('div');
-    linkBadge.className = 'link-badge';
-    linkBadge.textContent = '🔗';
-    el.appendChild(linkBadge);
-    linkBadge.addEventListener('click', e => {
+    // Большая явная кнопка «Перейти →» снизу ноды (юзер: «когда есть ссылка
+    // на сцену нужна явная кнопка прям снизу ноды, чуть выше нижней границы»).
+    // Видна только когда linkedBoard.name есть — refreshNodeLinkBadge ниже.
+    // Маленького 🔗-badge в углу нет — юзер: «иконку ссылки сверху-справа
+    // нужно убрать», кнопка снизу — достаточно явный индикатор.
+    const linkGo = document.createElement('button');
+    linkGo.className = 'link-go-btn';
+    linkGo.type = 'button';
+    el.appendChild(linkGo);
+    linkGo.addEventListener('click', e => {
         e.stopPropagation();
         if (node.linkedBoard?.name) goToLinkedBoard(node);
     });
+    linkGo.addEventListener('mousedown', e => e.stopPropagation());
     refreshNodeLinkBadge(el, node);
     el.addEventListener('dblclick', e => {
         if (e.target.closest('textarea, input, video, button, .delete, .anchor, .resize-handle, [contenteditable]'))
@@ -3883,6 +3959,11 @@ async function createNodeEl(node) {
         e.stopPropagation();
         showNodeContextMenu(node, e.clientX, e.clientY);
     });
+    // Sidecar-описание для image/video — отдельный элемент на canvas'е
+    // (ensureNodeDescriptionEl идемпотентно создаёт/обновляет/удаляет).
+    // Вызывается ЗДЕСЬ, чтобы покрыть все вызовы createNodeEl: renderCanvas
+    // / generate.js (новые ноды) / timeline.js / drawings.js / chat.js.
+    if (typeof ensureNodeDescriptionEl === 'function') ensureNodeDescriptionEl(node);
     return el;
 }
 // =================== Контекстное меню ноды (ПКМ) ===================
@@ -4027,6 +4108,28 @@ function showNodeContextMenu(node, clientX, clientY) {
     if (node.type === 'image' || node.type === 'video' || node.type === 'audio') {
         add('➕ В таймлайн', () => addToTimeline(node));
     }
+    // Описание ноды: текст-аннотация привязанная к медиа (вместо отдельной
+    // text-ноды). Юзер: «чтобы вместо текстовой ноды можно было использовать
+    // описание, приложенное к картинке». Inline-textarea под медиа уже есть
+    // (см. renderNodeBody), это удобный picker для крупного редактирования.
+    if (node.type === 'image' || node.type === 'video') {
+        const hasDesc = !!(node.description && node.description.trim());
+        add(hasDesc ? '📝 Изменить описание…' : '📝 Добавить описание…', async () => {
+            const next = await askName(
+                'Описание ноды (Cmd+Enter — сохранить):',
+                'Например: лес ночью, луна за облаками, тишина',
+                node.description || '',
+                { multiline: true, okText: 'Сохранить' },
+            );
+            if (next == null) return;
+            node.description = next;
+            scheduleSave();
+            // Sidecar-описание — отдельный элемент на canvas'е, см.
+            // ensureNodeDescriptionEl в settings.js. Идемпотентно: пересоздаёт/
+            // удаляет/обновляет в зависимости от того, есть ли текст.
+            if (typeof ensureNodeDescriptionEl === 'function') ensureNodeDescriptionEl(node);
+        });
+    }
     // Image-нода как обложка проекта — копируется в `<project>/.cover.<ext>`,
     // оттуда подхватывается generateProjectThumb (для recents и шаблонов).
     if (node.type === 'image' && node.file && state.filmHandle) {

package/renderer/cloudProjects.js

@@ -367,6 +367,12 @@
               await _downloadAllTexts(projectId, bgBoards).catch(() => {});
               // Перечитываем тексты ТЕКУЩЕЙ доски (другие — при switchBoard).
               await _refreshCurrentBoardTexts().catch(() => {});
+              // Проверяем — изменился ли проект на сервере с момента нашего
+              // последнего sync'а. Юзер: «когда заходим в облачный проект —
+              // в фоне проверяем есть ли изменения на сервере; если есть —
+              // показываем модалку Проект изменён на сервере. Загрузить?».
+              // Сравниваем server.updatedAt vs local meta.syncedAt.
+              await _maybeOfferReloadFromServer(projectId, p, meta).catch(() => {});
             }).catch(() => {});
             return;
           }
@@ -526,6 +532,44 @@
     await Promise.all(Array.from({ length: CONCURRENCY }, worker));
   }
 
+  // Проверка: проект изменился на сервере с момента нашего последнего sync'а?
+  // Если да — показываем модалку «Загрузить свежую версию?».
+  //   • Только Electron (window.cloudFs) — в вебе локальной копии нет,
+  //     все данные всегда свежие с сервера, проверка бессмысленна.
+  //   • Только edit-режим (canModify=true) — в template/view-only юзер
+  //     просматривает чужой проект, его не должно дёргать предложение
+  //     «загрузить свежую версию» (нечего перезаписывать локально).
+  async function _maybeOfferReloadFromServer(projectId, serverProj, localMeta) {
+    // ВРЕМЕННО ОТКЛЮЧЕНО. Юзер: «отключи проверку 'что что-то изменено',
+    // а то она сейчас неправильно работает в электроне». Причины ложных
+    // срабатываний (предположительно): localMeta.syncedAt не обновляется
+    // надёжно после save'а из Electron'а → server.updatedAt всегда выглядит
+    // «новее», и юзера дёргает модалка после каждого открытия проекта.
+    // Нужно сначала разобраться с syncedAt-bookkeeping, потом включать.
+    return;
+    // eslint-disable-next-line no-unreachable
+    if (!window.cloudFs) return;                 // только Electron
+    if (!serverProj?.canModify) return;          // только edit-mode (не template)
+    if (!state.cloudProjectId || state.cloudProjectId !== projectId) return;
+    const serverUpdatedAt = +serverProj?.updatedAt || 0;
+    const localSyncedAt   = +localMeta?.syncedAt   || 0;
+    // 5-секундный grace — на случай небольшого drift'а часов между нашим
+    // save'ом и server-side updatedAt (записывается БД при апдейте).
+    if (serverUpdatedAt <= localSyncedAt + 5000) return;
+    // Уже спрашивали для этого ts — не докучаем повторно.
+    if (state._cloudReloadAskedAt === serverUpdatedAt) return;
+    state._cloudReloadAskedAt = serverUpdatedAt;
+    const dirtyWarn = state.cloudDirty
+      ? '\n\n⚠ У вас есть локальные несохранённые изменения — они потеряются.'
+      : '';
+    const ok = confirm(
+      `Проект изменён на сервере (после вашего последнего открытия).\n` +
+      `Загрузить свежую версию?${dirtyWarn}`
+    );
+    if (!ok) return;
+    await openCloudProject(projectId, serverProj?.name, { forceRefresh: true });
+  }
+
   // Перечитать .md-контент text-нод текущей доски из FS и обновить DOM.
   // Используется после фонового _downloadAllTexts — если тексты пришли
   // ПОСЛЕ openFilm, ноды показывают пустые textarea, пока этот хук не
@@ -955,6 +999,27 @@
       }
 
       // 3) Update server record.
+      // Лог для диагностики (юзер: «откуда там 8 файлов? на экране 4»):
+      // считает разрыв между тем что на доске визуально и что отправляется.
+      const _binFilesCount = Object.keys(allFilesIndex).length;
+      const _textsByBoard = manifestBoards.map(b => ({
+        board: `${b.kind}/${b.name}`,
+        files: Object.keys(b.files || {}),
+        texts: Object.keys(b.texts || {}),
+        nodes: (b.scene?.nodes || []).length,
+        nodeTypes: (b.scene?.nodes || []).reduce((acc, n) => {
+          acc[n.type] = (acc[n.type] || 0) + 1; return acc;
+        }, {}),
+      }));
+      console.log('[cloudProjects] save → chatium:', {
+        projectId,
+        binFilesTotal: _binFilesCount,
+        textsTotal: manifestBoards.reduce((s, b) => s + Object.keys(b.texts || {}).length, 0),
+        uploadedCount: uploaded,
+        reusedCount: reused,
+        boards: _textsByBoard,
+        allFilesKeys: Object.keys(allFilesIndex),
+      });
       PROGRESS.update(uploaded, total, 'Сохранение на сервере…');
       const updateR = await fetch('/api/projects/' + encodeURIComponent(projectId), {
         method: 'POST',

package/renderer/drawings.js

@@ -130,7 +130,10 @@
     svg.setAttribute('width', '6000');
     svg.setAttribute('height', '4000');
     svg.setAttribute('class', 'drawing-preview');
-    svg.style.cssText = 'position:absolute;left:0;top:0;pointer-events:none;z-index:1000;';
+    // overflow:visible — иначе SVG клипит preview-path в отрицательной зоне
+    // (когда юзер рисует в canvas-frame-padding). _canvasCoord возвращает
+    // отрицательные x/y; без overflow:visible эти точки не отрисуются.
+    svg.style.cssText = 'position:absolute;left:0;top:0;pointer-events:none;z-index:1000;overflow:visible;';
     c.appendChild(svg);
     return svg;
   }
@@ -249,8 +252,17 @@
   window.boardDrawings = { setTool, renderInto, smoothPath, arrowHead, toolStyle };
 
   document.addEventListener('DOMContentLoaded', () => {
-    const canvas = document.getElementById('canvas');
-    if (canvas) canvas.addEventListener('mousedown', _onMouseDown, true);
+    // Слушаем mousedown НА canvas-frame, а не на .canvas. canvas-frame
+    // имеет padding (padX/padY) вокруг .canvas — это «отрицательная зона»
+    // (canvas-coord < 0 или > 6000), которую юзер видит и в которой хочет
+    // рисовать. mousedown на .canvas не срабатывает за пределами 6000×4000,
+    // даже если внутри padding. Юзер: «рисовать в отрицательной области
+    // тоже не получается». _canvasCoord возвращает координаты от .canvas-
+    // bounding-rect — значения становятся отрицательными для кликов слева/
+    // сверху от canvas. minX/minY в bbox-расчёте это переживают (нода с
+    // x<0 валидна, см. drag-handler без Math.max(0,...) клампа).
+    const frame = document.getElementById('canvasFrame');
+    if (frame) frame.addEventListener('mousedown', _onMouseDown, true);
     document.addEventListener('keydown', _onKeyDown);
     document.querySelectorAll('[data-draw-tool]').forEach(b => {
       b.addEventListener('click', () => setTool(b.dataset.drawTool));

package/renderer/generate.js

@@ -1974,9 +1974,13 @@ async function startGenerationJob(node, kind, prompt, mediaRefs, boardHandle, bK
     // Так per-board настройка перебивает глобальный фоллбэк.
     const boardAspect = state.currentBoard?.metadata?.settings?.aspectRatio || null;
     if (kind === 'video') {
-      submitBody.duration = node.generated?.duration ?? state.videoDuration;
+      // Явное приведение к Number — иначе если state.videoDuration хранится
+      // строкой ("8") chatium-side ALLOWED_PARAMS пропустит, но Replicate
+      // может молча проигнорировать и взять дефолт.
+      submitBody.duration = +(node.generated?.duration ?? state.videoDuration) || 5;
       submitBody.resolution = node.generated?.resolution ?? state.videoResolution;
       submitBody.aspectRatio = node.generated?.aspectRatio ?? boardAspect ?? state.videoAspect;
+      logJob(node.id, `video params: duration=${submitBody.duration}s resolution=${submitBody.resolution} aspect=${submitBody.aspectRatio} model=${modelKey}`);
     } else if (kind === 'image') {
       // Grok-imagine требует aspect_ratio из {2:3, 3:2, 1:1, 9:16, 16:9}.
       // Остальные модели (nano-banana-2, seedream и др.) тоже принимают.

package/renderer/media.js

@@ -94,22 +94,117 @@ $('zoomIn').addEventListener('click',  () => applyZoom(state.zoom * 1.25));
 $('zoomOut').addEventListener('click', () => applyZoom(state.zoom / 1.25));
 $('zoomLabel').addEventListener('click', () => applyZoom(1));
 
-// Сохранение pan/zoom для текущей доски
+// =================== Pinch-zoom (touch) ===================
+// Мобильный/таблет: pinch двумя пальцами → zoom вокруг midpoint двух тачей.
+// Браузерный native pinch-zoom (visualViewport) масштабирует ВЕСЬ layout
+// и ломает координаты — поэтому touch-action: pan-x pan-y отключает его в
+// view-only-mode (см. styles.css), а мы делаем canvas-zoom вручную через
+// applyZoom() с координатным якорем посередине pinch'а.
+// Якорь = midpoint двух touch'ей в client-coords (как у wheel-ctrl-zoom).
+// Ratio = currentDist / startDist → applyZoom(startZoom * ratio, midX, midY).
+let _pinchStartDist = 0;
+let _pinchStartZoom = 1;
+let _pinchActive = false;
+let _pinchRaf = null;
+let _pinchPendingMid = null;
+function _touchDist(t1, t2) {
+  const dx = t2.clientX - t1.clientX;
+  const dy = t2.clientY - t1.clientY;
+  return Math.hypot(dx, dy);
+}
+function _touchMid(t1, t2) {
+  return { x: (t1.clientX + t2.clientX) / 2, y: (t1.clientY + t2.clientY) / 2 };
+}
+canvasWrap.addEventListener('touchstart', e => {
+  if (e.touches.length === 2) {
+    _pinchActive = true;
+    _pinchStartDist = _touchDist(e.touches[0], e.touches[1]);
+    _pinchStartZoom = state.zoom;
+    // Предотвращаем native pinch только если у нас 2-touch жест.
+    // 1-touch (pan) пропускаем — native scroll работает.
+    e.preventDefault();
+  }
+}, { passive: false });
+canvasWrap.addEventListener('touchmove', e => {
+  if (!_pinchActive || e.touches.length !== 2) return;
+  e.preventDefault();
+  const dist = _touchDist(e.touches[0], e.touches[1]);
+  const mid = _touchMid(e.touches[0], e.touches[1]);
+  if (_pinchStartDist <= 0) return;
+  const ratio = dist / _pinchStartDist;
+  _pinchPendingMid = { mid, target: _pinchStartZoom * ratio };
+  if (_pinchRaf) return;
+  _pinchRaf = requestAnimationFrame(() => {
+    _pinchRaf = null;
+    const p = _pinchPendingMid;
+    if (!p) return;
+    applyZoom(p.target, p.mid.x, p.mid.y);
+  });
+}, { passive: false });
+function _endPinch() {
+  _pinchActive = false;
+  _pinchStartDist = 0;
+  if (_pinchRaf) { cancelAnimationFrame(_pinchRaf); _pinchRaf = null; }
+  _pinchPendingMid = null;
+}
+canvasWrap.addEventListener('touchend', e => {
+  if (e.touches.length < 2) _endPinch();
+});
+canvasWrap.addEventListener('touchcancel', _endPinch);
+
+// Сохранение pan/zoom для текущей доски.
+// Раньше 400ms debounce: scroll → 400ms wait → set view → scheduleSave 300ms
+// → write. Юзер закрывал таб быстрее → save не успевал → позиция терялась.
+// Теперь 100ms debounce + явный flush на pagehide/beforeunload.
 let viewSaveTimer = null;
+function _updateViewFromScroll() {
+  if (!state.currentBoard) return;
+  state.currentBoard.metadata.view = {
+    scrollLeft: canvasWrap.scrollLeft,
+    scrollTop:  canvasWrap.scrollTop,
+    zoom: state.zoom,
+  };
+}
 function scheduleViewSave() {
   if (!state.currentBoard) return;
   clearTimeout(viewSaveTimer);
   viewSaveTimer = setTimeout(() => {
-    if (!state.currentBoard) return;
-    state.currentBoard.metadata.view = {
-      scrollLeft: canvasWrap.scrollLeft,
-      scrollTop:  canvasWrap.scrollTop,
-      zoom: state.zoom,
-    };
+    _updateViewFromScroll();
     scheduleSave();
-  }, 400);
+  }, 100);
 }
 canvasWrap.addEventListener('scroll', scheduleViewSave);
+// На выгрузке страницы: немедленно перенесём scroll в metadata + flush
+// save СРАЗУ (минуя debounce). Без этого юзер скроллил, закрывал таб через
+// 200мс — viewSaveTimer не успевал отстреляться. Используем 'pagehide'
+// (срабатывает на close-tab/navigate AND back-forward-cache), плюс
+// 'visibilitychange' с 'hidden' (более надёжно на mobile/system-sleep).
+function _flushViewSave() {
+  if (!state.currentBoard) return;
+  clearTimeout(viewSaveTimer);
+  _updateViewFromScroll();
+  // Прямой синхронный вызов сохранения вместо scheduleSave (которое
+  // ставит ещё один 300ms timer и тоже может не успеть на unload).
+  clearTimeout(saveTimer); saveTimer = null;
+  _runSaveNow().catch(() => {});
+}
+window.addEventListener('pagehide', _flushViewSave);
+window.addEventListener('beforeunload', _flushViewSave);
+document.addEventListener('visibilitychange', () => {
+  if (document.visibilityState === 'hidden') _flushViewSave();
+});
+// Глобальный flush — зовётся из closeProject ПЕРЕД обнулением state.currentBoard.
+// Без этого pending viewSaveTimer/saveTimer срабатывали уже после того как
+// state.currentBoard стал null → write скипался → позиция терялась.
+// (closeProject уже вызывал `window.flushScheduledSave` через typeof-guard,
+//  но функция нигде не была определена — guard скрывал баг.)
+window.flushScheduledSave = async function () {
+  if (!state.currentBoard) return;
+  clearTimeout(viewSaveTimer);
+  clearTimeout(saveTimer); saveTimer = null;
+  _updateViewFromScroll();
+  await _runSaveNow();
+};
 
 // =================== Скачивание аудио на выбранной скорости (ffmpeg.wasm atempo) ===================
 let ffmpegInstance = null;

package/renderer/settings.js

@@ -552,23 +552,15 @@ async function renderNodeBody(node, body) {
       playRow.appendChild(playBtn);
       body.appendChild(playRow);
     }
-    // Описание (опц.) — для image/video нод. Юзер: «под каждой нодой
-    // картинки или видео должно быть возможно добавить описание».
-    // Хранится в node.description (scene.json). Показываем всегда (даже
-    // пустым) — клик в textarea = начать писать.
-    if (node.type === 'image' || node.type === 'video') {
-      const desc = document.createElement('textarea');
-      desc.className = 'node-description';
-      desc.placeholder = 'Описание (опц.)';
-      desc.value = node.description || '';
-      desc.rows = 1;
-      desc.addEventListener('mousedown', e => e.stopPropagation());
-      desc.addEventListener('input', () => {
-        node.description = desc.value;
-        scheduleSave();
-      });
-      body.appendChild(desc);
-    }
+    // Описание (опц.) — read-only текст под медиа. Редактирование через
+    // ПКМ «📝 Изменить описание…» (открывает большую textarea-модалку).
+    // ВАЖНО: рендерится НЕ внутри .node (image/video задают фиксированный
+    // aspect-ratio высоты, всё ниже обрезается content-visibility:auto
+    // и paint-containment). Юзер: «давай попробуем показать описание
+    // ВНЕ этой ноды, но так чтобы оно с ней перемещалось». Описание —
+    // отдельный sibling-элемент `.node-description-outside` на canvas'е,
+    // позиционируется в (node.x, node.y+node.height+4), width=node.width.
+    // Перемещается через ensureNodeDescriptionEl (вызывается из drag/resize).
   } else if (node.type === 'image' && !node.file && (node.generated?.rawPrompt || node.generated?.prompt)) {
     // Image-нода с промптом, но без файла (ещё не генерилась).
     // Кнопка ▶ Запустить — сверху (без декоративной 🖼-иконки и
@@ -589,6 +581,48 @@ async function renderNodeBody(node, body) {
   }
 }
 
+// Описание image/video-ноды отрисовывается ВНЕ ноды (sibling на canvas'е).
+// Раньше пробовали инлайн внутри .node — но image/video задают высоту через
+// aspect-ratio + paint-containment у .node клипит всё что вне bbox. Юзер:
+// «попробуем показать описание ВНЕ этой ноды, но так чтобы оно с ней
+// перемещалось… совпадало с ней по ширине, а высота — сколько займет текст».
+// Идемпотентно: пересоздаёт DOM, если описание изменилось/добавилось/удалилось.
+function ensureNodeDescriptionEl(node) {
+  if (!node) return null;
+  const canvasEl = document.getElementById('canvas');
+  if (!canvasEl) return null;
+  const text = (node.type === 'image' || node.type === 'video') ? (node.description || '').trim() : '';
+  const sel = `.node-description-outside[data-desc-for="${node.id}"]`;
+  let el = canvasEl.querySelector(sel);
+  if (!text) {
+    // Описания нет — удаляем sidecar.
+    if (el) el.remove();
+    return null;
+  }
+  if (!el) {
+    el = document.createElement('div');
+    el.className = 'node-description-outside';
+    el.dataset.descFor = node.id;
+    canvasEl.appendChild(el);
+  }
+  if (el.textContent !== text) el.textContent = text;
+  positionNodeDescriptionEl(node, el);
+  return el;
+}
+function positionNodeDescriptionEl(node, el) {
+  if (!el) el = document.querySelector(`.node-description-outside[data-desc-for="${node.id}"]`);
+  if (!el) return;
+  const w = node.width || 280;
+  const h = node.height || 200;
+  const GAP = 4;
+  el.style.left  = node.x + 'px';
+  el.style.top   = (node.y + h + GAP) + 'px';
+  el.style.width = w + 'px';
+}
+function removeNodeDescriptionEl(nodeId) {
+  const el = document.querySelector(`.node-description-outside[data-desc-for="${nodeId}"]`);
+  if (el) el.remove();
+}
 // Подгоняет node.height под natural-aspect медиа (image/video). Сохраняет
 // текущую node.width, пересчитывает height = width * (natH/natW) + chrome.
 // Без этого после генерации (или history-undo на ноду с другим aspect'ом)
@@ -612,6 +646,7 @@ function fitNodeHeightToMedia(node, nodeEl, mediaEl) {
   node.height = newH;
   nodeEl.style.height = newH + 'px';
   if (typeof renderConnections === 'function') renderConnections();
+  positionNodeDescriptionEl(node);
   scheduleSave();
 }
 
@@ -916,6 +951,8 @@ function attachResize(el, node, handle) {
       // out, левая для in) считаются от node.x/y/width/height, поэтому при
       // resize bezier должен следовать за новым размером.
       renderConnections();
+      // Sidecar-описание подстраивается под новую ширину/высоту.
+      positionNodeDescriptionEl(node);
     };
     const onUp = () => {
       document.removeEventListener('mousemove', onMove);
@@ -1055,10 +1092,15 @@ function makeDragHandler(el, node) {
       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);
+        // Раньше клампали в Math.max(0,...) — но canvas-frame отрисовывает
+        // отрицательную зону вокруг canvas (padX=2000), и юзер видит её.
+        // Юзер: «нужно позволить сдвигать выше и левее нуля».
+        t.node.x = t.origX + dxNode;
+        t.node.y = t.origY + dyNode;
         t.el.style.left = t.node.x + 'px';
         t.el.style.top  = t.node.y + 'px';
+        // Sidecar-описание движется вместе с нодой (тот же x, top чуть ниже).
+        positionNodeDescriptionEl(t.node);
       }
       renderConnections();
     };
@@ -1198,6 +1240,8 @@ async function deleteNode(node, el) {
     renderConnections();
   }
   if (el) el.remove();
+  // Sidecar-описание (если было) — уезжает вместе с нодой.
+  removeNodeDescriptionEl(node.id);
   // Записываем history ПОСЛЕ — но snapshot был снят ДО мутации
   const h = _getHistory();
   if (h) {
@@ -1286,6 +1330,7 @@ async function deleteSelectedNodes() {
   for (const id of ids) {
     const el = canvas.querySelector(`.node[data-id="${id}"]`);
     if (el) el.remove();
+    removeNodeDescriptionEl(id);
   }
   state.selectedNodeIds.clear();
   renderConnections();

package/renderer/state.js

@@ -6,6 +6,32 @@
 // видят друг друга по именам, без import/export. Порядок загрузки
 // важен: см. <script> теги внизу index.html.
 
+// === File-логгер (Electron only): дублируем console.* в userData/app.log,
+// чтобы агент-помощник (Claude) мог анализировать историю. На web (без
+// window.appLog) — noop. ====================================================
+(function _hookConsoleToAppLog() {
+  if (!window.appLog?.write) return;
+  const fmt = a => {
+    if (a instanceof Error) return a.stack || a.message || String(a);
+    if (typeof a === 'string') return a;
+    try { return JSON.stringify(a); } catch { return String(a); }
+  };
+  const wrap = (orig, level) => (...args) => {
+    try { window.appLog.write(level, args.map(fmt).join(' ')); } catch {}
+    orig.apply(console, args);
+  };
+  console.log   = wrap(console.log,   'log');
+  console.warn  = wrap(console.warn,  'warn');
+  console.error = wrap(console.error, 'error');
+  // Подхватываем uncaught/unhandled — стек туда же.
+  window.addEventListener('error', e => {
+    try { window.appLog.write('uncaught', `${e.message} @ ${e.filename}:${e.lineno}:${e.colno}\n${e.error?.stack || ''}`); } catch {}
+  });
+  window.addEventListener('unhandledrejection', e => {
+    try { window.appLog.write('unhandled', `${e.reason?.message || e.reason}\n${e.reason?.stack || ''}`); } catch {}
+  });
+})();
+
 // =================== IndexedDB (хэндл папки фильма) ===================
 const DB_NAME = 'video-editor';
 const STORE = 'handles';

package/renderer/styles.css

@@ -110,18 +110,47 @@
     width: 36px; height: 36px; flex-shrink: 0; object-fit: contain;
     background: #1a1a1a; border-radius: 8px; padding: 4px;
   }
-  /* Описание под image/video нодой. Auto-grow по содержимому. */
-  .node .node-description {
-    width: 100%; min-height: 28px; max-height: 120px;
-    margin-top: 6px; padding: 4px 6px;
+  /* Описание под image/video нодой. Раньше пробовали рендерить ВНУТРИ .node,
+     но image/video задают фиксированный aspect-ratio высоту, а .node клипит
+     overflow (content-visibility:auto + paint-containment) — текст ниже не
+     был виден. Теперь описание — отдельный sibling-элемент на canvas'е
+     (`.node-description-outside`), позиционируется в (node.x, node.y+h+gap),
+     ширина = node.width, высота = auto по контенту. См. ensureNodeDescriptionEl
+     в settings.js (вызывается из renderCanvas / drag / resize / ПКМ-меню). */
+  .node-description-outside {
+    position: absolute;
+    padding: 6px 8px;
     background: #1e1e1e; color: #ccc;
-    border: 1px solid #333; border-radius: 3px;
-    font-family: inherit; font-size: 12px; line-height: 1.4;
-    resize: vertical; box-sizing: border-box;
-    outline: none;
+    border-left: 2px solid #4a6a9a; border-radius: 2px;
+    font-size: 12px; line-height: 1.4;
+    white-space: pre-wrap; word-wrap: break-word;
+    box-sizing: border-box;
+    user-select: text; -webkit-user-select: text; cursor: text;
+    box-shadow: 0 2px 6px rgba(0,0,0,0.4);
+    z-index: 2;
+    pointer-events: auto;
+  }
+  /* Legacy: оставляем класс для совместимости (вдруг где-то ещё ссылается). */
+  .node .node-description { display: none; }
+
+  /* Большая явная кнопка «Перейти → <имя сцены>» снизу ноды. Видна когда
+     node.linkedBoard.name задан (см. refreshNodeLinkBadge). Position:
+     absolute, чуть выше нижней границы ноды; перекрывает контент только
+     визуально (pointer-events:auto только на кнопке). */
+  .node .link-go-btn {
+    position: absolute; left: 8px; right: 8px; bottom: 6px;
+    padding: 5px 10px; font-size: 11px; font-weight: 500;
+    background: #2a3854; color: #aac8e6;
+    border: 1px solid #4a6a9a; border-radius: 4px;
+    cursor: pointer; text-align: center;
+    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
+    transition: background 0.12s;
+    z-index: 4;
+    box-shadow: 0 2px 6px rgba(0,0,0,0.4);
   }
-  .node .node-description:focus { border-color: #4a6a9a; }
-  .node .node-description::placeholder { color: #555; }
+  .node .link-go-btn:hover { background: #3a5a8a; color: #fff; }
+  /* В drawing-нодах (тонкая стрелка) кнопка визуально странная — не показываем. */
+  .node.drawing-node .link-go-btn { display: none !important; }
 
   /* Link-badge: значок 🔗 на ноде когда у неё есть linkedBoard. Лежит в
      правом-верхнем углу, кликабельный (= dblclick: открыть target-сцену).
@@ -141,6 +170,44 @@
      к левому-верху самой bbox'ы. */
   .node.drawing-node .link-badge { top: 4px; right: 4px; }
 
+  /* Мобильный бургер для template/view-only. По умолчанию скрыт — показывается
+     только на узких экранах в view-only-mode (template-просмотр). В edit-режиме
+     юзер обычно на десктопе, sidebar нужен постоянно. */
+  .kk-mobile-burger {
+    display: none; padding: 6px 10px; font-size: 18px; line-height: 1;
+    background: transparent; color: #ccc; border: 1px solid #444;
+    border-radius: 4px; cursor: pointer;
+  }
+  .kk-mobile-burger:hover { background: #2a2a2a; color: #fff; }
+  @media (max-width: 768px) {
+    body.view-only-mode .kk-mobile-burger { display: inline-flex; }
+    /* Sidebar в шторку (slide-in). Position:fixed чтобы перекрывать canvas. */
+    body.view-only-mode .sidebar {
+      position: fixed; left: 0; top: 0; height: 100vh; z-index: 90;
+      transform: translateX(-100%); transition: transform 0.2s ease;
+      box-shadow: 4px 0 16px rgba(0,0,0,0.5);
+    }
+    body.view-only-mode.sidebar-open .sidebar { transform: translateX(0); }
+    /* Backdrop (затемнение) когда sidebar открыт. */
+    body.view-only-mode.sidebar-open::before {
+      content: ''; position: fixed; inset: 0; background: rgba(0,0,0,0.4);
+      z-index: 89; cursor: pointer;
+    }
+    /* В template/mobile прячем ВСЁ из toolbar'а кроме бургера —
+       у юзера маленький экран, кнопки управления (zoom, banner) занимают
+       половину viewport'а. Юзер: «оставь только бургер». */
+    body.view-only-mode .toolbar > *:not(.kk-mobile-burger) { display: none !important; }
+    /* Сам toolbar тоже минимизируем — без растягивания и фона, чтобы canvas
+       занял максимум места. */
+    body.view-only-mode .toolbar {
+      padding: 4px; min-height: auto; border-bottom: none;
+      background: transparent;
+    }
+    /* Канвас должен принимать pinch-zoom через JS, native scroll и pan
+       по 1 пальцу остаются. */
+    body.view-only-mode .canvas-wrap { touch-action: pan-x pan-y; }
+  }
+
   /* Brand-logo и welcome-logo всегда кликабельны (на главной → ничего,
      в проекте → возврат на welcome, dblclick → настройки). cursor:pointer
      ставится и в HTML inline, но в web chatium-минифайер иногда срывает

package/renderer/templates.js

@@ -528,8 +528,17 @@ async function collectProjectBoards(filmHandle) {
       await b.handle.getFileHandle('scene.json');
       // Исключаем scene.json и .thumbnails/ из mediaFiles — они либо
       // manifest, либо генерятся клиентом.
+      // scene.json — manifest, отдельный канал.
+      // .thumbnails/ — старая папка миниатюр (legacy).
+      // thumbs/    — текущая папка миниатюр (генерятся клиентом
+      //              через generateThumbnailIfMissing; их НЕ нужно
+      //              заливать на сервер — получатель сам сгенерит).
+      //              Без этого фильтра save отправлял 4 frames + 4 thumbs
+      //              = 8 файлов вместо 4. См. логи.
       b.mediaFiles = b.mediaFiles.filter(f =>
-        f.relPath !== 'scene.json' && !f.relPath.startsWith('.thumbnails/'));
+        f.relPath !== 'scene.json' &&
+        !f.relPath.startsWith('.thumbnails/') &&
+        !f.relPath.startsWith('thumbs/'));
       validBoards.push(b);
     } catch {}
   }

package/server.js

@@ -139,7 +139,14 @@ async function handleProxy(res, url) {
   try { u = new URL(target); } catch { return send(res, 400, { error: 'битый url' }); }
   if (!/^https?:$/.test(u.protocol)) return send(res, 400, { error: 'разрешены только http/https' });
 
-  const r = await fetch(target);
+  // Auth-aware прокси: некоторые upstream-URL'ы (OpenRouter video content)
+  // требуют Bearer-токен. Добавляем здесь чтобы клиентский <video src="...">
+  // мог их подгрузить через /api/proxy без обхода CORS+auth в renderer'е.
+  const fetchHeaders = {};
+  if (u.hostname === 'openrouter.ai' && process.env.OPENROUTER_API_KEY) {
+    fetchHeaders.Authorization = 'Bearer ' + process.env.OPENROUTER_API_KEY;
+  }
+  const r = await fetch(target, { headers: fetchHeaders });
   if (!r.ok) return send(res, r.status, { error: `upstream ${r.status}` });
   const headers = {
     'Content-Type': r.headers.get('content-type') || 'application/octet-stream',