/* Castellani Health — identidade visual (proposta aprovada em 16/10/2026) */
@font-face { font-family: "Manrope"; src: url(fonts/Manrope.woff) format("woff"); font-weight: 200 800; font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url(fonts/CormorantGaramond.woff) format("woff"); font-weight: 500 600; font-display: swap; }

:root {
  --surface: #FAF7F2;
  --surface-raised: #FFFDF9;
  --nude: #EADBCC;
  --champagne: #D4BE93;
  --brown: #5B3F2C;
  --ink: #2E2119;
  --ink-muted: #6F5F53;
  --line: #E5DACE;
  --action: #5B3F2C;
  --on-action: #FAF7F2;
  --on-brown: #FAF7F2;
  --on-champagne: #2E2119;
  --border-control: #6F5F53;
  --focus-ring: #5B3F2C;
  --good: #3F6B4A;
  --warning: #8A5A12;
  --critical: #9A3A2C;
  --overlay: rgba(46, 33, 25, .38);

  --font-display: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-sans: "Manrope", "Helvetica Neue", Arial, sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-6: 24px; --space-8: 32px;
  --radius-sm: 4px; --radius-md: 10px; --radius-pill: 999px;
  --sidebar: 236px;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --surface: #1B1512; --surface-raised: #251D18; --nude: #4A3A30; --champagne: #CDB284; --brown: #7A5640;
    --ink: #F3ECE3; --ink-muted: #B9A999; --line: #3A2E27; --action: #CDB284; --on-action: #1B1512;
    --on-brown: #F3ECE3; --on-champagne: #1B1512; --border-control: #B9A999; --focus-ring: #CDB284;
    --good: #93BE9C; --warning: #E0B062; --critical: #EE9A88; --overlay: rgba(0, 0, 0, .55);
    color-scheme: dark;
  }
}
:root[data-tema="escuro"] {
  --surface: #1B1512; --surface-raised: #251D18; --nude: #4A3A30; --champagne: #CDB284; --brown: #7A5640;
  --ink: #F3ECE3; --ink-muted: #B9A999; --line: #3A2E27; --action: #CDB284; --on-action: #1B1512;
  --on-brown: #F3ECE3; --on-champagne: #1B1512; --border-control: #B9A999; --focus-ring: #CDB284;
  --good: #93BE9C; --warning: #E0B062; --critical: #EE9A88; --overlay: rgba(0, 0, 0, .55);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--surface); color: var(--ink);
  font: 400 15px/22px var(--font-sans);
  -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%;
}
#raiz { min-height: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.tabular { font-variant-numeric: tabular-nums; }
.carregando-inicial { display: grid; place-items: center; min-height: 100vh; font: 500 32px var(--font-display); color: var(--ink-muted); }

/* Tipografia */
.display { font: 500 40px/44px var(--font-display); margin: 0; letter-spacing: -.01em; text-wrap: balance; }
.titulo { font: 500 28px/34px var(--font-display); margin: 0; text-wrap: balance; }
.cabecalho { font: 600 17px/24px var(--font-sans); margin: 0; }
.legenda { font: 400 13px/18px var(--font-sans); color: var(--ink-muted); }
.rotulo { font: 600 12px/16px var(--font-sans); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-muted); }
.valor-grande { font: 600 28px/32px var(--font-sans); font-variant-numeric: tabular-nums; }
.suave { color: var(--ink-muted); }

/* Estrutura */
.app { display: grid; grid-template-columns: var(--sidebar) 1fr; min-height: 100vh; }
.lateral {
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
  border-right: 1px solid var(--line); background: var(--surface);
  padding: calc(var(--space-6) + env(safe-area-inset-top, 0px)) var(--space-4) var(--space-6) max(var(--space-4), env(safe-area-inset-left, 0px));
  display: flex; flex-direction: column; gap: var(--space-6);
}
.marca { font: 500 26px/28px var(--font-display); padding: 0 var(--space-2); }
.marca small { display: block; font: 400 12px/16px var(--font-sans); color: var(--ink-muted); margin-top: var(--space-1); }
.menu { display: flex; flex-direction: column; gap: 2px; }
.menu a {
  display: flex; align-items: center; gap: var(--space-3); padding: 9px var(--space-3); border-radius: var(--radius-md);
  text-decoration: none; color: var(--ink-muted); font-weight: 500;
}
.menu a:hover { background: var(--surface-raised); color: var(--ink); }
.menu a.ativo { background: var(--nude); color: var(--ink); font-weight: 600; }
.menu .grupo { margin: var(--space-4) var(--space-3) var(--space-1); }
.menu svg { width: 18px; height: 18px; flex: none; }
.conta-lateral { margin-top: auto; border-top: 1px solid var(--line); padding-top: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); }
.conta-lateral .nome { font-weight: 600; }

