diff --git a/apps/web/src/components/EmojiPicker.tsx b/apps/web/src/components/EmojiPicker.tsx
index 0cb43e6..1d3476b 100644
--- a/apps/web/src/components/EmojiPicker.tsx
+++ b/apps/web/src/components/EmojiPicker.tsx
@@ -28,7 +28,7 @@ export function EmojiPicker({ emoji, onEmojiChange }: Props) {
   return (
     <div className="relative">
       <button
-        className="h-11 w-11 rounded-full border text-2xl shadow-sm hover:border-orange-400"
+        className="h-11 w-11 rounded-full border border-zinc-200 text-2xl shadow-sm hover:border-orange-400"
         title="Toggle emoji picker"
         onClick={onClick}
       >
diff --git a/apps/web/src/components/ui/input.tsx b/apps/web/src/components/ui/input.tsx
index c5196f3..685e497 100644
--- a/apps/web/src/components/ui/input.tsx
+++ b/apps/web/src/components/ui/input.tsx
@@ -11,7 +11,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
       <input
         type={type}
         className={cn(
-          "border-input bg-background placeholder:text-muted-foreground flex h-8 w-full rounded-lg border px-2 py-1.5 text-sm shadow-sm transition-colors transition-shadow file:border-0 file:bg-transparent file:text-sm file:font-medium hover:border-orange-300 focus-visible:border-orange-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-orange-200 disabled:cursor-not-allowed disabled:opacity-50",
+          "border-input bg-background placeholder:text-muted-foreground flex h-8 w-full rounded-lg border border-zinc-200 px-2 py-1.5 text-sm shadow-sm transition-colors transition-shadow file:border-0 file:bg-transparent file:text-sm file:font-medium hover:border-orange-300 focus-visible:border-orange-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-orange-200 disabled:cursor-not-allowed disabled:opacity-50",
           className
         )}
         ref={ref}