diff --git a/.jules/palette.md b/.jules/palette.md
index 0bbf5248..b7d77ffd 100644
--- a/.jules/palette.md
+++ b/.jules/palette.md
@@ -115,3 +115,6 @@
 ## $(date +%Y-%m-%d) - Prevent accidental data loss in inline editors
 **Learning:** Forms that take a long time to fill out (like a WBS editor) are prone to accidental closure by users pressing `Escape` or clicking cancel. This causes immediate data loss without any warning, resulting in frustration.
 **Action:** When working on editors that can be dismissed, track whether the user has modified any fields compared to their initial state. If there are changes, intercept the close action and present a confirmation dialog (`window.confirm`) to ensure they really want to discard their edits. Bypass this for intentional saves or explicit data overrides.
+## 2026-08-12 - 비상호작용 요소의 툴팁 접근성 개선
+**Learning:** div나 span 같은 비상호작용 요소에 title 속성을 추가하여 툴팁을 제공할 때, 키보드 사용자는 접근할 수 없는 문제가 발생할 수 있음을 확인했습니다.
+**Action:** 비상호작용 요소에 툴팁을 제공할 때는 항상 tabindex="0"을 추가하고, 적절한 ARIA role(예: role="note")을 부여하며, :focus-visible 스타일을 정의하여 스크린 리더와 키보드 사용자 모두 접근할 수 있도록 해야 합니다.
diff --git a/index.html b/index.html
index a7f4b49c..c5627a8b 100644
--- a/index.html
+++ b/index.html
@@ -28,18 +28,18 @@ <h1>ScopeWeave Planner</h1>
             <span>기준일</span>
             <input data-testid="base-date-input" id="base-date" type="date" />
           </label>
-          <div class="meta-value-card" title="프로젝트의 작업 기간(일수) 합계입니다.">
+          <div class="meta-value-card" title="프로젝트의 작업 기간(일수) 합계입니다." tabindex="0" role="note">
             <span class="meta-label">전체일수</span>
             <strong data-testid="summary-total-days" id="summary-total-days">0일</strong>
           </div>
         </div>
 
         <div class="meta-grid meta-grid-secondary">
-          <div class="meta-value-card accent-card plan-card" title="기간(일수) 가중치가 반영된 프로젝트 전체 계획 진척률입니다.">
+          <div class="meta-value-card accent-card plan-card" title="기간(일수) 가중치가 반영된 프로젝트 전체 계획 진척률입니다." tabindex="0" role="note">
             <span class="meta-label">계획진척률(누적)</span>
             <strong data-testid="summary-planned-progress" id="summary-planned-progress">0.00%</strong>
           </div>
-          <div class="meta-value-card accent-card actual-card" title="기간(일수) 가중치가 반영된 프로젝트 전체 실적 진척률입니다.">
+          <div class="meta-value-card accent-card actual-card" title="기간(일수) 가중치가 반영된 프로젝트 전체 실적 진척률입니다." tabindex="0" role="note">
             <span class="meta-label">실적진척률(누적)</span>
             <strong data-testid="summary-actual-progress" id="summary-actual-progress">0.00%</strong>
           </div>
diff --git a/styles.css b/styles.css
index 9d715f00..6d5300ca 100644
--- a/styles.css
+++ b/styles.css
@@ -360,7 +360,8 @@ button {
 .secondary-button:focus-visible,
 input:focus-visible,
 select:focus-visible,
-.gantt-bar:focus-visible {
+.gantt-bar:focus-visible,
+.meta-value-card:focus-visible {
   outline: 3px solid rgba(37, 99, 235, 0.5);
   outline-offset: 2px;
 }