/* =========================================================
   styles.css — A APARÊNCIA do painel
   Cores OFICIAIS da Farmácia Divinópolis (extraídas do logo):
   coral #FF6646 · rosé #A95C5F · escuro #1d1512 · branco
   ========================================================= */

:root {
  /* ===== Marca terracota (PRIMÁRIA) — a cor do logo ===== */
  --brand-50:#FBF1EC; --brand-100:#F3E4DE; --brand-200:#E7C7BB; --brand-300:#D6A491;
  --brand-400:#C4826A; --brand-500:#B56B53; --brand-600:#9C5641; --brand-700:#7E4331;
  /* Coral — acento / chamada para ação (usar com parcimônia) */
  --accent-500:#FF6646; --accent-600:#E84F30;
  /* Neutros quentes */
  --bg:#FAF7F5; --surface:#FFFFFF; --surface-2:#F5F0EC; --border:#EBE3DE; --border-strong:#DDD2CA;
  --text:#2B2420; --text-2:#6B615C; --text-3:#9B908A;
  /* Estados semânticos (dessaturados, profissionais) */
  --success:#4E8D6E; --success-bg:#E8F1EC; --warning:#C98A2B; --warning-bg:#FBF0DC;
  --danger:#C6553F; --danger-bg:#F8E4DF; --info:#4A7A8C; --info-bg:#E6EFF2;
  /* Sombras "espresso" · raios · espaçamento base-8 */
  --shadow-sm:0 1px 2px rgba(43,36,32,.04),0 1px 3px rgba(43,36,32,.06);
  --shadow-md:0 4px 12px rgba(43,36,32,.08);
  --shadow-lg:0 12px 28px rgba(43,36,32,.12);
  --r-sm:8px; --r-md:12px; --r-lg:16px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:20px; --s6:24px; --s8:32px; --s10:40px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI Variable","Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;

  /* ===== Compatibilidade: nomes antigos remapeados p/ a paleta refinada =====
     (assim TODAS as telas já existentes herdam o visual novo sem reescrever cada regra) */
  --fundo: var(--bg);
  --cartao: var(--surface);
  --coral: var(--accent-500);
  --coral-escuro: var(--brand-700);   /* títulos/rótulos que eram coral agora são terracota (coesão) */
  --coral-claro: var(--brand-50);
  --rose: #a95c5f;
  --terracota: var(--brand-500);
  --terracota-escura: var(--brand-700);
  --escuro: var(--text);
  --texto: var(--text);
  --suave: var(--text-2);
  --borda: var(--border);
  --verde: var(--success);
  --amarelo: var(--warning);
  --vermelho: var(--danger);
  --raio: var(--r-md);
  --raio-pill: 999px;
  --fundo-suave: var(--surface-2);
  --sombra: var(--shadow-md);
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  margin: 0;
  background-color: var(--bg);
  font-family: var(--font);
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3 { letter-spacing: -0.01em; }

/* ---------- TOPO ---------- */
.topo { position: sticky; top: 0; z-index: 10; }
.logo { height: 50px; width: auto; display: block; }
.meta-ano {
  background: var(--terracota); color: #fff; font-weight: bold;
  font-size: 14px; padding: 5px 14px; border-radius: 20px;
}
.abas {
  background: var(--fundo); border-bottom: 1px solid var(--borda);
  display: flex; align-items: center; gap: 4px; padding: 10px 24px; flex-wrap: wrap;
}
.aba {
  border: none; background: transparent; color: var(--texto);
  padding: 7px 15px; border-radius: var(--raio-pill); cursor: pointer; font-size: 14px; transition: background .15s;
}
.aba:hover { background: var(--coral-claro); }
.aba.ativa { background: var(--coral); color: #fff; box-shadow: 0 2px 8px rgba(255, 102, 70, .35); }
.aba.desativada { color: #c7bcb7; cursor: default; }
/* Banner de "dados de exemplo" */
.banner-exemplo { background: #fff3cd; border: 1px solid #f0d98a; color: #7a5b00; border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 14px; }

/* (avatares do topo agora usam .topbar-avatares — a regra por ID antiga foi removida) */
.avatar {
  width: 34px; height: 34px; border-radius: 50%;
  border: 2px solid var(--borda); background: #fff;
  color: var(--coral-escuro); font-weight: bold; cursor: pointer;
}
.avatar.ativo { border-color: var(--coral); background: var(--coral); color: #fff; }

/* ---------- CONTEÚDO ---------- */
/* (#conteudo agora usa a classe .content do shell novo — regra por ID antiga removida) */
.bloco { margin-bottom: 26px; }
h2 { color: var(--escuro); font-size: 20px; margin: 0 0 14px; }
h3 { color: var(--escuro); font-size: 17px; margin: 0 0 10px; }
.card {
  text-align: left; background: var(--cartao); border: 1px solid var(--borda);
  border-radius: 12px; padding: 16px; cursor: pointer;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04); transition: transform 0.12s, box-shadow 0.12s;
  font: inherit; color: inherit;
}
.card:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(0,0,0,0.09); }

.semaforo { width: 18px; height: 18px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
.semaforo.verde { background: var(--verde); }
.semaforo.amarelo { background: var(--amarelo); }
.semaforo.vermelho { background: var(--vermelho); }

.trilha-mini { display: flex; align-items: center; margin-bottom: 12px; }
.passo {
  width: 26px; height: 26px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 11px;
  background: #f1e9e5; color: var(--suave); border: 1px solid var(--borda);
}
.passo.feito { background: var(--coral); color: #fff; border-color: var(--coral); }
.passo.atual { background: #fff; color: var(--coral-escuro); border: 2px solid var(--coral); font-weight: bold; }
.liga { flex: 1; height: 2px; background: var(--borda); }

/* ---------- AGENDA ---------- */
.agenda { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-bottom: 12px; }
.item-agenda { display: flex; align-items: center; gap: 6px; font-size: 14px; cursor: pointer; }
.item-agenda input { transform: scale(1.2); accent-color: var(--coral); }
.reunioes { font-size: 14px; color: var(--texto); display: flex; flex-direction: column; gap: 4px; }
.legenda { font-size: 13px; color: var(--suave); text-align: center; margin-top: 8px; }

/* ---------- FICHA DO LÍDER ---------- */
.voltar { border: none; background: none; color: var(--coral-escuro); cursor: pointer; font-size: 14px; padding: 0; margin-bottom: 14px; }
.perfil { background: var(--cartao); border: 1px solid var(--borda); border-radius: 12px; padding: 20px 22px; margin-bottom: 22px; }
.perfil h2 { margin: 0 0 14px; }
.perfil-area { color: var(--suave); font-weight: normal; font-size: 16px; }
.perfil-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; }
.rotulo { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--suave); margin-bottom: 2px; }
.foco { margin-top: 14px; }
.tag { display: inline-block; background: var(--coral-claro); color: var(--coral-escuro); border-radius: 14px; padding: 3px 12px; font-size: 13px; margin: 4px 6px 0 0; }

.trilha-grande { list-style: none; padding: 0; margin: 0; }
.etapa-linha { display: flex; align-items: center; gap: 10px; padding: 8px 10px; font-size: 15px; border-radius: 8px; }
.etapa-linha.clicavel { cursor: pointer; }
.etapa-linha.clicavel:hover { background: var(--coral-claro); }
.voltar-dica { font-size: 12px; color: var(--coral-escuro); margin-left: auto; opacity: 0; transition: opacity 0.15s; }
.etapa-linha.clicavel:hover .voltar-dica { opacity: 1; }
.bolinha {
  width: 28px; height: 28px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 12px; flex-shrink: 0;
  background: #f1e9e5; color: var(--suave); border: 1px solid var(--borda);
}
.etapa-linha.feita .bolinha { background: var(--coral); color: #fff; border-color: var(--coral); }
.etapa-linha.atual .bolinha { background: #fff; color: var(--coral-escuro); border: 2px solid var(--coral); font-weight: bold; }
.etapa-linha.atual { font-weight: bold; color: var(--escuro); }
.etapa-linha.futura { color: #c4b8b3; }

.bloco-11 {
  background: var(--cartao); border: 1px solid var(--borda); border-radius: 12px; padding: 16px 18px;
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px;
}

.etapa-atual { background: var(--cartao); border: 1px solid var(--borda); border-left: 5px solid var(--coral); border-radius: 12px; padding: 20px 22px; }
.etapa-cabeca { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.etapa-cabeca h3 { margin: 0; }
.etapa-badge { background: var(--coral); color: #fff; font-size: 12px; padding: 3px 10px; border-radius: 12px; }
.objetivo { margin: 4px 0 16px; }
.sub { font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; color: var(--coral-escuro); font-weight: bold; margin: 16px 0 6px; border-bottom: 1px solid var(--borda); padding-bottom: 4px; }
.check { display: flex; gap: 8px; align-items: flex-start; padding: 5px 0; cursor: pointer; line-height: 1.4; }
.check input { transform: scale(1.25); margin-top: 3px; accent-color: var(--coral); }
.pauta { margin: 4px 0; font-style: italic; color: #6a5d58; }

/* ---------- BOTÕES ---------- */
.acoes-etapa { display: flex; gap: 10px; margin-top: 20px; align-items: center; flex-wrap: wrap; }
.btn { font: inherit; border-radius: var(--raio); padding: 9px 20px; cursor: pointer; font-size: 14px; border: 1px solid var(--coral); }
.btn-cheio { background: var(--coral); color: #fff; }
.btn-claro { background: #fff; color: var(--coral-escuro); }
.btn-avancar { flex: 1; min-width: 240px; background: var(--coral); color: #fff; border-color: var(--coral); font-weight: bold; padding: 12px; }
.btn-avancar[disabled] { background: #efe6e2; color: #b6a8a3; border-color: var(--borda); cursor: not-allowed; }
.fim { flex: 1; text-align: center; font-weight: bold; color: var(--escuro); }

/* ---------- SELO "TUDO SALVO" ---------- */
.selo-salvo {
  position: fixed; bottom: 18px; right: 18px; background: var(--escuro); color: #fff;
  padding: 8px 16px; border-radius: 20px; font-size: 13px;
  opacity: 0; transform: translateY(8px); transition: opacity 0.25s, transform 0.25s; pointer-events: none;
}
.selo-salvo.visivel { opacity: 1; transform: translateY(0); }

@media (max-width: 560px) { .perfil-grid { grid-template-columns: 1fr; } }
.logo-simbolo { height: 56px; width: auto; display: block; }

/* Aba Ferramentas */
.card-ferr { background: var(--cartao); border: 1px solid var(--borda); border-radius: 12px; padding: 18px 20px; margin-bottom: 18px; }
.ajuda { font-size: 13px; color: var(--suave); margin: 4px 0 12px; line-height: 1.45; }
.campo { font: inherit; padding: 8px 10px; border: 1px solid var(--borda); border-radius: 8px; background: #fff; color: var(--texto); }
.campo:focus { outline: none; border-color: var(--coral); }
.campo-grande { font: inherit; font-size: 18px; padding: 12px 14px; border: 1px solid var(--borda); border-radius: 10px; width: 100%; max-width: 320px; background: #fff; color: var(--texto); }
.campo-grande:focus { outline: none; border-color: var(--coral); }

.fer-lideres { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.fer-lider { font: inherit; border: 1px solid var(--borda); background: #fff; color: var(--texto); padding: 7px 14px; border-radius: 20px; cursor: pointer; }
.fer-lider.ativo { background: var(--coral); color: #fff; border-color: var(--coral); }
.obj-titulo-input { font-size: 14px; }
.meta-obj-titulo-input { width: 100%; font-weight: bold; margin-bottom: 6px; }
.obj-titulo { font-size: 14px; }
.obj-modelo { display: block; font-size: 12px; color: var(--suave); }

.tabela-rolagem { overflow-x: auto; }
.tabela-alcada { width: 100%; border-collapse: collapse; font-size: 13px; min-width: 620px; }
.tabela-alcada th { text-align: left; color: var(--suave); font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; padding: 6px; border-bottom: 1px solid var(--borda); }
.tabela-alcada td { padding: 5px 6px; vertical-align: middle; }
.tabela-alcada .campo { width: 100%; }
.tabela-alcada tr.n-sozinho { background: #eef7f1; }
.tabela-alcada tr.n-comunica { background: #fff6e9; }
.tabela-alcada tr.n-aprovar { background: #fdeeec; }
.alc-del { border: none; background: none; color: var(--vermelho); cursor: pointer; font-size: 15px; }

/* Meta com cálculo por % de crescimento */
.meta-grade { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 8px; }
.meta-grade label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; color: var(--suave); }
.meta-grade .campo { font-size: 16px; min-width: 180px; }
.meta-resultado { background: var(--coral-claro); border-radius: 10px; padding: 12px 16px; margin: 6px 0 10px; color: var(--escuro); }
.meta-resultado strong { font-size: 18px; color: var(--coral-escuro); }
.meta-fixa { margin-top: 4px; }
.meta-fixa summary { cursor: pointer; color: var(--suave); font-size: 13px; }

/* ============ FASE 3: Régua + Linha do tempo ============ */
.regua-comp { padding: 12px 0; border-bottom: 1px solid var(--borda); }
.seg { flex: 1; height: 11px; border-radius: 3px; background: #eee3de; }

.linha-tempo { border-left: 2px solid var(--borda); padding-left: 16px; margin-left: 6px; }
.evento { position: relative; padding: 9px 0; }
.evento::before { content: ""; position: absolute; left: -23px; top: 13px; width: 10px; height: 10px; border-radius: 50%; background: var(--coral); border: 2px solid #fff; }
.evento-regua::before { background: var(--terracota); }
.evento-data { display: inline-block; font-size: 12px; color: var(--suave); width: 88px; }
.evento-texto { font-size: 14px; }

/* ============ LOTE 1: gráficos, heatmap, tarefas, impressão ============ */

/* Régua RH (barra única terracota) + radar + linha */
.seg.on { background: var(--terracota); }
.regua-corpo { display: flex; flex-wrap: wrap; gap: 18px; align-items: flex-start; margin-top: 8px; }
.radar-box { flex: 0 0 260px; }
/* Contêiner dos gráficos da biblioteca Chart.js (a altura vem por estilo inline) */
.grafico-box { position: relative; width: 100%; }
.grafico-box canvas { max-width: 100%; }
.regua-lista { flex: 1; min-width: 280px; }
.evolucao { margin-top: 14px; }
.linha-svg { width: 100%; max-width: 320px; height: auto; }
.grid-line { stroke: #eee3de; stroke-width: 1; }
.grid-label { font-size: 9px; fill: var(--suave); }
.linha-path { fill: none; stroke: var(--coral); stroke-width: 2.5; }
.linha-dot { fill: var(--coral); }

/* Mapa de calor da equipe */
.heatmap { display: grid; grid-template-columns: 120px repeat(6, minmax(28px, 1fr)); gap: 4px; max-width: 560px; margin-bottom: 8px; }
.hm-celula { height: 34px; display: flex; align-items: center; justify-content: center; font-size: 13px; border-radius: 5px; }
.hm-canto { background: transparent; }
.hm-head { background: #f1e9e5; color: var(--suave); font-weight: bold; }
.hm-nome { justify-content: flex-start; padding-left: 8px; cursor: pointer; color: var(--escuro); }
.hm-nome:hover { text-decoration: underline; }

/* Aba Tarefas */
.tarefa-auto { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-bottom: 1px solid var(--borda); }
.tarefa-icone { font-size: 18px; width: 24px; text-align: center; }
.tarefa-texto { flex: 1; font-size: 14px; }
.tarefa-ir { padding: 5px 14px; font-size: 13px; }
.nova-tarefa-linha { display: flex; gap: 8px; margin-bottom: 12px; }
.nova-tarefa-linha .campo { flex: 1; }
.tarefa-man { display: flex; align-items: center; gap: 8px; padding: 8px 0; border-bottom: 1px solid var(--borda); cursor: pointer; }
.tarefa-man span { flex: 1; font-size: 14px; }
.tarefa-man.feita span { text-decoration: line-through; color: var(--suave); }
.tarefa-man input { transform: scale(1.2); }

/* Topo da ficha (voltar + imprimir) */
.ficha-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 14px; }
.ficha-topo .voltar { margin-bottom: 0; }

/* Placar de Área */
.placar-num { max-width: 120px; }
.placar-badge { font-size: 13px; font-weight: bold; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.placar-badge.bom { background: #e6f4ec; color: #1f7a4d; }
.placar-badge.ruim { background: #fdeeec; color: var(--vermelho); }
.placar-badge.neutro { background: #f1e9e5; color: var(--suave); }

/* Pesquisa de Clareza */
.clareza-q { margin: 8px 0; }
.clareza-q label { display: block; font-size: 13px; color: var(--texto); margin-bottom: 4px; }
.clareza-q textarea { width: 100%; resize: vertical; }
.clareza-nota { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid var(--borda); }
.clareza-nota label { font-size: 13px; flex: 1; }
.nota-input { width: 84px; flex-shrink: 0; }
.trend-linha { display: flex; align-items: center; gap: 10px; margin: 6px 0; }
.trend-rotulo { width: 72px; font-size: 12px; color: var(--suave); }
.trend-barra { flex: 1; max-width: 320px; height: 14px; background: #f1e9e5; border-radius: 7px; overflow: hidden; }
.trend-preench { display: block; height: 100%; background: var(--coral); }
.trend-val { font-size: 13px; font-weight: bold; color: var(--coral-escuro); width: 36px; }

/* Impressão / PDF */
@page { margin: 14mm; }
@media print {
  .abas, #avatares, .selo-salvo, .btn, .voltar, .alc-del, .rh-only, .fer-lideres, .meta-ano, .ficha-abas, .banner-exemplo { display: none !important; }
  .topo { position: static; }
  body { background: #fff; }
  #conteudo { max-width: 100%; padding: 10px 0; }
  .card, .perfil, .etapa-atual, .card-ferr, .bloco { box-shadow: none; }
  .campo::placeholder, input::placeholder, textarea::placeholder { color: transparent !important; opacity: 0 !important; }
  .clareza-q textarea { min-height: 72px !important; }
  /* Não cortar blocos no meio entre páginas, e manter os fundos/cores coloridos */
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  .reu-bloco, .reu-card, .reu-grupo, .meta-area-bloco, .card, .perfil, .etapa-atual, .meta-obj, table, .reu-cards { break-inside: avoid; }
  h2, h3, .reu-cabecalho { break-after: avoid; }
}

/* ============ Meta do líder, gráfico mensal e modo apresentação ============ */

/* Meta da empresa + meta do líder na ficha */
.metas-ficha { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 22px; }
.meta-box { flex: 1; min-width: 240px; background: var(--coral-claro); border-radius: 12px; padding: 14px 18px; }
.meta-box .rotulo { margin-bottom: 6px; }
.meta-valor { font-size: 20px; font-weight: bold; color: var(--coral-escuro); }
.meta-lider-input { width: 100%; font-size: 16px; }

/* Ações da ficha + remover evento da linha do tempo */
.ficha-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.evento { display: flex; align-items: center; gap: 8px; }
.evento .evento-texto { flex: 1; }
.evento-del { opacity: 0.5; }
.evento-del:hover { opacity: 1; }

/* Modo apresentação */
#sair-apresentacao {
  display: none; position: fixed; top: 14px; right: 14px; z-index: 60;
  background: var(--escuro); color: #fff; border: none; border-radius: 20px;
  padding: 9px 18px; font: inherit; font-size: 14px; cursor: pointer;
}
body.apresentacao #sair-apresentacao { display: block; }
body.apresentacao .abas, body.apresentacao #avatares, body.apresentacao .selo-salvo,
body.apresentacao .voltar, body.apresentacao .alc-del, body.apresentacao .ficha-acoes,
body.apresentacao [data-regua-snap], body.apresentacao [data-placar-add],
body.apresentacao [data-alc-add], body.apresentacao .nova-tarefa-linha, body.apresentacao .ficha-abas { display: none !important; }
body.apresentacao { font-size: 17px; }
/* Apresentar também esconde o conteúdo só-do-RH (avaliação da Régua, mapa de calor) — não vaza p/ o líder */
body.apresentacao .rh-only { display: none !important; }

/* Evita o "zoom" automático do iPhone ao focar um campo (fonte < 16px) */
@media (max-width: 768px) { input, select, textarea { font-size: 16px !important; } }

/* Aviso de backup e roteiro "Comece por aqui" (aba Hoje) */
.aviso-backup { background: #fff3cd; border: 1px solid #e0c97a; color: #6b5a1e; border-radius: 10px; padding: 10px 14px; margin-bottom: 16px; font-size: 14px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.comece-aqui { border: 1px solid var(--coral); background: #fff7f4; }
.comece-lista { margin: 8px 0 0; padding-left: 22px; }
.comece-lista li { margin: 9px 0; }

/* 1:1 estruturado (pauta, combinados) */
.bloco-11-topo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.bloco-11-topo .btn-mini { margin-left: auto; }
.comb-pendentes { background: var(--fundo-suave); border: 1px solid var(--borda); border-radius: 8px; padding: 8px 12px; margin: 6px 0 10px; }
.comb-item { display: block; font-size: 14px; margin: 4px 0; }
.comb-linha { display: flex; gap: 8px; align-items: center; margin: 6px 0; }
.comb-texto { flex: 1; }
.comb-prazo { width: 150px; flex-shrink: 0; }
@media (max-width: 560px) { .comb-linha { flex-wrap: wrap; } .comb-prazo { width: 140px; } }

/* Diário de feedback e conquistas */
.reg-novo { display: flex; gap: 8px; margin: 6px 0; }
.reg-novo .campo { flex: 1; }
.reg-item { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-bottom: 1px solid var(--borda); }
.reg-data { font-size: 12px; color: var(--suave); width: 82px; flex-shrink: 0; }
.reg-texto { flex: 1; font-size: 14px; }

/* Semáforo das metas (prazo) */
.sem-badge { font-size: 11px; font-weight: bold; padding: 2px 9px; border-radius: 10px; white-space: nowrap; }
.sem-badge:empty { display: none; }
.sem-ok { background: #d8f0dd; color: #1f7a3d; }
.sem-ritmo { background: #fff3cd; color: #6b5a1e; }
.sem-risco { background: #ffe0c2; color: #9a5b1e; }
.sem-venc { background: #f8d7da; color: #a52834; }
.meta-leitura { font-size: 13px; color: var(--texto); margin: 4px 0 6px; }

/* Mapa de calor da Régua agora é clicável (avaliação numa tela só) */
.hm-val { cursor: pointer; color: #fff; font-weight: bold; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45); }
.hm-val:hover { outline: 2px solid var(--coral); outline-offset: -2px; }

/* Sub-abas da ficha do líder */
.ficha-abas { display: flex; gap: 6px; flex-wrap: wrap; margin: 14px 0; border-bottom: 2px solid var(--borda); }
.ficha-aba { font: inherit; font-size: 14px; border: none; background: none; cursor: pointer; padding: 8px 14px; color: var(--suave); border-bottom: 2px solid transparent; margin-bottom: -2px; border-radius: 8px 8px 0 0; }
.ficha-aba.ativa { color: var(--coral-escuro); border-bottom-color: var(--coral); font-weight: bold; }
.ficha-aba:hover { background: var(--fundo-suave); }

/* Trava de abertura (senha simples) */
#trava-senha { position: fixed; inset: 0; background: var(--terracota); display: flex; align-items: center; justify-content: center; z-index: 9999; }
.trava-caixa { background: #fff; padding: 28px 32px; border-radius: 14px; text-align: center; max-width: 320px; width: 90%; box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3); }
.trava-caixa h2 { margin: 0 0 6px; }
.trava-caixa .campo { width: 100%; margin: 12px 0; }
.trava-caixa .btn { width: 100%; }
.trava-erro { color: var(--vermelho); font-size: 13px; margin-top: 8px; }

/* Resumo para a diretoria */
.resumo-area { font-size: 12px; color: var(--suave); }
.resumo-atencao { margin: 6px 0 0; padding-left: 20px; }
.resumo-atencao li { margin: 5px 0; font-size: 14px; }
/* (apresentação usa body.apresentacao .content — regra por ID antiga removida) */
body.apresentacao select, body.apresentacao input, body.apresentacao textarea {
  pointer-events: none; background: transparent; border-color: transparent; color: var(--escuro);
  -webkit-appearance: none; appearance: none;
}

/* ============ Calendário de tarefas + aba Diretoria ============ */
.tarefa-man { cursor: default; flex-wrap: wrap; }
.tarefa-man input[type="checkbox"] { transform: scale(1.2); flex-shrink: 0; }
.tarefa-man input[type="date"] { transform: none; }
.tarefa-man-texto { flex: 1; font-size: 14px; min-width: 140px; }
.tarefa-man.feita .tarefa-man-texto { text-decoration: line-through; color: var(--suave); }
.tarefa-data-input { width: 150px; flex-shrink: 0; font-size: 13px; }
.tarefa-man.atrasada { background: #fdeeec; border-radius: 6px; padding-left: 6px; padding-right: 6px; }
.tarefa-man .badge-atrasada { background: var(--vermelho); color: #fff; font-size: 10px; padding: 1px 7px; border-radius: 8px; text-transform: uppercase; letter-spacing: 0.5px; }
.nova-tarefa-linha { flex-wrap: wrap; }
.nova-tarefa-data { max-width: 170px; }

.trend-grupo { margin-bottom: 12px; }
.trend-tri { font-size: 12px; color: var(--suave); font-weight: bold; margin-bottom: 2px; }
.trend-dir { background: var(--terracota); }

/* Configuração de líderes e áreas */
.config-lider { border: 1px solid var(--borda); border-radius: 10px; padding: 12px; margin-bottom: 10px; }
.config-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 8px; }
.config-grid .campo { width: 100%; }
.config-del { color: var(--vermelho); font-size: 13px; }
@media (max-width: 560px) { .config-grid { grid-template-columns: 1fr; } }

/* Substituição de líder */
.config-acoes { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.btn-mini { padding: 6px 13px; font-size: 13px; }
.sub-hist { font-size: 12px; color: var(--suave); margin: 2px 0 8px; }
.sub-form { margin-top: 10px; padding: 12px; background: var(--fundo-suave); border: 1px dashed var(--terracota); border-radius: 10px; }
.sub-form .campo { margin: 8px 0; max-width: 340px; width: 100%; }
.evento-substituicao::before { background: var(--coral-escuro); width: 12px; height: 12px; }
.evento-substituicao .evento-texto { font-weight: bold; color: var(--coral-escuro); }
.ocup-linha { display: flex; flex-wrap: wrap; gap: 14px; align-items: baseline; padding: 7px 0; border-bottom: 1px solid var(--borda); }
.ocup-nome { font-weight: bold; color: var(--terracota); }
.ocup-dado { font-size: 13px; color: var(--suave); }

/* Organograma / mapa mental arrastável */
.org-canvas { position: relative; height: 480px; min-width: 100%; border: 1px solid var(--borda); border-radius: 10px; background: #faf6f4; overflow: auto; }
.org-svg { position: absolute; top: 0; left: 0; pointer-events: none; }
.org-linha { stroke: var(--terracota); stroke-width: 2; }
.org-node {
  position: absolute; width: 150px; background: #fff; border: 1px solid var(--borda);
  border-left: 4px solid var(--coral); border-radius: 8px; padding: 8px 10px;
  cursor: grab; box-shadow: 0 2px 6px rgba(0,0,0,0.08); -webkit-user-select: none; user-select: none;
}
.org-node.arrastando { cursor: grabbing; box-shadow: 0 6px 16px rgba(0,0,0,0.18); z-index: 5; }
.org-root { border-left-color: var(--terracota); background: var(--coral-claro); }
.org-nome { font-weight: bold; font-size: 14px; color: var(--escuro); }
.org-area { font-size: 12px; color: var(--suave); }

/* Calendário visual (Tarefas) */
.cal-topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.cal-topo .btn { padding: 6px 14px; }
.cal-titulo { font-weight: bold; color: var(--escuro); text-transform: capitalize; font-size: 16px; }
.cal-grade-dow { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; margin-bottom: 4px; }
.cal-dow { text-align: center; font-size: 12px; color: var(--suave); font-weight: bold; }
.cal-grade { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.cal-cel { min-height: 74px; border: 1px solid var(--borda); border-radius: 6px; padding: 4px; background: #fff; overflow: hidden; }
.cal-vazia { background: transparent; border: none; }
.cal-hoje { border-color: var(--coral); box-shadow: inset 0 0 0 1px var(--coral); }
.cal-num { font-size: 12px; color: var(--suave); font-weight: bold; margin-bottom: 3px; }
.cal-chip { font-size: 11px; background: var(--coral-claro); color: var(--coral-escuro); border-radius: 4px; padding: 2px 5px; margin-bottom: 3px; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-chip.feita { text-decoration: line-through; opacity: 0.55; }
.cal-chip.atrasada { background: #fdeeec; color: var(--vermelho); }
@media (max-width: 560px) {
  .cal-cel { min-height: 56px; }
  .cal-chip { font-size: 10px; padding: 1px 3px; }
  .cal-num { font-size: 11px; }
}
.cal-evento { background: var(--terracota); color: #fff; cursor: default; }
.dir-lider { padding: 8px 0; border-bottom: 1px solid var(--borda); }
.dir-nome { font-size: 13px; font-weight: bold; color: var(--escuro); margin-bottom: 4px; }

/* Guia GROW */
.grow-guia { background: var(--cartao); border: 1px solid var(--borda); border-radius: 12px; padding: 14px 18px; margin-top: 16px; }
.grow-guia summary { cursor: pointer; font-weight: bold; color: var(--escuro); }
.grow-fase { margin-top: 12px; }
.grow-cabeca { font-size: 14px; }
.grow-letra { display: inline-block; width: 22px; height: 22px; line-height: 22px; text-align: center; background: var(--coral); color: #fff; border-radius: 50%; font-weight: bold; font-size: 12px; }
.grow-perguntas { margin: 6px 0 0 28px; color: #51605c; font-size: 13px; }
.grow-perguntas li { margin-bottom: 3px; }

/* Metas das áreas (números + barra de progresso) */
.meta-area-bloco { border: 1px solid var(--borda); border-radius: 10px; padding: 12px 14px; margin-bottom: 12px; }
.meta-area-cab { font-size: 15px; color: var(--escuro); margin-bottom: 8px; }
.meta-obj { padding: 10px 0; border-top: 1px dashed var(--borda); }
.meta-obj-titulo { font-size: 14px; margin-bottom: 6px; }
.meta-obj-campos { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.meta-obj-campos label { display: flex; flex-direction: column; font-size: 12px; color: var(--suave); gap: 3px; }
.meta-obj-campos .campo { width: 110px; }
.meta-barra { height: 14px; background: var(--surface-2); border-radius: 7px; overflow: hidden; }
.meta-preench { display: block; height: 100%; background: linear-gradient(90deg, var(--brand-400), var(--brand-600)); border-radius: 7px; }
.meta-prog-txt { font-size: 12px; color: var(--coral-escuro); margin-top: 3px; font-weight: bold; }
.meta-obj-cab-linha { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.meta-obj-cab-linha .meta-obj-titulo-input { flex: 1; margin-bottom: 0; }

/* Objetivo com acompanhamento MÊS A MÊS (Atual = média/último/soma dos meses lançados) */
.obj-mensal { margin-top: 8px; }
.obj-mensal-toggle { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--suave); cursor: pointer; }
.obj-mensal-toggle input { accent-color: var(--coral); transform: scale(1.1); }
.obj-mensal-hint { color: var(--suave); }
.obj-mensal-on { background: var(--coral-claro); border-radius: 10px; padding: 10px 12px; }
.obj-agreg { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--coral-escuro); font-weight: bold; margin: 8px 0 4px; flex-wrap: wrap; }
.obj-agreg select { font-weight: normal; }
.obj-mensal-det { margin-top: 4px; }
.obj-mensal-det > summary { cursor: pointer; font-size: 12px; color: var(--coral-escuro); font-weight: bold; padding: 4px 0; }
.obj-mensal-resumo { color: var(--suave); font-weight: normal; }
.obj-mm-tab { width: 100%; max-width: 360px; border-collapse: collapse; margin: 6px 0; }
.obj-mm-tab th { text-align: left; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; color: var(--suave); padding: 4px 6px; border-bottom: 1px solid var(--borda); }
.obj-mm-tab td { padding: 3px 6px; }
.obj-mm-tab .obj-mm-mes { font-size: 12px; color: var(--suave); white-space: nowrap; }
.obj-mm-tab .campo { width: 90px; padding: 5px 8px; }
.obj-mm-ajuda { font-size: 11px; color: var(--suave); margin: 4px 0 0; }
/* Reajuste automático da meta mês a mês */
.obj-mm-tab { max-width: 460px; }
.obj-reaj-toggle { display: flex; align-items: baseline; gap: 6px; font-size: 12px; color: var(--coral-escuro); font-weight: bold; cursor: pointer; margin: 6px 0 2px; flex-wrap: wrap; }
.obj-reaj-toggle input { accent-color: var(--coral); transform: scale(1.1); align-self: center; }
.obj-mm-aj { font-weight: 700; color: var(--terracota); white-space: nowrap; }
.obj-mm-aj-fix { font-weight: 400; color: var(--suave); }
.obj-mm-chip { font-size: 10px; font-weight: 700; color: var(--terracota); }
.obj-reaj-faixa { font-size: 12px; line-height: 1.5; border-radius: 8px; padding: 8px 11px; margin: 4px 0 8px; background: var(--fundo-suave); border: 1px solid var(--borda); }
.obj-reaj-faixa.faixa-falta { background: var(--warning-bg); border-color: var(--warning); }
.obj-reaj-faixa.faixa-sobra { background: var(--success-bg); border-color: var(--success); }
.obj-reaj-aviso { font-size: 11.5px; color: var(--danger); margin-top: 5px; }
.obj-atual-lbl { align-self: flex-start; }
.obj-atual-cap { font-size: 10px; color: var(--suave); font-weight: normal; text-transform: none; letter-spacing: 0; margin-top: 3px; white-space: nowrap; }
.obj-atual-ro { background: var(--coral-claro); color: var(--terracota); font-weight: bold; border-color: transparent; }

/* ===== Aba "1:1 do Líder" — a tela única da reunião ===== */
.umum-cab { background: var(--cartao); border: 1px solid var(--borda); border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; display: flex; flex-direction: column; gap: 10px; }
.umum-cab-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.umum-mes { font-size: 14px; font-weight: bold; color: var(--coral-escuro); display: inline-flex; align-items: center; gap: 6px; }
.umum-status { font-size: 13px; color: var(--suave); }
.umum-status.ok { color: var(--success); font-weight: bold; }
.umum-data { font-size: 12px; color: var(--suave); }
.umum-metaemp { margin-left: auto; font-size: 13px; color: var(--suave); }
.umum-metalider { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: bold; color: var(--coral-escuro); }
.umum-metalider .campo { flex: 1; font-weight: normal; color: var(--texto); }
.umum-reconhecer { font-size: 13.5px; color: var(--texto); background: var(--warning-bg); border-radius: 8px; padding: 8px 12px; }
.umum-sec { margin-bottom: 14px; }
.umum-sec-h { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.umum-sec-h h3 { margin: 0; }
.umum-tag { font-size: 10.5px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; padding: 3px 9px; border-radius: 999px; }
.umum-tag.ctx { background: var(--coral-claro); color: var(--suave); }
.umum-tag.cam { background: rgba(181, 107, 83, .16); color: var(--coral-escuro); }
.umum-tag.pau { background: rgba(255, 102, 70, .16); color: var(--coral-escuro); }
.umum-tag.com { background: var(--success-bg); color: var(--success); }
.umum-auto { margin-left: auto; font-size: 11px; font-weight: bold; color: var(--coral-escuro); background: var(--coral-claro); border-radius: 999px; padding: 3px 10px; }
.umum-subh { margin: 16px 0 8px; font-size: 15px; color: var(--coral-escuro); }
.umum-bloco { margin: 10px 0; }
.umum-pend { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; padding: 5px 0; color: var(--texto); }
.pill-venc { font-size: 10px; font-weight: 800; letter-spacing: .05em; background: var(--danger); color: #fff; border-radius: 5px; padding: 2px 6px; white-space: nowrap; }
.umum-ritmo { margin: 4px 0 0; }
.umum-ritmo li { margin: 3px 0; }
.umum-comp-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 10px; }
.umum-comp-chips .pill { font-size: 13px; padding: 4px 11px; border-radius: 999px; background: var(--coral-claro); border: 1px solid var(--borda); color: var(--suave); }
.umum-comp-chips .pill-foco { background: var(--success-bg); color: var(--success); border-color: transparent; font-weight: bold; }
.umum-sci { background: var(--coral-claro); border-left: 3px solid var(--success); border-radius: 0 8px 8px 0; padding: 9px 12px; font-size: 13.5px; color: var(--texto); margin-bottom: 8px; }
.umum-pdi { font-size: 14px; color: var(--texto); margin: 6px 0; }
.umum-emitir { margin-top: 14px; }
/* PDI mensal dentro da 1:1 */
.pdi1a1 { background: var(--coral-claro); border: 1px solid var(--borda); border-radius: 10px; padding: 12px 14px; margin: 10px 0; display: flex; flex-direction: column; gap: 8px; }
.pdi1a1.feito { opacity: .6; }
.pdi1a1-cab { display: flex; align-items: center; gap: 8px; }
.pdi1a1-comp { flex: 1; font-weight: bold; }
.pdi-feito-lbl { font-size: 12px; color: var(--suave); display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.pdi1a1-obj { width: 100%; }
.pdi1a1-mes { background: var(--cartao); border: 1px solid var(--borda); border-radius: 8px; padding: 8px 10px; }
.pdi1a1-mes .sub { display: flex; align-items: center; gap: 8px; margin: 0 0 6px; border: none; padding: 0; text-transform: none; font-size: 13px; color: var(--coral-escuro); }
.pdi1a1-nivel { font-weight: normal; }
.pdi1a1-ef { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pdi1a1-estudo { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (max-width: 560px) { .pdi1a1-ef, .pdi1a1-estudo { grid-template-columns: 1fr; } }
.pdi1a1-mini { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: var(--suave); }
.pdi1a1-mini .campo { width: 100%; }
.pdi1a1-traj { margin-top: 2px; }
.pdi1a1-traj > summary { cursor: pointer; font-size: 12px; font-weight: bold; color: var(--coral-escuro); }
.pdi-traj-item { font-size: 13px; color: var(--texto); border-left: 2px solid var(--borda); padding: 4px 0 4px 10px; margin: 6px 0; }
.pdi-nivel { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; background: var(--success-bg); color: var(--success); border-radius: 5px; padding: 2px 6px; }

/* Conversa do 1:1 guiada pelo GROW (as pautas viram o conteúdo de cada fase) */
.umum-grow .grow-regra { background: var(--warning-bg); border-radius: 8px; padding: 8px 12px; font-size: 13px; color: var(--texto); margin: 0 0 14px; }
.grow-passo { border-left: 3px solid var(--borda); padding: 4px 0 12px 14px; margin: 12px 0; }
.grow-passo-cab { display: flex; align-items: center; gap: 8px; font-size: 15px; margin-bottom: 6px; }
.grow-passo-cab strong { color: var(--coral-escuro); }
.grow-passo-corpo .sub { border: none; padding: 4px 0 0; margin: 8px 0 4px; text-transform: none; font-size: 12.5px; color: var(--coral-escuro); }
.grow-perg { margin-top: 8px; }
.grow-perg > summary { cursor: pointer; font-size: 12px; color: var(--suave); font-weight: bold; }
.grow-perg ul { margin: 6px 0 0 18px; color: var(--suave); font-size: 13px; }
.grow-perg li { margin-bottom: 3px; }
.grow-fase-G { border-left-color: var(--terracota); } .grow-fase-G .grow-letra { background: var(--terracota); }
.grow-fase-R { border-left-color: var(--warning); } .grow-fase-R .grow-letra { background: var(--warning); }
.grow-fase-O { border-left-color: var(--info); } .grow-fase-O .grow-letra { background: var(--info); }
.grow-fase-A { border-left-color: var(--success); } .grow-fase-A .grow-letra { background: var(--success); }

/* Playbook do papel (temas/perguntas/ideias/sinais da manipulação, por líder) */
.umum-playbook .pb-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 640px) { .umum-playbook .pb-grade { grid-template-columns: 1fr; } }
.pb-bloco { background: var(--cartao); border: 1px solid var(--borda); border-left: 4px solid var(--borda); border-radius: 10px; padding: 12px 14px; }
.pb-bloco.pb-temas { border-left-color: var(--terracota); }
.pb-bloco.pb-perguntas { border-left-color: var(--info); }
.pb-bloco.pb-ideias { border-left-color: var(--warning); }
.pb-bloco.pb-sinais { border-left-color: var(--danger); }
.pb-cab { font-size: 12px; font-weight: bold; color: var(--coral-escuro); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
.pb-item { display: flex; gap: 6px; align-items: flex-start; margin-bottom: 6px; }
.pb-item .campo { flex: 1; font-size: 13.5px; }

/* ===== Playbook de Desenvolvimento (o lado da PESSOA, dentro da 1:1) ===== */
.umum-dev { border-left: 4px solid var(--success); }
.dev-comp { border: 1px solid var(--borda); border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; background: var(--surface-2); }
.dev-comp-cab { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; margin-bottom: 6px; }
.dev-comp-nome { font-weight: 700; color: var(--coral-escuro); font-size: 15px; }
.dev-marca { margin-left: auto; font-size: 12px; font-weight: 700; border-radius: 999px; padding: 3px 10px; background: #fff; border: 1px solid var(--borda); color: var(--suave); }
.dev-marca.vazio { color: var(--text-3); font-weight: 500; }
.dev-marca.n1 { color: var(--danger); border-color: var(--danger); }
.dev-marca.n2 { color: var(--warning); border-color: var(--warning); }
.dev-marca.n3, .dev-marca.n4 { color: var(--success); border-color: var(--success); }
.dev-passo { margin-top: 12px; }
.dev-passo-lbl { font-size: 12px; text-transform: uppercase; letter-spacing: .5px; color: var(--coral-escuro); font-weight: 700; margin-bottom: 8px; }
.dev-passo-lbl b { color: var(--terracota); }
.dev-passo-lbl span { text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--suave); }
.dev-passo-lbl2 { font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--suave); font-weight: 700; margin: 8px 0 4px; }

.dev-espelho { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 640px) { .dev-espelho { grid-template-columns: 1fr; } }
.dev-col { border-radius: 10px; padding: 10px 12px; border: 1px solid var(--borda); }
.dev-col.dev-forte { background: var(--success-bg); border-color: var(--success); }
.dev-col.dev-fraco { background: var(--danger-bg); border-color: var(--danger); }
.dev-col-h { font-weight: 700; font-size: 12.5px; margin-bottom: 7px; }
.dev-forte .dev-col-h { color: var(--success); }
.dev-fraco .dev-col-h { color: var(--danger); }
.dev-col-h span { font-weight: 500; color: var(--suave); font-size: 11px; }
.dev-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.dev-col li { font-size: 12.5px; line-height: 1.45; color: var(--texto); padding-left: 14px; position: relative; }
.dev-col li::before { content: ""; position: absolute; left: 0; top: .5em; width: 5px; height: 5px; border-radius: 50%; }
.dev-forte li::before { background: var(--success); }
.dev-fraco li::before { background: var(--danger); }

.dev-regua { margin-top: 10px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.dev-regua-lbl { font-size: 12px; color: var(--suave); font-weight: 600; width: 100%; margin-bottom: 2px; }
.dev-nivel { font: inherit; font-size: 12px; border: 1.5px solid var(--borda); background: #fff; border-radius: 8px; padding: 6px 10px; cursor: pointer; color: var(--texto); transition: border-color .12s, background .12s; }
.dev-nivel b { color: var(--coral-escuro); margin-right: 3px; }
.dev-nivel:hover { border-color: #cd8a72; }
.dev-nivel.n3 { border-style: dashed; }
.dev-nivel.sel { border-color: var(--terracota); border-style: solid; background: #fbf3ef; box-shadow: inset 0 0 0 1px var(--terracota); font-weight: 700; }

.dev-q { display: flex; gap: 10px; align-items: flex-start; background: #fff; border: 1px solid var(--borda); border-radius: 9px; padding: 9px 11px; margin-bottom: 7px; }
.dev-q-txt { flex: 1; font-size: 13px; line-height: 1.5; color: var(--texto); }
.dev-q-pdi { flex: none; white-space: nowrap; align-self: center; }
.dev-q-mini { background: var(--surface-2); }
.dev-mais { margin-top: 6px; }
.dev-mais > summary { cursor: pointer; font-size: 12px; color: var(--info); font-weight: 600; padding: 4px 0; }
.dev-todas { margin-top: 8px; }
.dev-extras { margin-top: 6px; }
.dev-q-extra { align-items: stretch; }
.dev-q-extra .campo { flex: 1; font-size: 13px; }

.dev-recs { display: flex; flex-direction: column; gap: 8px; }
.dev-rec { display: grid; grid-template-columns: auto 1fr auto; gap: 11px; align-items: start; background: #fff; border: 1px solid var(--borda); border-left: 3px solid var(--terracota); border-radius: 9px; padding: 10px 12px; }
.dev-rec.lido { opacity: .6; }
.dev-rec-ic { font-size: 17px; line-height: 1.1; }
.dev-rec-t { font-weight: 700; font-size: 13px; color: var(--texto); }
.dev-rec-a { font-size: 11.5px; color: var(--suave); margin: 1px 0 4px; }
.dev-rec-p { font-size: 12px; color: var(--text-2); line-height: 1.45; }
.dev-rec-lido { font-size: 11px; color: var(--suave); white-space: nowrap; display: flex; align-items: center; gap: 4px; cursor: pointer; }

.dev-bib { margin-top: 8px; border: 1px dashed var(--info); border-radius: 10px; padding: 10px 12px; background: var(--info-bg); }
.dev-bib > summary { cursor: pointer; font-weight: 700; font-size: 13px; color: var(--info); }
.dev-bib .dev-rec { border-left-color: var(--info); }
.dev-rec-acoes { display: flex; flex-direction: column; align-items: flex-end; gap: 5px; }

/* ===== Playbooks DENTRO do GROW: digests por fase + a Oficina ===== */
.gd-sec { margin: 8px 0; }
.gd-lbl { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--suave); margin-bottom: 6px; }
.gd-norte { font-size: 13px; font-weight: 600; color: var(--coral-escuro); padding: 3px 0; }
.gd-alvo { font-weight: 400; color: var(--suave); font-size: 12px; }
.gd-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.gd-chip { display: inline-flex; align-items: center; gap: 8px; background: var(--fundo-suave); border: 1px solid var(--borda); border-radius: 999px; padding: 4px 6px 4px 12px; font-size: 12.5px; }
.gd-usar { font: inherit; font-size: 11px; font-weight: 700; color: var(--coral-escuro); background: #fff; border: 1px solid var(--borda); border-radius: 999px; padding: 2px 9px; cursor: pointer; white-space: nowrap; }
.gd-usar:hover { border-color: var(--terracota); color: var(--terracota); }
.gd-sinais { margin: 6px 0; }
.gd-sinais ul, .gd-ideias { margin: 0; padding-left: 0; list-style: none; display: flex; flex-direction: column; gap: 7px; }
.gd-sinais li, .gd-ideias li { font-size: 12.5px; line-height: 1.5; color: var(--texto); }
.gd-diag { margin: 10px 0; }
.dev-qbloco { margin-top: 10px; }
.dev-comp-2 > summary { cursor: pointer; padding: 2px 0; }
.gd-lista { margin: 4px 0 10px; padding-left: 18px; display: flex; flex-direction: column; gap: 6px; }
.gd-lista li { font-size: 12.5px; line-height: 1.5; }
.gd-regua-link { display: inline-block; margin-top: 8px; font: inherit; font-size: 12.5px; font-weight: 700; color: var(--info); background: var(--info-bg); border: 1px solid var(--info); border-radius: 8px; padding: 6px 12px; cursor: pointer; }
.gd-regua-link:hover { filter: brightness(0.97); }

/* Guia da 1:1: Playbook (4 quadros) + Perguntas do GROW */
.pb-guia { border: 1px dashed var(--coral-claro, var(--borda)); border-radius: 12px; padding: 12px 15px 15px; margin: 12px 0 6px; background: var(--fundo-suave); }
.pg-grow { margin-top: 14px; }
.pg-grade { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 6px; }
@media (max-width: 640px) { .pg-grade { grid-template-columns: 1fr; } }
.pg-fase { border-left: 3px solid var(--borda); padding: 3px 0 3px 10px; }
.pg-fase-nome { font-weight: 700; font-size: 12.5px; margin-bottom: 3px; }
.pg-fase ul { margin: 0; padding-left: 16px; }
.pg-fase li { font-size: 12px; line-height: 1.45; color: var(--texto); }
.grow-conversa-lbl { font-weight: 800; font-size: 13px; color: var(--coral-escuro); margin: 18px 0 8px; padding-top: 12px; border-top: 2px solid var(--borda); }
.pdi-intro { margin: 2px 0 10px; }

/* PDI 70/20/10 dentro do card */
.pdi-702010 { display: grid; grid-template-columns: 1.3fr 1fr 1.2fr; gap: 10px; margin: 8px 0; }
@media (max-width: 720px) { .pdi-702010 { grid-template-columns: 1fr; } }
.pdi-702010 > label { display: flex; flex-direction: column; gap: 3px; padding-left: 8px; }
.pdi-702010 > label > span { font-size: 11.5px; font-weight: 700; color: var(--suave); }
.pdi-702010 > label > span small { font-weight: 400; }
.pdi-70 { border-left: 3px solid var(--terracota); }
.pdi-20 { border-left: 3px solid var(--info); }
.pdi-10 { border-left: 3px solid var(--success); }
.pdi-sug { margin-top: 4px; }
.comb-pdi { flex: none; white-space: nowrap; }

/* ===== TELONA — Reunião do Mês em modo apresentação (slideshow projetável) ===== */
#telona { position: fixed; inset: 0; z-index: 9000; background: #15120D; color: #F3ECDD; display: flex; flex-direction: column; overflow: hidden; }
body.telona { overflow: hidden; }
#telona *, #telona *::before { box-sizing: border-box; }
.tel-serif, .tel-tile-num, .tel-capa-mes, .tel-ring span, .tel-aposta-frase, .tel-prov-q, .tel-duas h3, .tel-aposta-in { font-family: "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif; }
.tel-palco { flex: 1; display: flex; align-items: center; justify-content: center; padding: 4vh 6vw; min-height: 0; }
.tel-slide { width: 100%; max-width: 1120px; animation: telFade .35s ease; }
@keyframes telFade { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .tel-slide { animation: none; } }
.tel-eyebrow { font-size: clamp(.8rem,1.6vw,1.05rem); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #C97C46; margin-bottom: 3vh; }
.tel-verde { color: #5EC08F; }
.tel-grande-mut { font-size: clamp(1.2rem,2.6vw,1.9rem); color: #A99A82; line-height: 1.4; max-width: 26ch; }
.tel-center { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 2vh; }
.tel-capa { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 2.4vh; }
.tel-ring { --pct: 0; width: min(38vh,300px); aspect-ratio: 1; border-radius: 50%; background: conic-gradient(#E4A34E calc(var(--pct)*1%), rgba(243,236,221,.12) 0); display: flex; align-items: center; justify-content: center; }
.tel-ring span { width: 78%; aspect-ratio: 1; border-radius: 50%; background: #15120D; display: flex; align-items: center; justify-content: center; font-size: clamp(2.4rem,7vw,4.4rem); font-weight: 700; }
.tel-capa-mes { font-size: clamp(2rem,6vw,3.6rem); font-weight: 700; text-transform: capitalize; }
.tel-capa-sub { font-size: clamp(1rem,2.2vw,1.4rem); color: #A99A82; }
/* Capa: duas linhas do tempo (tempo do ano × progresso da meta) */
.tel-timelines { width: min(86vw, 940px); display: flex; flex-direction: column; gap: 3.4vh; text-align: left; margin: 1vh 0 .5vh; }
.tel-tl-top { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 1.7em; }
.tel-tl-tit { font-size: clamp(1.1rem,2.7vw,1.7rem); font-weight: 600; color: #E8E0D2; }
.tel-tl-pct { font-family: "Palatino Linotype", Palatino, Georgia, serif; font-size: clamp(1.9rem,5.2vw,3rem); font-weight: 700; color: #F3ECDD; }
.tel-tl-trilho { position: relative; height: clamp(18px,2.6vh,26px); border-radius: 999px; background: rgba(243,236,221,.10); }
.tel-tl-fill { height: 100%; border-radius: 999px; }
.tel-tl-fill.tempo { background: #8A94A6; }
.tel-tl-fill.ok { background: #5EC08F; }
.tel-tl-fill.ritmo { background: #E4A34E; }
.tel-tl-fill.risco { background: #E06B6B; }
.tel-tl-mark { position: absolute; top: -4px; bottom: -4px; width: 2px; background: rgba(243,236,221,.72); border-radius: 2px; }
.tel-tl-mark span { position: absolute; bottom: calc(100% + 4px); left: 50%; transform: translateX(-50%); font-size: clamp(.6rem,1.3vw,.8rem); letter-spacing: .14em; text-transform: uppercase; color: #C9BEA9; white-space: nowrap; }
.tel-tl-sub { margin-top: 10px; font-size: clamp(.85rem,1.7vw,1.05rem); color: #A99A82; }
.tel-tl-vered { font-size: clamp(1.1rem,2.7vw,1.6rem); font-weight: 600; text-align: center; padding-top: .6vh; }
.tel-tl-vered.ok { color: #7FD3A6; }
.tel-tl-vered.ritmo { color: #ECBB74; }
.tel-tl-vered.risco { color: #EC8A8A; }
/* Destaque fixo (Visitação médica) no slide de destaques/atenção */
.tel-pin { list-style: none; display: flex; align-items: flex-start; gap: 14px; margin: 0 0 16px; padding: 14px 18px; border-radius: 12px; background: rgba(243,236,221,.06); border-left: 5px solid #8A94A6; }
.tel-pin.sem-ok { border-left-color: #5EC08F; background: rgba(94,192,143,.12); }
.tel-pin.sem-risco { border-left-color: #E06B6B; background: rgba(224,107,107,.12); }
.tel-pin.sem-venc { border-left-color: #E4A34E; background: rgba(228,163,78,.12); }
.tel-pin.sem-ritmo { border-left-color: #E4A34E; background: rgba(228,163,78,.09); }
.tel-pin-ico { font-size: 1.6em; line-height: 1; }
.tel-pin-txt { font-size: clamp(1rem,1.9vw,1.3rem); line-height: 1.4; }
.tel-pin-num { font-family: "Palatino Linotype", Palatino, Georgia, serif; font-weight: 700; font-size: 1.15em; }
.tel-aposta-frase { font-size: clamp(1.6rem,4vw,2.8rem); line-height: 1.25; border-left: 4px solid #5EC08F; padding-left: 24px; }
.tel-status-lbl { margin: 3vh 0 1.4vh; font-size: clamp(1rem,2.2vw,1.4rem); color: #A99A82; }
.tel-status { display: flex; flex-wrap: wrap; gap: 12px; }
.tel-status-btn { font: inherit; font-size: clamp(.95rem,1.8vw,1.2rem); font-weight: 700; color: #F3ECDD; background: rgba(243,236,221,.06); border: 1px solid rgba(243,236,221,.18); border-radius: 12px; padding: 14px 22px; cursor: pointer; }
.tel-status-btn:hover { border-color: #E4A34E; }
.tel-status-btn.on { background: #E4A34E; color: #15120D; border-color: #E4A34E; }
.tel-status-com { margin-top: 2.4vh; width: 100%; max-width: 640px; font: inherit; font-size: 1.1rem; color: #F3ECDD; background: rgba(243,236,221,.05); border: 1px solid rgba(243,236,221,.16); border-radius: 10px; padding: 12px 16px; }
.tel-tiles { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 20px; }
.tel-tile { background: rgba(243,236,221,.04); border: 1px solid rgba(243,236,221,.12); border-top: 4px solid rgba(243,236,221,.22); border-radius: 16px; padding: 26px 20px; text-align: center; }
.tel-tile.sem-ok { border-top-color: #5EC08F; } .tel-tile.sem-risco, .tel-tile.sem-venc { border-top-color: #E86B4E; } .tel-tile.sem-ritmo { border-top-color: #E0A84E; }
.tel-tile-num { font-size: clamp(2.4rem,6vw,4rem); font-weight: 700; line-height: 1; font-variant-numeric: tabular-nums; }
.tel-tile.sem-ok .tel-tile-num { color: #5EC08F; } .tel-tile.sem-risco .tel-tile-num, .tel-tile.sem-venc .tel-tile-num { color: #E86B4E; } .tel-tile.sem-ritmo .tel-tile-num { color: #E0A84E; }
.tel-tile-tit { font-size: 1rem; font-weight: 700; margin-top: 12px; }
.tel-tile-sem { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; margin-top: 6px; color: #A99A82; }
.tel-tile-sub { font-size: .85rem; color: #A99A82; margin-top: 6px; }
.tel-tile-delta { margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(243,236,221,.10); font-weight: 700; font-size: clamp(.95rem,1.5vw,1.15rem); font-variant-numeric: tabular-nums; white-space: nowrap; }
.tel-tile-delta span { font-weight: 500; opacity: .55; font-size: .8em; }
.tel-tile-delta.bom { color: #5EC08F; } .tel-tile-delta.ruim { color: #E06B6B; } .tel-tile-delta.neutro, .tel-tile-delta.vazio { color: #8a90a0; }
.tel-tile-delta.ano { font-size: clamp(.9rem,1.4vw,1.1rem); }
.tel-tile-real { margin-top: 10px; padding-top: 9px; border-top: 1px dashed rgba(243,236,221,.14); font-weight: 700; font-size: clamp(.85rem,1.3vw,1.02rem); font-variant-numeric: tabular-nums; }
.tel-tile-real span { font-weight: 500; opacity: .55; font-size: .78em; display: block; margin-top: 2px; }
.tel-tile-real.bom { color: #5EC08F; } .tel-tile-real.ruim { color: #E06B6B; } .tel-tile-real.neutro { color: #E0A84E; }
.tel-tile-ano { margin-top: 12px; }
.tel-tile-ano-bar { height: 7px; border-radius: 4px; background: rgba(243,236,221,.12); overflow: hidden; }
.tel-tile-ano-fill { height: 100%; border-radius: 4px; background: #8A94A6; }
.tel-tile-ano-lbl { font-size: .74rem; color: #A99A82; margin-top: 6px; letter-spacing: .02em; }
.tel-areas { display: grid; grid-template-columns: repeat(auto-fit,minmax(500px,1fr)); gap: 18px; }
.tel-area-card { background: rgba(243,236,221,.04); border: 1px solid rgba(243,236,221,.12); border-radius: 14px; padding: 14px 22px; }
.tel-area-nome { font-size: 1.25rem; font-weight: 700; margin-bottom: 6px; color: #F3ECDD; }
/* uma linha de indicador = 4 zonas: nome+status · % herói · Real×Meta+barra · Δ mês anterior */
.tel-ind { display: grid; grid-template-columns: minmax(0,1.3fr) auto minmax(0,1.5fr); align-items: center; gap: 24px; padding: 14px 0; border-top: 1px solid rgba(243,236,221,.08); }
.tel-ind:first-of-type { border-top: 0; }
.tel-ind-nome { font-size: clamp(.78rem,1.15vw,.95rem); text-transform: uppercase; letter-spacing: .04em; color: rgba(243,236,221,.72); line-height: 1.3; }
.tel-ind-status { display: block; background: none; margin-top: 5px; font-size: .85em; text-transform: none; letter-spacing: 0; white-space: nowrap; }
.tel-ind-status.sem-ok { color: #5EC08F; } .tel-ind-status.sem-risco { color: #E06B6B; } .tel-ind-status.sem-venc, .tel-ind-status.sem-ritmo { color: #E4A34E; }
.tel-ind-heroi { font-family: "Palatino Linotype", Palatino, Georgia, serif; font-weight: 800; font-size: clamp(2.2rem,3.6vw,3.4rem); line-height: .92; text-align: center; white-space: nowrap; background: none; color: #CDBFA9; }
.tel-ind-heroi small { display: block; font-family: inherit; font-weight: 500; font-size: .27em; letter-spacing: .05em; text-transform: uppercase; opacity: .6; margin-top: 7px; color: #F3ECDD; }
.tel-ind-heroi.sem-ok { color: #5EC08F; } .tel-ind-heroi.sem-risco { color: #E06B6B; } .tel-ind-heroi.sem-venc, .tel-ind-heroi.sem-ritmo { color: #E4A34E; }
.tel-ind-mr-nums { display: flex; flex-direction: column; gap: 1px; font-variant-numeric: tabular-nums; }
.tel-ind-real { font-size: clamp(.92rem,1.4vw,1.12rem); font-weight: 700; color: #F3ECDD; }
.tel-ind-meta { font-size: clamp(.78rem,1.15vw,.95rem); color: rgba(243,236,221,.55); }
.tel-ai-trilho { position: relative; height: 4px; border-radius: 3px; background: #2a2f3a; margin-top: 9px; }
.tel-ai-fill { position: absolute; left: 0; top: 0; height: 100%; border-radius: 3px; }
.tel-ai-fill.sem-ok { background: #5EC08F; } .tel-ai-fill.sem-risco { background: #E06B6B; } .tel-ai-fill.sem-venc, .tel-ai-fill.sem-ritmo { background: #E4A34E; }
.tel-ai-tick { position: absolute; top: -3px; bottom: -3px; width: 2px; background: rgba(243,236,221,.85); border-radius: 2px; }
.tel-ind-delta-wrap { text-align: right; }
.tel-ind-delta { font-size: clamp(.98rem,1.5vw,1.22rem); font-weight: 700; white-space: nowrap; }
.tel-ind-delta small { display: block; font-weight: 500; font-size: .6em; opacity: .55; color: #F3ECDD; margin-top: 3px; text-transform: none; }
.tel-ind-delta.bom { color: #5EC08F; } .tel-ind-delta.ruim { color: #E06B6B; } .tel-ind-delta.neutro, .tel-ind-delta.vazio { color: #8a90a0; }
/* Slide 5 reformulado: "O que mais mexeu" (movimento vs mês anterior) */
.tel-spot-wrap { list-style: none; margin: 0 0 6px; padding: 0; }
.tel-movers-lista { list-style: none; margin: 0; padding: 0; }
.tel-mover { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; padding: 11px 0; border-bottom: 1px solid rgba(243,236,221,.08); }
.tel-mover:last-child { border-bottom: 0; }
.tel-mover-ind { font-size: clamp(1.05rem,1.9vw,1.5rem); color: #E8E0D2; line-height: 1.25; }
.tel-mover-ind small { display: block; font-size: .66em; color: rgba(243,236,221,.55); margin-top: 2px; }
.tel-mover-delta { font-weight: 700; font-size: clamp(1.2rem,2.1vw,1.7rem); white-space: nowrap; font-variant-numeric: tabular-nums; }
.tel-mover-delta.bom { color: #5EC08F; } .tel-mover-delta.ruim { color: #E06B6B; } .tel-mover-delta.neutro { color: #8a90a0; }
.tel-duas { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
@media (max-width: 640px) { .tel-duas { grid-template-columns: 1fr; } }
.tel-duas h3 { font-size: clamp(1.2rem,2.6vw,1.7rem); margin: 0 0 14px; }
.tel-col-ok h3 { color: #5EC08F; } .tel-col-risco h3 { color: #E86B4E; }
.tel-duas ul { margin: 0; padding-left: 22px; display: flex; flex-direction: column; gap: 10px; }
.tel-duas li { font-size: clamp(1rem,2vw,1.25rem); line-height: 1.4; }
.tel-col-vazio { color: #A99A82; font-size: 1.1rem; }
.tel-prov { display: flex; flex-direction: column; gap: 3vh; }
.tel-selo { font-size: clamp(.8rem,1.6vw,1.05rem); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #C97C46; }
.tel-prov-q { font-weight: 600; font-size: clamp(1.7rem,4.6vw,3.2rem); line-height: 1.18; letter-spacing: -.01em; text-wrap: balance; }
.tel-selo-area { color: #7FB3E0; display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; }
.tel-selo-eixo { font-weight: 600; letter-spacing: .04em; text-transform: none; color: #9fb3c4; font-size: .8em; }
.tel-prov-area .tel-prov-q { color: #eaf2fa; }
.tel-trocar { align-self: flex-start; font: inherit; font-size: .95rem; color: #A99A82; background: transparent; border: 1px solid rgba(243,236,221,.2); border-radius: 999px; padding: 8px 16px; cursor: pointer; }
.tel-trocar:hover { color: #E4A34E; border-color: #E4A34E; }
.tel-prov-lista { display: flex; flex-direction: column; gap: 10px; max-height: 74vh; overflow-y: auto; }
.tel-prov-item { text-align: left; font: inherit; font-size: clamp(.95rem,1.7vw,1.15rem); line-height: 1.4; color: #F3ECDD; background: rgba(243,236,221,.04); border: 1px solid rgba(243,236,221,.14); border-left: 4px solid #C97C46; border-radius: 10px; padding: 14px 18px; cursor: pointer; }
.tel-prov-item:hover { border-color: #E4A34E; background: rgba(228,163,78,.08); }
.tel-prov-eixo { display: block; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #C97C46; margin-bottom: 4px; }
.tel-aposta-in { width: 100%; font-size: clamp(1.3rem,3vw,2.1rem); line-height: 1.3; color: #F3ECDD; background: rgba(94,192,143,.06); border: 1px solid rgba(94,192,143,.35); border-radius: 14px; padding: 22px; resize: vertical; }
.tel-aposta-in::placeholder { color: #7d7259; }
.tel-aposta-acoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 2.4vh; }
.tel-btn { font: inherit; font-size: 1.05rem; font-weight: 700; color: #15120D; background: #E4A34E; border: none; border-radius: 10px; padding: 12px 22px; cursor: pointer; }
.tel-btn:hover { filter: brightness(1.05); }
.tel-comb-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 2.4vh; }
.tel-comb-chip { font-size: 1rem; background: rgba(243,236,221,.06); border: 1px solid rgba(243,236,221,.16); border-radius: 999px; padding: 8px 16px; }
.tel-comb-chip b { color: #E4A34E; }
.tel-sair { position: absolute; top: 18px; right: 20px; z-index: 2; font: inherit; font-size: .9rem; font-weight: 700; color: #A99A82; background: rgba(243,236,221,.06); border: 1px solid rgba(243,236,221,.16); border-radius: 999px; padding: 8px 16px; cursor: pointer; }
.tel-sair:hover { color: #F3ECDD; border-color: #E86B4E; }
.tel-rodape { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 26px; border-top: 1px solid rgba(243,236,221,.1); font-size: .85rem; color: #8a7d64; }
.tel-dots { display: flex; gap: 9px; }
.tel-dots i { width: 10px; height: 10px; border-radius: 50%; background: rgba(243,236,221,.18); cursor: pointer; display: block; }
.tel-dots i.on { background: #E4A34E; }
@media (max-width: 560px) { .tel-hint { display: none; } }

.umum-oficina { border-left: 4px solid var(--suave); }
.ofi > summary { cursor: pointer; font-weight: 700; font-size: 14px; color: var(--coral-escuro); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 4px 0; }
.ofi-vazio { font-size: 11px; font-weight: 700; color: var(--danger); background: var(--danger-bg); border: 1px solid var(--danger); border-radius: 999px; padding: 3px 10px; }
.ofi-comp { border-top: 1px solid var(--borda); padding-top: 10px; margin-top: 10px; }
.umum-oficina .pb-grade { margin-top: 8px; }

/* ===== Aba Líderes: grade de cards (porta de entrada) ===== */
.lideres-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(258px, 1fr)); gap: 14px; margin-top: 16px; }
.lider-card { display: flex; align-items: center; gap: 14px; text-align: left; background: var(--cartao); border: 1px solid var(--borda); border-radius: 14px; padding: 15px 17px; cursor: pointer; font: inherit; color: var(--texto); box-shadow: var(--shadow-sm); transition: border-color .12s, box-shadow .12s, transform .06s; }
.lider-card:hover { border-color: var(--terracota); box-shadow: var(--shadow-md); }
.lider-card:active { transform: scale(.99); }
.lider-card-av { width: 46px; height: 46px; border-radius: 50%; background: var(--terracota); color: #fff; font-weight: 700; font-size: 17px; display: flex; align-items: center; justify-content: center; flex: none; }
.lider-card-info { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.lider-card-nome { font-weight: 700; font-size: 15px; }
.lider-card-area { font-size: 12.5px; color: var(--suave); }
.lider-card-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 5px; }
.lc-tag { font-size: 10.5px; font-weight: 700; color: var(--suave); background: var(--fundo-suave); border: 1px solid var(--borda); border-radius: 999px; padding: 2px 8px; }
.lc-tag.lc-ok { color: var(--success); border-color: var(--success); background: var(--success-bg); }
.lc-tag.lc-warn { color: var(--warning); border-color: var(--warning); background: var(--warning-bg); }
.lider-card-go { font-size: 12px; font-weight: 700; color: var(--terracota); flex: none; }
@media (max-width: 560px) { .lider-card-go { display: none; } }

/* Metas & Alçada (dentro da 1:1) */
.umum-objalc > summary { cursor: pointer; font-weight: 700; font-size: 15px; color: var(--coral-escuro); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 2px 0; }
.umum-objalc > summary .umum-auto { margin-left: 0; }
.umum-objalc[open] > summary { margin-bottom: 8px; }

/* Aba Evolução das metas */
.evo-ref { font-size: 13px; color: var(--texto); margin: 10px 0; }
.evo-meses { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; }
.evo-mes { display: flex; flex-direction: column; font-size: 12px; color: var(--suave); gap: 3px; }
.evo-mes .campo { width: 100%; }
@media (max-width: 560px) { .evo-meses { grid-template-columns: repeat(3, 1fr); } }
/* Configuração do indicador (tipo / responsável / fórmula de %) */
.meta-config-linha { display: flex; gap: 12px; flex-wrap: wrap; margin: 6px 0 4px; }
.meta-mini-label { display: flex; flex-direction: column; gap: 3px; font-size: 11px; color: var(--suave); text-transform: uppercase; letter-spacing: .03em; }
.meta-mini-label select { font-size: 13px; text-transform: none; letter-spacing: 0; }
.campo-ro { background: #f6efeb; color: var(--terracota); font-weight: bold; }
/* Indicadores: ligação a faturamento (%), soma e % ponderada */
.meta-pct-base { font-size: 13px; color: var(--texto); margin: 6px 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.meta-pct-base select { max-width: 260px; }
.meta-reais { font-size: 13px; font-weight: bold; color: var(--coral-escuro); }
.meta-combina { margin: 6px 0; padding: 8px 10px; background: var(--fundo-suave); border-radius: 8px; }
.mg-check { display: block; font-size: 13px; margin: 3px 0; }
/* Controles da aba Evolução (meta + início) e agrupamento por ano */
.evo-controles { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.evo-desde { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; color: var(--suave); }
.evo-ano { margin-top: 10px; }
.evo-ano-titulo { font-weight: bold; color: var(--terracota); font-size: 13px; margin: 8px 0 4px; border-bottom: 1px solid var(--borda); padding-bottom: 2px; }
.evo-mes-meta { display: block; font-size: 11px; color: var(--suave); margin-top: 2px; }
.evo-mes-aviso { display: block; font-size: 11px; color: #c47f00; font-weight: bold; margin-top: 1px; }
/* ===== Reunião do Mês ===== */
.reu-topo { display: flex; justify-content: flex-end; margin-bottom: 6px; }
.reu-acoes { display: flex; gap: 8px; }
.reu-cabecalho { text-align: center; border-bottom: 2px solid var(--coral); padding-bottom: 10px; margin-bottom: 14px; }
.reu-cabecalho h2 { margin: 0 0 6px; color: var(--coral-escuro); }
.reu-moldura { display: flex; gap: 16px; justify-content: center; align-items: center; flex-wrap: wrap; font-size: 15px; }
.reu-moldura select { max-width: 220px; }
.reu-meta-ano { color: var(--terracota); }
.reu-abertura { color: var(--suave); margin: 8px 0 0; }
.reu-bloco { background: #fff; border: 1px solid var(--borda); border-radius: 12px; padding: 14px 16px; margin-bottom: 14px; }
.reu-bloco h3 { margin: 0 0 10px; color: var(--coral-escuro); font-size: 16px; }
.reu-prov-linha { display: grid; grid-template-columns: 130px minmax(180px, 300px) 1fr; align-items: center; gap: 10px 14px; padding: 7px 0; }
.reu-prov-comp { border-bottom: 1px dashed var(--borda); padding-bottom: 12px; margin-bottom: 6px; }
.reu-prov-area { font-weight: 700; font-size: 13px; color: var(--coral-escuro); }
.reu-prov-comp .reu-prov-area { color: #2f6fb0; }
.reu-prov-preview { font-size: 12.5px; color: var(--suave); font-style: italic; line-height: 1.4; }
.reu-prov-areas { margin-top: 4px; }
@media (max-width: 640px) { .reu-prov-linha { grid-template-columns: 1fr; gap: 4px; } .reu-prov-preview { padding-bottom: 6px; } }
.reu-cards { display: flex; gap: 12px; flex-wrap: wrap; }
.reu-card { flex: 1 1 180px; background: var(--fundo-suave); border-radius: 10px; padding: 12px; }
.reu-card-tit { font-weight: bold; color: var(--terracota); display: flex; align-items: center; gap: 6px; justify-content: space-between; }
.reu-card-num { font-size: 26px; font-weight: bold; margin: 6px 0; }
.reu-card-sub { font-size: 12px; color: var(--suave); }
.reu-grupo { margin-bottom: 12px; }
.reu-grupo-tit { font-weight: bold; color: var(--coral); border-left: 4px solid var(--coral); padding-left: 8px; margin-bottom: 4px; }
.reu-tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.reu-tabela th { text-align: right; color: var(--suave); font-weight: 600; font-size: 11px; text-transform: uppercase; letter-spacing: .03em; padding: 8px 10px; background: var(--fundo-suave); border-bottom: 1px solid var(--borda); }
.reu-tabela th:first-child, .reu-tabela td:first-child { text-align: left; }
.reu-tabela tbody tr:nth-child(even) { background: var(--fundo-suave); }
.reu-tabela td { text-align: right; padding: 8px 10px; border-bottom: 1px solid #f0e6e0; }
.reu-ind { font-weight: 500; }
.reu-mudo { color: #b9a99f; }
.reu-lista { margin: 4px 0 0; padding-left: 20px; }
.reu-lista li { margin: 3px 0; }
.reu-duas { display: flex; gap: 20px; flex-wrap: wrap; }
.reu-duas > div { flex: 1 1 240px; }
.reu-ok { color: #1f7a3d; }
.reu-risco { color: var(--vermelho); }
.reu-rosca { height: 240px; }
.reu-rosca-dupla { display: flex; gap: 24px; flex-wrap: wrap; }
.reu-rosca-dupla > div { flex: 1 1 240px; }
.reu-rosca-tit { text-align: center; font-weight: bold; color: var(--terracota); font-size: 13px; margin-bottom: 4px; }
.reu-barras { height: 260px; }
.reu-prog { height: 9px; background: #ece0d9; border-radius: 5px; overflow: hidden; margin-top: 8px; }
.reu-prog > span { display: block; height: 100%; background: var(--coral); border-radius: 5px; }
.evo-barra { margin: 10px 0 2px; }
/* Aba Números (Metas + Resultados fundidos) */
.num-config { margin: 10px 0; padding: 4px 14px; background: var(--fundo-suave); border-radius: var(--raio); }
.num-config summary { cursor: pointer; font-weight: bold; color: var(--coral-escuro); padding: 8px 0; }
.num-tabela th, .num-tabela td { text-align: left; }
.num-tabela td .campo { margin: 0; width: 100%; max-width: 170px; }
.mg-gestao { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--suave); margin: 4px 0 2px; cursor: pointer; }
.reu-pend { background: #fff6f3; border-radius: 8px; padding: 8px 12px; margin-bottom: 10px; font-size: 13px; }
.reu-combs { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.reu-comb { display: flex; align-items: center; gap: 8px; }
.reu-comb .campo { margin: 0; }
.reu-comb input[data-reu-comb-txt] { flex: 1; }
.reu-comb select { max-width: 160px; }
.reu-pauta-n { font-weight: 700; color: var(--coral); min-width: 18px; }
.reu-legenda { font-size: 12px; color: var(--suave); }
.rel-cabec { margin-bottom: 12px; }
.rel-cabec h2 { margin: 6px 0 2px; }
.rel-ind { margin: 14px 0 4px; }
.rel-ind h4 { margin: 0 0 6px; font-size: 14px; }
.rel-ind .reu-mudo { font-weight: 400; font-size: 12px; }
.rel-metames { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 13px; color: var(--suave); }
.rel-metames .campo { max-width: 180px; }
.rel-vincular { display: flex; align-items: center; gap: 8px; margin-top: 6px; font-size: 12px; color: var(--suave); }
.rel-vincular .campo { max-width: 300px; }

/* ===== Folha imprimível dos Combinados (material para o líder levar) ===== */
.ciclo-tabela th, .ciclo-tabela .ciclo-cel { text-align: center; min-width: 26px; }
.ciclo-tabela .ciclo-hoje { background: var(--fundo-suave); font-weight: 700; }
.ciclo-dot { color: var(--coral); }
.brief-11 { border-left: 4px solid var(--coral); }
.brief-grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-top: 8px; }
.brief-bloco { background: var(--fundo-suave); border-radius: var(--raio); padding: 10px 14px; }
.brief-tit { font-weight: 700; font-size: 13px; margin-bottom: 4px; }
.brief-tit.brief-risco { color: var(--vermelho, #c0392b); }
.brief-tit.brief-ok { color: var(--verde, #2f9e63); }
.brief-bloco .reu-lista { margin: 4px 0 0; font-size: 13px; }
.eq-pessoa { border: 1px solid var(--borda); border-radius: var(--raio); padding: 10px 12px; margin-bottom: 10px; }
.eq-linha1 { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; }
.eq-linha1 .campo { flex: 1; min-width: 120px; }
.eq-mini { display: flex; flex-direction: column; font-size: 11px; color: var(--suave); gap: 2px; }
.eq-mini select { min-width: 130px; }
.eq-fb { margin-top: 8px; }
.senha-linha { display: flex; gap: 8px; align-items: center; }
.senha-linha .campo { flex: 1; }
.folha-combinados { display: none; }
.fc-folha { font-family: "Segoe UI", system-ui, sans-serif; color: var(--texto); max-width: 820px; margin: 0 auto; }
.fc-cabec { border-bottom: 3px solid var(--coral); padding-bottom: 12px; margin-bottom: 16px; }
.fc-logo { width: 44px; height: 44px; object-fit: contain; vertical-align: middle; }
.fc-marca { display: inline-block; vertical-align: middle; margin-left: 10px; font-size: 12px; letter-spacing: .12em; color: var(--terracota); }
.fc-marca strong { color: var(--texto); }
.fc-cabec h1 { font-size: 22px; color: var(--coral-escuro); margin: 12px 0 0; }
.fc-cabec h1 span { font-size: 15px; color: var(--suave); font-weight: 600; }
.fc-foco { background: var(--fundo-suave); border-radius: 10px; padding: 10px 14px; margin-bottom: 12px; font-size: 13px; }
.fc-intro { font-size: 13px; color: var(--suave); margin-bottom: 18px; }
.fc-grupo { margin-bottom: 18px; break-inside: avoid; }
.fc-grupo h3 { color: var(--coral-escuro); font-size: 15px; border-bottom: 1px solid var(--borda); padding-bottom: 4px; margin: 0 0 10px; }
.fc-item { display: flex; gap: 12px; margin-bottom: 14px; break-inside: avoid; }
.fc-box { flex: 0 0 18px; width: 18px; height: 18px; border: 2px solid var(--terracota); border-radius: 4px; margin-top: 2px; }
.fc-linhas { flex: 1; }
.fc-texto { font-size: 14px; font-weight: 600; }
.fc-nota { font-size: 12px; color: var(--suave); margin-top: 6px; }
.fc-vazio { color: var(--suave); font-style: italic; }
.fc-rodape { display: flex; gap: 40px; margin-top: 34px; }
.fc-assina { flex: 1; text-align: center; font-size: 12px; color: var(--suave); }
.fc-traco { border-top: 1.5px solid var(--texto); margin-bottom: 4px; }
@media print {
  body.print-combinados > *:not(.folha-combinados) { display: none !important; }
  body.print-combinados .folha-combinados { display: block !important; }
  body.print-combinados, body.print-combinados * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
}
/* Prontidão */
.prn-nome { background: none; border: none; color: var(--coral-escuro); font-weight: bold; font-size: 14px; cursor: pointer; padding: 0; text-decoration: underline; }
.prn-area { font-size: 11px; color: var(--suave); }
.prn-barra { width: 130px; margin-top: 4px; }
.prn-tabela td { vertical-align: top; }
/* Resultados: acumulado + gerador de meta mensal */
.evo-acumulado { background: var(--fundo-suave); border-radius: 8px; padding: 9px 13px; margin: 10px 0; font-size: 14px; }
.acum-ok { color: #1f7a3d; }
.acum-baixo { color: var(--vermelho); }
.mm-gerar-linha { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin-top: 8px; }
.mm-gerar-linha label { display: flex; flex-direction: column; font-size: 12px; color: var(--suave); gap: 3px; }
/* Transporte da soma das metas mensais para inicial/meta do ano (aba anual) */
.meta-transporta { margin-top: 8px; padding: 7px 11px; background: var(--fundo-suave); border-radius: 8px; font-size: 13px; display: flex; flex-direction: column; gap: 6px; }
.meta-transp-linha { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* ===== Régua com âncoras de comportamento (níveis descritos) ===== */
.bars-comp { padding: 11px 0 13px; border-bottom: 1px solid var(--borda); }
.bars-comp:last-child { border-bottom: none; }
.bars-comp-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 8px; flex-wrap: wrap; }
.bars-comp-nome { font-weight: 600; color: var(--texto); font-size: 14px; }
.bars-marca { font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px; color: #fff; background: var(--terracota); white-space: nowrap; }
.bars-marca.vazio { background: #cabdb6; }
.bars-marca.n1 { background: #e3b8a8; color: #6a3f30; }
.bars-marca.n2 { background: #cd8a72; }
.bars-marca.n3 { background: var(--terracota); }
.bars-marca.n4 { background: var(--terracota-escura); }
.bars-niveis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.bars-nivel { text-align: left; border: 1.5px solid var(--borda); background: #fff; border-radius: 9px; padding: 8px 9px; cursor: pointer; transition: border-color .12s, background .12s, transform .06s; font: inherit; color: var(--texto); }
.bars-nivel:hover { border-color: #cd8a72; }
.bars-nivel:active { transform: scale(0.98); }
.bars-nivel-cab { display: block; font-size: 12px; font-weight: 700; color: var(--coral-escuro); margin-bottom: 3px; }
.bars-nivel-cab b { display: inline-block; min-width: 15px; }
.bars-nivel-txt { display: block; font-size: 12px; line-height: 1.35; color: var(--suave); }
.bars-esperado { font-size: 9px; font-weight: 700; background: #f0e2db; color: var(--coral-escuro); padding: 1px 5px; border-radius: 999px; }
.bars-nivel.sel { border-color: var(--terracota); background: #fbf3ef; box-shadow: inset 0 0 0 1px var(--terracota); }
.bars-nivel.sel .bars-nivel-txt { color: var(--texto); }
@media (max-width: 760px) { .bars-niveis { grid-template-columns: 1fr 1fr; } }

/* ===== Evidências de comportamento (S-C-I) ===== */
.bars-evid { margin-top: 8px; }
.bars-evid > summary { cursor: pointer; font-size: 12px; font-weight: 600; color: var(--coral-escuro); list-style: none; display: inline-flex; align-items: center; gap: 4px; padding: 2px 0; }
.bars-evid > summary::-webkit-details-marker { display: none; }
.bars-evid > summary:hover { text-decoration: underline; }
.evid-lista { margin-top: 6px; display: flex; flex-direction: column; gap: 6px; }
.evid-item { display: flex; align-items: flex-start; gap: 8px; background: #faf5f2; border: 1px solid var(--borda); border-left: 3px solid var(--terracota); border-radius: 8px; padding: 7px 10px; font-size: 12.5px; line-height: 1.45; }
.evid-data { font-weight: 700; color: var(--coral-escuro); white-space: nowrap; font-size: 11.5px; padding-top: 1px; }
.evid-sci { flex: 1; color: var(--texto); }
.evid-sci b { color: var(--terracota-escura); font-weight: 700; }
.evid-item .alc-del { flex-shrink: 0; }
.evid-registro { margin-top: 16px; background: #f7f1ee; border: 1px dashed var(--terracota); border-radius: 10px; padding: 13px 15px; }
.evid-registro .sub { font-weight: 700; color: var(--coral-escuro); font-size: 13.5px; }
.evid-registro .ajuda { font-size: 12px; color: var(--suave); margin: 5px 0 11px; line-height: 1.5; }
.evid-form { display: grid; grid-template-columns: 1fr; gap: 8px; }
.evid-form .campo { width: 100%; }
.evid-form select.campo { max-width: 100%; }
.btn-mini { padding: 7px 14px; font-size: 13px; justify-self: start; }

/* ===== PDI — documento individual (70-20-10) ===== */
.pdi-doc { background: #fff; border: 1px solid var(--borda); border-radius: var(--raio); padding: 18px 20px; box-shadow: var(--sombra); }
.pdi-cabec { border-bottom: 2px solid var(--terracota); padding-bottom: 10px; margin-bottom: 13px; }
.pdi-cabec-tit { display: flex; align-items: center; gap: 9px; }
.pdi-cabec-tit h3 { margin: 0; }
.pdi-cabec-sub { margin-top: 6px; font-size: 13px; color: var(--suave); }
.pdi-foco { display: block; margin-top: 3px; color: var(--coral-escuro); font-weight: 600; }
.pdi-diag { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.pdi-diag-col { border-radius: 10px; padding: 10px 13px; }
.pdi-diag-col.forcas { background: #eef6f0; }
.pdi-diag-col.focos { background: #fbf1ec; }
.pdi-diag-tit { font-weight: 700; font-size: 13px; margin-bottom: 5px; }
.pdi-diag-col.forcas .pdi-diag-tit { color: #1f7a3d; }
.pdi-diag-col.focos .pdi-diag-tit { color: var(--coral-escuro); }
.pdi-diag-lista { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.5; }
.pdi-obj { border: 1px solid var(--borda); border-left: 4px solid var(--terracota); border-radius: 10px; padding: 12px 14px; margin: 12px 0; background: #fff; break-inside: avoid; }
.pdi-obj.feito { opacity: .72; border-left-color: #1f7a3d; }
.pdi-obj-cab { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.pdi-obj-num { font-weight: 700; color: var(--terracota-escura); font-size: 13px; }
.pdi-obj-comp { flex: 1; min-width: 170px; max-width: 340px; }
.pdi-feito-lbl { font-size: 12px; color: var(--suave); display: flex; align-items: center; gap: 4px; }
.pdi-obj-meta { width: 100%; font-weight: 600; resize: vertical; }
/* textareas do PDI crescem conforme o conteúdo (field-sizing) — nada de texto cortado */
.pdi-doc textarea { field-sizing: content; min-height: 2.8em; }
.pdi-702010 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 10px 0; }
.pdi-70 { display: flex; flex-direction: column; gap: 4px; }
.pdi-70-cab { font-size: 12px; font-weight: 600; color: var(--coral-escuro); }
.pdi-70-cab b { background: var(--terracota); color: #fff; border-radius: 5px; padding: 1px 6px; margin-right: 4px; font-size: 11px; }
.pdi-70 textarea { width: 100%; resize: vertical; }
.pdi-fim { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-end; }
.pdi-mini { display: flex; flex-direction: column; gap: 3px; font-size: 12px; color: var(--suave); flex: 1; min-width: 200px; }
.pdi-mini-prazo { flex: 0 0 160px; min-width: 0; }
.pdi-acoes { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
@media (max-width: 760px) { .pdi-diag, .pdi-702010 { grid-template-columns: 1fr; } }

/* Últimos acentos coral → terracota (coesão total da marca em todas as telas) */
.evento::before { background: var(--brand-500); }
.linha-path { stroke: var(--brand-500); }
.linha-dot { fill: var(--brand-500); }
.trend-preench { background: var(--brand-500); }
.grow-letra { background: var(--brand-500); }
.reu-prog > span { background: var(--brand-500); }

/* Interligação (Etapa 3): selo "fonte da verdade" + link do dono + migalha clicável */
.fonte-verdade { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; background: var(--brand-50); border: 1px dashed var(--brand-200); border-radius: var(--r-sm); padding: 9px 13px; font-size: 13px; color: var(--brand-700); margin-bottom: 14px; }
.meta-ver-dono { align-self: flex-end; white-space: nowrap; }
.crumb-link { background: none; border: none; color: var(--text-2); font: inherit; cursor: pointer; padding: 0; }
.crumb-link:hover { color: var(--brand-700); text-decoration: underline; }

/* Ordens/dia: linha das metas fixas */
.ord-metas { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 10px 0; padding: 9px 13px; background: var(--brand-50); border: 1px solid var(--brand-100); border-radius: 10px; font-size: 13px; }
.ord-metas-tit { font-weight: 700; color: var(--brand-700); }
.ord-metas label { display: inline-flex; align-items: center; gap: 6px; color: var(--text-2); }
.ord-metas .campo { width: 84px; }

/* Impressão */
@media print {
  .nao-print { display: none !important; }
  /* Imprimir só o PDI (documento p/ entregar ao líder), em qualquer profundidade do DOM */
  body.print-pdi * { visibility: hidden !important; }
  body.print-pdi .pdi-doc, body.print-pdi .pdi-doc * { visibility: visible !important; }
  body.print-pdi .pdi-doc { position: absolute; left: 0; top: 0; width: 100%; box-shadow: none; border: none; padding: 0; }
  body.print-pdi, body.print-pdi * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  body.print-pdi .pdi-doc textarea, body.print-pdi .pdi-doc input, body.print-pdi .pdi-doc select {
    border: none !important; padding: 0 !important; background: none !important; color: #000 !important;
    -webkit-appearance: none; appearance: none; height: auto !important; min-height: 0 !important; overflow: visible !important; resize: none; font: inherit;
  }
  body.print-pdi .pdi-70 textarea, body.print-pdi .pdi-obj-meta { min-height: 2.6em !important; }
}

/* =====================================================================
   REDESIGN — Direção A: menu lateral (sidebar SaaS moderno)
   ===================================================================== */
.app { display: grid; grid-template-columns: 248px 1fr; min-height: 100vh; }

/* ---------- MENU LATERAL ---------- */
.sidebar {
  background: var(--surface-2); border-right: 1px solid var(--border);
  padding: var(--s5) var(--s3); display: flex; flex-direction: column; gap: 2px;
  position: sticky; top: 0; height: 100vh; align-self: start; overflow-y: auto;
}
.brand { display: flex; align-items: center; gap: var(--s3); padding: var(--s2) var(--s3) var(--s5); }
.brand-mark { width: 40px; height: 40px; border-radius: 10px; flex: 0 0 auto; object-fit: contain; }
.brand-text { line-height: 1.15; min-width: 0; }
.brand-text b { display: block; font-size: 13px; font-weight: 700; letter-spacing: -.01em; color: var(--brand-700); }
.brand-text span { display: block; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-3); }
.nav-group-label { font-size: 10px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--text-3); padding: var(--s4) var(--s3) var(--s2); }
.sidebar-nav { display: flex; flex-direction: column; gap: 2px; }
.nav-item {
  display: flex; align-items: center; gap: var(--s3); width: 100%; text-align: left;
  padding: 10px 12px; border-radius: var(--r-sm); font-size: 14px; font-weight: 500; color: var(--text-2);
  position: relative; transition: background .15s ease, color .15s ease; border: none; background: none; cursor: pointer; font-family: inherit;
}
.nav-item svg { width: 18px; height: 18px; flex: 0 0 auto; opacity: .85; }
.nav-item:hover { background: var(--brand-50); color: var(--brand-700); }
.nav-item.active { background: var(--brand-100); color: var(--brand-700); font-weight: 600; }
.nav-item.active::before { content: ""; position: absolute; left: -12px; top: 7px; bottom: 7px; width: 3px; border-radius: 0 3px 3px 0; background: var(--brand-500); }
.nav-badge { margin-left: auto; font-size: 11px; font-weight: 700; background: var(--accent-500); color: #fff; border-radius: 999px; padding: 1px 7px; line-height: 1.5; }
.nav-spacer { flex: 1; min-height: var(--s4); }
.sidebar-user { display: flex; align-items: center; gap: var(--s3); padding: var(--s3); border-top: 1px solid var(--border); margin-top: var(--s2); }
.su-avatar { width: 34px; height: 34px; border-radius: 999px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--brand-400), var(--brand-600)); }
.sidebar-user b { font-size: 13px; display: block; color: var(--text); }
.sidebar-user span { font-size: 11px; color: var(--text-3); }

/* ---------- ÁREA PRINCIPAL + TOPBAR ---------- */
.main { display: flex; flex-direction: column; min-width: 0; }
.topbar {
  min-height: 60px; flex: 0 0 auto; display: flex; align-items: center; gap: var(--s4);
  padding: 0 var(--s8); background: var(--surface); border-bottom: 1px solid var(--border);
  position: sticky; top: 0; z-index: 6;
}
.crumb { display: flex; align-items: center; gap: var(--s2); font-size: 13px; color: var(--text-2); flex-wrap: wrap; }
.crumb .sep { color: var(--text-3); }
.crumb .now { color: var(--text); font-weight: 600; }
.topbar-avatares { display: flex; gap: 6px; margin-left: auto; }
.topbar-avatares .avatar {
  width: 32px; height: 32px; border-radius: 999px; border: 2px solid var(--surface);
  background: linear-gradient(135deg, var(--brand-300), var(--brand-500)); color: #fff; font-weight: 700; font-size: 12px;
  box-shadow: var(--shadow-sm); cursor: pointer; transition: transform .12s ease;
}
.topbar-avatares .avatar:hover { transform: translateY(-1px); }
.topbar-avatares .avatar.ativo { outline: 2px solid var(--brand-600); outline-offset: 1px; }
.meta-ano { background: var(--brand-500); color: #fff; font-weight: 700; font-size: 13px; padding: 6px 14px; border-radius: 999px; white-space: nowrap; }

/* Conteúdo */
.content { padding: var(--s8); max-width: 1180px; width: 100%; }
.content > .bloco:first-child, .content > section:first-child { margin-top: 0; }

/* ---------- HOME: cabeçalho + KPI + painéis ---------- */
.page-head { margin-bottom: var(--s6); }
.page-head h1 { font-size: 24px; font-weight: 700; }
.page-head p { color: var(--text-2); margin-top: var(--s1); font-size: 14px; }
.page-head .destaque { color: var(--brand-600); font-weight: 600; }

.kpi-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s4); margin-bottom: var(--s8); }
.kpi { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); padding: var(--s5); box-shadow: var(--shadow-sm); transition: transform .15s ease, box-shadow .15s ease; cursor: pointer; text-align: left; }
.kpi:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.kpi .label { font-size: 12px; font-weight: 500; letter-spacing: .02em; text-transform: uppercase; color: var(--text-2); display: flex; align-items: center; gap: 6px; }
.kpi .num { font-size: 30px; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; margin: var(--s2) 0 var(--s1); font-variant-numeric: tabular-nums; }
.kpi .foot { font-size: 11px; color: var(--text-3); margin-top: 2px; }
.kdot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; display: inline-block; }
/* Sparkline (mini-gráfico) do KPI */
.kpi-spark { width: 100%; height: 40px; display: block; margin-top: 10px; }
.kpi-spark .sp-line { stroke: var(--brand-500); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.kpi-spark .sp-meta { stroke: var(--text-3); stroke-width: 1.2; stroke-dasharray: 3 3; opacity: .55; }
.kpi-spark .sp-dot { fill: var(--brand-600); }
.kpi-spark .sp-g0 { stop-color: var(--brand-500); stop-opacity: .18; }
.kpi-spark .sp-g1 { stop-color: var(--brand-500); stop-opacity: 0; }

.two-col { display: grid; grid-template-columns: 1.25fr 1fr; gap: var(--s6); margin-bottom: var(--s8); align-items: start; }
.panel { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); box-shadow: var(--shadow-sm); overflow: hidden; }
.panel-head { padding: var(--s4) var(--s5); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--s3); }
.panel-head h3 { font-size: 15px; font-weight: 600; }
.panel-head .link { margin-left: auto; font-size: 13px; color: var(--brand-600); font-weight: 500; background: none; border: none; cursor: pointer; }
.panel-body { padding: var(--s3) var(--s5) var(--s5); }

.step { display: flex; align-items: flex-start; gap: var(--s3); padding: var(--s3) var(--s2); border-radius: var(--r-sm); transition: background .15s ease; cursor: pointer; width: 100%; text-align: left; border: none; background: none; font-family: inherit; }
.step:hover { background: var(--brand-50); }
.step + .step { border-top: 1px solid var(--border); }
.step-ic { width: 30px; height: 30px; border-radius: var(--r-sm); flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.ic-warn { background: var(--warning-bg); color: var(--warning); }
.ic-info { background: var(--info-bg); color: var(--info); }
.ic-ok { background: var(--success-bg); color: var(--success); }
.step-body { flex: 1; min-width: 0; }
.step-body b { font-size: 13.5px; font-weight: 600; display: block; color: var(--text); }
.step-body span { font-size: 12px; color: var(--text-2); }
.step-go { align-self: center; font-size: 12px; font-weight: 600; color: var(--brand-600); flex: 0 0 auto; }

.team-row { display: flex; align-items: center; gap: var(--s3); padding: var(--s3) var(--s2); border-radius: var(--r-sm); transition: background .15s ease; cursor: pointer; width: 100%; text-align: left; border: none; background: none; font-family: inherit; }
.team-row:hover { background: var(--brand-50); }
.team-row + .team-row { border-top: 1px solid var(--border); }
.team-av { width: 36px; height: 36px; border-radius: 999px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--brand-400), var(--brand-600)); }
.team-info { flex: 1; min-width: 0; }
.team-info b { font-size: 13.5px; font-weight: 600; display: block; color: var(--text); }
.team-info span { font-size: 12px; color: var(--text-3); }
.pill { font-size: 11px; font-weight: 600; border-radius: 999px; padding: 2px 10px; display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.pill-ok { background: var(--success-bg); color: var(--success); }
.pill-warn { background: var(--warning-bg); color: var(--warning); }
.pill-risk { background: var(--danger-bg); color: var(--danger); }

/* ---------- Modo APRESENTAR: esconde a moldura ---------- */
body.apresentacao .sidebar, body.apresentacao .topbar { display: none; }
body.apresentacao .app { grid-template-columns: 1fr; }
body.apresentacao .content { max-width: 980px; margin: 0 auto; }

/* ---------- Responsivo ---------- */
@media (max-width: 1080px) { .kpi-grid { grid-template-columns: repeat(2, 1fr); } .two-col { grid-template-columns: 1fr; } }
@media (max-width: 860px) {
  .app { grid-template-columns: 1fr; }
  .sidebar { position: static; height: auto; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px; }
  .sidebar .nav-group-label, .nav-spacer, .sidebar-user { display: none; }
  .sidebar-nav { flex-direction: row; flex-wrap: wrap; }
  .nav-item.active::before { display: none; }
}

/* ---------- Impressão: esconder a moldura ---------- */
@media print {
  .sidebar, .topbar { display: none !important; }
  .app { display: block; }
  .content { max-width: none; padding: 0; }
}

/* =====================================================================
   REDESIGN — Milestone 2: polimento de componentes
   (regras no fim do arquivo => vencem as antigas de mesma especificidade)
   ===================================================================== */

/* ---- Títulos ---- */
h2 { color: var(--text); font-size: 19px; font-weight: 700; margin: 0 0 14px; }
h3 { color: var(--text); font-weight: 600; }

/* ---- Botões: primário TERRACOTA, secundário fantasma, coral só p/ destaque raro ---- */
.btn { font: inherit; border-radius: var(--r-sm); padding: 9px 16px; cursor: pointer; font-size: 13px; font-weight: 600;
  border: 1px solid transparent; display: inline-flex; align-items: center; gap: 6px; transition: background .15s ease, box-shadow .15s ease, border-color .15s ease; }
.btn-cheio { background: var(--brand-500); color: #fff; box-shadow: var(--shadow-sm); }
.btn-cheio:hover { background: var(--brand-600); }
.btn-claro { background: var(--surface); color: var(--text-2); border: 1px solid var(--border-strong); }
.btn-claro:hover { background: var(--surface-2); color: var(--text); }
.btn-avancar { flex: 1; min-width: 240px; background: var(--brand-500); color: #fff; border-color: transparent; font-weight: 700; padding: 12px; box-shadow: var(--shadow-sm); }
.btn-avancar:hover { background: var(--brand-600); }
.btn-avancar[disabled] { background: var(--surface-2); color: var(--text-3); border-color: var(--border); cursor: not-allowed; box-shadow: none; }
.btn-mini { padding: 6px 12px; font-size: 12.5px; }
.btn:focus-visible { outline: 2px solid var(--brand-500); outline-offset: 2px; }

/* ---- Cartões e blocos ---- */
.bloco { margin-bottom: var(--s6); }
.card { border-radius: var(--r-md); border: 1px solid var(--border); box-shadow: var(--shadow-sm); }
.card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.card-ferr { border-radius: var(--r-md); box-shadow: var(--shadow-sm); }
.etapa-atual { border-radius: var(--r-md); border-left: 4px solid var(--brand-500); box-shadow: var(--shadow-sm); }
.etapa-badge { background: var(--brand-500); color: #fff; border-radius: var(--r-sm); font-weight: 600; }

/* ---- Ficha: barra de topo + cabeçalho "hero" ---- */
.ficha-topo { margin-bottom: var(--s4); }
.voltar { color: var(--brand-600); font-weight: 600; }
.voltar:hover { color: var(--brand-700); text-decoration: underline; }
.perfil { border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: 0; overflow: hidden; }
.perfil-cab { display: flex; align-items: center; gap: var(--s4); padding: var(--s5) var(--s6);
  background: linear-gradient(180deg, var(--brand-50), var(--surface)); border-bottom: 1px solid var(--border); margin: 0; }
.perfil-av { width: 60px; height: 60px; border-radius: 999px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  font-size: 22px; font-weight: 700; color: #fff; background: linear-gradient(135deg, var(--brand-400), var(--brand-600)); box-shadow: var(--shadow-sm); }
.perfil h2 { margin: 0; font-size: 22px; }
.perfil-area { color: var(--text-2); font-weight: 400; font-size: 15px; }
.perfil-grid { padding: var(--s5) var(--s6) 0; gap: var(--s4) var(--s6); }
.perfil .foco { padding: 0 var(--s6) var(--s5); margin-top: var(--s4); }
.rotulo { color: var(--text-3); font-weight: 600; }

/* ---- Chips / tags terracota (não mais coral) ---- */
.tag { background: var(--brand-50); color: var(--brand-700); border: 1px solid var(--brand-100); border-radius: 999px; padding: 4px 12px; font-size: 12.5px; font-weight: 500; }

/* ---- Sub-abas da ficha: sublinhado limpo ---- */
.ficha-abas { gap: var(--s5); border-bottom: 1px solid var(--border); margin: var(--s5) 0 var(--s4); }
.ficha-aba { padding: 10px 0 9px; font-size: 13.5px; font-weight: 500; color: var(--text-2); border-radius: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.ficha-aba:hover { background: none; color: var(--brand-700); }
.ficha-aba.ativa { color: var(--brand-700); font-weight: 600; border-bottom-color: var(--brand-500); }

/* ---- Callouts (aviso/exemplo) padronizados ---- */
.aviso-backup { background: var(--warning-bg); border: 1px solid #EAD9AE; color: #7A5B12; border-radius: var(--r-md); }
.banner-exemplo { background: var(--warning-bg); border: 1px solid #EAD9AE; color: #7A5B12; border-radius: var(--r-md); }

/* ---- Preenchimentos coral remanescentes -> terracota (coesão total da marca) ---- */
input[type="checkbox"], input[type="radio"] { accent-color: var(--brand-500); }
.passo.feito, .etapa-linha.feita .bolinha { background: var(--brand-500); border-color: var(--brand-500); color: #fff; }
.passo.atual { background: #fff; color: var(--brand-700); border-color: var(--brand-500); }
.etapa-linha.atual .bolinha { background: #fff; color: var(--brand-700); border-color: var(--brand-500); }
.fer-lider.ativo { background: var(--brand-500); border-color: var(--brand-500); color: #fff; }
.campo:focus, .campo-grande:focus { border-color: var(--brand-500); box-shadow: 0 0 0 3px var(--brand-50); }
.cal-hoje { border-color: var(--brand-500); box-shadow: inset 0 0 0 1px var(--brand-500); }
.cal-chip { background: var(--brand-50); color: var(--brand-700); }
.cal-chip.cal-evento { background: var(--info-bg); color: var(--info); }
.trilha-mini .passo, .etapa-linha .bolinha { transition: background .15s ease; }

/* 1:1: seletor de mês + data do encontro (campos compactos) */
.campo-mini { padding: 5px 9px; font-size: 13px; width: auto; display: inline-block; }
.onze-mes { font-weight: 600; color: var(--text); }
.onze-mes select { font-weight: 600; }
.onze-data { display: inline-flex; align-items: center; gap: 6px; }

/* Banner de FALHA AO SALVAR (nunca falhar em silêncio) */
#aviso-salvar-falha { position: fixed; top: 0; left: 0; right: 0; z-index: 9999; background: var(--danger); color: #fff; padding: 12px 20px; text-align: center; font-size: 14px; box-shadow: var(--shadow-md); display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
#aviso-salvar-falha .avf-btn { background: #fff; color: var(--danger); font-weight: 700; border: none; border-radius: var(--r-sm); padding: 7px 14px; cursor: pointer; font-size: 13px; }

/* ===== Grade de talentos (9-box) ===== */
.nine-box { margin-bottom: 22px; }
.nb-grade { display: grid; grid-template-columns: minmax(58px, auto) 1fr 1fr 1fr; gap: 8px; margin-top: 8px; }
.nb-eixo-y { display: flex; align-items: center; justify-content: center; writing-mode: vertical-rl; transform: rotate(180deg); font-size: 11px; font-weight: 700; color: var(--text-3); letter-spacing: .3px; }
.nb-eixo-x-canto { }
.nb-eixo-x { text-align: center; font-size: 11px; font-weight: 700; color: var(--text-3); padding-top: 4px; }
.nb-cel { border: 1px solid var(--border); border-radius: var(--r-md); padding: 9px 10px; min-height: 92px; display: flex; flex-direction: column; gap: 7px; }
.nb-cel-rot { font-size: 11.5px; font-weight: 700; color: var(--text-2); }
.nb-bom { background: var(--success-bg); border-color: #cbe0d3; }
.nb-bom .nb-cel-rot { color: var(--success); }
.nb-medio { background: var(--warning-bg); border-color: #ecd8ac; }
.nb-medio .nb-cel-rot { color: var(--warning); }
.nb-atencao { background: var(--danger-bg); border-color: #ebc6bc; }
.nb-atencao .nb-cel-rot { color: var(--danger); }
.nb-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.nb-chip { display: inline-flex; align-items: center; gap: 5px; background: var(--surface); border: 1px solid var(--border-strong); border-radius: 999px; padding: 3px 9px 3px 3px; font: inherit; font-size: 12px; font-weight: 600; color: var(--text); cursor: pointer; transition: transform .06s, box-shadow .12s; }
.nb-chip:hover { box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.nb-chip-av { width: 20px; height: 20px; border-radius: 50%; background: var(--brand-600); color: #fff; font-size: 10px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.nb-vazio { color: var(--text-3); font-size: 13px; }
.nb-legenda { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 10px; font-size: 12px; color: var(--text-2); }
.nb-semaval { margin-top: 10px; font-size: 12.5px; color: var(--text-2); background: var(--surface-2); border-radius: var(--r-sm); padding: 8px 12px; }
@media (max-width: 680px) { .nb-cel { min-height: 76px; } .nb-cel-rot { font-size: 10.5px; } }

/* ===== Dossiê de 1 página ===== */
.dossie { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); box-shadow: var(--shadow-sm); padding: 26px 30px; max-width: 900px; }
.dos-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; border-bottom: 2px solid var(--brand-600); padding-bottom: 14px; flex-wrap: wrap; }
.dos-cab-id { display: flex; align-items: center; gap: 14px; }
.dos-cab-id h2 { margin: 0; }
.dos-sub { color: var(--text-2); font-size: 14px; margin-top: 2px; }
.dos-cab-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.dos-selo { font-size: 10.5px; font-weight: 700; letter-spacing: .4px; text-transform: uppercase; color: var(--brand-700); background: var(--brand-50); border: 1px solid var(--brand-200); border-radius: 999px; padding: 3px 10px; }
.dos-faixa { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin: 18px 0; }
.dos-kpi { background: var(--surface-2); border-radius: var(--r-md); padding: 11px 12px; text-align: center; display: flex; flex-direction: column; gap: 3px; }
.dos-kpi-num { font-size: 22px; font-weight: 800; color: var(--brand-700); line-height: 1; }
.dos-kpi-rot { font-size: 11px; color: var(--text-2); }
.dos-kpi-9box .dos-kpi-num { font-size: 18px; }
.dos-kpi-9box .dos-kpi-rot { font-weight: 700; color: var(--brand-700); }
.dos-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.dos-bloco { border: 1px solid var(--border); border-radius: var(--r-md); padding: 13px 16px; }
.dos-bloco h3 { margin: 0 0 9px; font-size: 14px; color: var(--brand-700); }
.dos-bloco p { margin: 5px 0; font-size: 13px; line-height: 1.5; }
.dos-lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.dos-lista li { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; border-bottom: 1px solid var(--border); padding-bottom: 5px; }
.dos-lista li:last-child { border-bottom: none; }
.dos-vazio { color: var(--text-3); font-style: italic; }
.dos-comp-nv { font-weight: 700; font-size: 11px; padding: 2px 8px; border-radius: 999px; color: #fff; background: var(--brand-500); white-space: nowrap; }
.dos-comp-nv.n1 { background: var(--brand-200); color: var(--brand-700); }
.dos-comp-nv.n2 { background: var(--brand-400); }
.dos-comp-nv.n3 { background: var(--brand-600); }
.dos-comp-nv.n4 { background: var(--brand-700); }
.dos-prazo { color: var(--text-3); font-size: 12px; white-space: nowrap; }
.dos-pdi-ok span { color: var(--success); }
.dos-passos { border-top: 1px solid var(--border); padding-top: 14px; }
.dos-passos h3 { margin: 0 0 8px; font-size: 14px; color: var(--brand-700); }
.dos-veredito { margin-top: 10px; font-size: 13px; background: var(--brand-50); border-radius: var(--r-sm); padding: 9px 13px; }
.dos-rodape { margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--border); font-size: 11px; color: var(--text-3); text-align: center; }
@media (max-width: 720px) { .dos-faixa { grid-template-columns: repeat(2, 1fr); } .dos-grid { grid-template-columns: 1fr; } }
@media print { .dossie { border: none; box-shadow: none; padding: 0; max-width: 100%; } .dos-bloco, .dos-kpi, .dos-faixa, .dos-passos, .dos-grid { break-inside: avoid; } }

/* ===== Gestão Financeira (DRE) — painel executivo ===== */
.fin-tag { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: #fff; background: var(--brand-500); border-radius: 999px; padding: 3px 10px; vertical-align: middle; margin-left: 8px; }
/* Cabeçalho + veredito */
.fin-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--border); }
.fin-cab-tit h2 { margin: 0; }
.fin-sub { font-size: 13px; color: var(--text-2); margin-top: 3px; }
.fin-veredito { margin-top: 9px; font-size: 16px; line-height: 1.4; }
.fin-vd-pos { color: var(--success); } .fin-vd-neg { color: var(--danger); } .fin-vd-neutro { color: var(--text-3); font-size: 14px; }
.fin-cab-acoes { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.fin-periodo { display: inline-flex; background: var(--surface-2); border-radius: 999px; padding: 3px; gap: 2px; }
.fin-per-btn { border: none; background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: var(--text-2); padding: 6px 18px; border-radius: 999px; cursor: pointer; }
.fin-per-btn.ativo { background: var(--brand-600); color: #fff; }
.fin-mes-sel { max-width: 190px; }
.fin-anolabel { font-size: 14px; font-weight: 600; color: var(--text); }
.fin-aviso { background: var(--danger-bg); border: 1px solid #ebc6bc; border-radius: var(--r-sm); padding: 10px 13px; margin-bottom: 16px; font-size: 12.5px; color: var(--text); line-height: 1.5; }
/* KPIs */
.fin-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 18px; }
.fin-kpi { background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-md); padding: 16px 18px; box-shadow: var(--shadow-sm); }
.kpi-cab { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.kpi-ic { width: 28px; height: 28px; border-radius: 8px; background: var(--brand-50); display: inline-flex; align-items: center; justify-content: center; font-size: 15px; }
.kpi-rot { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--text-2); }
.kpi-num { font-size: 27px; font-weight: 700; color: var(--text); font-variant-numeric: tabular-nums; line-height: 1.1; }
.kpi-micro { font-size: 11.5px; color: var(--text-3); margin-top: 6px; line-height: 1.35; }
.kpi-barra { height: 5px; background: var(--surface-2); border-radius: 3px; overflow: hidden; margin-top: 8px; }
.kpi-barra span { display: block; height: 100%; background: var(--success); }
.fin-kpi-hero { border-left: 3px solid var(--success); }
.fin-kpi-hero.neg { border-left-color: var(--danger); }
.kpi-num-hero { font-size: 40px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.05; color: var(--success); }
.fin-kpi-hero.neg .kpi-num-hero { color: var(--danger); }
/* Cards / cabeçalho de card */
.fin-card-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.fin-card-cab h3 { margin: 0; font-size: 15px; color: var(--brand-700); }
.fin-vazio { color: var(--text-3); font-size: 13px; padding: 18px 0; text-align: center; }
/* Waterfall */
.fin-wf { margin-bottom: 18px; }
.fin-legenda { display: flex; gap: 14px; font-size: 12px; color: var(--text-2); flex-wrap: wrap; }
.fin-legenda i.lg { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.lg-tot { background: var(--brand-600); } .lg-ded { background: var(--brand-300); } .lg-res { background: var(--success); }
.fin-wf-scroll { overflow-x: auto; }
.fin-wf-scroll .grafico-box { min-width: 620px; }
/* Análise: DRE + lateral */
.fin-analise { display: grid; grid-template-columns: 7fr 5fr; gap: 18px; align-items: start; }
.dre2 { width: 100%; border-collapse: collapse; font-size: 14px; }
.dre2 thead th { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: var(--text-3); font-weight: 700; text-align: left; padding: 0 6px 8px; border-bottom: 1px solid var(--border); }
.dre2 thead th:nth-child(2), .dre2 thead th:nth-child(3) { text-align: right; }
.dre2-l td { padding: 8px 6px; border-bottom: 1px solid var(--border); }
.dre2-rot { color: var(--text); }
.dre2-pct { text-align: right; font-variant-numeric: tabular-nums; color: var(--text-3); font-size: 12.5px; white-space: nowrap; }
.dre2-val { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; font-weight: 600; color: var(--text); }
.dre2-deduz .dre2-rot { padding-left: 14px; color: var(--text-2); }
.dre2-deduz .dre2-val { color: var(--danger); font-weight: 500; }
.dre2-sub2 td { padding: 4px 6px; border-bottom: 1px dashed var(--border); }
.dre2-sub2 .dre2-rot { padding-left: 26px; color: var(--text-3); font-size: 12.5px; }
.dre2-sub2 .dre2-val { color: var(--text-2); font-weight: 500; font-size: 12.5px; }
.dre2-sub2 .dre2-pct { font-size: 11.5px; }
.dre2-sub td { background: var(--surface-2); font-weight: 700; border-top: 1.5px solid var(--border); border-bottom: none; }
.dre2-sub .dre2-rot { color: var(--brand-700); }
.dre2-sub .dre2-val { color: var(--brand-700); }
.dre2-final td { border-top: 2.5px solid var(--brand-600); border-bottom: none; padding-top: 12px; background: var(--brand-50); }
.dre2-final .dre2-rot { font-weight: 800; font-size: 15px; color: var(--brand-700); }
.dre2-final .dre2-val { font-weight: 800; font-size: 18px; color: var(--success); }
/* Resultado NEGATIVO (prejuízo / sobra de caixa negativa) → vermelho, não verde */
.dre2-final.dre2-neg .dre2-val, .dre2-sub.dre2-neg .dre2-val { color: var(--danger); }
.dre2-final:has(.dre2-val) .dre2-val { }
.fin-lateral { display: flex; flex-direction: column; gap: 18px; }
/* Donut */
.fin-donut-wrap { max-width: 240px; margin: 0 auto; }
.fin-donut-leg { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.fin-donut-leg li { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.don-bola { width: 11px; height: 11px; border-radius: 3px; flex-shrink: 0; }
.don-nome { color: var(--text); flex: 1; }
.don-val { font-variant-numeric: tabular-nums; color: var(--text-2); font-weight: 600; white-space: nowrap; }
.don-val em { font-style: normal; color: var(--text-3); font-weight: 400; margin-left: 4px; }
/* Termômetro do ponto de equilíbrio */
.termo-num { font-size: 30px; font-weight: 800; color: var(--text-2); text-align: center; }
.termo-num.ok { color: var(--success); } .termo-num.aten { color: var(--warning); } .termo-num.ruim { color: var(--danger); }
.termo-num span { display: block; font-size: 12px; font-weight: 600; color: var(--text-3); text-transform: uppercase; letter-spacing: .03em; margin-top: 2px; }
.termo-trilho { position: relative; height: 16px; background: var(--surface-2); border-radius: 999px; margin: 16px 0 8px; overflow: hidden; }
.termo-folga { position: absolute; top: 0; bottom: 0; right: 0; background: color-mix(in srgb, var(--success) 32%, transparent); }
.termo-marca { position: absolute; top: -3px; bottom: -3px; width: 3px; background: var(--brand-700); border-radius: 2px; }
.termo-legenda { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--text-2); }
.termo-legenda .dir { text-align: right; }
.termo-legenda strong { color: var(--brand-700); font-variant-numeric: tabular-nums; }
.termo-frase { font-size: 12.5px; color: var(--text-2); margin: 12px 0 0; line-height: 1.5; }
/* Nota de esboço */
.fin-nota-esboco { margin-top: 18px; background: var(--warning-bg); border: 1px solid #ecd8ac; border-radius: var(--r-md); padding: 12px 15px; font-size: 12.5px; color: var(--text); line-height: 1.5; }
/* Campos (reaproveitados no drawer) */
.fin-campo { margin-bottom: 16px; display: flex; flex-direction: column; gap: 5px; }
.fin-campo label { font-size: 13px; font-weight: 600; color: var(--text); }
.fin-cf { margin-top: 18px; border-top: 1px solid var(--border); padding-top: 14px; }
/* Sub-abas Painel | Premissas */
.fin-subabas { margin: 4px 0 14px; }
/* Barra de seleção de unidade (Consolidado | Goiás | Rio) */
.fin-unidbar { display: flex; align-items: center; gap: 12px; margin: 0 0 18px; flex-wrap: wrap; }
.fin-unidbar-rot { font-size: 13px; font-weight: 600; color: var(--text-2); }/* Editor de premissas (sub-aba própria { margin: 0 0 4px; font-size: 17px; color: var(--brand-700); }
.fin-imposto { max-width: 320px; margin: 14px 0 20px; }
.fin-imposto .campo { max-width: 200px; }
@media (max-width: 900px) { .fin-kpis { grid-template-columns: repeat(2, 1fr); } .fin-analise { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .fin-kpis { grid-template-columns: 1fr; } }

/* ===== Números do mês (lançamento consolidado detalhado) ===== */
.fnum-topo { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin: 4px 0 16px; }
.fnum-mes { display: flex; align-items: center; gap: 8px; }
.fnum-mes label { font-size: 13px; font-weight: 600; color: var(--text-2); }
.fnum-mes select { max-width: 190px; }
.fnum-ajuda { flex: 1; min-width: 260px; font-size: 12.5px; color: var(--text-2); line-height: 1.45; margin: 0; }
/* Quadro POR EMPRESA (Rio | Goiás | Consolidado) alimentado pela importação */
.fne-wrap { border: 1px solid var(--border-strong); border-radius: var(--r-md); background: var(--surface); padding: 6px 14px 12px; margin-bottom: 16px; box-shadow: var(--shadow-sm); }
.fne-tit { font-size: 14px; font-weight: 700; color: var(--text); padding: 10px 2px 8px; }
.fne-fonte { font-size: 11px; font-weight: 600; color: var(--brand-600); background: var(--surface-2); border-radius: 999px; padding: 2px 9px; margin-left: 6px; }
.fne-scroll { overflow-x: auto; }
.fne-tab { width: 100%; border-collapse: collapse; min-width: 460px; font-size: 13px; }
.fne-tab th { text-align: right; font-size: 11.5px; font-weight: 700; color: var(--text-2); padding: 7px 10px; border-bottom: 2px solid var(--border-strong); white-space: nowrap; }
.fne-tab th:first-child { text-align: left; }
.fne-tab td { padding: 7px 10px; border-bottom: 1px solid var(--border); }
.fne-tab td:first-child { color: var(--text-2); }
.fne-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.fne-forte { font-weight: 700; color: var(--text); }
.fne-receita td { font-weight: 700; color: var(--text); background: var(--surface-2); }
.fne-tot td { font-weight: 600; border-top: 1px solid var(--border-strong); }
.fne-res td { font-weight: 700; color: var(--brand-700); background: var(--surface-2); border-top: 2px solid var(--border-strong); }
.fne-num.fne-neg { color: var(--danger); }
.fne-res td.fne-neg { color: var(--danger); }
.fne-fora td { color: var(--text-3); font-style: italic; }
/* Linhas de "ponte" entre a Sobra bruta (planilha) e o Resultado do Painel */
.fne-ponte td { color: var(--text-2); background: var(--bg); border-top: 1px dashed var(--border-strong); }
.fne-mini { font-size: 10.5px; font-weight: 400; color: var(--text-3); white-space: nowrap; }
.fne-fora td:first-child { color: var(--text-3); }
.fne-notas { margin: 10px 2px 2px; padding-left: 18px; font-size: 11.5px; color: var(--text-2); line-height: 1.5; }
.fne-notas li { margin-bottom: 3px; }
.fne-vazia { border: 1px dashed var(--border-strong); border-radius: var(--r-md); background: var(--surface-2); padding: 20px 18px; font-size: 13px; color: var(--text-2); line-height: 1.6; margin-bottom: 16px; text-align: center; }
.fnum-manual { border: 1px solid var(--border); border-radius: var(--r-md); background: var(--bg); padding: 2px 14px 10px; margin-top: 4px; }
.fnum-manual > summary { cursor: pointer; font-weight: 600; font-size: 12.5px; padding: 11px 0; color: var(--text-2); list-style-position: inside; }
/* Contagem de estoque → CMV por competência */
.fest { background: var(--surface); border-color: var(--border-strong); }
.fest > summary { color: var(--text); font-size: 13.5px; }
.fest-pct { background: var(--success-bg); border: 1px solid #cfe3d8; border-radius: var(--r-md); padding: 12px 14px; margin: 8px 0 12px; font-size: 13px; color: var(--text); line-height: 1.6; }
.fest-big { display: inline-block; font-size: 17px; font-weight: 700; color: var(--success); margin: 6px 18px 2px 0; }
.fest-mini { font-size: 11.5px; color: var(--text-2); margin-top: 6px; line-height: 1.5; }
.fest-aviso { background: var(--warning-bg); border: 1px solid #ecd8ac; border-radius: var(--r-md); padding: 11px 14px; margin: 8px 0 12px; font-size: 12.5px; color: var(--text); }
.fest-add { display: flex; gap: 10px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
.fest-add select.campo { max-width: 210px; }
.fest .flanc-tab input.campo { max-width: 150px; }
/* Manipulação por unidade (proporção Rio × Goiás) */
.fmu { background: var(--surface); border-color: var(--border-strong); }
.fmu > summary { color: var(--text); font-size: 13.5px; }
.fmu .flanc-tab input.campo { max-width: 150px; }
.fmu-ind { font-size: 11px; color: var(--text-3); font-weight: 400; margin-top: 2px; }
.fmu-ok { font-size: 11.5px; color: var(--success); font-weight: 600; }
.fmu-alerta { font-size: 11.5px; color: var(--danger); font-weight: 600; }
.fmu-proxy { font-size: 11.5px; color: var(--text-3); font-style: italic; }
.fnum-rs { position: relative; flex-shrink: 0; }
.fnum-rs::before { content: "R$"; position: absolute; left: 8px; top: 50%; transform: translateY(-50%); font-size: 10.5px; color: var(--text-3); pointer-events: none; }
.fnum-rs.pct::before { content: "%"; left: auto; right: 9px; }
.fnum-rs.pct .fnum-inp { padding-left: 8px; padding-right: 20px; text-align: right; }
.fnum-inp { text-align: right; width: 118px; padding: 7px 9px 7px 24px !important; font-variant-numeric: tabular-nums; }
.fnum-del { border: none; background: transparent; color: var(--text-3); cursor: pointer; font-size: 13px; width: 24px; height: 24px; border-radius: 6px; flex-shrink: 0; }
.fnum-del:hover { background: var(--danger-bg); color: var(--danger); }
.fnum-add { margin-top: 8px; border: 1px dashed var(--border-strong); background: transparent; color: var(--brand-600); font: inherit; font-size: 12.5px; font-weight: 600; padding: 7px 12px; border-radius: var(--r-sm); cursor: pointer; }
.fnum-add:hover { background: var(--brand-50); }
@media (max-width: 620px) { .fnum-split { flex-wrap: wrap; justify-content: flex-end; } .fnum-inp { width: 96px; } }

/* ===== Matrizes de Alçada consolidadas (apresentar/imprimir) ===== */
.alc-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 14px; }
.alc-legenda { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 18px; }
.alc-lg { font-size: 12px; font-weight: 600; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--borda); }
.alc-lg.n-sozinho { background: #eef7f1; color: #2f6b4f; }
.alc-lg.n-comunica { background: #fff6e9; color: #8a5a12; }
.alc-lg.n-aprovar { background: #fdeeec; color: #a5402f; }
.alc-bloco { margin-bottom: 16px; break-inside: avoid; page-break-inside: avoid; }
.alc-cab { display: flex; align-items: baseline; gap: 10px; margin-bottom: 10px; flex-wrap: wrap; }
.alc-cab h3 { margin: 0; color: var(--brand-700); }
.alc-area { font-size: 13px; color: var(--text-2); }
.tabela-alcada .alc-dec { font-weight: 600; color: var(--text); }
.alc-badge { display: inline-block; font-size: 11.5px; font-weight: 700; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.alc-badge.n-sozinho { background: #dcefe3; color: #2f6b4f; }
.alc-badge.n-comunica { background: #fbe9cf; color: #8a5a12; }
.alc-badge.n-aprovar { background: #f7dcd6; color: #a5402f; }
.alc-nd { font-size: 12px; color: var(--text-3); font-style: italic; }
.alc-vazio { color: var(--text-3); font-style: italic; padding: 12px 6px; }
@media print {
  .alc-topo .reu-acoes { display: none !important; }
  .alc-bloco { break-inside: avoid; box-shadow: none; border: 1px solid #ddd; }
  .alc-bloco .tabela-rolagem { overflow: visible; }
  .alc-bloco .tabela-alcada { min-width: 0; font-size: 11px; }
  .alc-badge { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ===== Importador de contas a pagar + lançamentos ===== */
.fimp { padding: 4px 2px; }
.fimp-topo { font-weight: 600; color: var(--text-2); margin-bottom: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fimp-ajuda { color: var(--text-3); font-size: 13px; line-height: 1.5; margin: 0 0 16px; max-width: 720px; }
.fimp-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.fimp-card { border: 1px solid var(--border); border-radius: 12px; padding: 16px; background: var(--surface); display: flex; flex-direction: column; gap: 10px; }
.fimp-emp { font-weight: 700; font-size: 15px; }
.fimp-ok { color: var(--success); font-weight: 600; font-size: 13px; }
.fimp-semdado { color: var(--text-3); font-size: 13px; font-style: italic; }
.fimp-btn { display: inline-block; text-align: center; cursor: pointer; background: var(--brand-600); color: #fff; border-radius: 8px; padding: 9px 14px; font-weight: 600; font-size: 13px; transition: background .15s; }
.fimp-btn:hover { background: var(--brand-700); }
.fimp-remover { margin-top: 6px; background: none; border: 1px solid var(--danger); color: var(--danger); border-radius: 8px; padding: 6px 10px; font-size: 12px; font-weight: 600; cursor: pointer; }
.fimp-remover:hover { background: #fbeae6; }
.fimp-fb { margin-top: 16px; padding: 14px 16px; border-radius: 10px; background: var(--brand-50); border: 1px solid var(--brand-200); font-size: 14px; line-height: 1.5; }
.fimp-erro { margin-top: 16px; padding: 14px 16px; border-radius: 10px; background: #fbeae6; border: 1px solid var(--danger); color: var(--danger); font-size: 14px; }
.fimp-novos { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.fimp-novo { display: flex; align-items: center; justify-content: space-between; gap: 10px; background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 7px 10px; }
.fimp-novo-nome { font-weight: 600; font-size: 13px; }
.fimp-novo select { max-width: 210px; }

.flanc-filtros { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.flanc-filtros .campo { min-width: 130px; }
.flanc-filtros input.campo { flex: 1 1 200px; }
.flanc-grid { display: grid; grid-template-columns: 260px 1fr; gap: 16px; align-items: start; }
.flanc-resumo h4 { margin: 0 0 8px; font-size: 13px; color: var(--text-2); }
.flanc-lista { overflow-x: auto; }
.flanc-tab { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.flanc-tab th { text-align: left; color: var(--text-3); font-weight: 600; padding: 6px 8px; border-bottom: 2px solid var(--border); position: sticky; top: 0; background: var(--surface); }
.flanc-tab td { padding: 5px 8px; border-bottom: 1px solid var(--border); }
.flanc-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.flanc-resumo .flanc-tab td { padding: 6px 8px; }
.flanc-tot td { font-weight: 700; border-top: 2px solid var(--border); border-bottom: none; }
.flanc-cap { color: var(--text-3); font-size: 12px; padding: 8px 2px; }
.flanc-lista table { min-width: 620px; }
.flanc-reclas { margin: 4px 0 14px; border: 1px solid var(--border); border-radius: 10px; padding: 2px 12px; background: var(--surface); }
.flanc-reclas > summary { cursor: pointer; font-weight: 600; padding: 10px 0; color: var(--text-2); }
.flanc-reclas select.campo { min-width: 170px; }
.flanc-reclas .flanc-tab { min-width: 480px; }
@media (max-width: 720px) { .flanc-grid { grid-template-columns: 1fr; } }

/* ============ NUVEM (sincronização Supabase) ============ */
.nuvem-pill {
  position: fixed; right: 18px; bottom: 62px; z-index: 1200;
  display: inline-flex; align-items: center; gap: 6px;
  font: 600 12px/1 var(--font); padding: 8px 12px; border-radius: 999px; cursor: pointer;
  border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2);
  box-shadow: var(--shadow-md); transition: transform .15s, background .15s;
}
.nuvem-pill:hover { transform: translateY(-1px); }
body.apresentacao .nuvem-pill { display: none; }  /* fora da telona/apresentação */
.nuvem-pill.sync { color: var(--info); border-color: var(--info); }
.nuvem-pill.ok   { color: var(--success); border-color: var(--success); background: var(--success-bg); }
.nuvem-pill.erro { color: var(--danger); border-color: var(--danger); background: var(--danger-bg); }

.nuvem-ov {
  position: fixed; inset: 0; z-index: 1300; padding: 20px;
  background: rgba(29,21,18,.55); backdrop-filter: blur(3px);
  display: flex; align-items: center; justify-content: center;
}
.nuvem-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg);
  box-shadow: var(--shadow-lg); width: 100%; max-width: 360px; padding: 28px 26px;
}
.nuvem-card-tit { font-size: 20px; font-weight: 700; color: var(--text); margin-bottom: 4px; }
.nuvem-card-sub { font-size: 13px; color: var(--text-2); margin-bottom: 18px; line-height: 1.45; }
.nuvem-in {
  width: 100%; padding: 11px 13px; margin-bottom: 10px; border: 1px solid var(--border-strong);
  border-radius: var(--r-sm); font: 14px var(--font); color: var(--text); background: var(--surface-2);
}
.nuvem-in:focus { outline: none; border-color: var(--brand-500); background: var(--surface); }
.nuvem-erro { color: var(--danger); font-size: 12.5px; margin: 2px 0 10px; font-weight: 600; }
.nuvem-acoes { display: flex; gap: 10px; justify-content: flex-end; margin-top: 6px; }
.nuvem-btn {
  padding: 10px 18px; border-radius: var(--r-sm); border: none; font: 600 14px var(--font);
  cursor: pointer; background: var(--brand-600); color: #fff;
}
.nuvem-btn:hover { background: var(--brand-700); }
.nuvem-btn.ghost { background: transparent; color: var(--text-2); border: 1px solid var(--border-strong); }
.nuvem-btn:disabled { opacity: .6; cursor: default; }