fix(cupang): 계산표 가로 스크롤 제거·좌우 카드 상단선 정렬

요약 카드에 남아 있던 margin-top:16px 이 2열 그리드에서 오른쪽 카드를
아래로 밀고 있었다 → 0 으로.

가로 스크롤: fixed 레이아웃에서도 셀 내용이 밖으로 삐져나오면 래퍼가
스크롤되므로 th/td 에 overflow:hidden + text-overflow:ellipsis 를 주고
래퍼는 overflow-x:hidden 으로 고정. 열 폭도 축소(수량 68 / 박스 96 /
숫자 46 / 삭제 34). 드롭다운 라벨은 "미라네 1호 세트 (2호·8)" 처럼
"쿠팡 " 접두어를 떼어 짧게 표기.

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

app/modules/cupang/templates/cupang/box_calc.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">
@@ -100,8 +100,10 @@
 
     var optionsHtml = '<option value="">— 제품명 선택 —</option>';
     rules.forEach(function (r) {
+      // 드롭다운 폭을 줄이려고 "쿠팡 " 접두어를 떼고 짧게 표기한다. 예: 미라네 1호 세트 (2호·8)
+      var shortBox = (r.box_name || "-").replace(/^쿠팡\s*/, "");
       var label = (r.product_name_snapshot || r.product_code) +
-                  " (" + (r.box_name || "-") + " / " + r.units_per_box + "개)";
+                  " (" + shortBox + "·" + r.units_per_box + ")";
       optionsHtml += '<option value="' + esc(r.product_code) + '">' + esc(label) + "</option>";
     });
 

app/modules/cupang/templates/cupang/box_rules.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">

app/modules/cupang/templates/cupang/centers.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">

app/modules/cupang/templates/cupang/detail.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">

app/modules/cupang/templates/cupang/form.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">

app/modules/cupang/templates/cupang/index.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">

app/modules/cupang/templates/cupang/products.html

@@ -1,6 +1,6 @@
 {% extends "erp_base.html" %}
 
-{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828v" />{% endblock %}
+{% block head_extra %}<link rel="stylesheet" href="/static/cupang.css?v=20260828w" />{% endblock %}
 
 {% block content %}
 <section class="cpg">

app/static/cupang.css

@@ -337,13 +337,17 @@
 .cpg-calc-table .cpg-calc-box { white-space: nowrap; font-size: 13px; }
 .cpg-calc-table .cpg-calc-act { text-align: center; }
 .cpg-calc-table .cpg-calc-del { padding: 2px 8px; line-height: 1.4; }
-.cpg-calc-table col.cpg-col-qty { width: 76px; }
+.cpg-calc-table col.cpg-col-qty { width: 68px; }
-.cpg-calc-table col.cpg-col-box { width: 108px; }
+.cpg-calc-table col.cpg-col-box { width: 96px; }
-.cpg-calc-table col.cpg-col-n   { width: 54px; }
+.cpg-calc-table col.cpg-col-n   { width: 46px; }
-.cpg-calc-table col.cpg-col-act { width: 40px; }
+.cpg-calc-table col.cpg-col-act { width: 34px; }
+/* fixed 레이아웃에서 내용이 셀 밖으로 삐져나와 가로 스크롤이 생기는 것을 막는다. */
+.cpg-calc-table th, .cpg-calc-table td { overflow: hidden; text-overflow: ellipsis; }
+.cpg-calc-table thead th { white-space: nowrap; }
 .cpg-calc-row.cpg-calc-warn { background: color-mix(in srgb, var(--color-callout-red) 8%, transparent); }
 .cpg-calc-actions { margin-top: 12px; gap: 8px; align-items: center; }
-.cpg-calc-sum { margin-top: 16px; }
+/* 상단선 정렬: 2열 그리드에서는 위 여백을 주지 않는다. */
+.cpg-calc-sum { margin-top: 0; }
 
 /* ── 박스 계산 요약 ─────────────────────────────── */
 .cpg-sum-h3 {
@@ -513,7 +517,8 @@
 
 /* 행이 많아도 카드가 잘리지 않도록 표 자체를 스크롤시킨다. */
 .cpg-calc-card .erp-table-wrap {
-  overflow: auto;
+  overflow-x: hidden;
+  overflow-y: auto;
   max-height: min(58vh, 560px);
 }
 .cpg-calc-card .cpg-calc-table thead th {