/* 단가·마진 계산기 — 카드 폭(약 440px) 기준, 폰(360px)에서도 가로 밀림 없이 */
[data-app="margin-calculator"]{ container-type:inline-size; }
[data-app="margin-calculator"] .mc{ display:flex; flex-direction:column; gap:10px; }
[data-app="margin-calculator"] .ndt-in{ max-width:100%; }
[data-app="margin-calculator"] .mc-note{ display:flex; align-items:flex-start; gap:8px; margin:0; padding:8px 10px; border-radius:10px; background:#FFF7E0; color:#5C4300; font-size:13px; line-height:1.5; }
[data-app="margin-calculator"] .mc-note[hidden]{ display:none; }
[data-app="margin-calculator"] .mc-note b{ flex:none; padding:0 7px; border-radius:6px; background:#F5C84C; color:#3A2A00; font-size:12px; line-height:20px; }
/* 방향 고르기 */
[data-app="margin-calculator"] .mc-tabs{ display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:4px; border-radius:12px; background:#EEF0F3; }
[data-app="margin-calculator"] .mc-tab{ min-height:44px; padding:4px 8px; border:0; border-radius:9px; background:transparent; color:#4B5059; font:inherit; font-size:13px; font-weight:600; line-height:1.3; cursor:pointer; }
[data-app="margin-calculator"] .mc-tab b{ font-weight:800; }
[data-app="margin-calculator"] .mc-tab[aria-pressed="true"]{ background:#fff; color:#1A1A1A; box-shadow:0 1px 3px rgba(16,24,40,.12); }
[data-app="margin-calculator"] .mc-tab:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
/* 입력 칸 */
[data-app="margin-calculator"] .mc-f{ display:flex; flex-direction:column; gap:3px; min-width:0; }
[data-app="margin-calculator"] .mc-f[hidden]{ display:none; }
[data-app="margin-calculator"] .mc-f small{ font-weight:600; color:#8A8F98; }
[data-app="margin-calculator"] .mc-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
[data-app="margin-calculator"] .mc-num{ text-align:right; font-variant-numeric:tabular-nums; }
[data-app="margin-calculator"] .mc-num::placeholder{ text-align:right; font-size:13px; }
[data-app="margin-calculator"] .ndt-in.mc-bad{ border-color:#D92D20; background:#FEF3F2; }
[data-app="margin-calculator"] .mc-err{ margin:0; font-size:13px; font-weight:700; color:#B42318; }
[data-app="margin-calculator"] .mc-err:empty{ display:none; }
/* 결과 */
[data-app="margin-calculator"] .mc-out{ display:flex; flex-direction:column; gap:8px; padding:12px; border-radius:12px; background:#F3F5F8; }
[data-app="margin-calculator"] .mc-price{ display:flex; flex-direction:column; gap:2px; padding:10px 12px; border-radius:10px; background:#fff; border:1.5px solid #1A1A1A; }
[data-app="margin-calculator"] .mc-price[hidden]{ display:none; }
[data-app="margin-calculator"] .mc-plb{ font-size:12.5px; font-weight:800; color:#4B5059; }
[data-app="margin-calculator"] .mc-pv{ font-size:26px; font-weight:900; letter-spacing:-.01em; color:#1A1A1A; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
[data-app="margin-calculator"] .mc-praw{ font-size:12.5px; color:#6B717B; }
[data-app="margin-calculator"] .mc-cards{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
[data-app="margin-calculator"] .mc-card{ display:flex; flex-direction:column; justify-content:space-between; gap:4px; min-width:0; padding:8px 9px; border-radius:10px; background:#fff; }
[data-app="margin-calculator"] .mc-card > span{ font-size:12px; font-weight:800; color:#4B5059; line-height:1.3; }
[data-app="margin-calculator"] .mc-card small{ display:block; font-size:11px; font-weight:600; color:#8A8F98; }
[data-app="margin-calculator"] .mc-card b{ font-size:18px; font-weight:900; color:#1A1A1A; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; line-height:1.2; }
[data-app="margin-calculator"] .mc-k-margin{ box-shadow:inset 0 0 0 1.5px #314B86; }
[data-app="margin-calculator"] .mc-k-margin b{ color:#314B86; }
[data-app="margin-calculator"] .mc-card.mc-loss{ background:#FEF3F2; box-shadow:none; }
[data-app="margin-calculator"] .mc-card.mc-loss b{ color:#B42318; }
[data-app="margin-calculator"] .mc-explain{ margin:0; font-size:12.5px; line-height:1.55; color:#4B5059; }
[data-app="margin-calculator"] .mc-explain:empty{ display:none; }
[data-app="margin-calculator"] .mc-bd summary{ cursor:pointer; min-height:32px; display:flex; align-items:center; font-size:13px; font-weight:800; color:#314B86; }
[data-app="margin-calculator"] .mc-dl{ margin:4px 0 0; display:flex; flex-direction:column; gap:2px; }
[data-app="margin-calculator"] .mc-dr{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:2px 10px; font-size:13px; color:#4B5059; font-variant-numeric:tabular-nums; }
[data-app="margin-calculator"] .mc-dr dt{ min-width:0; }
[data-app="margin-calculator"] .mc-dr dd{ margin:0 0 0 auto; font-weight:700; color:#1A1A1A; }
[data-app="margin-calculator"] .mc-dt{ margin-top:2px; padding-top:4px; border-top:1px solid #DCE0E6; font-weight:800; }
[data-app="margin-calculator"] .mc-btns .ndt-btn, [data-app="margin-calculator"] .mc-btns2 .ndt-btn{ white-space:normal; text-align:center; }
[data-app="margin-calculator"] .mc-msg{ margin:0; font-size:13px; font-weight:700; color:#13703F; }
[data-app="margin-calculator"] .mc-msg:empty{ display:none; }
/* 저장한 품목 */
[data-app="margin-calculator"] .mc-lsec{ display:flex; flex-direction:column; gap:6px; padding-top:10px; border-top:1px solid #E9EBEF; }
[data-app="margin-calculator"] .mc-lhead{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:4px 8px; }
[data-app="margin-calculator"] .mc-lt{ margin:0; font-size:14.5px; font-weight:800; color:#1A1A1A; }
[data-app="margin-calculator"] .mc-lc{ font-size:12.5px; font-weight:700; color:#8A8F98; }
[data-app="margin-calculator"] .mc-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
[data-app="margin-calculator"] .mc-item{ display:grid; grid-template-columns:18px minmax(0,1fr) auto 32px; gap:6px; align-items:center; padding:8px; border:1px solid #E6E7EB; border-radius:10px; background:#fff; }
[data-app="margin-calculator"] .mc-item.mc-loss{ border-color:#F0B5AF; background:#FFFBFA; }
[data-app="margin-calculator"] .mc-rank{ font-size:12px; font-weight:800; color:#8A8F98; text-align:center; font-variant-numeric:tabular-nums; }
[data-app="margin-calculator"] .mc-open{ display:flex; flex-direction:column; align-items:flex-start; gap:1px; min-width:0; min-height:40px; padding:2px 0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
[data-app="margin-calculator"] .mc-open:hover .mc-in{ text-decoration:underline; }
[data-app="margin-calculator"] .mc-in{ max-width:100%; font-size:14px; font-weight:800; color:#1A1A1A; line-height:1.35; overflow-wrap:anywhere; }
[data-app="margin-calculator"] .mc-is{ max-width:100%; font-size:11.5px; color:#6B717B; line-height:1.4; overflow-wrap:anywhere; }
[data-app="margin-calculator"] .mc-iv{ display:flex; flex-direction:column; align-items:flex-end; gap:1px; font-variant-numeric:tabular-nums; }
[data-app="margin-calculator"] .mc-im{ font-size:16px; font-weight:900; color:#314B86; }
[data-app="margin-calculator"] .mc-ip{ font-size:11.5px; color:#4B5059; white-space:nowrap; }
[data-app="margin-calculator"] .mc-loss .mc-im, [data-app="margin-calculator"] .mc-loss .mc-ip{ color:#B42318; }
[data-app="margin-calculator"] .mc-del{ width:32px; padding:0; color:#6B717B; }
[data-app="margin-calculator"] .mc-del.ndt-arm{ position:relative; z-index:1; justify-self:end; }
[data-app="margin-calculator"] .mc-empty{ margin:0; }
[data-app="margin-calculator"] .mc-empty[hidden]{ display:none; }
[data-app="margin-calculator"] .mc-foot{ margin:0; }
[data-app="margin-calculator"] .mc-foot.mc-warn{ padding:8px 10px; border-radius:10px; background:#FEF3F2; color:#912018; font-size:13px; font-weight:700; }
@container (max-width:380px){
  [data-app="margin-calculator"] .mc-card{ padding:7px 7px; }
  [data-app="margin-calculator"] .mc-card b{ font-size:16px; }
  [data-app="margin-calculator"] .mc-card > span{ font-size:11.5px; }
}