refactor(ui): replace hardcoded orange colors with accent tokens

- openrouter-badge: use accent/accent-foreground tokens
- openrouter-banner: use accent gradient colors
- openrouter-model-picker: use accent for sparkles and badges
- openrouter-promo-card: use accent for backgrounds and text
- openrouter-quick-start: use accent for icons, buttons, links

Theme-aware colors for better dark mode support and customization.

ui/src/components/profiles/openrouter-badge.tsx

@@ -17,8 +17,8 @@ export function OpenRouterBadge({ className, showTooltip = true }: OpenRouterBad
     <Badge
       variant="outline"
       className={cn(
-        'bg-orange-50 border-orange-200 text-orange-700',
+        'bg-accent/10 border-accent/30 text-accent',
-        'dark:bg-orange-950 dark:border-orange-800 dark:text-orange-300',
+        'dark:bg-accent/20 dark:border-accent/40 dark:text-accent-foreground',
         className
       )}
     >

ui/src/components/profiles/openrouter-banner.tsx

@@ -33,7 +33,7 @@ export function OpenRouterBanner({ onCreateClick }: OpenRouterBannerProps) {
   if (dismissed) return null;
 
   return (
-    <div className="bg-gradient-to-r from-orange-500 to-orange-600 text-white px-4 py-3 relative shrink-0">
+    <div className="bg-gradient-to-r from-accent to-accent/90 text-white px-4 py-3 relative shrink-0">
       <div className="flex items-center justify-between gap-4 max-w-screen-xl mx-auto">
         <div className="flex items-center gap-3 flex-1 min-w-0">
           <div className="p-1.5 bg-white/20 rounded-md shrink-0">
@@ -54,7 +54,7 @@ export function OpenRouterBanner({ onCreateClick }: OpenRouterBannerProps) {
               size="sm"
               variant="secondary"
               onClick={onCreateClick}
-              className="bg-white text-orange-600 hover:bg-white/90 h-8"
+              className="bg-white text-accent hover:bg-white/90 h-8"
             >
               Try it now
             </Button>

ui/src/components/profiles/openrouter-model-picker.tsx

@@ -173,7 +173,7 @@ export function OpenRouterModelPicker({
             {showPresets && newestModels.length > 0 && (
               <div>
                 <div className="text-muted-foreground bg-background sticky top-0 mb-1 flex items-center gap-1.5 py-1 text-xs font-semibold">
-                  <Sparkles className="h-3 w-3 text-orange-500" />
+                  <Sparkles className="h-3 w-3 text-accent" />
                   <span>Newest Models</span>
                 </div>
                 {newestModels.map((model) => (
@@ -232,14 +232,28 @@ function ModelItem({
       type="button"
       onClick={onClick}
       className={cn(
-        'hover:bg-accent flex w-full items-center justify-between rounded-sm px-2 py-1.5 text-left text-sm',
+        'flex w-full items-center justify-between rounded-sm px-2 py-1.5 text-left text-sm transition-colors',
-        isSelected && 'bg-accent'
+        'hover:bg-accent hover:text-accent-foreground',
+        isSelected && 'bg-accent text-accent-foreground'
       )}
     >
       <span className="flex-1 truncate">{model.name}</span>
-      <span className="text-muted-foreground ml-2 flex items-center gap-2 text-xs">
+      <span
+        className={cn(
+          'ml-2 flex items-center gap-2 text-xs',
+          isSelected ? 'text-accent-foreground/80' : 'text-muted-foreground'
+        )}
+      >
         {showAge && model.created && (
-          <Badge variant="outline" className="text-[10px] text-orange-600">
+          <Badge
+            variant="outline"
+            className={cn(
+              'text-[10px]',
+              isSelected
+                ? 'border-accent-foreground/30 text-accent-foreground/80'
+                : 'text-accent border-accent/30'
+            )}
+          >
             {formatModelAge(model.created)}
           </Badge>
         )}

ui/src/components/profiles/openrouter-promo-card.tsx

@@ -15,13 +15,13 @@ export function OpenRouterPromoCard({ onCreateClick }: OpenRouterPromoCardProps)
   const { modelCount, isLoading } = useOpenRouterReady();
 
   return (
-    <div className="p-3 border-t bg-gradient-to-r from-orange-50 to-orange-100/50 dark:from-orange-950/30 dark:to-orange-900/20">
+    <div className="p-3 border-t bg-gradient-to-r from-accent/5 to-accent/10 dark:from-accent/10 dark:to-accent/15">
       <div className="flex items-center gap-2">
-        <div className="p-1.5 bg-orange-100 dark:bg-orange-900/40 rounded shrink-0">
+        <div className="p-1.5 bg-accent/10 dark:bg-accent/20 rounded shrink-0">
           <img src="/icons/openrouter.svg" alt="" className="w-4 h-4" />
         </div>
         <div className="flex-1 min-w-0">
-          <p className="text-xs font-medium text-orange-700 dark:text-orange-300">OpenRouter</p>
+          <p className="text-xs font-medium text-accent dark:text-accent-foreground">OpenRouter</p>
           <p className="text-[10px] text-muted-foreground truncate">
             {isLoading ? '300+' : `${modelCount}+`} models available
           </p>
@@ -30,7 +30,7 @@ export function OpenRouterPromoCard({ onCreateClick }: OpenRouterPromoCardProps)
           size="sm"
           variant="ghost"
           onClick={onCreateClick}
-          className="h-7 px-2 text-orange-600 hover:text-orange-700 hover:bg-orange-100 dark:hover:bg-orange-900/30"
+          className="h-7 px-2 text-accent hover:text-accent hover:bg-accent/10 dark:hover:bg-accent/20"
         >
           <Zap className="w-3 h-3 mr-1" />
           <span className="text-xs">Add</span>

ui/src/components/profiles/openrouter-quick-start.tsx

@@ -25,15 +25,15 @@ export function OpenRouterQuickStart({
     <div className="flex-1 flex items-center justify-center bg-muted/20 p-8">
       <div className="max-w-lg w-full space-y-6">
         {/* Main OpenRouter Card */}
-        <Card className="border-orange-200 dark:border-orange-800/50 bg-gradient-to-br from-orange-50/50 to-background dark:from-orange-950/20">
+        <Card className="border-accent/30 dark:border-accent/40 bg-gradient-to-br from-accent/5 to-background dark:from-accent/10">
           <CardHeader className="pb-3">
             <div className="flex items-center gap-3 mb-2">
-              <div className="p-2 rounded-lg bg-orange-100 dark:bg-orange-900/30">
+              <div className="p-2 rounded-lg bg-accent/10 dark:bg-accent/20">
                 <img src="/icons/openrouter.svg" alt="OpenRouter" className="w-6 h-6" />
               </div>
               <Badge
                 variant="secondary"
-                className="bg-orange-100 text-orange-700 dark:bg-orange-900/40 dark:text-orange-300"
+                className="bg-accent/10 text-accent dark:bg-accent/20 dark:text-accent-foreground"
               >
                 Recommended
               </Badge>
@@ -48,18 +48,18 @@ export function OpenRouterQuickStart({
             {/* Key Features */}
             <div className="grid grid-cols-2 gap-3 text-sm">
               <div className="flex items-center gap-2 text-muted-foreground">
-                <Zap className="w-4 h-4 text-orange-500" />
+                <Zap className="w-4 h-4 text-accent" />
                 <span>One API, all providers</span>
               </div>
               <div className="flex items-center gap-2 text-muted-foreground">
-                <Sparkles className="w-4 h-4 text-orange-500" />
+                <Sparkles className="w-4 h-4 text-accent" />
                 <span>Model tier mapping</span>
               </div>
             </div>
 
             <Button
               onClick={onOpenRouterClick}
-              className="w-full bg-orange-600 hover:bg-orange-700 text-white"
+              className="w-full bg-accent hover:bg-accent/90 text-white"
               size="lg"
             >
               Create OpenRouter Profile
@@ -72,7 +72,7 @@ export function OpenRouterQuickStart({
                 href="https://openrouter.ai/keys"
                 target="_blank"
                 rel="noopener noreferrer"
-                className="text-orange-600 hover:underline inline-flex items-center gap-1"
+                className="text-accent hover:underline inline-flex items-center gap-1"
               >
                 openrouter.ai/keys
                 <ExternalLink className="w-3 h-3" />