/* ============================================================
 * CRM/统一门户 共享样式底座（整改 2026-09-04）
 * 品牌/语义色与视觉 token 的唯一权威来源。各页面原有 <style>
 * 如需保留，必须引用本文件中的同名变量取值，禁止另起炉灶。
 * 主色统一：#2b5fa8（唯一品牌蓝，弃用 #3d7ec4 等其它蓝色）
 * SABC 分级语义色：S=金 #b8860b / A=红 #c0392b / B=蓝 #2b5fa8
 * ============================================================ */
:root{
  /* 品牌 */
  --blue:    #2b5fa8;            /* 唯一品牌主色 */
  --blue-d:  #1b4a8a;            /* 主色加深（hover/深底） */
  --blue-l:  #eaf1fb;            /* 主色浅底（选中/标签底） */

  /* 语义分级色（跨系统统一：S=金 / A=红 / B=蓝 / C=中性灰） */
  --sabc-s:  #b8860b;
  --sabc-a:  #c0392b;
  --sabc-b:  #2b5fa8;
  --sabc-c:  #8a97a6;

  /* 中性色 */
  --bg:      #eef2f7;
  --card:    #ffffff;
  --txt:     #1f2a37;
  --muted:   #6b7a8c;
  --border:  #e3e8ef;

  /* 状态色 */
  --ok:      #2e7d32;
  --warn:    #b7791f;
  --danger:  #c0392b;

  /* 字号刻度（正文基准 14px） */
  --fs-xs:   12px;
  --fs-s:    13px;
  --fs-m:    14px;
  --fs-l:    16px;
  --fs-xl:   20px;
  --fs-xxl:  26px;

  /* 间距 8px 倍数 */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px;
  --sp-4: 16px; --sp-5: 24px; --sp-6: 32px;

  /* 圆角（卡片 10px / 按钮 6px / 输入框 6px） */
  --radius:     10px;
  --radius-btn: 6px;
  --radius-sm:  4px;
}

/* ---- 按钮（36px 基准高度，主/次/危险/小号） ---- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px;
      height:36px; padding:0 16px; border:none; border-radius:var(--radius-btn);
      font-size:var(--fs-m); line-height:1; cursor:pointer; text-decoration:none;
      transition:filter .15s, opacity .15s; box-sizing:border-box; }
.btn:disabled{ opacity:.55; cursor:not-allowed; }
.btn:focus-visible{ outline:2px solid var(--blue); outline-offset:1px; }
.btn-primary{ background:var(--blue); color:#fff; }
.btn-primary:hover:not(:disabled){ background:var(--blue-d); }
.btn-secondary{ background:#eef1f6; color:var(--txt); border:1px solid var(--border); }
.btn-danger{ background:var(--danger); color:#fff; }
.btn-sm{ height:30px; padding:0 12px; font-size:var(--fs-s); }

/* ---- SABC 分级标签 ---- */
.lvl{ display:inline-flex; align-items:center; justify-content:center;
      min-width:22px; height:22px; padding:0 6px; border-radius:var(--radius-sm);
      font-size:var(--fs-xs); font-weight:600; color:#fff; }
.lvl-s{ background:var(--sabc-s); }
.lvl-a{ background:var(--sabc-a); }
.lvl-b{ background:var(--sabc-b); }
.lvl-c{ background:var(--sabc-c); }

/* ---- 表格/卡片通用 ---- */
.card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); padding:var(--sp-4); }
.muted{ color:var(--muted); }
.num{ font-variant-numeric: tabular-nums; }

/* 提示横幅（驾驶舱 partial 提示等） */
.partial-banner{ display:none; margin:var(--sp-3) 0; padding:var(--sp-2) var(--sp-4);
                 background:#fdf3e7; color:var(--warn); border:1px solid #f0d9b5;
                 border-radius:var(--radius-btn); font-size:var(--fs-s); }
body.partial .partial-banner{ display:block; }

/* ============================================================
 * 视觉收敛基座（0.72.180 · 2026-10-05）
 * ------------------------------------------------------------
 * 老贺授权「按 C 方案改全站 + 首页驾驶舱深改 + 全站禁动画」。
 * 本段只做三件事，不新增任何 token 命名（避免和 18 页已有变量打架）：
 *   ① 圆角归并 —— 全站 14 档收敛为 3 档（4 标签 / 6 控件 / 10 卡片）
 *   ② 阴影补齐 —— 9 个原本零阴影的页面让卡片浮起来
 *   ③ 禁动画   —— 交互态改为瞬时（老贺：带动画加载慢）
 *
 * ⚠️ 全部用 :where() 零特异性，页面自身的 :root 与类不会被顶掉。
 * ⚠️ 类名来自 18107 端口真机实测（不是我猜的），见下方各处注释。
 * ============================================================ */

