/* ============================================================
   中控台 UI 统一层 v4（2026-09-11）
   ------------------------------------------------------------
   加载位置：最后一个样式层（platform-auth.css 之后），因此这里的
   声明对前面 9 个样式层具有「同优先级后置生效」的收敛作用。

   解决的问题（实机取数所得，非猜测）：
     1) 桌面端最下方的 mobile-bottom-nav 没有任何样式：它只在 ≤768px
        媒体查询里定义过，>768px 时以浏览器默认链接样式裸露在页面底部。
     2) 移动端侧栏被整块铺开成 408px 高的导航墙，390×844 下正文只剩 325px。
     3) 文字颜色/字号各自为政：同时存在 3 套文字色（--ink-2 #c0c0d0 /
        Tailwind slate #cbd5e1 / --gray #8a8aa0）与 14 种字号，
        另有浅色主题残留（用户胶囊 #eef2ff + #3730a3）。
     4) 模块间距不统一（22px / 20px / 16px / 0 混杂）、卡片内边距不统一。

   本文件只做「收敛与排版」，不改变任何业务逻辑、不新增接口。
   ============================================================ */

/* ============================================================
   1. 设计 token（唯一事实源）
   ============================================================ */
:root{
  /* 颜色：面板 / 描边 */
  --c-bg:#080b14;
  --c-bg-2:#0b1020;
  --c-panel:rgba(255,255,255,.045);
  --c-panel-2:rgba(255,255,255,.07);
  --c-line:rgba(255,255,255,.09);
  --c-line-2:rgba(255,255,255,.14);
  /* 颜色：文字三级 */
  --c-ink:#e9edf7;
  --c-ink-2:#9aa4bd;
  --c-ink-3:#6d7794;
  /* 颜色：强调与语义 */
  --c-brand:#6d8bff;
  --c-brand-2:#a78bfa;
  --c-cyan:#22d3ee;
  --c-ok:#34d399;
  --c-warn:#fbbf24;
  --c-danger:#f87171;
  /* 间距刻度（4 的倍数） */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-7:32px;
  /* 字号刻度（7 级） */
  --fs-xs:11px;    /* 徽章 / 角标 */
  --fs-sm:12px;    /* 辅助说明 / 表头 */
  --fs-md:13px;    /* 正文 / 表格 */
  --fs-lg:14px;    /* 卡片标题 */
  --fs-xl:16px;    /* 区块大标题 */
  --fs-h1:17px;    /* 页面标题 */
  --fs-num:28px;   /* KPI 数字 */
  /* 圆角 / 骨架 */
  --r-sm:8px; --r-md:12px; --r-lg:16px;
  --nav-w:236px; --tabbar-h:56px;

  /* —— 兼容旧 token（老组件仍引用这些名字，这里统一指向新色板）—— */
  --ink:var(--c-ink);   --ink-2:var(--c-ink-2); --ink-3:var(--c-ink-3);
  --line:var(--c-line); --line-2:var(--c-line-2);
  --brand:var(--c-brand); --brand-ink:#a5b4fc; --brand-soft:rgba(109,139,255,.12);
  --card:var(--c-panel);
  --sidebar-bg:var(--c-bg-2); --sidebar-ink:var(--c-ink-2); --sidebar-active:#fff;
  --green:var(--c-ok);     --green-soft:rgba(52,211,153,.14);
  --amber:var(--c-warn);   --amber-soft:rgba(251,191,36,.14);
  --red:var(--c-danger);   --red-soft:rgba(248,113,113,.14);
  --blue:#60a5fa;          --blue-soft:rgba(96,165,250,.14);
  --purple:var(--c-brand-2); --purple-soft:rgba(167,139,250,.15);
  --gray:var(--c-ink-3);   --gray-soft:rgba(255,255,255,.06);
  --radius:var(--r-lg); --radius-sm:var(--r-md);
  --shadow:0 10px 30px -18px rgba(0,0,0,.65);
  --shadow-lg:0 20px 48px -22px rgba(0,0,0,.7);

  /* premium.css / bigscreen.css 的私有 token 一并指向同一色板，
     否则会出现 #e8ecf6 与 #e9edf7、#6b7590 与 #6d7794 这类「肉眼差一点」的重影 */
  --p-bg:var(--c-bg); --p-panel:var(--c-panel);
  --p-line:var(--c-line); --p-line-2:var(--c-line-2);
  --p-ink:var(--c-ink); --p-ink-2:var(--c-ink-2); --p-ink-3:var(--c-ink-3);
  --p-brand:var(--c-brand); --p-radius:var(--r-lg);
  --p-grad:linear-gradient(135deg,var(--c-brand),var(--c-brand-2) 48%,var(--c-cyan));
  --bs-bg:var(--c-bg); --bs-line:var(--c-line); --bs-card:var(--c-panel);
  --bs-ink:var(--c-ink); --bs-ink2:var(--c-ink-2); --bs-ink3:var(--c-ink-3);
  --bs-a:var(--c-brand); --bs-b:var(--c-brand-2); --bs-c:var(--c-cyan);
  --bs-grad:linear-gradient(90deg,var(--c-brand),var(--c-brand-2) 52%,var(--c-cyan));
}

/* ============================================================
   2. 文字层：去掉霓虹发光、统一三级文字色与字号
   ============================================================ */