.principal { min-width: 0; padding: calc(var(--space-8) + env(safe-area-inset-top, 0px)) max(var(--space-8), env(safe-area-inset-right, 0px)) var(--space-8) var(--space-8); }
.conteudo { max-width: 1180px; margin: 0 auto; display: flex; flex-direction: column; gap: var(--space-6); }
.topo-pagina { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-4); }
.topo-pagina .acoes { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.voltar { display: inline-flex; align-items: center; gap: var(--space-1); color: var(--ink-muted); text-decoration: none; font-size: 13px; margin-bottom: var(--space-2); }
.voltar:hover { color: var(--ink); }

.barra-movel { display: none; }
.faixa-teste {
  background: var(--champagne); color: var(--on-champagne); text-align: center;
  font: 600 12px/16px var(--font-sans); padding: 6px max(16px, env(safe-area-inset-right, 0px)) 6px max(16px, env(safe-area-inset-left, 0px));
  letter-spacing: .02em;
}

@media (max-width: 1023px) {
  .app { grid-template-columns: 1fr; }
  .lateral {
    position: fixed; inset: 0 auto 0 0; width: min(300px, 86vw); z-index: 40; transform: translateX(-102%);
    transition: transform .2s ease; background: var(--surface); box-shadow: none;
  }
  .lateral.aberta { transform: none; }
  .veu { position: fixed; inset: 0; background: var(--overlay); z-index: 30; }
  .barra-movel {
    display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
    position: sticky; top: 0; z-index: 20; background: var(--surface); border-bottom: 1px solid var(--line);
    padding: calc(var(--space-3) + env(safe-area-inset-top, 0px)) max(var(--space-4), env(safe-area-inset-right, 0px)) var(--space-3) max(var(--space-4), env(safe-area-inset-left, 0px));
  }
  .barra-movel .marca { font-size: 22px; padding: 0; }
  .principal { padding: var(--space-6) max(var(--space-4), env(safe-area-inset-right, 0px)) var(--space-8) max(var(--space-4), env(safe-area-inset-left, 0px)); }
  .display { font-size: 32px; line-height: 36px; }
}
@media (prefers-reduced-motion: reduce) { .lateral { transition: none; } }

/* Botões */
.botao {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  height: 40px; padding: 0 18px; border-radius: var(--radius-md); border: 1px solid transparent;
  font: 600 14px/20px var(--font-sans); cursor: pointer; text-decoration: none; white-space: nowrap;
  background: transparent; color: var(--ink);
}
.botao:disabled { opacity: .55; cursor: not-allowed; }
.botao.principal-acao { background: var(--action); color: var(--on-action); }
.botao.secundario { border-color: var(--border-control); }
.botao.secundario:hover:not(:disabled), .botao.discreto:hover:not(:disabled) { background: var(--nude); }
.botao.discreto { color: var(--ink-muted); padding: 0 12px; }
.botao.perigo { color: var(--critical); border-color: var(--critical); }
.botao.pequeno { height: 32px; padding: 0 12px; font-size: 13px; }
.botao.icone { width: 40px; padding: 0; }
.botao svg { width: 18px; height: 18px; }

/* Cartões e seções */
.cartao { background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); padding: var(--space-4); min-width: 0; }
.cartao.amplo { padding: var(--space-6); }
.cartao > .cabecalho + * { margin-top: var(--space-3); }
.grade-indicadores { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: var(--space-4); }
.indicador { display: flex; flex-direction: column; gap: var(--space-1); text-decoration: none; }
a.indicador:hover { border-color: var(--border-control); }
.duas-colunas { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--space-6); align-items: start; }
@media (max-width: 900px) { .duas-colunas { grid-template-columns: 1fr; } }

