Commit b438447f67b6b61bbe6f564d8b78fd90702117c5 | the-knife

apps/mobile/generated-uniwind-default-theme-variables.json+6

 @@ -28,6 +28,9 @@
     "--color-switch-active-thumb": "#ffffff",
     "--color-switch-inactive-track": "rgba(0, 0, 0, 0.08)",
     "--color-switch-inactive-thumb": "#8e8e93",
+    "--color-warning": "#fffbeb",
+    "--color-warning-border": "#fde68a",
+    "--color-warning-foreground": "#b45309",
     "--color-danger": "#fef2f2",
     "--color-danger-border": "rgba(239, 68, 68, 0.12)",
     "--color-danger-foreground": "#dc2626",
 @@ -95,6 +98,9 @@
     "--color-switch-active-thumb": "#ffffff",
     "--color-switch-inactive-track": "rgba(255, 255, 255, 0.06)",
     "--color-switch-inactive-thumb": "#8e8e93",
+    "--color-warning": "rgba(69, 26, 3, 0.4)",
+    "--color-warning-border": "rgba(120, 53, 15, 0.6)",
+    "--color-warning-foreground": "#fcd34d",
     "--color-danger": "rgba(239, 68, 68, 0.14)",
     "--color-danger-border": "rgba(248, 113, 113, 0.18)",
     "--color-danger-foreground": "#fca5a5",

apps/mobile/generated-uniwind-themes.css+30

 @@ -150,6 +150,9 @@
       --color-switch-active-thumb: #ffffff;
       --color-switch-inactive-track: #f1c4e6;
       --color-switch-inactive-thumb: #8d1255;
+      --color-warning: #fcf0ea;
+      --color-warning-border: rgba(245, 158, 11, 0.32);
+      --color-warning-foreground: #b05109;
       --color-danger: #fde4f1;
       --color-danger-border: rgba(247, 8, 108, 0.32);
       --color-danger-foreground: #9d174d;
 @@ -275,6 +278,9 @@
       --color-switch-active-thumb: #fbd0e8;
       --color-switch-inactive-track: #362d3d;
       --color-switch-inactive-thumb: #e7d0dd;
+      --color-warning: #412f20;
+      --color-warning-border: rgba(245, 158, 11, 0.32);
+      --color-warning-foreground: #fbbf24;
       --color-danger: #331a2b;
       --color-danger-border: rgba(157, 23, 77, 0.32);
       --color-danger-foreground: #fbd0e8;
 @@ -400,6 +406,9 @@
       --color-switch-active-thumb: #fffaff;
       --color-switch-inactive-track: #e2ede7;
       --color-switch-inactive-thumb: #6e696f;
+      --color-warning: #f4f0e1;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #b64a00;
       --color-danger: #f4e7e5;
       --color-danger-border: rgba(251, 44, 54, 0.32);
       --color-danger-foreground: #c10007;
 @@ -525,6 +534,9 @@
       --color-switch-active-thumb: #241523;
       --color-switch-inactive-track: #2a4b39;
       --color-switch-inactive-thumb: #9da5a2;
+      --color-warning: #3f3a1c;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #ffb900;
       --color-danger: #3f2c28;
       --color-danger-border: rgba(251, 65, 74, 0.32);
       --color-danger-foreground: #ff6668;
 @@ -650,6 +662,9 @@
       --color-switch-active-thumb: #fffaff;
       --color-switch-inactive-track: #e4ecf2;
       --color-switch-inactive-thumb: #6f6873;
+      --color-warning: #f6efe4;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #b74b00;
       --color-danger: #f5e6e9;
       --color-danger-border: rgba(251, 44, 54, 0.32);
       --color-danger-foreground: #c10007;
 @@ -775,6 +790,9 @@
       --color-switch-active-thumb: #241523;
       --color-switch-inactive-track: #293f52;
       --color-switch-inactive-thumb: #969ca6;
+      --color-warning: #3c3424;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #ffb900;
       --color-danger: #3c2630;
       --color-danger-border: rgba(251, 65, 74, 0.32);
       --color-danger-foreground: #ff6467;
 @@ -900,6 +918,9 @@
       --color-switch-active-thumb: #fffaff;
       --color-switch-inactive-track: #f3eae5;
       --color-switch-inactive-thumb: #74686f;
+      --color-warning: #f9efe2;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #b84b00;
       --color-danger: #f9e7e6;
       --color-danger-border: rgba(251, 44, 54, 0.32);
       --color-danger-foreground: #c10007;
 @@ -1025,6 +1046,9 @@
       --color-switch-active-thumb: #241523;
       --color-switch-inactive-track: #513728;
       --color-switch-inactive-thumb: #a59996;
+      --color-warning: #4b3215;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #ffb900;
       --color-danger: #4a2321;
       --color-danger-border: rgba(251, 65, 74, 0.32);
       --color-danger-foreground: #ff6467;
 @@ -1150,6 +1174,9 @@
       --color-switch-active-thumb: #fffaff;
       --color-switch-inactive-track: #edeaf4;
       --color-switch-inactive-thumb: #726874;
+      --color-warning: #f8efe5;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #b84b00;
       --color-danger: #f8e6ea;
       --color-danger-border: rgba(251, 44, 54, 0.32);
       --color-danger-foreground: #c10007;
 @@ -1275,6 +1302,9 @@
       --color-switch-active-thumb: #241523;
       --color-switch-inactive-track: #362d51;
       --color-switch-inactive-thumb: #9690a1;
+      --color-warning: #412e23;
+      --color-warning-border: rgba(254, 154, 0, 0.32);
+      --color-warning-foreground: #ffb900;
       --color-danger: #40202e;
       --color-danger-border: rgba(251, 65, 74, 0.32);
       --color-danger-foreground: #ff6467;

apps/mobile/global.css+10

 @@ -52,6 +52,11 @@
       --color-switch-inactive-track: rgba(0, 0, 0, 0.08);
       --color-switch-inactive-thumb: #8e8e93;
+      /* Warning */
+      --color-warning: #fffbeb;
+      --color-warning-border: #fde68a;
+      --color-warning-foreground: #b45309;
       /* Danger */
       --color-danger: #fef2f2;
       --color-danger-border: rgba(239, 68, 68, 0.12);
 @@ -151,6 +156,11 @@
       --color-switch-inactive-track: rgba(255, 255, 255, 0.06);
       --color-switch-inactive-thumb: #8e8e93;
+      /* Warning */
+      --color-warning: rgba(69, 26, 3, 0.4);
+      --color-warning-border: rgba(120, 53, 15, 0.6);
+      --color-warning-foreground: #fcd34d;
       /* Danger */
       --color-danger: rgba(239, 68, 68, 0.14);
       --color-danger-border: rgba(248, 113, 113, 0.18);

apps/mobile/src/components/AppText.tsx+2

