/* Workbench pages for the leaderboard features: the customer link (顾客端), HQ-entered BPG boards (BPG 总榜) and batch scoring (批量记分). */
.store-extra-start{display:flex;gap:14px;flex-wrap:wrap}
.store-extra-start .text-btn .icon{width:14px;height:14px}

/* 顾客端 */
.customer-off{display:flex;align-items:center;gap:18px;padding:26px 25px}
.customer-off h2{margin-bottom:4px}
.customer-off p{color:var(--muted);font-size:12px;line-height:1.8;max-width:560px}
.customer-off>div{flex:1}
.customer-off-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#fdeceb;color:#c4121f;flex-shrink:0}
.customer-off-icon .icon{width:26px;height:26px}
.customer-layout{display:grid;grid-template-columns:minmax(280px,340px) minmax(0,1fr);gap:22px;margin-bottom:22px;align-items:start}
.customer-layout .panel{margin-bottom:0}
.customer-qr{display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 20px 6px}
.customer-qr canvas{width:240px;height:240px;border-radius:14px;border:1px solid var(--line);box-shadow:0 6px 18px #14322110;background:#fff;image-rendering:pixelated}
.customer-code{font-size:12px;color:var(--muted)}
.customer-code b{font-family:var(--num);letter-spacing:2px;color:var(--ink);font-size:14px}
.customer-qr-actions{display:flex;justify-content:center;padding:12px 20px 22px}
.customer-link{display:flex;gap:10px;align-items:center;margin:4px 0 18px}
.customer-link input{flex:1;font-family:var(--num);font-size:13px;background:#f7f9f6}
.customer-settings{border:1px solid var(--line);border-radius:12px;overflow:hidden}
.customer-setting{display:flex;align-items:center;gap:16px;padding:14px 16px;border-bottom:1px solid var(--line)}
.customer-setting:last-child{border-bottom:0}
.customer-setting>div{flex:1;min-width:0}
.customer-setting strong{display:block;font-size:13px}
.customer-setting span{display:block;font-size:11px;color:var(--muted);line-height:1.7}
.customer-updated{font-size:11px;color:var(--muted);margin-top:10px}
.switch{position:relative;width:46px;height:26px;border-radius:99px;border:0;background:#d5ddd8;flex-shrink:0;padding:0;transition:background .15s;min-height:26px}
.switch span{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .15s}
.switch.on{background:var(--green)}
.switch.on span{transform:translateX(20px)}
.customer-facts{list-style:none;margin:0;padding:6px 25px 22px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}
.customer-facts li{display:flex;gap:12px;align-items:flex-start;padding:10px 0}
.customer-facts .icon{color:#c4121f;margin-top:2px}
.customer-facts strong{display:block;font-size:13px}
.customer-facts span{display:block;font-size:12px;color:var(--muted);line-height:1.8}

/* BPG 总榜 */
.bpg-layout{display:grid;grid-template-columns:minmax(230px,280px) minmax(0,1fr);gap:22px;align-items:start;margin-bottom:22px}
.bpg-layout .panel{margin-bottom:0}
.bpg-list{padding-bottom:10px}
.bpg-list-head{padding:18px 18px 10px}
.bpg-list-head h2{font-size:15px}
.bpg-list-item{display:flex;align-items:center;gap:10px;width:calc(100% - 16px);margin:0 8px 4px;padding:11px 10px;border:1px solid transparent;border-radius:11px;background:transparent;text-align:left;min-height:56px}
.bpg-list-item:hover{background:#f4f7f3}
.bpg-list-item.active{background:#fff6e3;border-color:#f1dfb2}
.bpg-list-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(160deg,#ffd567,#e08e12);color:#fff;flex-shrink:0}
.bpg-list-icon .icon{width:18px;height:18px}
.bpg-list-text{flex:1;min-width:0;display:flex;flex-direction:column}
.bpg-list-text strong{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bpg-list-text small{color:var(--muted);font-size:11px}
.bpg-body{padding:18px 22px 22px}
.bpg-fields{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,.7fr);gap:0 14px}
.bpg-fields .field{margin-bottom:12px}
.bpg-desc{grid-column:1/-1}
.bpg-desc textarea{min-height:60px;resize:vertical}
.bpg-publish{margin:2px 0 14px;font-size:13px;color:var(--ink)}
.bpg-dirty{color:#b26b00;font-weight:650}
.bpg-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.bpg-toolbar-gap{flex:1}
/* The editor table reflows by its own width (sidebar, pane and phone widths all differ), not by the viewport. */
.bpg-table{border:1px solid var(--line);border-radius:12px;overflow:hidden;container-type:inline-size}
.bpg-row{display:grid;grid-template-columns:84px minmax(0,1fr) minmax(0,1.45fr) 96px minmax(0,1.35fr) 36px;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line)}
.bpg-row:last-child{border-bottom:0}
.bpg-row input,.bpg-row select{min-height:38px;padding:6px 9px;font-size:13px;width:100%}
.bpg-row-head{background:#f7f9f6;font-size:11px;font-weight:650;color:var(--muted);padding:9px 10px}
.bpg-row.error{background:#fff1ef;box-shadow:inset 3px 0 0 var(--danger)}
.bpg-cell-label{display:none}
.bpg-rank{position:relative;display:flex;align-items:center;gap:4px}
.bpg-rank i{display:grid;place-items:center;width:22px;height:22px;flex-shrink:0;color:#c08a12}
.bpg-rank i .icon{width:17px;height:17px}
.bpg-rank.gold input{background:#fff6dc;border-color:#f0cf74;font-weight:750}
.bpg-rank.silver input{background:#f3f6f9;border-color:#c5ced8;font-weight:750}
.bpg-rank.silver i{color:#8b98a6}
.bpg-rank.bronze input{background:#fdf0e6;border-color:#e6b893;font-weight:750}
.bpg-rank.bronze i{color:#b46a35}
.bpg-store,.bpg-badge{display:flex;gap:6px;min-width:0}
.bpg-store select{flex:1.1}.bpg-store input{flex:1}
.bpg-badge select{flex:.9}.bpg-badge input{flex:1.1}
.bpg-remove{width:36px;height:36px;min-height:36px;color:#9aa69f}
.bpg-remove:hover{color:var(--danger)}
.bpg-empty-rows{padding:22px 16px;font-size:12px;text-align:center}
.bpg-actions .bpg-count{margin-right:auto;font-size:12px}
.bpg-loading{padding-top:22px}
.bpg-paste-mode{display:flex;gap:22px}
.bpg-paste-mode .checkbox-line{margin:0 0 6px}
@container (max-width:780px){
  .bpg-row-head{display:none}
  .bpg-row{grid-template-columns:84px minmax(0,1fr) 104px 36px;grid-template-areas:"rank name score remove" "store store badge badge";padding:10px}
  .bpg-rank{grid-area:rank}.bpg-name{grid-area:name}.bpg-score{grid-area:score}.bpg-remove{grid-area:remove}.bpg-store{grid-area:store}.bpg-badge{grid-area:badge}
}
@container (max-width:520px){
  .bpg-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"rank score" "name name" "store store" "badge badge";gap:8px 10px;padding:12px;position:relative}
  .bpg-cell-label{display:block;font-size:10px;color:var(--muted);margin-bottom:3px;width:100%}
  .bpg-rank,.bpg-store,.bpg-badge{flex-wrap:wrap}.bpg-rank input{flex:1}
  .bpg-rank{padding-right:34px}
  .bpg-remove{position:absolute;top:6px;right:6px}
}

/* 自动总榜 */
.bpg-auto{margin-bottom:22px}
.bpg-auto .panel-head{align-items:flex-start}
.bpg-auto-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;padding:16px 22px 22px}
.bpg-auto-card{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:10px;background:#fff;min-width:0}
.bpg-auto-card.off{background:#f7f8f6}
.bpg-auto-card.off .bpg-auto-top,.bpg-auto-card.off header strong{opacity:.55}
.bpg-auto-card header{display:flex;align-items:center;gap:10px}
.bpg-auto-card header>div{flex:1;min-width:0;display:flex;flex-direction:column}
.bpg-auto-card header strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bpg-auto-card header small{font-size:11px;color:var(--muted)}
.bpg-auto-top{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px}
.bpg-auto-top li{display:flex;align-items:center;gap:8px;font-size:12px;min-width:0}
.bpg-auto-rank{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;background:#f1f4f0;color:#6b7a72;flex-shrink:0;font-family:var(--num)}
.bpg-auto-rank.gold{background:#f2b33a;color:#fff}.bpg-auto-rank.silver{background:#a7b3bf;color:#fff}.bpg-auto-rank.bronze{background:#cd7a42;color:#fff}
.bpg-auto-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
.bpg-auto-name small{color:var(--muted);margin-left:6px;font-weight:400}
.bpg-auto-top b{font-family:var(--num);font-size:13px}
.bpg-auto-empty{font-size:12px;margin:0;line-height:1.8}
.bpg-auto-card footer{margin-top:auto;border-top:1px solid var(--line);padding-top:4px}
.bpg-auto-card footer .text-btn{min-height:34px;font-size:12px}

/* 批量记分 */
.batch-head{display:grid;grid-template-columns:minmax(0,1.6fr) auto minmax(130px,.6fr);gap:0 14px;align-items:end}
.batch-head .field{margin-bottom:14px}
.batch-mode-field>span{font-size:13px}
.batch-modes{display:flex;border:1px solid #cdd8d1;border-radius:9px;overflow:hidden;min-height:46px}
.batch-modes button{border:0;background:#fff;padding:0 14px;font-size:12px;font-weight:650;color:#5d7268;white-space:nowrap}
.batch-modes button+button{border-left:1px solid #cdd8d1}
.batch-modes button.active{background:var(--green);color:#fff}
.batch-search{position:relative;margin-bottom:10px}
.batch-search .member-search{min-height:50px;border-color:#b9cdbf}
.batch-search .member-search input{font-size:14px;min-height:48px}
.batch-suggest{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:5;background:#fff;border:1px solid #d5e0d8;border-radius:12px;box-shadow:0 14px 34px #14322124;max-height:330px;overflow-y:auto;padding:5px}
.batch-option{display:flex;align-items:center;gap:11px;width:100%;border:0;background:transparent;border-radius:9px;padding:8px 10px;text-align:left;min-height:52px}
.batch-option.active,.batch-option:hover{background:#eef6f1}
.batch-option>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.batch-option strong{font-size:13px}
.batch-option small{font-size:11px;color:var(--muted)}
.batch-option b{font-family:var(--num);font-size:15px;color:#567a3d}
.batch-option em{font-style:normal;font-size:10px;color:#9a7b2e;background:#fff5d9;border-radius:5px;padding:1px 6px}
.batch-option.create{color:var(--green)}
.batch-option.create .icon{width:30px;height:30px;padding:6px;border-radius:9px;background:#e4f3ec}
.batch-option .member-avatar{width:32px;height:32px;font-size:13px}
.batch-suggest-error{padding:10px 12px;font-size:12px;color:var(--danger)}
.batch-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.batch-tip{display:inline-flex;align-items:center;gap:5px;font-size:11px;color:var(--muted);margin-right:auto}
.batch-tip .icon{width:15px;height:15px}
.batch-fill{display:inline-flex;gap:6px;align-items:center}
.batch-fill[hidden]{display:none}
.batch-fill input{width:96px;min-height:36px;padding:6px 10px;font-family:var(--num)}
.batch-paste{border:1px dashed #c9d7cd;border-radius:11px;padding:12px 14px 10px;margin-bottom:12px;background:#fafcf9}
.batch-paste .field{margin-bottom:8px}
.batch-paste textarea{width:100%;font-family:var(--num);font-size:13px}
.batch-paste-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.batch-paste-note{font-size:12px;color:var(--muted)}
.warn-text{color:#a6701b}
.batch-rows{border:1px solid var(--line);border-radius:12px;max-height:46vh;overflow-y:auto;overscroll-behavior:contain}
.batch-row{display:grid;grid-template-columns:38px minmax(0,1fr) 190px 118px 36px;gap:10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--line)}
.batch-row:last-child{border-bottom:0}
.batch-row.error{background:#fff1ef;box-shadow:inset 3px 0 0 var(--danger)}
.batch-row .member-avatar{width:36px;height:36px;font-size:14px}
.batch-who{min-width:0;display:flex;flex-direction:column}
.batch-who strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.batch-who small{font-size:11px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.batch-value{display:flex;gap:6px}
.batch-value input{flex:1;min-width:0;font-family:var(--num);font-size:18px;min-height:44px;text-align:right}
.batch-sign{width:40px;border:1px solid #cdd8d1;border-radius:9px;background:#fff;font-size:18px;font-weight:700;color:#5d7268;flex-shrink:0}
.batch-after{text-align:right;display:flex;flex-direction:column;line-height:1.3}
.batch-after span{font-size:10px;color:var(--muted)}
.batch-after b{font-family:var(--num);font-size:16px}
.batch-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:26px 16px;color:var(--muted);font-size:12px;text-align:center}
.batch-empty .icon{width:30px;height:30px;color:#a9c0b2}
.batch-actions{flex-wrap:wrap}
.batch-total{margin-right:auto;font-size:12px;color:var(--muted)}
.batch-total b{font-family:var(--num);color:var(--ink);font-size:14px}
.rank-search{margin:0 25px 12px;min-height:44px}
.rank-search input{min-height:42px}
.rank-search-empty{padding:0 25px 14px;font-size:12px}
.rank-row[hidden]{display:none!important}

@media(max-width:1100px){.bpg-layout{grid-template-columns:1fr}.bpg-list{display:flex;flex-wrap:wrap;gap:6px;padding:10px}.bpg-list-head{width:100%;padding:6px 8px 2px}.bpg-list-item{width:auto;margin:0;flex:1 1 220px}}
@media(max-width:980px){.customer-layout{grid-template-columns:1fr}.customer-facts{grid-template-columns:1fr}}
@media(max-width:760px){
  .customer-off{flex-direction:column;align-items:flex-start;padding:20px}
  .customer-facts{padding:4px 18px 16px}
  .bpg-body{padding:14px}
  .bpg-fields{grid-template-columns:1fr 1fr}.bpg-fields .field:first-child{grid-column:1/-1}
  .customer-link{flex-direction:column;align-items:stretch}
  .batch-head{grid-template-columns:1fr 1fr}.batch-reason{grid-column:1/-1}
  .batch-mode-field{margin-bottom:14px}
  .batch-modes button{flex:1}
  .batch-row{grid-template-columns:36px minmax(0,1fr) 86px 36px;grid-template-areas:"avatar who who remove" "value value after after";gap:8px 10px}
  .batch-row .member-avatar{grid-area:avatar}.batch-who{grid-area:who}.batch-value{grid-area:value}.batch-after{grid-area:after;justify-content:center}.batch-row>.icon-btn{grid-area:remove}
  .batch-rows{max-height:none}
  .batch-tip{width:100%}
  .rank-search{margin:0 16px 12px}
}
