*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --ink:#07111f;--ink2:#0d1b2e;--ink3:#112240;--ink4:#1a3050;
  --rim:rgba(255,255,255,0.06);--rim2:rgba(201,168,76,0.30);
  --tx:#f0ede8;--tx2:#9a9590;--tx3:#5e6a7a;
  --teal:#c9a84c;--teal2:#e8c97a;--teal-d:rgba(201,168,76,0.14);
  --amber:#e0a855;--amber2:#f0c070;--amber-d:rgba(224,168,85,0.14);
  --blue:#4a80c4;--blue-d:rgba(74,128,196,0.14);
  --green:#4e9e6e;--green-d:rgba(78,158,110,0.14);
  --red:#e07070;--red-d:rgba(180,60,60,0.14);
  --purple:#9b7bce;--purple-d:rgba(155,123,206,0.14);
  --rose:#b85c7a;--rose-d:rgba(184,92,122,0.14);
  --r:10px;--rs:6px;
}
html{font-size:13.5px}
body{background:var(--ink);color:var(--tx);font-family:'DM Sans',sans-serif;display:flex;height:100vh;overflow:hidden}

/* ── SIDEBAR ─────────────────────────────────────────── */
.sb{width:240px;min-width:240px;background:var(--ink2);border-right:1px solid rgba(201,168,76,0.18);display:flex;flex-direction:column;height:100vh}
.sb-logo{padding:20px 18px 14px;border-bottom:1px solid var(--rim)}
.sb-logo-link{display:block;text-decoration:none}
.sb-name{font-family:'DM Serif Display',serif;font-size:17px;color:var(--teal);line-height:1.25}
.sb-tag{font-size:9px;color:var(--tx3);letter-spacing:.06em;margin-top:3px}
.sb-nav{flex:1;overflow-y:auto;padding:8px 10px}
.sb-sec{font-size:9px;color:var(--tx3);letter-spacing:.08em;padding:12px 8px 4px}
.nb{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--rs);cursor:pointer;font-size:12.5px;color:var(--tx2);border:none;background:none;width:100%;text-align:left;font-family:'DM Sans',sans-serif;transition:all .12s}
.nb:hover{background:var(--ink3);color:var(--tx)}
.nb.active{background:var(--teal-d);color:var(--teal);border-left:2px solid var(--teal);margin-left:-2px;padding-left:10px}
.nb svg{width:14px;height:14px;flex-shrink:0;opacity:.6}
.nb.active svg{opacity:1}
.nb-badge{margin-left:auto;font-size:9px;background:var(--amber-d);color:var(--amber);padding:1px 6px;border-radius:20px;font-weight:600}
.sb-foot{padding:12px 18px;border-top:1px solid var(--rim);font-size:10px;color:var(--tx3);line-height:1.7}
.sb-foot strong{color:var(--tx2)}

