/* TREVO Finanças — tokens e base. Cores sempre por variável.
   Paleta (pedido do Matheus, 15/10/2026): preto, branco (fundo) e cinza.
   Exceções: vermelho discreto só para erro e "passou do orçamento"; verde (15/10/2026,
   pedido do Matheus) só para lançamento de PAGAMENTO — pagamento de fatura e despesa paga
   no Pix, débito, dinheiro, boleto ou transferência. Compra no cartão fica na cor padrão.
   Status da fatura (15/10/2026): verde = paga, amarelo = fechada, vermelho = atrasada. */
:root{
  --bg:#FFFFFF; --surface:#FFFFFF; --surface-2:#F4F4F5; --surface-3:#E7E7E9;
  --ink:#0A0A0A; --muted:#5C5C63; --line:rgba(10,10,10,.09); --line-2:rgba(10,10,10,.16);
  --accent:#0A0A0A; --accent-hover:#2A2A2E; --accent-soft:#F0F0F1; --on-accent:#FFFFFF;
  --warn:#3F3F46; --warn-soft:#F4F4F5;
  --danger:#B42318; --danger-soft:#FDF0EE;
  --pago:#15803D; --pago-soft:#E9F6EE;
  --resta-ok:#15803D; /* "Resta" positivo na Previsão de gastos (Início e página); negativo usa --danger (20/10/2026) */
  --onda:#16A34A; --onda-gasto:#B91C1C; /* ondas da Minha Renda: renda verde, despesas vermelho (pedido do Matheus,
     15/10/2026; par conferido para daltonismo — por isso o verde do escuro é #28AF60) */
  --onda-previsao:#E2AA00; /* onda amarela da previsão de gastos no Início (23/10/2026; validador de cores: separa do verde e do vermelho) */
  --fechada:#A15C07; --fechada-soft:#FEF4D8;
  --entrou:#15803D; --entrou-2:#22A559; --on-entrou:#FFFFFF; --gastou:#B91C1C; --gastou-2:#E5484D; --on-gastou:#FFFFFF; /* quadros Entrou/Gastou do Início (19/10/2026) */
  --cartao:#EA580C; --cartao-2:#FB923C; --on-cartao:#FFFFFF; /* laranja do cartão de crédito no Início (pedido do Matheus, 16/10/2026) */
  /* cores das categorias em "Para onde foi o dinheiro" (design aprovado em 16/10/2026): suaves e distintas */
  --cat-1:#4F86E8; --cat-2:#3FAE7A; --cat-3:#9B7BE6; --cat-4:#E8B842; --cat-5:#E8749C; --cat-6:#38B6C9;
  --cat-7:#8DB84A; --cat-8:#6F7BE0; --cat-9:#D9876A; --cat-10:#B08968; --cat-11:#7E93A8; --cat-12:#C56BC9;
  /* cantos mais redondos e a página como um painel arredondado sobre a moldura (pedido do Matheus, 28/10/2026 —
     igual ao TREVO Projeto 01): blocos 16, campos/botões 10, página 20 */
  --r:16px; --r-sm:10px; --r-pagina:20px;
  /* fundo atrás da página (barra lateral + borda) e a página. A moldura é PRETA nos dois temas, como no
     Projeto 01 (Matheus escolheu "Barra preta", 28/10/2026) — no escuro um pouco mais preta que a página */
  --moldura:#0A0A0A; --painel:#FFFFFF;
  --shadow:0 1px 2px rgba(10,10,10,.04),0 6px 20px -12px rgba(10,10,10,.16);
  --shadow-lg:0 24px 60px -20px rgba(0,0,0,.45);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#0A0A0A; --surface:#141415; --surface-2:#1C1C1E; --surface-3:#2A2A2D;
    --ink:#F5F5F5; --muted:#A1A1AA; --line:rgba(245,245,245,.10); --line-2:rgba(245,245,245,.18);
    --accent:#F5F5F5; --accent-hover:#D4D4D8; --accent-soft:#232325; --on-accent:#0A0A0A;
    --warn:#D4D4D8; --warn-soft:#1C1C1E;
    --danger:#F28B82; --danger-soft:#2D1715;
    --pago:#5CC98A; --pago-soft:#12261A; --resta-ok:#5CC98A;
    --onda:#28AF60; --onda-gasto:#C42727; --onda-previsao:#EBB52A;
    --fechada:#F2C14E; --fechada-soft:#2A2210;
    --entrou:#15803D; --entrou-2:#14532D; --on-entrou:#EEFBF3; --gastou:#B91C1C; --gastou-2:#7F1D1D; --on-gastou:#FFF1F1;
    --cartao:#C2410C; --cartao-2:#9A3412; --on-cartao:#FFF4EC;
    --cat-1:#6E9DF0; --cat-2:#5BC392; --cat-3:#AD93EE; --cat-4:#EFC65E; --cat-5:#F08DB0; --cat-6:#5AC8D8;
    --cat-7:#A4C863; --cat-8:#8891E8; --cat-9:#E39B82; --cat-10:#C4A083; --cat-11:#97A9BC; --cat-12:#D185D4;
    --moldura:#000000; --painel:#0A0A0A;
    --shadow:none; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0A0A0A; --surface:#141415; --surface-2:#1C1C1E; --surface-3:#2A2A2D;
  --ink:#F5F5F5; --muted:#A1A1AA; --line:rgba(245,245,245,.10); --line-2:rgba(245,245,245,.18);
  --accent:#F5F5F5; --accent-hover:#D4D4D8; --accent-soft:#232325; --on-accent:#0A0A0A;
  --warn:#D4D4D8; --warn-soft:#1C1C1E;
  --danger:#F28B82; --danger-soft:#2D1715;
  --pago:#5CC98A; --pago-soft:#12261A; --resta-ok:#5CC98A;
  --onda:#28AF60; --onda-gasto:#C42727; --onda-previsao:#EBB52A;
  --fechada:#F2C14E; --fechada-soft:#2A2210;
  --entrou:#15803D; --entrou-2:#14532D; --on-entrou:#EEFBF3; --gastou:#B91C1C; --gastou-2:#7F1D1D; --on-gastou:#FFF1F1;
  --cartao:#C2410C; --cartao-2:#9A3412; --on-cartao:#FFF4EC;
  --cat-1:#6E9DF0; --cat-2:#5BC392; --cat-3:#AD93EE; --cat-4:#EFC65E; --cat-5:#F08DB0; --cat-6:#5AC8D8;
  --cat-7:#A4C863; --cat-8:#8891E8; --cat-9:#E39B82; --cat-10:#C4A083; --cat-11:#97A9BC; --cat-12:#D185D4;
  --moldura:#000000; --painel:#0A0A0A;
  --shadow:none; color-scheme:dark;
}
/* A barra lateral fica sobre a moldura preta nos DOIS temas: lá dentro valem as cores do tema escuro
   (texto claro, item aberto em cinza-escuro, botão "Novo lançamento" branco). */
.lateral{
  --bg:#0A0A0A; --surface:#141415; --surface-2:#1C1C1E; --surface-3:#2A2A2D;
  --ink:#F5F5F5; --muted:#A1A1AA; --line:rgba(245,245,245,.10); --line-2:rgba(245,245,245,.18);
  --accent:#F5F5F5; --accent-hover:#D4D4D8; --accent-soft:#232325; --on-accent:#0A0A0A;
  --lado-hover:#1C1C1E; --lado-ativo:#232325; --lado-sombra:none;
  color:var(--ink); color-scheme:dark;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:14.5px/1.5 Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none}
button:disabled{cursor:not-allowed;opacity:.55}
a{color:inherit;text-decoration:none}
img,svg{display:block}
[hidden]{display:none!important}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.mute{color:var(--muted)}
.pos{color:var(--accent)}
.neg{color:var(--danger)}
.verde{color:var(--pago)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.carregando{display:grid;place-items:center;min-height:60vh;color:var(--muted)}