:root {
  --bg: #f3f4f6; --card: #ffffff; --texto: #111827; --suave: #6b7280; --borda: #e5e7eb; --borda-forte: #d1d5db;
  --primaria: #0f766e; --primaria-escura: #115e59; --primaria-texto: #ffffff; --primaria-leve: #ccfbf1;
  --erro: #b91c1c; --erro-bg: #fef2f2; --ok: #166534; --ok-bg: #f0fdf4; --aviso: #92400e; --aviso-bg: #fffbeb;
  --info: #1d4ed8; --info-bg: #eff6ff; --whats: #1fa855; --topo: #0f172a; --topo-texto: #e2e8f0; --destaque: #fef3c7;
  --raio: 10px; --sombra: 0 1px 2px rgba(0,0,0,.05);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b1220; --card: #111827; --texto: #f3f4f6; --suave: #9ca3af; --borda: #1f2937; --borda-forte: #374151;
    --primaria: #14b8a6; --primaria-escura: #0d9488; --primaria-texto: #042f2e; --primaria-leve: #134e4a;
    --erro: #fca5a5; --erro-bg: #3b0d0d; --ok: #86efac; --ok-bg: #052e16; --aviso: #fcd34d; --aviso-bg: #3a2a06;
    --topo: #020617; --destaque: #422006; --info: #93c5fd; --info-bg: #0b1f3f;
  }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--texto);
  font: 15px/1.45 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--primaria); }
h1 { font-size: 1.35rem; margin: 0; }
h2 { font-size: 1.05rem; margin: 0 0 10px; }

