feat: leftsidebar collapsible tool groups + scroll + resizable width

frontend/src/styles.css

@@ -455,14 +455,38 @@ a:hover { text-decoration: underline; }
   flex-direction: column;
   overflow: hidden;
   min-width: 0;
+  position: relative;
 }
 .leftbar-header {
+  flex-shrink: 0;
   padding: var(--spacing-md) var(--spacing-md) var(--spacing-sm);
   border-bottom: 1px solid var(--color-border);
   display: flex;
   align-items: center;
   justify-content: space-between;
 }
+.leftbar-content {
+  flex: 1;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
+}
+.leftbar-resize-handle {
+  position: absolute;
+  right: -2px;
+  top: 0;
+  bottom: 0;
+  width: 4px;
+  cursor: col-resize;
+  z-index: 10;
+}
+.leftbar-resize-handle:hover {
+  background: var(--color-primary);
+}
+.tool-section-chevron {
+  font-size: 8px;
+  display: inline-block;
+  flex-shrink: 0;
+}
 .leftbar-title {
   font-size: var(--fs-xs);
   font-weight: 600;
@@ -543,6 +567,7 @@ a:hover { text-decoration: underline; }
 .tool-btn.active .tool-btn-kbd { color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.15); }
 
 .leftbar-footer {
+  flex-shrink: 0;
   margin-top: auto;
   padding: var(--spacing-sm);
   border-top: 1px solid var(--color-border);