/* Sistema Alanda: a folha única do sistema (handoff de 12/09/2026, reforma de
   13/09/2026). Os tokens repetem tema.ALANDA e tema.ALANDA_ESCURA, e um
   teste confere que não divergem. Claro por padrão; o escuro entra por
   data-theme="escuro", escolha manual guardada no aparelho, nunca por
   consulta de mídia. */
@import url("fontes.css?v=20260913");
:root{
 --papel:#F8F7F4;--caixa:#FFFFFF;--filete:#D9D7CF;--linha:#EEEDE8;--tinta:#1C1F1A;--apoio:#5D6357;--legenda:#5D6357;
 --acento:#2F5233;--sobre-acento:#FFFFFF;--pasto:#2F5233;--pasto-hover:#26432A;--pasto-tinta:#2F5233;--pasto-escuro:#1C3320;--publico:#14532D;
 --brinco:#F2B807;--brinco-claro:#FDF3D3;--ambar-texto:#6B4F00;--ambar-grande:#6B4F00;--ok:#2E7D32;--falha:#B3261E;
 --hover-suave:#EEF4EE;--pre-fundo:#F8F7F4;--contorno:#8D9288;
 --corpo:"Source Sans 3",system-ui,-apple-system,"Segoe UI",sans-serif;--estreita:Sora,system-ui,sans-serif;--mono:"Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
 --marca:var(--pasto-tinta);--barra:var(--pasto);--marca-apoio:var(--ok);--palha:#E8E7B2;
 --elo-1:#A85A38;--elo-2:#6B7A3A;--elo-3:#456B85;--elo-4:#8A3A52;--elo-5:#6B4A34;
 --dur-curta:150ms;--dur-media:300ms;--dur-longa:900ms;--ease:cubic-bezier(.2,.7,.2,1);
 color-scheme:light;
}
:root[data-theme="escuro"]{
 --papel:#151814;--caixa:#1D211C;--filete:#414841;--linha:#2A302A;--tinta:#ECEAE3;--apoio:#A9B1A4;--legenda:#ABA389;
 --acento:#2F5233;--sobre-acento:#FFFFFF;--pasto:#2F5233;--pasto-hover:#3A6440;--pasto-tinta:#8FBF97;--pasto-escuro:#B4D5B8;--publico:#14532D;
 --brinco:#F2B807;--brinco-claro:#352D18;--ambar-texto:#F2CE66;--ambar-grande:#E59B63;--ok:#7FC182;--falha:#EF7F76;
 --hover-suave:#223227;--pre-fundo:#1A1E19;--contorno:#849080;
 --elo-1:#D89272;--elo-2:#A7B872;--elo-3:#87AECB;--elo-4:#D0839B;--elo-5:#B0916F;
 color-scheme:dark;
}

/* base */
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:150px}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 16px/1.5 var(--corpo)}
a{color:var(--pasto-tinta);text-underline-offset:3px}
a:hover{color:var(--pasto-escuro)}
main{max-width:1180px;width:100%;padding:28px 24px 64px;margin:0 auto;min-width:0}
h1,h2,h3{font-family:var(--estreita);font-weight:700;letter-spacing:-.01em;color:var(--tinta);text-wrap:pretty}
h1{font-size:36px;line-height:1.1;margin:0 0 12px}
h2{font-size:20px;line-height:1.3;margin:0 0 14px}
h3{font-size:18px;line-height:1.3;margin:0 0 10px}
p{overflow-wrap:anywhere}
ul{padding-left:1.2em;margin:8px 0}
li{margin:6px 0}
svg{max-width:100%;height:auto}
.apoio{font:400 14px/1.5 var(--corpo);color:var(--apoio)}
.fonte,.chave-mono,.selo{font-size:12px;line-height:1.5;color:var(--apoio)}
.fonte{font-family:var(--mono);margin-top:6px}
.fonte::before{content:"fonte: "}
.chave-mono{font:400 12px var(--mono);margin:0}
.dado,code,.quebra{overflow-wrap:anywhere}
.dado,code{font-family:var(--mono)}
.dado{font-size:13px;line-height:1.5}
code{font-size:12.5px}
pre{font:400 13px/1.6 var(--mono);color:var(--apoio);background:var(--pre-fundo);border:1px solid var(--linha);border-radius:10px;padding:12px 14px;max-width:100%;overflow:auto}
.pular{position:absolute;left:-9999px;top:8px;z-index:10;padding:10px 14px;border-radius:6px;background:var(--acento);color:var(--sobre-acento)}
.pular:focus{left:16px;outline:3px solid var(--tinta);outline-offset:2px}
[hidden]{display:none!important}
:is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--pasto-tinta);outline-offset:3px}
.so-escuro{display:none}
:root[data-theme="escuro"] .so-claro{display:none}
:root[data-theme="escuro"] .so-escuro{display:inline}