/* topo */
.topo { background: var(--topo); color: var(--topo-texto); position: sticky; top: 0; z-index: 30; }
.topo-dentro { max-width: 1200px; margin: 0 auto; padding: 0 16px; display: flex; align-items: center; gap: 20px; min-height: 58px; }
.marca { display: inline-flex; align-items: center; gap: 9px; font-weight: 800; font-size: 1.05rem; color: #fff; text-decoration: none; white-space: nowrap; letter-spacing: -.01em; }
.marca-simbolo { flex: none; }
.nav { display: flex; gap: 2px; flex: 0 1 auto; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.nav::-webkit-scrollbar { display: none; }
.nav a { display: inline-flex; align-items: center; gap: 7px; color: #cbd5e1; text-decoration: none; padding: 7px 11px; border-radius: 8px; white-space: nowrap; font-size: .92rem; font-weight: 500; }
.nav a .icone { opacity: .75; }
.nav a:hover { background: rgba(255,255,255,.07); color: #fff; }
.nav a.ativo { background: rgba(94,234,212,.14); color: #5eead4; }
.nav a.ativo .icone { opacity: 1; }
.usuario { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.usuario > a { color: #cbd5e1; }
.menu-usuario > summary { display: flex; align-items: center; gap: 9px; cursor: pointer; padding: 4px 6px 4px 4px; border-radius: 999px; color: #e2e8f0; }
.menu-usuario > summary:hover { background: rgba(255,255,255,.07); }
.avatar { width: 32px; height: 32px; border-radius: 50%; background: #134e4a; color: #5eead4; display: grid; place-items: center; font-weight: 700; font-size: .9rem; flex: none; }
.usuario-nomes { display: grid; line-height: 1.15; max-width: 180px; }
.usuario-nomes strong { font-size: .85rem; }
.usuario-nomes small { font-size: .74rem; color: #94a3b8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.menu-usuario .menu-itens a, .menu-usuario .menu-itens button { display: flex; align-items: center; gap: 10px; }
.menu-usuario .menu-itens .icone { color: var(--suave); }

/* navegação de celular */
.nav-celular { display: none; }
@media (max-width: 860px) {
  .nav { display: none; }
  .usuario-nomes { display: none; }
  .topo-dentro { min-height: 52px; }
  main.conteudo { padding-bottom: calc(96px + env(safe-area-inset-bottom)) !important; }
  .nav-celular { display: grid; grid-template-columns: repeat(5, 1fr); position: fixed; left: 0; right: 0; bottom: 0; z-index: 40;
    background: var(--card); border-top: 1px solid var(--borda); padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
    box-shadow: 0 -4px 16px rgba(0,0,0,.06); }
  .nav-celular > a, .nav-celular summary { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 0;
    color: var(--suave); text-decoration: none; font-size: .68rem; font-weight: 600; cursor: pointer; list-style: none; }
  .nav-celular summary::-webkit-details-marker { display: none; }
  .nav-celular .ativo { color: var(--primaria); }
  .nav-celular .nav-nova { align-self: center; justify-self: center; width: 52px; height: 52px; border-radius: 16px; margin-top: -22px;
    background: var(--primaria); color: var(--primaria-texto); display: grid; place-items: center; box-shadow: 0 6px 16px rgba(15,118,110,.35); }
  .nav-celular-mais { position: static; }
  .nav-celular-mais .folha { position: fixed; left: 8px; right: 8px; bottom: calc(70px + env(safe-area-inset-bottom)); background: var(--card);
    border: 1px solid var(--borda); border-radius: 14px; box-shadow: 0 12px 32px rgba(0,0,0,.18); padding: 6px; display: grid; }
  .nav-celular-mais .folha a { display: flex; align-items: center; gap: 12px; padding: 13px 14px; color: var(--texto); text-decoration: none; border-radius: 10px; font-weight: 500; }
  .nav-celular-mais .folha a:active { background: var(--bg); }
  .nav-celular-mais .folha .icone { color: var(--suave); }
  /* barras fixas das telas ficam acima da navegação */
  .barra-decisao { bottom: calc(66px + env(safe-area-inset-bottom)) !important; }
}

main.conteudo { max-width: 1200px; margin: 0 auto; padding: 20px 16px 60px; }
.barra-titulo { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 16px; }
.barra-titulo .sub { color: var(--suave); font-size: .9rem; margin-top: 2px; }
.acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.card { background: var(--card); border: 1px solid var(--borda); border-radius: var(--raio); padding: 16px; box-shadow: var(--sombra); margin-bottom: 16px; }
.card.sem-pad { padding: 0; overflow: hidden; }
.grade { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.grade .card { margin-bottom: 0; }
.grade-2 { display: grid; gap: 16px; grid-template-columns: 2fr 1fr; }
@media (max-width: 900px) { .grade-2 { grid-template-columns: 1fr; } }
.indicador .valor { font-size: 1.8rem; font-weight: 700; }
.indicador .rotulo { color: var(--suave); font-size: .85rem; }
.suave { color: var(--suave); font-size: .88rem; }

/* botões */
.btn { display: inline-flex; align-items: center; gap: 6px; font: inherit; font-size: .9rem; font-weight: 600;
  padding: 8px 14px; border-radius: 8px; border: 1px solid var(--borda-forte); background: var(--card);
  color: var(--texto); text-decoration: none; cursor: pointer; white-space: nowrap; }
.btn:hover { border-color: var(--primaria); }
.btn-primario { background: var(--primaria); border-color: var(--primaria); color: var(--primaria-texto); }
.btn-primario:hover { background: var(--primaria-escura); }
.btn-whats { background: var(--whats); border-color: var(--whats); color: #fff; }
.btn-perigo { color: var(--erro); }
.btn-pequeno { padding: 4px 10px; font-size: .82rem; }
.btn-link { background: none; border: 0; color: var(--erro); cursor: pointer; font: inherit; font-size: .85rem; padding: 0; text-decoration: underline; }

/* tabelas */
.tabela-rolagem { overflow-x: auto; }
table.lista { width: 100%; border-collapse: collapse; }
table.lista th, table.lista td { padding: 10px 12px; border-bottom: 1px solid var(--borda); text-align: left; vertical-align: middle; }
table.lista th { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--suave); background: var(--bg); }
table.lista tr:last-child td { border-bottom: 0; }
table.lista td.num, table.lista th.num { text-align: right; white-space: nowrap; }
table.lista a.linha-link { color: var(--texto); font-weight: 600; text-decoration: none; }
table.lista td:first-child { min-width: 180px; }
table.lista a.linha-link:hover { color: var(--primaria); }
.vazio { padding: 28px; text-align: center; color: var(--suave); }

/* status */
.badge { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .76rem; font-weight: 600; background: var(--bg); color: var(--suave); border: 1px solid var(--borda); white-space: nowrap; }
.badge.rascunho { }
.badge.enviada, .badge.enviado, .badge.aberto { background: #dbeafe; color: #1e40af; border-color: #bfdbfe; }
.badge.em_analise { background: var(--aviso-bg); color: var(--aviso); border-color: transparent; }
.badge.fechada, .badge.respondido { background: var(--ok-bg); color: var(--ok); border-color: transparent; }
.badge.cancelada, .badge.recusado { background: var(--erro-bg); color: var(--erro); border-color: transparent; }
@media (prefers-color-scheme: dark) {
  .badge.enviada, .badge.enviado, .badge.aberto { background: #172554; color: #93c5fd; border-color: transparent; }
}

/* formulários */
label { display: block; font-size: .85rem; font-weight: 600; margin-bottom: 4px; }
input[type=text], input[type=number], input[type=email], input[type=password], input[type=date],
input[type=datetime-local], input[type=search], select, textarea {
  width: 100%; font: inherit; color: inherit; background: var(--card);
  border: 1px solid var(--borda-forte); border-radius: 8px; padding: 9px 11px; }
textarea { min-height: 80px; resize: vertical; }
input:focus, select:focus, textarea:focus { outline: 2px solid var(--primaria); outline-offset: 0; border-color: transparent; }
select[multiple] { min-height: 120px; }
.campo { margin-bottom: 14px; }
.campo .ajuda { color: var(--suave); font-size: .8rem; margin-top: 3px; }
.campo .erros { color: var(--erro); font-size: .82rem; margin-top: 4px; }
.campo.check label { display: flex; gap: 8px; align-items: center; font-weight: 500; }
.campo.check input { width: 18px; height: 18px; accent-color: var(--primaria); }
.form-linha { display: grid; gap: 0 14px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.form-inline { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; }
.form-inline .campo { margin-bottom: 0; flex: 1; min-width: 140px; }
.filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.filtros input, .filtros select { width: auto; min-width: 180px; }
.checkboxes { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px; }
.checkboxes label { font-weight: 500; display: flex; gap: 6px; align-items: center; }

/* mensagens */
.msgs { list-style: none; padding: 0; margin: 0 0 16px; }
.msgs li { padding: 10px 14px; border-radius: 8px; margin-bottom: 8px; background: var(--ok-bg); color: var(--ok); }
.msgs li.error { background: var(--erro-bg); color: var(--erro); }
.msgs li.warning { background: var(--aviso-bg); color: var(--aviso); }
.alerta { padding: 10px 14px; border-radius: 8px; background: var(--aviso-bg); color: var(--aviso); margin-bottom: 14px; }

/* login */
.tela-login { min-height: 100vh; display: grid; place-items: center; padding: 16px; }
.tela-login .card { width: 100%; max-width: 380px; padding: 28px; }
.tela-login h1 { margin-bottom: 4px; }
.lista-empresas { display: grid; gap: 8px; }
.lista-empresas button { width: 100%; justify-content: space-between; padding: 14px; }

.htmx-request { opacity: .6; transition: opacity .2s; }

.previa-empresa { display: flex; gap: 12px; align-items: center; }
.logo-empresa { width: 52px; height: 52px; object-fit: contain; border-radius: 10px; border: 1px solid var(--borda); padding: 4px; background: var(--card); }

.sino { position: relative; display: inline-flex; color: #cbd5e1; padding: 4px; }
.sino-num { position: absolute; top: -4px; right: -6px; background: #ef4444; color: #fff; font-size: .68rem; font-weight: 700;
  min-width: 17px; height: 17px; border-radius: 999px; display: grid; place-items: center; padding: 0 4px; }
.notif { display: flex; gap: 10px; align-items: flex-start; padding: 12px 16px; border-bottom: 1px solid var(--borda); text-decoration: none; color: var(--texto); }
.notif:last-child { border-bottom: 0; }
.notif:hover { background: var(--bg); }
.notif .ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--primaria); margin-top: 7px; flex: none; }
.notif.lida .ponto { background: transparent; }
.notif.lida { color: var(--suave); }

.prorrogar { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; }
.prorrogar.card { padding: 10px 14px; }

.qtd-inline { display: inline-flex; gap: 6px; align-items: center; justify-content: flex-end; margin: 0; }
.qtd-inline input { width: 90px; text-align: right; padding: 5px 8px; }
.filtro-insumo { margin-bottom: 6px; }
details.colar { padding: 0 16px 14px; }
details.colar summary { cursor: pointer; color: var(--primaria); font-weight: 600; font-size: .9rem; padding: 4px 0 10px; }
details.colar textarea { font-family: ui-monospace, Consolas, monospace; font-size: .85rem; }
table.conferir td { vertical-align: top; }
table.conferir select { min-width: 220px; }

/* menu Mais */
.menu-mais { position: relative; }
.menu-mais > summary { list-style: none; }
.menu-mais > summary::-webkit-details-marker { display: none; }
.menu-itens { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; min-width: 220px; background: var(--card);
  border: 1px solid var(--borda); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12); padding: 6px; display: grid; }
.menu-itens form { margin: 0; display: grid; }
.menu-itens a, .menu-itens button { display: block; text-align: left; padding: 9px 12px; border-radius: 6px; font: inherit; font-size: .9rem;
  color: var(--texto); text-decoration: none; background: none; border: 0; cursor: pointer; width: 100%; }
.menu-itens a:hover, .menu-itens button:hover { background: var(--bg); }
.menu-itens .perigo { color: var(--erro); border-top: 1px solid var(--borda); border-radius: 0 0 6px 6px; margin-top: 4px; }

/* trilha de etapas */
.etapas { list-style: none; display: flex; gap: 0; padding: 0; margin: 0 0 10px; counter-reset: etapa; }
.etapas li { flex: 1; display: flex; align-items: center; gap: 8px; font-size: .85rem; color: var(--suave); position: relative; padding-right: 10px; }
.etapas li:not(:last-child)::after { content: ''; flex: 1; height: 2px; background: var(--borda); margin-left: 4px; }
.etapas li span { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: .78rem; font-weight: 700;
  border: 2px solid var(--borda-forte); background: var(--card); flex: none; }
.etapas li.feito span { background: var(--primaria); border-color: var(--primaria); color: var(--primaria-texto); }
.etapas li.feito::after { background: var(--primaria); }
.etapas li.atual { color: var(--texto); font-weight: 600; }
.etapas li.atual span { border-color: var(--primaria); color: var(--primaria); }
.proximo-passo { background: var(--card); border: 1px solid var(--borda); border-left: 4px solid var(--primaria); border-radius: 8px;
  padding: 10px 14px; margin-bottom: 14px; font-size: .92rem; }
@media (max-width: 640px) {
  .etapas li { font-size: 0; gap: 4px; }
  .etapas li.atual { font-size: .8rem; }
}

/* cadastro e páginas de texto */
.tela-login .card.cadastro { max-width: 460px; }
.secao-cadastro { font-size: .95rem; margin: 18px 0 10px; padding-top: 14px; border-top: 1px solid var(--borda); }
.campo-uf input { max-width: 90px; text-transform: uppercase; }
.campo-oculto { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.campo.check label { align-items: flex-start; }
.pagina-texto { max-width: 760px; }
.pagina-texto article h2 { font-size: 1rem; margin: 20px 0 6px; }
.pagina-texto article p, .pagina-texto article li { line-height: 1.6; }

/* assinatura */
.faixa-assinatura { background: var(--aviso-bg); color: var(--aviso); text-align: center; padding: 8px 16px; font-size: .9rem; }
.faixa-assinatura.vencida, .faixa-assinatura.suspensa { background: var(--erro-bg); color: var(--erro); }
.faixa-assinatura a { color: inherit; font-weight: 700; margin-left: 6px; }
.medidor { height: 8px; background: var(--bg); border-radius: 999px; overflow: hidden; margin-top: 6px; }
.medidor span { display: block; height: 100%; background: var(--primaria); }
.medidor span.cheio { background: var(--erro); }
.planos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.planos .card { margin: 0; }
.planos ul { padding-left: 18px; margin: 8px 0 0; }

.usuario a.link-dono { background: #f59e0b; color: #1f2937; padding: 2px 8px; border-radius: 999px; font-weight: 700; text-decoration: none; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 16px; }
.kpis .card { margin: 0; }
.kpis a.card { text-decoration: none; color: inherit; }
.kpis a.card.ativo { border-color: var(--primaria); box-shadow: 0 0 0 2px var(--primaria-leve); }
.badge.teste { background: #dbeafe; color: #1e40af; border-color: transparent; }
.badge.ativa { background: var(--ok-bg); color: var(--ok); border-color: transparent; }
.badge.vencida, .badge.suspensa { background: var(--erro-bg); color: var(--erro); border-color: transparent; }
.zona-perigo { border-color: var(--erro); }

/* ---------------------------------------------------------------- acabamento */
:root { --raio: 12px; --sombra: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.04); }
body { -webkit-font-smoothing: antialiased; }
h1 { font-size: 1.45rem; letter-spacing: -.015em; }
.card { box-shadow: var(--sombra); }
.btn { border-radius: 9px; transition: background .15s, border-color .15s; }
.btn .icone { margin: 0 -2px; }
.badge.rascunho { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
@media (prefers-color-scheme: dark) { .badge.rascunho { background: #1e293b; color: #cbd5e1; border-color: transparent; } }
.indicador .valor { font-size: 1.9rem; letter-spacing: -.02em; line-height: 1.1; }
.indicador .rotulo { margin-top: 4px; }
.indicador .icone-indicador { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; margin-bottom: 10px;
  background: var(--primaria-leve); color: var(--primaria); }
.indicador.destaque { background: linear-gradient(135deg, #0f766e, #115e59); color: #fff; border: 0; }
.indicador.destaque .rotulo, .indicador.destaque .suave { color: #ccfbf1; }
.indicador.destaque .icone-indicador { background: rgba(255,255,255,.15); color: #fff; }

/* estado vazio */
.estado-vazio { text-align: center; padding: 36px 20px; }
.estado-vazio-icone { width: 60px; height: 60px; margin: 0 auto 12px; border-radius: 16px; display: grid; place-items: center;
  background: var(--primaria-leve); color: var(--primaria); }
.estado-vazio-texto { font-weight: 600; margin: 0 0 6px; }
.estado-vazio .suave { max-width: 420px; margin: 0 auto 14px; }

/* primeiros passos */
.onboarding { border: 1px solid var(--primaria); background: linear-gradient(180deg, var(--primaria-leve), var(--card) 60%); }
.onboarding-topo { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.progresso { flex: 1; min-width: 160px; max-width: 280px; height: 8px; background: var(--borda); border-radius: 999px; overflow: hidden; }
.progresso span { display: block; height: 100%; background: var(--primaria); border-radius: 999px; }
.passos { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.passos li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: var(--card); border: 1px solid var(--borda); }
.passos .marcador { width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--borda-forte); display: grid; place-items: center; flex: none; color: transparent; }
.passos li.feito .marcador { background: var(--primaria); border-color: var(--primaria); color: var(--primaria-texto); }
.passos li.feito .passo-texto { color: var(--suave); text-decoration: line-through; }
.passos .passo-texto { flex: 1; }
.passos .passo-texto small { display: block; color: var(--suave); text-decoration: none; }
.passos li.atual { border-color: var(--primaria); box-shadow: 0 0 0 3px var(--primaria-leve); }

/* gráficos de barras */
.barras { display: grid; gap: 10px; }
.barra-linha { display: grid; grid-template-columns: minmax(90px, 1fr) 2fr auto; gap: 10px; align-items: center; font-size: .88rem; }
.barra-linha .nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.barra-linha .trilho { height: 10px; background: var(--bg); border-radius: 999px; overflow: hidden; }
.barra-linha .trilho span { display: block; height: 100%; background: var(--primaria); border-radius: 999px; }
.barra-linha .valor { font-weight: 600; white-space: nowrap; text-align: right; }
.grade-3 { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* análise dos compradores */
.trilho-mini { height: 4px; background: var(--bg); border-radius: 999px; margin-top: 6px; max-width: 160px; overflow: hidden; }
.trilho-mini span { display: block; height: 100%; background: var(--primaria); }
.alerta-num { color: var(--erro); font-weight: 700; }
table.analise td, table.analise th { white-space: nowrap; }

/* regra de marca no item */
details.regra-marca { margin-top: 4px; }
details.regra-marca > summary { cursor: pointer; list-style: none; display: inline-block; }
details.regra-marca > summary::-webkit-details-marker { display: none; }
details.regra-marca form { margin-top: 6px; }
.badge.similar { background: #ede9fe; color: #5b21b6; border-color: transparent; }
.badge.parcial { background: var(--aviso-bg); color: var(--aviso); border-color: transparent; }
@media (prefers-color-scheme: dark) { .badge.similar { background: #2e1065; color: #c4b5fd; } }

/* busca */
.busca-topo { margin: 0 0 0 auto; flex: 0 1 200px; min-width: 120px; transition: flex-basis .2s; }
.busca-topo:focus-within { flex-basis: 260px; }
.busca-topo input { width: 100%; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); color: #e2e8f0; padding: 7px 12px; border-radius: 999px; }
.busca-topo input::placeholder { color: #94a3b8; }
.busca-topo input:focus { background: rgba(255,255,255,.14); }
.busca-topo + .usuario { margin-left: 12px; }
.busca-folha { padding: 6px 6px 8px; margin: 0; }
@media (max-width: 860px) { .busca-topo { display: none; } .busca-topo + .usuario { margin-left: auto; } }
details.avaliar summary { cursor: pointer; color: var(--primaria); font-weight: 600; font-size: .88rem; }
details.avaliar form { margin-top: 8px; }
tr.linha-avaliacao td { background: var(--bg); }

/* largura maior em telas grandes */
@media (min-width: 1440px) { .topo-dentro, main.conteudo { max-width: 1320px; } }

.alerta.info { background: var(--info-bg); color: var(--texto); border-left: 4px solid var(--info); }

/* resumo da cotação */
.resumo-cotacao { display: flex; flex-wrap: wrap; gap: 0; background: var(--card); border: 1px solid var(--borda); border-radius: var(--raio); margin: 0 0 14px; box-shadow: var(--sombra); }
.resumo-cotacao > div { flex: 1 1 110px; padding: 10px 16px; display: grid; border-left: 1px solid var(--borda); }
.resumo-cotacao > div:first-child { border-left: 0; }
.resumo-cotacao strong { font-size: 1.15rem; line-height: 1.2; }
.resumo-cotacao span { color: var(--suave); font-size: .8rem; }
@media (max-width: 640px) { .resumo-cotacao > div { flex-basis: 33%; padding: 8px 12px; } .resumo-cotacao > div:nth-child(4) { border-left: 0; } }

/* login com identidade */
.tela-login.dividida { display: grid; grid-template-columns: minmax(340px, 44%) 1fr; padding: 0; place-items: stretch; }
.login-marca { background: linear-gradient(155deg, #0f172a 0%, #134e4a 70%, #0f766e 100%); color: #e2e8f0; padding: 40px 48px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.login-marca-topo { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.2rem; color: #fff; }
.login-marca h2 { font-size: 1.7rem; line-height: 1.25; color: #fff; margin: 0 0 22px; max-width: 460px; }
.login-marca ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; }
.login-marca li { display: flex; gap: 10px; align-items: center; color: #cbd5e1; }
.login-marca li svg { color: #5eead4; flex: none; }
.login-marca-rodape { font-size: .8rem; color: #94a3b8; }
.login-form { display: grid; place-items: center; padding: 24px 16px; }
@media (max-width: 860px) {
  .tela-login.dividida { grid-template-columns: 1fr; }
  .login-marca { padding: 18px 20px; }
  .login-marca > div:nth-child(2), .login-marca-rodape { display: none; }
}
/* topo: abre espaço para a busca em telas médias */
@media (min-width: 861px) { .topo-dentro { gap: 14px; } .busca-topo { flex-basis: 170px; } }
@media (min-width: 861px) and (max-width: 1519px) { .nav a .icone { display: none; } .nav a { padding: 7px 9px; } }

/* ajuda */
.ajuda-cards { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.ajuda-cards .card, .ajuda-destaque { display: grid; gap: 4px; margin: 0; color: var(--texto); text-decoration: none; transition: border-color .15s; }
.ajuda-cards .card:hover, .ajuda-destaque:hover { border-color: var(--primaria); }
.ajuda-destaque { grid-template-columns: auto 1fr; align-items: center; gap: 14px; margin-bottom: 8px; border-left: 4px solid var(--primaria); }
.ajuda-destaque > span:last-child { display: grid; gap: 2px; }
.ajuda-icone { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: var(--primaria-leve); color: var(--primaria); }
.ajuda-grupo { margin: 22px 0 10px; font-size: .95rem; color: var(--suave); text-transform: uppercase; letter-spacing: .04em; }
.ajuda-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 24px; align-items: start; }
.ajuda-lateral { position: sticky; top: 76px; display: grid; gap: 18px; max-height: calc(100vh - 96px); overflow: auto; font-size: .88rem; }
.ajuda-lateral ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.ajuda-lateral a { display: block; padding: 5px 10px; border-radius: 8px; color: var(--suave); text-decoration: none; }
.ajuda-lateral a:hover { background: var(--card); color: var(--texto); }
.ajuda-lateral a.atual { background: var(--primaria-leve); color: var(--primaria); font-weight: 600; }
.ajuda-lateral-titulo { font-weight: 700; font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; color: var(--suave); padding: 0 10px 6px; }
.ajuda-navega { display: flex; justify-content: space-between; gap: 12px; margin-top: 32px; padding-top: 16px; border-top: 1px solid var(--borda); }
.ajuda-navega a { font-weight: 600; }
@media (max-width: 900px) { .ajuda-layout { grid-template-columns: 1fr; } .ajuda-lateral { position: static; max-height: none; }
  .ajuda-lateral nav:last-child { display: none; } }
.marca-publica { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }

/* texto dos manuais */
.doc { background: var(--card); border: 1px solid var(--borda); border-radius: var(--raio); padding: 24px 28px; line-height: 1.65; font-size: .97rem; min-width: 0; }
.doc h2 { font-size: 1.25rem; margin: 30px 0 10px; padding-top: 8px; scroll-margin-top: 80px; }
.doc h2:first-child { margin-top: 0; }
.doc h3 { font-size: 1.05rem; margin: 22px 0 8px; scroll-margin-top: 80px; }
.doc p, .doc ul, .doc ol { margin: 0 0 12px; }
.doc li { margin-bottom: 4px; }
.doc ol > li::marker { font-weight: 700; color: var(--primaria); }
.doc blockquote { margin: 14px 0; padding: 10px 14px; background: var(--primaria-leve); border-left: 4px solid var(--primaria); border-radius: 8px; }
.doc blockquote p:last-child { margin-bottom: 0; }
.doc code { background: var(--bg); border: 1px solid var(--borda); border-radius: 5px; padding: 1px 5px; font-size: .88em; }
.doc pre { background: var(--topo); color: #e2e8f0; padding: 12px 14px; border-radius: 8px; overflow-x: auto; font-size: .85rem; line-height: 1.5; }
.doc pre code { background: none; border: 0; padding: 0; color: inherit; }
.doc table { border-collapse: collapse; width: 100%; margin: 0 0 14px; font-size: .9rem; display: block; overflow-x: auto; }
.doc th, .doc td { border: 1px solid var(--borda); padding: 7px 10px; text-align: left; vertical-align: top; }
.doc th { background: var(--bg); }
.doc hr { border: 0; border-top: 1px solid var(--borda); margin: 24px 0; }
@media (max-width: 640px) { .doc { padding: 16px; } }

/* versão para imprimir / PDF */
body.impressao { background: #fff; color: #111827; max-width: 860px; margin: 0 auto; padding: 0 16px 40px; }
.barra-impressao { position: sticky; top: 0; display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap;
  background: #f3f4f6; border-bottom: 1px solid #e5e7eb; padding: 10px 16px; margin: 0 -16px 24px; font-size: .9rem; z-index: 2; }
.impressao .capa { padding: 40px 0 24px; border-bottom: 2px solid #0f766e; margin-bottom: 24px; }
.capa-marca { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.2rem; margin-bottom: 40px; }
.impressao .capa h1 { font-size: 2rem; margin: 0 0 8px; }
.capa-indice { margin-top: 28px; line-height: 1.9; }
.impressao .doc { border: 0; padding: 0; background: none; }
.impressao .doc.parte > h1 { font-size: 1.6rem; margin: 0 0 4px; color: #0f766e; }
.impressao .doc blockquote { background: #f0fdfa; }
.impressao .doc pre { background: #f3f4f6; color: #111827; border: 1px solid #e5e7eb; white-space: pre-wrap; }
.impressao .doc table { display: table; }
.impressao .parte + .parte { margin-top: 40px; }
@media print {
  .barra-impressao { display: none; }
  body.impressao { max-width: none; padding: 0; font-size: 11pt; }
  .impressao .capa { min-height: 85vh; }
  .impressao .parte { break-before: page; }
  .impressao .doc h2, .impressao .doc h3 { break-after: avoid; }
  .impressao .doc table, .impressao .doc pre, .impressao .doc blockquote { break-inside: avoid; }
  .impressao a { color: inherit; text-decoration: none; }
  @page { margin: 16mm 14mm; }
}
/* a versão de impressão é sempre clara, mesmo no modo escuro */
body.impressao { --bg: #f3f4f6; --card: #fff; --texto: #111827; --suave: #6b7280; --borda: #e5e7eb; --borda-forte: #d1d5db;
  --primaria: #0f766e; --primaria-leve: #ccfbf1; --topo: #0f172a; }