clay-server 2.34.0-beta.1 → 2.34.0-beta.10

package/lib/project-sessions.js

@@ -3,6 +3,33 @@ var path = require("path");
 var { execFileSync } = require("child_process");
 var { CODEX_DEFAULTS, getCodexConfig } = require("./codex-defaults");
 
+// Format a user's answer to an ask_user_questions card as a plain user
+// message so the MCP path can feed it back to the agent on the next turn.
+// The agent sees: its own question text, then the selected answer(s).
+function formatAskUserAnswerAsMessage(input, answers) {
+  var questions = (input && Array.isArray(input.questions)) ? input.questions : [];
+  if (questions.length === 0) {
+    // Shouldn't happen, but be defensive.
+    try { return "(answered with: " + JSON.stringify(answers || {}) + ")"; }
+    catch (e) { return "(answered)"; }
+  }
+  var lines = [];
+  for (var i = 0; i < questions.length; i++) {
+    var q = questions[i];
+    var qText = (q && q.question) ? q.question : ("Question " + (i + 1));
+    var ans = (answers && answers[i] != null) ? String(answers[i]) : "";
+    if (!ans) continue;
+    if (questions.length === 1) {
+      // Single question: keep it tight.
+      lines.push(ans);
+    } else {
+      lines.push("- " + qText + " → " + ans);
+    }
+  }
+  if (lines.length === 0) return "(no answer provided)";
+  return lines.join("\n");
+}
+
 /**
  * Attach session management, config, project management, and mid-section
  * message handlers to a project context.
@@ -12,7 +39,7 @@ var { CODEX_DEFAULTS, getCodexConfig } = require("./codex-defaults");
  *   sm, sdk, tm, clients,
  *   send, sendTo, sendToAdmins, sendToSession, sendToSessionOthers,
  *   opts, usersModule, userPresence, matesModule, pushModule,
- *   getSessionForWs, getLinuxUserForSession, getOsUserInfoForWs,
+ *   getSessionForWs, getLinuxUserForSession, ensureProjectAccessForSession, getOsUserInfoForWs,
  *   hydrateImageRefs, onProcessingChanged, broadcastPresence,
  *   adapter, getProjectList, getProjectCount, getScheduleCount,
  *   moveScheduleToProject, moveAllSchedulesToProject, getHubSchedules,
@@ -43,6 +70,7 @@ function attachSessions(ctx) {
   var pushModule = ctx.pushModule;
   var getSessionForWs = ctx.getSessionForWs;
   var getLinuxUserForSession = ctx.getLinuxUserForSession;
+  var ensureProjectAccessForSession = ctx.ensureProjectAccessForSession;
   var getOsUserInfoForWs = ctx.getOsUserInfoForWs;
   var hydrateImageRefs = ctx.hydrateImageRefs;
   var onProcessingChanged = ctx.onProcessingChanged;
@@ -136,6 +164,39 @@ function attachSessions(ctx) {
       return true;
     }
 
+    if (msg.type === "reorder_session_bookmarks") {
+      if (typeof msg.sourceId === "number" && typeof msg.targetId === "number" && msg.sourceId !== msg.targetId) {
+        var source = sm.sessions.get(msg.sourceId);
+        var target = sm.sessions.get(msg.targetId);
+        if (!source || !target) return true;
+        if (usersModule.isMultiUser() && ws._clayUser) {
+          if (!usersModule.canAccessSession(ws._clayUser.id, source, { visibility: "public" })) return true;
+          if (!usersModule.canAccessSession(ws._clayUser.id, target, { visibility: "public" })) return true;
+        }
+        sm.reorderBookmarkedSessions(msg.sourceId, msg.targetId, msg.insertBefore !== false);
+      }
+      return true;
+    }
+
+    if (msg.type === "bulk_delete_sessions") {
+      if (!Array.isArray(msg.sessionIds) || msg.sessionIds.length === 0) return true;
+      var deletableIds = [];
+      for (var di = 0; di < msg.sessionIds.length; di++) {
+        var bulkId = msg.sessionIds[di];
+        if (typeof bulkId !== "number") continue;
+        var bulkTarget = sm.sessions.get(bulkId);
+        if (!bulkTarget) continue;
+        if (usersModule.isMultiUser() && ws._clayUser) {
+          if (!usersModule.canAccessSession(ws._clayUser.id, bulkTarget, { visibility: "public" })) continue;
+        }
+        deletableIds.push(bulkId);
+      }
+      if (deletableIds.length > 0) {
+        sm.deleteSessionsBulk(deletableIds, ws);
+      }
+      return true;
+    }
+
     if (msg.type === "transfer_project_owner") {
       // Home directory projects: ownership is permanently locked
       if (osUsers && osUsers.length > 0 && /^\/home\/[^/]+\//.test(cwd)) {
@@ -243,6 +304,17 @@ function attachSessions(ctx) {
 
     if (msg.type === "switch_session") {
       if (msg.id && sm.sessions.has(msg.id)) {
+        // If the target session's vendor doesn't own the currently cached
+        // model, clear sm.currentModel so the UI and next query don't leak
+        // the previous session's vendor-specific model into this one.
+        var switchTargetSess = sm.sessions.get(msg.id);
+        if (switchTargetSess && sm.currentModel) {
+          var targetVendor = switchTargetSess.vendor || sm.defaultVendor || null;
+          var tvModels = (targetVendor && sm.modelsByVendor && sm.modelsByVendor[targetVendor]) || [];
+          if (tvModels.length > 0 && tvModels.indexOf(sm.currentModel) === -1) {
+            sm.currentModel = "";
+          }
+        }
         // Check access in multi-user mode
         if (usersModule.isMultiUser() && ws._clayUser) {
           var switchTarget = sm.sessions.get(msg.id);
@@ -747,10 +819,41 @@ function attachSessions(ctx) {
       if (!pending) return true;
       delete session.pendingAskUser[toolId];
       sm.sendAndRecord(session, { type: "ask_user_answered", toolId: toolId, answers: answers });
-      pending.resolve({
-        behavior: "allow",
-        updatedInput: Object.assign({}, pending.input, { answers: answers }),
-      });
+
+      if (pending.mode === "mcp") {
+        // Stateless MCP path: the tool already returned. Inject the user's
+        // answer as a new user message so the conversation continues
+        // naturally on the next turn. This matches how the mate would see
+        // any other user input.
+        var answerText = formatAskUserAnswerAsMessage(pending.input, answers);
+        var userMsg = { type: "user_message", text: answerText };
+        session.history.push(userMsg);
+        sm.appendToSessionFile(session, userMsg);
+        sendToSession(session.localId, userMsg);
+
+        if (!session.isProcessing) {
+          session.isProcessing = true;
+          onProcessingChanged();
+          session.sentToolResults = {};
+          sendToSession(session.localId, { type: "status", status: "processing" });
+          if (!session.queryInstance && !session.worker) {
+            sdk.startQuery(session, answerText, undefined, ensureProjectAccessForSession(session));
+          } else {
+            sdk.pushMessage(session, answerText);
+          }
+        } else {
+          // Turn is still running; queue for the next turn.
+          sdk.pushMessage(session, answerText);
+        }
+      } else {
+        // Claude native AskUserQuestion path (canUseTool). The SDK is
+        // synchronously blocked on the permission callback, so we must
+        // resolve it with the standard permission shape.
+        pending.resolve({
+          behavior: "allow",
+          updatedInput: Object.assign({}, pending.input, { answers: answers }),
+        });
+      }
       return true;
     }
 
@@ -863,7 +966,7 @@ function attachSessions(ctx) {
             newSession.sentToolResults = {};
             sendToSession(newSession.localId, { type: "status", status: "processing" });
             newSession.acceptEditsAfterStart = true;
-            sdk.startQuery(newSession, planPrompt, undefined, getLinuxUserForSession(newSession));
+            sdk.startQuery(newSession, planPrompt, undefined, ensureProjectAccessForSession(newSession));
           } catch (e) {
             console.error("[project] Error starting plan execution:", e);
             sendTo(ws, { type: "error", text: "Failed to start plan execution: " + (e.message || e) });
@@ -894,7 +997,7 @@ function attachSessions(ctx) {
               session.sentToolResults = {};
               sendToSession(session.localId, { type: "status", status: "processing" });
               if (!session.queryInstance && !session.worker) {
-                sdk.startQuery(session, feedback, undefined, getLinuxUserForSession(session));
+                sdk.startQuery(session, feedback, undefined, ensureProjectAccessForSession(session));
               } else {
                 sdk.pushMessage(session, feedback);
               }

package/lib/project-user-message.js

@@ -13,7 +13,7 @@ var fs = require("fs");
  *   send, sendTo, sendToSession, sendToSessionOthers,
  *   clients, opts,
  *   usersModule, matesModule,
- *   getSessionForWs, getLinuxUserForSession, getOsUserInfoForWs,
+ *   getSessionForWs, getLinuxUserForSession, ensureProjectAccessForSession, getOsUserInfoForWs,
  *   hydrateImageRefs, saveImageFile, imagesDir,
  *   onProcessingChanged, onSessionDone,
  *   _loop              - { handleLoopMessage: fn(ws, msg) }
@@ -49,6 +49,7 @@ function attachUserMessage(ctx) {
 
   var getSessionForWs = ctx.getSessionForWs;
   var getLinuxUserForSession = ctx.getLinuxUserForSession;
+  var ensureProjectAccessForSession = ctx.ensureProjectAccessForSession;
   var getOsUserInfoForWs = ctx.getOsUserInfoForWs;
 
   var hydrateImageRefs = ctx.hydrateImageRefs;
@@ -281,7 +282,7 @@ function attachUserMessage(ctx) {
       nowSession.isProcessing = true;
       onProcessingChanged();
       sendToSession(nowSession.localId, { type: "status", status: "processing" });
-      sdk.startQuery(nowSession, schedText, null, getLinuxUserForSession(nowSession));
+      sdk.startQuery(nowSession, schedText, null, ensureProjectAccessForSession(nowSession));
       sm.broadcastSessionList();
       return true;
     }
@@ -484,7 +485,7 @@ function attachUserMessage(ctx) {
           // No active query (or worker idle between queries): start a new query
           session._queryStartTs = Date.now();
           console.log("[PERF] project.js: startQuery called, localId=" + session.localId + " t=0ms");
-          sdk.startQuery(session, finalText, msg.images, getLinuxUserForSession(session));
+          sdk.startQuery(session, finalText, msg.images, ensureProjectAccessForSession(session));
         } else {
           sdk.pushMessage(session, finalText, msg.images);
         }

package/lib/project.js

@@ -9,7 +9,7 @@ var { createNotesManager } = require("./notes");
 var { fetchLatestVersion, fetchVersion, isNewer } = require("./updater");
 var { execFileSync, spawn } = require("child_process");
 var usersModule = require("./users");
-var { resolveOsUserInfo, fsAsUser } = require("./os-users");
+var { resolveOsUserInfo, fsAsUser, grantProjectAccess } = require("./os-users");
 var crisisSafety = require("./crisis-safety");
 var matesModule = require("./mates");
 var sessionSearch = require("./session-search");
@@ -160,9 +160,10 @@ function createProjectContext(opts) {
   var serverTls = opts.tls || false;
   var serverAuthToken = opts.authToken || null;
   var latestVersion = null;
+  var sessionTitleMigrationScheduled = false;
 
   // --- YOKE adapters (multi-vendor, lazy init) ---
-  var _yokeState = yoke.createAdapters({ cwd: cwd });
+  var _yokeState = yoke.createAdapters({ cwd: cwd, slug: slug });
   var adapters = _yokeState.adapters;
   var defaultVendor = adapters.claude ? "claude" : Object.keys(adapters)[0] || "claude";
   var adapter = adapters[defaultVendor] || null;
@@ -187,6 +188,14 @@ function createProjectContext(opts) {
     return user.linuxUser;
   }
 
+  function ensureProjectAccessForSession(session) {
+    var linuxUser = getLinuxUserForSession(session);
+    if (linuxUser) {
+      grantProjectAccess(cwd, linuxUser);
+    }
+    return linuxUser;
+  }
+
   function getLinuxUserForWs(ws) {
     if (!osUsers) return null;
     if (!ws._clayUser || !ws._clayUser.linuxUser) return null;
@@ -496,6 +505,63 @@ function createProjectContext(opts) {
       console.error("[project] Failed to create debate MCP server:", e.message);
     }
 
+    // Ask-user MCP server (mates only)
+    if (isMate) {
+      try {
+        var askUserMcp = require("./ask-user-mcp-server");
+        var askUserToolDefs = askUserMcp.getToolDefs(function onAsk(input) {
+          // Stateless: the tool's job is to *post* the question card.
+          // We do NOT hold a promise open waiting for the user. When the
+          // user answers, the answer is injected as a fresh user message
+          // on the next turn (see project-sessions.js ask_user_response).
+          // This avoids HTTP long-poll timeouts on the MCP bridge and
+          // matches the natural multi-turn agent loop.
+          var session = sm.getActiveSession();
+          if (!session) {
+            // No active session means we have no way to show a card or
+            // route the answer. Fail closed rather than pretend success.
+            return Promise.resolve({
+              content: [{ type: "text", text: "Error: no active session in " + slug + "; cannot display question card." }],
+              isError: true,
+            });
+          }
+          if (session.loop && session.loop.active && session.loop.role !== "crafting") {
+            return Promise.resolve({
+              content: [{ type: "text", text: "Error: Autonomous mode. Make your own decision." }],
+              isError: true,
+            });
+          }
+
+          var toolId = "ask_" + Date.now() + "_" + crypto.randomUUID().slice(0, 8);
+          // Track for UI card lifecycle + answer routing. No resolve function.
+          session.pendingAskUser[toolId] = {
+            input: input,
+            mode: "mcp",
+            sessionId: session.localId,
+            postedAt: Date.now(),
+          };
+
+          sm.sendAndRecord(session, {
+            type: "tool_executing",
+            id: toolId,
+            name: "AskUserQuestion",
+            input: input,
+          });
+
+          return Promise.resolve({
+            content: [{
+              type: "text",
+              text: "The question card has been posted to the user. End this turn now without further commentary; the user's answer will arrive as the next user message.",
+            }],
+          });
+        });
+        var askUserMcpConfig = adapter.createToolServer({ name: "clay-ask-user", version: "1.0.0", tools: askUserToolDefs });
+        if (askUserMcpConfig) servers[askUserMcpConfig.name || "clay-ask-user"] = askUserMcpConfig;
+      } catch (e) {
+        console.error("[project] Failed to create ask-user MCP server:", e.message);
+      }
+    }
+
     // Browser MCP server (main project only, not mates)
     if (!isMate) {
       try {
@@ -742,7 +808,7 @@ function createProjectContext(opts) {
         session.isProcessing = true;
         onProcessingChanged();
         sendToSession(session.localId, { type: "status", status: "processing" });
-        sdk.startQuery(session, text, null, getLinuxUserForSession(session));
+        sdk.startQuery(session, text, null, ensureProjectAccessForSession(session));
         sm.broadcastSessionList();
       }, schedDelay),
     };
@@ -1076,6 +1142,7 @@ function createProjectContext(opts) {
     pushModule: pushModule,
     getSessionForWs: getSessionForWs,
     getLinuxUserForSession: getLinuxUserForSession,
+    ensureProjectAccessForSession: ensureProjectAccessForSession,
     getOsUserInfoForWs: getOsUserInfoForWs,
     hydrateImageRefs: hydrateImageRefs,
     onProcessingChanged: onProcessingChanged,
@@ -1124,6 +1191,7 @@ function createProjectContext(opts) {
     matesModule: matesModule,
     getSessionForWs: getSessionForWs,
     getLinuxUserForSession: getLinuxUserForSession,
+    ensureProjectAccessForSession: ensureProjectAccessForSession,
     getOsUserInfoForWs: getOsUserInfoForWs,
     hydrateImageRefs: hydrateImageRefs,
     saveImageFile: saveImageFile,
@@ -1318,6 +1386,22 @@ function createProjectContext(opts) {
     getLatestVersion: function () { return latestVersion; },
     getTitle: function () { return title; },
     getProject: function () { return project; },
+    // Exposed so the first websocket connection can lazily warm up the
+    // adapters for this project (see project-connection handleConnection).
+    warmup: function () {
+      sdk.warmup();
+      sdk.startIdleReaper();
+      if (!osUsers && !sessionTitleMigrationScheduled) {
+        sessionTitleMigrationScheduled = true;
+        setTimeout(function () {
+          try {
+            sm.migrateSessionTitles(adapter, cwd);
+          } catch (e) {
+            console.error("[project] Session title migration failed for " + slug + ":", e && e.message ? e.message : e);
+          }
+        }, 5000);
+      }
+    },
   });
 
   // --- Destroy ---
@@ -1376,6 +1460,15 @@ function createProjectContext(opts) {
       var tmpDir = path.join(os.tmpdir(), "clay-" + cwdHash);
       fs.rmSync(tmpDir, { recursive: true, force: true });
     } catch (e) {}
+
+    var codexShutdown = Promise.resolve(true);
+    if (adapters && adapters.codex && typeof adapters.codex.shutdown === "function") {
+      codexShutdown = adapters.codex.shutdown().catch(function(err) {
+        console.error("[project] Codex shutdown failed for " + slug + ":", err && err.message ? err.message : err);
+        return false;
+      });
+    }
+    return codexShutdown;
   }
 
   // --- Status info ---
@@ -1523,15 +1616,9 @@ function createProjectContext(opts) {
       broadcastClientCount();
       broadcastPresence();
     },
-    warmup: function () {
-      sdk.warmup();
-      sdk.startIdleReaper();
-      // Migrate existing relay session titles to SDK format (one-time, async)
-      sm.migrateSessionTitles(adapter, cwd);
-    },
     destroy: function () {
       sdk.stopIdleReaper();
-      destroy();
+      return destroy();
     },
   };
 }

package/lib/public/css/mates.css

@@ -410,18 +410,18 @@
   line-height: 1.4;
 }
 
-/* Step 4: Autonomy options */
-.mate-autonomy-options {
+/* Step 4: Vendor options */
+.mate-vendor-option-list {
   display: flex;
   flex-direction: column;
-  gap: 8px;
+  gap: 10px;
 }
-.mate-autonomy-btn {
+.mate-vendor-option-btn {
   display: flex;
-  flex-direction: column;
+  flex-direction: row;
   align-items: flex-start;
-  gap: 2px;
-  padding: 12px 16px;
+  gap: 14px;
+  padding: 14px 16px;
   background: var(--input-bg, #1a1a2e);
   border: 2px solid var(--border, #333);
   border-radius: 10px;
@@ -430,21 +430,36 @@
   text-align: left;
   color: var(--text, #fff);
   font-family: inherit;
+  width: 100%;
 }
-.mate-autonomy-btn:hover {
+.mate-vendor-option-btn:hover {
   border-color: var(--text-dimmer, #6272a4);
 }
-.mate-autonomy-btn.active {
+.mate-vendor-option-btn.active {
   border-color: var(--accent, #6c5ce7);
   background: var(--accent-bg, rgba(108,92,231,0.12));
 }
-.mate-autonomy-title {
+.mate-vendor-option-icon {
+  width: 36px;
+  height: 36px;
+  border-radius: 8px;
+  flex-shrink: 0;
+  object-fit: cover;
+}
+.mate-vendor-option-text {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  min-width: 0;
+}
+.mate-vendor-option-title {
   font-weight: 600;
   font-size: 14px;
 }
-.mate-autonomy-desc {
+.mate-vendor-option-desc {
   font-size: 12px;
   color: var(--text-muted, #9ea8c7);
+  line-height: 1.4;
 }
 
 /* Footer */
@@ -1997,19 +2012,60 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
 }
 
 /* Mate datastore inspector */
-#mate-sidebar-datastore {
+#mate-datastore-panel {
+  position: absolute;
+  inset: 0;
+  z-index: 40;
+  background: var(--bg);
   display: flex;
   flex-direction: column;
-  flex: 1;
-  min-height: 0;
+  overflow: hidden;
+}
+
+#mate-datastore-panel.hidden {
+  display: none !important;
 }
 
-#mate-sidebar-datastore.hidden {
+#main-column.mate-datastore-open > .title-bar-content,
+#main-column.mate-datastore-open > .dm-header-bar,
+#main-column.mate-datastore-open > #main-panels {
   display: none !important;
 }
 
+.mate-datastore-top-bar {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 48px;
+  padding: 0 16px;
+  border-bottom: 1px solid var(--border-subtle);
+  flex-shrink: 0;
+}
+
+.mate-datastore-top-title {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  font-weight: 700;
+  font-size: 15px;
+  color: var(--text);
+}
+
+.mate-datastore-top-title .lucide {
+  width: 14px;
+  height: 14px;
+  color: var(--accent);
+  opacity: 0.85;
+}
+
+.mate-datastore-top-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
 .mate-db-status {
-  padding: 8px 12px 0;
+  padding: 10px 14px 0;
   font-size: 12px;
   color: var(--text-secondary, #8e8e8e);
 }
@@ -2028,9 +2084,9 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
 
 .mate-db-layout {
   display: grid;
-  grid-template-columns: 130px minmax(0, 1fr);
+  grid-template-columns: 220px minmax(0, 1fr);
   gap: 10px;
-  padding: 8px 8px 12px;
+  padding: 12px 10px 10px;
   min-height: 0;
   flex: 1;
 }
@@ -2044,10 +2100,10 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
 
 .mate-db-table-list {
   overflow-y: auto;
-  border: 1px solid var(--border-subtle, rgba(255,255,255,0.08));
-  border-radius: 10px;
-  background: var(--bg-alt, rgba(255,255,255,0.03));
-  padding: 4px;
+  border: 1px solid var(--border-subtle, rgba(255,255,255,0.06));
+  border-radius: 12px;
+  background: var(--sidebar-bg, rgba(255,255,255,0.03));
+  padding: 6px;
   flex: 1;
 }
 
@@ -2123,46 +2179,32 @@ body.mate-dm-active #layout.sidebar-collapsed .mate-collapsed-info {
 }
 
 .mate-db-table-schema {
-  max-height: 120px;
+  max-height: 180px;
 }
 
-.mate-db-query,
-.mate-db-params {
-  width: 100%;
-  min-height: 72px;
-  padding: 10px;
-  border-radius: 10px;
-  border: 1px solid var(--border-subtle, rgba(255,255,255,0.1));
-  background: var(--bg-secondary, rgba(255,255,255,0.04));
-  color: var(--text, #fff);
-  font-family: var(--mono-font, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
-  font-size: 11px;
-  resize: vertical;
+@media (max-width: 900px) {
+  .mate-db-layout {
+    grid-template-columns: 1fr;
+  }
 }
 
-.mate-db-params {
-  min-height: 54px;
+body.mate-dm-active .mate-datastore-top-bar {
+  background: var(--mate-color);
+  color: #fff;
 }
 
-.mate-db-actions {
-  display: flex;
-  gap: 8px;
+body.mate-dm-active .mate-datastore-top-title,
+body.mate-dm-active .mate-datastore-top-title .lucide {
+  color: #fff;
 }
 
-.mate-db-actions button {
-  flex: 1;
-  height: 30px;
-  border: none;
-  border-radius: 8px;
-  background: var(--sidebar-active, rgba(255,255,255,0.08));
-  color: var(--text, #fff);
-  font-size: 12px;
-  font-weight: 600;
-  cursor: pointer;
+body.mate-dm-active .mate-datastore-top-bar .scheduler-close-btn {
+  color: rgba(255, 255, 255, 0.85);
 }
 
-.mate-db-actions button:hover {
-  background: var(--sidebar-hover, rgba(255,255,255,0.12));
+body.mate-dm-active .mate-datastore-top-bar .scheduler-close-btn:hover {
+  color: #fff;
+  background: rgba(255, 255, 255, 0.15);
 }
 
 .mate-session-item.search-match {

package/lib/public/css/mobile-nav.css

@@ -526,20 +526,6 @@
     white-space: nowrap;
   }
 
-  .mobile-session-bookmark {
-    display: inline-flex;
-    align-items: center;
-    color: var(--accent, #ff7b54);
-    flex-shrink: 0;
-  }
-
-  .mobile-session-bookmark .lucide,
-  .mobile-session-bookmark svg {
-    width: 13px;
-    height: 13px;
-    display: block;
-  }
-
   .mobile-session-processing {
     width: 7px;
     height: 7px;