:root{
  --bg-deep:#0C1018; --bg-main:#10141E; --bg-elev:#1C2430; --bg-hover:#242E3C;
  --accent:#4A9490; --accent-light:#7ABCB8; --accent-elec:#00C8AA; --accent-glow:rgba(0,200,170,.40);
  --accent-subtle:rgba(74,148,144,.10); --accent-border:rgba(74,148,144,.22);
  --text:#E8EEF4; --text-2:rgba(170,200,200,.66); --text-3:rgba(170,200,200,.42); --text-4:rgba(170,200,200,.20);
  --glass:rgba(255,255,255,.045); --glass-b:rgba(255,255,255,.07);
  --b-1:rgba(170,200,200,.08); --b-2:rgba(170,200,200,.14);
  --r-s:8px; --r-m:12px; --r-l:18px;
  --p1:#D9576F; --p2:#E0A93B; --p3:#7ABCB8;
  --st-wip:#E0A93B; --st-done:#00C8AA; --st-block:#D9576F;
  --stg-contact:#7A8FA8; --stg-talks:#E0A93B; --stg-contract:#C49AE0; --stg-awaiting:#C9A678; --stg-integration:#7ABCB8; --stg-pilot:#4AB8E0; --stg-prod:#00C8AA; --stg-frozen:#D9576F;
  --overlay-bg:rgba(8,12,18,.72);
  --overlay-bg-strong:rgba(8,12,18,.82);
  --shadow-card:0 8px 24px rgba(0,0,0,.30);
}

/* ───── Светлая тема ───── */
[data-theme="light"]{
  --bg-deep:#E4EAF1; --bg-main:#EDF1F6; --bg-elev:#FFFFFF; --bg-hover:#DDE5EE;
  --accent:#4A9490; --accent-light:#2E6E6A; --accent-elec:#00A084; --accent-glow:rgba(0,160,132,.30);
  --accent-subtle:rgba(74,148,144,.12); --accent-border:rgba(74,148,144,.45);
  --text:#0E1726; --text-2:rgba(20,40,60,.72); --text-3:rgba(20,40,60,.52); --text-4:rgba(20,40,60,.28);
  --glass:rgba(255,255,255,.85); --glass-b:rgba(20,40,60,.14);
  --b-1:rgba(20,40,60,.12); --b-2:rgba(20,40,60,.20);
  --p1:#B23449; --p2:#9A6916; --p3:#2E6E6A;
  --st-wip:#9A6916; --st-done:#008970; --st-block:#B23449;
  --stg-contact:#4E657A; --stg-talks:#9A6916; --stg-contract:#7E5EA0; --stg-awaiting:#8F6A3D; --stg-integration:#48807C; --stg-pilot:#1F76A8; --stg-prod:#008970; --stg-frozen:#B23449;
  --overlay-bg:rgba(45,65,90,.55);
  --overlay-bg-strong:rgba(45,65,90,.68);
  --shadow-card:0 6px 18px rgba(20,40,60,.12);
}

