/* concilio-id — FUNIL DE AUTENTICAÇÃO (login, recuperação, 2FA, convite, chave de acesso). Transcrição do design aprovado em 2026-10-26 (canvas "Telas do concilio-id na marca Concílio", linha "Proposta"). Padrão-ouro intocado: docs/design/2026-10-26/. O mock declara cada valor em `style=` inline; aqui os mesmos valores viram classes `lp-*` (o prefixo é o do próprio mock: `lp-painel`, `lp-form`, `lp-campo`, `lp-botao`). Fora de `--lp-*`, nenhum valor foi arredondado nem trocado. WHITE LABEL. O mock é a marca Concílio; o app veste a marca de quem abriu o fluxo. Só os papéis de MARCA viram variável (`--lp-*`), e cada um tem a sua regra em docs/design/DESVIOS.md: --lp-cta o vermelho da ação principal -> o primário da marca --lp-acento o vermelho decorativo (régua, ponto, foco do campo) --lp-link o vermelho dos links -> o texto de acento da marca --lp-anel o anel de foco --lp-fonte a família Na marca `concilio` os cinco são os literais do mock — é a prova do gate de fidelidade. Neutros (#111111, #686868, #8c8c8c, #b2b2b2, #ececec, #f6f6f6) são do mock para todas. */ .lp{ --lp-cta: var(--primary); --lp-cta-tinta: var(--primary-ink); --lp-acento: var(--accent); --lp-link: var(--text-accent); --lp-link-hover: var(--accent-press); --lp-anel: var(--focus-ring); --lp-fonte: var(--font-sans); } :root[data-brand="concilio"] .lp{ --lp-cta: #c52027; --lp-cta-tinta: #ffffff; --lp-acento: #c52027; --lp-link: #9e1a1f; --lp-link-hover: #871217; --lp-anel: rgba(197,32,39,.30); --lp-fonte: "Plus Jakarta Sans","Segoe UI",system-ui,sans-serif; } /* ---------------------------------------------------------------- casca */ /* As larguras da CASCA (base do painel e da coluna, largura máxima da coluna) também são rem: com fonte grande a coluna cresce junto e desce para baixo do painel, em vez de espremer o texto e abrir rolagem lateral. */ /* Tamanhos de FONTE em rem (1rem = 16px, o padrão do browser): na fonte padrão dão exatamente os px do mock — o gate de fidelidade compara o computado —, e crescem com a preferência de fonte da pessoa (a régua "fonte 200%" da matriz). Medidas de caixa ficam em px, como o mock as declara. */ /* A casca zera o que o custom.css põe no (15px/300, entrelinha e tracking próprios, `box-sizing:border-box` em tudo): o mock parte dos padrões do browser. Onde o mock declara `border-box`, a regra da peça declara também; botão e select são `border-box` por padrão do browser, e o campo o mock declara. */ .lp{min-height:100vh;display:flex;flex-wrap:wrap;background:#ffffff; font-family:var(--lp-fonte);color:#111111;-webkit-font-smoothing:antialiased; font-size:1rem;font-weight:400;line-height:normal;letter-spacing:normal} :where(.lp, .lp *:not(button, select, input, textarea)){box-sizing:content-box} /* O fundo da página é o do mock (branco), não o `--bg` do custom.css: o que vier depois da casca (o botão de melhoria/bug do concilio-feedback) não pode abrir uma faixa cinza. */ body:has(> .lp){background:#ffffff} .lp a{color:var(--lp-link);text-decoration:none} .lp a:hover{color:var(--lp-link-hover);text-decoration:underline} .lp-painel{flex:999 1 35rem;min-width:0;min-height:100vh;box-sizing:border-box;background:#111111;color:#ffffff; padding:48px 64px;display:flex;flex-direction:column;position:relative;overflow:hidden} .lp-imagem-moldura{display:contents} /* D18: o