/* =====================================================================
   ui-b.css —— 按「方案B · 左主区 + 右常驻信息流」设计稿落地
   来源：C:\Users\李健\WorkBuddy\2026-10-02-20-29-50\首页排版方案\方案B-左主区右信息流.html
   约定：
   · 变量统一加 pb- 前缀，不污染系统既有变量
   · 主题：默认（无 theme-dark）= 浅色；body.theme-dark = 深色（与系统切换逻辑一致）
   · 导航条（.topbar 内）全站生效；首页卡片类仅在 body.view-dashboard 下生效
   ===================================================================== */
body.theme-dark{
  --pb-bg:#070b16;--pb-card:rgba(255,255,255,.045);--pb-card2:rgba(255,255,255,.06);
  --pb-line:rgba(130,160,255,.16);--pb-line2:rgba(130,160,255,.30);
  --pb-txt:#e8edff;--pb-txt2:#dfe7ff;--pb-txt3:#cdd6ff;--pb-dim:#bcd0ff;--pb-mut:#93a0c4;
  --pb-ind:#818cf8;--pb-cyan:#22d3ee;--pb-o-swatch:rgba(255,255,255,.13);
  --pb-grad:linear-gradient(90deg,#818cf8,#22d3ee);
  --pb-blue:#60a5fa;--pb-grn:#34d399;--pb-amb:#fbbf24;--pb-red:#fb7185;--pb-pur:#a78bfa;--pb-gold:#f0b429;--pb-navy:#7dd3fc;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--pb-txt);
  background:
    radial-gradient(900px 600px at 88% -10%,rgba(99,102,241,.30),transparent 60%),
    radial-gradient(800px 600px at 4% 115%,rgba(34,211,238,.22),transparent 60%),
    linear-gradient(rgba(99,130,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(99,130,255,.05) 1px,transparent 1px),
    var(--pb-bg);
  background-size:auto,auto,46px 46px,46px 46px,auto;
  background-attachment:fixed;min-height:100vh;padding:0;
}
body.view-dashboard .wrap{max-width:1360px;margin:0 auto;padding:28px 28px 44px}
body.view-dashboard .badge{display:inline-flex;align-items:center;gap:8px;background:rgba(129,140,248,.18);border:1px solid var(--pb-line2);color:var(--pb-txt3);font-size:12px;padding:6px 14px;border-radius:999px;margin-bottom:14px;letter-spacing:1px}
body.view-dashboard .badge i{width:6px;height:6px;border-radius:50%;background:var(--pb-cyan);box-shadow:0 0 8px var(--pb-cyan)}

/* ---------- 英雄区 ---------- */
body.view-dashboard .hero{position:relative;overflow:hidden;border-radius:24px;padding:32px 36px;margin-bottom:22px;
  background:linear-gradient(118deg,#1e1b4b,#312e81 45%,#0e3a52);
  border:1px solid rgba(130,160,255,.30);
  box-shadow:0 0 44px rgba(49,46,129,.38),inset 0 0 70px rgba(34,211,238,.10)}
/* pointer-events:none 必须加：这两个是纯装饰层（条纹 + 光斑），铺满整块首图。
   手机端 .glance 变成 position:static（z-index 失效），装饰层就会盖在按钮上方把点击吃掉，
   表现就是「外出申请 / 考勤打卡 / 周报月报」三个入口在手机上点不动（2026-10-10 修复）。 */
body.view-dashboard .hero::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(115deg,rgba(255,255,255,.045) 0 1px,transparent 1px 56px)}
body.view-dashboard .hero::after{content:"";position:absolute;top:-42%;right:-8%;width:440px;height:440px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(34,211,238,.32),transparent 60%);animation:glow 12s ease-in-out infinite}
@keyframes glow{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-26px,20px) scale(1.08)}}
body.view-dashboard .hero>*{position:relative;z-index:1}
body.view-dashboard .kick{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--pb-dim);letter-spacing:1px}
body.view-dashboard .kick b{font-size:10px;letter-spacing:3px;color:#67e8f9}
body.view-dashboard .kick .dot{width:3px;height:3px;border-radius:50%;background:var(--pb-mut)}
body.view-dashboard .hi{font-size:30px;font-weight:800;margin-top:8px;letter-spacing:-.5px;
  background:linear-gradient(90deg,#fff,#9ee7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
body.view-dashboard .actions{margin-top:16px;display:flex;gap:10px;flex-wrap:wrap}
body.view-dashboard .btn{cursor:pointer;font-size:13px;color:var(--pb-txt);background:rgba(255,255,255,.08);border:1px solid rgba(160,180,255,.25);
  border-radius:12px;padding:9px 18px;backdrop-filter:blur(6px);transition:.2s}
body.view-dashboard .btn:hover{background:rgba(34,211,238,.20);border-color:rgba(34,211,238,.55);transform:translateY(-1px)}
body.view-dashboard .btn.primary{background:var(--pb-grad);border:none;color:#0b1020;font-weight:700}
body.view-dashboard .btn.primary:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(79,70,229,.34);filter:brightness(.98)}
/* 待办徽章：橙红实底 + 白字 + 呼吸光，突出「有活要办」 */
body.view-dashboard .tag{font-size:11px;padding:2px 8px;border-radius:999px;margin-left:6px;font-weight:800;letter-spacing:.2px;
  background:linear-gradient(135deg,#f43f5e,#fb923c);color:#fff;border:none;
  box-shadow:0 2px 8px rgba(244,63,94,.45);animation:todoPulse 2.2s ease-in-out infinite}
@keyframes todoPulse{
  0%,100%{box-shadow:0 2px 8px rgba(244,63,94,.45)}
  50%{box-shadow:0 2px 14px rgba(244,63,94,.9),0 0 0 3px rgba(244,63,94,.20)}
}
body.view-dashboard .glance{position:absolute;right:36px;top:50%;transform:translateY(-50%);display:flex;gap:14px;z-index:1}
body.view-dashboard .gc{background:rgba(255,255,255,.08);border:1px solid rgba(160,180,255,.22);border-radius:14px;padding:13px 17px;text-align:center;min-width:94px;cursor:pointer;transition:.2s;backdrop-filter:blur(6px)}
body.view-dashboard .gc:hover{border-color:rgba(34,211,238,.55);transform:translateY(-2px)}
body.view-dashboard .gc b{display:block;font-size:23px;font-weight:800;background:var(--pb-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
body.view-dashboard .gc span{font-size:11px;color:var(--pb-txt3)}

/* ---------- 布局 ---------- */
body.view-dashboard .layout{display:flex;gap:24px;align-items:flex-start}
body.view-dashboard .main{flex:1 1 64%;min-width:0;display:flex;flex-direction:column;gap:22px}
/* min-width:0 必须有：flex 项默认 min-width:auto，右栏放了「最近项目」后会被里面的进度条顶宽（曾撑到 582px） */
body.view-dashboard .side{flex:0 0 348px;width:348px;min-width:0;max-width:348px;position:sticky;top:86px;display:flex;flex-direction:column;gap:20px}
/* 右栏（窄）里的项目行排布（用户 2026-10-05 定）：
   第一行 = 序号 + 项目名称；第二行 = 项目经理 + 客户；第三行 = 进度条。整行宽度都给项目名。 */
body.view-dashboard .side .rj{flex-wrap:wrap;align-items:flex-start;column-gap:8px;row-gap:5px}
body.view-dashboard .side .rj .no{align-self:flex-start}
body.view-dashboard .side .rj .no{order:1;flex:0 0 auto}
/* flex-basis 必须是 0（不是 auto）：取 auto 时项目名按「整段文字宽度」当基准，名字一长就会把序号和数字挤到下一行 */
body.view-dashboard .side .rj .nm{order:2;flex:1 1 0;min-width:0;white-space:normal;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;word-break:break-all}
body.view-dashboard .side .rj .meta{order:3;flex:1 1 100%;display:flex;align-items:center;gap:10px;min-width:0;padding-left:34px}
body.view-dashboard .side .rj .meta .own{display:inline-flex;align-items:center;gap:6px;min-width:0}
body.view-dashboard .side .rj .meta .own .av{width:20px;height:20px;font-size:10px}
body.view-dashboard .side .rj .meta .own .mn{font-size:11.5px;font-weight:600;color:var(--pb-txt3)}
body.view-dashboard .side .rj .meta .cu{font-size:11px;color:var(--pb-mut);margin-top:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.view-dashboard .side .rj .rj-newguide{order:5;flex:1 1 100%;padding-left:34px}
/* 进度不再画条：右侧一个按进度分色的胶囊数字（lv4=已完工绿 / lv3=青 / lv2=靛蓝 / lv1=灰） */
body.view-dashboard .side .rj .pc{order:3;flex:0 0 auto;margin-left:auto;width:auto;text-align:right;font-size:14px;font-weight:800;letter-spacing:.3px;padding:2px 10px;border-radius:999px;white-space:nowrap}
body.view-dashboard .side .rj .pc.lv4{color:#15803d;background:rgba(22,163,74,.13)}
body.view-dashboard .side .rj .pc.lv3{color:#0e7490;background:rgba(8,145,178,.13)}
body.view-dashboard .side .rj .pc.lv2{color:#4338ca;background:rgba(79,70,229,.13)}
body.view-dashboard .side .rj .pc.lv1{color:#475569;background:rgba(100,116,139,.13)}
body.theme-dark .side .rj .pc.lv4{color:#4ade80;background:rgba(74,222,128,.16)}
body.theme-dark .side .rj .pc.lv3{color:#22d3ee;background:rgba(34,211,238,.16)}
body.theme-dark .side .rj .pc.lv2{color:#a5b4fc;background:rgba(129,140,248,.18)}
body.theme-dark .side .rj .pc.lv1{color:#b6c0d8;background:rgba(147,160,196,.16)}
/* 商机行：标题有长度限制 —— 到宽度就换第二行（最多 2 行），不再一行撑到底才截断 */
body.view-dashboard .lead-scroll .srow{display:flex;align-items:flex-start;gap:10px;padding:11px 2px}
body.view-dashboard .lead-scroll .srow .lt{flex:1 1 0;min-width:0;white-space:normal;overflow:hidden;
  overflow-wrap:anywhere;word-break:break-word;line-height:1.45;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
body.view-dashboard .lead-scroll .srow .v{flex:0 0 auto;white-space:nowrap;padding-top:1px}
/* ================= 项目产值卡（右栏） ================= */
body.view-dashboard .prod-sum{display:flex;align-items:baseline;gap:10px;padding:2px 2px 12px;border-bottom:1px dashed var(--pb-line);margin-bottom:4px}
body.view-dashboard .prod-sum .v{font-size:26px;font-weight:800;letter-spacing:.3px;color:var(--pb-txt);line-height:1.1}
body.view-dashboard .prod-sum .l{font-size:11px;color:var(--pb-mut)}
/* 人多时内部滑动，不翻页 */
body.view-dashboard .prod-scroll{scrollbar-width:thin;scrollbar-color:rgba(91,91,214,.3) transparent}
body.view-dashboard .prod-list{max-height:252px;overflow-y:auto;margin:0 -6px;padding:2px 6px}
body.view-dashboard .prod-list::-webkit-scrollbar{width:6px}
body.view-dashboard .prod-list::-webkit-scrollbar-track{background:transparent}
body.view-dashboard .prod-list::-webkit-scrollbar-thumb{background:rgba(91,91,214,.28);border-radius:99px}
body.view-dashboard .prod-list::-webkit-scrollbar-thumb:hover{background:rgba(91,91,214,.5)}
body.theme-dark .prod-list::-webkit-scrollbar-thumb{background:rgba(160,180,255,.32)}
/* 每行：奖牌 + 姓名 + 渐变条 + 金额 */
body.view-dashboard .prod-row{display:flex;align-items:center;gap:9px;padding:8px 2px;border-bottom:1px solid var(--pb-line)}
body.view-dashboard .prod-row:last-child{border-bottom:0}
body.view-dashboard .prod-row .rk{flex:0 0 26px;font-size:15px;font-weight:800;color:var(--pb-txt3);text-align:center;line-height:1}
body.view-dashboard .prod-row .rk.r0,body.view-dashboard .prod-row .rk.r1,body.view-dashboard .prod-row .rk.r2{font-size:17px}
body.view-dashboard .prod-row .nm{flex:0 0 48px;font-size:12.5px;font-weight:600;color:var(--pb-txt);white-space:nowrap}
body.view-dashboard .prod-row .bar{flex:1;min-width:0;height:7px;border-radius:99px;background:rgba(129,140,248,.13);overflow:hidden}
body.view-dashboard .prod-row .bar i{display:block;height:100%;border-radius:99px;background:var(--pb-grad);box-shadow:0 0 8px rgba(129,140,248,.45)}
body.view-dashboard .prod-row .val{flex:0 0 auto;min-width:66px;text-align:right;font-size:12.5px;font-weight:800;color:var(--pb-txt);white-space:nowrap}
/* 第一名：名字和金额提亮，占比条用金→青渐变 */
body.view-dashboard .prod-row.first .nm{color:var(--pb-ind);font-weight:800}
body.view-dashboard .prod-row.first .val{color:var(--pb-ind)}
body.view-dashboard .prod-row.first .bar i{background:linear-gradient(90deg,#f0b429,#22d3ee)}
body.view-dashboard .prod-empty{padding:26px 10px;text-align:center;font-size:12.5px;color:var(--pb-txt3);line-height:1.7}
body.view-dashboard .prod-empty span{font-size:11px;color:var(--pb-mut)}

/* 首页左栏两张卡（提醒中心 / 商机）同样不翻页：卡片内部滑动查看，滚动条细而低调 */
body.view-dashboard .main .rem-scroll{max-height:336px;overflow-y:auto;margin:0 -6px;padding:2px 6px;scrollbar-width:thin;scrollbar-color:rgba(91,91,214,.3) transparent}
body.view-dashboard .main .lead-scroll{max-height:336px;overflow-y:auto;margin:0 -6px;padding:2px 6px;scrollbar-width:thin;scrollbar-color:rgba(91,91,214,.3) transparent}
body.view-dashboard .main .rem-scroll::-webkit-scrollbar,body.view-dashboard .main .lead-scroll::-webkit-scrollbar{width:6px}
body.view-dashboard .main .rem-scroll::-webkit-scrollbar-track,body.view-dashboard .main .lead-scroll::-webkit-scrollbar-track{background:transparent}
body.view-dashboard .main .rem-scroll::-webkit-scrollbar-thumb,body.view-dashboard .main .lead-scroll::-webkit-scrollbar-thumb{background:rgba(91,91,214,.28);border-radius:99px}
body.view-dashboard .main .rem-scroll::-webkit-scrollbar-thumb:hover,body.view-dashboard .main .lead-scroll::-webkit-scrollbar-thumb:hover{background:rgba(91,91,214,.5)}
body.theme-dark .main .rem-scroll::-webkit-scrollbar-thumb,body.theme-dark .main .lead-scroll::-webkit-scrollbar-thumb{background:rgba(160,180,255,.32)}
body.theme-dark .main .rem-scroll::-webkit-scrollbar-thumb:hover,body.theme-dark .main .lead-scroll::-webkit-scrollbar-thumb:hover{background:rgba(160,180,255,.55)}
/* 项目列表不翻页：卡片内部滚动（鼠标滚轮 / 手指滑动），滚动条细而低调 */
body.view-dashboard .side .rj-scroll{max-height:352px;overflow-y:auto;margin:0 -6px;padding:2px 6px;scrollbar-width:thin;scrollbar-color:rgba(129,140,248,.4) transparent}
body.view-dashboard .side .rj-scroll::-webkit-scrollbar{width:6px}
body.view-dashboard .side .rj-scroll::-webkit-scrollbar-track{background:transparent}
body.view-dashboard .side .rj-scroll::-webkit-scrollbar-thumb{background:rgba(91,91,214,.28);border-radius:99px}
body.view-dashboard .side .rj-scroll::-webkit-scrollbar-thumb:hover{background:rgba(91,91,214,.5)}
body.theme-dark .side .rj-scroll::-webkit-scrollbar-thumb{background:rgba(160,180,255,.32)}
body.theme-dark .side .rj-scroll::-webkit-scrollbar-thumb:hover{background:rgba(160,180,255,.55)}

/* 周期条 */
body.view-dashboard .period{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  background:var(--pb-card);border:1px solid var(--pb-line);border-radius:14px;padding:10px 14px;backdrop-filter:blur(10px)}
body.view-dashboard .period .lab{font-size:12px;color:var(--pb-mut)}
body.view-dashboard .tabs{display:flex;gap:6px;flex-wrap:wrap}
body.view-dashboard .ptab{font-size:12px;color:var(--pb-txt3);padding:5px 13px;border-radius:999px;border:1px solid transparent;cursor:pointer;transition:.2s}
body.view-dashboard .ptab:hover{border-color:var(--pb-line2)}
body.view-dashboard .ptab.active{background:var(--pb-grad);color:#0b1020;font-weight:700}

/* ---------- 卡片 ---------- */
body.view-dashboard .card{background:var(--pb-card);border:1px solid var(--pb-line);border-radius:20px;padding:22px;backdrop-filter:blur(10px);position:relative;overflow:hidden;transition:.25s}
body.view-dashboard .card:hover{border-color:var(--pb-line2)}
body.view-dashboard .card::before,body.view-dashboard .card::after{content:"";position:absolute;width:14px;height:14px;border-color:rgba(34,211,238,.45);border-style:solid;pointer-events:none}
body.view-dashboard .card::before{top:8px;left:8px;border-width:2px 0 0 2px}
body.view-dashboard .card::after{bottom:8px;right:8px;border-width:0 2px 2px 0}
body.view-dashboard .chead{display:flex;align-items:center;gap:10px;margin-bottom:18px}
body.view-dashboard .chead .bar{width:4px;height:15px;border-radius:2px;background:var(--pb-grad)}
body.view-dashboard .chead .t{font-size:14px;font-weight:700;color:var(--pb-txt2)}
body.view-dashboard .chead .en{font-size:10px;letter-spacing:2.4px;color:#67e8f9;opacity:.85;font-weight:700}
body.view-dashboard .chead .unit{font-size:11px;color:var(--pb-mut);margin-left:7px;font-weight:500}
body.view-dashboard .chead .note{margin-left:auto;font-size:11px;color:var(--pb-mut)}
body.view-dashboard .chead .link{margin-left:auto;font-size:12px;color:var(--pb-cyan);cursor:pointer}
body.view-dashboard .chead .link:hover{text-decoration:underline}

/* 经营概览 6 卡 */
body.view-dashboard .stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
body.view-dashboard .st{background:rgba(255,255,255,.04);border:1px solid var(--pb-line);border-radius:15px;padding:16px 17px;cursor:pointer;transition:.2s;position:relative;display:flex;align-items:center;gap:13px}
body.view-dashboard .st:hover{transform:translateY(-3px);border-color:var(--pb-line2);box-shadow:0 10px 26px rgba(49,46,129,.35)}
body.view-dashboard .st .l{flex:1;min-width:0}
body.view-dashboard .st .ico{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;margin-bottom:10px}
body.view-dashboard .st .ico svg{width:15px;height:15px}
body.view-dashboard .st b{font-size:22px;font-weight:800;letter-spacing:-.3px}
body.view-dashboard .st b .u{font-size:11px;font-weight:600;margin-left:2px;color:var(--pb-cyan)}
body.view-dashboard .st .lb{font-size:12px;color:var(--pb-txt3);margin-top:3px}
body.view-dashboard .st .sb{font-size:11px;color:var(--pb-mut);margin-top:2px}
/* 卡片右侧迷你趋势柱 */
body.view-dashboard .spark{flex:0 0 auto;display:flex;align-items:flex-end;gap:3px;height:38px}
body.view-dashboard .spark i{width:5px;border-radius:2.5px;background:linear-gradient(180deg,var(--pb-ind),var(--pb-cyan));box-shadow:0 0 6px rgba(34,211,238,.22)}
/* 卡片右侧空态圈（¥0 待录入） */
body.view-dashboard .ering{flex:0 0 auto;width:34px;height:34px;border-radius:50%;border:1.5px dashed var(--pb-line2);display:flex;align-items:center;justify-content:center;color:var(--pb-mut);font-size:12px;font-weight:700}
body.view-dashboard .bg-blue{background:rgba(96,165,250,.16);color:var(--pb-blue)} body.view-dashboard .c-blue{color:var(--pb-blue)}
body.view-dashboard .bg-gold{background:rgba(240,180,41,.16);color:var(--pb-gold)} body.view-dashboard .c-gold{color:var(--pb-gold)}
body.view-dashboard .bg-green{background:rgba(52,211,153,.16);color:var(--pb-grn)} body.view-dashboard .c-green{color:var(--pb-grn)}
body.view-dashboard .bg-purple{background:rgba(167,139,250,.16);color:var(--pb-pur)} body.view-dashboard .c-purple{color:var(--pb-pur)}
body.view-dashboard .bg-navy{background:rgba(125,211,252,.14);color:var(--pb-navy)} body.view-dashboard .c-navy{color:var(--pb-navy)}
body.view-dashboard .bg-red{background:rgba(251,113,133,.16);color:var(--pb-red)} body.view-dashboard .c-red{color:var(--pb-red)}
body.view-dashboard .bg-amber{background:rgba(251,191,36,.14);color:var(--pb-amb)} body.view-dashboard .c-amber{color:var(--pb-amb)}

/* 资金往来 9 卡 */
body.view-dashboard .money{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
body.view-dashboard .mc{background:rgba(255,255,255,.04);border:1px solid var(--pb-line);border-radius:15px;padding:16px 17px;cursor:pointer;transition:.2s;position:relative}
body.view-dashboard .mc:hover{transform:translateY(-3px);border-color:var(--pb-line2);box-shadow:0 10px 26px rgba(49,46,129,.35)}
body.view-dashboard .mc .top{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px}
body.view-dashboard .mc .lb{font-size:12px;color:var(--pb-txt3)}
body.view-dashboard .mc .body{display:flex;align-items:center;gap:12px}
body.view-dashboard .mc .body .l{flex:1;min-width:0}
body.view-dashboard .mc .ico{width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;opacity:.9}
body.view-dashboard .mc .ico svg{width:13px;height:13px}
body.view-dashboard .mc b{font-size:21px;font-weight:800;letter-spacing:-.3px}
body.view-dashboard .mc .sb{font-size:11px;color:var(--pb-mut);margin-top:3px}
body.view-dashboard .trend{display:inline-flex;align-items:center;gap:3px;font-size:11px;font-weight:600;margin-top:9px;padding:2px 8px;border-radius:999px;line-height:1.35}
body.view-dashboard .trend.up{color:#34d399;background:rgba(52,211,153,.12)}
body.view-dashboard .trend.down{color:#fb7185;background:rgba(251,113,133,.12)}
body.view-dashboard .trend.flat{color:var(--pb-mut);background:rgba(255,255,255,.05)}
body.view-dashboard .ft{border-top:1px dashed var(--pb-line);padding-top:8px;margin-top:10px;font-size:11px;color:var(--pb-mut);display:flex;align-items:center;gap:4px}
body.view-dashboard .ft.ok{color:#34d399}
body.view-dashboard .ft.warn{color:#fb7185}

/* 最近项目 */
body.view-dashboard .rj{display:flex;align-items:center;gap:16px;padding:15px 4px;border-bottom:1px solid var(--pb-line);cursor:pointer;transition:.15s}
body.view-dashboard .rj:last-child{border:0}
body.view-dashboard .rj:hover{background:rgba(129,140,248,.06);border-radius:10px}
body.view-dashboard .rj .no{width:26px;height:26px;border-radius:8px;background:rgba(129,140,248,.14);color:var(--pb-ind);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
body.view-dashboard .rj .info{min-width:0;flex:1}
body.view-dashboard .rj .nm{font-size:13.5px;font-weight:600;color:var(--pb-txt);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.view-dashboard .rj .cu{font-size:11px;color:var(--pb-mut);margin-top:2px}
body.view-dashboard .own{flex:0 0 auto;display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--pb-txt3)}
body.view-dashboard .own .av{width:24px;height:24px;border-radius:50%;background:var(--pb-grad);color:#0b1020;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center}
body.view-dashboard .rj .pg{flex:0 0 150px;display:flex;align-items:center;gap:8px}
body.view-dashboard .rj .bar{flex:1;height:6px;border-radius:999px;background:rgba(255,255,255,.10);overflow:hidden}
body.view-dashboard .rj .bar i{display:block;height:100%;border-radius:999px;background:var(--pb-grad)}
body.view-dashboard .rj .pc{font-size:12px;font-weight:700;color:var(--pb-cyan);width:38px;text-align:right}

/* 矩阵 + 对比 */
body.view-dashboard .grid2{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;align-items:stretch}
/* 最近项目 + 近期节点 同一行：项目内容多占宽，节点占窄 */
body.view-dashboard .row2{display:grid;grid-template-columns:1.5fr 1fr;gap:18px;align-items:stretch}
/* 两张卡拉伸等高（底边齐平），卡片内部纵向撑开 */
body.view-dashboard .row2>.card{display:flex;flex-direction:column}
/* 近期节点：时间线吃掉剩余高度，条目在竖向均匀分布，不留底部空白 */
body.view-dashboard .row2>.card>.tl{flex:1;display:flex;flex-direction:column;justify-content:space-evenly}
body.view-dashboard .row2>.card>.tl .ti{padding:9px 0}
body.view-dashboard .matrix{display:grid;grid-template-columns:1fr 1fr;gap:10px}
body.view-dashboard .mx{background:rgba(255,255,255,.04);border:1px solid var(--pb-line);border-radius:12px;padding:14px;text-align:center;transition:.2s}
body.view-dashboard .mx:hover{border-color:var(--pb-line2)}
body.view-dashboard .mx b{font-size:24px;font-weight:800}
body.view-dashboard .mx span{display:block;font-size:11px;color:var(--pb-mut);margin-top:2px}
body.view-dashboard .bars{display:flex;gap:16px;align-items:flex-end;height:104px;padding:4px 6px 0}
body.view-dashboard .bw{flex:1;display:flex;gap:5px;align-items:flex-end;height:100%}
body.view-dashboard .bar{flex:1;border-radius:6px 6px 0 0;position:relative;transition:.2s}
body.view-dashboard .bar.t{background:linear-gradient(180deg,var(--pb-ind),var(--pb-cyan))}
body.view-dashboard .bar.o{background:var(--pb-o-swatch)}
body.view-dashboard .bar:hover{filter:brightness(1.15)}
body.view-dashboard .bl{display:flex;gap:16px;margin-top:9px}
/* 指标标签升级为精致胶囊：主题色点 + 名称，字重提高、字间距拉开，明显又好看 */
body.view-dashboard .bl span{flex:1;display:flex;align-items:center;justify-content:center;gap:5px;
  padding:4px 8px;border-radius:999px;white-space:nowrap;
  font-size:11.5px;font-weight:700;letter-spacing:.4px;color:var(--pb-txt2);
  background:rgba(255,255,255,.06);border:1px solid var(--pb-line);transition:.2s}
body.view-dashboard .bl span:hover{border-color:var(--pb-line2);color:var(--pb-txt)}
body.view-dashboard .bl .ydot{width:6px;height:6px;border-radius:50%;flex:0 0 auto;box-shadow:0 0 0 2px rgba(255,255,255,.10)}
/* 浅色：胶囊底改淡灰描边，白底上干净不糊 */
body.view-dashboard:not(.theme-dark) .bl span{background:rgba(30,41,80,.045);border-color:rgba(30,41,80,.14)}
body.view-dashboard:not(.theme-dark) .bl .ydot{box-shadow:0 0 0 2px rgba(30,41,80,.08)}
body.view-dashboard .vals{display:flex;gap:16px;margin-top:7px}
body.view-dashboard .vals .vw{flex:1;display:flex;gap:5px}
/* 数字：等宽对齐；本年大号加粗渐变（醒目），上年小号灰（次要层次） */
body.view-dashboard .vals .bv{flex:1;text-align:center;font-size:11.5px;font-weight:700;letter-spacing:-.2px;font-variant-numeric:tabular-nums}
body.view-dashboard .vals .bv.t{font-size:15px;font-weight:800;letter-spacing:-.3px;background:var(--pb-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
body.view-dashboard .vals .bv.o{color:var(--pb-mut);font-weight:600}
body.view-dashboard .lg{display:flex;gap:14px;margin-top:10px;font-size:11px;color:var(--pb-mut)}
body.view-dashboard .lg i{width:9px;height:9px;border-radius:3px;display:inline-block;margin-right:5px;vertical-align:-1px}

/* 侧栏 */
body.view-dashboard .feature{background:linear-gradient(135deg,rgba(129,140,248,.20),rgba(34,211,238,.10));border-color:rgba(130,160,255,.30)}
body.view-dashboard .feature .fv{font-size:40px;font-weight:800;background:var(--pb-grad);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.5px}
body.view-dashboard .feature .fv .u{font-size:17px}
body.view-dashboard .feature .fs{color:var(--pb-mut);font-size:12px;margin-top:5px}
body.view-dashboard .fbar{height:8px;border-radius:999px;background:rgba(255,255,255,.10);margin-top:13px;overflow:hidden}
body.view-dashboard .fbar i{display:block;height:100%;background:var(--pb-grad);border-radius:999px;box-shadow:0 0 12px rgba(34,211,238,.6)}
body.view-dashboard .tags{display:flex;gap:10px;flex-wrap:wrap}
body.view-dashboard .tg{font-size:11.5px;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--pb-line);color:var(--pb-txt3);cursor:pointer;transition:.2s}
body.view-dashboard .tg:hover{border-color:var(--pb-line2);transform:translateY(-1px)}
body.view-dashboard .tg b{color:#f43f5e;font-size:13px;font-weight:800;margin-left:3px}
body.view-dashboard .srow{display:flex;justify-content:space-between;align-items:center;padding:11px 2px;border-bottom:1px solid var(--pb-line);font-size:12.5px;cursor:pointer}
body.view-dashboard .srow:last-child{border:0}
body.view-dashboard .srow:hover{color:var(--pb-txt)}
body.view-dashboard .srow .v{color:var(--pb-cyan);font-weight:700}
body.view-dashboard .srow .new{font-size:10px;padding:1px 7px;border-radius:999px;margin-left:6px;font-weight:800;letter-spacing:.3px;
  background:linear-gradient(135deg,#f43f5e,#fb923c);color:#fff;box-shadow:0 2px 7px rgba(244,63,94,.40)}

/* 今日动态 - 出勤人员 */
body.view-dashboard .att-sum{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:4px}
body.view-dashboard .att-sum .t{font-size:12px;color:var(--pb-mut)}
body.view-dashboard .att-sum .r{font-size:15px;font-weight:800;background:var(--pb-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
body.view-dashboard .att-group{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid var(--pb-line)}
body.view-dashboard .att-group:last-of-type{border:0;margin-bottom:6px}
body.view-dashboard .att-tag{flex:0 0 auto;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px}
body.view-dashboard .att-tag.trip{background:rgba(129,140,248,.16);color:var(--pb-ind)}
body.view-dashboard .att-tag.out{background:rgba(34,211,238,.16);color:var(--pb-cyan)}
body.view-dashboard .att-tag.leave{background:rgba(251,113,133,.16);color:var(--pb-red)}
body.view-dashboard .att-people{display:flex;gap:6px;flex-wrap:wrap}
body.view-dashboard .att-people .p{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--pb-txt3);background:rgba(255,255,255,.05);border:1px solid var(--pb-line);border-radius:999px;padding:3px 10px 3px 3px}
body.view-dashboard .att-people .p i{width:18px;height:18px;border-radius:50%;background:var(--pb-grad);color:#0b1020;font-size:10px;font-weight:800;display:flex;align-items:center;justify-content:center;font-style:normal;flex:0 0 auto}
body.view-dashboard .at{display:inline-block;font-size:10px;font-weight:700;color:var(--pb-ind);background:rgba(129,140,248,.16);padding:1px 7px;border-radius:6px;margin-right:6px}
body.view-dashboard .qe{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:2px}
body.view-dashboard .qe a{display:flex;flex-direction:column;align-items:center;gap:7px;padding:13px 4px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--pb-line);color:var(--pb-txt3);font-size:11px;text-decoration:none;transition:.18s;cursor:pointer}
body.view-dashboard .qe a:hover{border-color:var(--pb-line2);background:rgba(34,211,238,.10);transform:translateY(-2px);color:var(--pb-txt)}
body.view-dashboard .qe .qi{width:28px;height:28px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:rgba(129,140,248,.14);color:var(--pb-ind);font-size:15px;font-weight:700}
body.view-dashboard .tl{position:relative;padding-left:17px;margin-top:2px}
body.view-dashboard .tl::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:linear-gradient(var(--pb-ind),var(--pb-cyan));opacity:.45}
body.view-dashboard .tl .ti{position:relative;padding:8px 0}
body.view-dashboard .tl .ti::before{content:"";position:absolute;left:-16px;top:11px;width:9px;height:9px;border-radius:50%;background:var(--pb-grad);box-shadow:0 0 0 3px rgba(129,140,248,.18)}
body.view-dashboard .tl .ti .d{font-size:11px;color:var(--pb-cyan);font-weight:700}
body.view-dashboard .tl .ti .x{font-size:12px;color:var(--pb-txt3);margin-top:2px;line-height:1.4}

/* 星座运势卡（右栏置顶） */
body.view-dashboard .zodiac{background:linear-gradient(135deg,rgba(167,139,250,.22),rgba(34,211,238,.12));border-color:rgba(130,160,255,.34);box-shadow:0 0 30px rgba(99,102,241,.20)}
body.view-dashboard .zodiac .ztop{display:flex;align-items:center;gap:13px;margin-bottom:13px}
body.view-dashboard .zodiac .zicon{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;background:rgba(255,255,255,.10);border:1px solid var(--pb-line2);box-shadow:0 0 18px rgba(129,140,248,.35);flex:0 0 auto}
body.view-dashboard .zodiac .zname{font-size:17px;font-weight:800;color:var(--pb-txt);letter-spacing:.3px}
body.view-dashboard .zodiac .zsub{font-size:10px;letter-spacing:2px;color:#67e8f9;font-weight:700;margin-top:3px}
body.view-dashboard .zodiac .zstar{margin-left:auto;font-size:17px;letter-spacing:3px;color:#fbbf24;text-shadow:0 0 10px rgba(251,191,36,.55);white-space:nowrap}
body.view-dashboard .zodiac .zstar .zs-off{color:rgba(255,255,255,.32);text-shadow:none}
body.view-dashboard .zodiac .zchips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}
body.view-dashboard .zodiac .zchip{display:flex;align-items:center;gap:7px;font-size:11.5px;color:var(--pb-txt3);background:rgba(255,255,255,.06);border:1px solid var(--pb-line);border-radius:999px;padding:6px 13px}
body.view-dashboard .zodiac .zchip b{color:var(--pb-txt);font-weight:700}
body.view-dashboard .zodiac .zdot{width:11px;height:11px;border-radius:50%;box-shadow:0 0 9px currentColor}
body.view-dashboard .zodiac .znum{background:var(--pb-grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800;font-size:13px}
body.view-dashboard .zodiac .ztip{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:var(--pb-txt2);line-height:1.6;background:rgba(255,255,255,.05);border-left:3px solid var(--pb-cyan);border-radius:0 9px 9px 0;padding:10px 13px}
body.view-dashboard .zodiac .ztip .zico{font-size:14px;line-height:1.45;flex:0 0 auto}

/* ---------- 顶部导航栏 ---------- */
.topbar{position:sticky;top:0;z-index:50;backdrop-filter:blur(20px) saturate(165%);
  background:rgba(9,13,26,.82);border-bottom:1px solid var(--pb-line);
  box-shadow:0 1px 0 rgba(255,255,255,.06),0 12px 34px rgba(0,0,0,.30)}
/* 顶栏底部一条紫青渐变发光线，提升质感 */
.topbar::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;z-index:2;
  background:linear-gradient(90deg,transparent 0%,rgba(129,140,248,.55) 30%,rgba(34,211,238,.60) 70%,transparent 100%)}
.topbar-in{max-width:1360px;margin:0 auto;padding:0 26px;height:72px;display:flex;align-items:center;gap:20px}
.topbar .brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.topbar .logo{width:40px;height:40px;border-radius:12px;background:var(--pb-grad);color:#0b1020;font-weight:800;font-size:18px;display:flex;align-items:center;justify-content:center;
  box-shadow:0 5px 18px rgba(129,140,248,.42),inset 0 1px 0 rgba(255,255,255,.45)}
.topbar .brand-txt b{font-size:17px;color:var(--pb-txt);display:block;line-height:1.15;letter-spacing:.6px;font-weight:800}
.topbar .brand-txt span{font-size:10.5px;letter-spacing:1.6px;margin-top:2px;font-weight:700;
  background:var(--pb-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.topbar .nav{display:flex;gap:4px;margin-left:16px;padding-left:22px;border-left:1px solid var(--pb-line);align-items:center}
.topbar .navitem{display:inline-flex;align-items:center;font-size:14.5px;color:var(--pb-txt2);padding:10px 16px;border-radius:11px;cursor:pointer;transition:.2s;font-weight:600;white-space:nowrap;position:relative;opacity:.82}
.topbar .navitem svg{width:15px;height:15px;margin-right:7px;flex:0 0 auto;opacity:.8;transition:.2s}
.topbar .navitem:hover svg,.topbar .navitem.active svg{opacity:1}
.topbar .navitem.active svg{color:var(--pb-cyan)}
.topbar .navitem:hover{color:var(--pb-txt);opacity:1;background:rgba(129,140,248,.10)}
/* 选中：淡渐变底 + 内描边 + 底部发光指示条（不用满色块，避免俗） */
.topbar .navitem.active{opacity:1;font-weight:800;color:var(--pb-txt);
  background:linear-gradient(135deg,rgba(129,140,248,.20),rgba(34,211,238,.11));
  box-shadow:inset 0 0 0 1px rgba(129,140,248,.32),0 4px 16px rgba(129,140,248,.20)}
.topbar .navitem.active::after{content:"";position:absolute;left:16px;right:16px;bottom:4px;height:3px;border-radius:3px;
  background:var(--pb-grad);box-shadow:0 0 10px rgba(34,211,238,.65)}
.topbar .actions-r{margin-left:auto;display:flex;align-items:center;gap:12px;flex:0 0 auto}
.topbar .iconbtn{position:relative;width:40px;height:40px;border-radius:12px;border:1px solid var(--pb-line);background:rgba(255,255,255,.05);color:var(--pb-txt);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s}
.topbar .iconbtn:hover{border-color:rgba(34,211,238,.48);background:rgba(34,211,238,.14);box-shadow:0 0 0 3px rgba(34,211,238,.10);transform:translateY(-1px)}
.topbar .iconbtn .dot{position:absolute;top:9px;right:10px;width:8px;height:8px;border-radius:50%;background:var(--pb-red);box-shadow:0 0 7px var(--pb-red);border:2px solid #0b1020;animation:todoPulse 2.2s ease-in-out infinite}
.topbar .avatar{position:relative;display:flex;align-items:center;gap:9px;cursor:pointer;padding:4px 14px 4px 5px;border-radius:999px;border:1px solid var(--pb-line);background:rgba(255,255,255,.05);transition:.2s}
.topbar .avatar:hover{border-color:rgba(129,140,248,.45);background:rgba(255,255,255,.09);box-shadow:0 0 0 3px rgba(129,140,248,.10)}
.topbar .avatar .av{width:32px;height:32px;border-radius:50%;background:var(--pb-grad);color:#0b1020;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(129,140,248,.38),inset 0 1px 0 rgba(255,255,255,.4)}
.topbar .avatar .av-name{font-size:13px;color:var(--pb-txt);font-weight:600}
.topbar .avatar .caret{font-size:9px;color:var(--pb-mut);margin-left:1px}
.topbar .search{display:flex;align-items:center;gap:8px;flex:1 1 auto;max-width:380px;margin:0 6px;padding:0 15px;height:40px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid var(--pb-line);color:var(--pb-mut);transition:.2s}
.topbar .search:focus-within{border-color:rgba(34,211,238,.50);background:rgba(255,255,255,.09);box-shadow:0 0 0 3px rgba(34,211,238,.12)}
.topbar .search .si{font-size:13px;opacity:.85}
.topbar .search .sin{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--pb-txt);font-size:13px;font-family:inherit}
.topbar .search .sin::placeholder{color:var(--pb-mut)}
.topbar .avatar .menu{position:absolute;top:calc(100% + 12px);right:0;min-width:174px;background:rgba(13,18,33,.95);border:1px solid var(--pb-line2);border-radius:14px;padding:8px;backdrop-filter:blur(18px);box-shadow:0 18px 44px rgba(0,0,0,.45);display:none;z-index:60}
.topbar .avatar .menu.open{display:block;animation:pop .15s ease}
@keyframes pop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
.topbar .avatar .menu::before{content:"";position:absolute;top:-7px;right:22px;border:7px solid transparent;border-bottom-color:rgba(13,18,33,.95)}
.topbar .mi{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;font-size:13px;color:var(--pb-txt);cursor:pointer;transition:.15s}
.topbar .mi:hover{background:rgba(129,140,248,.14)}
.topbar .mi.sep{border-top:1px solid var(--pb-line);margin-top:6px;padding-top:12px;color:var(--pb-red);font-weight:600}
.topbar .mi .ico{font-size:14px}

/* ---------- 浅色主题 ---------- */
body.view-dashboard:not(.theme-dark){
  --pb-bg:#eaeef6;--pb-card:rgba(255,255,255,.78);--pb-card2:rgba(255,255,255,.90);
  --pb-line:rgba(30,41,80,.12);--pb-line2:rgba(30,41,80,.26);
  --pb-txt:#16203a;--pb-txt2:#1c2742;--pb-txt3:#46557a;--pb-dim:#3c4a72;--pb-mut:#5d6b8c;
  --pb-o-swatch:rgba(15,23,42,.18);
  /* 浅色模式专用：把深底用的亮色统一压深，保证白底上清晰醒目 */
  /* 主渐变也要换成沉稳版，否则 Logo/头像/进度条的亮紫青浮在白底上很跳 */
  --pb-grad:linear-gradient(90deg,#4f46e5,#0e7490);
  --pb-ind:#4f46e5;--pb-cyan:#0e7490;
  --pb-blue:#2563eb;--pb-grn:#047857;--pb-amb:#b45309;--pb-red:#dc2626;--pb-pur:#7c3aed;--pb-gold:#a16207;--pb-navy:#0369a1;
  background:
    radial-gradient(900px 600px at 88% -10%,rgba(129,140,248,.20),transparent 60%),
    radial-gradient(800px 600px at 4% 115%,rgba(34,211,238,.16),transparent 60%),
    linear-gradient(rgba(30,41,80,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(30,41,80,.045) 1px,transparent 1px),
    var(--pb-bg);
}
/* 浅色导航栏：近白的干净实底，与页面浅灰底拉开层次 */
body:not(.theme-dark) .topbar{
  background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,255,255,.90));
  border-bottom-color:rgba(30,41,80,.13);
  box-shadow:0 10px 26px rgba(30,41,80,.10)}
body:not(.theme-dark) .topbar::after{background:linear-gradient(90deg,transparent 0%,rgba(79,70,229,.30) 30%,rgba(14,116,144,.34) 70%,transparent 100%)}
body:not(.theme-dark) .logo{box-shadow:0 4px 14px rgba(79,70,229,.26),inset 0 1px 0 rgba(255,255,255,.55)}
body.view-dashboard:not(.theme-dark) .st,body:not(.theme-dark) .mc,body:not(.theme-dark) .mx{background:rgba(15,23,42,.04)}
body.view-dashboard:not(.theme-dark) .tg,body:not(.theme-dark) .zchip{background:rgba(15,23,42,.05)}
body.view-dashboard:not(.theme-dark) .ztip{background:rgba(15,23,42,.04)}
/* 普通按钮才刷白底；主按钮(.primary)保持渐变底，否则会变成「白底+白字」看不见 */
body:not(.theme-dark) .glance .gc,body:not(.theme-dark) .btn:not(.primary){background:rgba(255,255,255,.6)}
body.view-dashboard:not(.theme-dark) .rj .bar,body:not(.theme-dark) .fbar{background:rgba(15,23,42,.10)}
body.view-dashboard:not(.theme-dark) .zicon{background:rgba(255,255,255,.55)}
body:not(.theme-dark) .trend.flat{background:rgba(15,23,42,.05)}
body.view-dashboard:not(.theme-dark) .qe a{background:rgba(15,23,42,.04)}
body.view-dashboard:not(.theme-dark) .qe a:hover{background:rgba(15,23,42,.07)}
body.view-dashboard:not(.theme-dark) .card::before,body:not(.theme-dark) .card::after{border-color:rgba(34,211,238,.30)}
body:not(.theme-dark) .navitem{color:#3f4d68}
body:not(.theme-dark) .navitem:hover{background:rgba(79,70,229,.08);color:#16203a}
/* 浅色补丁：卡片英文小标 / 星座副标题原本是亮青 #67e8f9，落在白底上看不清，压深一档 */
body.view-dashboard:not(.theme-dark) .chead .en{color:#0e7490;opacity:1;}
body.view-dashboard:not(.theme-dark) .zodiac .zsub{color:#0e7490;}
/* 浅色选中：干净淡底 + 深靛蓝粗体字（去掉 inset 描边，白底上描边会显脏） */
body:not(.theme-dark) .navitem.active{color:#3730a3;font-weight:800;
  background:rgba(79,70,229,.10);box-shadow:0 3px 10px rgba(79,70,229,.10)}
body:not(.theme-dark) .navitem.active::after{background:linear-gradient(90deg,#4f46e5,#0e7490);box-shadow:0 0 8px rgba(79,70,229,.32)}
body:not(.theme-dark) .navitem.active svg{color:#0e7490}
body:not(.theme-dark) .iconbtn,body:not(.theme-dark) .avatar{background:rgba(255,255,255,.88);border-color:rgba(30,41,80,.16)}
body:not(.theme-dark) .iconbtn:hover{border-color:rgba(14,116,144,.48);background:rgba(14,116,144,.10);box-shadow:0 0 0 3px rgba(14,116,144,.12)}
body:not(.theme-dark) .avatar:hover{border-color:rgba(79,70,229,.45);box-shadow:0 0 0 3px rgba(79,70,229,.12)}
body:not(.theme-dark) .search{background:rgba(255,255,255,.92);border-color:rgba(30,41,80,.16)}
body:not(.theme-dark) .search:focus-within{border-color:rgba(79,70,229,.50);background:#fff;box-shadow:0 0 0 3px rgba(79,70,229,.12)}
/* 浅色：红点描边改白色，否则深色描边圈在白底导航栏上很明显 */
body:not(.theme-dark) .iconbtn .dot{border-color:#fff}
/* 浅色：主渐变已压深，所有「渐变底 + 深色字」必须翻成白字，否则糊成一团看不清 */
body.view-dashboard:not(.theme-dark) .ptab.active,
body:not(.theme-dark) .logo,
body:not(.theme-dark) .avatar .av,
body.view-dashboard:not(.theme-dark) .own .av,
body:not(.theme-dark) .att-people .p i,
body:not(.theme-dark) .btn.primary{background:linear-gradient(90deg,#4f46e5,#0e7490);color:#fff;border:none}
body.view-dashboard:not(.theme-dark) .ptab.active{box-shadow:0 3px 10px rgba(79,70,229,.32)}
body:not(.theme-dark) .btn.primary:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(79,70,229,.42);filter:brightness(.98)}
body:not(.theme-dark) .search{background:rgba(15,23,42,.04);border-color:rgba(30,41,80,.14)}
body:not(.theme-dark) .search:focus-within{background:rgba(15,23,42,.06);border-color:rgba(30,41,80,.28)}
body:not(.theme-dark) .mi:hover{background:rgba(15,23,42,.06)}
body:not(.theme-dark) .att-people .p{background:rgba(15,23,42,.04)}
body:not(.theme-dark) .avatar .menu{background:rgba(255,255,255,.97);box-shadow:0 18px 44px rgba(30,41,80,.18)}
body:not(.theme-dark) .avatar .menu::before{border-bottom-color:rgba(255,255,255,.97)}
/* 浅色英雄问候区 */
body.view-dashboard:not(.theme-dark) .hero{background:linear-gradient(118deg,#eef2ff 0%,#e7fafd 48%,#f4eeff 100%);border-color:rgba(30,41,80,.12);box-shadow:0 0 40px rgba(99,102,241,.10),inset 0 0 70px rgba(34,211,238,.06)}
body.view-dashboard:not(.theme-dark) .hero::before{background:repeating-linear-gradient(115deg,rgba(30,41,80,.05) 0 1px,transparent 1px 56px)}
body.view-dashboard:not(.theme-dark) .hero::after{background:radial-gradient(circle,rgba(34,211,238,.22),transparent 60%)}
body.view-dashboard:not(.theme-dark) .hi{background:linear-gradient(90deg,#1e3a8a,#0e7490);-webkit-background-clip:text;background-clip:text;color:transparent}
body.view-dashboard:not(.theme-dark) .kick{color:#475569}
body.view-dashboard:not(.theme-dark) .kick b{color:#0e7490}
body.view-dashboard:not(.theme-dark) .glance .gc{background:rgba(255,255,255,.65);border-color:rgba(30,41,80,.14)}
body.view-dashboard:not(.theme-dark) .glance .gc span{color:#475569}
body:not(.theme-dark) .btn{background:rgba(255,255,255,.7);color:#16203a;border-color:rgba(30,41,80,.16)}
body:not(.theme-dark) .btn:hover{background:rgba(34,211,238,.16);border-color:rgba(14,116,144,.40)}
/* 浅色：图标底色加深，让彩色图标块在白底上有存在感 */
body:not(.theme-dark) .bg-blue{background:rgba(37,99,235,.15)}
body:not(.theme-dark) .bg-gold{background:rgba(161,98,7,.15)}
body:not(.theme-dark) .bg-green{background:rgba(4,120,87,.15)}
body:not(.theme-dark) .bg-purple{background:rgba(124,58,237,.15)}
body:not(.theme-dark) .bg-navy{background:rgba(3,105,161,.15)}
body:not(.theme-dark) .bg-red{background:rgba(220,38,38,.15)}
body:not(.theme-dark) .bg-amber{background:rgba(180,83,9,.15)}
/* 浅色：状态色压深（涨/跌、正常/逾期、待办标签） */
body:not(.theme-dark) .trend.up{color:#047857;background:rgba(4,120,87,.12)}
body:not(.theme-dark) .trend.down{color:#b91c1c;background:rgba(185,28,28,.12)}
body.view-dashboard:not(.theme-dark) .at{background:rgba(79,70,229,.14)}
body.view-dashboard:not(.theme-dark) .tg b{color:#d81b45}
body.view-dashboard:not(.theme-dark) .spark i{box-shadow:0 0 6px rgba(14,116,144,.30)}
body.view-dashboard:not(.theme-dark) .rj .no{background:rgba(79,70,229,.13)}
body.view-dashboard:not(.theme-dark) .qe .qi{background:rgba(79,70,229,.13)}
body.view-dashboard:not(.theme-dark) .att-tag.trip{background:rgba(79,70,229,.14)}
body.view-dashboard:not(.theme-dark) .att-tag.out{background:rgba(14,116,144,.14)}
body.view-dashboard:not(.theme-dark) .att-tag.leave{background:rgba(220,38,38,.13)}
/* 浅色：星座星星改暗金，空心星改深色（原来的白色在白底上隐形） */
body.view-dashboard:not(.theme-dark) .zodiac .zstar{color:#a16207;text-shadow:0 0 8px rgba(161,98,7,.30)}
body.view-dashboard:not(.theme-dark) .zodiac .zstar .zs-off{color:rgba(30,41,80,.26)}
/* 浅色：待办/NEW 徽章加投影，白底上更跳 */
body.view-dashboard:not(.theme-dark) .tag,body:not(.theme-dark) .srow .new{box-shadow:0 2px 10px rgba(216,27,69,.42)}
/* 浅色：金额色压深一档，亮金/亮绿/亮蓝在浅底上发飘 */
body:not(.theme-dark) .c-gold{color:#92400e}
body:not(.theme-dark) .c-green{color:#047857}
body:not(.theme-dark) .c-navy{color:#0369a1}
body:not(.theme-dark) .c-amber{color:#b45309}
body:not(.theme-dark) .c-red{color:#dc2626}
body:not(.theme-dark) .c-purple{color:#7c3aed}
body:not(.theme-dark) .c-blue{color:#2563eb}

/* ---------- 响应式 / 手机适配 ---------- */
.topbar .hamburger{display:none}
@media (max-width:1080px){
  body.view-dashboard .layout{flex-direction:column;gap:20px}
  body.view-dashboard .main,body.view-dashboard .side{flex:1 1 auto;width:100%}
  body.view-dashboard .side{position:static;top:auto}
  body.view-dashboard .wrap{padding:22px 20px 32px}
}
@media (max-width:720px){
  .topbar-in{padding:0 14px;gap:12px}
.topbar .search{display:none}
  .topbar .hamburger{display:flex}
  .nav{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:3px;margin:0;padding:10px 14px 14px;border-left:none;border-top:1px solid var(--pb-line);background:rgba(9,13,26,.97);box-shadow:0 18px 40px rgba(0,0,0,.35)}
  .nav.open{display:flex}
  .navitem{text-align:left;padding:12px 14px}
  .navitem.active::after{display:none}
  .navitem.active{background:rgba(129,140,248,.14)}
  body:not(.theme-dark) .nav{background:rgba(255,255,255,.97)}
  .topbar .brand-txt span{display:none}
  body.view-dashboard .stats,body.view-dashboard .money{grid-template-columns:repeat(2,1fr)}
  body.view-dashboard .grid2,body.view-dashboard .row2{grid-template-columns:1fr}
  body.view-dashboard .hero{padding:22px 20px}
  /* 手机上速览片改为换行平铺。这里必须用 position:relative（不能 static）：
     static 时 z-index 不生效，首图的装饰层会盖在按钮上方导致点不动。z-index:2 保证按钮始终在最上层。 */
  body.view-dashboard .glance{position:relative;z-index:2;transform:none;margin-top:18px;justify-content:flex-start;flex-wrap:wrap;gap:10px}
  body.view-dashboard .gc{min-width:0;flex:1}
  body.view-dashboard .glance .gc.gc-go{position:relative;z-index:3}
  body.view-dashboard .rj{flex-wrap:wrap}
  body.view-dashboard .rj .info{order:1;flex:1}
  body.view-dashboard .own{order:2}
  body.view-dashboard .rj .pg{flex:1 1 100%;order:3}
  body.view-dashboard .wrap{padding:16px 14px 24px}
}
@media (max-width:460px){
  body.view-dashboard .stats,body.view-dashboard .money{grid-template-columns:1fr}
  .topbar .avatar .av-name{display:none}
  body.view-dashboard .hero .hi{font-size:25px}
}

/* =====================================================================
   系统落地补丁（方案B 设计稿 → 真实系统）
   ===================================================================== */
/* 导航条：菜单项较多时可横向滚动，保证「系统设置 / 系统维护」等始终点得到 */
.topbar .nav{flex-wrap:nowrap;overflow:visible;flex:0 1 auto;min-width:0}
.topbar .navitem{flex:0 0 auto}
@media (max-width:1240px){ .topbar .search{max-width:180px} }
/* 中等宽度就收进 ☰ 抽屉，避免菜单被挤没。
   注意：断点原来是 1080，但 1366 屏幕 + Windows 125%/150% 缩放后浏览器可用宽度只有 910~1090，
   会误触发抽屉、导致「看不到导航条」，因此下调到 860（手机/很窄窗口才收起） */
@media (max-width:860px){
  .topbar .hamburger{display:flex}
  .topbar .nav{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:3px;
    margin:0;padding:10px 14px 14px;border-left:none;border-top:1px solid var(--pb-line);
    background:rgba(9,13,26,.97);box-shadow:0 18px 40px rgba(0,0,0,.35);overflow:visible}
  .topbar .nav.open{display:flex}
  .topbar .navitem{text-align:left;padding:12px 14px}
  .topbar .navitem.active::after{display:none}
}
body:not(.theme-dark) .topbar .nav{background:rgba(255,255,255,.98)}
body:not(.theme-dark) .topbar .nav .navitem{color:#3f4d68}
/* 首页：标题已融入英雄区，隐藏原页面标题行 */
body.view-dashboard .page-head{display:none}
body.view-dashboard .content{padding:0;max-width:none}
body.view-dashboard .main{padding:0}
/* 首页卡片内「按钮」沿用系统按钮的可读性（设计稿玻璃按钮在浅色下偏淡） */
body:not(.theme-dark) .btn{border:1px solid rgba(30,41,80,.16)}

/* 导航项右上角的待办数字徽章（原样式按底部导航排布，移到导航条要重定位） */
.topbar .navitem .mn-badge{top:-2px;left:auto;right:-2px;transform:none;min-width:16px;text-align:center;padding:1px 4px;z-index:2}

/* =====================================================================
   补丁②：搜索下拉定位 + 导航条瘦身 + 手机端防溢出
   ===================================================================== */
/* 搜索结果面板要相对搜索框定位（导航条改版后容器从 .topbar-search 变成 .search） */
.topbar .search{position:relative}
.topbar #search-results{right:0;width:min(430px,86vw)}
/* 导航条整体瘦身，给菜单腾出宽度 */
.topbar-in{max-width:1800px;padding:0 20px;gap:14px}
.topbar .search{flex:1 1 auto;min-width:180px;max-width:460px;margin:0 4px;padding:0 16px;height:42px;border-radius:14px}
.topbar .nav{margin-left:10px;padding-left:16px;gap:6px}
.topbar .navitem{font-size:13.5px;padding:10px 15px;border-radius:12px;letter-spacing:.2px}
.topbar .navitem svg{width:15px;height:15px;margin-right:6px}
.topbar .navitem.active::after{left:15px;right:15px}
.topbar .brand-txt b{font-size:16px}
.topbar .actions-r{gap:9px}
.topbar .avatar{padding:4px 10px 4px 4px;gap:7px}
/* 菜单排不下时左右渐隐，提示还能横向滑 */
@media (max-width:1000px){ .topbar .search{display:none} }
/* 手机（≤720）：屏太窄，才整包收进 ☰ 抽屉；桌面一律单行 + 「更多 ▾」 */
@media (max-width:720px){
  .topbar .hamburger{display:flex}
  .topbar .nav{display:none;position:absolute;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:3px;
    margin:0;padding:10px 14px 14px;border-left:none;border-top:1px solid var(--pb-line);
    background:rgba(9,13,26,.97);box-shadow:0 18px 40px rgba(0,0,0,.35);overflow:visible;mask-image:none;z-index:60}
  .topbar .nav.open{display:flex}
  .topbar .navitem{text-align:left;padding:12px 14px;font-size:14.5px}
  .topbar .navitem.active::after{display:none}
}
/* 手机端：品牌只留 Logo、头像只留圆圈、按钮缩小，彻底消除横向溢出 */
@media (max-width:720px){
  .topbar-in{padding:0 12px;gap:8px;height:64px}
  /* 手机上品牌仍显示「锐立咨询」（只隐藏后面那串长副标题），不再整块空白 */
  .topbar .brand-txt{display:flex;align-items:center;max-width:88px}
  .topbar .brand-txt b{font-size:13.5px}
  .topbar .brand-txt span{display:none}
  .topbar .logo{width:34px;height:34px;font-size:16px;border-radius:10px}
  .topbar .actions-r{gap:6px}
  .topbar .iconbtn{width:34px;height:34px;border-radius:10px;font-size:15px}
  .topbar .avatar{padding:3px 5px 3px 4px;gap:5px}
  /* 头像圆圈（含姓氏首字）始终保留，只隐藏全名和下拉箭头 */
  .topbar .avatar .av{width:28px;height:28px;font-size:12px;display:flex}
  .topbar .avatar .av-name,.topbar .avatar .caret{display:none}
  .topbar .nav{top:64px}
  /* 手机上的提醒数字：仍是小圆点会看不见，恢复成小胶囊 */
  .topbar .iconbtn .dot{top:-2px;right:-2px;width:auto;min-width:15px;height:15px;padding:0 3px;
    font-size:9.5px;font-weight:800;border-radius:999px;color:#fff}
}

/* =====================================================================
   补丁③：同行两卡等高 · 右侧信息流收紧 · 列宽 6:4
   ===================================================================== */
body.view-dashboard .row2>.card,body.view-dashboard .grid2>.card{display:flex;flex-direction:column;align-self:stretch;min-height:0}
/* 最近项目：条目竖向铺开，项目少时也不塌 */
body.view-dashboard #recent-body{flex:1;display:flex;flex-direction:column;justify-content:space-evenly}
/* 本年/上年对比：柱子区吃掉剩余高度；矩阵：四格撑开 */
body.view-dashboard .grid2>.card>.bars{flex:1;height:auto;min-height:104px}
body.view-dashboard .grid2>.card>.matrix{flex:1;align-content:stretch}
body.view-dashboard .matrix .mx{display:flex;flex-direction:column;justify-content:center;min-height:78px}
body.view-dashboard .grid2>.card>.ft{margin-top:auto;padding-top:10px}
/* 右侧信息流：卡片间距与内边距收紧（原来偏松） */
body.view-dashboard .side{gap:14px}
body.view-dashboard .side>.card{padding:18px}
body.view-dashboard .side>.card>.chead{margin-bottom:13px}
body.view-dashboard .side .srow{padding:9px 2px}
body.view-dashboard .side .att-group{padding:8px 0}
body.view-dashboard .side .att-sum{margin-bottom:2px}

/* 旧布局「.card + .card{margin-top:18px}」是纵向堆叠用的，放进网格/右栏会顶开间距、
   还会让同行第二张卡矮 18px —— 首页全部清零，间距统一由 gap 控制 */
body.view-dashboard .main>.card,body.view-dashboard .side>.card,
body.view-dashboard .row2>.card+.card,body.view-dashboard .grid2>.card+.card{margin-top:0}

/* 顶栏角标：原来固定 8px 圆点，有数字时会被压扁看不见 —— 有数字就变成规整红色胶囊 */
.topbar .iconbtn .dot:not(:empty){width:auto;min-width:17px;height:17px;padding:0 4px;
  font-size:10px;font-weight:800;line-height:1;color:#fff;border-radius:999px;border-width:0;
  display:inline-flex;align-items:center;justify-content:center;top:-3px;right:-3px;
  box-shadow:0 2px 8px rgba(220,38,38,.55);box-sizing:border-box}
body:not(.theme-dark) .topbar .iconbtn .dot:not(:empty){border:1px solid #fff}

/* =====================================================================
   补丁④：数字徽章醒目 · NEW 漂浮 · 铃铛角标脉冲
   ===================================================================== */
@keyframes cnumPulse{0%,100%{box-shadow:0 0 0 0 rgba(244,63,94,.55),0 3px 10px rgba(244,63,94,.35)}
  50%{box-shadow:0 0 0 7px rgba(244,63,94,0),0 3px 14px rgba(244,63,94,.55)}}
@keyframes newFloat{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.07)}}
@keyframes bellPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.65),0 2px 8px rgba(220,38,38,.50)}
  50%{box-shadow:0 0 0 7px rgba(220,38,38,0),0 2px 12px rgba(220,38,38,.70)}}
/* 卡片标题右侧的待办数字：红橙渐变胶囊 + 扩散光环，一眼看见 */
body.view-dashboard .chead .cnum{display:inline-flex;align-items:center;justify-content:center;
  min-width:21px;height:21px;padding:0 6px;margin-left:2px;border-radius:999px;
  font-size:11.5px;font-weight:800;letter-spacing:0;color:#fff;
  background:linear-gradient(135deg,#f43f5e,#fb923c);
  box-shadow:0 3px 10px rgba(244,63,94,.45);animation:cnumPulse 1.9s ease-in-out infinite}
/* NEW 徽章：轻微上下漂浮，提示是新到的公告 / 商机 */
body.view-dashboard .srow .new{animation:newFloat 1.6s ease-in-out infinite}
/* 顶栏铃铛 / 消息角标：有数字时脉冲扩散，避免被忽略 */
.topbar .iconbtn .dot:not(:empty){animation:bellPulse 1.8s ease-in-out infinite}

/* =====================================================================
   补丁⑤：导航条自适应 —— 放得下的正常显示，多出来的收进「更多 ▾」
   ===================================================================== */
.topbar .navitem.nav-more{position:relative;padding:9px 12px;font-weight:700;opacity:.95;
  background:rgba(129,140,248,.12);box-shadow:inset 0 0 0 1px rgba(129,140,248,.28)}
.topbar .navitem.nav-more:hover{background:rgba(129,140,248,.20)}
.topbar .navitem.nav-more .caret{font-size:9px;margin-left:4px;opacity:.8}
/* 「更多」下拉：只列被挤出去的那几项，竖向小菜单 */
.topbar .nav-more-menu{position:absolute;top:calc(100% + 9px);right:0;min-width:118px;
  display:none;flex-direction:column;gap:2px;padding:8px;border-radius:14px;
  background:rgba(13,18,33,.97);border:1px solid var(--pb-line2);
  box-shadow:0 18px 44px rgba(0,0,0,.45);backdrop-filter:blur(18px);z-index:70}
.topbar .nav-more-menu.open{display:flex;animation:pop .15s ease}
.topbar .nav-more-menu .navitem{text-align:left;padding:10px 12px;font-size:13px;width:100%}
.topbar .nav-more-menu .navitem.active::after{display:none}
body:not(.theme-dark) .topbar .nav-more-menu{background:rgba(255,255,255,.98);box-shadow:0 18px 44px rgba(30,41,80,.18)}
body:not(.theme-dark) .topbar .navitem.nav-more{background:rgba(79,70,229,.10);box-shadow:inset 0 0 0 1px rgba(79,70,229,.22)}

/* 菜单名改长（立项报价 / 项目管理 / 招标商机…）后，中等屏自动隐藏图标，尽量多显示几项 */
@media (max-width:1180px){
  .topbar .navitem svg{display:none}
  .topbar .navitem{padding:10px 12px}
  .topbar .navitem.active::after{left:12px;right:12px}
}

/* 「更多 ▾」里含当前所在页时，按钮上点一个红点，提示当前页在展开里 */
.topbar .navitem.nav-more.has-active::after{content:"";position:absolute;top:5px;right:6px;
  width:7px;height:7px;border-radius:50%;background:var(--pb-red);box-shadow:0 0 6px var(--pb-red)}

/* 首图快捷入口（外出申请 / 考勤打卡 / 周报月报）：图标 + 文字，点了直接进对应功能 */
body.view-dashboard .glance .gc.gc-go{cursor:pointer;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;min-width:96px;padding:17px 16px;text-align:center}
body.view-dashboard .glance .gc.gc-go i{font-style:normal;font-size:22px;line-height:1;font-weight:800}
body.view-dashboard .glance .gc.gc-go span{font-size:11.5px;font-weight:700;color:var(--pb-txt3)}
body.view-dashboard .glance .gc.gc-go:hover{transform:translateY(-2px);
  border-color:rgba(129,140,248,.45);box-shadow:0 6px 18px rgba(129,140,248,.20)}
body:not(.theme-dark) .glance .gc.gc-go:hover{background:rgba(79,70,229,.10);border-color:rgba(79,70,229,.42)}

/* =====================================================================
   补丁⑥：合并后的「通知中心」弹窗（待办提醒 + 站内消息 两个标签）
   ===================================================================== */
.nc-tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.nc-tabs .pill-tab{display:inline-flex;align-items:center;gap:6px}
.nc-n{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;
  padding:0 5px;border-radius:999px;background:linear-gradient(135deg,#f43f5e,#fb923c);
  color:#fff;font-size:10.5px;font-weight:800;line-height:1}
.rp-time{font-size:11px;color:var(--pb-mut);flex:0 0 auto;margin-left:4px}
body:not(.theme-dark) .rp-time{color:#5d6b8c}

/* =====================================================================
   补丁⑦：导航条美化 —— 菜单收成一整块「胶囊」，中间余量全给搜索框
   ===================================================================== */
.topbar .nav{margin-left:14px;padding:5px 6px;gap:4px;border-left:none;border-radius:16px;
  background:rgba(255,255,255,.05);border:1px solid var(--pb-line);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
body:not(.theme-dark) .topbar .nav{background:rgba(15,23,42,.035);border-color:rgba(30,41,80,.10);
  box-shadow:0 1px 2px rgba(30,41,80,.05)}
.topbar .navitem:hover{transform:translateY(-1px)}
.topbar .navitem:active{transform:translateY(0)}
/* 搜索框：拉长后更像主搜索，聚焦时紫色光晕 */
.topbar .search .sin{font-size:13.5px}
.topbar .search:focus-within{box-shadow:0 0 0 4px rgba(34,211,238,.14)}
body:not(.theme-dark) .topbar .search:focus-within{box-shadow:0 0 0 4px rgba(79,70,229,.14)}

/* =====================================================================
   补丁⑧：导航胶囊改「两端半圆」+ 菜单项同步 pill 化
   ===================================================================== */
.topbar .nav{border-radius:999px;padding:5px 10px}
.topbar .navitem{border-radius:999px}
/* 选中指示条：pill 里贴边会顶出圆角，改成底部居中一小段发光短线 */
.topbar .navitem.active::after{left:28%;right:28%;bottom:5px;height:3px;border-radius:3px}
body:not(.theme-dark) .topbar .navitem.active::after{left:28%;right:28%}

/* =====================================================================
   补丁⑨：系统设置页 / 各卡片标题里的内联 SVG 图标统一缩小
   （之前没带 width/height，被 flex 容器撑到 264 / 300 / 576 / 1042px）
   ===================================================================== */
/* 兜底：所有 ICONS 走 .ic，默认 16px；更具体的上下文规则（.btn svg 等）会覆盖 */
svg.ic{width:16px;height:16px;flex:0 0 auto;display:inline-block;vertical-align:-2px}
/* 卡片标题里的图标：小、齐、不抢戏 */
.card-title svg,.card-head svg,.card-head-main svg,.card-sub svg{
  width:16px;height:16px;flex:0 0 auto;display:inline-block;vertical-align:-2px;margin-right:6px;opacity:.9}
/* 只有直接带图标的标题才转 flex，避免影响纯文字标题（:has 不支持时退回默认块级，图标仍 16px） */
.card-title:has(>svg){display:flex;align-items:center;flex-wrap:wrap}
.card-title>svg{margin-right:6px}
/* AI 复核意见头 / 其它行内图标同样收敛 */
.ai-head svg,.sec-title svg,.form-group-title svg,.panel-title svg{
  width:15px;height:15px;flex:0 0 auto;vertical-align:-2px;margin-right:5px}
/* 按钮里的图标略大一点点，保证可点性 */
.btn svg,.btn-sm svg{width:16px;height:16px;flex:0 0 auto;vertical-align:-2px}

/* =====================================================================
   补丁⑩：资金卡片底部状态改成小胶囊（原来是铺满整卡的绿色/红色色带）
   ===================================================================== */
.ft-tag{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;
  font-size:11px;font-weight:600;line-height:17px;letter-spacing:.2px;
  background:rgba(255,255,255,.07);color:var(--pb-mut);border:1px solid transparent}
.ft-tag .ftd{width:5px;height:5px;border-radius:50%;background:currentColor;flex:0 0 auto}
.ft-tag.ok{color:#34d399;background:rgba(52,211,153,.14)}
.ft-tag.warn{color:#fb7185;background:rgba(251,113,133,.14)}
body:not(.theme-dark) .ft-tag{background:rgba(30,41,80,.055);color:var(--pb-mut)}
body:not(.theme-dark) .ft-tag.ok{color:#047857;background:rgba(4,120,87,.10)}
body:not(.theme-dark) .ft-tag.warn{color:#b91c1c;background:rgba(185,28,28,.10)}
/* 卡片底部留白收一下，胶囊不贴边 */
body.view-dashboard .mc .ft{padding-top:9px}

/* =====================================================================
   补丁⑪：① 导航胶囊再扁一点  ② 生日祝福条  ③ 运势来源行
   ===================================================================== */
/* ① 导航胶囊压扁：外框 padding 收到 3px，菜单项上下 6px，整体高度约 34px */
.topbar .nav{padding:3px 8px;gap:3px}
.topbar .navitem{font-size:13px;padding:6px 14px;line-height:1.2}
.topbar .navitem.active::after{bottom:2px;height:2.5px;border-radius:3px}
.topbar .navitem svg{width:14px;height:14px;margin-right:6px}
@media (max-width:720px){ .topbar .navitem{font-size:12.5px;padding:5px 11px} }

/* ② 首页生日祝福条 */
/* 2026-10-11 用户两次反馈「生日框太长了，都顶到外出申请按钮了」：
   改成一行高的窄条（约 34px），文字不换行，宽度也不铺满，绝不再往下顶。 */
.bday{display:flex;align-items:center;gap:8px;margin:8px 0 0;padding:5px 12px;height:34px;max-height:34px;overflow:hidden;border-radius:12px;
  background:linear-gradient(100deg,rgba(236,72,153,.18),rgba(124,92,255,.16) 55%,rgba(34,211,238,.14));
  border:1px solid rgba(236,72,153,.32);
  box-shadow:0 4px 14px rgba(124,92,255,.12),inset 0 1px 0 rgba(255,255,255,.16);
  animation:bdayIn .5s var(--pb-ease, ease) both}
.bday-other{background:linear-gradient(100deg,rgba(124,92,255,.16),rgba(34,211,238,.14));border-color:rgba(124,92,255,.30)}
.bd-cake{font-size:17px;line-height:1;flex:0 0 auto;animation:cakeBounce 2.4s ease-in-out infinite}
.bd-main{min-width:0;flex:1 1 auto;display:flex;align-items:baseline;gap:8px;overflow:hidden}
.bd-hi{font-size:13px;font-weight:700;letter-spacing:.2px;color:var(--pb-txt);white-space:nowrap;flex:0 0 auto}
.bd-word{font-size:11.5px;color:var(--pb-txt2);margin-top:0;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1 1 auto}
.bd-tag{flex:0 0 auto;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap;
  background:rgba(255,255,255,.16);color:var(--pb-txt2);border:1px solid rgba(255,255,255,.18)}
body:not(.theme-dark) .bday{background:linear-gradient(100deg,rgba(236,72,153,.12),rgba(124,92,255,.10) 55%,rgba(34,211,238,.10));
  border-color:rgba(219,39,119,.26);box-shadow:0 6px 18px rgba(124,92,255,.10)}
body:not(.theme-dark) .bday-other{background:linear-gradient(100deg,rgba(124,92,255,.10),rgba(34,211,238,.10));border-color:rgba(124,92,255,.24)}
body:not(.theme-dark) .bd-tag{background:rgba(255,255,255,.75);border-color:rgba(30,41,80,.10)}
@keyframes bdayIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes cakeBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
/* 桌面端右上角悬浮着三个快捷方块，生日条让出右侧空间，避免标签被盖住 */
body.view-dashboard .bday{max-width:min(560px,calc(100% - 320px))}
@media (max-width:1080px){ body.view-dashboard .bday{max-width:100%} }
@media (max-width:720px){ .bday{gap:7px;padding:5px 10px;height:32px;max-height:32px} .bd-cake{font-size:15px} .bd-hi{font-size:12.5px} .bd-tag{display:none} }

/* ③ 星座卡片底部「运势来源」小字 */
.zsrc{margin-top:9px;font-size:10.5px;color:var(--pb-mut);opacity:.75;display:flex;align-items:center;gap:4px}
.zsrc .zs-ai{color:var(--pb-cyan);font-weight:700}
.zfade{animation:zFadeIn .45s ease both}
@keyframes zFadeIn{from{opacity:.25;transform:translateY(3px)}to{opacity:1;transform:none}}

/* =====================================================================
   补丁⑫：深色模式下导航条 / 提醒数字不够醒目（用户 1366 屏 + 深色反馈看不清）
   ===================================================================== */
/* 深色：导航胶囊加重底色与描边，和顶栏拉开层次，一眼能看见 */
body.theme-dark .topbar .nav{background:rgba(255,255,255,.085);border-color:rgba(255,255,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 2px 10px rgba(0,0,0,.28)}
body.theme-dark .topbar .navitem{color:#e8edff;font-weight:700}
body.theme-dark .topbar .navitem:hover{background:rgba(129,140,248,.24);color:#fff}
/* 深色：红色提醒数字胶囊更亮更大，深色底上一眼可见 */
body.theme-dark .topbar .iconbtn .dot{
  background:linear-gradient(135deg,#ff5a6e,#f43f5e);color:#fff;font-weight:800;
  box-shadow:0 0 0 2px rgba(9,13,26,.9),0 2px 8px rgba(244,63,94,.6)}
body.theme-dark .topbar .navitem .mn-badge{
  background:linear-gradient(135deg,#ff5a6e,#f43f5e);color:#fff;font-weight:800;
  box-shadow:0 0 0 2px rgba(9,13,26,.9),0 2px 8px rgba(244,63,94,.55)}
/* 抽屉（窄屏 ☰ 展开）：深浅主题都保证清晰可读 */
.topbar .nav.open{
  top:100%;margin-top:6px;border-radius:16px;padding:10px 12px 12px;
  max-height:calc(100vh - 90px);overflow-y:auto;z-index:200}
.topbar .nav.open .navitem{font-size:15px;padding:11px 14px;border-radius:11px}
body.theme-dark .topbar .nav.open{background:rgba(11,16,32,.99);border:1px solid rgba(255,255,255,.16);
  box-shadow:0 22px 50px rgba(0,0,0,.6)}
body:not(.theme-dark) .topbar .nav.open{background:rgba(255,255,255,.99);border:1px solid rgba(30,41,80,.14);
  box-shadow:0 22px 50px rgba(30,41,80,.18)}
body:not(.theme-dark) .topbar .nav.open .navitem{color:#16203a}
/* ☰ 按钮在深色下更明显 */
body.theme-dark .topbar .hamburger{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.18);color:#e8edff}

/* =====================================================================
   补丁⑬（2026-10-05 改版）：深色模式表单控件 —— 「深色半透明底 + 高对比浅字」
   来历：原先因为「下拉框 / 多选框在深色下看不清」，改成白底深字；虽然清楚但太突兀。
   现在回归深色主题，靠「底色提亮 + 文字提亮 + 边框加重」保证可读性，既好看又清楚。
   关键：下拉展开的 option 是系统控件，必须显式给深色底浅字，否则会白底白字看不见。
   ===================================================================== */
body.theme-dark select,
body.theme-dark input:not([type="checkbox"]):not([type="radio"]),
body.theme-dark textarea,
body.theme-dark .svc-ms-box,
body.theme-dark .svc-ms-panel{
  background:rgba(255,255,255,.07);color:#e8eef6;border:1px solid rgba(255,255,255,.24);
}
/* 下拉展开的每一项：系统默认会给白底，这里强制深色底浅字 */
body.theme-dark select option,
body.theme-dark optgroup{background:#131f2e;color:#e8eef6}
body.theme-dark select option:checked,
body.theme-dark select option:hover{background:#25405f;color:#fff}
body.theme-dark select:focus,
body.theme-dark input:not([type="checkbox"]):not([type="radio"]):focus,
body.theme-dark textarea:focus{
  border-color:#818cf8;box-shadow:0 0 0 3px rgba(129,140,248,.26);outline:none}
/* 占位符比正文暗一档，但仍要看得见 */
body.theme-dark input::placeholder,body.theme-dark textarea::placeholder{color:#8b96ab}
/* 服务类型多选：深色面板 + 浅字选项 + 靛蓝已选标签 */
body.theme-dark .svc-ms-box{box-shadow:0 1px 2px rgba(0,0,0,.35)}
body.theme-dark .svc-ms-panel{background:#16212f;border-color:rgba(255,255,255,.16);box-shadow:0 16px 40px rgba(0,0,0,.55)}
body.theme-dark .svc-ms-opt{color:#dbe4f5}
body.theme-dark .svc-ms-opt:hover{background:rgba(129,140,248,.16);color:#fff}
body.theme-dark .svc-ms-opt.on{background:rgba(129,140,248,.22);color:#fff}
body.theme-dark .svc-ms-ph{color:#8b96ab}
body.theme-dark .svc-tag{background:rgba(79,70,229,.30);color:#c7d2fe;border-color:rgba(129,140,248,.42)}
/* 日期/时间控件跟随深色（日历图标与弹出的日历面板都变深色，不再白得突兀） */
body.theme-dark input[type="date"],body.theme-dark input[type="time"],
body.theme-dark input[type="month"],body.theme-dark input[type="datetime-local"]{color-scheme:dark}
/* 弹窗里的控件被 styles.css「body.theme-dark .modal .form-item select」压住，这里同级补一刀（后加载生效） */
body.theme-dark .modal .form-item select,
body.theme-dark .modal .form-item input:not([type="checkbox"]):not([type="radio"]),
body.theme-dark .modal .form-item textarea,
body.theme-dark .form-item select,
body.theme-dark .form-item input:not([type="checkbox"]):not([type="radio"]),
body.theme-dark .form-item textarea{
  background:rgba(255,255,255,.07);color:#e8eef6;border-color:rgba(255,255,255,.24)}
body.theme-dark .modal .form-item select option{background:#131f2e;color:#e8eef6}

/* =====================================================================
   补丁⑭：浅色模式下提醒数字「白字 + 透明底」完全看不见 → 补实底
   ===================================================================== */
.topbar .iconbtn .dot,
.topbar .navitem .mn-badge{
  background:linear-gradient(135deg,#ff5a6e,#f43f5e);color:#fff;font-weight:800;
  box-shadow:0 0 0 2px rgba(255,255,255,.96),0 2px 8px rgba(244,63,94,.45)}
body:not(.theme-dark) .topbar .iconbtn .dot,
body:not(.theme-dark) .topbar .navitem .mn-badge{
  background:#e11d48;color:#fff;
  box-shadow:0 0 0 2px rgba(255,255,255,.98),0 2px 8px rgba(225,29,72,.35)}
/* 浅色下顶栏品牌 / 姓名 / 图标一律深色，防止主题切换残留浅色文字 */
body:not(.theme-dark) .topbar .brand-txt,
body:not(.theme-dark) .topbar .brand-txt b,
body:not(.theme-dark) .topbar .avatar,
body:not(.theme-dark) .topbar .avatar .av-name,
body:not(.theme-dark) .topbar .iconbtn{color:#16203a}
body:not(.theme-dark) .topbar .avatar{background:rgba(255,255,255,.9)}

/* =====================================================================
   补丁⑮：顶栏品牌 / 头像「防消失」兜底（任何页面、任何主题都不许被挤没、被盖住、被压成 0 宽）
   ===================================================================== */
.topbar .brand{position:relative;z-index:120;flex:0 0 auto;min-width:0;display:flex;align-items:center;gap:10px}
.topbar .brand .logo{flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#6366f1,#06b6d4);color:#fff;font-weight:800}
.topbar .brand-txt{display:flex;flex-direction:column;justify-content:center;min-width:0}
.topbar .brand-txt b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:800;letter-spacing:.2px}
.topbar .brand-txt span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.75}
.topbar .actions-r{position:relative;z-index:120;flex:0 0 auto;display:flex;align-items:center}
.topbar .avatar{flex:0 0 auto;display:flex;align-items:center;min-width:0}
.topbar .avatar .av-name{white-space:nowrap}
/* 浅色：深字；深色：浅字 —— 两边都强制一遍，杜绝「浅底浅字 / 深底深字」看不见 */
body:not(.theme-dark) .topbar .brand-txt b,
body:not(.theme-dark) .topbar .brand-txt span{color:#16203a}
body.theme-dark .topbar .brand-txt b,
body.theme-dark .topbar .brand-txt span{color:#e8edff}
body:not(.theme-dark) .topbar .avatar .av-name{color:#16203a}
body.theme-dark .topbar .avatar .av-name{color:#e8edff}

/* =====================================================================
   补丁⑯：补齐「从未定义」的渐变变量（系统性的隐形元凶）
   事实：styles.css 有 38 处用 var(--grad)、ui-b.css 有 18 处用 var(--pb-grad)，
   但 --grad 全文件从未定义；--pb-grad 只在 body.theme-dark 里定义了。
   → 浅色模式下这些元素的渐变底全部失效变透明（头像圆圈、主按钮、徽章、
     进度条、选中态、星座标签…），出现「白底白字 / 透明底」看不见。
   ===================================================================== */
:root{ --grad:linear-gradient(135deg,#6366f1,#0ea5e9); }
body:not(.theme-dark){ --pb-grad:linear-gradient(90deg,#6366f1,#06b6d4); }
/* 头像圆圈：强制渐变底 + 白字（原来是 var(--pb-grad) 透明底 + 深/白字 → 隐形） */
.topbar .avatar .av{
  background:linear-gradient(135deg,#6366f1,#06b6d4) !important;color:#fff !important;
  display:flex;align-items:center;justify-content:center;font-weight:800;
  box-shadow:0 2px 8px rgba(99,102,241,.35),inset 0 1px 0 rgba(255,255,255,.45)}
/* 首页「负责人」小头像同理 */
body.view-dashboard .own .av{
  background:linear-gradient(135deg,#6366f1,#06b6d4) !important;color:#fff !important;
  display:flex;align-items:center;justify-content:center;font-weight:800}

/* =====================================================================
   补丁⑰：压缩首页「经营概览」「财务管理」两块的高度（用户要求"缩一点"）
   仅作用于 body.view-dashboard，不动资金总览 / 经营概览明细等其它页。
   手段：内边距 ↓、网格行间距 ↓、数值字号微调、趋势柱略矮。
   ===================================================================== */
/* 经营概览：6 张小卡 */
body.view-dashboard .stats{ gap:11px }
body.view-dashboard .st{ padding:11px 14px }
body.view-dashboard .st .ico{ margin-bottom:6px }
body.view-dashboard .st b{ font-size:19px }
body.view-dashboard .st b .u{ font-size:10.5px }
body.view-dashboard .st .lb{ margin-top:2px }
body.view-dashboard .st .sb{ margin-top:1px }
body.view-dashboard .spark{ height:32px }
/* 财务管理：9 张资金卡 */
body.view-dashboard .money{ gap:11px }
body.view-dashboard .mc{ padding:11px 14px }
body.view-dashboard .mc .top{ margin-bottom:6px }
body.view-dashboard .mc b{ font-size:18px }
body.view-dashboard .mc .sb{ margin-top:1px }
body.view-dashboard .mc .ft{ padding-top:6px }
body.view-dashboard .ering{ width:30px;height:30px }

/* =====================================================================
   补丁⑱：首页 hero「＋ 新建项目」专属配色（彻底解决"看不清"）
   背景：该按钮是 class="btn primary"（空格类），同时命中多条 .btn.primary 规则。
   浅色下曾是「深渐变底 + 深色字 #0b1020」→ 深底深字完全看不见；
   hover 又用 brightness(1.1) 把青色端漂浅，白字对比骤降。
   做法：给它专属类 .btn-hero（特异度高于所有 .btn.primary 规则）。
   浅色=深渐变+白字，深色=亮渐变+深字，hover 只做「上浮+阴影」，绝不漂白。
   ===================================================================== */
body.view-dashboard .btn.primary.btn-hero{
  background:linear-gradient(90deg,#4f46e5,#0e7490) !important;
  color:#fff !important;border:none;font-weight:700}
body.view-dashboard .btn.primary.btn-hero:hover{
  background:linear-gradient(90deg,#4338ca,#0b5f78) !important;
  color:#fff !important;filter:none;transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(79,70,229,.34)}
body.view-dashboard.theme-dark .btn.primary.btn-hero{
  background:linear-gradient(90deg,#818cf8,#22d3ee) !important;color:#0b1020 !important}
body.view-dashboard.theme-dark .btn.primary.btn-hero:hover{
  background:linear-gradient(90deg,#a5b4fc,#67e8f9) !important;
  color:#0b1020 !important;filter:none;transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(34,211,238,.28)}

/* =====================================================================
   2026-10-10 移动优先补丁（第二轮）：今日提醒 / 项目逾期 / 提醒中心 /
   项目页速览条 / 首页概览卡。放 ui-b.css 末尾 —— 它最后加载，规则必赢。
   ===================================================================== */
@media (max-width: 760px) {
  /* ---- 1) 首页「经营概览」「资金往来」：手机上保持 2 列（原 460px 断点掉到 1 列，
          一张卡占一整屏，滑 6 下才滑完）。收紧字号与内边距保证 2 列放得下。 ---- */
  body.view-dashboard .stats, body.view-dashboard .money { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  body.view-dashboard .st, body.view-dashboard .mc { padding: 10px 11px; gap: 8px; }
  body.view-dashboard .st .ico { width: 26px; height: 26px; border-radius: 8px; margin-bottom: 4px; }
  body.view-dashboard .st b { font-size: 16.5px; }
  body.view-dashboard .st .lb { font-size: 11px; }
  body.view-dashboard .st .sb { font-size: 10px; }
  body.view-dashboard .spark { height: 28px; }
  body.view-dashboard .spark i { width: 4px; }

  /* ---- 2) 提醒中心 / 弹窗里的提醒行：手机上「标签+按钮」会把正文挤成一根细条。
          改成两段式：第一行 标签←→按钮，第二行 标题+说明通栏铺满。 ---- */
  .rm-item, .rp-item { flex-wrap: wrap; row-gap: 7px; column-gap: 8px; padding: 11px 12px 11px 14px; }
  .rm-tag { order: 1; }
  .rm-ops, .rp-item-actions { order: 2; margin-left: auto; flex-wrap: wrap; justify-content: flex-end; row-gap: 5px; }
  .rm-body, .rp-body { order: 3; flex: 1 1 100%; }
  .rm-title { font-size: 13px; }
  .rm-msg { font-size: 11.5px; }
  .rm-act, .rm-done { min-height: 32px; }
  /* 提醒中心独立页：取消 430px 高度限高，让页面自然往下滚（弹窗里的仍保留限高） */
  .rmp-list.rm-list { max-height: none; overflow: visible; }

  /* ---- 3) 项目驾驶舱顶部「今日速览」数字条：原来 8 片挤一行变成竖排文字，
          改成横向滑动（每片保住 118px 最小宽），像刷卡片一样左右划。 ---- */
  .glance-light, .glance-strip { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; padding-bottom: 4px; margin-left: -2px; margin-right: -2px; padding-left: 2px; padding-right: 2px; }
  .glance-light::-webkit-scrollbar, .glance-strip::-webkit-scrollbar { display: none; }
  .glance-light .dhg-item, .glance-strip .dhg-item { flex: 0 0 auto; min-width: 118px; }
  .glance-light .dhg-item b { font-size: 19px; }
  .glance-light .dhg-item span { font-size: 11px; }

  /* ---- 4) 项目卡片（列表页）里的三条财务小字：3 列在 390px 下每格仅 85px，
          金额一挤就换行。改成第一行 2 列、第二行 1 列的自然换行网格。 ---- */
  .pc-fin { grid-template-columns: repeat(2, 1fr); }
  .pc-fin-item .v { font-size: 14px; }

  /* ---- 5) 弹窗内表格/字段：标签不参与挤压 ---- */
  .ap-dm-proj { padding: 9px 11px; }
  .ap-dm-proj-go { white-space: nowrap; }
}

/* =====================================================================
   2026-10-11 「点整条就跳」统一交互（用户：通知中心不能点击 / 不要去处理按钮）
   —— 凡是带 rp-jumpable / rm-jumpable / ng-go 的条目，整条都可点，
      不用再找按钮；右侧一个 › 提示可点。
   ===================================================================== */
.rp-jumpable:hover, .rm-jumpable:hover {
  border-color: color-mix(in srgb, var(--blue, #5b5bd6) 42%, var(--border, #e6e9ef));
  background: color-mix(in srgb, var(--blue, #5b5bd6) 5%, var(--bg-2, #fff));
}
.rp-chev, .ng-go {
  flex: 0 0 auto; align-self: center; font-size: 15px; line-height: 1;
  color: var(--text-3, #8a9099); margin-left: 4px; transition: transform .18s ease, color .18s ease;
}
.rp-jumpable:hover .rp-chev, .rm-jumpable:hover .rp-chev { color: var(--blue, #5b5bd6); transform: translateX(3px); }
.pc-newguide[data-jump]:hover .ng-go { color: var(--blue, #5b5bd6); transform: translateX(3px); }
.pc-newguide[data-jump] { transition: border-color .18s ease, background .18s ease; }
.pc-newguide[data-jump]:hover { filter: brightness(1.03); }
.rp-item-actions .rp-time { font-size: 11.5px; color: var(--text-3, #8a9099); flex: 0 0 auto; }

/* =====================================================================
   项目驾驶舱 · 参考安迅达风格重制（2026-10-11）
   —— 只改样式，不改任何操作 / 流程：所有按钮、板块、跳转照旧。
   风格语言（学安迅达）：白卡 + 软阴影 + 细线分隔 + 蓝色点缀
      + KPI 左侧色条 + 胶囊步骤条 + 顶部横向板块导航。
   自有创意：KPI 色条按数值语义着色、当前步骤「当前」小标、
      导航条两端渐隐、卡片 hover 微抬、提示条圆角轻阴影。
   ===================================================================== */

/* ① 顶部标题区 → 白色主信息卡（保留左侧渐变小竖条） */
.pd-ax .view-head{
  background: var(--card, #fff); border: 1px solid var(--line, #eaebf5);
  border-radius: 14px; box-shadow: 0 6px 22px rgba(20,33,61,.07);
  padding: 22px 26px 20px 28px; margin: 0 0 24px;
  transition: box-shadow .2s ease;
}
.pd-ax .view-head:hover{ box-shadow: 0 10px 30px rgba(20,33,61,.11); }

/* ② 概览统计 → 安迅达 KPI 卡：白卡 + 左侧 4px 色条 + 悬停微抬 */
.pd-ax .glance-light{ gap: 14px; }
.pd-ax .glance-light .dhg-item{
  background: var(--card, #fff); border: 1px solid var(--line, #eaebf5) !important;
  border-left: 4px solid var(--blue, #5b5bd6) !important;
  border-radius: 12px; padding: 16px 18px 15px;
  box-shadow: 0 4px 14px rgba(20,33,61,.05);
  transition: transform .16s ease, box-shadow .16s ease;
}
.pd-ax .glance-light .dhg-item:hover{ transform: translateY(-2px); box-shadow: 0 10px 26px rgba(20,33,61,.11); }
.pd-ax .glance-light .dhg-item b{
  font-size: 20px; font-weight: 800; letter-spacing: .2px; line-height: 1.2;
  background: none !important; -webkit-background-clip: initial; background-clip: initial;
  color: var(--text, #191a2e) !important; -webkit-text-fill-color: initial;
}
.pd-ax .glance-light .dhg-item span{ font-size: 11.5px; font-weight: 600; color: var(--text-3, #9398b8); letter-spacing: .04em; }
/* 创意：色条跟着数值语义走（沿用已有 c-* 颜色类） */
.pd-ax .glance-light .dhg-item:has(b.c-green){ border-left-color: var(--green, #16a34a) !important; }
.pd-ax .glance-light .dhg-item:has(b.c-red){ border-left-color: var(--red, #e23b3b) !important; }
.pd-ax .glance-light .dhg-item:has(b.c-gold){ border-left-color: #d97706 !important; }
.pd-ax .glance-light .dhg-item:has(b.c-purple){ border-left-color: #7c3aed !important; }
.pd-ax .glance-light .dhg-item:has(b.c-navy){ border-left-color: var(--navy-2, #312e81) !important; }
.pd-ax .glance-light .dhg-item b.c-green{ color: var(--green, #16a34a) !important; }
.pd-ax .glance-light .dhg-item b.c-red{ color: var(--red, #e23b3b) !important; }
.pd-ax .glance-light .dhg-item b.c-gold{ color: #d97706 !important; }
.pd-ax .glance-light .dhg-item b.c-purple{ color: #7c3aed !important; }
.pd-ax .glance-light .dhg-item b.c-navy{ color: var(--navy-2, #312e81) !important; }

/* ③ 生命周期时间线 → 安迅达胶囊步骤条（编号圈 + 名称 + 右侧状态） */
.pd-ax .timeline-card{ border-radius: 14px; }
.pd-ax .timeline{ display: flex; flex-wrap: wrap; gap: 8px; padding: 4px 0 2px; align-items: stretch; }
.pd-ax .timeline::before{ display: none; }
.pd-ax .tl-step{
  position: relative; flex: 1 1 150px; display: flex; align-items: center; gap: 8px;
  text-align: left; padding: 9px 12px; border-radius: 10px;
  border: 1px solid var(--line, #eaebf5); background: var(--card, #fff);
  transition: transform .16s ease, box-shadow .16s ease;
}
.pd-ax .tl-step:hover{ transform: translateY(-2px); box-shadow: 0 8px 20px rgba(20,33,61,.10); }
.pd-ax .tl-dot{
  width: 22px; height: 22px; flex: 0 0 22px; margin: 0; font-size: 11px; font-weight: 700;
  box-shadow: none !important; border-width: 1.5px; animation: none !important;
}
.pd-ax .tl-label{ font-size: 12.5px; font-weight: 700; color: var(--text, #191a2e); }
.pd-ax .tl-state{ margin: 0 0 0 auto; font-size: 11px; font-weight: 600; color: var(--text-3, #9398b8); white-space: nowrap; }
.pd-ax .tl-step.done{ border-color: var(--green, #16a34a); background: #f2fbf5; }
.pd-ax .tl-step.done .tl-label{ color: var(--green, #16a34a); }
.pd-ax .tl-step.done .tl-dot{ background: var(--green, #16a34a); color: #fff; border-color: var(--green, #16a34a); }
.pd-ax .tl-step.active, .pd-ax .tl-step.current{ border-color: var(--blue, #5b5bd6); box-shadow: 0 0 0 3px rgba(91,91,214,.12); }
.pd-ax .tl-step.active .tl-dot, .pd-ax .tl-step.current .tl-dot{ background: var(--blue, #5b5bd6); color: #fff; border-color: transparent; }
.pd-ax .tl-step.partial{ border-color: var(--blue, #5b5bd6); }
.pd-ax .tl-step.partial .tl-dot{ background: var(--blue, #5b5bd6); color: #fff; border-color: transparent; }
.pd-ax .tl-step.todo{ opacity: .72; border-style: dashed; }
.pd-ax .tl-step.terminated{ border-color: var(--red, #e23b3b); background: #fdf4f4; }
.pd-ax .tl-step.terminated .tl-label{ color: var(--red, #e23b3b); }
/* 创意：当前进行到的步骤，右上角别一个「当前」小蓝标 */
.pd-ax .tl-step.current::after{
  content: '当前'; position: absolute; top: -7px; right: 10px;
  background: var(--blue, #5b5bd6); color: #fff;
  font-size: 9.5px; font-weight: 700; padding: 1px 6px; border-radius: 6px; line-height: 1.4;
}

/* ④ 板块导航 → 安迅达顶部横向胶囊条（吸顶 + 两端渐隐，操作照旧走 switchCockpit） */
.pd-ax .cockpit{ flex-direction: column; gap: 14px; align-items: stretch; }
.pd-ax .cockpit-nav{
  position: sticky; top: 70px; z-index: 30; width: 100%;
  display: flex; gap: 6px; overflow-x: auto; padding: 8px 10px;
  background: var(--card, #fff); backdrop-filter: none; -webkit-backdrop-filter: none;
  border: 1px solid var(--line, #eaebf5); border-radius: 12px;
  box-shadow: 0 6px 22px rgba(20,33,61,.07); scrollbar-width: thin;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 14px, #000 calc(100% - 14px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 14px, #000 calc(100% - 14px), transparent);
}
.pd-ax .cockpit-nav .cn-item{
  width: auto; white-space: nowrap; flex: 0 0 auto;
  padding: 8px 15px; border-radius: 9px; font-size: 13px; font-weight: 600;
  color: var(--text-2, #4c5170); border: 1px solid transparent; background: transparent;
}
.pd-ax .cockpit-nav .cn-item:hover{ background: var(--blue-bg, #edeefc); color: var(--blue, #5b5bd6); }
.pd-ax .cockpit-nav .cn-item.active{ background: var(--blue, #5b5bd6); color: #fff; box-shadow: 0 4px 12px rgba(91,91,214,.30); }

/* ⑤ 面板卡片 → 白卡 + 细线 + 软阴影；卡片头加分隔线（安迅达 card-header 感） */
.pd-ax .cockpit-body .card, .pd-ax > .card{
  border-radius: 14px; border: 1px solid var(--line, #eaebf5);
  box-shadow: 0 6px 22px rgba(20,33,61,.07);
}
.pd-ax .card-head{
  margin-bottom: 14px; padding-bottom: 12px;
  border-bottom: 1px solid var(--line, #eaebf5);
}
.pd-ax .card-title{ font-size: 15px; font-weight: 700; }

/* ⑥ 提示条 → 安迅达 alert 感（圆角小一号 + 轻阴影） */
.pd-ax .notice{ border-radius: 10px; padding: 12px 16px; box-shadow: 0 4px 14px rgba(20,33,61,.05); }

/* ⑦ 按钮统一 9px 圆角（安迅达按钮质感） */
.pd-ax .btn{ border-radius: 9px; }

/* ⑧ 窄屏自适应 */
@media (max-width: 760px){
  .pd-ax .tl-step{ flex: 1 1 100%; }
  .pd-ax .cockpit-nav{ top: 56px; }
  .pd-ax .view-head{ padding: 16px 18px 16px 22px; margin-bottom: 20px; }
}

/* ⑩ 顶部信息条（学安迅达「项目基本信息」抬头看全；用户要求「更明显」） */
.pd-ax .view-head{ flex-wrap: wrap; }
.pd-ax .pd-info{
  flex: 0 0 100%; margin-top: 22px; padding-top: 20px;
  border-top: 1px solid var(--line, #eaebf5);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 28px 48px;
}
.pd-ax .pd-inf{ min-width: 0; }
.pd-ax .pd-inf-l{
  font-size: 11px; font-weight: 600; color: var(--text-3, #9398b8);
  letter-spacing: .05em; margin-bottom: 3px; display: flex; align-items: center; gap: 5px;
}
.pd-ax .pd-inf-l::before{
  content: ''; width: 3px; height: 10px; border-radius: 2px;
  background: var(--blue, #5b5bd6); opacity: .55; flex: 0 0 auto;
}
.pd-ax .pd-inf-v{
  font-size: 13.5px; font-weight: 700; color: var(--text, #191a2e);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
@media (max-width: 760px){
  .pd-ax .pd-info{ grid-template-columns: repeat(2, 1fr); gap: 18px 20px; }
}

/* ⑪ 板块内部排版：间距加大 + 字体与系统统一（2026-10-11 用户要求） */
.pd-ax .cockpit-panel{ font-size: 13.5px; line-height: 1.6; color: var(--text, #191a2e); }
.pd-ax .cockpit-panel .card{ padding: 24px; }
.pd-ax .cockpit-panel .card + .card{ margin-top: 20px; }
.pd-ax .card-head{ margin-bottom: 16px; padding-bottom: 14px; }
.pd-ax .card-sub{ margin-top: 4px; }

/* 键值行：行距加大、标签列加宽、颜色统一 */
.pd-ax .kv{ padding: 12px 0; font-size: 13.5px; align-items: baseline; }
.pd-ax .kv .k{ width: 120px; color: var(--text-3, #9398b8); font-size: 12.5px; font-weight: 600; }
.pd-ax .kv .v{ font-weight: 600; }
.pd-ax .kv-sub{ margin-top: 3px; }
.pd-ax .section-grid{ gap: 22px 30px; }

/* 人员行 / 分配条 */
.pd-ax .team-line{ padding: 9px 0; }
.pd-ax .team-member{ margin-right: 8px; }
.pd-ax .assign-bar{ padding: 13px 16px; margin-bottom: 16px; gap: 16px; }

/* 表格：单元格留白加大、字号统一 13px */
.pd-ax .cockpit-panel table{ font-size: 13px; }
.pd-ax .cockpit-panel table th{ padding: 10px 12px; font-size: 12.5px; color: var(--text-3, #9398b8); }
.pd-ax .cockpit-panel table td{ padding: 11px 12px; }

/* 面板内提示 / 空态也别太挤 */
.pd-ax .cockpit-panel .notice{ margin-bottom: 12px; }
.pd-ax .cockpit-panel .empty{ padding: 26px 12px; }

@media (max-width: 760px){
  .pd-ax .cockpit-panel .card{ padding: 18px 16px; }
  .pd-ax .kv .k{ width: 96px; }
}

/* ⑫ 「⚡ 快捷操作」按钮底色与系统其他按钮统一（2026-10-11 用户要求：
    原来蓝紫渐变底色在一排白底按钮里太突兀；编辑项目本来就是默认白底，无需改） */
.pd-ax .qa-toggle{
  background: #fff; color: var(--text, #191a2e);
  border: 1px solid var(--line, #eaebf5); box-shadow: none; font-weight: 600;
}
.pd-ax .qa-toggle:hover{
  border-color: #d6d8ee; background: #f4f5fe; color: var(--text, #191a2e);
  box-shadow: 0 6px 16px rgba(30,27,75,.07); filter: none;
}
body.theme-dark .pd-ax .qa-toggle{ background: var(--card); color: var(--text); }
body.theme-dark .pd-ax .qa-toggle:hover{ background: rgba(91,91,214,.14); }

/* ⑬ 2026-10-11 截图反馈三连修：
    1) KPI 卡「万元」被基础样式 .dhg-item span{display:block} 挤到数字下面 → 强制同行
    2) 客户 / 所属框架两行排版（用户原话「可以两行」），长名省略号
    3) 项目驾驶舱页全屏铺开（用户：「下面导航信息页面不全屏太难看」） */
.pd-ax .glance-light .dhg-item b .unit{
  display: inline !important; margin-top: 0 !important; margin-left: 3px;
  font-size: 12px; font-weight: 600; color: var(--text-3, #9398b8); letter-spacing: 0;
}
.pd-ax .glance-light .dhg-item{ flex: 1 1 150px; }
.pd-ax .vh-sub-row{ display: flex; align-items: baseline; gap: 2px; margin-top: 5px; min-width: 0; }
.pd-ax .vh-sub-row .vh-lab{ flex: 0 0 auto; font-size: 12.5px; color: var(--text-3, #9398b8); font-weight: 600; }
.pd-ax .vh-sub-row .vh-key{ font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.view-project .content{ max-width: none; }

/* ⑭ 2026-10-11 晚 线上截图反馈五条：
    1) 头部操作按钮样式统一（申请暂停/删除项目原来是金底/红底，一排里很跳）
    2) 锁定的阶段步骤做得更明显（灰底 + 虚线 + 🔒 未开放）
    3) 信息条长文本（合同名称）允许两行，不再一刀切省略号
    4) 全屏规则再加固（content 左右留白保留、宽度撑满） */
.pd-ax .vh-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.pd-ax .vh-actions .btn:not(:disabled):not([disabled]){
  background:#fff; color:var(--text,#191a2e);
  border:1px solid var(--line,#eaebf5); box-shadow:none;
  padding:9px 15px; font-size:13px; font-weight:600; border-radius:9px; margin-right:0;
}
.pd-ax .vh-actions .btn:not(:disabled):not([disabled]):hover{
  background:#f4f5fe; border-color:#d6d8ee; filter:none; transform:none;
  box-shadow:0 4px 12px rgba(30,27,75,.06);
}
/* 删除项目：同样是白底，只用红字红边提示危险性，保持一排按钮高度/底色统一 */
.pd-ax .vh-actions .btn.btn-danger:not(:disabled):not([disabled]){
  background:#fff; color:var(--red,#e23b3b); border-color:rgba(226,59,59,.42);
}
.pd-ax .vh-actions .btn.btn-danger:not(:disabled):not([disabled]):hover{
  background:rgba(226,59,59,.06); border-color:rgba(226,59,59,.6);
}
body.theme-dark .pd-ax .vh-actions .btn:not(:disabled):not([disabled]){ background:var(--card); }
body.theme-dark .pd-ax .vh-actions .btn:not(:disabled):not([disabled]):hover{ background:rgba(91,91,214,.14); }

/* 锁定步骤：灰底 + 加粗虚线 + 灰字，一眼看出「还锁着」 */
.pd-ax .tl-step.todo{
  opacity:1; background:var(--bg-2,#f4f5f9);
  border:1.5px dashed #ccd0e0; cursor:not-allowed;
}
.pd-ax .tl-step.todo:hover{ transform:none; box-shadow:none; }
.pd-ax .tl-step.todo .tl-label, .pd-ax .tl-step.todo .tl-state{ color:var(--text-3,#9398b8); }
.pd-ax .tl-step.todo .tl-dot{ background:#e4e6f1; color:#9aa0bb; border-color:#ccd0e0; }

/* 信息条值：长文本（如合同名称）最多两行显示，鼠标悬停有全名（title） */
.pd-ax .pd-inf-v{
  white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; word-break:break-all; line-height:1.45;
}

/* 全屏加固：宽度撑满（保留左右 28px 呼吸边距） */
body.view-project .content{ max-width:none; }

/* ⑮ 2026-10-11 21:32 用户：所属框架和客户字体一致、行间距加大；全屏补顶栏 */
.pd-ax .vh-sub-row{ margin-top:10px; line-height:1.6; }
.pd-ax .vh-sub-row .vh-key,
.pd-ax .vh-sub-row a.vh-key.vh-link{
  font-size:13.5px; font-weight:700; letter-spacing:0;
  color:var(--text,#191a2e); border-bottom:none; padding-bottom:0;
}
.pd-ax .vh-sub-row a.vh-key.vh-link{ color:var(--blue,#5b5bd6); } /* 仅保留蓝色表示可点，字体与「客户」完全一致 */
.pd-ax .vh-sub-row a.vh-key.vh-link:hover{ opacity:.75; }
/* 全屏：顶部条（返回/标题栏）也撑满，和内容左右对齐 */
body.view-project .page-head{ max-width:none; }

/* ⑯ 2026-10-11 22:20 全屏再加固：顶栏内容区也撑满，与正文左右对齐（用户：项目页每个栏目都要全屏） */
body.view-project .topbar-in{ max-width:none; }

/* ⑰ 2026-10-11 22:50 全屏终极版：!important 双保险（app.js 另有内联样式兜底 ensureProjectFullWidth，
   渲染驾驶舱时直接写内联 maxWidth:none，离开项目页自动清除——CSS 缓存/body 类失效都不再影响全屏） */
body.view-project .content{ max-width:none !important; }
body.view-project .page-head{ max-width:none !important; }
body.view-project .topbar-in{ max-width:none !important; }

/* ════════════════════════════════════════════════════════════════
   ⑱ 2026-10-11 审批中心全新设计（col145）：列表卡片 + 全屏详情页
   ════════════════════════════════════════════════════════════════ */
/* —— 列表卡片（扁平网格，关键信息一眼可见）—— */
.ap2-card { padding: 14px 16px; }
.ap2-head { display: flex; align-items: center; gap: 9px; }
.ap2-no { font-size: 12px; color: #9aa0bb; font-weight: 500; }
.ap2-badge-todo { font-size: 12px; font-weight: 500; color: #a9700b; background: #fdf3e0; border-radius: 7px; padding: 3px 9px; animation: apPulse 1.6s ease-in-out infinite; }
@keyframes apPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(247,169,0,.45); } 50% { box-shadow: 0 0 0 4px rgba(247,169,0,0); } }
.ap2-title { font-size: 15px; font-weight: 500; color: #191a2e; margin: 10px 0 12px; line-height: 1.4; }
.ap2-kvgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; }
.ap2-kv { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ap2-kv-k { font-size: 11px; color: #9aa0bb; }
.ap2-kv-v { font-size: 13px; color: #2c2c2a; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ap2-cc { font-size: 11px; color: #9aa0bb; }
.ap2-foot { padding-top: 11px; margin-top: 12px; border-top: 0.5px solid #f0f0f6; }
.ap2-prog { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ap2-prog-label { font-size: 11px; color: #9aa0bb; margin-right: 2px; }
.ap2-step { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: #6b7280; }
.ap2-step-dot { width: 16px; height: 16px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 10px; color: #fff; background: #cfd2e0; }
.ap2-step.done .ap2-step-dot { background: #1d9e75; }
.ap2-step.done { color: #3b6d11; }
.ap2-step.cur .ap2-step-dot { background: #5b5bd6; box-shadow: 0 0 0 3px #eeeaff; }
.ap2-step.cur { color: #534ab7; font-weight: 500; }
.ap2-step.reject .ap2-step-dot { background: #e24b4a; }
.ap2-step.reject { color: #a32d2d; }
.ap2-step-arrow { color: #cfd2e0; font-size: 11px; }
.ap2-ops { display: flex; gap: 8px; align-items: center; margin-top: 12px; }
.ap2-me { font-size: 12px; color: #a9700b; font-weight: 500; }
.ap2-urged { font-size: 11px; color: #9aa0bb; }

/* —— 全屏详情页（两栏：左申请详情 / 右审批时间线）—— */
.adt { display: flex; flex-direction: column; gap: 14px; }
.adt-bar { display: flex; align-items: center; gap: 12px; }
.adt-bar-title { font-size: 14px; font-weight: 500; color: #191a2e; }
.adt-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: #fff; border: 0.5px solid #e2e3ee; border-radius: 12px; padding: 14px 16px; }
.adt-title { font-size: 17px; font-weight: 500; color: #191a2e; }
.adt-no { font-size: 12px; color: #9aa0bb; font-weight: 500; }
.adt-2col { display: grid; grid-template-columns: 1.7fr 1fr; gap: 16px; align-items: start; }
@media (max-width: 860px) { .adt-2col { grid-template-columns: 1fr; } }
.adt-sec-t { font-size: 14px; font-weight: 500; color: #191a2e; margin: 0 0 10px; padding-bottom: 8px; border-bottom: 0.5px solid #eef0f6; }
.adt-main .ap-gap-warn { margin-bottom: 14px; }
.adt-side-status { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.adt-side-step { font-size: 12px; color: #6b7280; }
.adt-tl { position: relative; padding-left: 26px; }
.adt-node { position: relative; padding: 0 0 18px; }
.adt-node:before { content: ''; position: absolute; left: -19px; top: 20px; bottom: -2px; width: 1.5px; background: #ececf3; }
.adt-node:last-child:before { display: none; }
.adt-ic { position: absolute; left: -27px; top: 1px; width: 18px; height: 18px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #fff; background: #cfd2e0; }
.adt-node.done .adt-ic { background: #1d9e75; }
.adt-node.cur .adt-ic { background: #5b5bd6; box-shadow: 0 0 0 4px #eeeaff; }
.adt-node.reject .adt-ic { background: #e24b4a; }
.adt-node-name { font-size: 13px; font-weight: 500; color: #191a2e; }
.adt-node-role { font-size: 12px; color: #6b7280; margin-top: 1px; }
.adt-node-time { font-size: 12px; color: #9aa0bb; margin-top: 3px; }
.adt-node-com { font-size: 12px; color: #6b7280; margin-top: 5px; background: #f7f7fb; border-radius: 7px; padding: 6px 9px; }
.adt-multi { display: flex; flex-direction: column; gap: 3px; margin-top: 6px; }
.adt-multi-i { font-size: 12px; color: #6b7280; }
.adt-multi-i.ok { color: #3b6d11; }
.adt-multi-i.no { color: #a32d2d; }
.adt-tip { font-size: 12px; color: #a9700b; margin: 14px 0 8px; }
.adt-ops { display: flex; gap: 8px; flex-wrap: wrap; }
.adt-ops .btn { flex: 1; min-width: 96px; }

/* ============ 审批详情页 · 视觉升级（col146） ============ */
/* 头部：类型 + 标题 + 单号 + 申请人/提交时间 + 状态 */
.adt-head { align-items: flex-start; padding: 16px 18px; gap: 12px; }
.adt-head-main { min-width: 0; flex: 1 1 auto; }
.adt-head-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.adt-title { font-size: 18px; }
.adt-no { font-size: 12px; color: #9aa0bb; font-weight: 600; letter-spacing: .3px; }
.adt-head-meta { display: flex; flex-wrap: wrap; gap: 6px 20px; margin-top: 9px; font-size: 12.5px; color: #6b7280; }
.adt-head-meta b { color: #191a2e; font-weight: 600; }

/* 申请详情：两栏字段网格（桌面），窄屏单列 */
.adt-main .ap-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px 26px; }
.adt-main .ap-dl-row { flex-direction: column; gap: 3px; align-items: stretch; }
.adt-main .ap-dl-label { flex: none; text-align: left; font-size: 12px; color: #9aa0bb; }
.adt-main .ap-dl-value { font-size: 14px; font-weight: 500; color: #191a2e; line-height: 1.5; word-break: break-word; }
.adt-main .ap-dl-row-table { grid-column: 1 / -1; }

/* 右侧时间线卡片 sticky（仅桌面） */
.adt-side .panel.sticky { position: sticky; top: 16px; }

/* 时间线节点：放大图标、清晰层次、当前脉冲 */
.adt-tl { padding-left: 30px; }
.adt-node { padding: 0 0 20px; }
.adt-node:before { left: -21px; top: 23px; bottom: -2px; width: 2px; background: #e6e7f0; }
.adt-ic { left: -30px; top: 0; width: 22px; height: 22px; font-size: 12px; box-shadow: 0 0 0 4px #fff; }
.adt-node-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.adt-node-name { font-size: 14px; }
.adt-node-role { font-size: 11.5px; color: #534ab7; background: #eceeff; border-radius: 6px; padding: 2px 9px; font-weight: 500; }
.adt-node.wait .adt-node-role { color: #9aa0bb; background: #f1f2f7; }
.adt-node.wait .adt-node-name { color: #9aa0bb; }
.adt-node-time { font-size: 12px; color: #9aa0bb; margin-top: 3px; }
.adt-node.cur .adt-ic { animation: adtPulse 1.6s ease-in-out infinite; }
@keyframes adtPulse { 0%,100% { box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(91,91,214,.4); } 50% { box-shadow: 0 0 0 3px #fff, 0 0 0 9px rgba(91,91,214,0); } }
.adt-node-com { font-size: 12.5px; color: #4b5168; background: #f7f8fc; border-left: 2px solid #d9d8fb; border-radius: 0 7px 7px 0; padding: 6px 10px; margin-top: 6px; line-height: 1.5; }
.adt-multi { margin-top: 7px; gap: 4px; }
.adt-multi-i { font-size: 12px; padding: 2px 9px; background: #f3f4fa; border-radius: 6px; }

/* 操作区按钮：桌面清晰，移动端全宽 */
.adt-ops .btn { padding: 11px 18px; font-size: 14px; font-weight: 600; }
.adt-tip { font-size: 12.5px; line-height: 1.5; }

/* 空态：清晰虚线提示 */
.ap-dl-empty { display: block; padding: 18px; text-align: center; color: #9aa0bb; font-size: 13px; background: #fafbff; border: 1px dashed #dfe2ee; border-radius: 10px; }

/* 响应式 */
@media (max-width: 860px) {
  .adt-2col { grid-template-columns: 1fr; gap: 14px; }
  .adt-side .panel.sticky { position: static; }
  .adt-main .ap-dl { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 560px) {
  .adt-head { padding: 14px; gap: 10px; }
  .adt-title { font-size: 16px; }
  .adt-head-meta { gap: 4px 14px; font-size: 12px; }
  .adt-main .ap-dl { grid-template-columns: 1fr; gap: 12px; }
  .adt-ops { flex-direction: column; }
  .adt-ops .btn { width: 100%; flex: 1 1 auto; }
  .adt-bar-title { font-size: 13px; }
  .adt-ic { left: -28px; }
  .adt-tl { padding-left: 28px; }
}

/* ===== 界面重做：审批中心 / 投标报价（20261012 版）===== */
/* --- 通用小件 --- */
.ap3-dotsep{color:var(--muted,#94a3b8);margin:0 4px}
.ap3-cc{font-size:12px;color:var(--muted,#94a3b8);margin-left:8px}

/* --- 审批中心列表卡（ap3）--- */
.ap3-list{display:flex;flex-direction:column;gap:12px}
.ap3-card{position:relative;background:var(--panel-bg,#fff);border:1px solid var(--line,#e5e7eb);border-radius:12px;padding:14px 18px;cursor:pointer;transition:box-shadow .15s,border-color .15s}
.ap3-card:hover{border-color:var(--blue,#5b5bd6);box-shadow:0 4px 16px rgba(0,0,0,.06)}
.ap3-r1{display:flex;align-items:baseline;gap:10px;min-width:0}
.ap3-type{flex:none;font-size:12px;font-weight:600;color:var(--blue,#5b5bd6);background:var(--blue-bg,#eef0ff);padding:2px 8px;border-radius:6px;transform:translateY(-1px)}
.ap3-title{font-size:15px;font-weight:600;line-height:1.45;flex:1;min-width:0}
.ap3-right{flex:none;display:flex;gap:6px;align-items:center}
.ap3-r2{display:flex;align-items:baseline;flex-wrap:wrap;margin-top:6px;font-size:13px;color:var(--muted,#64748b)}
.ap3-who{font-weight:600;color:var(--text,#1e293b)}
.ap3-extra{color:var(--muted,#64748b)}
.ap3-money{margin-left:auto;flex:none;text-align:right;line-height:1.1}
.ap3-money small{display:block;font-size:11px;font-weight:400;color:var(--muted,#94a3b8)}
.ap3-money{font-size:20px;font-weight:700;color:var(--gold,#b8860b)}
.ap3-r3{display:flex;align-items:center;gap:12px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line,#e5e7eb)}
.ap3-flow{display:flex;align-items:center;flex-wrap:wrap;gap:4px;font-size:12.5px;color:var(--muted,#94a3b8);flex:1;min-width:0}
.ap3-pf{display:inline-flex;align-items:center;gap:4px}
.ap3-pf b{color:var(--text,#1e293b);font-weight:600}
.ap3-dot{font-style:normal}
.ap3-pf.done .ap3-dot{color:var(--green,#16a34a)}
.ap3-pf.reject .ap3-dot{color:var(--red,#e24b4a)}
.ap3-pf.cur{color:var(--blue,#5b5bd6);font-weight:600}
.ap3-pf.cur .ap3-dot{animation:ap3pulse 1.2s infinite}
.ap3-stay{font-size:11px;font-weight:400;background:var(--blue-bg,#eef0ff);color:var(--blue,#5b5bd6);padding:0 6px;border-radius:8px}
.ap3-arrow{color:var(--line,#cbd5e1)}
.ap3-ops{flex:none;display:flex;align-items:center;gap:8px}
.ap3-no{flex:none;font-size:12.5px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.3px;color:var(--muted,#94a3b8)}
@keyframes ap3pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* --- 审批详情页（adt3）--- */
.adt3{max-width:1560px}
.adt3-bar{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.adt3-bar-title{font-size:16px;font-weight:700}
.adt3-bar .tag{margin-left:auto}
.adt3-hero{display:flex;gap:16px;align-items:flex-start;border-radius:14px;padding:18px 20px;margin-bottom:14px;border:1px solid var(--line,#e5e7eb);background:linear-gradient(135deg,var(--blue-bg,#eef0ff),var(--panel-bg,#fff) 60%)}
.adt3-hero.win{background:linear-gradient(135deg,#ecfdf3,var(--panel-bg,#fff) 60%);border-color:#bbf0d0}
.adt3-hero.lose{background:linear-gradient(135deg,#fef1f1,var(--panel-bg,#fff) 60%);border-color:#f6c8c8}
.adt3-hero-ic{flex:none;width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;background:var(--blue,#5b5bd6);color:#fff}
.adt3-hero.win .adt3-hero-ic{background:var(--green,#16a34a)}
.adt3-hero.lose .adt3-hero-ic{background:var(--red,#e24b4a)}
.adt3-hero-main{flex:1;min-width:0}
.adt3-hero-top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.adt3-no{font-size:12px;color:var(--muted,#94a3b8)}
.adt3-hero-title{font-size:17px;font-weight:700;line-height:1.4}
.adt3-hero-sub{margin-top:4px;font-size:13.5px;color:var(--text,#334155)}
.adt3-hero-sub b{color:var(--blue,#5b5bd6)}
.adt3-hero.lose .adt3-hero-sub{color:var(--red,#e24b4a)}
.adt3-hero-meta{margin-top:6px;font-size:12.5px;color:var(--muted,#64748b)}
.adt3-bar-track{margin-top:10px;height:6px;border-radius:3px;background:var(--line,#e5e7eb);overflow:hidden}
.adt3-bar-fill{height:100%;border-radius:3px;background:var(--blue,#5b5bd6);transition:width .3s}
.adt3-hero.win .adt3-bar-fill{background:var(--green,#16a34a)}
.adt3-2col{display:grid;grid-template-columns:1fr;gap:14px;align-items:start}
@media(max-width:900px){.adt3-2col{grid-template-columns:1fr}}
.adt3-sec-t{font-size:14px;font-weight:700;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--line,#e5e7eb)}
.adt3-tl{display:flex;flex-direction:column}
.adt3-node{display:flex;gap:10px;position:relative;padding-bottom:16px}
.adt3-node:not(:last-child)::before{content:'';position:absolute;left:12px;top:26px;bottom:0;width:2px;background:var(--line,#e5e7eb)}
.adt3-ic{flex:none;width:25px;height:25px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;background:var(--panel-bg,#fff);border:2px solid var(--line,#cbd5e1);color:var(--muted,#94a3b8);z-index:1}
.adt3-node.done .adt3-ic{border-color:var(--green,#16a34a);color:var(--green,#16a34a);background:#ecfdf3}
.adt3-node.reject .adt3-ic{border-color:var(--red,#e24b4a);color:var(--red,#e24b4a);background:#fef1f1}
.adt3-node.cur .adt3-ic{border-color:var(--blue,#5b5bd6);color:var(--blue,#5b5bd6);background:var(--blue-bg,#eef0ff);animation:ap3pulse 1.2s infinite}
.adt3-body{flex:1;min-width:0;padding-top:1px}
.adt3-head{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.adt3-name{font-weight:600;font-size:14px}
.adt3-role{font-size:11.5px;color:var(--muted,#64748b);background:var(--bg,#f1f5f9);padding:1px 7px;border-radius:8px}
.adt3-state{font-size:12px;color:var(--muted,#94a3b8)}
.adt3-node.done .adt3-state{color:var(--green,#16a34a)}
.adt3-node.reject .adt3-state{color:var(--red,#e24b4a)}
.adt3-node.cur .adt3-state{color:var(--blue,#5b5bd6);font-weight:600}
.adt3-time{font-size:12.5px;color:var(--muted,#94a3b8);margin-top:2px}
.adt3-dur{color:var(--blue,#5b5bd6)}
.adt3-com{margin-top:6px;font-size:13px;background:var(--bg,#f8fafc);border:1px solid var(--line,#e5e7eb);border-radius:8px;padding:7px 10px;color:var(--text,#334155)}
.adt3-multi{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.adt3-multi-i{font-size:12px;background:var(--bg,#f1f5f9);border-radius:8px;padding:2px 8px;color:var(--muted,#64748b)}
.adt3-multi-i.ok{color:var(--green,#16a34a);background:#ecfdf3}
.adt3-multi-i.no{color:var(--red,#e24b4a);background:#fef1f1}
.adt3-tip{margin-top:4px;font-size:12.5px;color:var(--blue,#5b5bd6);background:var(--blue-bg,#eef0ff);border-radius:8px;padding:8px 10px}
.adt3-ops{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}

/* --- 投标/报价列表卡（op3）--- */
.op3-list{display:flex;flex-direction:column;gap:12px}
.op3-card{background:var(--panel-bg,#fff);border:1px solid var(--line,#e5e7eb);border-radius:12px;padding:14px 18px;cursor:pointer;transition:box-shadow .15s,border-color .15s}
.op3-card:hover{border-color:var(--blue,#5b5bd6);box-shadow:0 4px 16px rgba(0,0,0,.06)}
.op3-r1{display:flex;align-items:baseline;gap:10px;min-width:0}
.op3-type{flex:none;font-size:12px;font-weight:600;color:var(--blue,#5b5bd6);background:var(--blue-bg,#eef0ff);padding:2px 8px;border-radius:6px;transform:translateY(-1px)}
.op3-title{font-size:15px;font-weight:600;line-height:1.45;flex:1;min-width:0}
.op3-right{flex:none;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.op3-r2{margin-top:4px;font-size:13px;color:var(--muted,#64748b)}
.op3-no{margin-left:10px;font-size:12px;color:var(--muted,#94a3b8)}
.op3-res{display:flex;align-items:center;gap:8px;margin-top:10px;border-radius:8px;padding:8px 12px;font-size:13px}
.op3-res.win{background:#ecfdf3;color:var(--green,#16a34a)}
.op3-res.win b{font-size:15px}
.op3-res.lose{background:#fef1f1;color:var(--red,#e24b4a)}
.op3-res-ic{flex:none;font-weight:700}
.op3-r3{display:flex;align-items:flex-end;gap:14px;margin-top:12px;padding-top:12px;border-top:1px dashed var(--line,#e5e7eb)}
.op3-nums{display:flex;gap:26px;flex-wrap:wrap;flex:1;min-width:0}
.op3-num-k{font-size:11.5px;color:var(--muted,#94a3b8);margin-bottom:2px}
.op3-num-v{font-size:15px;font-weight:600;color:var(--text,#1e293b);line-height:1.3}
.op3-num-v.gold{font-size:20px;color:var(--gold,#b8860b)}
.op3-dur{font-size:11.5px;font-weight:400;color:var(--muted,#94a3b8)}
.op3-acts{flex:none;display:flex;gap:8px;flex-wrap:wrap}

/* --- 投标/报价详情弹窗（od3）--- */
.od3-head{border-radius:12px;padding:16px 18px;background:linear-gradient(135deg,var(--blue-bg,#eef0ff),var(--panel-bg,#fff) 70%);border:1px solid var(--line,#e5e7eb)}
.od3-head-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.od3-tag{font-size:12px;font-weight:600;color:var(--blue,#5b5bd6);background:#fff;padding:2px 8px;border-radius:6px;border:1px solid var(--blue-bg,#eef0ff)}
.od3-no{margin-left:auto;font-size:12px;color:var(--muted,#94a3b8)}
.od3-title{font-size:17px;font-weight:700;line-height:1.4}
.od3-nums{display:flex;gap:26px;flex-wrap:wrap;margin:14px 0;padding:12px 16px;border:1px solid var(--line,#e5e7eb);border-radius:12px;background:var(--panel-bg,#fff)}
.od3-num-k{font-size:11.5px;color:var(--muted,#94a3b8);margin-bottom:2px}
.od3-num-v{font-size:16px;font-weight:600;line-height:1.3}
.od3-num-v.gold{font-size:22px;color:var(--gold,#b8860b)}
.od3-num-v.green{font-size:22px;color:var(--green,#16a34a)}
.od3-num-sub{font-size:11.5px;font-weight:400;color:var(--muted,#94a3b8)}
.od3-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
@media(max-width:720px){.od3-grid{grid-template-columns:1fr}}
.od3-sec{border:1px solid var(--line,#e5e7eb);border-radius:12px;padding:12px 14px;background:var(--panel-bg,#fff)}
.od3-sec-t{font-size:13px;font-weight:700;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--line,#e5e7eb)}
.od3-dl-row{display:flex;gap:10px;padding:4px 0;font-size:13.5px}
.od3-dl-k{flex:none;width:76px;color:var(--muted,#94a3b8)}
.od3-dl-v{flex:1;min-width:0;color:var(--text,#1e293b)}
.od3-result{display:flex;gap:12px;align-items:flex-start;border-radius:12px;padding:14px 16px;margin-bottom:14px}
.od3-result.win{background:#ecfdf3;border:1px solid #bbf0d0;color:var(--green,#16a34a)}
.od3-result.lose{background:#fef1f1;border:1px solid #f6c8c8;color:var(--red,#e24b4a)}
.od3-result-ic{flex:none;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;background:currentColor;color:#fff}
.od3-result-ic{color:#fff;background:var(--green,#16a34a)}
.od3-result.lose .od3-result-ic{background:var(--red,#e24b4a)}
.od3-result-t{font-weight:700;font-size:15px;margin-bottom:2px}
.od3-result-b{font-size:13px;color:var(--text,#334155)}
.od3-remarks{font-size:13.5px;color:var(--text,#334155);line-height:1.6}