/* ───── Усиление контраста плашек и меню в светлой теме ───── */
[data-theme="light"] body{ background:var(--bg-main) }
[data-theme="light"] .kpi{
  background:#FFFFFF;
  border:1px solid rgba(20,40,60,.14);
  box-shadow:0 1px 3px rgba(20,40,60,.06);
}
[data-theme="light"] .kpi.clickable:hover{
  background:#F4F8FC;
  border-color:rgba(74,148,144,.55);
  box-shadow:0 6px 16px rgba(20,40,60,.10);
}
[data-theme="light"] .kpi.alert{
  background:#FCEEF1; border-color:rgba(178,52,73,.45);
}
[data-theme="light"] .kpi.alert .val,
[data-theme="light"] .kpi.alert .lbl{ color:#9A2C3E }
[data-theme="light"] .kpi.warn{
  background:#FDF6E7; border-color:rgba(154,105,22,.42);
}
[data-theme="light"] .kpi.warn .val,
[data-theme="light"] .kpi.warn .lbl{ color:#7A5210 }
[data-theme="light"] .kpi.ok{
  background:#E6F7F3; border-color:rgba(0,137,112,.42);
}
[data-theme="light"] .kpi.zero{ background:#F0F3F7; opacity:1 }

/* Меню вкладок */
[data-theme="light"] .tabs{
  border-bottom:1px solid rgba(20,40,60,.18);
  background:#FFFFFF;
  padding:0 6px;
  border-radius:10px 10px 0 0;
  box-shadow:0 1px 0 rgba(20,40,60,.04);
}
[data-theme="light"] .tab{ color:#3E4E63 }
[data-theme="light"] .tab:hover{
  color:#1B2638;
  background:rgba(74,148,144,.10);
}
[data-theme="light"] .tab.active{
  color:#005F4F;
  background:rgba(0,160,132,.10);
  border-bottom:3px solid #00A084;
  font-weight:700;
}
[data-theme="light"] .tab .badge{
  background:rgba(20,40,60,.10);
  color:#3E4E63;
}
[data-theme="light"] .tab.active .badge{
  background:rgba(0,160,132,.22);
  color:#005F4F;
}

/* Шапка — лёгкая обводка и тень, чтобы выделить из общего фона */
[data-theme="light"] .header{
  background:#FFFFFF;
  border:1px solid rgba(20,40,60,.12);
  box-shadow:0 1px 3px rgba(20,40,60,.06);
}
[data-theme="light"] .header .file-chip{
  background:rgba(20,40,60,.04);
  border-color:rgba(20,40,60,.12);
}
[data-theme="light"] .header .file-chip.connected{
  background:rgba(0,160,132,.10);
  border-color:rgba(0,160,132,.40);
}

/* Панели и карточки — белый поверх серого фона, тонкая граница, лёгкая тень */
[data-theme="light"] .panel{
  background:#FFFFFF;
  border:1px solid rgba(20,40,60,.10);
  box-shadow:0 1px 3px rgba(20,40,60,.05);
}
[data-theme="light"] .ecard{
  background:#FFFFFF;
  border-color:rgba(20,40,60,.12);
  box-shadow:0 1px 2px rgba(20,40,60,.05);
}
[data-theme="light"] .ecard.open{
  box-shadow:0 10px 28px rgba(20,40,60,.14), 0 0 0 1px var(--accent-border);
}

/* Quick-nav — белая полоса с тенью */
[data-theme="light"] .quick-nav{
  background:#FFFFFF;
  border-bottom-color:rgba(20,40,60,.14);
  box-shadow:0 6px 12px -8px rgba(20,40,60,.18);
}
[data-theme="light"] .qn-chip{ border-color:rgba(20,40,60,.18); background:#FFFFFF; color:#3E4E63 }
[data-theme="light"] .qn-chip:hover{ background:#F4F8FC; color:#1B2638 }
[data-theme="light"] .qn-chip.open{ background:rgba(0,160,132,.10); color:#005F4F; border-color:rgba(0,160,132,.45) }
*{box-sizing:border-box; margin:0; padding:0}
html,body{background:var(--bg-main); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Inter","Segoe UI",sans-serif; font-size:13px; line-height:1.5; min-height:100vh}
button{font-family:inherit; cursor:pointer; border:none; background:none; color:inherit}
input,select,textarea{font-family:inherit; font-size:13px}
::-webkit-scrollbar{width:10px;height:10px} ::-webkit-scrollbar-track{background:transparent} ::-webkit-scrollbar-thumb{background:var(--b-2); border-radius:5px}
::-webkit-scrollbar-thumb:hover{background:var(--accent-border)}

/* ───── Layout: sidebar + main ───── */
html,body{height:100%}
.layout{display:flex; min-height:100vh}
.sidebar{width:232px; flex-shrink:0; background:var(--bg-elev); border-right:1px solid var(--b-1); display:flex; flex-direction:column; position:sticky; top:0; height:100vh; transition:width .18s}
.sidebar.collapsed{width:64px}
.side-brand{display:flex; align-items:center; gap:10px; padding:15px 14px 13px; border-bottom:1px solid var(--b-1)}
.side-brand-name{font-size:16px; font-weight:800; letter-spacing:.3px; white-space:nowrap; overflow:hidden}
.side-toggle{margin-left:auto; width:24px; height:24px; border-radius:6px; color:var(--text-3); font-size:16px; line-height:1; background:transparent; transition:.15s}
.side-toggle:hover{background:var(--bg-hover); color:var(--text-1)}
.sidebar.collapsed .side-toggle{transform:rotate(180deg)}
.side-nav{flex:1; overflow-y:auto; padding:10px 10px 14px; display:flex; flex-direction:column; gap:2px}
.side-group{font-size:10px; text-transform:uppercase; letter-spacing:.5px; color:var(--text-3); padding:12px 10px 4px}
.side-sep{height:1px; background:var(--b-1); margin:8px 6px}
.side-admin{display:none}                        /* админ-раздел меню скрыт… */
.sidebar.is-admin .side-admin{display:contents}  /* …и виден только администратору */
.side-nav .tab{width:100%; justify-content:flex-start; gap:11px; padding:9px 11px; border-radius:9px; color:var(--text-2); font-size:13px; font-weight:600; border:0; border-bottom:0; background:transparent; white-space:nowrap; overflow:hidden}
.side-nav .tab .ic{width:20px; text-align:center; flex-shrink:0; font-size:15px}
.side-nav .tab .lbl{flex:1; overflow:hidden; text-overflow:ellipsis; text-align:left}
.side-nav .tab:hover{background:var(--bg-hover); color:var(--text-1)}
.side-nav .tab.active{background:var(--accent-subtle); color:var(--accent-light); border-bottom:0}
.side-nav .tab .badge{margin-left:auto; display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--bg-main); color:var(--text-3); font-size:10px; font-weight:700}
.side-nav .tab.active .badge{background:var(--accent-elec); color:#04110f}
.side-foot{border-top:1px solid var(--b-1); padding:10px; display:flex; flex-direction:column; gap:8px}
.side-foot .file-chip{width:100%}
.side-backdrop{display:none}
/* Свёрнутый режим — только иконки */
.sidebar.collapsed .side-brand-name,
.sidebar.collapsed .side-group,
.sidebar.collapsed .side-sep,
.sidebar.collapsed .side-nav .tab .lbl,
.sidebar.collapsed .side-nav .tab .badge,
.sidebar.collapsed .side-foot .file-chip{display:none}
.sidebar.collapsed .side-brand{justify-content:center}
.sidebar.collapsed .side-nav .tab{justify-content:center; padding:9px 0}

.main{flex:1; min-width:0; display:flex; flex-direction:column}
.topbar{display:flex; align-items:center; gap:12px; padding:11px 22px; border-bottom:1px solid var(--b-1); position:sticky; top:0; z-index:20; background:var(--bg-main); background-image:radial-gradient(ellipse 50% 140% at 98% 50%,rgba(74,148,144,.08) 0%,transparent 60%)}
.topbar-title{font-size:17px; font-weight:700}
.topbar-actions{display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end}
.side-toggle-m{display:none; width:32px; height:32px; border-radius:8px; font-size:18px; color:var(--text-2); background:transparent}
.content{flex:1; padding:20px 22px 44px; max-width:1680px; width:100%; margin:0 auto}

/* ───── Header ───── */
.header{display:flex; justify-content:space-between; align-items:center; padding:16px 22px; margin-bottom:18px; background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-l); background-image:radial-gradient(ellipse 60% 80% at 92% 50%,rgba(74,148,144,.10) 0%,transparent 60%)}
.logo{display:flex; align-items:center; gap:14px}
.logo-mark{width:36px; height:36px; border-radius:10px; background:linear-gradient(148deg,#7A94AE,#C4D8EC 28%,#9AAEC4 52%,#E0F2FF 74%,#7890A8); position:relative; box-shadow:0 0 24px rgba(122,188,184,.30)}
.logo-mark::after{content:""; position:absolute; inset:7px; border-radius:6px; background:var(--bg-elev)}
.logo-mark::before{content:""; position:absolute; inset:13px; border-radius:50%; background:var(--accent-elec); box-shadow:0 0 12px var(--accent-glow); z-index:2}
.logo h1{font-size:17px; font-weight:700}
.logo .sub{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px}
.hdr-right{display:flex; align-items:center; gap:10px}
.file-chip{display:flex; align-items:center; gap:8px; padding:7px 12px; background:var(--glass); border:1px solid var(--b-2); border-radius:var(--r-s); font-size:11px}
.file-chip.connected{border-color:rgba(0,200,170,.30); background:rgba(0,200,170,.05)}
.file-chip.connected .dot{background:var(--accent-elec); box-shadow:0 0 6px var(--accent-glow)}
.file-chip.warn{border-color:rgba(224,169,59,.30); background:rgba(224,169,59,.06)}
.file-chip.warn .dot{background:var(--p2)}
.file-chip .dot{width:7px; height:7px; border-radius:50%; background:var(--text-4)}
.file-chip .name{color:var(--text-2)}
.btn{padding:8px 14px; border-radius:var(--r-s); border:1px solid var(--b-2); background:var(--bg-hover); color:var(--text); font-size:12px; font-weight:600; transition:.15s; display:inline-flex; align-items:center; gap:6px}
.btn:hover{background:var(--bg-elev); border-color:var(--accent-border)}
.btn-primary{background:var(--accent-subtle); border-color:var(--accent-border); color:var(--accent-light)}
.btn-primary:hover{background:rgba(74,148,144,.20)}
.btn-danger{background:rgba(217,87,111,.08); border-color:rgba(217,87,111,.25); color:#F08A9D}
.btn-sm{padding:5px 9px; font-size:11px}
.btn-icon{width:30px; height:30px; padding:0; justify-content:center; border-radius:6px}

/* ───── KPI ───── */
.kpis{display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-bottom:18px}
.kpi{background:var(--glass); border:1px solid var(--glass-b); border-radius:var(--r-m); padding:14px 16px; position:relative; transition:.15s}
.kpi .lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px; display:flex; align-items:center; gap:5px}
.kpi .lbl .ic{font-size:13px; opacity:.85}
.kpi .val{font-size:26px; font-weight:700; margin-top:4px; letter-spacing:-.5px; line-height:1.1}
.kpi .delta{font-size:11px; color:var(--text-2); margin-top:3px}
.kpi .delta b{color:var(--accent-elec)}
.kpi.clickable{cursor:pointer}
.kpi.clickable:hover{background:var(--bg-hover); border-color:var(--accent-border); transform:translateY(-1px); box-shadow:0 4px 14px rgba(0,0,0,.20)}
.kpi.alert{background:rgba(217,87,111,.10); border-color:rgba(217,87,111,.35)}
.kpi.alert .val{color:#F08A9D}
.kpi.alert .lbl{color:#F08A9D}
.kpi.warn{background:rgba(224,169,59,.08); border-color:rgba(224,169,59,.28)}
.kpi.warn .val{color:#F0C170}
.kpi.warn .lbl{color:#F0C170}
.kpi.ok{background:rgba(0,200,170,.08); border-color:rgba(0,200,170,.28)}
.kpi.ok .val{color:var(--accent-elec)}
.kpi.zero .val{color:var(--text-3)}
.kpi.zero{opacity:.85}

/* Кнопки исполнителей на биз-доске — компактные */
.biz-assignees, .biz-owners{display:flex; flex-wrap:wrap; gap:4px; margin-bottom:8px; padding:6px 10px; background:var(--bg-deep); border:1px solid var(--b-1); border-radius:7px; align-items:center}
.biz-assignees .lbl, .biz-owners .lbl{font-size:9px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px; margin-right:4px}
.biz-assignees .hint{display:none}
.biz-assignee-chip, .biz-owner-chip{display:inline-flex; align-items:center; gap:4px; padding:3px 7px 3px 4px; border-radius:5px; border:1px solid var(--b-2); background:var(--bg-elev); color:var(--text-2); cursor:pointer; transition:.15s; user-select:none; font-size:11px; font-weight:600; line-height:1.2}
.biz-assignee-chip:hover, .biz-owner-chip:hover{background:var(--bg-hover); color:var(--text); border-color:var(--accent-border)}
.biz-assignee-chip.on, .biz-owner-chip.on{background:var(--accent-subtle); color:var(--accent-light); border-color:var(--accent-border); box-shadow:0 0 0 1px var(--accent-border)}
.biz-assignee-chip .avi{width:16px; height:16px; border-radius:50%; background:linear-gradient(135deg, var(--accent), var(--accent-elec)); color:var(--bg-deep); font-size:9px; font-weight:800; display:flex; align-items:center; justify-content:center; text-transform:uppercase; flex-shrink:0}
.biz-assignee-chip .cnt, .biz-owner-chip .cnt{display:inline-flex; align-items:center; gap:3px; font-size:9px; font-weight:700}
.biz-assignee-chip .cnt .od, .biz-owner-chip .cnt .od{color:#F08A9D; background:rgba(217,87,111,.14); padding:1px 4px; border-radius:3px}
.biz-assignee-chip .cnt .td, .biz-owner-chip .cnt .td{color:#F0C170; background:rgba(224,169,59,.14); padding:1px 4px; border-radius:3px}
.biz-assignee-chip .cnt .qt, .biz-owner-chip .cnt .qt{color:var(--text-3)}
.biz-assignee-chip.all-chip, .biz-owner-chip.all-chip{padding-left:8px}
/* Owner-чип: цветная точка стадии слева, как в quick-nav */
.biz-owner-chip{padding-left:18px; position:relative}
.biz-owner-chip::before{content:""; position:absolute; left:7px; top:50%; transform:translateY(-50%); width:6px; height:6px; border-radius:50%; background:var(--text-4)}
.biz-owner-chip[data-stage="contact"]::before{background:var(--stg-contact)}
.biz-owner-chip[data-stage="talks"]::before{background:var(--stg-talks)}
.biz-owner-chip[data-stage="contract"]::before{background:var(--stg-contract)}
.biz-owner-chip[data-stage="awaiting"]::before{background:var(--stg-awaiting)}
.biz-owner-chip[data-stage="integration"]::before{background:var(--stg-integration)}
.biz-owner-chip[data-stage="pilot"]::before{background:var(--stg-pilot)}
.biz-owner-chip[data-stage="prod"]::before{background:var(--stg-prod)}
.biz-owner-chip[data-stage="frozen"]::before{background:var(--stg-frozen)}
.biz-owner-chip.all-chip::before{display:none}
.biz-owner-chip.all-chip{padding-left:8px}
.biz-owner-chip .kind-tag{font-size:8px; padding:0 4px; border-radius:3px; background:var(--glass); color:var(--text-3); text-transform:uppercase; letter-spacing:.3px}

/* KPI-баннер фильтра на биз-доске */
.biz-kpi-banner{margin-bottom:12px; padding:10px 14px; background:var(--accent-subtle); border:1px solid var(--accent-border); border-radius:8px; display:flex; align-items:center; gap:10px; font-size:12px; color:var(--accent-light)}
.biz-kpi-banner b{color:var(--text)}
.biz-kpi-banner .spacer{flex:1}
.biz-kpi-banner button{background:var(--bg-elev); border:1px solid var(--b-2); color:var(--text); padding:4px 9px; border-radius:5px; font-size:11px; font-weight:600; cursor:pointer; transition:.15s}
.biz-kpi-banner button:hover{border-color:var(--accent-border)}
.scope-toggle{display:inline-flex; gap:0; background:var(--bg-deep); border:1px solid var(--b-1); border-radius:6px; padding:2px}
.scope-toggle button{background:transparent; border:none; padding:4px 10px; font-size:11px; font-weight:600; color:var(--text-3); cursor:pointer; border-radius:4px; transition:.15s}
.scope-toggle button:hover{color:var(--text-2)}
.scope-toggle button.on{background:var(--accent-subtle); color:var(--accent-light); box-shadow:0 0 0 1px var(--accent-border)}

/* ───── Tabs ───── */
.tabs{display:flex; gap:2px; margin-bottom:18px; border-bottom:1px solid var(--b-1)}
.tab{padding:10px 18px; background:transparent; color:var(--text-3); font-size:13px; font-weight:600; border-bottom:2px solid transparent; transition:.15s; display:flex; align-items:center; gap:7px}
.tab:hover{color:var(--text-2)}
.tab.active{color:var(--accent-elec); border-bottom-color:var(--accent-elec)}
.tab .badge{display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--bg-elev); color:var(--text-3); font-size:10px; font-weight:700}
.tab.active .badge{background:var(--accent-subtle); color:var(--accent-light)}
.tab-content{display:none} .tab-content.active{display:block; animation:fadeIn .2s}
@keyframes fadeIn{from{opacity:0; transform:translateY(4px)} to{opacity:1}}

.panel{background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-l); padding:18px; margin-bottom:14px}
.panel-title{font-size:14px; font-weight:700; margin-bottom:14px; display:flex; align-items:center; gap:8px}
.panel-title .sub{font-size:11px; color:var(--text-3); font-weight:400}
.panel-title .spacer{flex:1}

/* ───── Stage Pipeline (главное визуальное) ───── */
.pipeline{display:grid; grid-template-columns:repeat(7,1fr); gap:8px}
.lane{background:var(--bg-deep); border:1px solid var(--b-1); border-radius:var(--r-m); padding:10px; min-height:160px; display:flex; flex-direction:column}
.lane-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding-bottom:8px; border-bottom:1px dashed var(--b-1)}
.lane-name{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--text-2)}
.lane-count{font-size:10px; color:var(--text-3); background:var(--bg-elev); padding:1px 6px; border-radius:8px}
.lane-stripe{height:3px; border-radius:2px; margin-bottom:10px}
.lane-body{display:flex; flex-direction:column; gap:6px; flex:1}
.bank-pin{padding:8px 10px; border-radius:8px; background:var(--bg-elev); border:1px solid var(--b-1); cursor:grab; transition:.15s; position:relative; overflow:hidden}
.bank-pin:active{cursor:grabbing}
.bank-pin:hover{background:var(--bg-hover); border-color:var(--accent-border); transform:translateX(2px)}
.bank-pin.dragging{opacity:.35; cursor:grabbing}
.lane.drop-over{background:rgba(0,200,170,.06); border-color:var(--accent-border)}
.lane.drop-over .lane-body{outline:2px dashed var(--accent-border); outline-offset:-3px; border-radius:8px; min-height:30px}
.bank-pin .nm{font-size:12px; font-weight:700; display:flex; align-items:center; gap:6px}
.bank-pin .nm .priochip{font-size:9px; padding:1px 5px; border-radius:4px; font-weight:700}
.bank-pin .nm .priochip.P1{background:rgba(217,87,111,.18); color:#F08A9D}
.bank-pin .nm .priochip.P2{background:rgba(224,169,59,.18); color:#F0C170}
.bank-pin .nm .priochip.P3{background:rgba(122,188,184,.18); color:var(--accent-light)}
.bank-pin .chip-parallel{display:inline-flex; align-items:center; gap:3px; padding:1px 6px; border-radius:4px; font-size:9px; font-weight:700; background:rgba(74,148,144,.18); color:var(--accent-light); border:1px solid var(--accent-border); margin-top:4px; max-width:max-content}
.bank-pin .progs{display:flex; gap:3px; margin-top:6px}
.chip-parallel-lg{display:inline-flex; align-items:center; gap:4px; padding:3px 8px; border-radius:5px; font-size:10.5px; font-weight:700; background:rgba(74,148,144,.18); color:var(--accent-light); border:1px solid var(--accent-border); white-space:nowrap}
.bank-pin .progs .pg{flex:1; height:4px; background:var(--bg-deep); border-radius:2px; overflow:hidden}
.bank-pin .progs .pg span{display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--accent-elec))}
.lane-empty{font-size:11px; color:var(--text-4); text-align:center; padding:14px 4px; font-style:italic}

/* Stage stripe colors */
.lane[data-stage="contact"] .lane-stripe{background:var(--stg-contact)}
.lane[data-stage="talks"] .lane-stripe{background:var(--stg-talks)}
.lane[data-stage="contract"] .lane-stripe{background:var(--stg-contract)}
.lane[data-stage="awaiting"] .lane-stripe{background:var(--stg-awaiting)}
.lane[data-stage="integration"] .lane-stripe{background:var(--stg-integration)}
.lane[data-stage="pilot"] .lane-stripe{background:var(--stg-pilot)}
.lane[data-stage="prod"] .lane-stripe{background:var(--stg-prod)}
.lane[data-stage="frozen"] .lane-stripe{background:var(--stg-frozen)}

/* ───── Quick-nav (быстрый переход к карточке) ───── */
.quick-nav{position:sticky; top:0; z-index:8; background:var(--bg-elev); border-bottom:1px solid var(--b-1); padding:10px 18px; margin:-18px -18px 14px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; box-shadow:0 6px 12px -8px rgba(0,0,0,.3)}
.quick-nav .qn-lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px; margin-right:4px}
.qn-chip{display:inline-flex; align-items:center; gap:5px; padding:4px 10px 4px 22px; border-radius:5px; font-size:11px; font-weight:600; border:1px solid var(--b-2); background:var(--bg-elev); color:var(--text-2); cursor:pointer; transition:.15s; user-select:none; position:relative; white-space:nowrap}
.qn-chip::before{content:""; position:absolute; left:9px; top:50%; transform:translateY(-50%); width:7px; height:7px; border-radius:50%; background:var(--text-4)}
.qn-chip:hover{background:var(--bg-hover); color:var(--text); border-color:var(--accent-border)}
.qn-chip.open{background:var(--accent-subtle); color:var(--accent-light); border-color:var(--accent-border); box-shadow:0 0 0 1px var(--accent-border)}
.qn-chip[data-stage="contact"]::before{background:var(--stg-contact)}
.qn-chip[data-stage="talks"]::before{background:var(--stg-talks)}
.qn-chip[data-stage="contract"]::before{background:var(--stg-contract)}
.qn-chip[data-stage="awaiting"]::before{background:var(--stg-awaiting)}
.qn-chip[data-stage="integration"]::before{background:var(--stg-integration)}
.qn-chip[data-stage="pilot"]::before{background:var(--stg-pilot)}
.qn-chip[data-stage="prod"]::before{background:var(--stg-prod)}
.qn-chip[data-stage="frozen"]::before{background:var(--stg-frozen)}
.qn-chip .qn-cnt{font-size:9px; color:var(--text-3); margin-left:2px; padding:0 4px; background:var(--bg-deep); border-radius:3px}
.qn-empty{font-size:11px; color:var(--text-3); padding:4px 10px; font-style:italic}

/* ───── Entity card (банк/платформа) ───── */
.ecard{background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-m); margin-bottom:10px; overflow:visible; scroll-margin-top:60px}
.ecard.open{
  border-color:var(--accent-border);
  border-left:4px solid var(--accent-elec);
  box-shadow:0 8px 24px rgba(0,0,0,.30), 0 0 0 1px var(--accent-border);
  margin:22px 0;
  position:relative;
}
.ecard.open::before{
  content:""; position:absolute; left:-4px; right:0; top:-1px; height:3px;
  background:linear-gradient(90deg, var(--accent-elec), transparent 70%);
  border-radius:var(--r-m) var(--r-m) 0 0; pointer-events:none;
}
.ecard.open .ehead{
  position:sticky; top:48px; z-index:6;
  background:var(--bg-elev);
  border-bottom:1px solid var(--b-1);
  border-radius:var(--r-m) var(--r-m) 0 0;
  box-shadow:0 2px 8px rgba(0,0,0,.20);
}
/* Без quick-nav (например, на вкладке Услуги) — ehead прилипает к самому верху */
.tab-content:not(#tab-banks):not(#tab-platforms) .ecard.open .ehead{ top:0 }
.ecard.open .ebody{
  background:var(--bg-main);
}
.ecard-collapse{
  margin-top:16px; padding:9px 12px; width:100%; text-align:center;
  background:transparent; border:1px dashed var(--b-2); border-radius:6px;
  color:var(--text-3); font-size:11.5px; font-weight:600; cursor:pointer; transition:.15s
}
.ecard-collapse:hover{color:var(--accent-light); border-color:var(--accent-border); background:var(--accent-subtle)}
.ehead{padding:12px 16px; display:grid; grid-template-columns:auto 1fr auto auto auto; gap:14px; align-items:center; cursor:pointer; transition:.15s}
.ehead:hover{background:var(--bg-hover)}
.etgl{font-size:11px; color:var(--text-3); width:14px; transition:.15s}
.ecard.open .etgl{transform:rotate(90deg)}
.etitle{font-size:14px; font-weight:700; display:flex; align-items:center; gap:8px}
.estage-chip{display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:5px; font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; background:var(--bg-deep); border:1px solid var(--b-2)}
.estage-chip .col{width:6px; height:6px; border-radius:50%}
.eprog{display:flex; align-items:center; gap:8px; min-width:140px}
.eprog .bar{width:90px; height:6px; background:var(--bg-deep); border-radius:3px; overflow:hidden}
.eprog .bar span{display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--accent-elec)); border-radius:3px}
.eprog .pct{font-size:12px; font-weight:700; min-width:34px; text-align:right; color:var(--text-2)}
.ebody{padding:14px 16px 16px; border-top:1px solid var(--b-1); display:none; background:var(--bg-deep)}
.ecard.open .ebody{display:block}

/* Chip-toggle group (минимизация форм) */
.chipset{display:flex; gap:4px; flex-wrap:wrap}
.chip{padding:4px 10px; border-radius:6px; border:1px solid var(--b-2); background:var(--bg-elev); color:var(--text-2); font-size:11px; font-weight:600; cursor:pointer; transition:.15s; user-select:none}
.chip:hover{background:var(--bg-hover); color:var(--text)}
.chip.on{background:var(--accent-subtle); border-color:var(--accent-border); color:var(--accent-light)}
.chip.on.P1{background:rgba(217,87,111,.18); border-color:rgba(217,87,111,.30); color:#F08A9D}
.chip.on.P2{background:rgba(224,169,59,.18); border-color:rgba(224,169,59,.30); color:#F0C170}
.chip.on.P3{background:rgba(122,188,184,.18); border-color:rgba(122,188,184,.30); color:var(--accent-light)}

/* Stage chips with color */
.chip[data-stage]{position:relative; padding-left:18px}
.chip[data-stage]::before{content:""; position:absolute; left:7px; top:50%; transform:translateY(-50%); width:7px; height:7px; border-radius:50%}
.chip[data-stage="contact"]::before{background:var(--stg-contact)}
.chip[data-stage="talks"]::before{background:var(--stg-talks)}
.chip[data-stage="contract"]::before{background:var(--stg-contract)}
.chip[data-stage="awaiting"]::before{background:var(--stg-awaiting)}
.chip[data-stage="integration"]::before{background:var(--stg-integration)}
.chip[data-stage="pilot"]::before{background:var(--stg-pilot)}
.chip[data-stage="prod"]::before{background:var(--stg-prod)}
.chip[data-stage="frozen"]::before{background:var(--stg-frozen)}

.set-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; margin-bottom:14px}
.set{background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-s); padding:9px 12px}
.set .lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px; margin-bottom:6px}
.set input.txt{width:100%; background:var(--bg-deep); border:1px solid var(--b-1); color:var(--text); padding:5px 8px; border-radius:5px; font-size:12px}
.set input.txt:focus{outline:none; border-color:var(--accent-border)}
.set .row{display:flex; align-items:center; gap:8px}
.toggle{display:inline-flex; align-items:center; gap:6px; cursor:pointer; user-select:none}
.toggle input{display:none}
.toggle .sw{width:32px; height:18px; background:var(--bg-deep); border-radius:9px; position:relative; transition:.15s; border:1px solid var(--b-2)}
.toggle .sw::after{content:""; position:absolute; top:2px; left:2px; width:12px; height:12px; border-radius:50%; background:var(--text-3); transition:.15s}
.toggle input:checked + .sw{background:var(--accent-subtle); border-color:var(--accent-border)}
.toggle input:checked + .sw::after{transform:translateX(14px); background:var(--accent-elec)}
.toggle .nm{font-size:12px; color:var(--text)}

/* Process strips (4 для банка, 3 для платформы) */
.procs{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:10px}
.proc{background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-s); padding:11px 13px}
.proc-h{display:flex; align-items:center; gap:8px; margin-bottom:9px}
.proc-h .nm{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--accent-light)}
.proc-h .spacer{flex:1}
.proc-h .pct{font-size:11px; color:var(--text-2); font-weight:700}
.proc-bar{height:3px; background:var(--bg-deep); border-radius:2px; overflow:hidden; margin-bottom:9px}
.proc-bar span{display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--accent-elec))}
.proc-steps{display:flex; gap:5px; flex-wrap:wrap}
.pstep{display:inline-flex; align-items:center; gap:5px; padding:4px 9px; border-radius:5px; font-size:10.5px; font-weight:600; cursor:pointer; border:1px solid var(--b-1); background:var(--bg-main); user-select:none; transition:.15s; white-space:nowrap}
.pstep:hover{filter:brightness(1.15)}
.pstep .ic{font-weight:900}
.pstep.s-none{color:var(--text-3)}
.pstep.s-wip{background:rgba(224,169,59,.14); color:#F0C170; border-color:rgba(224,169,59,.30)}
.pstep.s-done{background:rgba(0,200,170,.14); color:var(--accent-elec); border-color:rgba(0,200,170,.30)}
.pstep.s-block{background:rgba(217,87,111,.14); color:#F08A9D; border-color:rgba(217,87,111,.30)}
.pstep.s-na{background:var(--bg-deep); color:var(--text-4); opacity:.6}

/* ───── Matrix ───── */
.mwrap{overflow-x:auto; background:var(--bg-deep); border:1px solid var(--b-1); border-radius:var(--r-m); padding:8px}
.mtable{border-collapse:separate; border-spacing:0; min-width:100%}
.mtable th, .mtable td{padding:5px 6px; text-align:center; font-size:11px; border-right:1px solid var(--b-1); border-bottom:1px solid var(--b-1)}
.mtable thead th{background:var(--bg-elev); color:var(--text-2); font-weight:700; position:sticky; top:0; z-index:2; vertical-align:bottom; height:120px; white-space:nowrap}
.mtable thead th .rot{display:inline-block; transform:rotate(-60deg); transform-origin:left bottom; padding-left:4px; max-width:100px; font-size:10.5px}
.mtable thead th.bgrp{background:var(--bg-deep); color:var(--text-3); height:auto; padding:6px 4px}
.mtable tbody th{text-align:left; padding:7px 10px; background:var(--bg-elev); position:sticky; left:0; z-index:1; font-weight:700; color:var(--text); min-width:130px}
.mtable td{cursor:pointer; transition:.1s; background:var(--bg-main); min-width:34px}
.mtable td:hover{background:var(--bg-hover)}
.mtable td.on{background:rgba(0,200,170,.14); color:var(--accent-elec); font-weight:700}
.mtable td.mvp{background:rgba(217,87,111,.18); color:#F08A9D; font-weight:700}
.mtable .gh{background:var(--bg-deep); color:var(--text-3); font-size:10px; text-transform:uppercase; letter-spacing:.4px; padding:6px 8px; text-align:left; font-weight:700}

/* ───── Tech board (Kanban) ───── */
.kboard{display:grid; grid-template-columns:repeat(5,1fr); gap:12px}
.kcol{background:var(--bg-deep); border:1px solid var(--b-1); border-radius:var(--r-m); padding:10px; min-height:200px; display:flex; flex-direction:column}
.kcol-h{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding-bottom:8px; border-bottom:1px dashed var(--b-1)}
.kcol-h .nm{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--text-2)}
.kcol-h .cnt{font-size:10px; color:var(--text-3); background:var(--bg-elev); padding:1px 6px; border-radius:8px}
.kcol-body{display:flex; flex-direction:column; gap:8px; flex:1}
.kcard{padding:10px 12px; background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-s); cursor:grab; transition:.15s}
.kcard:active{cursor:grabbing}
.kcard:hover{background:var(--bg-hover); border-color:var(--accent-border)}
.kcard.dragging{opacity:.35; cursor:grabbing}
.kcol.drop-over{background:rgba(0,200,170,.06); border-color:var(--accent-border)}
.kcol.drop-over .kcol-body{outline:2px dashed var(--accent-border); outline-offset:-3px; border-radius:8px; min-height:30px}
.kcard .ttl{font-size:12px; font-weight:600; margin-bottom:4px; color:var(--text)}
.kcard .desc{font-size:11px; color:var(--text-3); line-height:1.4; max-height:32px; overflow:hidden}
.kcard .meta{display:flex; gap:6px; margin-top:7px; align-items:center; flex-wrap:wrap}
.kcard .pchip{font-size:9px; font-weight:700; padding:1px 5px; border-radius:3px}
.kcard .pchip.P1{background:rgba(217,87,111,.18); color:#F08A9D}
.kcard .pchip.P2{background:rgba(224,169,59,.18); color:#F0C170}
.kcard .pchip.P3{background:rgba(122,188,184,.18); color:var(--accent-light)}
.kcard .tag{font-size:9px; color:var(--text-3); background:var(--bg-deep); padding:1px 6px; border-radius:3px; text-transform:uppercase; letter-spacing:.3px}
.kcard .tracker-chip{display:inline-flex; align-items:center; gap:3px; padding:1px 6px; border-radius:3px; font-size:9.5px; font-weight:700; background:rgba(74,148,144,.16); color:var(--accent-light); border:1px solid var(--accent-border); text-decoration:none; cursor:pointer}
.kcard .tracker-chip:hover{background:rgba(74,148,144,.32); color:var(--text)}
.kadd{padding:8px; border:1px dashed var(--b-2); border-radius:var(--r-s); color:var(--text-3); font-size:11px; font-weight:600; text-align:center; cursor:pointer; transition:.15s}
.kadd:hover{color:var(--accent-light); border-color:var(--accent-border); background:var(--accent-subtle)}

/* ───── Business tasks (внутри карточек банка/провайдера) ───── */
.biz-section{margin-top:14px; background:var(--bg-elev); border:1px solid var(--b-1); border-radius:var(--r-m); padding:12px 14px}
.biz-section-h{display:flex; align-items:center; gap:10px; margin-bottom:10px}
.biz-section-h .nm{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--accent-light)}
.biz-section-h .cnt{font-size:10px; color:var(--text-3); background:var(--bg-deep); padding:1px 6px; border-radius:8px}
.biz-list{display:flex; flex-direction:column; gap:6px}
.biz-row{display:grid; grid-template-columns:minmax(180px,2fr) 100px 120px 100px minmax(140px,1.5fr) 32px; gap:8px; align-items:center; padding:7px 9px; background:var(--bg-deep); border:1px solid var(--b-1); border-radius:6px; transition:.15s}
.biz-row:hover{border-color:var(--accent-border)}
.biz-row input.txt{width:100%; background:var(--bg-main); border:1px solid var(--b-1); color:var(--text); padding:5px 8px; border-radius:5px; font-size:12px}
.biz-row input.txt:focus{outline:none; border-color:var(--accent-border)}
.biz-row .biz-st{position:relative; padding:5px 8px; border-radius:5px; font-size:11px; font-weight:700; text-align:center; cursor:pointer; border:1px solid var(--b-1); user-select:none; transition:.15s}
.biz-row .biz-st:hover{filter:brightness(1.15)}
.biz-row .biz-st.s-todo{background:var(--bg-main); color:var(--text-2)}
.biz-row .biz-st.s-wip{background:rgba(224,169,59,.14); color:#F0C170; border-color:rgba(224,169,59,.30)}
.biz-row .biz-st.s-done{background:rgba(0,200,170,.14); color:var(--accent-elec); border-color:rgba(0,200,170,.30)}
.biz-row .biz-st.s-block{background:rgba(217,87,111,.14); color:#F08A9D; border-color:rgba(217,87,111,.30)}
.biz-row .biz-st.overdue{box-shadow:0 0 0 1px rgba(217,87,111,.4)}
.biz-row.is-done input.txt{opacity:.55}
.biz-row .biz-del{color:#F08A9D; font-size:14px; cursor:pointer; padding:4px 6px; border-radius:4px; text-align:center}
.biz-row .biz-del:hover{background:rgba(217,87,111,.10)}
.biz-empty{padding:10px; text-align:center; color:var(--text-4); font-style:italic; font-size:11px}
.biz-add{padding:6px 10px; border:1px dashed var(--b-2); border-radius:5px; color:var(--text-3); font-size:11px; font-weight:600; text-align:center; cursor:pointer; transition:.15s}
.biz-add:hover{color:var(--accent-light); border-color:var(--accent-border); background:var(--accent-subtle)}

/* ───── Business tasks aggregated board ───── */
.biz-board{display:grid; grid-template-columns:repeat(4,1fr); gap:12px}
@media (max-width:1100px){ .biz-board{grid-template-columns:repeat(2,1fr)} }
.biz-col{background:var(--bg-deep); border:1px solid var(--b-1); border-radius:var(--r-m); padding:10px; min-height:200px; display:flex; flex-direction:column}
.biz-col-h{display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; padding-bottom:8px; border-bottom:1px dashed var(--b-1)}
.biz-col-h .nm{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px; color:var(--text-2)}
.biz-col-h .cnt{font-size:10px; color:var(--text-3); background:var(--bg-elev); padding:1px 6px; border-radius:8px}
.biz-col-body{display:flex; flex-direction:column; gap:8px}
.biz-card{padding:10px 12px; background:var(--bg-elev); border:1px solid var(--b-1); border-radius:6px; cursor:grab; transition:.15s}
.biz-card:active{cursor:grabbing}
.biz-card:hover{background:var(--bg-hover); border-color:var(--accent-border)}
.biz-card.dragging{opacity:.35}
.biz-col.drop-over{background:rgba(0,200,170,.06); border-color:var(--accent-border)}
.biz-col.drop-over .biz-col-body{outline:2px dashed var(--accent-border); outline-offset:-3px; border-radius:8px; min-height:30px}
.biz-card .src{font-size:9px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px; margin-bottom:3px; display:flex; align-items:center; gap:5px}
.biz-card .src .tg{font-size:9px; padding:1px 5px; border-radius:3px; font-weight:700}
.biz-card .src .tg.bank{background:rgba(74,148,144,.18); color:var(--accent-light)}
.biz-card .src .tg.plat{background:rgba(196,154,224,.18); color:#C49AE0}
.biz-card .ttl{font-size:12px; font-weight:600; color:var(--text); margin-bottom:4px}
.biz-card .row{display:flex; gap:8px; align-items:center; font-size:10.5px; color:var(--text-3); flex-wrap:wrap}
.biz-card .row .dt{font-weight:700}
.biz-card .row .dt.overdue{color:#F08A9D}
.biz-card .row .dt.soon{color:#F0C170}
.biz-card .cmt{margin-top:4px; font-size:10.5px; color:var(--text-3); line-height:1.4; max-height:32px; overflow:hidden}

/* DnD-плейсхолдер для приоритета в воронке */
.bank-pin.drop-marker-top{box-shadow:inset 0 2px 0 0 var(--accent-elec)}
.bank-pin.drop-marker-bot{box-shadow:inset 0 -2px 0 0 var(--accent-elec)}
.biz-row.drop-marker-top{box-shadow:inset 0 2px 0 0 var(--accent-elec)}
.biz-row.drop-marker-bot{box-shadow:inset 0 -2px 0 0 var(--accent-elec)}

/* Auto-textarea: схлопывается до 1 строки, при focus растёт */
.txta{width:100%; background:var(--bg-deep); border:1px solid var(--b-1); color:var(--text); padding:5px 8px; border-radius:5px; font-size:12px; font-family:inherit; resize:none; line-height:1.45; overflow:hidden; min-height:26px; max-height:26px; transition:max-height .15s}
.txta:focus{outline:none; border-color:var(--accent-border); max-height:200px; overflow:auto}
.txta.expanded{max-height:200px; overflow:auto}
.txta.has-overflow{background-image:linear-gradient(to top,var(--bg-elev) 0,transparent 6px); background-repeat:no-repeat; background-size:100% 6px; background-position:bottom}
.set .txta{background:var(--bg-deep)}

/* В biz-row textarea-комментарии должны быть выровнены по центру вертикали */
.biz-row .txta{min-height:26px}

/* Перенос даты в задаче (бейдж) */
.biz-postpone{display:inline-flex; align-items:center; gap:3px; padding:1px 5px; border-radius:3px; font-size:9px; font-weight:700; background:rgba(217,87,111,.16); color:#F08A9D; border:1px solid rgba(217,87,111,.30); cursor:help; user-select:none}
.biz-row .biz-due-wrap{display:flex; flex-direction:column; gap:2px; align-items:flex-start}

/* Date input — приятный clickable look */
.biz-row input[type="date"]{cursor:pointer}
.biz-row input[type="date"]:hover{border-color:var(--accent-border)}
.biz-row input[type="date"]::-webkit-calendar-picker-indicator{cursor:pointer; opacity:.8}
.biz-row input[type="date"]::-webkit-calendar-picker-indicator:hover{opacity:1}

/* //-триггер: всплывающий date picker */
.slash-date{position:fixed; z-index:210; background:var(--bg-elev); border:1px solid var(--accent-border); border-radius:8px; padding:8px 12px; box-shadow:0 8px 24px rgba(0,0,0,.6); color:var(--text); font-size:12px; display:flex; align-items:center; gap:8px}
.slash-date input{background:var(--bg-deep); border:1px solid var(--b-1); color:var(--text); padding:4px 8px; border-radius:5px; font-size:13px; font-family:inherit}
.slash-date .lbl{color:var(--text-3); font-size:10px; text-transform:uppercase; letter-spacing:.5px}

/* Скрыть выполненные — чекбокс */
.biz-hide-done{display:inline-flex; align-items:center; gap:6px; cursor:pointer; font-size:11px; color:var(--text-3); user-select:none}
.biz-hide-done input{margin:0}
.biz-hide-done:hover{color:var(--text-2)}

/* Контакты — пиктограмма у банка/провайдера */
.contacts-chip{display:inline-flex; align-items:center; gap:4px; padding:2px 7px; border-radius:5px; font-size:11px; font-weight:700; background:rgba(74,148,144,.16); color:var(--accent-light); border:1px solid var(--accent-border); cursor:pointer; transition:.15s; user-select:none}
.contacts-chip:hover{background:rgba(74,148,144,.30); color:var(--text)}
.contacts-chip.empty{background:transparent; color:var(--text-3); border-style:dashed}
.contacts-chip.empty:hover{color:var(--accent-light)}
.bank-pin .contacts-chip{font-size:9px; padding:1px 5px; margin-top:4px}

/* Telegram-чип (ссылка на чат с компанией) */
.tg-chip{display:inline-flex; align-items:center; gap:3px; padding:2px 7px; border-radius:5px; font-size:11px; font-weight:700; background:rgba(46,141,192,.16); color:#4AB8E0; border:1px solid rgba(46,141,192,.40); cursor:pointer; transition:.15s; text-decoration:none; user-select:none}
.tg-chip:hover{background:rgba(46,141,192,.30); color:var(--text)}
.bank-pin .tg-chip{font-size:9px; padding:1px 5px}
[data-theme="light"] .tg-chip{background:rgba(46,141,192,.10); color:#1F76A8; border-color:rgba(46,141,192,.45)}
[data-theme="light"] .tg-chip:hover{background:rgba(46,141,192,.22); color:#0E5A86}

/* Контакты — модалка */
.contacts-list{max-height:65vh; overflow:auto; display:flex; flex-direction:column; gap:10px; padding-right:6px}
.contact-card{background:var(--bg-deep); border:1px solid var(--b-1); border-radius:10px; padding:12px 14px}
.contact-card-h{display:flex; align-items:center; gap:8px; margin-bottom:10px}
.contact-card-h .num{width:22px; height:22px; border-radius:50%; background:var(--accent-subtle); color:var(--accent-light); font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0}
.contact-card-h .nm{font-size:13px; font-weight:700; flex:1}
.contact-card .grid{display:grid; grid-template-columns:repeat(2,1fr); gap:8px}
.contact-card .grid .full{grid-column:span 2}
.contact-card .grid label{display:flex; flex-direction:column; gap:3px}
.contact-card .grid .lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px}
.contact-card .grid input, .contact-card .grid textarea{background:var(--bg-elev); border:1px solid var(--b-1); color:var(--text); padding:6px 9px; border-radius:5px; font-size:12px; font-family:inherit; width:100%}
.contact-card .grid input:focus, .contact-card .grid textarea:focus{outline:none; border-color:var(--accent-border)}
.contact-card .grid textarea{min-height:50px; resize:vertical}
.contact-card-add{padding:8px; border:1px dashed var(--b-2); border-radius:6px; color:var(--text-3); font-size:11px; font-weight:600; text-align:center; cursor:pointer; transition:.15s}
.contact-card-add:hover{color:var(--accent-light); border-color:var(--accent-border); background:var(--accent-subtle)}

/* ───── Feedback overlay (режим выделения области для замечаний) ───── */
body.fb-mode{cursor:crosshair}
.fb-overlay{position:fixed; inset:0; z-index:99; cursor:crosshair; background:var(--accent-subtle); user-select:none}
.fb-hint{position:fixed; top:14px; left:50%; transform:translateX(-50%); background:var(--bg-elev); border:1px solid var(--accent-border); padding:8px 14px; border-radius:8px; font-size:12px; display:flex; align-items:center; gap:10px; z-index:101; box-shadow:0 6px 18px rgba(0,0,0,.4)}
.fb-hint b{color:var(--accent-light)}
.fb-rect{position:fixed; border:2px solid var(--accent-elec); background:rgba(0,200,170,0.10); pointer-events:none; box-shadow:0 0 0 9999px var(--overlay-bg)}

/* ───── Feedback list (раздел Развитие) ───── */
.fb-list{display:flex; flex-direction:column}
.fb-card{background:var(--bg-deep); border:1px solid var(--b-1); border-radius:var(--r-m); padding:12px 14px; margin-bottom:8px; transition:.15s}
.fb-card:hover{border-color:var(--accent-border)}
.fb-card-h{display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap}
.fb-tab{font-size:10px; padding:2px 8px; border-radius:4px; background:var(--accent-subtle); color:var(--accent-light); border:1px solid var(--accent-border); font-weight:700; text-transform:uppercase; letter-spacing:.4px}
.fb-sev{font-size:10px; padding:2px 8px; border-radius:4px; font-weight:700; text-transform:uppercase; letter-spacing:.4px}
.fb-sev.fb-sev-low{background:rgba(122,188,184,.14); color:var(--accent-light)}
.fb-sev.fb-sev-med{background:rgba(224,169,59,.14); color:#F0C170}
.fb-sev.fb-sev-high{background:rgba(217,87,111,.14); color:#F08A9D}
.fb-target{font-size:10px; padding:2px 8px; border-radius:4px; background:var(--bg-elev); color:var(--text-3); border:1px solid var(--b-1); max-width:260px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.fb-comment{font-size:13px; color:var(--text); line-height:1.5; margin-bottom:10px; white-space:pre-wrap}
.fb-actions{display:flex; gap:6px; flex-wrap:wrap}
.fb-group-title{font-size:11px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px; margin:14px 0 8px}

/* ───── Chats (вид как в Telegram) ───── */
.chat-layout{display:grid; grid-template-columns:330px 1fr; height:76vh; min-height:460px; border:1px solid var(--b-1); border-radius:var(--r-m); overflow:hidden}
/* Когда открыты Чаты — раскладка на всю высоту экрана: страница не прокручивается,
   скроллятся только список и лента, поле ввода зафиксировано. (:has — совр. браузеры;
   иначе работает запасной вариант с 76vh, где внутренняя прокрутка тоже уже чинится.) */
.main:has(#tab-chats.active){height:100vh}
.main:has(#tab-chats.active) .content{flex:1; min-height:0; overflow:hidden; padding-bottom:16px}
#tab-chats.active{height:100%}
.main:has(#tab-chats.active) .chat-layout{height:100%; min-height:0}
.chat-list-pane{display:flex; flex-direction:column; background:var(--bg-main); border-right:1px solid var(--b-1); min-width:0; min-height:0}
.chat-search{padding:9px 10px; border-bottom:1px solid var(--b-1)}
.chat-search input{width:100%; padding:8px 14px; font-size:13px; border:0; border-radius:18px; background:var(--bg-elev); color:var(--text); outline:none}
.chat-search input::placeholder{color:var(--text-3)}
#chatList{overflow-y:auto; flex:1; min-height:0}

/* элемент списка */
.chat-item{display:flex; gap:11px; align-items:center; padding:7px 10px; cursor:pointer}
.chat-item:hover{background:var(--bg-hover)}
.chat-item.active{background:var(--accent-subtle)}
.chat-avatar{width:48px; height:48px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:600; font-size:17px}
.chat-item-body{flex:1; min-width:0; display:flex; flex-direction:column; gap:2px}
.chat-item-row{display:flex; align-items:center; gap:6px}
.chat-item-name{flex:1; font-size:14px; font-weight:600; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-item-time{font-size:11px; color:var(--text-3); flex-shrink:0}
.chat-item-prev{flex:1; font-size:12.5px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-item-unread{background:var(--accent-elec); color:#04110f; font-size:11px; font-weight:700; border-radius:11px; padding:0 6px; min-width:20px; height:20px; display:flex; align-items:center; justify-content:center; flex-shrink:0}
.chat-item-tag{font-size:11px; color:var(--accent-light); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-item-tag.unlinked{color:var(--st-wip)}

/* тред */
.chat-thread-pane{display:flex; flex-direction:column; min-width:0; min-height:0; background:var(--bg-deep);
  background-image:radial-gradient(circle at 20% 12%, rgba(74,148,144,.06) 0, transparent 42%), radial-gradient(circle at 82% 78%, rgba(74,148,144,.05) 0, transparent 46%)}
.chat-empty{margin:auto; max-width:340px; text-align:center; color:var(--text-3); font-size:13px; padding:20px}
.chat-thread{display:flex; flex-direction:column; height:100%; min-height:0}
.chat-thread-head{display:flex; align-items:center; gap:11px; padding:8px 14px; background:var(--bg-elev); border-bottom:1px solid var(--b-1)}
.chat-head-av{width:38px; height:38px; border-radius:50%; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; font-weight:600; font-size:14px}
.chat-head-info{flex:1; min-width:0}
.chat-thread-title{font-size:14px; font-weight:600; color:var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-head-sub{font-size:12px; color:var(--text-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.chat-head-sub a{color:var(--accent-light)}

/* сообщения */
.chat-messages{flex:1; overflow-y:auto; min-height:0; padding:14px 16px 8px; display:flex; flex-direction:column}
.chat-date{align-self:center; margin:10px 0 6px; font-size:11px; font-weight:600; color:var(--text-2); background:rgba(8,12,18,.55); padding:3px 11px; border-radius:12px}
.chat-msg{max-width:72%; padding:6px 10px 5px; border-radius:14px; font-size:13.5px; line-height:1.4; word-wrap:break-word; margin-top:2px}
.chat-msg::after{content:""; display:block; clear:both}
.chat-msg.grp{margin-top:9px}
.chat-msg.in{align-self:flex-start; background:var(--bg-elev); color:var(--text); border-bottom-left-radius:5px}
.chat-msg.out{align-self:flex-end; background:var(--accent); color:#fff; border-bottom-right-radius:5px}
.chat-msg .who{font-size:12.5px; font-weight:600; margin-bottom:1px}
.chat-msg .txt{white-space:pre-wrap}
.chat-msg .time{float:right; font-size:10px; color:var(--text-3); margin:5px 0 -1px 9px}
.chat-msg.out .time{color:rgba(255,255,255,.72)}
.chat-msg a.media{color:inherit; font-weight:600; text-decoration:underline}

/* упоминания */
.chat-msg .mention{color:var(--accent-elec); font-weight:600}
.chat-msg.out .mention{color:#DDFFF7}
.mention-popup{position:absolute; bottom:calc(100% + 8px); left:12px; right:64px; max-height:230px; overflow-y:auto;
  background:var(--bg-elev); border:1px solid var(--b-2); border-radius:10px; box-shadow:var(--shadow-card); z-index:30}
.mention-item{display:flex; align-items:center; gap:9px; padding:7px 10px; cursor:pointer; font-size:13px; min-width:0; overflow:hidden}
.mention-item.on,.mention-item:hover{background:var(--bg-hover)}
.mention-av{width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:11px; font-weight:600; flex-shrink:0}
.mention-name{color:var(--text); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0}
.mention-user{color:var(--accent-light); margin-left:auto; flex-shrink:0; white-space:nowrap}
.mention-none{color:var(--text-3); font-size:11px; margin-left:auto; flex-shrink:0; white-space:nowrap}

/* поле ответа */
.chat-reply{position:relative; display:flex; gap:8px; padding:9px 12px; border-top:1px solid var(--b-1); align-items:flex-end; background:var(--bg-elev)}
.chat-reply textarea{flex:1; resize:none; max-height:120px; padding:9px 15px; font-size:13.5px; border:0; border-radius:18px; background:var(--bg-main); color:var(--text); font-family:inherit; outline:none; line-height:1.4}
.chat-reply textarea::placeholder{color:var(--text-3)}
.chat-send{width:40px; height:40px; border-radius:50%; background:var(--accent); color:#fff; font-size:15px; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:.15s}
.chat-send:hover{background:var(--accent-light)}

.chat-searchres{padding:10px 12px; border-bottom:1px solid var(--b-1); cursor:pointer; font-size:12px}
.chat-searchres:hover{background:var(--bg-hover)}
.chat-searchres b{color:var(--accent-elec)}

/* ───── Аккаунт / пользователи ───── */
.acc-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:6px}
.usr-list{display:flex; flex-direction:column; gap:6px; max-height:52vh; overflow-y:auto}
.usr-row{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 10px; border:1px solid var(--border); border-radius:8px; background:var(--surface-2)}
.usr-main{display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0}
.usr-name{font-weight:600; color:var(--text-1)}
.usr-acts{display:flex; gap:6px; flex-shrink:0}
.usr-badge{font-size:10px; text-transform:uppercase; letter-spacing:.3px; padding:2px 7px; border-radius:10px; background:var(--border); color:var(--text-2)}
.usr-badge.admin{background:var(--accent); color:#fff}

/* ───── Modal ───── */
.modal-bg{position:fixed; inset:0; background:var(--overlay-bg); z-index:100; display:none; align-items:center; justify-content:center; backdrop-filter:blur(6px); animation:fadeIn .15s}
.modal-bg.open{display:flex}
.modal{background:var(--bg-elev); border:1px solid var(--accent-border); border-radius:var(--r-l); padding:22px; max-width:520px; width:92%; box-shadow:0 24px 60px rgba(0,0,0,.6)}
.modal.modal-wide{max-width:1080px}
.parsed-list{max-height:65vh; overflow:auto; display:flex; flex-direction:column; gap:10px; padding-right:6px}
.parsed-row{background:var(--bg-deep); border:1px solid var(--b-1); border-radius:10px; padding:14px 16px; transition:.15s}
.parsed-row.off{opacity:.42}
.parsed-row .top{display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; margin-bottom:14px}
.parsed-row .name-input{background:var(--bg-elev); border:1px solid var(--b-2); color:var(--text); padding:8px 12px; border-radius:6px; font-size:13px; font-weight:600; width:100%}
.parsed-row .name-input:focus{outline:none; border-color:var(--accent-border)}
.parsed-row .group-chips{display:flex; gap:4px; flex-shrink:0}
.parsed-row .field-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:10px}
.parsed-row .field-grid > div{display:flex; flex-direction:column; gap:4px}
.parsed-row .field-grid .lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px}
.parsed-row .field-grid input{background:var(--bg-elev); border:1px solid var(--b-2); color:var(--text); padding:7px 10px; border-radius:5px; font-size:12.5px}
.parsed-row .field-grid input:focus{outline:none; border-color:var(--accent-border)}
.parsed-row .note-row{margin-top:10px; display:flex; flex-direction:column; gap:4px}
.parsed-row .note-row .lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.5px}
.parsed-row .note-row input{background:var(--bg-elev); border:1px solid var(--b-2); color:var(--text); padding:7px 10px; border-radius:5px; font-size:12.5px; width:100%}
.parsed-row .note-row input:focus{outline:none; border-color:var(--accent-border)}
.parsed-bulk{display:flex; align-items:center; gap:10px; margin-bottom:10px; padding:8px 12px; background:var(--bg-deep); border:1px solid var(--b-1); border-radius:8px}
.parsed-bulk .muted{font-size:11px}
.modal h3{font-size:15px; font-weight:700; margin-bottom:14px}
.modal-row{margin-bottom:12px}
.modal-row .lbl{font-size:10px; color:var(--text-3); text-transform:uppercase; letter-spacing:.4px; margin-bottom:5px}
.modal-row input, .modal-row textarea{width:100%; background:var(--bg-deep); border:1px solid var(--b-1); color:var(--text); padding:7px 10px; border-radius:6px; font-size:12.5px; font-family:inherit}
.modal-row input:focus, .modal-row textarea:focus{outline:none; border-color:var(--accent-border)}
.modal-row textarea{min-height:70px; resize:vertical}
.modal-foot{display:flex; gap:8px; justify-content:flex-end; margin-top:16px}
.modal .move-row{display:flex; gap:6px; flex-wrap:wrap}

/* ───── Onboarding ───── */
.welcome{background:var(--bg-elev); border:1px dashed var(--accent-border); border-radius:var(--r-l); padding:30px; text-align:center; margin-bottom:20px}
.welcome h2{font-size:18px; font-weight:700; margin-bottom:10px}
.welcome p{color:var(--text-2); margin-bottom:16px; max-width:560px; margin-left:auto; margin-right:auto}
.welcome .actions{display:flex; gap:10px; justify-content:center; flex-wrap:wrap}

.hint{padding:10px 12px; background:rgba(122,188,184,.06); border:1px dashed var(--accent-border); border-radius:8px; color:var(--text-2); font-size:11.5px; margin-bottom:14px}
.hint b{color:var(--text)}

/* ───── Blocking loader (для AI и других долгих операций) ───── */
.loader-bg{position:fixed; inset:0; background:var(--overlay-bg-strong); z-index:300; display:none; align-items:center; justify-content:center; backdrop-filter:blur(8px); animation:fadeIn .15s}
.loader-bg.open{display:flex}
.loader-card{background:var(--bg-elev); border:1px solid var(--accent-border); border-radius:var(--r-l); padding:32px 40px; text-align:center; max-width:440px; box-shadow:0 24px 60px rgba(0,0,0,.6)}
.spinner{width:54px; height:54px; border:3px solid var(--accent-subtle); border-top-color:var(--accent-elec); border-right-color:var(--accent-light); border-radius:50%; margin:0 auto 22px; animation:spin 1s linear infinite; box-shadow:0 0 24px rgba(0,200,170,.20)}
@keyframes spin{to{transform:rotate(360deg)}}
.loader-title{font-size:16px; font-weight:700; color:var(--text); margin-bottom:8px}
.loader-sub{font-size:12px; color:var(--text-2); margin-bottom:14px; min-height:18px}
.loader-meter{height:3px; background:var(--bg-deep); border-radius:2px; overflow:hidden; margin-top:6px}
.loader-meter span{display:block; height:100%; background:linear-gradient(90deg,var(--accent),var(--accent-elec)); animation:meterPulse 2s ease-in-out infinite; width:35%}
@keyframes meterPulse{0%,100%{transform:translateX(-100%)} 50%{transform:translateX(280%)}}

.toast{position:fixed; bottom:24px; right:24px; background:var(--bg-elev); border:1px solid var(--accent-border); border-radius:var(--r-s); padding:10px 14px; font-size:12px; color:var(--text); z-index:200; display:none; box-shadow:0 8px 24px rgba(0,0,0,.4)}
.toast.show{display:block; animation:slideUp .2s}
.toast.error{border-color:rgba(217,87,111,.4); background:rgba(217,87,111,.10)}
@keyframes slideUp{from{opacity:0; transform:translateY(8px)} to{opacity:1}}

/* small visual helpers */
.row-flex{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.spacer{flex:1}
.muted{color:var(--text-3); font-size:11px}
.del-btn{color:#F08A9D; font-size:11px; padding:3px 8px; border-radius:5px}
.del-btn:hover{background:rgba(217,87,111,.10)}

/* Search */
.searchbar{display:flex; align-items:center; gap:6px; background:var(--bg-deep); border:1px solid var(--b-1); border-radius:var(--r-s); padding:5px 10px; min-width:200px}
.searchbar input{flex:1; background:transparent; border:none; color:var(--text); font-size:12px; outline:none}
.searchbar .ic{color:var(--text-3)}

@media (max-width:1100px){
  .pipeline{grid-template-columns:repeat(4,1fr)}
  .kboard{grid-template-columns:repeat(2,1fr)}
  .kpis{grid-template-columns:repeat(2,1fr)}
}

/* ───── Мобильный адаптив ───── */
@media (max-width:760px){
  /* Скрываем неоперативное — фокус на просмотре и задачах */
  .tabs .tab[data-tab="services"],
  .tabs .tab[data-tab="matrix"],
  .tabs .tab[data-tab="tech"]{ display:none }
  /* В раскрытой карточке скрываем большой блок процессов — на мобиле его всё равно неудобно править */
  .ebody .procs{ display:none }
  /* Подсказка-строка под KPI — на мобиле занимает место */
  .kpis > div[style*="grid-column:span 5"]{ display:none !important }
  /* Курсоры DnD сбрасываем — на мобиле перетаскивания нет */
  .bank-pin, .biz-card, .kcard{ cursor:pointer !important }
  .bank-pin:active, .biz-card:active, .kcard:active{ cursor:pointer !important }
  .biz-row{ cursor:default !important }

  /* Контейнер */
  .app{padding:10px}
  body{font-size:13px}

  /* Шапка — в столбик */
  .header{flex-direction:column; align-items:stretch; gap:10px; padding:12px 14px}
  .logo h1{font-size:15px}
  .logo .sub{display:none}
  .hdr-right{flex-wrap:wrap; gap:6px; justify-content:flex-start}
  .hdr-right input#authorInput{flex:1; min-width:120px; width:auto !important}
  .file-chip{flex:1; min-width:0}
  .file-chip .name{overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
  .btn{font-size:12px}

  /* Вкладки — горизонтальный скролл */
  .tabs{overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; gap:0; padding-bottom:2px; margin-bottom:14px}
  .tabs::-webkit-scrollbar{height:4px}
  .tab{padding:9px 12px; font-size:12px; flex-shrink:0; white-space:nowrap}
  .tab .badge{min-width:16px; height:16px; font-size:9px}

  /* KPI — 2 в ряд + компакт */
  .kpis{grid-template-columns:repeat(2,1fr); gap:8px}
  .kpi{padding:10px 12px}
  .kpi .val{font-size:20px}
  .kpi .lbl{font-size:9px}
  .kpi .delta{font-size:10px}
  /* Подсказка под табло — мельче и плотнее */
  .kpis > div[style*="grid-column:span 5"]{grid-column:span 2 !important; flex-direction:column; gap:4px !important; font-size:10px !important}

  /* Панели */
  .panel{padding:14px 12px}
  .panel-title{font-size:13px; flex-wrap:wrap; gap:8px}
  .panel-title .sub{font-size:10px; flex-basis:100%}

  /* Воронки — стек, лимит высоты убран */
  .pipeline{grid-template-columns:1fr; gap:10px}
  .lane{min-height:auto}
  .lane-body{min-height:30px}

  /* Канбан-доски — стек */
  .kboard{grid-template-columns:1fr; gap:10px}
  .biz-board{grid-template-columns:1fr; gap:10px}
  .kcol, .biz-col{min-height:auto}

  /* ehead карточки — компактнее, прогресс-бар скрываем (виден в раскрытой карточке) */
  .ehead{grid-template-columns:auto 1fr auto; gap:8px; padding:10px 12px}
  .ehead > div:nth-child(3){display:none}
  .ehead .eprog{display:none}
  .ehead .estage-chip{font-size:9px; padding:2px 6px}
  .etitle{font-size:13px; flex-wrap:wrap}
  .ecard.open{margin:14px 0}
  .ecard.open .ehead{top:0}
  .ebody{padding:12px 10px 14px}

  /* set-grid, procs — 1 колонка */
  .set-grid{grid-template-columns:1fr; gap:8px; margin-bottom:10px}
  .procs{grid-template-columns:1fr}

  /* biz-row — 2 колонки, title на всю ширину */
  .biz-row{grid-template-columns:1fr 1fr; gap:6px; padding:8px 9px}
  .biz-row > input[data-fld="title"]{grid-column:span 2}
  .biz-row > textarea[data-fld="comment"]{grid-column:span 2; max-height:24px}
  .biz-row > .biz-del{justify-self:end; align-self:start}

  /* biz-section header — стек */
  .biz-section-h{flex-wrap:wrap}
  .biz-hide-done{order:5; width:100%; margin-top:4px}

  /* biz-assignees */
  .biz-assignees{padding:8px 10px; gap:4px}
  .biz-assignee-chip{font-size:11px; padding:4px 8px 4px 5px}
  .biz-assignee-chip .avi{width:18px; height:18px; font-size:10px}

  /* Quick-nav — компактнее */
  .quick-nav{padding:8px 10px; margin:-14px -12px 12px; gap:5px}
  .qn-chip{font-size:10.5px; padding:3px 9px 3px 18px}
  .qn-chip::before{left:7px; width:6px; height:6px}

  /* Услуги — карточки */
  .ecard{margin-bottom:8px}

  /* Матрица — компактнее, scroll остаётся */
  .mtable thead th{height:90px; font-size:9.5px}
  .mtable thead th .rot{font-size:9.5px; max-width:80px}
  .mtable tbody th{min-width:100px; padding:6px 8px; font-size:11px}

  /* Модалки на всю ширину */
  .modal{padding:16px; max-width:96%; width:96%}
  .modal.modal-wide{max-width:96%}
  .modal-row input, .modal-row textarea{font-size:14px}
  /* Контакты */
  .contact-card .grid{grid-template-columns:1fr}
  .contact-card .grid .full{grid-column:span 1}
  /* Превью AI */
  .parsed-row .top{grid-template-columns:1fr; gap:8px}
  .parsed-row .field-grid{grid-template-columns:repeat(2,1fr)}

  /* Feedback */
  .fb-hint{font-size:11px; padding:6px 10px; flex-wrap:wrap; gap:6px; max-width:92%}
  .fb-card-h{flex-wrap:wrap}

  /* Поиск-бары */
  .searchbar{min-width:140px}
}

/* Очень узкие экраны (старые телефоны) */
@media (max-width:480px){
  .kpis{grid-template-columns:1fr}
  .kpis > div[style*="grid-column:span 5"]{grid-column:span 1 !important}
  .biz-row{grid-template-columns:1fr; gap:5px}
  .biz-row > input, .biz-row > textarea, .biz-row > .biz-st{grid-column:span 1 !important; min-width:0}
  .biz-row > input[data-fld="title"]{grid-column:span 1}
  .biz-row > textarea[data-fld="comment"]{grid-column:span 1; max-height:50px}
  .biz-row > .biz-due-wrap{grid-column:span 1}
  .biz-row > .biz-del{grid-column:span 1; justify-self:end}
  .parsed-row .field-grid{grid-template-columns:1fr}
  .ehead{grid-template-columns:auto 1fr; row-gap:4px}
  .ehead > div:nth-child(2){grid-column:span 2}
  .ehead .del-btn{grid-row:1; grid-column:2; justify-self:end}
  .header{padding:10px}
  .logo-mark{width:30px; height:30px}
  .modal{padding:14px}
  .kpi .val{font-size:22px}
}

/* ───── Мобильный сайдбар (off-canvas) ───── */
@media (max-width:760px){
  .sidebar{position:fixed; left:0; top:0; z-index:100; transform:translateX(-100%); width:236px; box-shadow:2px 0 24px rgba(0,0,0,.4)}
  .sidebar.open{transform:translateX(0)}
  .sidebar.collapsed{width:236px}
  .sidebar.collapsed .side-brand-name,
  .sidebar.collapsed .side-group,
  .sidebar.collapsed .side-sep,
  .sidebar.collapsed .side-nav .tab .lbl,
  .sidebar.collapsed .side-nav .tab .badge,
  .sidebar.collapsed .side-foot .file-chip{display:revert}
  .sidebar.collapsed .side-nav .tab{justify-content:flex-start; padding:9px 11px}
  .side-toggle{display:none}
  .side-toggle-m{display:inline-flex; align-items:center; justify-content:center}
  .side-backdrop{display:block; position:fixed; inset:0; z-index:99; background:rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:.2s}
  .side-backdrop.show{opacity:1; pointer-events:auto}
  .content{padding:14px}
  .topbar{padding:10px 14px}
}

/* ───── Master–detail (прототип для Банков/Провайдеров) ───── */
.view-toggle{display:inline-flex;gap:2px;margin:0 0 12px;padding:2px;background:var(--glass);border:1px solid var(--b-1);border-radius:var(--r-s)}
.vt-btn{padding:5px 12px;font-size:13px;border:none;background:transparent;color:var(--text-2);border-radius:6px;cursor:pointer}
.vt-btn:hover{color:var(--text)}
.vt-btn.on{background:var(--accent-subtle);color:var(--accent-light)}

.ms-split{display:grid;grid-template-columns:236px minmax(0,1fr);gap:14px;align-items:start}
.ms-rail{background:var(--bg-elev);border:1px solid var(--b-1);border-radius:var(--r-m);overflow:hidden;max-height:calc(100vh - 210px);overflow-y:auto}
.ms-rail-bar{display:flex;justify-content:flex-end;padding:4px 6px;border-bottom:1px solid var(--b-1);position:sticky;top:0;background:var(--bg-elev);z-index:1}
.ms-collapse{border:none;background:transparent;color:var(--text-3);cursor:pointer;font-size:13px;line-height:1;padding:3px 7px;border-radius:6px}
.ms-collapse:hover{background:var(--bg-hover);color:var(--text)}
.ms-row{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;border:none;border-bottom:1px solid var(--b-1);background:transparent;color:var(--text);font-size:13px;text-align:left;cursor:pointer}
.ms-row:last-child{border-bottom:none}
.ms-row:hover{background:var(--bg-hover)}
.ms-row.active{background:var(--accent-subtle)}
.ms-row.active .ms-name{color:var(--accent-light);font-weight:600}
.ms-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-av{width:26px;height:26px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:600;color:#fff;letter-spacing:.3px}

/* Свёрнутый рейл — только аватарки */
.ms-split.collapsed{grid-template-columns:56px minmax(0,1fr)}
.ms-split.collapsed .ms-name{display:none}
.ms-split.collapsed .ms-row{justify-content:center;padding:7px 0;gap:0}
.ms-split.collapsed .ms-rail-bar{justify-content:center}
.ms-split.collapsed .ms-av{width:32px;height:32px;font-size:12px}
.ms-split.collapsed .ms-row.active{background:transparent;box-shadow:inset 0 0 0 2px var(--accent)}

.ms-detail{background:var(--bg-elev);border:1px solid var(--b-1);border-radius:var(--r-m);padding:14px 16px;min-height:220px}
.ms-detail-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.ms-nav{display:inline-flex;gap:3px}
.ms-title{font-size:16px;font-weight:600}
.ms-head-slot{display:inline-flex;gap:6px;align-items:center}
.ms-detail-head .del-btn{margin-left:auto}
.ms-empty{color:var(--text-3);padding:24px;text-align:center}

@media (max-width:760px){
  .ms-split{grid-template-columns:1fr}
  .ms-rail{max-height:240px}
}

/* Drag-reorder индикаторы (рейл master–detail + kanban-карточки) */
.ms-row.ms-dragging{opacity:.4}
.ms-row.ms-drop-before{box-shadow:inset 0 2px 0 var(--accent-elec)}
.kcard.kdrop-before{box-shadow:inset 0 3px 0 var(--accent-elec)}

/* Вкладки внутри карточки master–detail (Профиль/Процесс/Задачи/Контакты/Услуги) */
.ms-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--b-1);margin-bottom:14px}
.ms-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border:none;background:transparent;color:var(--text-2);font-size:13px;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;border-radius:6px 6px 0 0}
.ms-tab:hover{color:var(--text);background:var(--bg-hover)}
.ms-tab.on{color:var(--accent-light);border-bottom-color:var(--accent)}
.ms-tab-badge{min-width:16px;height:16px;padding:0 5px;border-radius:8px;background:var(--accent-subtle);color:var(--accent-light);font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.ms-tab-content{min-height:120px}

/* Мини-чат внутри карточки партнёра (вкладка «Чаты») */
.ms-chat{display:flex;flex-direction:column;gap:10px}
.ms-chat-switch{display:flex;gap:4px;flex-wrap:wrap}
.ms-chat-tab{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid var(--b-1);background:var(--glass);color:var(--text-2);border-radius:var(--r-s);font-size:12px;cursor:pointer}
.ms-chat-tab:hover{color:var(--text)}
.ms-chat-tab.on{background:var(--accent-subtle);color:var(--accent-light);border-color:var(--accent-border)}
.ms-chat-unread{min-width:16px;height:16px;padding:0 5px;border-radius:8px;background:var(--accent-elec);color:#04140f;font-size:10px;font-weight:700;display:inline-flex;align-items:center;justify-content:center}
.ms-chat-msgs{display:flex;flex-direction:column;gap:0;max-height:400px;overflow-y:auto;padding:8px 4px;border:1px solid var(--b-1);border-radius:var(--r-m);background:var(--bg-main)}
.ms-chat-form{display:flex;gap:8px;align-items:flex-end}
.ms-chat-input{flex:1;resize:none;max-height:120px}
.ms-chat-send{flex:none}

/* Редактируемое название в шапке + логотип-аватар */
.ms-head-av{display:inline-flex;flex:none}
.ms-title-input{flex:1;min-width:0;font-size:16px;font-weight:600;color:var(--text);background:transparent;border:1px solid transparent;border-radius:6px;padding:4px 8px}
.ms-title-input:hover{border-color:var(--b-1)}
.ms-title-input:focus{border-color:var(--accent-border);background:var(--bg-main);outline:none}
.ms-av.has-logo{background-size:cover;background-position:center;color:transparent;border:1px solid var(--b-1)}
.logo-preview{display:inline-flex}
.logo-preview .ms-av{width:40px;height:40px;font-size:14px}

/* ───── Задачи в карточке партнёра (редизайн: два блока, повтор., детали) ───── */
.biz2{display:flex;flex-direction:column;gap:12px}
.biz2-addbar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;padding:6px 0;background:var(--bg-elev)}
.biz2-block{border:1px solid var(--b-1);border-radius:var(--r-m);overflow:hidden}
.biz2-block.done{opacity:.72}
.biz2-block-h{display:flex;align-items:center;gap:8px;padding:7px 11px;background:var(--glass);font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--text-3)}
.biz2-block.done .biz2-block-h{color:var(--text-3)}
.biz2-block-h .cnt{background:var(--b-1);border-radius:9px;padding:0 7px;font-size:11px}
.biz2-toggle{margin-left:auto;border:none;background:transparent;color:var(--accent-light);cursor:pointer;font-size:12px}
.biz2-list{display:flex;flex-direction:column;gap:6px;padding:8px}
.biz2-empty,.biz2-more{padding:8px;text-align:center;font-size:12px;color:var(--text-3)}
.biz2-card{border:1px solid var(--b-1);border-left:3px solid var(--b-2);border-radius:var(--r-s);padding:8px 10px;background:var(--bg-main);display:flex;flex-direction:column;gap:7px;cursor:default}
.biz2-card.urgent{border-left-color:var(--p1)}
.biz2-card.is-done{background:transparent}
.biz2-card.recent{border-left-color:var(--accent-elec)}
.biz2-card.biz2-drop{box-shadow:inset 0 2px 0 var(--accent-elec)}
.biz2-card.dragging{opacity:.4}
.biz2-card-top{display:flex;align-items:center;gap:8px}
.biz2-flag{flex:none;border:none;background:transparent;color:var(--text-4);cursor:pointer;font-size:14px;padding:2px;border-radius:5px}
.biz2-flag.on{color:var(--p1)}
.biz2-title{flex:1;min-width:0}
.biz2-status{flex:none;border:1px solid var(--b-1);border-radius:6px;padding:3px 6px;font-size:12px;background:var(--bg-elev);color:var(--text);cursor:pointer}
.biz2-status.s-wip{color:var(--st-wip);border-color:var(--st-wip)}
.biz2-status.s-done{color:var(--st-done);border-color:var(--st-done)}
.biz2-status.s-cancelled{color:var(--text-3)}
.biz2-del{flex:none;border:none;background:transparent;color:var(--text-4);cursor:pointer;font-size:13px;padding:2px 5px;border-radius:5px}
.biz2-del:hover{color:var(--p1);background:var(--bg-hover)}
.biz2-card-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.biz2-assignee{width:150px}
.biz2-due{width:130px}
.biz2-due.overdue{color:var(--p1);border-color:var(--p1)}
.biz2-recur{flex:none;border:1px solid var(--b-1);background:transparent;color:var(--text-4);cursor:pointer;font-size:13px;padding:2px 6px;border-radius:6px}
.biz2-recur.on{color:var(--accent-light);border-color:var(--accent-border);background:var(--accent-subtle)}
.biz2-reccount{font-size:11px;color:var(--accent-light);font-weight:600}
.biz2-period{border:1px solid var(--accent-border);background:var(--accent-subtle);color:var(--accent-light);border-radius:6px;padding:3px 8px;font-size:12px;cursor:pointer}
.biz2-cmt{font-size:12.5px;color:var(--text-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer;border-top:1px dashed var(--b-1);padding-top:6px}
.biz2-cmt.empty{color:var(--text-4);border-top:none;padding-top:0}
.biz2-cmt:hover{color:var(--text)}
.biz2-cancel{font-size:12px;color:var(--p1)}

/* Детальная панель задачи (справа) */
.biz-detail-back{position:fixed;inset:0;z-index:60;background:transparent}
.biz-detail-panel{position:fixed;top:0;right:0;z-index:61;width:min(400px,92vw);height:100%;background:var(--bg-elev);border-left:1px solid var(--b-2);box-shadow:var(--shadow-card);display:flex;flex-direction:column;transform:translateX(100%);transition:transform .18s ease}
.biz-detail-panel.open{transform:translateX(0)}
.bdp-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--b-1)}
.bdp-title{font-size:15px;font-weight:600;flex:1;min-width:0}
.bdp-body{padding:14px 16px;overflow-y:auto;display:flex;flex-direction:column;gap:8px}
.bdp-row{display:flex;gap:10px;font-size:13px}
.bdp-k{color:var(--text-3);min-width:120px;font-size:12px}
.bdp-created{font-size:12px;margin-bottom:4px}
.bdp-hist{display:flex;flex-direction:column;gap:4px}
.bdp-hrow{display:flex;justify-content:space-between;gap:10px;font-size:12px;border-bottom:1px dashed var(--b-1);padding:3px 0}
.bdp-hst{color:var(--text)}

/* Вложения (файлы КП/договоров/ДС) */
.att{display:flex;flex-direction:column;gap:8px}
.att-h{display:flex;align-items:center;gap:12px}
.att-arch{font-size:12px;color:var(--text-3);display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.att-list{display:flex;flex-direction:column;gap:4px}
.att-empty{font-size:12px;padding:4px 0}
.att-file{display:flex;align-items:center;gap:8px;padding:6px 8px;border:1px solid var(--b-1);border-radius:var(--r-s);background:var(--bg-main);font-size:13px}
.att-file.archived{opacity:.62}
.att-name{color:var(--accent-light);cursor:pointer;text-decoration:underline;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:220px}
.att-meta{flex:1;min-width:0;font-size:11px;color:var(--text-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.att-del{color:var(--p1)}

/* Коарс-статус жизненного цикла (Профиль + шапка) */
.lifechip.on.wip{background:var(--accent-subtle);color:var(--accent-light);border-color:var(--accent-border)}
.lifechip.on.paused{background:var(--glass);color:var(--text-2);border-color:var(--b-2)}
.lifechip.on.launched{background:rgba(0,200,170,.14);color:var(--st-done);border-color:rgba(0,200,170,.42)}
.lifechip.on.frozen{background:rgba(217,87,111,.14);color:var(--p1);border-color:rgba(217,87,111,.42)}
.ms-detail-head .lifechip{padding:3px 11px;border-radius:14px;font-size:12px;border:1px solid var(--b-1);white-space:nowrap}
.blocker-chip{padding:3px 10px;border-radius:14px;font-size:12px;background:rgba(217,87,111,.14);color:var(--p1);white-space:nowrap}
.life-comment{margin-top:6px}
.prof-comment.collapsed{max-height:3.4em;overflow:hidden}
.prof-comment-toggle{align-self:flex-start;border:none;background:transparent;color:var(--accent-light);cursor:pointer;font-size:12px;padding:3px 0;margin-top:2px}

/* Вкладка «Документы» (КП, договорная база) */
.docs{display:flex;flex-direction:column;gap:14px}
.doc-block{border:1px solid var(--b-1);border-radius:var(--r-m);padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.doc-block-h{font-size:14px;font-weight:600;color:var(--text)}
.doc-meta{display:flex;gap:12px;flex-wrap:wrap}
.doc-f{display:flex;flex-direction:column;gap:4px}
.doc-meta .doc-f{flex:1;min-width:170px}

/* Договорная база (NDA/Договор/ДС) */
.doc-status{max-width:280px}
.doc-iter-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.doc-iter-list{display:flex;flex-direction:column;gap:4px}
.doc-iter-row{display:flex;align-items:center;gap:8px}
.doc-iter-row .ito{font-size:12px;color:var(--text-2);min-width:70px}
.doc-iter-row input{max-width:150px}
.ds-list{display:flex;flex-direction:column;gap:10px}
.ds-card{border:1px solid var(--b-1);border-radius:var(--r-s);padding:10px 12px;display:flex;flex-direction:column;gap:8px;background:var(--bg-main)}
.ds-card-h{display:flex;align-items:center;gap:8px}
.ds-num{max-width:160px;font-weight:600}
.ds-del{margin-left:auto}
.ds-arch{font-size:11px;padding-top:6px;border-top:1px dashed var(--b-1)}

/* ─── Протокол (пайплайн 9 статусов) ─── */
.proto{display:flex;flex-direction:column;gap:16px}
.proto-top{display:flex;gap:26px;flex-wrap:wrap;align-items:flex-start;padding-bottom:14px;border-bottom:1px solid var(--b-1)}
.proto-steps{display:flex;flex-direction:column;gap:2px}
.proto-step{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:8px 0;position:relative}
.proto-step::before{content:'';position:absolute;left:16px;top:34px;bottom:-2px;width:2px;background:var(--b-1)}
.proto-step:last-child::before{display:none}
.proto-dot{width:32px;height:32px;border-radius:50%;border:2px solid var(--b-2);background:var(--bg-main);color:var(--text-3);font-size:12px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;z-index:1}
.proto-dot:hover{border-color:var(--accent);color:var(--accent)}
.proto-body{display:flex;flex-direction:column;gap:8px;padding-top:4px}
.proto-name{font-size:13px;font-weight:600;color:var(--text-2)}
.proto-fields{display:flex;gap:8px;flex-wrap:wrap}
.proto-fields .txt[type=date]{max-width:150px}
.proto-fields .txt[type=text]{flex:1;min-width:180px}
.proto-step.past .proto-dot{background:rgba(0,200,170,.14);border-color:rgba(0,200,170,.42);color:var(--st-done)}
.proto-step.past::before{background:rgba(0,200,170,.42)}
.proto-step.cur .proto-dot{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 0 0 4px var(--accent-subtle)}
.proto-step.cur .proto-name{color:var(--text)}
.proto-step.future .proto-name{color:var(--text-3)}
.proto-step.future .proto-fields{opacity:.55}
