fix(portfolio): 기술 스택 로고를 정적 4줄 레이아웃으로 변경

LogoLoop 무한 캐러셀이 항목 수가 적은 카테고리에서 반복돼 시각적으로 산만한
문제. 카테고리별로 단순 flex-wrap 줄로 정적 표시. SkillLogoNode와 fallback
로직은 유지. LogoLoop 컴포넌트 자체는 다른 페이지에서 재사용 여지를 위해 보존.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/pages/portfolio/Portfolio.css

@@ -384,8 +384,11 @@
     background: var(--surface-card);
     border: 1px solid var(--line);
     border-radius: var(--radius-lg);
-    padding: 14px 0;
+    padding: 16px 20px;
-    overflow: hidden;
+    display: flex;
+    flex-wrap: wrap;
+    align-items: center;
+    gap: 24px 28px;
 }
 
 .pf-skill-logo {

src/pages/portfolio/ProfileTab.jsx

@@ -1,5 +1,4 @@
 import { useState } from 'react';
-import LogoLoop from '../../components/LogoLoop';
 
 const CAREER_CATEGORIES = { company: '회사', education: '교육', etc: '기타' };
 const SKILL_CATEGORIES = { language: '언어', framework: '프레임워크', infra: '인프라', tool: '도구' };
@@ -46,14 +45,6 @@ function SkillLogoNode({ name, slug }) {
     );
 }
 
-function buildSkillLogos(items) {
-    return items.map((s) => ({
-        node: <SkillLogoNode name={s.name} slug={SKILL_LOGO_SLUGS[s.name]} />,
-        ariaLabel: s.name,
-        title: s.name,
-    }));
-}
-
 export default function ProfileTab({ data, editing, api, onRefresh }) {
     const { profile, careers, skills } = data;
     const [editingProfile, setEditingProfile] = useState(null);
@@ -241,18 +232,14 @@ export default function ProfileTab({ data, editing, api, onRefresh }) {
                                     ))}
                                 </div>
                             ) : (
-                                <div className="pf-skill-loop">
+                                <div className="pf-skill-loop" aria-label={`${SKILL_CATEGORIES[cat]} 기술 스택`}>
-                                    <LogoLoop
+                                    {items.map((s) => (
-                                        logos={buildSkillLogos(items)}
+                                        <SkillLogoNode
-                                        speed={40}
+                                            key={s.id}
-                                        logoHeight={36}
+                                            name={s.name}
-                                        gap={48}
+                                            slug={SKILL_LOGO_SLUGS[s.name]}
-                                        pauseOnHover
-                                        fadeOut
-                                        fadeOutColor="var(--bg-primary, #0b0b0b)"
-                                        scaleOnHover
-                                        ariaLabel={`${SKILL_CATEGORIES[cat]} 기술 스택`}
                                         />
+                                    ))}
                                 </div>
                             )}
                         </div>