feat: redesign weight summary legend and add currency selector

Redesign WeightSummaryCard stats from a disconnected 4-column grid to a
compact legend-style list with color dots, percentages, and a divider
before the total row. Switch chart and legend colors to a neutral gray
palette.

Add a currency selector to settings (USD, EUR, GBP, JPY, CAD, AUD) that
changes the displayed symbol across the app. This is visual only — no
value conversion is performed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/client/components/ItemCard.tsx

@@ -1,7 +1,9 @@
+import { useCurrency } from "../hooks/useCurrency";
 import { useWeightUnit } from "../hooks/useWeightUnit";
 import { formatPrice, formatWeight } from "../lib/formatters";
 import { LucideIcon } from "../lib/iconData";
 import { useUIStore } from "../stores/uiStore";
+import { ClassificationBadge } from "./ClassificationBadge";
 
 interface ItemCardProps {
 	id: number;
@@ -13,6 +15,8 @@ interface ItemCardProps {
 	imageFilename: string | null;
 	productUrl?: string | null;
 	onRemove?: () => void;
+	classification?: string;
+	onClassificationCycle?: () => void;
 }
 
 export function ItemCard({
@@ -25,8 +29,11 @@ export function ItemCard({
 	imageFilename,
 	productUrl,
 	onRemove,
+	classification,
+	onClassificationCycle,
 }: ItemCardProps) {
 	const unit = useWeightUnit();
+	const currency = useCurrency();
 	const openEditPanel = useUIStore((s) => s.openEditPanel);
 	const openExternalLink = useUIStore((s) => s.openExternalLink);
 
@@ -129,7 +136,7 @@ export function ItemCard({
 					)}
 					{priceCents != null && (
 						<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)}
+							{formatPrice(priceCents, currency)}
 						</span>
 					)}
 					<span className="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-gray-50 text-gray-600">
@@ -140,6 +147,12 @@ export function ItemCard({
 						/>{" "}
 						{categoryName}
 					</span>
+					{classification && onClassificationCycle && (
+						<ClassificationBadge
+							classification={classification}
+							onCycle={onClassificationCycle}
+						/>
+					)}
 				</div>
 			</div>
 		</button>