/* Identidade Família Planeja. Preto e bege são a base; cada ambiente tem sua cor-líder.
   Bege é onde se preenche; branco é calculado. Verde e vermelho só para positivo e negativo. */
@font-face { font-family: Poppins; font-weight: 600; font-display: swap; src: url(/fontes/poppins-latin-600-normal.woff2) format("woff2"); }
@font-face { font-family: Poppins; font-weight: 800; font-display: swap; src: url(/fontes/poppins-latin-800-normal.woff2) format("woff2"); }
@font-face { font-family: Inter; font-weight: 400; font-display: swap; src: url(/fontes/inter-latin-400-normal.woff2) format("woff2"); }
@font-face { font-family: Inter; font-weight: 600; font-display: swap; src: url(/fontes/inter-latin-600-normal.woff2) format("woff2"); }

:root {
  --preto: #1a1517; --preto-2: #3a3134; --bege: #f2ebe1; --bege-claro: #fbf8f3; --bege-medio: #e6dccd;
  --laranja: #ee7d1f; --laranja-claro: #fce5d0; --vinho: #8e2f4e; --vinho-claro: #f3dce3;
  --suave: #6b5f5a; --pos: #1f7a35; --neg: #c0271d;
  --lider: var(--laranja); --lider-claro: var(--laranja-claro); --sobre-lider: var(--preto); --titulo-lider: var(--preto);
  --s1: #ee7d1f; --s2: #8e2f4e;
  font-family: Inter, Arial, sans-serif; color: var(--preto); background: var(--bege); line-height: 1.45;
}
:root[data-tema="pessoal"] { --lider: var(--vinho); --lider-claro: var(--vinho-claro); --sobre-lider: #fff; --titulo-lider: var(--vinho); --s1: #8e2f4e; --s2: #ee7d1f; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; }
h1, h2, h3 { margin: 0; line-height: 1.2; font-family: Poppins, Arial, sans-serif; font-weight: 800; }
h2 { font-size: 1.15rem; margin-bottom: .75rem; }
h3 { font-size: 1rem; font-weight: 600; }
h3.grande { font-size: 1.35rem; font-weight: 800; }
p { margin: .4rem 0; }
[hidden] { display: none !important; }
.pular { position: absolute; left: -9999px; }
.pular:focus { left: 1rem; top: 1rem; background: #fff; padding: .5rem 1rem; z-index: 80; }
:focus-visible { outline: 3px solid #1d5fbf; outline-offset: 2px; }
.suave { color: var(--suave); }
.tag { font-size: .79rem; color: var(--suave); }
.pos { color: var(--pos); }
.neg { color: var(--neg); }
.erro { color: var(--neg); min-height: 1.2em; margin: .25rem 0; font-size: .88rem; }
.vazio { color: var(--suave); padding: .5rem 0; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ic { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }

button, input, select, textarea { font: inherit; }
button { cursor: pointer; border-radius: 9px; border: 1px solid var(--bege-medio); background: #fff; color: var(--preto); padding: .48rem .85rem; }
button:hover { background: var(--bege-claro); }
button:disabled { opacity: .6; cursor: default; }
button.primario { background: var(--lider); border-color: var(--lider); color: var(--sobre-lider); font-family: Poppins, Arial, sans-serif; font-weight: 600; }
button.primario:hover { filter: brightness(.94); background: var(--lider); }
button.largo { width: 100%; padding: .68rem; }
button.discreto { background: transparent; }
button.mini { padding: .22rem .6rem; font-size: .83rem; border-radius: 7px; }
button.mini.primario { padding: .48rem .9rem; font-size: .9rem; border-radius: 9px; }
button.perigo { color: var(--neg); }
input, select, textarea { width: 100%; padding: .52rem .62rem; border: 1px solid var(--bege-medio); border-radius: 8px; background: var(--bege); color: var(--preto); }
input:focus, select:focus { background: #fff; }
input[type="checkbox"] { width: 1.05rem; height: 1.05rem; accent-color: var(--lider); }
label { display: block; margin: .55rem 0; font-size: .86rem; font-weight: 600; }
label > input, label > select { margin-top: .22rem; font-weight: 400; }
label.opcao { display: flex; gap: .4rem; align-items: center; font-weight: 400; }
label.opcao input { width: auto; margin: 0; }
.acoes { display: flex; gap: .5rem; justify-content: flex-end; flex-wrap: wrap; margin-top: .75rem; }
.filtros { display: flex; flex-wrap: wrap; gap: .5rem; align-items: end; }
.filtro-mini { display: flex; flex-direction: column; margin: 0; font-weight: 400; font-size: .76rem; color: var(--suave); }
.filtro-mini select, .filtro-mini input { padding: .28rem .45rem; margin-top: .1rem; font-size: .85rem; min-width: 8rem; max-width: 12rem; }
.filtros-barra { display: flex; flex-wrap: wrap; gap: .7rem; padding: .6rem .9rem; align-items: end; }

/* Login */
.link-cadastro { margin-top: .4rem; font-size: .88rem; text-decoration: underline; }
.codigo-lic { font-family: ui-monospace, Consolas, monospace; font-weight: 700; letter-spacing: .06em; font-size: 1rem; }
.login { min-height: 100vh; display: grid; grid-template-columns: 1fr 1fr; background: var(--bege-medio); }
.login-capa { padding: 3rem; display: flex; flex-direction: column; justify-content: center; gap: 1.4rem; align-items: flex-start; }
.login-frase { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: clamp(1.7rem, 3.2vw, 2.8rem); line-height: 1.12; margin: 0; }
.login-frase em { font-style: normal; }
.login-frase .v { color: var(--vinho); }
.login-frase .l { color: #a85208; }
.pilula-tag { background: var(--preto); color: #fff; border-radius: 99px; padding: .22rem .75rem; font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.login form { align-self: center; justify-self: center; width: min(380px, calc(100% - 2rem)); padding: 1.6rem; }
.marca-login { font-size: 1.6rem; margin-bottom: .5rem; }

/* Menu lateral: preto, com a cor-líder no item ativo */
.lateral { position: fixed; inset: 0 auto 0 0; width: 232px; background: var(--preto); color: #fff; padding: 1.1rem .75rem; display: flex; flex-direction: column; gap: .85rem; overflow-y: auto; z-index: 30; }
.marca { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.02rem; letter-spacing: .01em; padding: 0 .55rem .55rem; border-bottom: 3px solid var(--lider); }
#marca-nome { text-transform: uppercase; }
.pilula { display: flex; background: var(--preto-2); border-radius: 99px; padding: 3px; }
.pilula button { flex: 1; border: 0; background: transparent; color: #e9e2da; border-radius: 99px; padding: .3rem .4rem; font-size: .83rem; }
.pilula button:hover { background: transparent; }
.pilula button[aria-pressed="true"] { background: var(--lider); color: var(--sobre-lider); font-weight: 600; }
#abas { display: flex; flex-direction: column; gap: .1rem; }
#abas button { display: flex; align-items: center; gap: .58rem; border: 0; background: transparent; color: #e9e2da; text-align: left; padding: .5rem .65rem; border-radius: 9px; font-size: .9rem; }
#abas button:hover { background: var(--preto-2); }
#abas button[aria-current="page"] { background: var(--lider); color: var(--sobre-lider); font-family: Poppins, Arial, sans-serif; font-weight: 600; }
.lateral-fim { margin-top: auto; display: flex; flex-direction: column; gap: .1rem; border-top: 1px solid var(--preto-2); padding-top: .5rem; }
.link-lateral { background: transparent; border: 0; color: #e9e2da; text-align: left; padding: .38rem .65rem; font-size: .86rem; }
.link-lateral:hover { background: var(--preto-2); }
.link-lateral[aria-pressed="true"] { background: var(--preto-2); color: #fff; font-weight: 600; }

.principal { margin-left: 232px; min-height: 100vh; }
.topo { display: flex; align-items: center; gap: .8rem; padding: 1.1rem 1.5rem .3rem; }
.topo-t { flex: 1; min-width: 0; }
.topo h1 { font-size: 1.5rem; color: var(--titulo-lider); }
.topo p { margin: .1rem 0 0; color: var(--suave); font-size: .84rem; }
/* Botão Atualizar no topo */
.bt-atualizar { display: inline-flex; align-items: center; gap: .35rem; border-radius: 99px; padding: .32rem .8rem; font-size: .84rem; font-weight: 600; }
.bt-atualizar.girando .ic { animation: girar .8s linear infinite; }
@keyframes girar { to { transform: rotate(360deg); } }
@media (max-width: 560px) { .bt-atualizar span { display: none; } .bt-atualizar { padding: .32rem .5rem; } }
#abrir-menu { display: none; border: 0; background: transparent; padding: .3rem; color: inherit; }
.mes { display: flex; align-items: center; gap: .2rem; background: #fff; border: 1px solid var(--bege-medio); border-radius: 99px; padding: 3px; }
.mes button { border: 0; background: transparent; padding: .12rem .6rem; border-radius: 99px; }
#mes-nome { min-width: 9.5rem; text-align: center; font-size: .86rem; font-weight: 600; }
#conteudo { padding: .8rem 1.5rem 5rem; max-width: 1240px; }
#conteudo:focus { outline: none; }

/* Cartões */
.cartao { background: var(--bege-claro); border: 1px solid var(--bege-medio); border-radius: 13px; padding: .95rem 1.05rem; margin-bottom: .9rem; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .7rem; margin-bottom: .9rem; }
.kpi { background: #fff; border: 1px solid var(--bege-medio); border-radius: 12px; padding: .7rem .85rem; min-width: 0; text-align: left; }
.kpi.bom .numero { color: var(--pos); }
.kpi.ruim .numero { color: var(--neg); }
.cartao-kpi { display: flex; flex-direction: column; color: inherit; }
.rotulo { font-size: .67rem; color: var(--suave); text-transform: uppercase; letter-spacing: .07em; font-weight: 600; }
.numero { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.28rem; font-variant-numeric: tabular-nums; margin: .12rem 0; overflow-wrap: anywhere; }
.duas { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: .9rem; align-items: start; }
.duas-g { display: grid; grid-template-columns: 2fr 1fr; gap: .9rem; align-items: start; }
.com-form { display: grid; grid-template-columns: 320px 1fr; gap: .9rem; align-items: start; }
.com-form > * { min-width: 0; }
.form-lado { margin: 0 0 .9rem; }
.sec-topo { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: space-between; align-items: flex-start; margin-bottom: .5rem; }
.sec-topo p { margin: .1rem 0 0; }
.barra-acoes { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; align-items: end; margin-bottom: .75rem; }
.barra-acoes.esq { justify-content: flex-start; }
.mini-kpis { display: flex; flex-wrap: wrap; gap: 1.4rem; padding-bottom: .55rem; margin-bottom: .2rem; border-bottom: 1px solid var(--bege-medio); }
.mini-kpis > div { display: flex; flex-direction: column; }
.mini-kpis b { font-family: Poppins, Arial, sans-serif; }
.aviso-linha { background: var(--lider-claro); padding: .5rem .8rem; border-radius: 9px; font-size: .88rem; }
.ficha { background: var(--preto); color: #fff; border: 0; border-bottom: 4px solid var(--lider); }
.ficha .tag, .ficha .filtro-mini { color: #d8cfc7; }
.barra-lote { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; background: var(--lider-claro); padding: .5rem .8rem; border-radius: 10px; margin-bottom: .75rem; }

/* Abas da ficha do projeto: como as abas das planilhas */
.abas-p { display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: .8rem; }
.abas-p button { background: var(--bege-medio); border: 0; font-size: .78rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; border-radius: 7px; padding: .38rem .7rem; color: var(--suave); }
.abas-p button[aria-selected="true"] { background: var(--lider); color: var(--sobre-lider); }

/* Listas */
.lista { display: flex; flex-direction: column; }
.item { display: flex; align-items: center; gap: .7rem; padding: .58rem .15rem; border-bottom: 1px solid var(--bege-medio); flex-wrap: wrap; }
.lista > .item:last-child { border-bottom: 0; }
.item.clicavel { cursor: pointer; border-radius: 8px; }
.item.clicavel:hover { background: var(--bege); }
.item-t { flex: 1 1 170px; min-width: 0; }
.item-nome { font-weight: 600; overflow-wrap: anywhere; }
.item-v { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.item-v .tag { font-weight: 400; white-space: normal; }
.item-a { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; justify-content: flex-end; }
.sel { flex: none; }
.mini-marca { margin: 0; font-size: .83rem; }
.sub-lista { margin: 0 0 .4rem .8rem; border-left: 3px solid var(--lider-claro); padding-left: .6rem; }
.sub-item { display: flex; justify-content: space-between; gap: .5rem; align-items: center; font-size: .86rem; padding: .18rem 0; flex-wrap: wrap; }
.fatura summary { list-style: none; cursor: pointer; }
.fatura summary::-webkit-details-marker { display: none; }
.linha-dupla { display: flex; justify-content: space-between; gap: 1rem; margin: .25rem 0; font-size: .9rem; }
.linha-dupla.forte { border-top: 1px solid var(--bege-medio); padding-top: .3rem; font-weight: 700; margin-bottom: .55rem; }
.meta-c { padding: .5rem 0; border-bottom: 1px solid var(--bege-medio); }
.meta-c:last-child { border-bottom: 0; }
.selo { display: inline-block; padding: .05rem .48rem; border-radius: 99px; font-size: .7rem; font-weight: 600; background: var(--bege-medio); color: var(--preto-2); white-space: nowrap; }
.selo.ok { background: #dcefdf; color: #145c26; }
.selo.ruim { background: #fadcd9; color: #8f1a12; }
.selo.meio { background: var(--laranja-claro); color: #7a3b05; }
.diag { list-style: none; margin: 0; padding: 0; font-size: .9rem; }
.diag li { padding: .4rem 0 .4rem 1.15rem; position: relative; border-bottom: 1px solid var(--bege-medio); }
.diag li:last-child { border-bottom: 0; }
.diag li::before { content: ""; position: absolute; left: 0; top: .76rem; width: .56rem; height: .56rem; border-radius: 50%; background: var(--bege-medio); }
.diag li.ok::before { background: var(--pos); }
.diag li.atencao::before { background: var(--laranja); }
.diag li.alerta::before { background: var(--neg); }

/* Perguntas e assistente */
.perguntas { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .7rem; margin-bottom: .9rem; }
.pergunta { background: #fff; border: 1px solid var(--bege-medio); border-radius: 12px; padding: .75rem .9rem; }
.pergunta h3 { font-size: .88rem; color: var(--titulo-lider); }
.assistente { background: var(--preto); color: #fff; border: 0; }
.assistente h3 { color: #fff; }
.assistente .tag { color: #d8cfc7; }
.assistente input { background: #fff; }
.form-chat { display: flex; gap: .5rem; margin-top: .5rem; }
.form-chat button { flex: none; }
.prontas { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .5rem; }
.prontas button { background: var(--preto-2); border: 0; color: #fff; font-size: .78rem; border-radius: 99px; padding: .2rem .65rem; }
.fala { padding: .45rem .65rem; border-radius: 9px; margin-top: .4rem; font-size: .9rem; white-space: pre-wrap; }
.fala.eu { background: var(--lider); color: var(--sobre-lider); margin-left: 15%; }
.fala.ia { background: var(--preto-2); margin-right: 15%; }

/* Importação */
.imp-linha { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; padding: .42rem 0; border-bottom: 1px solid var(--bege-medio); }
.imp-linha.fora { opacity: .55; }
.imp-linha input[type="date"] { width: 9.2rem; }
.imp-desc { flex: 1 1 170px; width: auto; }
.imp-val { width: 6.5rem; text-align: right; }
.imp-parc { display: inline-flex; align-items: center; gap: .15rem; }
.imp-parc input { width: 3.2rem; padding: .4rem .2rem; text-align: center; }
.imp-linha select { width: 13rem; }

/* Barras e gráficos */
.barra { display: block; height: .46rem; background: var(--bege-medio); border-radius: 99px; overflow: hidden; margin: .3rem 0; }
.barra > span { display: block; height: 100%; background: var(--lider); border-radius: 99px; }
.barra.passou > span { background: var(--neg); }
.barras { display: flex; flex-direction: column; gap: .5rem; }
.barra-h-t { display: flex; justify-content: space-between; gap: 1rem; font-size: .88rem; }
.partes { display: flex; gap: 2px; height: 1rem; }
.partes span { display: block; min-width: 0; }
.p-custo { background: var(--preto); border-radius: 5px 0 0 5px; }
.p-lucro { background: var(--lider); border-radius: 0 5px 5px 0; }
.c-custo { background: var(--preto); }
.c-lucro { background: var(--lider); }
.legenda { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .8rem; color: var(--suave); margin: .35rem 0; }
.legenda i { display: inline-block; width: .68rem; height: .68rem; border-radius: 3px; margin-right: .3rem; vertical-align: -1px; }
.graf { width: 100%; height: auto; display: block; }
.grade-g { stroke: var(--bege-medio); stroke-width: 1; }
.grade-g.zero { stroke: #bfb2a2; }
.eixo { font-size: 10px; fill: var(--suave); font-family: Inter, Arial, sans-serif; }
.area { fill: var(--lider); opacity: .12; }
.linha { fill: none; stroke: var(--lider); stroke-width: 2; stroke-linejoin: round; }
.ponto { fill: var(--lider); stroke: #fff; stroke-width: 2; }
.dica { position: fixed; z-index: 60; background: var(--preto); color: #fff; font-size: .78rem; padding: .28rem .52rem; border-radius: 7px; pointer-events: none; white-space: nowrap; }

/* Planejamento */
.grupo-plan { padding: .62rem .95rem; margin-bottom: .45rem; }
.grupo-plan summary { cursor: pointer; display: flex; flex-wrap: wrap; justify-content: space-between; gap: .2rem .8rem; list-style: none; }
.grupo-plan summary::-webkit-details-marker { display: none; }
.plan-t { font-family: Poppins, Arial, sans-serif; font-weight: 600; font-size: .86rem; }
.plan-v { font-weight: 600; font-variant-numeric: tabular-nums; }
.grupo-plan .barra { flex-basis: 100%; }
.plan-linha { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .42rem 0; border-top: 1px solid var(--bege-medio); }
.plan-nome { min-width: 0; font-size: .91rem; }
.campo-num { max-width: 7.5rem; text-align: right; padding: .3rem .45rem; flex: none; }

/* Tabelas de detalhe */
details.cartao > summary { cursor: pointer; font-weight: 600; }
.tabela { overflow-x: auto; margin-top: .6rem; }
table { width: 100%; border-collapse: collapse; font-size: .86rem; background: #fff; }
th { background: var(--preto); color: #fff; font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 600; padding: .45rem .5rem; text-align: left; }
:root[data-tema="pessoal"] th { background: var(--vinho); }
td { padding: .4rem .5rem; border-bottom: 1px solid var(--bege-medio); text-align: left; }
th.num, td.num { text-align: right; }
table.larga { min-width: 900px; }
tr.total td { font-weight: 700; background: var(--bege-claro); }
tr.destaque td { background: var(--lider-claro); }
table.dre td:first-child, table.dre th:first-child { position: sticky; left: 0; min-width: 210px; }
table.dre td:first-child { background: #fff; }
table.dre tr.total td:first-child { background: var(--bege-claro); }

/* Ação rápida */
.rapido { position: fixed; right: 1.2rem; bottom: 1.2rem; z-index: 40; display: flex; flex-direction: column; align-items: flex-end; gap: .45rem; }
.rapido-bt { width: 3.1rem; height: 3.1rem; border-radius: 50%; border: 0; background: var(--lider); color: var(--sobre-lider); font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.6rem; line-height: 1; box-shadow: 0 2px 8px rgba(26, 21, 23, .25); }
.rapido-bt:hover { background: var(--lider); filter: brightness(.94); }
.rapido-menu { display: flex; flex-direction: column; gap: .25rem; align-items: flex-end; }
.rapido-menu button { background: var(--preto); color: #fff; border: 0; border-radius: 99px; padding: .36rem .85rem; font-size: .86rem; }
.rapido-menu button:hover { background: var(--preto-2); }

dialog { border: 0; border-radius: 14px; padding: 1.2rem; width: min(500px, calc(100% - 1.5rem)); max-height: calc(100vh - 2rem); overflow: auto; color: var(--preto); background: var(--bege-claro); }
dialog::backdrop { background: rgba(26, 21, 23, .5); }
.aviso { position: fixed; bottom: 1rem; left: 50%; transform: translateX(-50%); background: var(--preto); color: #fff; padding: .55rem 1rem; border-radius: 10px; z-index: 70; max-width: calc(100% - 2rem); }
.aviso.ruim { background: var(--neg); }

@media (max-width: 1050px) { .duas-g, .com-form { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 860px) {
  .login { grid-template-columns: 1fr; align-content: center; }
  .login-capa { padding: 1.5rem 1.2rem .6rem; }
  .lateral { transform: translateX(-100%); transition: transform .2s; }
  .lateral.aberta { transform: none; box-shadow: 4px 0 20px rgba(26, 21, 23, .35); }
  .principal { margin-left: 0; }
  .topo { background: var(--preto); color: #fff; padding: .65rem .9rem; flex-wrap: wrap; position: sticky; top: 0; z-index: 20; border-bottom: 3px solid var(--lider); }
  .topo h1 { font-size: 1.1rem; color: #fff; }
  .topo p { display: none; }
  #abrir-menu { display: block; }
  .mes { order: 3; width: 100%; justify-content: space-between; color: var(--preto); }
  #conteudo { padding: .75rem .7rem 5rem; }
  .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; }
  .numero { font-size: 1.05rem; }
  .duas { grid-template-columns: minmax(0, 1fr); }
  .item-a { flex-basis: 100%; }
  .filtro-mini select, .filtro-mini input { min-width: 7rem; }
}

/* Novo lançamento (cores por tipo, como nos apps de banco) */
.novo-lanc { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-bottom: .7rem; }
.novo-menu { display: flex; flex-wrap: wrap; gap: .35rem; }
.novo-menu button { border: 0; color: #fff; font-weight: 600; padding: .45rem .85rem; }
.t-receita { background: var(--pos) !important; }
.t-despesa { background: var(--neg) !important; }
.t-cartao { background: var(--vinho) !important; }
.t-transf { background: var(--preto) !important; }
.chips { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .7rem; }
.chip { border-radius: 99px; background: #fff; font-size: .84rem; padding: .32rem .8rem; }
.chip b { font-weight: 600; color: var(--suave); margin-left: .25rem; }
.chip.ativo { background: var(--lider); border-color: var(--lider); color: var(--sobre-lider); }
.chip.ativo b { color: inherit; }
dialog.f-receita #form-titulo, dialog.f-despesa #form-titulo, dialog.f-cartao #form-titulo, dialog.f-transf #form-titulo { margin: -1.2rem -1.2rem .8rem; padding: 1rem 1.2rem; color: #fff; border-radius: 14px 14px 0 0; }
dialog.f-receita #form-titulo { background: var(--pos); }
dialog.f-despesa #form-titulo { background: var(--neg); }
dialog.f-cartao #form-titulo { background: var(--vinho); }
dialog.f-transf #form-titulo { background: var(--preto); }
.campo-grande input { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.6rem; background: #fff; border: 0; border-bottom: 2px solid var(--bege-medio); border-radius: 0; padding: .2rem 0; }
.aviso-form { background: var(--lider-claro); border-radius: 8px; padding: .4rem .6rem; font-size: .84rem; margin: .3rem 0; }
.aviso-form:empty { display: none; }
#form-campos label.opcao { justify-content: space-between; flex-direction: row-reverse; padding: .3rem 0; border-bottom: 1px solid var(--bege-medio); }
#form-campos label.opcao input { appearance: none; width: 2.4rem; height: 1.35rem; border-radius: 99px; background: var(--bege-medio); position: relative; cursor: pointer; transition: background .15s; }
#form-campos label.opcao input::after { content: ""; position: absolute; top: .15rem; left: .15rem; width: 1.05rem; height: 1.05rem; border-radius: 50%; background: #fff; transition: left .15s; }
#form-campos label.opcao input:checked { background: var(--lider); }
#form-campos label.opcao input:checked::after { left: 1.2rem; }

/* Cartão visual */
.cartoes-visuais { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: .9rem; margin-bottom: .9rem; }
.cartao-visual { display: flex; flex-direction: column; gap: .25rem; text-align: left; color: #fff; background: var(--preto); border: 0; border-radius: 16px; padding: 1.1rem 1.2rem; min-height: 200px; position: relative; overflow: hidden; border-bottom: 5px solid var(--lider); }
.cartao-visual:hover { background: var(--preto-2); }
.cv-topo { display: flex; justify-content: space-between; font-size: .8rem; opacity: .9; }
.cv-bandeira { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-style: italic; }
.cv-chip { width: 2.1rem; height: 1.5rem; border-radius: 5px; background: #d9b56a; margin: .3rem 0; }
.cv-nome { font-family: Poppins, Arial, sans-serif; font-weight: 600; }
.cv-rot { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; opacity: .8; margin-top: auto; }
.cv-valor { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.45rem; }
.cv-barra { display: block; height: .35rem; background: rgba(255, 255, 255, .22); border-radius: 99px; overflow: hidden; }
.cv-barra > span { display: block; height: 100%; background: var(--lider); }
.cv-pe { display: flex; justify-content: space-between; gap: .5rem; font-size: .76rem; opacity: .9; }

/* Planejamento em passos */
.passos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: .9rem; }
.passo { position: relative; padding-top: 1.4rem; padding-right: 2.6rem; }
.pct-campo { display: flex; align-items: baseline; gap: .3rem; }
.pct-campo span { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--titulo-lider); }
.passo-n { position: absolute; top: .7rem; right: .9rem; width: 1.6rem; height: 1.6rem; border-radius: 50%; background: var(--lider); color: var(--sobre-lider); display: grid; place-items: center; font-weight: 700; font-size: .8rem; }
.campo-grande-in { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.5rem; color: var(--titulo-lider); background: transparent; border: 0; border-bottom: 2px solid var(--bege-medio); border-radius: 0; padding: .2rem 0; margin-top: .4rem; }
.resultado-plano { background: var(--lider-claro); }
.subcats { padding: .3rem 0 .1rem; }

.t-economia { background: var(--laranja) !important; color: var(--preto) !important; }
dialog.f-economia #form-titulo { margin: -1.2rem -1.2rem .8rem; padding: 1rem 1.2rem; color: var(--preto); background: var(--laranja); border-radius: 14px 14px 0 0; }
span.chip { border: 1px solid var(--bege-medio); }

.bloco-config .sec-topo > div { position: relative; padding-left: 2.1rem; }
.passo-n.in { position: absolute; left: 0; top: 0; }
.chip .x { border: 0; background: transparent; color: var(--neg); padding: 0 0 0 .2rem; font-size: 1rem; line-height: 1; }

/* Janela "Qual lançamento?" */
#dlg-tipo { max-width: 30rem; width: calc(100% - 2rem); }
#dlg-tipo h2 { margin: 0 0 .8rem; }
.tipos-novo { display: grid; gap: .5rem; }
.tipo-novo { display: flex; flex-direction: column; align-items: flex-start; gap: .1rem; border: 0; color: #fff; padding: .8rem 1rem; border-radius: 12px; text-align: left; }
.tipo-novo b { font-size: 1.05rem; }
.tipo-novo span { font-size: .85rem; opacity: .9; }

/* ===== Empresa profissional: área clara, menu preto, laranja Marcenaria Macedo ===== */
:root[data-tema="empresa"] { --fundo: #f5f5f6; --linha: #e6e6e9; --cinza: #6b6b73; --bege-medio: #e6e6e9; --bege-claro: #ffffff; --bege: #f5f5f6; --suave: #6b6b73; background: var(--fundo); }
:root[data-tema="empresa"] body { background: var(--fundo); }
:root[data-tema="empresa"] .cartao { background: #fff; border-color: var(--linha); box-shadow: 0 1px 2px rgba(20, 20, 30, .04); }
:root[data-tema="empresa"] .kpi { border-color: var(--linha); box-shadow: 0 1px 2px rgba(20, 20, 30, .04); }
:root[data-tema="empresa"] input, :root[data-tema="empresa"] select, :root[data-tema="empresa"] textarea { background: #fafafb; border-color: #d9d9de; }
:root[data-tema="empresa"] .mes { border-color: var(--linha); }
:root[data-tema="empresa"] .lateral { width: 248px; }
:root[data-tema="empresa"] .principal { margin-left: 248px; }
:root[data-tema="empresa"] #abas button { padding: .42rem .6rem; font-size: .86rem; }
.nav-grupo { font-size: .64rem; letter-spacing: .12em; text-transform: uppercase; color: #8d8a8b; font-weight: 600; padding: .85rem .65rem .25rem; border-top: 1px solid var(--preto-2); margin-top: .35rem; }
.nav-grupo:first-child { border-top: 0; margin-top: 0; padding-top: .2rem; }
.kpis-5 { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
button.kpi { cursor: pointer; font: inherit; color: inherit; display: flex; flex-direction: column; border-radius: 12px; }
button.kpi:hover { border-color: var(--lider); box-shadow: 0 0 0 3px var(--lider-claro); background: #fff; }
.kpi .rotulo { display: flex; justify-content: space-between; }
button.kpi .rotulo::after { content: "↗"; color: var(--lider); font-size: .8rem; letter-spacing: 0; }
.periodo-txt { align-self: center; padding-bottom: .3rem; }
.filtro-mini.busca input { min-width: 13rem; }
.sub-abas { display: flex; gap: .2rem; border-bottom: 2px solid var(--linha, var(--bege-medio)); margin-bottom: .9rem; flex-wrap: wrap; }
.sub-abas button { border: 0; background: transparent; border-radius: 8px 8px 0 0; padding: .5rem .9rem; color: var(--suave); font-weight: 600; margin-bottom: -2px; border-bottom: 2px solid transparent; }
.sub-abas button[aria-selected="true"] { color: var(--preto); border-bottom-color: var(--lider); }
.mini-t { font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--suave); margin: .9rem 0 .35rem; font-family: Inter, Arial, sans-serif; }

/* Tabelas */
.tabela-w { overflow-x: auto; margin: 0 -.2rem; }
.tab { width: 100%; border-collapse: collapse; font-size: .86rem; }
.tab th { text-align: left; font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--suave); font-weight: 600; padding: .55rem .5rem; border-bottom: 2px solid var(--linha, var(--bege-medio)); white-space: nowrap; background: #fafafb; }
.tab td { padding: .5rem .5rem; border-bottom: 1px solid var(--linha, var(--bege-medio)); vertical-align: middle; }
.tab tbody tr:hover { background: #fff8f1; }
.tab tfoot td { font-weight: 700; border-top: 2px solid var(--preto); border-bottom: 0; background: #fafafb; }
.tab .num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lin-ruim td:first-child { box-shadow: inset 3px 0 0 var(--neg); }
.lin-off { opacity: .55; }
.lin-prev td { color: #555; font-style: italic; background: #fffaf4; }
.acoes-l { display: flex; gap: .25rem; justify-content: flex-end; flex-wrap: wrap; }
.dre-t tr.tot td { font-weight: 700; background: #fafafb; border-top: 1px solid #cfcfd4; }
.dre-t tr.det td { font-size: .8rem; color: var(--suave); padding-top: .25rem; padding-bottom: .25rem; }
.pct-barra { display: inline-block; width: 46px; height: 6px; background: var(--linha, var(--bege-medio)); border-radius: 9px; overflow: hidden; vertical-align: middle; margin-right: .35rem; }
.pct-barra i { display: block; height: 100%; background: var(--lider); }
.mini-barras { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .6rem; }
.mini-barras > div { display: flex; flex-direction: column; background: #fafafb; border-radius: 10px; padding: .5rem .7rem; }

/* Grades de cartões, contas e importação */
.cartoes-grade, .contas-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: .9rem; margin-bottom: .9rem; }
.contas-grade .cartao { margin: 0; }
.cartoes-grade .cartao-visual { display: flex; flex-direction: column; gap: .2rem; text-align: left; background: linear-gradient(135deg, #1a1517, #3a3134); color: #fff; border: 0; border-radius: 16px; padding: 1rem 1.1rem; min-height: 180px; border-bottom: 4px solid var(--lider); }
.cartoes-grade .cartao-visual:hover { filter: brightness(1.08); background: linear-gradient(135deg, #1a1517, #3a3134); }
.cv-topo { display: flex; justify-content: space-between; font-size: .8rem; color: #d8d3d0; }
.cv-chip { width: 34px; height: 24px; border-radius: 5px; background: #d9b56a; margin: .3rem 0; }
.cv-nome { font-family: Poppins, Arial, sans-serif; font-weight: 600; }
.cv-rot { font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; color: #bdb6b2; }
.cv-valor { font-family: Poppins, Arial, sans-serif; font-weight: 800; font-size: 1.35rem; }
.cv-barra { height: 5px; background: #55494d; border-radius: 9px; overflow: hidden; }
.cv-barra span { display: block; height: 100%; background: var(--lider); }
.cv-pe { display: flex; justify-content: space-between; gap: .5rem; font-size: .74rem; color: #d8d3d0; flex-wrap: wrap; }
.imp-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .9rem; margin-bottom: .6rem; }
.imp-tipo { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; text-align: left; cursor: pointer; font: inherit; color: inherit; min-height: 130px; }
.imp-tipo .ic { width: 28px; height: 28px; color: var(--lider); }
.imp-tipo:hover { border-color: var(--lider); background: #fff; }
.grupo-cat summary { cursor: pointer; padding: .2rem 0; }
dialog.dlg-largo { width: min(980px, calc(100% - 2rem)); max-width: none; }
#dlg-detalhe .sec-topo h2 { margin: 0; }
[data-papel="consulta"] #rapido, [data-papel="consulta"] .barra-acoes button:not([data-a="exportar"]):not([data-a="imprimir"]):not([data-a^="voltar"]) { display: none; }
:root:not([data-papel="dono"]) .pilula, :root:not([data-papel="dono"]) [data-espaco="geral"] { display: none; }

@media (max-width: 860px) {
  :root[data-tema="empresa"] .principal { margin-left: 0; }
  .tab thead { display: none; }
  .tab, .tab tbody, .tab tr, .tab td, .tab tfoot { display: block; width: 100%; }
  .tab tr { border: 1px solid var(--linha, var(--bege-medio)); border-radius: 10px; margin-bottom: .55rem; padding: .3rem .55rem; background: #fff; }
  .tab td { border: 0; padding: .22rem 0; display: flex; justify-content: space-between; gap: .8rem; text-align: right; }
  .tab td::before { content: attr(data-l); color: var(--suave); font-size: .74rem; text-align: left; font-weight: 600; }
  .tab td[data-l=""]::before { content: none; }
  .tab td.num { white-space: normal; }
  .acoes-l { justify-content: flex-end; width: 100%; }
  .lin-ruim td:first-child { box-shadow: none; }
  .lin-ruim { border-left: 4px solid var(--neg) !important; }
  .filtro-mini.busca input { min-width: 0; }
}
.tab td:last-child { width: 1%; white-space: nowrap; }
.tab .acoes-l { flex-wrap: nowrap; }
.tab button.mini.primario { padding: .22rem .6rem; font-size: .83rem; border-radius: 7px; }
@media (max-width: 860px) { .tab td:last-child { width: 100%; white-space: normal; } .tab .acoes-l { flex-wrap: wrap; } }