glad-web 1.0.30 → 1.0.32

package/lib/codex/structured-session.js

@@ -85,6 +85,27 @@ function recentUserQuestions(thread, limit = 2) {
   return questions;
 }
 
+function userPromptsFromThread(thread, fallbackTimestamp = null) {
+  const prompts = [];
+  const threadId = String(thread?.id || '');
+  for (const turn of Array.isArray(thread?.turns) ? thread.turns : []) {
+    const turnTimestamp = toTimestampMs(turn.startedAt || turn.createdAt || turn.completedAt || turn.updatedAt)
+      || fallbackTimestamp;
+    for (const item of Array.isArray(turn?.items) ? turn.items : []) {
+      if (item?.type !== 'userMessage') continue;
+      const prompt = (textFromInputItems(item.content) || item.text || '').trim();
+      if (!prompt) continue;
+      prompts.push({
+        id: String(item.id || `${threadId}:${turn.id || 'turn'}:${prompts.length}`),
+        threadId,
+        text: prompt,
+        createdAt: toTimestampMs(item.createdAt || item.updatedAt) || turnTimestamp || null
+      });
+    }
+  }
+  return prompts;
+}
+
 function toolDetails(raw) {
   if (raw.type === 'commandExecution') {
     return {
@@ -167,8 +188,10 @@ class CodexStructuredSession extends EventEmitter {
     this.currentTurnId = null;
     this.currentTurnStartedAt = null;
     this.threadTurns = new Map();
+    this.turnContexts = new Map();
     this.providerItemContexts = new Map();
     this.tokenUsage = null;
+    this.compacting = false;
     this.permissionMode = normalizePermissionMode(options.permissionMode);
     this.sandboxMode = normalizeSandboxMode(options.sandboxMode);
     this.effectivePermissionMode = null;
@@ -193,6 +216,8 @@ class CodexStructuredSession extends EventEmitter {
     this.inputSeq = 0;
     this.completionReadInputSeq = 0;
     this.timedInputs = new Map();
+    this.promptHistoryCache = null;
+    this.deferredWarnings = null;
     this.ptyManager = {
       workingDir,
       isRunning: () => this.isRunning(),
@@ -226,6 +251,8 @@ class CodexStructuredSession extends EventEmitter {
       model: this.model, effort: this.effort,
       status: this.status, threadId: this.threadId, presentation: this.presentation,
       canAbort: this.presentation === 'structured' && this.status !== 'idle',
+      canCompact: this.presentation === 'structured' && this.status === 'idle' && !this.compacting && Boolean(this.threadId),
+      compacting: this.compacting,
       canSwitchToTerminal: this.presentation === 'structured' && this.status === 'idle' && Boolean(this.threadId),
       canSwitchToStructured: this.presentation === 'terminal',
       pendingPermissionCount: this.pendingPermissions.size, activeSubagentCount, models: this.models };
@@ -289,6 +316,7 @@ class CodexStructuredSession extends EventEmitter {
           for (const request of this.pendingRequests.values()) request.reject(new Error(`Codex app-server exited (${code})`));
           this.pendingRequests.clear();
           if (this.running && this.presentation === 'structured') {
+            this.compacting = false;
             this.append({ kind: 'event', level: 'error', text: 'Codex app-server exited.' });
             this.setStatus('idle');
           }
@@ -382,6 +410,7 @@ class CodexStructuredSession extends EventEmitter {
   handleNotification(method, params) {
     if (method === 'thread/tokenUsage/updated') {
       this.tokenUsage = params.tokenUsage || params.usage || params;
+      this.recordTurnContext(params.turnId, this.tokenUsage);
       return;
     }
     if (method === 'turn/started') {
@@ -411,8 +440,9 @@ class CodexStructuredSession extends EventEmitter {
       const startedAtMs = trackedTurn?.startedAt || ((!threadId || threadId === this.threadId) ? this.currentTurnStartedAt : null);
       const durationMs = Number(params.turn?.durationMs || 0)
         || (startedAtMs ? Math.max(0, completedAtMs - startedAtMs) : null);
+      const context = this.turnContexts.get(String(completedTurnId || ''));
       this.append({ kind: 'turn-end', threadId, turnId: completedTurnId, status: turnStatus,
-        durationMs, createdAt: completedAtMs });
+        durationMs, createdAt: completedAtMs, ...(context ? { context } : {}) });
       const observedNow = Date.now();
       const observedCompletedAtMs = Math.abs(observedNow - completedAtMs) < 5000
         ? Math.max(completedAtMs, observedNow) : completedAtMs;
@@ -424,8 +454,13 @@ class CodexStructuredSession extends EventEmitter {
         this.patch(item.id, { toolStatus,
           completedAtMs: observedCompletedAtMs, ...(toolDurationMs != null ? { durationMs: toolDurationMs } : {}) });
       }
+      for (const item of this.messages.filter(message => message.kind === 'compaction'
+        && message.turnId === completedTurnId && message.compactionStatus === 'running')) {
+        this.patch(item.id, { compactionStatus: 'completed', completedAtMs: observedCompletedAtMs });
+      }
       if (threadId) this.threadTurns.delete(threadId);
       if (!threadId || threadId === this.threadId) {
+        this.compacting = false;
         for (const pending of this.pendingPermissions.values()) {
           this.recordPermission(pending.public, 'denied', 'abort');
         }
@@ -442,6 +477,14 @@ class CodexStructuredSession extends EventEmitter {
       }
       return;
     }
+    if (method === 'thread/compacted') {
+      const threadId = params.threadId || this.threadId;
+      const turnId = params.turnId || (threadId ? this.threadTurns.get(threadId)?.turnId : null) || this.currentTurnId;
+      this.applyProviderItem({ id: `compaction-${turnId || Date.now()}`, type: 'contextCompaction', threadId, turnId }, 'completed', {
+        threadId, turnId, completedAtMs: Date.now()
+      });
+      return;
+    }
     if (method === 'thread/started' || method === 'thread/resumed') {
       const threadId = params.thread?.id || params.threadId;
       if (threadId && !this.threadId) { this.threadId = threadId; this.emitControlState(); }
@@ -451,7 +494,7 @@ class CodexStructuredSession extends EventEmitter {
       const threadId = params.threadId || this.threadId;
       const status = params.status?.type || params.status;
       if (!threadId || threadId === this.threadId) {
-        if (status === 'idle' && !this.currentTurnId) this.setStatus('idle');
+        if (status === 'idle' && !this.currentTurnId) { this.compacting = false; this.setStatus('idle'); }
         if (status === 'active') this.setStatus('running');
       }
       return;
@@ -467,11 +510,13 @@ class CodexStructuredSession extends EventEmitter {
     }
     if (method === 'error') {
       this.append({ kind: 'event', level: 'error', text: params.error?.message || 'Codex reported an error.' });
-      if (!params.willRetry) this.setStatus('idle');
+      if (!params.willRetry) { this.compacting = false; this.setStatus('idle'); }
       return;
     }
     if (method === 'warning' || method === 'guardianWarning') {
-      this.append({ kind: 'event', level: 'warning', text: params.message || params.warning || 'Codex warning.' });
+      const warning = { kind: 'event', level: 'warning', text: params.message || params.warning || 'Codex warning.' };
+      if (this.deferredWarnings) this.deferredWarnings.push(warning);
+      else this.append(warning);
       return;
     }
     if (method === 'item/commandExecution/outputDelta' || method === 'item/fileChange/outputDelta') {
@@ -519,9 +564,10 @@ class CodexStructuredSession extends EventEmitter {
   applyProviderItem(raw, inferredStatus = null, context = {}) {
     if (!raw || typeof raw !== 'object') return;
     const providerId = String(raw.id || '');
-    const existing = providerId && this.messages.find(item => item.providerId === providerId);
+    let existing = providerId && this.messages.find(item => item.providerId === providerId);
     const kind = raw.type === 'userMessage' ? 'user' : raw.type === 'agentMessage' ? 'assistant' : ['reasoning', 'plan'].includes(raw.type) ? 'reasoning'
-      : ['commandExecution', 'fileChange', 'mcpToolCall', 'dynamicToolCall', 'webSearch', 'collabAgentToolCall'].includes(raw.type) ? 'tool' : null;
+      : ['commandExecution', 'fileChange', 'mcpToolCall', 'dynamicToolCall', 'webSearch', 'collabAgentToolCall'].includes(raw.type) ? 'tool'
+        : raw.type === 'contextCompaction' ? 'compaction' : null;
     if (!kind) return;
     const text = kind === 'user' ? textFromInputItems(raw.content) : kind === 'assistant' ? String(raw.text || '')
       : kind === 'reasoning' ? (raw.text || (Array.isArray(raw.summary) ? raw.summary.join('\n') : Array.isArray(raw.content) ? raw.content.join('\n') : '')) : '';
@@ -530,6 +576,9 @@ class CodexStructuredSession extends EventEmitter {
     const threadId = raw.threadId || context.threadId || null;
     const trackedTurnId = threadId ? this.threadTurns.get(threadId)?.turnId : null;
     const turnId = raw.turnId || context.turnId || trackedTurnId || this.currentTurnId;
+    if (!existing && kind === 'compaction' && turnId) {
+      existing = this.messages.find(item => item.kind === 'compaction' && item.turnId === turnId);
+    }
     if (providerId && (threadId || turnId)) this.providerItemContexts.set(providerId, { threadId, turnId });
     const existingStartedAtMs = existing?.startedAtMs || existing?.createdAt || null;
     const startedAtMs = Number(context.startedAtMs || raw.startedAtMs || 0)
@@ -546,6 +595,8 @@ class CodexStructuredSession extends EventEmitter {
     };
     const patch = kind === 'tool' ? { ...toolDetails(raw), threadId, turnId,
       ...timing, toolStatus: inferredToolStatus || raw.status || 'running' }
+      : kind === 'compaction' ? { providerId, threadId, turnId, ...timing,
+        compactionStatus: inferredStatus || raw.status || 'running' }
       : { text, threadId, turnId, streaming: false, ...(completedAtMs ? { completedAtMs } : {}) };
     if (existing) {
       this.patch(existing.id, patch);
@@ -556,6 +607,10 @@ class CodexStructuredSession extends EventEmitter {
     } else {
       this.append({ kind, providerId, ...(startedAtMs ? { createdAt: startedAtMs } : {}), ...patch });
     }
+    if (kind === 'compaction' && (!threadId || threadId === this.threadId)) {
+      this.compacting = patch.compactionStatus === 'running';
+      this.emitControlState();
+    }
   }
 
   async refreshModels() {
@@ -625,8 +680,70 @@ class CodexStructuredSession extends EventEmitter {
     return items;
   }
 
-  contextStatus() {
-    const usage = this.tokenUsage || {};
+  async listPromptHistory({ offset = 0, limit = 30 } = {}) {
+    await this.ensureProcess();
+    const safeOffset = Math.max(0, Math.min(199, Number(offset) || 0));
+    const safeLimit = Math.max(1, Math.min(30, Number(limit) || 30));
+    const cacheFresh = this.promptHistoryCache
+      && Date.now() - this.promptHistoryCache.loadedAt < 15000;
+
+    if (!cacheFresh) {
+      const prompts = [];
+      let cursor = null;
+      let pageCount = 0;
+      let capped = false;
+      do {
+        const result = await this.request('thread/list', {
+          cursor,
+          limit: 20,
+          sortKey: 'updated_at',
+          sortDirection: 'desc',
+          archived: false,
+          cwd: this.workingDir
+        });
+        const threads = (result?.data || []).filter(item => !item.parentThreadId);
+        const histories = await Promise.all(threads.map(async item => {
+          try {
+            const history = await this.request('thread/read', { threadId: item.id, includeTurns: true });
+            const fallbackTimestamp = toTimestampMs(item.updatedAt || item.createdAt);
+            return userPromptsFromThread(history?.thread || { id: item.id, turns: [] }, fallbackTimestamp)
+              .map(prompt => ({ ...prompt, threadId: prompt.threadId || item.id }));
+          } catch (error) {
+            this.logger.debugInfo?.(`[codex-app-server] unable to read prompt history for ${item.id}: ${error.message}`);
+            return [];
+          }
+        }));
+        prompts.push(...histories.flat());
+        cursor = result?.nextCursor || null;
+        pageCount += 1;
+        if (prompts.length >= 200 || pageCount >= 5) {
+          capped = Boolean(cursor) || prompts.length > 200;
+          break;
+        }
+      } while (cursor);
+
+      prompts.sort((a, b) => Number(b.createdAt || 0) - Number(a.createdAt || 0));
+      this.promptHistoryCache = {
+        loadedAt: Date.now(),
+        items: prompts.slice(0, 200),
+        capped
+      };
+    }
+
+    const items = this.promptHistoryCache.items.slice(safeOffset, safeOffset + safeLimit);
+    const nextOffset = safeOffset + items.length;
+    return {
+      items,
+      offset: safeOffset,
+      nextOffset,
+      total: this.promptHistoryCache.items.length,
+      hasMore: nextOffset < this.promptHistoryCache.items.length,
+      capped: this.promptHistoryCache.capped
+    };
+  }
+
+  contextStatus(tokenUsage = this.tokenUsage) {
+    const usage = tokenUsage || {};
     const selectedModel = this.models.find(item => item.id === this.model);
     const contextWindow = Number(usage.modelContextWindow || usage.model_context_window
       || usage.contextWindow || usage.context_window || selectedModel?.contextWindow || 0);
@@ -646,6 +763,16 @@ class CodexStructuredSession extends EventEmitter {
     };
   }
 
+  recordTurnContext(turnId, tokenUsage = this.tokenUsage) {
+    const id = String(turnId || '').trim();
+    const context = this.contextStatus(tokenUsage);
+    if (!id || !context) return context;
+    this.turnContexts.set(id, context);
+    const turnEnd = this.messages.find(item => item.kind === 'turn-end' && String(item.turnId || '') === id);
+    if (turnEnd) this.patch(turnEnd.id, { context });
+    return context;
+  }
+
   async showStatus() {
     if (this.presentation !== 'structured') return false;
     await this.ensureProcess();
@@ -717,6 +844,7 @@ class CodexStructuredSession extends EventEmitter {
       .filter(item => item && typeof item.path === 'string' && item.path);
     if ((!prompt && images.length === 0) || this.presentation !== 'structured' || this.status !== 'idle') return false;
     this.hasUnreadCompletion = false;
+    this.promptHistoryCache = null;
     this.append({
       kind: 'user',
       text: prompt || '📷 Image attachment',
@@ -759,6 +887,22 @@ class CodexStructuredSession extends EventEmitter {
     }
   }
 
+  async compactContext() {
+    if (!this.threadId || this.presentation !== 'structured' || this.status !== 'idle') return false;
+    await this.ensureProcess();
+    this.compacting = true;
+    this.setStatus('running');
+    try {
+      await this.request('thread/compact/start', { threadId: this.threadId });
+      return true;
+    } catch (error) {
+      this.compacting = false;
+      this.setStatus('idle');
+      this.append({ kind: 'event', level: 'error', text: `Unable to compact context: ${error.message}` });
+      throw error;
+    }
+  }
+
   write(data) {
     if (this.presentation === 'terminal') return this.terminalSession?.write(data) || false;
     const text = String(data || '').replace(/\r/g, '\n');
@@ -826,28 +970,50 @@ class CodexStructuredSession extends EventEmitter {
     const target = String(threadId || this.threadId || '').trim();
     if (!target || this.presentation !== 'structured' || this.status !== 'idle') return false;
     await this.ensureProcess();
+    const selectedModel = this.model;
+    const selectedEffort = this.effort;
+    const resumeWithModelOverride = Boolean(this.hasModelOverride && selectedModel);
+    const resumeWithEffortOverride = Boolean(this.hasEffortOverride && selectedEffort);
     const params = { threadId: target, cwd: this.workingDir };
     if (this.permissionMode) params.approvalPolicy = this.permissionMode;
     if (this.sandboxMode) params.sandbox = this.sandboxMode;
-    const result = await this.request('thread/resume', params);
-    this.threadId = result.thread?.id || target;
-    this.hasModelOverride = false;
-    this.hasEffortOverride = false;
-    this.model = result.model || result.thread?.model || this.model;
-    this.effort = result.reasoningEffort || result.thread?.reasoningEffort || this.effort;
-    this.effectivePermissionMode = result.approvalPolicy || this.effectivePermissionMode;
-    this.effectiveSandboxMode = sandboxModeFromPolicy(result.sandbox) || this.effectiveSandboxMode;
-    const history = await this.request('thread/read', { threadId: this.threadId, includeTurns: true });
-    this.restoreThreadHistory(history?.thread, `Resumed Codex thread ${this.threadId}`);
-    return true;
+    if (resumeWithModelOverride) params.model = selectedModel;
+    if (resumeWithEffortOverride) params.config = { model_reasoning_effort: selectedEffort };
+    this.deferredWarnings = [];
+    try {
+      const result = await this.request('thread/resume', params);
+      this.threadId = result.thread?.id || target;
+      this.hasModelOverride = resumeWithModelOverride;
+      this.hasEffortOverride = resumeWithEffortOverride;
+      this.model = result.model || result.thread?.model || selectedModel;
+      this.effort = result.reasoningEffort || result.thread?.reasoningEffort || selectedEffort;
+      this.effectivePermissionMode = result.approvalPolicy || this.effectivePermissionMode;
+      this.effectiveSandboxMode = sandboxModeFromPolicy(result.sandbox) || this.effectiveSandboxMode;
+      const history = await this.request('thread/read', { threadId: this.threadId, includeTurns: true });
+      this.restoreThreadHistory(history?.thread, `Resumed Codex thread ${this.threadId}`, {
+        preserveModel: resumeWithModelOverride,
+        preserveEffort: resumeWithEffortOverride
+      });
+      const warnings = this.deferredWarnings;
+      this.deferredWarnings = null;
+      for (const warning of warnings) this.append(warning);
+      this.promptHistoryCache = null;
+      return true;
+    } catch (error) {
+      const warnings = this.deferredWarnings || [];
+      this.deferredWarnings = null;
+      for (const warning of warnings) this.append(warning);
+      throw error;
+    }
   }
 
-  restoreThreadHistory(thread, eventText = '') {
-    this.model = thread?.model || this.model;
-    this.effort = thread?.reasoningEffort || thread?.reasoning_effort || this.effort;
+  restoreThreadHistory(thread, eventText = '', options = {}) {
+    if (!options.preserveModel) this.model = thread?.model || this.model;
+    if (!options.preserveEffort) this.effort = thread?.reasoningEffort || thread?.reasoning_effort || this.effort;
     this.tokenUsage = thread?.tokenUsage || thread?.token_usage || this.tokenUsage;
     this.messages = [];
     this.completedPermissions = [];
+    this.turnContexts.clear();
     this.providerItemContexts.clear();
     for (const turn of thread?.turns || []) {
       const status = turn.status === 'failed' ? 'failed' : turn.status === 'interrupted' ? 'cancelled' : 'completed';
@@ -891,6 +1057,7 @@ class CodexStructuredSession extends EventEmitter {
     this.effectivePermissionMode = result.approvalPolicy || this.effectivePermissionMode;
     this.effectiveSandboxMode = sandboxModeFromPolicy(result.sandbox) || this.effectiveSandboxMode;
     this.restoreThreadHistory(forkedThread, `Forked from Codex thread ${sourceThreadId}`);
+    this.promptHistoryCache = null;
     return { threadId: this.threadId };
   }
 

package/lib/commands/web.js

@@ -374,6 +374,9 @@ async function webCommand(options) {
         if (payload.type === 'codex-status') {
           sessionManager.showCodexStatus(sessionId).catch(error => logger.error(`Codex status error: ${error.message}`));
         }
+        if (payload.type === 'codex-compact') {
+          sessionManager.compactCodexContext(sessionId).catch(error => logger.error(`Codex compact error: ${error.message}`));
+        }
         if (payload.type === 'codex-abort') {
           sessionManager.abortCodex(sessionId);
         }
@@ -436,6 +439,10 @@ async function webCommand(options) {
     });
   };
 
+  const sendDependencyAsset = assetPath => (req, res) => {
+    res.sendFile(path.basename(assetPath), { root: path.dirname(assetPath) });
+  };
+
   const webAssets = [
     'gitgraph.js',
     'styles.css',
@@ -455,9 +462,9 @@ async function webCommand(options) {
     app.get([`/${assetName}`, new RegExp(`.*\\/${escapedName}$`)], sendWebAsset(assetName));
   }
 
-  app.get('/vendor/xterm.js', (req, res) => res.sendFile(xtermScript));
-  app.get('/vendor/xterm.css', (req, res) => res.sendFile(xtermStyles));
-  app.get('/vendor/xterm-addon-fit.js', (req, res) => res.sendFile(fitAddonScript));
+  app.get('/vendor/xterm.js', sendDependencyAsset(xtermScript));
+  app.get('/vendor/xterm.css', sendDependencyAsset(xtermStyles));
+  app.get('/vendor/xterm-addon-fit.js', sendDependencyAsset(fitAddonScript));
 
   app.get(['/logo.svg', /.*\/logo\.svg$/], sendLogo);
 

package/lib/server/routes/providers.js

@@ -55,6 +55,19 @@ function registerProviderRoutes(app, { sessionManager }) {
     }
   });
 
+  app.get('/api/sessions/:id/codex-prompts', async (req, res) => {
+    try {
+      const result = await sessionManager.listCodexPrompts(req.params.id, {
+        offset: req.query?.offset,
+        limit: req.query?.limit
+      });
+      if (!result) return res.status(404).json({ error: 'Codex session not found' });
+      res.json({ success: true, ...result });
+    } catch (error) {
+      res.status(400).json({ error: error.message });
+    }
+  });
+
   app.post('/api/sessions/:id/codex-abort', (req, res) => {
     const success = sessionManager.abortCodex(req.params.id);
     if (!success) return res.status(409).json({ error: 'Codex session is idle or unavailable' });

package/lib/session/session-manager.js

@@ -389,6 +389,12 @@ class SessionManager extends EventEmitter {
     return session.showStatus();
   }
 
+  compactCodexContext(id) {
+    const session = this.get(id);
+    if (!session || session.kind !== 'codex-structured') return Promise.resolve(false);
+    return session.compactContext();
+  }
+
   abortCodex(id) {
     const session = this.get(id);
     return session && session.kind === 'codex-structured' ? session.abort('Aborted by user') : false;
@@ -425,6 +431,12 @@ class SessionManager extends EventEmitter {
     return session.listResumeThreads();
   }
 
+  listCodexPrompts(id, options) {
+    const session = this.get(id);
+    if (!session || session.kind !== 'codex-structured') return null;
+    return session.listPromptHistory(options);
+  }
+
   switchCodexPresentation(id, presentation) {
     const session = this.get(id);
     if (!session || session.kind !== 'codex-structured') return Promise.resolve(false);

package/lib/web/codex.js

@@ -94,6 +94,18 @@
                 ${codexStatusItem('Context', contextLabel)}
             </div></div>`;
         }
+        function renderCodexCompaction(item) {
+            const running = item.compactionStatus === 'running';
+            const timestamp = Number(item.completedAtMs || item.updatedAt || item.createdAt || 0);
+            const date = timestamp > 0 ? new Date(timestamp) : null;
+            const time = date && !Number.isNaN(date.getTime())
+                ? date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }) : '';
+            const detail = running ? 'Compacting context…' : ['Completed', time].filter(Boolean).join(' · ');
+            return `<div class="codex-compaction-card${running ? ' running' : ''}" data-codex-key="compaction-${escapeHtml(item.id || item.providerId || '')}"><span class="codex-compaction-icon" aria-hidden="true">⇣</span><div><div class="codex-compaction-title">${running ? 'Compacting context' : 'Context compacted'}</div><div class="codex-compaction-meta">${escapeHtml(detail)}</div></div></div>`;
+        }
+        function renderCodexWarning(item) {
+            return `<div class="codex-warning-card" data-codex-key="warning-${escapeHtml(item.id || '')}" role="status"><span class="codex-warning-icon" aria-hidden="true">!</span><div><div class="codex-warning-title">Codex warning</div><div class="codex-warning-text">${codexText(item.text || 'Codex reported a warning.')}</div></div></div>`;
+        }
         function renderCodexTool(item, permission = null) {
             const status = codexToolStatus(item);
             const isError = status === 'failed' || Boolean(item.error) || (item.exitCode != null && item.exitCode !== 0);
@@ -177,6 +189,21 @@
             const label = date.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
             return `<time class="codex-message-time" datetime="${escapeHtml(date.toISOString())}" title="${escapeHtml(date.toLocaleString())}">${escapeHtml(label)}</time>`;
         }
+        function renderCodexContextMeter(context) {
+            const total = Number(context?.contextWindow || 0);
+            const remaining = Number(context?.remainingTokens || 0);
+            if (!(total > 0) || !Number.isFinite(remaining)) return '';
+            const reportedPercent = Number(context.remainingPercent ?? Math.round(remaining / total * 100));
+            const percent = Math.max(0, Math.min(100, Number.isFinite(reportedPercent) ? reportedPercent : 0));
+            const level = percent <= 20 ? ' danger' : percent <= 40 ? ' warn' : '';
+            const label = `${formatCodexTokens(remaining)} / ${formatCodexTokens(total)}（${Math.round(percent)}%）`;
+            return `<span class="codex-context-meter${level}" style="--context-remaining:${percent}%" title="${escapeHtml(`Context remaining: ${label}`)}" aria-label="${escapeHtml(`Context remaining: ${label}`)}">${escapeHtml(label)}</span>`;
+        }
+        function renderCodexMessageMeta(item, finalOnly = false, context = null) {
+            const time = renderCodexMessageTime(item, finalOnly);
+            const meter = renderCodexContextMeter(context);
+            return time || meter ? `<div class="codex-message-meta">${time}${meter}</div>` : '';
+        }
         function syncCodexDom(current, next) {
             if (!current || !next) return;
             if (current.nodeType !== next.nodeType || current.nodeName !== next.nodeName) {
@@ -230,6 +257,12 @@
             const usedPermissions = new Set();
             const turnEndById = new Map(codexMessages.filter(item => item.kind === 'turn-end' && item.turnId)
                 .map(item => [String(item.turnId), item]));
+            const lastAssistantByTurn = new Map();
+            for (const item of codexMessages) {
+                if (item.kind === 'assistant' && item.turnId && !isCodexSubagentItem(item)) {
+                    lastAssistantByTurn.set(String(item.turnId), item.id);
+                }
+            }
             const subagentItems = new Map();
             for (const item of codexMessages) {
                 if (!isCodexSubagentItem(item)) continue;
@@ -258,9 +291,16 @@
                         turnEndById.get(String(turnId || ''))));
                     continue;
                 }
-                if (item.kind === 'assistant') parts.push(`<div class="codex-message-block assistant" data-codex-key="message-${escapeHtml(item.id || '')}"><div class="codex-message assistant claude-md">${renderMarkdown(item.text || '')}</div>${renderCodexMessageTime(item, true)}</div>`);
-                else if (item.kind === 'user') parts.push(`<div class="codex-message-block user" data-codex-key="message-${escapeHtml(item.id || '')}"><div class="codex-message user claude-md">${renderMarkdown(item.text || '')}</div>${renderCodexMessageTime(item)}</div>`);
+                if (item.kind === 'assistant') {
+                    const turnId = String(item.turnId || '');
+                    const turnEnd = turnEndById.get(turnId);
+                    const context = lastAssistantByTurn.get(turnId) === item.id ? turnEnd?.context : null;
+                    parts.push(`<div class="codex-message-block assistant" data-codex-key="message-${escapeHtml(item.id || '')}"><div class="codex-message assistant claude-md">${renderMarkdown(item.text || '')}</div>${renderCodexMessageMeta(item, true, context)}</div>`);
+                }
+                else if (item.kind === 'user') parts.push(`<div class="codex-message-block user" data-codex-key="message-${escapeHtml(item.id || '')}"><div class="codex-message user claude-md">${renderMarkdown(item.text || '')}</div>${renderCodexMessageMeta(item)}</div>`);
+                else if (item.kind === 'compaction') parts.push(renderCodexCompaction(item));
                 else if (item.kind === 'status') parts.push(renderCodexStatus(item));
+                else if (item.kind === 'event' && item.level === 'warning') parts.push(renderCodexWarning(item));
                 else parts.push(`<div class="codex-message ${escapeHtml(item.level === 'error' ? 'event error' : item.kind || 'event')}">${codexText(item.text)}</div>`);
                 i += 1;
             }
@@ -300,6 +340,8 @@
             if (modelButton) modelButton.textContent = 'Model';
             const abort = document.getElementById('codex-abort-btn');
             if (abort) abort.disabled = !codexState.canAbort;
+            const compact = document.getElementById('codex-compact-btn');
+            if (compact) { compact.disabled = !codexState.canCompact; compact.textContent = codexState.compacting ? 'Compacting' : 'Compact'; }
             const fork = document.getElementById('codex-fork-btn');
             if (fork) fork.disabled = !(codexState.presentation === 'structured' && codexState.status === 'idle');
             const terminal = document.getElementById('codex-terminal-switch');
@@ -357,9 +399,11 @@
             codexModelPanelOpen = !codexModelPanelOpen;
             codexResumePanelOpen = false;
             codexForkPanelOpen = false;
+            codexPromptPanelOpen = false;
             codexModelCandidate = codexState.model || codexState.models?.[0]?.id || null;
             document.getElementById('codex-resume-panel').classList.remove('active');
             document.getElementById('codex-fork-panel').classList.remove('active');
+            document.getElementById('codex-prompt-panel').classList.remove('active');
             renderCodexModelPanel();
             updateTerminalControlsHeight();
         }
@@ -404,13 +448,21 @@
         }
         function abortCodexSession() { if (currentSocket?.readyState === 1) currentSocket.send(JSON.stringify({ type: 'codex-abort' })); }
         function requestCodexStatus() { if (currentSocket?.readyState === 1) currentSocket.send(JSON.stringify({ type: 'codex-status' })); }
+        function compactCodexContext() {
+            if (!codexState.canCompact || currentSocket?.readyState !== 1) return false;
+            currentSocket.send(JSON.stringify({ type: 'codex-compact' }));
+            applyCodexState({ canCompact: false, compacting: true });
+            return true;
+        }
         function respondCodexPermission(id, decision) { if (currentSocket?.readyState === 1) currentSocket.send(JSON.stringify({ type: 'codex-permission', id, decision })); }
         async function toggleCodexResumePanel() {
             codexResumePanelOpen = !codexResumePanelOpen;
             codexModelPanelOpen = false;
             codexForkPanelOpen = false;
+            codexPromptPanelOpen = false;
             document.getElementById('codex-model-panel').classList.remove('active');
             document.getElementById('codex-fork-panel').classList.remove('active');
+            document.getElementById('codex-prompt-panel').classList.remove('active');
             const panel = document.getElementById('codex-resume-panel');
             panel.classList.toggle('active', codexResumePanelOpen);
             updateTerminalControlsHeight();
@@ -422,8 +474,10 @@
             codexForkPanelOpen = !codexForkPanelOpen;
             codexModelPanelOpen = false;
             codexResumePanelOpen = false;
+            codexPromptPanelOpen = false;
             document.getElementById('codex-model-panel').classList.remove('active');
             document.getElementById('codex-resume-panel').classList.remove('active');
+            document.getElementById('codex-prompt-panel').classList.remove('active');
             const panel = document.getElementById('codex-fork-panel');
             panel.classList.toggle('active', codexForkPanelOpen);
             updateTerminalControlsHeight();
@@ -445,6 +499,91 @@
             } catch (e) { panel.innerHTML = `<div class="claude-resume-meta" style="padding:12px;color:#ff6b61;">${escapeHtml(e.message)}</div>`; }
             updateTerminalControlsHeight();
         }
+        function formatCodexPromptTime(timestamp) {
+            const value = Number(timestamp || 0);
+            if (!value) return '';
+            const date = new Date(value);
+            return Number.isNaN(date.getTime()) ? '' : date.toLocaleString([], {
+                month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit'
+            });
+        }
+        function renderCodexPromptPanel(error = '') {
+            const panel = document.getElementById('codex-prompt-panel');
+            if (!panel) return;
+            const previousScrollTop = panel.scrollTop;
+            panel.classList.toggle('active', codexPromptPanelOpen);
+            if (!codexPromptPanelOpen) return;
+            const countLabel = codexPromptTotal ? `${codexPromptItems.length} / ${codexPromptTotal}${codexPromptTotal >= 200 ? ' max' : ''}` : '';
+            const items = codexPromptItems.map((item, index) => {
+                const expanded = codexExpandedPrompts.has(index);
+                return `<div class="codex-prompt-item"><button type="button" class="codex-prompt-text${expanded ? ' expanded' : ''}" onclick="toggleCodexPromptExpanded(${index})" title="${expanded ? 'Collapse prompt' : 'Expand prompt'}">${escapeHtml(item.text || '')}</button><div class="codex-prompt-actions"><span class="codex-prompt-time">${escapeHtml(formatCodexPromptTime(item.createdAt))}</span><button type="button" class="small-btn codex-prompt-copy" data-codex-prompt-copy="${index}" onclick="copyCodexPrompt(${index})">Copy</button></div></div>`;
+            }).join('');
+            const empty = !items && !codexPromptLoading && !error
+                ? '<div class="claude-resume-meta" style="padding:12px;">No text prompts found for this folder.</div>' : '';
+            const footer = codexPromptHasMore || codexPromptLoading
+                ? `<div class="codex-prompt-footer"><button type="button" class="small-btn primary" onclick="loadMoreCodexPrompts()"${codexPromptLoading ? ' disabled' : ''}>${codexPromptLoading ? 'Loading…' : 'Load more'}</button></div>` : '';
+            panel.innerHTML = `<div class="codex-prompt-header"><span>Prompt history</span><span>${escapeHtml(countLabel)}</span></div>${error ? `<div class="claude-resume-meta" style="padding:12px;color:#ff6b61;">${escapeHtml(error)}</div>` : ''}${items}${empty}${footer}`;
+            panel.scrollTop = previousScrollTop;
+            updateTerminalControlsHeight();
+        }
+        async function toggleCodexPromptPanel() {
+            codexPromptPanelOpen = !codexPromptPanelOpen;
+            codexModelPanelOpen = false;
+            codexResumePanelOpen = false;
+            codexForkPanelOpen = false;
+            document.getElementById('codex-model-panel').classList.remove('active');
+            document.getElementById('codex-resume-panel').classList.remove('active');
+            document.getElementById('codex-fork-panel').classList.remove('active');
+            if (!codexPromptPanelOpen) {
+                document.getElementById('codex-prompt-panel').classList.remove('active');
+                updateTerminalControlsHeight();
+                return;
+            }
+            codexPromptItems = [];
+            codexPromptNextOffset = 0;
+            codexPromptHasMore = false;
+            codexPromptTotal = 0;
+            codexExpandedPrompts = new Set();
+            renderCodexPromptPanel();
+            await loadMoreCodexPrompts();
+        }
+        async function loadMoreCodexPrompts() {
+            if (codexPromptLoading || !codexPromptPanelOpen || codexPromptNextOffset >= 200) return;
+            codexPromptLoading = true;
+            renderCodexPromptPanel();
+            try {
+                const res = await fetchWithTimeout(`/api/sessions/${activeSessionId}/codex-prompts?offset=${codexPromptNextOffset}&limit=30`, {}, 60000);
+                const data = await res.json();
+                if (!res.ok || !data.success) throw new Error(data.error || 'Failed to load prompt history');
+                codexPromptItems.push(...(data.items || []));
+                codexPromptNextOffset = Number(data.nextOffset || codexPromptItems.length);
+                codexPromptHasMore = Boolean(data.hasMore) && codexPromptNextOffset < 200;
+                codexPromptTotal = Math.min(200, Number(data.total || codexPromptItems.length));
+                codexPromptLoading = false;
+                renderCodexPromptPanel();
+            } catch (error) {
+                codexPromptLoading = false;
+                renderCodexPromptPanel(error.message);
+            }
+        }
+        function toggleCodexPromptExpanded(index) {
+            if (codexExpandedPrompts.has(index)) codexExpandedPrompts.delete(index);
+            else codexExpandedPrompts.add(index);
+            renderCodexPromptPanel();
+        }
+        async function copyCodexPrompt(index) {
+            const prompt = codexPromptItems[index]?.text;
+            if (!prompt) return;
+            try {
+                await copyTextToClipboard(prompt);
+                const button = document.querySelector(`[data-codex-prompt-copy="${index}"]`);
+                if (!button) return;
+                button.textContent = 'Copied';
+                setTimeout(() => { if (button.isConnected) button.textContent = 'Copy'; }, 1200);
+            } catch (_) {
+                alert('Copy failed.');
+            }
+        }
         async function selectCodexResumeThread(threadId) {
             const res = await fetchWithTimeout(`/api/sessions/${activeSessionId}/codex-resume`, { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ threadId }) }, 30000);
             if (!res.ok) { alert((await res.json()).error || 'Unable to resume Codex thread'); return; }

package/lib/web/core.js

@@ -32,11 +32,18 @@
         let claudeApprovalJumpIndex = 0;
         let codexMessages = [];
         let codexPendingPermissions = [];
-        let codexState = { permissionMode: 'default', sandboxMode: 'default', effectivePermissionMode: null, effectiveSandboxMode: null, model: null, effort: null, status: 'idle', threadId: null, presentation: 'structured', models: [], canAbort: false, canSwitchToTerminal: false, canSwitchToStructured: false };
+        let codexState = { permissionMode: 'default', sandboxMode: 'default', effectivePermissionMode: null, effectiveSandboxMode: null, model: null, effort: null, status: 'idle', threadId: null, presentation: 'structured', models: [], canAbort: false, canCompact: false, compacting: false, canSwitchToTerminal: false, canSwitchToStructured: false };
         let codexModelPanelOpen = false;
         let codexModelCandidate = null;
         let codexResumePanelOpen = false;
         let codexForkPanelOpen = false;
+        let codexPromptPanelOpen = false;
+        let codexPromptItems = [];
+        let codexPromptNextOffset = 0;
+        let codexPromptHasMore = false;
+        let codexPromptTotal = 0;
+        let codexPromptLoading = false;
+        let codexExpandedPrompts = new Set();
         let codexRenderFrame = null;
         let codexApprovalJumpIndex = 0;
         const modifiers = { ctrl: false };

package/lib/web/index.html

@@ -122,6 +122,8 @@
                             <button id="codex-fork-btn" class="claude-ctrl-btn primary" onclick="toggleCodexForkPanel()" title="Fork a Codex thread in this conversation">Fork</button>
                         </div>
                         <div class="codex-control-page">
+                            <button id="codex-prompts-btn" class="claude-ctrl-btn" onclick="toggleCodexPromptPanel()" title="Browse and copy recent prompts">Prompts</button>
+                            <button id="codex-compact-btn" class="claude-ctrl-btn" onclick="compactCodexContext()" title="Compact the current Codex context">Compact</button>
                             <label class="codex-select-control" title="Sandbox mode">
                                 <span class="codex-select-label" aria-hidden="true">Sandbox</span>
                                 <select id="codex-sandbox-select" class="codex-select" aria-label="Sandbox mode" onchange="updateCodexSettingsFromControls()">
@@ -140,6 +142,7 @@
                     <div id="codex-model-panel"></div>
                     <div id="codex-resume-panel"></div>
                     <div id="codex-fork-panel"></div>
+                    <div id="codex-prompt-panel"></div>
                 </div>
                 <div id="timed-send-panel">
                     <div class="timed-row">

package/lib/web/session.js

@@ -130,11 +130,19 @@
             codexModelCandidate = null;
             codexResumePanelOpen = false;
             codexForkPanelOpen = false;
+            codexPromptPanelOpen = false;
+            codexPromptItems = [];
+            codexPromptNextOffset = 0;
+            codexPromptHasMore = false;
+            codexPromptTotal = 0;
+            codexPromptLoading = false;
+            codexExpandedPrompts = new Set();
             document.getElementById('codex-model-panel').classList.remove('active');
             document.getElementById('codex-resume-panel').classList.remove('active');
             document.getElementById('codex-fork-panel').classList.remove('active');
+            document.getElementById('codex-prompt-panel').classList.remove('active');
             document.getElementById('codex-control-rail').scrollLeft = 0;
-            codexState = { permissionMode: 'default', sandboxMode: 'default', effectivePermissionMode: null, effectiveSandboxMode: null, model: null, effort: null, status: 'idle', threadId: null, presentation: 'structured', models: [], canAbort: false, canSwitchToTerminal: false, canSwitchToStructured: false };
+            codexState = { permissionMode: 'default', sandboxMode: 'default', effectivePermissionMode: null, effectiveSandboxMode: null, model: null, effort: null, status: 'idle', threadId: null, presentation: 'structured', models: [], canAbort: false, canCompact: false, compacting: false, canSwitchToTerminal: false, canSwitchToStructured: false };
             setClaudeModeEnabled(false);
             applyCodexState(codexState);
             const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';

package/lib/web/styles.css

@@ -93,8 +93,22 @@
         .codex-message { max-width: 100%; margin: 0; color: #f5f5f7; font-size: 14px; line-height: 1.45; overflow-wrap: anywhere; }
         .codex-message.user { padding: 8px 12px; border: 1px solid rgba(0,122,255,.32); border-radius: 12px; background: rgba(0,122,255,.24); }
         .codex-message.event { color: var(--text-dim); text-align: center; font-size: 12px; }
-        .codex-message-time { display: block; width: max-content; margin-top: 4px; padding: 0 2px; color: #8e8e93; font-size: 10px; font-weight: 500; line-height: 1; font-variant-numeric: tabular-nums; }
-        .codex-message-block.user .codex-message-time { margin-left: auto; }
+        .codex-message-meta { display: flex; width: 100%; align-items: center; gap: 7px; margin-top: 4px; padding: 0 2px; box-sizing: border-box; }
+        .codex-message-block.user .codex-message-meta { justify-content: flex-end; }
+        .codex-message-time { display: block; flex: 0 0 auto; width: max-content; color: #8e8e93; font-size: 10px; font-weight: 500; line-height: 1; font-variant-numeric: tabular-nums; }
+        .codex-context-meter { --context-color: #30d158; position: relative; isolation: isolate; display: inline-flex; min-width: 128px; height: 16px; align-items: center; justify-content: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--context-color) 42%, transparent); border-radius: 8px; background: rgba(255,255,255,.055); color: #d9fbe2; font: 700 9px/1 ui-monospace, SFMono-Regular, Menlo, monospace; font-variant-numeric: tabular-nums; white-space: nowrap; }
+        .codex-context-meter::before { content: ''; position: absolute; inset: 0 auto 0 0; z-index: -1; width: var(--context-remaining); background: color-mix(in srgb, var(--context-color) 28%, transparent); }
+        .codex-context-meter.warn { --context-color: #ffd60a; color: #fff3a6; }
+        .codex-context-meter.danger { --context-color: #ff453a; color: #ffd0cc; }
+        .codex-compaction-card { display: flex; align-items: center; gap: 10px; margin: 10px 0 14px; padding: 10px 12px; border: 1px solid rgba(191,90,242,.3); border-radius: 10px; background: linear-gradient(135deg, rgba(191,90,242,.13), rgba(94,92,230,.08)); color: #f5f5f7; }
+        .codex-compaction-icon { display: grid; width: 28px; height: 28px; flex: 0 0 28px; place-items: center; border-radius: 50%; background: rgba(191,90,242,.18); color: #d6a5ff; font-size: 15px; }
+        .codex-compaction-title { font-size: 12px; font-weight: 800; }
+        .codex-compaction-meta { margin-top: 3px; color: #a9a9b0; font-size: 10px; font-variant-numeric: tabular-nums; }
+        .codex-compaction-card.running .codex-compaction-icon { animation: codex-pulse 1.1s ease-in-out infinite alternate; }
+        .codex-warning-card { display: flex; align-items: flex-start; gap: 10px; margin: 10px 0 14px; padding: 10px 12px; border: 1px solid rgba(255,204,0,.34); border-radius: 10px; background: linear-gradient(135deg, rgba(255,204,0,.13), rgba(255,159,10,.07)); color: #f5f5f7; }
+        .codex-warning-icon { display: grid; width: 28px; height: 28px; flex: 0 0 28px; place-items: center; border-radius: 50%; background: rgba(255,204,0,.16); color: #ffd60a; font-size: 15px; font-weight: 900; }
+        .codex-warning-title { color: #ffe680; font-size: 12px; font-weight: 800; }
+        .codex-warning-text { margin-top: 3px; color: #d8d3bf; font-size: 11px; line-height: 1.4; overflow-wrap: anywhere; }
         .codex-status-card { margin: 10px 0 14px; border: 1px solid rgba(100,210,255,.2); border-radius: 10px; background: rgba(28,28,30,.72); padding: 11px; color: #f5f5f7; }
         .codex-status-title { margin-bottom: 9px; color: #64d2ff; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
         .codex-status-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
@@ -151,6 +165,7 @@
         .claude-inline-permission { margin-top: 10px; padding: 10px; border-top: 1px solid rgba(255,204,0,0.22); background: rgba(255,204,0,0.04); }
         .claude-inline-permission-title { margin-bottom: 7px; color: #ffcc00; font-weight: 800; }
         @keyframes codex-spin { to { transform: rotate(360deg); } }
+        @keyframes codex-pulse { to { box-shadow: 0 0 0 5px rgba(191,90,242,.08); transform: scale(.92); } }
         #codex-control-panel { display: none; width: min(100%, var(--control-content-max)); margin: 0 auto; padding: 8px 14px 10px; border-bottom: 1px solid #222; background: #121212; box-sizing: border-box; }
         .codex-control-rail { display: flex; gap: 14px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
         .codex-control-rail::-webkit-scrollbar { display: none; }
@@ -162,8 +177,8 @@
         .codex-select-control:focus-within .codex-select-label { background: rgba(255,255,255,.14); border-color: rgba(0,122,255,.45); }
         .codex-select { appearance: none; position: absolute; inset: 0; width: 100%; min-width: 0; height: 100%; opacity: 0; cursor: pointer; }
         .codex-select option { background: #1c1c1e; color: #fff; }
-        #codex-model-panel, #codex-resume-panel, #codex-fork-panel { display: none; margin-top: 8px; border: 1px solid rgba(255,255,255,.1); background: rgba(28,28,30,.99); border-radius: 8px; box-shadow: 0 16px 36px rgba(0,0,0,.34); overflow: hidden; }
-        #codex-model-panel.active, #codex-resume-panel.active, #codex-fork-panel.active { display: block; }
+        #codex-model-panel, #codex-resume-panel, #codex-fork-panel, #codex-prompt-panel { display: none; margin-top: 8px; border: 1px solid rgba(255,255,255,.1); background: rgba(28,28,30,.99); border-radius: 8px; box-shadow: 0 16px 36px rgba(0,0,0,.34); overflow: hidden; }
+        #codex-model-panel.active, #codex-resume-panel.active, #codex-fork-panel.active, #codex-prompt-panel.active { display: block; }
         #codex-model-panel { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); max-height: min(300px, 42dvh); }
         #codex-model-panel.active { display: grid; }
         .codex-picker-column { min-width: 0; overflow-y: auto; }
@@ -173,6 +188,17 @@
         #codex-state-bar { display: flex; align-items: center; gap: 7px; min-height: 24px; margin-top: 8px; color: var(--text-dim); font-size: 11px; overflow-x: auto; scrollbar-width: none; white-space: nowrap; }
         #codex-state-bar::-webkit-scrollbar { display: none; }
         #codex-resume-panel, #codex-fork-panel { max-height: min(280px, 38dvh); overflow-y: auto; }
+        #codex-prompt-panel { max-height: min(440px, 52dvh); overflow-y: auto; }
+        .codex-prompt-header { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(28,28,30,.97); color: var(--text-dim); font-size: 11px; font-weight: 800; }
+        .codex-prompt-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: end; padding: 10px 11px; border-bottom: 1px solid rgba(255,255,255,.06); }
+        .codex-prompt-item:last-of-type { border-bottom: 0; }
+        .codex-prompt-text { display: -webkit-box; width: 100%; min-width: 0; max-height: calc(1.42em * 4); overflow: hidden; padding: 0; border: 0; background: transparent; color: #f5f5f7; font: 12px/1.42 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; text-align: left; white-space: pre-wrap; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 4; cursor: pointer; }
+        .codex-prompt-text.expanded { display: block; max-height: none; -webkit-line-clamp: initial; }
+        .codex-prompt-actions { display: flex; min-width: 64px; flex-direction: column; align-items: flex-end; gap: 6px; }
+        .codex-prompt-time { color: #77777e; font-size: 10px; font-variant-numeric: tabular-nums; white-space: nowrap; }
+        .codex-prompt-copy { min-width: 54px; min-height: 28px; padding: 0 9px; }
+        .codex-prompt-footer { padding: 9px 11px; text-align: center; }
+        .codex-prompt-footer .small-btn { min-width: 112px; }
         .claude-message { max-width: 92%; margin: 0 0 10px 0; padding: 10px 12px; border-radius: 8px; overflow-wrap: anywhere; line-height: 1.45; font-size: 14px; }
         .claude-message-block { max-width: 100%; margin: 0 0 12px; }
         .claude-message-block > .claude-message { margin-bottom: 0; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "glad-web",
-  "version": "1.0.30",
+  "version": "1.0.32",
   "description": "Glad transforms terminal-based AI coding tools into a polished, mobile-friendly local Web interface.",
   "bin": {
     "glad": "bin/cli.js"