/* 销售管理云 CRM：靛紫品牌色 + 深色侧栏 */
:root {
  --primary: #5b5bd6; --primary-hover: #7070e0; --primary-active: #4848c4;
  --primary-1: #f1f1fd; --primary-2: #e3e3fb; --primary-3: #c5c5f5;
  --bg: #f4f5fa; --side: #17173a; --side-2: #22224d; --side-text: #a9abcf;
  --radius: 10px;
}
body { overflow: hidden; }
.shell { display: flex; height: 100vh; }
.side { width: 224px; flex-shrink: 0; background: var(--side); color: var(--side-text); display: flex; flex-direction: column; position: relative; z-index: 20; background-image: radial-gradient(120% 60% at 0% 0%, rgba(124, 124, 242, .18), transparent 60%); }
.brand { display: flex; align-items: center; gap: 10px; padding: 18px 18px 14px; }
.brand-logo { display: flex; }
.brand-text b { display: block; color: #fff; font-size: 16px; letter-spacing: .5px; }
.brand-text small { display: block; font-size: 11px; color: #7d80ad; letter-spacing: .5px; margin-top: -1px; }
.nav { flex: 1; overflow: auto; padding: 8px 12px; }
.nav-group { font-size: 11px; color: #6b6e98; padding: 14px 10px 6px; letter-spacing: 1px; }
.nav-item { display: flex; align-items: center; gap: 10px; height: 40px; padding: 0 12px; border-radius: 8px; color: var(--side-text); font-size: 14px; margin-bottom: 2px; transition: all .15s; position: relative; }
.nav-item:hover { background: rgba(255, 255, 255, .06); color: #fff; }
.nav-item.active { background: linear-gradient(90deg, #5b5bd6, #6d5fe0); color: #fff; box-shadow: 0 6px 16px rgba(91, 91, 214, .35); }
.nav-item .badge-count { margin-left: auto; background: #f0445a; }
.nav-item.active .badge-count { background: rgba(255, 255, 255, .25); }
.side-foot { padding: 14px; }
.side-plan { background: var(--side-2); border-radius: 10px; padding: 12px 14px; font-size: 12px; }
.side-plan span { color: #8a8db8; }
.side-plan b { float: right; color: #fff; font-weight: 600; }
.side-plan .progress { margin-top: 10px; background: rgba(255, 255, 255, .1); height: 5px; }
.side-plan .progress i { background: linear-gradient(90deg, #8f8ff5, #22c3e6); }

.main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topbar { height: 56px; background: #fff; border-bottom: 1px solid var(--border-2); display: flex; align-items: center; gap: 16px; padding: 0 20px; flex-shrink: 0; }
.menu-toggle { display: none; }
.crumb { font-size: 14px; color: var(--text-3); display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.crumb b { color: var(--text); font-weight: 500; }
.crumb a { color: var(--text-3); } .crumb a:hover { color: var(--primary); }
.top-search { position: relative; margin-left: auto; width: 300px; }
.top-search .input { background: var(--fill); border-color: transparent; padding-left: 34px; height: 34px; border-radius: 17px; }
.top-search .input:focus { background: #fff; }
.ts-ic { position: absolute; left: 12px; top: 9px; color: var(--text-3); display: flex; }
.top-search kbd { position: absolute; right: 10px; top: 8px; font-size: 11px; color: var(--text-3); border: 1px solid var(--border); border-radius: 4px; padding: 0 5px; background: #fff; line-height: 16px; font-family: inherit; }
.ts-drop { position: absolute; top: 40px; left: 0; right: 0; background: #fff; border-radius: 10px; box-shadow: var(--shadow-lg); padding: 6px; display: none; z-index: 50; max-height: 360px; overflow: auto; }
.ts-drop.show { display: block; }
.ts-item { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 6px; cursor: pointer; }
.ts-item:hover, .ts-item.hl { background: var(--primary-1); }
.ts-item .t { font-size: 13px; color: var(--text); }
.ts-item .s { font-size: 12px; color: var(--text-3); }
.ts-item mark { background: none; color: var(--primary); font-weight: 600; }
.top-actions { display: flex; align-items: center; gap: 8px; }
.has-dot { position: relative; }
.has-dot::after { content: ""; position: absolute; top: 7px; right: 8px; width: 7px; height: 7px; border-radius: 50%; background: #f0445a; border: 1.5px solid #fff; }
.me { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-radius: 18px; cursor: pointer; position: relative; }
.me:hover { background: var(--fill); }
.me .n { font-size: 13px; line-height: 1.2; } .me .r { font-size: 11px; color: var(--text-3); }
.pop { position: absolute; top: 46px; right: 0; background: #fff; border-radius: 10px; box-shadow: var(--shadow-lg); padding: 6px; min-width: 180px; z-index: 60; display: none; }
.pop.show { display: block; animation: toastIn .18s; }
.pop-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 6px; font-size: 13px; color: var(--text-2); cursor: pointer; white-space: nowrap; }
.pop-item:hover { background: var(--fill); color: var(--text); }
.notice-pop { width: 340px; padding: 0; }
.notice-pop .hd { padding: 12px 16px; border-bottom: 1px solid var(--border-2); font-weight: 600; display: flex; }
.notice-pop .it { padding: 12px 16px; border-bottom: 1px solid var(--border-2); font-size: 13px; cursor: pointer; display: flex; gap: 10px; }
.notice-pop .it:hover { background: var(--fill); }
.notice-pop .it:last-child { border-bottom: 0; }

.main-scroll { flex: 1; overflow: auto; }
.page { padding: 20px 24px 48px; max-width: 1560px; margin: 0 auto; }
.page-head { display: flex; align-items: flex-end; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.page-head h1 { font-size: 20px; }
.page-head .desc-text { color: var(--text-3); font-size: 13px; margin-top: 4px; }
.page-head .actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }

/* 工作台 */
.hello { display: flex; align-items: center; gap: 16px; padding: 20px 24px; border-radius: 14px; background: linear-gradient(115deg, #5b5bd6 0%, #6f5fe3 55%, #3aa0e8 130%); color: #fff; margin-bottom: 16px; position: relative; overflow: hidden; }
.hello::after { content: ""; position: absolute; right: -40px; top: -60px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255, 255, 255, .08); }
.hello::before { content: ""; position: absolute; right: 140px; bottom: -90px; width: 180px; height: 180px; border-radius: 50%; background: rgba(255, 255, 255, .06); }
.hello h2 { font-size: 20px; font-weight: 600; }
.hello p { opacity: .85; font-size: 13px; margin-top: 4px; }
.hello .quick { margin-left: auto; display: flex; gap: 10px; position: relative; z-index: 1; flex-wrap: wrap; }
.quick-btn { display: flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 8px; background: rgba(255, 255, 255, .16); color: #fff; border: 1px solid rgba(255, 255, 255, .22); cursor: pointer; font-size: 13px; transition: all .15s; backdrop-filter: blur(4px); }
.quick-btn:hover { background: rgba(255, 255, 255, .28); }
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.kpi { padding: 18px 20px; position: relative; overflow: hidden; }
.kpi .k-hd { display: flex; align-items: center; gap: 8px; color: var(--text-2); font-size: 13px; }
.kpi .k-ic { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.kpi .k-val { font-size: 26px; font-weight: 600; margin-top: 12px; letter-spacing: -.5px; line-height: 1.2; }
.kpi .k-val small { font-size: 13px; font-weight: 400; color: var(--text-3); margin-left: 4px; }
.kpi .k-ft { font-size: 12px; color: var(--text-3); margin-top: 6px; display: flex; gap: 6px; align-items: center; }
.trend-up { color: #00a870; } .trend-down { color: #e5484d; }
.kpi .spark { position: absolute; right: 12px; bottom: 12px; width: 96px; height: 40px; }
.grid-3 { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.grid-2 { display: grid; grid-template-columns: 1.6fr 1fr; gap: 16px; margin-bottom: 16px; }
.goal-wrap { display: flex; align-items: center; gap: 16px; }
.goal-ring { width: 150px; height: 150px; flex-shrink: 0; }
.goal-meta .big { font-size: 22px; font-weight: 600; }
.goal-meta .lbl { font-size: 12px; color: var(--text-3); }
.goal-meta > div + div { margin-top: 10px; }
.rep-goal { display: grid; grid-template-columns: 64px 1fr 44px; gap: 10px; align-items: center; font-size: 13px; padding: 6px 0; }
.rep-goal .pct { text-align: right; color: var(--text-2); font-size: 12px; }
.todo { display: flex; align-items: center; gap: 12px; padding: 11px 20px; border-bottom: 1px solid var(--border-2); cursor: pointer; transition: background .12s; }
.todo:hover { background: var(--fill); }
.todo:last-child { border-bottom: 0; }
.todo .t { font-size: 13px; font-weight: 500; }
.todo .s { font-size: 12px; color: var(--text-3); margin-top: 1px; }
.todo .due { font-size: 12px; white-space: nowrap; }
.todo .done-btn { opacity: 0; transition: opacity .15s; }
.todo:hover .done-btn { opacity: 1; }
.rank { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 13px; }
.rank-no { width: 20px; height: 20px; border-radius: 6px; font-size: 12px; display: flex; align-items: center; justify-content: center; background: var(--fill); color: var(--text-3); font-weight: 600; }
.rank-no.r1 { background: #fff1d6; color: #d48806; } .rank-no.r2 { background: #eef0f4; color: #707a8a; } .rank-no.r3 { background: #fbe9dd; color: #c2692d; }
.feed { padding: 4px 20px 12px; }
.feed-item { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px dashed var(--border-2); font-size: 13px; }
.feed-item:last-child { border-bottom: 0; }
.feed-item .ft { color: var(--text-3); font-size: 12px; margin-top: 2px; }

/* 客户 */
.stat-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--border-2); padding: 0 8px; overflow-x: auto; }
.stat-tab { padding: 14px 16px 12px; cursor: pointer; border: 0; background: none; text-align: left; position: relative; min-width: 110px; }
.stat-tab .l { font-size: 13px; color: var(--text-2); }
.stat-tab .v { font-size: 20px; font-weight: 600; margin-top: 2px; color: var(--text); }
.stat-tab.active .l { color: var(--primary); }
.stat-tab.active .v { color: var(--primary); }
.stat-tab.active::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: -1px; height: 2px; background: var(--primary); }
.cust-name { display: flex; align-items: center; gap: 10px; }
.cust-logo { width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 13px; font-weight: 600; flex-shrink: 0; }
.level { display: inline-flex; width: 20px; height: 20px; border-radius: 5px; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; }
.level-A { background: #fff1e6; color: #e8590c; } .level-B { background: var(--primary-1); color: var(--primary); } .level-C { background: #f1f3f5; color: #868e96; }
.batch-bar { display: none; align-items: center; gap: 10px; padding: 8px 16px; background: var(--primary-1); border-top: 1px solid var(--primary-2); font-size: 13px; }
.batch-bar.show { display: flex; }

/* 详情 */
.detail-hd { padding: 20px 24px; display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; }
.detail-hd .cust-logo { width: 52px; height: 52px; font-size: 20px; border-radius: 12px; }
.detail-hd h1 { font-size: 20px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.detail-hd .meta { display: flex; gap: 20px; margin-top: 8px; font-size: 13px; color: var(--text-2); flex-wrap: wrap; }
.detail-hd .meta span { display: flex; align-items: center; gap: 5px; }
.detail-hd .actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; }
.stage-bar { display: flex; margin: 0 24px 20px; gap: 4px; }
.stage-step { flex: 1; height: 34px; display: flex; align-items: center; justify-content: center; font-size: 13px; background: var(--fill); color: var(--text-3); position: relative; clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%, 12px 50%); cursor: pointer; transition: all .15s; }
.stage-step:first-child { clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 0 100%); border-radius: 6px 0 0 6px; }
.stage-step:hover { background: var(--primary-2); color: var(--primary); }
.stage-step.done { background: var(--primary-2); color: var(--primary); }
.stage-step.cur { background: var(--primary); color: #fff; font-weight: 500; }
.stage-step.lost { background: #fde2e2; color: #d7372f; }
.detail-grid { display: grid; grid-template-columns: 1fr 340px; gap: 16px; }
.mini-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border-2); border-radius: 8px; overflow: hidden; }
.mini-stats > div { background: #fff; padding: 12px; text-align: center; }
.mini-stats b { display: block; font-size: 18px; }
.mini-stats span { font-size: 12px; color: var(--text-3); }
.fu-form { border: 1px solid var(--border); border-radius: 10px; padding: 12px; margin-bottom: 20px; transition: border-color .15s, box-shadow .15s; }
.fu-form:focus-within { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-2); }
.fu-form textarea { border: 0; width: 100%; resize: none; outline: none; min-height: 64px; line-height: 1.6; }
.fu-form .field { margin: 0; }
.fu-form .row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.fu-form .row .select, .fu-form .row .input { width: auto; height: 30px; font-size: 13px; }
.fu-type { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; padding: 1px 8px; border-radius: 10px; background: var(--fill); color: var(--text-2); }
.contact-card { display: flex; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border-2); font-size: 13px; }
.contact-card:last-child { border-bottom: 0; }

/* 看板 */
.kanban { display: grid; grid-template-columns: repeat(6, minmax(248px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 8px; align-items: start; }
.kb-col { background: #eceef6; border-radius: 12px; display: flex; flex-direction: column; max-height: calc(100vh - 230px); min-height: 300px; transition: background .15s, box-shadow .15s; }
.kb-col.drag-over { background: var(--primary-2); box-shadow: inset 0 0 0 2px var(--primary); }
.kb-hd { padding: 12px 14px 10px; }
.kb-hd .t { display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 14px; }
.kb-hd .t i { width: 8px; height: 8px; border-radius: 50%; }
.kb-hd .t .cnt { font-weight: 400; color: var(--text-3); font-size: 12px; background: #fff; padding: 0 7px; border-radius: 9px; }
.kb-hd .sum { font-size: 12px; color: var(--text-3); margin-top: 4px; display: flex; justify-content: space-between; }
.kb-hd .bar { height: 3px; border-radius: 2px; margin-top: 8px; }
.kb-list { padding: 0 10px 10px; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 8px; min-height: 60px; }
.kb-card { background: #fff; border-radius: 10px; padding: 12px; box-shadow: 0 1px 2px rgba(15, 23, 42, .06); cursor: grab; border: 1px solid transparent; transition: box-shadow .15s, border-color .15s, transform .15s; user-select: none; }
.kb-card:hover { border-color: var(--primary-3); box-shadow: 0 4px 12px rgba(91, 91, 214, .12); }
.kb-card.dragging { opacity: .45; transform: rotate(1.5deg); }
.kb-card .n { font-size: 13px; font-weight: 500; line-height: 1.45; }
.kb-card .c { font-size: 12px; color: var(--text-3); margin-top: 4px; }
.kb-card .amt { font-size: 16px; font-weight: 600; margin-top: 8px; color: var(--text); }
.kb-card .ft { display: flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 12px; color: var(--text-3); }
.kb-card .ft .ml-auto { display: flex; align-items: center; gap: 4px; }
.kb-card .overdue { color: var(--danger); }
.kb-empty { text-align: center; color: var(--text-4); font-size: 12px; padding: 24px 0; border: 1px dashed #d5d8e3; border-radius: 10px; }
.kb-placeholder { height: 4px; border-radius: 2px; background: var(--primary); margin: -2px 0; }
.kb-summary { display: flex; gap: 28px; align-items: center; flex-wrap: wrap; }
.kb-summary .it .l { font-size: 12px; color: var(--text-3); } .kb-summary .it .v { font-size: 18px; font-weight: 600; }

/* 合同 */
.money-strip { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 16px; }
.money-strip .card { padding: 16px 20px; }
.money-strip .l { font-size: 13px; color: var(--text-2); display: flex; align-items: center; gap: 6px; }
.money-strip .v { font-size: 22px; font-weight: 600; margin-top: 6px; }
.money-strip .v small { font-size: 12px; font-weight: 400; color: var(--text-3); }
.money-strip .s { font-size: 12px; color: var(--text-3); margin-top: 4px; }
.pay-row { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 12px 14px; border: 1px solid var(--border-2); border-radius: 8px; margin-bottom: 8px; align-items: center; }
.pay-row .t { font-weight: 500; font-size: 13px; display: flex; gap: 8px; align-items: center; }
.pay-row .s { font-size: 12px; color: var(--text-3); margin-top: 2px; }

/* 报表 */
.chart { width: 100%; height: 300px; }
.chart-lg { height: 340px; }
.chart-sm { height: 260px; }

@media (max-width: 1280px) {
  .grid-3 { grid-template-columns: 1fr 1fr; }
  .grid-3 > :first-child { grid-column: span 2; }
}
@media (max-width: 1080px) {
  .kpis, .money-strip { grid-template-columns: 1fr 1fr; }
  .grid-2, .detail-grid { grid-template-columns: 1fr; }
  .top-search { width: 220px; }
}
@media (max-width: 860px) {
  .side { position: fixed; left: 0; top: 0; bottom: 0; transform: translateX(-100%); transition: transform .25s; }
  .shell.side-open .side { transform: none; }
  .shell.side-open + .side-mask { display: block; }
  .side-mask { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, .4); z-index: 15; }
  .menu-toggle { display: inline-flex; }
  .grid-3 { grid-template-columns: 1fr; } .grid-3 > :first-child { grid-column: auto; }
  .top-search { display: none; }
  .me .n, .me .r { display: none; }
  .crumb { margin-right: auto; }
}
@media (max-width: 560px) {
  .page { padding: 14px 12px 48px; }
  .kpis, .money-strip { grid-template-columns: 1fr 1fr; gap: 10px; }
  .kpi .spark { display: none; }
  .kpi .k-val { font-size: 20px; }
  .hello { flex-direction: column; align-items: flex-start; }
  .hello .quick { margin-left: 0; }
  .goal-wrap { flex-direction: column; align-items: flex-start; }
  .stage-bar { margin: 0 12px 16px; } .stage-step { font-size: 11px; }
  .detail-hd { padding: 16px; }
  .detail-hd .actions { margin-left: 0; }
}
.row-danger td:first-child{box-shadow:inset 3px 0 0 var(--danger);}

/* 窄屏：数据表改为卡片（每行一张，左侧字段名），不在容器内横向滑动 */
@media (max-width:640px){
  .dt-scroll{overflow:visible}
  .dt-scroll>.table,.dt-scroll>.table>tbody{display:block;width:100%;min-width:0}
  .dt-scroll>.table>thead{display:none}
  .dt-scroll>.table tr.dr{display:block;padding:10px 14px;border-bottom:1px solid var(--border-2,#eef0f3)}
  .dt-scroll>.table tr.dr>td{display:block;padding:3px 0;border:0;white-space:normal;text-align:right;min-height:24px;background:none}
  .dt-scroll>.table tr.dr>td::before{content:attr(data-l);float:left;margin-right:12px;color:var(--text-3,#98a2b3);font-size:12px;text-align:left}
  .dt-scroll>.table tr.dr>td.c-first{display:block;text-align:left;padding-bottom:6px}
  .dt-scroll>.table tr.dr>td.c-first::before,.dt-scroll>.table tr.dr>td.c-op::before,.dt-scroll>.table tr.dr>td[data-l=""]::before{display:none}
  .dt-scroll>.table tr.dr>td.c-op{text-align:right;padding-top:6px}
  .dt-scroll>.table tr.dr>td.col-check{display:none}
  .dt-scroll>.table tr.dr>td>*{min-width:0}
}

@media (max-width:640px){.dt-scroll>.table tr.dr>td::after{content:'';display:table;clear:both}}
@media (max-width: 560px) {
  .stat-tabs { display: grid; grid-template-columns: repeat(5, 1fr); padding: 0 4px; overflow: visible; }
  .stat-tab { min-width: 0; padding: 12px 2px 10px; text-align: center; }
  .stat-tab .l { font-size: 12px; white-space: nowrap; }
  .stat-tab .v { font-size: 17px; }
  .stat-tab.active::after { left: 10px; right: 10px; }
}

/* 日期框（text 显示，聚焦切换为日期选择器） */
.input[data-date] { width: 140px; padding-right: 30px; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238a8fa3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") no-repeat right 9px center; font-variant-numeric: tabular-nums; }
.fu-form .row .input[data-date] { width: 140px; }
.input[data-date][type=date] { background-image: none; padding-right: 8px; }

/* 商机看板：宽屏下首屏正好放下五列（初步接洽→赢单），输单列在右侧滚动查看，不出现半截的列 */
@media (min-width: 1280px) { .kanban { grid-template-columns: repeat(6, calc((100% - 48px) / 5)); } }

/* 「在线体验」标记：桌面放在侧栏底部空白处（本月目标卡片上方），窄屏挂在顶栏下沿右侧，不压正文 */
@media (min-width: 861px) {
  .demo-badge { left: 14px; right: auto; bottom: 102px; background: rgba(255, 255, 255, .06); color: rgba(220, 222, 245, .55); border-color: rgba(255, 255, 255, .1); box-shadow: none; backdrop-filter: none; font-size: 11.5px; }
}
@media (max-width: 860px) {
  .demo-badge { top: 56px; bottom: auto; right: 12px; font-size: 10px; line-height: 15px; padding: 0 8px; border-radius: 0 0 6px 6px; border-top: 0; box-shadow: none; background: rgba(255, 255, 255, .96); z-index: 19; letter-spacing: .3px; }
}
.hello p, .page-hd p, .tl-content { text-wrap: pretty; }
@media (max-width: 560px) {
  .hello .quick { display: grid; grid-template-columns: 1fr 1fr; width: 100%; gap: 8px; }
  .hello .quick .quick-btn { justify-content: center; }
  .kpi { padding: 16px 14px; }
  .kpi .k-hd { gap: 6px; white-space: nowrap; font-size: 12.5px; }
  .kpi .k-ic { width: 26px; height: 26px; }
}