/* Formulários */
.formulario { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-4); }
.formulario .inteiro { grid-column: 1 / -1; }
.campo { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.campo label, .campo .rotulo-campo { font: 600 13px/18px var(--font-sans); color: var(--ink); }
.campo .ajuda { font-size: 12px; line-height: 16px; color: var(--ink-muted); }
.entrada, select.entrada, textarea.entrada {
  width: 100%; min-height: 42px; padding: 9px 12px; border: 1px solid var(--border-control); border-radius: var(--radius-md);
  background: var(--surface-raised); color: var(--ink); font-size: 16px; line-height: 22px;
}
textarea.entrada { min-height: 88px; resize: vertical; }
.entrada::placeholder { color: var(--ink-muted); opacity: .8; }
.entrada:focus { outline: 2px solid var(--focus-ring); outline-offset: 1px; }
.erro-campo { color: var(--critical); font-size: 13px; }
.linha-acoes { display: flex; flex-wrap: wrap; gap: var(--space-2); justify-content: flex-end; }
.marcador { display: flex; gap: var(--space-2); align-items: flex-start; cursor: pointer; }
.marcador input { width: 20px; height: 20px; accent-color: var(--action); margin-top: 1px; flex: none; }

/* Chave liga/desliga */
.chave { position: relative; display: inline-flex; width: 44px; height: 26px; flex: none; }
.chave input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; margin: 0; z-index: 1; }
.chave span { position: absolute; inset: 0; pointer-events: none; border-radius: var(--radius-pill); background: var(--line); border: 1px solid var(--border-control); transition: background .15s; }
.chave span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--surface-raised); border: 1px solid var(--border-control); transition: transform .15s; }
.chave input:checked + span { background: var(--action); border-color: var(--action); }
.chave input:checked + span::after { transform: translateX(18px); border-color: var(--action); }
.chave input:focus-visible + span { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.chave input:disabled + span { opacity: .5; }

/* Tabelas e listas */
.tabela-rolagem { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); }
table.tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabela th { text-align: left; font: 600 12px/16px var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); padding: 12px var(--space-4); border-bottom: 1px solid var(--line); white-space: nowrap; }
.tabela td { padding: 12px var(--space-4); border-bottom: 1px solid var(--line); vertical-align: middle; }
.tabela tr:last-child td { border-bottom: 0; }
.tabela tbody tr.clicavel { cursor: pointer; }
.tabela tbody tr.clicavel:hover td { background: var(--surface); }
.tabela .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabela .nome-principal { font-weight: 600; }
.lista-cartoes { display: none; flex-direction: column; gap: var(--space-2); }
.item-cartao { display: flex; flex-direction: column; gap: 6px; text-decoration: none; }
.item-cartao .linha { display: flex; justify-content: space-between; gap: var(--space-2); align-items: center; }
@media (max-width: 720px) {
  .so-largo { display: none !important; }
  .lista-cartoes { display: flex; }
}
@media (min-width: 721px) { .so-estreito { display: none !important; } }

