:root{--azul:#2f6fb5;--azul-esc:#1d4f8a;--verde:#1e6b3a;--verde-cl:#e3f4e8;--verm:#9b1c1c;--verm-cl:#fbe3e3;--cinza:#6b7280;--borda:#e5e7eb;--fundo:#f6f7f9;--texto:#1f2937}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:var(--fundo);color:var(--texto);font-size:16px;padding-bottom:env(safe-area-inset-bottom)}
a{color:var(--azul)}
.topo{background:var(--azul);color:#fff;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;padding-top:calc(12px + env(safe-area-inset-top))}
.topo .marca{color:#fff;font-weight:800;text-decoration:none;letter-spacing:.5px}
.topo .quem{font-size:.85rem;opacity:.9}
.menu{display:flex;overflow-x:auto;background:#fff;border-bottom:1px solid var(--borda);position:sticky;top:0;z-index:5}
.menu a{flex:1;text-align:center;padding:12px 10px;text-decoration:none;color:var(--cinza);white-space:nowrap;font-weight:600;border-bottom:3px solid transparent}
.menu a.ativo{color:var(--azul);border-bottom-color:var(--azul)}
main{max-width:1100px;margin:0 auto;padding:16px}
h1{font-size:1.35rem;margin:.2em 0 .6em}
h2{font-size:1.05rem;margin:1.4em 0 .6em;color:var(--azul-esc)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.card{background:#fff;border:1px solid var(--borda);border-radius:12px;padding:12px 14px}
.card small{display:block;color:var(--cinza);font-size:.8rem}
.card b{font-size:1.25rem}
.card.caixa{border-left:5px solid #e0b100}.card.banco{border-left:5px solid var(--azul)}.card.total{border-left:5px solid var(--verde);background:var(--verde-cl)}
.neg{color:var(--verm)}.pos{color:var(--verde)}
.muted{color:var(--cinza)}
.mesnav{display:flex;justify-content:center;align-items:center;gap:18px;margin:16px 0 4px}
.mesnav a{font-size:1.6rem;text-decoration:none;padding:0 10px}
.tabela{overflow-x:auto;background:#fff;border:1px solid var(--borda);border-radius:12px}
table{border-collapse:collapse;width:100%;font-size:.9rem}
th,td{padding:9px 10px;text-align:right;white-space:nowrap;border-bottom:1px solid var(--borda)}
th:first-child,td:first-child{text-align:left;position:sticky;left:0;background:#fff}
thead th{background:var(--azul);color:#fff}thead th:first-child{background:var(--azul)}
tfoot td{font-weight:700;background:#f0f1f3}tfoot td:first-child{background:#f0f1f3}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-weight:600;text-decoration:none;font-size:.85rem}
.pill.grande{font-size:1.2rem;padding:6px 16px}
.gray{background:#eceff3;color:#374151}.orange{background:#fdebd9;color:#9a4a00}.blue{background:#e1ecf8;color:#1d4f8a}
.purple{background:#ede4f7;color:#5b2c91}.teal{background:#ddf2f0;color:#0b6460}.magenta{background:#f9e1f0;color:#8a1c5e}
.green{background:#e3f4e8;color:#1e6b3a}.red{background:#fbe3e3;color:#9b1c1c}.yellow{background:#fff6cc;color:#7a5c00}
.lista{list-style:none;padding:0;margin:0;background:#fff;border:1px solid var(--borda);border-radius:12px}
.lista li{padding:10px 14px;border-bottom:1px solid var(--borda)}.lista li:last-child{border:0}
.lista .inativo{opacity:.5}
.lanc{list-style:none;padding:0;margin:0;background:#fff;border:1px solid var(--borda);border-radius:12px}
.lanc li{padding:10px 14px;border-bottom:1px solid var(--borda)}
.lanc .l1{display:flex;gap:10px;align-items:baseline}
.lanc .data{color:var(--cinza);font-size:.85rem;min-width:42px}
.lanc .desc{flex:1;font-weight:600}
.lanc .valor{font-weight:700;white-space:nowrap}
.lanc .l2{color:var(--cinza);font-size:.82rem;margin:2px 0 0 52px;display:flex;justify-content:space-between;gap:8px;align-items:center}
.lanc .t-entrada .valor,.lanc .t-saldo_inicial .valor{color:var(--verde)}
.lanc .t-saida .valor{color:var(--verm)}
.lanc .t-deposito,.lanc .t-saque,.lanc .t-repasse,.lanc .t-devolucao{background:#fafafa}
.form{display:flex;flex-direction:column;gap:12px;background:#fff;border:1px solid var(--borda);border-radius:12px;padding:16px}
.form label{display:flex;flex-direction:column;gap:4px;font-weight:600;font-size:.9rem}
.form label.check{flex-direction:row;align-items:center;font-weight:500}
input,select,button{font:inherit}
input,select{padding:11px 12px;border:1px solid #cfd4dc;border-radius:10px;background:#fff;width:100%}
input[type=checkbox],input[type=radio]{width:auto}
.tipos{display:flex;flex-wrap:wrap;gap:8px}
.tipo input{display:none}
.tipo span{display:inline-block;padding:9px 14px;border-radius:999px;border:1px solid #cfd4dc;background:#fff;cursor:pointer;font-weight:600;font-size:.9rem}
.tipo input:checked+span{background:var(--azul);color:#fff;border-color:var(--azul)}
.tipo.t-entrada input:checked+span{background:var(--verde);border-color:var(--verde)}
.tipo.t-saida input:checked+span{background:var(--verm);border-color:var(--verm)}
.btn{display:inline-block;background:var(--azul);color:#fff;border:0;border-radius:10px;padding:11px 18px;font-weight:700;text-decoration:none;cursor:pointer}
.btn.sec{background:#eceff3;color:var(--texto)}
.btn.saida{background:var(--verm)}
.btn.grande{padding:14px;font-size:1.05rem}
.acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.link{background:none;border:0;color:var(--azul);cursor:pointer;padding:0}
.link.perigo{color:var(--verm);font-size:.8rem}
.aviso{padding:10px 14px;border-radius:10px;margin:10px 0}
.aviso.ok{background:var(--verde-cl);color:var(--verde)}
.aviso.erro{background:var(--verm-cl);color:var(--verm)}
.aviso.alerta{background:#fff6cc;color:#7a5c00}
.dica{color:var(--cinza);font-size:.85rem;margin:0}
.filtro{margin:8px 0}
.login{max-width:360px;margin:8vh auto;text-align:center}
.login form{display:flex;flex-direction:column;gap:12px;text-align:left;margin-top:16px}
.login label{display:flex;flex-direction:column;gap:4px;font-weight:600}
details{margin-top:6px}form.inline{display:flex;gap:8px;margin-top:8px}
.rodape{display:flex;justify-content:center;gap:24px;padding:24px;color:var(--cinza);font-size:.9rem}
.rodape form{margin:0}
.periodo{display:flex;justify-content:center;gap:0;margin:16px auto 0;background:#eceff3;border-radius:999px;padding:3px;width:max-content}
.periodo a{padding:7px 22px;border-radius:999px;text-decoration:none;color:var(--cinza);font-weight:700}
.periodo a.ativo{background:#fff;color:var(--azul);box-shadow:0 1px 2px rgba(0,0,0,.08)}
table.larga{font-size:.82rem}table.larga th,table.larga td{padding:8px 7px}
