diff --git a/src/features/plan/components/BrandingGuide.tsx b/src/features/plan/components/BrandingGuide.tsx
index 1ebe430..8f51b8e 100644
--- a/src/features/plan/components/BrandingGuide.tsx
+++ b/src/features/plan/components/BrandingGuide.tsx
@@ -439,17 +439,23 @@ function BrandConsistencyTab({ inconsistencies }: { inconsistencies: BrandIncons
               onClick={() => setExpanded(expanded === i ? null : i)}
               className="w-full flex items-center justify-between p-5 h-auto text-left hover:bg-slate-50/50 rounded-none"
             >
-              <div className="flex items-center gap-3">
-                <div className="w-8 h-8 rounded-lg bg-brand-navy flex items-center justify-center text-white text-xs font-bold">
-                  {item.values.filter((v) => !v.isCorrect).length}
-                </div>
-                <div>
-                  <p className="font-semibold text-brand-navy">{item.field}</p>
-                  <p className="text-xs text-slate-500">
-                    {item.values.filter((v) => !v.isCorrect).length}개 채널 불일치
-                  </p>
-                </div>
-              </div>
+              {(() => {
+                const mismatchCount = item.values.filter((v) => !v.isCorrect).length;
+                const isAllConsistent = mismatchCount === 0;
+                return (
+                  <div className="flex items-center gap-3">
+                    <div className={`w-8 h-8 rounded-lg flex items-center justify-center text-white text-xs font-bold ${isAllConsistent ? 'bg-brand-purple-soft' : 'bg-brand-navy'}`}>
+                      {isAllConsistent ? <CheckFilled size={14} /> : mismatchCount}
+                    </div>
+                    <div>
+                      <p className="font-semibold text-brand-navy">{item.field}</p>
+                      <p className="text-xs text-slate-500">
+                        {isAllConsistent ? '전 채널 일치' : `${mismatchCount}개 채널 불일치`}
+                      </p>
+                    </div>
+                  </div>
+                );
+              })()}
               <ArrowRight
                 size={16}
                 className={`text-slate-400 transition-transform ${
diff --git a/src/features/report/components/FacebookAudit.tsx b/src/features/report/components/FacebookAudit.tsx
index 24ec63b..1f7d6a2 100644
--- a/src/features/report/components/FacebookAudit.tsx
+++ b/src/features/report/components/FacebookAudit.tsx
@@ -201,17 +201,23 @@ function BrandConsistencyMap({ inconsistencies }: { inconsistencies: BrandIncons
               onClick={() => setExpanded(expanded === i ? null : i)}
               className="w-full flex items-center justify-between p-5 h-auto text-left hover:bg-slate-50/50 rounded-none"
             >
-              <div className="flex items-center gap-3">
-                <div className="w-8 h-8 rounded-lg bg-primary-900 flex items-center justify-center text-white text-xs font-bold">
-                  {item.values.filter(v => !v.isCorrect).length}
-                </div>
-                <div>
-                  <p className="font-semibold text-brand-navy">{item.field}</p>
-                  <p className="text-xs text-slate-500">
-                    {item.values.filter(v => !v.isCorrect).length}개 채널 불일치
-                  </p>
-                </div>
-              </div>
+              {(() => {
+                const mismatchCount = item.values.filter(v => !v.isCorrect).length;
+                const isAllConsistent = mismatchCount === 0;
+                return (
+                  <div className="flex items-center gap-3">
+                    <div className={`w-8 h-8 rounded-lg flex items-center justify-center text-white text-xs font-bold ${isAllConsistent ? 'bg-brand-purple-soft' : 'bg-primary-900'}`}>
+                      {isAllConsistent ? <CheckCircle2 size={14} /> : mismatchCount}
+                    </div>
+                    <div>
+                      <p className="font-semibold text-brand-navy">{item.field}</p>
+                      <p className="text-xs text-slate-500">
+                        {isAllConsistent ? '전 채널 일치' : `${mismatchCount}개 채널 불일치`}
+                      </p>
+                    </div>
+                  </div>
+                );
+              })()}
               <ArrowRight
                 size={16}
                 className={`text-slate-400 transition-transform ${expanded === i ? 'rotate-90' : ''}`}