/* 运营模块（玩家档案 / 邮件补偿 / 反馈工单 / 数据看板）· 设计系统 v2 · 全部 rem，随根字号缩放 */
svg.i.flip{transform:scaleX(-1)}
.btn.sm,button.sm{height:1.875rem;padding:0 0.625rem;font-size:0.7812rem}
.grow{flex:1 1 auto}
.hint{display:block;font-size:0.7188rem;color:var(--muted);font-weight:400;margin-top:0.125rem;white-space:normal}
.big{font-size:1.25rem}
.clip3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;color:var(--text-2);margin:0.375rem 0}
/* 分段切换 */
.seg{display:inline-flex;gap:0.125rem;padding:0.1875rem;background:var(--bg-muted);border:1px solid var(--border);border-radius:var(--radius-sm);max-width:100%;overflow-x:auto;scrollbar-width:none}
.seg::-webkit-scrollbar{display:none}
.seg a{display:inline-flex;align-items:center;gap:0.375rem;height:1.875rem;padding:0 0.75rem;border-radius:0.375rem;color:var(--text-2);font-size:0.8125rem;font-weight:500;white-space:nowrap;text-decoration:none}
.seg a:hover{color:var(--text);text-decoration:none}
.seg a.on{background:var(--panel);color:var(--text);box-shadow:0 1px 0.125rem rgba(0,0,0,.08),0 0 0 1px var(--border)}
.seg a small{color:var(--muted);font-weight:500}
.seg svg.i{width:0.9375rem;height:0.9375rem}
/* ---------- 玩家档案 ---------- */
.pl-back{margin:-0.25rem 0 0.75rem;font-size:0.8125rem}
.pl-back a{display:inline-flex;align-items:center;gap:0.25rem;color:var(--text-2)}
.pl-head{border:1px solid var(--border);border-radius:var(--radius);background:var(--panel);padding:1.125rem 1.25rem}
.pl-id{display:flex;gap:1rem;align-items:flex-start}
.pl-ava{width:3.5rem;height:3.5rem;border-radius:0.875rem;background:linear-gradient(135deg,var(--accent),#7c3aed);color:#fff;display:grid;place-items:center;font-size:1.5rem;font-weight:600;flex:none}
.pl-idt{flex:1;min-width:0}
.pl-idt h1{margin:0;font-size:1.375rem;font-weight:600;line-height:1.25;overflow-wrap:anywhere}
.pl-badges{display:flex;flex-wrap:wrap;gap:0.375rem;margin:0.4375rem 0}
.pl-idt .meta{margin:0;overflow-wrap:anywhere}
.pl-acts{display:flex;gap:0.5rem;flex-wrap:wrap;justify-content:flex-end}
.pl-stats{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:0;margin-top:1rem;border:1px solid var(--border-soft);border-radius:var(--radius-sm);overflow:hidden}
.pl-stats>div{padding:0.625rem 0.875rem;border-right:1px solid var(--border-soft);min-width:0}
.pl-stats>div:last-child{border-right:0}
.pl-stats span{display:block;font-size:0.7188rem;color:var(--muted);margin-bottom:0.1875rem}
.pl-stats b{display:block;font-size:1rem;font-weight:600;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.pl-grid{display:grid;grid-template-columns:minmax(0,1fr) 21rem;gap:1rem;margin-top:1rem;align-items:start}
.pl-main{min-width:0;padding:0}
.pl-tabs{display:flex;overflow-x:auto;margin:0;padding:0 0.75rem;border-bottom:1px solid var(--border);scrollbar-width:thin}
.pl-tabs button{flex:none;white-space:nowrap}
.pl-tabs small{color:var(--muted);font-weight:500;margin-left:0.125rem}
.pl-tab{padding:1rem 1.125rem;min-height:12rem}
.pl-tab .modal-kv-wrap{margin:0}
.pl-side{display:flex;flex-direction:column;gap:1rem;min-width:0}
.pl-side .panel-b{max-height:28rem;overflow:auto}
.tl{list-style:none;margin:0;padding:0}
.tl li{position:relative;display:flex;gap:0.625rem;padding:0 0 0.75rem;font-size:0.8125rem}
.tl li:before{content:"";position:absolute;left:0.25rem;top:0.875rem;bottom:0;width:1px;background:var(--border)}
.tl li:last-child:before{display:none}
.tl li i{flex:none;width:0.5625rem;height:0.5625rem;border-radius:50%;margin-top:0.375rem;background:var(--muted);box-shadow:0 0 0 3px var(--panel)}
.tl li small{display:block;color:var(--muted);font-size:0.7188rem}
.tl li.link{cursor:pointer}.tl li.link:hover div{color:var(--accent)}
.tl .k-recharge i{background:var(--ok)}.tl .k-mail i{background:var(--accent)}.tl .k-op i{background:var(--warn)}.tl .k-feedback i{background:#a855f7}
.tl .k-role i,.tl .k-account i{background:var(--text)}.tl .k-guild i,.tl .k-social i{background:#ec4899}
.tl .none{color:var(--muted)}
.sa{display:block;padding:0.5rem 0.625rem;border-radius:var(--radius-sm);color:var(--text);text-decoration:none;margin:0 -0.25rem}
.sa:hover{background:var(--hover);text-decoration:none}
.sa.me{background:var(--accent-soft)}
.sa b{display:block;font-weight:600;font-size:0.8438rem}
.sa span{font-size:0.75rem;color:var(--text-2)}
.sa em{color:var(--danger);font-style:normal}
.legend{display:flex;flex-wrap:wrap;align-items:center;gap:0.375rem;font-size:0.75rem;color:var(--text-2);margin-bottom:0.25rem}
.legend .sep{width:1px;height:0.875rem;background:var(--border);margin:0 0.375rem}
.qdot{display:inline-block;width:0.625rem;height:0.625rem;border-radius:0.1875rem;flex:none;vertical-align:-0.0625rem;background:#a1a1aa;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.qdot.q0{background:#d4d4d8}.qdot.q1{background:#22c55e}.qdot.q2{background:#3b82f6}.qdot.q3{background:#a855f7}.qdot.q4{background:#f97316}.qdot.q5{background:#ef4444}
.qdot.qe{background:transparent;box-shadow:inset 0 0 0 0.125rem #3b82f6}.qdot.qi{background:transparent;box-shadow:inset 0 0 0 0.125rem var(--muted)}
.inv{display:grid;grid-template-columns:repeat(auto-fill,minmax(13.5rem,1fr));gap:0.5rem}
.inv-i{display:flex;align-items:center;gap:0.625rem;padding:0.5rem 0.75rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-subtle);min-width:0}
.inv-i>div{flex:1;min-width:0}
.inv-i b{display:block;font-weight:600;font-size:0.8438rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-i small{display:block;color:var(--muted);font-size:0.7188rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-i em{font-style:normal;font-weight:600;font-variant-numeric:tabular-nums;color:var(--text-2)}
.kvns{border:1px solid var(--border);border-radius:var(--radius-sm);margin:0 0 0.5rem;background:var(--panel)}
.kvns summary{cursor:pointer;padding:0.5rem 0.75rem;font-weight:600;font-family:var(--mono);font-size:0.8125rem}
.kvns-b{padding:0 0.75rem 0.75rem}
.kvrow{margin-top:0.5rem}.kvrow .pre{margin:0.25rem 0 0;max-height:16rem}
/* ---------- 邮件补偿向导 ---------- */
.stepper{display:flex;list-style:none;margin:0 0 1rem;padding:0;gap:0.5rem;counter-reset:s}
.stepper li{flex:1;display:flex;align-items:center;gap:0.5rem;padding:0.625rem 0.875rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--panel);color:var(--muted);font-weight:500;font-size:0.8438rem;min-width:0;white-space:nowrap}
.stepper li span{width:1.5rem;height:1.5rem;border-radius:50%;display:grid;place-items:center;background:var(--bg-muted);color:var(--text-2);font-size:0.75rem;font-weight:600;flex:none}
.stepper li span svg.i{width:0.875rem;height:0.875rem}
.stepper li.on{border-color:var(--accent);color:var(--text);box-shadow:0 0 0 3px var(--accent-soft)}
.stepper li.on span{background:var(--accent);color:#fff}
.stepper li.done{color:var(--text-2)}.stepper li.done span{background:var(--ok);color:#fff}
.wz{max-width:none}
.wz-foot{display:flex;align-items:center;gap:0.5rem;margin-top:1.25rem;padding-top:1rem;border-top:1px solid var(--border-soft);flex-wrap:wrap}
.chips{display:flex;flex-wrap:wrap;gap:0.375rem;align-items:center}
.chip{display:inline-flex;align-items:center;gap:0.25rem;height:1.75rem;padding:0 0.25rem 0 0.625rem;border:1px solid var(--border);border-radius:999px;background:var(--bg-subtle);font-size:0.8125rem;color:var(--text);text-decoration:none}
.chips.ro .chip,a.chip{padding-right:0.625rem}
a.chip:hover{text-decoration:none;border-color:var(--accent)}
.chip small{color:var(--muted);font-family:var(--mono);font-size:0.7188rem}
.chip button{width:1.25rem;height:1.25rem;min-width:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--muted);display:grid;place-items:center}
.chip button:hover{background:var(--bg-muted);color:var(--danger)}
.chip button svg.i{width:0.75rem;height:0.75rem;margin:0}
.rres{margin-top:0.5rem}
.rres-h{display:flex;align-items:center;justify-content:space-between;font-size:0.8125rem;color:var(--text-2);margin-bottom:0.375rem}
.rres-l{max-height:17rem;overflow:auto;border:1px solid var(--border);border-radius:var(--radius-sm)}
.rr{display:flex;align-items:center;gap:0.75rem;padding:0.5rem 0.75rem;border-bottom:1px solid var(--border-soft);cursor:pointer;font-size:0.8125rem;margin:0}
.rr:last-child{border-bottom:0}
.rr:hover{background:var(--hover)}.rr.on{background:var(--accent-soft)}.rr.dis{opacity:.55;cursor:not-allowed}
.rr b{min-width:7rem;font-weight:600}
.paste{margin-top:0.75rem}.paste summary{cursor:pointer;color:var(--text-2);font-size:0.8125rem}
.isearch{position:relative;max-width:36rem}
.isearch input{width:100%}
.ihits{position:absolute;left:0;right:0;top:calc(100% + 0.25rem);z-index:30;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-pop);max-height:20rem;overflow:auto;padding:0.25rem}
.ihits button{display:flex;width:100%;align-items:center;gap:0.625rem;height:auto;padding:0.5rem 0.625rem;background:transparent;color:var(--text);border:0;border-radius:0.375rem;text-align:left;font-weight:400}
.ihits button:hover{background:var(--hover)}
.ihits button b{font-weight:600}.ihits button span{color:var(--muted);font-size:0.75rem}.ihits button small{margin-left:auto;color:var(--text-2)}
.at-list{margin-top:0.625rem;display:flex;flex-direction:column;gap:0.375rem}
.at-row{display:flex;align-items:center;gap:0.75rem;padding:0.375rem 0.5rem 0.375rem 0.75rem;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-subtle);font-size:0.8125rem}
.at-row b{font-weight:600}
.at-row .at-k{margin-left:auto}
.at-row input{width:6rem;flex:none}
.pv-grid{display:grid;grid-template-columns:minmax(0,26rem) minmax(0,1fr);gap:1.5rem;align-items:start}
.gm-wrap{display:flex;flex-direction:column;gap:0.75rem}
.gm{border-radius:0.875rem;overflow:hidden;background:linear-gradient(180deg,#3b2a1a,#241a10);color:#f5e6c8;box-shadow:0 0 0 1px #6b4f2a,0 0.75rem 2rem -0.75rem rgba(0,0,0,.5);font-size:0.8438rem}
.gm-h{display:flex;gap:0.625rem;align-items:center;padding:0.75rem 0.875rem;background:rgba(0,0,0,.22);border-bottom:1px solid #6b4f2a}
.gm-ico{width:2.25rem;height:2.25rem;border-radius:0.5rem;background:#c9a24a;color:#3b2a1a;display:grid;place-items:center;flex:none}
.gm-h b{display:block;color:#ffe9b0;font-size:0.9375rem}.gm-h small{color:#c8b48c;font-size:0.7188rem}
.gm-b{padding:0.875rem;line-height:1.7;min-height:4rem;white-space:normal;overflow-wrap:anywhere}
.gm-at{display:flex;flex-wrap:wrap;gap:0.5rem;padding:0 0.875rem 0.875rem}
.gm-slot{display:flex;align-items:center;gap:0.375rem;padding:0.375rem 0.625rem;border-radius:0.5rem;background:rgba(0,0,0,.28);box-shadow:inset 0 0 0 1px #6b4f2a;font-size:0.7812rem}
.gm-slot em{font-style:normal;color:#ffd666;font-weight:600}
.gm-slot.gold span{color:#ffd666}.gm-slot.dia span{color:#7dd3fc}
.gm-at .muted{color:#a8936c}
.gm-f{display:flex;justify-content:center;padding:0.625rem;border-top:1px solid #6b4f2a;background:rgba(0,0,0,.18)}
.gm-btn{padding:0.375rem 1.5rem;border-radius:999px;background:linear-gradient(180deg,#e8c25b,#b8892a);color:#3b2a1a;font-weight:700;font-size:0.8125rem}
.done-card{text-align:center;padding:2.5rem 1rem;max-width:none}
.done-card h2{font-size:1.25rem;margin:0.5rem 0}
svg.i.big-ok{width:3rem;height:3rem;color:var(--ok);padding:0.625rem;border-radius:50%;background:var(--ok-soft)}
.tpl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:0.875rem}
/* ---------- 反馈工单 ---------- */
.fb-top{display:flex;align-items:center;gap:0.75rem;justify-content:space-between;flex-wrap:wrap;margin-bottom:0.875rem}
.fb-search{display:flex;gap:0.375rem;flex:0 1 22rem}
.fb-search input{flex:1;min-width:0}
.fb-grid{display:grid;grid-template-columns:minmax(18rem,26rem) minmax(0,1fr);gap:1rem;align-items:start}
.fb-list{padding:0;max-height:calc(100vh - 13rem);overflow:auto}
.fb-item{display:block;width:100%;height:auto;text-align:left;padding:0.75rem 0.875rem;border:0;border-bottom:1px solid var(--border-soft);border-radius:0;background:transparent;color:var(--text);font-weight:400}
.fb-item:hover{background:var(--hover)}
.fb-item.on{background:var(--accent-soft);box-shadow:inset 0.1875rem 0 0 var(--accent)}
.fb-it-h{display:flex;justify-content:space-between;gap:0.5rem;align-items:center}
.fb-it-h b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fb-item p{margin:0.25rem 0;color:var(--text-2);font-size:0.8125rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fb-item small{color:var(--muted);font-size:0.7188rem}
.fb-detail{padding:1.125rem 1.25rem;min-height:20rem}
.fb-d-h{display:flex;align-items:center;gap:0.75rem;justify-content:space-between;margin-bottom:0.75rem}
.fb-d-h h2{margin:0;font-size:1.125rem}
.fb-thread{display:flex;flex-direction:column;gap:0.625rem;margin:1rem 0}
.msg{max-width:85%;padding:0.625rem 0.875rem;border-radius:0.875rem;font-size:0.8438rem;line-height:1.6;overflow-wrap:anywhere}
.msg small{display:block;font-size:0.7188rem;opacity:.75;margin-bottom:0.125rem}
.msg.in{background:var(--bg-muted);border-bottom-left-radius:0.25rem}
.msg.out{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:0.25rem}
html[data-theme=dark] .msg.out{color:#0a0a0b}
.quick-r{display:flex;flex-wrap:wrap;gap:0.375rem;margin-bottom:0.625rem}
.chip-btn{height:1.75rem;padding:0 0.75rem;border-radius:999px;border:1px solid var(--border);background:var(--panel);color:var(--text-2);font-size:0.7812rem;font-weight:500}
.chip-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent);background:var(--panel)}
.fb-cap{display:flex;gap:0.625rem;align-items:flex-start;line-height:1.6;margin:0.75rem 0}
.fb-cap svg.i{flex:none;margin-top:0.1875rem}
.fb-cap code{font-size:0.75rem;overflow-wrap:anywhere;white-space:normal}
/* ---------- 数据看板 ---------- */
.dash-cards{grid-template-columns:repeat(6,minmax(0,1fr))}
.dash-cards .card .l{display:block;font-size:0.75rem;color:var(--text-2);margin-top:0.375rem;line-height:1.5}
.dash-cards .ca{display:block;padding:1rem 1.125rem;height:100%}
.dash-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:1rem 0}
.chart{width:100%;height:auto;display:block}
.chart .gl{stroke:var(--border-soft);stroke-width:1}
.chart .ax{fill:var(--muted);font-size:10px;font-family:var(--font)}
.chart .c1,.lg i.c1{fill:var(--accent);background:var(--accent)}
.chart .c2,.lg i.c2{fill:#a855f7;background:#a855f7}
.chart .c3,.lg i.c3{fill:var(--ok);background:var(--ok)}
.lg{display:flex;gap:1rem;font-size:0.75rem;color:var(--text-2);margin-top:0.375rem}
.lg span{display:inline-flex;align-items:center;gap:0.375rem}.lg i{width:0.625rem;height:0.625rem;border-radius:0.1875rem;display:inline-block}
.hbars{display:flex;flex-direction:column;gap:0.4375rem}
.hb{display:grid;grid-template-columns:5.5rem minmax(0,1fr) 3.5rem;align-items:center;gap:0.625rem;font-size:0.8125rem}
.hb span{color:var(--text-2)}
.hb>div{height:0.75rem;background:var(--bg-muted);border-radius:999px;overflow:hidden}
.hb i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#a855f7);border-radius:999px;min-width:2px}
.hb b{text-align:right;font-variant-numeric:tabular-nums}
.todo{display:flex;flex-direction:column;gap:0.375rem}
.todo-i{display:flex;align-items:center;gap:0.625rem;padding:0.625rem 0.75rem;border:1px solid var(--border-soft);border-radius:var(--radius-sm);color:var(--text);text-decoration:none;font-size:0.8438rem}
a.todo-i:hover{background:var(--hover);text-decoration:none}
.todo-i span{flex:1;min-width:0;overflow-wrap:anywhere}.todo-i b{font-weight:600;white-space:nowrap}
.todo-i.warn svg.i{color:var(--warn)}.todo-i.err svg.i{color:var(--danger)}.todo-i.info svg.i{color:var(--accent)}
.todo-ok{display:flex;align-items:center;gap:0.375rem}
@media (min-width:1800px){.pl-grid{grid-template-columns:minmax(0,1fr) 25rem}.dash-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1280px){.pl-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.pl-stats>div{border-bottom:1px solid var(--border-soft)}.dash-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1100px){.pl-grid{grid-template-columns:minmax(0,1fr)}.pv-grid{grid-template-columns:minmax(0,1fr)}.dash-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:768px){
  .page-head .seg{width:100%}
  .pl-head{padding:0.875rem}
  .pl-id{flex-wrap:wrap}
  .pl-ava{width:2.75rem;height:2.75rem;font-size:1.125rem}
  .pl-acts{width:100%;justify-content:stretch}.pl-acts .btn,.pl-acts button{flex:1}
  .pl-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-tab{padding:0.75rem}
  .inv{grid-template-columns:minmax(0,1fr)}
  .stepper{gap:0.25rem}.stepper li{padding:0.5rem;font-size:0.75rem;justify-content:center}
  .stepper li:not(.on){font-size:0}.stepper li:not(.on) span{font-size:0.75rem}
  .rr{flex-wrap:wrap;gap:0.25rem 0.75rem}.rr b{min-width:0}
  .at-row{flex-wrap:wrap}.at-row .at-k{margin-left:0}.at-row input{flex:1}
  .wz-foot{position:sticky;bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom));background:var(--panel);margin:1rem -1rem -1rem;padding:0.75rem 1rem;z-index:5}
  .wz-foot .grow{display:none}.wz-foot button,.wz-foot .btn{flex:1}
  .fb-grid{grid-template-columns:minmax(0,1fr)}
  .fb-detail{display:none}
  .fb-list{max-height:none}
  .fb-search{flex:1 1 100%}
  .msg{max-width:100%}
  .dash-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hb{grid-template-columns:4.5rem minmax(0,1fr) 3rem}
}

/* 玩家档案标签栏：窄屏可横向滚动，右侧渐隐提示还有更多 */
@media (max-width:760px){
  .pl-tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 2rem),transparent);padding-right:2rem;scroll-padding-right:2rem}
}