feat: adopt per-bot account api key for gateway attribution and improve post distinctness

- Add `account_api_key` field to `BotState` and `_adopt_account_api_key()` method that fetches the bot's own `users.api_key` from its profile JSON after auth, switching `LLMClient` to use it instead of the shared bootstrap key, routing gateway spend through the bot's user identity
- Replace `interleave_by_author` with a simpler greedy algorithm that picks the first row whose owner differs from the last picked, removing the multi-queue priority logic
- Extend `_ai_quota` response with `unlimited`, `requests`, and `last_used` fields sourced from new `user_spend_24h()` analytics helper
- Pass `recent_post_titles` from `BotState` into `LLMClient.generate_post()` and add a `distinct_rule` prompt instructing the model to avoid repeating framing, examples, or opinions from the bot's last six posts
- Remove early-return dedup check in `ArticleRegistry.admit` that skipped articles already held by the same bot owner, allowing re-admission under a different category
- Render bot username as a clickable link with avatar in the admin bots table

devplacepy/static/css/base.css

@@ -816,6 +816,40 @@ button.comment-form-submit:hover {
     background: var(--accent-hover);
 }
 
+@media (max-width: 768px) {
+    .comment-action-btn .label,
+    .comment-form-actions .label,
+    .comment-actions .reaction-add-label {
+        display: none;
+    }
+
+    .comment-action-btn,
+    .comment-form-actions button {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+    }
+
+    .comment-action-btn .icon,
+    .comment-form-actions .icon {
+        margin: 0;
+    }
+}
+
+@media (max-width: 768px) {
+    .post-detail-actions .label,
+    .post-detail-actions .bookmark-label,
+    .post-detail-actions .reaction-add-label,
+    .gist-detail-actions .label,
+    .gist-detail-actions .bookmark-label,
+    .gist-detail-actions .reaction-add-label,
+    .project-detail-actions .label,
+    .project-detail-actions .bookmark-label,
+    .project-detail-actions .reaction-add-label {
+        display: none;
+    }
+}
+
 @media (max-width: 360px) {
     .comment-form {
         flex-wrap: wrap;

devplacepy/static/css/engagement.css

@@ -13,6 +13,10 @@
     gap: var(--space-sm);
 }
 
+.reaction-list:not(:has(.reaction-chip:not([hidden]))) {
+    display: none;
+}
+
 .reaction-chip {
     display: inline-flex;
     align-items: center;
@@ -59,25 +63,28 @@
 .reaction-add-btn {
     display: inline-flex;
     align-items: center;
-    gap: var(--space-xs);
-    padding: 0.15rem 0.6rem;
-    border: 1px dashed var(--border-light);
-    border-radius: 999px;
-    background: transparent;
+    gap: 0.375rem;
+    padding: 0.375rem 0.75rem;
+    border: none;
+    border-radius: var(--radius);
+    background: none;
     color: var(--text-muted);
-    font-size: 0.85rem;
-    line-height: 1.4;
+    font-size: 0.8125rem;
+    font-weight: 500;
+    line-height: 1;
     cursor: pointer;
-    transition: border-color 0.15s, color 0.15s;
+    transition: color 0.15s;
 }
 
 .reaction-add-btn:hover {
     color: var(--accent);
-    border-color: var(--accent);
 }
 
 .reaction-add-icon {
     font-size: 1rem;
+    width: 20px;
+    text-align: center;
+    flex-shrink: 0;
     line-height: 1;
 }
 
@@ -103,6 +110,14 @@
     display: none;
 }
 
+@media (max-width: 768px) {
+    .reaction-palette {
+        flex-wrap: wrap;
+        justify-content: flex-start;
+        max-width: calc(100vw - 2 * var(--space-md));
+    }
+}
+
 .reaction-palette-btn {
     background: transparent;
     border: none;

devplacepy/static/css/services.css

@@ -194,6 +194,18 @@
     letter-spacing: 0.5px;
 }
 
+.metric-link {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.375rem;
+    color: var(--accent);
+    text-decoration: none;
+}
+
+.metric-link:hover {
+    text-decoration: underline;
+}
+
 .meta-item {
     white-space: nowrap;
 }

devplacepy/static/js/CommentManager.js

@@ -89,12 +89,12 @@ export class CommentManager {
         actions.className = "comment-form-actions";
         const save = document.createElement("button");
         save.type = "submit";
-        save.className = "btn btn-primary btn-sm";
-        save.textContent = "Save";
+        save.className = "btn btn-primary btn-sm comment-form-submit";
+        save.innerHTML = '<span class="icon">&#x1F4BE;</span><span class="label"> Save</span>';
         const cancel = document.createElement("button");
         cancel.type = "button";
-        cancel.className = "comment-action-btn";
-        cancel.textContent = "Cancel";
+        cancel.className = "comment-action-btn comment-form-cancel";
+        cancel.innerHTML = '<span class="icon">&#x2715;</span><span class="label"> Cancel</span>';
         cancel.addEventListener("click", () => {
             form.remove();
             text.style.display = "";
@@ -174,8 +174,8 @@ export class CommentManager {
 
         const cancel = document.createElement("button");
         cancel.type = "button";
-        cancel.className = "comment-action-btn comment-reply-cancel";
-        cancel.textContent = "Cancel";
+        cancel.className = "comment-action-btn comment-reply-cancel comment-form-cancel";
+        cancel.innerHTML = '<span class="icon">&#x2715;</span><span class="label"> Cancel</span>';
         cancel.addEventListener("click", () => form.remove());
         form.querySelector(".comment-form-actions").appendChild(cancel);
 

devplacepy/static/js/DeviiTerminal.js

@@ -9,6 +9,7 @@ export class DeviiTerminal {
         this.element = null;
         this.avatar = null;
         this.bindEscapeTrigger();
+        this.bindDoubleClickTrigger();
         this.ready = this.init();
     }
 
@@ -55,8 +56,36 @@ export class DeviiTerminal {
         );
     }
 
+    bindDoubleClickTrigger() {
+        document.addEventListener("dblclick", (event) => this._onDoubleClick(event));
+    }
+
+    _onDoubleClick(event) {
+        const terminal = event.target.closest("container-terminal");
+        if (terminal) {
+            if (!this._isInteractive(event.target)) terminal.close();
+            return;
+        }
+        const devii = event.target.closest("devii-terminal");
+        if (devii) {
+            if (this.element && this.element.state !== "closed" && !this._isInteractive(event.target)) {
+                this.close();
+            }
+            return;
+        }
+        if (this._canOpenOnGesture()) this.open();
+    }
+
+    _isInteractive(target) {
+        return !!target.closest("button, a, input, textarea, select");
+    }
+
     _canTriggerOnEscape() {
         if (this.element && this.element.state !== "closed") return false;
+        return this._canOpenOnGesture();
+    }
+
+    _canOpenOnGesture() {
         if (document.querySelector(".modal-overlay.visible")) return false;
         if (document.querySelector(".dialog-overlay.visible")) return false;
         if (document.querySelector(".context-menu.visible")) return false;

devplacepy/static/js/ReactionBar.js

@@ -29,6 +29,36 @@ export class ReactionBar extends OptimisticAction {
         const isOpen = palette.hidden === false;
         this.closeAllPalettes();
         palette.hidden = isOpen;
+        if (!palette.hidden) {
+            this.clampToViewport(palette);
+            this.ensureInView(palette);
+        }
+    }
+
+    clampToViewport(palette) {
+        const margin = 8;
+        palette.style.left = "";
+        const rect = palette.getBoundingClientRect();
+        const overflowRight = rect.right - (window.innerWidth - margin);
+        if (overflowRight > 0) {
+            palette.style.left = `${-overflowRight}px`;
+        }
+        const adjusted = palette.getBoundingClientRect();
+        if (adjusted.left < margin) {
+            const current = parseFloat(palette.style.left || "0");
+            palette.style.left = `${current + (margin - adjusted.left)}px`;
+        }
+    }
+
+    ensureInView(palette) {
+        const margin = 8;
+        const rect = palette.getBoundingClientRect();
+        const extra = rect.height * 0.3;
+        if (rect.top < margin) {
+            window.scrollBy({ top: rect.top - margin - extra, behavior: "smooth" });
+        } else if (rect.bottom > window.innerHeight - margin) {
+            window.scrollBy({ top: rect.bottom - (window.innerHeight - margin) + extra, behavior: "smooth" });
+        }
     }
 
     closeAllPalettes() {

devplacepy/static/js/ServiceMonitor.js

@@ -191,7 +191,7 @@ class ServiceMonitor {
                 const tr = document.createElement("tr");
                 for (const cell of row) {
                     const td = document.createElement("td");
-                    td.textContent = String(cell);
+                    this.renderCell(td, cell);
                     tr.appendChild(td);
                 }
                 tbody.appendChild(tr);
@@ -201,6 +201,24 @@ class ServiceMonitor {
         }
     }
 
+    renderCell(td, cell) {
+        if (cell && typeof cell === "object" && cell.href) {
+            const link = document.createElement("a");
+            link.href = cell.href;
+            link.className = "metric-link";
+            if (cell.avatar) {
+                const avatar = document.createElement("dp-avatar");
+                avatar.setAttribute("username", String(cell.avatar));
+                avatar.setAttribute("size", "20");
+                link.appendChild(avatar);
+            }
+            link.appendChild(document.createTextNode(String(cell.text)));
+            td.appendChild(link);
+            return;
+        }
+        td.textContent = String(cell);
+    }
+
 }
 
 window.ServiceMonitor = ServiceMonitor;

devplacepy/static/js/UserAiUsage.js

@@ -33,7 +33,7 @@ class UserAiUsage {
         const tokens = data.tokens || {};
         const latency = data.latency || {};
         const cards = [
-            ["Requests", String(data.requests)],
+            ["API requests", String(data.requests)],
             ["Success", `${data.success_pct}%`],
             ["Errors", `${data.error_pct}%`],
             ["Cost 24h", this.money(cost.window_usd)],
@@ -75,7 +75,9 @@ class UserAiUsage {
     }
 
     money(value) {
-        return `$${Number(value || 0).toFixed(4)}`;
+        const amount = Number(value || 0);
+        if (amount > 0 && amount < 0.0001) return "<$0.0001";
+        return `$${amount.toFixed(4)}`;
     }
 
     count(value) {