chore: uptick

apps/desktop/src/styles.css

@@ -118,14 +118,29 @@
     --radius: 0.75rem;
     /* Thread ViewportFooter — gap from last msg → composer (scroll only) */
     --thread-composer-clearance: 8rem;
-    /* Composer shell — gap under bar to chat pane bottom */
+    /* Composer geometry — single source of truth for shell + controls. */
     --composer-shell-pad-block-end: 2.5rem;
+    --composer-inline-clearance: clamp(1rem, 5vw, 4rem);
+    --composer-min-width: 34rem;
+    --composer-target-width: 68%;
+    --composer-max-width: 56rem;
+    --composer-control-size: 2rem;
+    --composer-control-gap: 0.375rem;
+    --composer-row-gap: 0.375rem;
+    --composer-surface-pad-x: 0.5rem;
+    --composer-surface-pad-y: 0.375rem;
+    --composer-input-min-height: 2rem;
+    --composer-input-max-height: 9.375rem;
+    --composer-input-inline-min-width: 8rem;
+    --composer-fallback-height: 2.75rem;
     --vsq: min(0.5vh, 0.5vw);
     --image-preview-max-width: 34rem;
     --image-preview-height: clamp(16.25rem, calc(var(--vsq) * 100), 26.25rem);
 
-    /* Sidebar layout */
+    /* Shell layout */
     --sidebar-width: 14rem;
+    --chat-min-width: 24rem;
+    --shell-gap: 0.625rem;
     --titlebar-control-size: 1.25rem;
     --titlebar-control-height: 1.375rem;
 
@@ -190,7 +205,9 @@ input,
 textarea,
 [contenteditable]:not([contenteditable='false']),
 [data-slot='aui_user-message-root'],
-[data-slot='aui_assistant-message-content'] {
+[data-slot='aui_assistant-message-content'],
+[data-selectable-text='true'],
+[data-selectable-text='true'] * {
   -webkit-user-select: text;
   user-select: text;
 }
@@ -247,17 +264,23 @@ canvas {
   display: none;
 }
 
-@supports (content-visibility: auto) {
-  [data-slot='aui_user-message-root'],
-  [data-slot='aui_assistant-message-root'] {
-    content-visibility: auto;
-    contain-intrinsic-size: auto 10rem;
-  }
-
-  [data-slot='aui_user-message-root'] {
-    contain-intrinsic-size: auto 4rem;
-  }
-}
+/*
+ * Previously applied `content-visibility: auto` + `contain-intrinsic-size` to
+ * message roots for virtualization-lite perf. REMOVED because it interacts
+ * badly with a stick-to-bottom scroller:
+ *
+ *   1. Session loads, messages render at their real heights.
+ *   2. Scroller pins to `scrollHeight - clientHeight`.
+ *   3. A few seconds later the browser's content-visibility heuristic kicks
+ *      in for off-screen messages and collapses them to the 10rem intrinsic
+ *      placeholder — shrinking total scrollHeight by a large margin.
+ *   4. The browser clamps scrollTop to the new (smaller) scrollHeight, and
+ *      the user's viewport "scrolls up by a weird %" a few seconds after
+ *      the session loads. Feels like a scroll bug; actually CSS.
+ *
+ * If we want perf here again, the correct path is a real virtualizer (e.g.
+ * react-virtuoso) with stable item sizing — not a CSS heuristic.
+ */
 
 .aui-md img {
   display: block;
@@ -281,6 +304,25 @@ canvas {
   overflow-wrap: anywhere;
 }
 
+.hermes-preview-webview {
+  display: flex;
+}
+
+[data-slot='composer-root'] {
+  width: clamp(var(--composer-min-width), var(--composer-target-width), var(--composer-max-width));
+  max-width: calc(100% - var(--composer-inline-clearance));
+}
+
+/* Thread scroll container (from use-stick-to-bottom).
+ * `scroll-behavior: auto` is critical: use-stick-to-bottom writes scrollTop
+ * directly and temporarily forces this to 'auto' during its programmatic
+ * scrolls, but we default it to 'auto' anyway so no smooth-scroll fight can
+ * ever happen. We leave overflow-anchor at the browser default ('auto'); the
+ * library handles follow-mode imperatively. */
+[data-slot='aui_thread-content'] {
+  scroll-behavior: auto;
+}
+
 .aui-md a,
 .aui-md code {
   overflow-wrap: anywhere;
@@ -314,6 +356,25 @@ canvas {
   margin: 0 0 1rem;
 }
 
+/* Streamdown wraps every fenced block in <div data-streamdown="code-block">
+ * with `flex flex-col gap-2 p-2 border bg-sidebar rounded-xl my-4`. Our own
+ * CodeHeader + SyntaxHighlighter already supply the chrome, so undo the
+ * library's wrapper to keep the header flush with the code body. */
+.aui-md [data-streamdown='code-block'],
+[data-streamdown='code-block'] {
+  padding: 0 !important;
+  gap: 0 !important;
+  border: 0 !important;
+  background: transparent !important;
+  border-radius: 0 !important;
+  margin: 1rem 0 !important;
+}
+
+.aui-md [data-streamdown='code-block'] > *,
+[data-streamdown='code-block'] > * {
+  margin: 0 !important;
+}
+
 .aui-md h1 {
   margin: 1.6rem 0 0.55rem;
 }