/* ════════════════════════════════════════════════════════════════
   모델별 시세 페이지 — /phone/{이름} (2026-10-26, scripts/build-phone.js · modelpage.js)
   틀(sp-main·sp-crumb·sp-k·sp-h1·sp-sub·sd-box·scm-list)은 store.css 를 같이 쓰고, 여기는 표·요약만. 접두어 mp-
   ════════════════════════════════════════════════════════════════ */
.mp-asof{display:inline-block;margin:12px 0 0;padding:5px 11px;border-radius:999px;background:var(--bg-2);font-size:13px;font-weight:700;color:var(--text-2)}
.mp-top{display:grid;grid-template-columns:96px minmax(0,1fr);gap:14px;align-items:center;margin-top:20px;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:var(--r-card-l)}
.mp-ph{margin:0;aspect-ratio:1/1;border-radius:var(--r-card);background:var(--bg-2);overflow:hidden}
.mp-ph img{display:block;width:100%;height:100%;object-fit:contain}
.mp-sum p{margin:0;font-size:14px;line-height:1.55;color:var(--text-2);word-break:keep-all}
.mp-sum b{display:block;margin-bottom:2px;font-size:22px;font-weight:800;letter-spacing:-.03em;color:var(--text)}
.mp-sum b em{font-style:normal;color:var(--red)}
.mp-v{margin-top:16px;padding:18px 16px 16px;background:#fff;border:1px solid var(--line);border-radius:var(--r-card-l)}
.mp-vh{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mp-vh h2{margin:0;font-size:18px;font-weight:800;letter-spacing:-.02em;color:var(--text)}
.mp-vh h2 span{color:var(--red)}
.mp-msrp{font-size:13px;font-weight:600;color:var(--text-3);white-space:nowrap}
.mp-tw{margin-top:12px;overflow-x:auto}
.mp-t{width:100%;border-collapse:collapse;font-size:15px}
.mp-cap{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}   /* 표 설명 — 화면 읽기 프로그램용(보이는 제목과 같은 내용) */
.mp-t th,.mp-t td{padding:11px 8px;border-bottom:1px solid var(--line);text-align:center;font-variant-numeric:tabular-nums}
.mp-t thead th{padding-top:4px;font-size:12.5px;font-weight:700;color:var(--text-3)}
.mp-t thead th:first-child,.mp-t tbody th{text-align:left}
.mp-t tbody th{font-size:14.5px;font-weight:800;color:var(--text);white-space:nowrap}
.mp-t tbody th small{display:block;margin-top:1px;font-size:11.5px;font-weight:500;color:var(--text-3)}
.mp-t td{font-weight:600;color:var(--text)}
.mp-t td.mp-lo{font-weight:800;color:var(--red)}
.mp-t td.mp-na{font-weight:500;color:var(--text-3)}
.mp-t tbody tr:last-child>*{border-bottom:0}
.mp-go{display:flex;width:100%;min-height:48px;margin-top:14px}
.mp-notes{margin-top:16px}
.mp-cta{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin-top:20px}
.mp-cta .sj-btn{min-height:50px;gap:6px}
.mp-cta .sj-btn svg{width:18px;height:18px}
.mp-all{align-self:center;font-size:14px;font-weight:700;color:var(--text-2);text-decoration:none}
.mp-all:hover{color:var(--red)}
@media(min-width:768px){
  .mp-top{grid-template-columns:120px minmax(0,1fr);padding:16px 20px}
  .mp-body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .mp-body .mp-v{margin-top:16px}
  .mp-cta{flex-direction:row;align-items:center}
  .mp-cta .sj-btn{padding:0 26px}
  .mp-all{align-self:auto}
}
