Исправление: том ./mods:/lampac/mods в compose и копии 10 модулей с enable:true; конфиг без SkipModules

2026-10-02 12:11:49 +03:00
parent 8dcbc6bc52
commit 7b8e28b3bf
151 changed files with 68625 additions and 44 deletions
@@ -0,0 +1,14 @@
+<Project Sdk="Microsoft.NET.Sdk.Web">
+
+  <PropertyGroup>
+    <TargetFramework>net10.0</TargetFramework>
+    <OutputType>library</OutputType>
+    <IsPackable>true</IsPackable>
+    <RootNamespace>DatabaseEditor</RootNamespace>
+  </PropertyGroup>
+
+  <ItemGroup>
+    <ProjectReference Include="..\..\Shared\Shared.csproj" />
+  </ItemGroup>
+
+</Project>
@@ -0,0 +1,328 @@
+using Microsoft.AspNetCore.Mvc;
+using Shared;
+using Shared.Attributes;
+using System;
+using System.IO;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace DatabaseEditor;
+
+[Authorization(redirectUri: "/weblog/auth")]
+public class DatabaseEditorPageController : BaseController
+{
+    [HttpGet]
+    [Route("/database-editor")]
+    public ActionResult Index()
+    {
+        return EditorFile("index.html", "text/html; charset=utf-8");
+    }
+
+    [HttpGet]
+    [Route("/database-editor/app.js")]
+    public ActionResult Script()
+    {
+        return EditorFile("app.js", "application/javascript; charset=utf-8");
+    }
+
+    [HttpGet]
+    [Route("/database-editor/style.css")]
+    public ActionResult Style()
+    {
+        return EditorFile("style.css", "text/css; charset=utf-8");
+    }
+
+    ActionResult EditorFile(string fileName, string contentType)
+    {
+        string path = Path.Combine(ModInit.modpath, fileName);
+        string content = System.IO.File.ReadAllText(path, Encoding.UTF8);
+        Response.Headers["Cache-Control"] = "no-store, no-cache, must-revalidate";
+        return Content(content, contentType);
+    }
+}
+
+[Authorization(accessDeniedMessage: "{\"success\":false,\"error\":\"unauthorized\"}")]
+public class DatabaseEditorApiController : BaseController
+{
+    [HttpGet]
+    [Route("/database-editor/api/summary")]
+    public async Task<ActionResult> Summary()
+    {
+        try
+        {
+            return Json(new { success = true, databases = await DatabaseStore.GetSummaryAsync() });
+        }
+        catch (Exception ex)
+        {
+            return Unexpected(ex, "summary");
+        }
+    }
+
+    [HttpGet]
+    [Route("/database-editor/api/records")]
+    public async Task<ActionResult> Records(string database, string query = null, int page = 1, int pageSize = 25, string user = null)
+    {
+        try
+        {
+            var result = await DatabaseStore.GetRecordsAsync(database, query, page, pageSize, user);
+            return Json(new
+            {
+                success = true,
+                result.database,
+                result.page,
+                result.pageSize,
+                result.total,
+                result.pages,
+                result.records
+            });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "records");
+        }
+    }
+
+    [HttpGet]
+    [Route("/database-editor/api/users")]
+    public async Task<ActionResult> Users(string database)
+    {
+        try
+        {
+            return Json(new { success = true, users = await DatabaseStore.GetUsersAsync(database) });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "users");
+        }
+    }
+
+    [HttpGet]
+    [Route("/database-editor/api/record")]
+    public async Task<ActionResult> Record(string database, long id)
+    {
+        try
+        {
+            var record = await DatabaseStore.GetRecordAsync(database, id);
+            return record == null
+                ? NotFound(new { success = false, error = "record_not_found" })
+                : Json(new { success = true, record });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "record");
+        }
+    }
+
+    [HttpGet]
+    [Route("/database-editor/api/sync-user")]
+    public async Task<ActionResult> SyncUser(long id)
+    {
+        try
+        {
+            var user = await DatabaseStore.GetSyncUserAsync(id);
+            return user == null
+                ? NotFound(new { success = false, error = "record_not_found" })
+                : Json(new
+                {
+                    success = true,
+                    user,
+                    categories = DatabaseStore.SyncEditorCategories,
+                    statuses = DatabaseStore.SyncStatusCategories
+                });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "sync-user");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/save")]
+    public async Task<ActionResult> Save([FromBody] SaveRecordRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            var record = await DatabaseStore.SaveAsync(request);
+            return Json(new { success = true, record });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "save");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/delete")]
+    public async Task<ActionResult> Delete([FromBody] DeleteRecordRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            bool deleted = await DatabaseStore.DeleteAsync(request?.database, request?.id ?? 0);
+            return deleted
+                ? Json(new { success = true })
+                : NotFound(new { success = false, error = "record_not_found" });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "delete");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/rename-user")]
+    public async Task<ActionResult> RenameUser([FromBody] RenameUserRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            var result = await DatabaseStore.RenameUserAsync(request);
+            return Json(new { success = true, result });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "rename-user");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/delete-user")]
+    public async Task<ActionResult> DeleteUser([FromBody] DeleteUserRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            var result = await DatabaseStore.DeleteUserAsync(request);
+            return Json(new { success = true, result });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "delete-user");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/sync-item/save")]
+    public async Task<ActionResult> SaveSyncItem([FromBody] SaveSyncItemRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            var categories = await DatabaseStore.SaveSyncItemAsync(request);
+            return Json(new { success = true, categories });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "sync-item-save");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/sync-item/delete")]
+    public async Task<ActionResult> DeleteSyncItem([FromBody] DeleteSyncItemRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            bool deleted = await DatabaseStore.DeleteSyncItemAsync(request);
+            return deleted
+                ? Json(new { success = true })
+                : NotFound(new { success = false, error = "card_not_found" });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "sync-item-delete");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/backup")]
+    public async Task<ActionResult> Backup([FromBody] BackupRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            if (string.IsNullOrWhiteSpace(request?.database) || string.Equals(request.database, "all", StringComparison.OrdinalIgnoreCase))
+            {
+                var backups = await DatabaseStore.BackupAllAsync();
+                return Json(new { success = true, backups });
+            }
+
+            string path = await DatabaseStore.BackupAsync(request?.database);
+            return Json(new { success = true, path, database = request.database });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "backup");
+        }
+    }
+
+    [HttpGet]
+    [Route("/database-editor/api/backups")]
+    public ActionResult Backups(string database)
+    {
+        try
+        {
+            return Json(new { success = true, backups = DatabaseStore.GetBackups(database) });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "backups");
+        }
+    }
+
+    [HttpPost]
+    [Route("/database-editor/api/restore")]
+    public async Task<ActionResult> Restore([FromBody] RestoreBackupRequest request)
+    {
+        if (!IsEditorRequest())
+            return BadRequest(new { success = false, error = "invalid_editor_request" });
+
+        try
+        {
+            var result = await DatabaseStore.RestoreAsync(request);
+            return Json(new { success = true, result });
+        }
+        catch (Exception ex)
+        {
+            return KnownOrUnexpected(ex, "restore");
+        }
+    }
+
+    bool IsEditorRequest() => string.Equals(Request.Headers["X-Database-Editor"], "1", StringComparison.Ordinal);
+
+    ActionResult KnownOrUnexpected(Exception ex, string operation)
+    {
+        if (ex is DatabaseEditorValidationException)
+            return BadRequest(new { success = false, error = ex.Message });
+
+        if (ex is DatabaseEditorConflictException)
+            return Conflict(new { success = false, error = ex.Message });
+
+        if (ex is DatabaseEditorBusyException)
+            return StatusCode(503, new { success = false, error = ex.Message });
+
+        return Unexpected(ex, operation);
+    }
+
+    ActionResult Unexpected(Exception ex, string operation)
+    {
+        Serilog.Log.Error(ex, "DatabaseEditor {Operation} failed", operation);
+        return StatusCode(500, new { success = false, error = "internal_error" });
+    }
+}
@@ -0,0 +1,64 @@
+using Microsoft.AspNetCore.Http;
+using Shared.Models.Events;
+using Shared.Models.Module;
+using Shared.Models.Module.Interfaces;
+using System;
+using System.IO;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace DatabaseEditor;
+
+public class ModInit : IModuleLoaded
+{
+    public static string modpath;
+
+    static readonly Func<bool, EventMiddleware, Task<bool>> MiddlewareHandler = OnMiddleware;
+
+    public void Loaded(InitspaceModel initspace)
+    {
+        modpath = initspace.path;
+        EventListener.MiddlewareAsync += MiddlewareHandler;
+    }
+
+    public void Dispose()
+    {
+        EventListener.MiddlewareAsync -= MiddlewareHandler;
+    }
+
+    static async Task<bool> OnMiddleware(bool first, EventMiddleware e)
+    {
+        if (first || !HttpMethods.IsGet(e.httpContext.Request.Method))
+            return true;
+
+        string path = (e.httpContext.Request.Path.Value ?? string.Empty).TrimEnd('/');
+        if (!string.Equals(path, "/weblog", StringComparison.OrdinalIgnoreCase))
+            return true;
+
+        string weblogPath = Path.Combine(AppContext.BaseDirectory, "module", "WebLog", "index.html");
+        if (!File.Exists(weblogPath))
+            return true;
+
+        string html = File.ReadAllText(weblogPath, Encoding.UTF8);
+        if (!html.Contains("href=\"/database-editor\"", StringComparison.OrdinalIgnoreCase))
+        {
+            const string activeLink = "<a href=\"/weblog\" aria-current=\"page\">Weblog</a>";
+            const string databaseLink = activeLink + "\n        <a href=\"/database-editor\">Базы</a>";
+
+            if (html.Contains(activeLink, StringComparison.Ordinal))
+                html = html.Replace(activeLink, databaseLink, StringComparison.Ordinal);
+            else
+            {
+                const string navEnd = "</nav>";
+                int navIndex = html.IndexOf(navEnd, StringComparison.OrdinalIgnoreCase);
+                if (navIndex >= 0)
+                    html = html.Insert(navIndex, "<a href=\"/database-editor\">Базы</a>\n      ");
+            }
+        }
+
+        e.httpContext.Response.Headers["Cache-Control"] = "no-store, no-cache, must-revalidate";
+        e.httpContext.Response.ContentType = "text/html; charset=utf-8";
+        await e.httpContext.Response.WriteAsync(html, e.httpContext.RequestAborted);
+        return false;
+    }
+}
@@ -0,0 +1,42 @@
+# DatabaseEditor
+
+Защищённый root-паролем WebLog редактор баз `database/TimeCode.sql` и
+`database/Sync.sql`.
+
+## Маршруты
+
+- `/database-editor` — интерфейс редактора.
+- `/database-editor/api/summary` — состояние и размер баз.
+- `/database-editor/api/records` — поиск и постраничный список.
+- `/database-editor/api/record` — чтение одной записи.
+- `/database-editor/api/sync-user` — карточки и категории одного Sync-пользователя.
+- `/database-editor/api/sync-item/save` — точечное изменение категорий карточки Sync.
+- `/database-editor/api/sync-item/delete` — удаление одной карточки из Sync.
+- `/database-editor/api/save` — создание или изменение записи.
+- `/database-editor/api/delete` — удаление записи.
+- `/database-editor/api/rename-user` — атомарное переименование пользователя во всех строках `bookmarks` (Sync) и `timecodes` (TimeCode).
+- `/database-editor/api/delete-user` — атомарное удаление пользователя и всех его строк из `bookmarks` (Sync) и `timecodes` (TimeCode).
+- `/database-editor/api/backup` — online-backup одной базы или обеих баз при
+  `database: "all"` в `database/backup/database-editor`.
+- `/database-editor/api/backups` — список доступных резервных копий выбранной базы.
+- `/database-editor/api/restore` — проверка и восстановление выбранной SQLite-копии; перед заменой автоматически создаётся страховочная копия текущей базы с маркером `before-restore`.
+
+Изменяющие запросы требуют заголовок `X-Database-Editor: 1`. Все SQL-запросы
+параметризованы; запись синхронизируется штатными семафорами `TimeCode` и
+`Sync`. В корне поля `data` допускается только JSON-объект. Список TimeCode
+дополняется названиями и постерами из карточек Sync того же пользователя.
+
+TimeCode с версии типизированной схемы не хранит блоб: редактор по-прежнему
+показывает и принимает road-объект Lampa (`time`, `duration`, `percent`,
+`profile`, `updated`), но собирает его из колонок и раскладывает обратно.
+Правка поднимает `updated_at` выше всех строк пользователя — иначе клиенты
+не увидят её, они спрашивают дельты по `updated_at > since`.
+
+Редактор Sync повторяет категории Lampa: `book` (Закладки), `like` (Нравится),
+`wath` (Позже), `history` (История просмотров). Поле `wath` является актуальным
+именем Lampa, несмотря на опечатку в английском ключе. Статусы `look` (Смотрю),
+`viewed`, `scheduled`, `continued`, `thrown` взаимоисключающие. Служебное поле
+`watch` сохраняется в поддерживаемой схеме Lampac, но в редакторе не выводится.
+
+Мод также добавляет вкладку `Базы` в `/weblog` на лету, не изменяя файлы
+штатного модуля WebLog.
@@ -0,0 +1,649 @@
+(function () {
+  'use strict';
+
+  var categoryLabels = {
+    book: 'Закладки', like: 'Нравится', wath: 'Позже', history: 'История просмотров',
+    look: 'Смотрю', viewed: 'Просмотрено', scheduled: 'Запланировано',
+    continued: 'Продолжение следует', thrown: 'Брошено'
+  };
+  var state = {
+    database: 'timecode', page: 1, pageSize: 25, pages: 1, total: 0, query: '', selectedUser: '', loading: false,
+    editingId: 0, editingDatabase: 'timecode', syncUser: null, syncItems: [], syncCategories: [], syncStatuses: [],
+    syncPage: 1, syncPageSize: 48, syncQuery: '', syncCategory: '', syncItem: null
+  };
+  var $ = function (id) { return document.getElementById(id); };
+  var els = {
+    listView: $('listView'), summary: $('summary'), loading: $('loading'), head: $('tableHead'), body: $('tableBody'),
+    empty: $('empty'), pagerInfo: $('pagerInfo'), pageLabel: $('pageLabel'), prev: $('prevBtn'), next: $('nextBtn'),
+    search: $('searchInput'), userFilter: $('timecodeUserFilter'), pageSize: $('pageSize'), recordModal: $('recordModal'), recordTitle: $('recordModalTitle'),
+    recordId: $('recordModalId'), user: $('userField'), card: $('cardField'), item: $('itemField'), data: $('dataField'),
+    jsonStatus: $('jsonStatus'), saveRecord: $('saveRecordBtn'), deleteRecord: $('deleteRecordBtn'), toasts: $('toasts'),
+    syncDetail: $('syncDetail'), syncUserName: $('syncUserName'), syncUserMeta: $('syncUserMeta'), syncSearch: $('syncSearch'),
+    syncCategory: $('syncCategory'), syncResultCount: $('syncResultCount'), syncGrid: $('syncGrid'), syncEmpty: $('syncEmpty'),
+    syncPrev: $('syncPrev'), syncNext: $('syncNext'), syncPageLabel: $('syncPageLabel'), categoryModal: $('categoryModal'),
+    categoryHead: $('categoryCardHead'), categoryOptions: $('categoryOptions'), backupModal: $('backupModal'),
+    backupResults: $('backupResults'), renameUserModal: $('renameUserModal'), oldUser: $('oldUserField'), newUser: $('newUserField'),
+    confirmRenameUser: $('confirmRenameUserBtn'), deleteUserModal: $('deleteUserModal'), deleteUser: $('deleteUserField'),
+    confirmDeleteUser: $('confirmDeleteUserBtn'), restoreModal: $('restoreModal'), restoreResults: $('restoreResults'), restoreEmpty: $('restoreEmpty')
+  };
+  var errorMessages = {
+    unauthorized: 'Требуется повторный вход', unknown_database: 'Неизвестная база', database_not_found: 'Файл базы не найден',
+    database_busy: 'База занята, повторите попытку', invalid_json: 'JSON содержит ошибку',
+    data_must_be_json_object: 'В корне JSON должен быть объект', data_required: 'JSON не может быть пустым',
+    data_too_large: 'JSON превышает 8 МБ', user_required: 'Укажите пользователя', card_required: 'Укажите карточку',
+    item_required: 'Укажите элемент', duplicate_record_key: 'Запись с таким уникальным ключом уже существует',
+    record_not_found: 'Запись уже удалена', card_not_found: 'Карточка не найдена', unknown_category: 'Неизвестная категория',
+    multiple_statuses: 'Для карточки можно выбрать только один статус', old_user_required: 'Укажите текущее имя пользователя',
+    new_user_required: 'Укажите новое имя пользователя', user_name_unchanged: 'Новое имя совпадает с текущим',
+    user_not_found: 'Пользователь не найден ни в Sync, ни в TimeCode', rename_user_conflict: 'Новое имя уже занято или создаёт конфликт записей',
+    invalid_backup_file: 'Недопустимое имя файла резервной копии', backup_not_found: 'Резервная копия не найдена',
+    backup_integrity_failed: 'Проверка целостности резервной копии не пройдена', backup_schema_mismatch: 'Копия относится к другой базе',
+    invalid_backup_database: 'Файл не является исправной SQLite-базой',
+    internal_error: 'Внутренняя ошибка сервера', invalid_response: 'Сервер вернул неожиданный ответ'
+  };
+
+  function api(path, options) {
+    options = options || {};
+    options.credentials = 'same-origin';
+    options.headers = Object.assign({ Accept: 'application/json' }, options.headers || {});
+    if (options.body) {
+      options.headers['Content-Type'] = 'application/json';
+      options.headers['X-Database-Editor'] = '1';
+    }
+    return fetch('/database-editor/api/' + path, options).then(function (response) {
+      var type = response.headers.get('content-type') || '';
+      if (response.redirected && response.url.indexOf('/weblog/auth') >= 0) {
+        location.href = response.url;
+        throw new Error('unauthorized');
+      }
+      if (type.indexOf('application/json') < 0) throw new Error(response.status === 401 ? 'unauthorized' : 'invalid_response');
+      return response.json().then(function (data) {
+        if (!response.ok || data.success === false) throw new Error(data.error || 'request_failed');
+        return data;
+      });
+    });
+  }
+
+  function el(tag, className, text) {
+    var node = document.createElement(tag);
+    if (className) node.className = className;
+    if (text !== undefined && text !== null) node.textContent = text;
+    return node;
+  }
+  function toast(message, bad) {
+    var node = el('div', 'toast ' + (bad ? 'bad' : 'good'), message);
+    els.toasts.appendChild(node);
+    setTimeout(function () { node.remove(); }, 4500);
+  }
+  function showError(error) {
+    var key = error && error.message || 'internal_error';
+    toast(errorMessages[key] || key, true);
+  }
+  function setLoading(value) {
+    state.loading = value;
+    els.loading.classList.toggle('active', value);
+    els.prev.disabled = value || state.page <= 1;
+    els.next.disabled = value || state.page >= state.pages;
+  }
+  function formatBytes(bytes) {
+    if (!bytes) return '0 Б';
+    var units = ['Б', 'КБ', 'МБ', 'ГБ'];
+    var index = Math.min(Math.floor(Math.log(bytes) / Math.log(1024)), 3);
+    return (bytes / Math.pow(1024, index)).toLocaleString('ru-RU', { maximumFractionDigits: index ? 1 : 0 }) + ' ' + units[index];
+  }
+  function formatDate(value) {
+    if (!value) return '—';
+    var normalized = String(value).trim();
+    var sqliteDateWithoutZone = /^\d{4}-\d{2}-\d{2}[ T]\d{2}:\d{2}:\d{2}(?:\.\d+)?$/;
+    if (sqliteDateWithoutZone.test(normalized)) {
+      normalized = normalized.replace(' ', 'T').replace(/(\.\d{3})\d+$/, '$1') + 'Z';
+    }
+    var date = new Date(normalized);
+    return isNaN(date.getTime()) ? value : date.toLocaleString('ru-RU');
+  }
+  function formatTime(seconds) {
+    seconds = Math.max(0, Math.round(Number(seconds) || 0));
+    var hours = Math.floor(seconds / 3600);
+    var minutes = Math.floor((seconds % 3600) / 60);
+    var rest = seconds % 60;
+    return (hours ? hours + ':' + String(minutes).padStart(2, '0') : minutes) + ':' + String(rest).padStart(2, '0');
+  }
+  function posterUrl(value) {
+    if (!value) return '';
+    if (/^https?:\/\//i.test(value)) return value;
+    return '/tmdb/img/t/p/w300' + (value.charAt(0) === '/' ? value : '/' + value);
+  }
+  function posterNode(value, title) {
+    if (!value) return el('div', 'poster-placeholder', '◇');
+    var image = el('img', 'poster');
+    image.loading = 'lazy';
+    image.alt = title || '';
+    image.src = posterUrl(value);
+    image.addEventListener('error', function () { image.replaceWith(el('div', 'poster-placeholder', '◇')); }, { once: true });
+    return image;
+  }
+  function typeLabel(type) { return type === 'tv' ? 'Сериал' : type === 'movie' ? 'Фильм' : ''; }
+  function fallbackTitle(record) {
+    if (record.title) return record.title;
+    return typeLabel(record.mediaType) || 'Карточка';
+  }
+
+  function loadSummary() {
+    return api('summary').then(function (data) {
+      els.summary.textContent = '';
+      (data.databases || []).forEach(function (db) {
+        var card = el('article', 'summary-card');
+        var head = el('div', 'summary-head');
+        head.appendChild(el('span', '', db.title));
+        head.appendChild(el('span', db.available ? 'available' : 'missing', db.available ? 'доступна' : 'нет файла'));
+        card.appendChild(head);
+        card.appendChild(el('div', 'summary-value', Number(db.records || 0).toLocaleString('ru-RU') + ' записей'));
+        var foot = el('div', 'summary-foot');
+        foot.appendChild(el('div', 'summary-meta', formatBytes(db.bytes) + ' · ' + db.file + ' · ' + formatDate(db.updated)));
+        var backup = el('button', 'summary-backup', 'Backup этой базы');
+        backup.addEventListener('click', function () { createBackup(db.database); });
+        foot.appendChild(backup);
+        card.appendChild(foot);
+        els.summary.appendChild(card);
+      });
+    }).catch(showError);
+  }
+
+  function renderHead() {
+    els.head.textContent = '';
+    var table = els.head.closest('table');
+    table.classList.toggle('timecode-table', state.database === 'timecode');
+    table.classList.toggle('sync-table', state.database === 'sync');
+    var columns = state.database === 'timecode'
+      ? [['ID', 'col-id'], ['Пользователь', 'col-user'], ['Карточка', 'col-media'], ['Позиция', 'col-progress'], ['Обновлено', 'col-date'], ['', 'col-actions']]
+      : [['ID', 'col-id'], ['Пользователь', 'col-user'], ['Обновлено', 'col-date'], ['', 'col-actions']];
+    columns.forEach(function (column) { els.head.appendChild(el('th', column[1], column[0])); });
+  }
+
+  function renderRows(records) {
+    els.body.textContent = '';
+    els.empty.classList.toggle('show', !records.length);
+    records.forEach(function (record) {
+      var row = document.createElement('tr');
+      row.appendChild(el('td', 'mono', '#' + record.id));
+      var userCell = el('td');
+      userCell.appendChild(el('div', 'record-user', record.user || '—'));
+      userCell.appendChild(el('div', 'record-sub', formatBytes(record.dataLength || 0)));
+      row.appendChild(userCell);
+
+      if (state.database === 'timecode') {
+        var mediaCell = el('td');
+        var media = el('div', 'media-cell');
+        var title = fallbackTitle(record);
+        media.appendChild(posterNode(record.poster, title));
+        var copy = el('div', 'media-copy');
+        copy.appendChild(el('div', 'media-title', title));
+        var meta = el('div', 'media-meta');
+        if (record.mediaType) meta.appendChild(el('span', 'type-badge', typeLabel(record.mediaType)));
+        var mediaDetails = [];
+        if (record.mediaType === 'tv' && record.season != null && record.episode != null) {
+          mediaDetails.push('Сезон ' + record.season, 'Серия ' + record.episode);
+        }
+        if (record.year) mediaDetails.push(record.year);
+        if (mediaDetails.length) meta.appendChild(document.createTextNode(mediaDetails.join(' · ')));
+        copy.appendChild(meta);
+        media.appendChild(copy);
+        mediaCell.appendChild(media);
+        row.appendChild(mediaCell);
+
+        var progressCell = el('td');
+        var percent = Number(record.percent);
+        if (!isFinite(percent) && Number(record.duration) > 0) percent = Number(record.position) / Number(record.duration) * 100;
+        percent = Math.max(0, Math.min(100, isFinite(percent) ? percent : 0));
+        progressCell.appendChild(el('div', 'record-user', Math.round(percent) + '%'));
+        var track = el('div', 'progress-track');
+        var fill = el('div', 'progress-fill');
+        fill.style.width = percent + '%';
+        track.appendChild(fill);
+        progressCell.appendChild(track);
+        var progressCopy = el('div', 'progress-copy');
+        progressCopy.appendChild(el('span', '', formatTime(record.position)));
+        progressCopy.appendChild(el('span', '', formatTime(record.duration)));
+        progressCell.appendChild(progressCopy);
+        row.appendChild(progressCell);
+      }
+
+      row.appendChild(el('td', '', formatDate(record.updated)));
+      var actions = el('td', 'row-actions');
+      if (state.database === 'sync') {
+        var open = el('button', 'mini-btn', 'Открыть');
+        open.addEventListener('click', function () { openSyncUser(record.id); });
+        actions.appendChild(open);
+      }
+      var edit = el('button', 'mini-btn', 'JSON');
+      edit.addEventListener('click', function () { openRecord(record.id, state.database); });
+      var remove = el('button', 'mini-btn delete', '×');
+      remove.title = 'Удалить всю запись';
+      remove.addEventListener('click', function () { deleteRecord(record.id, state.database); });
+      actions.appendChild(edit);
+      actions.appendChild(remove);
+      row.appendChild(actions);
+      els.body.appendChild(row);
+    });
+  }
+
+  function loadRecords() {
+    if (state.loading) return;
+    setLoading(true);
+    var params = new URLSearchParams({ database: state.database, page: String(state.page), pageSize: String(state.pageSize) });
+    if (state.query) params.set('query', state.query);
+    if (state.database === 'timecode' && state.selectedUser) params.set('user', state.selectedUser);
+    api('records?' + params.toString()).then(function (data) {
+      state.page = Number(data.page || 1); state.pages = Number(data.pages || 1); state.total = Number(data.total || 0);
+      renderHead(); renderRows(data.records || []);
+      var from = state.total ? (state.page - 1) * state.pageSize + 1 : 0;
+      var to = Math.min(state.page * state.pageSize, state.total);
+      els.pagerInfo.textContent = from + '–' + to + ' из ' + state.total.toLocaleString('ru-RU');
+      els.pageLabel.textContent = state.page + ' / ' + state.pages;
+    }).catch(showError).finally(function () { setLoading(false); });
+  }
+
+  function loadTimeCodeUsers() {
+    return api('users?database=timecode').then(function (data) {
+      var selected = state.selectedUser;
+      els.userFilter.textContent = '';
+      var all = document.createElement('option');
+      all.value = '';
+      all.textContent = 'Все пользователи TimeCode (' + (data.users || []).length.toLocaleString('ru-RU') + ')';
+      els.userFilter.appendChild(all);
+      (data.users || []).forEach(function (entry) {
+        var option = document.createElement('option');
+        option.value = entry.user;
+        option.textContent = entry.user + ' (' + Number(entry.records || 0).toLocaleString('ru-RU') + ')';
+        els.userFilter.appendChild(option);
+      });
+      if (selected && Array.from(els.userFilter.options).some(function (option) { return option.value === selected; })) {
+        els.userFilter.value = selected;
+      } else {
+        state.selectedUser = '';
+        if (selected && state.database === 'timecode') { state.page = 1; loadRecords(); }
+      }
+    }).catch(showError);
+  }
+
+  function switchDatabase(database) {
+    if (database === state.database) return;
+    state.database = database; state.page = 1;
+    document.querySelectorAll('.db-tab').forEach(function (tab) { tab.classList.toggle('active', tab.dataset.db === database); });
+    els.userFilter.hidden = database !== 'timecode';
+    loadRecords();
+  }
+
+  function openSyncUser(id, preserveFilters) {
+    var previousQuery = preserveFilters ? state.syncQuery : '';
+    var previousCategory = preserveFilters ? state.syncCategory : '';
+    api('sync-user?id=' + encodeURIComponent(id)).then(function (data) {
+      state.syncUser = data.user;
+      state.syncItems = data.user.items || [];
+      state.syncCategories = data.categories || [];
+      state.syncStatuses = data.statuses || [];
+      state.syncPage = 1; state.syncQuery = previousQuery; state.syncCategory = previousCategory;
+      els.syncSearch.value = previousQuery;
+      buildCategorySelect();
+      if (Array.from(els.syncCategory.options).some(function (option) { return option.value === previousCategory; })) {
+        els.syncCategory.value = previousCategory;
+      } else {
+        state.syncCategory = '';
+      }
+      els.syncUserName.textContent = data.user.user || '—';
+      els.syncUserMeta.textContent = Number(data.user.total || 0).toLocaleString('ru-RU') + ' карточек · обновлено ' + formatDate(data.user.updated);
+      els.listView.hidden = true;
+      els.syncDetail.hidden = false;
+      renderSyncItems();
+      window.scrollTo(0, 0);
+    }).catch(showError);
+  }
+
+  function buildCategorySelect() {
+    els.syncCategory.textContent = '';
+    var all = document.createElement('option'); all.value = ''; all.textContent = 'Все категории'; els.syncCategory.appendChild(all);
+    var generalGroup = document.createElement('optgroup'); generalGroup.label = 'Категории';
+    var statusGroup = document.createElement('optgroup'); statusGroup.label = 'Статус';
+    state.syncCategories.forEach(function (category) {
+      var option = document.createElement('option'); option.value = category; option.textContent = categoryLabels[category] || category;
+      (state.syncStatuses.indexOf(category) >= 0 ? statusGroup : generalGroup).appendChild(option);
+    });
+    els.syncCategory.appendChild(generalGroup);
+    els.syncCategory.appendChild(statusGroup);
+  }
+
+  function syncItemOrder(item, category) {
+    var value = item.categoryOrder && item.categoryOrder[category];
+    return value == null ? Number.MAX_SAFE_INTEGER : Number(value);
+  }
+
+  function filteredSyncItems() {
+    var query = state.syncQuery.toLowerCase();
+    var filtered = state.syncItems.filter(function (item) {
+      var matchesText = !query || String(item.title || '').toLowerCase().indexOf(query) >= 0 || String(item.cardId || '').toLowerCase().indexOf(query) >= 0;
+      var matchesCategory = !state.syncCategory || (item.categories || []).indexOf(state.syncCategory) >= 0;
+      return matchesText && matchesCategory;
+    });
+    return filtered.sort(function (left, right) {
+      if (state.syncCategory) return syncItemOrder(left, state.syncCategory) - syncItemOrder(right, state.syncCategory);
+      var leftHistory = syncItemOrder(left, 'history');
+      var rightHistory = syncItemOrder(right, 'history');
+      if (leftHistory !== rightHistory) return leftHistory - rightHistory;
+      return Number(left.order || 0) - Number(right.order || 0);
+    });
+  }
+
+  function renderSyncItems() {
+    var filtered = filteredSyncItems();
+    var pages = Math.max(1, Math.ceil(filtered.length / state.syncPageSize));
+    state.syncPage = Math.min(state.syncPage, pages);
+    var start = (state.syncPage - 1) * state.syncPageSize;
+    var visible = filtered.slice(start, start + state.syncPageSize);
+    els.syncGrid.textContent = '';
+    els.syncEmpty.classList.toggle('show', !visible.length);
+    els.syncResultCount.textContent = filtered.length.toLocaleString('ru-RU') + ' из ' + state.syncItems.length.toLocaleString('ru-RU');
+    els.syncPageLabel.textContent = state.syncPage + ' / ' + pages;
+    els.syncPrev.disabled = state.syncPage <= 1;
+    els.syncNext.disabled = state.syncPage >= pages;
+
+    visible.forEach(function (item) {
+      var card = el('article', 'sync-card');
+      card.appendChild(posterNode(item.poster, item.title));
+      var body = el('div', 'sync-card-body');
+      body.appendChild(el('div', 'sync-card-title', item.title || 'Карточка #' + item.cardId));
+      body.appendChild(el('div', 'sync-card-meta', [typeLabel(item.mediaType), item.year, '#' + item.cardId].filter(Boolean).join(' · ')));
+      var tags = el('div', 'category-tags');
+      if (item.categories && item.categories.length) item.categories.forEach(function (category) { tags.appendChild(el('span', 'category-tag', categoryLabels[category] || category)); });
+      else tags.appendChild(el('span', 'category-tag empty-tag', 'Без категории'));
+      body.appendChild(tags);
+      var actions = el('div', 'sync-card-actions');
+      var edit = el('button', 'btn', 'Изменить категории');
+      edit.addEventListener('click', function () { openCategoryModal(item); });
+      actions.appendChild(edit); body.appendChild(actions); card.appendChild(body); els.syncGrid.appendChild(card);
+    });
+  }
+
+  function openCategoryModal(item) {
+    state.syncItem = item;
+    els.categoryHead.textContent = '';
+    els.categoryHead.appendChild(posterNode(item.poster, item.title));
+    var copy = el('div');
+    copy.appendChild(el('div', 'media-title', item.title || 'Карточка #' + item.cardId));
+    copy.appendChild(el('div', 'media-meta mono', '#' + item.cardId));
+    els.categoryHead.appendChild(copy);
+    els.categoryOptions.textContent = '';
+    state.syncCategories.forEach(function (category, index) {
+      var isStatus = state.syncStatuses.indexOf(category) >= 0;
+      if (isStatus && category === state.syncStatuses[0]) {
+        els.categoryOptions.appendChild(el('div', 'category-section-title', 'Статус'));
+      }
+      var wrap = el('div', 'category-option' + (isStatus ? ' status-option' : ''));
+      var input = document.createElement('input');
+      input.type = 'checkbox'; input.id = 'sync-category-' + index; input.value = category;
+      if (isStatus) input.dataset.status = '1';
+      input.checked = (item.categories || []).indexOf(category) >= 0;
+      if (isStatus) input.addEventListener('change', function () {
+        if (!input.checked) return;
+        els.categoryOptions.querySelectorAll('input[data-status="1"]').forEach(function (other) {
+          if (other !== input) other.checked = false;
+        });
+      });
+      var label = document.createElement('label'); label.htmlFor = input.id; label.textContent = categoryLabels[category] || category;
+      wrap.appendChild(input); wrap.appendChild(label); els.categoryOptions.appendChild(wrap);
+    });
+    openModal('categoryModal');
+  }
+
+  function saveSyncItem() {
+    if (!state.syncUser || !state.syncItem) return;
+    var categories = Array.from(els.categoryOptions.querySelectorAll('input:checked')).map(function (input) { return input.value; });
+    $('saveSyncItemBtn').disabled = true;
+    api('sync-item/save', { method: 'POST', body: JSON.stringify({ recordId: state.syncUser.id, cardId: state.syncItem.cardId, categories: categories }) })
+      .then(function (data) {
+        closeModal('categoryModal'); toast('Категории и статус карточки сохранены'); loadSummary();
+        openSyncUser(state.syncUser.id, true);
+      }).catch(showError).finally(function () { $('saveSyncItemBtn').disabled = false; });
+  }
+
+  function deleteSyncItem() {
+    if (!state.syncUser || !state.syncItem) return;
+    if (!confirm('Удалить карточку «' + (state.syncItem.title || state.syncItem.cardId) + '» у этого пользователя?')) return;
+    api('sync-item/delete', { method: 'POST', body: JSON.stringify({ recordId: state.syncUser.id, cardId: state.syncItem.cardId }) })
+      .then(function () {
+        state.syncItems = state.syncItems.filter(function (item) { return item.cardId !== state.syncItem.cardId; });
+        state.syncUser.total = state.syncItems.length;
+        closeModal('categoryModal'); renderSyncItems(); toast('Карточка удалена'); loadSummary();
+      }).catch(showError);
+  }
+
+  function prettyJson(value) { return JSON.stringify(JSON.parse(value), null, 2); }
+  function validateJson() {
+    try {
+      var parsed = JSON.parse(els.data.value);
+      if (!parsed || Array.isArray(parsed) || typeof parsed !== 'object') throw new Error('object');
+      els.jsonStatus.textContent = 'JSON корректен'; els.jsonStatus.className = 'json-status ok'; return true;
+    } catch (_) {
+      els.jsonStatus.textContent = 'Ошибка JSON'; els.jsonStatus.className = 'json-status bad'; return false;
+    }
+  }
+  function setRecordDatabase(database) {
+    document.querySelectorAll('.timecode-field').forEach(function (node) { node.style.display = database === 'timecode' ? 'flex' : 'none'; });
+  }
+  function openRecord(id, database) {
+    api('record?database=' + encodeURIComponent(database) + '&id=' + id).then(function (data) {
+      var record = data.record; state.editingId = record.id; state.editingDatabase = database; setRecordDatabase(database);
+      els.recordTitle.textContent = 'Редактирование ' + (database === 'sync' ? 'Sync' : 'TimeCode'); els.recordId.textContent = '#' + record.id;
+      els.user.value = record.user || ''; els.card.value = record.card || ''; els.item.value = record.item || '';
+      try { els.data.value = prettyJson(record.data || '{}'); } catch (_) { els.data.value = record.data || ''; }
+      els.deleteRecord.hidden = false; validateJson(); openModal('recordModal');
+    }).catch(showError);
+  }
+  function saveRecord() {
+    if (!validateJson()) return;
+    var payload = { database: state.editingDatabase, id: state.editingId || null, user: els.user.value, card: els.card.value, item: els.item.value, data: els.data.value };
+    els.saveRecord.disabled = true;
+    api('save', { method: 'POST', body: JSON.stringify(payload) }).then(function () {
+      toast('Запись сохранена'); closeModal('recordModal'); state.page = 1; loadRecords(); loadSummary();
+      if (state.editingDatabase === 'timecode') loadTimeCodeUsers();
+      if (state.syncUser && state.editingDatabase === 'sync') openSyncUser(state.syncUser.id);
+    }).catch(showError).finally(function () { els.saveRecord.disabled = false; });
+  }
+  function deleteRecord(id, database) {
+    if (!confirm('Удалить всю запись #' + id + ' из ' + database + '?')) return;
+    api('delete', { method: 'POST', body: JSON.stringify({ database: database, id: id }) }).then(function () {
+      toast('Запись удалена'); closeModal('recordModal'); loadRecords(); loadSummary();
+      if (database === 'timecode') loadTimeCodeUsers();
+    }).catch(showError);
+  }
+
+  function createBackup(database) {
+    $('backupAllBtn').disabled = true;
+    api('backup', { method: 'POST', body: JSON.stringify({ database: database }) }).then(function (data) {
+      var backups = data.backups || [{ database: data.database || database, path: data.path }];
+      els.backupResults.textContent = '';
+      backups.forEach(function (backup) {
+        var result = el('div', 'backup-result');
+        result.appendChild(el('strong', '', backup.database === 'timecode' ? 'TimeCode.sql' : 'Sync.sql'));
+        result.appendChild(el('div', 'backup-path', backup.path));
+        els.backupResults.appendChild(result);
+      });
+      openModal('backupModal'); toast(backups.length === 2 ? 'Созданы копии TimeCode и Sync' : 'Резервная копия создана');
+    }).catch(showError).finally(function () { $('backupAllBtn').disabled = false; });
+  }
+  var restoreDatabase = 'sync';
+  function openRestore() {
+    restoreDatabase = 'sync';
+    document.querySelectorAll('[data-restore-db]').forEach(function (tab) { tab.classList.toggle('active', tab.dataset.restoreDb === restoreDatabase); });
+    openModal('restoreModal'); loadBackups();
+  }
+  function loadBackups() {
+    els.restoreResults.textContent = ''; els.restoreEmpty.classList.remove('show');
+    els.restoreResults.appendChild(el('div', 'muted', 'Загрузка…'));
+    api('backups?database=' + encodeURIComponent(restoreDatabase)).then(function (data) {
+      els.restoreResults.textContent = '';
+      var backups = data.backups || [];
+      els.restoreEmpty.classList.toggle('show', !backups.length);
+      backups.forEach(function (backup) {
+        var row = el('div', 'backup-result restore-result');
+        var info = el('div', 'restore-info');
+        info.appendChild(el('strong', '', backup.file));
+        info.appendChild(el('div', 'backup-path', formatBytes(backup.bytes) + ' · ' + formatDate(backup.created)));
+        var button = el('button', 'btn danger', 'Восстановить');
+        button.addEventListener('click', function () { restoreBackup(backup, button); });
+        row.appendChild(info); row.appendChild(button); els.restoreResults.appendChild(row);
+      });
+    }).catch(showError);
+  }
+  function restoreBackup(backup, button) {
+    var title = backup.database === 'sync' ? 'Sync' : 'TimeCode';
+    if (!confirm('Восстановить базу ' + title + ' из файла «' + backup.file + '»?\n\nТекущее состояние сначала будет сохранено автоматически. Данные, записанные после даты этой копии, будут заменены.')) return;
+    button.disabled = true;
+    api('restore', { method: 'POST', body: JSON.stringify({ database: backup.database, file: backup.file }) }).then(function (data) {
+      closeModal('restoreModal');
+      toast(title + ' восстановлена. Страховочная копия: ' + data.result.safetyBackup);
+      setTimeout(function () { location.reload(); }, 1600);
+    }).catch(showError).finally(function () { button.disabled = false; });
+  }
+  function openRenameUser() {
+    var selected = state.syncUser ? state.syncUser.user || '' : state.selectedUser || '';
+    els.oldUser.textContent = '';
+    var loadingOption = document.createElement('option'); loadingOption.value = ''; loadingOption.textContent = 'Загрузка пользователей…';
+    els.oldUser.appendChild(loadingOption);
+    els.newUser.value = '';
+    els.confirmRenameUser.disabled = true;
+    openModal('renameUserModal');
+    Promise.all([api('users?database=sync'), api('users?database=timecode')]).then(function (responses) {
+      var users = new Map();
+      responses.forEach(function (response, databaseIndex) {
+        (response.users || []).forEach(function (entry) {
+          var key = (entry.user || '').toLowerCase();
+          if (!key) return;
+          var current = users.get(key) || { user: entry.user, sync: 0, timecode: 0 };
+          current[databaseIndex === 0 ? 'sync' : 'timecode'] += Number(entry.records || 0);
+          users.set(key, current);
+        });
+      });
+      var list = Array.from(users.values()).sort(function (left, right) { return left.user.localeCompare(right.user, 'ru', { sensitivity: 'base' }); });
+      els.oldUser.textContent = '';
+      var placeholder = document.createElement('option'); placeholder.value = ''; placeholder.textContent = list.length ? 'Выберите пользователя' : 'Пользователей нет';
+      els.oldUser.appendChild(placeholder);
+      list.forEach(function (entry) {
+        var option = document.createElement('option'); option.value = entry.user;
+        option.textContent = entry.user + ' · Sync: ' + entry.sync + ', TimeCode: ' + entry.timecode;
+        els.oldUser.appendChild(option);
+      });
+      var match = list.find(function (entry) { return entry.user.toLowerCase() === selected.toLowerCase(); });
+      if (match) els.oldUser.value = match.user;
+      els.confirmRenameUser.disabled = !list.length;
+      setTimeout(function () { (els.oldUser.value ? els.newUser : els.oldUser).focus(); }, 0);
+    }).catch(function (error) {
+      els.oldUser.textContent = '';
+      var failed = document.createElement('option'); failed.value = ''; failed.textContent = 'Не удалось загрузить пользователей'; els.oldUser.appendChild(failed);
+      showError(error);
+    });
+  }
+  function openDeleteUser() {
+    var selected = state.syncUser ? state.syncUser.user || '' : state.selectedUser || '';
+    els.deleteUser.textContent = '';
+    var loading = document.createElement('option'); loading.value = ''; loading.textContent = 'Загрузка пользователей…'; els.deleteUser.appendChild(loading);
+    els.confirmDeleteUser.disabled = true;
+    openModal('deleteUserModal');
+    Promise.all([api('users?database=sync'), api('users?database=timecode')]).then(function (responses) {
+      var users = new Map();
+      responses.forEach(function (response, databaseIndex) {
+        (response.users || []).forEach(function (entry) {
+          var key = (entry.user || '').toLowerCase();
+          if (!key) return;
+          var current = users.get(key) || { user: entry.user, sync: 0, timecode: 0 };
+          current[databaseIndex === 0 ? 'sync' : 'timecode'] += Number(entry.records || 0); users.set(key, current);
+        });
+      });
+      var list = Array.from(users.values()).sort(function (left, right) { return left.user.localeCompare(right.user, 'ru', { sensitivity: 'base' }); });
+      els.deleteUser.textContent = '';
+      var placeholder = document.createElement('option'); placeholder.value = ''; placeholder.textContent = list.length ? 'Выберите пользователя' : 'Пользователей нет'; els.deleteUser.appendChild(placeholder);
+      list.forEach(function (entry) { var option = document.createElement('option'); option.value = entry.user; option.textContent = entry.user + ' · Sync: ' + entry.sync + ', TimeCode: ' + entry.timecode; els.deleteUser.appendChild(option); });
+      var match = list.find(function (entry) { return entry.user.toLowerCase() === selected.toLowerCase(); });
+      if (match) els.deleteUser.value = match.user;
+      els.confirmDeleteUser.disabled = !list.length;
+      setTimeout(function () { els.deleteUser.focus(); }, 0);
+    }).catch(function (error) {
+      els.deleteUser.textContent = ''; var failed = document.createElement('option'); failed.value = ''; failed.textContent = 'Не удалось загрузить пользователей'; els.deleteUser.appendChild(failed); showError(error);
+    });
+  }
+  function deleteUser() {
+    var user = els.deleteUser.value.trim();
+    if (!user) return showError(new Error('user_required'));
+    if (!confirm('Безвозвратно удалить пользователя «' + user + '», все его закладки Sync и позиции TimeCode?')) return;
+    els.confirmDeleteUser.disabled = true;
+    api('delete-user', { method: 'POST', body: JSON.stringify({ user: user }) }).then(function (data) {
+      var result = data.result; closeModal('deleteUserModal'); state.selectedUser = '';
+      if (state.syncUser && state.syncUser.user.toLowerCase() === user.toLowerCase()) state.syncUser = null;
+      els.syncDetail.hidden = true; els.listView.hidden = false;
+      loadRecords(); loadSummary(); loadTimeCodeUsers();
+      toast('Пользователь удалён: Sync — ' + result.syncRecords + ', TimeCode — ' + result.timecodeRecords);
+    }).catch(showError).finally(function () { els.confirmDeleteUser.disabled = false; });
+  }
+  function renameUser() {
+    var oldUser = els.oldUser.value.trim();
+    var newUser = els.newUser.value.trim();
+    if (!oldUser) return showError(new Error('old_user_required'));
+    if (!newUser) return showError(new Error('new_user_required'));
+    if (!confirm('Перед продолжением выйдите из учётной записи «' + oldUser + '» на всех устройствах или измените её логин/account_email в Lampa и init/AccsDB.\n\nАктивная сессия со старым именем создаст пользователя повторно.\n\nПереименовать «' + oldUser + '» в «' + newUser + '»?')) return;
+    els.confirmRenameUser.disabled = true;
+    api('rename-user', { method: 'POST', body: JSON.stringify({ oldUser: oldUser, newUser: newUser }) }).then(function (data) {
+      var result = data.result;
+      closeModal('renameUserModal');
+      state.selectedUser = '';
+      if (state.syncUser && state.syncUser.user.toLowerCase() === oldUser.toLowerCase()) state.syncUser = null;
+      els.syncDetail.hidden = true; els.listView.hidden = false;
+      loadRecords(); loadSummary(); loadTimeCodeUsers();
+      toast('Пользователь переименован: Sync — ' + result.syncRecords + ', TimeCode — ' + result.timecodeRecords);
+    }).catch(showError).finally(function () { els.confirmRenameUser.disabled = false; });
+  }
+  function openModal(id) { $(id).classList.add('open'); }
+  function closeModal(id) { $(id).classList.remove('open'); }
+  function applyTheme(theme) {
+    document.documentElement.dataset.theme = theme;
+    var metaTheme = document.getElementById('metaTheme');
+    if (metaTheme) metaTheme.setAttribute('content', theme === 'dark' ? '#0c0e12' : '#f4f5f8');
+    localStorage.setItem('lampac-theme', theme);
+  }
+
+  document.querySelectorAll('.db-tab').forEach(function (tab) { tab.addEventListener('click', function () { switchDatabase(tab.dataset.db); }); });
+  var searchTimer;
+  els.search.addEventListener('input', function () { clearTimeout(searchTimer); searchTimer = setTimeout(function () { state.query = els.search.value.trim(); state.page = 1; loadRecords(); }, 280); });
+  els.userFilter.addEventListener('change', function () { state.selectedUser = els.userFilter.value; state.page = 1; loadRecords(); });
+  els.pageSize.addEventListener('change', function () { state.pageSize = Number(els.pageSize.value); state.page = 1; loadRecords(); });
+  els.prev.addEventListener('click', function () { if (state.page > 1) { state.page--; loadRecords(); } });
+  els.next.addEventListener('click', function () { if (state.page < state.pages) { state.page++; loadRecords(); } });
+  $('refreshBtn').addEventListener('click', function () { loadRecords(); loadSummary(); if (state.database === 'timecode') loadTimeCodeUsers(); });
+  $('backupAllBtn').addEventListener('click', function () { createBackup('all'); });
+  $('restoreBtn').addEventListener('click', openRestore);
+  document.querySelectorAll('[data-restore-db]').forEach(function (tab) { tab.addEventListener('click', function () { restoreDatabase = tab.dataset.restoreDb; document.querySelectorAll('[data-restore-db]').forEach(function (item) { item.classList.toggle('active', item === tab); }); loadBackups(); }); });
+  $('renameUserBtn').addEventListener('click', openRenameUser);
+  els.confirmRenameUser.addEventListener('click', renameUser);
+  $('deleteUserBtn').addEventListener('click', openDeleteUser);
+  els.confirmDeleteUser.addEventListener('click', deleteUser);
+  $('backToUsers').addEventListener('click', function () { els.syncDetail.hidden = true; els.listView.hidden = false; state.syncUser = null; loadRecords(); loadSummary(); });
+  $('rawSyncBtn').addEventListener('click', function () { if (state.syncUser) openRecord(state.syncUser.id, 'sync'); });
+  $('refreshSyncBtn').addEventListener('click', function () { if (state.syncUser) openSyncUser(state.syncUser.id, true); });
+  els.syncSearch.addEventListener('input', function () { state.syncQuery = els.syncSearch.value.trim(); state.syncPage = 1; renderSyncItems(); });
+  els.syncCategory.addEventListener('change', function () { state.syncCategory = els.syncCategory.value; state.syncPage = 1; renderSyncItems(); });
+  els.syncPrev.addEventListener('click', function () { if (state.syncPage > 1) { state.syncPage--; renderSyncItems(); window.scrollTo(0, 0); } });
+  els.syncNext.addEventListener('click', function () { state.syncPage++; renderSyncItems(); window.scrollTo(0, 0); });
+  $('saveSyncItemBtn').addEventListener('click', saveSyncItem);
+  $('deleteSyncItemBtn').addEventListener('click', deleteSyncItem);
+  $('formatBtn').addEventListener('click', function () { try { els.data.value = prettyJson(els.data.value); } catch (_) { } validateJson(); });
+  els.data.addEventListener('input', validateJson);
+  els.saveRecord.addEventListener('click', saveRecord);
+  els.deleteRecord.addEventListener('click', function () { deleteRecord(state.editingId, state.editingDatabase); });
+  document.querySelectorAll('[data-close]').forEach(function (button) { button.addEventListener('click', function () { closeModal(button.dataset.close); }); });
+  document.querySelectorAll('.modal-backdrop').forEach(function (modal) { modal.addEventListener('click', function (event) { if (event.target === modal) closeModal(modal.id); }); });
+  document.addEventListener('keydown', function (event) {
+    if (event.key === 'Escape') document.querySelectorAll('.modal-backdrop.open').forEach(function (modal) { closeModal(modal.id); });
+    if ((event.ctrlKey || event.metaKey) && event.key.toLowerCase() === 's' && els.recordModal.classList.contains('open')) { event.preventDefault(); saveRecord(); }
+  });
+  $('themeBtn').addEventListener('click', function () { applyTheme(document.documentElement.dataset.theme === 'light' ? 'dark' : 'light'); });
+  applyTheme(localStorage.getItem('lampac-theme') || 'dark');
+  loadSummary(); loadTimeCodeUsers(); renderHead(); loadRecords();
+})();
@@ -0,0 +1,151 @@
+<!doctype html>
+<html lang="ru" data-theme="dark">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
+  <meta name="theme-color" content="#0c0e12" id="metaTheme">
+  <title>Базы — Lampac</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
+  <link rel="stylesheet" href="/database-editor/style.css">
+</head>
+<body>
+  <div class="app">
+    <header class="topbar">
+      <a class="topbar-logo" href="/database-editor">
+        <svg width="28" height="28" viewBox="0 0 28 28" fill="none" aria-hidden="true">
+          <rect x="2" y="2" width="24" height="24" rx="6" stroke="currentColor" stroke-width="1.5"/>
+          <rect x="7" y="16" width="3" height="6" rx="1" fill="var(--accent)"/>
+          <rect x="12.5" y="11" width="3" height="11" rx="1" fill="var(--accent)" opacity=".7"/>
+          <rect x="18" y="6" width="3" height="16" rx="1" fill="var(--accent)" opacity=".45"/>
+        </svg>
+        Lampac <span>Базы</span>
+      </a>
+      <div class="topbar-divider"></div>
+      <nav class="topbar-app-nav" aria-label="Разделы Lampac"><a href="/adminpanel">Admin</a><a href="/stats">Stats</a><a href="/weblog">Weblog</a><a href="/telemetry">Telemetry</a><a href="/database-editor" aria-current="page">Базы</a></nav>
+      <div class="topbar-spacer"></div>
+      <button class="icon-btn theme-btn" id="themeBtn" title="Переключить тему" aria-label="Переключить тему">
+        <svg class="theme-icon theme-icon-moon" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"/></svg>
+        <svg class="theme-icon theme-icon-sun" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="5"/><path d="M12 1v2M12 21v2M4.22 4.22l1.42 1.42M18.36 18.36l1.42 1.42M1 12h2M21 12h2M4.22 19.78l1.42-1.42M18.36 5.64l1.42-1.42"/></svg>
+      </button>
+    </header>
+
+    <main class="main">
+      <section id="listView">
+        <div class="hero">
+          <div><h1>Редактор TimeCode и Sync</h1><p>Пользователи, карточки, позиции просмотра и безопасные копии SQLite.</p></div>
+          <div class="hero-actions"><button class="btn" id="backupAllBtn">⇩ <span>Backup TimeCode + Sync</span></button><button class="btn" id="restoreBtn">↥ <span>Восстановить</span></button><button class="btn" id="renameUserBtn">Переименовать пользователя</button><button class="btn danger" id="deleteUserBtn">Удалить пользователя</button></div>
+        </div>
+
+        <section class="summary" id="summary"></section>
+
+        <section class="workspace">
+          <div class="toolbar">
+            <div class="db-tabs" role="tablist"><button class="db-tab active" data-db="timecode" role="tab">TimeCode</button><button class="db-tab" data-db="sync" role="tab">Sync</button></div>
+            <select class="select user-filter" id="timecodeUserFilter" title="Пользователь TimeCode"><option value="">Все пользователи TimeCode</option></select>
+            <div class="search"><span>⌕</span><input id="searchInput" type="search" placeholder="ID, пользователь, карточка или JSON…" autocomplete="off"></div>
+            <div class="toolbar-spacer"></div>
+            <select class="select" id="pageSize" title="Записей на странице"><option>25</option><option>50</option><option>100</option></select>
+            <button class="icon-btn" id="refreshBtn" title="Обновить" aria-label="Обновить">↻</button>
+          </div>
+          <div class="loading" id="loading"></div>
+          <div class="table-wrap">
+            <table class="data-table"><thead><tr id="tableHead"></tr></thead><tbody id="tableBody"></tbody></table>
+            <div class="empty" id="empty"><div><div class="empty-icon">⌕</div><strong>Записей не найдено</strong><div class="muted">Измените поиск или выберите другую базу.</div></div></div>
+          </div>
+          <div class="pager"><div class="pager-info" id="pagerInfo">—</div><div class="pager-buttons"><button class="icon-btn" id="prevBtn">←</button><span class="page-label" id="pageLabel">1 / 1</span><button class="icon-btn" id="nextBtn">→</button></div></div>
+        </section>
+      </section>
+
+      <section class="sync-detail" id="syncDetail" hidden>
+        <div class="detail-head">
+          <button class="btn" id="backToUsers">← Пользователи</button>
+          <div class="detail-identity"><div class="eyebrow">Sync-пользователь</div><h1 id="syncUserName">—</h1><div class="muted" id="syncUserMeta">—</div></div>
+          <div class="detail-actions"><button class="btn" id="rawSyncBtn">JSON целиком</button><button class="btn" id="refreshSyncBtn">↻ Обновить</button></div>
+        </div>
+        <div class="detail-toolbar">
+          <div class="search"><span>⌕</span><input id="syncSearch" type="search" placeholder="Название или ID карточки…" autocomplete="off"></div>
+          <select class="select" id="syncCategory"><option value="">Все категории</option></select>
+          <span class="result-count" id="syncResultCount"></span>
+        </div>
+        <div class="media-grid" id="syncGrid"></div>
+        <div class="empty sync-empty" id="syncEmpty"><div><div class="empty-icon">□</div><strong>Карточек не найдено</strong></div></div>
+        <div class="detail-pager"><button class="btn" id="syncPrev">← Назад</button><span id="syncPageLabel">1 / 1</span><button class="btn" id="syncNext">Вперёд →</button></div>
+      </section>
+    </main>
+  </div>
+
+  <div class="modal-backdrop" id="recordModal" role="dialog" aria-modal="true">
+    <div class="modal modal-wide">
+      <div class="modal-head"><span class="modal-title" id="recordModalTitle">Запись</span><span class="modal-id" id="recordModalId"></span><button class="icon-btn modal-close" data-close="recordModal">×</button></div>
+      <div class="modal-body"><div class="form-grid">
+        <div class="field full"><label for="userField">Пользователь</label><input id="userField" maxlength="512" autocomplete="off"></div>
+        <div class="field timecode-field"><label for="cardField">Карточка</label><input id="cardField" maxlength="512" autocomplete="off"></div>
+        <div class="field timecode-field"><label for="itemField">Элемент / hash</label><input id="itemField" maxlength="512" autocomplete="off"></div>
+        <div class="field full"><div class="json-tools"><label for="dataField">JSON-данные</label><button class="btn small" type="button" id="formatBtn">Форматировать</button><span class="json-status" id="jsonStatus"></span></div><textarea id="dataField" spellcheck="false"></textarea></div>
+      </div></div>
+      <div class="modal-foot"><button class="btn danger" id="deleteRecordBtn">Удалить</button><button class="btn" data-close="recordModal">Отмена</button><button class="btn primary" id="saveRecordBtn">Сохранить</button></div>
+    </div>
+  </div>
+
+  <div class="modal-backdrop" id="categoryModal" role="dialog" aria-modal="true">
+    <div class="modal modal-compact">
+      <div class="modal-head"><span class="modal-title">Категории карточки</span><button class="icon-btn modal-close" data-close="categoryModal">×</button></div>
+      <div class="modal-body">
+        <div class="category-card-head" id="categoryCardHead"></div>
+        <div class="category-options" id="categoryOptions"></div>
+        <p class="modal-hint">Изменяется только выбранная карточка. Остальные позиции пользователя останутся без изменений.</p>
+      </div>
+      <div class="modal-foot"><button class="btn danger" id="deleteSyncItemBtn">Удалить карточку</button><button class="btn" data-close="categoryModal">Отмена</button><button class="btn primary" id="saveSyncItemBtn">Сохранить категории</button></div>
+    </div>
+  </div>
+
+  <div class="modal-backdrop" id="renameUserModal" role="dialog" aria-modal="true">
+    <div class="modal modal-compact">
+      <div class="modal-head"><span class="modal-title">Переименовать пользователя</span><button class="icon-btn modal-close" data-close="renameUserModal">×</button></div>
+      <div class="modal-body"><div class="form-grid">
+        <div class="field full"><label for="oldUserField">Текущий пользователь</label><select class="select" id="oldUserField"><option value="">Загрузка пользователей…</option></select></div>
+        <div class="field full"><label for="newUserField">Новое имя</label><input id="newUserField" maxlength="512" autocomplete="off"></div>
+        <p class="modal-hint field full">Важно: перед переименованием выйдите из старой учётной записи на всех устройствах или заранее измените её логин/account_email в настройках Lampa и, если пользователь задан там, в init/AccsDB. Активный клиент со старым именем после обновления страницы создаст его в Sync и TimeCode повторно. Новое имя не должно быть занято.</p>
+      </div></div>
+      <div class="modal-foot"><button class="btn" data-close="renameUserModal">Отмена</button><button class="btn primary" id="confirmRenameUserBtn">Переименовать</button></div>
+    </div>
+  </div>
+
+  <div class="modal-backdrop" id="deleteUserModal" role="dialog" aria-modal="true">
+    <div class="modal modal-compact">
+      <div class="modal-head"><span class="modal-title">Удалить пользователя</span><button class="icon-btn modal-close" data-close="deleteUserModal">×</button></div>
+      <div class="modal-body"><div class="form-grid">
+        <div class="field full"><label for="deleteUserField">Пользователь</label><select class="select" id="deleteUserField"><option value="">Загрузка пользователей…</option></select></div>
+        <p class="modal-hint field full">Будут безвозвратно удалены все закладки Sync и все позиции TimeCode выбранного пользователя.</p>
+      </div></div>
+      <div class="modal-foot"><button class="btn" data-close="deleteUserModal">Отмена</button><button class="btn danger" id="confirmDeleteUserBtn">Удалить пользователя</button></div>
+    </div>
+  </div>
+
+  <div class="modal-backdrop" id="backupModal" role="dialog" aria-modal="true">
+    <div class="modal modal-compact">
+      <div class="modal-head"><span class="modal-title">Резервные копии созданы</span><button class="icon-btn modal-close" data-close="backupModal">×</button></div>
+      <div class="modal-body"><div class="backup-results" id="backupResults"></div></div>
+      <div class="modal-foot"><button class="btn primary" data-close="backupModal">Готово</button></div>
+    </div>
+  </div>
+
+  <div class="modal-backdrop" id="restoreModal" role="dialog" aria-modal="true">
+    <div class="modal modal-wide">
+      <div class="modal-head"><span class="modal-title">Восстановление базы</span><button class="icon-btn modal-close" data-close="restoreModal">×</button></div>
+      <div class="modal-body">
+        <p class="modal-hint restore-warning">Выберите резервную копию. Перед восстановлением текущая база будет автоматически сохранена в отдельный файл <code>before-restore</code>.</p>
+        <div class="restore-tabs"><button class="db-tab active" data-restore-db="sync">Sync</button><button class="db-tab" data-restore-db="timecode">TimeCode</button></div>
+        <div class="backup-results restore-results" id="restoreResults"></div>
+        <div class="empty restore-empty" id="restoreEmpty"><div><strong>Резервных копий нет</strong></div></div>
+      </div>
+      <div class="modal-foot"><button class="btn" data-close="restoreModal">Закрыть</button></div>
+    </div>
+  </div>
+
+  <div class="toast-wrap" id="toasts"></div>
+  <script src="/database-editor/app.js"></script>
+</body>
+</html>
@@ -0,0 +1,6 @@
+{
+  "enable": true,
+  "references": [
+    "Microsoft.Data.Sqlite"
+  ]
+}
@@ -0,0 +1,439 @@
+:root {
+  --font-body: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
+  --text-xs: .6875rem;
+  --text-sm: .8125rem;
+  --text-base: .875rem;
+  --text-lg: 1rem;
+  --text-xl: 1.25rem;
+  --sp-1: .25rem;
+  --sp-2: .5rem;
+  --sp-3: .75rem;
+  --sp-4: 1rem;
+  --sp-5: 1.25rem;
+  --sp-6: 1.5rem;
+  --sp-8: 2rem;
+  --r-sm: 6px;
+  --r-md: 8px;
+  --r-lg: 12px;
+  --r-xl: 16px;
+  --ease: cubic-bezier(.16, 1, .3, 1);
+  --dur: 180ms;
+}
+
+[data-theme="dark"] {
+  color-scheme: dark;
+  --bg: #0c0e12;
+  --surface: #13161d;
+  --surface-2: #1a1e28;
+  --surface-3: #222733;
+  --surface-hover: #2a3142;
+  --border: #2a3040;
+  --border-subtle: rgba(255, 255, 255, .06);
+  --text: #e2e6ef;
+  --text-muted: #7c849a;
+  --text-faint: #4d5568;
+  --accent: #3ec9d1;
+  --accent-soft: #2ea8b0;
+  --accent-dim: rgba(62, 201, 209, .12);
+  --accent-hover: rgba(62, 201, 209, .22);
+  --accent-glow: rgba(62, 201, 209, .06);
+  --ok: #4ade80;
+  --ok-dim: rgba(74, 222, 128, .12);
+  --warn: #facc15;
+  --warn-dim: rgba(250, 204, 21, .12);
+  --err: #f87171;
+  --err-dim: rgba(248, 113, 113, .12);
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);
+  --shadow-md: 0 4px 16px rgba(0, 0, 0, .35);
+  --shadow-lg: 0 12px 40px rgba(0, 0, 0, .45);
+  --overlay: rgba(0, 0, 0, .6);
+}
+
+[data-theme="light"] {
+  color-scheme: light;
+  --bg: #f4f5f8;
+  --surface: #fff;
+  --surface-2: #f0f1f5;
+  --surface-3: #e8eaf0;
+  --surface-hover: #e2e4ec;
+  --border: #d4d8e3;
+  --border-subtle: rgba(0, 0, 0, .06);
+  --text: #1a1e28;
+  --text-muted: #6b7280;
+  --text-faint: #9ca3af;
+  --accent: #0d9499;
+  --accent-soft: #0b7d82;
+  --accent-dim: rgba(13, 148, 153, .1);
+  --accent-hover: rgba(13, 148, 153, .18);
+  --accent-glow: rgba(13, 148, 153, .04);
+  --ok: #16a34a;
+  --ok-dim: rgba(22, 163, 74, .1);
+  --warn: #ca8a04;
+  --warn-dim: rgba(202, 138, 4, .1);
+  --err: #dc2626;
+  --err-dim: rgba(220, 38, 38, .1);
+  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .06);
+  --shadow-md: 0 4px 12px rgba(0, 0, 0, .08);
+  --shadow-lg: 0 12px 32px rgba(0, 0, 0, .12);
+  --overlay: rgba(0, 0, 0, .3);
+}
+
+*, *::before, *::after { box-sizing: border-box; }
+html, body { margin: 0; min-height: 100%; }
+html { background: var(--bg); }
+body {
+  min-width: 320px;
+  background: var(--bg);
+  color: var(--text);
+  font: var(--text-base)/1.5 var(--font-body);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+button, input, select, textarea { font: inherit; }
+button { cursor: pointer; }
+a { color: inherit; text-decoration: none; }
+[hidden] { display: none !important; }
+.muted { color: var(--text-muted); }
+
+::-webkit-scrollbar { width: 10px; height: 10px; }
+::-webkit-scrollbar-track { background: transparent; }
+::-webkit-scrollbar-thumb { background: var(--surface-3); border: 2px solid transparent; border-radius: 999px; background-clip: padding-box; }
+::-webkit-scrollbar-thumb:hover { background-color: var(--text-faint); }
+
+.app { min-height: 100dvh; }
+.topbar {
+  position: sticky;
+  top: 0;
+  z-index: 30;
+  display: flex;
+  align-items: center;
+  gap: var(--sp-4);
+  min-height: 52px;
+  padding: var(--sp-3) var(--sp-6);
+  padding-top: max(var(--sp-3), env(safe-area-inset-top, 0px));
+  padding-left: max(var(--sp-6), env(safe-area-inset-left, 0px));
+  padding-right: max(var(--sp-6), env(safe-area-inset-right, 0px));
+  background: color-mix(in srgb, var(--surface) 94%, transparent);
+  border-bottom: 1px solid var(--border);
+  backdrop-filter: blur(16px);
+}
+.topbar-logo {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  gap: var(--sp-2);
+  color: var(--text);
+  font-size: var(--text-lg);
+  font-weight: 700;
+  letter-spacing: -.02em;
+  white-space: nowrap;
+}
+.topbar-logo svg { flex-shrink: 0; }
+.topbar-logo span { margin-left: 2px; color: var(--text-muted); font-weight: 400; }
+.topbar-divider { width: 1px; height: 24px; flex-shrink: 0; background: var(--border); }
+.topbar-app-nav { display: flex; flex-shrink: 0; align-items: center; gap: var(--sp-2); }
+.topbar-app-nav a {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 5.75rem;
+  min-height: 34px;
+  padding: 6px 12px;
+  border: 1px solid var(--border);
+  border-radius: var(--r-md);
+  background: var(--surface-2);
+  color: var(--text-muted);
+  font-size: var(--text-xs);
+  font-weight: 600;
+  white-space: nowrap;
+  transition: background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
+}
+.topbar-app-nav a:hover { background: var(--surface-3); color: var(--text); }
+.topbar-app-nav a[aria-current="page"] { border-color: var(--accent); background: var(--surface); color: var(--accent); box-shadow: var(--shadow-sm); }
+.topbar-spacer { flex: 1; min-width: var(--sp-2); }
+.theme-icon { display: block; }
+.theme-icon-sun { display: none; }
+[data-theme="dark"] .theme-icon-moon { display: none; }
+[data-theme="dark"] .theme-icon-sun { display: block; }
+
+.main { width: 100%; max-width: 1500px; margin: 0 auto; padding: var(--sp-6) var(--sp-6) 3rem; }
+.hero { display: flex; align-items: center; gap: var(--sp-6); margin-bottom: var(--sp-5); }
+.hero > div:first-child { min-width: 260px; }
+.hero h1, .detail-head h1 { margin: 0 0 var(--sp-1); font-size: var(--text-xl); line-height: 1.25; letter-spacing: -.025em; }
+.hero p { max-width: 720px; margin: 0; color: var(--text-muted); font-size: var(--text-sm); }
+.hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: var(--sp-2); margin-left: auto; }
+
+.icon-btn, .btn, .mini-btn {
+  border: 1px solid var(--border);
+  border-radius: var(--r-md);
+  background: var(--surface-2);
+  color: var(--text-muted);
+  font-size: var(--text-xs);
+  font-weight: 600;
+  transition: transform var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
+}
+.icon-btn, .btn { display: inline-flex; min-height: 34px; align-items: center; justify-content: center; gap: var(--sp-2); }
+.icon-btn { width: 34px; min-width: 34px; padding: 0; }
+.btn { padding: 6px 14px; white-space: nowrap; }
+.icon-btn:hover, .btn:hover, .mini-btn:hover { border-color: var(--accent); background: var(--accent-dim); color: var(--accent); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
+.btn.primary { border-color: var(--accent); background: var(--accent); color: #fff; }
+.btn.primary:hover { border-color: var(--accent-soft); background: var(--accent-soft); color: #fff; }
+.btn.danger { border-color: color-mix(in srgb, var(--err) 65%, var(--border)); background: var(--err-dim); color: var(--err); }
+.btn.danger:hover { border-color: var(--err); background: color-mix(in srgb, var(--err) 18%, transparent); color: var(--err); }
+.btn.small { min-height: 28px; padding: 4px 10px; }
+.btn:disabled, .icon-btn:disabled, .mini-btn:disabled { cursor: not-allowed; opacity: .45; transform: none; box-shadow: none; }
+button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+
+.summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); margin-bottom: var(--sp-4); }
+.summary-card {
+  position: relative;
+  overflow: hidden;
+  min-width: 0;
+  padding: var(--sp-4);
+  border: 1px solid var(--border);
+  border-radius: var(--r-lg);
+  background: var(--surface);
+  box-shadow: var(--shadow-sm);
+}
+.summary-card::before { position: absolute; inset: 0 0 auto; height: 2px; background: linear-gradient(90deg, var(--accent), transparent 72%); content: ""; opacity: .75; }
+.summary-head { display: flex; justify-content: space-between; gap: var(--sp-2); color: var(--text-muted); font-size: var(--text-xs); }
+.summary-value { margin: var(--sp-2) 0 var(--sp-1); color: var(--text); font-size: 1.45rem; font-weight: 700; letter-spacing: -.03em; }
+.summary-foot { display: flex; align-items: center; gap: var(--sp-3); margin-top: var(--sp-2); }
+.summary-meta { flex: 1; overflow: hidden; color: var(--text-faint); font: var(--text-xs) var(--font-mono); text-overflow: ellipsis; white-space: nowrap; }
+.summary-backup { padding: 0; border: 0; background: transparent; color: var(--accent); font-size: var(--text-xs); font-weight: 600; }
+.summary-backup:hover { color: var(--accent-soft); }
+.available { color: var(--ok); }
+.missing { color: var(--err); }
+
+.workspace, .sync-detail { overflow: hidden; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-md); }
+.toolbar, .detail-toolbar { display: flex; min-height: 58px; align-items: center; gap: var(--sp-3); padding: 10px var(--sp-3); border-bottom: 1px solid var(--border); background: var(--surface); }
+.db-tabs, .restore-tabs { display: flex; gap: 2px; padding: 3px; border: 1px solid var(--border-subtle); border-radius: var(--r-md); background: var(--surface-2); }
+.db-tab { padding: 5px 12px; border: 0; border-radius: 5px; background: transparent; color: var(--text-muted); font-size: var(--text-xs); font-weight: 600; white-space: nowrap; transition: all var(--dur) var(--ease); }
+.db-tab:hover { color: var(--text); }
+.db-tab.active { background: var(--surface-3); color: var(--accent); box-shadow: var(--shadow-sm); }
+.search { position: relative; flex: 1; max-width: 560px; }
+.search input, .select, .field input, .field textarea {
+  border: 1px solid var(--border);
+  border-radius: var(--r-md);
+  background: var(--surface-2);
+  color: var(--text);
+  outline: none;
+  transition: border-color var(--dur) var(--ease), background var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
+}
+.search input { width: 100%; height: 34px; padding: 0 12px 0 35px; font-size: var(--text-sm); }
+.search input::placeholder, .field input::placeholder, .field textarea::placeholder { color: var(--text-faint); }
+.search > span { position: absolute; top: 6px; left: 11px; z-index: 1; color: var(--text-faint); font-size: 17px; pointer-events: none; }
+.search input:focus, .select:focus, .field input:focus, .field textarea:focus { border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 3px var(--accent-dim); }
+.toolbar-spacer { flex: 1; }
+.select { height: 34px; padding: 0 30px 0 10px; color: var(--text-muted); font-size: var(--text-xs); }
+.user-filter { width: clamp(210px, 22vw, 330px); }
+
+.loading { height: 2px; overflow: hidden; background: transparent; }
+.loading::after { display: block; width: 35%; height: 100%; background: var(--accent); content: ""; transform: translateX(-110%); }
+.loading.active::after { animation: load 1s infinite var(--ease); }
+@keyframes load { to { transform: translateX(310%); } }
+
+.table-wrap { min-height: 370px; overflow: auto; }
+.data-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
+.data-table th { position: sticky; top: 0; z-index: 2; height: 38px; padding: 0 var(--sp-3); border-bottom: 1px solid var(--border); background: var(--surface-2); color: var(--text-faint); font-size: var(--text-xs); font-weight: 600; letter-spacing: .05em; text-align: left; text-transform: uppercase; }
+.data-table td { padding: var(--sp-3); border-bottom: 1px solid var(--border-subtle); vertical-align: middle; }
+.data-table tbody tr { transition: background var(--dur) var(--ease); }
+.data-table tbody tr:hover { background: var(--accent-glow); }
+.col-id { width: 70px; }
+.col-user { width: 250px; }
+.col-media { width: 340px; }
+.col-progress { width: 240px; }
+.col-date { width: 170px; }
+.col-actions { width: 190px; }
+.mono { font-family: var(--font-mono); }
+.record-user { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
+.record-sub { overflow: hidden; margin-top: 3px; color: var(--text-faint); font: var(--text-xs) var(--font-mono); text-overflow: ellipsis; white-space: nowrap; }
+.preview { display: -webkit-box; overflow: hidden; color: var(--text-muted); font: var(--text-xs)/1.5 var(--font-mono); overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
+.row-actions { display: flex; justify-content: flex-end; gap: 5px; }
+.mini-btn { display: inline-flex; height: 31px; align-items: center; justify-content: center; padding: 0 9px; }
+.mini-btn.delete:hover { border-color: var(--err); background: var(--err-dim); color: var(--err); }
+.media-cell { display: flex; min-width: 0; align-items: center; gap: 11px; }
+.poster, .poster-placeholder { width: 46px; height: 68px; flex: 0 0 46px; border: 1px solid var(--border); border-radius: var(--r-sm); background: var(--surface-3); object-fit: cover; }
+.poster-placeholder { display: grid; place-items: center; color: var(--text-faint); font-size: 20px; }
+.media-copy { min-width: 0; }
+.media-title { overflow: hidden; color: var(--text); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
+.media-meta { overflow: hidden; margin-top: 3px; color: var(--text-muted); font-size: var(--text-xs); text-overflow: ellipsis; white-space: nowrap; }
+.type-badge, .category-tag { display: inline-flex; border: 1px solid color-mix(in srgb, var(--accent) 25%, transparent); border-radius: 4px; background: var(--accent-dim); color: var(--accent); font-size: .625rem; }
+.type-badge { margin-right: 5px; padding: 1px 5px; text-transform: uppercase; }
+.progress-track { height: 5px; overflow: hidden; margin: 7px 0 5px; border-radius: 999px; background: var(--surface-3); }
+.progress-fill { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent-soft), var(--accent)); }
+.progress-copy { display: flex; justify-content: space-between; color: var(--text-muted); font: var(--text-xs) var(--font-mono); }
+
+.empty { display: none; min-height: 360px; place-items: center; padding: var(--sp-6); color: var(--text-muted); text-align: center; }
+.empty.show { display: grid; }
+.empty-icon { display: grid; width: 52px; height: 52px; margin: 0 auto var(--sp-3); place-items: center; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface-2); color: var(--text-faint); }
+.pager, .detail-pager { display: flex; min-height: 54px; align-items: center; gap: var(--sp-2); padding: 9px var(--sp-3); border-top: 1px solid var(--border); background: var(--surface); }
+.pager-info, .page-label { color: var(--text-muted); font-size: var(--text-xs); }
+.pager-buttons { display: flex; gap: 6px; margin-left: auto; }
+.page-label { display: flex; align-items: center; padding: 0 9px; font-family: var(--font-mono); }
+
+.detail-head { display: flex; align-items: center; gap: var(--sp-5); padding: var(--sp-4); border-bottom: 1px solid var(--border); background: var(--surface); }
+.detail-identity { min-width: 0; }
+.detail-identity h1 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.eyebrow { margin-bottom: var(--sp-1); color: var(--accent); font-size: var(--text-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
+.detail-actions { display: flex; gap: var(--sp-2); margin-left: auto; }
+.detail-toolbar .result-count { margin-left: auto; color: var(--text-muted); font: var(--text-xs) var(--font-mono); white-space: nowrap; }
+.media-grid { display: grid; min-height: 380px; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: var(--sp-3); padding: var(--sp-3); }
+.sync-card { display: flex; min-width: 0; min-height: 132px; gap: var(--sp-3); padding: 10px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
+.sync-card:hover { border-color: var(--accent); transform: translateY(-1px); box-shadow: var(--shadow-sm); }
+.sync-card .poster, .sync-card .poster-placeholder { width: 74px; height: 110px; flex-basis: 74px; }
+.sync-card-body { display: flex; min-width: 0; flex: 1; flex-direction: column; }
+.sync-card-title { display: -webkit-box; overflow: hidden; font-weight: 600; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
+.sync-card-meta { margin-top: var(--sp-1); color: var(--text-muted); font: var(--text-xs) var(--font-mono); }
+.category-tags { display: flex; flex-wrap: wrap; gap: 4px; margin: var(--sp-2) 0; }
+.category-tag { padding: 2px 6px; }
+.category-tag.empty-tag { border-color: var(--border); background: var(--surface-3); color: var(--text-faint); }
+.sync-card-actions { display: flex; gap: 5px; margin-top: auto; }
+.sync-card-actions .btn { min-height: 28px; padding: 4px 9px; }
+.sync-empty { min-height: 360px; }
+.detail-pager { justify-content: center; gap: var(--sp-4); }
+
+.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; padding: var(--sp-5); background: var(--overlay); backdrop-filter: blur(5px); }
+.modal-backdrop.open { display: flex; }
+.modal { display: flex; overflow: hidden; width: min(850px, 100%); max-height: calc(100dvh - 40px); flex-direction: column; border: 1px solid var(--border); border-radius: var(--r-lg); background: var(--surface); box-shadow: var(--shadow-lg); }
+.modal-compact { width: min(600px, 100%); }
+.modal-head, .modal-foot { display: flex; align-items: center; gap: 10px; padding: var(--sp-3) var(--sp-4); background: var(--surface-2); }
+.modal-head { border-bottom: 1px solid var(--border); }
+.modal-foot { justify-content: flex-end; border-top: 1px solid var(--border); }
+.modal-title { color: var(--text); font-size: var(--text-lg); font-weight: 700; }
+.modal-id { color: var(--text-faint); font: var(--text-xs) var(--font-mono); }
+.modal-close { margin-left: auto; }
+.modal-body { overflow: auto; padding: var(--sp-4); }
+.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); }
+.field { display: flex; min-width: 0; flex-direction: column; gap: 6px; }
+.field.full { grid-column: 1 / -1; }
+.field label { color: var(--text-muted); font-size: var(--text-xs); font-weight: 600; }
+.field input, .field textarea { width: 100%; padding: 9px 10px; }
+.field textarea { min-height: 340px; resize: vertical; font: var(--text-xs)/1.55 var(--font-mono); tab-size: 2; }
+.json-tools { display: flex; align-items: center; gap: var(--sp-2); }
+.json-status { color: var(--text-faint); font-size: var(--text-xs); }
+.json-status.ok { color: var(--ok); }
+.json-status.bad { color: var(--err); }
+.category-card-head { display: flex; align-items: center; gap: var(--sp-3); margin-bottom: var(--sp-3); padding-bottom: var(--sp-3); border-bottom: 1px solid var(--border); }
+.category-card-head .poster, .category-card-head .poster-placeholder { width: 54px; height: 80px; flex-basis: 54px; }
+.category-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-2); }
+.category-section-title { grid-column: 1 / -1; margin-top: 7px; padding-top: var(--sp-3); border-top: 1px solid var(--border); color: var(--text-muted); font-size: var(--text-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
+.category-option { position: relative; }
+.category-option input { position: absolute; opacity: 0; }
+.category-option label { display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); color: var(--text-muted); cursor: pointer; transition: all var(--dur) var(--ease); }
+.category-option label::before { width: 15px; height: 15px; flex-shrink: 0; border: 1px solid var(--text-faint); border-radius: 4px; content: ""; }
+.category-option.status-option label::before { border-radius: 50%; }
+.category-option input:focus-visible + label { outline: 2px solid var(--accent); outline-offset: 2px; }
+.category-option input:checked + label { border-color: var(--accent); background: var(--accent-dim); color: var(--text); }
+.category-option input:checked + label::before { border-color: var(--accent); background: var(--accent); box-shadow: inset 0 0 0 3px var(--surface-2); }
+.modal-hint { margin: var(--sp-3) 0 0; color: var(--text-muted); font-size: var(--text-xs); }
+.backup-results { display: flex; flex-direction: column; gap: 10px; }
+.backup-result { padding: var(--sp-3); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); }
+.backup-result strong { display: block; margin-bottom: 5px; }
+.backup-path { color: var(--text-muted); font: var(--text-xs)/1.5 var(--font-mono); overflow-wrap: anywhere; }
+.restore-warning { margin: 0 0 var(--sp-3); padding: var(--sp-3); border: 1px solid color-mix(in srgb, var(--err) 45%, var(--border)); border-radius: var(--r-md); background: var(--err-dim); color: var(--err); }
+.restore-tabs { width: max-content; margin-bottom: var(--sp-3); }
+.restore-result { display: flex; align-items: center; gap: var(--sp-3); }
+.restore-info { min-width: 0; flex: 1; }
+.restore-result .btn { flex: 0 0 auto; }
+.restore-empty { min-height: 160px; }
+.restore-empty:not(.show) { display: none; }
+
+.toast-wrap { position: fixed; right: 18px; bottom: 18px; z-index: 200; display: flex; flex-direction: column; gap: var(--sp-2); }
+.toast { width: min(390px, calc(100vw - 36px)); padding: var(--sp-3) var(--sp-4); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); color: var(--text); box-shadow: var(--shadow-lg); animation: toast-in var(--dur) var(--ease); }
+.toast.good { border-left: 3px solid var(--ok); }
+.toast.bad { border-left: 3px solid var(--err); }
+@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }
+
+@media (max-width: 1120px) {
+  .hero { align-items: flex-start; }
+  .hero-actions { max-width: 620px; }
+  .toolbar { flex-wrap: wrap; }
+  .toolbar .search { order: 3; max-width: none; flex-basis: 100%; }
+  .toolbar .user-filter { flex: 1; width: auto; }
+  .toolbar-spacer { display: none; }
+  .data-table { min-width: 1060px; }
+  .detail-head { align-items: flex-start; flex-wrap: wrap; }
+  .detail-actions { margin-left: 0; }
+  .detail-toolbar { flex-wrap: wrap; }
+  .detail-toolbar .search { max-width: none; flex-basis: 100%; }
+  .detail-toolbar .result-count { margin-left: 0; }
+}
+
+@media (max-width: 900px) {
+  .topbar { display: grid; grid-template-columns: auto 1fr auto; gap: var(--sp-2) var(--sp-3); padding: var(--sp-2) var(--sp-3); }
+  .topbar-logo { grid-column: 1; grid-row: 1; }
+  .topbar-spacer { display: block; grid-column: 2; grid-row: 1; }
+  .theme-btn { grid-column: 3; grid-row: 1; }
+  .topbar-divider { display: none; }
+  .topbar-app-nav { grid-column: 1 / -1; grid-row: 2; width: 100%; min-width: 0; overflow-x: auto; padding-top: var(--sp-2); border-top: 1px solid var(--border-subtle); scrollbar-width: none; }
+  .topbar-app-nav::-webkit-scrollbar { display: none; }
+  .topbar-app-nav a { min-width: 5.25rem; min-height: 42px; padding: 9px 13px; font-size: var(--text-sm); }
+  .main { padding: var(--sp-4) var(--sp-3) 2.25rem; }
+  .hero { display: block; }
+  .hero-actions { justify-content: flex-start; max-width: none; margin: var(--sp-3) 0 0; }
+  .summary { grid-template-columns: 1fr; }
+}
+
+@media (max-width: 720px) {
+  .toolbar .db-tabs { order: 1; flex: 1 0 100%; }
+  .toolbar .db-tab { flex: 1; }
+  .toolbar .user-filter { order: 2; width: 100%; min-width: 0; flex: 1 0 100%; }
+  .toolbar .search { order: 3; flex: 1 0 100%; }
+  .toolbar #pageSize { order: 4; flex: 1; }
+  .toolbar #refreshBtn { order: 4; }
+  .data-table.timecode-table, .data-table.sync-table { display: block; width: 100%; min-width: 0; border-collapse: separate; table-layout: auto; }
+  .timecode-table thead, .sync-table thead { display: none; }
+  .timecode-table tbody, .sync-table tbody { display: grid; gap: 10px; padding: 10px; }
+  .timecode-table tr, .sync-table tr { display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 12px; padding: var(--sp-3); border: 1px solid var(--border); border-radius: var(--r-md); background: var(--surface-2); }
+  .timecode-table td, .sync-table td { display: block; min-width: 0; padding: 0; border: 0; }
+  .timecode-table td:nth-child(1), .sync-table td:nth-child(1) { grid-column: 2; grid-row: 1; color: var(--text-faint); font: var(--text-xs) var(--font-mono); text-align: right; }
+  .timecode-table td:nth-child(2), .sync-table td:nth-child(2) { grid-column: 1; grid-row: 1; }
+  .timecode-table td:nth-child(3) { grid-column: 1 / -1; grid-row: 2; padding-top: 10px; border-top: 1px solid var(--border); }
+  .timecode-table td:nth-child(4) { grid-column: 1 / -1; grid-row: 3; }
+  .timecode-table td:nth-child(5) { grid-column: 1; grid-row: 4; align-self: center; color: var(--text-muted); font-size: var(--text-xs); }
+  .timecode-table td:nth-child(5)::before, .sync-table td:nth-child(3)::before { content: "Обновлено: "; }
+  .timecode-table td:nth-child(6) { display: flex; grid-column: 2; grid-row: 4; align-items: center; justify-content: flex-end; }
+  .sync-table td:nth-child(3) { grid-column: 1 / -1; grid-row: 2; padding-top: 10px; border-top: 1px solid var(--border); color: var(--text-muted); font-size: var(--text-xs); }
+  .sync-table td:nth-child(4) { display: flex; grid-column: 1 / -1; grid-row: 3; align-items: center; justify-content: flex-end; }
+  .sync-table td:nth-child(4) .mini-btn:not(.delete) { flex: 1; }
+  .sync-table td:nth-child(4) .mini-btn.delete { flex: 0 0 40px; }
+  .timecode-table .poster, .timecode-table .poster-placeholder { width: 52px; height: 78px; flex-basis: 52px; }
+  .timecode-table .media-title { display: -webkit-box; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
+  .timecode-table .media-meta { white-space: normal; }
+  .timecode-table .progress-copy { gap: var(--sp-3); }
+  .timecode-table tbody tr:hover, .sync-table tbody tr:hover { background: var(--surface-2); }
+}
+
+@media (max-width: 600px) {
+  .topbar-logo span { display: none; }
+  .hero-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
+  .hero-actions .btn { min-width: 0; white-space: normal; text-align: center; }
+  .media-grid { grid-template-columns: 1fr; padding: 9px; }
+  .form-grid, .category-options { grid-template-columns: 1fr; }
+  .field.full { grid-column: auto; }
+  .modal-backdrop { padding: 0; }
+  .modal { width: 100%; height: 100dvh; max-height: none; border: 0; border-radius: 0; }
+  .modal-foot { flex-wrap: wrap; }
+  .detail-head { gap: 10px; }
+  .detail-identity { order: 3; flex-basis: 100%; }
+  .detail-actions { margin-left: auto; }
+  .detail-actions .btn { padding: 6px 9px; }
+  .restore-result { align-items: flex-start; flex-direction: column; }
+  .restore-result .btn { width: 100%; }
+}
+
+@media (max-width: 430px) {
+  .topbar { padding-right: var(--sp-2); padding-left: var(--sp-2); }
+  .topbar-app-nav a { min-width: 5rem; }
+  .main { padding-right: var(--sp-2); padding-left: var(--sp-2); }
+  .hero-actions { grid-template-columns: 1fr; }
+  .summary-card { padding: var(--sp-3); }
+  .pager { flex-wrap: wrap; }
+  .pager-buttons { margin-left: 0; }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
+}