fix(app): polish workspace controls

packages/app/src/composer/draft/import-pill.tsx

@@ -19,6 +19,7 @@ export function ComposerImportPill({ onPress, disabled = false }: ComposerImport
   const handleHoverIn = useCallback(() => setIsHovered(true), []);
   const handleHoverOut = useCallback(() => setIsHovered(false), []);
   const bodyStyle = useMemo(() => [styles.body, isHovered && styles.bodyHovered], [isHovered]);
+  const labelStyle = useMemo(() => [styles.label, isHovered && styles.labelHovered], [isHovered]);
   return (
     <View style={styles.row}>
       <Pressable
@@ -32,7 +33,7 @@ export function ComposerImportPill({ onPress, disabled = false }: ComposerImport
         style={bodyStyle}
       >
         <ThemedImportIcon size={14} uniProps={iconColorMapping} />
-        <Text style={styles.label} numberOfLines={1}>
+        <Text style={labelStyle} numberOfLines={1}>
           {t("importSession.title")}
         </Text>
       </Pressable>
@@ -50,7 +51,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
     paddingHorizontal: theme.spacing[3],
     paddingVertical: theme.spacing[2],
-    borderRadius: theme.borderRadius.md,
+    borderRadius: theme.borderRadius.xl,
     borderWidth: theme.borderWidth[1],
     borderColor: theme.colors.borderAccent,
     backgroundColor: theme.colors.surface1,
@@ -59,7 +60,10 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   label: {
-    color: theme.colors.foreground,
+    color: theme.colors.foregroundMuted,
     fontSize: theme.fontSize.sm,
   },
+  labelHovered: {
+    color: theme.colors.foreground,
+  },
 }));

packages/app/src/screens/workspace/workspace-screen.tsx

@@ -3536,7 +3536,7 @@ function WorkspaceScreenContent({
             tooltipLabel={t("workspace.tabs.explorer.toggle")}
             tooltipKeys={EXPLORER_TOGGLE_KEYS}
             tooltipSide="left"
-            style={styles.compactHeaderActionButton}
+            style={[styles.compactHeaderActionButton, styles.explorerPanelButton]}
             accessible
             accessibilityRole="button"
             accessibilityLabel={explorerToggleLabel}
@@ -3959,6 +3959,11 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "center",
     justifyContent: "center",
   },
+  explorerPanelButton: {
+    // The 32px trigger and 16px panel glyph leave 8px more trailing space than
+    // the 22px split-pane trigger and its 14px glyph in the row below.
+    marginRight: -theme.spacing[2],
+  },
   compactHeaderMenuCluster: {
     flexDirection: "row",
     alignItems: "center",
@@ -3977,6 +3982,9 @@ const styles = StyleSheet.create((theme) => ({
     minHeight: Math.ceil(theme.fontSize.sm * 1.5) + theme.spacing[1] * 2,
     minWidth: Math.ceil(theme.fontSize.sm * 1.5) + theme.spacing[1] * 2,
     borderRadius: theme.borderRadius.md,
+    // Match the painted right edge of the trailing split-pane glyph below. The
+    // two header rows intentionally use different control sizes and padding.
+    marginRight: -7,
   },
   sourceControlButtonWithStats: {
     paddingHorizontal: theme.spacing[3],