diff --git a/src/client/components/CandidateCard.tsx b/src/client/components/CandidateCard.tsx
index c35efa4..86df439 100644
--- a/src/client/components/CandidateCard.tsx
+++ b/src/client/components/CandidateCard.tsx
@@ -46,7 +46,7 @@ export function CandidateCard({
 							openExternalLink(productUrl);
 						}
 					}}
-					className="absolute top-2 right-2 z-10 w-6 h-6 flex items-center justify-center rounded-full bg-gray-100/80 text-gray-400 hover:bg-blue-100 hover:text-blue-500 opacity-0 group-hover:opacity-100 transition-all cursor-pointer"
+					className="absolute top-2 right-2 z-10 w-6 h-6 flex items-center justify-center rounded-full bg-gray-100/80 text-gray-400 hover:bg-gray-200 hover:text-gray-600 opacity-0 group-hover:opacity-100 transition-all cursor-pointer"
 					title="Open product link"
 				>
 					<svg
@@ -87,12 +87,12 @@ export function CandidateCard({
 				</h3>
 				<div className="flex flex-wrap gap-1.5 mb-3">
 					{weightGrams != null && (
-						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-700">
+						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-400">
 							{formatWeight(weightGrams)}
 						</span>
 					)}
 					{priceCents != null && (
-						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-700">
+						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-500">
 							{formatPrice(priceCents)}
 						</span>
 					)}
@@ -109,7 +109,7 @@ export function CandidateCard({
 					<button
 						type="button"
 						onClick={() => openCandidateEditPanel(id)}
-						className="text-xs text-gray-500 hover:text-blue-600 transition-colors"
+						className="text-xs text-gray-500 hover:text-gray-700 transition-colors"
 					>
 						Edit
 					</button>
diff --git a/src/client/components/CandidateForm.tsx b/src/client/components/CandidateForm.tsx
index 6a2ac11..a96077f 100644
--- a/src/client/components/CandidateForm.tsx
+++ b/src/client/components/CandidateForm.tsx
@@ -152,7 +152,7 @@ export function CandidateForm({
 					type="text"
 					value={form.name}
 					onChange={(e) => setForm((f) => ({ ...f, name: e.target.value }))}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="e.g. Osprey Talon 22"
 				/>
 				{errors.name && (
@@ -177,7 +177,7 @@ export function CandidateForm({
 					onChange={(e) =>
 						setForm((f) => ({ ...f, weightGrams: e.target.value }))
 					}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="e.g. 680"
 				/>
 				{errors.weightGrams && (
@@ -202,7 +202,7 @@ export function CandidateForm({
 					onChange={(e) =>
 						setForm((f) => ({ ...f, priceDollars: e.target.value }))
 					}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="e.g. 129.99"
 				/>
 				{errors.priceDollars && (
@@ -234,7 +234,7 @@ export function CandidateForm({
 					value={form.notes}
 					onChange={(e) => setForm((f) => ({ ...f, notes: e.target.value }))}
 					rows={3}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent resize-none"
 					placeholder="Any additional notes..."
 				/>
 			</div>
@@ -254,7 +254,7 @@ export function CandidateForm({
 					onChange={(e) =>
 						setForm((f) => ({ ...f, productUrl: e.target.value }))
 					}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="https://..."
 				/>
 				{errors.productUrl && (
@@ -267,7 +267,7 @@ export function CandidateForm({
 				<button
 					type="submit"
 					disabled={isPending}
-					className="flex-1 py-2.5 px-4 bg-blue-600 hover:bg-blue-700 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
+					className="flex-1 py-2.5 px-4 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
 				>
 					{isPending
 						? "Saving..."
diff --git a/src/client/components/CategoryHeader.tsx b/src/client/components/CategoryHeader.tsx
index fb4e41c..c24731a 100644
--- a/src/client/components/CategoryHeader.tsx
+++ b/src/client/components/CategoryHeader.tsx
@@ -64,7 +64,7 @@ export function CategoryHeader({
 				<button
 					type="button"
 					onClick={handleSave}
-					className="text-sm text-blue-600 hover:text-blue-800 font-medium"
+					className="text-sm text-gray-600 hover:text-gray-800 font-medium"
 				>
 					Save
 				</button>
diff --git a/src/client/components/CategoryPicker.tsx b/src/client/components/CategoryPicker.tsx
index 9d60f7a..095493c 100644
--- a/src/client/components/CategoryPicker.tsx
+++ b/src/client/components/CategoryPicker.tsx
@@ -169,7 +169,7 @@ export function CategoryPicker({ value, onChange }: CategoryPickerProps) {
 						setInputValue("");
 					}}
 					onKeyDown={handleKeyDown}
-					className={`w-full py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent ${
+					className={`w-full py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent ${
 						!isOpen && selectedCategory ? "pl-8 pr-3" : "px-3"
 					}`}
 				/>
@@ -187,7 +187,7 @@ export function CategoryPicker({ value, onChange }: CategoryPickerProps) {
 							aria-selected={cat.id === value}
 							className={`px-3 py-2 text-sm cursor-pointer flex items-center gap-1.5 ${
 								i === highlightIndex
-									? "bg-blue-50 text-blue-900"
+									? "bg-gray-100 text-gray-900"
 									: "hover:bg-gray-50"
 							} ${cat.id === value ? "font-medium" : ""}`}
 							onClick={() => handleSelect(cat.id)}
@@ -207,7 +207,7 @@ export function CategoryPicker({ value, onChange }: CategoryPickerProps) {
 							aria-selected={false}
 							className={`px-3 py-2 text-sm cursor-pointer border-t border-gray-100 ${
 								highlightIndex === filtered.length
-									? "bg-blue-50 text-blue-900"
+									? "bg-gray-100 text-gray-900"
 									: "hover:bg-gray-50 text-gray-600"
 							}`}
 							onClick={handleStartCreate}
@@ -231,7 +231,7 @@ export function CategoryPicker({ value, onChange }: CategoryPickerProps) {
 									type="button"
 									onClick={handleConfirmCreate}
 									disabled={createCategory.isPending}
-									className="text-xs font-medium text-blue-600 hover:text-blue-800 disabled:opacity-50"
+									className="text-xs font-medium text-gray-600 hover:text-gray-800 disabled:opacity-50"
 								>
 									{createCategory.isPending ? "..." : "Create"}
 								</button>
diff --git a/src/client/components/CreateThreadModal.tsx b/src/client/components/CreateThreadModal.tsx
index 1933ce6..8c1c058 100644
--- a/src/client/components/CreateThreadModal.tsx
+++ b/src/client/components/CreateThreadModal.tsx
@@ -93,7 +93,7 @@ export function CreateThreadModal() {
 							value={name}
 							onChange={(e) => setName(e.target.value)}
 							placeholder="e.g. Lightweight sleeping bag"
-							className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+							className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 						/>
 					</div>
 
@@ -108,7 +108,7 @@ export function CreateThreadModal() {
 							id="thread-category"
 							value={categoryId ?? ""}
 							onChange={(e) => setCategoryId(Number(e.target.value))}
-							className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent bg-white"
+							className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent bg-white"
 						>
 							{categories?.map((cat) => (
 								<option key={cat.id} value={cat.id}>
@@ -131,7 +131,7 @@ export function CreateThreadModal() {
 						<button
 							type="submit"
 							disabled={createThread.isPending}
-							className="px-4 py-2 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 disabled:opacity-50 rounded-lg transition-colors"
+							className="px-4 py-2 text-sm font-medium text-white bg-gray-700 hover:bg-gray-800 disabled:opacity-50 rounded-lg transition-colors"
 						>
 							{createThread.isPending ? "Creating..." : "Create Thread"}
 						</button>
diff --git a/src/client/components/DashboardCard.tsx b/src/client/components/DashboardCard.tsx
index 513540e..5ec6842 100644
--- a/src/client/components/DashboardCard.tsx
+++ b/src/client/components/DashboardCard.tsx
@@ -43,7 +43,7 @@ export function DashboardCard({
 				))}
 			</div>
 			{allZero && emptyText && (
-				<p className="mt-4 text-sm text-blue-600 font-medium">{emptyText}</p>
+				<p className="mt-4 text-sm text-gray-500 font-medium">{emptyText}</p>
 			)}
 		</Link>
 	);
diff --git a/src/client/components/ExternalLinkDialog.tsx b/src/client/components/ExternalLinkDialog.tsx
index 80f500a..1f1aa0d 100644
--- a/src/client/components/ExternalLinkDialog.tsx
+++ b/src/client/components/ExternalLinkDialog.tsx
@@ -38,7 +38,7 @@ export function ExternalLinkDialog() {
 					You are about to leave GearBox
 				</h3>
 				<p className="text-sm text-gray-600 mb-1">You will be redirected to:</p>
-				<p className="text-sm text-blue-600 break-all mb-6">
+				<p className="text-sm text-gray-600 break-all mb-6">
 					{externalLinkUrl}
 				</p>
 				<div className="flex justify-end gap-3">
@@ -52,7 +52,7 @@ export function ExternalLinkDialog() {
 					<button
 						type="button"
 						onClick={handleContinue}
-						className="px-4 py-2 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 rounded-lg transition-colors"
+						className="px-4 py-2 text-sm font-medium text-white bg-gray-700 hover:bg-gray-800 rounded-lg transition-colors"
 					>
 						Continue
 					</button>
diff --git a/src/client/components/IconPicker.tsx b/src/client/components/IconPicker.tsx
index e1b1516..37d5ac0 100644
--- a/src/client/components/IconPicker.tsx
+++ b/src/client/components/IconPicker.tsx
@@ -150,7 +150,7 @@ export function IconPicker({ value, onChange, size = "md" }: IconPickerProps) {
 									setActiveGroup(0);
 								}}
 								placeholder="Search icons..."
-								className="w-full px-2 py-1.5 text-sm border border-gray-200 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+								className="w-full px-2 py-1.5 text-sm border border-gray-200 rounded-md focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 							/>
 						</div>
 
@@ -164,7 +164,7 @@ export function IconPicker({ value, onChange, size = "md" }: IconPickerProps) {
 										onClick={() => setActiveGroup(i)}
 										className={`flex-1 flex items-center justify-center py-1 rounded transition-colors ${
 											i === activeGroup
-												? "bg-blue-50 text-blue-700"
+												? "bg-gray-200 text-gray-700"
 												: "hover:bg-gray-50 text-gray-500"
 										}`}
 										title={group.name}
@@ -173,7 +173,7 @@ export function IconPicker({ value, onChange, size = "md" }: IconPickerProps) {
 											name={group.icon}
 											size={16}
 											className={
-												i === activeGroup ? "text-blue-700" : "text-gray-400"
+												i === activeGroup ? "text-gray-700" : "text-gray-400"
 											}
 										/>
 									</button>
diff --git a/src/client/components/ItemCard.tsx b/src/client/components/ItemCard.tsx
index 3112959..e5fc5c4 100644
--- a/src/client/components/ItemCard.tsx
+++ b/src/client/components/ItemCard.tsx
@@ -48,7 +48,7 @@ export function ItemCard({
 							openExternalLink(productUrl);
 						}
 					}}
-					className={`absolute top-2 ${onRemove ? "right-10" : "right-2"} z-10 w-6 h-6 flex items-center justify-center rounded-full bg-gray-100/80 text-gray-400 hover:bg-blue-100 hover:text-blue-500 opacity-0 group-hover:opacity-100 transition-all cursor-pointer`}
+					className={`absolute top-2 ${onRemove ? "right-10" : "right-2"} z-10 w-6 h-6 flex items-center justify-center rounded-full bg-gray-100/80 text-gray-400 hover:bg-gray-200 hover:text-gray-600 opacity-0 group-hover:opacity-100 transition-all cursor-pointer`}
 					title="Open product link"
 				>
 					<svg
@@ -121,12 +121,12 @@ export function ItemCard({
 				</h3>
 				<div className="flex flex-wrap gap-1.5">
 					{weightGrams != null && (
-						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-700">
+						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-400">
 							{formatWeight(weightGrams)}
 						</span>
 					)}
 					{priceCents != null && (
-						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-700">
+						<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-500">
 							{formatPrice(priceCents)}
 						</span>
 					)}
diff --git a/src/client/components/ItemForm.tsx b/src/client/components/ItemForm.tsx
index 5d39e9b..fbb2ec2 100644
--- a/src/client/components/ItemForm.tsx
+++ b/src/client/components/ItemForm.tsx
@@ -144,7 +144,7 @@ export function ItemForm({ mode, itemId }: ItemFormProps) {
 					type="text"
 					value={form.name}
 					onChange={(e) => setForm((f) => ({ ...f, name: e.target.value }))}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="e.g. Osprey Talon 22"
 				/>
 				{errors.name && (
@@ -169,7 +169,7 @@ export function ItemForm({ mode, itemId }: ItemFormProps) {
 					onChange={(e) =>
 						setForm((f) => ({ ...f, weightGrams: e.target.value }))
 					}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="e.g. 680"
 				/>
 				{errors.weightGrams && (
@@ -194,7 +194,7 @@ export function ItemForm({ mode, itemId }: ItemFormProps) {
 					onChange={(e) =>
 						setForm((f) => ({ ...f, priceDollars: e.target.value }))
 					}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="e.g. 129.99"
 				/>
 				{errors.priceDollars && (
@@ -226,7 +226,7 @@ export function ItemForm({ mode, itemId }: ItemFormProps) {
 					value={form.notes}
 					onChange={(e) => setForm((f) => ({ ...f, notes: e.target.value }))}
 					rows={3}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent resize-none"
 					placeholder="Any additional notes..."
 				/>
 			</div>
@@ -246,7 +246,7 @@ export function ItemForm({ mode, itemId }: ItemFormProps) {
 					onChange={(e) =>
 						setForm((f) => ({ ...f, productUrl: e.target.value }))
 					}
-					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 					placeholder="https://..."
 				/>
 				{errors.productUrl && (
@@ -259,7 +259,7 @@ export function ItemForm({ mode, itemId }: ItemFormProps) {
 				<button
 					type="submit"
 					disabled={isPending}
-					className="flex-1 py-2.5 px-4 bg-blue-600 hover:bg-blue-700 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
+					className="flex-1 py-2.5 px-4 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
 				>
 					{isPending
 						? "Saving..."
diff --git a/src/client/components/ItemPicker.tsx b/src/client/components/ItemPicker.tsx
index 4ab36c8..af2b16a 100644
--- a/src/client/components/ItemPicker.tsx
+++ b/src/client/components/ItemPicker.tsx
@@ -107,7 +107,7 @@ export function ItemPicker({
 													type="checkbox"
 													checked={selectedIds.has(item.id)}
 													onChange={() => handleToggle(item.id)}
-													className="rounded border-gray-300 text-blue-600 focus:ring-blue-500"
+													className="rounded border-gray-300 text-gray-600 focus:ring-gray-400"
 												/>
 												<span className="flex-1 text-sm text-gray-900 truncate">
 													{item.name}
@@ -143,7 +143,7 @@ export function ItemPicker({
 						type="button"
 						onClick={handleDone}
 						disabled={syncItems.isPending}
-						className="flex-1 px-4 py-2 text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 disabled:opacity-50 rounded-lg transition-colors"
+						className="flex-1 px-4 py-2 text-sm font-medium text-white bg-gray-700 hover:bg-gray-800 disabled:opacity-50 rounded-lg transition-colors"
 					>
 						{syncItems.isPending ? "Saving..." : "Done"}
 					</button>
diff --git a/src/client/components/OnboardingWizard.tsx b/src/client/components/OnboardingWizard.tsx
index 300db1f..a830723 100644
--- a/src/client/components/OnboardingWizard.tsx
+++ b/src/client/components/OnboardingWizard.tsx
@@ -102,7 +102,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 						<div
 							key={s}
 							className={`h-1.5 rounded-full transition-all ${
-								s <= Math.min(step, 3) ? "bg-blue-600 w-8" : "bg-gray-200 w-6"
+								s <= Math.min(step, 3) ? "bg-gray-700 w-8" : "bg-gray-200 w-6"
 							}`}
 						/>
 					))}
@@ -121,7 +121,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 						<button
 							type="button"
 							onClick={() => setStep(2)}
-							className="w-full py-3 px-4 bg-blue-600 hover:bg-blue-700 text-white font-medium rounded-lg transition-colors"
+							className="w-full py-3 px-4 bg-gray-700 hover:bg-gray-800 text-white font-medium rounded-lg transition-colors"
 						>
 							Get Started
 						</button>
@@ -159,7 +159,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 									type="text"
 									value={categoryName}
 									onChange={(e) => setCategoryName(e.target.value)}
-									className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+									className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 									placeholder="e.g. Shelter"
 								/>
 							</div>
@@ -184,7 +184,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 							type="button"
 							onClick={handleCreateCategory}
 							disabled={createCategory.isPending}
-							className="mt-6 w-full py-3 px-4 bg-blue-600 hover:bg-blue-700 disabled:opacity-50 text-white font-medium rounded-lg transition-colors"
+							className="mt-6 w-full py-3 px-4 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white font-medium rounded-lg transition-colors"
 						>
 							{createCategory.isPending ? "Creating..." : "Create Category"}
 						</button>
@@ -221,7 +221,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 									type="text"
 									value={itemName}
 									onChange={(e) => setItemName(e.target.value)}
-									className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+									className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 									placeholder="e.g. Big Agnes Copper Spur"
 								/>
 							</div>
@@ -241,7 +241,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 										step="any"
 										value={itemWeight}
 										onChange={(e) => setItemWeight(e.target.value)}
-										className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+										className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 										placeholder="e.g. 1200"
 									/>
 								</div>
@@ -259,7 +259,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 										step="0.01"
 										value={itemPrice}
 										onChange={(e) => setItemPrice(e.target.value)}
-										className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+										className="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 										placeholder="e.g. 349.99"
 									/>
 								</div>
@@ -272,7 +272,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 							type="button"
 							onClick={handleCreateItem}
 							disabled={createItem.isPending}
-							className="mt-6 w-full py-3 px-4 bg-blue-600 hover:bg-blue-700 disabled:opacity-50 text-white font-medium rounded-lg transition-colors"
+							className="mt-6 w-full py-3 px-4 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white font-medium rounded-lg transition-colors"
 						>
 							{createItem.isPending ? "Adding..." : "Add Item"}
 						</button>
@@ -307,7 +307,7 @@ export function OnboardingWizard({ onComplete }: OnboardingWizardProps) {
 							type="button"
 							onClick={handleDone}
 							disabled={updateSetting.isPending}
-							className="w-full py-3 px-4 bg-blue-600 hover:bg-blue-700 disabled:opacity-50 text-white font-medium rounded-lg transition-colors"
+							className="w-full py-3 px-4 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white font-medium rounded-lg transition-colors"
 						>
 							{updateSetting.isPending ? "Finishing..." : "Done"}
 						</button>
diff --git a/src/client/components/SetupCard.tsx b/src/client/components/SetupCard.tsx
index 209f2e9..68cd6a6 100644
--- a/src/client/components/SetupCard.tsx
+++ b/src/client/components/SetupCard.tsx
@@ -24,15 +24,15 @@ export function SetupCard({
 		>
 			<div className="flex items-start justify-between mb-3">
 				<h3 className="text-sm font-semibold text-gray-900 truncate">{name}</h3>
-				<span className="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-700 shrink-0">
+				<span className="ml-2 inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-400 shrink-0">
 					{itemCount} {itemCount === 1 ? "item" : "items"}
 				</span>
 			</div>
 			<div className="flex flex-wrap gap-1.5">
-				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-700">
+				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-400">
 					{formatWeight(totalWeight)}
 				</span>
-				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-700">
+				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-500">
 					{formatPrice(totalCost)}
 				</span>
 			</div>
diff --git a/src/client/components/ThreadCard.tsx b/src/client/components/ThreadCard.tsx
index 53df7dc..a109753 100644
--- a/src/client/components/ThreadCard.tsx
+++ b/src/client/components/ThreadCard.tsx
@@ -66,7 +66,7 @@ export function ThreadCard({
 				)}
 			</div>
 			<div className="flex flex-wrap gap-1.5">
-				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-blue-50 text-blue-700">
+				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-gray-50 text-gray-600">
 					<LucideIcon
 						name={categoryIcon}
 						size={16}
@@ -74,14 +74,14 @@ export function ThreadCard({
 					/>{" "}
 					{categoryName}
 				</span>
-				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-purple-50 text-purple-700">
+				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-purple-50 text-purple-500">
 					{candidateCount} {candidateCount === 1 ? "candidate" : "candidates"}
 				</span>
 				<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-gray-50 text-gray-600">
 					{formatDate(createdAt)}
 				</span>
 				{priceRange && (
-					<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-700">
+					<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-50 text-green-500">
 						{priceRange}
 					</span>
 				)}
diff --git a/src/client/components/ThreadTabs.tsx b/src/client/components/ThreadTabs.tsx
index 81177fc..6c8edec 100644
--- a/src/client/components/ThreadTabs.tsx
+++ b/src/client/components/ThreadTabs.tsx
@@ -18,13 +18,13 @@ export function ThreadTabs({ active, onChange }: ThreadTabsProps) {
 					onClick={() => onChange(tab.key)}
 					className={`px-4 py-2.5 text-sm font-medium transition-colors relative ${
 						active === tab.key
-							? "text-blue-600"
+							? "text-gray-700"
 							: "text-gray-500 hover:text-gray-700"
 					}`}
 				>
 					{tab.label}
 					{active === tab.key && (
-						<span className="absolute bottom-0 left-0 right-0 h-0.5 bg-blue-600 rounded-t" />
+						<span className="absolute bottom-0 left-0 right-0 h-0.5 bg-gray-700 rounded-t" />
 					)}
 				</button>
 			))}
diff --git a/src/client/components/TotalsBar.tsx b/src/client/components/TotalsBar.tsx
index cef5592..91acce9 100644
--- a/src/client/components/TotalsBar.tsx
+++ b/src/client/components/TotalsBar.tsx
@@ -33,7 +33,7 @@ export function TotalsBar({
 	const titleElement = linkTo ? (
 		<Link
 			to={linkTo}
-			className="text-lg font-semibold text-gray-900 hover:text-blue-600 transition-colors"
+			className="text-lg font-semibold text-gray-900 hover:text-gray-600 transition-colors"
 		>
 			{title}
 		</Link>
diff --git a/src/client/routes/__root.tsx b/src/client/routes/__root.tsx
index 0d187c0..e66e8e2 100644
--- a/src/client/routes/__root.tsx
+++ b/src/client/routes/__root.tsx
@@ -101,7 +101,7 @@ function RootLayout() {
 	if (onboardingLoading) {
 		return (
 			<div className="min-h-screen bg-gray-50 flex items-center justify-center">
-				<div className="w-6 h-6 border-2 border-blue-600 border-t-transparent rounded-full animate-spin" />
+				<div className="w-6 h-6 border-2 border-gray-600 border-t-transparent rounded-full animate-spin" />
 			</div>
 		);
 	}
@@ -178,7 +178,7 @@ function RootLayout() {
 				<button
 					type="button"
 					onClick={openAddPanel}
-					className="fixed bottom-6 right-6 z-20 w-14 h-14 bg-blue-600 hover:bg-blue-700 text-white rounded-full shadow-lg hover:shadow-xl transition-all flex items-center justify-center"
+					className="fixed bottom-6 right-6 z-20 w-14 h-14 bg-gray-700 hover:bg-gray-800 text-white rounded-full shadow-lg hover:shadow-xl transition-all flex items-center justify-center"
 					title="Add new item"
 				>
 					<svg
diff --git a/src/client/routes/collection/index.tsx b/src/client/routes/collection/index.tsx
index 283ad8c..ac45278 100644
--- a/src/client/routes/collection/index.tsx
+++ b/src/client/routes/collection/index.tsx
@@ -79,7 +79,7 @@ function CollectionView() {
 					<button
 						type="button"
 						onClick={openAddPanel}
-						className="inline-flex items-center gap-2 px-5 py-2.5 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors"
+						className="inline-flex items-center gap-2 px-5 py-2.5 bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium rounded-lg transition-colors"
 					>
 						<svg
 							aria-hidden="true"
@@ -217,7 +217,7 @@ function PlanningView() {
 				<button
 					type="button"
 					onClick={openCreateThreadModal}
-					className="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors"
+					className="inline-flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium rounded-lg transition-colors"
 				>
 					<svg
 						aria-hidden="true"
@@ -246,7 +246,7 @@ function PlanningView() {
 						onClick={() => setActiveTab("active")}
 						className={`px-4 py-1.5 text-sm font-medium rounded-full transition-colors ${
 							activeTab === "active"
-								? "bg-blue-600 text-white"
+								? "bg-gray-700 text-white"
 								: "text-gray-600 hover:bg-gray-200"
 						}`}
 					>
@@ -257,7 +257,7 @@ function PlanningView() {
 						onClick={() => setActiveTab("resolved")}
 						className={`px-4 py-1.5 text-sm font-medium rounded-full transition-colors ${
 							activeTab === "resolved"
-								? "bg-blue-600 text-white"
+								? "bg-gray-700 text-white"
 								: "text-gray-600 hover:bg-gray-200"
 						}`}
 					>
@@ -271,7 +271,7 @@ function PlanningView() {
 					onChange={(e) =>
 						setCategoryFilter(e.target.value ? Number(e.target.value) : null)
 					}
-					className="px-3 py-1.5 border border-gray-200 rounded-lg text-sm bg-white focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="px-3 py-1.5 border border-gray-200 rounded-lg text-sm bg-white focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 				>
 					<option value="">All categories</option>
 					{categories?.map((cat) => (
@@ -291,7 +291,7 @@ function PlanningView() {
 						</h2>
 						<div className="space-y-6 text-left mb-10">
 							<div className="flex items-start gap-4">
-								<div className="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-700 font-bold text-sm shrink-0">
+								<div className="flex items-center justify-center w-8 h-8 rounded-full bg-gray-200 text-gray-700 font-bold text-sm shrink-0">
 									1
 								</div>
 								<div>
@@ -302,7 +302,7 @@ function PlanningView() {
 								</div>
 							</div>
 							<div className="flex items-start gap-4">
-								<div className="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-700 font-bold text-sm shrink-0">
+								<div className="flex items-center justify-center w-8 h-8 rounded-full bg-gray-200 text-gray-700 font-bold text-sm shrink-0">
 									2
 								</div>
 								<div>
@@ -313,7 +313,7 @@ function PlanningView() {
 								</div>
 							</div>
 							<div className="flex items-start gap-4">
-								<div className="flex items-center justify-center w-8 h-8 rounded-full bg-blue-100 text-blue-700 font-bold text-sm shrink-0">
+								<div className="flex items-center justify-center w-8 h-8 rounded-full bg-gray-200 text-gray-700 font-bold text-sm shrink-0">
 									3
 								</div>
 								<div>
@@ -327,7 +327,7 @@ function PlanningView() {
 						<button
 							type="button"
 							onClick={openCreateThreadModal}
-							className="inline-flex items-center gap-2 px-5 py-2.5 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors"
+							className="inline-flex items-center gap-2 px-5 py-2.5 bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium rounded-lg transition-colors"
 						>
 							<svg
 								aria-hidden="true"
diff --git a/src/client/routes/setups/$setupId.tsx b/src/client/routes/setups/$setupId.tsx
index 01d8c1f..6dd3b71 100644
--- a/src/client/routes/setups/$setupId.tsx
+++ b/src/client/routes/setups/$setupId.tsx
@@ -124,7 +124,7 @@ function SetupDetailPage() {
 				<button
 					type="button"
 					onClick={() => setPickerOpen(true)}
-					className="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors"
+					className="inline-flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium rounded-lg transition-colors"
 				>
 					<svg
 						className="w-4 h-4"
@@ -170,7 +170,7 @@ function SetupDetailPage() {
 						<button
 							type="button"
 							onClick={() => setPickerOpen(true)}
-							className="inline-flex items-center gap-2 px-5 py-2.5 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors"
+							className="inline-flex items-center gap-2 px-5 py-2.5 bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium rounded-lg transition-colors"
 						>
 							Add Items
 						</button>
diff --git a/src/client/routes/setups/index.tsx b/src/client/routes/setups/index.tsx
index c932754..cb7a5da 100644
--- a/src/client/routes/setups/index.tsx
+++ b/src/client/routes/setups/index.tsx
@@ -29,12 +29,12 @@ function SetupsListPage() {
 					value={newSetupName}
 					onChange={(e) => setNewSetupName(e.target.value)}
 					placeholder="New setup name..."
-					className="flex-1 px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
+					className="flex-1 px-3 py-2 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-gray-400 focus:border-transparent"
 				/>
 				<button
 					type="submit"
 					disabled={!newSetupName.trim() || createSetup.isPending}
-					className="px-4 py-2 bg-blue-600 hover:bg-blue-700 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
+					className="px-4 py-2 bg-gray-700 hover:bg-gray-800 disabled:opacity-50 text-white text-sm font-medium rounded-lg transition-colors"
 				>
 					{createSetup.isPending ? "Creating..." : "Create"}
 				</button>
diff --git a/src/client/routes/threads/$threadId.tsx b/src/client/routes/threads/$threadId.tsx
index 3b6c1ad..d455d21 100644
--- a/src/client/routes/threads/$threadId.tsx
+++ b/src/client/routes/threads/$threadId.tsx
@@ -38,7 +38,7 @@ function ThreadDetailPage() {
 				<Link
 					to="/"
 					search={{ tab: "planning" }}
-					className="text-sm text-blue-600 hover:text-blue-700"
+					className="text-sm text-gray-600 hover:text-gray-700"
 				>
 					Back to planning
 				</Link>
@@ -67,7 +67,7 @@ function ThreadDetailPage() {
 					<span
 						className={`inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium ${
 							isActive
-								? "bg-blue-50 text-blue-700"
+								? "bg-gray-100 text-gray-600"
 								: "bg-gray-100 text-gray-500"
 						}`}
 					>
@@ -92,7 +92,7 @@ function ThreadDetailPage() {
 					<button
 						type="button"
 						onClick={openCandidateAddPanel}
-						className="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-lg transition-colors"
+						className="inline-flex items-center gap-2 px-4 py-2 bg-gray-700 hover:bg-gray-800 text-white text-sm font-medium rounded-lg transition-colors"
 					>
 						<svg
 							className="w-4 h-4"