fix: First session nits (read desc)

apps/code/src/renderer/components/ui/combobox/Combobox.css

@@ -381,7 +381,7 @@
 
 .combobox-trigger.size-1 {
   height: var(--space-5);
-  gap: var(--space-1);
+  gap: var(--space-2);
   font-size: var(--font-size-1);
   line-height: var(--line-height-1);
   letter-spacing: var(--letter-spacing-1);
@@ -586,7 +586,7 @@
 }
 
 .combobox-trigger.variant-outline {
-  color: var(--gray-11);
+  color: var(--gray-12);
   background-color: transparent;
   box-shadow: inset 0 0 0 1px var(--gray-a7);
 }
@@ -609,7 +609,7 @@
 }
 
 .combobox-trigger.variant-outline .combobox-trigger-icon {
-  color: var(--gray-11);
+  color: var(--gray-12);
 }
 
 .combobox-trigger:disabled .combobox-trigger-icon {

apps/code/src/renderer/components/ui/combobox/Combobox.tsx

@@ -1,5 +1,7 @@
-import { CaretDown, Check, MagnifyingGlass } from "@phosphor-icons/react";
-import { Popover } from "@radix-ui/themes";
+import { Check, MagnifyingGlass } from "@phosphor-icons/react";
+import { ChevronDownIcon } from "@radix-ui/react-icons";
+import { Button, Flex, Popover } from "@radix-ui/themes";
+import type { Responsive } from "@radix-ui/themes/dist/esm/props/prop-def.js";
 import { Command as CmdkCommand } from "cmdk";
 import React, {
   createContext,
@@ -15,12 +17,6 @@ import "./Combobox.css";
 import { useComboboxFilter } from "./useComboboxFilter";
 
 type ComboboxSize = "1" | "2" | "3";
-type ComboboxTriggerVariant =
-  | "classic"
-  | "surface"
-  | "soft"
-  | "ghost"
-  | "outline";
 type ComboboxContentVariant = "solid" | "soft";
 
 interface ComboboxContextValue {
@@ -150,7 +146,7 @@ function ComboboxRoot({
 interface ComboboxTriggerProps {
   children?: React.ReactNode;
   className?: string;
-  variant?: ComboboxTriggerVariant;
+  variant?: "outline" | "ghost" | "surface" | "soft" | "classic";
   color?: string;
   placeholder?: string;
   style?: React.CSSProperties;
@@ -159,33 +155,33 @@ interface ComboboxTriggerProps {
 function ComboboxTrigger({
   children,
   className = "",
-  variant = "surface",
+  variant = "outline",
   placeholder = "Select...",
   style,
 }: ComboboxTriggerProps) {
   const { size, value, open, disabled, getItemLabel } = useComboboxContext();
 
   const displayValue =
     children ?? (getItemLabel(value) || value || placeholder);
-  const hasPlaceholder = !children && !value;
 
   return (
     <Popover.Trigger>
-      <button
-        type="button"
-        className={`combobox-trigger size-${size} variant-${variant} ${className}`}
-        data-state={open ? "open" : "closed"}
-        data-placeholder={hasPlaceholder ? "" : undefined}
+      <Button
+        color="gray"
+        variant={variant}
+        size={size as Responsive<"1" | "2" | "3">}
         disabled={disabled}
+        className={className}
+        data-state={open ? "open" : "closed"}
         style={style}
       >
-        <span className="combobox-trigger-inner">{displayValue}</span>
-        {!disabled && (
-          <span className="combobox-trigger-icon">
-            <CaretDown weight="bold" />
-          </span>
-        )}
-      </button>
+        <Flex justify="between" align="center" gap="2">
+          <Flex align="center" gap="2" style={{ minWidth: 0 }}>
+            {displayValue}
+          </Flex>
+          {!disabled && <ChevronDownIcon style={{ flexShrink: 0 }} />}
+        </Flex>
+      </Button>
     </Popover.Trigger>
   );
 }

apps/code/src/renderer/features/command-center/components/CommandCenterToolbar.tsx

@@ -118,7 +118,7 @@ export function CommandCenterToolbar({
       gap="3"
       px="3"
       py="2"
-      className="shrink-0 border-gray-6 border-b"
+      className="no-drag shrink-0 border-gray-6 border-b"
     >
       <Select.Root
         value={layout}

apps/code/src/renderer/features/git-interaction/components/BranchSelector.tsx

@@ -122,7 +122,7 @@ export function BranchSelector({
     effectiveLoading || (isCloudMode && open && cloudBranchesFetchingMore);
 
   const triggerContent = (
-    <Flex align="center" gap="1" style={{ minWidth: 0 }}>
+    <Flex align="center" gap="2" style={{ minWidth: 0 }}>
       {showSpinner ? (
         <Spinner size="1" />
       ) : (

apps/code/src/renderer/features/message-editor/components/ModeIndicatorInput.tsx

@@ -90,8 +90,10 @@ export function ModeIndicatorInput({
     <Flex
       align="center"
       justify="between"
-      py="1"
-      style={onCycleMode ? { cursor: "pointer" } : undefined}
+      py="0"
+      style={
+        onCycleMode ? { cursor: "pointer", userSelect: "none" } : undefined
+      }
       onClick={onCycleMode}
     >
       <Flex align="center" gap="1">

apps/code/src/renderer/features/message-editor/components/message-editor.css

@@ -1,7 +1,7 @@
 /* Tiptap placeholder - targets empty first paragraph */
 .cli-editor p.is-editor-empty:first-child::before {
   content: attr(data-placeholder);
-  color: var(--gray-11);
+  color: var(--gray-8);
   pointer-events: none;
   float: left;
   height: 0;

apps/code/src/renderer/features/message-editor/stores/taskInputHistoryStore.ts

@@ -11,7 +11,7 @@ interface TaskInputHistoryActions {
 
 type TaskInputHistoryStore = TaskInputHistoryState & TaskInputHistoryActions;
 
-const MAX_HISTORY = 50;
+const MAX_HISTORY = 15;
 
 export const useTaskInputHistoryStore = create<TaskInputHistoryStore>()(
   persist(

apps/code/src/renderer/features/message-editor/tiptap/useTiptapEditor.ts

@@ -38,7 +38,7 @@ export interface UseTiptapEditorOptions {
 }
 
 const EDITOR_CLASS =
-  "cli-editor min-h-[1.5em] w-full break-words border-none bg-transparent pr-2 text-[13px] text-[var(--gray-12)] outline-none [overflow-wrap:break-word] [white-space:pre-wrap] [word-break:break-word]";
+  "cli-editor min-h-[1.5em] w-full break-words border-none bg-transparent pr-2 text-[14px] text-[var(--gray-12)] outline-none [overflow-wrap:break-word] [white-space:pre-wrap] [word-break:break-word]";
 
 async function pasteTextAsFile(
   view: EditorView,

apps/code/src/renderer/features/sessions/components/ReasoningLevelSelector.tsx

@@ -1,6 +1,6 @@
 import type { SessionConfigOption } from "@agentclientprotocol/sdk";
-import { Brain } from "@phosphor-icons/react";
-import { Flex, Select, Text } from "@radix-ui/themes";
+import { Brain, CaretDown, Check } from "@phosphor-icons/react";
+import { Button, DropdownMenu, Flex, Text } from "@radix-ui/themes";
 import { flattenSelectOptions } from "../stores/sessionStore";
 
 interface ReasoningLevelSelectorProps {
@@ -10,6 +10,16 @@ interface ReasoningLevelSelectorProps {
   disabled?: boolean;
 }
 
+const triggerStyle = {
+  fontSize: "var(--font-size-1)",
+  color: "var(--gray-11)",
+  padding: "4px 8px",
+  height: "auto",
+  minHeight: "unset",
+  gap: "6px",
+  userSelect: "none" as const,
+};
+
 export function ReasoningLevelSelector({
   thoughtOption,
   adapter,
@@ -27,25 +37,9 @@ export function ReasoningLevelSelector({
     options.find((opt) => opt.value === activeLevel)?.name ?? activeLevel;
 
   return (
-    <Select.Root
-      value={activeLevel}
-      onValueChange={(value) => onChange?.(value)}
-      disabled={disabled}
-      size="1"
-    >
-      <Select.Trigger
-        variant="ghost"
-        style={{
-          fontSize: "var(--font-size-1)",
-          color: "var(--gray-11)",
-          padding: "4px 8px",
-          marginLeft: "4px",
-          height: "auto",
-          minHeight: "unset",
-          gap: "6px",
-        }}
-      >
-        <Flex align="center" gap="1">
+    <DropdownMenu.Root>
+      <DropdownMenu.Trigger disabled={disabled}>
+        <Button variant="ghost" color="gray" size="1" style={triggerStyle}>
           <Brain
             size={14}
             weight="regular"
@@ -54,15 +48,34 @@ export function ReasoningLevelSelector({
           <Text size="1">
             {adapter === "codex" ? "Reasoning" : "Effort"}: {activeLabel}
           </Text>
-        </Flex>
-      </Select.Trigger>
-      <Select.Content position="popper" sideOffset={4}>
+          <CaretDown
+            size={10}
+            weight="bold"
+            style={{ color: "var(--gray-9)", flexShrink: 0 }}
+          />
+        </Button>
+      </DropdownMenu.Trigger>
+
+      <DropdownMenu.Content align="start" sideOffset={4} size="1">
         {options.map((level) => (
-          <Select.Item key={level.value} value={level.value}>
-            {level.name}
-          </Select.Item>
+          <DropdownMenu.Item
+            key={level.value}
+            onSelect={() => onChange?.(level.value)}
+          >
+            <Flex align="center" gap="2" style={{ minWidth: "100px" }}>
+              <Check
+                size={12}
+                weight="bold"
+                style={{
+                  flexShrink: 0,
+                  opacity: level.value === activeLevel ? 1 : 0,
+                }}
+              />
+              <Text size="1">{level.name}</Text>
+            </Flex>
+          </DropdownMenu.Item>
         ))}
-      </Select.Content>
-    </Select.Root>
+      </DropdownMenu.Content>
+    </DropdownMenu.Root>
   );
 }

apps/code/src/renderer/features/sessions/components/UnifiedModelSelector.tsx

@@ -5,6 +5,7 @@ import type {
 import type { AgentAdapter } from "@features/settings/stores/settingsStore";
 import {
   ArrowsClockwise,
+  CaretDown,
   Check,
   Cpu,
   Robot,
@@ -71,10 +72,10 @@ export function UnifiedModelSelector({
     fontSize: "var(--font-size-1)",
     color: "var(--gray-11)",
     padding: "4px 8px",
-    marginLeft: "4px",
     height: "auto",
     minHeight: "unset",
     gap: "6px",
+    userSelect: "none" as const,
   };
 
   if (isConnecting) {
@@ -123,6 +124,11 @@ export function UnifiedModelSelector({
             {ADAPTER_ICONS[adapter]}
           </Flex>
           <Text size="1">{currentLabel ?? "Model"}</Text>
+          <CaretDown
+            size={10}
+            weight="bold"
+            style={{ color: "var(--gray-9)", flexShrink: 0 }}
+          />
         </Button>
       </DropdownMenu.Trigger>
 

apps/code/src/renderer/features/sidebar/components/TaskListView.tsx

@@ -360,7 +360,22 @@ export function TaskListView({
 
       <SectionLabel label="Tasks" endContent={<TaskFilterMenu />} />
 
-      {organizeMode === "by-project" ? (
+      {pinnedTasks.length === 0 &&
+      flatTasks.length === 0 &&
+      groupedTasks.length === 0 ? (
+        <div className="flex flex-col items-center gap-3 px-4 py-8 text-center">
+          <Text size="2" className="text-gray-11">
+            No tasks yet
+          </Text>
+          <button
+            type="button"
+            className="rounded-md bg-gray-3 px-3 py-1.5 text-[13px] text-gray-12 transition-colors hover:bg-gray-4"
+            onClick={() => navigateToTaskInput()}
+          >
+            New task
+          </button>
+        </div>
+      ) : organizeMode === "by-project" ? (
         <DragDropProvider
           onDragOver={handleDragOver}
           sensors={[

apps/code/src/renderer/features/task-detail/components/TaskInputEditor.tsx

@@ -65,11 +65,21 @@ export const TaskInputEditor = forwardRef<
     const { isOnline } = useConnectivity();
     const isSubmitDisabled = isCreatingTask || !isOnline;
 
+    const hasHistory = useTaskInputHistoryStore((s) => s.prompts.length > 0);
+
     const getPromptHistory = useCallback(
       () => useTaskInputHistoryStore.getState().prompts,
       [],
     );
 
+    const hints = [
+      "@ to add files",
+      "/ for skills",
+      hasHistory ? "\u2191\u2193 for history" : "",
+    ]
+      .filter(Boolean)
+      .join(", ");
+
     const {
       editor,
       isEmpty,
@@ -85,8 +95,7 @@ export const TaskInputEditor = forwardRef<
       removeAttachment,
     } = useTiptapEditor({
       sessionId,
-      placeholder:
-        "What do you want to work on? \u2191\u2193 for history, @ to add context",
+      placeholder: `What do you want to ship? ${hints}`,
       disabled: isCreatingTask,
       submitDisabled: !isOnline,
       isLoading: isCreatingTask,
@@ -180,7 +189,7 @@ export const TaskInputEditor = forwardRef<
       >
         <Flex
           direction="column"
-          p="3"
+          p="4"
           style={{
             cursor: "text",
             position: "relative",
@@ -236,8 +245,8 @@ export const TaskInputEditor = forwardRef<
           </Flex>
         </Flex>
 
-        <Flex justify="between" align="center" px="3" pb="3">
-          <Flex align="center" gap="3">
+        <Flex justify="between" align="center" px="4" pb="4">
+          <Flex align="center" gap="4">
             <EditorToolbar
               disabled={isCreatingTask}
               adapter={adapter}