/* Etiquetas e estados */
.etiqueta { display: inline-flex; align-items: center; font: 600 12px/16px var(--font-sans); letter-spacing: .03em; padding: 3px 9px; border-radius: var(--radius-sm); border: 1px solid transparent; white-space: nowrap; }
.prio-A1 { background: var(--brown); color: var(--on-brown); }
.prio-A2 { background: var(--champagne); color: var(--on-champagne); }
.prio-B { background: var(--nude); color: var(--ink); }
.prio-C, .prio-D { border-color: var(--border-control); color: var(--ink); }
.prio-E { border: 1px dashed var(--border-control); color: var(--ink); }
.prio-V { border-color: var(--warning); color: var(--warning); }
.prio-N { color: var(--ink-muted); border-color: var(--line); }
.prio-Lead { background: var(--good); color: #fff; border-color: var(--good); }
.estado { display: inline-flex; align-items: center; gap: 6px; font: 600 13px/18px var(--font-sans); }
.estado::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.estado.bom { color: var(--good); } .estado.atencao { color: var(--warning); } .estado.critico { color: var(--critical); } .estado.neutro { color: var(--ink-muted); }
.selo { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: var(--radius-pill); border: 1px solid var(--line); background: var(--surface); font-size: 12px; font-weight: 600; color: var(--ink-muted); white-space: nowrap; }

/* Filtros e abas */
.filtros { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.filtros .entrada { width: auto; min-width: 0; }
.busca { flex: 1 1 260px; }
.chips { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.chip { height: 32px; padding: 0 12px; border-radius: var(--radius-pill); border: 1px solid var(--line); background: var(--surface-raised); font-size: 13px; font-weight: 600; color: var(--ink-muted); cursor: pointer; display: inline-flex; align-items: center; gap: 6px; }
.chip[aria-pressed="true"] { background: var(--nude); color: var(--ink); border-color: var(--nude); }
.chip .contagem { font-variant-numeric: tabular-nums; font-weight: 500; }
.abas { display: flex; gap: var(--space-1); border-bottom: 1px solid var(--line); overflow-x: auto; }
.abas button { background: none; border: 0; border-bottom: 2px solid transparent; padding: 10px 12px; font-weight: 600; color: var(--ink-muted); cursor: pointer; white-space: nowrap; }
.abas button[aria-selected="true"] { color: var(--ink); border-bottom-color: var(--action); }

/* Ficha */
.dados { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--space-4) var(--space-6); margin: 0; }
.dados div { min-width: 0; }
.dados dt { font: 600 12px/16px var(--font-sans); letter-spacing: .06em; text-transform: uppercase; color: var(--ink-muted); margin-bottom: 4px; }
.dados dd { margin: 0; overflow-wrap: anywhere; }
.orcamento { display: flex; flex-direction: column; gap: var(--space-3); }
.orcamento + .orcamento { border-top: 1px solid var(--line); padding-top: var(--space-4); margin-top: var(--space-4); }
.orcamento .cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); align-items: baseline; }
.itens { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.itens li { display: flex; justify-content: space-between; gap: var(--space-3); }
.linha-tempo { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.linha-tempo li { padding: var(--space-3) 0; border-bottom: 1px solid var(--line); display: flex; flex-direction: column; gap: 4px; }
.linha-tempo li:last-child { border-bottom: 0; }
.mudanca { font-size: 13px; color: var(--ink-muted); overflow-wrap: anywhere; }
.mudanca b { color: var(--ink); font-weight: 600; }

/* Permissões */
.permissao { display: grid; grid-template-columns: 1fr auto; gap: var(--space-3); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
.permissao:last-child { border-bottom: 0; }
.permissao .origem { font-size: 12px; color: var(--ink-muted); }
.permissao .origem.ajustada { color: var(--warning); font-weight: 600; }
.seletor-tres { display: inline-flex; border: 1px solid var(--border-control); border-radius: var(--radius-md); overflow: hidden; }
.seletor-tres button { border: 0; background: transparent; padding: 6px 10px; font-size: 13px; font-weight: 600; color: var(--ink-muted); cursor: pointer; min-height: 34px; }
.seletor-tres button + button { border-left: 1px solid var(--line); }
.seletor-tres button[aria-pressed="true"] { background: var(--action); color: var(--on-action); }
.matriz td, .matriz th { text-align: center; }
.matriz td:first-child, .matriz th:first-child { text-align: left; }

/* Janela */
.janela-fundo { position: fixed; inset: 0; background: var(--overlay); z-index: 50; display: grid; place-items: center; padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); }
.janela { width: min(720px, 100%); max-height: calc(100vh - 32px); overflow-y: auto; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-md); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); }
.janela.estreita { width: min(460px, 100%); }
.janela .cab-janela { display: flex; justify-content: space-between; gap: var(--space-4); align-items: flex-start; }
@media (max-width: 600px) { .janela { padding: var(--space-4); } }

/* Avisos */
.aviso { border-radius: var(--radius-md); padding: var(--space-3) var(--space-4); border: 1px solid var(--line); background: var(--surface-raised); font-size: 14px; }
.aviso.erro { border-color: var(--critical); color: var(--critical); }
.aviso.atencao { border-color: var(--warning); color: var(--ink); }
.aviso.sucesso { border-color: var(--good); }
.toasts { position: fixed; z-index: 60; bottom: max(16px, env(safe-area-inset-bottom, 0px)); right: max(16px, env(safe-area-inset-right, 0px)); display: flex; flex-direction: column; gap: var(--space-2); max-width: min(380px, calc(100vw - 32px)); }
.toast { background: var(--ink); color: var(--surface); border-radius: var(--radius-md); padding: 12px 16px; font-size: 14px; font-weight: 500; }
.toast.erro { background: var(--critical); color: #FFFDF9; }
.vazio { text-align: center; padding: var(--space-8) var(--space-4); color: var(--ink-muted); display: flex; flex-direction: column; gap: var(--space-2); align-items: center; }
.carregando { color: var(--ink-muted); padding: var(--space-6) 0; }
.paginacao { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); flex-wrap: wrap; }

