:root{
  --bg:#eef1f7; --surface:#fff; --line:#e4e8f0; --line-soft:#eef1f6;
  --ink:#0f1830; --ink-2:#4a5670; --ink-3:#8791a6;
  --accent:#2b57ea; --accent-soft:#eaefff;
  --danger:#d92d3f; --danger-soft:#fdeef0;
  --warn:#b7791f; --warn-soft:#fff6e3;
  --ok:#0d8f60; --ok-soft:#e8f7f0;
  --nav:#0d1526;
  --shadow:0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.05);
  --shadow-lg:0 18px 40px rgba(16,24,40,.16);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:"Segoe UI","Segoe UI Variable Text",system-ui,-apple-system,sans-serif;
  background:var(--bg);color:var(--ink);font-size:13px;display:flex;overflow:hidden;
  -webkit-font-smoothing:antialiased;
}
svg{display:block}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
button{cursor:pointer;border:none;background:none}
a{color:inherit;text-decoration:none}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#cfd6e4;border-radius:8px;border:3px solid var(--bg)}
::-webkit-scrollbar-track{background:transparent}

/* ============ SIDEBAR ============ */
.sidebar{width:236px;flex:0 0 236px;background:var(--nav);color:#c9d1e0;display:flex;flex-direction:column;padding:20px 14px 14px;position:relative;z-index:5}
.sidebar:before{content:"";position:absolute;inset:0;background:radial-gradient(120% 55% at 0% 0%,rgba(43,87,234,.3),transparent 60%);pointer-events:none}
.brand{display:flex;align-items:center;gap:10px;padding:0 8px 20px;position:relative;z-index:1}
.brand-mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(150deg,#4d7bff,#1d3ec9);display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(43,87,234,.45)}
.brand-name{font-size:16px;font-weight:600;color:#fff;letter-spacing:.2px;line-height:1.1}
.brand-sub{font-size:10.5px;color:#7d89a3;letter-spacing:.4px;text-transform:uppercase;margin-top:2px}
.nav{position:relative;z-index:1;display:flex;flex-direction:column;gap:2px}
.nav-label{font-size:10px;letter-spacing:.9px;text-transform:uppercase;color:#5c6883;padding:14px 10px 8px;font-weight:600}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:9px;color:#aab5ca;font-size:13px;font-weight:500;position:relative;transition:background .12s}
.nav-item:hover{background:#161f33}
.nav-item svg{width:17px;height:17px;stroke:#8d99b0;stroke-width:1.6;fill:none;flex:0 0 17px}
.nav-item .badge{margin-left:auto;font-size:10.5px;font-weight:600;background:#243149;color:#cbd5e8;padding:2px 6px;border-radius:20px}
.nav-item.active{background:linear-gradient(90deg,rgba(77,123,255,.22),rgba(77,123,255,.06));color:#fff}
.nav-item.active svg{stroke:#8fb0ff}
.nav-item.active:before{content:"";position:absolute;left:-14px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:#4d7bff}
.nav-item.active .badge{background:#2b57ea;color:#fff}
.side-bottom{margin-top:auto;position:relative;z-index:1}
.rate-card{background:#151f34;border:1px solid #212d45;border-radius:12px;padding:11px 12px;margin-bottom:10px;cursor:pointer}
.rate-card:hover{border-color:#2f3f5f}
.rate-card .lbl{font-size:10px;letter-spacing:.7px;text-transform:uppercase;color:#6d7a94;font-weight:600}
.rate-val{display:flex;align-items:baseline;gap:6px;margin-top:4px}
.rate-val b{font-size:17px;color:#fff;font-weight:600}
.rate-val span{font-size:11px;color:#7d89a3}
.rate-meta{font-size:10.5px;color:#6d7a94;margin-top:3px;display:flex;align-items:center;gap:5px}
.user{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:10px;background:#131c2e;cursor:pointer;position:relative}
.user:hover{background:#182238}
.user .chev{margin-left:auto;width:13px;height:13px;stroke:#5c6883;stroke-width:2;fill:none;flex:0 0 13px}
.user-name{font-size:12.5px;color:#e6ebf5;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.user-role{font-size:10.5px;color:#6d7a94;white-space:nowrap}
.ava{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:#fff;flex:0 0 30px;letter-spacing:.2px}

/* ============ MAIN ============ */
.main{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg)}
.topbar{height:58px;flex:0 0 58px;background:var(--surface);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px;padding:0 22px;z-index:4}
.crumbs{font-size:12px;color:var(--ink-3);display:flex;align-items:center;gap:7px;white-space:nowrap}
.crumbs b{color:var(--ink-2);font-weight:500}
.search{flex:0 1 320px;height:34px;border:1px solid var(--line);border-radius:9px;display:flex;align-items:center;gap:8px;padding:0 11px;background:#fafbfd}
.search svg{width:15px;height:15px;stroke:#98a2b3;stroke-width:1.8;fill:none;flex:0 0 15px}
.search input{border:none;outline:none;background:none;flex:1;font-size:12.5px}
.search input::placeholder{color:#98a2b3}
.top-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.rate-pill{display:flex;align-items:center;gap:8px;height:34px;padding:0 11px;border-radius:9px;background:#f5f7fb;border:1px solid var(--line);font-size:12.5px;cursor:pointer}
.rate-pill svg{width:14px;height:14px;stroke:#8791a6;stroke-width:1.7;fill:none}
.rate-pill b{font-weight:600}
.rate-pill i{font-style:normal;font-size:11px;color:var(--ink-3)}
.rate-pill .edit{color:var(--accent);font-size:11.5px;font-weight:600}
.btn-primary{height:34px;padding:0 14px;border-radius:9px;background:var(--accent);color:#fff;font-size:12.5px;font-weight:600;display:flex;align-items:center;gap:7px;box-shadow:0 1px 2px rgba(43,87,234,.35)}
.btn-primary:hover{background:#1e47cf}
.btn-primary svg{width:14px;height:14px;stroke:#fff;stroke-width:2.2;fill:none}
.btn{height:32px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:#fff;font-size:12.5px;font-weight:600;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:hover{background:#f7f9fc}
.btn svg{width:14px;height:14px;stroke:currentColor;stroke-width:1.9;fill:none}
.btn.sm{height:28px;font-size:11.5px;padding:0 9px;border-radius:7px}
.btn.danger{color:#b02a38;border-color:#f0c4ca;background:#fdf1f2}
.btn.ghost{border-color:transparent;background:transparent}
.btn:disabled{opacity:.55;cursor:not-allowed}

.view{flex:1;overflow:auto;min-height:0}
.view-inner{padding:18px 22px 26px;min-width:0}

/* head */
.pagehead{display:flex;align-items:flex-start;gap:18px;margin-bottom:14px;flex-wrap:wrap}
.pagehead h1{font-size:21px;font-weight:600;letter-spacing:-.2px;display:flex;align-items:center;gap:9px}
.pagehead .sub{font-size:12.5px;color:var(--ink-3);margin-top:5px}
.head-actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.kpis{display:flex;border-left:1px solid var(--line);margin-left:8px}
.kpi{padding:0 16px;border-right:1px solid var(--line)}
.kpi:last-child{border-right:none;padding-right:0}
.kpi .k{font-size:10px;color:var(--ink-3);letter-spacing:.3px;text-transform:uppercase;font-weight:600;white-space:nowrap}
.kpi .v{font-size:17px;font-weight:600;margin-top:3px;display:flex;align-items:baseline;gap:5px;white-space:nowrap}
.kpi .v small{font-size:11px;font-weight:500;color:var(--ok)}
.kpi .v .neg{color:var(--danger)}

/* filters */
.filters{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.fchip{height:32px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:#fff;display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-2);font-weight:500;box-shadow:0 1px 1px rgba(16,24,40,.03)}
.fchip:hover{background:#f7f9fc}
.fchip svg{width:14px;height:14px;stroke:#8791a6;stroke-width:1.8;fill:none}
.fchip b{color:var(--ink);font-weight:600}
.fchip.on{background:var(--accent-soft);border-color:#c9d6ff;color:var(--accent)}
.fchip.on svg{stroke:var(--accent)}
.fchip .cnt{font-size:10.5px;font-weight:700;background:var(--danger);color:#fff;border-radius:20px;padding:1px 6px}
.fspacer{margin-left:auto}
.legend{display:flex;align-items:center;gap:14px;font-size:11.5px;color:var(--ink-3)}
.legend i{display:flex;align-items:center;gap:5px;font-style:normal;white-space:nowrap}
.legend .sq{width:8px;height:8px;border-radius:2px}

/* ============ BOARD ============ */
.board{display:flex;gap:12px;align-items:flex-start;padding-bottom:8px;min-height:calc(100vh - 260px)}
.col{width:286px;flex:0 0 286px;display:flex;flex-direction:column;gap:8px}
.col-head{background:#fff;border:1px solid var(--line);border-radius:11px;padding:8px 10px;display:flex;flex-direction:column;gap:4px;box-shadow:var(--shadow);position:sticky;top:0;z-index:2}
.col-top{display:flex;align-items:center;gap:7px}
.col-dot{width:7px;height:7px;border-radius:50%;flex:0 0 7px}
.col-name{font-size:12px;font-weight:600;letter-spacing:-.1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.col-count{font-size:11px;font-weight:600;color:var(--ink-3);background:#f1f4f9;border-radius:20px;padding:1px 6px}
.col-add{margin-left:auto;width:20px;height:20px;border-radius:6px;display:flex;align-items:center;justify-content:center;color:#98a2b3}
.col-add:hover{background:#f1f4f9;color:var(--ink)}
.col-add svg{width:13px;height:13px;stroke:currentColor;stroke-width:2;fill:none}
.col-meta{display:flex;align-items:center;gap:6px;font-size:10.5px;color:var(--ink-3);white-space:nowrap}
.col-meta b{color:var(--ink-2);font-weight:600}
.col-meta .sla{background:#f4f6fa;border-radius:5px;padding:1px 6px;font-size:10px;font-weight:600;color:#6b768d}
.cards{display:flex;flex-direction:column;gap:8px;min-height:60px;border-radius:10px;transition:background .12s}
.cards.dragover{background:#e3e9fb;outline:2px dashed #b9c7f5;outline-offset:3px}
.col.locked .col-head{background:linear-gradient(180deg,#fff,#fbfcff);border-color:#d5deef}

.card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 10px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:6px;cursor:grab;transition:box-shadow .12s, transform .12s}
.card:hover{box-shadow:0 6px 18px rgba(16,24,40,.1)}
.card.dragging{opacity:.45}
.card.blocked{border-color:#f3c9ce;background:linear-gradient(180deg,#fff8f8,#fff)}
.card.suspicious{border-color:#f0dcae;background:linear-gradient(180deg,#fffdf7,#fff)}
.card-top{display:flex;align-items:center;gap:6px}
.num{font-size:10.5px;font-weight:700;color:#8791a6;letter-spacing:.3px;font-variant-numeric:tabular-nums}
.src{margin-left:auto;display:flex;align-items:center;gap:3px;font-size:10px;color:var(--ink-3);font-weight:500;white-space:nowrap}
.src svg{width:11px;height:11px;stroke:#98a2b3;stroke-width:1.8;fill:none}
.client{display:flex;align-items:flex-start;gap:7px}
.client .ava{width:24px;height:24px;border-radius:7px;font-size:10px;flex:0 0 24px}
.ci{min-width:0;flex:1}
.name{font-size:12.5px;font-weight:600;color:#101828;display:flex;align-items:center;gap:5px;letter-spacing:-.1px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tag{font-size:9px;font-weight:600;letter-spacing:.2px;padding:1px 4px;border-radius:4px;text-transform:uppercase;white-space:nowrap}
.tag.vip{background:#eef2ff;color:#3d55c9}
.tag.dep{background:#f3f0ff;color:#6446c9}
.tag.new{background:#eefaf4;color:#0d8f60}
.sub{font-size:10.5px;color:var(--ink-3);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dest{font-size:12px;font-weight:500;color:#25314d;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dest span{color:var(--ink-3);font-weight:400}
.money{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.money b{font-size:14px;font-weight:600;letter-spacing:-.2px;font-variant-numeric:tabular-nums}
.money span{font-size:10.5px;color:var(--ok);font-weight:600}
.money span.dim{color:var(--ink-3);font-weight:500}
.money span.warn{color:var(--warn)}
.alert{display:flex;align-items:flex-start;gap:5px;border-radius:7px;padding:5px 7px;font-size:10.5px;line-height:1.3;font-weight:500}
.alert svg{width:11px;height:11px;stroke:currentColor;stroke-width:2;fill:none;flex:0 0 11px;margin-top:1px}
.alert.red{background:var(--danger-soft);color:#a3202f;border:1px solid #f6d3d7}
.alert.amber{background:var(--warn-soft);color:#8f5f0f;border:1px solid #f2e0bb}
.alert.green{background:var(--ok-soft);color:#0a6f4b;border:1px solid #cfeee1}
.mini{display:flex;gap:5px;flex-wrap:wrap}
.pill{font-size:10px;font-weight:600;padding:2px 6px;border-radius:5px;background:#f2f4f9;color:#5c6880;display:inline-flex;align-items:center;gap:4px;line-height:1.4;white-space:nowrap}
.pill svg{width:9px;height:9px;stroke:currentColor;stroke-width:2;fill:none}
.pill.g{background:var(--ok-soft);color:#0a7a53}
.pill.r{background:var(--danger-soft);color:#b02a38}
.pill.a{background:var(--warn-soft);color:#9a6410}
.pill.b{background:#eef2ff;color:#3d55c9}
.foot{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--ink-3)}
.task{display:flex;align-items:center;gap:4px;font-weight:600;color:#5c6880;background:#f3f5fa;border-radius:5px;padding:1px 5px;white-space:nowrap}
.task svg{width:9px;height:9px;stroke:currentColor;stroke-width:2;fill:none}
.task.over{background:var(--danger-soft);color:#b02a38}
.task.soon{background:var(--warn-soft);color:#9a6410}
.task.done{background:var(--ok-soft);color:#0a7a53}
.mgr{margin-left:auto;display:flex;align-items:center;gap:4px}
.mgr .ava{width:18px;height:18px;border-radius:5px;font-size:8px;flex:0 0 18px}
.mgr .nm{font-size:10px;color:var(--ink-3);white-space:nowrap}
.lead-actions{display:flex;gap:5px;margin-top:1px}
.btn-sm{flex:1;height:24px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:600;border:1px solid var(--line);background:#fff;color:var(--ink-2);gap:4px;white-space:nowrap}
.btn-sm:hover{background:#f7f9fc}
.btn-sm.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn-sm.primary:hover{background:#1e47cf}
.btn-sm svg{width:10px;height:10px;stroke:currentColor;stroke-width:2;fill:none}

/* ============ CARD (deal) ============ */
.deal-head{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;display:flex;gap:16px;align-items:flex-start;box-shadow:var(--shadow);margin-bottom:12px;flex-wrap:wrap}
.deal-head .h-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.deal-head .num{font-size:14px}
.chip{font-size:11px;font-weight:600;padding:2px 8px;border-radius:6px;display:inline-flex;align-items:center;gap:4px}
.chip svg{width:11px;height:11px;stroke:currentColor;stroke-width:2.2;fill:none}
.chip.red{background:var(--danger-soft);color:#b02a38}
.chip.grey{background:#f2f4f9;color:#5c6880}
.chip.blue{background:var(--accent-soft);color:#2b4ec9}
.chip.green{background:var(--ok-soft);color:#0a7a53}
.chip.amber{background:var(--warn-soft);color:#9a6410}
.deal-head .c-name{font-size:15px;font-weight:600;letter-spacing:-.2px}
.deal-head .c-sub{font-size:11.5px;color:var(--ink-3);margin-top:3px;display:flex;gap:12px;flex-wrap:wrap}
.deal-head .c-sub span{display:flex;align-items:center;gap:4px}
.deal-head .c-sub svg{width:11px;height:11px;stroke:currentColor;stroke-width:1.8;fill:none}
.deal-head .h-right{margin-left:auto;display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.btn-lock{height:34px;padding:0 13px;border-radius:8px;border:1px solid #f0c4ca;background:#fdf1f2;color:#a82434;font-size:12px;font-weight:700;display:flex;align-items:center;gap:6px;white-space:nowrap}
.btn-lock svg{width:13px;height:13px;stroke:currentColor;stroke-width:2;fill:none}

.steps{background:#fff;border:1px solid var(--line);border-radius:14px;padding:11px 14px;display:flex;align-items:center;box-shadow:var(--shadow);margin-bottom:12px;overflow-x:auto}
.step{display:flex;align-items:center;gap:7px;flex:1 0 auto;min-width:104px}
.step .bub{width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;background:#f1f4f9;color:#98a2b3;border:1px solid #e4e8f0;flex:0 0 20px}
.step .bub svg{width:9px;height:9px;stroke:currentColor;stroke-width:2.6;fill:none}
.step .nm{font-size:11px;font-weight:600;color:#98a2b3;white-space:nowrap}
.step .sub{font-size:9.5px;color:#b3bbcb;white-space:nowrap}
.step.done .bub{background:var(--ok-soft);border-color:#cfeee1;color:var(--ok)}
.step.done .nm{color:#5c6880}
.step.now .bub{background:#fff;border:2px solid var(--danger);color:var(--danger)}
.step.now .nm{color:var(--ink);font-weight:700}
.step-line{height:1px;background:#e4e8f0;flex:1 0 12px;margin:0 6px;min-width:12px}
.step-line.done{background:#cfeee1}

.deal-body{display:flex;gap:12px;align-items:flex-start}
.col-l{flex:1 1 58%;min-width:0;display:flex;flex-direction:column;gap:12px}
.col-r{flex:0 0 41%;min-width:0;display:flex;flex-direction:column;gap:12px}
.panel{background:#fff;border:1px solid var(--line);border-radius:13px;box-shadow:var(--shadow);overflow:hidden}
.panel-h{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line-soft)}
.panel-h h3{font-size:12.5px;font-weight:600;letter-spacing:-.1px}
.panel-h .cnt{font-size:10px;font-weight:700;color:var(--ink-3);background:#f1f4f9;border-radius:20px;padding:1px 6px}
.panel-h .link{margin-left:auto;font-size:11px;color:var(--accent);font-weight:600;cursor:pointer;background:none;border:none}
.panel-b{padding:12px 14px}
table{width:100%;border-collapse:collapse}
th{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-3);font-weight:600;text-align:left;padding:0 10px 8px 0;white-space:nowrap}
th:last-child{padding-right:0}
th.r,td.r{text-align:right}
td{padding:8px 0;border-top:1px solid var(--line-soft);font-size:12px;vertical-align:middle}
td .sname{font-weight:600;color:var(--ink);display:flex;align-items:center;gap:6px}
td .sname svg{width:13px;height:13px;stroke:#98a2b3;stroke-width:1.8;fill:none;flex:0 0 13px}
td .sdesc{font-size:10.5px;color:var(--ink-3);margin-top:2px;padding-left:19px}
td.numc{font-variant-numeric:tabular-nums;font-weight:600}
td .cur{font-size:10px;color:var(--ink-3);font-weight:500}
.tfoot{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:10px;margin-top:2px;gap:10px;flex-wrap:wrap}
.tfoot .lbl{font-size:11.5px;color:var(--ink-3)}
.tfoot .sum{font-size:18px;font-weight:600;letter-spacing:-.3px;font-variant-numeric:tabular-nums}
.fin{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.fin .cell{padding:0 12px;border-right:1px solid var(--line-soft)}
.fin .cell:first-child{padding-left:0}
.fin .cell:last-child{border-right:none;padding-right:0}
.fin .k{font-size:10px;text-transform:uppercase;letter-spacing:.4px;color:var(--ink-3);font-weight:600}
.fin .v{font-size:16px;font-weight:600;margin-top:3px;font-variant-numeric:tabular-nums;display:flex;align-items:baseline;gap:4px;flex-wrap:wrap}
.fin .v small{font-size:10.5px;font-weight:600}
.fin .v small.ok{color:var(--ok)}
.fin .v small.warn{color:var(--warn)}
.fin .note{font-size:10.5px;color:var(--ink-3);margin-top:2px;line-height:1.3}
.banner{display:flex;align-items:flex-start;gap:7px;background:var(--warn-soft);border:1px solid #f2e0bb;border-radius:8px;padding:8px 10px;font-size:11px;color:#8f5f0f;line-height:1.35}
.banner svg{width:12px;height:12px;stroke:currentColor;stroke-width:2;fill:none;flex:0 0 12px;margin-top:1px}
.banner.red{background:var(--danger-soft);border-color:#f6d3d7;color:#a3202f}
.banner.ok{background:var(--ok-soft);border-color:#cfeee1;color:#0a704b}
.check-head{padding:11px 14px;border-bottom:1px solid var(--line-soft);background:linear-gradient(180deg,#fff8f8,#fff)}
.check-head .ttl{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:700;color:#a82434}
.check-head .ttl svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none}
.check-head .sub{font-size:10.5px;color:var(--ink-3);margin-top:3px;padding-left:21px}
.check-head.ok{background:linear-gradient(180deg,#f4fdf9,#fff)}
.check-head.ok .ttl{color:#0a704b}
.check-head.neutral{background:linear-gradient(180deg,#f8fafd,#fff)}
.check-head.neutral .ttl{color:var(--ink-2)}
.ck{display:flex;gap:9px;padding:9px 14px;border-bottom:1px solid var(--line-soft);align-items:flex-start}
.ck:last-of-type{border-bottom:none}
.ck .mark{width:17px;height:17px;border-radius:50%;flex:0 0 17px;display:flex;align-items:center;justify-content:center;margin-top:1px;cursor:pointer}
.ck .mark svg{width:10px;height:10px;stroke:currentColor;stroke-width:2.8;fill:none}
.ck.ok .mark{background:var(--ok-soft);color:var(--ok)}
.ck.no .mark{background:#f1f4f9;color:#98a2b3}
.ck.no.blk .mark{background:var(--danger-soft);color:var(--danger)}
.ck .txt{flex:1;min-width:0;cursor:pointer}
.ck .txt b{font-size:12px;font-weight:600;display:block;color:var(--ink)}
.ck.no.blk .txt b{color:#a82434}
.ck .txt i{font-style:normal;font-size:10.5px;color:var(--ink-3);display:block;margin-top:1px;line-height:1.3}
.check-foot{padding:10px 14px;background:#fcfdff}
.prog{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.bar{flex:1;height:5px;border-radius:3px;background:#eef1f6;overflow:hidden}
.bar i{display:block;height:100%;background:var(--ok);border-radius:3px}
.bar.warn i{background:var(--danger)}
.prog span{font-size:10.5px;color:var(--ink-3);font-weight:600;white-space:nowrap}
.btn-block{width:100%;height:36px;border-radius:8px;border:1px dashed #e2b7bd;background:#fdf1f2;color:#a82434;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:6px}
.btn-block svg{width:12px;height:12px;stroke:currentColor;stroke-width:2;fill:none}
.hint{font-size:10.5px;color:var(--ink-3);text-align:center;margin-top:6px;line-height:1.35}
.hint a{color:var(--accent);font-weight:600;cursor:pointer}
.doc{display:flex;align-items:center;gap:9px;padding:8px 0;border-top:1px solid var(--line-soft)}
.doc:first-child{border-top:none;padding-top:0}
.doc .ic{width:26px;height:26px;border-radius:7px;background:#f5f7fb;display:flex;align-items:center;justify-content:center;flex:0 0 26px}
.doc .ic svg{width:13px;height:13px;stroke:#8791a6;stroke-width:1.8;fill:none}
.doc .n{flex:1;min-width:0}
.doc .n b{font-size:11.5px;font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.doc .n i{font-style:normal;font-size:10px;color:var(--ink-3)}
.drop{margin-top:8px;border:1.5px dashed #d7ddea;border-radius:9px;padding:10px;display:flex;align-items:center;gap:9px;background:#fcfdff;cursor:pointer}
.drop:hover{border-color:#b9c7f5;background:#f7f9ff}
.drop .ic{background:var(--danger-soft)}
.drop .ic svg{stroke:var(--danger)}
.drop b{font-size:11px;color:#a82434;display:block}
.drop i{font-style:normal;font-size:10px;color:var(--ink-3)}
.cinfo{display:grid;grid-template-columns:1fr 1fr;gap:10px 8px}
.kv .k{font-size:10px;text-transform:uppercase;letter-spacing:.3px;color:var(--ink-3);font-weight:600;white-space:nowrap}
.kv .v{font-size:13px;font-weight:600;margin-top:2px}
.kv .v.muted{color:var(--ink-3);font-weight:500}
.hist{display:flex;align-items:center;gap:8px;padding:7px 0;border-top:1px solid var(--line-soft);font-size:11.5px;color:var(--ink-2)}
.hist:first-child{border-top:none}
.hist .dot{width:6px;height:6px;border-radius:50%;background:#c3cad8;flex:0 0 6px}
.hist .nm{font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hist .st{margin-left:auto;font-size:9.5px;font-weight:600;color:var(--ink-3);background:#f2f4f9;border-radius:5px;padding:1px 6px;white-space:nowrap}

.trow{display:flex;align-items:center;gap:9px;padding:9px 0;border-top:1px solid var(--line-soft)}
.trow:first-child{border-top:none;padding-top:2px}
.trow .box2{width:16px;height:16px;border-radius:5px;border:1.5px solid #d3d9e5;flex:0 0 16px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.trow .box2.on{background:var(--ok);border-color:var(--ok)}
.trow .box2 svg{width:10px;height:10px;stroke:#fff;stroke-width:3;fill:none}
.trow .t2{flex:1;min-width:0}
.trow .t2 b{font-size:12px;font-weight:600;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.trow .t2 i{font-style:normal;font-size:10.5px;color:var(--ink-3);display:block;margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* ============ TASKS ============ */
.tabs{display:flex;gap:2px;background:#e7ebf3;padding:3px;border-radius:9px;width:max-content}
.tab{font-size:12px;font-weight:500;color:var(--ink-2);padding:5px 11px;border-radius:7px;display:flex;align-items:center;gap:5px}
.tab.on{background:#fff;color:var(--ink);box-shadow:var(--shadow);font-weight:600}
.tab svg{width:13px;height:13px;stroke:currentColor;stroke-width:1.8;fill:none}
.tlist{display:flex;flex-direction:column;gap:8px}
.titem{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;box-shadow:var(--shadow)}
.titem.over{border-color:#f3c9ce;background:linear-gradient(90deg,#fff8f8,#fff)}
.titem .box{width:17px;height:17px;border-radius:5px;border:1.5px solid #d3d9e5;flex:0 0 17px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.titem .box svg{width:10px;height:10px;stroke:#fff;stroke-width:3;fill:none}
.titem .box.on{background:var(--ok);border-color:var(--ok)}
.titem .t{flex:1;min-width:0}
.titem .t b{font-size:12.5px;font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.titem .t i{font-style:normal;font-size:10.5px;color:var(--ink-3);display:flex;gap:6px;align-items:center;margin-top:2px}
.titem .t i a{color:var(--accent);font-weight:600}
.due{font-size:10px;font-weight:700;padding:2px 7px;border-radius:5px;background:#f3f5fa;color:#5c6880;white-space:nowrap}
.due.over{background:var(--danger-soft);color:#b02a38}
.due.soon{background:var(--warn-soft);color:#9a6410}
.due.done{background:var(--ok-soft);color:#0a7a53}
.group-lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.6px;color:var(--ink-3);font-weight:700;margin:14px 0 7px}
.group-lbl:first-child{margin-top:0}

/* ============ FINANCE / ANALYTICS ============ */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 14px;box-shadow:var(--shadow)}
.stat .k{font-size:10.5px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.4px;font-weight:600}
.stat .v{font-size:22px;font-weight:600;letter-spacing:-.4px;margin-top:5px;font-variant-numeric:tabular-nums}
.stat .v small{font-size:11.5px;font-weight:600;color:var(--ok);margin-left:5px}
.stat .v small.neg{color:var(--danger)}
.stat .n{font-size:11px;color:var(--ink-3);margin-top:3px}
.rate-big{background:linear-gradient(135deg,#101a30,#1c2b4d);color:#fff;border-radius:14px;padding:16px 18px}
.rate-big .k{font-size:10.5px;letter-spacing:.6px;text-transform:uppercase;color:#8fa0c0;font-weight:600}
.rate-big .v{font-size:32px;font-weight:600;letter-spacing:-.6px;margin-top:4px;display:flex;align-items:baseline;gap:8px}
.rate-big .v small{font-size:12px;color:#9fb0cf;font-weight:500}
.rate-big .n{font-size:11px;color:#8fa0c0;margin-top:6px}
.form-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.field{display:flex;flex-direction:column;gap:4px;flex:1;min-width:110px}
.field label{font-size:10.5px;color:var(--ink-3);font-weight:600;text-transform:uppercase;letter-spacing:.3px}
.field input,.field select,.field textarea{height:32px;border:1px solid var(--line);border-radius:8px;padding:0 9px;background:#fff;outline:none;font-size:12.5px}
.field textarea{height:auto;padding:8px 9px;min-height:64px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#b9c7f5;box-shadow:0 0 0 3px rgba(43,87,234,.1)}
.hintline{font-size:11px;color:var(--ink-3);margin-top:7px}
.err{font-size:11px;color:#b02a38;margin-top:6px;font-weight:500}
.funnel{display:flex;flex-direction:column;gap:6px}
.funnel-row{display:flex;align-items:center;gap:9px;font-size:11.5px}
.funnel-row .lbl{width:150px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.funnel-row .track{flex:1;height:20px;background:#f4f6fa;border-radius:5px;overflow:hidden}
.funnel-row .fill{height:100%;border-radius:5px;opacity:.85}
.funnel-row .val{width:110px;text-align:right;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap}
.mini-bars{display:flex;flex-direction:column;gap:5px}
.mini-bar{display:flex;align-items:center;gap:8px;font-size:11.5px}
.mini-bar .n{width:90px;color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini-bar .tr{flex:1;height:7px;background:#f1f4f9;border-radius:4px;overflow:hidden}
.mini-bar .fi{height:100%;background:#2b57ea;border-radius:4px}
.mini-bar .q{width:52px;text-align:right;color:var(--ink-3);font-variant-numeric:tabular-nums}
.empty{padding:26px;text-align:center;color:var(--ink-3);font-size:12px}

/* ============ MODAL / TOAST / DRAWER ============ */
#modal-root:empty{display:none}
.modal-back{position:fixed;inset:0;background:rgba(15,24,40,.42);display:flex;align-items:center;justify-content:center;z-index:50;padding:24px;backdrop-filter:blur(2px)}
.modal{background:#fff;border-radius:14px;width:520px;max-width:100%;max-height:88vh;overflow:auto;box-shadow:var(--shadow-lg)}
.modal.wide{width:760px}
.modal-h{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line-soft)}
.modal-h h3{font-size:14px;font-weight:600}
.modal-h .x{margin-left:auto;width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;color:#8791a6}
.modal-h .x:hover{background:#f1f4f9}
.modal-h .x svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none}
.modal-b{padding:14px 16px}
.modal-f{padding:12px 16px;border-top:1px solid var(--line-soft);display:flex;gap:8px;justify-content:flex-end}
.toasts{position:fixed;right:18px;bottom:18px;display:flex;flex-direction:column;gap:8px;z-index:80}
.toast{background:#101a30;color:#fff;border-radius:10px;padding:11px 14px;font-size:12.5px;box-shadow:var(--shadow-lg);display:flex;gap:9px;align-items:flex-start;max-width:380px;animation:slide .18s ease-out}
.toast.err{background:#8f1d2b}
.toast.ok{background:#0b6b4a}
.toast svg{width:14px;height:14px;stroke:currentColor;stroke-width:2;fill:none;flex:0 0 14px;margin-top:1px}
@keyframes slide{from{transform:translateY(8px);opacity:0}to{transform:none;opacity:1}}
@keyframes shake{0%,100%{transform:none}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.shake{animation:shake .25s}
.menu{position:absolute;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-lg);padding:5px;z-index:60;min-width:220px}
.menu-item{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:7px;font-size:12.5px;cursor:pointer;color:var(--ink-2)}
.menu-item:hover{background:#f5f7fb}
.menu-item.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.menu-item .ava{width:22px;height:22px;border-radius:6px;font-size:9px;flex:0 0 22px}
.menu-sep{height:1px;background:var(--line-soft);margin:4px 2px}
@media (max-width:1200px){
  .deal-body{flex-direction:column}
  .col-r{flex:1 1 auto;width:100%}
  .grid4{grid-template-columns:1fr 1fr}
}