/* ── MAIN ────────────────────────────────────────────── */
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 24px;border-bottom:1px solid var(--rim);flex-shrink:0;gap:10px;flex-wrap:wrap}
.tb-left h1{font-family:'DM Serif Display',serif;font-size:18px;font-weight:600;color:var(--tx)}
.tb-left p{font-size:11px;color:var(--tx3);margin-top:1px}
.tb-right{display:flex;gap:8px;align-items:center}
.ptabs{display:flex;gap:2px;background:var(--ink3);padding:3px;border-radius:var(--rs);border:1px solid var(--rim)}
.ptab{padding:4px 13px;font-size:11.5px;font-weight:500;border:none;background:transparent;cursor:pointer;border-radius:5px;color:var(--tx3);font-family:'DM Sans',sans-serif;transition:all .12s}
.ptab:hover{color:var(--tx2)}
.ptab.active{background:var(--ink2);color:var(--teal);border:1px solid var(--rim2)}
.per-custom-wrap{display:flex;align-items:center;gap:6px;background:var(--ink3);padding:3px 10px;border-radius:var(--rs);border:1px solid var(--rim);transition:border-color .12s}
.per-custom-wrap:focus-within{border-color:var(--teal)}
.per-date-input{background:transparent;border:none;color:var(--tx2);font-size:11.5px;font-family:'DM Sans',sans-serif;outline:none;cursor:pointer;padding:1px 0;width:98px}
.per-date-input::-webkit-calendar-picker-indicator{filter:invert(0.85);cursor:pointer}
.per-date-input:focus{color:var(--teal)}
.btn{padding:6px 16px;border-radius:var(--rs);font-size:12px;font-weight:500;cursor:pointer;font-family:'DM Sans',sans-serif;border:none;transition:all .12s;white-space:nowrap}
.btn-teal{background:var(--teal);color:#07111f;font-weight:600;letter-spacing:.02em}
.btn-teal:hover{background:var(--teal2)}
.btn-ghost{background:var(--ink3);color:var(--tx2);border:1px solid var(--rim)}
.btn-ghost:hover{color:var(--tx);border-color:var(--rim2)}
.btn-sm{padding:4px 11px;font-size:11px}
.btn-danger{background:var(--red-d);color:var(--red);border:1px solid rgba(248,81,73,0.25)}

/* ── PAGE ────────────────────────────────────────────── */
.page{display:none;flex:1;overflow-y:auto;padding:20px 24px 76px}
.page.active{display:block}

/* ── SECTION HEADER ─────────────────────────────────── */
.sh{display:flex;align-items:center;gap:10px;margin:20px 0 12px}
.sh:first-child{margin-top:0}
.sh-bar{width:3px;height:18px;border-radius:1px;flex-shrink:0;box-shadow:0 0 6px rgba(201,168,76,0.4)}
.sh-title{font-size:10.5px;font-weight:600;letter-spacing:.05em;color:var(--tx2)}
.sh-line{flex:1;height:1px;background:var(--rim)}
.sh-action{flex-shrink:0}

/* ── KPI GRID ────────────────────────────────────────── */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.kpi{background:var(--ink2);border:1px solid var(--rim);border-radius:var(--r);padding:14px 16px;position:relative;overflow:hidden;transition:border-color .15s;border-left:3px solid transparent}
.kpi:hover{border-color:var(--rim2);border-left-color:var(--teal)}
.kpi-label{font-size:10px;color:var(--tx3);margin-bottom:6px;letter-spacing:.03em}
.kpi-val{font-size:24px;font-weight:700;color:var(--tx);letter-spacing:-.02em;line-height:1;font-family:'DM Serif Display',serif}
.kpi-sub{font-size:10px;color:var(--tx3);margin-top:5px}
.kpi-accent{position:absolute;top:0;left:0;right:0;height:2px;border-radius:var(--r) var(--r) 0 0}
.tag{display:inline-flex;align-items:center;font-size:9.5px;font-weight:500;padding:2px 7px;border-radius:20px;margin-top:5px}
.tag-teal{background:var(--teal-d);color:var(--teal)}
.tag-amber{background:var(--amber-d);color:var(--amber)}
.tag-green{background:var(--green-d);color:var(--green)}
.tag-red{background:var(--red-d);color:var(--red)}
.tag-blue{background:var(--blue-d);color:var(--blue)}
.tag-purple{background:var(--purple-d);color:var(--purple)}
.tag-rose{background:var(--rose-d);color:var(--rose)}
.pbar{margin-top:7px;height:2px;background:var(--ink4);border-radius:1px;overflow:hidden}
.pbar-fill{height:100%;border-radius:1px;transition:width .6s}

/* ── CHARTS ──────────────────────────────────────────── */
.chart-row{display:grid;grid-template-columns:2fr 1fr;gap:12px}
.chart-row-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.chart-card{background:var(--ink2);border:1px solid var(--rim);border-top:2px solid rgba(201,168,76,0.25);border-radius:var(--r);padding:16px 18px}
.cc-title{font-size:11px;font-weight:600;color:var(--tx2);margin-bottom:2px}
.cc-sub{font-size:10px;color:var(--tx3);margin-bottom:12px}
.cc-leg{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.cc-li{display:flex;align-items:center;gap:5px;font-size:10px;color:var(--tx2)}
.cc-sq{width:6px;height:6px;border-radius:1px}
.cw{position:relative;width:100%;height:175px}

/* ── FAT STRIP ───────────────────────────────────────── */
.fat-strip{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
.fat-card{background:var(--ink2);border:1px solid var(--rim);border-radius:var(--r);padding:15px 17px}
.fat-card.hero{border-color:var(--teal);border-left-width:3px;background:linear-gradient(135deg,rgba(201,168,76,0.10),rgba(13,27,46,0.95))}
.fc-label{font-size:10px;color:var(--tx3);margin-bottom:5px;letter-spacing:.03em}
.fc-val{font-size:24px;font-weight:700;color:var(--tx);letter-spacing:-.02em;font-family:'DM Serif Display',serif}
.fc-sub{font-size:10px;color:var(--tx3);margin-top:4px}
.fc-bar{margin-top:8px;height:2px;background:var(--ink4);border-radius:1px;overflow:hidden}
.fc-fill{height:100%;border-radius:1px;transition:width .8s}

/* ── TABLE ───────────────────────────────────────────── */
.tbl-wrap{background:var(--ink2);border:1px solid var(--rim);border-radius:var(--r);overflow:hidden}
.tbl-top{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;border-bottom:1px solid var(--rim);gap:8px;flex-wrap:wrap;background:var(--ink3)}
.tbl-top-t{font-size:11px;font-weight:600;color:var(--tx2)}
.tbl-filters{display:flex;gap:6px;flex-wrap:wrap}
table{width:100%;border-collapse:collapse}
thead th{font-size:9.5px;font-weight:600;color:var(--tx3);padding:7px 13px;text-align:left;background:var(--ink4);border-bottom:1px solid rgba(201,168,76,0.12);white-space:nowrap;letter-spacing:.04em;text-transform:uppercase}
tbody tr{transition:background .08s}
tbody tr:hover{background:var(--ink3)}
tbody td{padding:8px 13px;font-size:12px;color:var(--tx);border-bottom:1px solid var(--rim);vertical-align:middle}
tbody tr:last-child td{border-bottom:none}
td.dim{color:var(--tx3)}
td.pos{color:var(--teal)}
td.warn{color:var(--amber)}
.row-ab{background:none;border:1px solid var(--rim);color:var(--tx3);padding:2px 8px;border-radius:5px;cursor:pointer;font-size:10px;font-family:'DM Sans',sans-serif;transition:all .12s;margin-right:3px}
.row-ab:hover{border-color:var(--rim2);color:var(--tx)}
.row-ab.del:hover{border-color:var(--red);color:var(--red)}
.atr-badge{display:inline-block;font-size:9.5px;font-weight:600;padding:2px 7px;border-radius:20px;white-space:nowrap}

/* ── SUB-TABS (à vista / parcelado) ─────────────────── */
.sub-tabs{display:flex;gap:0;margin-bottom:16px;background:transparent;padding:0;border-bottom:2px solid var(--ink4);width:100%}
.stab{padding:8px 20px;font-size:12px;font-weight:500;border:none;border-bottom:2px solid transparent;background:transparent;cursor:pointer;color:var(--tx3);font-family:'DM Sans',sans-serif;transition:all .15s;margin-bottom:-2px}
.stab:hover{color:var(--tx2);background:var(--ink3)}
.stab.active{color:var(--teal);border-bottom:2px solid var(--teal);background:transparent}

/* ── ACORDO CARD (visão da operadora) ───────────────── */
.acordos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.ac-card{background:var(--ink2);border:1px solid var(--rim);border-radius:var(--r);overflow:hidden;transition:border-color .15s}
.ac-card:hover{border-color:var(--rim2)}
.ac-head{padding:12px 14px;border-bottom:1px solid var(--rim);display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.ac-devedor{font-size:13px;font-weight:600;color:var(--tx)}
.ac-credor{font-size:10px;color:var(--tx3);margin-top:2px}
.ac-body{padding:12px 14px}
.ac-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid var(--rim)}
.ac-row:last-child{border-bottom:none;padding-top:8px}
.ac-key{font-size:10px;color:var(--tx3)}
.ac-val{font-size:11.5px;font-weight:500;color:var(--tx)}
.parc-progress{margin-top:8px}
.parc-label{display:flex;justify-content:space-between;font-size:10px;color:var(--tx3);margin-bottom:4px}
.parc-track{height:4px;background:var(--ink4);border-radius:2px;overflow:hidden}
.parc-fill{height:100%;border-radius:2px;background:var(--teal);transition:width .6s}
.parc-list{margin-top:8px;display:flex;flex-direction:column;gap:3px}
.parc-item{display:flex;gap:8px;align-items:center;background:var(--ink3);border-radius:5px;padding:5px 9px;font-size:11px}
.pi-num{color:var(--tx3);min-width:22px}
.pi-venc{color:var(--tx2);min-width:75px}
.pi-val{color:var(--teal);font-weight:500;min-width:90px}
.pi-sit{margin-left:auto}

/* ── EMPTY ───────────────────────────────────────────── */
.empty{text-align:center;padding:40px 20px}
.empty-ic{font-size:24px;opacity:.35;margin-bottom:8px}
.empty-t{font-size:13px;color:var(--tx2);margin-bottom:3px}
.empty-s{font-size:11px;color:var(--tx3)}

/* ── MODAL ───────────────────────────────────────────── */
.mbg{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.82);z-index:200;align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto}
.mbg.open{display:flex}
.modal{background:var(--ink2);border:1px solid rgba(201,168,76,0.25);border-top:3px solid var(--teal);border-radius:var(--r);width:620px;max-width:100%;padding:22px 22px 18px;margin:auto}
.modal-title{font-family:'DM Serif Display',serif;font-size:18px;margin-bottom:16px;color:var(--tx)}
.fg{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ff{display:flex;flex-direction:column;gap:4px}
.ff.full{grid-column:1/-1}
.ff label{font-size:9px;font-weight:600;letter-spacing:.06em;color:var(--tx3);text-transform:uppercase}
.ff input,.ff select,.ff textarea{background:var(--ink3);border:1px solid var(--rim2);color:var(--tx);padding:7px 10px;border-radius:var(--rs);font-size:12.5px;font-family:'DM Sans',sans-serif;outline:none;transition:border-color .12s;width:100%}
.ff input:focus,.ff select:focus,.ff textarea:focus{border-color:var(--teal);box-shadow:0 0 0 2px var(--teal-d)}
.ff select option{background:var(--ink3)}
.ff textarea{resize:vertical;min-height:52px}
.ff input:disabled,.ff input:read-only{color:var(--teal);opacity:.85;cursor:default}
.modal-sec{grid-column:1/-1;font-size:9px;font-weight:600;letter-spacing:.06em;color:var(--tx3);border-bottom:1px solid var(--rim);padding-bottom:5px;margin-top:4px;text-transform:uppercase}
.tipo-tabs{display:flex;gap:4px;grid-column:1/-1;margin-bottom:2px}
.ttab{flex:1;padding:7px;font-size:12px;font-weight:500;border:1px solid var(--rim);background:var(--ink3);color:var(--tx3);border-radius:var(--rs);cursor:pointer;font-family:'DM Sans',sans-serif;transition:all .12s;text-align:center}
.ttab.active{border-color:var(--teal);background:var(--teal-d);color:var(--teal)}
.modal-foot{display:flex;gap:8px;justify-content:flex-end;margin-top:14px;padding-top:12px;border-top:1px solid var(--rim)}
.calc-box{grid-column:1/-1;background:var(--ink3);border:1px solid var(--rim);border-radius:var(--rs);padding:10px 12px}
.calc-box-title{font-size:10px;font-weight:600;color:var(--teal);margin-bottom:8px;letter-spacing:.04em}
.calc-row{display:flex;justify-content:space-between;font-size:11px;padding:3px 0;border-bottom:1px solid var(--rim)}
.calc-row:last-child{border-bottom:none;font-weight:600;color:var(--teal);padding-top:5px}
.calc-key{color:var(--tx3)}
.calc-val{color:var(--tx)}

/* ── CONFIG ──────────────────────────────────────────── */
.cfg-blk{background:var(--ink2);border:1px solid var(--rim);border-radius:var(--r);padding:16px 18px;margin-bottom:12px}
.cfg-title{font-size:10.5px;font-weight:600;color:var(--tx2);margin-bottom:12px;letter-spacing:.04em}
.cfg-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--rim);flex-wrap:wrap}
.cfg-row:last-child{border-bottom:none}
.cfg-lbl{font-size:12.5px;color:var(--tx)}
.cfg-sub{font-size:10px;color:var(--tx3);margin-top:1px}

/* ── TOAST ───────────────────────────────────────────── */
.toast{position:fixed;bottom:20px;right:20px;background:var(--ink3);border:1px solid var(--rim2);color:var(--tx);padding:8px 16px;border-radius:var(--rs);font-size:12px;z-index:999;opacity:0;transform:translateY(6px);transition:all .2s;pointer-events:none;max-width:300px}
.toast.show{opacity:1;transform:translateY(0)}
.toast.ok{border-color:var(--teal)}
.toast.err{border-color:var(--red)}

::-webkit-scrollbar{width:4px;height:4px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--ink4);border-radius:2px}

