:root{
  --bg:#f4f4f1;--card:#ffffff;--ink:#141414;--muted:#6d6d68;--line:#e4e4de;--soft:#eeeee9;
  --acc:#CDFF3C;--acc-ink:#000;--red:#e5484d;--amber:#f5a524;--green:#2fa36b;--blue:#3b82f6;
  --r:14px;--shadow:0 1px 2px rgba(0,0,0,.05),0 4px 14px rgba(0,0,0,.04);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.4 Montserrat,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
a{color:inherit}
.app{display:flex;min-height:100vh}
.side{width:230px;flex:none;background:#111;color:#eee;padding:18px 12px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:4px}
.brand{font-weight:800;font-size:18px;letter-spacing:-.02em;padding:4px 10px 14px;display:flex;align-items:center;gap:8px}
.brand i{width:26px;height:26px;border-radius:8px;background:var(--acc);display:inline-block;position:relative}
.brand i:after{content:"КС";position:absolute;inset:0;display:grid;place-items:center;color:#000;font-style:normal;font-size:11px;letter-spacing:-.3px}
.side a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;text-decoration:none;color:#cfcfcf;font-weight:500}
.side a.on,.side a:hover{background:#262626;color:#fff}
.side .sep{height:1px;background:#2a2a2a;margin:10px 4px}
.side .who{margin-top:auto;font-size:13px;color:#999;padding:8px 10px}
.main{flex:1;min-width:0;padding:18px 22px 90px}
.top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.top h1{font-size:22px;margin:0;font-weight:800;letter-spacing:-.02em;flex:1;min-width:150px}
.pills{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
.pill{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 12px;font-weight:600;font-size:13px;white-space:nowrap;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.pill .dot{width:9px;height:9px;border-radius:50%}
.pill.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn{border:0;background:var(--ink);color:#fff;border-radius:11px;padding:9px 14px;font-weight:600;cursor:pointer;white-space:nowrap}
.btn.acc{background:var(--acc);color:var(--acc-ink)}
.btn.ghost{background:var(--card);color:var(--ink);border:1px solid var(--line)}
.btn.red{background:var(--red)}
.btn.sm{padding:6px 10px;font-size:13px;border-radius:9px}
.btn[disabled]{opacity:.45;cursor:not-allowed}
.card{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);padding:14px}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.kpis{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));margin-bottom:14px}
.kpi{background:var(--card);border-radius:var(--r);padding:12px 14px;box-shadow:var(--shadow)}
.kpi b{display:block;font-size:22px;font-weight:800;letter-spacing:-.02em}
.kpi span{font-size:12px;color:var(--muted)}
h2{font-size:16px;margin:20px 0 10px;font-weight:800}
.muted{color:var(--muted)}.small{font-size:12.5px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.input,select.input,textarea.input{width:100%;border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 11px;outline:none}
.input:focus{border-color:#999}
textarea.input{min-height:70px;resize:vertical}
.search{max-width:260px}
label.f{display:block;margin-bottom:10px}
label.f>span{display:block;font-size:12px;color:var(--muted);margin-bottom:4px;font-weight:600}
.chk{display:flex;align-items:center;gap:8px;margin:6px 0 12px;font-weight:500}
.chk input{width:20px;height:20px;accent-color:#111}
.fgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
/* канбан */
.board{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;scroll-snap-type:x mandatory;align-items:flex-start}
.col{flex:0 0 282px;background:var(--soft);border-radius:var(--r);padding:8px;scroll-snap-align:start;min-height:120px}
.col.drop{outline:2px dashed #999}
.col h3{font-size:13px;margin:4px 6px 8px;display:flex;justify-content:space-between;font-weight:700}
.col h3 em{font-style:normal;color:var(--muted);font-weight:600}
.deal{background:var(--card);border-radius:12px;padding:10px 11px;margin-bottom:8px;box-shadow:var(--shadow);cursor:pointer;border-left:4px solid var(--pc,#ccc)}
.deal .t{font-weight:700;display:flex;justify-content:space-between;gap:6px}
.deal .s{font-size:12.5px;color:var(--muted);margin-top:3px}
.deal .m{display:flex;gap:6px;flex-wrap:wrap;margin-top:7px}
.tag{font-size:11.5px;font-weight:600;padding:2px 7px;border-radius:6px;background:var(--soft);white-space:nowrap}
.tag.red{background:#fde8e8;color:#b42318}.tag.green{background:#e3f6ec;color:#11734b}.tag.amber{background:#fff3dc;color:#8a5a00}.tag.blue{background:#e6efff;color:#1d4ed8}
.ago{font-size:11.5px;font-weight:700;color:var(--muted)}
.ago.hot{color:var(--red)}
.list .item{display:flex;gap:10px;align-items:center;padding:11px 12px;background:var(--card);border-radius:12px;margin-bottom:8px;box-shadow:var(--shadow);cursor:pointer}
.list .item .grow{flex:1;min-width:0}
.list .item .grow b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pbar{width:5px;align-self:stretch;border-radius:3px;flex:none}
.day{font-weight:800;margin:16px 0 8px;font-size:14px}.day::first-letter{text-transform:uppercase}
.bar{height:8px;background:var(--soft);border-radius:5px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--ink);border-radius:5px}
table.t{width:100%;border-collapse:collapse;font-size:13.5px}
table.t th{text-align:left;font-size:12px;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
table.t td{padding:8px;border-bottom:1px solid var(--soft)}
table.t td.n,table.t th.n{text-align:right;white-space:nowrap}
.scroll{overflow-x:auto}
/* модалка */
.ov{position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:50;display:flex;justify-content:flex-end}
.sheet{background:var(--bg);width:min(620px,100%);height:100%;overflow-y:auto;padding:0 0 40px;animation:sl .18s ease}
@keyframes sl{from{transform:translateX(30px);opacity:.5}to{transform:none;opacity:1}}
.sh-head{position:sticky;top:0;z-index:2;background:var(--ph,#111);color:var(--pi,#fff);padding:14px 16px;display:flex;gap:10px;align-items:center}
.sh-head h2{margin:0;flex:1;font-size:18px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sh-head .x{background:rgba(0,0,0,.15);border:0;color:inherit;width:34px;height:34px;border-radius:10px;font-size:18px;cursor:pointer}
.sh-body{padding:14px 16px}
.stages{display:flex;gap:6px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none}
.stg{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 12px;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.stg.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.stg[disabled]{opacity:.4;cursor:default}.stg.lost.on{background:var(--red);border-color:var(--red)}
.tl{border-left:2px solid var(--line);margin-left:6px;padding-left:14px}
.tl .ev{position:relative;margin-bottom:12px}
.tl .ev:before{content:"";position:absolute;left:-20px;top:5px;width:10px;height:10px;border-radius:50%;background:#bbb}
.tl .ev.msg_in:before{background:var(--blue)}.tl .ev.msg_out:before{background:var(--green)}.tl .ev.call:before{background:var(--amber)}.tl .ev.note:before{background:var(--ink)}
.bubble{display:inline-block;padding:8px 11px;border-radius:12px;background:#fff;box-shadow:var(--shadow);max-width:100%;white-space:pre-wrap}
.msg_in .bubble{background:#e6efff}.msg_out .bubble{background:#e3f6ec}
.toast{position:fixed;left:50%;bottom:86px;transform:translateX(-50%);background:#111;color:#fff;padding:10px 16px;border-radius:12px;z-index:99;font-weight:600;max-width:90vw}
.bnav{display:none}
.demo{background:#111;color:#fff;border-radius:12px;padding:8px 12px;font-size:13px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.demo select{max-width:100%;background:#222;color:#fff;border:1px solid #333;border-radius:8px;padding:5px 8px}
.code{font-family:ui-monospace,Menlo,monospace;font-size:12px;background:var(--soft);padding:8px 10px;border-radius:8px;word-break:break-all;display:block}
.login{max-width:360px;margin:12vh auto;padding:24px}
.empty{padding:26px;text-align:center;color:var(--muted)}
@media (max-width:820px){
  .side{display:none}
  .main{padding:12px 12px 90px}
  .top h1{font-size:19px;flex-basis:100%}
  .bnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:#111;z-index:40;padding:6px 4px calc(6px + env(safe-area-inset-bottom))}
  .bnav a{flex:1;text-align:center;color:#aaa;text-decoration:none;font-size:11px;font-weight:600;padding:4px 0}
  .bnav a b{display:block;font-size:19px;line-height:1.2}
  .bnav a.on{color:var(--acc)}
  .col{flex-basis:84vw}
  .fgrid{grid-template-columns:1fr}
  .search{max-width:none;flex:1}
}
/* v2 */
label.f.wide,.f.wide{grid-column:1/-1}
.lbl{display:block;font-size:12px;color:var(--muted);margin-bottom:6px;font-weight:600}
.artists{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px}
.art{display:grid;grid-template-columns:22px 1fr;gap:0 6px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:8px 10px;background:#fff;cursor:pointer}
.art input{grid-row:span 2;width:18px;height:18px;accent-color:#111}
.art b{font-size:13.5px}.art span{font-size:11.5px;color:var(--muted)}
.art:has(input:checked){border-color:#111;background:#f2f2ec}
.imgbox{height:110px;border:1px dashed var(--line);border-radius:10px;display:grid;place-items:center;background:#fff;margin-bottom:6px;overflow:hidden}
.imgbox img{max-height:100px;max-width:100%}
.ov.wide .sheet{width:min(980px,100%)}
.docframe{width:100%;height:calc(100vh - 150px);border:1px solid var(--line);border-radius:10px;background:#fff}
.pill input{accent-color:#111}
.cap{display:grid;grid-template-columns:1fr auto;gap:2px 10px;font-size:13px}
.cap b{font-size:20px}
/* ===== Мессенджер ===== */
.cbadge{font-style:normal;background:#e5484d;color:#fff;border-radius:10px;font-size:11px;font-weight:700;padding:1px 6px;margin-left:auto}
.bnav .cbadge{position:absolute;margin:-4px 0 0 -4px}
.main.chatmode{padding:0;height:100vh;overflow:hidden}
.av{border-radius:50%;object-fit:cover;display:inline-grid;place-items:center;color:#fff;font-weight:700;flex:none;letter-spacing:-.02em}
.msgr{display:flex;height:100vh;background:#fff}
.ml{width:340px;flex:none;border-right:1px solid var(--line);display:flex;flex-direction:column;background:#fff}
.mlh{display:flex;align-items:center;gap:6px;padding:12px 12px 6px}.mlh b{font-size:20px;font-weight:800}
.grow{flex:1;min-width:0}
.ib{border:0;background:transparent;width:38px;height:38px;border-radius:50%;display:inline-grid;place-items:center;font-size:18px;cursor:pointer;text-decoration:none;color:inherit;flex:none;transition:background .15s,transform .12s}
.ib:hover{background:var(--soft)}.ib:active{transform:scale(.9)}.ib.acc{background:var(--ink);color:#fff}
.mls{padding:4px 12px 8px}.mls .input{border-radius:20px;background:var(--soft);border-color:transparent}
.mll{overflow-y:auto;flex:1}
.mli{display:flex;gap:10px;align-items:center;padding:8px 12px;text-decoration:none;color:inherit;transition:background .12s}
.mli:hover{background:#f6f6f2}.mli.on{background:#eef6d8}.mli.sub{padding-left:34px}
.mli .r1{display:flex;gap:6px;align-items:baseline}.mli .r1 b{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14.5px}
.mli .tm{font-size:11.5px;color:var(--muted);white-space:nowrap}
.mli .r2{display:flex;gap:6px;align-items:center;margin-top:2px}.pv{flex:1;min-width:0;font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pv b{color:var(--ink);font-weight:600}
.ub{background:#2fa36b;color:#fff;border-radius:11px;font-size:12px;font-weight:700;padding:1px 7px;min-width:20px;text-align:center}.ub.mut{background:#aaa}
.typ{color:#2fa36b;font-style:normal}
.mc{flex:1;min-width:0;display:flex;flex-direction:column;background:#e9eee0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cg fill='%23000' fill-opacity='.035'%3E%3Ccircle cx='10' cy='10' r='3'/%3E%3Ccircle cx='50' cy='40' r='2'/%3E%3Cpath d='M60 10l4 4-4 4-4-4z'/%3E%3Cpath d='M20 55h8v2h-8z'/%3E%3C/g%3E%3C/svg%3E")}
.mce{flex:1;display:grid;place-items:center;text-align:center;color:var(--muted)}
.mch{display:flex;align-items:center;gap:8px;padding:8px 10px;background:#fff;border-bottom:1px solid var(--line)}
.mch .tt{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mch .st{font-size:12.5px;color:var(--muted)}
.mch .back{display:none;font-size:30px}
.tpb{display:flex;gap:6px;padding:6px 10px;background:#fff;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tp{border:0;background:var(--soft);border-radius:16px;padding:6px 12px;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;transition:all .15s}
.tp.on{background:var(--ink);color:#fff}.tp.add{background:transparent;border:1px dashed #bbb}
.pinbar{background:#fff;padding:6px 14px;font-size:13px;border-bottom:1px solid var(--line);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm{flex:1;overflow-y:auto;padding:10px 12px 6px;overscroll-behavior:contain}
.dsep{text-align:center;margin:10px 0}.dsep span,.sys span{background:rgba(0,0,0,.28);color:#fff;font-size:12px;padding:3px 10px;border-radius:12px;font-weight:600}
.sys{text-align:center;margin:8px 0}
.msg{display:flex;gap:6px;align-items:flex-end;margin-top:6px;transition:transform .15s}
.msg.cont{margin-top:2px}.msg.me{justify-content:flex-end}
.msg.hl .bub{box-shadow:0 0 0 3px var(--acc)}
.mav{width:34px;flex:none}
.bub{position:relative;max-width:min(520px,78%);background:#fff;border-radius:16px 16px 16px 4px;padding:6px 10px 18px;box-shadow:0 1px 1px rgba(0,0,0,.08);animation:mIn .18s ease;min-width:70px}
.msg.me .bub{background:#e2f7c9;border-radius:16px 16px 4px 16px}
.msg.cont .bub{border-radius:16px}
.msg.plain .bub{background:transparent;box-shadow:none;padding:0 0 18px}
@keyframes mIn{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:none}}
.nm{font-size:13px;font-weight:700;margin-bottom:2px}
.tx{white-space:normal;word-wrap:break-word;font-size:15px;line-height:1.35}
.tx a{color:#1d6fd8}
.mt{position:absolute;right:9px;bottom:3px;font-size:11px;color:#7d8c74}
.msg.plain .mt{background:rgba(0,0,0,.3);color:#fff;border-radius:8px;padding:0 6px}
.rd{color:#2fa36b;margin-left:3px;letter-spacing:-3px}.rd.one{color:#999}
.rq{border-left:3px solid var(--acc);background:rgba(0,0,0,.04);border-radius:6px;padding:3px 8px;margin:2px 0 4px;font-size:13px;cursor:pointer;max-width:100%}
.rq b{display:block;font-size:12.5px}.rq span{color:var(--muted);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rcs{display:flex;gap:4px;flex-wrap:wrap;margin-top:5px}
.rc{border:0;background:rgba(0,0,0,.06);border-radius:14px;padding:2px 8px 2px 5px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;gap:3px;align-items:center;transition:transform .1s}
.rc.my{background:#2fa36b;color:#fff}.rc:active{transform:scale(.88)}
.img{display:block;max-width:100%;max-height:340px;border-radius:12px;margin:2px 0;cursor:zoom-in}
.file{display:flex;gap:10px;align-items:center;text-decoration:none;color:inherit;padding:4px 0}
.fi{width:42px;height:42px;border-radius:50%;background:#2fa36b;display:grid;place-items:center;font-size:20px}
.callm{font-weight:600;padding:4px 0}
.jumbo{font-size:64px;line-height:1.1;padding:4px 2px}
.ea{display:inline-block}
.jumbo .ea,.ep .ea:hover,.mce .ea{animation-duration:1.1s;animation-iteration-count:3;animation-timing-function:ease-in-out}
.jumbo .ea:hover{animation-iteration-count:infinite}
.ea.bounce{animation-name:eBounce}.ea.beat{animation-name:eBeat}.ea.flame{animation-name:eFlame}.ea.shake{animation-name:eShake}.ea.pop{animation-name:ePop}.ea.float{animation-name:eFloat;animation-iteration-count:infinite!important;animation-duration:2.4s!important}
.ea.nod{animation-name:eNod}.ea.clap{animation-name:eClap}.ea.sway{animation-name:eSway}.ea.spin{animation-name:eSpin}.ea.drive{animation-name:eDrive}
.ea.pop1{animation:ePop .35s ease-out 1}
.ep .ea{animation:none}.ep:hover .ea{animation-iteration-count:infinite}
@keyframes eBounce{0%,100%{transform:translateY(0)}30%{transform:translateY(-14%)}60%{transform:translateY(3%)}}
@keyframes eBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(.95)}45%{transform:scale(1.18)}}
@keyframes eFlame{0%,100%{transform:scale(1) rotate(0)}25%{transform:scale(1.1,1.2) rotate(-4deg)}50%{transform:scale(.95,1.05) rotate(3deg)}75%{transform:scale(1.08,1.15) rotate(-2deg)}}
@keyframes eShake{0%,100%{transform:rotate(0)}20%{transform:rotate(-14deg)}40%{transform:rotate(12deg)}60%{transform:rotate(-8deg)}80%{transform:rotate(6deg)}}
@keyframes ePop{0%{transform:scale(.3)}50%{transform:scale(1.3) rotate(8deg)}75%{transform:scale(.9)}100%{transform:scale(1)}}
@keyframes eFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes eNod{0%,100%{transform:rotate(0)}30%{transform:rotate(-18deg) translateY(-6%)}60%{transform:rotate(6deg)}}
@keyframes eClap{0%,100%{transform:scale(1)}20%,60%{transform:scale(.8)}40%,80%{transform:scale(1.15)}}
@keyframes eSway{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
@keyframes eSpin{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.2)}100%{transform:rotate(360deg) scale(1)}}
@keyframes eDrive{0%,100%{transform:translateX(0)}50%{transform:translateX(12%)}}
/* голосовые */
.vc{display:flex;align-items:center;gap:8px;min-width:230px;padding:2px 0}
.vp{width:40px;height:40px;border-radius:50%;border:0;background:#2fa36b;color:#fff;font-size:15px;cursor:pointer;flex:none;transition:transform .12s}.vp:active{transform:scale(.9)}
.vw{display:flex;align-items:center;gap:2px;height:28px;flex:1;cursor:pointer}
.vw i{display:block;width:3px;border-radius:2px;background:#b5c9a4;transition:background .1s}.vw i.p{background:#2fa36b}
.msg:not(.me) .vw i{background:#cfd6cc}.msg:not(.me) .vw i.p{background:#2fa36b}
.vd{font-size:12px;color:var(--muted);min-width:32px}
.vs{border:0;background:rgba(0,0,0,.07);border-radius:8px;font-size:11px;font-weight:700;padding:2px 5px;cursor:pointer}
/* кружочки */
.circ{position:relative;width:220px;height:220px;cursor:pointer}
.circ video{width:100%;height:100%;border-radius:50%;object-fit:cover;background:#000;display:block}
.circ svg{position:absolute;inset:-4px;width:228px;height:228px;transform:rotate(-90deg);pointer-events:none}
.circ circle{fill:none;stroke:#2fa36b;stroke-width:2.5;stroke-dasharray:301.6;stroke-dashoffset:301.6;transition:stroke-dashoffset .2s linear}
.circ .cd,.circ .cs{position:absolute;bottom:8px;background:rgba(0,0,0,.45);color:#fff;font-size:11px;border-radius:9px;padding:1px 7px}.circ .cd{left:26px}.circ .cs{right:26px}
.circ.on video{transform:scale(1.02)}
/* поле ввода */
.cmp{background:#fff;border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom));position:relative}
.crow{display:flex;align-items:flex-end;gap:6px}
.crow.recording .tin,.crow.recording label.ib{visibility:hidden}
.tin{flex:1;display:flex;align-items:flex-end;background:var(--soft);border-radius:22px;padding:2px 2px 2px 14px}
.tin textarea{flex:1;border:0;background:transparent;resize:none;outline:none;font-size:15px;line-height:1.35;padding:9px 0;max-height:140px}
.rb{width:46px;height:46px;border-radius:50%;border:0;background:#2fa36b;color:#fff;font-size:20px;cursor:pointer;flex:none;touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .15s,background .2s,box-shadow .2s}
.rb.send{background:#2fa36b}.rb:active{transform:scale(.92)}
.rb.live{transform:scale(1.55);background:#e5484d;box-shadow:0 0 0 10px rgba(229,72,77,.18);animation:rPulse 1.2s infinite}
.rb.flip{animation:rFlip .3s}
@keyframes rPulse{50%{box-shadow:0 0 0 18px rgba(229,72,77,.08)}}
@keyframes rFlip{50%{transform:rotateY(90deg)}}
.recui{position:absolute;left:8px;right:64px;bottom:calc(10px + env(safe-area-inset-bottom));height:40px;display:flex;align-items:center;gap:10px;padding:0 6px;background:#fff}
.recui[hidden]{display:none}
.rdot{width:10px;height:10px;border-radius:50%;background:#e5484d;animation:blink 1s infinite}@keyframes blink{50%{opacity:.2}}
.rt{font-variant-numeric:tabular-nums;font-weight:700}.rh{color:var(--muted);font-size:14px;transition:opacity .1s}
.recui .rsend{width:42px;height:42px;font-size:18px;position:relative;right:-58px}
.lock{position:absolute;right:14px;bottom:76px;width:38px;height:62px;border-radius:20px;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.15);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;transition:transform .05s;animation:lockIn .25s}
.lock[hidden]{display:none}.lock small{animation:up 1s infinite;color:var(--muted)}.lock.near{background:#2fa36b;color:#fff}
@keyframes up{50%{transform:translateY(-5px)}}@keyframes lockIn{from{opacity:0;transform:translateY(20px)}}
.circ-rec{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:80;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;pointer-events:none;animation:fadeIn .2s}
.circ-rec .cr{position:relative;width:min(78vw,320px);height:min(78vw,320px)}
.circ-rec video{width:100%;height:100%;border-radius:50%;object-fit:cover;transform:scaleX(-1)}
.circ-rec svg{position:absolute;inset:-6px;width:calc(100% + 12px);height:calc(100% + 12px);transform:rotate(-90deg)}
.circ-rec circle{fill:none;stroke:#e5484d;stroke-width:2;stroke-dasharray:301.6;stroke-dashoffset:301.6}
.crt{color:#fff;font-weight:700;font-size:18px}
@keyframes fadeIn{from{opacity:0}}
.epanel{display:grid;grid-template-columns:repeat(auto-fill,minmax(42px,1fr));gap:2px;max-height:210px;overflow-y:auto;padding:6px 0}
.epanel[hidden]{display:none}
.ep{border:0;background:transparent;font-size:26px;height:44px;border-radius:10px;cursor:pointer}.ep:hover{background:var(--soft)}
.rbar{display:flex;align-items:center;gap:8px;padding:4px 6px 8px;border-left:3px solid #2fa36b;margin:0 4px 6px;font-size:13px}
.rbar span{display:block;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* контекстное меню */
.cm{position:fixed;z-index:120;background:#fff;border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.2);padding:6px;min-width:220px;animation:cmIn .15s ease}
@keyframes cmIn{from{opacity:0;transform:scale(.9)}}
.cmr{display:flex;gap:2px;padding:2px 2px 6px;border-bottom:1px solid var(--line);margin-bottom:4px;overflow-x:auto}
.cmr button{border:0;background:transparent;font-size:24px;width:38px;height:38px;border-radius:50%;cursor:pointer;transition:transform .12s}
.cmr button:hover{transform:scale(1.3);background:var(--soft)}
.cm>button{display:block;width:100%;text-align:left;border:0;background:transparent;padding:9px 10px;border-radius:8px;font-size:14.5px;cursor:pointer}
.cm>button:hover{background:var(--soft)}.cm>button.red{color:#e5484d}
.mpick{max-height:300px;overflow-y:auto;border:1px solid var(--line);border-radius:12px}
.mpi{display:flex;align-items:center;gap:10px;padding:7px 10px;cursor:pointer}.mpi:hover{background:var(--soft)}.mpi input{width:20px;height:20px;accent-color:#2fa36b}
.avpick{cursor:pointer;display:inline-block;position:relative}.avpick.big .av{box-shadow:0 2px 10px rgba(0,0,0,.15)}
.msheet .sh-head{background:#111;color:#fff}
.iview{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:130;display:grid;place-items:center;animation:fadeIn .15s}
.iview img{max-width:96vw;max-height:92vh}.iview .ib{position:absolute;top:12px;right:12px;color:#fff;background:rgba(255,255,255,.15)}
/* звонки */
.callin{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:140;background:#111;color:#fff;border-radius:18px;padding:12px;display:flex;gap:12px;align-items:center;width:min(420px,94vw);box-shadow:0 10px 40px rgba(0,0,0,.4);animation:cmIn .2s}
.cb{width:52px;height:52px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:20px;cursor:pointer;transition:transform .12s}
.cb:active{transform:scale(.9)}.cb.red{background:#e5484d}.cb.green{background:#2fa36b;animation:rPulse 1.2s infinite}.cb.off{background:#fff;color:#111}
.callov{position:fixed;inset:0;z-index:135;background:linear-gradient(160deg,#1b2a1d,#0d0d0d);color:#fff;display:flex;flex-direction:column;animation:fadeIn .2s}
.ctop{padding:18px;text-align:center}.ctop b{display:block;font-size:20px}.ctop span{display:block;font-size:14px;opacity:.75}
.cgrid{flex:1;display:grid;gap:6px;padding:6px;grid-template-columns:1fr}
.cgrid[data-n="2"],.cgrid[data-n="3"],.cgrid[data-n="4"]{grid-template-columns:1fr 1fr}.cgrid[data-n="5"],.cgrid[data-n="6"]{grid-template-columns:1fr 1fr 1fr}
.cgrid[data-n="0"]{display:none}.cgrid:not([data-n="0"])~.cwait{display:none}
.cwait{flex:1;display:grid;place-items:center}.cwait .av{animation:eBeat 1.6s infinite}
.tile{position:relative;background:#222;border-radius:14px;overflow:hidden;min-height:140px}
.tile video{width:100%;height:100%;object-fit:cover}.tile .tav{position:absolute;inset:0;display:none;place-items:center}
.tile.novid video{opacity:0}.tile.novid .tav{display:grid}
.tile .tn{position:absolute;left:8px;bottom:8px;font-size:13px;background:rgba(0,0,0,.4);padding:2px 8px;border-radius:8px}
.self{position:absolute;right:14px;top:80px;width:110px;height:150px;object-fit:cover;border-radius:12px;transform:scaleX(-1);box-shadow:0 4px 16px rgba(0,0,0,.4);background:#333}
.cbar{display:flex;gap:14px;justify-content:center;padding:16px 0 calc(22px + env(safe-area-inset-bottom))}
.callov.mini{inset:auto 12px 80px auto;width:170px;height:230px;border-radius:16px;box-shadow:0 8px 30px rgba(0,0,0,.5);cursor:pointer}
.callov.mini .ctop{padding:6px}.callov.mini .ctop b{font-size:13px}.callov.mini .self,.callov.mini .cbar .cb:not(.red){display:none}.callov.mini .cbar{padding:6px}.callov.mini .cb{width:38px;height:38px}
@media (max-width:820px){
  .main.chatmode{height:calc(100vh - 62px)}
  .msgr{height:calc(100vh - 62px)}
  .ml{width:100%;border:0}.msgr.has-open .ml{display:none}.msgr:not(.has-open) .mc{display:none}
  .mch .back{display:inline-grid}
  .bub{max-width:84%}
  .bnav a b{position:relative}
}
.vc{min-width:0;width:260px;max-width:100%}.vw{min-width:0;overflow:hidden}
/* дашборд-кольца */
.dashgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.rcard{display:flex;flex-direction:column;align-items:center}.rcard h3{align-self:flex-start;margin:0 0 6px;font-size:15px}
.ring{max-width:100%;height:auto}.ring .arc{transition:stroke-dasharray .8s ease}.ring .rs{font-size:11px;fill:#6d6d68}.ring .rb{font-size:21px;font-weight:800;fill:#141414;font-family:Montserrat,system-ui,sans-serif}
.ring g{animation:ringIn .9s ease}@keyframes ringIn{from{opacity:0;transform:rotate(-140deg) scale(.9);transform-origin:100px 100px}}
.lg{width:100%;display:grid;gap:5px;margin-top:8px}.lg div{display:grid;grid-template-columns:12px 1fr auto;gap:8px;align-items:center;font-size:13px}.lg i{width:12px;height:12px;border-radius:4px}
.mbars{display:flex;gap:8px;align-items:flex-end;height:170px;overflow-x:auto}.mbars div{flex:1;min-width:46px;display:flex;flex-direction:column;align-items:center;gap:4px;justify-content:flex-end;height:100%}
.mbars b{width:70%;background:var(--ink);border-radius:6px 6px 2px 2px}.mbars span{font-size:12px;color:var(--muted)}.mbars em{font-style:normal;font-size:11px;font-weight:700}
/* календарь-сетка */
.cal{padding:10px}.calh{display:flex;align-items:center;gap:6px;margin-bottom:6px}.calh b{flex:1;text-align:center;font-size:16px}
.calw,.calg{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.calw span{text-align:center;font-size:11.5px;color:var(--muted);font-weight:700}
.cd{position:relative;aspect-ratio:1/1.05;border:1px solid var(--line);border-radius:10px;background:#fff;padding:4px;display:flex;flex-direction:column;align-items:flex-start;cursor:pointer;min-width:0;transition:transform .1s}
.cd:active{transform:scale(.94)}.cd.empty{border:0;background:transparent;cursor:default}
.cd .dn{font-size:13px;font-weight:700}.cd.today{border-color:var(--ink);border-width:2px}.cd.sel{background:var(--ink);color:#fff}
.cd .cnt{position:absolute;right:4px;top:4px;font-size:11px;font-weight:800;border-radius:8px;padding:0 6px}
.cd .dots{margin-top:auto;display:flex;gap:2px;flex-wrap:wrap}.cd .dots i{width:6px;height:6px;border-radius:50%;background:#bbb}.cd .dots i.w{background:#16a34a}
.cd .evm{font-size:11px;color:#b58900}.cd .warn{position:absolute;right:5px;bottom:3px;color:#e5484d;font-weight:900;font-size:13px}
/* календарь v2: день / неделя / месяц, заказы и задачи со статусами */
.tag.violet{background:#efe9ff;color:#5b3fd6}
.calbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}.calbar .pills{margin:0}
.cweek{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;overflow-x:auto}
.cday{background:var(--soft);border-radius:10px;padding:6px;min-height:180px;display:flex;flex-direction:column;gap:5px;min-width:0}
.cday.today{box-shadow:inset 0 0 0 2px var(--ink)}.cday.sel header{background:var(--ink);color:#fff}
.cday header{font-weight:800;font-size:13px;padding:4px 6px;border-radius:7px;cursor:pointer;display:flex;justify-content:space-between}.cday header span{font-weight:600;opacity:.7}
.ce{background:#fff;border-radius:8px;padding:5px 7px;font-size:12px;border-left:4px solid #9ca3af;cursor:pointer;display:flex;flex-direction:column;min-width:0;box-shadow:0 1px 0 rgba(0,0,0,.04)}
.ce span{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ce em{font-style:normal;color:var(--muted);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ce.s-new{border-left-color:#f59e0b}.ce.s-work{border-left-color:#2563eb}.ce.s-done{border-left-color:#16a34a;background:#f1fbf5}.ce.s-late{border-left-color:#e5484d;background:#fff3f3}.ce.s-todo{border-left-color:#9ca3af}
.ce.task{border-left-style:dashed}.ce.task b{color:#5b3fd6}.ce.s-done span{text-decoration:line-through;color:var(--muted)}.ce.ev{border-left-color:#b58900;cursor:default}
.cadd{margin-top:auto;border:1px dashed #c9c9c2;background:transparent;border-radius:8px;padding:4px;font-size:12px;color:var(--muted);cursor:pointer}.cadd:hover{background:#fff;color:var(--ink)}
.cmonth{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}.cmonth .mh{text-align:center;font-size:11.5px;color:var(--muted);font-weight:700}
.cmonth .md{background:#fff;border:1px solid var(--line);border-radius:9px;min-height:96px;padding:4px;cursor:pointer;min-width:0;display:flex;flex-direction:column;gap:2px}
.cmonth .md.out{opacity:.45}.cmonth .md.today{border:2px solid var(--ink)}.cmonth .md.sel{background:#fafaf6;box-shadow:0 0 0 2px #7c5cff}
.cmonth .n{font-weight:800;font-size:13px;display:flex;justify-content:space-between}.cmonth .n i{font-style:normal;font-size:11px;background:var(--soft);border-radius:7px;padding:0 6px}
.cmonth .cmi{font-size:11px;border-radius:5px;padding:1px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#f3f4f6}
.cmi.s-new{background:#fff3dc}.cmi.s-work{background:#e6efff}.cmi.s-done{background:#e3f6ec;color:#11734b}.cmi.s-late{background:#fde8e8;color:#b42318}.cmi.task{font-style:italic}.cmi.more{background:none;color:var(--muted)}
.mdots{display:none;gap:2px;margin-top:auto}.mdots b{width:6px;height:6px;border-radius:50%;background:#9ca3af}
.mdots .s-new{background:#f59e0b}.mdots .s-work{background:#2563eb}.mdots .s-done{background:#16a34a}.mdots .s-late{background:#e5484d}
.clegend{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px}
@media (max-width:760px){.cweek{grid-template-columns:repeat(7,150px)}.cmonth .cmi{display:none}.cmonth .md{min-height:54px}.mdots{display:flex}}
.task .tchk{width:22px;height:22px;accent-color:#16a34a;flex:none}
.task.done b{text-decoration:line-through;color:var(--muted)}
.tright{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tright button.tag{border:0;cursor:pointer}
.red-t{color:#e5484d}
.taskm{border:1px solid var(--line);background:#fffbe6;border-radius:12px;padding:8px 10px;min-width:220px}
.taskm b{display:block}.taskm .small{display:block;margin-top:2px}
.task .tchk{width:22px;height:22px;accent-color:#16a34a;flex:none}
.task.done b{text-decoration:line-through;color:var(--muted)}
.tright{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tright button.tag{border:0;cursor:pointer}
.red-t{color:#e5484d}
.taskm{border:1px solid #e9d98a;background:#fffbe6;border-radius:12px;padding:8px 10px;min-width:220px;cursor:pointer}
.taskm b{display:block}.taskm .small{display:block;margin-top:2px}
.card.abon{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.card.abon .grow{flex:1 1 200px}.card.abon .grow b,.card.abon .grow span{display:block}

/* ===== Оболочка v3: меню по группам, часы, верхняя панель (по образцу CRM ДЕЗ ПКБ, в цветах Браво) ===== */
.hidden{display:none!important}
.side{width:236px;flex:0 0 236px;padding:0;gap:0;background:linear-gradient(180deg,#0d0d0d 0%,#171717 100%);color:#cfcfcf;z-index:30}
.side .logo{display:flex;gap:10px;align-items:center;padding:14px 16px 8px}
.side .logo>i{width:38px;height:38px;border-radius:10px;background:var(--acc);color:var(--acc-ink);font:800 15px/38px Montserrat,sans-serif;letter-spacing:-.5px;font-style:normal;text-align:center;flex:none}
.side .logo b{display:block;color:#fff;font-size:16px;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.side .logo small{display:block;font-size:11px;color:#9a9a9a;margin-top:-1px}
.bravo-jump{display:inline-flex}
.bravo-jump i{font-style:normal;display:inline-block;animation:bravo-hop 4s ease-in-out infinite;transform-origin:50% 100%}
.bravo-jump i:nth-child(1),.bravo-jump i:nth-child(2){color:var(--acc)}.bravo-jump i:nth-child(2){animation-delay:.08s}.bravo-jump i:nth-child(3){animation-delay:.24s}.bravo-jump i:nth-child(4){animation-delay:.32s}.bravo-jump i:nth-child(5){animation-delay:.4s}.bravo-jump i:nth-child(6){animation-delay:.48s}.bravo-jump i:nth-child(7){animation-delay:.56s}
@keyframes bravo-hop{0%,14%,100%{transform:translateY(0) scale(1)}3%{transform:translateY(0) scale(1.08,.9)}7%{transform:translateY(-6px) scale(.96,1.06)}11%{transform:translateY(0) scale(1.05,.94)}}
@media (prefers-reduced-motion:reduce){.bravo-jump i{animation:none}}
.side-clock{margin:0 14px 8px;padding:8px 12px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid color-mix(in srgb,var(--acc) 35%,transparent);display:flex;flex-direction:column;line-height:1.15}
.side-clock b{font-size:28px;font-weight:800;color:#fff;letter-spacing:1px;font-variant-numeric:tabular-nums}
.side-clock span{font-size:13px;color:var(--acc);font-weight:600;margin-top:2px}
.nav{flex:1;overflow:auto;padding:2px 0 8px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
.side .nav a{display:flex;align-items:center;gap:9px;padding:6px 16px 6px 15px;margin:1px 8px 1px 0;font-size:13.5px;color:#dcdcdc;border-left:3px solid transparent;border-radius:0 9px 9px 0;font-weight:500;text-decoration:none}
.side .nav a:hover{background:rgba(255,255,255,.05);color:#fff}
.side .nav a.on{background:#262626;border-left-color:var(--acc);color:#fff;font-weight:600}
.nav a .n-ic{width:20px;text-align:center;font-size:14px;flex:0 0 20px}
.nav a .n-l{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav-hero{display:flex;flex-direction:column;gap:6px;padding:4px 10px 10px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:4px}
.side .nav .nh-chat{margin:0;border:0;border-radius:11px;padding:10px 12px;background:var(--acc);color:var(--acc-ink);font-weight:700;font-size:14.5px;box-shadow:0 4px 14px color-mix(in srgb,var(--acc) 30%,transparent);gap:9px}
.side .nav .nh-chat:hover{filter:brightness(1.05);background:var(--acc);color:var(--acc-ink)}
.side .nav .nh-chat.on{outline:2px solid #fff;outline-offset:-2px;background:var(--acc);color:var(--acc-ink)}
.nh-chat .bc-ic{width:18px;height:18px}
.nh-margo{display:flex;align-items:center;gap:10px;width:100%;border:1px solid color-mix(in srgb,var(--acc) 50%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 20%,transparent),color-mix(in srgb,var(--acc) 5%,transparent));color:#fff;border-radius:11px;padding:7px 10px;text-align:left;cursor:pointer}
.nh-margo:hover{background:linear-gradient(135deg,color-mix(in srgb,var(--acc) 32%,transparent),color-mix(in srgb,var(--acc) 12%,transparent))}
.nm-av{width:34px;height:34px;border-radius:50%;border:2px solid var(--acc);background:#222;display:inline-grid;place-items:center;font-size:17px;flex:0 0 34px}
.nh-margo b{display:block;font-size:13.5px}.nh-margo small{display:block;font-size:11.5px;color:#bdbdbd}
/* проекты — ровно две полосы: столбцов = половина проектов (с округлением вверх) */
.nprj{display:grid;grid-template-columns:repeat(var(--cols,5),minmax(0,1fr));gap:4px;padding:6px 10px 4px}
.nprj button{min-width:0;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#ddd;border-radius:8px;padding:6px 2px;font-size:11.5px;font-weight:800;letter-spacing:.2px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:clip;text-align:center;box-shadow:inset 0 -3px 0 var(--pc)}
.nprj button:hover{background:rgba(255,255,255,.12);color:#fff}
.nprj button.on{background:var(--pc);color:var(--pk);border-color:var(--pc);box-shadow:none}
.ng-h{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;color:#8d8d8d;font-size:11px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;padding:9px 16px 4px 18px;cursor:pointer;text-align:left}
.ng-h:hover{color:#ddd}
.ng-ar{margin-left:auto;transition:transform .15s;font-size:11px}
.ng.closed .ng-ar{transform:rotate(-90deg)}
.ng.closed .ng-b{display:none}
.side-mini{display:flex;flex-wrap:wrap;gap:4px;padding:8px 10px;border-top:1px solid rgba(255,255,255,.08)}
.side .side-mini a,.side-mini button{flex:1 1 auto;background:rgba(255,255,255,.06);color:#ddd;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:5px 6px;font-size:12px;text-decoration:none;text-align:center;cursor:pointer;white-space:nowrap;display:block;font-weight:500}
.side .side-mini a:hover,.side-mini button:hover{background:rgba(255,255,255,.14);color:#fff}
.side .me{display:flex;align-items:center;gap:10px;border-top:1px solid rgba(255,255,255,.08);padding:10px 14px}
.side .me .av{width:34px;height:34px;flex:0 0 34px;background:var(--acc);color:var(--acc-ink);font-size:13px;overflow:hidden;box-shadow:0 0 0 2px rgba(255,255,255,.12)}
.side .me .av img{width:100%;height:100%;object-fit:cover}
.side .me .grow{flex:1;min-width:0}
.side .me b{color:#fff;font-size:13.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.side .me .grow>span{font-size:12px;color:#a8a8a8}
.side .me a{color:#bbb;font-size:18px;text-decoration:none;padding:4px}
.main{padding:0;display:flex;flex-direction:column}
#view{padding:18px 24px 40px;flex:1;min-width:0}
.main>.demo{margin:12px 24px 0}
.tbar{min-height:58px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:8px 24px;position:sticky;top:0;z-index:20}
.tbar h1{font-size:20px;font-weight:800;letter-spacing:-.02em;margin:0;flex:1;min-width:0;display:flex;align-items:center;gap:9px;line-height:1.2}
/* заголовок не обрезается: длинное название переносится на вторую строку */
.tbar #page-title{min-width:0;white-space:normal;overflow-wrap:anywhere;hyphens:auto}
.tbar .gsearch input{width:clamp(170px,20vw,280px)}
.tbar .pdot,.gsearch .pdot{width:10px;height:10px;border-radius:50%;flex:none;display:inline-block}
.tbar .burger{display:none;border:0;background:none;font-size:22px;padding:4px 8px;cursor:pointer}
/* праздничная полоса над шапкой: всё внутри полосы, на страницу ничего не вылетает */
.party{position:relative;height:76px;flex:none;overflow:hidden;background:#0d0a18;contain:strict}
.party canvas{display:block;width:100%;height:100%}
.party-tg{position:absolute;right:8px;top:8px;width:26px;height:26px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.35);color:#fff;font-size:10px;cursor:pointer;display:grid;place-items:center;opacity:.55;transition:opacity .2s}
.party-tg:hover{opacity:1}
.main.chatmode .party{display:none}
@media (max-width:860px){.party{height:60px}}
.gsearch{position:relative}
.gsearch input{width:280px;height:36px;border:1px solid var(--line);background:var(--bg);border-radius:9px;padding:0 12px;outline:none}
.gsearch input:focus{border-color:#bdbdb4;background:#fff}
.gsearch .drop{position:absolute;top:42px;right:0;width:400px;max-width:90vw;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);max-height:440px;overflow:auto;z-index:50}
.gsearch .drop a{display:block;padding:8px 12px;color:var(--ink);border-bottom:1px solid var(--soft);text-decoration:none;font-size:14px}
.gsearch .drop a:hover{background:var(--soft)}
.gsearch .drop h6{margin:0;padding:9px 12px 4px;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;display:flex;align-items:center;gap:6px}
.s-toggle{display:none;border:0;background:none;padding:6px;cursor:pointer;color:var(--ink)}
.bell{position:relative;border:0;background:none;cursor:pointer;width:36px;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.bell:hover,.bell.on{background:var(--bg);color:var(--ink)}
.bell i{position:absolute;top:3px;right:2px;background:var(--red);color:#fff;font:700 10px/16px Montserrat,sans-serif;min-width:16px;height:16px;border-radius:8px;font-style:normal;padding:0 4px}
.btn.gold{background:var(--acc);color:var(--acc-ink);height:38px;padding:0 18px;border-radius:10px;font-weight:700;box-shadow:0 2px 8px color-mix(in srgb,var(--acc) 40%,transparent)}
.btn.gold:hover{filter:brightness(.97)}
.notif-pop{position:absolute;top:54px;right:20px;width:380px;max-height:460px;overflow:auto;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(0,0,0,.16);z-index:60}
.notif-pop .np-head{position:sticky;top:0;display:flex;align-items:center;justify-content:space-between;padding:8px 8px 8px 14px;background:#fff;border-bottom:1px solid var(--line)}
.notif-pop .np-x{border:0;background:none;font-size:24px;line-height:1;width:36px;height:36px;border-radius:8px;cursor:pointer;color:var(--muted)}
.notif-pop a{display:block;padding:10px 14px;border-bottom:1px solid var(--soft);color:var(--ink);font-size:13.5px;text-decoration:none}
.notif-pop a:hover{background:var(--soft)}
.notif-pop a.unread{background:color-mix(in srgb,var(--acc) 12%,#fff)}
.notif-pop a small{display:block;color:var(--muted);font-size:11.5px}
.main{position:relative}
.main.chatmode{height:100vh;overflow:hidden}
.main.chatmode #view{padding:0;overflow:hidden}
.main.chatmode .msgr{height:calc(100vh - 58px)}
.tabbar{display:none}
.bnav{display:none!important}
.main:has(#btn-new) #view>.top [data-act=new-deal]{display:none}
/* третья колонка мессенджера */
.mi{display:none}
@media (min-width:1280px){
  .msgr .mi{display:flex;flex-direction:column;width:330px;flex:none;border-left:1px solid var(--line);background:#fff;overflow:auto}
  .msgr:not(.has-open) .mi,.msgr.info-off .mi{display:none}
}
.mi-top{text-align:center;padding:24px 16px 12px}
.mi-top .av{margin:0 auto;box-shadow:0 0 0 6px color-mix(in srgb,var(--acc) 25%,transparent)}
.mi-top h3{margin:12px 0 2px;font-size:19px;font-weight:800}
.mi-acts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:6px 14px 16px;border-bottom:1px solid var(--line)}
.mi-acts button{border:0;background:var(--soft);border-radius:12px;padding:10px 4px;font-size:12px;font-weight:600;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--ink)}
.mi-acts button:hover{background:color-mix(in srgb,var(--acc) 30%,var(--soft))}
.mi-acts button span{font-size:20px}
.mi-sec{padding:12px 14px;border-bottom:1px solid var(--line)}
.mi-sec h6{margin:0 0 8px;font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--muted)}
.mi-u{display:flex;align-items:center;gap:10px;padding:6px 0}
.mi-u b{font-size:14px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mi-own{font-size:11px;font-weight:700;background:color-mix(in srgb,var(--acc) 35%,#fff);color:var(--ink);border-radius:999px;padding:2px 8px}
.mi-own.adm{background:var(--soft);color:var(--muted)}
.mi-btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.mi-tabs{display:flex;gap:4px;margin-bottom:10px}
.mi-tabs button{flex:1;border:0;background:none;border-bottom:2px solid transparent;padding:6px 2px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;display:flex;flex-direction:column;align-items:center}
.mi-tabs button b{font-size:15px;color:var(--ink)}
.mi-tabs button.on{border-bottom-color:var(--acc);color:var(--ink)}
.mi-media{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.mi-media a{aspect-ratio:1;border-radius:10px;background:var(--soft);display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;text-decoration:none;color:var(--ink);font-size:22px}
.mi-media img{width:100%;height:100%;object-fit:cover}
.mi-media small{font-size:10px;color:var(--muted);max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mi-media p{grid-column:1/-1}
@media (max-width:1100px){.gsearch input{width:190px}}
@media (max-width:860px){
  html,body{overflow-x:hidden}
  .side{display:flex;position:fixed;top:0;bottom:0;left:calc(-1 * min(300px,86vw) - 20px);width:min(300px,86vw);height:100%;transition:left .2s;box-shadow:0 0 40px rgba(0,0,0,.35);padding-bottom:calc(62px + env(safe-area-inset-bottom))}
  .app.menu .side{left:0}
  .side .nav{overscroll-behavior:contain;-webkit-overflow-scrolling:touch} /* прокрутка меню не уводит страницу под ним */
  .app.menu::after{content:"";position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:25}
  .side-clock b{font-size:30px}
  .side .nav a{padding:9px 16px 9px 15px;font-size:15px}
  .tbar{padding:8px 12px;height:auto;min-height:54px;flex-wrap:wrap;row-gap:8px;column-gap:6px;position:sticky}
  .tbar h1{order:1;flex:1 1 0;font-size:17px;line-height:1.22}
  .tbar h1 .pdot{align-self:flex-start;margin-top:6px}
  .tbar .s-toggle{display:inline-flex;order:2}
  .tbar .bell{order:3}
  .tbar #btn-new{order:4;width:40px;height:40px;padding:0;border-radius:50%;font-size:0;flex:0 0 40px}
  .tbar #btn-new::before{content:"+";font-size:26px;font-weight:600;line-height:1}
  .tbar .gsearch{display:none;order:5;flex:1 1 100%}
  .tbar.search-open .gsearch{display:block}
  .tbar .gsearch input{width:100%}
  .tbar .gsearch .drop{width:auto;left:0;right:0}
  #view{padding:12px 12px calc(84px + env(safe-area-inset-bottom))}
  .main>.demo{margin:10px 12px 0}
  .notif-pop{position:fixed;top:calc(62px + env(safe-area-inset-top));left:8px;right:8px;width:auto;max-height:calc(100dvh - 90px);z-index:80}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:24;background:#fff;border-top:1px solid var(--line);box-shadow:0 -4px 18px rgba(0,0,0,.08);padding:4px 4px calc(4px + env(safe-area-inset-bottom));justify-content:space-around;align-items:flex-end}
  .tabbar a,.tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;background:none;border:0;color:var(--muted);font-size:10.5px;font-weight:600;text-decoration:none;padding:4px 0;cursor:pointer;min-width:0}
  .tabbar .tb-i{position:relative;font-size:21px;line-height:1.1}
  .tabbar .tb-i .cbadge{position:absolute;top:-4px;left:62%;margin:0;font-size:10px;padding:0 5px}
  .tabbar .on{color:var(--ink)}
  .tabbar .on .tb-i{filter:drop-shadow(0 2px 0 var(--acc))}
  .tabbar .tb-margo{color:var(--ink);margin-top:-18px}
  .tabbar .tb-margo .nm-av{width:48px;height:48px;flex-basis:48px;font-size:22px;border-width:3px;box-shadow:0 4px 14px rgba(0,0,0,.25)}
  .app.in-room .tabbar{display:none}
  .app.menu .tabbar{z-index:31}
  .main.chatmode{height:100dvh}
  .main.chatmode .msgr{height:calc(100dvh - 54px - 62px - env(safe-area-inset-bottom))}
  .app.in-room .main.chatmode .msgr{height:calc(100dvh - 54px)}
  .main.chatmode .tbar{display:none}
  .main.chatmode .msgr{height:calc(100dvh - 62px - env(safe-area-inset-bottom))}
  .app.in-room .main.chatmode .msgr{height:100dvh}
}

/* ===== Логотип, приложение ===== */
.side .logo .logo-mark{width:42px;height:46px;object-fit:contain;flex:none;filter:drop-shadow(0 0 6px color-mix(in srgb,var(--acc) 35%,transparent))}
.login .login-logo{display:block;width:100%;max-width:280px;margin:0 auto 4px;height:auto}
.login .login-sub{text-align:center;font-size:12px;font-weight:700;letter-spacing:.08em;color:var(--muted);margin:0 0 18px;text-transform:uppercase}
.app-banner{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:120;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 14px 40px rgba(0,0,0,.18);padding:10px 12px;max-width:calc(100vw - 24px);width:460px}
.app-banner img{width:40px;height:40px;border-radius:10px;flex:none}
.app-banner .ab-t{flex:1;min-width:0}.app-banner .ab-t b{display:block;font-size:14px}.app-banner .ab-t span{display:block;font-size:12px;color:var(--muted)}
.app-banner .btn.gold{height:34px;padding:0 14px}
.sh-body ol{padding-left:20px;line-height:1.7}
@media (max-width:860px){.app-banner{bottom:calc(74px + env(safe-area-inset-bottom))}.tbar .tb-undo{display:none}}
/* ===== Настройки: вкладки и карточки интеграций (как в CRM ДЕЗ ПКБ) ===== */
.stabs{display:flex;gap:2px;flex-wrap:wrap;background:#fff;border:1px solid var(--line);border-radius:12px;padding:3px;margin:0 0 16px;width:max-content;max-width:100%}
.stabs button{border:0;background:none;border-radius:9px;padding:8px 14px;font-weight:600;font-size:14px;color:var(--muted);cursor:pointer;white-space:nowrap}
.stabs button:hover{color:var(--ink);background:var(--soft)}
.stabs button.on{background:#111;color:var(--acc)}
.igrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.icard{display:flex;flex-direction:column;gap:6px;text-align:left;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;min-height:150px;box-shadow:var(--shadow);font:inherit;color:inherit}
button.icard{cursor:pointer;transition:transform .12s,box-shadow .12s}
button.icard:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08)}
.icard.dev{background:transparent;border-style:dashed;box-shadow:none}
.icard .ih{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;flex-wrap:wrap}
.icard .ih b{font-size:17px;font-weight:800;letter-spacing:-.01em}
.icard p{margin:0;color:var(--muted);font-size:14px;line-height:1.45}
.ibadge{font-size:12.5px;font-weight:700;border-radius:7px;padding:3px 9px;white-space:nowrap}
.ibadge.ok{background:#e2f5e9;color:#1f7a3d}
.ibadge.set{background:#fdf1d6;color:#8a6200}
.ibadge.dev{background:var(--soft);color:var(--muted);font-weight:600;font-size:12px}
.iback{margin-bottom:12px}
#sf>.card{margin-bottom:12px}
.set-save{width:100%;margin-top:6px;position:sticky;bottom:16px}
@media (max-width:860px){.igrid{grid-template-columns:1fr 1fr;gap:10px}.icard{min-height:0;padding:12px}.icard .ih b{font-size:15px}.icard p{font-size:12.5px}.set-save{bottom:calc(78px + env(safe-area-inset-bottom))}}
@media (max-width:420px){.igrid{grid-template-columns:1fr}}
/* ---------- Слова нигде не обрезаются: вместо «…» — перенос на следующую строку ----------
   Названия, имена, пункты меню, заголовки окон, записи календаря, кнопки и метки — целиком.
   Превью длинных сообщений в списке чатов — до двух строк, целыми словами. */
.list .item .grow b,.sh-head h2,.mli .r1 b,.mch .tt,.nav a .n-l,.side .me b,.mi-u b,.mi-media small,.ce span,.ce em,.cmonth .cmi,.side .logo b{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:break-word;hyphens:auto}
.nav a{align-items:flex-start}.nav a .n-l{line-height:1.25;padding-top:1px}.nav a .n-ic{flex:none}
.pv,.pinbar,.rq span,.rbar span{white-space:normal;text-overflow:clip;overflow-wrap:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.btn,.pill,.tag,.stg,.tp,.stabs button,.ibadge,.side .side-mini a,.side-mini button{white-space:normal;overflow-wrap:break-word;text-align:center;line-height:1.2}
.btn{max-width:100%}
.nprj button{text-overflow:clip;overflow:visible;white-space:nowrap;font-size:11px;letter-spacing:0}
/* MAX: кнопка привязки у сотрудника, код; настройки «По проектам» */
.maxlink{margin:6px 12px 0;border:1px dashed rgba(255,255,255,.3);background:rgba(255,255,255,.05);color:#fff;border-radius:9px;padding:8px 10px;font-size:13px;font-weight:600;cursor:pointer;text-align:left}
.maxlink:hover{background:rgba(255,255,255,.12)}
.maxcode{font-size:34px;font-weight:800;letter-spacing:.18em;text-align:center;background:var(--soft);border-radius:12px;padding:14px;margin:8px 0;user-select:all}
.ppick{margin:0 0 12px}.ppick .pill{gap:7px}.ppick .pill.on{background:var(--ink);color:#fff;border-color:var(--ink)}.ppick .pdot{width:10px;height:10px;border-radius:50%;display:inline-block;flex:none}
.pcard .psub{border-top:1px solid var(--line);padding-top:10px;margin-top:12px}.pcard .psub h3{font-size:15px;margin:0 0 6px}
/* Тендеры КС БРАВОСТИЛЬ — как в CRM ДЕЗ ПКБ: цветной статус слева, «осталось N дней», карточка с ключевыми цифрами и вкладками */
.tn{padding:12px 16px;margin-bottom:10px}.tn-t{display:block;font-size:15.5px;margin:4px 0 2px;line-height:1.35}.tn-p{font-size:17px;font-weight:800;color:var(--ink)}
.tn,.tdc{--st:#c9ccd6;--st-bg:#f2f3f6;--st-ink:#55576d;border-left:5px solid var(--st)}
.st-new{--st:#2f6fdb;--st-bg:#e4ecfb;--st-ink:#1f4fa8}.st-watch{--st:#7f8ba3;--st-bg:#edf0f5;--st-ink:#4b5670}
.st-calc{--st:#8e44ad;--st-bg:#f3e6f8;--st-ink:#6c2f86}.st-go{--st:#e67e22;--st-bg:#fdebd8;--st-ink:#a45410}
.st-submitted{--st:#d4a017;--st-bg:#fbf1cf;--st-ink:#7d5d00}.st-won{--st:#2e9d5b;--st-bg:#e3f5ea;--st-ink:#1f7a45}
.st-lost{--st:#c0392b;--st-bg:#fde2e1;--st-ink:#a12d21}.st-skip{--st:#b5b8c2;--st-bg:#eef0f4;--st-ink:#6b6e7a}
.tn.st-skip,.tn.st-lost{opacity:.72}
.tn-st{display:inline-flex;align-items:center;gap:5px;background:var(--st-bg);color:var(--st-ink);border-radius:999px;padding:2px 10px;font-size:12.5px;font-weight:700}
.tn-st::before{content:'';width:8px;height:8px;border-radius:50%;background:var(--st)}
.tn-f{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.tn-f button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;color:var(--ink)}
.tn-f button i{width:9px;height:9px;border-radius:50%;background:var(--st)}.tn-f button b{font-weight:700;color:var(--muted)}
.tn-f button.on{background:var(--st-bg,var(--soft));border-color:var(--st,var(--ink));color:var(--st-ink,var(--ink));font-weight:700}.tn-f button.on b{color:inherit}
select.tst{background:var(--st-bg);color:var(--st-ink);border-color:var(--st);font-weight:700;padding:5px 8px;height:auto}
.tdc-steps{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.tdc-steps button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;color:var(--ink);display:inline-flex;align-items:center;gap:6px}
.tdc-steps button i{width:9px;height:9px;border-radius:50%;background:var(--st)}
.tdc-steps button.on{background:var(--st);border-color:var(--st);color:#fff;font-weight:700}.tdc-steps button.on i{background:#fff}
.tdc-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin:14px 0 0}
.tdc-kpi>div{background:#f7f7fb;border:1px solid var(--line);border-radius:12px;padding:10px 12px;min-width:0}
.tdc-kpi .l{font-size:12px;color:var(--muted)}.tdc-kpi .v{font-size:16px;font-weight:800;margin-top:3px;color:var(--ink);overflow-wrap:anywhere}
.tdc-kpi .v.ok{color:#1f7a45}.tdc-kpi .v.warn{color:#8a5a00}.tdc-kpi .s{font-size:12px;color:var(--muted);margin-top:4px}
.tdc-tabs{display:flex;gap:4px;box-shadow:inset 0 -2px 0 var(--line);margin:18px 0 0;overflow-x:auto;overflow-y:hidden}
.tdc-tabs button{border:0;background:none;padding:10px 16px;font-size:15px;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.tdc-tabs button.on{color:var(--ink);border-bottom-color:var(--acc)}.tdc-tabs button b{font-size:12px;background:#ecebf2;border-radius:999px;padding:1px 7px;margin-left:4px;color:#55576d}
.tdc-sec{margin-top:14px}.tdc-sec h3{margin:0 0 10px;font-size:16px;display:flex;align-items:center;gap:8px}
.tdc-dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.tdc-grp{border:1px solid var(--line);border-radius:12px;padding:12px 14px}.tdc-grp h4{margin:0 0 8px;font-size:13px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.tdc-grp dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 12px;font-size:14px}.tdc-grp dt{color:var(--muted)}.tdc-grp dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.tdc-doc{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;margin-bottom:8px}
.tdc-doc .ic{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:800;color:#fff;background:#7f8ba3;flex:none;text-transform:uppercase}
.tdc-doc .ic.pdf{background:#d9453b}.tdc-doc .ic.doc,.tdc-doc .ic.docx,.tdc-doc .ic.rtf{background:#2f6fdb}.tdc-doc .ic.xls,.tdc-doc .ic.xlsx{background:#2e9d5b}.tdc-doc .ic.zip,.tdc-doc .ic.rar{background:#8e44ad}
.tdc-doc .n{flex:1;min-width:0;overflow-wrap:anywhere;font-weight:600}
.tdc-riv{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px}
.tdc-riv>div{border:1px solid var(--line);border-radius:12px;padding:12px 14px}.tdc-riv .nm{font-weight:800}.tdc-riv .nums{display:flex;gap:14px;margin-top:8px;font-size:13px}.tdc-riv .nums b{display:block;font-size:16px}
.tdc-past{border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.tdc-past .tt{font-weight:700;color:inherit;display:block;line-height:1.35}.tdc-past .row{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:8px;font-size:13px}.tdc-past .row span{color:var(--muted)}.tdc-past .row b{color:var(--ink)}
.tdc-off{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px}.tdc-off span{font-size:12.5px;background:#f2f3f6;border-radius:8px;padding:3px 9px}.tdc-off span.win{background:#e3f5ea;color:#1f7a45;font-weight:700}
.tdc-note{margin-top:10px;padding:10px 12px;background:#fff8e6;border:1px solid #f1d58a;border-radius:10px;white-space:pre-wrap;font-size:14px}
.tn-left{font-size:14px;font-weight:800;border-radius:999px;padding:4px 12px}.tn-left.red{background:#fde2e1;color:#c0392b}.tn-left.yellow{background:#fbefcf;color:#8a5a00}.tn-left.green{background:#e3f5ea;color:#1f7a45}.tn-left.gray{background:#eef0f4;color:var(--muted)}
/* Авито: чаты по всем объявлениям — список слева, переписка справа (на телефоне — по очереди) */
.avwrap{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:12px;align-items:start}
.avlist{padding:8px;max-height:calc(100vh - 230px);overflow:auto}
.avc{display:flex;gap:10px;align-items:center;padding:8px;border-radius:10px;color:inherit;text-decoration:none}.avc:hover{background:var(--soft)}.avc.on{background:#fff3dc}
.avc img,.avc .avc-ph{width:52px;height:40px;border-radius:7px;object-fit:cover;flex:none;background:var(--soft);display:grid;place-items:center}
.avc .grow{min-width:0;display:flex;flex-direction:column}.avc .grow>*{overflow-wrap:anywhere}
.avc-r{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:none}.avc-r .pdot{width:10px;height:10px;border-radius:50%;display:inline-block}
.avchat{display:flex;flex-direction:column;min-height:420px;max-height:calc(100vh - 230px);padding:0;overflow:hidden}
.avhead{display:flex;gap:10px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line)}.avhead img{width:56px;height:42px;border-radius:7px;object-fit:cover}.avhead .av-back{display:none}
.avmsgs{flex:1;overflow:auto;padding:12px 14px;display:flex;flex-direction:column;gap:6px;background:#fafaf7}
.avm{max-width:78%;padding:8px 11px;border-radius:12px;background:#fff;border:1px solid var(--line);align-self:flex-start;overflow-wrap:anywhere;white-space:pre-wrap}
.avm.out{align-self:flex-end;background:#e7f6ec;border-color:#cfead8}.avm span{display:block;font-size:11px;color:var(--muted);margin-top:3px;text-align:right}
.avm img{max-width:240px;max-height:240px;border-radius:8px;display:block}
.avsys{align-self:center;font-size:12px;color:var(--muted);background:var(--soft);border-radius:8px;padding:3px 9px;text-align:center}
.avform{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);align-items:flex-end}.avform textarea{flex:1;resize:vertical;min-height:44px}
@media (max-width:860px){.avwrap{grid-template-columns:1fr}.avwrap.has-open .avlist{display:none}.avwrap:not(.has-open) .avchat{display:none}.avhead .av-back{display:inline-flex}.avlist,.avchat{max-height:none}.avchat{height:calc(100dvh - 250px)}}
/* Авито v2: читаемые строки чатов и переписка (имя — главное, объявление — подпись, сообщение — основной текст) */
.avlist{padding:4px 0}
.avlist .pills{padding:8px 10px 6px;margin:0}
.avc{gap:12px;align-items:flex-start;padding:12px 14px;border-radius:0;border-bottom:1px solid var(--line)}
.avc:last-child{border-bottom:0}.avc:hover{background:#f7f7f3}.avc.on{background:#fff6dd;box-shadow:inset 3px 0 0 var(--acc)}
.avc img,.avc .avc-ph{width:46px;height:46px;border-radius:10px;margin-top:2px}
.avc-b{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.avc-top{display:flex;align-items:baseline;gap:8px}
.avc-n{flex:1;min-width:0;font-size:15px;font-weight:800;color:var(--ink);line-height:1.25;overflow-wrap:anywhere}
.avc-t{flex:none;font-size:12px;color:var(--muted);font-weight:600}
.avc-item{display:flex;align-items:baseline;gap:6px;font-size:12px;color:#8a8a84;line-height:1.3;font-weight:500}
.avc-item i{width:8px;height:8px;border-radius:50%;flex:none;display:inline-block;transform:translateY(-1px)}
.avc-last{font-size:13.5px;color:#3c3c38;line-height:1.4;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:break-word}
.avc-last em{font-style:normal;color:#9a9a94;font-weight:600}
.avc.in .avc-last{color:var(--ink);font-weight:600}
.avhead b{font-size:16px}.avhead .small{font-size:12.5px;line-height:1.35}
.avmsgs{gap:10px;padding:16px 18px}
.avm{font-size:14.5px;line-height:1.5;padding:10px 14px;border-radius:14px;box-shadow:0 1px 2px rgba(0,0,0,.05)}
.avm.in{border-top-left-radius:4px}.avm.out{border-top-right-radius:4px;background:#e3f4e8;border-color:#cbe8d4}
.avm span{font-size:11px;color:#9a9a94;margin-top:4px}
/* Почта: список писем слева, письмо справа (на телефоне — по очереди) */
.mailwrap{display:grid;grid-template-columns:minmax(280px,400px) 1fr;gap:12px;align-items:start}
.mail-list{padding:0;max-height:calc(100vh - 240px);overflow:auto}
.mail-row{display:block;padding:11px 14px;border-bottom:1px solid var(--line);color:inherit;text-decoration:none}.mail-row:hover{background:#f7f7f3}.mail-row.on{background:#fff6dd;box-shadow:inset 3px 0 0 var(--acc)}
.mail-row .mr-top{display:flex;gap:8px;align-items:baseline}.mail-row .mr-top b{flex:1;min-width:0;font-size:14.5px;overflow-wrap:anywhere}.mail-row .mr-top span{font-size:12px;color:var(--muted);flex:none}
.mail-row .mr-subj{font-size:14px;color:var(--ink);margin-top:2px;overflow-wrap:anywhere}
.mail-row .mr-prev{font-size:12.5px;color:#8a8a84;margin-top:2px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.mail-row .mr-acc{font-size:11.5px;color:var(--muted);margin-top:4px}
.mail-row.unseen .mr-top b,.mail-row.unseen .mr-subj{font-weight:800}.mail-row.unseen{box-shadow:inset 3px 0 0 #2f6fdb}
.mail-view h2{font-size:19px;line-height:1.3}.mail-view .mv-back{display:none;margin-bottom:8px}
iframe.mail-html{width:100%;border:0;min-height:200px;background:#fff;border-radius:8px}
.mail-text{white-space:pre-wrap;font:14.5px/1.55 inherit;font-family:inherit;margin:0;overflow-wrap:anywhere}
@media (max-width:860px){.mailwrap{grid-template-columns:1fr}.mailwrap.has-open .mail-list{display:none}.mailwrap:not(.has-open) #mview{display:none}.mail-view .mv-back{display:inline-flex}.mail-list{max-height:none}}
/* Метрика сайтов */
.mk-kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.mk-scroll{display:inline-block;width:60px;height:7px;border-radius:4px;background:var(--soft);vertical-align:middle;overflow:hidden}.mk-scroll i{display:block;height:100%;background:var(--acc)}
.mk-people{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px}
.mk-p{text-align:left;border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:3px;cursor:pointer;font:inherit}
.mk-p.hot{border-color:#f5c26b;background:#fffaf0}.mk-p.lead{border-color:#bfe5cc;background:#f3fbf6}
.mk-signs{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.mk-signs i{font-style:normal;font-size:11.5px;background:var(--soft);border-radius:6px;padding:1px 7px}
.mk-sess{border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:10px}
.mk-evs{margin-top:8px;display:flex;flex-direction:column;gap:3px}
.mk-ev{display:grid;grid-template-columns:44px 150px 1fr;gap:8px;font-size:13px;align-items:baseline}.mk-ev time{color:var(--muted);font-size:12px}
@media (max-width:640px){.mk-ev{grid-template-columns:40px 1fr}.mk-ev span:nth-child(2){display:none}}