diff --git a/web/static/css/style.css b/web/static/css/style.css
index 2e14c712..ada4457d 100644
--- a/web/static/css/style.css
+++ b/web/static/css/style.css
@@ -964,7 +964,33 @@ header {
align-items: flex-start;
justify-content: space-between;
gap: 10px;
- margin-bottom: 10px;
+ cursor: pointer;
+ user-select: none;
+}
+
+.hitl-sidebar-header-actions {
+ display: flex;
+ align-items: center;
+ gap: 6px;
+ flex-shrink: 0;
+}
+
+.hitl-sidebar-body {
+ overflow: hidden;
+ max-height: 500px;
+ opacity: 1;
+ margin-top: 10px;
+ transition: max-height 0.3s ease, opacity 0.2s ease, margin-top 0.3s ease;
+}
+
+.hitl-sidebar-collapsed .hitl-sidebar-body {
+ max-height: 0;
+ opacity: 0;
+ margin-top: 0;
+}
+
+.hitl-sidebar-collapsed .hitl-apply-btn {
+ display: none;
}
.hitl-sidebar-heading {
diff --git a/web/static/js/chat.js b/web/static/js/chat.js
index 6d05de41..2b29e605 100644
--- a/web/static/js/chat.js
+++ b/web/static/js/chat.js
@@ -399,6 +399,23 @@ if (typeof window !== 'undefined') {
window.updateHitlStatusUI = updateHitlStatusUI;
}
+function toggleHitlSidebarCard() {
+ var card = document.getElementById('hitl-sidebar-card');
+ if (!card) return;
+ card.classList.toggle('hitl-sidebar-collapsed');
+ try {
+ localStorage.setItem('hitl-sidebar-collapsed', card.classList.contains('hitl-sidebar-collapsed') ? '1' : '0');
+ } catch (e) {}
+}
+window.toggleHitlSidebarCard = toggleHitlSidebarCard;
+
+document.addEventListener('DOMContentLoaded', function () {
+ var card = document.getElementById('hitl-sidebar-card');
+ if (card && localStorage.getItem('hitl-sidebar-collapsed') === '0') {
+ card.classList.remove('hitl-sidebar-collapsed');
+ }
+});
+
function getAgentModeLabelForValue(mode) {
if (typeof window.t === 'function') {
switch (mode) {
diff --git a/web/templates/index.html b/web/templates/index.html
index 65213f21..caaa3d58 100644
--- a/web/templates/index.html
+++ b/web/templates/index.html
@@ -510,8 +510,8 @@
-