/* ===== Web 客户端（PC 浏览器） ===== */
body.view-web{background:var(--bg)}
.web-layout{display:flex;min-height:100vh}

.web-side{
  width:230px;flex-shrink:0;background:#1c2333;color:#c7cddb;
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.web-side .brand{padding:20px 20px 18px;display:flex;align-items:center;gap:11px;border-bottom:1px solid rgba(255,255,255,.07)}
.web-side .brand .logo{width:38px;height:38px;border-radius:11px;background:var(--gradient);display:flex;align-items:center;justify-content:center;font-size:19px;color:#fff;overflow:hidden;flex-shrink:0}
.web-side .brand .logo img{width:100%;height:100%;object-fit:cover}
.web-side .brand .nm{font-size:15px;font-weight:600;color:#fff;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.web-side .brand .sub{font-size:11px;color:#7f8aa3}
.web-nav{flex:1;overflow-y:auto;padding:12px 10px}
.web-nav .grp{font-size:11px;color:#5d6883;padding:12px 12px 6px;letter-spacing:.5px}
.web-nav a{
  display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;
  color:#c7cddb;margin-bottom:3px;font-size:14px;transition:.16s;position:relative;
}
.web-nav a .ic{font-size:17px;width:20px;text-align:center}
.web-nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.web-nav a.active{background:var(--gradient);color:#fff;box-shadow:0 6px 16px rgba(74,108,247,.32)}
.web-nav a .badge{position:absolute;right:10px;top:50%;transform:translateY(-50%);background:var(--danger);color:#fff;font-size:11px;padding:1px 6px;border-radius:9px}
.web-side .foot{padding:14px;border-top:1px solid rgba(255,255,255,.07);font-size:12px;color:#5d6883}

.web-body{flex:1;min-width:0;display:flex;flex-direction:column}
.web-top{
  height:62px;background:#fff;border-bottom:1px solid var(--line);
  display:flex;align-items:center;padding:0 26px;gap:16px;position:sticky;top:0;z-index:60;
}
.web-top h2{font-size:18px}
.web-top .right{margin-left:auto;display:flex;align-items:center;gap:14px}
.web-top .user{display:flex;align-items:center;gap:9px;cursor:pointer;padding:5px 10px;border-radius:10px}
.web-top .user:hover{background:#f6f8fc}
.web-top .user .avatar{width:34px;height:34px;font-size:13px}
.web-top .user .nm{font-size:13px;font-weight:500;line-height:1.2}
.web-top .user .rl{font-size:11px;color:var(--text-3)}

.web-main{padding:22px 26px 40px;flex:1}
.web-main .stat-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.grid-2-1{display:grid;grid-template-columns:2fr 1fr;gap:18px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:1180px){.grid-2,.grid-2-1,.grid-3{grid-template-columns:1fr}}

.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.toolbar .input,.toolbar .select{width:auto;min-width:150px;padding:8px 12px}
.toolbar .spacer{flex:1}

.chart{width:100%;height:300px}
.chart.sm{height:240px}

/* 会员详情右侧面板 */
.detail-head{display:flex;align-items:center;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--line)}
.detail-head .avatar{width:60px;height:60px;font-size:22px}
.detail-head .nm{font-size:20px;font-weight:600;display:flex;align-items:center;gap:8px}
.detail-head .ph{font-size:13px;color:var(--text-3);margin-top:3px}
.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}
.mini{background:#f8fafd;border-radius:12px;padding:12px 14px}
.mini .k{font-size:12px;color:var(--text-3)}
.mini .v{font-size:18px;font-weight:700;margin-top:3px}

.dropdown{position:relative}
.dropdown-menu{
  position:absolute;right:0;top:calc(100% + 8px);background:#fff;border-radius:12px;
  box-shadow:var(--shadow-lg);min-width:170px;padding:6px;z-index:200;display:none;
}
.dropdown-menu.show{display:block;animation:pop .16s}
.dropdown-menu a{display:block;padding:9px 12px;border-radius:8px;color:var(--text-2);font-size:13px}
.dropdown-menu a:hover{background:#f5f7fc;color:var(--text)}
.dropdown-menu .sep{height:1px;background:var(--line);margin:5px 0}