:root{
  --bg:#F4F5FA; --panel:#FFFFFF; --panel-2:#FAFBFD;
  --ink:#1B1D29; --ink2:#555C70; --ink3:#8A90A2;
  --line:#E6E8F0; --line2:#F0F1F7;
  --pri:#5B4FCF; --pri-d:#413690; --pri-s:#EFEDFC;
  --teal:#0E9C9C; --teal-s:#E5F6F6;
  --blue:#2F6FE4; --blue-s:#EAF1FE;
  --amber:#D98A1F; --amber-s:#FDF3E4;
  --red:#DC4B26; --red-s:#FDECE7;
  --green:#2A9A55; --green-s:#E7F6EC;
  --grey:#6B7385; --grey-s:#F0F1F6;
  --sh:0 1px 2px rgba(27,29,41,.04),0 6px 18px rgba(27,29,41,.05);
  --r:12px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:"Microsoft YaHei","PingFang SC","Hiragino Sans GB","Helvetica Neue",Arial,sans-serif;
  background:var(--bg); color:var(--ink); font-size:13.5px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.app{display:flex;min-height:100vh}

.side{
  width:236px;flex:0 0 236px;background:#fff;border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.brand{padding:20px 20px 16px;border-bottom:1px solid var(--line2)}
.brand .logo{display:flex;align-items:center;gap:10px}
.brand .mark{
  width:34px;height:34px;border-radius:10px;flex:0 0 34px;
  background:linear-gradient(140deg,#6E5FE0,#4138A0);
  color:#fff;font-weight:700;font-size:16px;display:flex;align-items:center;justify-content:center;
}
.brand h1{font-size:15px;font-weight:700;letter-spacing:.2px}
.brand .sub{font-size:11px;color:var(--ink3);margin-top:2px;letter-spacing:.4px}

.nav{padding:12px 10px;overflow-y:auto;flex:1}
.nav .grp{font-size:10.5px;color:var(--ink3);letter-spacing:1.2px;padding:14px 12px 6px;font-weight:700}
.nav a{
  display:flex;align-items:center;gap:9px;padding:8px 12px;border-radius:9px;
  color:var(--ink2);text-decoration:none;font-size:13px;cursor:pointer;margin-bottom:1px;
  transition:background .12s,color .12s;
}
.nav a:hover{background:var(--panel-2);color:var(--ink)}
.nav a.on{background:var(--pri-s);color:var(--pri-d);font-weight:700}
.nav a .ic{width:15px;text-align:center;font-size:12px;opacity:.85}
.nav a .cnt{margin-left:auto;font-size:10.5px;background:var(--grey-s);color:var(--ink3);border-radius:20px;padding:1px 7px;font-weight:600}
.nav a.on .cnt{background:#fff;color:var(--pri)}
.side-foot{padding:12px 16px;border-top:1px solid var(--line2);font-size:11px;color:var(--ink3);line-height:1.7}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{
  height:60px;background:#fff;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:14px;padding:0 24px;position:sticky;top:0;z-index:20;
}
.crumb{font-size:12.5px;color:var(--ink3)}
.crumb b{color:var(--ink);font-weight:700}
.topbar .spacer{flex:1}
.switcher{display:flex;background:var(--panel-2);border:1px solid var(--line);border-radius:9px;padding:3px;gap:2px}
.switcher button{
  border:0;background:transparent;font:inherit;font-size:12px;color:var(--ink2);
  padding:5px 13px;border-radius:7px;cursor:pointer;font-weight:600;
}
.switcher button.on{background:#fff;color:var(--pri-d);box-shadow:0 1px 3px rgba(27,29,41,.09)}
.who{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--ink2)}
.who .av{width:28px;height:28px;border-radius:50%;background:var(--pri-s);color:var(--pri-d);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px}

.views{padding:22px 24px 60px;max-width:1440px;width:100%}
.view{display:none;animation:fade .18s ease}
.view.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}

h2.ph{font-size:19px;font-weight:800;letter-spacing:-.2px;display:flex;align-items:center;gap:10px}
h2.ph .tag{font-size:10.5px;font-weight:700;color:var(--pri-d);background:var(--pri-s);padding:2px 9px;border-radius:20px;letter-spacing:.3px}
.lead{color:var(--ink2);font-size:13px;margin-top:7px;max-width:1000px;line-height:1.75}
.hr{height:1px;background:var(--line2);margin:20px 0}

.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh)}
.card .hd{padding:13px 17px;border-bottom:1px solid var(--line2);display:flex;align-items:center;gap:10px}
.card .hd h3{font-size:13.5px;font-weight:700}
.card .hd .note{font-size:11.5px;color:var(--ink3);margin-left:auto;text-align:right}
.card .bd{padding:16px 17px}

.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:1180px){.g6{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.g2,.g3,.g4,.g6{grid-template-columns:1fr}}

.kpi{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 15px;box-shadow:var(--sh);position:relative;overflow:hidden}
.kpi .k{font-size:11.5px;color:var(--ink3);font-weight:600;letter-spacing:.2px}
.kpi .v{font-size:26px;font-weight:800;letter-spacing:-1px;margin-top:5px;font-variant-numeric:tabular-nums}
.kpi .v small{font-size:12px;font-weight:600;color:var(--ink3);letter-spacing:0;margin-left:2px}
.kpi .d{font-size:11.5px;color:var(--ink3);margin-top:4px}
.kpi::after{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--pri);opacity:.85}
.kpi.t-teal::after{background:var(--teal)} .kpi.t-amber::after{background:var(--amber)}
.kpi.t-red::after{background:var(--red)} .kpi.t-green::after{background:var(--green)}
.kpi.t-blue::after{background:var(--blue)}

