feat(ui): 검색 UX 개선(aria, clear 버튼, enterKeyHint)

docs(todo): 헤더 네비 6번 완료 표시

.cursor/.prompt/header_navigation작업.md

@@ -21,8 +21,8 @@
 - [ ] 보드 타입/승인필요 등 뱃지 표기 여부 결정 및 적용
 
 6) 검색창 구현
-- [ ] 헤더 검색 입력 UI 추가(placeholder, 키보드 액션)
-- [ ] 검색 엔드포인트/페이지 연동(`src/app/search/page.tsx`)
+- [x] 헤더 검색 입력 UI 추가(placeholder, 키보드 액션)
+- [x] 검색 엔드포인트/페이지 연동(`src/app/search/page.tsx`)
 
 7) 스타일/반응형/테마
 - [ ] 모바일 메뉴 토글(햄버거) 및 접근성 속성(aria-* ) 적용

src/app/components/SearchBar.tsx

@@ -12,14 +12,26 @@ export function SearchBar() {
         const q = term.trim();
         router.push(q ? `/search?q=${encodeURIComponent(q)}` : "/search");
       }}
+      role="search"
+      aria-label="사이트 검색"
       style={{ display: "flex", gap: 8, alignItems: "center" }}
     >
       <input
+        type="search"
+        name="q"
         value={term}
         onChange={(e) => setTerm(e.target.value)}
         placeholder="검색어 입력"
-        style={{ padding: "6px 8px", border: "1px solid #ddd", borderRadius: 6 }}
+        enterKeyHint="search"
+        aria-label="검색어"
+        onKeyDown={(e) => {
+          if (e.key === "Escape") setTerm("");
+        }}
+        style={{ padding: "6px 8px", border: "1px solid #ddd", borderRadius: 6, minWidth: 160 }}
       />
+      {term && (
+        <button type="button" aria-label="검색어 지우기" onClick={() => setTerm("")}>×</button>
+      )}
       <button type="submit">검색</button>
     </form>
   );