/* ---- ① 圆角归并：把散落的 3/5/7/8/9/12/13/14/50px 拉回三档 ---- */
/* 卡片类（真机实测类名：deal / ann-card / kpi / hero / cli-card / monthbar / tz …） */
:where(.deal, .ann-card, .kpi, .hero, .cli-card, .monthbar, .tz, .kgrp, .kbody,
       .card, .panel, .box, .stat, .sec, .ff-card, .modal-body, .rank-item){
  border-radius: var(--radius) !important;      /* 10px —— 卡片 */
}
/* 控件类 */
:where(.btn, .tab, .pill, .lvl, .row-btn, .btn-sm, input, select, textarea, .sabc-tag){
  border-radius: var(--radius-btn) !important;  /* 6px —— 控件 */
}
/* 标签/色块类：排名条、进度条、分段条（真机：rank-bar / rank-fill / bar-fill） */
:where(.tag, .dot, .badge, .rank-bar, .rank-fill, .bar, .bar-fill){
  border-radius: var(--radius-sm) !important;   /* 4px —— 标签 */
}

/* ---- ② 阴影补齐：极浅一层，只在「白卡片落在灰底上」时出现 ---- */
:where(.deal, .kgrp, .card, .panel, .box, .ann-card, .kpi, .hero, .cli-card){
  box-shadow: 0 1px 2px rgba(27,42,74,.045);
}
/* 分组行/主卡浮得稍明显，与内部卡片拉开层次 */
:where(.kgrp, .panel, .ff-card, .hero, .ann-card){
  box-shadow: 0 1px 3px rgba(27,42,74,.055);
}

/* ---- ③ 禁动画：老贺 2026-10-05「一带动画加载就很慢」----
   保留 loading 转圈与 skeleton 微光（它们在传达"正在加载"，删了会丢信息），
   其余过渡一律 0s。 */
:where(.btn, .tab, .pick, .deal, .kgrp, .kbody, .card, .modal, .lvl, .ann-card, .kpi){
  transition: none !important;
}
/* hover 反馈改成瞬时，避免"鼠标移上去有 0.2s 延迟"的黏滞感 */
:where(a, button, .tab, .row-btn, .kv, .deal, .ann-card):hover{ transition: none !important; }

/* ---- ④ 手机端单独一套（0.72.182 重写）----
   ⚠️ 上版（0.72.180）为什么没收敛成功？实测发现两个漏网：
     ① **漏了原生 `<button>` 元素** —— 手机端 button 横跨 4 档
        （8px×7 / 10px×2 / 14px×23 / 16px×2），23 个是 14px，量最大却完全没被覆盖；
     ② 类名清单凭印象写，漏了 `mod`(13px×10) / `ac`(10px×2) / `kpi` / `badge`(4px×20) / `st` / `go`(50px)，
        而我新加的 12px 又引入了新档 ⇒ 档位数不降反增（7→8）。
   ⇒ 本版按 **18113 端口 9 个手机页全量实测**的类名 + 元素类型重写，归并到 4 档：
      微标签 4px / 控件 8px / 卡片 12px / 药丸 999px
   ⚠️ 用 @media 包住：`button`/`input` 是通用元素，不限定会误伤 PC 页面的 6px 控件圆角。
   768px 覆盖手机 + iPad 竖屏。 */
@media (max-width: 768px){
  /* ① 微标签 → 4px（实测 4px 共 27 处：badge×20 / st×7；3px 的 I×14 一并并入） */
  :where(.badge, .st, .pill, .tag, .lvl, i, .tiny, .xs){
    border-radius: 4px !important;
  }
  /* ② 控件 → 8px（实测真实分布：6px INPUT×14/8px BUTTON×7/10px×2/14px BUTTON×23/16px×2） */
  :where(button, .btn, .btn-sm, input, select, textarea,
         .chip, .gn, .dir, .pdfbtn, .on, .save, .more, .submit,
         .ai-days-btn, .add-tip, .tab, a, img){
    border-radius: 8px !important;
  }
  /* ③ 卡片 → 12px（实测 10/12/13/14px 四档在这里：mod×10 是 13px、ac/kpi 是 10px、ai-card/hero-mod 是 14px） */
  :where(.card, .grp, .fcard, .cd, .dy, .mod, .ac, .kpi, .ic, .arr,
         .ai-card, .hero-mod, .tabs, .mobar, .dbar, .wkbar, .sec, .kbody){
    border-radius: 12px !important;
  }
  /* ④ 药丸型（进度条/圆点/圆形头像）保持全圆：实测 bar×14 / no×7 / go(50px)×1 */
  :where(.bar, .fill, .no, .dot, .go, .avatar, .sw, .progress){
    border-radius: 999px !important;
  }
  /* 手机端卡片浮起 */
  :where(.grp, .fcard, .cd, .dy, .card){
    box-shadow: 0 1px 2px rgba(27,42,74,.05);
  }
}
/* 手机端折叠箭头的 0.2s 过渡也去掉（.arr / .ar 是展开动画） */
:where(.arr, .ar, .grp, .fcard, .cd){ transition: none !important; }