table{width:100%;border-collapse:collapse;font-size:12.5px}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid var(--line2);vertical-align:top}
th{background:var(--panel-2);font-size:11.5px;color:var(--ink2);font-weight:700;letter-spacing:.3px;position:sticky;top:0;z-index:2}
tbody tr:hover{background:#FCFCFE}
table.tight td,table.tight th{padding:7px 10px}
.tbl-wrap{overflow:auto}
.mono{font-family:"Consolas","SFMono-Regular",Menlo,monospace;font-size:12px}
.k1{font-weight:700;color:var(--ink)}
.sub{color:var(--ink3);font-size:11.5px}

.chip{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;white-space:nowrap}
.c-pri{background:var(--pri-s);color:var(--pri-d)}
.c-teal{background:var(--teal-s);color:var(--teal)}
.c-blue{background:var(--blue-s);color:var(--blue)}
.c-amber{background:var(--amber-s);color:var(--amber)}
.c-red{background:var(--red-s);color:var(--red)}
.c-green{background:var(--green-s);color:var(--green)}
.c-grey{background:var(--grey-s);color:var(--grey)}
.dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.d-red{background:var(--red)} .d-amber{background:var(--amber)} .d-green{background:var(--green)}

.bar{height:7px;border-radius:6px;background:var(--line2);overflow:hidden;min-width:70px}
.bar i{display:block;height:100%;border-radius:6px;background:var(--pri)}

.blk{border:1px solid var(--line);border-radius:10px;padding:11px 13px;background:#fff}
.blk .t{font-size:12.5px;font-weight:700;display:flex;align-items:center;gap:7px}
.blk .n{font-size:11px;color:var(--ink3);margin-top:3px;line-height:1.65}
.blk .num{width:19px;height:19px;border-radius:6px;background:var(--pri-s);color:var(--pri-d);font-size:10.5px;font-weight:800;display:flex;align-items:center;justify-content:center;flex:0 0 19px}

.flow{display:flex;align-items:stretch;gap:0;flex-wrap:wrap}
.fnode{flex:1;min-width:132px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 13px}
.fnode .st{font-size:11px;color:var(--ink3);font-weight:700;letter-spacing:.6px}
.fnode .nm{font-size:13px;font-weight:800;margin-top:3px}
.fnode .ds{font-size:11px;color:var(--ink3);margin-top:5px;line-height:1.5}
.farrow{flex:0 0 34px;display:flex;align-items:center;justify-content:center;color:#C3C8D8;font-size:14px}
.fnode.hl{border-color:#CFC8F5;background:linear-gradient(180deg,#FBFAFF,#F5F2FE)}

.step-line{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.step{font-size:12px;background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 11px;font-weight:600;color:var(--ink2)}
.step.now{background:var(--pri);border-color:var(--pri);color:#fff;font-weight:700}
.step.arrow{background:none;border:0;color:#C3C8D8;padding:0 1px}

.filters{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.filters button{border:1px solid var(--line);background:#fff;font:inherit;font-size:12px;font-weight:600;color:var(--ink2);padding:5px 13px;border-radius:20px;cursor:pointer}
.filters button.on{background:var(--pri);border-color:var(--pri);color:#fff}

.tl{position:relative;padding-left:22px}
.tl::before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:var(--line)}
.tl .it{position:relative;padding:0 0 16px}
.tl .it::before{content:"";position:absolute;left:-20px;top:5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2.5px solid var(--pri)}
.tl .it.done::before{background:var(--green);border-color:var(--green)}
.tl .it .ph{font-size:12.5px;font-weight:800}
.tl .it .pd{font-size:11.5px;color:var(--ink3);margin-top:2px;line-height:1.7}

.cmd{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:#fff;margin-bottom:12px}
.cmd .h{display:flex;align-items:center;gap:10px;padding:11px 15px;background:var(--panel-2);border-bottom:1px solid var(--line2)}
.cmd .h .id{font-size:11px;font-weight:800;color:#fff;background:var(--pri);border-radius:6px;padding:2px 8px}
.cmd .h .ti{font-size:13px;font-weight:700}
.cmd .b{padding:13px 15px;font-size:12.5px;color:var(--ink2);line-height:1.85;white-space:pre-wrap}
.copy{margin-left:auto;border:1px solid var(--line);background:#fff;font:inherit;font-size:11.5px;font-weight:700;color:var(--ink2);padding:4px 11px;border-radius:7px;cursor:pointer}
.copy:hover{background:var(--pri-s);color:var(--pri-d);border-color:#CFC8F5}
.btn{border:1px solid var(--line);background:#fff;font:inherit;font-size:12px;font-weight:700;color:var(--ink2);padding:5px 12px;border-radius:7px;cursor:pointer}
.btn.pri{background:var(--pri);border-color:var(--pri);color:#fff}

.note-box{border-left:3px solid var(--amber);background:var(--amber-s);border-radius:0 9px 9px 0;padding:11px 14px;font-size:12.5px;color:#7A4E10;line-height:1.75}
.note-box.b{border-color:var(--pri);background:var(--pri-s);color:#3A3080}
.note-box.r{border-color:var(--red);background:var(--red-s);color:#8A2C12}

.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px;color:var(--ink3)}
.legend span{display:flex;align-items:center;gap:6px}
.mini-av{width:22px;height:22px;border-radius:50%;background:var(--pri-s);color:var(--pri-d);font-size:10px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin-right:6px}

/* ==================================================================
   管理工作台增强层 —— 按管理顾日常使用动线组织（2026-09-15 新增）
   仅追加，不覆盖原有类，保证既有 14 个视图视觉一致
   ================================================================== */

/* ---------- 通用质感提升 ---------- */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#D6DAE6;border-radius:8px;border:3px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#BFC5D6;background-clip:content-box}
.topbar{box-shadow:0 1px 0 var(--line),0 4px 14px rgba(27,29,41,.03)}
.card{transition:box-shadow .18s ease}
.card.hv:hover{box-shadow:0 2px 4px rgba(27,29,41,.05),0 12px 30px rgba(27,29,41,.09)}
tbody tr:last-child td{border-bottom:0}

/* ---------- 页头（统一各视图） ---------- */
.ph-wrap{margin-bottom:18px}
.ph-wrap .eyebrow{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;letter-spacing:1.1px;color:var(--pri);text-transform:uppercase;margin-bottom:7px}
.ph-wrap .eyebrow i{width:16px;height:2px;background:var(--pri);border-radius:2px;display:block}
h2.ph{font-size:20px}

/* ---------- 动线定位条（每页顶部，标明处在使用动线的哪一步） ---------- */
.wf{display:flex;align-items:center;gap:7px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);
  border-radius:11px;padding:9px 13px;margin-bottom:16px;box-shadow:var(--sh)}
.wf .lb{font-size:11px;color:var(--ink3);font-weight:800;letter-spacing:.6px;padding-right:4px;border-right:1px solid var(--line2);margin-right:3px}
.wf .s{font-size:11.5px;color:var(--ink3);padding:3px 11px;border-radius:20px;background:var(--panel-2);font-weight:600;white-space:nowrap;cursor:pointer;border:1px solid transparent;transition:all .13s}
.wf .s:hover{background:var(--pri-s);color:var(--pri-d)}
.wf .s.done{color:var(--green);background:var(--green-s);border-color:#CFEBD9}
.wf .s.on{background:var(--pri);color:#fff;font-weight:800;box-shadow:0 2px 8px rgba(91,79,207,.28)}
.wf .ar{color:#CBD0DE;font-size:11px}
.wf .hint{margin-left:auto;font-size:11.5px;color:var(--ink3)}
.wf .hint b{color:var(--pri-d)}

/* ---------- 首页问候横幅 ---------- */
.wb-hero{position:relative;overflow:hidden;border-radius:14px;padding:19px 22px;color:#fff;
  background:linear-gradient(118deg,#5B4FCF 0%,#7264DC 42%,#4E7FE0 100%);
  box-shadow:0 8px 26px rgba(91,79,207,.22);display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.wb-hero::after{content:"";position:absolute;right:-50px;top:-70px;width:230px;height:230px;border-radius:50%;background:rgba(255,255,255,.10)}
.wb-hero::before{content:"";position:absolute;right:60px;bottom:-90px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.07)}
.wb-hero .l{position:relative;z-index:1;min-width:280px}
.wb-hero .hi{font-size:18px;font-weight:800;letter-spacing:-.2px}
.wb-hero .hi em{font-style:normal;font-weight:600;opacity:.82;font-size:13px;margin-left:8px}
.wb-hero .st{font-size:12.5px;opacity:.9;margin-top:7px;line-height:1.7}
.wb-hero .spacer{flex:1}
.wb-hero .acts{position:relative;z-index:1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.wb-hero .pill{font-size:11.5px;font-weight:700;background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.28);
  padding:4px 12px;border-radius:20px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.wb-hero .pill i{width:6px;height:6px;border-radius:50%;background:#7BE8A6;display:inline-block}
.wb-hero .pill.w i{background:#FFD16B}
.wb-hero .btn.gw{background:rgba(255,255,255,.95);border:0;color:var(--pri-d);font-weight:800;padding:7px 15px;border-radius:9px;font-size:12.5px;cursor:pointer}
.wb-hero .btn.gw:hover{background:#fff}

/* ---------- 动线段落 ---------- */
.wb-sect{margin-top:24px}
.wb-sect>.sh{display:flex;align-items:center;gap:11px;margin-bottom:12px;flex-wrap:wrap}
.wb-sect>.sh .sn{width:30px;height:30px;flex:0 0 30px;border-radius:9px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(140deg,#6E5FE0,#4138A0);color:#fff;font-size:12px;font-weight:800;letter-spacing:.3px;
  box-shadow:0 3px 9px rgba(91,79,207,.24)}
.wb-sect>.sh h3{font-size:15.5px;font-weight:800;letter-spacing:-.2px}
.wb-sect>.sh .q{font-size:11.5px;color:var(--ink3);padding-left:2px}
.wb-sect>.sh .note{margin-left:auto;font-size:11.5px;color:var(--ink3)}
.wb-sect>.sh .note b{color:var(--pri-d)}

/* ---------- 待办工作行 ---------- */
.worklist{background:#fff;border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh);overflow:hidden}
.wrow{display:flex;align-items:flex-start;gap:13px;padding:12px 16px;border-bottom:1px solid var(--line2);transition:background .13s}
.wrow:hover{background:#FBFBFE}
.wrow:last-child{border-bottom:0}
.wrow .pl{flex:0 0 36px;text-align:center;font-size:10.5px;font-weight:800;padding:3px 0;border-radius:6px;letter-spacing:.3px}
.pl-p0{background:var(--red-s);color:var(--red)}
.pl-p1{background:var(--amber-s);color:var(--amber)}
.pl-p2{background:var(--blue-s);color:var(--blue)}
.pl-p3{background:var(--grey-s);color:var(--grey)}
.wrow .tx{flex:1;min-width:0}
.wrow .tx .t{font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wrow .tx .m{font-size:11.5px;color:var(--ink3);margin-top:4px;display:flex;gap:14px;flex-wrap:wrap;line-height:1.6}
.wrow .tx .m span{display:inline-flex;align-items:center;gap:5px}
.wrow .go{flex:0 0 auto;align-self:center}
.wrow .go button{border:1px solid var(--line);background:#fff;font:inherit;font-size:11.5px;font-weight:700;color:var(--ink2);
  padding:5px 12px;border-radius:7px;cursor:pointer;white-space:nowrap;transition:all .13s}
.wrow .go button:hover{background:var(--pri);border-color:var(--pri);color:#fff}
.wrow.done-st .tx .t{color:var(--ink3);text-decoration:line-through;text-decoration-color:#C9CEDC}

/* ---------- 进度环 ---------- */
.ringwrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ring{width:84px;height:84px;flex:0 0 84px;border-radius:50%;position:relative;display:flex;align-items:center;justify-content:center;
  background:conic-gradient(var(--rc,var(--pri)) calc(var(--p,0) * 1%), var(--line2) 0)}
.ring::before{content:"";position:absolute;inset:9px;background:#fff;border-radius:50%}
.ring .rv{position:relative;text-align:center;line-height:1.15}
.ring .rv b{font-size:17px;font-weight:800;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.ring .rv i{display:block;font-style:normal;font-size:10px;color:var(--ink3);font-weight:700}

/* ---------- 快捷入口卡 ---------- */
.entry{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid var(--line);border-radius:11px;background:#fff;
  cursor:pointer;transition:all .15s;text-align:left;width:100%;font:inherit}
.entry:hover{border-color:#CFC8F5;box-shadow:0 6px 18px rgba(91,79,207,.11);transform:translateY(-1px)}
.entry .em{width:34px;height:34px;flex:0 0 34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:15px;
  background:var(--pri-s);color:var(--pri-d)}
.entry .em.t2{background:var(--teal-s);color:var(--teal)}
.entry .em.t3{background:var(--blue-s);color:var(--blue)}
.entry .em.t4{background:var(--amber-s);color:var(--amber)}
.entry .em.t5{background:var(--green-s);color:var(--green)}
.entry .eb{min-width:0;flex:1}
.entry .et{font-size:12.5px;font-weight:800;color:var(--ink)}
.entry .ed{font-size:11px;color:var(--ink3);margin-top:2px}
.entry .ea{margin-left:auto;color:#C6CBD9;font-size:14px;transition:transform .15s}
.entry:hover .ea{transform:translateX(2px);color:var(--pri)}

/* ---------- 三端负荷 ---------- */
.tload{display:flex;flex-direction:column;gap:15px}
.tload .row .rl{display:flex;align-items:baseline;gap:9px;font-size:12.5px;margin-bottom:6px}
.tload .row .rl b{font-weight:800}
.tload .row .rl .sub{margin-left:auto}
.tload .track{height:9px;border-radius:6px;background:var(--line2);overflow:hidden;display:flex}
.tload .track i{display:block;height:100%}
.tload .lg2{display:flex;gap:14px;font-size:11px;color:var(--ink3);margin-top:6px;flex-wrap:wrap}
.tload .lg2 span{display:inline-flex;align-items:center;gap:5px}
.tload .lg2 i{width:8px;height:8px;border-radius:3px;display:inline-block}

/* ---------- 指标小结卡（首页内嵌） ---------- */
.mstat{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px dashed var(--line)}
.mstat:last-child{border-bottom:0;padding-bottom:0}
.mstat .mv{font-size:19px;font-weight:800;letter-spacing:-.6px;font-variant-numeric:tabular-nums;min-width:52px}
.mstat .mt{font-size:12px;font-weight:700}
.mstat .md{font-size:11px;color:var(--ink3);margin-top:2px}
.mstat .mo{margin-left:auto;font-size:11px;font-weight:700;white-space:nowrap}

/* ---------- 时间轴：管理者一日节奏 ---------- */
.dayline{display:flex;gap:0;align-items:stretch;flex-wrap:wrap}
.dayline .dn{flex:1;min-width:150px;position:relative;padding:0 14px 0 0}
.dayline .dn:last-child{padding-right:0}
.dayline .dt{font-size:11px;font-weight:800;color:var(--pri);letter-spacing:.5px}
.dayline .dh{font-size:12.5px;font-weight:800;margin-top:3px}
.dayline .dd{font-size:11px;color:var(--ink3);margin-top:4px;line-height:1.65}
.dayline .dn::after{content:"";position:absolute;right:6px;top:4px;bottom:34px;width:1px;background:var(--line)}
.dayline .dn:last-child::after{display:none}

/* ---------- 首页两列骨架 ---------- */
.wb-2col{display:grid;gap:14px;grid-template-columns:minmax(0,2.3fr) minmax(0,1fr)}
.wb-3col{display:grid;gap:14px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:1180px){.wb-2col,.wb-3col{grid-template-columns:1fr}}

@media(max-width:1100px){
  .wb-hero{flex-direction:column;align-items:flex-start;gap:14px}
  .wb-hero .spacer{display:none}
  .wb-sect>.sh .note{margin-left:0;width:100%}
  .wf .hint{margin-left:0;width:100%}
}

/* ---------- 侧边导航：按使用顺序编号 ---------- */
.nav{padding:10px 10px 20px}
.nav .grp{font-size:10px;color:var(--ink3);letter-spacing:1.1px;padding:16px 12px 7px;font-weight:800;
  display:flex;align-items:center;gap:8px}
.nav .grp::after{content:"";flex:1;height:1px;background:var(--line2)}
.nav a{padding:8px 11px;gap:10px}
.nav a .ord{flex:0 0 auto;min-width:23px;text-align:center;font-size:10px;font-weight:800;color:var(--ink3);
  background:var(--panel-2);border:1px solid var(--line);border-radius:5px;padding:1px 4px;font-variant-numeric:tabular-nums;
  transition:all .13s}
.nav a:hover .ord{border-color:#D8D3F5;color:var(--pri-d)}
.nav a.on .ord{background:var(--pri);border-color:var(--pri);color:#fff}
.nav a.on{box-shadow:inset 0 0 0 1px #E2DEFF}

.side-foot{background:linear-gradient(180deg,#fff,#FAFAFD)}
.brand{background:linear-gradient(180deg,#fff,#FCFCFE)}

/* ==================================================================
   三端岗位工作台 —— 按各自岗位日常动线重排（2026-09-15 追加）
   仅追加，不改动既有类
   ================================================================== */

/* ---------- 岗位主题色：三端一眼区分 ---------- */
.wb-hero.g-ops{background:linear-gradient(118deg,#2E6FD6 0%,#3E86E8 45%,#2B9FC6 100%);box-shadow:0 8px 26px rgba(46,111,214,.22)}
.wb-hero.g-svc{background:linear-gradient(118deg,#1E8A6B 0%,#28A07C 45%,#35A4B4 100%);box-shadow:0 8px 26px rgba(30,138,107,.22)}
.t-ops .wb-sect>.sh .sn{background:linear-gradient(140deg,#4E90EC,#1F5FB8);box-shadow:0 3px 9px rgba(46,111,214,.24)}
.t-svc .wb-sect>.sh .sn{background:linear-gradient(140deg,#2BB08A,#147A5E);box-shadow:0 3px 9px rgba(30,138,107,.24)}
.t-ops .wf .s.on{background:#2E6FD6;box-shadow:0 2px 8px rgba(46,111,214,.28)}
.t-svc .wf .s.on{background:#1E8A6B;box-shadow:0 2px 8px rgba(30,138,107,.28)}
.t-ops .wf .hint b{color:#1F5FB8}
.t-svc .wf .hint b{color:#147A5E}
.t-ops .kpi:not(.t-teal):not(.t-amber):not(.t-red):not(.t-green):not(.t-blue)::after{background:#2E6FD6}
.t-svc .kpi:not(.t-teal):not(.t-amber):not(.t-red):not(.t-green):not(.t-blue)::after{background:#1E8A6B}

/* ---------- 岗位功能分组：把功能板块按使用阶段归位 ---------- */
.stage{margin-top:17px}
.stage>.sth{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}
.stage>.sth .bdg{flex:0 0 auto;font-size:10.5px;font-weight:800;letter-spacing:.6px;color:#fff;
  background:var(--pri);padding:3px 9px;border-radius:6px;box-shadow:0 2px 7px rgba(91,79,207,.24)}
.stage>.sth h4{font-size:13.5px;font-weight:800;letter-spacing:-.1px;white-space:nowrap}
.stage>.sth .whn{font-size:11.5px;color:var(--ink3);background:var(--panel-2);
  border:1px solid var(--line2);padding:2px 10px;border-radius:20px;font-weight:600;white-space:nowrap}
.stage>.sth .ln{flex:1;min-width:24px;height:1px;background:var(--line2)}
.t-ops .stage>.sth .bdg{background:#2E6FD6;box-shadow:0 2px 7px rgba(46,111,214,.26)}
.t-svc .stage>.sth .bdg{background:#1E8A6B;box-shadow:0 2px 7px rgba(30,138,107,.26)}
.stage .grid{margin-top:0}

/* ---------- 规则依据列表 ---------- */
.rulelist{display:grid;gap:9px;grid-template-columns:repeat(2,minmax(0,1fr))}
.rulelist .rr{display:flex;gap:11px;align-items:flex-start;padding:11px 13px;border:1px solid var(--line);
  border-radius:10px;background:#fff;box-shadow:var(--sh)}
.rulelist .rr .id{flex:0 0 auto;font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;
  color:var(--pri-d);background:var(--pri-s);border-radius:5px;padding:2px 7px}
.t-ops .rulelist .rr .id{color:#1F5FB8;background:#E8F0FD}
.t-svc .rulelist .rr .id{color:#147A5E;background:#E4F5EF}
.rulelist .rr .rt{font-size:12px;line-height:1.6;color:var(--ink2);min-width:0}
.rulelist .rr .rt b{display:block;font-size:12.5px;color:var(--ink);margin-bottom:2px}
@media(max-width:1060px){.rulelist{grid-template-columns:1fr}}

/* ---------- 岗位页内紧凑指标行 ---------- */
.rolekpi{display:flex;flex-direction:column}

/* ============================================================
   运营工作台（指令 3）：九个板块
   ============================================================ */

/* ---------- 页头（替换岗位 hero，更贴合运营看板） ---------- */
.ops-head{
  display:flex;align-items:flex-start;gap:20px;flex-wrap:wrap;
  background:linear-gradient(118deg,#2E6FD6 0%,#3E86E8 45%,#2B9FC6 100%);
  box-shadow:0 8px 26px rgba(46,111,214,.22);
  border-radius:16px;padding:20px 24px;color:#fff;
}
.ops-head .eyebrow{font-size:11.5px;letter-spacing:.6px;color:rgba(255,255,255,.82);font-weight:700}
.ops-head h2{font-size:19px;font-weight:800;letter-spacing:-.2px;margin-top:5px}
.ops-head .hi{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:rgba(255,255,255,.9);margin-top:9px}
.ops-head .hi b{font-weight:800;color:#fff}
.ops-head .spacer{flex:1}
.ops-head .acts{display:flex;flex-direction:column;gap:7px;align-items:flex-end}
.ops-head .acts .d{font-size:11.5px;font-weight:700;padding:4px 11px;border-radius:20px;background:rgba(255,255,255,.18);color:#fff;white-space:nowrap}
.ops-head .acts .d-amber{background:rgba(255,228,180,.26)}
.ops-head .acts .d-red{background:rgba(255,190,175,.3)}
.ops-head .acts .d-green{background:rgba(190,245,210,.24)}
.ops-head .acts .btn{background:rgba(255,255,255,.95);border:0;color:#1F5FB8;font-weight:800;padding:7px 15px;border-radius:9px;text-decoration:none;font-size:12.5px}

/* ---------- 九板块子导航 ---------- */
.ops-nav{display:flex;gap:7px;flex-wrap:wrap;margin:16px 0 4px}
.ops-nav .on-item{
  display:inline-flex;align-items:center;gap:7px;text-decoration:none;
  background:#fff;border:1px solid var(--line);border-radius:9px;padding:7px 13px;
  font-size:12.5px;font-weight:600;color:var(--ink2);box-shadow:var(--sh);transition:.13s;
}
.ops-nav .on-item:hover{border-color:#B9CDEF;color:#1F5FB8}
.ops-nav .on-item.on{background:#2E6FD6;border-color:#2E6FD6;color:#fff;box-shadow:0 3px 10px rgba(46,111,214,.28)}
.ops-nav .on-item .ord{font-size:10.5px;font-weight:800;opacity:.75;font-variant-numeric:tabular-nums}

/* ---------- 三块卡片用的小组件 ---------- */
.bigrow{display:flex;gap:14px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px dashed var(--line)}
.bigrow>div{flex:1;min-width:80px}
.bigrow .bv{font-size:24px;font-weight:800;letter-spacing:-.8px;font-variant-numeric:tabular-nums;color:#1F5FB8}
.bigrow .bv-amber{color:var(--amber)} .bigrow .bv-green{color:var(--green)}
.bigrow .bl{font-size:11px;color:var(--ink3);margin-top:3px;font-weight:600}
.minirow{display:flex;align-items:center;gap:9px;font-size:12px;padding:6px 0;border-bottom:1px solid var(--line2)}
.minirow:last-child{border-bottom:0}
.minirow .mn{font-weight:700}
.minirow .mc{color:var(--ink3);font-size:11.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.minirow .mt{margin-left:auto;color:var(--ink3);font-size:11px;font-variant-numeric:tabular-nums}

/* ---------- 进度条 / 对比条 ---------- */
.prog{margin-bottom:12px}
.prog:last-child{margin-bottom:0}
.prog .ph{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600;color:var(--ink2)}
.prog .ph .pv{margin-left:auto;font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink)}
.prog .ph .pv .muted{font-weight:600}
.pbar{height:7px;background:var(--panel-2);border:1px solid var(--line2);border-radius:20px;overflow:hidden;margin-top:6px;display:block}
.pbar>i{display:block;height:100%;border-radius:20px;background:var(--blue);transition:width .3s ease}
.prog .pf{font-size:11px;color:var(--ink3);margin-top:4px}
.muted{color:var(--ink3);font-weight:600}

/* ---------- 表单片段 ---------- */
.frow{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.frow label{flex:0 0 96px;font-size:12px;color:var(--ink2);font-weight:600}
.frow label b{color:var(--red)}
.frow input,.frow select,.frow textarea{flex:1;width:auto;min-width:0}
.t-ops input,.t-ops select,.t-ops textarea{
  font:inherit;font-size:12.5px;color:var(--ink);background:#fff;
  border:1px solid var(--line);border-radius:8px;padding:6px 10px;width:100%;outline:none;
}
.t-ops input:focus,.t-ops select:focus,.t-ops textarea:focus{border-color:#8FB0EA;box-shadow:0 0 0 3px rgba(46,111,214,.1)}
.t-ops textarea{resize:vertical;line-height:1.7}
.t-ops .inline-form input,.t-ops .inline-form select{width:auto;min-width:110px}
.inline-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.inline-form input,.inline-form select{width:auto;min-width:110px}
.filterbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.filterbar input[type=text],.filterbar input:not([type]){min-width:210px;flex:1}
.filterbar input[type=date]{min-width:135px;width:auto}
.sect-div{height:1px;background:var(--line2);margin:14px 0}
.fld-title{font-size:11.5px;font-weight:800;color:var(--ink3);letter-spacing:.6px;margin-bottom:9px}
.chkgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
@media(max-width:820px){.chkgrid{grid-template-columns:1fr}}
.chk{display:flex;align-items:flex-start;gap:9px;border:1px solid var(--line);border-radius:9px;padding:9px 11px;background:var(--panel-2);cursor:pointer}
.chk input{width:auto;margin-top:3px}
.chk span{display:flex;flex-direction:column}
.chk span b{font-size:12px}
.chk span i{font-style:normal;font-size:11px;color:var(--ink3);margin-top:2px;line-height:1.6}
.chips{display:flex;gap:7px;flex-wrap:wrap}

/* ---------- 步骤条 ---------- */
.ops-steps{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px}
.ops-steps .st{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:11px 15px;box-shadow:var(--sh);flex:1;min-width:210px}
.ops-steps .st .i{width:24px;height:24px;border-radius:50%;background:#2E6FD6;color:#fff;font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;flex:0 0 24px}
.ops-steps .st b{font-size:12.5px}
.ops-steps .st .d{font-size:11px;color:var(--ink3);margin-top:2px}
.ops-steps .ar{color:var(--ink3);font-size:16px}

/* ---------- 小按钮 ---------- */
.btn-pri{background:var(--pri);border-color:var(--pri);color:#fff}
.btn-pri:hover{background:var(--pri-d);border-color:var(--pri-d);color:#fff}
a.btn{display:inline-block;text-decoration:none;text-align:center}
.mini{border:1px solid var(--line);background:#fff;font:inherit;font-size:11.5px;font-weight:700;color:var(--ink2);padding:4px 10px;border-radius:7px;cursor:pointer;white-space:nowrap;text-decoration:none;display:inline-block}
.mini:hover{background:var(--pri);border-color:var(--pri);color:#fff}
.mini.ok:hover{background:var(--green);border-color:var(--green)}
.mini.danger{color:var(--red);border-color:#F1C4B7}
.mini.danger:hover{background:var(--red);border-color:var(--red);color:#fff}
.btnrow{display:flex;gap:7px;flex-wrap:wrap}
.btnrow form{display:inline}

/* ---------- 表格内小字 ---------- */
.sub{display:block;font-size:11px;color:var(--ink3);margin-top:2px}
td code{background:var(--panel-2);border:1px solid var(--line2);border-radius:5px;padding:1px 6px;font-size:11px;color:var(--ink2)}

/* ---------- 13 天趋势条 ---------- */
.trend{display:flex;align-items:flex-end;gap:6px;height:132px;padding-top:6px}
.trend .tb{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;position:relative}
.trend .tb i{display:block;width:100%;max-width:26px;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#5F98EE,#2E6FD6);min-height:4px}
.trend .tb .n{font-size:10.5px;font-weight:800;color:#1F5FB8;margin-bottom:3px;font-variant-numeric:tabular-nums}
.trend .tb .d{font-size:9.5px;color:var(--ink3);margin-top:5px;white-space:nowrap;transform:scale(.92)}

/* ---------- 流入漏斗 ---------- */
.funnel{display:flex;flex-direction:column;gap:12px}
.fstep .fn{font-size:12px;font-weight:700;margin-bottom:5px}
.fstep .fbar-wrap{background:var(--panel-2);border:1px solid var(--line2);border-radius:8px;overflow:hidden}
.fbar{display:flex;align-items:center;gap:10px;height:32px;padding:0 12px;border-radius:7px;transition:width .35s ease;min-width:96px}
.fbar .fv{font-size:13px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.fbar .fr{margin-left:auto;font-size:11.5px;font-weight:700;color:rgba(255,255,255,.92)}
.fbar.tone-grey{background:linear-gradient(90deg,#9AA1B4,#7A8298)}
.fbar.tone-pri{background:linear-gradient(90deg,#6E5FE0,#4B3FBE)}
.fbar.tone-blue{background:linear-gradient(90deg,#5F98EE,#2E6FD6)}
.fbar.tone-teal{background:linear-gradient(90deg,#2BB0B0,#0E8A8A)}
.fbar.tone-green{background:linear-gradient(90deg,#4BB877,#2A9A55)}
.fstep .fnote{font-size:11px;color:var(--ink3);margin-top:4px;line-height:1.65}

/* ---------- 报喜素材卡 ---------- */
.casecard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 15px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:8px}
.casecard .ch{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.casecard .ch .sp{flex:1}
.casecard .ch .cd{font-size:11px;color:var(--ink3)}
.casecard .ct{font-size:13px;font-weight:800;letter-spacing:-.1px}
.casecard .cx{font-size:12px;color:var(--ink2);line-height:1.75}
.casecard .cm{display:flex;gap:12px;flex-wrap:wrap;font-size:11px;color:var(--ink3)}
.casecard .ci{font-size:11.5px;color:var(--teal);background:var(--teal-s);border-radius:7px;padding:6px 10px;line-height:1.6}
.casecard .ctg{display:flex;gap:6px;flex-wrap:wrap}
.casecard .cf{margin-top:auto;padding-top:8px;border-top:1px solid var(--line2);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.casecard .usedby{font-size:11px;color:var(--ink3)}

/* ---------- 商品缩略图 ---------- */
.pthumb{width:46px;height:46px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.pthumb.ph{display:flex;align-items:center;justify-content:center;font-size:10px;color:var(--ink3);background:var(--panel-2)}

/* ---------- 可点击板块卡 ---------- */
.blk-link{display:block;text-decoration:none;color:inherit;transition:.14s}
.blk-link:hover{border-color:#B9CDEF;box-shadow:0 6px 20px rgba(46,111,214,.11);transform:translateY(-1px)}
.blk .note{font-size:11px;color:#1F5FB8;background:var(--blue-s);border-radius:6px;padding:2px 8px;display:inline-block;margin-top:7px;font-weight:600}
.blk-link .num{background:var(--blue-s);color:#1F5FB8}

/* ---------- 时间轴 ---------- */
.timeline{display:flex;flex-direction:column}
.tli{display:flex;gap:14px;padding:10px 0;border-bottom:1px solid var(--line2)}
.tli:last-child{border-bottom:0}
.tli .tt{flex:0 0 82px;font-size:11.5px;color:var(--ink3);font-variant-numeric:tabular-nums;padding-top:2px}
.tli .tbody{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:12.5px;min-width:0}
.tli .tbody .muted{font-size:11.5px}
.tli .tdesc{flex-basis:100%;font-size:11.5px;color:var(--ink2);line-height:1.7}
