refactor: 프로젝트 카드 레이아웃 및 메타 정보 표시 개선

## 변경사항
- 프로젝트 카드 메타 정보를 key-value 형식으로 재구성
- 빈 값은 '-'로 표시하여 일관성 향상
- 버튼 텍스트 추가 (✏️ 수정, 🗑️ 삭제)
- 메인 콘텐츠 영역 최대폭 1600px 제한 및 중앙 정렬
- 그리드 정렬 개선

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

web-ui/css/project-management.css

@@ -150,6 +150,9 @@ body {
   flex: 1;
   padding: 2rem;
   min-height: calc(100vh - 80px);
+  max-width: 1600px;
+  margin: 0 auto;
+  width: 100%;
 }
 
 .page-header {
@@ -426,6 +429,7 @@ body {
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
   gap: 1.5rem;
+  justify-content: center;
 }
 
 /* 작업자 카드 전용 스타일 */

web-ui/js/project-management.js

@@ -218,21 +218,35 @@ function renderProjects() {
               ${isInactive ? '<span class="inactive-label">(비활성)</span>' : ''}
             </h3>
             <div class="project-meta">
-              <span style="color: ${status.color}; font-weight: 500;">${status.icon} ${status.text}</span>
+              <div class="meta-row">
-              ${project.contract_date ? `<span>📅 계약일: ${formatDate(project.contract_date)}</span>` : ''}
+                <span class="meta-label">상태</span>
-              ${project.due_date ? `<span>⏰ 납기일: ${formatDate(project.due_date)}</span>` : ''}
+                <span class="meta-value" style="color: ${status.color}; font-weight: 600;">${status.icon} ${status.text}</span>
-              ${project.completed_date ? `<span>🎯 완료일: ${formatDate(project.completed_date)}</span>` : ''}
+              </div>
-              ${project.pm ? `<span>👤 PM: ${project.pm}</span>` : ''}
+              <div class="meta-row">
-              ${project.site ? `<span>📍 현장: ${project.site}</span>` : ''}
+                <span class="meta-label">계약일</span>
-              ${isInactive ? '<span class="inactive-notice">⚠️ 작업보고서에서 숨김</span>' : ''}
+                <span class="meta-value">${project.contract_date ? formatDate(project.contract_date) : '-'}</span>
+              </div>
+              <div class="meta-row">
+                <span class="meta-label">납기일</span>
+                <span class="meta-value">${project.due_date ? formatDate(project.due_date) : '-'}</span>
+              </div>
+              <div class="meta-row">
+                <span class="meta-label">PM</span>
+                <span class="meta-value">${project.pm || '-'}</span>
+              </div>
+              <div class="meta-row">
+                <span class="meta-label">현장</span>
+                <span class="meta-value">${project.site || '-'}</span>
+              </div>
+              ${isInactive ? '<div class="inactive-notice">⚠️ 작업보고서에서 숨김</div>' : ''}
             </div>
           </div>
           <div class="project-actions">
             <button class="btn-edit" onclick="event.stopPropagation(); editProject(${project.project_id})" title="수정">
-              ✏️
+              ✏️ 수정
             </button>
             <button class="btn-delete" onclick="event.stopPropagation(); confirmDeleteProject(${project.project_id})" title="삭제">
-              🗑️
+              🗑️ 삭제
             </button>
           </div>
         </div>