/* cartões e caixas */
.cartao,.kpi,.resposta{background:var(--caixa);border:1px solid var(--filete);border-radius:18px;padding:24px;margin:14px 0;min-width:0}
.cartao> :first-child{margin-top:0}
.cartao> :last-child{margin-bottom:0}
.cartao .cartao{padding:18px}
.vazio{padding:28px;border:1px dashed var(--filete);border-radius:14px;color:var(--apoio)}
details.cartao>summary{font:600 17px/1.4 var(--corpo);padding:2px 0;cursor:pointer}
details.cartao[open]>summary{margin-bottom:16px}
#documento-tecnico>summary{cursor:pointer;padding:12px 0}
.alinea{border-left:3px solid var(--falha);padding-left:12px;list-style:none}
.pendencia{border-left:3px solid var(--ambar-texto);padding-left:12px;list-style:none}
.presente{color:var(--ok);font-weight:700}
.ausente{color:var(--falha);font-weight:700}
.destaque-item{font-size:20px;font-weight:700;margin:0 0 6px}
li.proposta{list-style:none;border:1px solid var(--linha);border-radius:10px;padding:12px 14px;margin:8px 0}
.aviso{color:var(--legenda);font-family:var(--mono);font-size:11px;border-top:1px dashed var(--filete);margin-top:2.4em;padding-top:1em}
.faixa-suporte{background:var(--brinco);color:#1c1f1a;border-radius:10px;padding:.7em 1em;margin:1.2em 0;display:flex;flex-wrap:wrap;gap:.8em;align-items:center;font-size:14px}
.faixa-suporte form{margin:0}
.brinco{background:var(--brinco-claro);color:var(--tinta);border-radius:18px;padding:22px;margin:18px 0}
.brinco b{display:block;font:700 36px/1.1 var(--estreita);letter-spacing:-.01em}
.brinco small{display:block;font:400 14px/1.4 var(--corpo)}

/* formulários e controles */
input,textarea,select{font:400 16px/1.5 var(--corpo);border:1px solid var(--contorno);border-radius:10px;background:var(--caixa);color:var(--tinta);padding:10px 12px;max-width:100%;min-width:0;accent-color:var(--pasto)}
input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select{min-height:44px}
textarea{width:100%;min-height:100px;resize:vertical}
textarea.dado,#prova{font-family:var(--mono);font-size:13px}
input::placeholder,textarea::placeholder{color:var(--apoio);opacity:1}
label.apoio{font-size:14px;font-weight:600;color:var(--tinta)}
#destino{width:100%;max-width:520px;min-height:48px;font-size:16px}
button,.btn,.acoes-principais .acao-principal,details.fluxo>summary,summary.botao-cadastrar{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 20px;border:1px solid transparent;border-radius:999px;background:var(--pasto);color:#fff;font:600 15px/1.35 var(--corpo);text-decoration:none;cursor:pointer;list-style:none}
button:hover,.btn:hover,.acoes-principais .acao-principal:hover,details.fluxo>summary:hover,summary.botao-cadastrar:hover{background:var(--pasto-hover);color:#fff}
details.fluxo>summary::-webkit-details-marker,summary.botao-cadastrar::-webkit-details-marker{display:none}
summary.botao-cadastrar::before{content:"+";font-weight:700}
details.fluxo[open]>summary{margin-bottom:12px}
button.contorno,.contorno button,.btn-secundario{background:transparent;border:1px solid var(--pasto-tinta);color:var(--pasto-tinta)}
button.contorno:hover,.contorno button:hover,.btn-secundario:hover{background:var(--hover-suave);color:var(--pasto-tinta)}
button:disabled{background:var(--linha);color:var(--apoio);cursor:not-allowed}
.acoes-principais{display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px}
/* a linha de ações de um bloco (botões e links lado a lado, em qualquer tela) */
.acoes{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0 0}
.acoes form{margin:0}
.carimbo{display:inline-block;font:600 13px/1.4 var(--corpo);border:1px solid var(--filete);border-radius:999px;padding:5px 12px;background:var(--linha);color:var(--apoio)}
.carimbo.ok{background:var(--hover-suave);color:var(--ok);border-color:var(--ok)}
.carimbo.falha{color:var(--falha);border-color:var(--falha)}
.carimbo.historico{border-style:dashed}
.chip,.estado,.situacao{display:inline-block;font:600 12px/1.4 var(--corpo);border-radius:999px;padding:4px 10px;border:1px solid var(--filete);color:var(--apoio)}
.chip{background:var(--brinco-claro);color:var(--tinta);border-color:transparent}
/* um significado por cor: verde = liberado, âmbar = pendente, contorno = não se aplica ou sem registro */
.estado.pronto,.situacao.feita{background:var(--hover-suave);color:var(--ok);border-color:var(--ok)}
.estado.pendente,.situacao.aberta,.situacao.pendente,.situacao.indeterminado{background:var(--brinco-claro);color:var(--ambar-texto);border-color:var(--brinco)}
.situacao.reprovado{color:var(--falha);border-color:var(--falha)}
.estado.com_propostas{background:var(--brinco);color:#1c1f1a;border-color:var(--brinco)}
.estado.fechada{background:var(--pasto);color:#fff;border-color:var(--pasto)}
.estado.ativo{color:var(--ok);border-color:var(--ok)}
.estado.suspenso{color:var(--falha);border-color:var(--falha)}
form.cartao{display:block}
form.cartao p{margin:0 0 18px}
@media (min-width:900px){
 form.cartao{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;align-items:start}
 form.cartao>h2,form.cartao>p.apoio,form.cartao>p:has(textarea),form.cartao>p:has(button),form.cartao>p:has(input[type="file"]),form.cartao>label,form.cartao>textarea{grid-column:1/-1}
 .form-aparelho .par{grid-template-columns:1fr 1fr}
}
.layout-lateral form.cartao :is(input:not([type=checkbox]):not([type=radio]),select){width:100%}
.layout-lateral form.cartao input[type=hidden]{width:auto}
.quantidade-campos{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:10px;margin:6px 0}

/* tabelas e grades de dado */
.tabela-rolagem{max-width:100%;overflow-x:auto}
.tabela-rolagem:focus-visible{outline:2px solid var(--pasto-tinta);outline-offset:2px}
table{font:400 14px/1.5 var(--corpo);width:100%;border-collapse:collapse;overflow-wrap:anywhere}
th,td{padding:14px 12px;border-bottom:1px solid var(--filete);text-align:left;vertical-align:top}
th{font:600 13px/1.4 var(--corpo);color:var(--apoio)}
.campos-grade{display:grid;grid-template-columns:220px 1fr;gap:6px 16px;font:400 12px var(--mono);overflow-wrap:anywhere}
.campos-grade .campo{color:var(--apoio)}
.codigo-grade{display:grid;gap:16px;align-items:start}
@media (min-width:900px){.codigo-grade{grid-template-columns:1fr 280px}}

/* grades de página */
.fileira-kpi,.grade-cartoes,.duas-colunas{display:grid;gap:14px;margin:20px 0;align-items:start;grid-template-columns:repeat(2,minmax(0,1fr))}
.duas-colunas.larga,.layout-lateral{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:14px;align-items:start}
.layout-lateral>*{min-width:0}
.layout-lateral .cartao:first-child{margin-top:0}
.grade-cartoes .cartao,.duas-colunas>.cartao{margin:0}
ul.duas-colunas{list-style:none;padding:0;margin:8px 0}
.fileira-kpi{grid-template-columns:repeat(auto-fit,minmax(160px,1fr))}
.grade-cartoes.destinos{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.kpi{display:flex;flex-direction:column;gap:10px;margin:0;padding:22px}
.kpi .etiqueta{font:600 14px/1.3 var(--corpo);color:var(--apoio)}
.kpi b{font:700 40px/1.1 var(--estreita);color:var(--tinta);letter-spacing:-.02em}
.kpi b.alerta{color:var(--ambar-grande)}
.kpi .nota{font:400 14px/1.45 var(--corpo);color:var(--apoio)}
.kpi-link b small{font:600 20px var(--corpo);color:var(--apoio)}
.percurso{display:flex;flex-wrap:wrap;gap:12px 22px;padding:0;list-style:none;font-size:14px;margin:20px 0}
.percurso li{padding:8px 0}
.percurso [aria-current]{font-weight:700;border-bottom:3px solid var(--pasto)}
.cabecalho-pagina{margin:0 0 28px;display:flex;flex-direction:column;gap:8px}
.cabecalho-pagina h1{margin:0}
.contexto-operacao{font:400 15px/1.5 var(--corpo);color:var(--apoio);margin:0}
.kicker{font:600 12px/1.4 var(--corpo);letter-spacing:.06em;text-transform:uppercase;color:var(--pasto-tinta);margin:0}
.pagina-conteudo{min-width:0}
.pagina-conteudo>p.apoio:first-child{max-width:64ch;margin-top:-12px;margin-bottom:24px;font-size:16px}

/* a barra do sistema */
header.topo{position:sticky;top:0;z-index:1100;background:var(--caixa);border-bottom:1px solid var(--filete)}
header.topo nav{max-width:1180px;margin:auto;min-height:72px;padding:12px 24px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
header.topo nav .marca{display:inline-flex;min-height:44px;align-items:center;margin-right:16px;flex-shrink:0;text-decoration:none}
nav .marca img{display:block;height:24px;width:auto}
nav .marca img.so-escuro{display:none}
:root[data-theme="escuro"] nav .marca img.so-claro{display:none}
:root[data-theme="escuro"] nav .marca img.so-escuro{display:block}
.mes-coluna strong{font:600 13px/1.2 var(--corpo)}
nav .marca .oculto,.oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
nav a:not(.marca),nav a.aba-solta{font:400 14px/1.5 var(--corpo);color:var(--apoio);text-decoration:none}
header.topo nav>a:not(.marca),nav details.grupo>summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 8px;border:0;border-bottom:2px solid transparent;white-space:nowrap;font:400 14px/1.5 var(--corpo);color:var(--apoio);cursor:pointer;list-style:none}
nav details.grupo{position:relative}
nav details.grupo>summary::-webkit-details-marker{display:none}
header.topo nav>a[aria-current],nav details.grupo.ativa>summary{font-weight:600;color:var(--pasto-tinta);border-bottom-color:var(--pasto-tinta)}
header.topo nav>a:not(.marca):hover,nav details.grupo>summary:hover,nav details.grupo[open]>summary{background:var(--hover-suave);color:var(--pasto-tinta);border-radius:6px 6px 0 0}
nav details.grupo>summary::after{content:"";width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin-top:-3px}
nav details.grupo[open]>summary::after{transform:rotate(225deg);margin-top:3px}
nav details.avisos{margin-left:auto}
nav details.avisos>summary{position:relative;padding:10px;color:var(--apoio)}
nav details.avisos>summary::after{display:none}
nav details.avisos .badge{position:absolute;top:4px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--brinco);color:#1c1f1a;font:700 11px/18px var(--corpo);text-align:center}
nav details.avisos .painel{left:auto;right:0;min-width:280px}
nav form.sair{margin:0}
nav form.sair button{background:transparent;border:1px solid var(--filete);color:var(--apoio);font:600 13px/1.35 var(--corpo);min-height:36px;padding:6px 14px}
nav form.sair button:hover{border-color:var(--pasto-tinta);color:var(--pasto-tinta);background:var(--hover-suave)}
nav details.conta{min-width:0}
nav details.conta>summary{flex-direction:column;align-items:flex-end;gap:0;line-height:1.25;padding:6px 8px;white-space:normal;text-align:right}
nav details.conta>summary b{font:600 14px/1.3 var(--corpo);color:var(--tinta)}
nav details.conta>summary small{font:400 12px/1.3 var(--corpo);color:var(--apoio);overflow-wrap:anywhere}
nav details.conta>summary::after{display:none}
nav details.conta .painel{left:auto;right:0;min-width:220px;display:flex;flex-direction:column;gap:2px}
nav details.conta .painel button,nav details.conta .painel form button{width:100%;justify-content:flex-start;background:none;border:0;color:var(--tinta);font:400 14px/1.5 var(--corpo);padding:10px 12px;border-radius:6px;min-height:44px}
nav details.conta .painel button:hover{background:var(--hover-suave);color:var(--pasto-tinta)}
nav details.conta .painel form{margin:0}
nav .sessao{display:flex;gap:8px;align-items:center;margin-left:auto;min-width:0;max-width:100%}
nav .sessao .apoio{font-size:13px;min-width:0;max-width:240px;overflow-wrap:anywhere;line-height:1.4}
nav .sessao form{margin:0;flex-shrink:0;display:inline}
nav .sessao button{font:400 13px var(--corpo);border:0;background:none;color:var(--pasto-tinta);padding:10px 8px;min-height:44px;white-space:nowrap}
nav .sessao button:hover{background:var(--hover-suave);color:var(--pasto-tinta)}
nav .painel{position:absolute;left:0;top:calc(100% + 8px);z-index:8;min-width:270px;background:var(--caixa);border:1px solid var(--filete);border-radius:12px;max-height:min(70vh,520px);overflow-y:auto;padding:6px;box-shadow:0 8px 24px rgba(20,30,20,.12)}
nav .painel a:not(.marca){display:flex;align-items:center;min-height:44px;padding:10px 12px;border:0;border-radius:6px;white-space:normal;font:400 14px/1.5 var(--corpo);color:var(--tinta)}
nav .painel a:not(.marca):hover{background:var(--hover-suave);color:var(--tinta)}
nav .painel a[aria-current]{font-weight:600;color:var(--pasto-tinta);background:var(--hover-suave);box-shadow:inset 3px 0 var(--pasto-tinta)}
nav .painel.duas{display:grid;grid-template-columns:1fr 1fr;column-gap:8px;min-width:520px}
nav .painel.duas .secao{display:flex;flex-direction:column}
nav .painel .pergunta{display:block;font:600 11px/1.5 var(--corpo);letter-spacing:.06em;color:var(--apoio);padding:8px 12px 4px;border:0;margin:0}
nav .painel a+.pergunta{margin-top:6px;padding-top:12px;border-top:1px solid var(--filete)}

/* a faixa verde-escura das superfícies públicas (consulta /c e portal) */
header.publico{background:var(--publico);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;padding:16px clamp(16px,4vw,40px)}
#voltar-publico{background:none;border:0;padding:0;color:var(--palha);opacity:.78;font:700 13px var(--corpo);display:inline-flex;align-items:center;gap:6px;cursor:pointer;min-height:44px;border-radius:0}
header.publico .marca{display:inline-flex;align-items:baseline;gap:10px}
header.publico .marca b{font:700 20px var(--estreita);letter-spacing:.12em;color:#F7F5F0}
header.publico .marca small{display:inline;font:400 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--brinco)}
header.publico .rota{font:400 11.5px var(--mono);color:rgba(247,245,234,.7);overflow-wrap:anywhere}

/* rodapé */
.rodape-alanda{border-top:2px solid var(--filete);padding-top:16px;display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px;font:400 13px/1.5 var(--corpo);color:var(--apoio)}
.rodape-alanda p{margin:0}
.rodape-alanda .aviso{border:0;padding:0;margin:0;font:inherit}
.rodape-alanda.curto{display:block;padding-top:14px}
.rodape-alanda.curto b{color:var(--pasto-tinta);letter-spacing:.08em}

/* a próxima etapa em destaque (13/09/2026) */
.proxima-etapa{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;padding:18px 22px;border-radius:18px;background:var(--hover-suave);margin:0 0 18px}
.proxima-etapa h3{margin:4px 0;font-size:20px}
.proxima-etapa p{margin:0}
.etapa-cartao.proxima{border-color:var(--pasto-tinta);box-shadow:inset 0 0 0 1px var(--pasto-tinta)}
details.sobre-a-cadeia{margin:0 0 14px}
details.sobre-a-cadeia>summary{font:600 13px/1.4 var(--corpo);color:var(--pasto-tinta);cursor:pointer;padding:4px 0}
.referencia-regra{display:inline-block;font:400 12px/1.4 var(--mono);color:var(--legenda);margin-left:6px}
nav details.conta .painel form.modo-do-menu{margin:0}

.linha-resolver{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--linha)}
.linha-resolver button.gps{min-height:36px;padding:6px 12px;font-size:13px}
@media (max-width:600px){.linha-resolver{grid-template-columns:1fr 1fr}.linha-resolver b{grid-column:1/-1}}

/* etapas e registro */
.etapas-grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:14px;margin:18px 0 28px}
.etapa-cartao{display:flex;flex-direction:column;gap:10px;padding:22px;border:1px solid var(--filete);border-radius:18px;background:var(--caixa);color:var(--tinta)}
.etapa-cartao:hover{border-color:var(--pasto-tinta)}
.etapa-cartao p{margin:0}
.etapa-cartao h3{font:700 19px/1.3 var(--estreita);margin:0}
.etapa-cartao h3 a{color:inherit;text-decoration:none}
.etapa-cartao h3 a:hover{color:var(--pasto-tinta)}
.etapa-cartao .descricao{font-size:14px;color:var(--apoio)}
.etapa-cartao details{font-size:14px;color:var(--apoio);flex:1}
.etapa-cartao details>summary{cursor:pointer;color:var(--pasto-tinta)}
.etapa-cartao details[open]>summary{margin-bottom:8px}
.etapa-cartao .etapa-rodape{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--apoio);border-top:1px solid var(--linha);padding-top:12px}
.etapa-cartao .etapa-rodape a{font-weight:600}
.registro-grade{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:14px;align-items:start}
.registro-formulario{grid-column:1;grid-row:1;min-width:0}
.registro-ajuda{grid-column:2;grid-row:1;min-width:0}
.registro-grade .cartao{margin-top:0}
.registro-formulario form :is(input:not([type=hidden]),select){width:100%}
/* o formulário de etapa é uma coluna só: a grade de duas colunas do form.cartao espalhava os campos (13/09/2026) */
.registro-formulario form.cartao{display:block}
.registro-formulario form.cartao>p{margin:0 0 16px}
.registro-formulario .quantidade-campos{margin:6px 0}
a.etapa{display:block;border:1px solid var(--filete);border-left:3px solid var(--filete);border-radius:10px;padding:10px 12px;margin:8px 0;color:var(--tinta);text-decoration:none;font-size:14px}
a.etapa:hover{border-color:var(--pasto-tinta);color:var(--tinta)}
a.etapa.atual,.registro-ajuda .etapa-atual{background:var(--hover-suave);border-color:transparent}
a.etapa b{font-size:14px}
.etapas-fluxo{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}
.etapa-fluxo{padding:8px 12px;border:1px solid var(--filete);border-left:4px solid var(--pasto);border-radius:8px;background:var(--papel);font-size:13px}

/* painel do gestor */
.painel-intro{display:flex;flex-direction:column;gap:18px;margin-bottom:28px}
.painel-intro h1{font-size:38px;max-width:28ch}
.painel-intro .contexto-operacao{display:flex;flex-wrap:wrap;gap:4px 20px}
.links-lado{display:flex;flex-wrap:wrap;gap:6px 22px;margin:14px 0 0}
.proximo-passo{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;padding:20px 24px;border-radius:18px;background:var(--hover-suave);align-items:center}
.proximo-passo h2{font-size:19px;margin:6px 0}
.proximo-passo .acoes{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end;max-width:440px;margin:0}
.proximo-passo p{margin:0}
/* a mesma faixa no /credito, onde o texto é um só parágrafo (o kicker em
   linha própria e a ação no traje do h2 do painel) e o link é o botão */
.proximo-passo span.kicker{display:block;margin-bottom:6px}
.proximo-passo p>b{font:700 19px/1.3 var(--estreita);letter-spacing:-.01em}
.painel-kpis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0 0 28px}
a.kpi-link{color:var(--tinta);text-decoration:none;min-height:190px}
a.kpi-link b{font-size:46px;line-height:1}
.kpi-link .nota{flex:1}
.kpi-link .ver-detalhe{font:600 14px var(--corpo);color:var(--pasto-tinta)}
.graficos-painel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:28px}
.graficos-painel .cartao{margin:0}
.funil-elo{display:grid;grid-template-columns:110px minmax(0,1fr) 96px;gap:12px;align-items:center;margin:10px 0}
.funil-elo strong{font:600 14px/1.3 var(--corpo)}
.funil-elo .trilho{height:12px;background:var(--linha);margin:0}
.funil-elo .apoio{font-size:12px;text-align:right}
.graficos-painel h3{margin:18px 0 6px;font-size:16px}
.graficos-painel h3:first-of-type{margin-top:0}
details.etapas-da-cadeia{margin:8px 0 14px}
details.etapas-da-cadeia>summary{font:600 13px/1.4 var(--corpo);color:var(--pasto-tinta);cursor:pointer;padding:6px 0}
.meses-grafico.sem-registro .mes-barra{min-height:3px;background:var(--linha)}
.meses-grafico.sem-registro strong{color:var(--apoio)}
.funil-linha{display:grid;grid-template-columns:120px minmax(0,1fr) 28px;gap:12px;align-items:center;margin:12px 0}
.funil-linha .apoio{font-size:12px;display:block}
/* a barra de progresso (o caminho da produção e a prontidão por prazo) */
.trilho,.preenchido{border-radius:999px}
.trilho{height:12px;background:var(--linha);overflow:hidden;margin:6px 0 4px}
.funil-linha .trilho{margin:0}
.preenchido{height:100%;background:var(--pasto)}
.meses-grafico{height:204px;padding-top:24px;display:flex;align-items:end;gap:8px;overflow-x:auto;margin:20px 0}
.mes-coluna{display:flex;flex:1;min-width:28px;flex-direction:column;align-items:center;justify-content:flex-end;font-size:13px;gap:6px}
.mes-barra{width:100%;max-width:50px;background:var(--pasto);border-radius:8px 8px 3px 3px}
.mes-rotulo{font-size:12px;color:var(--apoio)}
.grade-respostas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:14px}
.grade-respostas #resposta-mercados{grid-column:1/-1}
.resposta h3{font:700 19px/1.3 var(--estreita)}
.resposta .numero{font-size:17px;font-weight:700;margin:0 0 10px}
/* o rótulo do que o cartão responde: uma linha curta acima da dupla
   com/sem, na língua do produtor ("chance de conseguir o crédito") */
