.buy-page h1{font-size:clamp(2rem,4vw,3rem);margin-bottom:8px}
.buy-page > p{max-width:46rem}
.buy-steps{display:flex;gap:8px;margin:8px 0 28px;padding:0;list-style:none}
.buy-steps a{display:inline-flex;align-items:center;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:.85rem;font-weight:600}
.buy-steps .is-current a{background:var(--ink);border-color:var(--ink);color:white}
.buy-layout{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.72fr);gap:28px;align-items:start}
.buy-summary{position:sticky;top:96px;background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:22px}
.buy-summary h2{margin-top:0}
.buy-summary .row{padding:8px 0}
.buy-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.buy-grid .wide{grid-column:1 / -1}
.buy-grid[hidden]{display:none !important}
.buy-grid input.is-locked{background:#f3f1ec;color:var(--muted)}
.bag-line{display:grid;grid-template-columns:88px minmax(0,1fr) auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.bag-photo{display:grid;place-items:center;width:88px;height:110px;overflow:hidden;border-radius:14px;background:#efede8;color:var(--muted);font-size:.68rem;letter-spacing:.04em;text-transform:uppercase;text-align:center}
.bag-photo img{width:100%;height:100%;object-fit:cover}
.bag-line h3{margin:0 0 4px;font-size:1.05rem}
.bag-line h3 a{color:inherit}
.bag-line p{margin:0}
.bag-side{display:grid;justify-items:end;gap:8px}
.bag-side strong{font-family:var(--font-display);font-size:1.05rem}
.bag-warn{color:#8a3b2b;font-size:.82rem;margin-top:6px}
.qty-step{display:inline-flex;align-items:center;margin-top:10px;border:1px solid var(--line);border-radius:999px;background:var(--surface)}
.qty-step button{background:transparent;color:var(--ink);padding:6px 12px;border-radius:999px}
.qty-step button:hover{background:#efede8}
.qty-step span{min-width:1.5rem;text-align:center;font-weight:600}
.buy-remove{background:transparent;color:var(--muted);padding:0;font-size:.82rem}
.buy-remove:hover{background:transparent;color:var(--ink)}
.buy-back{display:inline-block;margin-top:18px;font-weight:600}
.pay-options{display:grid;gap:12px;margin:18px 0}
.pay-option{display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border:1px solid var(--line);border-radius:16px;background:var(--surface);cursor:pointer}
.pay-option:has(input:checked){border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.pay-option input{width:auto;margin-top:4px}
.pay-option span{display:grid;gap:2px}
.pay-option small{color:var(--muted);font-weight:500}
.buy-done{max-width:640px}
.notice.pay-ok{border-left-color:#2f7a4f;background:#eef8f2}
.notice.pay-wait{border-left-color:#9a6b12;background:#fff8e8}
.order-number{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--ink)}
.check{display:flex;gap:10px;align-items:center;margin-top:12px;font-weight:600}
.check input{width:auto}
a.is-disabled{pointer-events:none;opacity:.5}
@media(max-width:800px){
  .buy-layout,.buy-grid{grid-template-columns:1fr}
  .buy-summary{position:static}
  .buy-steps{overflow-x:auto}
}