...	@@ -35,6 +35,8 @@ export function AppTextInput({ className, ref, ...props }: AppTextInputProps) {	...	@@ -35,6 +35,8 @@ export function AppTextInput({ className, ref, ...props }: AppTextInputProps) {
35	className,	35	className,
36	)}	36	)}
37	placeholderTextColorClassName="accent-placeholder"	37	placeholderTextColorClassName="accent-placeholder"
		38	selectionColorClassName="accent-foreground-secondary"
		39	cursorColorClassName="accent-foreground-secondary"
38	{...props}	40	{...props}
39	/>	41	/>
40	);	42	);

apps/mobile/src/components/ComposerAttachmentStrip.tsx+1-1

...	@@ -195,7 +195,7 @@ function ComposerAttachmentContent(props: ComposerAttachmentThumbnailProps) {	...	@@ -195,7 +195,7 @@ function ComposerAttachmentContent(props: ComposerAttachmentThumbnailProps) {
195	<SymbolView	195	<SymbolView
196	name="doc.text"	196	name="doc.text"
197	size={props.compact ? 15 : 22}	197	size={props.compact ? 15 : 22}
198	tintColor="#a3a3a3"	198	tintColorClassName="accent-icon-subtle"
199	type="monochrome"	199	type="monochrome"
200	/>	200	/>
201	{!props.compact ? (	201	{!props.compact ? (

apps/mobile/src/components/ErrorBanner.tsx+2-2

...	@@ -3,8 +3,8 @@ import { View } from "react-native";	...	@@ -3,8 +3,8 @@ import { View } from "react-native";
3	import { AppText as Text } from "./AppText";	3	import { AppText as Text } from "./AppText";
4	export function ErrorBanner(props: { readonly message: string }) {	4	export function ErrorBanner(props: { readonly message: string }) {
5	return (	5	return (
6	<View className="rounded-2xl border border-adaptive-rose-300-a70-400-a28 bg-adaptive-rose-100-a80-500-a12 px-3.5 py-3">	6	<View className="rounded-2xl border border-danger-border bg-danger px-3.5 py-3">
7	<Text className="font-t3-medium text-sm text-adaptive-rose-700-300">{props.message}</Text>	7	<Text className="font-t3-medium text-sm text-danger-foreground">{props.message}</Text>
8	</View>	8	</View>
9	);	9	);
10	}	10	}

apps/mobile/src/features/connection/CloudEnvironmentRows.tsx+1-1

...	@@ -299,7 +299,7 @@ function CloudEnvironmentRowShell(props: {	...	@@ -299,7 +299,7 @@ function CloudEnvironmentRowShell(props: {
299	traceId: props.connectionErrorTraceId,	299	traceId: props.connectionErrorTraceId,
300	});	300	});
301	const statusClassName = props.connectionError	301	const statusClassName = props.connectionError
302	? "text-adaptive-rose-500-400"	302	? "text-danger-foreground"
303	: "text-foreground-muted";	303	: "text-foreground-muted";
304	const [errorMeasurement, setErrorMeasurement] = useState<{	304	const [errorMeasurement, setErrorMeasurement] = useState<{
305	readonly text: string;	305	readonly text: string;

apps/mobile/src/features/connection/ConnectionEnvironmentRow.tsx+1-1

...	@@ -96,7 +96,7 @@ export function ConnectionEnvironmentRow(props: {	...	@@ -96,7 +96,7 @@ export function ConnectionEnvironmentRow(props: {
96	<Text	96	<Text
97	className={cn(	97	className={cn(
98	"text-xs",	98	"text-xs",
99	hasConnectionFailure ? "text-adaptive-rose-500-400" : "text-foreground-muted",	99	hasConnectionFailure ? "text-danger-foreground" : "text-foreground-muted",
100	)}	100	)}
101	numberOfLines={props.expanded ? undefined : 1}	101	numberOfLines={props.expanded ? undefined : 1}
102	selectable={props.expanded}	102	selectable={props.expanded}

apps/mobile/src/features/connection/connectionTone.ts+10-10

...	@@ -12,32 +12,32 @@ export function connectionTone(state: RemoteClientConnectionState): StatusTone {	...	@@ -12,32 +12,32 @@ export function connectionTone(state: RemoteClientConnectionState): StatusTone {
12	case "reconnecting":	12	case "reconnecting":
13	return {	13	return {
14	label: "Reconnecting",	14	label: "Reconnecting",
15	pillClassName: "bg-adaptive-amber-500-a12-a16",	15	pillClassName: "bg-warning",
16	textClassName: "text-adaptive-amber-700-300",	16	textClassName: "text-warning-foreground",
17	};	17	};
18	case "connecting":	18	case "connecting":
19	return {	19	return {
20	label: "Connecting",	20	label: "Connecting",
21	pillClassName: "bg-adaptive-sky-500-a12-a16",	21	pillClassName: "bg-primary/10",
22	textClassName: "text-adaptive-sky-700-300",	22	textClassName: "text-foreground-secondary",
23	};	23	};
24	case "error":	24	case "error":
25	return {	25	return {
26	label: "Connection failed",	26	label: "Connection failed",
27	pillClassName: "bg-adaptive-rose-500-a12-a16",	27	pillClassName: "bg-danger",
28	textClassName: "text-adaptive-rose-700-300",	28	textClassName: "text-danger-foreground",
29	};	29	};
30	case "offline":	30	case "offline":
31	return {	31	return {
32	label: "Offline",	32	label: "Offline",
33	pillClassName: "bg-adaptive-rose-500-a12-a16",	33	pillClassName: "bg-danger",
34	textClassName: "text-adaptive-rose-700-300",	34	textClassName: "text-danger-foreground",
35	};	35	};
36	case "available":	36	case "available":
37	return {	37	return {
38	label: "Available",	38	label: "Available",
39	pillClassName: "bg-adaptive-neutral-500-a10-a16",	39	pillClassName: "bg-subtle",
40	textClassName: "text-adaptive-neutral-600-300",	40	textClassName: "text-foreground-secondary",
41	};	41	};
42	}	42	}
43	}	43	}

apps/mobile/src/features/files/ThreadFilesRouteScreen.tsx+3-3

...	@@ -190,11 +190,11 @@ function FileContent(props: {	...	@@ -190,11 +190,11 @@ function FileContent(props: {
190	return (	190	return (
191	<View className="flex-1 bg-sheet">	191	<View className="flex-1 bg-sheet">
192	{props.truncated ? (	192	{props.truncated ? (
193	<View className="border-b border-adaptive-amber-200-900-a60 bg-adaptive-amber-50-950-a40 px-4 py-2">	193	<View className="border-b border-warning-border bg-warning px-4 py-2">
194	<Text className="text-2xs font-t3-bold uppercase text-adaptive-amber-700-300">	194	<Text className="text-2xs font-t3-bold uppercase text-warning-foreground">
195	Partial file	195	Partial file
196	</Text>	196	</Text>
197	<Text className="text-xs leading-snug text-adaptive-amber-800-200">	197	<Text className="text-xs leading-snug text-warning-foreground">
198	Preview limited to the first 1 MB of a truncated file.	198	Preview limited to the first 1 MB of a truncated file.
199	</Text>	199	</Text>
200	</View>	200	</View>

apps/mobile/src/features/home/thread-swipe-actions.tsx+25-8

 @@ -62,7 +62,7 @@ interface ThreadSwipeAction {
 }
 interface ThreadSwipeSecondaryAction extends ThreadSwipeAction {
-  readonly backgroundColor: string;
+  readonly tone: "primary" | "secondary" | "danger";
 }
 function swipeActionsWidth(hasSecondaryAction: boolean) {
 @@ -80,7 +80,7 @@ function resolveSecondaryAction(input: {
   if (input.secondaryAction === undefined) {
     return {
       accessibilityLabel: `Delete ${input.threadTitle}`,
-      backgroundColor: "#ff2d55",
+      tone: "danger",
       icon: "trash",
       label: "Delete",
       onPress: () => {
 @@ -92,7 +92,7 @@ function resolveSecondaryAction(input: {
   const action = input.secondaryAction;
   return {
     ...action,
-    backgroundColor: "#5856d6",
+    tone: "secondary",
     menu:
       action.menu === undefined
         ? undefined
 @@ -359,7 +359,7 @@ export function ThreadSwipeable(props: {
 function SwipeActionButton(props: {
   readonly accessibilityLabel: string;
   readonly actionsWidth: number;
-  readonly backgroundColor: string;
+  readonly tone: "primary" | "secondary" | "danger";
   readonly compact: boolean;
   readonly entryRange: readonly [number, number];
   readonly fullSwipeThreshold: number;
 @@ -462,9 +462,15 @@ function SwipeActionButton(props: {
     >
       <View style={{ height: circleSize, width: circleSize }}>
         <Animated.View
+          className={
+            props.tone === "danger"
+              ? "bg-danger"
+              : props.tone === "secondary"
+                ? "bg-secondary"
+                : "bg-primary"
+          }
           style={[
             {
-              backgroundColor: props.backgroundColor,
               borderRadius: 999,
               height: circleSize,
               left: 0,
 @@ -488,7 +494,18 @@ function SwipeActionButton(props: {
             iconStyle,
           ]}
         >
-          <SymbolView name={props.icon} size={iconSize} tintColor="#ffffff" type="monochrome" />
+          <SymbolView
+            name={props.icon}
+            size={iconSize}
+            tintColorClassName={
+              props.tone === "danger"
+                ? "accent-danger-foreground"
+                : props.tone === "secondary"
+                  ? "accent-secondary-foreground"
+                  : "accent-primary-foreground"
+            }
+            type="monochrome"
+          />
         </Animated.View>
       </View>
       <Animated.View
 @@ -568,7 +585,7 @@ export function ThreadSwipeActions(props: {
       <SwipeActionButton
         accessibilityLabel={props.primaryAction.accessibilityLabel}
         actionsWidth={actionsWidth}
-        backgroundColor="#007aff"
+        tone="primary"
         compact={props.compact}
         entryRange={
           secondaryAction === null
 @@ -586,7 +603,7 @@ export function ThreadSwipeActions(props: {
         <SwipeActionButton
           accessibilityLabel={secondaryAction.accessibilityLabel}
           actionsWidth={actionsWidth}
-          backgroundColor={secondaryAction.backgroundColor}
+          tone={secondaryAction.tone}
           compact={props.compact}
           entryRange={[8, ACTION_ITEM_WIDTH * 0.72]}
           fullSwipeThreshold={props.fullSwipeThreshold}

apps/mobile/src/features/review/ReviewSheet.tsx+3-5

 @@ -80,11 +80,9 @@ const SHOWCASE_ENABLED = process.env.EXPO_PUBLIC_SHOWCASE === "1";
 const ReviewNotice = memo(function ReviewNotice(props: { readonly notice: string }) {
   return (
-    <View className="border-b border-adaptive-amber-200-900-a60 bg-adaptive-amber-50-950-a40 px-4 py-3">
+    <View className="border-b border-warning-border bg-warning px-4 py-3">
-      <Text className="text-xs font-t3-bold uppercase text-adaptive-amber-700-300">
+      <Text className="text-xs font-t3-bold uppercase text-warning-foreground">Partial diff</Text>
-        Partial diff
+      <Text className="text-xs leading-normal text-warning-foreground">{props.notice}</Text>
-      </Text>
-      <Text className="text-xs leading-normal text-adaptive-amber-800-200">{props.notice}</Text>
     </View>
   );
 });

apps/mobile/src/features/settings/appearance/components/FontSizeSliderRow.tsx+1-2

 @@ -176,10 +176,9 @@ export function FontSizeSliderRow(props: {
               />
             </View>
             <Animated.View
-              className="absolute left-0 rounded-full bg-white"
+              className="absolute left-0 rounded-full border-border bg-primary-foreground"
               style={[
                 {
-                  borderColor: "rgba(0, 0, 0, 0.06)",
                   borderWidth: 1,
                   height: THUMB_SIZE,
                   marginTop: -THUMB_SIZE / 2,

apps/mobile/src/features/threads/GitActionProgressOverlay.tsx+3-5

 @@ -143,9 +143,7 @@ function OverlayContent(props: { readonly progress: GitActionProgress }) {
   }
   const bgClass =
-    progress.phase === "error"
+    progress.phase === "error" ? "border-danger-border bg-danger" : "bg-card border-border";
-      ? "border-adaptive-red-200-800 bg-adaptive-red-50-950-a80"
-      : "bg-card border-border";
   return (
     <Animated.View
 @@ -169,11 +167,11 @@ function OverlayIcon(props: { readonly phase: GitActionProgress["phase"] }) {
       );
     case "error":
       return (
-        <View className="h-6 w-6 items-center justify-center rounded-full bg-red-500">
+        <View className="h-6 w-6 items-center justify-center rounded-full bg-danger">
           <SymbolView
             name="exclamationmark.triangle"
             size={12}
-            tintColor="white"
+            tintColorClassName="accent-danger-foreground"
             type="monochrome"
           />
         </View>

apps/mobile/src/features/threads/PendingApprovalCard.tsx+11-13

 @@ -30,22 +30,20 @@ export function PendingApprovalCard(props: PendingApprovalCardProps) {
   // Opaque for the same reason as PendingUserInputCard: nothing blurs the feed
   // behind this card, so a translucent surface bleeds messages through it.
   return (
-    <View className="gap-2.5 rounded-[20px] border border-adaptive-neutral-200-white-a6 bg-adaptive-neutral-100-900 p-4">
+    <View className="gap-2.5 rounded-[20px] border border-border bg-card-alt p-4">
-      <Text className="font-t3-bold text-2xs uppercase tracking-[1.1px] text-adaptive-sky-700-300">
+      <Text className="font-t3-bold text-2xs uppercase tracking-[1.1px] text-foreground-secondary">
         Approval needed
       </Text>
-      <Text className="font-t3-bold text-lg text-adaptive-neutral-950-50">
+      <Text className="font-t3-bold text-lg text-foreground">
         {props.approval.appName ?? props.approval.requestKind}
       </Text>
       {props.approval.detail ? (
-        <Text className="font-sans text-sm leading-normal text-adaptive-neutral-600-400">
+        <Text className="font-sans text-sm leading-normal text-foreground-secondary">
           {props.approval.detail}
         </Text>
       ) : null}
       {warning ? (
-        <Text className="font-sans text-xs leading-normal text-adaptive-amber-700-300">
+        <Text className="font-sans text-xs leading-normal text-warning-foreground">{warning}</Text>
-          {warning}
-        </Text>
       ) : null}
       <View className="flex-row flex-wrap gap-2.5">
         {options.map((option) => (
 @@ -53,10 +51,10 @@ export function PendingApprovalCard(props: PendingApprovalCardProps) {
             key={option.decision}
             className={`items-center justify-center rounded-[14px] px-3.5 py-3 ${
               option.decision === "accept"
-                ? "bg-blue-500"
+                ? "bg-primary"
                 : option.decision === "decline"
-                  ? "bg-adaptive-rose-100-500-a18"
+                  ? "bg-danger"
-                  : "bg-adaptive-neutral-200-800"
+                  : "bg-subtle-strong"
             }`}
             disabled={props.respondingApprovalId === props.approval.requestId}
             onPress={() => void props.onRespond(props.approval.requestId, option.decision)}
 @@ -64,10 +62,10 @@ export function PendingApprovalCard(props: PendingApprovalCardProps) {
             <Text
               className={`text-sm ${
                 option.decision === "accept"
-                  ? "font-t3-extrabold text-white"
+                  ? "font-t3-extrabold text-primary-foreground"
                   : option.decision === "decline"
-                    ? "font-t3-bold text-adaptive-rose-700-300"
+                    ? "font-t3-bold text-danger-foreground"
-                    : "font-t3-bold text-adaptive-neutral-950-50"
+                    : "font-t3-bold text-foreground"
               }`}
             >
               {option.label}

apps/mobile/src/features/threads/PendingUserInputCard.tsx+22-21

 @@ -161,7 +161,7 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
       pointerEvents={props.collapsed ? "auto" : "none"}
       accessibilityElementsHidden={!props.collapsed}
       importantForAccessibility={props.collapsed ? "auto" : "no-hide-descendants"}
-      className="flex-row items-center gap-2 rounded-full border border-adaptive-neutral-200-white-a6 bg-adaptive-neutral-100-900 py-1.5 pl-4 pr-1.5"
+      className="flex-row items-center gap-2 rounded-full border border-border bg-card-alt py-1.5 pl-4 pr-1.5"
     >
       <Pressable
         accessibilityRole="button"
 @@ -171,10 +171,10 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
         onPress={props.onToggleCollapsed}
         className="min-h-10 flex-1 flex-row items-center gap-2 active:opacity-70"
       >
-        <Text className="font-t3-bold text-2xs uppercase tracking-[1.1px] text-adaptive-sky-700-300">
+        <Text className="font-t3-bold text-2xs uppercase tracking-[1.1px] text-foreground-secondary">
           User input needed
         </Text>
-        <Text className="font-sans text-xs text-adaptive-neutral-500-400">
+        <Text className="font-sans text-xs text-foreground-muted">
           {questionCount} question{questionCount === 1 ? "" : "s"}
         </Text>
         <View className="flex-1" />
 @@ -216,7 +216,7 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
           : FadeOutDown.duration(USER_INPUT_TOGGLE_DURATION_MS).easing(Easing.out(Easing.cubic))
       }
       layout={CARD_LAYOUT_TRANSITION}
-      className="overflow-hidden gap-2.5 rounded-[20px] border border-adaptive-neutral-200-white-a6 bg-adaptive-neutral-100-900 p-4"
+      className="overflow-hidden gap-2.5 rounded-[20px] border border-border bg-card-alt p-4"
       style={
         EXPANDED_CARD_IS_OVERLAY
           ? [{ maxHeight: props.maxHeight }, cardAnimatedStyle]
 @@ -230,14 +230,12 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
         className="flex-row items-start gap-2"
       >
         <View className="flex-1 gap-2.5">
-          <Text className="font-t3-bold text-2xs uppercase tracking-[1.1px] text-adaptive-sky-700-300">
+          <Text className="font-t3-bold text-2xs uppercase tracking-[1.1px] text-foreground-secondary">
             User input needed
           </Text>
-          <Text className="font-t3-bold text-lg text-adaptive-neutral-950-50">
+          <Text className="font-t3-bold text-lg text-foreground">Fill in the pending answers</Text>
-            Fill in the pending answers
-          </Text>
         </View>
-        <View className="h-8 w-8 items-center justify-center rounded-full bg-adaptive-neutral-200-a70-white-a8">
+        <View className="h-8 w-8 items-center justify-center rounded-full bg-subtle-strong">
           <SymbolView
             name="chevron.down"
             size={13}
 @@ -259,10 +257,10 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
           const draft = props.drafts[question.id];
           return (
             <View key={question.id} className="gap-2 pt-1">
-              <Text className="font-t3-bold text-xs uppercase tracking-[1px] text-neutral-500">
+              <Text className="font-t3-bold text-xs uppercase tracking-[1px] text-foreground-muted">
                 {question.header}
               </Text>
-              <Text className="font-sans text-base leading-snug text-adaptive-neutral-950-50">
+              <Text className="font-sans text-base leading-snug text-foreground">
                 {question.question}
               </Text>
               <View className="gap-2">
 @@ -276,9 +274,7 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
                       key={optionValue}
                       className={cn(
                         "min-h-12 w-full rounded-2xl border px-3.5 py-3",
-                        selected
+                        selected ? "border-primary bg-primary/10" : "border-border bg-input",
-                          ? "border-adaptive-blue-300-a50-blue-400-a28 bg-adaptive-blue-50-blue-400-a14"
-                          : "border-adaptive-neutral-200-white-a6 bg-adaptive-white-neutral-950-a70",
                       )}
                       onPress={() =>
                         props.onSelectOption(
 @@ -292,15 +288,13 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
                         <Text
                           className={cn(
                             "font-t3-bold text-sm",
-                            selected
+                            selected ? "text-foreground" : "text-foreground-secondary",
-                              ? "text-adaptive-sky-700-300"
-                              : "text-adaptive-neutral-600-300",
                           )}
                         >
                           {option.label}
                         </Text>
                         {description ? (
-                          <Text className="font-sans text-sm leading-5 text-adaptive-neutral-500-400">
+                          <Text className="font-sans text-sm leading-5 text-foreground-muted">
                             {description}
                           </Text>
                         ) : null}
 @@ -318,7 +312,7 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
                   onFocus={() => props.onInputFocusChange?.(true)}
                   onBlur={() => props.onInputFocusChange?.(false)}
                   placeholder="Or type a custom answer"
-                  className="min-h-[54px] rounded-2xl border border-adaptive-neutral-200-white-a8 bg-adaptive-white-neutral-950-a70 px-3.5 py-3 font-sans text-base text-adaptive-neutral-950-50"
+                  className="min-h-[54px] rounded-2xl border border-input-border bg-input px-3.5 py-3 font-sans text-base text-foreground"
                 />
               ) : null}
             </View>
 @@ -328,14 +322,21 @@ export function PendingUserInputCard(props: PendingUserInputCardProps) {
       <Pressable
         className={cn(
           "items-center justify-center rounded-2xl px-4 py-3.5",
-          props.answers ? "bg-blue-500" : "bg-adaptive-neutral-200-700-a60",
+          props.answers ? "bg-primary" : "bg-subtle-strong",
         )}
         disabled={
           props.answers === null || props.respondingUserInputId === props.pendingUserInput.requestId
         }
         onPress={() => void props.onSubmit()}
       >
-        <Text className="font-t3-extrabold text-sm text-white">Submit answers</Text>
+        <Text
+          className={cn(
+            "font-t3-extrabold text-sm",
+            props.answers ? "text-primary-foreground" : "text-foreground-muted",
+          )}
+        >
+          Submit answers
+        </Text>
       </Pressable>
     </Animated.View>
   ) : null;

apps/mobile/src/features/threads/ThreadFeed.tsx+12-7

...	@@ -504,7 +504,12 @@ function MessageAttachmentFile(props: {	...	@@ -504,7 +504,12 @@ function MessageAttachmentFile(props: {
504	function MessageAttachmentUnknown(props: { readonly name: string }) {	504	function MessageAttachmentUnknown(props: { readonly name: string }) {
505	return (	505	return (
506	<View className="flex-row items-center gap-2 py-1">	506	<View className="flex-row items-center gap-2 py-1">
507	<SymbolView name="doc.text" size={16} tintColor="#a3a3a3" type="monochrome" />	507	<SymbolView
		508	name="doc.text"
		509	size={16}
		510	tintColorClassName="accent-icon-subtle"
		511	type="monochrome"
		512	/>
508	<Text className="min-w-0 flex-1 text-sm text-foreground" numberOfLines={1}>	513	<Text className="min-w-0 flex-1 text-sm text-foreground" numberOfLines={1}>
509	{props.name}	514	{props.name}
510	</Text>	515	</Text>
...	@@ -1352,7 +1357,7 @@ function renderFeedEntry(	...	@@ -1352,7 +1357,7 @@ function renderFeedEntry(
1352	accessibilityState={{ expanded: entry.expanded }}	1357	accessibilityState={{ expanded: entry.expanded }}
1353	onPress={() => props.onToggleTurnFold(entry.turnId)}	1358	onPress={() => props.onToggleTurnFold(entry.turnId)}
1354	hitSlop={4}	1359	hitSlop={4}
1355	className="mb-1 min-h-11 flex-row items-center gap-2 border-b border-adaptive-neutral-200-a80-white-a8 px-2"	1360	className="mb-1 min-h-11 flex-row items-center gap-2 border-b border-border px-2"
1356	style={{	1361	style={{
1357	minHeight: Math.max(TURN_FOLD_HEIGHT - 3.5, props.workRowSizing.estimatedRowHeight),	1362	minHeight: Math.max(TURN_FOLD_HEIGHT - 3.5, props.workRowSizing.estimatedRowHeight),
1358	}}	1363	}}
...	@@ -1406,7 +1411,7 @@ function renderFeedEntry(	...	@@ -1406,7 +1411,7 @@ function renderFeedEntry(
1406	accessibilityLabel={label}	1411	accessibilityLabel={label}
1407	className="mb-3 flex-row items-center gap-3 px-1 py-1"	1412	className="mb-3 flex-row items-center gap-3 px-1 py-1"
1408	>	1413	>
1409	<View className="h-px flex-1 bg-adaptive-neutral-200-a80-white-a8" />	1414	<View className="h-px flex-1 bg-border" />
1410	<View className="shrink-0 flex-row items-center gap-1.5">	1415	<View className="shrink-0 flex-row items-center gap-1.5">
1411	<SymbolView	1416	<SymbolView
1412	name="arrow.down.right.and.arrow.up.left"	1417	name="arrow.down.right.and.arrow.up.left"
...	@@ -1416,7 +1421,7 @@ function renderFeedEntry(	...	@@ -1416,7 +1421,7 @@ function renderFeedEntry(
1416	/>	1421	/>
1417	<Text className="font-t3-medium text-xs text-foreground-muted">{label}</Text>	1422	<Text className="font-t3-medium text-xs text-foreground-muted">{label}</Text>
1418	</View>	1423	</View>
1419	<View className="h-px flex-1 bg-adaptive-neutral-200-a80-white-a8" />	1424	<View className="h-px flex-1 bg-border" />
1420	</View>	1425	</View>
1421	);	1426	);
1422	}	1427	}
...	@@ -1503,7 +1508,7 @@ function renderFeedEntry(	...	@@ -1503,7 +1508,7 @@ function renderFeedEntry(
1503	})}	1508	})}
1504	</View>	1509	</View>
1505	<View className="mt-1 flex-row items-center justify-end gap-1 pr-0.5">	1510	<View className="mt-1 flex-row items-center justify-end gap-1 pr-0.5">
1506	<Text className="font-t3-medium text-xs tabular-nums text-adaptive-neutral-600-400">	1511	<Text className="font-t3-medium text-xs tabular-nums text-foreground-secondary">
1507	{timestampLabel}	1512	{timestampLabel}
1508	</Text>	1513	</Text>
1509	{message.text.trim().length > 0 ? (	1514	{message.text.trim().length > 0 ? (
...	@@ -1552,7 +1557,7 @@ function renderFeedEntry(	...	@@ -1552,7 +1557,7 @@ function renderFeedEntry(
1552	attachmentId={attachment.id}	1557	attachmentId={attachment.id}
1553	name={attachment.name}	1558	name={attachment.name}
1554	mimeType={attachment.mimeType}	1559	mimeType={attachment.mimeType}
1555	className="mt-1.5 aspect-[1.3] w-full rounded-[18px] bg-adaptive-neutral-200-800"	1560	className="mt-1.5 aspect-[1.3] w-full rounded-[18px] bg-subtle-strong"
1556	onPressPreview={props.onPressPreview}	1561	onPressPreview={props.onPressPreview}
1557	/>	1562	/>
1558	) : isFileAttachment(attachment) ? (	1563	) : isFileAttachment(attachment) ? (
...	@@ -1576,7 +1581,7 @@ function renderFeedEntry(	...	@@ -1576,7 +1581,7 @@ function renderFeedEntry(
1576	buttonSize={28}	1581	buttonSize={28}
1577	iconSize={13}	1582	iconSize={13}
1578	/>	1583	/>
1579	<Text className="font-t3-medium text-xs tabular-nums text-adaptive-neutral-600-400">	1584	<Text className="font-t3-medium text-xs tabular-nums text-foreground-secondary">
1580	{timestampLabel}	1585	{timestampLabel}
1581	</Text>	1586	</Text>
1582	</View>	1587	</View>

apps/mobile/src/features/threads/git/GitCommitSheet.tsx+1-1

...	@@ -85,7 +85,7 @@ export function GitCommitSheet(_props: GitCommitSheetProps) {	...	@@ -85,7 +85,7 @@ export function GitCommitSheet(_props: GitCommitSheetProps) {
85	</Text>	85	</Text>
86	</View>	86	</View>
87	{isDefaultRef ? (	87	{isDefaultRef ? (
88	<Text className="text-xs leading-normal text-adaptive-amber-700-400">	88	<Text className="text-xs leading-normal text-warning-foreground">
89	Warning: this is the default branch.	89	Warning: this is the default branch.
90	</Text>	90	</Text>
91	) : null}	91	) : null}

apps/mobile/src/features/threads/thread-list-items.tsx+2-2

...	@@ -297,8 +297,8 @@ export const PendingTaskListRow = memo(function PendingTaskListRow(props: {	...	@@ -297,8 +297,8 @@ export const PendingTaskListRow = memo(function PendingTaskListRow(props: {
297	);	297	);
298		298
299	const statusPill = (	299	const statusPill = (
300	<View className="rounded-full bg-adaptive-zinc-500-a12-a16 px-1.5 py-0.5">	300	<View className="rounded-full bg-subtle px-1.5 py-0.5">
301	<Text className="text-3xs font-t3-bold text-adaptive-zinc-600-300">Pending</Text>	301	<Text className="text-3xs font-t3-bold text-foreground-muted">Pending</Text>
302	</View>	302	</View>
303	);	303	);
304		304

apps/mobile/src/features/threads/thread-list-v2-items.tsx+9-14

...	@@ -23,7 +23,6 @@ import { useUniwindTheme } from "../../lib/useUniwindTheme";	...	@@ -23,7 +23,6 @@ import { useUniwindTheme } from "../../lib/useUniwindTheme";
23	import type { PendingNewTask } from "../../state/use-pending-new-tasks";	23	import type { PendingNewTask } from "../../state/use-pending-new-tasks";
24	import { useThreadPr } from "../../state/use-thread-pr";	24	import { useThreadPr } from "../../state/use-thread-pr";
25	import { ThreadSwipeable } from "../home/thread-swipe-actions";	25	import { ThreadSwipeable } from "../home/thread-swipe-actions";
26	import { useAppearancePreferences } from "../settings/appearance/AppearancePreferencesProvider";
27	import { buildThreadTitleRegenerationMenuItems } from "./thread-title-regeneration-menu";	26	import { buildThreadTitleRegenerationMenuItems } from "./thread-title-regeneration-menu";
28	import {	27	import {
29	resolveThreadListV2SnoozeMenuSelection,	28	resolveThreadListV2SnoozeMenuSelection,
...	@@ -53,10 +52,10 @@ const MONO_FONT = Platform.select({	...	@@ -53,10 +52,10 @@ const MONO_FONT = Platform.select({
53	const STATUS_LABEL_BY_STATUS: Partial<	52	const STATUS_LABEL_BY_STATUS: Partial<
54	Record<ThreadListV2Status, { label: string; className: string }>	53	Record<ThreadListV2Status, { label: string; className: string }>
55	> = {	54	> = {
56	approval: { label: "Approval", className: "text-adaptive-amber-700-300" },	55	approval: { label: "Approval", className: "text-warning-foreground" },
57	input: { label: "Input", className: "text-adaptive-indigo-600-300" },	56	input: { label: "Input", className: "text-foreground-secondary" },
58	working: { label: "Working", className: "text-adaptive-sky-600-400" },	57	working: { label: "Working", className: "text-foreground-secondary" },
59	failed: { label: "Failed", className: "text-adaptive-red-700-300" },	58	failed: { label: "Failed", className: "text-danger-foreground" },
60	};	59	};
61		60
62	function threadTimeLabel(thread: EnvironmentThreadShell): string {	61	function threadTimeLabel(thread: EnvironmentThreadShell): string {
...	@@ -107,9 +106,6 @@ export const ThreadListV2SectionDivider = memo(function ThreadListV2SectionDivid	...	@@ -107,9 +106,6 @@ export const ThreadListV2SectionDivider = memo(function ThreadListV2SectionDivid
107	);	106	);
108	});	107	});
109		108
110	const SNOOZE_ACCENT_LIGHT = "#2563eb";
111	const SNOOZE_ACCENT_DARK = "#60a5fa";
112
113	export const ThreadListV2SnoozedShelfHeader = memo(function ThreadListV2SnoozedShelfHeader(props: {	109	export const ThreadListV2SnoozedShelfHeader = memo(function ThreadListV2SnoozedShelfHeader(props: {
114	readonly count: number;	110	readonly count: number;
115	readonly disabled?: boolean;	111	readonly disabled?: boolean;
...	@@ -117,7 +113,6 @@ export const ThreadListV2SnoozedShelfHeader = memo(function ThreadListV2SnoozedS	...	@@ -117,7 +113,6 @@ export const ThreadListV2SnoozedShelfHeader = memo(function ThreadListV2SnoozedS
117	readonly onToggle: () => void;	113	readonly onToggle: () => void;
118	readonly pane?: "screen" \| "sidebar";	114	readonly pane?: "screen" \| "sidebar";
119	}) {	115	}) {
120	const { themeAppearance: colorScheme } = useAppearancePreferences();
121	return (	116	return (
122	<Pressable	117	<Pressable
123	accessibilityHint={	118	accessibilityHint={
...	@@ -134,14 +129,14 @@ export const ThreadListV2SnoozedShelfHeader = memo(function ThreadListV2SnoozedS	...	@@ -134,14 +129,14 @@ export const ThreadListV2SnoozedShelfHeader = memo(function ThreadListV2SnoozedS
134	onPress={props.onToggle}	129	onPress={props.onToggle}
135	style={({ pressed }) => ({ opacity: pressed ? 0.6 : 1 })}	130	style={({ pressed }) => ({ opacity: pressed ? 0.6 : 1 })}
136	>	131	>
137	<Text className="text-xs font-t3-medium text-adaptive-blue-600-400">	132	<Text className="text-xs font-t3-medium text-foreground-secondary">
138	{props.expanded ? "Snoozed" : `Snoozed (${props.count})`}	133	{props.expanded ? "Snoozed" : `Snoozed (${props.count})`}
139	</Text>	134	</Text>
140	<View className="h-px flex-1 bg-adaptive-blue-500-a20-blue-400-a15" />	135	<View className="h-px flex-1 bg-primary/20" />
141	<SymbolView	136	<SymbolView
142	name="chevron.down"	137	name="chevron.down"
143	size={10}	138	size={10}
144	tintColor={colorScheme === "dark" ? SNOOZE_ACCENT_DARK : SNOOZE_ACCENT_LIGHT}	139	tintColorClassName="accent-icon-muted"
145	type="monochrome"	140	type="monochrome"
146	style={{ transform: [{ rotate: props.expanded ? "180deg" : "0deg" }] }}	141	style={{ transform: [{ rotate: props.expanded ? "180deg" : "0deg" }] }}
147	/>	142	/>
...	@@ -737,7 +732,7 @@ export const ThreadListV2Row = memo(function ThreadListV2Row(props: {	...	@@ -737,7 +732,7 @@ export const ThreadListV2Row = memo(function ThreadListV2Row(props: {
737	<Text	732	<Text
738	className={cn(	733	className={cn(
739	"flex-1 text-xs",	734	"flex-1 text-xs",
740	selected ? "text-user-bubble-foreground-muted" : "text-adaptive-red-600-a80-400-a80",	735	selected ? "text-user-bubble-foreground-muted" : "text-danger-foreground",
741	)}	736	)}
742	numberOfLines={1}	737	numberOfLines={1}
743	>	738	>
...	@@ -919,7 +914,7 @@ export const ThreadListV2Row = memo(function ThreadListV2Row(props: {	...	@@ -919,7 +914,7 @@ export const ThreadListV2Row = memo(function ThreadListV2Row(props: {
919	selected	914	selected
920	? "text-user-bubble-foreground-muted"	915	? "text-user-bubble-foreground-muted"
921	: snoozedRow	916	: snoozedRow
922	? "text-adaptive-blue-600-400"	917	? "text-foreground-secondary"
923	: "text-foreground-tertiary",	918	: "text-foreground-tertiary",
924	)}	919	)}
925	style={{ fontFamily: MONO_FONT }}	920	style={{ fontFamily: MONO_FONT }}

apps/mobile/src/features/threads/thread-search-match.tsx+1-1

...	@@ -65,7 +65,7 @@ export function ThreadSearchMatchExcerpt(props: {	...	@@ -65,7 +65,7 @@ export function ThreadSearchMatchExcerpt(props: {
65	props.selected	65	props.selected
66	? "text-user-bubble-foreground"	66	? "text-user-bubble-foreground"
67	: isUser	67	: isUser
68	? "text-adaptive-blue-500-400"	68	? "text-foreground-secondary"
69	: "text-adaptive-emerald-600-400",	69	: "text-adaptive-emerald-600-400",
70	)}	70	)}
71	>	71	>

apps/mobile/src/features/threads/thread-work-log.tsx+3-3

...	@@ -773,7 +773,7 @@ const ThreadWorkLogRow = memo(function ThreadWorkLogRow(	...	@@ -773,7 +773,7 @@ const ThreadWorkLogRow = memo(function ThreadWorkLogRow(
773	color={props.iconSubtleColor}	773	color={props.iconSubtleColor}
774	colorClassName={	774	colorClassName={
775	iconIsDestructive	775	iconIsDestructive
776	? "accent-adaptive-rose-600-400"	776	? "accent-danger-foreground"
777	: failed	777	: failed
778	? "accent-danger-foreground/40"	778	? "accent-danger-foreground/40"
779	: undefined	779	: undefined
...	@@ -784,7 +784,7 @@ const ThreadWorkLogRow = memo(function ThreadWorkLogRow(	...	@@ -784,7 +784,7 @@ const ThreadWorkLogRow = memo(function ThreadWorkLogRow(
784	<Text	784	<Text
785	className={cn(	785	className={cn(
786	"min-w-0 flex-1 text-sm text-foreground-muted",	786	"min-w-0 flex-1 text-sm text-foreground-muted",
787	iconIsDestructive && "font-t3-medium text-adaptive-rose-600-400",	787	iconIsDestructive && "font-t3-medium text-danger-foreground",
788	)}	788	)}
789	numberOfLines={1}	789	numberOfLines={1}
790	>	790	>
...	@@ -832,7 +832,7 @@ const ThreadWorkLogRow = memo(function ThreadWorkLogRow(	...	@@ -832,7 +832,7 @@ const ThreadWorkLogRow = memo(function ThreadWorkLogRow(
832	entering={WORK_LOG_DETAIL_ENTER_TRANSITION}	832	entering={WORK_LOG_DETAIL_ENTER_TRANSITION}
833	exiting={WORK_LOG_DETAIL_EXIT_TRANSITION}	833	exiting={WORK_LOG_DETAIL_EXIT_TRANSITION}
834	layout={WORK_LOG_LAYOUT_TRANSITION}	834	layout={WORK_LOG_LAYOUT_TRANSITION}
835	className="ml-7 border-l border-adaptive-neutral-300-a60-white-a12 pb-1 pl-3 pt-0.5"	835	className="ml-7 border-l border-border pb-1 pl-3 pt-0.5"
836	>	836	>
837	{viewedImagePath ? (	837	{viewedImagePath ? (
838	<View className="pb-1.5">	838	<View className="pb-1.5">

apps/mobile/src/features/threads/threadPresentation.ts+12-12

...	@@ -42,8 +42,8 @@ export function resolveThreadStatus(	...	@@ -42,8 +42,8 @@ export function resolveThreadStatus(
42	return {	42	return {
43	kind: "pending-approval",	43	kind: "pending-approval",
44	label: "Needs Approval",	44	label: "Needs Approval",
45	pillClassName: "bg-adaptive-amber-500-a12-a16",	45	pillClassName: "bg-warning",
46	textClassName: "text-adaptive-amber-700-300",	46	textClassName: "text-warning-foreground",
47	iconColor: "#ff9f0a",	47	iconColor: "#ff9f0a",
48	iconBackground: "rgba(255,159,10,0.22)",	48	iconBackground: "rgba(255,159,10,0.22)",
49	pulse: false,	49	pulse: false,
...	@@ -54,8 +54,8 @@ export function resolveThreadStatus(	...	@@ -54,8 +54,8 @@ export function resolveThreadStatus(
54	return {	54	return {
55	kind: "awaiting-input",	55	kind: "awaiting-input",
56	label: "Awaiting Input",	56	label: "Awaiting Input",
57	pillClassName: "bg-adaptive-indigo-500-a12-a16",	57	pillClassName: "bg-primary/10",
58	textClassName: "text-adaptive-indigo-700-300",	58	textClassName: "text-foreground-secondary",
59	iconColor: "#5e5ce6",	59	iconColor: "#5e5ce6",
60	iconBackground: "rgba(94,92,230,0.22)",	60	iconBackground: "rgba(94,92,230,0.22)",
61	pulse: false,	61	pulse: false,
...	@@ -66,8 +66,8 @@ export function resolveThreadStatus(	...	@@ -66,8 +66,8 @@ export function resolveThreadStatus(
66	return {	66	return {
67	kind: "working",	67	kind: "working",
68	label: "Working",	68	label: "Working",
69	pillClassName: "bg-adaptive-sky-500-a12-a16",	69	pillClassName: "bg-primary/10",
70	textClassName: "text-adaptive-sky-700-300",	70	textClassName: "text-foreground-secondary",
71	iconColor: "#0a84ff",	71	iconColor: "#0a84ff",
72	iconBackground: "rgba(10,132,255,0.22)",	72	iconBackground: "rgba(10,132,255,0.22)",
73	pulse: true,	73	pulse: true,
...	@@ -78,8 +78,8 @@ export function resolveThreadStatus(	...	@@ -78,8 +78,8 @@ export function resolveThreadStatus(
78	return {	78	return {
79	kind: "connecting",	79	kind: "connecting",
80	label: "Connecting",	80	label: "Connecting",
81	pillClassName: "bg-adaptive-sky-500-a12-a16",	81	pillClassName: "bg-primary/10",
82	textClassName: "text-adaptive-sky-700-300",	82	textClassName: "text-foreground-secondary",
83	iconColor: "#0a84ff",	83	iconColor: "#0a84ff",
84	iconBackground: "rgba(10,132,255,0.22)",	84	iconBackground: "rgba(10,132,255,0.22)",
85	pulse: true,	85	pulse: true,
...	@@ -90,8 +90,8 @@ export function resolveThreadStatus(	...	@@ -90,8 +90,8 @@ export function resolveThreadStatus(
90	return {	90	return {
91	kind: "error",	91	kind: "error",
92	label: "Error",	92	label: "Error",
93	pillClassName: "bg-adaptive-rose-500-a12-a16",	93	pillClassName: "bg-danger",
94	textClassName: "text-adaptive-rose-700-300",	94	textClassName: "text-danger-foreground",
95	iconColor: "#ff453a",	95	iconColor: "#ff453a",
96	iconBackground: "rgba(255,69,58,0.22)",	96	iconBackground: "rgba(255,69,58,0.22)",
97	pulse: false,	97	pulse: false,
...	@@ -106,8 +106,8 @@ export function resolveThreadStatus(	...	@@ -106,8 +106,8 @@ export function resolveThreadStatus(
106	return {	106	return {
107	kind: "plan-ready",	107	kind: "plan-ready",
108	label: "Plan Ready",	108	label: "Plan Ready",
109	pillClassName: "bg-adaptive-violet-500-a12-a16",	109	pillClassName: "bg-primary/10",
110	textClassName: "text-adaptive-violet-700-300",	110	textClassName: "text-foreground-secondary",
111	iconColor: "#bf5af2",	111	iconColor: "#bf5af2",
112	iconBackground: "rgba(191,90,242,0.22)",	112	iconBackground: "rgba(191,90,242,0.22)",
113	pulse: false,	113	pulse: false,

apps/mobile/src/lib/mobileTheme.test.ts+7-1

 @@ -153,10 +153,16 @@ describe("mobile themes", () => {
   it("maps semantic palette roles onto every mobile color variable", () => {
     const variables = createMobileThemeVariables(BUILT_IN_THEMES[0].colors, "light");
-    expect(Object.keys(variables)).toHaveLength(65);
+    expect(Object.keys(variables)).toHaveLength(68);
     expect(variables["--color-sheet-solid"]).toBe(
       themeColorToNativeColor(BUILT_IN_THEMES[0].colors.chrome),
     );
+    expect(variables["--color-warning"]).toBe(
+      themeColorToNativeColor(BUILT_IN_THEMES[0].colors.warningSurface),
+    );
+    expect(variables["--color-warning-foreground"]).toBe(
+      themeColorToNativeColor(BUILT_IN_THEMES[0].colors.warningForeground),
+    );
     expect(variables["--color-primary"]).not.toBe(variables["--color-screen"]);
     expect(variables["--color-primary-shadow"]).toBe("#000000");
     expect(variables["--color-backdrop"]).toBe("rgba(0, 0, 0, 0.22)");

apps/mobile/src/lib/mobileTheme.ts+3

 @@ -239,6 +239,9 @@ export function createMobileThemeVariables(
     "--color-switch-active-thumb": c.accentForeground,
     "--color-switch-inactive-track": c.secondary,
     "--color-switch-inactive-thumb": c.mutedForeground,
+    "--color-warning": c.warningSurface,
+    "--color-warning-border": withAlpha(c.warning, 0.32),
+    "--color-warning-foreground": c.warningForeground,
     "--color-danger": c.errorSurface,
     "--color-danger-border": withAlpha(c.error, 0.32),
     "--color-danger-foreground": c.errorForeground,

apps/mobile/src/state/thread-pr-presentation.ts+2-2

...	@@ -20,7 +20,7 @@ export interface ThreadPrPresentation {	...	@@ -20,7 +20,7 @@ export interface ThreadPrPresentation {
20	const PR_STATE_TEXT_CLASS: Record<ThreadPr["state"], string> = {	20	const PR_STATE_TEXT_CLASS: Record<ThreadPr["state"], string> = {
21	open: "text-adaptive-emerald-600-400",	21	open: "text-adaptive-emerald-600-400",
22	merged: "text-adaptive-violet-600-400",	22	merged: "text-adaptive-violet-600-400",
23	closed: "text-adaptive-zinc-500-400",	23	closed: "text-foreground-muted",
24	};	24	};
25		25
26	export function presentThreadPr(	26	export function presentThreadPr(
...	@@ -37,6 +37,6 @@ export function presentThreadPr(	...	@@ -37,6 +37,6 @@ export function presentThreadPr(
37	url: pr.url,	37	url: pr.url,
38	label: String(pr.number),	38	label: String(pr.number),
39	accessibilityLabel: `#${pr.number} ${presentation.longName} ${isDraft ? "draft" : pr.state}`,	39	accessibilityLabel: `#${pr.number} ${presentation.longName} ${isDraft ? "draft" : pr.state}`,
40	textClassName: isDraft ? "text-adaptive-zinc-500-400" : PR_STATE_TEXT_CLASS[pr.state],	40	textClassName: isDraft ? "text-foreground-muted" : PR_STATE_TEXT_CLASS[pr.state],
41	};	41	};
42	}	42	}

apps/mobile/src/state/use-thread-pr.test.ts+1-1

...	@@ -39,7 +39,7 @@ describe("presentThreadPr", () => {	...	@@ -39,7 +39,7 @@ describe("presentThreadPr", () => {
39	presentThreadPr({ ...pullRequest, state: "open", isDraft: true }, undefined),	39	presentThreadPr({ ...pullRequest, state: "open", isDraft: true }, undefined),
40	).toMatchObject({	40	).toMatchObject({
41	accessibilityLabel: "#3774 pull request draft",	41	accessibilityLabel: "#3774 pull request draft",
42	textClassName: "text-adaptive-zinc-500-400",	42	textClassName: "text-foreground-muted",
43	});	43	});
44	});	44	});
45	});	45	});

author	Julius Marminge <julius0216@outlook.com> 2026-09-05 19:22:39-07:00
committer	GitHub <noreply@github.com> 2026-09-05 19:22:39-07:00
log	b438447f67b6b61bbe6f564d8b78fd90702117c5
tree	452b22de63e9976c1d13ce3f3bd8732c870fe16b
parent	eee05575ebd514db36f61d7eb05d2258a10c96bd
signature	Signed by PGP key B5690EEEBB952194

fix(mobile): use selected theme across input forms and controls (#10239)