[v-cloak]{display:none!important}
#posts-pay .pay-thumb{width:34%}
#posts-pay .graphic{--cover-height-scale:58%}
#posts-pay .knn-pay-main{justify-content:flex-start!important;gap:9px}
#posts-pay .knn-buy-group-mode{padding:11px 12px;background:#f8fbff;border:1px solid rgba(0,122,255,.13);border-radius:7px}
#posts-pay .knn-buy-purchase-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:12px;align-items:center;min-width:0}
#posts-pay .knn-buy-price-line{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
#posts-pay .knn-buy-price-label{font-size:11px;color:#007aff;background:rgba(0,122,255,.09);border-radius:4px;padding:3px 7px}
#posts-pay .knn-buy-main-price{color:#ff5473;font-size:30px;font-weight:700;line-height:1}
#posts-pay .knn-buy-main-price small{font-size:13px;margin-right:2px}
#posts-pay .knn-buy-original{color:var(--muted-2-color,#8c8c8c);font-size:11px;text-decoration:line-through}
#posts-pay .knn-buy-meta{display:flex;align-items:center;gap:8px;margin-top:6px;color:var(--muted-2-color,#8c8c8c);font-size:11px}
#posts-pay .knn-buy-time{display:inline-flex;align-items:center;gap:4px;color:#007aff;font-size:11px;background:rgba(0,122,255,.08);padding:3px 8px;border-radius:20px;white-space:nowrap}
#posts-pay .knn-buy-outline-icon{width:12px;height:12px;flex:0 0 12px;overflow:visible;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
#posts-pay .knn-buy-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;min-width:0}
#posts-pay .knn-buy-actions.is-cancel-only{grid-template-columns:1fr}
#posts-pay .knn-buy-actions>.el-button,
#posts-pay .knn-buy-single-wrap .el-button{display:flex;align-items:center;justify-content:center;width:100%;height:38px;margin:0;padding:0 6px;border-radius:4px;font-size:13px;line-height:1;font-weight:600;box-sizing:border-box;white-space:nowrap}
#posts-pay .knn-buy-single-wrap{min-width:0}
#posts-pay .knn-buy-actions .el-button i{margin-right:6px}
#posts-pay .knn-buy-actions>.knn-buy-single,
#posts-pay .knn-buy-single-wrap .knn-buy-single{color:#606266;border:1px solid #dcdfe6;background:#fff}
#posts-pay .knn-buy-actions>.knn-buy-single:hover,
#posts-pay .knn-buy-single-wrap .knn-buy-single:hover{color:#007aff;border-color:#b3d8ff;background:#ecf5ff;opacity:1}
#posts-pay .knn-buy-actions>.knn-buy-group{color:#fff;border:1px solid #007aff;background:#007aff}
#posts-pay .knn-buy-actions>.knn-buy-group:hover{color:#fff;border-color:#409eff;background:#409eff;opacity:1}
#posts-pay .knn-buy-actions>.knn-buy-cancel{color:#f56c6c;border:1px solid #fbc4c4;background:#fef0f0}
#posts-pay .knn-buy-actions>.knn-buy-cancel:hover{color:#fff;border-color:#f56c6c;background:#f56c6c;opacity:1}
#posts-pay .knn-buy-actions>.knn-buy-cancel.is-disabled{pointer-events:none;opacity:.65}
#posts-pay .knn-buy-feed{height:32px;margin-top:8px;display:flex;align-items:center;background:var(--main-bg-color,#fff);border:1px solid var(--main-border-color,#e8e8e8);border-radius:5px;overflow:hidden}
#posts-pay .knn-buy-feed-label{height:100%;display:flex;align-items:center;gap:4px;padding:0 9px;color:#007aff;background:rgba(0,122,255,.07);font-size:10px;font-weight:600;white-space:nowrap}
#posts-pay .knn-buy-feed-track{height:30px;flex:1;min-width:0;overflow:hidden}
#posts-pay .knn-gb-feed-item{height:30px;display:flex;align-items:center;padding:0 9px;font-size:10px;color:var(--muted-color,#74787d);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#posts-pay .knn-gb-feed-item:not(:first-child){display:none}
#posts-pay .knn-gb-feed-item b{color:var(--main-color,#333);margin-right:4px}
#posts-pay .knn-gb-feed-item em{color:#67c23a;font-style:normal;margin:0 4px}
#posts-pay .knn-gb-feed-item time{margin-left:auto;color:var(--muted-2-color,#8c8c8c)}
#posts-pay .knn-buy-guarantees{display:flex;gap:12px;flex-wrap:wrap;margin-top:7px;color:var(--muted-2-color,#8c8c8c);font-size:10px}
#posts-pay .knn-buy-guarantees i{color:#1aad19;margin-right:3px}
/* 拼团弹窗余额提示 */
.knn-gb-method-balance{margin-left:auto;color:#909399;font-size:12px;font-weight:400;white-space:nowrap}
body.dark-mode #posts-pay .knn-buy-group-mode{background:#252a30;border-color:rgba(64,158,255,.28)}
body.dark-mode #posts-pay .knn-buy-price-label,
body.dark-mode #posts-pay .knn-buy-time,
body.dark-mode #posts-pay .knn-buy-feed-label{color:#409eff;background:rgba(64,158,255,.14)}
body.dark-mode #posts-pay .knn-buy-actions>.knn-buy-single,
body.dark-mode #posts-pay .knn-buy-single-wrap .knn-buy-single{color:#d0d0d0;border-color:#4a4a4a;background:#303033}
body.dark-mode #posts-pay .knn-buy-actions>.knn-buy-single:hover,
body.dark-mode #posts-pay .knn-buy-single-wrap .knn-buy-single:hover{color:#66b1ff;border-color:#3375a9;background:#263746}
body.dark-mode #posts-pay .knn-buy-actions>.knn-buy-cancel{color:#f78989;border-color:#7a4545;background:#3b292b}
body.dark-mode #posts-pay .knn-buy-actions>.knn-buy-cancel:hover{color:#fff;border-color:#f56c6c;background:#c45656}
body.dark-mode #posts-pay .knn-buy-feed{background:#202225;border-color:#414141}
body.dark-mode #posts-pay .knn-buy-guarantees{color:#a0a0a0}
body.dark-mode #posts-pay .knn-gb-steps{background:#1d1d1f;--el-text-color-primary:#e5eaf3;--el-text-color-regular:#cfd3dc;--el-text-color-secondary:#a8abb2;--el-text-color-placeholder:#8d9095}
body.dark-mode #posts-pay .knn-gb-step-tip{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-step-tip b{color:#409eff}
body.dark-mode #posts-pay .el-step__title.is-process,
body.dark-mode #posts-pay .el-step__description.is-process,
body.dark-mode #posts-pay .el-step__title.is-wait,
body.dark-mode #posts-pay .el-step__description.is-wait{color:#a8abb2}
body.dark-mode #posts-pay .el-step__title.is-success,
body.dark-mode #posts-pay .el-step__description.is-success{color:#67c23a}
body.dark-mode #posts-pay .el-step__head.is-process{color:#409eff;border-color:#409eff}
body.dark-mode #posts-pay .el-step__head.is-wait{color:#a8abb2;border-color:#73767a}
body.dark-mode #posts-pay .el-step__head.is-success{color:#67c23a;border-color:#67c23a}
body.dark-mode #posts-pay .el-step__line{background-color:#55575c}
body.dark-mode #posts-pay .knn-gb-panel{background:#202225;border-color:#414141}
body.dark-mode #posts-pay .knn-gb-panel-head b{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-panel-head span{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-row{border-color:#414141}
body.dark-mode #posts-pay .knn-gb-row-info b{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-row-info span{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-row-info em{color:#ff6b81}
body.dark-mode #posts-pay .knn-gb-avatars .el-avatar{border-color:#202225}
body.dark-mode #posts-pay .knn-gb-panel .el-empty__description p{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-pagination{border-color:#414141}
body.dark-mode #posts-pay .knn-gb-mine.el-card{border-color:#385f86;background:rgba(64,158,255,.07)}
body.dark-mode #posts-pay .knn-gb-mine-head b{color:#a8abb2}
body.dark-mode #posts-pay .knn-gb-member-name{color:#a8abb2}
body.dark-mode .knn-gb-dialog{--el-bg-color:#272727;--el-text-color-primary:#d0d0d0;--el-text-color-regular:#b8b8b8;--el-border-color:#444;--el-fill-color-blank:#272727}
body.dark-mode .knn-gb-dialog .knn-gb-order{color:#d0d0d0;border-color:#444;background:#1f1f1f}
body.dark-mode .knn-gb-dialog .knn-gb-pay-method{color:#d0d0d0;border-color:#4a4a4a;background:#303033}
body.dark-mode .knn-gb-dialog .knn-gb-pay-method.active{border-color:#409eff;background:#263746}
body.dark-mode .knn-gb-dialog .knn-gb-method-balance{color:#a8abb2}
body.dark-mode .knn-gb-dialog .knn-gb-qr{border-color:#444;background:#fff}
#posts-pay .knn-gb-root{margin-top:16px;padding-top:16px;border-top:1px dashed var(--main-border-color,#e8e8e8);line-height:1.5;color:var(--main-color,#333)}
#posts-pay .knn-gb-root *{box-sizing:border-box}
#posts-pay .knn-gb-root .el-divider__text{background:var(--main-bg-color,#fff);color:var(--main-color,#333);font-weight:700}
#posts-pay .knn-gb-card.el-card{border-color:var(--main-border-color,#e8e8e8);border-radius:8px;background:var(--main-bg-color,#fff)}
#posts-pay .knn-gb-card>.el-card__body{padding:16px}
#posts-pay .knn-gb-steps{padding:18px 8px 10px;background:var(--body-bg-color,#f7f8f9);border-radius:8px}
#posts-pay .knn-gb-step-tip{text-align:center;margin-bottom:15px;color:var(--muted-2-color,#8c8c8c);font-size:12px}
#posts-pay .knn-gb-step-tip b{color:#007aff}
#posts-pay .el-step__title{font-size:13px;line-height:28px}
#posts-pay .el-step__description{font-size:11px;line-height:1.4}
#posts-pay .knn-gb-panel{margin-top:14px;padding:14px;border:1px solid var(--main-border-color,#e8e8e8);border-radius:8px;background:var(--main-bg-color,#fff)}
#posts-pay .knn-gb-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
#posts-pay .knn-gb-panel-head b{font-size:14px}
#posts-pay .knn-gb-panel-head span{font-size:12px;color:var(--muted-2-color,#8c8c8c)}
#posts-pay .knn-gb-row{display:flex;align-items:center;gap:9px;padding:9px 0;border-bottom:1px solid var(--main-border-color,#e8e8e8)}
#posts-pay .knn-gb-row:last-child{border-bottom:0}
#posts-pay .knn-gb-avatars{display:flex;min-width:61px}
#posts-pay .knn-gb-avatars .el-avatar{margin-left:-9px;border:2px solid var(--main-bg-color,#fff)}
#posts-pay .knn-gb-avatars .el-avatar:first-child{margin-left:0}
#posts-pay .knn-gb-row-info{flex:1;min-width:0}
#posts-pay .knn-gb-row-info b,#posts-pay .knn-gb-row-info span{display:block;font-size:12px}
#posts-pay .knn-gb-row-info span{color:var(--muted-2-color,#8c8c8c);font-size:11px}
#posts-pay .knn-gb-row-info em{color:#ff5473;font-style:normal}
#posts-pay .knn-gb-pagination{display:flex;justify-content:center;padding-top:12px;margin-top:9px;border-top:1px solid var(--main-border-color,#e8e8e8)}
#posts-pay .knn-gb-mine.el-card{margin-top:12px;border-color:#b3d8ff;background:rgba(0,122,255,.025)}
#posts-pay .knn-gb-mine .el-card__header{padding:11px 14px}
#posts-pay .knn-gb-mine .el-card__body{padding:14px}
#posts-pay .knn-gb-mine-head{display:flex;align-items:center;gap:8px}
#posts-pay .knn-gb-mine-head .remain{margin-left:auto;color:#007aff;font-size:11px}
#posts-pay .knn-gb-members{display:flex;justify-content:center;gap:20px;margin:4px 0 13px;flex-wrap:wrap}
#posts-pay .knn-gb-member{position:relative;width:58px;text-align:center}
#posts-pay .knn-gb-member-name{margin-top:4px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#posts-pay .knn-gb-leader{position:absolute;z-index:2;top:-7px;left:50%;margin-left:7px;display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:17px;padding:0 5px;box-sizing:border-box;border-radius:9px;background:#e6a23c;color:#fff;font-size:9px;line-height:17px;white-space:nowrap}
#posts-pay .knn-gb-empty{width:40px;height:40px;margin:auto;border:2px dashed #c0c4cc;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#c0c4cc}
#posts-pay .knn-gb-mine-actions{text-align:center}
.knn-gb-order{display:flex;align-items:center;gap:11px;padding:12px;background:#fafafa;border:1px solid #ebeef5;border-radius:8px}
.knn-gb-order img{width:56px;height:56px;object-fit:cover;border-radius:8px}
.knn-gb-order-main{flex:1}.knn-gb-order-main b,.knn-gb-order-main span{display:block}.knn-gb-order-main span{font-size:12px;color:#909399}
.knn-gb-order-price{color:#f56c6c;font-size:21px;font-weight:700}
.knn-gb-pay-methods{display:grid;gap:8px;margin-top:14px}
.knn-gb-pay-method{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;border:1px solid #dcdfe6;border-radius:8px;background:#fff;cursor:pointer;text-align:left}
.knn-gb-pay-method.active{border-color:#007aff;background:#ecf5ff;box-shadow:0 0 0 2px rgba(0,122,255,.08)}
.knn-gb-pay-method img{width:30px;height:30px;object-fit:contain}.knn-gb-pay-method b{flex:1}.knn-gb-pay-method i{color:#007aff}
.knn-gb-dialog-total{display:flex;justify-content:space-between;align-items:center;margin-top:13px}.knn-gb-dialog-total b{color:#f56c6c;font-size:21px}
.knn-gb-dialog-footer{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.knn-gb-invite{text-align:center}.knn-gb-qr{width:148px;height:148px;margin:12px auto;padding:9px;border:1px solid #ebeef5;border-radius:8px;display:flex;align-items:center;justify-content:center}.knn-gb-share{display:flex;gap:8px}
@media(max-width:767px){#posts-pay .pay-thumb{width:100%}#posts-pay .knn-buy-purchase-row{grid-template-columns:1fr}#posts-pay .knn-buy-actions{grid-template-columns:1fr 1fr}#posts-pay .knn-buy-actions.is-cancel-only{grid-template-columns:1fr}#posts-pay .knn-gb-steps{overflow-x:auto}#posts-pay .knn-gb-steps .el-steps{min-width:550px}.knn-gb-dialog{width:92%!important}}