hr.dv{border:none;border-top:1px solid var(--rim);margin:18px 0}

/* ── AUTH / SYNC (Firebase) ──────────────────────────── */
.auth-controls{display:flex;align-items:center;gap:8px}
.auth-user{display:none;max-width:170px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;color:var(--tx2);padding:5px 11px;border:1px solid var(--rim);background:var(--ink3);border-radius:20px}
.auth-user.visible{display:inline-flex}
#authLogout{display:none}
#authLogout.visible{display:inline-flex}
.auth-overlay{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;background:rgba(7,17,31,.92);padding:20px}
.auth-overlay:not(.open){display:none}
.auth-box{width:min(380px,100%);background:var(--ink2);border:1px solid rgba(201,168,76,0.25);border-top:3px solid var(--teal);border-radius:var(--r);padding:26px}
.auth-box h2{font-family:'DM Serif Display',serif;font-size:20px;color:var(--tx);margin-bottom:6px}
.auth-box p{font-size:12px;color:var(--tx3);margin-bottom:16px}
.auth-box input{display:block;width:100%;background:var(--ink3);border:1px solid var(--rim2);color:var(--tx);padding:9px 11px;margin-top:9px;border-radius:var(--rs);font-size:12.5px;font-family:'DM Sans',sans-serif;outline:none}
.auth-box input:focus{border-color:var(--teal)}
.auth-box .btn{width:100%;justify-content:center;margin-top:14px}
.auth-forgot{display:block;margin:12px auto 0;border:0;background:transparent;color:var(--teal);font:inherit;font-size:11.5px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.auth-forgot:hover{color:var(--teal2)}
.auth-forgot:disabled{opacity:.55;cursor:wait}
.auth-error{min-height:18px;color:var(--red);font-size:11.5px;margin-top:10px}
.sync-bar{position:fixed;left:240px;right:0;bottom:0;z-index:150;display:flex;align-items:center;gap:8px;padding:7px 24px;color:var(--tx3);font-size:10.5px;border-top:1px solid var(--rim);background:var(--ink2)}
.sync-dot{width:7px;height:7px;border-radius:50%;background:var(--amber);flex:none}
.sync-dot.ok{background:var(--green)}
.sync-dot.pending{background:var(--amber)}
.sync-dot.error{background:var(--red)}
.sync-bar #syncDetail{opacity:.7}
.sync-bar #syncNow{margin-left:auto}
@media(max-width:640px){.sync-bar{left:0}}
@media(max-width:600px){.sync-bar{padding-left:16px;padding-right:16px}.sync-bar #syncDetail{display:none}}

.input-fi{background:var(--ink3);border:1px solid var(--rim);color:var(--tx);padding:5px 10px;border-radius:var(--rs);font-size:11.5px;font-family:'DM Sans',sans-serif;outline:none}
.input-fi:focus{border-color:var(--teal)}

@media(max-width:960px){.kpi-grid,.fat-strip{grid-template-columns:1fr 1fr}.chart-row,.chart-row-2{grid-template-columns:1fr}}
@media(max-width:640px){.sb{display:none}.kpi-grid{grid-template-columns:1fr}.page{padding:14px 12px 40px}}
