/* Unlock flow, annual plan, multi-select on results. Mobile first. */
.pick { position: relative; display: grid; gap: var(--s2); align-content: start; }
.pick-box { display: flex; align-items: center; gap: var(--s2); min-height: 44px; padding: 0 var(--s3); border: 2px solid var(--line-strong); border-radius: 12px; background: #fff; font-weight: 600; color: var(--navy); cursor: pointer; }
.pick-box input { width: 22px; height: 22px; accent-color: var(--green); flex: none; }
.pick.is-picked .pick-box { border-color: var(--green); background: #FFF9E0; }
.pick.is-picked .lot-card { outline: 3px solid var(--green); outline-offset: 2px; border-radius: 12px; }
.pick-bar { position: sticky; bottom: 76px; z-index: 30; display: flex; align-items: center; justify-content: space-between; gap: var(--s3); flex-wrap: wrap; margin-top: var(--s4); padding: var(--s3) var(--s4); background: var(--navy); color: #fff; border-radius: 14px; box-shadow: 0 8px 24px rgba(3, 41, 78, .3); }
.pick-bar[hidden] { display: none; }
@media (min-width: 900px) { .pick-bar { bottom: 16px; } }

.unlock-grid { display: grid; gap: var(--s6); grid-template-columns: minmax(0, 1fr); align-items: start; }
@media (min-width: 900px) { .unlock-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 440px); } }
.unlock-lots { list-style: none; padding: 0; margin: var(--s3) 0; display: grid; gap: var(--s2); }
.unlock-lots li { display: grid; gap: 2px; padding: var(--s3); border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.unlock-lots small { color: var(--ink-3); }
.unlock-price { display: grid; gap: 2px; padding: var(--s4); border-radius: 14px; background: #FFF9E0; border: 1px solid #F3D676; margin: var(--s4) 0; }
.unlock-price span { color: var(--ink-2); }
.unlock-price strong { font-size: 1.75rem; color: var(--navy); }
.unlock-price small { color: var(--ink-3); }
.unlock-plan { font-size: var(--fs-sm); }
.unlock-box { padding: var(--s4); margin-bottom: var(--s4); border: 2px solid var(--green); border-radius: 14px; background: #FFF9E0; display: grid; gap: var(--s2); }
.unlock-box p { margin: 0; }
.plan-points { padding-left: 1.2em; display: grid; gap: var(--s2); }

.pay-card, .unlock-wait, .contact-card { padding: var(--s4); border: 1px solid var(--line); border-radius: 16px; background: #fff; display: grid; gap: var(--s3); min-width: 0; }
.pay-amount { margin: 0; font-size: 1.125rem; }
.pay-amount strong { font-size: 2rem; color: var(--navy); }
.pay-sub, .pay-note, .unlock-safety { margin: 0; color: var(--ink-3); font-size: var(--fs-sm); }
.pay-or { margin: 0; text-align: center; font-weight: 600; color: var(--ink-2); }
.pay-qr { display: block; margin: 0 auto; max-width: 100%; height: auto; border: 1px solid var(--line); border-radius: 12px; }
.pay-steps { margin: 0; padding-left: 1.3em; list-style: decimal; display: grid; gap: var(--s2); }
.utr-form { display: grid; gap: var(--s3); }
.utr-form input { width: 100%; height: 52px; border: 2px solid var(--line-strong); border-radius: 12px; padding: 0 var(--s3); font: inherit; text-transform: uppercase; }
.upi-app { display: none; }
@media (hover: none) and (pointer: coarse) { .upi-app { display: inline-flex; } }
.unlock-contacts { display: grid; gap: var(--s4); }
.contact-name { margin: 0; font-weight: 700; font-size: 1.125rem; color: var(--navy); }
.contact-city { margin: 0; color: var(--ink-3); }

.key-box { margin-bottom: var(--s5); padding: var(--s4); border: 2px dashed var(--navy); border-radius: 16px; background: #fffbe9; text-align: center; display: grid; gap: var(--s2); }
.key-title { margin: 0; font-weight: 700; color: var(--navy); }
.key-code { margin: 0; font-size: 2rem; font-weight: 800; letter-spacing: .12em; color: var(--navy); font-family: ui-monospace, Menlo, monospace; }
.key-box p { margin: 0; }
.report-box { border-top: 1px solid var(--line); padding-top: var(--s3); }
.report-box summary { cursor: pointer; font-weight: 600; color: var(--navy); min-height: 44px; display: flex; align-items: center; }
.report-state { margin: 0; padding: var(--s2) var(--s3); background: var(--surface-2); border-radius: 10px; font-size: var(--fs-sm); }
.unlock-id { margin: 0; padding: var(--s3); border-radius: 12px; background: #FFF9E0; }
.buyer-row { align-items: flex-start; padding-top: var(--s3); padding-bottom: var(--s3); }
.lot-sample { position: relative; border-radius: 14px; overflow: hidden; max-width: 520px; background: var(--surface-2); }
.lot-sample img { display: block; width: 100%; height: auto; }
.lot-sample-tag { position: absolute; left: 10px; bottom: 10px; background: rgba(3, 41, 78, .85); color: #fff; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; }
