/* =====================================================
   恒纳智能工作台 · 共享样式（桌面版 / 手机版共用）
   统一页面规格（Design Tokens v1.1）
   ─ 字号体系：11 / 12 / 13.5 / 15.5 / 17 / 21 / 24 px
   ─ 间距体系：4 / 8 / 12 / 14 / 18 / 24 / 28 px
   ─ 圆角：控件 8px · 卡片 12px · 弹层 14-16px
   ─ 布局：桌面版内容最大宽 1020px / 手机版 720px
   ===================================================== */
:root{
  --bg:#f2f4f8; --surface:#ffffff; --ink:#14213d; --body:#3c465c; --muted:#8a93a6;
  --navy:#16325c; --navy-deep:#0e2444; --navy-soft:#e8eef7;
  --accent-text:#16325c;                 /* 强调文字色：浅色=藏青 */
  --red:#c7402d; --red-soft:#faece9;
  --gold:#b98a2f; --gold-soft:#f7efdd;
  --warn:#d07c1f; --ok:#1f8a5f;
  --line:#e3e7ee; --line-d:#c9d2df;
  --barbg:#e9edf3;
  --radius:12px;
  --shadow:0 1px 3px rgba(20,33,61,.06), 0 10px 26px rgba(20,33,61,.07);
  --shadow-lg:0 30px 80px rgba(20,33,61,.3);
  --ease:cubic-bezier(.22,1,.36,1);
  --bounce:cubic-bezier(.34,1.56,.64,1);
  --serif:Georgia,"Songti SC","STSong","SimSun",serif;
}
body.dark{
  --bg:#0f1420; --surface:#161d2c; --ink:#e9edf5; --body:#c3cad8; --muted:#7d879c;
  --navy:#1d3a6b; --navy-deep:#122240; --navy-soft:#1c2740;
  --accent-text:#9dc0f0;                 /* 强调文字色：深色=亮蓝，保证对比度 */
  --red:#d95643; --red-soft:#3a221d;
  --gold:#d2a54a; --gold-soft:#2e2718;
  --warn:#e09a3e; --ok:#3cbf8a;
  --line:#26304a; --line-d:#364262;
  --barbg:#232c42;
  --shadow:0 1px 3px rgba(0,0,0,.3), 0 10px 26px rgba(0,0,0,.35);
  --shadow-lg:0 30px 80px rgba(0,0,0,.6);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  font-family:-apple-system,"PingFang SC","HarmonyOS Sans SC","Microsoft YaHei",sans-serif;
  font-size:14px; color:var(--ink); overflow:hidden;
}
body.mode-desktop{
  background:
    radial-gradient(1100px 560px at 88% -10%, #e8edf5 0%, transparent 58%),
    radial-gradient(900px 500px at -6% 106%, #ece7dd 0%, transparent 52%),
    #eef0f4;
}
body.mode-mobile{
  background:
    radial-gradient(700px 420px at 90% -8%, #e8edf5 0%, transparent 55%),
    radial-gradient(600px 400px at -10% 108%, #ece7dd 0%, transparent 50%),
    #eef0f4;
}
body.dark.mode-desktop{
  background:
    radial-gradient(1100px 560px at 88% -10%, #16203a 0%, transparent 58%),
    radial-gradient(900px 500px at -6% 106%, #1a1f2e 0%, transparent 52%),
    #0f1420;
}
body.dark.mode-mobile{
  background:
    radial-gradient(700px 420px at 90% -8%, #16203a 0%, transparent 55%),
    radial-gradient(600px 400px at -10% 108%, #1a1f2e 0%, transparent 50%),
    #0f1420;
}
h1,h2,h3,h4{font-family:var(--serif)}
button{font-family:inherit; cursor:pointer}
input,select,textarea{font-family:inherit; color:var(--ink)}
mark{background:#ffe9a8; color:inherit; border-radius:3px; padding:0 1px}

/* ================= 布局骨架（按模式严格隔离） ================= */
.app{height:100vh; height:100dvh}   /* dvh：手机浏览器地址栏收展时高度跟随 */
body.mode-desktop .app{display:flex}
body.mode-mobile .app{display:flex; flex-direction:column}
body.mode-mobile .desk-shell{display:none!important}
body.mode-desktop .m-shell{display:none!important}

/* ================= 桌面：侧栏 ================= */
.sidebar{
  width:236px; flex-shrink:0; background:linear-gradient(180deg,var(--navy) 0%,var(--navy-deep) 100%);
  display:flex; flex-direction:column; padding:12px 12px 10px; z-index:30; color:#fff;
}
.brand{display:flex; align-items:center; gap:10px; padding:2px 10px 12px}
.brand .logo{
  width:34px; height:34px; border-radius:8px; background:var(--red); color:#fff;
  display:flex; align-items:center; justify-content:center; font-weight:800; font-size:15px;
}
.brand b{font-size:15px; font-family:var(--serif)} .brand span{display:block; font-size:11px; color:rgba(255,255,255,.55); font-weight:400}
nav{position:relative; flex:1; overflow-y:auto}
.nav-glider{
  position:absolute; left:0; width:100%; border-radius:10px;
  background:rgba(255,255,255,.12); z-index:0;
  transition:top .45s var(--bounce), height .45s var(--bounce), opacity .3s;
}
.nav-item{
  position:relative; z-index:1; width:100%; display:flex; align-items:center; gap:11px;
  background:none; border:none; padding:9px 12px; border-radius:10px;
  font-size:13.5px; line-height:1.3; color:rgba(255,255,255,.75); margin-bottom:0; text-align:left;
}
.nav-item svg{width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0}
.nav-item.on{color:#fff; font-weight:800}
.nav-item .arr{margin-left:auto; transition:transform .35s var(--ease); width:14px; height:14px}
.nav-badge{
  margin-left:auto; font-style:normal; font-size:10.5px; font-weight:800; color:#fff;
  background:var(--red); min-width:17px; height:17px; border-radius:9px;
  display:flex; align-items:center; justify-content:center; padding:0 5px;
  transition:transform .4s var(--bounce), opacity .4s;
}
.nav-badge.clear{transform:scale(.2); opacity:0}
.pulse-dot{margin-left:auto; width:7px; height:7px; border-radius:50%; background:var(--red); animation:breath 1.8s ease-in-out infinite}
@keyframes breath{0%,100%{box-shadow:0 0 0 0 rgba(199,64,45,.5); opacity:1} 50%{box-shadow:0 0 0 5px rgba(199,64,45,0); opacity:.7}}
.nav-group.open .arr{transform:rotate(90deg)}
.submenu{max-height:0; overflow:hidden; transition:max-height .45s var(--ease)}
.nav-group.open .submenu{max-height:170px}
.submenu a{
  position:relative; display:flex; align-items:center; gap:9px;
  font-size:12.5px; line-height:1.3; color:rgba(255,255,255,.55); text-decoration:none; padding:5px 12px 5px 34px; border-radius:10px;
  opacity:0; transform:translateY(-4px); transition:.4s var(--ease); cursor:pointer;
}
.submenu a::before{content:""; width:1px; height:20px; background:rgba(255,255,255,.2); position:absolute; left:22px; top:-4px}
.submenu a:hover{color:#fff; background:rgba(255,255,255,.1)}
.submenu a.on{color:#fff; background:rgba(255,255,255,.13); font-weight:700}
.submenu a.on::after{content:""; position:absolute; right:10px; top:50%; transform:translateY(-50%); width:5px; height:5px; border-radius:50%; background:var(--gold)}
.nav-group.open .submenu a{opacity:1; transform:none}
.nav-group.open .submenu a:nth-child(1){transition-delay:.05s}
.nav-group.open .submenu a:nth-child(2){transition-delay:.12s}
.nav-group.open .submenu a:nth-child(3){transition-delay:.19s}
.side-foot{display:flex; align-items:center; gap:10px; padding:8px 10px 0; border-top:1px solid rgba(255,255,255,.14)}
.avatar{
  width:34px; height:34px; border-radius:8px; background:var(--red); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:800; flex-shrink:0;
  border:none; transition:transform .3s var(--bounce);
}
.avatar:active{transform:scale(.9)}
.side-foot b{font-size:13px; display:block} .side-foot span{font-size:11px; color:rgba(255,255,255,.55)}
.main-wrap{flex:1; min-width:0; display:flex; flex-direction:column; transition:transform .45s var(--ease), filter .45s}
.main-wrap.pushed{transform:translateX(250px) scale(.985); filter:brightness(.97)}
.topbar{
  height:62px; flex-shrink:0; display:flex; align-items:center; gap:12px;
  padding:0 24px; border-bottom:1px solid var(--line);
  background:var(--bg); background:color-mix(in srgb, var(--bg) 85%, transparent); backdrop-filter:blur(14px); z-index:20;
}
.topbar h2{font-size:17px; font-weight:700; margin-right:auto}
.topbar h2::after{content:""; display:inline-block; width:30px; height:2px; background:var(--red); margin-left:12px; vertical-align:middle}
main{flex:1; overflow-y:auto}
body.mode-desktop main{padding:18px 36px 10px}
body.mode-mobile main{padding:14px 14px 130px; overflow-y:auto; -webkit-overflow-scrolling:touch}
.view{display:none; margin:0 auto; animation:fade .4s var(--ease)}
body.mode-desktop .view{max-width:1020px}
body.mode-desktop #v-home{max-width:1400px}   /* v8.2：首页双栏仪表盘铺满主区（1400 软上限兜底超宽屏） */
body.mode-desktop main:has(#v-home.on){padding-left:20px; padding-right:20px}
body.mode-mobile .view{max-width:720px}
.view.on{display:block}
@keyframes fade{from{opacity:0; transform:translateY(10px)} to{opacity:1; transform:none}}

/* ================= 手机：顶栏 + 底部 Dock ================= */
.m-top{
  display:flex; align-items:center; gap:10px; height:calc(56px + env(safe-area-inset-top));
  padding:env(safe-area-inset-top) 16px 0;
  border-bottom:1px solid var(--line);
  background:var(--bg); background:color-mix(in srgb, var(--bg) 88%, transparent); backdrop-filter:blur(14px);
  position:sticky; top:0; z-index:25;
}
.m-top h2{font-size:16px; margin-right:auto}
.m-top h2::after{content:""; display:inline-block; width:24px; height:2px; background:var(--red); margin-left:10px; vertical-align:middle}
.dock{
  position:fixed; left:50%; transform:translateX(-50%); bottom:calc(14px + env(safe-area-inset-bottom));
  z-index:40; background:var(--surface); background:color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter:blur(16px);
  border:1px solid var(--line); border-radius:22px; box-shadow:0 14px 40px rgba(20,33,61,.22);
  padding:8px 8px; align-items:center; gap:1px;
  max-width:calc(100vw - 16px);   /* v7.0：8 项管理员 Dock 在小屏不超出屏幕 */
}
.dock-glider{position:absolute; top:8px; height:calc(100% - 16px); border-radius:16px; background:var(--navy-soft); z-index:0; transition:left .45s var(--bounce), width .45s var(--bounce)}
body.dark .dock-glider{background:var(--navy)}
.dock-item{position:relative; z-index:1; border:none; background:none; width:clamp(38px, 11.2vw, 52px); padding:9px 0 7px; border-radius:16px; display:flex; flex-direction:column; align-items:center; gap:3px; color:var(--muted)}
.dock-item svg{width:20px; height:20px; stroke:currentColor; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.dock-item span{font-size:10px; font-weight:700}
.dock-item.on{color:var(--accent-text); font-weight:800}
.dock-item .bdg{position:absolute; top:4px; right:10px; font-style:normal; font-size:9px; font-weight:800; color:#fff; background:var(--red); min-width:15px; height:15px; border-radius:8px; display:flex; align-items:center; justify-content:center; padding:0 4px; animation:breath 1.8s infinite}

/* 桌面窄窗提示条（置于底部，不遮挡顶栏） */
.narrow-tip{
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:95;
  background:var(--gold); color:#fff; font-size:12.5px; font-weight:700;
  padding:9px 16px; text-align:center;
}
.narrow-tip a{color:#fff}
.narrow-tip.show{display:block}

/* ================= 通用组件 ================= */
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow)}
.sec-t{display:flex; align-items:baseline; justify-content:space-between; margin:26px 2px 12px}
.sec-t h3{font-size:15.5px; font-weight:700}
.sec-t h3::after{content:""; display:inline-block; width:34px; height:2px; background:var(--red); margin-left:10px; vertical-align:middle}
.sec-t .act{font-size:12.5px; color:var(--red); font-weight:700; background:none; border:none; display:flex; align-items:center; gap:5px}
.grid2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.grid32{display:grid; grid-template-columns:1.25fr .95fr; gap:14px; align-items:start}
.muted{color:var(--muted); font-size:12px}
.btn{
  background:var(--red); color:#fff; border:none; font-size:13px; font-weight:700;
  padding:10px 20px; border-radius:8px; letter-spacing:.05em; transition:transform .3s var(--bounce), box-shadow .3s, background .3s;
}
.btn:hover{transform:translateY(-1px); box-shadow:0 8px 18px rgba(199,64,45,.28)}
.btn:active{transform:scale(.96)}
.btn.ghost{background:var(--surface); color:var(--body); border:1px solid var(--line-d)}
.btn.navy{background:var(--navy)}
.btn.navy:hover{box-shadow:0 8px 18px rgba(22,50,92,.3)}
.btn.sm{padding:7px 14px; font-size:12px}
.btn.ok-state{background:var(--ok)}
.btn:disabled{opacity:.55; cursor:not-allowed; transform:none; box-shadow:none}
.field{margin-bottom:14px}
.field label{display:block; font-size:12.5px; font-weight:700; margin-bottom:7px; color:var(--body)}
.field label em{font-style:normal; color:var(--red)}
.field input[type=text],.field input[type=number],.field input[type=url],.field input[type=date],.field input[type=password],.field select,.field textarea{
  width:100%; border:1px solid var(--line-d); border-radius:8px; padding:10px 12px; font-size:13.5px; background:var(--surface); outline:none; transition:border .2s, box-shadow .2s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--navy); box-shadow:0 0 0 3px rgba(22,50,92,.14); box-shadow:0 0 0 3px color-mix(in srgb, var(--navy) 14%, transparent)}
.field textarea{resize:vertical; min-height:88px}
.frow{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:10px}
.hint{font-size:11.5px; color:var(--muted); margin-top:6px}
.err{font-size:11.5px; color:var(--red); margin-top:6px; display:none}
.err.show{display:block}

/* 顶栏通用控件 */
.cmdk-btn{
  display:flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--surface);
  border-radius:8px; padding:7px 12px; font-size:12.5px; color:var(--muted);
}
.cmdk-btn kbd{font-size:10.5px; border:1px solid var(--line); border-radius:5px; padding:1px 5px; background:var(--bg)}
.chip{
  display:flex; align-items:center; gap:6px; border:1px solid var(--line); background:var(--surface);
  border-radius:8px; padding:7px 12px; font-size:12.5px; color:var(--body); font-weight:600;
}
.chip svg{width:14px; height:14px; stroke:var(--muted); fill:none; stroke-width:1.8}
.icon-btn{position:relative; width:36px; height:36px; border-radius:8px; border:1px solid var(--line); background:var(--surface); display:flex; align-items:center; justify-content:center; transition:transform .3s var(--bounce)}
.icon-btn:active{transform:scale(.9)}
.icon-btn svg{width:17px; height:17px; stroke:var(--body); fill:none; stroke-width:1.7; stroke-linecap:round}
.icon-btn .badge{
  position:absolute; top:-5px; right:-5px; font-style:normal; font-size:9.5px; font-weight:800; color:#fff;
  background:var(--red); min-width:16px; height:16px; border-radius:8px;
  display:flex; align-items:center; justify-content:center; padding:0 4px; animation:breath 1.8s infinite;
}

/* 打卡 */
.punch{display:flex; align-items:center; justify-content:space-between; position:relative}
.punch .lab{font-size:11.5px; color:var(--muted); letter-spacing:.12em}
.punch .val{font-size:21px; font-weight:700; margin-top:4px; font-variant-numeric:tabular-nums; letter-spacing:.01em}
.punch .val small{font-size:12px; font-weight:500; color:var(--ok); margin-left:8px}
.punch-wrap{position:relative}
.pop-menu{
  position:absolute; right:0; top:calc(100% + 8px); width:176px; z-index:40;
  background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:0 16px 40px rgba(20,33,61,.16);
  padding:6px; transform-origin:top right;
  transform:scale(.85) translateY(-6px); opacity:0; pointer-events:none;
  transition:.3s var(--bounce);
}
.pop-menu.open{transform:none; opacity:1; pointer-events:auto}
.pm-item{display:flex; align-items:center; gap:9px; width:100%; background:none; border:none; padding:9px 11px; border-radius:8px; font-size:13px; color:var(--body); text-align:left}
.pm-item:hover{background:var(--red-soft); color:var(--red)}
.pm-item svg{width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.7}
/* 气泡 */
.bubble{
  position:fixed; z-index:90; background:var(--navy); color:#fff; font-size:12.5px; font-weight:600;
  padding:8px 13px; border-radius:8px; max-width:min(86vw, 420px); white-space:normal; text-align:center; line-height:1.5;
  pointer-events:none;
  opacity:0; transform:translateY(8px) scale(.9);
  transition:.35s var(--bounce);
}
.bubble::after{content:""; position:absolute; bottom:-5px; left:50%; margin-left:-5px; width:10px; height:10px; background:var(--navy); transform:rotate(45deg); border-radius:2px}
.bubble.show{opacity:1; transform:none}
/* 速览 */
.stats{display:grid; grid-template-columns:repeat(3,1fr); gap:12px}
body.mode-desktop .stats.four{grid-template-columns:repeat(4,1fr)}   /* CRM 顶部四卡恒定一行 */
body.mode-mobile .stats.four{grid-template-columns:repeat(2,1fr)}
.stat{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:15px 8px; text-align:center; box-shadow:var(--shadow)}
.stat b{font-size:23px; font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:.01em}
.stat span{display:block; font-size:11.5px; color:var(--muted); margin-top:4px}
/* 进度 */
.prog-row{display:flex; justify-content:space-between; font-size:12.5px; color:var(--body); margin-bottom:7px}
.prog-row b{font-variant-numeric:tabular-nums; color:var(--accent-text)}
.bar{height:8px; background:var(--barbg); border-radius:3px; overflow:hidden}
.bar i{display:block; height:100%; background:var(--navy); width:0; transition:width 1s var(--ease)}
.bar i.gold{background:var(--gold)}
.bar i.red{background:var(--red)}
/* 待办卡片 */
.todo{display:flex; align-items:center; gap:12px; padding:13px 4px; border-top:1px solid var(--line); cursor:pointer; border-radius:10px; transition:background .2s}
.todo:first-of-type{border-top:none; padding-top:4px}
.todo:hover{background:rgba(22,50,92,.045); background:color-mix(in srgb, var(--navy) 4%, var(--surface))}
.idx{width:22px; height:22px; border-radius:5px; background:var(--red-soft); color:var(--red); font-size:11.5px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0}
.idx.g{background:rgba(31,138,95,.14); background:color-mix(in srgb, var(--ok) 14%, var(--surface)); color:var(--ok)}
.todo .t{flex:1; min-width:0}
.todo .t b{font-size:14px; display:block}
.todo .t span{font-size:12px; color:var(--muted)}
.todo .go{font-size:12px; color:var(--red); font-weight:700; flex-shrink:0}
.todo.done .t b{text-decoration:line-through; color:var(--muted)}
.todo .okmark{
  width:22px; height:22px; border-radius:50%; background:rgba(31,138,95,.14); background:color-mix(in srgb, var(--ok) 14%, var(--surface)); color:var(--ok);
  display:none; align-items:center; justify-content:center; font-size:12px; font-weight:800;
  animation:popin .5s var(--bounce);
}
.todo.done .okmark{display:flex}
.todo.done .go{display:none}
@keyframes popin{from{transform:scale(.3)} to{transform:scale(1)}}
/* 学习 */
.learn-hero{border-top:3px solid var(--red)}
.learn-hero .tagline{display:flex; gap:8px; margin-bottom:10px; align-items:center; flex-wrap:wrap}
.tagline i{font-style:normal; font-size:11px; padding:3px 10px; background:var(--navy); color:#fff; border-radius:3px}
.tagline em{font-style:normal; font-size:11.5px; color:var(--muted)}
.learn-hero h4{font-size:17px; line-height:1.55; margin-bottom:6px; font-weight:700}
.learn-hero p{font-size:12px; color:var(--muted); word-break:break-all}
/* 分类标签 */
.tags{display:flex; gap:8px; overflow:hidden; align-items:center; flex-wrap:nowrap; position:relative}
.tags .tag{flex-shrink:0; border:1px solid var(--line-d); background:var(--surface); border-radius:6px; padding:7px 15px; font-size:12.5px; color:var(--body); transition:.25s}
.tag.on{background:var(--navy); color:#fff; border-color:var(--navy)}
.tags .more{flex-shrink:0; border:1px dashed var(--line-d); background:none; border-radius:6px; padding:7px 13px; font-size:12.5px; color:var(--muted); display:flex; align-items:center; gap:4px}
.tags .more svg{width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:2; transition:transform .35s var(--ease)}
.tags.expanded{flex-wrap:wrap; justify-content:center}
.tags.expanded .more svg{transform:rotate(180deg)}
/* 记录 */
.record{padding:13px 4px; border-top:1px solid var(--line); cursor:pointer; border-radius:10px; transition:background .2s}
.record:first-of-type{border-top:none; padding-top:2px}
.record:hover{background:rgba(22,50,92,.045); background:color-mix(in srgb, var(--navy) 4%, var(--surface))}
.record b{font-size:13.5px; display:block; line-height:1.5}
.record .sub{display:flex; justify-content:space-between; margin-top:6px; font-size:11.5px; color:var(--muted); gap:8px; flex-wrap:wrap}
.score{color:var(--gold); font-weight:800; letter-spacing:.08em}
.pill{font-size:10.5px; font-weight:800; padding:3px 9px; border-radius:20px; letter-spacing:.04em; white-space:nowrap}
.pill.wait{background:var(--gold-soft); color:var(--gold)}
.pill.pass{background:rgba(31,138,95,.14); background:color-mix(in srgb, var(--ok) 14%, var(--surface)); color:var(--ok)}
.pill.redo{background:var(--red-soft); color:var(--red)}
.pill.info{background:var(--navy-soft); color:var(--accent-text)}
/* 看板 */
.kpi{display:grid; grid-template-columns:repeat(4,1fr); gap:12px}
.kpi .cell{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:15px; box-shadow:var(--shadow)}
.kpi .cell small{font-size:11.5px; color:var(--muted)}
.kpi .cell b{display:block; font-size:24px; margin-top:5px; font-variant-numeric:tabular-nums}
.kpi .cell em{font-style:normal; font-size:11px; margin-left:5px; color:var(--red); font-weight:700}
/* v5.0 绩效考核 */
.kpi-ring{width:104px; height:104px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:none; position:relative}
.kpi-ring::before{content:''; position:absolute; inset:9px; border-radius:50%; background:var(--surface)}
.kpi-ring>div{position:relative; text-align:center; z-index:1}
.kpi-ring b{display:block; font-size:26px; line-height:1.1; font-variant-numeric:tabular-nums}
.kpi-ring small{color:var(--muted); font-size:11px}
.krule .sub .bar{height:8px}
/* v5.0 采购中心 */
#procTabs{margin-bottom:14px}
.rq-row .field label{font-size:11px}
.member{display:flex; align-items:center; gap:11px; padding:11px 4px; border-top:1px solid var(--line); cursor:pointer; border-radius:10px; transition:background .2s}
.member:first-of-type{border-top:none}
.member:hover{background:rgba(22,50,92,.045); background:color-mix(in srgb, var(--navy) 4%, var(--surface))}
.member .av{width:32px; height:32px; border-radius:6px; background:var(--navy); color:#fff; font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0}
.member .n{flex:1; min-width:0}
.member .n b{font-size:13.5px; display:block}
.member .n span{font-size:11.5px; color:var(--muted)}
.lights{display:flex; gap:5px; flex-shrink:0}
.lights i{width:8px; height:8px; border-radius:2px; background:var(--barbg)}
.lights i.ok{background:var(--ok)}
.lights i.no{background:var(--warn)}
.hbar .row{display:flex; align-items:center; gap:10px; margin-bottom:10px}
.hbar .row label{width:48px; font-size:12.5px; color:var(--body); flex-shrink:0}
.hbar .track{flex:1; height:9px; background:var(--barbg); border-radius:3px; overflow:hidden}
.hbar .track i{display:block; height:100%; background:var(--navy); width:0; transition:width 1.1s var(--ease)}
.hbar .row b{width:40px; text-align:right; font-size:12.5px; color:var(--accent-text); font-variant-numeric:tabular-nums; flex-shrink:0}
.tabs{display:flex; gap:6px; border-bottom:1px solid var(--line); margin-bottom:16px; overflow-x:auto}
.tabs .tb{background:none; border:none; padding:10px 16px; font-size:13.5px; color:var(--muted); border-bottom:2px solid transparent; margin-bottom:-1px; font-weight:600; white-space:nowrap}
.tabs .tb.on{color:var(--accent-text); border-bottom-color:var(--red); font-weight:800}
/* 通知下拉 */
.notif-pop{
  position:fixed; width:min(320px, calc(100vw - 20px)); max-height:420px; overflow-y:auto; z-index:60;
  background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:0 20px 50px rgba(20,33,61,.2);
  padding:8px; transform-origin:top right; transform:scale(.9) translateY(-8px); opacity:0; pointer-events:none; transition:.3s var(--bounce);
}
.notif-pop.open{transform:none; opacity:1; pointer-events:auto}
.notif{display:flex; gap:10px; padding:11px 10px; border-radius:10px}
.notif:hover{background:var(--navy-soft)}
.notif .dot{width:7px; height:7px; border-radius:50%; background:var(--red); margin-top:6px; flex-shrink:0}
.notif.read .dot{background:var(--barbg)}
.notif p{font-size:12.5px; line-height:1.55; color:var(--body)}
.notif time{font-size:10.5px; color:var(--muted)}

/* ================= 覆盖层 ================= */
.scrim{position:fixed; inset:0; background:rgba(20,33,61,.34); z-index:50; opacity:0; pointer-events:none; transition:opacity .35s}
body.dark .scrim{background:rgba(0,0,0,.5)}
.scrim.show{opacity:1; pointer-events:auto}
/* 抽屉 */
.drawer{
  position:fixed; left:0; top:0; bottom:0; width:min(280px, 86vw); z-index:60;
  background:var(--surface); box-shadow:0 0 60px rgba(20,33,61,.2);
  transform:translateX(-100%); transition:transform .45s var(--ease);
  padding:24px 20px; overflow-y:auto;
}
.drawer.open{transform:none}
.drawer h4{font-size:15px; font-weight:700; margin-bottom:16px; padding-bottom:12px; border-bottom:2px solid var(--red)}
.drawer h5{font-size:11.5px; color:var(--muted); letter-spacing:.1em; margin:18px 0 9px}
.check{display:flex; align-items:center; gap:9px; padding:8px 4px; font-size:13.5px; color:var(--body); cursor:pointer}
.check .box{width:17px; height:17px; border-radius:4px; border:1.5px solid var(--line-d); display:flex; align-items:center; justify-content:center; transition:.2s; font-size:11px; color:#fff}
.check.on .box{background:var(--navy); border-color:var(--navy)}
.check.on .box::after{content:"✓"}
/* 设置面板 */
.settings{
  position:fixed; right:0; top:0; bottom:0; width:min(300px, 88vw); z-index:62;
  background:var(--surface); box-shadow:0 0 60px rgba(20,33,61,.25);
  transform:translateX(100%); transition:transform .45s var(--ease);
  padding:24px 22px; overflow-y:auto;
}
.settings.open{transform:none}
.settings h4{font-size:15px; font-weight:700; margin-bottom:4px; padding-bottom:12px; border-bottom:2px solid var(--red)}
.settings .sub{font-size:11.5px; color:var(--muted); margin-bottom:18px}
.set-group{margin-bottom:22px}
.set-group>label{display:block; font-size:12px; font-weight:800; letter-spacing:.08em; color:var(--muted); margin-bottom:10px}
.switch-row{display:flex; align-items:center; justify-content:space-between; padding:11px 0; border-bottom:1px solid var(--line)}
.switch-row .tt b{font-size:13.5px; display:block}
.switch-row .tt span{font-size:11.5px; color:var(--muted)}
.sw{width:44px; height:25px; border-radius:14px; background:var(--line-d); border:none; position:relative; transition:background .3s; flex-shrink:0}
.sw::after{content:""; position:absolute; left:3px; top:3px; width:19px; height:19px; border-radius:50%; background:#fff; transition:left .3s var(--bounce); box-shadow:0 2px 5px rgba(0,0,0,.25)}
.sw.on{background:var(--ok)}
.sw.on::after{left:22px}
.theme-preview{display:flex; gap:10px; margin-top:4px; max-width:460px}
.theme-preview .tp{flex:1; height:38px; border-radius:9px; border:2px solid var(--line); overflow:hidden; position:relative; transition:.25s}
.theme-preview .tp.on{border-color:var(--red); box-shadow:0 0 0 3px var(--red-soft)}
.theme-preview .tp i{position:absolute; border-radius:3px}
/* 详情面板（FLIP） */
.detail{
  position:fixed; z-index:70; opacity:0; pointer-events:none;
  background:var(--surface); border-top:3px solid var(--navy); border-radius:14px; box-shadow:var(--shadow-lg);
  padding:24px; overflow-y:auto;
  transition:all .45s var(--ease);
}
.detail.open{opacity:1; pointer-events:auto}
.detail h4{font-size:16.5px; font-weight:700; margin-bottom:4px; padding-right:36px}
.detail .dsub{font-size:12px; color:var(--muted); margin-bottom:14px}
.detail .close{position:absolute; right:14px; top:14px; width:30px; height:30px; border-radius:8px; border:1px solid var(--line); background:var(--surface); font-size:14px; color:var(--muted)}
.detail .kv{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:14px 0}
.detail .kv .k{background:var(--bg); border:1px solid var(--line); border-radius:9px; padding:10px 12px}
.detail .kv .k small{display:block; font-size:10.5px; color:var(--muted); margin-bottom:3px}
.detail .kv .k b{font-size:16px; font-family:var(--serif)}
.detail .blk{background:var(--bg); border:1px solid var(--line); border-radius:9px; padding:12px 14px; font-size:13px; line-height:1.7; color:var(--body); margin-bottom:10px; white-space:pre-wrap; word-break:break-word}
.detail .blk small{display:block; font-size:10.5px; color:var(--muted); letter-spacing:.08em; margin-bottom:5px; font-weight:800}
/* 确认弹窗 */
.confirm{
  position:fixed; z-index:80; left:50%; top:50%; width:min(360px,90vw);
  transform:translate(-50%,-50%) scale(.7); opacity:0; pointer-events:none;
  background:var(--surface); border-radius:16px; box-shadow:var(--shadow-lg);
  padding:26px 24px 20px; text-align:center;
  transition:.35s var(--bounce);
}
.confirm.open{transform:translate(-50%,-50%) scale(1); opacity:1; pointer-events:auto}
.confirm .cicon{width:46px; height:46px; margin:0 auto 12px; border-radius:12px; background:var(--red-soft); color:var(--red); display:flex; align-items:center; justify-content:center; font-size:20px}
.confirm h4{font-size:15.5px; margin-bottom:8px}
.confirm p{font-size:12.5px; color:var(--muted); line-height:1.7; margin-bottom:18px}
.confirm .row{display:flex; gap:10px}
.confirm .row .btn{flex:1}
/* 命令面板（仅桌面版） */
.cmdk{position:fixed; inset:0; z-index:85; display:none; justify-content:center; padding-top:12vh; opacity:0; pointer-events:none; transition:opacity .25s}
body.mode-desktop .cmdk{display:flex}
.cmdk.open{opacity:1; pointer-events:auto}
.cmdk .panel{
  width:min(560px,92vw); height:fit-content; background:var(--surface); border:1px solid var(--line);
  border-radius:16px; box-shadow:var(--shadow-lg); overflow:hidden;
  transform:translateY(-14px) scale(.97); transition:transform .3s var(--bounce);
}
.cmdk.open .panel{transform:none}
.cmdk input{width:100%; border:none; outline:none; padding:17px 20px; font-size:15px; background:var(--surface); border-bottom:1px solid var(--line)}
.cmdk .list{max-height:320px; overflow-y:auto; padding:8px}
.cmdk .it{display:flex; align-items:center; gap:11px; padding:11px 12px; border-radius:9px; font-size:13.5px; color:var(--body); cursor:pointer}
.cmdk .it svg{width:16px; height:16px; stroke:var(--muted); fill:none; stroke-width:1.7; flex-shrink:0}
.cmdk .it.sel{background:var(--navy-soft); color:var(--accent-text)}
.cmdk .it .kb{margin-left:auto; font-size:10px; color:var(--muted); border:1px solid var(--line); border-radius:4px; padding:1px 5px}
.cmdk .empty{padding:26px; text-align:center; font-size:12.5px; color:var(--muted)}
/* 日历弹出 */
.cal{
  position:fixed; z-index:75; width:268px; background:var(--surface); border:1px solid var(--line);
  border-radius:14px; box-shadow:0 20px 50px rgba(20,33,61,.22); padding:14px;
  transform-origin:top left; transform:scale(.85) translateY(-6px); opacity:0; pointer-events:none;
  transition:.3s var(--bounce);
}
.cal.open{transform:none; opacity:1; pointer-events:auto}
.cal .head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px}
.cal .head b{font-size:13.5px; font-family:var(--serif)}
.cal .head button{border:none; background:none; width:26px; height:26px; border-radius:6px; color:var(--body); font-size:14px}
.cal .head button:hover{background:var(--navy-soft)}
.cal .grid{display:grid; grid-template-columns:repeat(7,1fr); gap:2px; text-align:center}
.cal .wd{font-size:10px; color:var(--muted); padding:4px 0}
.cal .d{border:none; background:none; font-size:12px; padding:7px 0; border-radius:7px; color:var(--body); position:relative}
.cal .d:hover{background:var(--navy-soft)}
.cal .d.mute{color:var(--line-d)}
.cal .d.today{background:var(--navy); color:#fff; font-weight:800}
.cal .d.today::after{content:""; position:absolute; bottom:3px; left:50%; width:4px; height:4px; margin-left:-2px; border-radius:50%; background:var(--red)}
/* 底部核对清单 */
.sheet{
  position:fixed; left:50%; transform:translate(-50%,110%); bottom:86px; z-index:65;
  width:min(420px,92vw); background:var(--surface); border:1px solid var(--line);
  border-radius:16px 16px 12px 12px; box-shadow:0 -10px 40px rgba(20,33,61,.2);
  padding:18px; transition:transform .45s var(--ease), visibility 0s .45s;
  visibility:hidden;   /* v8.0 bugfix：空 sheet 高度小，110% 位移不足以完全藏到视口外（露 20px 白边），visibility 兜底 */
}
body.mode-desktop .sheet{bottom:24px}
.sheet.open{transform:translate(-50%,0); visibility:visible; transition:transform .45s var(--ease)}
.sheet h4{font-size:14px; margin-bottom:12px}
.sheet .srow{display:flex; justify-content:space-between; font-size:13px; padding:8px 2px; border-top:1px solid var(--line); color:var(--body); gap:10px}
.sheet .srow b{color:var(--accent-text); text-align:right}

/* 桌面端内部宽度适配（仍保持桌面版式） */
@media (max-width:1100px){
  body.mode-desktop .kpi{grid-template-columns:1fr 1fr}
}
@media (max-width:960px){
  body.mode-desktop .grid2{grid-template-columns:1fr}
  body.mode-desktop .grid32{grid-template-columns:1fr}
}

/* ================= 手机版专属修正 ================= */
/* KPI 四列在窄屏过挤 → 两列 */
body.mode-mobile .kpi{grid-template-columns:1fr 1fr}
/* 输入框 ≥16px，避免 iOS/微信内置浏览器聚焦时自动放大页面破坏布局 */
body.mode-mobile .field input,
body.mode-mobile .field select,
body.mode-mobile .field textarea,
body.mode-mobile input[type=text],
body.mode-mobile input[type=number],
body.mode-mobile input[type=url],
body.mode-mobile input[type=password],
body.mode-mobile input[type=date],
body.mode-mobile input[type=email],
body.mode-mobile input[type=tel],
body.mode-mobile select,
body.mode-mobile textarea{font-size:16px}   /* 审计 M-10：不在 .field 容器内的 textarea（早晚报粘贴框/周计划 wk-rowta）也要 16px，否则 iOS 聚焦自动放大 */

/* 周计划等处的内联输入框（统一规格，可被手机版字号规则覆盖） */
.inline-input{
  flex:1; min-width:0; border:1px solid var(--line-d); border-radius:8px;
  padding:10px 12px; font-size:13.5px; background:var(--surface); outline:none;
  transition:border .2s, box-shadow .2s;
}
.inline-input:focus{border-color:var(--navy); box-shadow:0 0 0 3px rgba(22,50,92,.14)}

/* 设置面板主题预览卡（原先为空白方块，无法辨识） */
.theme-preview .tp::before{
  content:""; display:block; height:24px; margin:6px 6px 0; border-radius:6px; border:1px solid rgba(128,128,128,.25);
}
.theme-preview .tp[data-theme=light]::before{background:linear-gradient(135deg,#f2f4f8 58%,#16325c 58%)}
.theme-preview .tp[data-theme=dark]::before{background:linear-gradient(135deg,#0f1420 58%,#9dc0f0 58%)}
.theme-preview .tp::after{
  content:""; display:block; text-align:center; font-size:10.5px; font-weight:700; color:var(--muted); margin-top:4px;
}
.theme-preview .tp[data-theme=light]::after{content:"浅色模式"}
.theme-preview .tp[data-theme=dark]::after{content:"深色模式"}
.theme-preview .tp.on::after{color:var(--red)}

/* ================= 客户中心 ================= */
.pill.gray{background:var(--barbg); color:var(--muted)}
.toolbar{display:flex; gap:10px; margin-bottom:14px; flex-wrap:wrap; align-items:center}
.searchbox{flex:1; min-width:170px; display:flex; align-items:center; gap:8px; border:1px solid var(--line-d); border-radius:8px; padding:0 12px; background:var(--surface)}
.searchbox svg{width:14px; height:14px; stroke:var(--muted); fill:none; stroke-width:2; flex-shrink:0}
.searchbox input{border:none; outline:none; background:none; padding:10px 0; font-size:13.5px; width:100%; color:var(--ink); min-width:0}
.hbar .row label.wide{width:64px}
.stat b small{font-size:12px; font-weight:600; margin-left:1px}

/* ================= 评估整改补充（2026-10-10） ================= */
:root{ --chart-lead:#9aa7bd }
body.dark{ --chart-lead:#7f96bd }
.chip.on{ border-color:var(--navy); color:var(--navy); background:rgba(22,50,92,.08) }
body.dark .chip.on{ border-color:var(--accent-text); color:var(--accent-text); background:rgba(96,165,250,.12) }
.qf{ display:none }
body.mode-mobile .qf{ display:inline-flex }

/* ================= v4 优化（2026-10-10 傍晚） ================= */
/* 首页主视觉卡：打卡 + 速览合并 */
.hero-punch{display:flex; align-items:center; gap:26px; flex-wrap:wrap; border-top:3px solid var(--navy)}
.hero-punch .punch{min-width:180px}
.hero-punch .stats{flex:1; min-width:290px; gap:10px}
.hero-punch .stat{box-shadow:none; background:var(--bg); padding:13px 6px}
.hero-div{width:1px; align-self:stretch; background:var(--line); flex-shrink:0}
body.mode-mobile .hero-div{display:none}
body.mode-mobile .hero-punch{gap:14px}
body.mode-mobile .hero-punch .stats{min-width:0; width:100%}

/* 早晚报 */
.dr-todo{border-left:3px solid var(--gold)}
.dr-carry{border-left:3px solid var(--warn)}
.dr-list{display:flex; flex-direction:column; gap:2px}
.dr-item{display:flex; align-items:flex-start; gap:10px; padding:9px 4px; border-top:1px solid var(--line); font-size:13.5px; line-height:1.5}
.dr-item:first-child{border-top:none}
.dr-mark{width:22px; height:22px; border-radius:6px; background:var(--barbg); color:var(--body); font-size:11.5px; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px}
.dr-item.done{color:var(--muted)}
.dr-item.done .dr-t{text-decoration:line-through}
.dr-item.done .dr-mark{background:rgba(31,138,95,.15); color:var(--ok)}
.dr-item.miss .dr-mark{background:var(--gold-soft); color:var(--gold)}
.dr-item.extra .dr-mark{background:var(--navy-soft); color:var(--accent-text)}
.dr-stats{display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin-top:14px}
.dr-stats div{background:var(--bg); border:1px solid var(--line); border-radius:9px; padding:10px 6px; text-align:center}
.dr-stats b{display:block; font-size:20px; font-variant-numeric:tabular-nums}
.dr-stats span{font-size:10.5px; color:var(--muted)}
body.mode-mobile .dr-stats{grid-template-columns:repeat(2,1fr)}

/* 导入映射 */
.imp-map{display:flex; flex-direction:column; gap:2px; margin-top:4px}
.imp-map-row{display:flex; justify-content:space-between; gap:12px; font-size:12.5px; padding:6px 2px; border-top:1px solid var(--line)}
.imp-map-row:first-child{border-top:none}
.imp-map-row span{color:var(--muted)}
.imp-map-row b{color:var(--accent-text); text-align:right; word-break:break-all}
.imp-map-row.na b{color:var(--muted); font-weight:500}
.imp-pvs{margin-top:6px}
.imp-pv{display:flex; justify-content:space-between; gap:10px; font-size:12px; padding:6px 2px; border-top:1px dashed var(--line)}
.imp-pv:first-child{border-top:none}
.imp-pv b{color:var(--ink)}
.imp-pv span{color:var(--muted); text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

/* 图表 */
.chart-card{padding:16px 14px 10px}
.chart-foot{display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; font-size:11px; color:var(--muted); margin-top:8px; padding-top:8px; border-top:1px solid var(--line)}
.donut-wrap{display:flex; align-items:center; gap:22px; flex-wrap:wrap}
.donut-wrap .lg{display:grid; grid-template-columns:repeat(auto-fill, minmax(96px,1fr)); gap:8px 14px; flex:1; min-width:180px}
.lg-item{display:flex; align-items:center; gap:7px; font-size:12px; color:var(--body)}
.lg-item i{width:10px; height:10px; border-radius:3px; flex-shrink:0}
.lg-item b{margin-left:auto; color:var(--accent-text); font-variant-numeric:tabular-nums}

/* 条形图升级：更高、渐变、圆角 */
.hbar .track.xl{height:16px; border-radius:8px}
.hbar .track i.grad{background:linear-gradient(90deg, var(--navy), #3f6cb3)}
.hbar .track i.grad-ok{background:linear-gradient(90deg, var(--ok), #57c59a)}
body.dark .hbar .track i.grad{background:linear-gradient(90deg, #1d3a6b, #4a7ac7)}
body.dark .hbar .track i.grad-ok{background:linear-gradient(90deg, #1f7a55, #3cbf8a)}

/* 员工管理 */
.emp-row .t b{font-size:14px; display:flex; align-items:center; flex-wrap:wrap; gap:2px}

/* 员工卡片网格 */
.emp-grid{display:grid; grid-template-columns:repeat(auto-fit, minmax(0,1fr)); gap:12px}   /* 恒定一行，人数增减自动均分 */
.emp-card{border:1px solid var(--line); border-radius:12px; padding:14px; cursor:pointer;
  display:flex; flex-direction:column; gap:6px; background:var(--surface);
  transition:transform .25s var(--bounce, ease), box-shadow .25s, border-color .2s}
.emp-card:hover{border-color:var(--navy); box-shadow:0 8px 22px rgba(20,33,61,.14); transform:translateY(-2px)}
.emp-card .avatar{width:38px; height:38px; font-size:15px; margin-bottom:2px}
.emp-card .ec-name{display:flex; align-items:center; gap:6px; flex-wrap:wrap; font-size:14px}
.emp-card .muted{font-size:12px}
.emp-card .ec-no{font-size:11px; opacity:.75}
.emp-card.emp-off{opacity:.62; background:var(--bg)}
body.mode-mobile .emp-grid{grid-template-columns:1fr 1fr; gap:9px}
@media (max-width:380px){ body.mode-mobile .emp-grid{grid-template-columns:1fr} }

/* 客户列表紧凑条目：两行版式、字号统一、右对齐 */
.record.crec{padding:9px 14px; gap:3px}
.record.crec .cr-top{display:flex; align-items:center; justify-content:space-between; gap:10px; min-width:0}
.record.crec .cr-top>b{font-size:13.5px; min-width:0; flex:1; display:flex; align-items:center; gap:6px; white-space:nowrap; overflow:hidden}
.record.crec .cr-top>b>span:first-child,.record.crec .cr-top>b{white-space:nowrap}
.record.crec .cr-right{display:flex; align-items:center; gap:6px; flex-shrink:0}
.record.crec .cr-amt{font-size:13px; color:var(--accent-text); font-variant-numeric:tabular-nums}
.record.crec .cr-amt small{font-size:10px}
.record.crec .cr-sub{display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:11.5px; color:var(--muted); white-space:nowrap}
.record.crec .cr-meta{overflow:hidden; text-overflow:ellipsis; min-width:0}
.record.crec .cr-own{display:flex; align-items:center; gap:4px; flex-shrink:0}
.record.crec .cr-ava{width:15px; height:15px; border-radius:50%; background:var(--navy); color:#fff; font-size:9px; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0}
.record.crec .pill{font-size:10px; padding:2px 7px}

/* 周工作计划表（YMURE 版式） */
.wk-banner{background:linear-gradient(90deg, var(--navy-soft), transparent 70%); border-bottom:2px solid var(--navy); text-align:center; font-family:var(--serif); font-size:17px; font-weight:700; letter-spacing:.35em; padding:10px 0 9px; margin-bottom:2px}
.wtable2{width:100%; border-collapse:collapse; table-layout:fixed; font-size:12.5px}
.wtable2 td{border:1px solid var(--line-d,var(--line)); padding:6px 8px; vertical-align:top}
.wtable2 .wk-lab{background:var(--bg); font-weight:600; text-align:center; vertical-align:middle; white-space:normal; line-height:1.55; color:var(--body); font-size:12px}
.wtable2 .wk-day{background:var(--navy); color:#fff; text-align:center; font-weight:600; padding:7px 4px; font-size:12.5px}
.wtable2 .wk-green{background:var(--navy-soft); font-weight:600; text-align:center; vertical-align:middle; font-size:12px}
.wk-item{display:flex; gap:6px; align-items:baseline; padding:1px 0}
.wk-item .n{color:var(--muted); font-size:11.5px; flex-shrink:0; min-width:16px; text-align:right}
.wk-cell{outline:none; white-space:pre-wrap; word-break:break-word; line-height:1.75; min-height:22px; color:var(--body); border-bottom:1px dashed var(--line); border-radius:2px; padding:0 2px}
.wk-cell:focus{border-bottom-color:var(--navy); background:var(--navy-soft)}
.wk-cell:empty::before{content:attr(data-ph); color:var(--muted); opacity:.7}
.wk-half{display:block}
.wk-half+.wk-half{margin-top:5px; padding-top:4px; border-top:1px dashed var(--line)}
.wk-hlab{display:inline-block; font-size:10px; color:var(--muted); background:var(--bg); border-radius:3px; padding:1px 5px; margin-bottom:2px}
.wk-half .wk-cell{width:100%; min-height:40px; display:block}
.wk-addrow{display:flex; gap:5px; margin-top:6px}
.wk-addrow .wcell{flex:1; min-width:0; border:1px dashed var(--line-d,var(--line)); border-radius:5px; background:transparent; color:var(--body); font-size:11.5px; padding:3px 6px; outline:none}
.wk-addrow .wcell:focus{border-color:var(--navy)}
.wk-rowta{width:100%; border:none; background:transparent; color:var(--body); font-size:12.5px; line-height:1.8; min-height:40px; resize:vertical; outline:none; font-family:inherit}
.wk-rowta:focus{background:var(--navy-soft)}
@media (max-width:1120px){ .wtable2{min-width:760px} }

.tbl-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin-top:8px}

/* ---- v4.5 月报：三个并排卡片 ---- */
.m-cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:2px 0 4px}
.m3card{background:var(--bg); border:1px solid var(--line); border-radius:11px; padding:13px 15px 11px; min-width:0}
.m3card .m3t{font-weight:700; font-size:13px; margin-bottom:8px; padding-bottom:7px; border-bottom:1px dashed var(--line)}
.m3card .m3b{font-size:12.5px; line-height:2; color:var(--body)}
@media (max-width:1120px){ .m-cards3{grid-template-columns:1fr} }

/* ---- v4.5 客户列表分页 ---- */
.pgbar{display:flex; align-items:center; justify-content:center; gap:16px; padding:12px 2px 4px; border-top:1px solid var(--line); margin-top:8px}
.pgbar .pg-info{font-size:12px; color:var(--muted)}
.pgbar .pg-info b{color:var(--body); font-variant-numeric:tabular-nums}
.pgbar button:disabled{opacity:.4; cursor:not-allowed}
.pg-jump-in{width:58px; padding:4px 6px; border:1px solid var(--line); border-radius:8px; font-size:12.5px; text-align:center; background:var(--surface); color:var(--body)}
.pg-jump-in::-webkit-outer-spin-button,.pg-jump-in::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}

/* ---- v4.6 首页两栏布局（待办|客户概览 · 完成度|自动播报） ---- */
.home-row{display:flex; gap:14px; align-items:stretch}
.home-row + .home-row{margin-top:0}
.home-col{flex:1; min-width:0; display:flex; flex-direction:column}
.home-col .home-grow{flex:1}
.punch{flex-direction:column; align-items:flex-start; justify-content:flex-start; gap:12px}
.todo{padding:10px 4px}
.todo .t{display:flex; align-items:baseline; gap:10px}
.todo .t b{display:inline; flex-shrink:0; font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:58%}
.todo .t span{flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11.5px}
.notice-live{display:flex; flex-direction:column}
.hero-notice{flex:1.15; min-width:250px; max-width:330px; padding:11px 13px}
.hero-notice .nl-body{min-height:52px; margin-top:5px}
.hero-notice .nl-dots{padding-top:6px}
.nl-body{flex:1; margin-top:8px; min-height:72px}
.nl-item{animation:fade .45s var(--ease)}
.nl-dots{display:flex; gap:5px; padding-top:10px; margin-top:auto}
.nl-dots i{width:6px; height:6px; border-radius:50%; background:var(--line); transition:.3s}
.nl-dots i.on{background:var(--gold); width:16px; border-radius:3px}

/* ---- v4.6 早晚报并排 / 团队点评并排 ---- */
.daily-duo{display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:stretch; margin-top:14px}
.daily-duo>.card{margin-top:0}
.team-row{display:grid; grid-template-columns:3fr 1fr; gap:12px; align-items:stretch}
.team-row .card{margin:0}
.cmt-card .cmt-txt{display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; word-break:break-all}
#homeCrm .stats{gap:8px}
#homeCrm .stat{padding:9px 4px}
#homeCrm .stat b{font-size:17px}
#homeCrm .stat span{font-size:10.5px; margin-top:2px}
@media (max-width:960px){ .daily-duo,.team-row{grid-template-columns:1fr} }

/* ---- v4.5 周计划：只读视图 ---- */
.wk-banner{position:relative; padding-right:120px}
.wk-banner .wk-editbtn{position:absolute; right:12px; top:50%; transform:translateY(-50%); letter-spacing:normal; pointer-events:auto}
.wk-cell.ro{min-height:0; border-bottom:none; padding:2px 2px}
.wk-none{color:var(--muted); opacity:.65}
.wk-rota{white-space:pre-wrap; line-height:1.75; color:var(--body); font-size:12.5px; min-height:22px}
.wk-rota .wk-none{font-size:12px}
.wtable{width:100%; min-width:620px; border-collapse:collapse; font-size:13px}
.wtable th{background:var(--bg); color:var(--muted); font-size:11.5px; font-weight:600; text-align:left; padding:8px; border-bottom:1px solid var(--line-d, var(--line)); white-space:nowrap}
.wtable th:first-child{border-radius:8px 0 0 8px}
.wtable th:last-child{border-radius:0 8px 8px 0}
.wtable td{padding:6px 8px; border-bottom:1px solid var(--line); vertical-align:middle}
.wtable tr[data-i]{cursor:pointer}
.wtable tr[data-i]:hover td{background:color-mix(in srgb, var(--navy) 4%, var(--surface))}
.wtable tr.row-done td{color:var(--muted)}
.wtable tr.row-done .wcell{color:var(--muted); text-decoration:line-through}
.wtable tr.row-new td{border-bottom:none; padding-top:10px}
.wcell{width:100%; border:1px solid transparent; background:none; padding:5px 6px; border-radius:6px; font-size:13px; font-family:inherit; color:var(--ink); outline:none; transition:border-color .15s, background .15s}
.wcell:hover, .wcell:focus{border-color:var(--line-d, var(--line)); background:var(--surface)}
.wtable .pill.wtoggle{cursor:pointer; border:none; font-size:11px; padding:4px 10px}
body.mode-mobile .wtable th, body.mode-mobile .wtable td{padding:6px}
body.mode-mobile .wtable{min-width:560px}

/* v4.3 客户阶段分布条形视图（环形图退化保护） */
.dist-list{display:flex; flex-direction:column; gap:9px}
.dist-row{display:flex; align-items:center; gap:10px; font-size:13px; color:var(--ink)}
.dist-row>i{width:10px; height:10px; border-radius:3px; flex-shrink:0}
.dist-row .dl{width:60px; flex-shrink:0}
.dist-row .track{flex:1; height:8px; border-radius:4px; background:var(--line); overflow:hidden}
.dist-row .track i{display:block; height:100%; border-radius:4px}
.dist-row>b{width:44px; text-align:right; font-variant-numeric:tabular-nums}
.dist-row>small{width:50px; text-align:right; color:var(--muted); font-size:11.5px}

/* ================= v5.1 八项微调 ================= */
/* 2 首页 hero 带：出勤缩小 / stat 收窄 / 播报拉长降高 */
.hero-punch .punch{min-width:148px}
.hero-punch .punch .val{font-size:19px}
.hero-punch .stat span b{font-size:12px; font-weight:700}
.hero-punch .stats{gap:10px}
.hero-notice{max-width:420px; flex:1.6}
.hero-notice .nl-body{min-height:42px}
.hero-notice .nl-dots{margin-top:6px}
/* 3 客户概览：三小卡与待跟进行拉开间距 */
#homeCrm .stats{margin-bottom:16px}
#homeCrm .todo{padding:13px 4px}
/* 4 早晚报：输入框拉长 + 两卡降高 */
#amPaste{width:100%; min-height:72px !important}
.daily-duo>.card{padding:13px 15px}
.daily-duo .dr-item{padding:7px 4px}
.daily-duo .dr-stats div{padding:7px 6px}
.daily-duo .dr-stats b{font-size:17px}
/* 6 看板：环形八卦阵（左）+ 阶段分布（右）等高 */
.board-kpi-duo{display:flex; gap:14px; align-items:stretch}
.bagua{flex:0 0 46%; display:flex; align-items:center; justify-content:center; min-height:430px}
.bagua-ring{position:relative; width:400px; height:400px; flex:none}
.bagua-ring::before{content:''; position:absolute; inset:76px; border-radius:50%; border:1px dashed var(--line)}
.bagua-center{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:130px; height:130px; border-radius:50%; background:var(--bg); border:1px solid var(--line); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px}
.bagua-center b{font-size:17px; font-variant-numeric:tabular-nums}
.bagua-center span{font-size:11px; color:var(--muted); letter-spacing:2px}
.b-cell{position:absolute; left:50%; top:50%; width:96px; padding:8px 3px; text-align:center; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow);
  transform:rotate(var(--a)) translate(140px) rotate(calc(-1*var(--a))) translate(-50%,-50%)}
.b-cell small{display:block; font-size:10.5px; color:var(--muted); white-space:normal; line-height:1.35; padding:0 2px}
.b-cell b{display:block; font-size:16px; margin-top:2px; font-variant-numeric:tabular-nums}
.b-cell b em{font-style:normal; font-size:10.5px; margin-left:2px; color:var(--muted); font-weight:700}
.bagua-side{flex:1; display:flex; flex-direction:column}
.bagua-side .card{flex:1}
@media (max-width:1120px){ .board-kpi-duo{flex-direction:column} .bagua{flex:none} }
/* 7 看板第二屏：团队状态 70% | 学习对比 30% */
.board-two{display:flex; gap:14px; align-items:stretch}
.board-two .b-col{display:flex; flex-direction:column; min-width:0}
.board-two .b-col .card{flex:1}
@media (max-width:960px){ .board-two{flex-direction:column} }
/* 8 趋势图铺满 + 降高 */
.chart-card{padding:12px 12px 8px}

/* ===== v5.4 客户阶段分布 · 旭日图（标题入卡：内环=阶段，外环=负责人拆分，中心=总数） ===== */
.sun-card{display:flex; flex-direction:column; padding:14px 16px 10px}
.sun-head{display:flex; align-items:baseline; justify-content:space-between; margin-bottom:2px}
.sun-head h3{font-size:14.5px}
.sun-wrap{position:relative; flex:1; display:flex; align-items:center; justify-content:center; min-height:0}
.sun-wrap svg{width:min(100%, 326px); height:auto; display:block}
.sun-arc{cursor:pointer; stroke:var(--surface); stroke-width:1.5; transition:opacity .15s}
.sun-arc:hover{opacity:.85}
.sun-txt{fill:#fff; font-size:10.5px; font-weight:600; paint-order:stroke; pointer-events:none}
.sun-center{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:96px; text-align:center; pointer-events:none}
.sun-center b{font-size:22px; font-variant-numeric:tabular-nums}
.sun-center span{display:block; font-size:10.5px; color:var(--muted); letter-spacing:1px}
.sun-legend{display:flex; flex-wrap:wrap; gap:5px 12px; justify-content:center; margin-top:6px}
.sun-legend .lg{display:inline-flex; align-items:center; gap:5px; font-size:11px; color:var(--muted); cursor:pointer}
.sun-legend .lg:hover{color:var(--accent-text)}
.sun-legend .lg i{width:10px; height:10px; border-radius:3px; flex:none}
.so-foot{font-size:11px; color:var(--muted); text-align:center; margin-top:4px}

/* ===== v6.3 数据大屏视图容器（#v-screen；大屏自身样式在 screen/screen.css，已容器化隔离） ===== */
body.mode-desktop.viewing-screen .sidebar{display:none}              /* 大屏态隐藏侧栏，全屏展示 */
body.mode-desktop.viewing-screen main{padding:0; overflow:hidden}    /* 抵消 main 内边距与滚动 */
body.mode-desktop.viewing-screen .narrow-tip{display:none}           /* 窄窗提示条不遮挡大屏底栏 */
body.viewing-screen #v-screen .tb-exit{display:inline-flex}          /* 大屏态显示退出全屏按钮（screen.css 默认隐藏） */
body.mode-desktop #v-screen{max-width:none; width:100%; height:100%} /* 覆盖 .view 的 1020px 限宽 */
#v-screen.on{animation:none}                                         /* 关闭 fade 进场：避免 transform 包含块影响 fixed 子层，且与面板 rise 动画重复 */
#v-screen .stage{height:100%}                                        /* 大屏骨架填满视图容器 */

/* ================= v7.0 移动端体验优化 ================= */
/* 1 八卦环窄屏缩放（scale 方案零几何重算，b-cell 半径 140px 无需改动） */
@media (max-width:520px){
  .bagua{min-height:340px}
  .bagua-ring{transform:scale(.78); margin:-44px 0}
}
/* 2 SVG 图表小字放大（CSS 可覆盖 presentation attribute；仅作用于标注类 .svgt） */
body.mode-mobile text.svgt{font-size:12.5px !important}
body.mode-mobile .sun-txt{font-size:12.5px !important}
/* 3 周计划表窄屏横向滚动 */
.wtable-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain}
.wscroll-hint{display:none; font-size:11.5px; color:var(--muted); margin:2px 0 8px}
body.mode-mobile .wscroll-hint{display:block}
/* 4 弹层滚动穿透锁定 */
.scrim.show{overscroll-behavior:contain}
body.ov-open{overflow:hidden}
body.mode-mobile .detail{overscroll-behavior:contain}
body.mode-mobile .drawer{overscroll-behavior:contain}
/* 5 触控目标 ≥40px */
@media (max-width:640px){
  body.mode-mobile .tag{min-height:40px; padding-top:8px; padding-bottom:8px}
  body.mode-mobile .qf{min-height:40px; padding:8px 12px}
}

/* ================= v8.0-S2 导航重组 + 4+1 Dock + 内联操作 ================= */
/* 侧栏分组标签（今日 / 线索·商机 / 订单·回款 / 经营分析 / 团队） */
.nav-cap{
  font-size:10.5px; font-weight:800; letter-spacing:.14em; line-height:1.2; color:rgba(255,255,255,.42);
  padding:7px 18px 3px; text-transform:uppercase; user-select:none;
}
/* 团队子菜单 5 项，放宽展开高度 */
#navTeam.open .submenu{max-height:250px}
/* 今日到期卡内联操作条（C6：零跳转完成下一步） */
.todo .ops{display:flex; gap:5px; flex-wrap:wrap; margin-top:7px; width:100%}
.op-chip{
  border:1px solid var(--line); background:var(--surface); color:var(--body);
  font-size:11.5px; font-weight:700; padding:4px 9px; border-radius:999px; cursor:pointer;
  transition:border-color .15s, background .15s; min-height:26px;
}
.op-chip:hover{border-color:var(--navy); color:var(--navy); background:rgba(22,50,92,.07)}
body.dark .op-chip{background:rgba(255,255,255,.05)}
body.dark .op-chip:hover{border-color:var(--accent-text); color:var(--accent-text)}
/* 移动端 4+1 Dock：中央快记大按钮 */
.dock-item.dock-quick svg{
  width:26px; height:26px; stroke-width:2.4;
  background:var(--navy); color:#fff; border-radius:50%;
  padding:7px; box-sizing:border-box; box-shadow:0 3px 10px rgba(22,50,92,.35);
}
.dock-item.dock-quick span{color:var(--navy); font-weight:800}
/* 移动端「我的」聚合页 */
.me-head{display:flex; align-items:center; gap:12px; margin-bottom:10px}
.me-head .avatar{width:44px; height:44px; font-size:18px}
.me-head b{display:block; font-size:15px}
.me-head span{font-size:12px; color:var(--muted)}
.me-list{padding:4px 0}
.me-row{
  display:flex; align-items:center; gap:11px; padding:12px 14px; font-size:13.5px; font-weight:600;
  border-top:1px solid var(--line); cursor:pointer;
}
.me-row:first-child{border-top:none}
.me-row:active{background:rgba(22,50,92,.06)}
.me-row i{margin-left:auto; font-style:normal; color:var(--muted)}
.me-row span{font-size:16px}
/* 订单看板筛选 chips */
.ord-chip{cursor:pointer}
.ord-chip.on{border-color:var(--navy); color:var(--navy); background:rgba(22,50,92,.08)}
body.dark .ord-chip.on{border-color:var(--accent-text); color:var(--accent-text); background:rgba(96,165,250,.12)}

/* ================= v8.0-S3 成交后闭环（三页签/交付进度点/归因） ================= */
/* 订单交付四阶段进度点 */
.pd-wrap{display:inline-flex; align-items:center; gap:4px; vertical-align:middle}
.pd{width:9px; height:9px; border-radius:50%; background:var(--line); display:inline-block; transition:background .15s}
.pd.on{background:var(--navy)}
body.dark .pd.on{background:var(--accent-text)}
/* 回款计划分组标题色沿用既有 --gold/--red 变量，无需新增 */
/* 输单归因弹层复用 field/blk 基建，无需新样式 */

/* ================= v8.0-S5 工程还债：内联样式工具类 ================= */
/* 说明：原 app.js 中高频静态内联样式收敛于此，置于文件末尾以复现内联覆盖语义。
   约定：fs=font-size, fw=font-weight, mt/mb/ml=margin, c-*=color(var), w=width, lh=line-height */
.fs115{font-size:11.5px}
.fs125{font-size:12.5px}
.fs13{font-size:13px}
.fs135{font-size:13.5px}
.fs14{font-size:14px}
.fs15{font-size:15px}
.fw400{font-weight:400}
.inh{font-family:inherit}
.cur-def{cursor:default}
.cur-pt{cursor:pointer}
.empty-pad{padding:14px 2px}
.chip3{padding:3px 10px}
.padtab{padding:10px 4px; font-size:12px}
.mt2{margin-top:2px}
.mt6{margin-top:6px}
.mt8{margin-top:8px}
.mt10{margin-top:10px}
.mt12{margin-top:12px}
.mt14{margin-top:14px}
.mt16{margin-top:16px}
.mb10{margin-bottom:10px}
.mb12{margin-bottom:12px}
.mb14{margin-bottom:14px}
.ml6{margin-left:6px}
.lh2{line-height:2}
.lh18{line-height:1.8}
.lead17{margin:8px 0 14px; line-height:1.7}
.c-acc{color:var(--accent-text)}
.c-red{color:var(--red)}
.c-ok{color:var(--ok)}
.c-gold{color:var(--gold)}
.c-mut{color:var(--muted)}
.w90{width:90px}
.w80{width:80px}
.w76{width:76px}
.flex1{flex:1}
.wrap{flex-wrap:wrap}
.row8{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.blk-t{display:block; font-weight:700; color:var(--body); margin:10px 0 2px}
.wb{word-break:break-all}
.p2{padding:2px}
.bt-line{border-top-color:var(--line)}
.tabbtn{border:none; padding:8px 4px; border-radius:7px; font-size:12px; font-weight:700; background:none; color:var(--muted)}

/* ---- v8.0-B1 首页布局微调 ---- */
/* ①② hero 带重分配：出勤收窄、播报(画框)放大占满 */
.hero-punch .punch{min-width:112px}
.hero-punch .punch .btn{padding:9px 14px; font-size:13px}
.hero-punch .stats{min-width:250px}
.hero-notice{max-width:640px; flex:2.4}
/* ③ 自动播报：标题与内容均单行截断，卡片高度恒定 */
.hero-notice .nl-body{min-height:34px; overflow:hidden}
.hero-notice .nl-item b{display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.hero-notice .nl-item .muted{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
/* ④ 客户概览条目：信息一行 + 按钮一行（按钮不折行） */
.cust-row{flex-wrap:wrap}
.cust-row .idx{flex-shrink:0}
.cust-row .t{flex:1 1 0; min-width:0}
.cust-row .ops{width:100%; margin-top:6px; flex-wrap:nowrap; gap:5px}
.cust-row .op-chip{padding:3px 8px; font-size:11px; min-height:22px}

/* ---- v8.0-B2 仪表盘布局微调 ---- */
/* ③ hero 分隔线左右间距对称：punch 收缩到内容宽，消除内部空隙 */
.hero-punch .punch{min-width:0}
.hero-punch .punch .val{white-space:nowrap}
/* ④ 商机阶段漏斗：阶段标签不折行（4 字标签独占一行） */
.hbar.funnel-bar .row label{width:auto; white-space:nowrap}
/* ⑤ 本月学习完成率对比：竖向柱状图（底部对齐左栏内容） */
.vbars{display:flex; gap:16px; align-items:stretch; padding:14px 16px 12px}
.vbars .vb{flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:6px}
.vbars .vb b{font-size:12.5px; color:var(--accent-text); font-variant-numeric:tabular-nums}
.vbars .vb .vb-track{flex:1; width:100%; max-width:46px; background:var(--barbg); border-radius:7px; display:flex; align-items:flex-end; overflow:hidden}
.vbars .vb .vb-track i{display:block; width:100%; height:0; background:linear-gradient(180deg, var(--navy), #3f6cb3); transition:height 1.1s var(--ease)}
.vbars .vb label{font-size:12px; color:var(--body); white-space:nowrap}
/* ⑦ 月报八卡：纵向长方形，一排八个 */
.mr-grid{display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; margin-bottom:14px}
body.mode-mobile .mr-grid{grid-template-columns:repeat(4,minmax(0,1fr))}

/* ===== v8.1 销售工作台整合（线索评分环小尺寸 / 产品图网格） ===== */
/* ① 评分环小尺寸：挂靠 .kpi-ring（L337-341），仅覆盖尺寸/内孔/字号；
   ::before 内孔 var(--surface) 与 conic-gradient（JS 内联语义色）继承基类，暗色安全 */
.kpi-ring.sm{width:64px;height:64px}
.kpi-ring.sm::before{inset:6px}
.kpi-ring.sm b{font-size:17px}
.kpi-ring.sm small{font-size:10px}
/* ② 产品图网格：网格密度仿 .donut-wrap .lg（L608），卡片/hover 仿 .emp-card（L625-635） */
.prod-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:12px}
.prod-card{border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface); cursor:pointer; display:flex; flex-direction:column; transition:transform .25s var(--bounce), box-shadow .25s, border-color .2s}
.prod-card:hover{border-color:var(--navy); box-shadow:0 8px 22px rgba(20,33,61,.14); transform:translateY(-2px)}
.prod-thumb{aspect-ratio:4/3; background:var(--bg); color:var(--muted); display:flex; align-items:center; justify-content:center; overflow:hidden}
.prod-thumb svg{width:28px; height:28px; stroke:currentColor; fill:none; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.prod-thumb img{width:100%; height:100%; object-fit:cover; display:block}
.prod-body{padding:11px 13px 12px; display:flex; flex-direction:column; gap:4px; min-width:0}
.prod-body b{font-size:13.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.prod-body .muted{font-size:11.5px}
body.mode-mobile .prod-grid{grid-template-columns:1fr 1fr; gap:9px}
@media (max-width:380px){ body.mode-mobile .prod-grid{grid-template-columns:1fr} }
/* ③ 联系方式白名单只读态（配合客户编辑 disabled） */
.field input:disabled,.field select:disabled,.field textarea:disabled{opacity:.6; cursor:not-allowed; background:var(--bg)}
/* ④ 灯杆客户金色标签（pill 原五态无 gold，与 wait 语义区分） */
.pill.gold{background:var(--gold-soft); color:var(--gold)}
/* ⑤ 查重合并对话框：保留客户选中态（color-mix 用法同 .record:hover L321） */
.mg-keep.on{border-color:var(--navy); background:color-mix(in srgb, var(--navy) 5%, var(--surface))}

/* ================= v8.2 今日工作台一屏化 + 四叶草待办 + 打卡菜单 ================= */
/* 打卡弹出菜单：按钮左下方、小巧卡片（v8.3 缩小+防裁切） */
#punchMenu{
  left:0; right:auto; top:calc(100% + 8px); width:168px; z-index:80;
  display:grid; grid-template-columns:1fr 1fr; gap:4px; padding:7px; border-radius:14px;
  transform-origin:top left; transform:scale(.85) translateY(-6px);
}
#punchMenu.open{ transform:scale(1) translateY(0) }
#punchMenu .pm-item{ flex-direction:column; gap:3px; padding:8px 4px 6px; border-radius:10px; font-size:10.5px; justify-content:center; text-align:center }
#punchMenu .pm-item svg{ width:15px; height:15px }

/* 速览三卡配色（今日待办 / 今日已跟进 / 本月成交） */
.hero-punch .stat.st-todo{ background:linear-gradient(150deg, var(--navy-soft), transparent 140%) }
.hero-punch .stat.st-follow{ background:linear-gradient(150deg, rgba(31,138,95,.14), transparent 140%) }
.hero-punch .stat.st-deal{ background:linear-gradient(150deg, var(--gold-soft), transparent 140%) }
.hero-punch .stat.st-todo b{ color:var(--accent-text) }
.hero-punch .stat.st-follow b{ color:var(--ok) }
.hero-punch .stat.st-deal b{ color:var(--gold) }

/* 四叶草四象限待办（桌面端） */
.clover{ display:grid; grid-template-columns:1.45fr 1fr; grid-template-rows:auto auto; gap:12px }
.clover .q1{ grid-row:1/3 }
.leaf{ padding:8px 12px 6px; border-radius:22px; min-height:78px; overflow:hidden; min-width:0 }
.leaf.q4{ background:var(--barbg) }
.leaf-h{ display:flex; align-items:center; gap:6px; margin-bottom:3px }
.leaf-h b{ font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.leaf-h i{ font-style:normal; color:var(--muted); font-size:11px; margin-left:auto }
.leaf-ic{ font-size:13px }
.leaf-item{ display:flex; align-items:center; gap:8px; padding:3px 6px; border-radius:10px; border-top:none }
.leaf-item:hover{ background:rgba(255,255,255,.55) }
body.dark .leaf-item:hover{ background:rgba(255,255,255,.06) }
.leaf-item .t{ min-width:0; flex:1; display:flex; align-items:baseline; gap:8px }
.leaf-item .t b{ font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100% }
.leaf-item .t span{ font-size:11px; flex:1; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:right }
.leaf-empty{ font-size:11.5px; padding:8px 6px }
.leaf-more{ font-size:11px; padding:3px 6px }
.leaf-fold{
  display:block; width:100%; margin-top:8px; padding:6px 12px; border-radius:12px; border:none; cursor:pointer;
  background:var(--barbg); color:var(--muted); font-size:11.5px; text-align:left;
}
.leaf-fold .fold-body{ margin-top:4px; display:flex; flex-direction:column; gap:2px }
.leaf-fold[hidden], .leaf-fold .fold-body[hidden]{ display:none }
.leaf-fold:hover .fold-t{ color:var(--body) }
.op-chip.mini{ min-width:22px; height:22px; min-height:0; padding:0 7px; border-radius:999px; font-size:11px }

/* 客户概览：五行紧凑列表（每行一个客户 + 设备/灯具标签） */
.ovr-list{ display:flex; flex-direction:column; margin-top:2px }
.cust-row.slim{ padding:7px 6px; gap:10px }
.cust-row.slim .t b{ font-size:13px; display:flex; align-items:center; gap:6px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.cust-row.slim .t span{ font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.cust-row .idx.hot{ background:var(--red); color:#fff }
.cust-row .idx.cool{ background:var(--gold-soft); color:var(--gold) }
.cat-tag{ font-style:normal; font-size:10px; font-weight:700; padding:1.5px 7px; border-radius:999px; background:var(--navy-soft); color:var(--accent-text); flex-shrink:0 }
.cat-tag.lamp{ background:var(--gold-soft); color:var(--gold) }

/* 桌面端今日工作台：标准/大窗舒适版（内容舒展、利用周边留白） */
body.mode-desktop #v-home .card{ padding:12px 20px }
body.mode-desktop #v-home .home-row{ margin-top:12px }
body.mode-desktop #v-home .home-row{ gap:20px }
body.mode-desktop #v-home .sec-t{ margin-top:10px }
body.mode-desktop #v-home .sec-t h3{ font-size:15px }
body.mode-desktop #v-home .todo{ padding:9px 6px }
body.mode-desktop #v-home .bar{ height:7px }
body.mode-desktop #v-home .prog-row{ margin-top:8px !important; font-size:12.5px }
body.mode-desktop .hero-punch{ gap:28px }
body.mode-desktop .hero-punch .stat{ padding:9px 8px }
body.mode-desktop .hero-notice{ padding:14px 16px }
body.mode-desktop .hero-notice .nl-body{ max-height:none }
body.mode-desktop .hero-notice .nl-item > div{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden }
body.mode-desktop #homeStats .stat b, body.mode-desktop #homeCrm .stat b{ font-size:22px }
body.mode-desktop #homeProg{ display:flex; flex-direction:column; justify-content:space-evenly }
body.mode-desktop #homeStats .stat, body.mode-desktop #homeCrm .stat{ padding:6px 8px }
body.mode-desktop #homeCrm .cust-row.slim{ padding:2px 8px }
body.mode-desktop #homeCrm .stats{ margin-bottom:8px }
body.mode-desktop .clover{ gap:12px }
.leaf .leaf-h i{ white-space:nowrap }
.sec-t #todoCount{ background:var(--navy-soft); color:var(--accent-text); font-weight:800; padding:1px 10px; border-radius:999px; font-size:11.5px }
body.mode-desktop .leaf{ min-height:56px; padding:8px 14px 6px }
body.mode-desktop #v-home .leaf-item{ padding:2px 8px }
body.mode-desktop .cust-row.slim .t b{ font-size:13.5px }
body.mode-desktop .cat-tag{ font-size:10.5px; padding:2px 8px }
body.mode-desktop .hero-punch .stats{ grid-template-columns:repeat(3, minmax(0,1fr)) }
body.mode-desktop .hero-punch .stat{ overflow:hidden }
body.mode-desktop .hero-punch .stat span{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; font-size:11.5px }

/* 矮窗（≤740px 视口高，含最小窗 1000×680）：紧凑版保一屏 */
@media (max-height:740px){
  body.mode-desktop main{ padding:14px 22px 14px }
  body.mode-desktop #v-home .card{ padding:10px 14px }
  body.mode-desktop #v-home .home-row{ margin-top:6px; gap:14px }
  body.mode-desktop #v-home .sec-t{ margin-top:5px }
  body.mode-desktop #v-home .sec-t h3{ font-size:14px }
  body.mode-desktop #v-home .todo{ padding:6px 4px }
  body.mode-desktop #v-home .bar{ height:5px }
  body.mode-desktop #v-home .prog-row{ margin-top:4px !important; font-size:11.5px }
  body.mode-desktop .hero-punch{ gap:18px }
  body.mode-desktop .hero-punch .stat{ padding:6px 6px }
  body.mode-desktop .hero-notice{ padding:8px 12px }
  body.mode-desktop .hero-notice .nl-item > div{ display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden }
  body.mode-desktop .hero-notice .nl-dots{ display:none }
  body.mode-desktop #homeStats .stat b, body.mode-desktop #homeCrm .stat b{ font-size:19px }
  body.mode-desktop #homeStats .stat, body.mode-desktop #homeCrm .stat{ padding:4px 6px }
  body.mode-desktop #homeCrm .cust-row.slim{ padding:2px 6px }
  body.mode-desktop #homeCrm .stats{ margin-bottom:4px }
  body.mode-desktop .clover{ gap:10px }
  body.mode-desktop .leaf{ min-height:44px; padding:6px 12px 4px }
  body.mode-desktop #v-home .leaf-item{ padding:2px 6px }
  body.mode-desktop #v-home .leaf-more{ display:none }   /* 矮窗：叶头已有 ×N 计数，省掉提示行 */
}

/* ================= v8.5/v8.6 首页二行改版：概览 70/30 · 三卡竖排 · 完成度五柱 ================= */
/* 客户概览卡：左侧竖排三张指标卡，右侧五行客户列表等分撑满（v8.6 卡片与字号整体缩小） */
body.mode-desktop #homeCrm{ display:flex; gap:14px; align-items:stretch }
body.mode-desktop #homeCrm .stats{ display:flex; flex-direction:column; gap:6px; width:118px; flex:none; margin-bottom:0 }
body.mode-desktop #homeCrm .stat{ padding:7px 6px; display:flex; flex-direction:column; justify-content:center }
body.mode-desktop #homeCrm .stat b{ font-size:18px }
body.mode-desktop #homeCrm .stat span{ font-size:10px; margin-top:1px }
body.mode-desktop #homeCrm .ovr-list{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px }
body.mode-desktop #homeCrm .ovr-list .todo{ flex:1; min-height:0; align-items:center; padding:1px 8px }
/* 第二行 70/30：客户概览(flex:7) | 本月完成度(flex:3)；上下留白收窄 */
body.mode-desktop #v-home .home-row{ margin-top:10px }
body.mode-desktop #v-home .home-row-2{ margin-top:8px; gap:16px }
body.mode-desktop #v-home .home-row-2 .sec-t{ margin-top:0 }
/* 本月完成度：竖向柱状图（复用 .vbars 体系）；v8.6 扩为五柱 */
#homeProg .vbars{ padding:0; flex:1; gap:10px }
#homeProg .vb label{ font-size:12px; color:var(--body) }
#homeProg .vb small{ font-size:10.5px; color:var(--muted); white-space:nowrap }
#homeProg .vb b.gold{ color:var(--gold) }
#homeProg .vb b.red{ color:var(--red) }
#homeProg .vb b.ok{ color:var(--ok) }
#homeProg .vb b.warn{ color:var(--warn) }
#homeProg .vb-track i.gold{ background:linear-gradient(180deg, var(--gold), #d9a518) }
#homeProg .vb-track i.red{ background:linear-gradient(180deg, var(--red), #c23a2e) }
#homeProg .vb-track i.ok{ background:linear-gradient(180deg, var(--ok), #177a53) }
#homeProg .vb-track i.warn{ background:linear-gradient(180deg, var(--warn), #b0651a) }
/* 今日待办：叶片行距加大、卡体加高；v8.6 超宽屏上限放宽 */
body.mode-desktop #v-home{ max-width:1600px }
body.mode-desktop .clover{ gap:12px }
body.mode-desktop .leaf{ min-height:60px }
body.mode-desktop #v-home .leaf-item{ padding:3px 8px }
body.mode-desktop .leaf-fold{ margin-top:10px }

/* 矮窗（≤740px 视口高）同步收紧 */
@media (max-height:740px){
  body.mode-desktop #v-home .home-row{ margin-top:6px }
  body.mode-desktop #v-home .home-row-2{ margin-top:8px; gap:14px }
  body.mode-desktop #homeCrm{ gap:10px }
  body.mode-desktop #homeCrm .stats{ width:102px; gap:4px }
  body.mode-desktop #homeCrm .stat{ padding:5px 5px }
  body.mode-desktop #homeCrm .stat b{ font-size:16px }
  body.mode-desktop #homeCrm .ovr-list{ gap:1.5px }
  body.mode-desktop #homeProg .vbars{ gap:4px }
  body.mode-desktop #homeProg .vb-track{ max-width:30px }
  body.mode-desktop #homeProg .vb small{ display:none }
  body.mode-desktop #homeProg .vb label{ font-size:10px; line-height:1.25; white-space:normal; max-width:100% }
  body.mode-desktop .clover{ gap:10px }
  body.mode-desktop .leaf{ min-height:52px }
  body.mode-desktop #v-home .leaf-item{ padding:3px 6px }
  body.mode-desktop .leaf-fold{ margin-top:6px }
}

/* ================= v8.7 今日待办卡高度 +20%（min-height 由 JS 设为自然高度 ×1.2） ================= */
body.mode-desktop #todoList{ display:flex; flex-direction:column }
body.mode-desktop #todoList .clover{ flex:1 1 auto; grid-template-rows:1fr auto }
body.mode-desktop #todoList .leaf{ display:flex; flex-direction:column; justify-content:flex-start }
body.mode-desktop #todoList .leaf-items{ flex:1; min-height:0; display:flex; flex-direction:column; justify-content:space-evenly }
body.mode-desktop #todoList .leaf-fold{ flex:none }
/* 一屏兜底：待办增高后行距微收（视觉不可感知） */
body.mode-desktop #v-home .home-row{ margin-top:8px }
body.mode-desktop #v-home .home-row-2{ margin-top:12px }
body.mode-desktop #v-home .home-row-2 .sec-t{ margin-bottom:8px }

/* ================= v8.8 叶头吸顶 · 行距自适应 · 二行标题留白 ================= */
/* 1) 叶头固定顶部：overflow:hidden 会禁用 sticky，改为 overflow:clip（不产生滚动容器，粘性仍指向 main） */
.leaf{ overflow:clip; --leaf-px:12px }
body.mode-desktop .leaf{ --leaf-px:14px }
.leaf-h{ position:sticky; top:0; z-index:5; margin:0 calc(-1*var(--leaf-px)) 2px; padding:2px var(--leaf-px) 2px }
.leaf.q1 .leaf-h{ background:color-mix(in srgb, var(--red-soft) 80%, var(--red) 14%) }
.leaf.q2 .leaf-h{ background:color-mix(in srgb, var(--gold-soft) 80%, var(--gold) 14%) }
.leaf.q3 .leaf-h{ background:color-mix(in srgb, var(--navy-soft) 80%, var(--navy) 14%) }
.leaf .leaf-h{ border-radius:20px 20px 0 0 }
/* 2) 行距随事项数自适应：≥4 项压缩、≤2 项放大（与卡片弹性填充 space-evenly 叠加） */
body.mode-desktop #todoList .leaf-items.dense .leaf-item{ padding-top:1px; padding-bottom:1px }
body.mode-desktop #todoList .leaf-items.sparse .leaf-item{ padding-top:5px; padding-bottom:5px }
/* 3) 二行标题（客户概览/本月完成度）与上方卡片间距增大 +8px（紧凑档 +4px）——margin 已在 v8.7 块内调整 */
@media (max-height:740px){
  body.mode-desktop #todoList .leaf-items.dense .leaf-item{ padding-top:1px; padding-bottom:1px }
  body.mode-desktop #todoList .leaf-items.sparse .leaf-item{ padding-top:5px; padding-bottom:5px }
}

/* ================= v9.0 浅色遮罩只覆盖内容区：叶卡去底色，色块下移至 .leaf-items ================= */
.leaf{ --leaf-pb:6px }
.leaf.q1 .leaf-items{ background:var(--red-soft) }
.leaf.q2 .leaf-items{ background:var(--gold-soft) }
.leaf.q3 .leaf-items{ background:var(--navy-soft) }
.leaf-items{ margin:0 calc(-1*var(--leaf-px)) calc(-1*var(--leaf-pb)); padding:0 var(--leaf-px) var(--leaf-pb); border-radius:0 0 22px 22px }
body.mode-desktop .leaf{ --leaf-pb:6px }
@media (max-height:740px){
  body.mode-desktop .leaf{ --leaf-pb:4px; --leaf-px:12px }
}

/* ================= v9.1 标题去色 · 内容色块改圆角矩形 ================= */
/* 标题条：去掉背景色与色条形态（负边距/上下内边距），恢复普通标题；sticky 吸顶保留 */
.leaf-h{ margin:0 0 3px !important; padding:0 !important; background:none !important }
.leaf .leaf-h{ border-radius:0 }
/* 内容区浅色块：位置尺寸不变，四角统一圆角矩形（沿用当前 22px 圆角） */
.leaf-items{ border-radius:22px }

/* ================= v8.6 客户档案：合规与数据治理折叠块 ================= */
.cust-comp{ margin:14px 0 16px; border:1px solid var(--line); border-radius:12px; background:var(--bg); overflow:hidden }
.cust-comp>summary{ cursor:pointer; list-style:none; padding:10px 14px; font-size:12.5px; font-weight:700; color:var(--body); display:flex; align-items:center; gap:8px }
.cust-comp>summary::-webkit-details-marker{ display:none }
.cust-comp>summary::after{ content:"▾"; margin-left:auto; color:var(--muted); font-size:11px; transition:transform .18s }
.cust-comp[open]>summary::after{ transform:rotate(180deg) }
.cust-comp[open]>summary{ border-bottom:1px solid var(--line); background:var(--surface) }
.cust-comp>summary:hover{ background:var(--surface) }
.cust-comp .field{ margin-bottom:14px }
.cust-comp .frow{ margin-bottom:4px }

/* ================= v8.6 档案完整度条（新建/编辑表单顶部实时提示） ================= */
.comp-bar{ margin:0 0 14px; padding:9px 12px; border:1px solid var(--line); border-radius:11px; background:var(--bg) }
.comp-bar-track{ height:6px; border-radius:999px; background:var(--line); overflow:hidden }
.comp-bar-track>i{ display:block; height:100%; border-radius:999px; background:var(--ok); transition:width .25s }
.comp-bar-txt{ display:flex; align-items:baseline; gap:10px; margin-top:7px; flex-wrap:wrap }
.comp-bar-txt b{ font-size:12.5px; font-weight:700; color:var(--body) }
.comp-bar-txt span{ font-size:11.5px; color:var(--muted) }

/* 详情页「档案完整度」卡可点：点开看还缺哪几项 */
.detail .kv .k.comp-bar-k{ cursor:pointer; transition:border-color .15s, background .15s }
.detail .kv .k.comp-bar-k:hover{ border-color:var(--navy); background:var(--surface) }

/* ================= v8.7 客户详情 ⇄ 新建客户 视觉统一 =================
   详情页的资料 / 指标 / 合规区改用与新建客户表单完全同一套构件：
     .frow  栅格（与表单一致，2 列 251px @560px 面板）
     .field 标签（12.5px / 700 / --body）
     .fval  只读值块（复刻 .field input 的框：13.5px / 8px 圆角 / 10×12 内距 / 白底）
   列数、行距、字号与表单完全对齐；全局 .kv / .blk 不动，避免波及其他视图。 */
.fval{
  width:100%; min-width:0; min-height:41px;
  display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px;
  border:1px solid var(--line-d); border-radius:8px; padding:10px 12px;
  font-size:13.5px; line-height:1.55; color:var(--ink); background:var(--surface);   /* 文字色对齐 app.css:69 input,select,textarea{color:var(--ink)} */
  word-break:break-word;
}
.fval:empty::before{ content:"—"; color:var(--muted) }
.fval .fval-sub{ font-size:11.5px; font-weight:400; color:var(--muted); line-height:1.5 }
.fval .fval-num{ font-weight:700 }
.fval .pill{ flex:none }

/* 详情页栅格轨道与新建客户表单对齐：
   表单的 .frow 靠 input 的固有宽度撑成 2 列 251px（@560px 面板 / 512px 内容宽），
   详情页的值块无固有宽度，需显式指定轨道下限才能得到同样的 2 列 251px。
   移动端（内容宽 ~358px）两者都自动落到 1 列。 */
.detail .frow{ grid-template-columns:repeat(auto-fit,minmax(230px,1fr)) }

/* 详情页内部分组标题：与表单 label 同层级（12.5px/700），替代原先无字号的 .blk-t */
.detail .blk-t{ font-size:12.5px; font-weight:700; color:var(--body); margin:18px 0 10px; letter-spacing:0 }
.detail .blk-t .t-ic{ font-size:12px; margin-right:5px }
/* 详情页内的分区标题（跟进历史）同样降到表单层级 */
.detail .sec-t{ margin:20px 2px 10px }
.detail .sec-t h3{ font-size:12.5px; font-weight:700; font-family:inherit }
.detail .sec-t h3::after{ width:22px; height:2px; margin-left:8px }

/* 详情页长文本块（客户概况 / 需求备注 / 红旗信号）：与 .fval 同款框 */
.detail .blk{ background:var(--surface); border:1px solid var(--line-d); border-radius:8px; padding:10px 12px; font-size:13.5px; line-height:1.7; color:var(--body); margin-bottom:14px }
.detail .blk small{ display:block; font-size:12.5px; font-weight:700; color:var(--body); letter-spacing:0; margin-bottom:7px }

/* 详情页「档案完整度」值块可点：点开看还缺哪几项 */
.detail .fval.comp-bar-k{ cursor:pointer; transition:border-color .15s, box-shadow .15s }
.detail .fval.comp-bar-k:hover{ border-color:var(--navy); box-shadow:0 0 0 3px rgba(22,50,92,.10) }