/* 卡密兑换页专用：通用组件（头部、票根进度条、表单卡、小票、印章、客服卡）都在 buyer.css。 */
.buyer-site .redeem{max-width:760px}
.buyer-site .redeem .pg-title{margin-bottom:16px}
.buyer-site #redeem-banner{margin-bottom:16px}
.buyer-site .code-input{font-family:var(--mono)!important;letter-spacing:.06em;font-size:17px!important}
.buyer-site .session-input{font-family:var(--mono)!important;font-size:12.5px!important;min-height:130px!important}
.buyer-site .redeem-summary{margin-bottom:18px}
.buyer-site .redeem-summary .chip{height:22px;font-size:12px;margin-left:6px;vertical-align:1px}
/* 怎么拿凭证：首页同款编号步骤，前两步右侧是新标签打开的快捷按钮 */
.buyer-site .steps-mini{list-style:none;display:grid;gap:12px;margin:0 0 18px;padding:0;counter-reset:m}
.buyer-site .steps-mini li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:14px;color:var(--ink-2);counter-increment:m}
.buyer-site .steps-mini li::before{content:counter(m);display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--ink);color:var(--yellow);font-family:var(--mono);font-weight:800}
.buyer-site .steps-mini small{display:block;font-size:12px;color:var(--muted)}
.buyer-site .steps-mini u{text-decoration:none;font-family:var(--mono);font-size:12.5px;background:var(--paper-2);padding:1px 6px;border-radius:5px;overflow-wrap:anywhere}
/* 开通进度：20 格分段 + 阶段清单 */
.buyer-site .seg{display:grid;grid-template-columns:repeat(20,1fr);gap:4px;margin:2px 0 8px}
.buyer-site .seg i{height:14px;border-radius:3px;background:var(--paper-2);border:1px solid var(--line)}
.buyer-site .seg i.on{background:var(--ink);border-color:var(--ink)}
.buyer-site .seg i.now{background:var(--yellow);border-color:var(--ink);animation:bp-blink 1s infinite}
.buyer-site .seg-meta{display:flex;justify-content:space-between;font-family:var(--mono);font-size:12.5px;color:var(--muted)}
.buyer-site .stages{list-style:none;display:grid;gap:2px;margin:10px 0 12px;padding:0}
.buyer-site .stages li{display:flex;align-items:center;gap:10px;font-size:14.5px;padding:5px 0;color:var(--muted)}
.buyer-site .stages li.ok{color:var(--ink)}
.buyer-site .stages li.now{color:var(--ink);font-weight:800}
.buyer-site .foot.left{text-align:left;overflow-wrap:anywhere}
/* 人机验证：黄色便签 */
.buyer-site .sticky-note{position:relative;background:var(--yellow);border:2px solid var(--ink);border-radius:12px;padding:18px 18px 16px;box-shadow:5px 5px 0 var(--ink);transform:rotate(-1deg);margin:22px 4px 10px}
.buyer-site .sticky-note::before{content:"";position:absolute;top:-10px;left:50%;width:70px;height:20px;transform:translateX(-50%) rotate(2deg);background:rgba(255,253,247,.75);border:1px solid rgba(11,24,48,.15)}
.buyer-site .sticky-note h3{font-size:16px;font-weight:900;margin-bottom:4px}
.buyer-site .sticky-note p{font-size:13.5px;color:var(--ink-2);margin-bottom:12px}
/* 结果：成功小票 / 转客服 */
.buyer-site #task-result .receipt{margin-top:28px}
.buyer-site .result-lede{margin-bottom:4px}
@media (max-width:640px){
  .buyer-site .steps-mini li{grid-template-columns:30px minmax(0,1fr)}
  .buyer-site .steps-mini .bt{grid-column:2;justify-self:start}
  .buyer-site .seg{gap:3px}
  .buyer-site .sticky-note{margin:20px 2px 8px}
  .buyer-site .sticky-note .bt{width:100%}
}