docs: скриншоты UI (светлая/тёмная тема) в app/docs и README

- app/docs/screenshots.md и каталог app/docs/images/*.png
- раздача /static/docs-images/* из FastAPI; documentation.js переписывает src картинок
- стили .markdown-body img; строка в api_routes.md; превью в README

app/static/js/documentation.js

@@ -139,6 +139,33 @@
     });
   }
 
+  /**
+   * Картинки из app/docs/*.md с src вида images/foo.png → /static/docs-images/foo.png
+   * (каталог app/docs/images смонтирован в FastAPI как StaticFiles).
+   */
+  function rewriteMdImages(container, currentDocPath) {
+    if (!currentDocPath || currentDocPath.indexOf("app/docs/") !== 0) return;
+    var baseDir = currentDocPath.replace(/[^/]+\.md$/i, "");
+    if (!baseDir) return;
+    container.querySelectorAll("img[src]").forEach(function (img) {
+      var src = (img.getAttribute("src") || "").trim();
+      if (!src || /^https?:\/\//i.test(src) || src.startsWith("data:")) return;
+      if (src.indexOf("..") >= 0) return;
+      if (src.startsWith("/static/docs-images/")) return;
+      try {
+        var u = new URL(src, "http://doc.local/" + baseDir);
+        var pathname = decodeURIComponent(u.pathname.replace(/^\/+/, ""));
+        if (pathname.indexOf("..") >= 0) return;
+        if (!pathname.startsWith("app/docs/images/")) return;
+        var rest = pathname.replace(/^app\/docs\/images\/?/, "");
+        if (!rest) return;
+        img.setAttribute("src", "/static/docs-images/" + rest);
+      } catch (e) {
+        /* ignore */
+      }
+    });
+  }
+
   /** Текст первого H1 в разобранном HTML (для заголовка вкладки). */
   function extractFirstH1Text(root) {
     var h = root.querySelector("h1");
@@ -261,6 +288,7 @@
       var temp = document.createElement("div");
       temp.innerHTML = DOMPurify.sanitize(rawHtml);
       rewriteMdLinks(temp, docPath);
+      rewriteMdImages(temp, docPath);
 
       var h1ForTitle = extractFirstH1Text(temp);
       applyDocumentationTabTitle(h1ForTitle);

app/static/style.css

@@ -2935,6 +2935,16 @@ button.btn-danger:hover {
 .readme-section-card.markdown-body li {
   margin: 0.2rem 0;
 }
+
+/* Скриншоты в app/docs/screenshots.md: не вылезают за карточку */
+.readme-section-card.markdown-body img {
+  max-width: 100%;
+  height: auto;
+  border-radius: 8px;
+  margin: 0.5rem 0;
+  border: 1px solid var(--color-border-subtle, rgba(128, 128, 128, 0.25));
+}
+
 .readme-section-card.markdown-body a {
   color: var(--accent);
   text-decoration: underline;