@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/Inter-Regular.da03732a27e1.woff2") format("woff2")} @font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("../fonts/Inter-Medium.51205681a1ba.woff2") format("woff2")} @font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("../fonts/Inter-SemiBold.2ede57db1a3a.woff2") format("woff2")} @font-face{font-family:"Inter";font-style:normal;font-weight:700;font-display:swap;src:url("../fonts/Inter-Bold.8ca0a5155296.woff2") format("woff2")} @font-face{font-family:"Bebas Neue";font-style:normal;font-weight:400;font-display:swap;src:url("../fonts/BebasNeue-Regular.5853435d21b1.woff2") format("woff2")} /* Design system do SuperApp — identidade Cidadela SUPORTE: verde-azulado (#1F9D8B) sobre a base neutra da marca-mãe (Pedra/Fortaleza/Aço); tipografia Inter (texto) + Bebas Neue (marca/display). Norma no cérebro (design-system-painel). Fonte única dos tokens: mudar aqui reveste todas as telas. */ /* ♻️ **07/10/2026 — ESTE ARQUIVO PERDEU O DESENHO DA CASA ANTIGA.** Ele tinha 2.236 linhas e 750 regras: os tokens e a base, e mais o desenho inteiro das telas antigas — barra lateral, cartões, tabelas, popups, formulários, o extrato, a árvore do plano de contas. A casca antiga foi apagada (Bernardo: *"faz o corte maior, apaga a casca antiga inteira"*), e com ela saíram daqui as 698 regras que não vestiam mais nada. 📏 **Como se soube quais.** Três evidências, e uma regra só saiu com todas a favor: • o NOME da classe não aparece em lugar nenhum do que sobrou no repositório, ou aparece só como dado e nunca em contexto de classe (conferido ocorrência por ocorrência); • a classe não existe no DOM de nenhum dos 95 estados visitados — todas as páginas do app, os diálogos, o tema escuro, o celular e as telas de entrada (916 classes colhidas); • o navegador não USOU a regra em nenhum deles (a cobertura de CSS do Chrome: 24 regras usadas, de 750). E a prova de que nada mudou: o estilo computado de todo elemento, antes e depois, nos mesmos 95 estados — nenhuma propriedade diferente. ⚖️ **O que FICA é o que o front novo usa de verdade:** as fontes, os tokens (claro, escuro e a escolha manual), a base dos elementos (`body`, `a`, `h1`, `form`, `label`, `input`, `select`, `textarea`, `button`), as barras de rolagem e quatro classes — `.isvg`, `.mono`, `.marca-svg` e `.marca-logo`. 🔴 **As regras de ELEMENTO não são resto: elas vestem o app.** O link sem classe é teal por causa do `a` daqui; o `
` empilha os campos por causa do `form` daqui. Elas valem para toda página que liga este arquivo, e por isso nenhuma saiu. 📌 Os tokens ficaram TODOS, mesmo os que hoje ninguém lê: token é vocabulário da marca, e o corte foi do desenho. Quem quiser enxugá-los faz isso olhando para a marca, não para a casca. */ :root { --canvas: #F2EFE8; --surface-1: #FAF8F3; --surface-2: #FFFFFF; /* 🔑 **A folha REVELADA — o branco que o accordion aberto pede.** Nasceu em 14/09/2026, quando a reforma tirou o branco puro de dentro da ilha: lá `--surface-2` passou a ser o realce discreto, e o painel que abre embaixo de uma linha precisava continuar branco de verdade. Ter um nome próprio é o que impede a próxima regra geral de atropelar de novo o único lugar onde o branco é proposital. */ --surface-3: #FFFFFF; --border: #E4DFD5; --border-strong: #D2CCBE; --text: #171918; --text-secondary:#4B4D47; --muted: #73766F; --primary: #1F9D8B; --primary-hover: #188676; /* o texto dos botões SECUNDÁRIOS (e das abas inativas, que herdam). No claro é o primary puro (10.4:1); no ESCURO o primary puro dá 4.02 sobre o surface-2 — abaixo do piso de 4.5 — então lá ele vira o primary-hover (5.1:1, medido em 28/08). */ --sec-texto: var(--primary); /* 🔴 **Medido e MANTIDO por decisão, não por descuido.** Branco sobre o `--primary` do claro dá **3,36:1** — abaixo do piso de 4,5 para texto pequeno. No escuro o par é outro (`#0B0F14` sobre o teal claro) e dá 7,39, então o desencontro é só daqui. ⚖️ Três saídas foram medidas em 12/09/2026: tinta escura como no tema escuro (5,72), `--primary-hover` com branco (4,46, ainda falha) e um teal mais escuro (5,98, mas muda a cor da marca). O Tiago viu os números e fechou: *"deixa como está, não me incomoda"*. 🔑 Isto fica escrito AQUI para a pergunta não renascer: quem medir de novo vai achar o mesmo 3,36 e propor a mesma troca. Já foi proposta e já foi recusada. */ --on-primary: #FFFFFF; --accent: #1F9D8B; --success: #2E6B4F; --warning: #B4791A; --danger: #A33A2E; --radius: 10px; --font-sans: "Inter", system-ui, -apple-system, sans-serif; --font-display: "Bebas Neue", "Inter", system-ui, sans-serif; /* interação */ --ring: rgba(31, 157, 139, .30); --shadow-1: 0 1px 2px rgba(24, 22, 18, .04), 0 2px 6px rgba(24, 22, 18, .05); --shadow-2: 0 4px 12px rgba(24, 22, 18, .08), 0 12px 28px rgba(24, 22, 18, .10); --dur: .18s; --ease: cubic-bezier(.2, .7, .25, 1); /* O SWITCH tem tempo proprio: o efeito de esticar nasce do DESENCONTRO entre a borda da frente e a de tras, e ele some se a duracao encolher para o `--dur` geral (.18s). Escolha do Tiago em 22/08, entre 5 animacoes. */ --sw-dur: 190ms; --sw-atraso: 70ms; /* MOVIMENTO — os valores das duas animacoes da casa (envelope e arrasto). Sao TOKENS e nao literais porque cada um vive em MAIS DE UMA tela: enquanto fossem numeros repetidos, ajustar a cortina numa tela deixava as outras pra tras, calado. Norma e checklist no cerebro (design-system-painel, MOVIMENTO). */ --mov-cortina: .32s; /* abrir/fechar (.env, .rev) — .26s ate 28/08; Bernardo pediu 'um pouquinho mais lenta' */ --mov-cortina-ease: cubic-bezier(.4, 0, .2, 1); --mov-esmaece: .2s; /* o conteudo aparecendo */ --mov-esmaece-atraso:.04s; /* meio quadro depois da cortina */ --mov-mola: .4s; /* o encaixe ao pousar */ --mov-mola-ease: cubic-bezier(.34, 1.4, .64, 1); --mov-recebe: .3s; /* o empurraozinho do alvo */ --mov-carregado: .4; /* opacidade do que saiu da mesa */ } @media (prefers-color-scheme: dark) { :root { --canvas: #1A1B18; --surface-1: #212320; --surface-2: #2A2C28; --surface-3: #2F312C; --border: #383A34; --border-strong: #474A42; --text: #F2EFE8; --text-secondary:#C8C5BB; --muted: #979A8E; --primary: #2FB3A0; --primary-hover: #45C2B0; --sec-texto: var(--primary-hover); /* primary puro daria 4.02 no surface-2 */ --on-primary: #0B0F14; --accent: #35BBA8; --success: #3B9E6E; --warning: #D0982E; --danger: #D65B52; --ring: rgba(47, 179, 160, .38); --shadow-1: 0 1px 2px rgba(0, 0, 0, .25), 0 2px 6px rgba(0, 0, 0, .30); --shadow-2: 0 4px 14px rgba(0, 0, 0, .40), 0 14px 32px rgba(0, 0, 0, .50); } } * { box-sizing: border-box; } body { /* `dvh` (viewport dinâmico) acompanha a barra do navegador no mobile; o `vh` fica de reserva pra quem não tem `dvh`. Sem isso, o iOS mede 100vh com a barra ESCONDIDA e sobra um pedaço rolável embaixo — no Android/Chromium não acontece. */ margin: 0; min-height: 100vh; min-height: 100dvh; background: var(--canvas); color: var(--text); font-family: var(--font-sans); font-size: 15px; line-height: 1.5; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; /* tira o flash cinza de toque do iOS (o Android não tem) — mesmo feedback nos dois */ -webkit-tap-highlight-color: transparent; } /* foco acessível e consistente em tudo que é interativo */ :focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 3px; } a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--ring); } @media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } } /* logo Cidadela (fill, nao stroke como .isvg). Opcao 2: torre teal em quadrado claro. */ .marca-svg { fill: currentColor; display: block; } /* a logomarca de uma marca (`