diff --git a/src/api/reviewService.js b/src/api/reviewService.js
index ea2b8ed..3f73cd1 100644
--- a/src/api/reviewService.js
+++ b/src/api/reviewService.js
@@ -1,55 +1,51 @@
 // src/api/reviewService.js
-
-// 중요: 백엔드 주소를 정확하게 입력 (Proxy 설정이 없다면 전체 주소 필수)
 const BASE_URL = "http://localhost:8080/api";
 
-export const fetchCodeReview = async (code, comment) => {
-  // 1. 데이터 객체 생성
+export const fetchCodeReview = async (code, comment, repoUrl) => {
   const payload = {
     code: code,
     comment: comment && comment.trim() ? comment.trim() : null,
+    repoUrl: repoUrl && repoUrl.trim() ? repoUrl.trim() : null,
   };
 
   try {
-    // 2. fetch 요청 (JSON 모드)
     const res = await fetch(`${BASE_URL}/review`, {
       method: "POST",
       headers: {
-        "Content-Type": "application/json", // 나 JSON 보낸다고 알려줌
+        "Content-Type": "application/json",
       },
-      body: JSON.stringify(payload), // 객체를 문자열로 변환
+      body: JSON.stringify(payload),
     });
 
-    // 3. 에러 처리
     const raw = await res.text();
-    
+
     if (!res.ok) {
-      // 서버가 에러 응답을 준 경우
-      let errMsg = raw;
       try {
-        const json = JSON.parse(raw);
-        errMsg = json.message || json.error || json.detail || raw;
+        const errJson = JSON.parse(raw);
+        throw new Error(
+          errJson.message ||
+            errJson.error ||
+            `코드 리뷰 요청 실패 (status: ${res.status})`
+        );
       } catch {
-        // JSON 파싱 실패 시 raw text 사용
+        throw new Error(
+          raw || `코드 리뷰 요청 실패 (status: ${res.status})`
+        );
       }
-      throw new Error(errMsg || `요청 실패 (${res.status})`);
     }
 
-    if (!raw) return {};
-    
-    // 정상 응답 파싱
     try {
       return JSON.parse(raw);
     } catch {
       return { review: raw, questions: [] };
     }
-
   } catch (error) {
     console.error("API 요청 실패:", error);
-    // "Failed to fetch"는 보통 서버가 꺼져있거나 주소가 틀렸을 때 발생
     if (error.message === "Failed to fetch") {
-        throw new Error("서버에 연결할 수 없습니다. 백엔드 서버가 켜져 있는지 확인해주세요.");
+      throw new Error(
+        "서버에 연결할 수 없습니다. 백엔드 서버가 켜져 있는지 확인해주세요."
+      );
     }
     throw error;
   }
-};
\ No newline at end of file
+};
diff --git a/src/features/codingTest/CodingTest.jsx b/src/features/codingTest/CodingTest.jsx
index 7aafd00..393bf32 100644
--- a/src/features/codingTest/CodingTest.jsx
+++ b/src/features/codingTest/CodingTest.jsx
@@ -4,7 +4,6 @@ import { Link } from "react-router-dom";
 import {
   Sparkles,
   Send,
-  Play,
   CheckCircle2,
   XCircle,
   Terminal,
@@ -30,7 +29,9 @@ const fetchRandomProblem = async (difficulty) => {
 
   if (!response.ok) {
     const text = await response.text().catch(() => "");
-    throw new Error(text || `랜덤 문제를 불러오지 못했습니다. (status: ${response.status})`);
+    throw new Error(
+      text || `랜덤 문제를 불러오지 못했습니다. (status: ${response.status})`
+    );
   }
 
   return await response.json();
@@ -41,7 +42,7 @@ const submitCode = async ({ problemId, code, language, userId }) => {
     problemId,
     sourceCode: code,
     language,
-    userId: userId ?? 1 // userId가 null/undefined일 경우 기본값 1 사용 (Long 타입 일치)
+    userId: userId ?? 1, // userId가 null/undefined일 경우 기본값 1 사용 (Long 타입 일치)
   };
 
   // API 경로: /api/coding/submissions
@@ -65,12 +66,26 @@ const submitCode = async ({ problemId, code, language, userId }) => {
 // 컴포넌트 시작
 // -----------------------------------------------------------
 
-
 // 언어 옵션
 const LANGUAGE_OPTIONS = [
-  { value: "python", label: "Python", color: "text-blue-400", activeBorder: "border-blue-400/60 bg-blue-500/10" },
-  { value: "java", label: "Java", color: "text-orange-400", activeBorder: "border-orange-400/60 bg-orange-500/10" },
-  { value: "cpp", label: "C++", color: "text-purple-400", activeBorder: "border-purple-400/60 bg-purple-500/10" },
+  {
+    value: "python",
+    label: "Python",
+    color: "text-blue-400",
+    activeBorder: "border-blue-400/60 bg-blue-500/10",
+  },
+  {
+    value: "java",
+    label: "Java",
+    color: "text-orange-400",
+    activeBorder: "border-orange-400/60 bg-orange-500/10",
+  },
+  {
+    value: "cpp",
+    label: "C++",
+    color: "text-purple-400",
+    activeBorder: "border-purple-400/60 bg-purple-500/10",
+  },
 ];
 
 // 기본 템플릿
@@ -109,9 +124,21 @@ int main() {
 
 // 난이도 색
 const DIFFICULTY_CONFIG = {
-  EASY: { label: "쉬움", color: "text-emerald-300 bg-emerald-500/20 border-emerald-400/30 shadow-[0_0_15px_rgba(52,211,153,0.15)]" },
-  MEDIUM: { label: "보통", color: "text-amber-300 bg-amber-500/20 border-amber-400/30 shadow-[0_0_15px_rgba(251,191,36,0.15)]" },
-  HARD: { label: "어려움", color: "text-rose-300 bg-rose-500/20 border-rose-400/30 shadow-[0_0_15px_rgba(251,113,133,0.15)]" },
+  EASY: {
+    label: "쉬움",
+    color:
+      "text-emerald-300 bg-emerald-500/20 border-emerald-400/30 shadow-[0_0_15px_rgba(52,211,153,0.15)]",
+  },
+  MEDIUM: {
+    label: "보통",
+    color:
+      "text-amber-300 bg-amber-500/20 border-amber-400/30 shadow-[0_0_15px_rgba(251,191,36,0.15)]",
+  },
+  HARD: {
+    label: "어려움",
+    color:
+      "text-rose-300 bg-rose-500/20 border-rose-400/30 shadow-[0_0_15px_rgba(251,113,133,0.15)]",
+  },
 };
 
 export default function CodingTest() {
@@ -124,16 +151,17 @@ export default function CodingTest() {
   const [result, setResult] = useState(null);
   const [errorMsg, setErrorMsg] = useState("");
 
-  // AI 피드백(리뷰/면접질문) 구역을 열지 말지 토글
-  const [showFeedback, setShowFeedback] = useState(false);
-
   // 코드 리뷰 vs 예상 면접 질문 토글 상태
   const [showInterview, setShowInterview] = useState(false);
 
   // 언어 변경
   const handleChangeLanguage = (nextLang) => {
     if (code !== LANGUAGE_TEMPLATES[language] && code.trim() !== "") {
-      if (!window.confirm("언어를 변경하면 작성 중인 코드가 초기화됩니다. 계속하시겠습니까?")) {
+      if (
+        !window.confirm(
+          "언어를 변경하면 작성 중인 코드가 초기화됩니다. 계속하시겠습니까?"
+        )
+      ) {
         return;
       }
     }
@@ -146,8 +174,8 @@ export default function CodingTest() {
     setIsLoadingProblem(true);
     setErrorMsg("");
     setResult(null);
-    setShowFeedback(false);
     setShowInterview(false);
+
     try {
       const data = await fetchRandomProblem(difficulty);
       setProblem(data);
@@ -174,7 +202,6 @@ export default function CodingTest() {
     setIsSubmitting(true);
     setErrorMsg("");
     setResult(null);
-    setShowFeedback(false);
     setShowInterview(false);
 
     try {
@@ -185,17 +212,9 @@ export default function CodingTest() {
         userId: 1, // Long 타입이므로 숫자 1 사용
       });
       setResult(res);
-
-      // aiFeedback 또는 interviewQuestions가 있으면 피드백 영역 기본 ON
-      if (res.aiFeedback || (res.interviewQuestions && res.interviewQuestions.length > 0)) {
-        setShowFeedback(true);
-      } else {
-        setShowFeedback(false);
-      }
+      // showInterview는 기본 false (코드 리뷰 먼저 보여줌)
     } catch (err) {
-      setErrorMsg(
-        err?.message || "채점 서버 통신 중 오류가 발생했습니다."
-      );
+      setErrorMsg(err?.message || "채점 서버 통신 중 오류가 발생했습니다.");
     } finally {
       setIsSubmitting(false);
     }
@@ -205,29 +224,37 @@ export default function CodingTest() {
     return ["AC", "SUCCESS", "PASSED"].includes(status?.toUpperCase());
   };
 
+  const hasFeedback =
+    !!result?.aiFeedback ||
+    (Array.isArray(result?.interviewQuestions) &&
+      result.interviewQuestions.length > 0);
+
   return (
     // 배경: 딥 블루 그라데이션
     <div className="h-screen w-screen bg-[#0f172a] text-slate-200 font-sans overflow-hidden flex flex-col selection:bg-cyan-500/30">
-      
       {/* 배경 조명 효과 */}
       <div className="fixed inset-0 z-0 pointer-events-none overflow-hidden">
         <div className="absolute top-[-30%] left-[20%] w-[70%] h-[70%] bg-indigo-500/10 blur-[120px] rounded-full mix-blend-screen animate-pulse duration-[8000ms]" />
         <div className="absolute bottom-[-20%] right-[-10%] w-[60%] h-[60%] bg-blue-500/10 blur-[130px] rounded-full mix-blend-screen" />
         <div className="absolute top-[10%] left-[-10%] w-[40%] h-[40%] bg-cyan-500/5 blur-[100px] rounded-full mix-blend-screen" />
-        <div className="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-[0.02] mix-blend-overlay"></div>
+        <div className="absolute inset-0 bg-[url('https://grainy-gradients.vercel.app/noise.svg')] opacity-[0.02] mix-blend-overlay" />
       </div>
 
       {/* 헤더 */}
       <header className="relative z-20 h-16 border-b border-white/5 bg-[#0f172a]/90 backdrop-blur-md shrink-0 flex items-center justify-between px-6">
-        
         {/* 왼쪽: Home 버튼 */}
         <div className="flex items-center w-64">
           <Link
             to="/"
-            className="group flex items-center gap-2.5 px-4 py-2 rounded-full bg-white/5 hover:bg-white/10 border border-white/5 transition-all duration-300 hover:border-indigo-400/30 hover:shadow-[0_0_15px_rgba(99,102,241,0.3)]"
+            className="group flex items-centered gap-2.5 px-4 py-2 rounded-full bg-white/5 hover:bg-white/10 border border-white/5 transition-all duration-300 hover:border-indigo-400/30 hover:shadow-[0_0_15px_rgba(99,102,241,0.3)]"
           >
-            <Home size={16} className="text-indigo-300 group-hover:text-white transition-colors" />
-            <span className="text-sm font-medium text-indigo-100/80 group-hover:text-white transition-colors">Home</span>
+            <Home
+              size={16}
+              className="text-indigo-300 group-hover:text-white transition-colors"
+            />
+            <span className="text-sm font-medium text-indigo-100/80 group-hover:text-white transition-colors">
+              Home
+            </span>
           </Link>
         </div>
 
@@ -274,45 +301,56 @@ export default function CodingTest() {
             {isLoadingProblem ? (
               <RefreshCw size={14} className="animate-spin text-white/80" />
             ) : (
-              <Sparkles size={14} className="text-white/90 group-hover:text-white transition-colors" />
+              <Sparkles
+                size={14}
+                className="text-white/90 group-hover:text-white transition-colors"
+              />
             )}
-            <span className="tracking-wide">{isLoadingProblem ? "생성 중..." : "문제 생성"}</span>
+            <span className="tracking-wide">
+              {isLoadingProblem ? "생성 중..." : "문제 생성"}
+            </span>
           </button>
         </div>
       </header>
 
       {/* 메인 컨텐츠 영역 */}
       <main className="relative z-10 flex-1 mx-auto max-w-[1920px] w-full p-6 flex flex-col gap-6 overflow-hidden">
-        
         {/* 에러 알림 */}
         {errorMsg && (
           <div className="animate-in fade-in slide-in-from-top-2 rounded-xl border border-rose-500/30 bg-rose-500/10 px-5 py-3 flex items-start gap-3 text-rose-200 shadow-lg backdrop-blur-md max-w-2xl mx-auto shrink-0 absolute top-20 left-1/2 -translate-x-1/2 z-50">
-            <AlertCircle size={20} className="mt-0.5 shrink-0 text-rose-400" />
+            <AlertCircle
+              size={20}
+              className="mt-0.5 shrink-0 text-rose-400"
+            />
             <p className="text-sm font-medium">{errorMsg}</p>
           </div>
         )}
 
         {/* 메인 작업 영역 (Grid) */}
         <div className="flex-1 min-h-0 grid lg:grid-cols-[1fr_1.2fr] gap-6 h-full">
-          
           {/* 왼쪽: 문제 설명 패널 */}
           <section className="flex flex-col rounded-3xl bg-[#0B1120]/90 backdrop-blur-md border border-white/10 overflow-hidden shadow-2xl relative group h-full">
-             
-             {/* 패널 헤더 (고정) */}
+            {/* 패널 헤더 (고정) */}
             <div className="h-12 px-6 border-b border-white/5 flex items-center justify-between bg-white/[0.02] shrink-0">
               <div className="flex items-center gap-2.5 text-slate-400">
                 <Maximize2 size={16} className="text-indigo-400" />
-                <span className="text-xs font-bold uppercase tracking-widest text-slate-400/80">문제 설명</span>
+                <span className="text-xs font-bold uppercase tracking-widest text-slate-400/80">
+                  문제 설명
+                </span>
               </div>
               {problem && (
-                <span className={`text-[10px] px-2.5 py-0.5 rounded-full font-bold border backdrop-blur-sm ${DIFFICULTY_CONFIG[problem.difficulty].color}`}>
+                <span
+                  className={`text-[10px] px-2.5 py-0.5 rounded-full font-bold border backdrop-blur-sm ${
+                    DIFFICULTY_CONFIG[problem.difficulty].color
+                  }`}
+                >
                   {DIFFICULTY_CONFIG[problem.difficulty].label}
                 </span>
               )}
             </div>
 
             {/* 컨텐츠 영역 (여기가 스크롤됨) */}
-            <div className="flex-1 overflow-y-auto p-6 scrollbar-thin scrollbar-thumb-indigo-500/20 hover:scrollbar-thumb-indigo-500/40 scrollbar-track-transparent">
+            <div className="flex-1 overflow-y-auto p-6 custom-scrollbar">
               {isLoadingProblem ? (
                 // 로딩 스켈레톤
                 <div className="space-y-8 animate-pulse opacity-60">
@@ -330,34 +368,45 @@ export default function CodingTest() {
                     <h2 className="text-3xl font-bold text-white leading-tight tracking-tight mb-2 drop-shadow-md">
                       {problem.title}
                     </h2>
-                    <div className="h-1 w-12 bg-gradient-to-r from-indigo-500 to-cyan-500 rounded-full"></div>
+                    <div className="h-1 w-12 bg-gradient-to-r from-indigo-500 to-cyan-500 rounded-full" />
                   </div>
 
                   <div className="prose prose-invert prose-p:text-slate-300 prose-headings:text-indigo-100 max-w-none leading-relaxed text-base/7">
-                    <div className="whitespace-pre-wrap font-normal">{problem.description}</div>
+                    <div className="whitespace-pre-wrap font-normal">
+                      {problem.description}
+                    </div>
                   </div>
 
                   {problem.samples && problem.samples.length > 0 && (
                     <div className="mt-8 space-y-5">
                       <h3 className="text-sm font-bold text-indigo-200/80 flex items-center gap-2 uppercase tracking-wider">
-                        <Terminal size={16} className="text-indigo-400"/>
+                        <Terminal size={16} className="text-indigo-400" />
                         예시 입력/출력
                       </h3>
                       <div className="grid gap-4">
                         {problem.samples.map((sample, idx) => (
-                          <div key={idx} className="group/case rounded-2xl border border-white/10 bg-[#0f172a]/40 overflow-hidden hover:border-indigo-500/30 transition-colors shadow-inner">
+                          <div
+                            key={idx}
+                            className="group/case rounded-2xl border border-white/10 bg-[#0f172a]/40 overflow-hidden hover:border-indigo-500/30 transition-colors shadow-inner"
+                          >
                             <div className="px-5 py-2 bg-white/[0.03] border-b border-white/5 flex items-center justify-between">
-                              <span className="text-xs font-medium text-slate-400 group-hover/case:text-indigo-300 transition-colors">Case #{idx + 1}</span>
+                              <span className="text-xs font-medium text-slate-400 group-hover/case:text-indigo-300 transition-colors">
+                                Case #{idx + 1}
+                              </span>
                             </div>
                             <div className="p-5 grid sm:grid-cols-2 gap-6">
                               <div>
-                                <p className="text-[10px] font-bold text-slate-500 uppercase tracking-wider mb-2.5">입력</p>
+                                <p className="text-[10px] font-bold text-slate-500 uppercase tracking-wider mb-2.5">
+                                  입력
+                                </p>
                                 <div className="rounded-xl bg-[#0b1120] border border-white/5 p-3.5 font-mono text-sm text-indigo-100/90 overflow-x-auto shadow-inner">
                                   {sample.inputData}
                                 </div>
                               </div>
                               <div>
-                                <p className="text-[10px] font-bold text-slate-500 uppercase tracking-wider mb-2.5">출력</p>
+                                <p className="text-[10px] font-bold text-slate-500 uppercase tracking-wider mb-2.5">
+                                  출력
+                                </p>
                                 <div className="rounded-xl bg-[#0b1120] border border-white/5 p-3.5 font-mono text-sm text-cyan-300/90 overflow-x-auto shadow-inner">
                                   {sample.expectedOutput}
                                 </div>
@@ -374,12 +423,20 @@ export default function CodingTest() {
                   <div className="relative group">
                     <div className="absolute inset-0 bg-indigo-500/20 blur-2xl rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-700" />
                     <div className="w-24 h-24 rounded-full bg-white/[0.03] border border-white/[0.05] flex items-center justify-center relative z-10 backdrop-blur-sm">
-                      <Sparkles size={40} className="text-slate-500 group-hover:text-indigo-400 transition-colors duration-500" strokeWidth={1.5} />
+                      <Sparkles
+                        size={40}
+                        className="text-slate-500 group-hover:text-indigo-400 transition-colors duration-500"
+                        strokeWidth={1.5}
+                      />
                     </div>
                   </div>
                   <div className="space-y-2">
-                    <p className="text-lg font-medium text-slate-300">문제가 선택되지 않았습니다.</p>
-                    <p className="text-sm text-slate-500">우측 상단의 "문제 생성" 버튼을 눌러 시작하세요.</p>
+                    <p className="text-lg font-medium text-slate-300">
+                      문제가 선택되지 않았습니다.
+                    </p>
+                    <p className="text-sm text-slate-500">
+                      우측 상단의 &quot;문제 생성&quot; 버튼을 눌러 시작하세요.
+                    </p>
                   </div>
                 </div>
               )}
@@ -388,7 +445,6 @@ export default function CodingTest() {
 
           {/* 오른쪽: 코드 에디터 및 실행 결과 */}
           <div className="flex flex-col h-full gap-6">
-            
             {/* 1. 코드 에디터 카드 */}
             <section className="flex-1 flex flex-col rounded-3xl bg-[#172033]/60 backdrop-blur-md border border-indigo-500/10 overflow-hidden shadow-2xl relative group min-h-0">
               {/* 에디터 툴바 */}
@@ -400,11 +456,19 @@ export default function CodingTest() {
                       onClick={() => handleChangeLanguage(opt.value)}
                       className={`px-3 py-1 text-[11px] font-medium rounded-md flex items-center gap-1.5 transition-all duration-200 ${
                         language === opt.value
-                          ? `bg-[#1e293b] text-white shadow-lg border ${opt.activeBorder || 'border-white/10'}`
+                          ? `bg-[#1e293b] text-white shadow-lg border ${
+                              opt.activeBorder || "border-white/10"
+                            }`
                           : "text-slate-400 hover:text-slate-200 hover:bg-white/5"
                       }`}
                     >
-                      <div className={`w-1.5 h-1.5 rounded-full ${language === opt.value ? opt.color.replace('text', 'bg') : 'bg-slate-600'}`} />
+                      <div
+                        className={`w-1.5 h-1.5 rounded-full ${
+                          language === opt.value
+                            ? opt.color.replace("text", "bg")
+                            : "bg-slate-600"
+                        }`}
+                      />
                       {opt.label}
                     </button>
                   ))}
@@ -427,9 +491,9 @@ export default function CodingTest() {
               </div>
 
               {/* 에디터 영역 */}
-              <div className="flex-1 relative group bg-[#050914] overflow-hidden"> 
+              <div className="flex-1 relative group bg-[#050914] overflow-hidden">
                 <textarea
-                  className="w-full h-full bg-transparent text-[13px] font-mono text-slate-200 p-6 outline-none resize-none leading-7 selection:bg-indigo-500/30 scrollbar-thin scrollbar-thumb-indigo-500/20 hover:scrollbar-thumb-indigo-500/40 placeholder:text-slate-600/70"
+                  className="w-full h-full bg-transparent text-[13px] font-mono text-slate-200 p-6 outline-none resize-none leading-7 selection:bg-indigo-500/30 custom-scrollbar placeholder:text-slate-600/70"
                   value={code}
                   onChange={(e) => setCode(e.target.value)}
                   spellCheck={false}
@@ -442,7 +506,10 @@ export default function CodingTest() {
             <section className="shrink-0 h-[280px] flex flex-col rounded-3xl bg-[#0b101b]/95 backdrop-blur-md border border-indigo-500/10 overflow-hidden shadow-2xl relative group">
               <div className="px-6 py-3 border-b border-white/5 flex items-center justify-between bg-white/[0.01] shrink-0">
                 <h3 className="text-xs font-bold text-slate-400 uppercase tracking-widest flex items-center gap-2">
-                  <Trophy size={14} className={result ? "text-yellow-500" : "text-slate-600"} />
+                  <Trophy
+                    size={14}
+                    className={result ? "text-yellow-500" : "text-slate-600"}
+                  />
                   채점 결과
                 </h3>
                 {result && (
@@ -452,76 +519,72 @@ export default function CodingTest() {
                 )}
               </div>
 
-              <div className="flex-1 p-6 overflow-y-auto scrollbar-thin scrollbar-thumb-indigo-500/20">
+              <div className="flex-1 p-6 overflow-y-auto custom-scrollbar">
                 {result ? (
                   <div className="animate-in slide-in-from-bottom-2 fade-in">
-                    
-                    {/* 상단 요약/피드백 토글 */}
+                    {/* 상단 요약/버튼 */}
                     <div className="flex items-center justify-between gap-5 mb-5">
                       <div className="flex items-center gap-4">
                         {/* 결과 상태 표시 */}
-                        <div className={`flex items-center gap-2.5 px-4 py-2 rounded-full border text-sm font-bold shadow-lg backdrop-blur-sm ${
-                          isPassed(result.status)
-                            ? "bg-emerald-500/10 text-emerald-400 border-emerald-500/20 shadow-emerald-500/10"
-                            : "bg-rose-500/10 text-rose-400 border-rose-500/20 shadow-rose-500/10"
-                        }`}>
-                          {isPassed(result.status) ? <CheckCircle2 size={18} /> : <XCircle size={18} />}
-                          <span>{isPassed(result.status) ? "정답입니다! 🎉" : result.status === 'PARTIAL' ? "부분 정답입니다" : "오답입니다"}</span>
-                        </div>
-                        
-                        {/* 테스트 통과 수 (피드백 모드가 아닐 때만 표시) */}
-                        {!showFeedback && (
-                          <span className="text-sm text-slate-400">
-                            테스트 통과: <span className="text-white font-mono font-bold text-base">{result.passedCount ?? 0}</span>
-                            <span className="mx-1.5 opacity-50">/</span>
-                            {result.totalCount ?? 0}
+                        <div
+                          className={`flex items-center gap-2.5 px-4 py-2 rounded-full border text-sm font-bold shadow-lg backdrop-blur-sm ${
+                            isPassed(result.status)
+                              ? "bg-emerald-500/10 text-emerald-400 border-emerald-500/20 shadow-emerald-500/10"
+                              : "bg-rose-500/10 text-rose-400 border-rose-500/20 shadow-rose-500/10"
+                          }`}
+                        >
+                          {isPassed(result.status) ? (
+                            <CheckCircle2 size={18} />
+                          ) : (
+                            <XCircle size={18} />
+                          )}
+                          <span>
+                            {isPassed(result.status)
+                              ? "정답입니다! 🎉"
+                              : result.status === "PARTIAL"
+                              ? "부분 정답입니다"
+                              : "오답입니다"}
                           </span>
-                        )}
+                        </div>
                       </div>
 
-                      {/* AI 피드백 토글 버튼 */}
-                      {(result.aiFeedback || (result.interviewQuestions && result.interviewQuestions.length > 0)) && (
-                        <button
-                          onClick={() => setShowFeedback((prev) => !prev)}
-                          className="px-3 py-1.5 text-xs rounded-lg bg-indigo-600 hover:bg-indigo-500 text-white flex items-center gap-1 transition-all"
-                        >
-                          <ChevronRight
-                            size={12}
-                            className={`transition-transform ${showFeedback ? "rotate-90" : ""}`}
-                          />
-                          {showFeedback ? "결과 요약 보기" : "AI 피드백 보기"}
-                        </button>
-                      )}
+                      {/* 🔥 오른쪽: 예상 면접 질문 토글 버튼 (결과 요약 버튼 삭제) */}
+                      {Array.isArray(result.interviewQuestions) &&
+                        result.interviewQuestions.length > 0 && (
+                          <button
+                            onClick={() =>
+                              setShowInterview((prev) => !prev)
+                            }
+                            className="px-3 py-1.5 text-xs rounded-lg bg-indigo-600 hover:bg-indigo-500 text-white flex items-center gap-1 transition-all"
+                          >
+                            <ChevronRight
+                              size={12}
+                              className={`transition-transform ${
+                                showInterview ? "rotate-90" : ""
+                              }`}
+                            />
+                            {showInterview
+                              ? "코드 리뷰 보기"
+                              : "예상 면접 질문 보기"}
+                          </button>
+                        )}
                     </div>
-                    
-                    {/* 결과 내용 */}
-                    {showFeedback && (result.aiFeedback || (result.interviewQuestions && result.interviewQuestions.length > 0)) ? (
-                      // 👉 여기서 코드 리뷰 ↔ 예상 면접 질문 토글
+
+                    {/* 🔥 내용: 피드백 / 질문만 보여줌, 결과 요약 뷰 제거 */}
+                    {hasFeedback ? (
                       <div className="p-4 rounded-xl border border-cyan-500/30 bg-cyan-500/10 shadow-inner">
                         <div className="flex items-center justify-between mb-2">
                           <h4 className="text-xs font-bold text-cyan-200 flex items-center gap-2 uppercase tracking-wider">
                             <Sparkles size={14} className="text-cyan-400" />
-                            {showInterview ? "예상 면접 질문" : "AI 코드 리뷰"}
+                            {showInterview
+                              ? "예상 면접 질문"
+                              : "AI 코드 리뷰"}
                           </h4>
-
-                          {result.interviewQuestions && result.interviewQuestions.length > 0 && (
-                            <button
-                              onClick={() => setShowInterview((prev) => !prev)}
-                              className="px-3 py-1 text-[11px] rounded-lg bg-[#0b1120]/70 hover:bg-[#020617] border border-cyan-500/40 text-cyan-100 flex items-center gap-1 transition-all"
-                            >
-                              <ChevronRight
-                                size={12}
-                                className={`transition-transform ${showInterview ? "rotate-90" : ""}`}
-                              />
-                              <span className="font-medium">
-                                {showInterview ? "코드 리뷰 보기" : "예상 면접 질문 보기"}
-                              </span>
-                            </button>
-                          )}
                         </div>
 
-                        {showInterview && result.interviewQuestions && result.interviewQuestions.length > 0 ? (
-                          // 🔥 여기서 1. 2. 3. 형식으로 질문 출력
+                        {showInterview &&
+                        Array.isArray(result.interviewQuestions) &&
+                        result.interviewQuestions.length > 0 ? (
                           <ol className="text-sm text-slate-300 font-light leading-relaxed list-decimal pl-5 space-y-2">
                             {result.interviewQuestions.map((q, idx) => (
                               <li key={idx} className="whitespace-pre-wrap">
@@ -531,31 +594,39 @@ export default function CodingTest() {
                           </ol>
                         ) : (
                           <div className="text-sm text-slate-300 whitespace-pre-wrap font-light leading-relaxed">
-                            {result.aiFeedback || "AI 코드 리뷰가 제공되지 않았습니다."}
+                            {result.aiFeedback ||
+                              "AI 코드 리뷰가 제공되지 않았습니다."}
                           </div>
                         )}
                       </div>
                     ) : (
-                      // 결과 요약 섹션
+                      // 피드백이 아예 없을 때만 간단 요약
                       <div className="grid grid-cols-3 gap-4">
                         <div className="p-4 rounded-xl bg-[#1e293b]/50 border border-white/5 shadow-inner">
-                          <p className="text-[10px] text-slate-500 uppercase tracking-wider mb-1.5">Total Score</p>
-                          <p className="text-3xl font-bold font-mono text-white tracking-tight">{result.score ?? 0}</p>
+                          <p className="text-[10px] text-slate-500 uppercase tracking-wider mb-1.5">
+                            Total Score
+                          </p>
+                          <p className="text-3xl font-bold font-mono text-white tracking-tight">
+                            {result.score ?? 0}
+                          </p>
                         </div>
                         <div className="col-span-2 p-4 rounded-xl bg-[#1e293b]/50 border border-white/5 shadow-inner">
-                          <p className="text-[10px] text-slate-500 uppercase tracking-wider mb-1.5">System Message</p>
+                          <p className="text-[10px] text-slate-500 uppercase tracking-wider mb-1.5">
+                            System Message
+                          </p>
                           <p className="text-sm text-slate-300 leading-relaxed font-light">
                             {result.message || "채점 결과 메시지가 없습니다."}
                           </p>
                         </div>
                       </div>
                     )}
-
                   </div>
                 ) : (
                   <div className="h-full flex flex-col items-center justify-center text-slate-600 gap-3 py-2">
                     <Code2 size={28} className="opacity-20" />
-                    <p className="text-xs font-medium opacity-50">코드를 제출하면 여기에 실행 결과가 표시됩니다.</p>
+                    <p className="text-xs font-medium opacity-50">
+                      코드를 제출하면 여기에 실행 결과가 표시됩니다.
+                    </p>
                   </div>
                 )}
               </div>
diff --git a/src/features/review/CodeReview.jsx b/src/features/review/CodeReview.jsx
index 6fcdcc2..d953e0d 100644
--- a/src/features/review/CodeReview.jsx
+++ b/src/features/review/CodeReview.jsx
@@ -1,3 +1,4 @@
+// src/features/review/CodeReview.jsx
 import { useState } from "react";
 import { Link } from "react-router-dom";
 import {
@@ -24,7 +25,6 @@ const particlesOptions = {
   },
 };
 
-// 리뷰 텍스트 포맷팅: "- " → "□ " + 항목 사이 한 줄 띄우기
 function formatReviewText(review) {
   if (!review) return "";
   return review
@@ -36,8 +36,7 @@ function formatReviewText(review) {
 }
 
 export default function Review() {
-  // 모드: 코드 / 레포
-  const [mode, setMode] = useState("code"); // "code" | "repo"
+  const [mode, setMode] = useState("code");
 
   const [code, setCode] = useState("");
   const [repoUrl, setRepoUrl] = useState("");
@@ -51,20 +50,36 @@ export default function Review() {
   const [error, setError] = useState(null);
   const [copied, setCopied] = useState(false);
 
+  // 🔹 Code / Repo 탭 변경 시 입력값 초기화
+  const handleModeChange = (nextMode) => {
+    if (nextMode === mode) return;
+    setMode(nextMode);
+
+    // 입력 영역 초기화
+    setCode("");
+    setRepoUrl("");
+    setUserComment("");
+    setError(null);
+    setReview("");
+    setQuestions([]);
+    setShowQuestions(false);
+  };
+
   const handleSubmit = async (e) => {
     e.preventDefault();
     setError(null);
 
-    // 아직 레포 모드는 백엔드 구현 전이라 안내만 띄우고 return
-    if (mode === "repo") {
-      if (!repoUrl.trim()) return;
-      setError(
-        "Repository URL 기반 리뷰는 아직 백엔드 구현 전입니다. 우선 코드를 직접 붙여넣어서 사용해줘. 이 UI는 나중에 레포 분석 백엔드 만들 때 그대로 연결하면 된다!"
-      );
+    // 공통: 코드 필수
+    if (!code.trim()) {
+      setError("리뷰할 코드를 입력해주세요.");
       return;
     }
 
-    if (!code.trim()) return;
+    // Repo 모드일 때는 repoUrl도 필수
+    if (mode === "repo" && !repoUrl.trim()) {
+      setError("Repository URL을 입력해주세요. (예: https://github.com/owner/repo)");
+      return;
+    }
 
     setIsLoading(true);
     setReview("");
@@ -72,10 +87,12 @@ export default function Review() {
     setShowQuestions(false);
 
     try {
-      const data = await fetchCodeReview(code, userComment);
-      console.log("[CodeReview] parsed data:", data);
+      const data = await fetchCodeReview(
+        code,
+        userComment,
+        mode === "repo" ? repoUrl : null
+      );
 
-      // review 텍스트 후보 몇 가지에서 찾아보기
       const reviewText =
         typeof data?.review === "string"
           ? data.review
@@ -85,9 +102,7 @@ export default function Review() {
           ? data
           : "";
 
-      if (!reviewText) {
-        throw new Error("AI 응답이 비어 있습니다.");
-      }
+      if (!reviewText) throw new Error("AI 응답이 비어 있습니다.");
 
       setReview(reviewText);
       setQuestions(Array.isArray(data.questions) ? data.questions : []);
@@ -103,12 +118,13 @@ export default function Review() {
       const textToCopy = showQuestions
         ? questions.map((q, i) => `${i + 1}. ${q}`).join("\n\n")
         : review || "";
+      if (!textToCopy) return;
 
       await navigator.clipboard.writeText(textToCopy);
       setCopied(true);
       setTimeout(() => setCopied(false), 1200);
     } catch {
-      // ignore
+      // noop
     }
   };
 
@@ -120,7 +136,7 @@ export default function Review() {
       />
 
       <div className="relative z-10 max-w-7xl mx-auto">
-        {/* HEADER */}
+        {/* 헤더 */}
         <header className="flex items-center justify-between mb-8">
           <Link
             to="/"
@@ -139,20 +155,18 @@ export default function Review() {
           <div className="w-16 md:w-24" />
         </header>
 
-        {/* GRID */}
         <main className="grid grid-cols-1 md:grid-cols-2 gap-8">
-          {/* LEFT: 입력 카드 */}
+          {/* LEFT CARD */}
           <section className="flex flex-col">
             <div className="gcard w-full h-[75vh]">
               <div className="ginner glass-sheen flex flex-col h-full">
-                {/* 헤더: 기존 디자인 + 작게 모드 토글만 추가 */}
                 <div className="gheader flex items-center justify-between">
                   <span>Paste Your Code</span>
 
                   <div className="inline-flex rounded-full bg-slate-900/40 p-1 text-[11px] md:text-xs">
                     <button
                       type="button"
-                      onClick={() => setMode("code")}
+                      onClick={() => handleModeChange("code")}
                       className={`px-3 py-1 rounded-full transition ${
                         mode === "code"
                           ? "bg-sky-500 text-white"
@@ -163,7 +177,7 @@ export default function Review() {
                     </button>
                     <button
                       type="button"
-                      onClick={() => setMode("repo")}
+                      onClick={() => handleModeChange("repo")}
                       className={`px-3 py-1 rounded-full transition ${
                         mode === "repo"
                           ? "bg-sky-500 text-white"
@@ -175,14 +189,14 @@ export default function Review() {
                   </div>
                 </div>
 
-                {/* 본문: 코드 / 레포 입력만 조건부로 바꿈, 카드 레이아웃은 그대로 */}
+                {/* CONTENT */}
                 <div className="flex-1 p-5 pt-4 pb-3 overflow-y-auto custom-scrollbar">
                   {mode === "code" ? (
                     <textarea
                       value={code}
                       onChange={(e) => setCode(e.target.value)}
-                      placeholder="여기에 리뷰할 코드를 붙여넣으세요..."
-                      className="w-full h-full bg-transparent text-sm md:text-[15px] leading-relaxed text-slate-100 placeholder:text-slate-500/80 resize-none focus:outline-none"
+                      placeholder="여기에 리뷰할 코드를 붙여넣으세요"
+                      className="w-full min-h-[200px] bg-transparent text-sm md:text-[15px] leading-relaxed text-slate-100 placeholder:text-slate-500/80 resize-none focus:outline-none custom-scrollbar"
                       spellCheck="false"
                     />
                   ) : (
@@ -191,20 +205,22 @@ export default function Review() {
                         type="text"
                         value={repoUrl}
                         onChange={(e) => setRepoUrl(e.target.value)}
-                        placeholder="예: https://github.com/username/project"
+                        placeholder="예: https://github.com/owner/repo"
                         className="w-full rounded-xl bg-slate-900/40 border border-slate-700/60 px-3 py-2 text-sm text-slate-100 placeholder:text-slate-500/80 focus:outline-none focus:border-sky-400/80"
                       />
-                      <p className="text-[11px] md:text-xs text-slate-400">
-                        Repo 모드는 UI만 먼저 만들어둔 상태야. 나중에 백엔드에서
-                        레포 코드를 읽어오는 기능을 만들면 이 입력값을 그대로
-                        연결해서, 전체 프로젝트 기준 코드 리뷰 + 예상 면접 질문
-                        생성으로 확장할 수 있어.
-                      </p>
+
+                      <textarea
+                        value={code}
+                        onChange={(e) => setCode(e.target.value)}
+                        placeholder="레포지터리 안에서 리뷰받고 싶은 주요 파일 코드를 붙여넣어 주세요"
+                        className="w-full min-h-[140px] bg-transparent text-sm md:text-[15px] leading-relaxed text-slate-100 placeholder:text-slate-500/80 resize-none focus:outline-none custom-scrollbar"
+                        spellCheck="false"
+                      />
                     </div>
                   )}
                 </div>
 
-                {/* 요구사항 + 버튼 (기존 디자인 유지) */}
+                {/* REQUIREMENTS + 버튼 */}
                 <form
                   onSubmit={handleSubmit}
                   className="border-t border-white/5 px-5 pt-3 pb-4 space-y-3"
@@ -219,7 +235,7 @@ export default function Review() {
                       placeholder={
                         mode === "code"
                           ? "예: 보안 위주로 리뷰해줘 / 성능 개선 포인트 중심으로 해줘"
-                          : "예: 백엔드 구조 위주로 리뷰해줘 / 테스트 코드 품질 위주로 봐줘 (레포 모드 구현되면 사용 예정)"
+                          : "예: 백엔드 구조 위주로 리뷰해줘 / 테스트 코드 품질 위주로"
                       }
                       className="w-full h-[96px] rounded-xl bg-slate-900/40 border border-slate-700/60 px-3 py-2 text-xs md:text-sm text-slate-100 placeholder:text-slate-500/80 resize-none focus:outline-none custom-scrollbar"
                     />
@@ -230,7 +246,9 @@ export default function Review() {
                       type="submit"
                       disabled={
                         isLoading ||
-                        (mode === "code" ? !code.trim() : !repoUrl.trim())
+                        (mode === "code"
+                          ? !code.trim()
+                          : !repoUrl.trim() || !code.trim())
                       }
                       className="inline-flex items-center gap-2 rounded-2xl bg-gradient-to-r from-sky-500 to-indigo-500 px-5 py-2.5 text-sm font-medium shadow-lg disabled:opacity-60 disabled:cursor-not-allowed transition-all"
                     >
@@ -252,7 +270,7 @@ export default function Review() {
             </div>
           </section>
 
-          {/* RIGHT: 리뷰 / 질문 카드 (이전 버전 그대로 유지) */}
+          {/* RIGHT CARD */}
           <section className="flex flex-col">
             <div className="gcard w-full h-[75vh]">
               <div className="ginner glass-sheen flex flex-col h-full">
@@ -265,7 +283,7 @@ export default function Review() {
                     {review && questions.length > 0 && (
                       <button
                         type="button"
-                        onClick={() => setShowQuestions((prev) => !prev)}
+                        onClick={() => setShowQuestions((p) => !p)}
                         className="flex items-center gap-1 px-3 py-1.5 text-xs md:text-sm rounded-xl bg-indigo-600 hover:bg-indigo-500 transition"
                       >
                         <IconSparkles size={16} />
@@ -286,7 +304,7 @@ export default function Review() {
                 </div>
 
                 <div className="flex-1 p-6 overflow-y-auto custom-scrollbar">
-                  {/* 로딩 */}
+                  {/* LOADING */}
                   {isLoading && !review && (
                     <div className="flex flex-col items-center justify-center h-full text-gray-400">
                       <IconLoader2 size={40} className="animate-spin mb-4" />
@@ -296,7 +314,7 @@ export default function Review() {
                     </div>
                   )}
 
-                  {/* 에러 */}
+                  {/* ERROR */}
                   {error && (
                     <div className="p-4 bg-red-900/40 border border-red-700/50 rounded-lg text-red-200">
                       <div className="flex items-center gap-2 font-semibold mb-1">
@@ -307,25 +325,25 @@ export default function Review() {
                     </div>
                   )}
 
-                  {/* 초기 상태 */}
+                  {/* EMPTY */}
                   {!isLoading && !error && !review && (
                     <div className="h-full flex items-center justify-center text-slate-400/90 text-center">
                       코드를 제출하면 AI 리뷰와 예상 면접 질문이 표시됩니다.
                     </div>
                   )}
 
-                  {/* 리뷰 화면 */}
+                  {/* REVIEW */}
                   {!showQuestions && review && (
                     <pre className="whitespace-pre-wrap text-sm md:text-[15px] leading-relaxed text-slate-100">
                       {formatReviewText(review)}
                     </pre>
                   )}
 
-                  {/* 질문 화면 */}
+                  {/* QUESTIONS */}
                   {showQuestions && questions.length > 0 && (
                     <ol className="list-decimal list-inside space-y-3 text-sm md:text-[15px] leading-relaxed text-slate-100">
-                      {questions.map((q, idx) => (
-                        <li key={idx} className="whitespace-pre-wrap">
+                      {questions.map((q, i) => (
+                        <li key={i} className="whitespace-pre-wrap">
                           {q.trim()}
                         </li>
                       ))}
diff --git a/src/index.css b/src/index.css
index 17c3174..c99a435 100644
--- a/src/index.css
+++ b/src/index.css
@@ -13,10 +13,22 @@
 }
 
 /* ===== Scrollbar ===== */
-.custom-scrollbar::-webkit-scrollbar{ width:8px }
-.custom-scrollbar::-webkit-scrollbar-track{ background:#142033; border-radius:4px }
-.custom-scrollbar::-webkit-scrollbar-thumb{ background:#32486d; border-radius:4px }
-.custom-scrollbar::-webkit-scrollbar-thumb:hover{ background:#48659a }
+.custom-scrollbar::-webkit-scrollbar {
+  width: 6px;
+}
+
+.custom-scrollbar::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.custom-scrollbar::-webkit-scrollbar-thumb {
+  background: linear-gradient(180deg, #4aa8ff66, #7c5dff66);
+  border-radius: 10px;
+}
+
+.custom-scrollbar::-webkit-scrollbar-thumb:hover {
+  background: linear-gradient(180deg, #5cb4ff88, #8e6aff88);
+}
 
 /* ===== Keyframes / Theme ===== */
 @theme {