/* ---- ⑤ 第二轮补漏（18107 真机复扫发现的漏网类名）---- */
/* 动画残留：首页 entry-card / wb-card、周报 week-tab、实验台 kcar（渠道箭头） */
:where(.entry-card, .wb-card, .week-tab, .kcar, .car, .mcard, .kitem){
  transition: none !important;
}
/* 圆角残留：monthly 的 A 标签 14px、owner-ti 5px、weekly 50px 圆点 */
:where(.owner-ti, .taginput, .ti){ border-radius: var(--radius-sm) !important; }
.monthly :where(a, .lnk):not([class]){ border-radius: var(--radius-sm) !important; }
/* 实验台渠道箭头是旋转三角形，本体不参与圆角计算 */
:where(.kcar, .car){ border-radius: 0 !important; }

/* ---- ⑥ 兜底：禁动画总闸（老贺「一带动画加载就很慢」）----
   ⚠️ 实测教训：前面几轮按类名逐个打地鼠，永远补不全 ——
   `entry-card` / `wb-card` 的动画定义在 portal.py 与 app.py 的**后端注入 HTML 字符串**里，
   CSS 文件中搜不到；且页面内联 <style> 加载在 _shared.css 之后，同优先级下会赢。

   ⇒ 改用**属性选择器 + !important**（特异性 0,1,0，但 !important 优先级高于一切非 important），
      这是唯一能压过页面内联写法的办法。

   ⚠️ 白名单必须保留「正在加载」反馈（按钮转圈 / 骨架微光）——
      实测 `animation:none` 会让按钮的转圈消失，用户点提交后看不到任何反馈。已踩坑，已修正。 */
:where(*, *::before, *::after){
  transition: none !important;
}
/* 先全禁动画，再单独把「加载反馈」捞回来（顺序不能反） */
:where(*, *::before, *::after){
  animation: none !important;
}
/* 白名单 ①：按钮 loading 转圈（app.css button.loading::after，定义在 static/app.css） */
button.loading::after,
.btn.loading::after,
.loading::after{
  animation: spin .7s linear infinite !important;
}
/* 白名单 ②：骨架屏微光 */
.skeleton{
  animation: shimmer 1.5s infinite !important;
  background: linear-gradient(90deg,#eef2f7 25%,#e3e6f0 50%,#eef2f7 75%);
  background-size: 200% 100%;
}
/* 登录页 loading（index.html 自己定义的 bootspin）*/
.bootspin, .bootspin *{ animation: bootspin .9s linear infinite !important; }

/* ---- ⑦ 手机端字号阶梯（18107 真机实测：9.5px~34px 共 12 档）----
   手机端碎档比 PC 严重（0.72.180 实测）。做法与 PC 同理：
   **只提标题、正文不动** —— 手机屏幕小，正文放大代价远大于 PC。
   分档：正文 13px / 次要 12px / 标签 11.5px / 标题 16px / 大数 20px。 */
:where(.mobar, .mobar-title, .gn, .cd-t, .grp-t, .fcard-t, .dy-t){ font-size:16px !important; font-weight:700; letter-spacing:-.01em; }
:where(.fcard-n, .grp-n, .ec-n, .cd-v, .dy-v, .kv-v){ font-size:20px !important; font-weight:700; font-variant-numeric:tabular-nums; }
:where(.sub, .hint, .ft, .cd-sub, .grp-sub){ font-size:12px !important; color:var(--muted) !important; }
:where(.pill, .tag, .chip, .dir, .gn-num){ font-size:11.5px !important; }
/* 兜底：把 9.5 / 10 / 34px 这类极端值拉回阶梯（Windows 高分屏会糊） */
:where(.tiny, .xs){ font-size:11.5px !important; }
:where(.huge, .mega){ font-size:20px !important; }
/* 数字统一等宽，金额列能对齐 */
:where(.num, .v, .n, [class*="-v"], [class*="-n"]){ font-variant-numeric:tabular-nums; }

/* ---- ⑧ 手机端碎字号收尾（18107 真机实测类名，非猜测）----
   实测问题档：34px（.big/.SPAN，驾驶舱大数）· 9.5px（.s）· 10px（.SMALL/.k/.capline）
   · 13.5px（.tt/.ib-t）· 22/24px（.ic 图标）· 17px（.v.warn）
   收进 5 档：11.5 / 12.5 / 14 / 16 / 20。正文 12.5px 不动。 */
:where(.big, .big-num, .hero-num){ font-size:20px !important; font-weight:700; }
:where(.k, .kk, .capline, .klabel){ font-size:10px !important; }   /* 极小标注，10px 是下限 */
:where(.s, .ss, .tt, .ib-t){ font-size:12.5px !important; }
:where(.SMALL, .sm){ font-size:11.5px !important; }
:where(.ai-title, .ec-t, .cd-title){ font-size:14px !important; font-weight:700; }
:where(.ic, .ico){ font-size:20px !important; line-height:1; }
:where(.v.warn, .v.hot){ font-size:16px !important; }