.resposta .pergunta{margin:0 0 4px;font:700 12px var(--estreita);text-transform:uppercase;letter-spacing:.04em;color:var(--apoio)}
.comsem{display:grid;grid-template-columns:1fr;gap:10px;margin:10px 0}
.comsem>div{padding:10px 12px;border-radius:10px;background:var(--linha)}
.comsem>div+div{background:var(--hover-suave)}
.comsem .rotulo{display:block;font:700 11px var(--mono);text-transform:uppercase;letter-spacing:.05em;color:var(--apoio)}
.comsem p{margin:4px 0 0}
.resposta .falta{font:400 13px var(--corpo);color:var(--ambar-texto);margin:6px 0}
.resposta .falta a{color:inherit}
.selo{font-family:var(--mono);margin:10px 0 4px}
#resposta-mercados table{font-size:13px}
/* as portas de mercado seguem a régua da casa (verde = liberada, âmbar =
   pendente, contorno = sem registro ou não se aplica), mas a classe interna
   da porta é "aberta"/"fechada" — o contrário da pendência, cuja "aberta"
   é a que falta resolver; a palavra exibida já evita a colisão, a cor
   acompanha a palavra. Nunca vermelho para o que ainda não é avaliável. */
#resposta-mercados .situacao.aberta{background:var(--hover-suave);color:var(--ok);border-color:var(--ok)}
#resposta-mercados .situacao.fechada{background:var(--brinco-claro);color:var(--ambar-texto);border-color:var(--brinco)}
#resposta-mercados .situacao.sem_registro,#resposta-mercados .situacao.nao_se_aplica{background:transparent;color:var(--apoio);border-color:var(--filete)}
.acoes-lista{counter-reset:acoes;list-style:none;padding:0}
.acoes-lista>li{counter-increment:acoes;display:grid;grid-template-columns:40px 1fr;gap:20px;padding:20px 0;border-bottom:1px solid var(--filete)}
.acoes-lista>li::before{content:counter(acoes,decimal-leading-zero);font:700 24px var(--estreita);color:var(--ambar-texto)}
.passo-feito{color:var(--apoio)}
.passo-feito .visto{color:var(--pasto);font-weight:700}
.parecer-resumo{grid-template-columns:repeat(3,minmax(0,1fr))}
.parecer-resumo .kpi b{font-size:28px}

