feat(quick-pane): promote chats into full sessions

ui/src/quick-pane/quick-pane.css

@@ -87,11 +87,11 @@ body {
 }
 
 .quick-pane-primary-controls {
-  flex: 1 1 auto;
+  flex: 1 1 0;
 }
 
 .quick-pane-header-actions {
-  flex: 0 1 auto;
+  flex: 0 0 auto;
   justify-content: end;
 }
 
@@ -105,8 +105,7 @@ body {
 }
 
 .quick-pane-model-selector {
-  flex: 1 1 230px;
-  max-width: 310px;
+  flex: 1 1 0;
   color: #bbb7b0;
   font-weight: 750;
   letter-spacing: 0.04em;
@@ -150,16 +149,6 @@ body {
   }
 }
 
-.quick-pane .model-trigger {
-  height: 27px;
-  border: 0;
-  padding: 5px 25px 5px 8px;
-  color: #e6e3df;
-  background-color: #353535;
-  font-size: 11px;
-  font-weight: 500;
-}
-
 .quick-pane .model-menu {
   width: min(400px, calc(100vw - 24px));
   max-height: min(350px, calc(100vh - 56px));
@@ -236,16 +225,48 @@ body {
 }
 
 .quick-pane button:focus-visible,
-.quick-pane select:focus-visible,
-.quick-pane-request:focus {
+.quick-pane select:focus-visible {
   outline: 3px solid #f0a347;
   outline-offset: 2px;
 }
 
-.quick-pane-close {
-  color: #e6e3df !important;
-  background: #45413c !important;
-  font-size: 11px !important;
+.quick-pane-toolbar-control {
+  box-sizing: border-box;
+  height: 27px;
+  min-width: 0;
+  padding: 0 8px;
+  border: 1px solid #70522f;
+  border-radius: 5px;
+  color: #e6e3df;
+  background: #353535;
+  font: 500 11px / 1 Inter, ui-sans-serif, system-ui, sans-serif;
+  cursor: pointer;
+}
+
+.quick-pane .model-trigger.quick-pane-toolbar-control,
+.quick-pane .thinking-selector.thinking-selector select.quick-pane-toolbar-control {
+  appearance: auto;
+  background: #353535;
+}
+
+.quick-pane-toolbar-control:hover:not(:disabled) {
+  border-color: #d88735;
+  background: #44382d;
+}
+
+.quick-pane-toolbar-control:focus-visible {
+  outline: 3px solid #f0a347;
+  outline-offset: 2px;
+}
+
+.quick-pane-toolbar-control:disabled {
+  opacity: 0.58;
+  cursor: not-allowed;
+}
+
+.quick-pane-request:focus {
+  outline: 3px solid #f0a347;
+  outline-offset: 2px;
 }
 
 .quick-pane-exchange {
@@ -577,13 +598,6 @@ body {
   gap: 4px;
 }
 
-.quick-pane-action {
-  min-height: 30px;
-  padding: 4px 7px !important;
-  color: #e6e3df !important;
-  background: #45413c !important;
-  font-size: 10px !important;
-}
 
 .quick-pane-send {
   position: absolute;
@@ -643,13 +657,6 @@ body {
     font-size: 10px;
   }
 
-  .quick-pane-close {
-    width: 27px;
-    height: 27px;
-    padding: 0 !important;
-    font-size: 18px !important;
-  }
-
   .quick-pane-user-message {
     max-width: 88%;
   }