ui(expense): 상단 요약카드 70px + 경비등록(좌)/경비내역(우) 2단 배치

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

app/modules/expense/templates/expense/index.html

@@ -39,6 +39,9 @@
     {% endfor %}
   </div>
 
+  <!-- ── 등록(좌) / 내역(우) 2단 ── -->
+  <div class="ex-two-col">
+
   <!-- ── 입력 폼 ── -->
   <div class="erp-card-block">
     <div class="erp-card-block-head">
@@ -161,6 +164,8 @@
     </div>
   </div>
 
+  </div><!-- /ex-two-col -->
+
 </section>
 
 <style>
@@ -170,6 +175,28 @@
   #ex-tbody td { vertical-align: middle; }
   #ex-tbody .js-actions { white-space: nowrap; }
   #ex-tbody .js-actions > * { margin-left: 4px; vertical-align: middle; }
+
+  /* 상단 요약 카드: 세로 70px 고정 */
+  .erp-expense .erp-summary-card {
+    height: 70px; min-height: 70px; padding: 10px 14px;
+    justify-content: center; gap: 2px;
+  }
+  .erp-expense .erp-summary-value { font-size: 20px; line-height: 1.1; }
+  .erp-expense .erp-summary-value--sm { font-size: 18px; }
+
+  /* 경비 등록(좌) / 경비 내역(우) 2단 */
+  .ex-two-col {
+    display: grid; grid-template-columns: 520px minmax(0, 1fr);
+    gap: var(--sp-16); align-items: start;
+  }
+  .ex-two-col > .erp-card-block { margin: 0; }
+  /* 좌측 폼은 2열로 (가맹점/메모는 전체폭) */
+  .ex-two-col .erp-form-grid { grid-template-columns: 1fr 1fr; }
+  .ex-two-col .erp-form-grid .erp-field-wide,
+  .ex-two-col .erp-form-grid .erp-form-actions { grid-column: 1 / -1; }
+  @media (max-width: 1100px) {
+    .ex-two-col { grid-template-columns: 1fr; }
+  }
 </style>
 {% endblock %}