/* prazos, referências, fontes e o ? de ajuda (painel, crédito, financiar):
   nenhum número da tela existe sem a sua fonte, e a fonte é lida no
   mesmo traje em toda página */
.prazo-linha{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:12px}
.prazo-linha b{font-size:13.5px}
.prazo-linha .quando{font:400 11.5px var(--mono);color:var(--apoio)}
.prazo-linha .dias{margin-left:auto;font:400 11.5px var(--mono);color:var(--ambar-texto)}
sup.ref{font:700 11px var(--mono)}
sup.ref a{text-decoration:none;color:var(--pasto-tinta)}
details#referencias>summary{cursor:pointer;font-size:14px}
details#referencias>summary b{font:700 12.5px var(--estreita);text-transform:uppercase;letter-spacing:.08em;color:var(--pasto-tinta)}
ol.fontes{padding-left:1.4em}
ol.fontes li{font:400 12.5px/1.5 var(--mono);color:var(--apoio);margin:6px 0}
/* o "como isso foi calculado": o texto técnico completo vive num details
   sempre no DOM, fora da frase visível; a fonte citável fica fora dele */
details.calculo{margin:8px 0}
details.calculo>summary{cursor:pointer;font:400 12px var(--mono);color:var(--apoio)}
details.calculo p{margin:8px 0 0}
details.calculo ul.premissas-resposta{margin:6px 0 0;padding-left:1.2em;font:400 12.5px/1.5 var(--mono);color:var(--apoio)}
details.calculo ul.premissas-resposta li{margin:3px 0}
/* o ? genérico de ajuda: balão no hover e no foco do teclado */
.dica{position:relative;display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;border:1.5px solid var(--contorno);color:var(--apoio);font:700 11px/1 var(--mono);margin-left:6px;vertical-align:2px;cursor:help;text-transform:none;letter-spacing:normal}
.dica::after{content:attr(data-dica);position:absolute;top:22px;left:50%;transform:translateX(-50%);z-index:6;width:280px;background:var(--tinta);color:var(--papel);font:400 12.5px/1.5 var(--corpo);text-align:left;padding:10px 12px;border-radius:6px;box-shadow:0 4px 14px rgba(0,0,0,.25);opacity:0;visibility:hidden;pointer-events:none}
.dica:hover::after,.dica:focus-visible::after{opacity:1;visibility:visible}