.brand-name,.brand-sub,.page-title,.card-title,.card-sub,.kpi-label,.kpi-value,
.kpi-foot,.badge,.btn,.chip,.nav-item,.nav-count,.foot-badge,.dm-val,.dm-label,
.dm-miss,.platform-tag,.notice,.page-crumb,.page-sub,.table th,.table td{
  text-shadow:none;
}
body{color:var(--c-ink)}
.brand-name{font-size:var(--fs-lg)}
.brand-sub{font-size:10px}
.page-title{font-size:var(--fs-h1);font-weight:650;letter-spacing:.2px;color:#fff}
.page-crumb,.page-sub{font-size:var(--fs-sm);color:var(--c-ink-3)}
.card-title{font-size:var(--fs-lg);font-weight:600;color:#fff}
.card-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6}
.kpi-label{font-size:var(--fs-sm);color:var(--c-ink-2)}
.kpi-value{font-size:var(--fs-num)}
.kpi-foot{font-size:var(--fs-sm);color:var(--c-ink-3)}
/* 展示型数字与日期统一到同一支刻度 */
.ds-stat .n,.ds-stats .ds-stat .n,.pc-item .pc-num,.kpi .n{font-size:var(--fs-num)}
.kpi-value.kpi-date{font-size:18px}
.kpi-value .dm-miss{font-size:var(--fs-xl)}
.bs-cover .bs-card h2,.bs-top h1{font-size:var(--fs-xl)}
.pa-area .card-title{font-size:var(--fs-lg)}
.badge{font-size:var(--fs-xs)}
.platform-tag{font-size:var(--fs-xs)}
.nav-item{font-size:var(--fs-md)}
.notice,.notice-success,.notice-danger,.notice-warning,.notice-info{font-size:var(--fs-sm)}
.table th{font-size:var(--fs-sm)}
.table td{font-size:var(--fs-md)}
code,.mono,.cell-id,.nav-group{font-size:var(--fs-sm)}

/* 表单控件不再使用浏览器默认的 13.3333px，继承页面字体 */
button,input,select,textarea{font-family:inherit}
button,input[type="button"],input[type="submit"],.btn,.chip,.icon-btn{font-size:var(--fs-md)}
input,select,textarea{font-size:var(--fs-md)}

/* 表格：表头弱化、数值对齐、行高统一 */
th{font-weight:600;letter-spacing:.3px}
td{line-height:1.6}

/* ============================================================
   3. 语义色：浅色主题残留 → 深色可读版本
   ============================================================ */
.b-green{background:var(--green-soft);color:#7ee2b3}
.b-amber{background:var(--amber-soft);color:#fcd68a}
.b-red{background:var(--red-soft);color:#fca5a5}
.b-blue{background:var(--blue-soft);color:#93c5fd}
.b-purple{background:var(--purple-soft);color:#ddd6fe}
.b-gray{background:var(--gray-soft);color:var(--c-ink-2)}
.kpi-foot .up{color:var(--c-ok)}
.kpi-foot .warn{color:var(--c-warn)}
.kpi-foot .bad{color:var(--c-danger)}
/* 残留的旧色值类 */
.brand-name{color:var(--c-ink)}
.foot-ver,.foot-badge{color:var(--c-ink-3)}
.sync-badge{color:#fcd68a}

/* 按钮基线：纯 .btn（不带变体）原先落到浏览器默认的 2px outset 立体边框，
   与 .btn-primary 等设计化按钮混在同一排时非常突兀 */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  border:1px solid transparent;border-radius:var(--r-sm);
  font-weight:500;line-height:1.25;
}
.btn:disabled{cursor:not-allowed;opacity:.55}
.btn-danger{background:var(--c-danger);border-color:transparent;color:#2a0b0b}
.btn-danger:hover{filter:brightness(1.06)}

/* ============================================================
   4. 骨架：侧栏 / 顶栏 / 内容区
   ============================================================ */
.layout{background:transparent}
.sidebar{border-right:1px solid var(--c-line)}
.nav-item.active{text-shadow:none}
.nav-group{color:var(--c-ink-3);font-weight:600;letter-spacing:.4px}

.topbar{
  height:auto;min-height:60px;flex-wrap:wrap;
  align-items:center;gap:var(--sp-2) var(--sp-4);
  padding:var(--sp-2) var(--sp-6);
  background:rgba(8,11,22,.78);
  border-bottom:1px solid var(--c-line);
}
.topbar-left{min-width:0;flex:1 1 320px;align-items:center;gap:var(--sp-3)}
.topbar-title-box{flex:1 1 auto;min-width:0;flex-wrap:wrap}
.page-title{flex:0 1 auto;min-width:0}
.page-sub{max-width:none;flex:1 1 100%}
.topbar-right{flex:0 0 auto;gap:var(--sp-3);flex-wrap:wrap;justify-content:flex-end}
.topbar-flags{display:flex;align-items:center;gap:var(--sp-2);font-size:var(--fs-xs);color:var(--c-ink-3);white-space:nowrap}
.topbar-flags .flag-alert{color:#fca5a5}
.searchbox{background:var(--c-panel);border-color:var(--c-line-2)}
.sync-badge{font-size:var(--fs-sm);padding:5px 11px;font-weight:500}
.btn-mini-sync{
  padding:5px 12px;border-radius:var(--r-sm);cursor:pointer;
  background:var(--c-brand);border:1px solid transparent;color:#fff;font-weight:600;
}
.btn-mini-sync:hover{filter:brightness(1.08)}
/* 用户胶囊：原先为浅色主题（#eef2ff 底 + #3730a3 字），深色界面上非常突兀 */
.user-chip{
  display:flex;align-items:center;gap:var(--sp-2);
  padding:4px 6px 4px 12px;border-radius:999px;
  background:var(--c-panel-2);border:1px solid var(--c-line-2);
}
.user-chip-name{font-size:var(--fs-sm);font-weight:600;color:var(--c-ink)}
.user-chip-role{font-size:var(--fs-xs);color:var(--c-ink-3)}
.user-chip-out{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:50%;cursor:pointer;
  background:transparent;border:1px solid transparent;color:var(--c-ink-3);font-size:var(--fs-md);
}
.user-chip-out:hover{background:rgba(255,255,255,.08);color:#fff}

/* ============================================================
   5. 内容区节奏：统一的模块间距 / 卡片内边距 / 网格栅距
   ============================================================ */
.content{flex:1;min-height:0;padding:var(--sp-6)}
.content-inner{max-width:1440px;margin:0 auto}
.section{margin-bottom:var(--sp-5)}
.notice-success,.notice-danger,.notice-warning,.notice-info{margin-bottom:var(--sp-5)}
.grid{gap:var(--sp-4)}
.card-head{padding:var(--sp-4) var(--sp-5)}
.card-pad{padding:var(--sp-5)}
/* style.css 里「卡片悬停无限漂浮」会让整页随鼠标抖动，关掉 */
.card:hover{animation:none}

@media(max-width:1180px){
  .content{padding:var(--sp-5)}
  .section{margin-bottom:var(--sp-4)}
}

/* ============================================================
   6. 移动端外壳（≤768px）：抽屉式侧栏 + 底部标签栏
   ------------------------------------------------------------
   取代 R5 的「导航常驻铺开」方案：R5 下 390×844 时侧栏占 408px，
   正文只剩 325px 高，且底部标签栏与顶部导航功能重复。
   ============================================================ */
/* 底部标签栏：桌面端不存在这个组件，必须先整体隐藏 */
#mobileBottomNav{display:none}
.mobile-menu-btn,.mobile-nav-mask{display:none}

@media(max-width:768px){
  /* —— 整体骨架 —— */
  .layout{height:100vh;height:100dvh;flex-direction:column}
  .layout .main{flex:1 1 auto;min-height:0}

  /* —— 侧栏改为离屏抽屉 —— */
  .layout .sidebar{
    position:fixed;top:0;left:0;bottom:0;z-index:80;
    width:min(86vw,300px);max-width:300px;height:100dvh;
    flex-direction:column;align-items:stretch;overflow-y:auto;
    transform:translateX(-102%);
    transition:transform .26s cubic-bezier(.22,.8,.3,1);
    border-right:1px solid var(--c-line-2);border-bottom:0;
    background:linear-gradient(180deg,rgba(11,16,32,.99),rgba(8,11,20,.99));
    box-shadow:none;
  }
  .layout .sidebar.mobile-open{
    transform:none;
    box-shadow:0 24px 64px -12px rgba(0,0,0,.8);
  }
  .layout .sidebar .brand{width:100%;padding:14px 16px}
  .layout .sidebar .brand-text{display:block}
  .layout .sidebar .sidebar-foot{display:none}

  /* —— 抽屉内导航恢复纵向列表 —— */
  .layout .sidebar .nav{
    width:100%;min-width:0;flex-direction:column;flex-wrap:nowrap;
    gap:2px;padding:10px 10px 18px;overflow:visible;
  }
  .layout .sidebar .nav-group{
    flex:0 0 auto;margin:12px 4px 4px;font-size:var(--fs-xs);
  }
  .layout .sidebar .nav-group:first-child{margin-top:2px}
  .layout .sidebar .nav-item{
    flex:0 0 auto;width:100%;margin:0;padding:10px 12px;
    font-size:var(--fs-md);white-space:normal;
  }
  .layout .sidebar .nav-count{margin-left:auto}
  .layout .sidebar .nav-group-auth{flex:0 0 auto;flex-direction:column;align-items:stretch;gap:0;margin:12px 0 0;padding:8px 0 0}
  .layout .sidebar .nav-group-toggle{width:100%;padding:9px 12px;font-size:var(--fs-sm)}
  .layout .sidebar .nav-sub{flex-direction:column;flex-wrap:nowrap;gap:2px;margin:4px 0 0;padding-left:10px;border-left:1px solid rgba(255,255,255,.12)}
  .layout .sidebar .nav-item-sub{padding:9px 10px;font-size:var(--fs-md)}
  .layout .sidebar .nav-group-auth.collapsed .nav-sub{display:none}

  /* 遮罩 */
  .mobile-nav-mask[hidden]{display:none}
  body.mobile-nav-open .mobile-nav-mask{
    display:block;position:fixed;inset:0;z-index:70;
    background:rgba(4,6,14,.62);backdrop-filter:blur(3px);
  }
  body.mobile-nav-open{overflow:hidden}

  /* —— 顶栏：第 1 行 ☰ + 页面标题，第 2 行操作 / 同步 / 用户 —— */
  .topbar{
    min-height:52px;flex-wrap:wrap;gap:6px var(--sp-2);
    padding:var(--sp-2) var(--sp-3);
  }
  .mobile-menu-btn{
    display:inline-flex;align-items:center;justify-content:center;
    flex:0 0 auto;width:34px;height:34px;border-radius:var(--r-sm);
    background:var(--c-panel-2);border:1px solid var(--c-line-2);
    color:var(--c-ink);font-size:15px;cursor:pointer;
  }
  .mobile-menu-btn:active{background:rgba(255,255,255,.14)}
  .topbar-left{flex:1 1 auto;min-width:0;gap:0}
  .topbar-title-box{flex:1 1 auto;flex-wrap:nowrap;min-width:0}
  .page-title{font-size:var(--fs-xl);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .page-crumb,.page-sub,.searchbox{display:none}
  .topbar-right{flex:0 1 auto;flex-wrap:wrap;justify-content:flex-start;gap:var(--sp-2)}
  .topbar-flags{display:none}
  .sync-badge{font-size:10px;padding:3px 8px;gap:5px}
  .topbar-right > .btn-mini-sync{display:none}
  .topbar-right #userRole{display:none}
  .user-chip{padding:3px 4px 3px 10px}
  .user-chip-name{font-size:var(--fs-xs);max-width:88px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .user-chip-out{width:22px;height:22px}

  /* —— 内容区：给底部标签栏留位置 —— */
  .content{
    padding:var(--sp-3) var(--sp-3)
            calc(var(--tabbar-h) + var(--sp-4) + env(safe-area-inset-bottom,0px));
  }
  .section{margin-bottom:var(--sp-3)}
  .notice-success,.notice-danger,.notice-warning,.notice-info{margin-bottom:var(--sp-3)}
  .grid{gap:var(--sp-3)}
  .card-head{padding:var(--sp-3) var(--sp-4)}
  .card-pad{padding:var(--sp-4)}
  /* KPI 行在手机上保留两列，避免一屏只放得下一张卡 */
  .grid-4,.grid-5{grid-template-columns:repeat(2,1fr)}
  .grid-2,.grid-3{grid-template-columns:1fr}
  .kpi{padding:14px 16px;min-height:88px}
  .kpi-value{font-size:24px}
  .kpi-value.kpi-date{font-size:18px}
  .table-wrap{-webkit-overflow-scrolling:touch}

  /* ============================================================
     R29 · 手机端列表卡片化（取代 R28 的「不做窄 + 横滑 + 首列固定」）
     ------------------------------------------------------------
     手机屏幕放不下 7–9 列的桌面表格：横滑只能算能用，字段还是散在一行里。
     这里把每条记录变成一张卡片、每个单元格变成「字段名 + 值」一行，
     字段名来自 app.js 自动写入的 td[data-label]（表头文字），
     所以不改任何业务渲染、也不会错位。
     ============================================================ */
  /* :is() 同时覆盖 .table-wrap（总览/账号/日志等）与 .pa-table-scroll（平台授权页账号表，
     6 列 717px 挤在 290px 里，是同一类问题） */
  :is(.table-wrap,.pa-table-scroll){border:0;background:none;overflow:visible;-webkit-overflow-scrolling:touch}
  :is(.table-wrap,.pa-table-scroll) table{display:block;width:100%;min-width:0}
  :is(.table-wrap,.pa-table-scroll) thead{display:none}   /* 列名已搬到每个单元格上，表头在手机上不再需要 */
  :is(.table-wrap,.pa-table-scroll) tbody{display:block}
  :is(.table-wrap,.pa-table-scroll) tbody tr{
    display:block;
    height:auto;                 /* 覆盖 data-layout.css 的 tbody tr{height:46px}，否则卡片被压成 46px 高、互相重叠 */
    min-height:0;
    background:var(--c-panel);
    border:1px solid var(--c-line);
    border-radius:var(--r-md);
    padding:10px 12px;
    margin:0 0 10px;
  }
  :is(.table-wrap,.pa-table-scroll) tbody tr:last-child{margin-bottom:0}
  :is(.table-wrap,.pa-table-scroll) tbody td{
    display:flex;align-items:flex-start;gap:10px;
    white-space:normal;position:static;background:none;box-shadow:none;
    padding:3px 0;border:0;font-size:var(--fs-md);line-height:1.5;
  }
  :is(.table-wrap,.pa-table-scroll) tbody td::before{
    content:attr(data-label);
    flex:0 0 70px;max-width:70px;
    color:var(--c-ink-3);font-size:var(--fs-xs);line-height:1.7;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  /* 没有字段名的单元格（空状态 / 跨列汇总行）不显示冒号标签 */
  :is(.table-wrap,.pa-table-scroll) tbody td:not([data-label]){display:block}
  :is(.table-wrap,.pa-table-scroll) tbody td:not([data-label])::before{content:none}
  :is(.table-wrap,.pa-table-scroll) tbody td > *{min-width:0}
  /* 资料块（粉丝/作品/获赞…）在卡片里排成两列，把 4 行压成 2 行，缩短卡片高度 */
  :is(.table-wrap,.pa-table-scroll) tbody td .dm-line{
    display:grid;grid-template-columns:1fr 1fr;gap:2px 8px;width:100%;
  }
  /* 卡片里纵向空间是够的：宁可换行也不要省略号，避免长数字被悄悄截掉 */
  :is(.table-wrap,.pa-table-scroll) tbody td .dm-item{white-space:normal;overflow:visible}
  /* 卡片里字段值换行更自然，长内容（作品标题 / 资料块）允许折行 */
  :is(.table-wrap,.pa-table-scroll) tbody td .dm-block,
  :is(.table-wrap,.pa-table-scroll) tbody td .dm-line{white-space:normal}
  :is(.table-wrap,.pa-table-scroll) tbody td .evidence-thumb{height:48px;max-width:120px}
  /* 平台授权页卡片里的操作按钮：整行铺开，避免挤在 290px 里互相压 */
  :is(.table-wrap,.pa-table-scroll) tbody td .btn{margin:0 6px 6px 0}
  /* 空状态与汇总行：退化成普通文字块，别包成卡片 */
  :is(.table-wrap,.pa-table-scroll) tbody tr.empty,
  :is(.table-wrap,.pa-table-scroll) tbody tr.tbl-count{
    background:none;border:0;padding:8px 2px;margin:0;
  }
  :is(.table-wrap,.pa-table-scroll) tbody tr.tbl-count td{color:var(--c-ink-3);font-size:var(--fs-sm)}

  /* F4 筛选条：手机端竖排，chips 单行横滑，搜索框整宽，结果数右对齐 */
  .filterbar{flex-direction:column;align-items:stretch;gap:10px}
  .filterbar .filter-sep{display:none}
  .filterbar .chips{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding-bottom:2px}
  .filterbar .chips .chip{flex:0 0 auto}
  .filterbar .filter-search{width:100%}
  .filterbar .filter-search input{width:100%}
  .filterbar .result-count{margin-left:0;white-space:nowrap;align-self:flex-end;text-align:right}

  /* —— 底部标签栏：图标 + 文字，5 等分 —— */
  #mobileBottomNav{
    position:fixed;left:0;right:0;bottom:0;z-index:60;
    display:flex;align-items:stretch;gap:0;margin:0;
    height:calc(var(--tabbar-h) + env(safe-area-inset-bottom,0px));
    padding:0 4px env(safe-area-inset-bottom,0px);
    background:linear-gradient(180deg,rgba(8,11,22,.86),rgba(8,11,22,.98));
    border-top:1px solid var(--c-line);
    backdrop-filter:blur(14px);
  }
  #mobileBottomNav > a,#mobileBottomNav > button{
    flex:1 1 0;min-width:0;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    padding:6px 2px;border:0;border-radius:0;background:none;
    color:var(--c-ink-3);font-size:10px;font-weight:500;line-height:1.1;
    text-decoration:none;white-space:nowrap;cursor:pointer;
    -webkit-tap-highlight-color:transparent;
  }
  #mobileBottomNav svg{width:19px;height:19px;flex:none}
  #mobileBottomNav > a.active,#mobileBottomNav > button.active{color:#fff}
  #mobileBottomNav > a.active svg,#mobileBottomNav > button.active svg{filter:drop-shadow(0 0 8px rgba(109,139,255,.7))}
  #mobileBottomNav > a.active::after,
  #mobileBottomNav > button.active::after{
    content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:3px;
    width:18px;height:2px;border-radius:2px;background:var(--c-brand);
  }
  #mobileBottomNav > a,#mobileBottomNav > button{position:relative}
}

/* 超窄屏（≤380px）：KPI 回到单列，避免数字换行 */
@media(max-width:380px){
  .grid-4,.grid-5{grid-template-columns:1fr}
  #mobileBottomNav > a,#mobileBottomNav > button{font-size:10.5px;padding:6px 0}
}

/* 中等桌面（769–1599px）：顶栏两行，避免 1440 下右侧控件溢出被裁 */
@media(min-width:769px) and (max-width:1599px){
  .topbar-flags{display:none}
  .topbar-right > .btn-mini-sync{display:none}
  .topbar-left{flex:1 1 auto}
}

@media (prefers-reduced-motion:reduce){
  .layout .sidebar{transition:none}
}

/* ============================================================
   R30 · 桌面端排版可读性（≥769px）
   ------------------------------------------------------------
   老板反馈「电脑端排版很差、文字挤到一堆」。1440 实测出的三个具体毛病：
     1) 运营建议中心 .oc-ev / .oc-act 一行铺满 1082px，最长一行 92 个汉字，
        眼睛要从左扫到右再折回来 —— 这是「挤到一堆」的真实原因（不是行距）。
     2) .oc-act「建议动作」蓝色块宽 1082px，文字只占 266–373px，
        右边一大片空色块（宽出 2.9–4.1 倍）。
     3) .oc-item 没做两栏：优先级/状态徽章被挤到主内容下方左侧，
        「已处理」勾选独占一行压在标题上方，每项硬撑到 168px。
   所以这一层只做三件事：限制正文行宽、让色块贴住内容、把行动项改成两栏。
   手机端（≤768px）不受影响。
   ============================================================ */
:root{
  /* 阅读宽度：ch 是「0」的宽度，中文约等于 0.5 字宽 → 92ch ≈ 一行 46 个汉字 */
  --read-w:92ch;
}

@media(min-width:769px){
  /* D1 正文别铺满整屏：一行控制在 45–55 个汉字 */
  .card-sub,.d-desc,.health-text,.kpi-foot,.ds-sub,
  .sc-note,.sc-snap-line,.rf-note,.rf-v,.rf-desc,
  .oc-ev,.oc-act,.oc-title,.oc-zone,
  .card-pad > p,.rp-desc{
    max-width:var(--read-w);
  }
  /* 表格单元格里的说明文字同理（但保留单元格本身宽度，避免表格塌陷） */
  td .card-sub,td .d-desc,td .health-text{max-width:var(--read-w)}

  /* D2 行动项的「建议动作」色块贴住内容，不再横跨整行留一大片空 */
  .oc-act{
    display:inline-block;
    width:fit-content;
    max-width:min(100%,var(--read-w));
  }
  .oc-ev{max-width:min(100%,var(--read-w))}

  /* D3 行动项两栏：左边「标题 / 证据 / 动作」，右边「优先级 · 状态 + 已处理勾选」 */
  .oc-item{
    display:flex;flex-wrap:wrap;align-items:flex-start;
    gap:8px 18px;
  }
  .oc-main{order:1;flex:1 1 420px;min-width:0}
  .oc-meta{order:2;flex:0 0 auto;align-self:flex-start;margin-top:2px}
  .oc-check{order:3;flex:0 0 auto;align-self:flex-start;margin-left:auto;margin-top:2px}

  /* ------------------------------------------------------------
     D4 桌面表格：不再被「压窄」也不再把页面撑出横向滚动
     实测（1440）：
       - data-ux.css 的 .table-wrap table{min-width:680px} 让表格在
         .grid-2 的半宽卡片（569px）里必定溢出 → 7 张表要左右拖才看得全；
       - 不设列宽下限时，最窄的表头列只有 38px（内容页「#」列）、
         说明列被压到 97px、文字折成 7 行。
     改法：min-width 取「680 与容器宽」的较小值（宽容器仍不被压，窄容器不再溢出），
          给单元格一个 84px 下限，说明列放宽上限；
          列数 ≥6 的表所在两列卡片改成整宽（半宽塞 6 列必挤）。
     ------------------------------------------------------------ */
  .table-wrap table{min-width:min(680px,100%)}
  .table-wrap th,.table-wrap td{min-width:84px}
  .table-wrap .col-maxw-260{min-width:200px;max-width:420px}
  .table-wrap .dm-block{min-width:170px}
  .grid-2:has(.table-wrap thead th:nth-child(6)){grid-template-columns:1fr}
  /* 资料块（粉丝/作品/获赞/关注）在窄列里按两列排，5 个小项从 6 行降到 3 行 */
  .table-wrap td .dm-line{display:grid;grid-template-columns:1fr 1fr;gap:2px 10px}
  /* 没有 class 的纯文字说明行（如数据源页 notice 里的「A 官方OAuth / B 第三方…」
     和数据源页的路径说明）也别铺满整屏；:not(:has(*)) 保证只作用在纯文本块上，
     不会误伤用 div 当容器的布局 */
  #view .content-inner div:not([class]):not(:has(*)){max-width:var(--read-w)}
  /* 资料块里的「资料已采集」徽章原先被拉成整列宽（188–343px 的空胶囊），改成贴内容 */
  .table-wrap td .dm-block{align-items:flex-start}
  .table-wrap td .dm-line{width:100%}
}

/* 1280 这一档表格横向空间紧：单元格左右内边距从 14px 收到 10px，
   省出的宽度留给文字（否则 8 列的账号表会超出容器 4px、冒出横向滚动条） */
@media(min-width:769px) and (max-width:1399px){
  .table-wrap th,.table-wrap td{padding-left:10px;padding-right:10px}
}

/* ============================================================
   R28 · 移动端文字/字段排版修复（2026-09-11）
   F2 句子型统计块：整句一行（原先被 .ds-stat{flex-direction:column} 竖排切成 3 行）
   ============================================================ */
.ds-stat-line,.ds-stats .ds-stat-line{
  display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 6px;
  /* 正文钉在全站正文刻度 14px：datasource 页的统计条原先从 notice 继承 12px，
     12px 正文 + 16px <b> 的 em-box 顶边差 3px（实测 177.38 vs 174.38），超出脚本 2px 容差仍判 2 行 */
  font-size:var(--fs-lg);
}
.ds-stat-line b{font-size:var(--fs-xl);font-weight:800;color:var(--c-ink);line-height:1.2}

/* 证据截图缩略图：原先全站无样式，原图（1440×900）会把表格行撑爆；点击仍走 openLightbox 看原图 */
.evidence-thumb{display:block;height:56px;width:auto;max-width:140px;border-radius:8px;cursor:zoom-in}

/* ============================================================
   F3 行高：正文 1.6，胶囊/按钮 1.45（原先多数元素是 normal≈1.2，多行说明挤成一坨）
   ============================================================ */
body{line-height:1.6}
button,input,select,textarea{line-height:1.6}
.badge,.chip,.platform-tag,.btn,.tag,.pill{line-height:1.45}
.card-sub,.d-desc,.health-text,.notice,.ds-sub,.rf-v,.rf-note,.rf-code,.rf-dry-empty,
.sc-note,.sc-snap-line,.kpi-foot,td,.table-wrap td{line-height:1.6}
/* 大号数字例外 */
.kpi-value,.ds-stat .n,.kpi .n,td.num,td.mono{line-height:1.35}

/* ============================================================
   R31 · 补齐「有结构但一条 CSS 都没有」的组件样式
   ------------------------------------------------------------
   老板反馈「数据获取源页面文字全部挤在一堆」。用「页面用到的 class × 样式表里
   定义过的 class」对了一遍，发现 40 多个类名**在全部 9 个样式层里一条规则都没有**：
     .path-row/.path-code/.path-main/.path-name/.path-short/.path-meta/.lvl   ← 数据路径选择器 A–E 列表
     .rf-card/.rf-head/.rf-row/.rf-k/.rf-v/.rf-fields/.rf-codes/...          ← RedFox 数据获取源卡
     .ds-card/.ds-head/.ds-name/.ds-sub/.ds-block/.ds-block-title
     .dy-sub(104 处)/.sc-rowlink(101)/.sc-rank(39)/.work-title(55)/.mcell(33)
     .rad-*、.rp-*、.lg-*、.health-*、.d-row/.k/.v、.pager-*、.bs-it-*
   还有 .stack-col/.gap-10/.flex-1/.grow/.mt-12 这类「以为有工具类」的写法。
   没有样式时，标签和值会直接连成一行、块级元素随机断行 —— 看起来就是「挤在一堆」。
   本节按现有深色主题补齐这些组件，使全站观感一致。
   ============================================================ */

/* ---------- 1. 小工具类（此前只写在 HTML 里，从未定义） ---------- */
.chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-width:0}
.filter-sep{flex:none;width:1px;height:22px;background:var(--c-line-2);margin:0 2px}
.tbl-count td{padding-top:10px;color:var(--c-ink-3);font-size:var(--fs-sm)}
/* 行动项的三个子块：只在电脑端媒体查询里定义过，手机上等于没样式 */
.oc-main{min-width:0}
.oc-check{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-sm);color:var(--c-ink-3);cursor:pointer;white-space:nowrap;flex:none}
.oc-check input{accent-color:var(--c-brand)}
.oc-zone{display:inline-flex;align-items:center;padding:1px 8px;border-radius:999px;background:var(--c-panel-2);color:var(--c-ink-2);font-size:var(--fs-xs);font-weight:600;margin-right:6px}
.stack-col{display:flex;flex-direction:column}
.gap-8{gap:8px}
.gap-10{gap:10px}
.gap-12{gap:12px}
.flex-1,.grow{flex:1 1 auto;min-width:0}
.mt-4{margin-top:4px}
.mt-8{margin-top:8px}
.mt-12{margin-top:12px}
.mt-16{margin-top:16px}
.clickable{cursor:pointer}
.col-minw-220{min-width:220px}

/* ---------- 2. 通用小元素 ---------- */
.notice-title{font-weight:650;color:var(--c-ink);margin-bottom:2px}
.notice-warn{background:rgba(251,191,36,.10);border-color:rgba(251,191,36,.30)}
.notice-green{background:rgba(52,211,153,.10);border-color:rgba(52,211,153,.28)}
.filter-label{flex:none;font-size:var(--fs-md);color:var(--c-ink-3);white-space:nowrap}
.dy-sub{display:block;margin-top:3px;font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;overflow-wrap:anywhere}
.dot-purple{background:var(--c-brand-2)}
.up{color:#7ee2b3;font-weight:600}
.bad{color:#fca5a5;font-weight:600}
.p-shipinhao{color:#7ee2b3}
.p-bilibili{color:#93c5fd}
.pager{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:12px;flex-wrap:wrap}
.pager-info{font-size:var(--fs-sm);color:var(--c-ink-3);margin-right:auto}
.pager-btns{display:inline-flex;align-items:center;gap:6px}
.pager-ellipsis{color:var(--c-ink-3);padding:0 4px}
.tbl-foot{font-size:var(--fs-sm);color:var(--c-ink-3)}
.bar-label{font-size:var(--fs-sm);color:var(--c-ink-2)}

/* 进度/健康度小列表（总览、账号分析、报告、数据中心都在用） */
.health-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px 18px}
.health-item{display:flex;align-items:flex-start;gap:8px;min-width:0;padding:4px 0}
.health-item .dot{margin-top:6px}
.health-body{min-width:0}
.health-label{font-weight:650;font-size:var(--fs-md);line-height:1.5}
.health-text,.health-sub{font-size:var(--fs-sm);color:var(--c-ink-2);line-height:1.6;margin-top:2px;overflow-wrap:anywhere}

/* 「字段名 + 值」两列行（账号详情抽屉、内容页）
   —— 没有样式时标签和值会连成一句话，这是「字段排版乱」的典型来源 */
.d-row{display:grid;grid-template-columns:92px minmax(0,1fr);gap:4px 12px;align-items:start;padding:6px 0;border-bottom:1px solid var(--c-line)}
.d-row:last-child{border-bottom:0}
.d-row .k{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.7}
.d-row .v{min-width:0;font-size:var(--fs-md);color:var(--c-ink-2);line-height:1.7;overflow-wrap:anywhere}

/* ---------- 3. 数据获取源页 ---------- */
/* 3.1 平台卡头 */
.ds-card .ds-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--c-line)}
.ds-card .ds-head-left{display:flex;align-items:center;gap:12px;min-width:0}
.ds-name{font-size:var(--fs-lg);font-weight:650;line-height:1.6}
.ds-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;margin-top:2px;overflow-wrap:anywhere}
.ds-block{padding:10px 12px}
.ds-block-title{font-size:var(--fs-sm);color:var(--c-ink-3);font-weight:600;letter-spacing:.3px;margin-bottom:6px}

/* 3.2 「五条数据路径」列表：A/B/C/D/E 行
   结构 = 编号 | 名称+说明 | 等级+状态 | 箭头；此前无样式，四项挤成一行文字 */
.path-row{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:var(--r-sm);cursor:pointer;transition:background .15s}
.path-row + .path-row{border-top:1px solid var(--c-line)}
.path-row:hover{background:rgba(255,255,255,.045)}
.path-row:focus-visible{outline:2px solid var(--c-brand);outline-offset:1px}
.path-code{flex:0 0 26px;height:26px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;background:var(--c-panel-2);color:var(--c-ink);font-weight:700;font-size:var(--fs-sm)}
.path-main{flex:1 1 auto;min-width:0}
.path-name{font-size:var(--fs-md);font-weight:600;color:var(--c-ink);line-height:1.6}
.path-short{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;margin-top:2px;overflow-wrap:anywhere}
.path-meta{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px}
.path-arrow{flex:0 0 auto;color:var(--c-ink-3)}
.lvl{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:var(--fs-xs);font-weight:700;white-space:nowrap;line-height:1.5}
.lvl-L0{background:rgba(148,163,184,.16);color:var(--c-ink-2)}
.lvl-L1{background:rgba(251,191,36,.16);color:#fcd68a}
.lvl-L2{background:rgba(52,211,153,.16);color:#7ee2b3}

/* 3.3 RedFox 数据获取源卡：状态/可补全字段/接入方式… 六个「字段名 + 值」 */
.rf-card{margin-bottom:var(--sp-5)}
.rf-head{padding:14px 16px;border-bottom:1px solid var(--c-line)}
.rf-brand{font-size:var(--fs-xs);font-weight:700;letter-spacing:2px;color:var(--c-ink-3)}
.rf-head-main{margin-top:2px}
.rf-title{font-size:var(--fs-lg);font-weight:650;line-height:1.6}
.rf-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;margin-top:2px}
.rf-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.rf-body{display:flex;flex-direction:column;gap:12px;padding:14px 16px}
.rf-row{display:grid;grid-template-columns:104px minmax(0,1fr);gap:2px 14px;align-items:start}
.rf-k{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.7;white-space:nowrap}
.rf-v{min-width:0;font-size:var(--fs-md);color:var(--c-ink-2);line-height:1.7;overflow-wrap:anywhere}
.rf-fields{display:flex;flex-wrap:wrap;gap:6px}
.rf-field{display:inline-flex;padding:2px 9px;border-radius:999px;background:var(--c-panel-2);color:var(--c-ink-2);font-size:var(--fs-xs);line-height:1.6}
.rf-note{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.65;margin-top:6px}
.rf-codes{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.rf-code{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;background:var(--c-panel-2);color:var(--c-ink-2);font-size:var(--fs-xs);line-height:1.6;white-space:nowrap}
.rf-dry{margin-top:12px;padding-top:12px;border-top:1px solid var(--c-line)}
.rf-dry-label{font-size:var(--fs-md);font-weight:600;color:var(--c-ink);margin-bottom:4px}
.rf-dry-empty{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.65}
.rf-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}

/* ---------- 4. 账号排行/作品榜（数据中心、账号分析、内容作战室） ---------- */
.sc-rowlink{cursor:pointer}
.sc-rowlink:hover td{background:rgba(109,139,255,.06)}
.sc-rank{color:var(--c-ink-3);font-weight:600}
/* 注意：表格里不能用 white-space:nowrap —— 那会让该列的最小宽度等于整段文字，
   整张表被撑宽、页面出现横向滚动。这里只限宽，让标题自然折行即可。 */
.sc-title-cell{max-width:420px}
.sc-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.5;margin-top:2px}

/* ---------- 5. 内容作战室：作品标题 + 数据可得性标记 ---------- */
.work-title{max-width:460px}
.mcell{display:inline-flex;align-items:center;padding:1px 9px;border-radius:999px;font-size:var(--fs-xs);font-weight:600;line-height:1.6;white-space:nowrap}
.m-ok{background:rgba(52,211,153,.14);color:#7ee2b3}
.m-part{background:rgba(251,191,36,.14);color:#fcd68a}
.m-pri{background:rgba(96,165,250,.14);color:#93c5fd}
.m-ban{background:rgba(248,113,113,.14);color:#fca5a5}
.m-no{background:rgba(255,255,255,.06);color:var(--c-ink-3)}
.bs-it-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px}
.bs-it-tile{padding:14px 16px}
.bs-it-label{display:flex;flex-wrap:wrap;gap:6px}
.bs-it-num{font-size:var(--fs-num);font-weight:750;font-variant-numeric:tabular-nums;line-height:1.2;margin-top:6px}
.bs-it-foot{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;margin-top:4px}
.matrix{display:flex;flex-wrap:wrap;gap:8px}
.legend{display:flex;flex-wrap:wrap;gap:12px;align-items:center;font-size:var(--fs-sm);color:var(--c-ink-2)}

/* ---------- 6. 热点雷达 ---------- */
.rad-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--c-line)}
.rad-head-left{display:flex;align-items:center;gap:12px;min-width:0}
.rad-name{font-size:var(--fs-lg);font-weight:650;line-height:1.6}
.rad-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;margin-top:3px}
.rad-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;padding:14px 16px}
.rad-col-title{font-size:var(--fs-sm);font-weight:650;color:var(--c-ink-2);letter-spacing:.3px;margin-bottom:8px}
.rad-list{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:var(--fs-md);color:var(--c-ink-2);line-height:1.65}
.rad-note{font-size:var(--fs-md);color:var(--c-ink-2);line-height:1.65}
.rad-src{padding:8px 10px;border-radius:var(--r-sm);background:rgba(255,255,255,.03);border:1px solid var(--c-line)}
.rad-src-name{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--fs-md);font-weight:600;color:var(--c-ink)}
.rad-src-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6;margin-top:3px}
.rad-foot{padding:12px 16px;border-top:1px solid var(--c-line);font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.65}

/* ---------- 7. 报告中心 ---------- */
.rp-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.rp-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap;min-width:0}
.rp-note{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.6}
.rp-head{padding:16px 20px;border-bottom:1px solid var(--c-line)}
.rp-title{font-size:var(--fs-xl);font-weight:650;line-height:1.45}
.rp-sub{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.65;margin-top:5px}
.rp-kpis{gap:12px}
.rp-todo{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.rp-todo li{position:relative;padding-left:16px;font-size:var(--fs-md);color:var(--c-ink-2);line-height:1.7}
.rp-todo li::before{content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--c-brand)}
.rp-todo li b{color:var(--c-ink)}

/* ---------- 8. 采集指挥台：数据源卡与最近批次 ---------- */
.lg-src{padding:16px 18px}
.lg-st{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.lg-desc{font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.65;margin-top:8px;overflow-wrap:anywhere}
.lg-batch{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;align-items:baseline;padding:11px 0;border-bottom:1px solid var(--c-line)}
.lg-batch:last-child{border-bottom:0}
.lg-batch-name{display:flex;align-items:center;gap:8px;font-size:var(--fs-md);font-weight:600;color:var(--c-ink);min-width:0}
.lg-batch-desc{grid-column:1 / -1;font-size:var(--fs-sm);color:var(--c-ink-3);line-height:1.65;overflow-wrap:anywhere}
.lg-batch-time{font-size:var(--fs-sm);color:var(--c-ink-3);white-space:nowrap}

/* ---------- 9. 窄屏兜底：两列字段行改为上下堆叠 ---------- */
.p-douyin{--pt:#fe2c55}
.p-xiaohongshu{--pt:#ff2442}
.p-shipinhao{--pt:#12b76a}
.p-bilibili{--pt:#00a1d6}
.platform-tag[class*="p-"]{border-left:3px solid var(--pt,transparent);padding-left:7px}
.rad-card{margin-bottom:var(--sp-5)}
.rad-col{min-width:0}
.rp-sheet{margin-bottom:var(--sp-5)}
.pa-mod-label{font-size:var(--fs-sm);font-weight:650;color:var(--c-ink-2);letter-spacing:.3px;margin-bottom:6px}

/* ============================================================
   R33 · 筛选标签（chip）视觉重做 + 筛选条容器
   ------------------------------------------------------------
   老板反馈「只是增加了一点间距，美观度还是不行」。实测（1440）确认三条硬伤：
     1) .chip 的 padding 是 0px —— 文字紧贴胶囊圆角边，胶囊宽度就等于文字宽度，
        看起来不像"可以点的标签"，像一排挨着的文字；
     2) 未选中的 chip 带着**浏览器默认的 2px outset 立体边框**
        （和 R30 修过的 .btn 同一个坑，当时漏了 .chip）；
     3) 选中态只换背景，字重/字号不变，计数与标签同字号同色 → 看不出层级。
   改法：给 chip 完整形态（高 34 / 左右内边距 14 / 1px 描边 / 悬停 / 选中加粗），
        计数降一级字号与透明度；筛选条本身铺一层浅底卡，让整排标签有容器感。
   ============================================================ */
.filterbar{
  padding:12px 16px;
  background:var(--c-panel);
  border:1px solid var(--c-line);
  border-radius:var(--r-md);
}
.chip{
  height:34px;padding:0 14px;
  display:inline-flex;align-items:center;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
  color:var(--c-ink-2);
  font-size:var(--fs-md);font-weight:500;
  border-radius:999px;box-sizing:border-box;
  transition:background .16s,color .16s,border-color .16s,box-shadow .16s,transform .14s;
}
.chip:hover{background:rgba(255,255,255,.10);color:var(--c-ink);border-color:rgba(255,255,255,.24);transform:none;box-shadow:none}
.chip.active,.chip.act{
  background:linear-gradient(135deg,#6d8bff,#8b5cf6);
  border-color:transparent;color:#fff;font-weight:650;
  box-shadow:0 6px 16px -8px rgba(109,139,255,.8);
}
.chip.active:hover,.chip.act:hover{background:linear-gradient(135deg,#7b96ff,#9a6cff);color:#fff}
.chip .chip-count{margin-left:7px;font-size:var(--fs-sm);font-weight:600;opacity:.72;font-variant-numeric:tabular-nums}
.chip.active .chip-count,.chip.act .chip-count{opacity:.95}
/* 计数为 0 的标签（如「视频号 0」「B站 0」）淡化，选中的除外 —— 否则它们和有数据的标签一样抢眼 */
.chip.is-zero{opacity:.45}
.chip.is-zero:hover{opacity:.8}
.chip.is-zero.active,.chip.is-zero.act{opacity:1}

@media(max-width:768px){
  /* 手机端给卡片副标题多一行（原来统一 3 行截断，内容页那条正好差一行） */
  .card-sub,.d-desc{-webkit-line-clamp:4}
  .filterbar{padding:10px 12px}
  .chip{height:32px;padding:0 12px}
  .d-row,.rf-row{grid-template-columns:1fr;gap:2px}
  .d-row .k,.rf-k{white-space:normal}
  .path-row{align-items:flex-start;gap:10px}
  .path-meta{flex-direction:column;align-items:flex-end;gap:6px}
  .rad-grid{grid-template-columns:1fr}
  .health-grid{grid-template-columns:1fr}
  .lg-batch{grid-template-columns:1fr}
  .lg-batch-time{white-space:normal}
}