From 86290a7c6946b4f31b25da952bcf8c3fb68f0046 Mon Sep 17 00:00:00 2001
From: hbyang <hbyang@o2o.kr>
Date: Fri, 12 Jun 2026 10:25:56 +0900
Subject: [PATCH] =?UTF-8?q?feat(ui):=20AI=20=EA=B2=B0=EA=B3=BC=20=EB=B0=B0?=
 =?UTF-8?q?=EC=A7=80=203=EB=8B=A8=EA=B3=84=20=E2=80=94=20=EC=A0=95?=
 =?UTF-8?q?=ED=99=95/=EC=A0=81=EC=A4=91/=EB=B9=97=EB=82=98=EA=B0=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

스코어까지 맞으면 '정확 ✓'(강조), 승패만 맞으면 '적중 ✓', 그 외 '빗나감'.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 frontend/src/components/Arena.tsx | 15 +++++++++++----
 frontend/src/lib/i18n.ts          |  3 +++
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/Arena.tsx b/frontend/src/components/Arena.tsx
index 85f81c4..8186b40 100644
--- a/frontend/src/components/Arena.tsx
+++ b/frontend/src/components/Arena.tsx
@@ -261,13 +261,20 @@ export default function Arena({
           </div>
           <div className="mt-3 flex flex-col gap-1.5">
             {predictions.map((p) => {
-              const hit = p.outcome === match.result!.outcome;
+              const r = match.result!;
+              const exact = p.scoreA === r.scoreA && p.scoreB === r.scoreB;
+              const outcomeHit = p.outcome === r.outcome;
+              // 3단계: 정확(스코어까지) / 적중(승패만) / 빗나감
+              const label = exact ? t.exactHit : outcomeHit ? t.hit : t.miss;
+              const cls = exact
+                ? "rounded bg-[var(--green)]/15 px-1.5 py-0.5 font-extrabold text-[var(--green)]"
+                : outcomeHit
+                  ? "font-bold text-[var(--green)]"
+                  : "text-white/45";
               return (
                 <div key={p.model} className="flex items-center justify-between text-[13px]">
                   <span className="font-bold text-white/85">{p.model}</span>
-                  <span className={hit ? "font-bold text-[var(--green)]" : "text-white/45"}>
-                    {hit ? t.hit : t.miss}
-                  </span>
+                  <span className={cls}>{label}</span>
                 </div>
               );
             })}
diff --git a/frontend/src/lib/i18n.ts b/frontend/src/lib/i18n.ts
index ca35972..0ccd1de 100644
--- a/frontend/src/lib/i18n.ts
+++ b/frontend/src/lib/i18n.ts
@@ -85,6 +85,7 @@ type Dict = {
   rulesCloseBtn: string;
   crowdSub: string;
   finalResult: string;
+  exactHit: string;
   hit: string;
   miss: string;
   matchEnded: string;
@@ -154,6 +155,7 @@ export const DICT: Record<Lang, Dict> = {
     rulesCloseBtn: "확인",
     crowdSub: "| 참여자들의 선택",
     finalResult: "최종 결과",
+    exactHit: "정확 ✓",
     hit: "적중 ✓",
     miss: "빗나감",
     matchEnded: "경기 종료 · 최종 결과",
@@ -222,6 +224,7 @@ export const DICT: Record<Lang, Dict> = {
     rulesCloseBtn: "Got it",
     crowdSub: "| What the crowd picked",
     finalResult: "Final result",
+    exactHit: "Exact ✓",
     hit: "Hit ✓",
     miss: "Miss",
     matchEnded: "Match ended · Final",