/* a jornada do crédito (/credito, /credito/simular, o dossiê): as estações,
   as pendências uma a uma, os cenários da simulação e os dossiês guardados */
.grade-estacoes{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));margin:14px 0}
.estacao-credito{border:1px solid var(--filete);border-radius:10px;padding:14px 16px;background:var(--caixa)}
.estacao-credito h3{margin:0 0 8px;font-size:15px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pendencia-linha{border-top:1px solid var(--linha);padding:10px 0}
.pendencia-linha:first-child{border-top:0}
.cenarios-credito{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:10px 0}
.cenario-credito{border:1px solid var(--filete);border-radius:10px;padding:12px 14px}
.cenario-credito h3{margin:0 0 6px;font-size:14px}
.premissas-credito{font:400 12.5px var(--mono);color:var(--apoio)}
table.tabela-credito{margin:10px 0}
table.tabela-credito :is(th,td){padding:8px}
.lista-dossies .linha-dossie{border-top:1px solid var(--linha);padding:10px 0;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.lista-dossies .linha-dossie:first-child{border-top:0}
.lista-dossies form{display:inline}
.lista-envios-cpr li{margin:4px 0}

/* os incentivos verdes (/verdes): a legenda dos estados e o parecer por
   perfil; os KPIs são a fileira da casa */
.verdes-grade{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr))}
.verdes-grade .cartao{margin:0}
.verdes-legenda{display:flex;flex-wrap:wrap;gap:8px 18px;margin:4px 0 10px;font-size:13px;color:var(--apoio)}
.verdes-legenda .amostra{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
details.parecer-verde{background:var(--caixa);border:1px solid var(--filete);border-radius:10px;padding:0 18px;margin:12px 0}
details.parecer-verde>summary{cursor:pointer;padding:14px 0;font:700 15px var(--estreita);text-transform:uppercase;letter-spacing:.04em;color:var(--pasto-tinta)}
details.parecer-verde .chips{font:400 12.5px var(--mono);color:var(--apoio);text-transform:none;letter-spacing:0}

/* a bancada de instrumentos (/sensores): a borda esquerda da ficha diz o
   estado da instalação, como na linha de produção; o cadastro vive atrás
   do botão da casa (summary.botao-cadastrar, na regra do botão) */
.grade-aparelhos{display:grid;gap:12px;margin:12px 0 4px;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr))}
.ficha-aparelho{border:1px solid var(--filete);border-left:6px solid var(--filete);border-radius:10px;background:var(--caixa);padding:14px 16px}
.ficha-aparelho.instalada{border-left-color:var(--pasto)}
.ficha-aparelho b{font-size:15px}
.ficha-aparelho .specs{display:grid;grid-template-columns:88px 1fr;gap:2px 10px;font:400 12px var(--mono);margin:8px 0 0;overflow-wrap:anywhere}
.ficha-aparelho .specs span{color:var(--apoio)}
.ficha-aparelho .specs i{font-style:normal;color:var(--tinta)}
.form-aparelho{border:1px solid var(--filete);border-radius:10px;padding:16px 16px 6px;margin-top:12px}
.form-aparelho .par{display:grid;gap:12px;margin:0 0 12px}
.form-aparelho .par p{margin:0}
.form-aparelho input{width:100%}
.etiqueta-campo{font:400 10.5px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--apoio);display:block;margin:0 0 4px}
.leitura{border-left:3px solid var(--filete);padding:2px 0 2px 14px;margin:10px 0}
.leitura.com-alarme{border-left-color:var(--falha)}
.leitura .quando{font:400 11px var(--mono);color:var(--legenda)}

