/* DAD CRM v4 — brand colours from digitalagencydelhi.com (navy + orange→coral), calm layout, light motion */
:root{--navy:#12194a;--navy2:#1d2a7a;--blue:#2537b8;--acc:#004890;--acc2:#0E8FCC;--grad:linear-gradient(135deg,#0E8FCC 0%,#004890 100%);--hero:linear-gradient(135deg,#12194a 0%,#1d2a7a 60%,#2537b8 100%);
--ink:#0f172a;--muted:#64748b;--faint:#94a3b8;--line:#e2e8f0;--bg:#f7f7fb;--card:#fff;--sunk:#f1f3f9;--tint:#eceaf5;
--ok:#0f9d6b;--ok-bg:#e3f7ef;--warn:#b26b00;--warn-bg:#fff3dd;--bad:#e02f45;--bad-bg:#fde8eb;--info:#2537b8;--info-bg:#e9ecfb;--pur:#6b4bd1;--pur-bg:#efeafd;
--r:14px;--sh:0 1px 2px rgba(18,25,74,.04),0 4px 14px rgba(18,25,74,.05);--sh2:0 10px 30px rgba(18,25,74,.12);--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}html,body{margin:0}
body{font:14px/1.55 Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:Poppins,Inter,sans-serif;margin:0;font-weight:600;letter-spacing:-.01em;color:var(--navy)}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
.app{display:flex;min-height:100vh}
.side{width:248px;flex:none;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:10px;padding:18px 18px 16px}
.brand img{width:38px;height:38px;border-radius:10px;object-fit:contain;border:1px solid var(--line);padding:2px;background:#fff}
.brand b{font-family:Poppins,sans-serif;font-size:14.5px;color:var(--navy);display:block;line-height:1.2}.brand small{font-size:11.5px;color:var(--muted)}
.nav{padding:6px 12px;flex:1;overflow-y:auto}
.nav a{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:10px;color:#475569;font-weight:500;font-size:14px;margin:2px 0;text-decoration:none;transition:background .15s,color .15s}
.nav a:hover{background:var(--sunk);color:var(--navy)}
.nav a.on{background:var(--tint);color:var(--navy);font-weight:600;box-shadow:inset 3px 0 0 var(--acc)}
.nav a svg{width:19px;height:19px;flex:none}
.nav .ct{margin-left:auto;background:var(--sunk);color:var(--muted);font-size:11px;padding:1px 8px;border-radius:999px;font-weight:600}
.nav .ct.hot{background:var(--grad);color:#fff}
.me{border-top:1px solid var(--line);padding:12px 14px;display:flex;align-items:center;gap:10px}
.av{width:32px;height:32px;border-radius:50%;background:var(--hero);color:#fff;display:grid;place-items:center;font-weight:600;font-size:12.5px;flex:none}
.av.lg{width:46px;height:46px;font-size:16px}
.me b{font-size:13px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.me small{font-size:11.5px;color:var(--muted)}
.mebtn{margin-left:auto;background:none;border:0;color:var(--faint);cursor:pointer;padding:6px;border-radius:8px;display:grid;place-items:center}.mebtn+.mebtn{margin-left:0}
.mebtn:hover{background:var(--sunk);color:var(--navy)}.mebtn svg{width:18px;height:18px}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.hdr{height:64px;display:flex;align-items:center;gap:14px;padding:0 32px;background:rgba(247,247,251,.85);backdrop-filter:blur(8px);position:sticky;top:0;z-index:30;border-bottom:1px solid transparent}
.burger{display:none;background:none;border:0;padding:6px;cursor:pointer;color:var(--navy)}.burger svg{width:22px;height:22px}
.gsearch{flex:1;max-width:520px;position:relative}
.gsearch input{width:100%;height:40px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 14px 0 38px;outline:none;transition:border .15s,box-shadow .15s;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%2394a3b8' stroke-width='2' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:13px center}
.gsearch input:focus{border-color:#aab4ee;box-shadow:0 0 0 4px rgba(37,55,184,.08)}
.gres{position:absolute;top:46px;left:0;right:0;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh2);padding:6px;max-height:60vh;overflow:auto;animation:pop .18s var(--ease)}
.gres a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:8px;color:var(--ink);text-decoration:none}.gres a:hover{background:var(--sunk)}
.gres a small{margin-left:auto;color:var(--muted);font-size:12px}.gnone{padding:12px;color:var(--muted)}
.hsp{flex:1}.cmenu{position:relative;margin-left:auto}
.cpop{position:absolute;right:0;top:46px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--sh2);padding:6px;min-width:200px;animation:pop .18s var(--ease);z-index:40}
.cpop button{display:block;width:100%;text-align:left;border:0;background:none;padding:9px 12px;border-radius:8px;cursor:pointer}.cpop button:hover{background:var(--sunk)}
.page{padding:8px 32px 64px;max-width:1440px;width:100%;margin:0 auto;animation:fadeUp .35s var(--ease)}
.secbar{display:flex;gap:4px;margin:4px 0 18px;border-bottom:1px solid var(--line);overflow-x:auto}
.secbar a{padding:10px 14px;color:var(--muted);font-weight:500;text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.secbar a.on{color:var(--navy);border-color:var(--acc);font-weight:600}.secbar a:hover{color:var(--navy)}
.top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin:8px 0 22px;flex-wrap:wrap}
.top h1{font-size:24px}.top .sub{color:var(--muted);font-size:13.5px;margin-top:4px}
.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.btn{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 16px;border-radius:10px;border:1px solid var(--line);background:#fff;color:var(--navy);font-weight:600;font-size:13.5px;cursor:pointer;white-space:nowrap;text-decoration:none;transition:transform .12s,box-shadow .15s,background .15s}
.btn:hover{background:var(--sunk);text-decoration:none}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.55;cursor:default}
.btn.pri,.btn.grad{background:var(--grad);border:0;color:#fff;box-shadow:0 4px 14px rgba(244,54,76,.25)}.btn.pri:hover,.btn.grad:hover{box-shadow:0 6px 18px rgba(244,54,76,.35);background:var(--grad)}
.btn.ok{background:var(--ok);border-color:var(--ok);color:#fff}.btn.danger{color:var(--bad);border-color:#f6c6cd}
.btn.ghost{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);color:#fff}.btn.ghost:hover{background:rgba(255,255,255,.2)}
.btn.wa{background:#25d366;border-color:#25d366;color:#fff}.btn.wa:hover{background:#1fbd5a}
.btn.sm{height:30px;padding:0 11px;font-size:12.5px;border-radius:8px}.btn svg{width:16px;height:16px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:22px}
.kpi{background:#fff;border:0;border-radius:var(--r);padding:18px 20px;text-align:left;box-shadow:var(--sh);display:flex;flex-direction:column;gap:2px;min-width:0;font:inherit;transition:transform .2s var(--ease),box-shadow .2s;animation:fadeUp .45s var(--ease) both}
.kpi:nth-child(2){animation-delay:.05s}.kpi:nth-child(3){animation-delay:.1s}.kpi:nth-child(4){animation-delay:.15s}
.kpi[data-nav],.kpi[data-go]{cursor:pointer}.kpi[data-nav]:hover{transform:translateY(-2px);box-shadow:var(--sh2)}
.kpi small{font-size:12.5px;color:var(--muted);font-weight:500;order:2}
.kpi b{font-family:Poppins,sans-serif;font-size:28px;font-weight:600;color:var(--navy);line-height:1.2;order:1}
.kpi em{font-style:normal;font-size:12px;color:var(--faint);order:3}
.kpi.c3 b{color:var(--ok)}.kpi.c2 b{color:var(--warn)}.kpi.c5 b{color:var(--bad)}.kpi.c4 b{color:var(--blue)}.kpi.c6 b{color:var(--pur)}
.panel{background:#fff;border-radius:var(--r);box-shadow:var(--sh);margin-bottom:22px;overflow:hidden;animation:fadeUp .45s var(--ease) both}
.panel>h2{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 20px 6px;font-size:16px;flex-wrap:wrap}
.panel>h2 .pa{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-weight:500;font-size:13px;font-family:Inter,sans-serif}
.pb{padding:16px 20px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:22px}.grid3{display:grid;grid-template-columns:2fr 1fr;gap:22px}
.grid2>.panel,.grid3>.panel,.grid3>div>.panel:last-child{margin-bottom:0}
.tablewrap{overflow-x:auto}
table.dtbl{width:100%;border-collapse:collapse}
.dtbl th{text-align:left;font-size:12px;color:var(--muted);font-weight:500;padding:12px 20px;border-bottom:1px solid var(--line);white-space:nowrap}
.dtbl td{padding:14px 20px;border-bottom:1px solid #f1f5f9;vertical-align:middle}
.dtbl tr:last-child td{border-bottom:0}.dtbl tbody tr{transition:background .12s}.dtbl tbody tr:hover td{background:#fafbff}
.dtbl tr[data-task],.dtbl tr[data-act],.dtbl tr[data-client]{cursor:pointer}.dtbl .r{text-align:right}
.dsub{display:block;color:var(--muted);font-size:12.5px;margin-top:1px}.mnm,.nm{font-weight:600;color:var(--ink)}
.dempty{padding:34px 20px;text-align:center;color:var(--muted)}.dempty .btn{margin-top:12px}
.dbadge{display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--sunk);color:#475569;white-space:nowrap}
.dbadge.ok{background:var(--ok-bg);color:var(--ok)}.dbadge.warn{background:var(--warn-bg);color:var(--warn)}.dbadge.bad{background:var(--bad-bg);color:var(--bad)}.dbadge.info{background:var(--info-bg);color:var(--info)}.dbadge.pur{background:var(--pur-bg);color:var(--pur)}
.seg{display:inline-flex;gap:2px;background:var(--sunk);border-radius:12px;padding:4px;margin-bottom:18px;overflow-x:auto;max-width:100%}
.seg button{border:0;background:none;padding:8px 14px;border-radius:9px;font-weight:500;font-size:13px;color:var(--muted);cursor:pointer;white-space:nowrap;transition:background .15s,color .15s}
.seg button.on{background:#fff;color:var(--navy);font-weight:600;box-shadow:var(--sh)}
.seg .sc{color:var(--faint);margin-left:6px;font-size:11.5px}
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.dsel,.inp{height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:0 12px;max-width:100%}
.inp.search{min-width:240px}
.fld{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:600;color:#475569;margin-bottom:14px}
.fld input,.fld select,.fld textarea{border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-weight:400;font-size:14px;color:var(--ink);background:#fff;width:100%;transition:border .15s,box-shadow .15s}
.fld textarea{resize:vertical;min-height:80px}
.fld input:focus,.fld select:focus,.fld textarea:focus,.inp:focus,.dsel:focus{outline:none;border-color:#aab4ee;box-shadow:0 0 0 4px rgba(37,55,184,.08)}
.f2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.f3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:0 14px}
.chk{display:flex;align-items:center;gap:8px;font-size:13.5px;margin-bottom:12px;cursor:pointer}.chk input{width:16px;height:16px;accent-color:var(--acc)}
.derr{color:var(--bad);font-size:13px}.derr:empty{display:none}
.dacts{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;flex-wrap:wrap;align-items:center}
/* drawer (all detail views and forms open on the right) */
#layer .ov{position:fixed;inset:0;background:rgba(15,23,42,.35);z-index:100;display:flex;justify-content:flex-end;animation:fade .2s ease}
#layer .dm{background:#fff;width:100%;max-width:480px;height:100vh;overflow-y:auto;padding:22px 24px 32px;box-shadow:-20px 0 50px rgba(15,23,42,.18);animation:slideIn .28s var(--ease)}
#layer .dm.wide{max-width:640px}
.dmh{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:16px;gap:12px;position:sticky;top:-22px;background:#fff;padding:4px 0 10px;z-index:2}
.dmh h3{font-size:18px;line-height:1.35}.dmh .x{border:0;background:var(--sunk);width:34px;height:34px;border-radius:10px;font-size:20px;cursor:pointer;color:var(--muted);flex:none}
.dtoast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:var(--navy);color:#fff;padding:12px 18px;border-radius:12px;z-index:200;font-weight:500;box-shadow:var(--sh2);max-width:90vw;animation:toast .3s var(--ease)}
.dtoast.bad{background:var(--bad)}
/* inbox */
.itabs{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.itabs>button{border:0;background:none;padding:8px 12px;border-radius:9px;font-weight:600;color:var(--muted);cursor:pointer}
.itabs>button span{margin-left:6px;font-size:11.5px;background:var(--sunk);padding:1px 7px;border-radius:999px}
.itabs>button.on{color:var(--navy);background:var(--tint)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:#fff;color:var(--muted);border-radius:999px;padding:5px 12px;font-size:12.5px;cursor:pointer}.chip.on{background:var(--navy);border-color:var(--navy);color:#fff}
.ilist{display:flex;flex-direction:column}
.irow{display:flex;align-items:center;gap:14px;padding:14px 20px;border-bottom:1px solid #f1f5f9;color:var(--ink);text-decoration:none;transition:background .12s;animation:fadeUp .35s var(--ease) both}
.irow:hover{background:#fafbff;text-decoration:none}.irow:last-child{border-bottom:0}
.itype{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 8px;border-radius:6px;background:var(--sunk);color:#475569;width:78px;text-align:center;flex:none}
.t-task{background:var(--info-bg);color:var(--info)}.t-approval{background:var(--pur-bg);color:var(--pur)}.t-query{background:var(--warn-bg);color:var(--warn)}.t-lead{background:var(--ok-bg);color:var(--ok)}
.imain{flex:1;min-width:0}.imain b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.imain small{color:var(--muted);font-size:12.5px}
.iwhy{font-size:12.5px;color:var(--muted);white-space:nowrap;font-weight:500}.iwhy.bad{color:var(--bad)}.iwhy.warn{color:var(--warn)}.iwhy.ok{color:var(--ok)}.iwhy.pur{color:var(--pur)}
.panel.flush>h2{padding-bottom:12px}
.notice{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--info-bg);color:#1e2b7a;border-radius:12px;padding:12px 16px;margin-bottom:18px;font-size:13.5px;animation:fadeUp .35s var(--ease)}
.notice.warn{background:var(--warn-bg);color:#7a4a00}.notice.bad{background:var(--bad-bg);color:#8d1f2e}
/* progress */
.bar{height:8px;background:var(--sunk);border-radius:99px;overflow:hidden}.bar i{display:block;height:100%;width:var(--w,0);background:var(--grad);border-radius:99px;animation:grow 1s var(--ease)}
.bar.ok i{background:linear-gradient(90deg,#16b47e,#0f9d6b)}.bar.warn i{background:linear-gradient(90deg,#ffb347,#0E8FCC)}.bar.bad i{background:var(--bad)}
.bar.light{background:rgba(255,255,255,.18);height:10px}.bar.light i{background:var(--grad)}
.prog{display:flex;align-items:center;gap:10px}.prog .bar{flex:1}.prog b{font-size:13px;min-width:40px;text-align:right;font-weight:600}
/* client hero + services */
.chero{background:var(--hero);color:#fff;border-radius:20px;padding:28px 30px;display:grid;grid-template-columns:1.6fr 1fr;gap:24px;margin:8px 0 22px;position:relative;overflow:hidden}
.chero::after{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,122,24,.35),transparent 70%)}
.chero h1{color:#fff;font-size:24px;margin:6px 0 16px;max-width:560px}.chero small{color:#c7cdf4}
.cpct{display:flex;align-items:baseline;gap:12px;margin-bottom:10px;flex-wrap:wrap}.cpct b{font-family:Poppins,sans-serif;font-size:40px;line-height:1}.cpct span{color:#d4d9f7}
.cmgr{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:12px;position:relative;z-index:1}
.cmgr>div{display:flex;flex-direction:column}.cmgr small{color:#c7cdf4}.cmgr b{font-size:16px}
.cmgr{display:grid;grid-template-columns:auto 1fr;align-items:center}.cmgr .btn{grid-column:1/-1;justify-content:center}
.todos{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:26px}
.tdo{background:#fff;border-radius:var(--r);padding:16px 18px;box-shadow:var(--sh);display:flex;flex-direction:column;color:var(--ink);text-decoration:none;border-left:4px solid var(--info);transition:transform .2s var(--ease),box-shadow .2s}
.tdo:hover{transform:translateY(-2px);box-shadow:var(--sh2);text-decoration:none}.tdo.warn{border-color:var(--acc2)}.tdo.ok{border-color:var(--ok)}
.tdo b{font-family:Poppins,sans-serif;font-size:24px;color:var(--navy)}.tdo span{color:var(--muted)}.tdo em{font-style:normal;color:var(--blue);font-size:12.5px;margin-top:6px;font-weight:600}
.shead{font-size:18px;margin:6px 0 14px}
.svcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px;margin-bottom:28px}
.svc{background:#fff;border-radius:18px;padding:20px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:10px;position:relative;transition:transform .25s var(--ease),box-shadow .25s;animation:fadeUp .5s var(--ease) both;animation-delay:calc(var(--i,0)*60ms)}
.svc:hover{transform:translateY(-4px);box-shadow:var(--sh2)}
.svc.on{border-top:4px solid transparent;background:linear-gradient(#fff,#fff) padding-box,var(--grad) border-box}
.svh{display:flex;justify-content:space-between;align-items:center}
.sico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--tint);color:var(--navy)}.sico svg{width:22px;height:22px}
.svc.on .sico{background:var(--grad);color:#fff}
.svc h3{font-size:16px}.stag{margin:-6px 0 0;color:var(--muted);font-size:13px}
.sprog .spt{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}.sprog b{font-family:Poppins,sans-serif;font-size:22px;color:var(--navy)}.sprog span{color:var(--muted);font-size:13px}.sprog em{margin-left:auto;font-style:normal;font-weight:600;color:var(--acc)}
.sres{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:var(--sunk);border-radius:12px;padding:10px}.sres b{display:block;font-family:Poppins,sans-serif;color:var(--navy)}.sres small{color:var(--muted);font-size:11.5px}
.snext{display:flex;flex-direction:column;gap:8px;border-top:1px solid #f1f5f9;padding-top:10px}.snext small{display:block;color:var(--faint);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em}.snext span{font-size:13px}
.svc.locked{background:#fbfbfe;border:1px dashed #d6daf0;box-shadow:none}.svc.locked:hover{box-shadow:var(--sh)}
.svc.locked h3{color:#3b456f}.lock{width:30px;height:30px;border-radius:50%;background:#fff;border:1px solid var(--line);display:grid;place-items:center;color:var(--faint)}.lock svg{width:15px;height:15px}
.spitch{margin:0;font-size:13.5px;color:#334155}.sben{margin:0;padding-left:18px;color:var(--muted);font-size:13px}.sben li{margin:2px 0}
.svc.locked .btn{align-self:flex-start;margin-top:auto}
.svrow{padding:16px 0;border-bottom:1px solid #f1f5f9}.svrow:last-child{border-bottom:0}
/* other */
.todo,.board,.col,.tcard{}
.cl{list-style:none;margin:0;padding:0}.cl li{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-bottom:1px dashed var(--line)}.cl li:last-child{border-bottom:0}
.cl input{margin-top:3px;width:16px;height:16px;flex:none;accent-color:var(--ok)}.cl li.d span{text-decoration:line-through;color:var(--faint)}
.thread{display:flex;flex-direction:column;gap:10px;max-height:46vh;overflow-y:auto;padding:4px 2px}
.msg{background:var(--sunk);border-radius:12px;padding:10px 13px;max-width:88%;animation:fadeUp .25s var(--ease)}.msg.mine{align-self:flex-end;background:var(--info-bg)}.msg.int{background:var(--warn-bg)}
.msg small{display:block;color:var(--muted);font-size:11.5px;margin-bottom:2px;font-weight:600}
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px 18px}.kv div small{display:block;color:var(--muted);font-size:12px}.kv div b{font-weight:500}
.chead{display:flex;align-items:center;gap:14px;margin:8px 0 20px;flex-wrap:wrap}
.cav{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:#fff;font-weight:600;font-size:20px;flex:none;font-family:Poppins,sans-serif}
.chead h1{font-size:24px}.chead .sp{flex:1}
.ccards{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:18px}
.ccard{background:#fff;border-radius:var(--r);padding:18px;box-shadow:var(--sh);cursor:pointer;display:flex;flex-direction:column;gap:12px;transition:transform .2s var(--ease),box-shadow .2s;animation:fadeUp .45s var(--ease) both}
.ccard:hover{transform:translateY(-3px);box-shadow:var(--sh2)}.ccard .row{display:flex;align-items:center;gap:12px}.ccard .row .cav{width:40px;height:40px;font-size:15px;border-radius:11px}
.ccard .st{display:flex;justify-content:space-between;color:var(--muted);font-size:12.5px}
.login{min-height:100vh;display:grid;place-items:center;padding:20px;background:var(--hero);position:relative;overflow:hidden}
.login::after{content:"";position:absolute;right:-120px;bottom:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(255,122,24,.35),transparent 70%)}
.lbox{background:#fff;border-radius:20px;padding:32px 30px;width:100%;max-width:410px;box-shadow:0 30px 70px rgba(0,0,0,.3);position:relative;z-index:1;animation:fadeUp .5s var(--ease)}
.lbox .lg{display:flex;align-items:center;gap:12px;margin-bottom:22px}.lbox .lg img{width:46px;height:46px;border-radius:12px;border:1px solid var(--line);padding:3px}
.lbox h1{font-size:19px}.lbox p{color:var(--muted);margin:2px 0 0;font-size:13px}
.lbox .btn.pri{width:100%;justify-content:center;height:44px;font-size:14.5px}.lbox .seg{display:flex;width:100%}.lbox .seg button{flex:1}
.stars{display:flex;gap:6px}.stars button{border:0;background:none;font-size:28px;cursor:pointer;color:#d6dae6;padding:0;transition:transform .15s}.stars button:hover{transform:scale(1.15)}.stars button.on{color:#ffb020}
.muted{color:var(--muted)}.small{font-size:12.5px}.mt{margin-top:14px}.nowrap{white-space:nowrap}.mrow{display:flex;gap:10px;align-items:center;min-width:0}
.loading{display:grid;place-items:center;min-height:60vh;color:var(--muted)}
.iframe{width:100%;height:75vh;border:0;border-radius:12px;background:var(--sunk)}
.mbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
.board{display:grid;grid-template-columns:repeat(6,minmax(220px,1fr));gap:12px;overflow-x:auto}.col{background:var(--sunk);border-radius:14px;padding:10px;min-height:120px}
.col h4{font-size:12.5px;color:var(--muted);margin:2px 4px 10px;display:flex;justify-content:space-between}.tcard{background:#fff;border-radius:12px;padding:10px 12px;margin-bottom:8px;cursor:pointer;box-shadow:var(--sh)}
.tcard b{display:block;font-size:13.5px;margin-bottom:6px}.tcard .meta{display:flex;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.anim{animation:fadeUp .45s var(--ease) both}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes fade{from{opacity:0}}@keyframes slideIn{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes grow{from{width:0}}@keyframes pop{from{opacity:0;transform:translateY(-4px) scale(.98)}}@keyframes toast{from{opacity:0;transform:translate(-50%,10px)}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:1100px){.grid3,.grid2{grid-template-columns:1fr}.chero{grid-template-columns:1fr}}
@media (max-width:900px){
.side{position:fixed;left:0;top:0;z-index:60;transform:translateX(-100%);transition:transform .25s var(--ease);box-shadow:0 0 40px rgba(0,0,0,.2)}
.app.navopen .side{transform:none}.app.navopen::after{content:"";position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:50}
.burger{display:block}.hdr{padding:0 16px}.page{padding:6px 16px 60px}.todos{grid-template-columns:1fr}
.f2,.f3{grid-template-columns:1fr}.inp.search{min-width:0;flex:1}.chero{padding:22px}.chero h1{font-size:20px}
.dtbl thead{display:none}.dtbl,.dtbl tbody,.dtbl tr,.dtbl td{display:block;width:100%}.dtbl tr{border-bottom:1px solid var(--line);padding:8px 0}
.dtbl td{border:0;padding:4px 16px;display:flex;justify-content:space-between;gap:12px;text-align:right}.dtbl td::before{content:attr(data-l);font-size:12px;color:var(--muted);text-align:left}
.dtbl td[data-l=""]::before{content:none}.itype{width:auto}.iwhy{display:none}#layer .dm,#layer .dm.wide{max-width:100%}}
@media print{.side,.hdr,.actions,.seg,.filters,.secbar{display:none!important}.page{padding:0}}

.svc .dbadge{align-self:flex-start}

.hdot{width:10px;height:10px;border-radius:50%;margin-left:auto;flex:none;box-shadow:0 0 0 3px rgba(0,0,0,.03)}.hdot.ok{background:#16b47e}.hdot.warn{background:#ffb020}.hdot.bad{background:#e02f45}
.t-pay{background:var(--bad-bg);color:var(--bad)}.t-client{background:var(--tint);color:var(--navy)}

/* ===== v9 — navy-premium theme (DAD CRM research report, 4 Nov 2026) ===== */
:root{--navy:#002460;--navy2:#003a80;--blue:#004890;--acc:#004890;--acc2:#0E8FCC;--data:#0E8FCC;--grad:linear-gradient(135deg,#004890 0%,#004890 100%);--hero:linear-gradient(135deg,#002460 0%,#004890 100%);
--ink:#101828;--muted:#5d6b82;--line:#e4e8ef;--bg:#f6f8fb;--sunk:#f2f4f7;--tint:#eaf1fa;
--ok:#067647;--ok-bg:#ECFDF3;--warn:#C4320A;--warn-bg:#FFF4ED;--bad:#B42318;--bad-bg:#FEF3F2;--info:#1D4ED8;--info-bg:#EFF4FF;--pur:#5925DC;--pur-bg:#F4F3FF;--r:12px;
--sh:0 1px 2px rgba(16,24,40,.04);--sh2:0 12px 32px rgba(0,36,96,.14)}
h1,h2,h3,h4,.brand b,.kpi b{font-family:"Plus Jakarta Sans",Inter,system-ui,sans-serif}
h1,h2,h3,h4{color:var(--navy)}
.side{background:#002460;border-right:0}
.brand{border-bottom:1px solid rgba(255,255,255,.08)}.brand b{color:#fff}.brand small{color:rgba(255,255,255,.6)}.brand img{border-color:rgba(255,255,255,.2)}
.nav a{color:rgba(255,255,255,.72)}.nav a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav a.on{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 3px 0 0 #0E8FCC}
.nav .ct{background:rgba(255,255,255,.14);color:#fff}.nav .ct.hot{background:#D92D20;color:#fff}
.me{border-top-color:rgba(255,255,255,.1)}.me b{color:#fff}.me small{color:rgba(255,255,255,.6)}.me .av{background:#0E8FCC}
.mebtn{color:rgba(255,255,255,.55)}.mebtn:hover{background:rgba(255,255,255,.08);color:#fff}
.btn.pri,.btn.p{background:#004890!important;border-color:#004890!important;color:#fff!important;box-shadow:none}
.btn.pri:hover,.btn.p:hover{background:#003a80!important}
.btn{transition:background .15s,transform .15s,border-color .15s}.btn:active{transform:scale(.97)}
.card,.kpi{box-shadow:var(--sh);border-color:var(--line)}
.secbar a.on,.subs a.on,.subs button.on{color:var(--blue);border-color:var(--blue)}
.xtag{display:inline-block;background:#F4F3FF;color:#5925DC;font-weight:600;font-size:11px;padding:0 7px;border-radius:999px;margin-right:4px}
/* leads list/board toggle */
.lvt{display:inline-flex;background:var(--sunk);border-radius:10px;padding:3px;margin:0 0 14px}
.lvt button{border:0;background:none;padding:6px 14px;border-radius:8px;font-weight:600;font-size:13px;color:var(--muted);cursor:pointer}
.lvt button.on{background:#fff;color:var(--navy);box-shadow:0 1px 2px rgba(16,24,40,.08)}
.lboard{display:grid;grid-template-columns:repeat(5,minmax(200px,1fr));gap:12px;overflow-x:auto;padding-bottom:8px}
.lcol{background:var(--sunk);border-radius:12px;padding:10px;min-height:120px}
.lcol h4{display:flex;justify-content:space-between;font-size:13px;margin:2px 4px 10px}.lcol h4 em{font-style:normal;color:var(--muted);font-weight:500}
.lcard{display:block;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:8px;color:var(--ink);text-decoration:none!important;transition:transform .15s,box-shadow .15s}
.lcard:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(0,36,96,.1)}
.lcard b{display:block;font-size:13.5px}.lcard small{color:var(--muted);font-size:12px;display:block}
.lcard .lmeta{display:flex;justify-content:space-between;font-size:12px;margin-top:6px;color:var(--muted)}
.lcard em{display:block;font-style:normal;font-size:12px;color:var(--blue);margin-top:4px}
.lempty{color:var(--faint);text-align:center;padding:14px 0}
/* contract & access */
.accrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}.accrow:last-child{border-bottom:0}
.accrow select{max-width:160px}
/* billing age buckets */
.abks{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.abk{border:1px solid var(--line);border-radius:12px;padding:14px;background:#fff}.abk.warn{background:var(--warn-bg)}.abk.bad{background:var(--bad-bg)}
.abk small{color:var(--muted);font-weight:600}.abk b{display:block;font-size:22px;font-family:"Plus Jakarta Sans",Inter,sans-serif;color:var(--navy)}
.abk.warn b{color:var(--warn)}.abk.bad b{color:var(--bad)}.abk em{font-style:normal;font-size:12px;color:var(--muted);display:block;margin-bottom:6px}
.abk a{display:block;font-size:12.5px;padding:3px 0}
/* skeleton */
.skwrap{display:flex;min-height:100vh}.sk{background:linear-gradient(90deg,#eef1f5 25%,#f7f9fb 50%,#eef1f5 75%);background-size:200% 100%;animation:shim 1.2s infinite linear;border-radius:12px}
.sk-side{width:248px;border-radius:0;background:#002460;animation:none}.skmain{flex:1;padding:28px 32px}.sk-h{height:34px;width:280px;margin-bottom:22px}
.skrow{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.sk-k{height:92px}.sk-b{height:160px;margin-bottom:14px}
@keyframes shim{0%{background-position:200% 0}100%{background-position:-200% 0}}
/* mobile bottom bar */
.bnav{display:none}
@media (max-width:900px){
.bnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:45;background:#fff;border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -4px 16px rgba(16,24,40,.06)}
.bnav a{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;font-size:11px;color:var(--muted);text-decoration:none!important;padding:4px 0;position:relative;font-weight:500}
.bnav a svg{width:22px;height:22px}.bnav a.on{color:var(--blue);font-weight:700}
.bnav .ct{position:absolute;top:0;left:55%;background:#D92D20;color:#fff;font-size:10px;font-style:normal;line-height:16px;min-width:16px;text-align:center;border-radius:999px;padding:0 4px}
.page{padding-bottom:96px!important}.kpis{grid-template-columns:1fr 1fr!important;gap:10px}.kpi{padding:14px}.kpi b{font-size:22px}.lboard{grid-template-columns:repeat(5,78vw)}.abks{grid-template-columns:1fr}
.sk-side{display:none}.skmain{padding:20px 16px}.skrow{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){.sk{animation:none}}

/* ===== v10 — quick assign + clients dashboard ===== */
.asel{border:1px solid transparent;background:transparent;border-radius:8px;padding:4px 6px;font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;max-width:150px}
.asel:hover,.asel:focus{border-color:var(--line);background:#fff}.asel.none{color:var(--warn);font-weight:600}
.ccards2{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.ccard2{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;cursor:pointer;display:flex;flex-direction:column;gap:12px;transition:transform .15s,box-shadow .15s,border-color .15s;position:relative;animation:fadeUp .3s var(--ease) both}
.ccard2:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(0,36,96,.10);border-color:#cfd9e8}
.ccard2.bad{box-shadow:inset 3px 0 0 var(--bad)}.ccard2.warn{box-shadow:inset 3px 0 0 #F79009}
.cc-top{display:flex;align-items:center;gap:12px}.cc-top .cav{width:40px;height:40px;border-radius:12px;flex:none}
.cc-nm{min-width:0;flex:1}.cc-nm b{display:block;font-family:"Plus Jakarta Sans",Inter,sans-serif;font-size:15px;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-nm small{display:block;color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-chips{display:flex;flex-wrap:wrap;gap:6px}.cc-chips span{background:var(--tint);color:var(--blue);font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:999px}
.cc-chips span.muted{background:var(--sunk);color:var(--muted)}
.cc-prog small{color:var(--muted);font-size:12px}.cc-pl{display:flex;justify-content:space-between;font-size:12.5px;color:var(--muted);margin-bottom:4px}.cc-pl b{color:var(--navy)}
.cc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;background:var(--sunk);border-radius:10px;padding:8px}
.cc-stats div{text-align:center;min-width:0}.cc-stats b{display:block;font-size:14px;color:var(--navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cc-stats small{font-size:11px;color:var(--muted)}
.cc-stats .bad b{color:var(--bad)}.cc-stats .warn b{color:var(--warn)}
.cc-next{font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cc-next span{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-right:6px}
.cc-next em{font-style:normal;color:var(--muted)}.cc-next em.bad{color:var(--bad);font-weight:600}
.cc-foot{display:flex;align-items:center;gap:8px;border-top:1px solid var(--line);padding-top:10px}.cc-foot .sp{flex:1}
.cc-mgr{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--muted)}.av.sm{width:24px;height:24px;font-size:10px}
.cc-foot .btn{padding:5px 10px;font-size:12.5px}
@media (max-width:900px){.ccards2{grid-template-columns:1fr}}

/* ===== v11 — bulk bar (inline, sticky above the list) ===== */
.selb{width:16px;height:16px;margin:0 10px 0 0;vertical-align:-3px;accent-color:#004890;cursor:pointer}
#bulkbar{position:sticky;top:72px;z-index:25;margin:0 0 12px;background:#eaf1fa;border:1px solid #c7d9ef;border-radius:12px;padding:8px 10px 8px 14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;box-shadow:0 6px 18px rgba(0,36,96,.08);animation:fadeUp .18s var(--ease) both}
#bulkbar b{font-size:13.5px;color:var(--navy);white-space:nowrap;display:flex;align-items:center;gap:6px}
#bulkbar .bk-n{background:#004890;color:#fff;border-radius:999px;min-width:22px;height:22px;display:inline-grid;place-items:center;font-size:12px;padding:0 6px}
#bulkbar .bk-sp{flex:1}
#bulkbar label{font-size:12.5px;color:var(--muted);display:flex;align-items:center;gap:6px;font-weight:500}
#bulkbar select,#bulkbar input{border:1px solid var(--line);border-radius:8px;padding:6px 8px;font-size:13px;color:var(--ink);background:#fff;height:34px}
#bulkbar .btn{height:34px;padding:0 12px;font-size:13px}
#bulkbar.float{position:fixed;left:0;right:0;bottom:20px;top:auto;margin:0 auto;width:fit-content;max-width:calc(100vw - 32px)}
@media (max-width:900px){#bulkbar{top:64px}#bulkbar .bk-sp{display:none}#bulkbar label{flex:1 1 45%}#bulkbar select,#bulkbar input{flex:1}}

/* ===== v12 — client billing note + DAD Assistant ===== */
.paynote{display:flex;gap:14px;align-items:center;flex-wrap:wrap;background:#FFF4ED;border:1px solid #FBD9C4;border-radius:12px;padding:12px 16px;margin:0 0 16px;color:#7a2e0b}
.paynote b{font-family:"Plus Jakarta Sans",Inter,sans-serif}.paynote span{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13.5px}
#aifab{position:fixed;right:22px;bottom:22px;z-index:80;display:flex;align-items:center;gap:8px;background:#004890;color:#fff;border:0;border-radius:999px;padding:12px 18px 12px 14px;font-weight:600;font-size:14px;box-shadow:0 12px 30px rgba(0,36,96,.35);cursor:pointer;transition:transform .15s,background .15s}
#aifab:hover{background:#003a80;transform:translateY(-2px)}#aifab svg{width:22px;height:22px}
#aiw{position:fixed;right:22px;bottom:84px;z-index:81;width:380px;max-width:calc(100vw - 32px);height:560px;max-height:calc(100vh - 120px);background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 60px rgba(0,36,96,.25);display:flex;flex-direction:column;overflow:hidden;animation:fadeUp .2s var(--ease) both}
.aih{display:flex;align-items:center;gap:10px;padding:14px 16px;background:linear-gradient(135deg,#002460,#004890);color:#fff}
.aih b{display:block;font-family:"Plus Jakarta Sans",Inter,sans-serif;font-size:15px}.aih small{color:rgba(255,255,255,.7);font-size:12px}
.aiav{width:36px;height:36px;border-radius:50%;background:#0E8FCC;display:grid;place-items:center;font-weight:700;font-size:13px;flex:none}
.aix{margin-left:auto;background:rgba(255,255,255,.12);border:0;color:#fff;width:32px;height:32px;border-radius:10px;font-size:20px;cursor:pointer}
.aib{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;background:#f6f8fb}
.aim{max-width:86%;background:#fff;border:1px solid var(--line);border-radius:14px 14px 14px 4px;padding:10px 12px;font-size:13.5px;line-height:1.5;color:var(--ink)}
.aim.me{align-self:flex-end;background:#004890;border-color:#004890;color:#fff;border-radius:14px 14px 4px 14px}
.aim a{font-weight:600}.aim .btn.wa{margin-top:6px}.aiact{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.aiq{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px 6px;border-top:1px solid var(--line);background:#fff}
.aiq button{flex:0 1 auto;max-width:100%;border:1px solid #c7d9ef;background:#eaf1fa;color:var(--navy);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:500;cursor:pointer;white-space:normal;text-align:left}
.aiq button:hover{background:#dbe8f7}
.aif{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:#fff}
.aif input{flex:1;border:1px solid var(--line);border-radius:10px;padding:0 12px;height:40px;font-size:14px;outline:none}.aif input:focus{border-color:#004890}
@media (max-width:900px){#aifab{bottom:84px;right:16px;padding:12px}#aifab span{display:none}#aiw{right:8px;left:8px;width:auto;bottom:140px;height:auto;top:76px;max-height:none}}

.aist{padding:10px 12px;background:var(--sunk);border-radius:10px;margin:0 0 14px;font-size:13px}
.aityping{display:inline-flex;gap:4px;padding:2px 0}.aityping i{width:7px;height:7px;border-radius:50%;background:#9aa9bf;animation:aidot 1s infinite ease-in-out}.aityping i:nth-child(2){animation-delay:.15s}.aityping i:nth-child(3){animation-delay:.3s}
@keyframes aidot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.aitg{display:inline-flex;gap:6px;margin-left:8px;vertical-align:middle}.aitg .btn{padding:3px 10px;font-size:12px;height:auto}

/* ===== v14 — Meta client report ===== */
.mtop{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 16px}.mtop h1{font-size:26px}.mtop .sub{color:var(--muted);font-size:13.5px}.mtop .sp{flex:1}
.mcsel{min-width:260px;height:40px;font-weight:600}
.mfil{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px}.mfil .sp{flex:1}
.mrng{display:flex;flex-wrap:wrap;gap:4px;background:var(--sunk);border-radius:10px;padding:3px}
.mrng button{border:0;background:none;padding:6px 11px;border-radius:8px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer}.mrng button.on{background:#fff;color:var(--navy);box-shadow:0 1px 2px rgba(16,24,40,.08)}
.mcus{display:flex;align-items:center;gap:6px}.mcus .inp{height:34px;width:150px}
.mkpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0 0 16px}
.mkpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;animation:fadeUp .3s var(--ease) both}.mkpi.hl{border-color:#b9d2ef;background:linear-gradient(180deg,#f3f8fe,#fff)}
.mkpi small{display:block;color:var(--muted);font-size:12px;font-weight:600}.mkpi b{display:block;font-family:"Plus Jakarta Sans",Inter,sans-serif;font-size:22px;color:var(--navy);margin:4px 0 2px}.mkpi .msm{font-size:13px;color:var(--muted);font-weight:600}
.mdl{font-size:11.5px;color:var(--muted)}.mdl.g{color:var(--ok);font-weight:600}.mdl.b{color:var(--bad);font-weight:600}
.mchart{overflow:hidden}.mleg{display:flex;gap:14px;font-size:12px;color:var(--muted);margin:0 0 6px}.mleg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.mstat{margin:0;padding-left:18px;display:grid;gap:7px;font-size:13.5px;line-height:1.5}
.mload{display:flex;align-items:center;gap:10px;color:var(--muted);padding:18px 4px}
.mtsum{margin:0 0 12px;font-size:14px;color:var(--ink)}.mtips{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.mtip{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#fff}.mtip.high{border-left:3px solid var(--bad)}.mtip.medium{border-left:3px solid #F79009}.mtip.low{border-left:3px solid var(--line)}
.mtip div{display:flex;justify-content:space-between;gap:8px;align-items:center}.mtip b{font-size:14px;color:var(--navy)}.mtip p{margin:6px 0 0;font-size:13px;color:var(--muted)}.mtip .mact{color:var(--ink);font-weight:500}
.morg{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0 0 12px;font-size:13px;color:var(--muted)}.morg b{color:var(--navy);font-size:15px}
.mh4{font-size:13px;margin:6px 0 8px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.mposts{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-bottom:8px}
.mpost{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;color:var(--ink);text-decoration:none!important;transition:transform .15s,box-shadow .15s}
.mpost:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,36,96,.1)}.mpost img,.mnopic{width:100%;aspect-ratio:1/1;object-fit:cover;background:var(--sunk)}.mnopic{display:grid;place-items:center;color:var(--muted);font-size:12px}
.mreel{position:absolute;top:8px;left:8px;background:rgba(0,0,0,.65);color:#fff;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px}
.mpb{padding:8px 10px 10px}.mpb small{color:var(--muted);font-size:11px}.mpb p{margin:3px 0 6px;font-size:12.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.mpb em{font-style:normal;font-size:11.5px;color:var(--navy);font-weight:600}
@media (max-width:1100px){.mkpis{grid-template-columns:repeat(2,1fr)}.mtips{grid-template-columns:1fr}}
@media (max-width:900px){.mcsel{min-width:0;width:100%}.mkpi b{font-size:18px}.mposts{grid-template-columns:repeat(2,1fr)}}
.mtips{display:grid!important;grid-template-columns:repeat(2,1fr);gap:10px}.mtip{display:block!important}.mtip>div:first-child{display:flex!important;justify-content:space-between;align-items:flex-start;gap:8px}
@media (max-width:1100px){.mtips{grid-template-columns:1fr}}
.docw{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#eef2f5;margin:0 0 12px}.docf{display:block;width:100%;height:70vh;border:0;background:#eef2f5}@media (max-width:900px){.docf{height:65vh}}
.mctools{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.mctools .inp.search{width:220px;height:36px}.mctools .dsel{height:36px}.mrng button em{font-style:normal;font-size:11px;color:var(--faint);margin-left:3px}

/* ===== v15 — charts ===== */
.vz{width:100%;height:auto;display:block;overflow:visible}.vz text{font-family:Inter,system-ui,sans-serif}
.vz .hb .bar{transition:opacity .15s}.vz .hb:hover .bar{opacity:.8}.vz .hc .xh,.vz .hc .pt{opacity:0;transition:opacity .1s}.vz .hc:hover .xh,.vz .hc:hover .pt{opacity:1}
#vtip{position:fixed;z-index:9999;display:none;pointer-events:none;background:#101828;color:#fff;font-size:12.5px;line-height:1.5;padding:8px 11px;border-radius:10px;box-shadow:0 10px 28px rgba(16,24,40,.25);max-width:260px}
#vtip b{color:#fff}
.hbars{display:grid;gap:9px}.hbr{display:grid;grid-template-columns:minmax(90px,34%) 1fr auto;gap:10px;align-items:center;font-size:13px;cursor:default}
.hbl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}.hbt{height:12px;background:var(--sunk);border-radius:999px;overflow:hidden}.hbt i{display:block;height:100%;border-radius:999px;animation:grow .6s var(--ease) both;transform-origin:left}
.hbv{font-weight:600;color:var(--navy);white-space:nowrap;text-align:right}.hbv small{color:var(--muted);font-weight:500;margin-left:4px}
.hbr:hover .hbt i{filter:brightness(1.08)}
.sbar{display:flex;gap:2px;height:16px;border-radius:999px;overflow:hidden;background:var(--sunk)}.sbar i{display:block;height:100%}
.slg{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:9px;font-size:12.5px;color:var(--muted)}.slg i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}.slg b{color:var(--navy)}
@media (max-width:900px){.hbr{grid-template-columns:minmax(80px,40%) 1fr auto}}

/* v16 donut + 4 KPI */
.dnt{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.dnt svg{width:172px;height:172px;flex:none}
.dnt circle{cursor:pointer;transition:opacity .15s}
.dnt svg:hover circle{opacity:.5}.dnt svg circle:hover{opacity:1}
.dnv{font:700 17px 'Plus Jakarta Sans',system-ui,sans-serif;fill:#0f1b33}
.dns{font:500 8.5px 'Plus Jakarta Sans',system-ui,sans-serif;fill:#64748b}
.dlg{flex:1;min-width:210px;display:grid;gap:10px}
.dlr{display:grid;grid-template-columns:10px minmax(0,1fr) auto 36px;gap:10px;align-items:center;font-size:13px;cursor:default}
.dlr i{width:10px;height:10px;border-radius:3px}
.dln{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#334155}
.dlr b{font-variant-numeric:tabular-nums;color:#0f1b33}
.dlr small{color:#64748b;text-align:right;font-variant-numeric:tabular-nums}
.mkpis{grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media (max-width:700px){.mkpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}}

/* v17 client home */
.svcs{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important}
.crate{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:#fff;border:1px solid #e3e8f0;border-radius:16px;padding:16px 20px;margin:18px 0 6px}
.crate b{display:block;color:#0f1b33;font-size:15px}.crate small{color:#64748b;font-size:13px}
.crate .stars{margin:0}
.ups{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px;margin-bottom:24px}
.upr{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #e3e8f0;border-radius:14px;padding:12px 14px}
.upr>div{flex:1;min-width:0}.upr b{display:block;font-size:14px;color:#0f1b33}.upr small{display:block;color:#64748b;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.upr .sico{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:10px;background:#eaf1fb;color:#004890}
.upr .sico svg{width:18px;height:18px}
.upr .btn{white-space:nowrap}

.ups{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}
.upr .btn.ghost{color:#004890;background:#eaf1fb;border:1px solid #cfe0f5;padding:7px 12px;font-size:12.5px;box-shadow:none}
.upr .btn.ghost:hover{background:#dbe8f9}
@media (max-width:700px){.ups{grid-template-columns:1fr}}

/* v18 client analytics boxes + billing filter */
.anas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:26px}
@media (max-width:980px){.anas{grid-template-columns:1fr}}
.ana{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid #e3e8f0;border-radius:16px;padding:18px;color:inherit;text-decoration:none;min-height:210px;transition:box-shadow .15s,transform .15s}
a.ana:hover{box-shadow:0 8px 24px rgba(0,36,96,.08);transform:translateY(-1px)}
.anh{display:flex;align-items:center;gap:10px}.anh b{font-size:15px;color:#0f1b33;flex:1}
.anh .sico{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:10px;background:#eaf1fb;color:#004890}.anh .sico svg{width:17px;height:17px}
.anst{font-size:11.5px;font-weight:600;color:#0a7a4b;background:#e6f6ee;border-radius:99px;padding:3px 9px}
.anlk{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:600;color:#64748b;background:#f1f4f8;border-radius:99px;padding:3px 9px}.anlk svg{width:12px;height:12px}
.anv{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.anv b{font-size:28px;line-height:1;color:#0f1b33;font-variant-numeric:tabular-nums}.anv span{color:#64748b;font-size:13px}
.anv em{font-style:normal;font-size:12px;font-weight:700;border-radius:6px;padding:2px 6px}.anv em.up{color:#0a7a4b;background:#e6f6ee}.anv em.dn{color:#b42318;background:#fdecea}
.anb{position:relative;flex:1;display:flex;flex-direction:column;justify-content:flex-end;min-height:64px}
.spk{width:100%;height:64px;display:block}.spk.ghost rect{fill:#dfe6f0}
.anov{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;background:rgba(255,255,255,.78);backdrop-filter:blur(2px);padding:6px 10px}
.anov p{margin:0;font-size:13px;color:#334155;max-width:260px}.anov.soft{background:rgba(255,255,255,.85)}
.ana.locked .anh b{color:#64748b}.ana.locked .sico{background:#f1f4f8;color:#94a3b8}
.anf{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:#64748b;border-top:1px solid #eef2f7;padding-top:10px}.anf .anm{margin-left:auto;color:#004890;font-weight:600}
.anpb{height:8px;background:#eef2f7;border-radius:99px;overflow:hidden}.anpb i{display:block;height:100%;background:#2a78d6;border-radius:99px}
.anp{margin:0;font-size:12.5px;color:#64748b;line-height:1.5}
.anload{display:flex;align-items:center;gap:10px;color:#64748b;font-size:13px;flex:1}
.bfil{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 0 16px}
.bfc{display:flex;align-items:center;gap:8px;font-size:13px;color:#64748b}

/* v19 analytics boxes polish */
.ana{position:relative;overflow:hidden;border-radius:18px;padding:20px 20px 16px;gap:14px;min-height:250px;box-shadow:0 1px 2px rgba(15,27,51,.04)}
.ana:not(.locked)::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ac,#2a78d6)}
.ana:not(.locked) .anh .sico{background:color-mix(in srgb,var(--ac,#2a78d6) 12%,#fff);color:var(--ac,#2a78d6)}
.ant{flex:1;min-width:0}.ant b{display:block;font-size:15px;color:#0f1b33}.ant small{display:block;font-size:12px;color:#64748b;margin-top:1px}
.anh .sico{width:38px;height:38px;border-radius:11px}.anh .sico svg{width:18px;height:18px}
.anst.wait{color:#9a5b00;background:#fff4e0}
.anv b{font-size:32px;letter-spacing:-.02em}
.spk{height:72px}.spkx{display:flex;justify-content:space-between;font-size:11px;color:#94a3b8;margin-top:4px}
.ang{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.ang div{background:#f6f8fb;border-radius:10px;padding:8px 10px}.ang small{display:block;font-size:11px;color:#64748b}.ang b{font-size:14px;color:#0f1b33;font-variant-numeric:tabular-nums}
.anf{margin-top:auto;font-size:12px}
.anrk{display:flex;align-items:center;gap:18px;flex:1}
.aring{width:96px;height:96px;flex:none}.aring text{font:700 15px 'Plus Jakarta Sans',system-ui,sans-serif;fill:#0f1b33}
.anrk small{display:block;font-size:12px;color:#64748b;margin-bottom:6px}.anrk p{margin:2px 0;font-size:13.5px;color:#334155}.anrk p b{color:#0f1b33;font-variant-numeric:tabular-nums}
.anwait{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px}.anwait p{margin:0;font-size:13px;color:#64748b;line-height:1.5}
.ansteps{list-style:none;margin:0;padding:0;display:grid;gap:8px}.ansteps li{position:relative;padding-left:26px;font-size:13.5px;color:#334155}
.ansteps li::before{content:"";position:absolute;left:0;top:1px;width:16px;height:16px;border-radius:50%;border:2px solid #d5dde8;box-sizing:border-box}
.ansteps li.ok::before{background:#1baf7a;border-color:#1baf7a}.ansteps li.ok::after{content:"";position:absolute;left:5px;top:5px;width:5px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translate(-1px,-2px)}
.ana.locked{background:#fafbfd;border-style:dashed;border-color:#d5dde8;box-shadow:none}
.ana.locked .anov{background:linear-gradient(180deg,rgba(250,251,253,.55),rgba(250,251,253,.95))}

/* v20 hero, result boxes, section filters */
.chero2{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:stretch;padding:28px;border-radius:22px;color:#fff;margin-bottom:18px;position:relative;overflow:hidden;
background:radial-gradient(900px 300px at 100% 0%,rgba(14,143,204,.28),transparent 60%),linear-gradient(135deg,#001a47 0%,#002460 45%,#003b80 100%);box-shadow:0 10px 30px rgba(0,36,96,.18)}
.chero2::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:28px 28px;pointer-events:none;mask-image:linear-gradient(90deg,transparent,#000 70%)}
.chero2>*{position:relative;z-index:1}
.cheb{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:600;letter-spacing:.02em;color:#cfe0f5;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);border-radius:99px;padding:5px 12px}
.cheb span{width:7px;height:7px;border-radius:50%;background:#5fd3a4;box-shadow:0 0 0 3px rgba(95,211,164,.2)}
.chero2 h1{margin:14px 0 6px;font-size:28px;line-height:1.2;letter-spacing:-.02em;color:#fff}
.chs{margin:0 0 20px;color:#b9cbe4;font-size:14px}.chs b{color:#fff}
.chst{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px}
.chst>div{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:14px 16px;min-width:0}
.chst small{display:block;font-size:11.5px;color:#9fb6d6;text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.chst b{display:block;font-size:20px;margin:4px 0 2px;color:#fff;font-variant-numeric:tabular-nums}
.chst em{display:block;font-style:normal;font-size:12.5px;color:#c4d4ea;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chst .chk{display:flex;align-items:center;gap:14px}.chst .chk>div{min-width:0}
.chero2 .aring{width:62px;height:62px}.chero2 .aring circle:first-child{stroke:rgba(255,255,255,.14)}.chero2 .aring text{fill:#fff;font-size:15px}
.chm{display:flex;flex-direction:column;gap:10px;justify-content:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:18px}
.chmh{display:flex;align-items:center;gap:12px;margin-bottom:4px}.chmh small{display:block;font-size:11.5px;color:#9fb6d6}.chmh b{display:block;font-size:16px;color:#fff}.chmh span:not(.av){display:block;font-size:12px;color:#c4d4ea}
.chm .btn{width:100%;justify-content:center}
@media (max-width:980px){.chero2{grid-template-columns:1fr}.chst{grid-template-columns:1fr}}
.anas.n1{grid-template-columns:1fr}.anas.n2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:980px){.anas.n2{grid-template-columns:1fr}}
.anas.n1 .ana{min-height:0}.anas.n1 .anrk{gap:28px}
.anas.lockd{margin-bottom:14px}
.ana.locked{min-height:0;gap:10px}.ana.locked .anb{min-height:48px}.ana.locked .spk{height:48px;opacity:.7}
.anpitch{margin:0;font-size:13px;color:#475569;line-height:1.5}
.ana.locked .anf{align-items:center;border-top:1px dashed #d5dde8}
.ana.locked .anf .anm{color:#94a3b8;font-weight:500}
.sfil{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:#64748b;flex-wrap:wrap;justify-content:flex-end}
.sfil .dsel{height:34px;padding:0 10px;font-size:13px}

.anas.lockd{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.anrow{display:flex;flex-direction:column;gap:14px;flex:1}
.ankw{border-top:1px solid #eef2f7;padding-top:12px}.ankw small{display:block;font-size:12px;font-weight:600;color:#334155;margin-bottom:6px}.ankw .spk{height:44px;opacity:.8}.ankw p{margin:6px 0 0;font-size:12.5px;color:#64748b}
.anas.n1 .anrow{flex-direction:row;align-items:center;gap:32px}.anas.n1 .anrk{flex:0 0 auto;min-width:300px}
.anas.n1 .ankw{flex:1;border-top:0;border-left:1px solid #eef2f7;padding:0 0 0 32px}
@media (max-width:760px){.anas.n1 .anrow{flex-direction:column;align-items:stretch}.anas.n1 .ankw{border-left:0;border-top:1px solid #eef2f7;padding:12px 0 0}}
.chero2 .aring text{font-size:13px}

/* v21 client home polish */
@media (min-width:1024px){.hdr:not(:has(input,.btn,.cmenu,.search)){display:none}}
.todos{gap:16px}
.todos .tdo{position:relative;display:block;background:#fff;border:1px solid #e3e8f0!important;border-radius:16px;padding:18px 18px 16px 72px;min-height:92px;box-shadow:0 1px 2px rgba(15,27,51,.04);transition:box-shadow .15s,transform .15s}
.todos a.tdo:hover{box-shadow:0 8px 22px rgba(0,36,96,.08);transform:translateY(-1px)}
.todos .tdo::before{content:"";position:absolute;left:18px;top:20px;width:40px;height:40px;border-radius:12px;background:#eaf1fb}
.todos .tdo::after{content:"";position:absolute;left:29px;top:31px;width:18px;height:18px;background:#004890;-webkit-mask:var(--ic) center/contain no-repeat;mask:var(--ic) center/contain no-repeat}
.todos .tdo.warn::before{background:#fff1e6}.todos .tdo.warn::after{background:#c2410c}
.todos .tdo.ok::before{background:#e6f6ee}.todos .tdo.ok::after{background:#0a7a4b}
.todos .tdo:nth-child(1){--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M9%2011l3%203L22%204%22%2F%3E%3Cpath%20d%3D%22M21%2012v7a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h11%22%2F%3E%3C%2Fsvg%3E")}
.todos .tdo:nth-child(2){--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M21%2015a2%202%200%200%201-2%202H7l-4%204V5a2%202%200%200%201%202-2h14a2%202%200%200%201%202%202z%22%2F%3E%3C%2Fsvg%3E")}
.todos .tdo:nth-child(3){--ic:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%23000%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M4%202v20l3-2%203%202%203-2%203%202%203-2V2l-3%202-3-2-3%202-3-2-3%202z%22%2F%3E%3Cpath%20d%3D%22M8%208h8M8%2012h8M8%2016h5%22%2F%3E%3C%2Fsvg%3E")}
.todos .tdo b{font-size:24px;line-height:1.1}
.todos .tdo span{display:block;color:#475569;font-size:13px;margin-top:2px}
.todos .tdo em{display:inline-block;margin-top:8px;font-size:12.5px;font-weight:600;font-style:normal}
.crate{margin-top:8px}

/* v22 hero stat alignment */
.chst{grid-template-columns:repeat(3,minmax(0,1fr))}
.chst>div{display:flex;flex-direction:column;justify-content:center;min-height:96px}
.chst .chk{display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.chst .chk>div{order:1;min-width:0}
.chst .chk .aring{order:2;width:56px;height:56px;flex:none}
@media (max-width:980px){.chst{grid-template-columns:1fr}}

.chst>div,.chst .chk{margin:0!important;align-self:stretch;box-sizing:border-box}
.chst .chk{font-size:inherit;cursor:default}

/* v23 timeline lists */
.tlg{margin-top:8px}.tlg .panel{display:flex;flex-direction:column}
.tl{list-style:none;margin:0;padding:4px 0;flex:1}
.tl li a{display:flex;align-items:center;gap:14px;padding:12px 20px;color:inherit;text-decoration:none;transition:background .12s}
.tl li a:hover{background:#f6f8fb}
.tl li+li a{border-top:1px solid #f0f3f7}
.tld{width:46px;height:50px;flex:none;border-radius:12px;background:#eaf1fb;color:#004890;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1}
.tld b{font-size:18px;font-variant-numeric:tabular-nums}.tld small{font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;margin-top:3px;font-weight:700}
.tlm{flex:1;min-width:0}.tlm b{display:block;font-size:14px;color:#0f1b33;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tlm small{display:block;font-size:12.5px;color:#64748b;margin-top:3px}
.tlb{flex:none;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:99px;background:#f1f4f8;color:#475569;white-space:nowrap}
.tlb.soon{background:#fff4e0;color:#9a5b00}.tlb.late{background:#fdecea;color:#b42318}.tlb.ok{background:#e6f6ee;color:#0a7a4b}
.tlc{width:46px;height:46px;flex:none;border-radius:50%;background:#e6f6ee;color:#0a7a4b;display:grid;place-items:center}.tlc svg{width:18px;height:18px}
.tlf{margin-top:auto;display:flex;align-items:center;gap:10px 12px;flex-wrap:wrap;padding:12px 20px;border-top:1px solid #eef2f7;font-size:12.5px;color:#64748b;background:#fafbfd}
.tlf a{margin-left:auto;font-weight:600;color:#004890;text-decoration:none}
.tlp{flex:1 1 100%;height:6px;background:#e3e8f0;border-radius:99px;overflow:hidden}.tlp i{display:block;height:100%;background:#1baf7a;border-radius:99px}
.tlcount{font-size:12px;font-weight:600;color:#475569;background:#f1f4f8;border-radius:99px;padding:3px 10px}.tlcount.ok{background:#e6f6ee;color:#0a7a4b}
.tlempty{flex:1;display:grid;place-items:center;padding:28px;color:#94a3b8;font-size:13px}

/* v24 clients focus view */
.vtog{display:inline-flex;background:#eef2f7;border-radius:10px;padding:3px;margin-left:auto}
.vtog button{border:0;background:transparent;padding:7px 12px;border-radius:8px;font:600 13px/1 inherit;font-family:inherit;color:#475569;cursor:pointer}
.vtog button.on{background:#fff;color:#0f1b33;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.fwrap{display:grid;grid-template-columns:290px minmax(0,1fr);gap:16px;align-items:start}
.flist{display:flex;flex-direction:column;gap:6px;position:sticky;top:16px;max-height:calc(100vh - 40px);overflow:auto;padding:2px 4px 2px 2px}
.fcl{display:flex;align-items:center;gap:10px;width:100%;text-align:left;background:#fff;border:1px solid #e3e8f0;border-radius:12px;padding:10px 12px;cursor:pointer;font:inherit;color:inherit;transition:border-color .12s,box-shadow .12s,background .12s}
.fcl:hover{border-color:#c3d0e3}
.fcl.on{border-color:#004890;box-shadow:0 0 0 3px rgba(0,72,144,.12);background:#f5f9ff}
.cav.fsm{width:34px;height:34px;min-width:34px;font-size:12px;border-radius:10px}
.cav.flg{width:52px;height:52px;min-width:52px;font-size:18px;border-radius:14px}
.fcm{flex:1;min-width:0}.fcm b{display:block;font-size:14px;color:#0f1b33;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.fcm span{display:block;font-size:12px;color:#64748b;margin-top:1px}
.fcm .fbad{color:#b42318}.fcm .fwarn{color:#9a5b00}.fcm .fok{color:#0a7a4b}
.fdot{width:9px;height:9px;border-radius:50%;background:#1baf7a;flex:none}.fdot.warn{background:#eda100}.fdot.bad{background:#e5484d}
.fdet{padding:22px 24px}
.fdh{display:flex;align-items:center;gap:14px;margin-bottom:12px}
.fdn{flex:1;min-width:0}.fdn h3{margin:0;font-size:21px;color:#0f1b33;letter-spacing:-.01em}.fdn small{display:block;color:#64748b;font-size:13px;margin-top:2px}
.fst{display:grid;grid-template-columns:1.6fr repeat(4,minmax(0,1fr));gap:10px;margin:16px 0 20px}.fst.s3{grid-template-columns:1.6fr repeat(2,minmax(0,1fr))}
.fst>div{background:#f6f8fb;border-radius:12px;padding:12px 14px;min-width:0}
.fst small{display:block;font-size:11px;color:#64748b;text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.fst b{display:block;font-size:20px;color:#0f1b33;margin:4px 0 0;font-variant-numeric:tabular-nums}
.fst .bad b{color:#b42318}.fst .warn b{color:#9a5b00}
.fst .fpct em{display:block;font-style:normal;font-size:12px;color:#64748b;margin-top:6px}
.fh4{margin:0 0 2px;font-size:12px;color:#64748b;text-transform:uppercase;letter-spacing:.06em}
.fdet .tl li a{padding-left:0;padding-right:0}.fdet .tl li a:hover{background:transparent}.fdet .tl li a:hover .tlm b{color:#004890}
.fdf{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border-top:1px solid #eef2f7;margin-top:10px;padding-top:16px}.fdf .sp{flex:1}
@media (max-width:900px){.fwrap{grid-template-columns:1fr}.flist{position:static;max-height:none;flex-direction:row;overflow-x:auto;padding-bottom:6px}.fcl{min-width:210px}.fst,.fst.s3{grid-template-columns:1fr 1fr}.fst .fpct{grid-column:1/-1}}

.fpct .prog>b{display:none}.fpct .prog{margin-top:8px}.fpct .prog .bar{width:100%}

/* v25 clients priority groups */
.pgrp{background:#fff;border:1px solid #e3e8f0;border-radius:16px;margin-bottom:16px;overflow:hidden}
.pgh{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid #eef2f7;flex-wrap:wrap}
.pgh i{width:10px;height:10px;border-radius:50%;background:#1baf7a;flex:none}
.pgrp.bad .pgh i{background:#e5484d;box-shadow:0 0 0 4px rgba(229,72,77,.14)}.pgrp.warn .pgh i{background:#eda100;box-shadow:0 0 0 4px rgba(237,161,0,.15)}.pgrp.ok .pgh i{box-shadow:0 0 0 4px rgba(27,175,122,.14)}
.pgh b{font-size:15px;color:#0f1b33}
.pgn{font-size:12px;font-weight:700;background:#f1f4f8;color:#475569;border-radius:99px;padding:2px 9px}
.pgrp.bad .pgn{background:#fdecea;color:#b42318}.pgrp.warn .pgn{background:#fff4e0;color:#9a5b00}.pgrp.ok .pgn{background:#e6f6ee;color:#0a7a4b}
.pgh small{color:#64748b;font-size:12.5px}
.pmore{margin-left:auto;border:0;background:#f1f4f8;color:#334155;font:600 12.5px inherit;font-family:inherit;border-radius:8px;padding:6px 12px;cursor:pointer}
.prow{display:grid;grid-template-columns:34px minmax(150px,1.1fr) minmax(0,2fr) 150px auto 14px;align-items:center;gap:16px;padding:12px 18px;cursor:pointer;transition:background .12s}
.prow+.prow{border-top:1px solid #f0f3f7}
.prow:hover{background:#f7f9fc}
.pnm{min-width:0}.pnm b{display:block;font-size:14px;color:#0f1b33;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pnm small{display:block;font-size:12px;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pwhy{display:flex;align-items:center;gap:10px;min-width:0}.pwhy em{font-style:normal;font-size:13px;color:#334155;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pchip{flex:none;font-size:12px;font-weight:700;border-radius:8px;padding:4px 9px}.pchip.bad{background:#fdecea;color:#b42318}.pchip.warn{background:#fff4e0;color:#9a5b00}.pchip.ok{background:#e6f6ee;color:#0a7a4b}
.ppr small{display:block;font-size:11.5px;color:#64748b;margin-bottom:5px}.ppr small b{color:#0f1b33}
.pbar{height:6px;background:#eef2f7;border-radius:99px;overflow:hidden}.pbar i{display:block;height:100%;background:#2a78d6;border-radius:99px}
.pact{display:flex;align-items:center;gap:6px}
.pgo{color:#94a3b8;font-size:20px;line-height:1}
.pstrip{display:flex;align-items:center;gap:6px;padding:12px 18px;cursor:pointer;flex-wrap:wrap}.pstrip .cav{margin-right:-2px}.pstx{margin-left:10px;font-size:13px;color:#64748b}
.pnone{padding:16px 18px;color:#0a7a4b;font-size:13px}
@media (max-width:900px){.prow{grid-template-columns:34px minmax(0,1fr) auto;gap:10px}.prow .pwhy{grid-column:2/-1;grid-row:2}.prow .ppr,.prow .pgo{display:none}}

.prow{grid-template-columns:34px minmax(170px,1.1fr) minmax(0,2fr) 140px 176px 14px}
.pact{justify-content:flex-end}
@media (max-width:900px){.prow{grid-template-columns:34px minmax(0,1fr) auto}}

/* v26 billing inside CRM */
.bsubs{display:flex;align-items:center;gap:10px;margin:0 0 16px;background:#fff;border:1px solid #e3e8f0;border-radius:14px;padding:6px}
.bsl{display:flex;gap:2px;overflow-x:auto;flex:1;scrollbar-width:none}.bsl::-webkit-scrollbar{display:none}
.bsl a{white-space:nowrap;padding:8px 13px;border-radius:10px;font-size:13.5px;font-weight:600;color:#475569;text-decoration:none}
.bsl a:hover{background:#f1f4f8;color:#0f1b33}.bsl a.on{background:#002460;color:#fff}
.bmore{flex:none;height:36px}
.bframe{position:relative;border-radius:14px;background:#fff;border:1px solid #e3e8f0;min-height:360px}
.bfload{display:flex;align-items:center;gap:10px;justify-content:center;height:100%;color:#64748b;font-size:13px}
#bfr{position:fixed;z-index:5;border:1px solid #e3e8f0;border-radius:14px;background:#f4f6fb;display:none}

/* v27 billing tools in sub-tab row */
.bsubs{flex-wrap:wrap}
.btools{display:flex;align-items:center;gap:8px;flex:none}
.btools .dsel{height:36px;max-width:170px}
.btools .bnew{background:#002460;color:#fff;border-color:#002460;font-weight:600}
.btools .bset{height:36px;width:36px;padding:0;display:grid;place-items:center}.btools .bset svg{width:17px;height:17px}
@media (max-width:1200px){.bsl{flex-basis:100%}.btools{margin-left:auto}}

.bsubs{flex-wrap:wrap;row-gap:6px}
.bsl{flex:0 1 auto;overflow:visible;flex-wrap:nowrap}
.bsl a{padding:8px 11px;font-size:13px}
.bmore{max-width:120px}
.btools{margin-left:auto}
.btools .bnew{max-width:130px}.btools #bemp{max-width:150px}.btools #bfy{max-width:140px}
@media (max-width:1200px){.bsl{flex-basis:auto}}
@media (max-width:900px){.bsl{flex:1 1 100%;overflow-x:auto}}

/* v28 billing single row */
.bsubs{flex-wrap:nowrap;gap:6px}
.bsl{flex:1 1 auto;min-width:0;overflow-x:auto;gap:0}
.bsl a{padding:8px 10px;font-size:13px}
.bmore{max-width:84px;padding-right:22px}
.btools{margin-left:0;gap:6px}
.btools #bemp{max-width:136px}.btools #bfy{max-width:112px}
.bov{background:#fff;border:1px solid #e3e8f0;border-radius:14px;overflow:hidden;margin-bottom:20px}
#bfov{display:block;width:100%;height:900px;border:0;background:#f4f6fb}
@media (max-width:900px){.bsubs{flex-wrap:wrap}.bsl{flex:1 1 100%}.btools{margin-left:auto}}

.bsubs .bmore{width:96px;max-width:none;flex:none}
.btools #bemp{width:150px;max-width:none}.btools #bfy{width:122px;max-width:none}
.bsl{flex:1 1 auto}

.btools #bfy{width:auto;min-width:138px;padding-left:12px;padding-right:30px}
.btools #bemp{width:auto;min-width:140px;max-width:170px}

.bsubs{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.bsl{flex:1 1 0;min-width:0}
.btools,.bsubs .bmore{flex:none}

.aileft{display:block;margin-top:6px;font-size:11.5px;color:#9a5b00}