*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#F8F9FB;--bg2:#fff;--bg3:#F1F3F7;
  --text:#1A1A2E;--text2:#6B7280;--text3:#9CA3AF;
  --border:#E5E7EB;--border2:#D1D5DB;
  --blue:#0132A5;--blue-l:#E6F1FB;--blue-d:#0C447C;
  --green:#0F6E56;--green-l:#E1F5EE;
  --amber:#854F0B;--amber-l:#FAEEDA;
  --red:#A32D2D;--red-l:#FCEBEB;
  --purple:#3C3489;--purple-l:#EEEDFE;
  --r:8px;--rl:12px
}

/* ── LAYOUT ── */
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text);font-size:14px}
.app{display:flex;height:100vh;overflow:hidden}

/* ── SIDEBAR ── */
.sidebar{width:220px;background:var(--blue);display:flex;flex-direction:column;flex-shrink:0}
.s-logo{padding:20px 18px 16px;border-bottom:1px solid rgba(255,255,255,.1);text-align:center}
.s-logo-row{display:flex;align-items:center;justify-content:center;gap:8px}
.s-logo-img{max-width:120px;height:auto;display:block}
.s-logo-crm{color:#fff;font-size:18px;font-weight:300;letter-spacing:.04em;border-left:1px solid rgba(255,255,255,.3);padding-left:8px;line-height:1}
.s-logo-t{color:#fff;font-size:15px;font-weight:600}
.s-logo-s{color:rgba(255,255,255,.5);font-size:11px;margin-top:2px}
.s-nav{flex:1;padding:12px 8px;overflow-y:auto}
.s-sec{font-size:10px;font-weight:600;color:rgba(255,255,255,.35);text-transform:uppercase;letter-spacing:.08em;padding:0 10px;margin:14px 0 6px}
.ni{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r);color:rgba(255,255,255,.7);font-size:13px;cursor:pointer;margin-bottom:2px}
.ni:hover{background:rgba(255,255,255,.1);color:#fff}
.ni.on{background:rgba(255,255,255,.18);color:#fff;font-weight:500}
.ni i{font-size:16px;width:18px;flex-shrink:0}
.s-foot{padding:14px 16px;border-top:1px solid rgba(255,255,255,.1);font-size:11px;color:rgba(255,255,255,.35)}

/* ── MAIN ── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden}
.topbar{background:var(--bg2);border-bottom:1px solid var(--border);padding:0 24px;height:56px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}
.page-t{font-size:15px;font-weight:600}
.t-acts{display:flex;gap:8px}
.content{flex:1;overflow-y:auto;padding:24px}
.panel{display:none}.panel.on{display:block}

/* ── CARDS ── */
.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rl);padding:16px 20px;margin-bottom:16px}
.ct{font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}

/* ── BOTÕES ── */
.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--r);border:1px solid var(--border2);background:var(--bg2);color:var(--text);font-size:13px;cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{background:var(--bg3)}
.btn.pr{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn.pr:hover{background:var(--blue-d)}
.btn.su{background:var(--green);color:#fff;border-color:var(--green)}
.btn.da{background:var(--red-l);color:var(--red);border-color:#F7C1C1}
.btn.sm{padding:4px 10px;font-size:12px}

/* ── BADGES ── */
.bdg{display:inline-block;padding:3px 9px;border-radius:20px;font-size:11px;font-weight:500}
.bg{background:var(--green-l);color:var(--green)}
.ba{background:var(--amber-l);color:var(--amber)}
.br{background:var(--red-l);color:var(--red)}
.bb{background:var(--blue-l);color:var(--blue-d)}
.bx{background:var(--bg3);color:var(--text2)}
.bpu{background:var(--purple-l);color:var(--purple)}
.bla{background:linear-gradient(135deg,#0132A5,#185FA5);color:#fff;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600}

/* ── METRICS GRID ── */
.mg{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}
.mc{background:var(--bg2);border:1px solid var(--border);border-radius:var(--rl);padding:16px}
.ml{font-size:11px;color:var(--text2);margin-bottom:6px;font-weight:500}
.mv{font-size:24px;font-weight:600;line-height:1}
.ms{font-size:11px;color:var(--text3);margin-top:5px}

/* ── TABELAS ── */
.tw{overflow-x:auto}
table{width:100%;border-collapse:collapse}
th{text-align:left;padding:10px 12px;font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);white-space:nowrap}
td{padding:11px 12px;font-size:13px;border-bottom:1px solid var(--border)}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover td{background:var(--bg)}
tbody tr{cursor:pointer}

/* ── FORMULÁRIOS ── */
.fg{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}
.fl{font-size:12px;color:var(--text2);font-weight:500}
.fg input,.fg select,.fg textarea{font-size:13px;padding:8px 11px;border-radius:var(--r);border:1px solid var(--border2);background:var(--bg);color:var(--text);width:100%}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--blue);background:var(--bg2)}
.fg textarea{resize:vertical;min-height:72px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}

/* ── KANBAN ── */
.kb-wrap{overflow-x:auto;padding-bottom:12px}
.kb-board{display:flex;gap:10px;min-width:max-content}
.kc{width:168px;flex-shrink:0}
.kch{border-radius:var(--r);padding:8px 10px;margin-bottom:8px;font-size:11px;font-weight:600;display:flex;align-items:center;justify-content:space-between;background:var(--bg3);color:var(--text2)}
.kch.la{background:linear-gradient(135deg,#0132A5,#185FA5);color:#fff}
.kcc{border-radius:20px;padding:1px 7px;font-size:11px;font-weight:700}
.kch:not(.la) .kcc{background:var(--bg2);border:1px solid var(--border);color:var(--text)}
.kch.la .kcc{background:rgba(255,255,255,.25);color:#fff}
.kb{min-height:80px;border-radius:var(--r);padding:4px}
.kb.dov{background:rgba(1,50,165,.07);border:2px dashed var(--blue)}
.kcard{background:var(--bg2);border:1px solid var(--border);border-radius:var(--r);padding:10px;margin-bottom:6px;cursor:grab;user-select:none}
.kcard:hover{border-color:var(--blue)}
.kcard.dragging{opacity:.45;cursor:grabbing}
.kcard.la-card{border-left:3px solid var(--blue)}
.kcard-n{font-size:12px;font-weight:600;margin-bottom:4px}
.kcard-v{font-size:11px;color:var(--blue);font-weight:600}
.kcard-m{font-size:11px;color:var(--text3);margin-top:3px}
.kcard-d{font-size:10px;color:var(--text3);margin-top:4px}
.kcard-a{display:flex;gap:4px;margin-top:8px;flex-wrap:wrap}
.kb-btn{padding:3px 8px;border-radius:20px;font-size:10px;font-weight:600;cursor:pointer;border:none}
.kb-btn.won{background:var(--green-l);color:var(--green)}
.kb-btn.won:hover{background:var(--green);color:#fff}
.kb-btn.lost{background:var(--red-l);color:var(--red)}
.kb-btn.lost:hover{background:var(--red);color:#fff}
.kb-btn.nxt{background:var(--blue-l);color:var(--blue-d)}
.kb-btn.nxt:hover{background:var(--blue);color:#fff}
.kb-btn.opn{background:var(--bg3);color:var(--text2)}

/* ── DRAWERS ── */
.ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:200}
.ov.op{display:block}
.drawer{position:fixed;top:0;right:-710px;width:710px;height:100vh;background:var(--bg2);border-left:1px solid var(--border);z-index:201;overflow-y:auto;transition:right .25s ease}
.drawer.op{right:0}
.dh{padding:20px 24px 16px;border-bottom:1px solid var(--border);display:flex;align-items:flex-start;justify-content:space-between;position:sticky;top:0;background:var(--bg2);z-index:10}
.dh-t{font-size:17px;font-weight:600}
.dh-s{font-size:12px;color:var(--text2);margin-top:3px}
.x-btn{background:var(--bg3);border:none;border-radius:var(--r);width:32px;height:32px;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;color:var(--text2)}
.db{padding:20px 24px}
.df{padding:16px 24px;border-top:1px solid var(--border);display:flex;gap:10px;position:sticky;bottom:0;background:var(--bg2)}

/* ── MODAIS ── */
.mbg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:300;align-items:center;justify-content:center}
.mbg.op{display:flex}
.modal{background:var(--bg2);border-radius:var(--rl);padding:24px;width:100%;max-width:440px;border:1px solid var(--border)}
.mt{font-size:15px;font-weight:600;margin-bottom:16px;display:flex;align-items:center;gap:8px}

/* ── MISC ── */
.sep{font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:.06em;margin:20px 0 12px;display:flex;align-items:center;gap:10px}
.sep::after{content:"";flex:1;height:1px;background:var(--border)}
.hi{padding:11px 0;border-bottom:1px solid var(--border)}
.hi:last-child{border-bottom:none}
.hd{font-size:11px;color:var(--text3);margin-bottom:3px}
.ht{font-size:13px;line-height:1.5}
.ha{font-size:11px;color:var(--text2);margin-top:4px}
.hi.mv .ht{color:var(--blue);font-weight:500}
.hi.wn .ht{color:var(--green);font-weight:600}
.hi.ls .ht{color:var(--red);font-weight:600}
.cr{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border)}
.cr:last-child{border-bottom:none}
.av{width:36px;height:36px;border-radius:50%;background:var(--blue-l);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--blue-d);flex-shrink:0}
.tw-w{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.tw-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;background:var(--blue-l);color:var(--blue-d);border-radius:20px;font-size:12px;font-weight:500}
.tx{cursor:pointer;font-size:15px;line-height:1}
.sbar{display:flex;gap:8px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.sbar input{font-size:13px;padding:8px 12px;border-radius:var(--r);border:1px solid var(--border2);background:var(--bg2);color:var(--text);min-width:200px}
.sbar input:focus{outline:none;border-color:var(--blue)}
.sbar select{font-size:13px;padding:8px 10px;border-radius:var(--r);border:1px solid var(--border2);background:var(--bg2);color:var(--text)}
.won-ban{background:var(--green-l);border:1px solid #9FE1CB;border-radius:var(--r);padding:12px 16px;display:flex;align-items:center;gap:10px;margin-bottom:16px}
.lost-ban{background:var(--red-l);border:1px solid #F7C1C1;border-radius:var(--r);padding:12px 16px;display:flex;align-items:center;gap:10px;margin-bottom:16px}