/*! v7工作室AI版 · [R129] 用户管理页重构（mk-users.css）
 * ---------------------------------------------------------------------------
 * 需求（爹）：/panel/users「用户管理」界面重构 + 布局重排；素材去网上找。
 * 做法：纯皮肤层（React 产物一个字不动）
 *   1) 顶部新增一体化 Hero（Noto 彩色图标 + 标题 + 副标题 + 在线/TG 绑定率胶囊）
 *   2) 6 张 KPI 卡  -> 彩色图标角标 + 左侧色条 + 层次阴影
 *   3) 工具栏       -> 胶囊搜索框 + 图标按钮（刷新 / 报表 / 添加用户）
 *   4) 新增筛选行   -> 全部 / 管理员 / 员工 / 已到期 / 未绑 TG / 在线 + 精简列开关
 *   5) 表格         -> 圆角卡容器 + 吸顶表头 + 头像首字母 + 状态胶囊 + 操作列图标按钮
 *
 * 素材（公网免费可商用）：Noto Emoji(Apache-2.0) -> skin/assets/users/*.svg
 *                          Lucide(ISC)          -> skin/assets/icons/*.svg
 * 回退：删掉 index.html 里 mk-users 那 2 行即可完全还原。
 * ------------------------------------------------------------------------- */

