:root{
  --bg:#f2f4f7;--s:#fff;--ink:#141a24;--mu:#637083;--ln:#e1e6ed;
  --menu:#0b2552;--pri:#0b3d91;--pri2:#e8eef9;--dest:#d81e1e;
  --ok:#14834a;--okb:#e3f5ea;--wa:#b86e00;--wab:#fff2d9;--bad:#c62828;--badb:#fbe6e6;--in:#2f5fb3;--inb:#e7eefb;--desp:#e08a80;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}
button,input,select,textarea{font-family:inherit;font-size:14px}
[hidden]{display:none!important}
a{color:inherit}
.boot{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg)}
.spin{width:34px;height:34px;border:3px solid var(--ln);border-top-color:var(--pri);border-radius:50%;animation:sp 0.8s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* login */
.login{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;background:radial-gradient(600px 400px at 80% 0%,rgba(216,30,30,.25),transparent 60%),linear-gradient(160deg,var(--menu),#06132b)}
.lg-card{background:var(--s);border-radius:20px;padding:32px 28px;width:380px;max-width:100%;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.lg-logo{display:block;max-width:240px;max-height:90px;margin:0 auto 18px}
.lg-card h1{font-size:19px;text-align:center}.lg-card .sub{text-align:center;margin-bottom:20px}
.lg-card .f{margin-bottom:14px}
.lg-err{color:var(--bad);font-size:13px;min-height:18px;margin-bottom:8px;font-weight:600}
.a3sig{display:flex;align-items:center;gap:10px;font-size:11.5px;color:#9fb0c8;line-height:1.3;margin-top:22px}
.a3sig img{height:22px;width:auto}
.a3sig b{color:#d9e3f0;font-weight:700}
.a3sig.light{color:#b8c6dc}
a.a3sig{text-decoration:none;cursor:pointer;transition:.15s}a.a3sig:hover{opacity:.85}a.a3sig:hover b{text-decoration:underline}

/* layout */
.app{display:flex;min-height:100vh}
aside{width:236px;background:var(--menu);color:#c9d4e6;padding:16px 12px;flex-shrink:0;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow-y:auto}
.cli-logo{background:#fff;border-radius:12px;padding:10px;margin-bottom:16px;display:grid;place-items:center}
.cli-logo img{max-width:100%;max-height:64px}
nav a{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:8px;color:inherit;text-decoration:none;cursor:pointer;font-size:14px}
nav a:hover{background:rgba(255,255,255,.07)}
nav a.on{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 3px 0 0 var(--dest)}
nav .ic{width:18px;text-align:center}
nav .sep{font-size:10.5px;text-transform:uppercase;letter-spacing:.09em;color:#7f93b3;margin:14px 12px 5px}
.me{margin-top:auto;border-top:1px solid rgba(255,255,255,.1);padding:12px 8px 0;font-size:12.5px}
.me b{color:#fff;display:block;font-size:13px}.me span{color:#8ea2c2}
.me .lk{color:#c9d4e6;text-decoration:underline;cursor:pointer;margin-right:10px;font-size:12px}
aside .a3sig{margin-top:14px;padding:0 8px}
main{flex:1;padding:24px 28px 48px;min-width:0}
.top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;gap:12px;flex-wrap:wrap}
h1{font-size:22px}
.sub{color:var(--mu);font-size:13px;margin-top:2px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.btn{background:var(--pri);color:#fff;border:0;border-radius:8px;padding:9px 16px;font-weight:600;cursor:pointer;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:6px}
.btn:hover{filter:brightness(1.1)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.g{background:var(--s);color:var(--ink);border:1px solid var(--ln)}
.btn.r{background:var(--s);color:var(--bad);border:1px solid var(--ln)}
.btn.red{background:var(--dest)}
.btn.sm{padding:5px 10px;font-size:12px}
.btn.lg{padding:13px 20px;font-size:15px;width:100%}
.grid{display:grid;gap:16px}.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:1.4fr 1fr}.g2e{grid-template-columns:1fr 1fr}
.card{background:var(--s);border:1px solid var(--ln);border-radius:12px;padding:18px}
.card h3{font-size:14px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:8px}
.kpi .l{color:var(--mu);font-size:12px}.kpi .v{font-size:23px;font-weight:700;margin-top:6px}.kpi .d{font-size:12px;margin-top:4px;color:var(--mu)}
.bar{height:8px;background:var(--ln);border-radius:6px;overflow:hidden;margin-top:10px}.bar i{display:block;height:100%;background:var(--pri)}
table{width:100%;border-collapse:collapse}
th{font-size:12px;color:var(--mu);font-weight:600;text-align:left;padding:10px 8px;border-bottom:1px solid var(--ln);white-space:nowrap}
td{padding:10px 8px;border-bottom:1px solid var(--ln)}
tr:last-child td{border-bottom:0}
tr.click{cursor:pointer}tr.click:hover td{background:#f8fafc}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pill{display:inline-block;padding:3px 9px;border-radius:20px;font-size:12px;font-weight:600;white-space:nowrap;background:#eef1f5;color:var(--mu)}
.ok{background:var(--okb);color:var(--ok)}.wa{background:var(--wab);color:var(--wa)}.bad{background:var(--badb);color:var(--bad)}.in{background:var(--inb);color:var(--in)}
.cat{display:inline-block;padding:3px 8px;border-radius:6px;font-size:12px;font-weight:600;background:var(--pri2);color:var(--pri);white-space:nowrap}
.cat.none{background:var(--badb);color:var(--bad)}
.av{width:32px;height:32px;border-radius:50%;background:var(--pri2);display:inline-grid;place-items:center;font-weight:700;font-size:12px;color:var(--pri);margin-right:10px;vertical-align:middle;flex-shrink:0}
.nm{display:flex;align-items:center;white-space:nowrap}
.catrow{display:flex;align-items:center;gap:10px;margin-bottom:10px;cursor:pointer}
.catrow .n{width:80px;font-size:13px}.catrow .b{flex:1;height:22px;background:var(--pri2);border-radius:6px;overflow:hidden}.catrow .b i{display:block;height:100%;background:var(--pri);border-radius:6px}.catrow .c{width:30px;text-align:right;font-weight:600}
.filters{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
input,select,textarea{border:1px solid var(--ln);border-radius:8px;padding:9px 12px;background:var(--s);color:var(--ink)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--pri2);border-color:var(--pri)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.chip{border:1px solid var(--ln);background:var(--s);border-radius:20px;padding:6px 12px;font-size:13px;cursor:pointer}
.chip.on{background:var(--menu);color:#fff;border-color:var(--menu)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--ln);margin-bottom:12px;overflow-x:auto}
.tab{padding:10px 14px;background:none;border:0;border-bottom:3px solid transparent;cursor:pointer;color:var(--mu);font-weight:600;white-space:nowrap}
.tab.on{color:var(--ink);border-color:var(--dest)}
.tab .c{margin-left:6px;padding:1px 8px;border-radius:10px;font-size:12px}
.form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.f label{display:block;font-size:12px;color:var(--mu);margin-bottom:5px;font-weight:600}
.f input,.f select,.f textarea{width:100%}
.full{grid-column:1/-1}
.sec{font-size:12px;font-weight:800;color:var(--pri);text-transform:uppercase;letter-spacing:.06em;margin-top:6px}
.autocat{display:flex;align-items:center;gap:14px;background:var(--pri2);border:1.5px dashed var(--pri);border-radius:10px;padding:14px;flex-wrap:wrap}
.autocat .big{font-size:24px;font-weight:800;color:var(--pri)}
.seg{display:flex;gap:8px}
.seg button{flex:1;border:1.5px solid var(--ln);background:var(--s);border-radius:10px;padding:10px;cursor:pointer;font-weight:600}
.seg button.on{border-color:var(--pri);background:var(--pri2);color:var(--pri)}
.pay{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:8px}
.pay button{border:1.5px solid var(--ln);background:var(--s);border-radius:10px;padding:11px 4px;cursor:pointer;font-size:13px;font-weight:600}
.pay button.on{border-color:var(--pri);background:var(--pri2);color:var(--pri)}
.dest{padding:11px 14px;border-radius:10px;background:var(--inb);color:var(--in);font-size:13px}
.overlay{position:fixed;inset:0;background:rgba(10,18,35,.5);display:none;align-items:center;justify-content:center;padding:16px;z-index:50}
.overlay.on{display:flex}
.modal{background:var(--s);border-radius:16px;width:520px;max-width:100%;max-height:92vh;overflow:auto;padding:22px}
.modal.wide{width:760px}
.modal h2{font-size:18px;margin-bottom:4px}
.actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;flex-wrap:wrap}
.chart{display:flex;align-items:flex-end;gap:10px;height:200px;padding-top:8px}
.chart .m{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}
.chart .p{display:flex;gap:4px;align-items:flex-end;height:170px}
.chart .p i{width:18px;border-radius:4px 4px 0 0;display:block}
.chart .lbl{font-size:11px;color:var(--mu)}
.chart .m.cur .lbl{color:var(--ink);font-weight:700}
.leg{display:flex;gap:14px;font-size:12px;color:var(--mu);font-weight:400;flex-wrap:wrap}
.leg span::before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:var(--c)}
.comp .ln{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--ln);font-size:13px}
.comp .tot{font-weight:700;border-top:2px solid var(--ink);border-bottom:0;margin-top:4px;padding-top:10px}
.res{border-radius:10px;padding:16px;display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.res .v{font-size:25px;font-weight:800}
.acc{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--ln)}
.acc:last-child{border:0}
.acc .ic{width:36px;height:36px;border-radius:10px;display:inline-grid;place-items:center;margin-right:10px;font-size:16px}
.note{font-size:12px;color:var(--mu);margin-top:8px}
.empty{padding:30px;text-align:center;color:var(--mu)}
.qa{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.qa button{background:var(--s);border:1px solid var(--ln);border-radius:12px;padding:14px 6px;cursor:pointer;font-weight:600;font-size:13px}
.qa b{display:block;font-size:22px;margin-bottom:4px}
.hist{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}
.hist div{text-align:center;border-radius:8px;padding:8px 0;font-size:12px;font-weight:700}
.hist .n{background:#f0f2f5;color:var(--mu)}
.kv{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--ln);gap:12px}
.kv span{color:var(--mu)}
.recibo{border:1px dashed var(--ln);border-radius:10px;padding:16px;font-size:13px;line-height:1.7;background:#fbfcfd}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);background:var(--menu);color:#fff;padding:12px 18px;border-radius:10px;font-weight:600;opacity:0;transition:.25s;z-index:60;max-width:90vw;text-align:center;pointer-events:none}
.toast.on{opacity:1;transform:translateX(-50%)}
.toast.err{background:var(--bad)}
.mtop{display:none}
/* agenda */
.agw{overflow-x:auto;margin:0 -4px}
.ag{display:grid;grid-template-columns:58px repeat(var(--n),minmax(150px,1fr));min-width:calc(58px + var(--n)*150px)}
.ah{position:sticky;top:0;background:var(--s);padding:8px 10px 10px;border-bottom:1px solid var(--ln);z-index:2}
.ah b{display:block;font-size:14px}.ah span{font-size:11px;color:var(--mu)}
.hrs div{font-size:11px;color:var(--mu);text-align:right;padding-right:8px;transform:translateY(-7px)}
.hrs div:first-child{transform:none}
.acol{position:relative;border-left:1px solid var(--ln);cursor:copy;background:repeating-linear-gradient(to bottom,transparent 0,transparent 45px,var(--ln) 45px,var(--ln) 46px)}
.acol:hover{background-color:#fafbfd}
.blk{position:absolute;left:4px;right:4px;background:var(--b);border-left:4px solid var(--c);border-radius:8px;padding:5px 8px;cursor:pointer;overflow:hidden;font-size:12px;box-shadow:0 1px 2px rgba(0,0,0,.06);transition:.12s}
.blk:hover{transform:translateX(2px);box-shadow:0 4px 12px rgba(0,0,0,.12)}
.blk .bt{font-weight:700;color:var(--c);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blk .bs{color:var(--mu);font-size:11px}
.blk .pill{max-width:100%;overflow:hidden;text-overflow:ellipsis;vertical-align:top}
.now{position:absolute;left:0;right:0;border-top:2px solid var(--dest);z-index:3;pointer-events:none}
.now::before{content:"";position:absolute;left:-5px;top:-6px;width:10px;height:10px;border-radius:50%;background:var(--dest)}
.wk{display:flex;gap:6px;align-items:center;overflow-x:auto}
.wd{flex:1;min-width:72px;border:1px solid var(--ln);background:var(--s);border-radius:10px;padding:7px 4px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px}
.wd span{font-size:11px;color:var(--mu);font-weight:600}.wd b{font-size:17px}
.wd i{display:block;width:70%;height:4px;background:var(--ln);border-radius:3px;overflow:hidden}.wd i em{display:block;height:100%;background:var(--pri)}
.wd small{font-size:10.5px;color:var(--mu)}
.wd.td b{color:var(--dest)}
.wd.on{background:var(--menu);border-color:var(--menu)}.wd.on span,.wd.on small{color:#9fb0c8}.wd.on b{color:#fff}
.cks{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.ck{display:flex!important;flex-direction:column;border:1.5px solid var(--ln);border-radius:10px;padding:10px 12px;cursor:pointer;margin:0!important;color:var(--ink)!important;position:relative}
.ck input{position:absolute;opacity:0}
.ck b{font-size:14px}.ck span{font-size:12px;color:var(--mu);font-weight:500}
.ck.on{border-color:var(--pri);background:var(--pri2)}
.ck.on::after{content:"✓";position:absolute;right:10px;top:8px;color:var(--pri);font-weight:900}
.resumo{background:#f6f8fa;border:1px solid var(--ln);border-radius:12px;padding:12px 14px}
.rs-l{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:4px 0;color:var(--mu)}.rs-l b{color:var(--ink);white-space:nowrap}
.rs-t{border-top:1px solid var(--ln);margin-top:4px;padding-top:8px;font-size:15px;color:var(--ink);font-weight:700}.rs-t b{font-size:17px}
.rs-w{margin-top:8px;background:var(--badb);color:var(--bad);border-radius:8px;padding:8px 10px;font-size:12.5px;font-weight:600}
.evc{display:flex;gap:16px;background:var(--s);border:1px solid var(--ln);border-radius:14px;padding:16px;margin-bottom:10px;cursor:pointer;transition:.12s}
.evc:hover{border-color:var(--pri);box-shadow:0 4px 14px rgba(0,0,0,.06)}
.evd{width:64px;flex-shrink:0;background:var(--menu);color:#fff;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 0}
.evd b{font-size:24px;line-height:1}.evd span{font-size:12px;text-transform:uppercase;font-weight:700;color:#ffb3b3}.evd small{font-size:11px;color:#9fb0c8}
.evb{flex:1;min-width:0}
.evp{display:flex;align-items:center;gap:12px;margin-top:10px;font-size:12.5px;color:var(--mu)}
.evmini{background:var(--wab);color:var(--wa);border-radius:10px;padding:10px 12px;font-size:13px;margin-bottom:10px;cursor:pointer}
.cfg-l{display:grid;gap:8px}
.cfg-r{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cfg-r input,.cfg-r select{flex:1;min-width:70px}
.dias{display:flex;gap:4px}.dias label{border:1px solid var(--ln);border-radius:6px;padding:4px 7px;font-size:12px;cursor:pointer}.dias label.on{background:var(--pri);color:#fff;border-color:var(--pri)}.dias input{display:none}
.logbox{max-height:520px;overflow:auto;font-size:12.5px}
.bnav{display:none}
@media (max-width:900px){
  aside{display:none}
  main{padding:0 14px 100px}
  .mtop{display:flex;align-items:center;gap:10px;background:var(--menu);color:#fff;margin:0 -14px 16px;padding:10px 14px;position:sticky;top:0;z-index:20}
  .mtop .ml{background:#fff;border-radius:8px;padding:4px 8px;height:38px;display:grid;place-items:center}.mtop .ml img{max-height:30px;max-width:120px}
  .mtop b{flex:1;font-size:14px;text-align:right;color:#c9d4e6;font-weight:500}
  .g4{grid-template-columns:1fr 1fr}.g3,.g2,.g2e,.form{grid-template-columns:1fr}
  .hide-m{display:none}
  .tw{overflow-x:auto}
  h1{font-size:20px}
  .kpi .v{font-size:19px}
  .top .btn:not(.keep){display:none}
  .bnav{display:flex;position:fixed;bottom:0;left:0;right:0;background:var(--s);border-top:1px solid var(--ln);z-index:30;padding:8px 4px calc(8px + env(safe-area-inset-bottom))}
  .bnav a{flex:1;text-align:center;font-size:11px;color:var(--mu);font-weight:600;text-decoration:none;cursor:pointer}
  .bnav a b{display:block;font-size:19px;filter:grayscale(1);opacity:.55}
  .bnav a.on{color:var(--pri)}.bnav a.on b{filter:none;opacity:1}
  .bnav .fab b{width:50px;height:50px;border-radius:50%;background:var(--dest);color:#fff;display:grid;place-items:center;margin:-26px auto 2px;font-size:26px;filter:none;opacity:1;box-shadow:0 6px 16px rgba(216,30,30,.35)}
  .overlay{align-items:flex-end;padding:0}
  .modal{border-radius:20px 20px 0 0;width:100%!important;max-height:90vh;padding:20px 18px 28px}
  .modal .form{grid-template-columns:1fr 1fr}
  td,th{padding:9px 6px}
  .card{padding:14px}
  .ag{grid-template-columns:44px repeat(var(--n),minmax(118px,1fr));min-width:calc(44px + var(--n)*118px)}.ah span{display:none}
  .kc .card:nth-child(n+3){display:none}
  .blk .pill{font-size:10px;padding:2px 6px}.blk .bs{font-size:10px}
  .evd{width:54px}.evd b{font-size:20px}.wd{min-width:52px}
  .qa{grid-template-columns:repeat(3,1fr)}
}
@media print{aside,.bnav,.mtop,.top .row,.btn{display:none!important}main{padding:0}.card{break-inside:avoid}}