/* a mesa da casa (/admin e a ficha do cliente): o funil em contagens, o
   projeto como bloco com filete de brinco e a ajuda — o ? redondo ao lado
   do título, que abre o "como se faz" da seção sem JavaScript */
.funil{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 14px}
.funil span{font:500 12px var(--mono);border:1px solid var(--filete);border-radius:999px;padding:4px 12px;color:var(--apoio)}
.funil b{color:var(--tinta);font-size:13px}
.projeto{border:1px solid var(--filete);border-left:4px solid var(--brinco);border-radius:10px;padding:14px 16px;margin:12px 0}
.projeto h3{margin:0 0 4px;font:700 15px var(--corpo)}
h2 details.ajuda,h3 details.ajuda{display:inline-block;position:relative;margin-left:8px;vertical-align:middle;font-weight:400;text-transform:none;letter-spacing:0}
details.ajuda>summary{list-style:none;cursor:help;display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border:1px solid var(--pasto-tinta);border-radius:50%;color:var(--pasto-tinta);font:700 12px var(--mono)}
details.ajuda>summary::-webkit-details-marker{display:none}
details.ajuda[open]>summary{background:var(--brinco);border-color:var(--brinco);color:#1c1f1a}
details.ajuda>.balao{position:absolute;z-index:9;left:-8px;top:27px;width:min(380px,76vw);background:var(--caixa);border:1px solid var(--filete);border-top:3px solid var(--brinco);border-radius:0 0 10px 10px;box-shadow:0 10px 26px rgba(20,30,20,.16);padding:12px 14px;font:400 13px/1.55 var(--corpo);color:var(--apoio);text-transform:none;letter-spacing:0}
details.ajuda>.balao b{color:var(--tinta)}

/* os tutoriais por leitor (/tutoriais/<papel>): a régua de etapas, com a
   etapa em que a prova nasce marcada em brinco, e o que não se promete */
.regua-tutorial{list-style:none;padding:0;display:grid;gap:10px}
.regua-tutorial li{border:1px solid var(--filete);border-left:6px solid var(--filete);border-radius:10px;background:var(--caixa);padding:12px 14px;margin:0}
.regua-tutorial li.prova{border-left-color:var(--brinco)}
.regua-tutorial b{font-size:14.5px}
.regua-tutorial .marca-prova{float:right;font:600 10.5px var(--estreita);text-transform:uppercase;letter-spacing:.08em;color:var(--ambar-texto)}
.nao-promete{border-left:4px solid var(--falha);padding:10px 14px;background:var(--caixa);border-radius:0 10px 10px 0;max-width:62ch}

/* o diagrama da cadeia (/cadeia/<nome>): os elos em colunas, ligados pela
   seta, e os registros de cada etapa com o resumo que abre a prova */
.trilho-elos{display:flex;gap:0;overflow-x:auto;align-items:stretch;padding:8px 0 16px}
.elo-col{min-width:220px;flex:1}
.elo-col+.elo-col{margin-left:28px;position:relative}
.elo-col+.elo-col::before{content:"→";position:absolute;left:-24px;top:14px;font-size:22px;color:var(--apoio)}
.elo-nome{font:700 15px var(--estreita);letter-spacing:.06em;text-transform:uppercase;border-bottom:2px solid var(--acento);padding-bottom:6px;margin-bottom:8px}
.etapa-bloco{border:1px solid var(--filete);border-radius:6px;padding:8px 10px;margin:8px 0;background:var(--caixa)}
.etapa-bloco b{font-size:15px}
.etapa-bloco .reg{display:flex;justify-content:space-between;gap:8px;font-size:13px;margin-top:4px}

/* mapa, documentos, atributos, portal */
.mapa-layout{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:14px;align-items:start}
/* a viewport útil do mapa: a tela menos o cabeçalho, nunca menor que o
   razoável (correção de 21/08/2026), no raio dos cartões da casa */
#mapa{height:calc(100vh - 260px);min-height:520px;border:1px solid var(--filete);border-radius:18px;overflow:hidden;background:var(--caixa)}
.mapa-layout>.cartao{margin:0;padding:22px}
.mapa-layout .legenda{display:block;font-size:13px;list-style:none;padding:0}
.mapa-layout .legenda .liga-camada{display:inline;text-align:left;min-height:32px;padding:0;margin:0;border:0;border-radius:0;background:none;color:inherit;font:inherit;cursor:pointer}
.mapa-layout .legenda .liga-camada[aria-pressed="false"]{opacity:.4}
.mapa-layout .legenda .liga-camada[aria-pressed="false"]::after{content:" (camada desligada)";font-style:italic}
/* as amostras da legenda casam com o que o Leaflet desenha, por isso as
   cores ficam em hex e não em token: a APP e a reserva declaradas no CAR
   entram hachuradas, nunca cheias — a hachura diz "declaração", o
   preenchimento diria "verificação" */
.mapa-layout .legenda .amostra{display:inline-block;width:22px;height:14px;border-radius:3px;vertical-align:-2px;margin-right:6px;border:1px solid var(--filete)}
.mapa-layout .legenda .tracejada{background:transparent;border:2px dashed #b3261e}
.mapa-layout .legenda .hachura-legenda{background:repeating-linear-gradient(45deg,#1565c0 0 2px,transparent 2px 6px);border:2px solid #1565c0}
.mapa-layout .legenda .hachura-reserva-legenda{background:repeating-linear-gradient(-45deg,#556b2f 0 2px,transparent 2px 6px);border:2px solid #556b2f}
.mapa-layout .legenda .balao-legenda{background:var(--brinco);color:#1c1f1a;text-align:center;font-weight:700;border-radius:50%;width:18px;height:18px;line-height:16px}
.mapa-layout .legenda .trilha-amostra{background:transparent;height:0;border:0;border-top:2px dashed var(--apoio);vertical-align:4px}
/* legenda viva (28/08/2026): a contagem real do recorte em cada item e o
   item sem dado esmaecido e dito */
.mapa-layout .legenda .conta{display:block;margin:2px 0 0 29px;font:600 11px var(--estreita);letter-spacing:.02em;opacity:.85}
.mapa-layout .legenda li.sem-dado{opacity:.5}
.mapa-layout .legenda li.sem-dado .conta{font-weight:400;font-style:italic}
.popup-mapa .fonte{margin:2px 0 0}
/* o balão da trilha, no amarelo de brinco e na letra da casa; em alarme de
   cadeia fria veste o vermelho; o veículo é o marcador do transporte */
#mapa .balao{background:var(--brinco);color:#1c1f1a;border-radius:50%;border:2px solid #1c1f1a55;text-align:center;font:700 13px/22px var(--estreita);box-shadow:0 1px 2px #0004}
#mapa .balao.alarme{border-color:#b3261e;background:#f6c9c4}
#mapa .veiculo{color:#154e2a;background:var(--caixa);border-radius:50%;border:2px solid #154e2a;display:grid;place-items:center;box-shadow:0 1px 3px #0005}
#mapa .veiculo svg{width:20px;height:20px}
.documento-destino{display:flex;flex-direction:column;gap:12px;min-height:180px}
.documento-destino p,.documento-destino form{margin:0}
.documento-destino h2{font-size:19px;margin:0}
.documento-destino .acao{margin-top:auto;align-self:flex-start}
/* a jornada da umidade do café (/atributos): formulários largos, rótulo em
   bloco acima de cada controle, a grade de campos e o erro dito */
.atributos .botao{border-radius:999px;font:600 15px var(--corpo);padding:12px 20px}
.atributos{max-width:none}
.atributos label{display:block;margin:14px 0 5px;font-weight:600}
.atributos :is(input:not([type=checkbox]),select,textarea){width:100%}
.atributos input[type=checkbox]{width:22px;height:22px;vertical-align:middle;margin-right:8px}
.atributos .acoes{margin:18px 0}
.atributos .acoes a{min-height:44px;display:inline-flex;align-items:center}
.atributos .erro{border-left:4px solid var(--falha);padding:12px}
.atributos .grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:14px}
.atributos summary{cursor:pointer;min-height:44px;padding:8px}
.atributos form{background:var(--caixa);border:1px solid var(--filete);border-radius:18px;padding:24px}
.atributos .cartao form{border:0;padding:0}
.atributos .estado{border-radius:999px}
.botao.claro{color:var(--pasto-tinta);border-radius:999px}
.portal-entrada{max-width:480px;margin:0 auto}

/* diagramas BPMN (bpmn-js), nas quatro telas que os mostram: a folha base
   põe svg{height:auto} e o diagrama precisa da altura inteira do contêiner;
   o fundo é branco nos dois temas porque a notação é impressa em preto */
.previa-bpmn,#previa,#bpmn-visor,#canvas{border:1px solid var(--filete);border-radius:18px;background:#fff;color:#1c1f1a}
.previa-bpmn{height:320px}
#previa{height:60vh}
#bpmn-visor,#canvas{height:70vh}
#bpmn-visor{min-height:360px}
:is(.previa-bpmn,#previa,#bpmn-visor,#canvas) svg{height:100%!important;max-width:none!important}
:is(.previa-bpmn,#previa-caixa) :is(.djs-palette,.djs-context-pad){display:none}
.bjs-powered-by{opacity:1!important}
/* o editor de fluxos (/fluxos/<cadeia>): a paleta de figuras da tese, com a
   exigida em verde-pasto, a própria em cinza e a comum mais curta */
.paleta-tese{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.paleta-tese .figura{display:flex;align-items:center;gap:8px;border:1px solid var(--filete);border-left:6px solid var(--brinco);border-radius:6px;padding:6px 10px;background:var(--caixa);cursor:grab;min-width:220px}
.paleta-tese .figura.exigida{border-left-color:var(--pasto)}
.paleta-tese .figura.propria{border-left-color:var(--apoio)}
.paleta-tese .figura svg{width:26px;height:26px;color:var(--pasto)}
.paleta-tese .figura small{display:block;color:var(--apoio);font-size:12px}
.paleta-tese .figura.comum{min-width:140px}
.normas label{margin-right:14px}

/* o assistente de cadeia (/cadeias/nova): a trilha de passos, a pergunta à
   esquerda e o desenho à direita */
.trilho-passos{display:flex;flex-wrap:wrap;gap:4px 14px;margin:6px 0 14px}
.trilho-passos span{font:400 12px var(--estreita);text-transform:uppercase;letter-spacing:.08em;color:var(--apoio)}
.trilho-passos span.aqui{color:var(--pasto-tinta);border-bottom:2px solid var(--brinco)}
.trilho-passos span.feita{color:var(--tinta)}
.assistente{display:grid;grid-template-columns:minmax(320px,5fr) minmax(320px,7fr);gap:16px;align-items:start}
#pergunta h2{margin-top:0}
#pergunta .exemplo{color:var(--apoio);margin:2px 0 12px}
#pergunta .escolha{display:block;border:1px solid var(--filete);border-left:6px solid var(--brinco);border-radius:6px;padding:10px 12px;margin:8px 0;cursor:pointer;background:var(--caixa)}
#pergunta .escolha input{margin-right:8px}
#pergunta .bloco{border-top:1px solid var(--filete);padding-top:10px;margin-top:10px}
#pergunta .linha{margin:6px 0}
#passos{margin:14px 0 0;display:flex;gap:10px;align-items:center}
#exigencias,#normas{margin:12px 0 0}
#exigencias h3,#normas h3{font:700 11.5px var(--estreita);text-transform:uppercase;letter-spacing:.08em;color:var(--pasto-tinta);margin:0 0 6px}
#exigencias ul,#normas ul{list-style:none;margin:0;padding:0}
#exigencias li,#normas li{border-left:3px solid var(--brinco);padding:2px 0 2px 10px;margin:5px 0;color:var(--apoio);font-size:14px}
#normas li.parecer-ok{border-left-color:var(--pasto)}
#normas li.parecer-aviso{border-left-color:var(--falha)}
.alerta-proprio{border-left:3px solid var(--falha);padding:4px 0 4px 10px;margin:8px 0;color:var(--falha);font-size:14px}
#mensagem{min-height:1.4em}
.selo-sensor{font:600 10.5px var(--estreita);white-space:nowrap;background:var(--brinco-claro);color:var(--ambar-texto);border:1px solid var(--brinco);border-radius:999px;padding:1px 7px;pointer-events:none}
.selo-sensor.com-alarme{background:var(--caixa);color:var(--falha);border-color:var(--falha)}

/* a tela de entrada */
.entrar{display:grid;min-height:100vh;background:var(--papel)}
@media (min-width:980px){.entrar{grid-template-columns:minmax(380px,620px) 1fr}}
.painel-marca{position:relative;overflow:hidden;background:var(--pasto);display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:48px 52px}
.painel-marca .digital{position:absolute;right:-140px;bottom:-110px;width:660px;height:660px;opacity:.16}
.painel-marca .alto{position:relative;display:flex;flex-direction:column;gap:6px}
.painel-marca .alto b{font:700 34px var(--estreita);letter-spacing:.14em;color:#F7F5F0}
.painel-marca .alto small{font:400 12px var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--brinco)}
.painel-marca .chamada{position:relative;display:flex;flex-direction:column;gap:14px;max-width:430px}
.painel-marca .titulo{margin:0;font:700 34px/1.25 var(--estreita);color:#fff}
.painel-marca .titulo span{color:#CBE48C}
.painel-marca .frase{margin:0;font-size:18px;line-height:1.55;font-weight:500;color:rgba(247,245,234,.9)}
.painel-marca .tec{margin:0;font:400 12px/1.7 var(--mono);color:rgba(247,245,234,.72)}
.painel-form{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:48px 24px;font-family:var(--corpo)}
.painel-form h1{font-size:36px}
.painel-form form.cartao{display:flex;flex-direction:column;gap:8px;width:min(460px,100%);margin:0;padding:28px;border-radius:18px}
.painel-form form.cartao p{margin:0 0 10px}
.painel-form form.cartao input{width:100%}
.painel-form .convite-tutorial{width:min(460px,100%);margin:0;border-left:4px solid var(--brinco);background:var(--caixa);border-radius:0 10px 10px 0;padding:12px 16px}
.painel-form .convite-tutorial .rotulo{font:600 11px var(--corpo);text-transform:uppercase;letter-spacing:.1em;color:var(--ambar-texto)}
.painel-form .convite-tutorial a{font-weight:600}
.painel-form .qr{font:400 11px var(--mono);color:var(--legenda);margin:0}

/* a faixa de recolhimento nas páginas do item e no envio (19/09/2026) */
.faixa-recolhimento{border-left:4px solid var(--falha)}

/* movimento e ponteiro: TODO movimento da folha vive neste bloco e só
   toca quem não pediu menos movimento no aparelho; as durações são os
   tokens da raiz (a longa é da régua pública, em SVG); nada em laço */
@media (hover:hover){a.kpi-link:hover{border-color:var(--pasto-tinta);box-shadow:0 8px 24px rgba(28,31,26,.08);transform:translateY(-2px)}}
@media (prefers-reduced-motion:no-preference){
 @keyframes crescer-largura{from{transform:scaleX(0)}}
 @keyframes crescer-altura{from{transform:scaleY(0)}}
 @keyframes surgir{from{opacity:0;transform:translateY(-6px)}}
 @keyframes tremer{0%,100%{transform:rotate(0)}30%{transform:rotate(-14deg)}60%{transform:rotate(12deg)}}
 @keyframes piscar{from{background:var(--brinco-claro)}}
 a.kpi-link{transition:transform var(--dur-curta),box-shadow var(--dur-curta)}
 .dica::after{transition:opacity var(--dur-curta)}
 nav details.grupo>summary::after{transition:transform var(--dur-curta) var(--ease),margin-top var(--dur-curta)}
 .preenchido{transform-origin:left;animation:crescer-largura var(--dur-longa) var(--ease) both}
 .mes-barra{transform-origin:bottom;animation:crescer-altura var(--dur-longa) var(--ease) both}
 .funil-elo:nth-of-type(2) .preenchido{animation-delay:120ms}.funil-elo:nth-of-type(3) .preenchido{animation-delay:240ms}.funil-elo:nth-of-type(4) .preenchido{animation-delay:300ms}.funil-elo:nth-of-type(5) .preenchido{animation-delay:300ms}
 .mes-coluna:nth-child(2) .mes-barra{animation-delay:60ms}.mes-coluna:nth-child(3) .mes-barra{animation-delay:120ms}.mes-coluna:nth-child(4) .mes-barra{animation-delay:180ms}.mes-coluna:nth-child(5) .mes-barra{animation-delay:240ms}.mes-coluna:nth-child(6) .mes-barra{animation-delay:300ms}
 html.anima .preenchido:not(.visto),html.anima .mes-barra:not(.visto){animation-play-state:paused}
 .registrado{animation:surgir var(--dur-media) var(--ease) both}
 nav details.avisos .badge{animation:tremer var(--dur-media) var(--ease) 1}
 .etapa.recem,.alvo-revelado{animation:piscar var(--dur-media) var(--ease) 1}
 .veiculo{transition:transform var(--dur-media) linear}
}

/* telas estreitas */
@media (max-width:820px){
 html{scroll-padding-top:32px}main{padding:24px 18px 48px}h1,.painel-intro h1{font-size:30px}
 header.topo{position:relative}header.topo nav{position:relative;padding:10px 18px;gap:4px 8px}nav .sessao{width:100%;margin:4px 0 0;flex-wrap:wrap;border-top:1px solid var(--filete);padding-top:4px}nav .sessao .apoio{flex:1;max-width:none}
 nav details.grupo{position:static}nav details.grupo .painel{left:18px;right:18px;top:100%;width:auto;min-width:0;max-width:none}
 .duas-colunas,.duas-colunas.larga,.layout-lateral,.registro-grade,.graficos-painel,.mapa-layout,.grade-respostas,.rodape-alanda,.proximo-passo,.proxima-etapa,.assistente{grid-template-columns:minmax(0,1fr)}
 .registro-formulario,.registro-ajuda{grid-column:auto;grid-row:auto}.registro-formulario{order:-1}
 .proximo-passo .acoes{justify-content:flex-start;max-width:none}.painel-kpis{gap:12px}.kpi{padding:18px}a.kpi-link b{font-size:36px}
 .cartao{padding:20px}.parecer-resumo{grid-template-columns:1fr}.campos-grade{grid-template-columns:1fr}.grade-cartoes{grid-template-columns:1fr}
 .mapa-layout #mapa{min-height:420px}
 .painel-form{padding:24px 18px}.funil-linha{grid-template-columns:105px minmax(0,1fr) 25px;gap:8px}
 .meses-grafico{gap:5px}.mes-coluna{min-width:24px}
}
@media (max-width:600px){
 header.topo nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:4px}
 header.topo nav .marca{grid-column:1/-1;margin:0;min-height:36px}
 header.topo nav>a:not(.marca),nav details.grupo>summary{padding:10px 4px;font-size:14px}
 nav .sessao{grid-column:1/-1;gap:4px}nav .sessao .apoio{font-size:12px}nav .sessao button{padding:8px}nav .sessao>button{margin-left:0}
 nav details.avisos{margin-left:0;grid-column:1;justify-self:start}nav details.conta{grid-column:2;margin:0;justify-self:center}nav details.conta>summary{align-items:center;text-align:center;padding:6px 4px}nav details.conta>summary small{display:none}nav form.sair{grid-column:3;justify-self:end}nav details.conta .painel,nav details.avisos .painel{left:18px;right:18px}nav .painel.duas{grid-template-columns:1fr;min-width:0}
 .funil-elo{grid-template-columns:90px minmax(0,1fr) 84px;gap:8px}
}
@media (max-width:480px){.painel-kpis{grid-template-columns:1fr}.fileira-kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.fileira-kpi .kpi b{font-size:32px}.quantidade-campos{grid-template-columns:1fr 1fr}.quantidade-campos>input:first-child{grid-column:1/-1}}