/* ========================== 令牌 ========================== */
html[data-theme] body.mku-on {
  --mku-ink: var(--text, #0c2237);
  --mku-ink2: var(--text2, #47617a);
  --mku-ink3: var(--text3, #5a6a80);
  --mku-bd: var(--border, rgba(120,160,200,.22));
  --mku-card: #ffffff;
  --mku-soft: rgba(12,34,55,.035);
  --mku-soft2: rgba(2,132,199,.06);
  --mku-accent: var(--accent, #0284c7);
  --mku-grad: linear-gradient(135deg, #0284c7, #4f46e5);
  --mku-shadow: 0 1px 2px rgba(16,24,40,.04), 0 18px 42px -34px rgba(16,24,40,.55);
  --mku-shadow-sm: 0 1px 2px rgba(16,24,40,.06);
}
html[data-theme="dark"] body.mku-on {
  --mku-card: #0f1a26;
  --mku-soft: rgba(255,255,255,.05);
  --mku-soft2: rgba(56,189,248,.10);
}

/* ========================== 1) Hero ========================== */
html[data-theme] body.mku-on .mku-hero {
  display: flex !important; align-items: center !important; gap: 14px !important;
  padding: 12px 16px !important; margin: 0 0 14px !important;
  border-radius: 16px !important;
  border: 1px solid var(--mku-bd) !important;
  background:
    radial-gradient(120% 220% at 0% 0%, rgba(2,132,199,.13), rgba(2,132,199,0) 56%),
    radial-gradient(90% 200% at 100% 0%, rgba(79,70,229,.11), rgba(79,70,229,0) 58%),
    var(--mku-card) !important;
  box-shadow: var(--mku-shadow) !important;
  flex-wrap: wrap !important; row-gap: 8px !important;
}
html[data-theme] body.mku-on .mku-hero-ico {
  width: 42px !important; height: 42px !important; flex: 0 0 auto !important;
  border-radius: 13px !important; display: flex !important; align-items: center !important; justify-content: center !important;
  background: linear-gradient(160deg, rgba(2,132,199,.14), rgba(79,70,229,.10)) !important;
  border: 1px solid rgba(2,132,199,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6) !important;
}
html[data-theme] body.mku-on .mku-hero-ico > img { width: 26px !important; height: 26px !important; display: block !important; }
html[data-theme] body.mku-on .mku-hero-txt { flex: 1 1 240px !important; min-width: 180px !important; }
html[data-theme] body.mku-on .mku-hero-txt > h1 {
  margin: 0 !important; font-size: 18px !important; font-weight: 800 !important;
  letter-spacing: .3px !important; color: var(--mku-ink) !important; line-height: 1.25 !important;
}
html[data-theme] body.mku-on .mku-hero-txt > p {
  margin: 3px 0 0 !important; font-size: 11.5px !important; font-weight: 500 !important;
  color: var(--mku-ink3) !important; letter-spacing: .2px !important;
}
html[data-theme] body.mku-on .mku-hero-side { display: flex !important; align-items: center !important; gap: 8px !important; flex-wrap: wrap !important; }
html[data-theme] body.mku-on .mku-pill {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  height: 28px !important; padding: 0 11px !important; border-radius: 999px !important;
  font-size: 11.5px !important; font-weight: 700 !important; letter-spacing: .2px !important;
  border: 1px solid var(--mku-bd) !important; background: var(--mku-soft) !important; color: var(--mku-ink2) !important;
  white-space: nowrap !important;
}
html[data-theme] body.mku-on .mku-pill > i {
  width: 7px !important; height: 7px !important; border-radius: 50% !important; background: #94a3b8 !important; flex: 0 0 auto !important;
}
html[data-theme] body.mku-on .mku-pill > b { color: var(--mku-ink) !important; font-weight: 800 !important; font-variant-numeric: tabular-nums !important; }
html[data-theme] body.mku-on .mku-pill.mku-pill-on > i { background: #10b981 !important; box-shadow: 0 0 0 3px rgba(16,185,129,.16) !important; }
html[data-theme] body.mku-on .mku-pill.mku-pill-tg > i { background: #229ED9 !important; box-shadow: 0 0 0 3px rgba(34,158,217,.16) !important; }

/* ========================== 2) KPI 卡 ========================== */
html[data-theme] body.mku-on .main .mku-kpi {
  position: relative !important; overflow: hidden !important;
  padding: 12px 14px 12px 16px !important;
  border-radius: 13px !important;
  border: 1px solid var(--mku-bd) !important;
  background: var(--mku-card) !important;
  box-shadow: var(--mku-shadow-sm) !important;
  transition: transform .16s ease, box-shadow .16s ease !important;
}
html[data-theme] body.mku-on .main .mku-kpi:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 10px 24px -18px rgba(16,24,40,.65) !important;
}
html[data-theme] body.mku-on .main .mku-kpi::before {
  content: "" !important; position: absolute !important; left: 0 !important; top: 0 !important; bottom: 0 !important;
  width: 3px !important; background: var(--mku-c, #0284c7) !important;
}
html[data-theme] body.mku-on .main .mku-kpi::after {
  content: "" !important; position: absolute !important; right: 10px !important; top: 9px !important;
  width: 30px !important; height: 30px !important; opacity: .95 !important;
  background-repeat: no-repeat !important; background-position: center !important; background-size: contain !important;
  pointer-events: none !important;
}
html[data-theme] body.mku-on .main .mku-kpi > div:first-child {
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: .3px !important;
  color: var(--mku-ink3) !important; margin-bottom: 3px !important; padding-right: 34px !important;
}
html[data-theme] body.mku-on .main .mku-kpi > div:nth-child(2) {
  font-size: 24px !important; font-weight: 800 !important; line-height: 1.1 !important;
  color: var(--mku-ink) !important; font-variant-numeric: tabular-nums !important;
}
html[data-theme] body.mku-on .main .mku-kpi[data-k="total"]   { --mku-c: #0284c7; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="admin"]   { --mku-c: #ef4444; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="emp"]     { --mku-c: #10b981; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="tg"]      { --mku-c: #229ED9; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="expired"] { --mku-c: #f59e0b; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="dev"]     { --mku-c: #6366f1; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="total"]::after   { background-image: url("/panel/skin/assets/users/users.svg") !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="admin"]::after   { background-image: url("/panel/skin/assets/users/admin.svg") !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="emp"]::after     { background-image: url("/panel/skin/assets/users/employee.svg") !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="tg"]::after      { background-image: url("/panel/skin/assets/users/telegram.svg") !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="expired"]::after { background-image: url("/panel/skin/assets/users/expired.svg") !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="dev"]::after     { background-image: url("/panel/skin/assets/users/devices.svg") !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="admin"] > div:nth-child(2)   { color: #dc2626 !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="emp"] > div:nth-child(2)     { color: #047857 !important; }
html[data-theme] body.mku-on .main .mku-kpi[data-k="expired"] > div:nth-child(2) { color: #b45309 !important; }

/* ========================== 3) 工具栏 ========================== */
html[data-theme] body.mku-on .mku-bar {
  display: flex !important; align-items: center !important; gap: 10px !important;
  padding: 10px 12px !important; margin: 0 0 10px !important;
  border-radius: 13px !important; border: 1px solid var(--mku-bd) !important;
  background: var(--mku-card) !important; box-shadow: var(--mku-shadow-sm) !important;
  flex-wrap: wrap !important; row-gap: 8px !important;
}
html[data-theme] body.mku-on .mku-searchwrap { flex: 1 1 300px !important; max-width: 420px !important; }
html[data-theme] body.mku-on .mku-searchwrap > input {
  height: 34px !important; border-radius: 999px !important;
  padding: 0 14px 0 35px !important;
  border: 1px solid var(--mku-bd) !important; background: var(--mku-soft) !important;
  color: var(--mku-ink) !important; font-size: 12.5px !important;
  transition: border .15s ease, box-shadow .15s ease, background .15s ease !important;
}
html[data-theme] body.mku-on .mku-searchwrap > input:focus {
  border-color: rgba(2,132,199,.55) !important; background: var(--mku-card) !important;
  box-shadow: 0 0 0 3px rgba(2,132,199,.13) !important;
}
html[data-theme] body.mku-on .mku-searchwrap > input::placeholder { color: var(--mku-ink3) !important; opacity: .85 !important; }
html[data-theme] body.mku-on .mku-searchwrap > svg {
  left: 12px !important; width: 15px !important; height: 15px !important;
  color: var(--mku-accent) !important; opacity: .8 !important;
}
html[data-theme] body.mku-on .mku-btn {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  height: 32px !important; padding: 0 13px !important; border-radius: 9px !important;
  border: 1px solid var(--mku-bd) !important; background: var(--mku-card) !important;
  color: var(--mku-ink2) !important; font-size: 0 !important; line-height: 0 !important; font-weight: 600 !important;
  letter-spacing: .2px !important; cursor: pointer !important;
  box-shadow: var(--mku-shadow-sm) !important; transition: all .15s ease !important;
}
html[data-theme] body.mku-on .mku-btn[data-mku-label]:not([data-mku-label=""])::after {
  content: attr(data-mku-label) !important;
  font-size: 12.5px !important; line-height: 1 !important; font-weight: 600 !important; letter-spacing: .2px !important;
}
html[data-theme] body.mku-on .mku-btn::before {
  content: "" !important; width: 14px !important; height: 14px !important; flex: 0 0 auto !important;
  background-color: currentColor !important;
  -webkit-mask-repeat: no-repeat !important; -webkit-mask-position: center !important; -webkit-mask-size: contain !important;
  mask-repeat: no-repeat !important; mask-position: center !important; mask-size: contain !important;
}
html[data-theme] body.mku-on .mku-btn:hover { transform: translateY(-1px) !important; box-shadow: 0 8px 18px -14px rgba(16,24,40,.8) !important; }
html[data-theme] body.mku-on .mku-btn-refresh::before { -webkit-mask-image: url("/panel/skin/assets/icons/refresh-cw.svg") !important; mask-image: url("/panel/skin/assets/icons/refresh-cw.svg") !important; }
html[data-theme] body.mku-on .mku-btn-refresh:hover { color: #0284c7 !important; border-color: rgba(2,132,199,.45) !important; background: rgba(2,132,199,.06) !important; }
html[data-theme] body.mku-on .mku-btn-report::before { -webkit-mask-image: url("/panel/skin/assets/icons/chart-column.svg") !important; mask-image: url("/panel/skin/assets/icons/chart-column.svg") !important; }
html[data-theme] body.mku-on .mku-btn-report:hover { color: #4f46e5 !important; border-color: rgba(79,70,229,.45) !important; background: rgba(79,70,229,.06) !important; }
html[data-theme] body.mku-on .mku-btn-add {
  border-color: transparent !important; background: var(--mku-grad) !important; color: #fff !important;
  box-shadow: 0 10px 22px -14px rgba(2,132,199,.95) !important;
}
html[data-theme] body.mku-on .mku-btn-add::before { -webkit-mask-image: url("/panel/skin/assets/icons/plus.svg") !important; mask-image: url("/panel/skin/assets/icons/plus.svg") !important; }
html[data-theme] body.mku-on .mku-btn-add:hover { filter: brightness(1.05) !important; color: #fff !important; }
html[data-theme] body.mku-on .mku-count {
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  height: 26px !important; padding: 0 11px !important; border-radius: 999px !important;
  background: var(--mku-soft2) !important; color: #0369a1 !important;
  font-size: 11.5px !important; font-weight: 700 !important; white-space: nowrap !important;
}

/* ========================== 4) 筛选行 ========================== */
html[data-theme] body.mku-on .mku-filters {
  display: flex !important; align-items: center !important; gap: 7px !important; flex-wrap: wrap !important;
  margin: 0 0 12px !important; padding: 0 2px !important;
}
html[data-theme] body.mku-on .mku-flabel {
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  font-size: 11px !important; font-weight: 700 !important; color: var(--mku-ink3) !important;
  letter-spacing: .4px !important; text-transform: uppercase !important; margin-right: 2px !important;
}
html[data-theme] body.mku-on .mku-flabel::before {
  content: "" !important; width: 13px !important; height: 13px !important; background-color: currentColor !important;
  -webkit-mask: url("/panel/skin/assets/icons/filter.svg") center/contain no-repeat !important;
  mask: url("/panel/skin/assets/icons/filter.svg") center/contain no-repeat !important;
}
html[data-theme] body.mku-on .mku-fchip {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  height: 28px !important; padding: 0 11px !important; border-radius: 999px !important;
  border: 1px solid var(--mku-bd) !important; background: var(--mku-card) !important;
  color: var(--mku-ink2) !important; font-size: 12px !important; font-weight: 600 !important;
  cursor: pointer !important; transition: all .15s ease !important; box-shadow: var(--mku-shadow-sm) !important;
}
html[data-theme] body.mku-on .mku-fchip > b {
  font-size: 11px !important; font-weight: 800 !important; font-variant-numeric: tabular-nums !important;
  color: var(--mku-ink3) !important; background: var(--mku-soft) !important;
  border-radius: 999px !important; padding: 1px 7px !important; min-width: 20px !important; text-align: center !important;
}
html[data-theme] body.mku-on .mku-fchip:hover { border-color: rgba(2,132,199,.45) !important; color: #0284c7 !important; }
html[data-theme] body.mku-on .mku-fchip.is-on {
  border-color: transparent !important; background: var(--mku-grad) !important; color: #fff !important;
  box-shadow: 0 8px 18px -14px rgba(2,132,199,.95) !important;
}
html[data-theme] body.mku-on .mku-fchip.is-on > b { color: #fff !important; background: rgba(255,255,255,.24) !important; }
html[data-theme] body.mku-on .mku-fchip.mku-fchip-off { opacity: .5 !important; }
html[data-theme] body.mku-on .mku-fspace { flex: 1 1 auto !important; }
html[data-theme] body.mku-on .mku-compact {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  height: 28px !important; padding: 0 11px !important; border-radius: 999px !important;
  border: 1px solid var(--mku-bd) !important; background: var(--mku-card) !important;
  color: var(--mku-ink2) !important; font-size: 12px !important; font-weight: 600 !important; cursor: pointer !important;
}
html[data-theme] body.mku-on .mku-compact::before {
  content: "" !important; width: 13px !important; height: 13px !important; background-color: currentColor !important;
  -webkit-mask: url("/panel/skin/assets/icons/app-window.svg") center/contain no-repeat !important;
  mask: url("/panel/skin/assets/icons/app-window.svg") center/contain no-repeat !important;
}
html[data-theme] body.mku-on .mku-compact.is-on { border-color: rgba(2,132,199,.5) !important; color: #0284c7 !important; background: rgba(2,132,199,.07) !important; }

/* ========================== 5) 表格容器 / 表头 ========================== */
html[data-theme] body.mku-on .mku-tablewrap {
  border-radius: 16px !important;
  border: 1px solid var(--mku-bd) !important;
  background: var(--mku-card) !important;
  box-shadow: var(--mku-shadow) !important;
  overflow: auto !important;
}
html[data-theme] body.mku-on .mku-tablewrap table { border-collapse: separate !important; border-spacing: 0 !important; }
html[data-theme] body.mku-on .mku-tablewrap thead th {
  position: sticky !important; top: 0 !important; z-index: 4 !important;
  background: linear-gradient(180deg, #f8fbff, #eff7fd) !important;
  color: var(--mku-ink3) !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: .5px !important;
  padding: 11px 12px !important;
  border-bottom: 1px solid var(--mku-bd) !important;
  white-space: nowrap !important;
}
html[data-theme="dark"] body.mku-on .mku-tablewrap thead th { background: linear-gradient(180deg, #16232f, #111d28) !important; }
html[data-theme] body.mku-on .mku-tablewrap thead th:hover { color: var(--mku-accent) !important; }
html[data-theme] body.mku-on .mku-tablewrap thead th > span { opacity: .55 !important; font-size: 10px !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody td {
  padding: 11px 12px !important; font-size: 12.5px !important; vertical-align: middle !important;
  border-bottom: 1px solid rgba(120,160,200,.14) !important;
  color: var(--mku-ink2) !important;
}
html[data-theme] body.mku-on .mku-tablewrap tbody tr:last-child td { border-bottom: none !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody tr { transition: background .14s ease !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody tr:hover td { background: rgba(2,132,199,.05) !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody tr.mku-row-admin td { background: linear-gradient(90deg, rgba(239,68,68,.055), rgba(239,68,68,0) 260px) !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody tr.mku-row-admin:hover td { background: linear-gradient(90deg, rgba(239,68,68,.09), rgba(2,132,199,.045) 300px) !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody tr.mku-row-off td { opacity: .55 !important; }
html[data-theme] body.mku-on .mku-tablewrap tbody tr.mku-hide { display: none !important; }
html[data-theme] body.mku-on .mku-empty {
  padding: 26px 12px !important; text-align: center !important;
  font-size: 12.5px !important; color: var(--mku-ink3) !important;
}

/* ========================== 5b) 单元格装饰 ========================== */
html[data-theme] body.mku-on td.mku-c-user { white-space: nowrap !important; }
html[data-theme] body.mku-on td.mku-c-user > span { font-size: 13px !important; font-weight: 700 !important; color: var(--mku-ink) !important; letter-spacing: .1px !important; }
html[data-theme] body.mku-on .mku-av {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  width: 26px !important; height: 26px !important; flex: 0 0 auto !important;
  margin-right: 8px !important; border-radius: 9px !important; vertical-align: middle !important;
  font-size: 10px !important; font-weight: 800 !important; letter-spacing: .2px !important;
  color: #fff !important; text-shadow: 0 1px 1px rgba(0,0,0,.16) !important;
  background: linear-gradient(135deg, var(--a1, #0284c7), var(--a2, #4f46e5)) !important;
  box-shadow: 0 2px 6px -2px rgba(12,34,55,.45), inset 0 1px 0 rgba(255,255,255,.4) !important;
}
html[data-theme] body.mku-on .mku-badge-self {
  display: inline-block !important; margin-left: 6px !important; vertical-align: 1px !important;
  padding: 1px 6px !important; border-radius: 999px !important;
  font-size: 9.5px !important; font-weight: 800 !important; letter-spacing: .4px !important;
  color: #0369a1 !important; background: rgba(2,132,199,.12) !important;
}
html[data-theme] body.mku-on td.mku-c-role > span,
html[data-theme] body.mku-on td.mku-c-valid > span {
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  padding: 3px 10px !important; border-radius: 999px !important;
  font-size: 11px !important; font-weight: 700 !important; letter-spacing: .2px !important;
  border: 1px solid transparent !important;
}
html[data-theme] body.mku-on td.mku-c-role > span::before,
html[data-theme] body.mku-on td.mku-c-valid > span::before {
  content: "" !important; width: 6px !important; height: 6px !important; border-radius: 50% !important;
  background: currentColor !important; flex: 0 0 auto !important;
}
html[data-theme] body.mku-on td.mku-c-role.mku-role-admin > span { color: #dc2626 !important; background: rgba(239,68,68,.10) !important; border-color: rgba(239,68,68,.22) !important; }
html[data-theme] body.mku-on td.mku-c-role.mku-role-emp > span { color: #047857 !important; background: rgba(16,185,129,.11) !important; border-color: rgba(16,185,129,.24) !important; }
html[data-theme] body.mku-on td.mku-c-valid > span { color: #64748b !important; background: rgba(100,116,139,.10) !important; border-color: rgba(100,116,139,.2) !important; }
html[data-theme] body.mku-on td.mku-c-valid.mku-perm > span { color: #0369a1 !important; background: rgba(2,132,199,.10) !important; border-color: rgba(2,132,199,.22) !important; }
html[data-theme] body.mku-on td.mku-c-valid.mku-warn > span { color: #b45309 !important; background: rgba(245,158,11,.13) !important; border-color: rgba(245,158,11,.3) !important; }
html[data-theme] body.mku-on td.mku-c-valid.mku-exp > span { color: #b91c1c !important; background: rgba(239,68,68,.12) !important; border-color: rgba(239,68,68,.28) !important; }
html[data-theme] body.mku-on td.mku-c-tg > span {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  padding: 3px 9px !important; border-radius: 999px !important;
  font-size: 11px !important; font-weight: 700 !important;
  background: rgba(34,158,217,.10) !important; border: 1px solid rgba(34,158,217,.2) !important;
  color: #0b6f9e !important;
}
html[data-theme] body.mku-on td.mku-c-tg.mku-off > span {
  background: rgba(100,116,139,.10) !important; border-color: rgba(100,116,139,.2) !important; color: #64748b !important;
}
html[data-theme] body.mku-on td.mku-c-tg.mku-off > span > span:first-child { background: #94a3b8 !important; }
html[data-theme] body.mku-on td.mku-c-dev {
  font-weight: 800 !important; color: var(--mku-ink) !important; font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}
html[data-theme] body.mku-on td.mku-c-dev::before {
  content: "" !important; display: inline-block !important; width: 13px !important; height: 13px !important;
  margin-right: 5px !important; vertical-align: -2px !important;
  background-color: #6366f1 !important; opacity: .75 !important;
  -webkit-mask: url("/panel/skin/assets/icons/monitor-smartphone.svg") center/contain no-repeat !important;
  mask: url("/panel/skin/assets/icons/monitor-smartphone.svg") center/contain no-repeat !important;
}
html[data-theme] body.mku-on td.mku-c-apk {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11.5px !important; color: var(--mku-ink3) !important; font-variant-numeric: tabular-nums !important;
}
html[data-theme] body.mku-on td.mku-c-apk::before {
  content: "" !important; display: inline-block !important; width: 11px !important; height: 11px !important;
  margin-right: 5px !important; vertical-align: -1px !important; background-color: currentColor !important; opacity: .5 !important;
  -webkit-mask: url("/panel/skin/assets/icons/hash.svg") center/contain no-repeat !important;
  mask: url("/panel/skin/assets/icons/hash.svg") center/contain no-repeat !important;
}
html[data-theme] body.mku-on td.mku-c-min { font-size: 12px !important; color: var(--mku-ink3) !important; white-space: nowrap !important; }
html[data-theme] body.mku-on td.mku-c-owner > span { color: #0369a1 !important; font-weight: 700 !important; }
html[data-theme] body.mku-on td.mku-c-time { font-size: 11.5px !important; color: var(--mku-ink3) !important; font-variant-numeric: tabular-nums !important; white-space: nowrap !important; }
html[data-theme] body.mku-on td.mku-c-online { white-space: nowrap !important; }
html[data-theme] body.mku-on td.mku-c-online > span {
  display: inline-flex !important; align-items: center !important; gap: 6px !important;
  padding: 3px 10px !important; border-radius: 999px !important;
  font-size: 11px !important; font-weight: 700 !important;
  background: rgba(100,116,139,.10) !important; color: #64748b !important;
}
html[data-theme] body.mku-on td.mku-c-online.mku-on > span { background: rgba(16,185,129,.12) !important; color: #047857 !important; }
html[data-theme] body.mku-on td.mku-c-online.mku-on > span > span:first-child {
  background: #10b981 !important; box-shadow: 0 0 0 3px rgba(16,185,129,.18) !important;
}
html[data-theme] body.mku-on td.mku-c-online.mku-on > span { animation: mku-pulse 2.4s ease-in-out infinite !important; }
@keyframes mku-pulse { 0%,100% { opacity: 1; } 50% { opacity: .78; } }

/* ========================== 5c) 操作列图标按钮 ========================== */
html[data-theme] body.mku-on td.mku-c-act > div { gap: 6px !important; justify-content: flex-end !important; }
html[data-theme] body.mku-on button.mku-act {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 6px !important;
  height: 28px !important; min-width: 28px !important; padding: 0 8px !important;
  border-radius: 8px !important; border: 1px solid var(--mku-bd) !important;
  background: var(--mku-card) !important; color: var(--mku-ink2) !important;
  font-size: 0 !important; line-height: 0 !important;
  box-shadow: var(--mku-shadow-sm) !important; cursor: pointer !important;
  transition: all .15s ease !important;
}
html[data-theme] body.mku-on button.mku-act::before {
  content: "" !important; width: 14px !important; height: 14px !important; flex: 0 0 auto !important;
  background-color: currentColor !important;
  -webkit-mask-repeat: no-repeat !important; -webkit-mask-position: center !important; -webkit-mask-size: contain !important;
  mask-repeat: no-repeat !important; mask-position: center !important; mask-size: contain !important;
}
html[data-theme] body.mku-on button.mku-act[data-mku-label]:not([data-mku-label=""])::after {
  content: attr(data-mku-label) !important;
  font-size: 11.5px !important; line-height: 1 !important; font-weight: 700 !important; letter-spacing: .2px !important;
}
html[data-theme] body.mku-on button.mku-act[data-mku-ic="key"]::before      { -webkit-mask-image: url("/panel/skin/assets/icons/key-round.svg") !important; mask-image: url("/panel/skin/assets/icons/key-round.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="telegram"]::before { -webkit-mask-image: url("/panel/skin/assets/icons/send.svg") !important; mask-image: url("/panel/skin/assets/icons/send.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="edit"]::before     { -webkit-mask-image: url("/panel/skin/assets/icons/square-pen.svg") !important; mask-image: url("/panel/skin/assets/icons/square-pen.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="trash"]::before    { -webkit-mask-image: url("/panel/skin/assets/icons/trash-2.svg") !important; mask-image: url("/panel/skin/assets/icons/trash-2.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="link"]::before     { -webkit-mask-image: url("/panel/skin/assets/icons/link.svg") !important; mask-image: url("/panel/skin/assets/icons/link.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="ban"]::before      { -webkit-mask-image: url("/panel/skin/assets/icons/ban.svg") !important; mask-image: url("/panel/skin/assets/icons/ban.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="user"]::before     { -webkit-mask-image: url("/panel/skin/assets/icons/user.svg") !important; mask-image: url("/panel/skin/assets/icons/user.svg") !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="warn"]::before     { -webkit-mask-image: url("/panel/skin/assets/icons/clock-alert.svg") !important; mask-image: url("/panel/skin/assets/icons/clock-alert.svg") !important; }
html[data-theme] body.mku-on button.mku-act:hover { transform: translateY(-1px) !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="key"]:hover      { color: #0284c7 !important; border-color: rgba(2,132,199,.45) !important; background: rgba(2,132,199,.07) !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="telegram"]:hover { color: #0b7fb5 !important; border-color: rgba(34,158,217,.5) !important; background: rgba(34,158,217,.08) !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="edit"]:hover     { color: #4f46e5 !important; border-color: rgba(79,70,229,.45) !important; background: rgba(79,70,229,.07) !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="trash"]:hover    { color: #e11d48 !important; border-color: rgba(225,29,72,.45) !important; background: rgba(225,29,72,.07) !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="link"]:hover     { color: #0d9488 !important; border-color: rgba(13,148,136,.45) !important; background: rgba(13,148,136,.07) !important; }
html[data-theme] body.mku-on button.mku-act[data-mku-ic="ban"]:hover      { color: #b45309 !important; border-color: rgba(245,158,11,.5) !important; background: rgba(245,158,11,.09) !important; }

/* ========================== 6) 精简列 / 自适应 ========================== */
html[data-theme] body.mku-on.mku-compact .mku-tablewrap thead th:nth-child(6),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap thead th:nth-child(7),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap thead th:nth-child(8),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap thead th:nth-child(9),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap thead th:nth-child(10),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap tbody td:nth-child(6),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap tbody td:nth-child(7),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap tbody td:nth-child(8),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap tbody td:nth-child(9),
html[data-theme] body.mku-on.mku-compact .mku-tablewrap tbody td:nth-child(10) { display: none !important; }

@media (max-width: 1560px) {
  html[data-theme] body.mku-on .mku-tablewrap thead th:nth-child(8),
  html[data-theme] body.mku-on .mku-tablewrap thead th:nth-child(9),
  html[data-theme] body.mku-on .mku-tablewrap thead th:nth-child(10),
  html[data-theme] body.mku-on .mku-tablewrap tbody td:nth-child(8),
  html[data-theme] body.mku-on .mku-tablewrap tbody td:nth-child(9),
  html[data-theme] body.mku-on .mku-tablewrap tbody td:nth-child(10) { display: none !important; }
}
@media (max-width: 1320px) {
  html[data-theme] body.mku-on .mku-tablewrap thead th:nth-child(6),
  html[data-theme] body.mku-on .mku-tablewrap thead th:nth-child(7),
  html[data-theme] body.mku-on .mku-tablewrap tbody td:nth-child(6),
  html[data-theme] body.mku-on .mku-tablewrap tbody td:nth-child(7) { display: none !important; }
  html[data-theme] body.mku-on .mku-hero-side { display: none !important; }
}
