refactor(theme): simplify gradients while preserving status colors on cards

src/components/graph/graph-node-card.tsx

@@ -71,8 +71,8 @@ function statusDot(status: BeadIssue['status']): string {
  */
 function nodeStyle(kind: GraphNodeData['kind']): string {
     return kind === 'epic'
-        ? 'bg-[linear-gradient(160deg,rgba(56,189,248,0.06),rgba(15,23,42,0.9))] border-sky-400/15'
+        ? 'bg-sky-500/10 border-sky-400/30'
-        : 'bg-[linear-gradient(160deg,rgba(255,255,255,0.03),rgba(15,23,42,0.85))] border-white/8';
+        : 'bg-slate-800/60 border-white/10';
 }
 
 /**

src/components/graph/task-card-grid.tsx

@@ -75,17 +75,17 @@ function statusDot(status: BeadIssue['status']): string {
 function statusGradient(status: BeadIssue['status']): string {
   switch (status) {
     case 'open':
-      return 'border-l-2 border-emerald-400/60 bg-emerald-400/8';
+      return 'border-l-2 border-emerald-400 bg-emerald-500/15';
     case 'in_progress':
-      return 'border-l-2 border-amber-400/60 bg-amber-400/8';
+      return 'border-l-2 border-amber-400 bg-amber-500/15';
     case 'blocked':
-      return 'border-l-2 border-rose-400/60 bg-rose-400/8';
+      return 'border-l-2 border-rose-400 bg-rose-500/15';
     case 'closed':
-      return 'border-l-2 border-slate-400/40 bg-slate-400/5 opacity-70';
+      return 'border-l-2 border-slate-400/60 bg-slate-500/10 opacity-80';
     case 'deferred':
-      return 'border-l-2 border-slate-400/40 bg-slate-400/5';
+      return 'border-l-2 border-slate-400/60 bg-slate-500/10';
     default:
-      return 'border-l-2 border-slate-400/40 bg-slate-400/5';
+      return 'border-l-2 border-slate-400/60 bg-slate-500/10';
   }
 }
 

src/components/shared/status-utils.tsx

@@ -1,19 +1,19 @@
 export function statusGradient(status: string): string {
   switch (status) {
     case 'ready':
-      return 'border-l-2 border-emerald-400/60 bg-emerald-400/8';
+      return 'border-l-2 border-emerald-400 bg-emerald-500/15';
     case 'in_progress':
-      return 'border-l-2 border-amber-400/60 bg-amber-400/8';
+      return 'border-l-2 border-amber-400 bg-amber-500/15';
     case 'blocked':
-      return 'border-l-2 border-rose-400/60 bg-rose-400/8';
+      return 'border-l-2 border-rose-400 bg-rose-500/15';
     case 'closed':
-      return 'border-l-2 border-slate-400/40 bg-slate-400/5 opacity-70';
+      return 'border-l-2 border-slate-400/60 bg-slate-500/10 opacity-80';
     case 'open':
-      return 'border-l-2 border-sky-400/60 bg-sky-400/8';
+      return 'border-l-2 border-sky-400 bg-sky-500/15';
     case 'deferred':
-      return 'border-l-2 border-slate-400/40 bg-slate-400/5';
+      return 'border-l-2 border-slate-400/60 bg-slate-500/10';
     default:
-      return 'border-l-2 border-slate-400/40 bg-slate-400/5';
+      return 'border-l-2 border-slate-400/60 bg-slate-500/10';
   }
 }
 

src/components/social/social-card.tsx

@@ -34,10 +34,9 @@ function handleCardKeyDown(event: KeyboardEvent<HTMLDivElement>, onClick?: Mouse
 function statusVisual(status: SocialCardData['status']) {
   if (status === 'blocked') {
     return {
-      border: 'color-mix(in srgb, var(--ui-accent-blocked) 50%, var(--ui-border-soft))',
+      border: 'rgba(255, 76, 114, 0.5)',
-      cardBg:
+      cardBg: 'rgba(255, 76, 114, 0.08)',
-        'linear-gradient(160deg, color-mix(in srgb, var(--ui-accent-blocked) 20%, #1a0f15), color-mix(in srgb, var(--ui-bg-shell) 92%, black))',
+      badgeBg: 'rgba(255, 76, 114, 0.2)',
-      badgeBg: 'color-mix(in srgb, var(--ui-accent-blocked) 24%, transparent)',
       badgeText: '#ffd5df',
       chipText: 'Blocked',
     };
@@ -45,10 +44,9 @@ function statusVisual(status: SocialCardData['status']) {
 
   if (status === 'in_progress') {
     return {
-      border: 'color-mix(in srgb, var(--ui-accent-warning) 50%, var(--ui-border-soft))',
+      border: 'rgba(255, 178, 74, 0.5)',
-      cardBg:
+      cardBg: 'rgba(255, 178, 74, 0.08)',
-        'linear-gradient(160deg, color-mix(in srgb, var(--ui-accent-warning) 16%, #1a1510), color-mix(in srgb, var(--ui-bg-shell) 92%, black))',
+      badgeBg: 'rgba(255, 178, 74, 0.2)',
-      badgeBg: 'color-mix(in srgb, var(--ui-accent-warning) 24%, transparent)',
       badgeText: '#ffe5c7',
       chipText: 'Active',
     };
@@ -56,10 +54,9 @@ function statusVisual(status: SocialCardData['status']) {
 
   if (status === 'ready') {
     return {
-      border: 'color-mix(in srgb, var(--ui-accent-ready) 50%, var(--ui-border-soft))',
+      border: 'rgba(53, 217, 143, 0.5)',
-      cardBg:
+      cardBg: 'rgba(53, 217, 143, 0.08)',
-        'linear-gradient(160deg, color-mix(in srgb, var(--ui-accent-ready) 16%, #101a15), color-mix(in srgb, var(--ui-bg-shell) 92%, black))',
+      badgeBg: 'rgba(53, 217, 143, 0.2)',
-      badgeBg: 'color-mix(in srgb, var(--ui-accent-ready) 24%, transparent)',
       badgeText: '#d6ffe7',
       chipText: 'Ready',
     };
@@ -67,8 +64,8 @@ function statusVisual(status: SocialCardData['status']) {
 
   return {
     border: 'var(--ui-border-strong)',
-    cardBg: 'linear-gradient(160deg, color-mix(in srgb, var(--ui-bg-card) 95%, black), color-mix(in srgb, var(--ui-bg-shell) 90%, black))',
+    cardBg: 'var(--ui-bg-card)',
-    badgeBg: 'color-mix(in srgb, var(--ui-border-strong) 24%, transparent)',
+    badgeBg: 'rgba(143, 156, 175, 0.15)',
     badgeText: 'var(--ui-text-muted)',
     chipText: 'Closed',
   };
@@ -141,8 +138,8 @@ export function SocialCard({
         background: status.cardBg,
         borderColor: selected ? status.border : 'var(--ui-border-soft)',
         boxShadow: selected
-          ? '0 24px 40px -26px rgba(0,0,0,0.85), 0 0 0 1px color-mix(in srgb, var(--ui-border-strong) 66%, transparent)'
+          ? `0 0 0 1px ${status.border}, 0 20px 40px -20px rgba(0,0,0,0.6)`
-          : '0 12px 26px -24px rgba(0,0,0,0.82)',
+          : '0 8px 24px -16px rgba(0,0,0,0.5)',
       }}
     >
       <div className="mb-2 flex items-center justify-between gap-2">