/* Telas de acesso */
.acesso { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.acesso .arte { background: var(--surface); position: relative; overflow: hidden; border-right: 1px solid var(--line); }
.acesso .arte svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.acesso .lado { display: flex; align-items: center; justify-content: center; padding: var(--space-8) max(var(--space-6), env(safe-area-inset-right, 0px)) var(--space-8) max(var(--space-6), env(safe-area-inset-left, 0px)); }
.acesso .caixa { width: min(400px, 100%); display: flex; flex-direction: column; gap: var(--space-6); }
.acesso form { display: flex; flex-direction: column; gap: var(--space-4); }
.acesso .links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-2); font-size: 14px; }
.acesso .links a { color: var(--ink-muted); }
.qr { background: #FFFDF9; padding: var(--space-3); border-radius: var(--radius-md); border: 1px solid var(--line); width: 200px; height: 200px; align-self: center; }
.qr img { width: 100%; height: 100%; display: block; }
.segredo { font: 600 15px/22px var(--font-sans); letter-spacing: .08em; word-break: break-all; background: var(--surface-raised); border: 1px dashed var(--border-control); border-radius: var(--radius-md); padding: var(--space-3); text-align: center; }
@media (max-width: 860px) {
  .acesso { grid-template-columns: 1fr; }
  .acesso .arte { display: none; }
}
@media (max-width: 600px) {
  .item-orcamento { grid-template-columns: 70px 1fr 40px !important; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
  .item-orcamento > :nth-child(1), .item-orcamento > :nth-child(2) { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .filtros .entrada { flex: 1 1 100%; }
}

/* Etapa 2 — CRM */
.valor-grande .de { font-size: 18px; color: var(--ink-muted); font-family: var(--font-sans); font-weight: 500; }
.barra { height: 6px; border-radius: var(--radius-pill); background: var(--nude); overflow: hidden; margin-top: 6px; }
.barra > span { display: block; height: 100%; background: var(--action); border-radius: inherit; transition: width .3s; }
.grupo-hoje { display: flex; flex-direction: column; gap: var(--space-3); }
.cab-grupo { display: flex; align-items: baseline; gap: var(--space-3); flex-wrap: wrap; }
.cab-grupo .contagem { font-family: var(--font-sans); font-size: 14px; color: var(--ink-muted); font-weight: 600; margin-left: 4px; }
.lista-hoje { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.item-hoje { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4); }
.item-hoje-info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.item-hoje .linha { display: flex; align-items: center; gap: var(--space-2); flex-wrap: wrap; }
.item-hoje .nome-principal { text-decoration: none; }
.item-hoje .motivo { font-weight: 600; }
.item-hoje .motivo.atrasado { color: var(--warning); }
@media (max-width: 640px) { .item-hoje { flex-direction: column; align-items: stretch; } .item-hoje .botao { width: 100%; } }
.seletor-canal { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.bloco-mensagem { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); }
.grupo-opcoes { border: 0; padding: 0; margin: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.previsao { display: flex; flex-direction: column; gap: 4px; padding: var(--space-3) var(--space-4); border-left: 3px solid var(--champagne); background: var(--surface-raised); border-radius: var(--radius-sm); }
.texto-modelo { white-space: pre-wrap; margin: var(--space-2) 0; line-height: 1.55; }
.texto-modelo.pequeno { font-size: 14px; color: var(--ink-muted); margin: 0; }
.cartao.inativo { opacity: .6; }
.linha-tempo li.anulada > span:not(.estado), .linha-tempo li.anulada > div { text-decoration: line-through; color: var(--ink-muted); }
.funil { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.funil li { display: grid; grid-template-columns: minmax(110px, 160px) 1fr 48px 56px; align-items: center; gap: var(--space-3); }
.funil .trilho { height: 22px; background: var(--surface); border-radius: var(--radius-sm); overflow: hidden; border: 1px solid var(--line); }
.funil .trilho > span { display: block; height: 100%; background: var(--champagne); }
.funil li:first-child .trilho > span { background: var(--nude); }
@media (max-width: 560px) { .funil li { grid-template-columns: 1fr 44px 52px; } .funil .trilho { grid-column: 1 / -1; order: 3; } }
.meta-edicao { display: flex; gap: var(--space-2); margin-top: var(--space-2); }
.meta-edicao .entrada { width: 90px; }
.atingiu { color: var(--good); font-weight: 700; }
.tabela tr[aria-selected="true"] td { background: var(--surface-raised); font-weight: 600; }
.linha-discreta { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.marcador.confirmacao { padding: var(--space-3); border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface-raised); align-items: flex-start; }
.marcador.confirmacao.pendente { border-color: var(--champagne); }
.grupo-numeros { display: flex; flex-direction: column; margin-top: var(--space-3); }
.trabalho { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-6); margin-top: var(--space-3); }
.trabalho > div { display: flex; flex-direction: column; }
details.detalhada summary { cursor: pointer; }

/* Etapa 3 — vendas e financeiro */
.nova-venda { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: var(--space-6); align-items: start; }
.nova-venda .coluna-principal { display: flex; flex-direction: column; gap: var(--space-6); min-width: 0; }
.resumo-venda { position: sticky; top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-2); }
.resumo-venda .permissao.total, .comprovante .permissao.total { font-weight: 700; font-size: 17px; }
@media (max-width: 960px) { .nova-venda { grid-template-columns: 1fr; } .resumo-venda { position: static; } }
.itens-venda { display: flex; flex-direction: column; margin-top: var(--space-2); }
.item-venda { display: grid; grid-template-columns: minmax(0, 1fr) 72px 120px 110px 40px; gap: var(--space-2); align-items: center; padding: var(--space-2) 0; border-bottom: 1px solid var(--line); }
.item-venda .total { text-align: right; }
@media (max-width: 640px) { .item-venda { grid-template-columns: 1fr 64px 100px 40px; } .item-venda .total { display: none; } }
.entrada.qtd { width: 80px; } .entrada.valor { min-width: 0; }
.adicionar-itens { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-3); }
.linha-add { display: flex; gap: var(--space-2); align-items: center; }
.linha-add .entrada { flex: 1; min-width: 0; }
.orcamentos-escolha { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-3); }
.pagamento-linha { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
.pagamento-linha .entrada { width: auto; flex: 1 1 120px; min-width: 0; }
.pagamento-linha .dica { flex-basis: 100%; }
.cronograma { list-style: none; margin: 0 0 var(--space-2); padding: 0 0 0 var(--space-3); border-left: 2px solid var(--line); font-size: 13px; color: var(--ink-muted); }
.cronograma li { display: flex; justify-content: space-between; gap: var(--space-2); }
.conferencias { display: flex; flex-wrap: wrap; gap: var(--space-4); }
.tabela tr.riscado td { color: var(--ink-muted); text-decoration: line-through; }
.tabela tr.riscado td .estado, .tabela tr.riscado td .legenda { text-decoration: none; }
.comprovante { display: flex; flex-direction: column; gap: 2px; }
.cab-comprovante { display: flex; flex-direction: column; margin-bottom: var(--space-3); }
.cab-comprovante b { font-family: var(--font-display); font-size: 22px; font-weight: 500; }
@media print {
  body * { visibility: hidden; }
  .comprovante, .comprovante * { visibility: visible; }
  .comprovante { position: absolute; left: 0; top: 0; width: 100%; color: #000; }
  .nao-imprimir { display: none; }
}
.voltar { align-self: flex-start; } .voltar svg { width: 18px; height: 18px; flex: none; }
.item-venda.fora .nome, .item-venda.fora .total { color: var(--ink-muted); } .marcador.vender { display: inline-flex; margin-right: 6px; vertical-align: middle; } .tabela.condicoes .entrada { min-width: 64px; }
.orcamento .itens li.vendido > span:first-child { color: var(--ink-muted); }
.tabela input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--action); }

/* Etapa 4: painéis e metas */
.seletor-mes { display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: var(--radius-pill); padding: 2px 4px; background: var(--surface, transparent); }
.seletor-mes .mes-nome { min-width: 150px; text-align: center; font-weight: 600; }
.seletor-mes .mes-nome::first-letter { text-transform: uppercase; }
.seletor-mes .avancar svg { transform: rotate(180deg); }
.semaforo { font-size: 15px; }
.barra.bom > span { background: var(--good); } .barra.atencao > span { background: var(--warning); } .barra.critico > span { background: var(--critical); }
.barra.vendido > span { background: var(--action); } .barra.recebido > span { background: var(--good); } .barra.reconhecido > span { background: var(--warning); }
.numeros-linha { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 16px; }
.numeros-linha > div { display: flex; flex-direction: column; gap: 2px; }
.numeros-linha b { font: 600 20px/1.3 var(--font-sans); font-variant-numeric: tabular-nums; }
.colunas-iguais { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 16px; }
.colunas-iguais > .cartao { margin: 0; min-width: 0; }
.combinacoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 16px; margin-top: 12px; }
.combinacao { min-width: 0; }
.rolagem-x { overflow-x: auto; max-width: 100%; }
@media (max-width: 480px) { .grade-indicadores .valor-grande { font-size: 21px; line-height: 26px; } }
.combinacao { border: 1px solid var(--line); border-radius: var(--radius-md); padding: 14px; display: flex; flex-direction: column; gap: 6px; }
.combinacao .cab { display: flex; justify-content: space-between; font-size: 16px; }
.tabela.compacta td, .tabela.compacta th { padding: 8px 10px; }
.grafico { margin: 12px 0 0; }
.grafico svg { width: 100%; height: auto; display: block; }
.grafico .grade { stroke: var(--line); stroke-width: 1; }
.grafico .eixo { fill: var(--ink-muted); font: 11px var(--font-sans); }
.grafico polyline { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.grafico polyline.vendido { stroke: var(--action); }
.grafico polyline.esperado { stroke: var(--ink-muted); stroke-dasharray: 5 5; stroke-width: 1.5; }
.grafico figcaption { display: flex; gap: 16px; flex-wrap: wrap; font-size: 13px; color: var(--ink-muted); margin-top: 4px; }
.grafico .leg::before { content: ""; display: inline-block; width: 18px; height: 0; border-top: 2.5px solid var(--action); vertical-align: middle; margin-right: 6px; }
.grafico .leg.esperado::before { border-top: 1.5px dashed var(--ink-muted); }
.linha-crono { display: flex; gap: 10px; align-items: flex-end; flex-wrap: wrap; }
.combinacao-edicao { border: 1px solid var(--line); border-radius: var(--radius-md); padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.tabela.meses td .barra { max-width: 220px; }
.grade-indicadores.quatro { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.tabela.compacta { width: 100%; table-layout: fixed; }
.tabela.compacta th:first-child, .tabela.compacta td:first-child { width: 42%; overflow-wrap: anywhere; }
.tabela.compacta th { white-space: normal; }
@media (max-width: 480px) { .tabela.compacta td, .tabela.compacta th { padding: 8px 6px; font-size: 13px; } }

/* Leads do tráfego */
.funil-leads { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.funil-leads .etapa { background: var(--surface-raised); border: 1px solid var(--line); border-radius: var(--radius-md); padding: 12px; display: flex; flex-direction: column; gap: 2px; }
.funil-leads .etapa b { font: 600 24px/1.2 var(--font-sans); font-variant-numeric: tabular-nums; }
@media (max-width: 640px) { .funil-leads { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.caixa-lead { border-left: 3px solid var(--good); }
.tabela.compacta td { overflow-wrap: anywhere; } .tabela.compacta td .legenda { white-space: normal; }

/* Etapa 4B: oportunidades */
.funil-leads { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
.funil-op { grid-template-columns: repeat(8, minmax(0, 1fr)); }
@media (max-width: 1100px) { .funil-op { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 640px) { .funil-leads, .funil-op { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.temp-quente, .temp-morno, .temp-frio { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; border: 1px solid transparent; }
.temp-quente { color: var(--critical); border-color: var(--critical); }
.temp-morno { color: var(--warning); border-color: var(--warning); }
.temp-frio { color: var(--action); border-color: var(--action); }
.linha-selos { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
.marcos { list-style: none; padding: 0; margin: 12px 0 0; display: flex; flex-direction: column; gap: 6px; }
.marcos li { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); padding-bottom: 6px; font-variant-numeric: tabular-nums; }
a.selo { text-decoration: none; }
.seletor-tres.pequeno button { padding: 4px 10px; font-size: 13px; }

/* Etapa 4C: avaliações */
.caixa-regra { border: 1px solid var(--line); border-left: 3px solid var(--action); border-radius: var(--radius-md); background: var(--surface-raised); padding: 10px 12px; display: flex; flex-direction: column; gap: 4px; }
.seletor-vertical { display: flex; flex-direction: column; gap: 8px; }
.tabela.conf-meses { width: 100%; min-width: 700px; }
.tabela.conf-meses th, .tabela.conf-meses td { padding: 8px 8px; white-space: normal; }
.tabela.conf-meses th { font-size: 11px; }
.tabela.conf-meses td .legenda { white-space: normal; }